<!--

    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:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
    <div layout:fragment="global">
        <th:block th:each="announcement : ${@announcementRepository.findActiveAnnouncements()}">
            <div
                class="banner mb-3"
                role="alert"
                th:data-announcement-id="|alert-${announcement.id}|"
                th:style="|--color: #${announcement.hexBackgroundColour()};|">
                <p th:style="|color: #${announcement.hexTextColour()};|" th:text="${announcement.message}"></p>
                <button
                    th:if="${announcement.isDismissible}"
                    class="fa-solid fa-times"
                    style="margin-left: auto; background: none; border: none; cursor: pointer"></button>
            </div>
        </th:block>

        <script type="application/javascript">
            // Initialize the dismissed announcements cookie when it does not yet exist
            if (typeof $.cookie("dismissed-announcements") === "undefined") {
                $.cookie("dismissed-announcements", "[]", { path: "/" });
            }

            // For every alert, check whether it is dismissed. If an alert is not dismissed, show it
            $(() => {
                const dismissedAnnouncements = JSON.parse($.cookie("dismissed-announcements"));
                $(".banner").each(function () {
                    const id = $(this).data("announcement-id");
                    if (dismissedAnnouncements.includes(id)) {
                        $(this).addClass("hidden");
                    }
                });
            });

            // Register an event listener that adds a dismissed announcement to the dedicated cookie
            $(".banner button").on("click", function () {
                const banner = $(this).closest(".banner");
                const id = banner.data("announcement-id");

                const dismissedAnnouncements = JSON.parse($.cookie("dismissed-announcements"));
                dismissedAnnouncements.push(id);

                $.cookie("dismissed-announcements", JSON.stringify(dismissedAnnouncements), {
                    path: "/",
                });

                banner.remove();
            });
        </script>
    </div>
</html>
