<!--

    Queue - A Queueing system that can be used to handle labs in higher education
    Copyright (C) 2016-2024  Delft University of Technology

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU Affero General Public License as
    published by the Free Software Foundation, either version 3 of the
    License, or (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU Affero General Public License for more details.

    You should have received a copy of the GNU Affero General Public License
    along with this program.  If not, see <https://www.gnu.org/licenses/>.

-->
<!DOCTYPE html>
<html lang="en" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{edition/view}">
    <head>
        <title>Importing sessions from MyTimetable</title>
        <link rel="stylesheet" href="/css/dropdown.css" />
    </head>
    <body>
        <main layout:fragment="subcontent">
            <ul class="surface divided list" role="list">
                <li th:each="dto, i : ${imports}" class="pbl-3">
                    <form method="get" class="flex space-between" th:action="@{/edition/{id}/lab/import/create(id=${edition.id})}">
                        <input type="text" hidden="true" th:value="${dto.name}" th:name="name" th:id="name" />
                        <input hidden="true" th:value="${dto.getStart()}" th:name="start" th:id="start" />
                        <input hidden="true" th:value="${dto.getEndTime()}" th:name="end" th:end="end" />
                        <select hidden multiple th:name="roomIds" th:id="roomIds">
                            <option th:each="room : ${dto.rooms}" th:value="${room.id}" th:selected="true"></option>
                        </select>
                        <div class="flex gap-3 align-center">
                            <p
                                th:text="|${dto.name} : ${#temporals.format(dto.start, 'dd/MM/YYYY HH:mm')} - ${#temporals.format(dto.endTime, 'dd/MM/YYYY HH:mm')}|"></p>
                        </div>
                        <div class="flex gap-3">
                            <button type="button" class="button" th:data-dialog="|create-session-modal-${i.index}|">Import session</button>
                        </div>
                        <dialog th:id="|create-session-modal-${i.index}|" class="dialog">
                            <div class="flex vertical p-7">
                                <h3 class="underlined font-500">Create session</h3>
                                <div class="grid col-2 align-center">
                                    <label th:for="sessionType">Session type</label>
                                    <select class="textfield" th:id="sessionType" th:name="sessionType">
                                        <option
                                            th:each="lType : ${T(nl.tudelft.queue.model.enums.QueueSessionType).values()}"
                                            th:unless="${lType.name() == 'EXAM'}"
                                            th:value="${lType.name()}"
                                            th:text="${lType.displayName}"></option>
                                    </select>
                                </div>
                                <div class="flex space-between">
                                    <button type="button" data-cancel class="button p-less" data-style="outlined">Cancel</button>
                                    <button type="submit" class="button p-less">Create</button>
                                </div>
                            </div>
                        </dialog>
                        <!--                    <input name="dto" th:value="${dto}" hidden>-->
                    </form>
                </li>
            </ul>
        </main>
    </body>
</html>
