@(config:io.circe.Json, sections: List[Section], addSectionForm: Form[Section], desks: List[Desk], addDeskForm: Form[Desk], selectedDeskOption: Option[Desk])(implicit messagesProvider: MessagesProvider, request: RequestHeader)

@import helper._

@admin.adminLayout("desksAndSections",config) {

<div class="row">

    <div class="col-md-6">
        <h1>Current Desks</h1>
        <ul class="list-unstyled list-group" >

        @for(desk <- desks) {
            <li class="list-group-item @if(desk.selected){list-group-item-info}">
                <a href="@{routes.Admin.desksAndSections(Some(desk.id))}">@{desk.name}</a>
            </li>
        }
        </ul>

        <div class="form">
            <h3>Add a new desk</h3>
            @form(action=routes.Admin.addDesk){
                @CSRF.formField
                @inputText(addDeskForm("name"))
                <input type="hidden" name="id" value="0">
                <input type="hidden" name="selected" value="false">
                <input type="submit" value="Add">
            }
        </div>

    </div>

    <div class="col-md-6">
        <h1>Available Sections</h1>

        @selectedDeskOption match {
            case Some(selectedDesk) => {
                @form(action=routes.Admin.assignSectionToDesk){
                    @CSRF.formField
                    <input type="hidden" name="desk" value="@selectedDesk.id"/>

                    <ul class="list-unstyled list-group">
                    @for((section, index) <- sections.zipWithIndex) {
                        <li class="list-group-item @if(section.selected){list-group-item-info}">
                            @{section.name}
                            <input type="checkbox" name="sections[@index]" value="@{section.id}" @if(section.selected){checked="checked"}>
                        </li>
                    }
                    </ul>

                    <input type="submit" value="Assign to Desk '@selectedDesk.name'"/>
                }
            }

            case None => {
                <div class="alert alert-info">Please select a desk to view matching sections</div>

                <ul class="list-unstyled list-group">
                @for((section, index) <- sections.zipWithIndex) {
                    <li class="list-group-item @if(section.selected){list-group-item-info}">
                        @{section.name}
                        <input type="checkbox" name="sections[@index]" value="@{section.id}" @if(section.selected){checked="checked"}>
                    </li>
                }
                </ul>
            }
        }

        <div class="form">
            <h3>Add a new section</h3>
            @form(action=routes.Admin.addSection){
                @CSRF.formField
                @inputText(addSectionForm("name"))
                <input type="hidden" name="id" value="0">
                <input type="hidden" name="selected" value="false">
                <input type="submit" value="Add">
            }
        </div>

    </div>

</div>

}