<%@ language = "JavaScript" %>
<% /*
     $Revision$
     $Id$

     File:          default.asp
     Description:   Test-pagina om in Exchange te kunnen kijken

     Parameters:
     Status:
     Context:
     Notes:
*/
    THIS_FILE = "../api/default.asp";
%>
<!-- #include file="../../Shared/common.inc" -->
<!-- #include file="../../Shared/iface.inc" -->
<!-- #include file="../../Shared/calendar.inc" -->
<%

FCLTHeader.Requires({
    plugins: ["jQuery"]
});

user.checkAutorisation("WEB_FACTAB");
%>

<html>
  <head>
<%  FCLTHeader.Generate(); %>
    <style>
        html, body {
            height: 100%;
            margin: 0;
            padding: 0;
        }
        body, #result {
            display: grid;
            grid-template-rows: auto 1fr;
            font-size: 13px;
        }

        .captions, .content {
            display: flex;
            flex-wrap: wrap;
        }

        .attention-bar {
            flex-basis: 100%;
            font-size: 1.25em;
            font-weight: bold;
            text-align: center;
        }
        .inform {
            background-color: orange;
            color: white;
        }

        .captions > span {
            height: 2em;
            flex-basis: 50%;
            text-align: center;
        }
        textarea {
            overflow: auto;
            white-space: pre;
            padding: .5em;
            flex-basis: 50%;
        }

    </style>
    <script>
        function doSubmit() {
            $.post(
                "get_exchange_info.asp",
                $("[name=exchange]").serialize(),
                FcltCallbackAndThenAlways(exc_submit_callback),
                "json"
            );
        }

        function exc_submit_callback(json) {
            $(".host, .room").val("");
            $(".attention-bar").remove();
            if (json.success) {
                if (json.info?.length) { // Als json.success === false, dan wordt de json.info al in een popup weergegeven
                    for (var i = 0; i < json.info.length; i++) {
                        $(".captions > .host").before("<div class='attention-bar inform'>" + I("fa-circle-info fa-lg") + " " + safe.html(json.info) + "</div>");
                    }
                }
                $(".host").val(json.host ? JSON.stringify(json.host, null, 4) : "N/A");
                $(".room").val(json.room ? JSON.stringify(json.room, null, 4) : "N/A");
            }
        }
    </script>
  </head>
  <body id="searchbody">
    <form name="exchange" onsubmit="doSubmit(); return false;">
<%  SEARCH_PAGE_START({ header: L("lcl_filterblok") });

        SEARCH_BLOCK_START();

            RWFIELDTR("reservering", null, L("lcl_res_number"));
            RWCHECKBOXTR("compact", null, "Compact", true);

        SEARCH_BLOCK_END();

        SEARCH_BLOCK_START();

            RWFIELDTR("userPrincipalName", null, "Eigenaar van de Exchange agenda", null, { "placeholder": "prs_perslid_email of res_ruimte_extern_id" });

            FCLTcalendar("date_from", {
                label: L("lcl_period_from"),
                initEmpty: true,
                volgnr: 1
            });

            FCLTcalendar("date_to", {
                label: L("lcl_period_to"),
                initEmpty: true,
                volgnr: 2
            });

        SEARCH_BLOCK_END();

        var buttons = [{ title: L("lcl_search"), action: "doSubmit()", importance: 1, icon: "fa-search" }];
        SIMPLE_BLOCK_START();
            CreateButtons(buttons, { "entersubmit": true });
        SIMPLE_BLOCK_END();

    SEARCH_PAGE_END();
    IFACE.FORM_END();
%>  </form>
    <div id="result">
        <div class="captions">
            <span class="host">Hieronder het Exchange event uit de agenda van de <i>Gastheer</i></span>
            <span class="room">Hieronder het Exchange event uit de agenda van de <i>Ruimte</i></span>
        </div>
        <div class="content">
            <textarea class="host"></textarea>
            <textarea class="room"></textarea>
        </div>
    </div>
  </body>
</html>
<%
ASPPAGE_END();
%>
