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

     File:        res_rsv_deel_by_placetime.asp
     Description: Alternatieve interface om (eenvoudig) een vrij reserveerbaar deel en periode voor jezelf
                  te kunnen kiezen, typisch bedoeld voor werkplekobjecten als flexplek
                  Er is een mobiel equivalent in pda/
                  Deze roept zichzelf steeds opnieuw op met steeds meer details in de parameters
                  Stel dat je alles al weet, dan zou je direct middels parameters naar de laatste stap kunnen
                  gaan, bijvoorbeeld (hypothetisch) laten zien van een verdieping met reserveerbare werkplekken


                  TODO: Overweging is om zelfs zonder parameters te kunnen en dan om activiteit te vragen
                        maar vooralsnog moeten de parameters vanaf het menu worden meegegeven
                        Als activiteit wordt gegeven dan worden de bijbehorende discipline (werkpleksoorten)
                        bepaald. Dat is de logische voorkeur. Daarbij of in plaats van kunnen alternatief
                        1 of meer res_disciplines worden meegegeven

                  De volgorde van de GUI is:
                  0. gegeven de disciplines [uit de activiteit of meegegeven]
                  1. welk gebouw (keuze uit waar dat mogelijk is)
                  2. welke datum (en dan is definitief de ene discipline bekend)
                  3. welke verdieping (optioneel)
                  4. welke werkplek
                  5. welke periode

     Parameters:  act_key:   de activiteit_key, bepaalt de res_disciplines
                  res_disc:  de res_discipline(s) van de te reserveren objecten
                             een beperking of alternatief voorde activiteit
                  geb_key:   optioneel voorgeselecteerd gebouw
                  floor_key: optioneel voorgeselecteerde verdieping

                  en verder wat sturings- en overrule-parameters zoals hieronder genoemd
     Context:     -
     Note:        Zie inrichtingsdocumentatie van FCLT#62354
                  Er zijn nog wat praktische versimpelingen die het berekenen van beschikbaarheid
                  enigszins doenijk maken. Bovendien heeft een berekening als 43,2% beschikbaar
                  weinig nut.

*/%>
<!-- #include file="../Shared/common.inc" -->
<!-- #include file="../Shared/resultset_table_v2.inc" -->
<!-- #include file="../res/res.inc" -->
<!-- #include file="../Shared/FlexFiles.inc" -->
<!-- #include file="../shared/iface.inc" -->
<!-- #include file="../res/res_rsv_deel_by_placetime.inc" -->
<%
FCLTHeader.Requires({ plugins: ["jQuery"],
                      js: ["jQuery-ui.js"]
                    });

var act_key          = getQParamInt("act_key", -1);
var res_disc_key_arr = getQParamIntArray("res_disc", []);

// Dit werkt alleen voor res_deel/werkplek-catalogi, dat checken en bepalen we maar gelijk even
var sql = "SELECT " + lcl.xsqla("rdis.ins_discipline_omschrijving", "rdis.ins_discipline_key")
        + "     , " + lcl.xsqla("a.res_activiteit_omschrijving", "a.res_activiteit_key")
        + "     , rdis.ins_discipline_key"
        + "     , ins_discipline_min_level"
        + "     , res_activiteit_master_key"
        + "     , res_activiteit_duur"
        + "     , DECODE (auth.ins_discipline_key, NULL, 0, 1)     authorized_for_disc"
        + "  FROM res_discipline rdis"
        + "     , res_activiteitdiscipline rad"
        + "     , res_disc_params rd"
        + "     , res_activiteit a"
        + "     , (SELECT ins_discipline_key"
        + "          FROM fac_v_webgebruiker w, fac_functie f"
        + "         WHERE     w.fac_functie_key = f.fac_functie_key"
        + "               AND fac_gebruiker_alg_level_write < 9"
        + "               AND fac_functie_code IN ('WEB_RESUSE', 'WEB_RESFOF')"
        + "               AND w.prs_perslid_key = " + user_key + ") auth"
        + " WHERE rdis.ins_discipline_min_level IN (1, 5) "
        + "   AND rdis.ins_discipline_key = rad.res_discipline_key"
        + "   AND a.res_activiteit_key = rad.res_activiteit_key"
        + "   AND rdis.ins_discipline_verwijder IS NULL"
        + "   AND rdis.ins_discipline_key = rd.res_ins_discipline_key"
        + "   AND (COALESCE(a.res_activiteit_intervals, rd.res_disc_params_intervals) IS NOT NULL"
        + "        OR a.res_activiteit_master_key IS NOT NULL)"
        + (act_key > 0                  ? "   AND rad.res_activiteit_key = " + act_key : "")
        + (res_disc_key_arr.length > 0  ? "   AND rdis.ins_discipline_key IN (" + res_disc_key_arr.join(",") + ")" : "")
        + "   AND rdis.ins_discipline_key = auth.ins_discipline_key(+)";
var oRs = Oracle.Execute(sql)
if (oRs.eof)
{
    Response.Write("You need to provide an appropriate value for parameters act_key or res_disc")
    Response.End;
}

// Zonder disciplines, maar ook met heeft deze query de disciplines gecheckt, we nemen de onze
res_disc_key_arr = [];
var activiteitnaam = oRs("res_activiteit_omschrijving").Value;  // die gegevens is of een willekeurige bij de catalogus
var ischild = oRs("res_activiteit_master_key").Value > 0;
var res_activiteit_duur = oRs("res_activiteit_duur").Value;
var ins_discipline_min_level;
var catalogusnaam = "??";
while (!oRs.eof)
{
    if (oRs("authorized_for_disc").Value == 1) { // Alleen als je er rechten op hebt
        res_disc_key_arr.push(oRs("ins_discipline_key").Value);
        ins_discipline_min_level = oRs("ins_discipline_min_level").Value;
        catalogusnaam = oRs("ins_discipline_omschrijving").Value;
    }
    oRs.MoveNext();
}
oRs.close();

user.auth_required_or_abort(res_disc_key_arr.length);
// Als je hier komt heb je dus in ieder geval ergens WEB_RESUSE en/of WEB_RESFOF rechten op
var xfunc = user.func_enabled2("RES", { "ins_discipline_key": res_disc_key_arr, "checkOptimistic": true });
var ALGwritelevel = 9;
for (var func in xfunc._funcodes) {
    if (func == "WEB_RESUSE" || func == "WEB_RESFOF") {
        ALGwritelevel = Math.min(ALGwritelevel, xfunc._funcodes[func].ALGwritelevel);
    }
}

var geb_key   = getQParamInt("geb_key", -1);
var floor_key = getQParamInt("floor_key", -1);
var local_tz  = S("fac_server_timezone");
if (geb_key > -1) {
    local_tz = res.getTimezoneBy(geb_key, "G");
} else if (floor_key > -1) {
    local_tz = res.getTimezoneBy(floor_key, "V");
}

var avail_flrs   = getQParamIntArray("avail_flrs", []);
var res_deel_key = getQParamInt("wsp_key", -1);
var showAll      = getQParamInt("showall", 0) == 1;

var fac_usrrap_key       = getQParamInt("usrrap_key", -1);              // wordt doorgegeven naar het infobord

var daylimit    = getQParamInt("daylimit", 12);           // na daylimit kun je voor de eerste dag niet meer reserveren, default 12:00, werkt niet icm offset
var local_now   = convertToLocalTime(new Date(), local_tz);
var afternoon   = local_now.getHours() >= daylimit;
var dateoffset  = getQParamInt("offset", afternoon ? 1 : 0);

var datelimit   = getQParamInt("limit", 7);               // aantal te kiezen dagen tov offset
var selectmode  = getQParamInt("selectmode", 0);          // kiezen van het item: 0=automatisch bepalen (tekening anders lijst), 1=lijst, 2=2dtekening indien aanwezig, 3=3dtekening indien aanwezig
var fotos       = getQParamInt("fotos", 1);               // for selectmode 1: show photo or not
var floorselect = getQParamInt("floorselect", 1);         // na gebouw ook de verdiepingen laten kiezen
var sametab     = getQParamInt("sametab", 1);             // alles in 1 tab of tabs na elkaar?
var contmode    = getQParamInt("contmode", 0);            // contouren aan 0 of uit -1

var resdate     = getQParamDate("date", null);            // de (in stap 2 gekozen) datum

var dagcapaciteit   = getQParamFloat("dagcapaciteit", 9);   // aantal uren beschikbaar per dag tbv berekening van globale vulling
// minder dan zoveel uur beschikbaar beschouwen we onbeschikbaar
var minimumbeschikbaarheid = getQParamFloat("minbes", ischild?res_activiteit_duur:1.5);

if (ischild)
{
    dagcapaciteit = 0; // als geen master gevonden
    res_activiteit_duur = 0;
}
if (resdate)
{
    dagcapaciteit = rdpt.dagcapaciteitCalc(resdate, dagcapaciteit, act_key, res_disc_key_arr, geb_key);
}

var startpage       = getQParam("startpage", "");
var onlyfree        = getQParamInt("onlyfree", 0);        // moeten bezette werkplekken wel (0) of niet (1) (onklikbaar) getoond worden in de lijst

var thema_key       = getQParamInt("thema_key", 12);      // Voor ruimtekleuren (noot: niet zeker of die niet 13 als default moet zijn)
var themaI_key      = getQParamInt("themai_key", 13);     // Voor objectkleurenen ("installaties")
var labelI_key      = getQParamInt("labeli_key", -1);     // Voor object labels als die afwijkt van ruimtelabels
var bordlabel_key   = getQParamInt("bordlabel_key", 13);  // Voor objectlabels
var label_key       = getQParamInt("label_key", -1);      // Voor afwijkende 2D labels. label_key=-1 werkt zo dat je 3D de popup borden krijgt en 2D de labels cf bordlabel_key

var zoomScale = getQParamFloat("zoomScale", -1);
var zoomDWGX  = getQParamFloat("zoomDWGX", null);
var zoomDWGY  = getQParamFloat("zoomDWGY", null);

var iconmenu_width  = Math.floor(100/S("iconcolumns"));
var iconmenu_height = Math.floor(100/S("iconcolumns")*0.6);

var link2res = getQParamInt("link2res", 1);
var deel2res = 1;  // het is een reserveerbaar deel

// ik twijfel of geb_key en floor_key hier in moeten, voor de zekerheid nu ff 2 versies dan maar
var transitParam1 = buildTransitParam(['daylimit', 'offset', 'limit', 'selectmode', 'act_key', 'res_disc', 'contmode', 'floorselect', 'date', 'link2res', 'dagcapaciteit', 'minbes', 'onlyfree', 'sametab', 'thema_key', 'label_key', 'bordlabel_key', 'themaI_key', 'labelI_key', 'fotos', 'zoomScale', 'zoomDWGX', 'zoomDWGY'],
                                      { 'res_disc': res_disc_key_arr}); // res_disc_key_arr is specifieker dan res_disc
var transitParam2 = buildTransitParam(["daylimit", "offset", "limit", "selectmode", "act_key", /*"res_disc",*/ "contmode", "floorselect", "date", "link2res", "geb_key", "floor_key", "wsp_key", "dagcapaciteit", "minbes", "onlyfree", "sametab", "thema_key", "label_key", "bordlabel_key", "themaI_key", 'labelI_key', "fotos", "zoomScale", "zoomDWGX", "zoomDWGY"]);
if (hasQParam("from_menu_key")) {
    if (floor_key > 0) {
        startpage = "wpl";
    } else if (resdate) {
        startpage = "flr";
    } else if (geb_key > 0) {
        startpage = "day";
    } else {
        startpage = "bld";
    }
}
transitParam1 += "&startpage=" + startpage;
transitParam2 += "&startpage=" + startpage;

%>
<html>
  <head>
<%  FCLTHeader.Generate(); %>
    <script>

        function res_ins_callback(json) {
            if (!json.cancel) {
                FcltMgr.reload();
            }
        }

        function reserveerinsdeel (row)
        {
            var l_ins_key = row.getAttribute("ROWKEY");
            var url = "../pda/reserveringen.asp?qrc=1&modal=1&res_deel_key=" + l_ins_key
                    + "&res_van=" + <%= resdate?resdate.getTime():0 %>
                    + "&link2res=<%= link2res %>"
                    + "&act_key=<%=act_key%>";
            FcltMgr.openModalDetail(url, "", { alwaysCallback: true, callback: res_ins_callback, width: 650 });
        }

        function continue_with_bld (p_bld_key, p_flr_key, p_disc_key, p_samewindow)
        {
            var url_param = "?geb_key="+p_bld_key+"&floor_key="+p_flr_key+"&res_disc="+p_disc_key;
            var avail_flrs = $("#avail_flrs").val();
            if (avail_flrs)
                url_param += "&avail_flrs="+avail_flrs;
            url_param += "<%=transitParam1%>";
            if (p_samewindow || <%=sametab==1?1:0%>)
                window.location.href = "../res/res_rsv_deel_by_placetime.asp" + url_param;
            else
                FcltMgr.openDetail("appl/res/res_rsv_deel_by_placetime.asp" + url_param, '<%=safe.jsstring(L("lcl_res_byplace"))%>');
        }

        function continue_with_date_bld (p_date, p_disc_key, p_flr_key)
        {
            var url_param = "?date="+(p_date?p_date.getTime():"")+"&res_disc="+p_disc_key+(p_flr_key?"&floor_key="+p_flr_key:"")+"<%=transitParam2%>";
            if (<%=sametab==1?1:0%>)
                window.location.href = "../res/res_rsv_deel_by_placetime.asp" + url_param;
            else
                FcltMgr.openDetail("appl/res/res_rsv_deel_by_placetime.asp" + url_param, '<%=safe.jsstring(L("lcl_res_byplace_select"))%>');
        }

        function continue_with_recent(p_bld_key, p_flr_key, p_wsp_key, p_samewindow)
        {
            var url_param = "?geb_key="+p_bld_key+"&floor_key="+p_flr_key+"&wsp_key="+p_wsp_key+"<%=transitParam2%>";
            if (p_samewindow || <%=sametab==1?1:0%>)
                window.location.href = "../res/res_rsv_deel_by_placetime.asp" + url_param;
            else
                FcltMgr.openDetail("appl/res/res_rsv_deel_by_placetime.asp" + url_param, '<%=safe.jsstring(L("lcl_res_byplace"))%>');
        }

        // Next part unchanged from mld_fe_menu
        // flex-box fix for Internet Explorer
        var $elem = "";
        var timeout_timer = false;
        function resizeWindow(event)
        {
            if ($elem != "")
            {
                $elem.change();
            }
        }
        function resizeIconContainer(event) {
            var $this = $(this);    // h3 accordion header
            var $container = $("div.res-menu-flex", "#" + $this.attr("aria-controls")); // div controlled by $this
            // resize the container if necessary
            function _resizeIconContainer() {
                $container.css("width", "");
                var $area = $("#" + $this.attr("aria-controls")); // area controlled by $this
                var $accordion = $("div#accordion"); // accordion div
                var paddingLeft = $area.css("padding-left"); // padding left of controlled area div
                var paddingRight = $area.css("padding-right"); // padding right of controlled area div
                $elem = $this;
                // fix only if the icon container width is wider then the accordion width
                if ($container.width() > $accordion.width())
                {
                    $container.css("width", "calc(" + $accordion.innerWidth() + "px" + " - " + paddingLeft + " - " + paddingRight + ")");
                }
                timeout_timer = false;
            }
            if (timeout_timer) { clearTimeout(timeout_timer); }
            timeout_timer = setTimeout(_resizeIconContainer, 100);
        }

        function doFilter(event)
        {
            var valThis = $autofilter.val().toLowerCase();
            if (valThis != window.lastFilter)
            {
                delayed(500, _doFilter);
            }
            function _doFilter()
            {
                var valThis = $autofilter.val().toLowerCase();
                $("div.iconmenu").each(function()
                    {
                        var gloc = $(this).data("loc").toLowerCase();
                        var gbld = $(this).data("bld").toLowerCase();
                        var found = (valThis.trim().length == 0 || gloc.indexOf(valThis) > -1
                                                                || gbld.indexOf(valThis) > -1);
                        $(this).toggle(found);
                    });
                FcltMgr.resized();
                window.lastFilter = valThis;
            }
        }

        $(function ()
        {
            // Voeg aan de header een SAYT filterveld toe.
            var $autofilterAfter = $(".fcltframeheader").find("#iframerextratitle");
            $autofilter = $("<input id='autofilter' type='text' placeholder='"+L("lcl_autofilter")+"'>");
            $autofilterAfter.after($autofilter);
            // Voeg de actie op het filterveld toe.
            $autofilter.click(function (e) { e.stopPropagation() })
                            .keyup(function (e) {
                                if (e.which == 27) {
                                    $(".floating #autofilter").val("");
                                }
                                doFilter();
                            });

            // Noot: vrijwel identieke code te vinden in bes_fe_menu.asp
            var accord = $('#accordion');
            var nnheads = accord.children("h3").length; // Voordat accordion de DOM heeft aangepast

            accord.accordion({collapsible: true,
                              active: false,
                              heightStyle: "content",
                              activate: function () { FcltMgr.resized(); }
                              });

            // flex-box fix for Internet Explorer
            $("h3[aria-controls]").on("click change", resizeIconContainer);
            $(window).on("resize", resizeWindow);

            if (nnheads == 1) // Dan direct openklappen
                accord.accordion({ active: 0 });
        });

        function go_back(p, params)
        {
            var samewindow = (<%=sametab==1?1:0%> == 1);
            switch (p)
            {
                case "bld": FcltMgr.closeDetail();
                            break;
                case "day": if (samewindow)
                                continue_with_bld(-1,-1,-1);
                            else
                                FcltMgr.closeDetail();
                            break;
                case "flr": if (samewindow)
                                continue_with_date_bld(null, params.disckey);
                            else
                                FcltMgr.closeDetail();
                            break;
                case "wpl": var datum = (params.resdate?params.resdate:null);
                            datum = (params.flrkey == -1 ? null : datum);
                            if (samewindow)
                                continue_with_date_bld(datum, params.disckey, -1);
                            else
                                FcltMgr.closeDetail();
                            break;
            }
        }
    </script>
  </head>

<body id="iconbody">
<%
    function catalogus_header(stap, params)
    {
        var k = "";
        if (params.keys)
        {
            k = "'gebkey':" + params.keys.gebkey + ","
              + "'flrkey':" + params.keys.flrkey + ","
              + "'disckey':"+ params.keys.disckey;
        }
        var titel = "";
        switch (stap)
        {
            case "bld": titel = L("lcl_beschikbaarheid_by_bld").format(safe.html(params.act));
                        break;
            case "day": titel = L("lcl_beschikbaarheid_by_day").format(safe.html(params.bld),safe.html(params.disc));
                        break;
            case "flr": titel = L("lcl_beschikbaarheid_by_flr").format(safe.html(params.disc),safe.html(params.bld),toDateString(params.resdate, { isLocal: true }).toLowerCase());
                        break;
        }
        Response.write("<h3><a>" + titel + "</a></h3/>");
        Response.write("<div style='display:none;'>");
        if (stap != startpage) { // !hasFromMenuKey
            Response.write("<span class=\"overlaying-back-button\" title=\"" + L("lcl_back") + "\" onclick=\"go_back('" + stap + "',{" +k+ "});\">" + I("fa-angle-left") + "</span>");
        }
        Response.write("<table width='100%'><tr><td><div class='res-menu-flex' id='iconcontainer'>");
    }

    var buttons =  [];

    // 1. KIES GEBOUW INDIEN NOG NIET BEKEND
    if (geb_key == -1)
    {
        IFRAMER_HEADER(startpage, [], {id: 1}); // De titel (startpage) wordt later overschreven!
        %>
        <div id='accordion'>
        <%
        var pos = 0;
        if (ins_discipline_min_level == 5) // Werkplek reserveringen
        {
            var sql = rdpt.mijn_verdiepingen_met_resdelen_hist_sql(res_disc_key_arr, ALGwritelevel);
            var oRs = Oracle.Execute(sql);
            if (!oRs.eof)
            {
                // Catalogus-header; niet noodzakelijk als het er maar eentje is, maar hoort ook dan bij de accordeon
                catalogus_header("bld", {act: oRs("ins_discipline_omschrijving").Value});
                %>
                    <div class="res-flex-recent">
                      <div class="res-flex-recent-card">
                        <div class="res-flex-recent-label">
                            <div>
                                <%=I("fa-history fa-4x")%>
                                <br><br>
                                <%=safe.html(L("lcl_res_recent"))%>
                            </div>
                        </div>
                <%
                while (!oRs.eof)
                {
                    var licon = I((oRs("ins_discipline_image").Value || "fa-circle")+ " fa-2x");
                    var gebkey = oRs("alg_gebouw_key").Value;
                    var alglocatieplaats = oRs("alg_locatie_plaats").Value;
                    var alggebouwnaam = oRs("alg_gebouw_naam").Value;
                    var deelomschrijving = oRs("res_deel_omschrijving").Value;
                    var t_fav = (alglocatieplaats?alglocatieplaats+"-" :"")
                              + alggebouwnaam + "\n"
                              + deelomschrijving;
                    %>
                        <div class="res-flex-recent-item"
                             title="<%=safe.htmlattr(oRs("alg_locatie_plaats").Value)%>"
                             data-loc='<%=safe.htmlattr(alglocatieplaats)%>'
                             data-bld='<%=safe.htmlattr(alggebouwnaam)%>'
                             onclick="continue_with_recent(<%=gebkey%>,<%=oRs("alg_verdieping_key").Value%>,<%=oRs("res_deel_key").Value%>,-1);">
                             <%=licon + safe.html(t_fav)%>
                        </div>
                    <%
                    pos++
                    oRs.MoveNext();
                }
                %>
                </div>
            </div>
                <%
            }
            oRs.Close();
        }

        var sql = rdpt.mijn_verdiepingen_met_resdelen_sql(res_disc_key_arr, -1, ALGwritelevel, dateoffset);
        var oRs = Oracle.Execute(sql)

        while (!oRs.Eof)
        {
            if (pos == 0)
            {   // Catalogus-header; niet noodzakelijk als het er maar eentje is, maar hoort ook dan bij de accordeon
                catalogus_header("bld", {act: oRs("ins_discipline_omschrijving").Value});
            }
            var gebkey = oRs("alg_gebouw_key").Value; // dan weet ik hem nog na de close
            var alglocatieplaats = oRs("alg_locatie_plaats").Value;
            var alggebouwnaam = oRs("alg_gebouw_naam").Value;
            var t_fav = (alglocatieplaats?alglocatieplaats+"-" :"")
                      + alggebouwnaam;
            %>
            <div class='iconmenu'
                 title='<%=safe.htmlattr(oRs("alg_locatie_plaats").Value)%>'
                 data-loc='<%=safe.htmlattr(alglocatieplaats)%>'
                 data-bld='<%=safe.htmlattr(alggebouwnaam)%>'
                 onclick='continue_with_bld(<%=gebkey%>,-1,-1);'>
              <div class="iconitem">
                <div class="iconimg iconbld">
                  <%=SYMBOL(oRs.Fields("alg_gebouw_image").Value, { "module": "ALGPHG", "key": gebkey, "defVal": "fa-building", "alt": L("alg_gebouw") })%>
                </div>
                <div class="res-iconlabel">
<%              var thisbuilding = oRs("alg_gebouw_naam").Value;
                Response.write(safe.html(t_fav))
                Response.write("<br>"+safe.html(oRs("aantal").Value +" "+oRs("ins_discipline_omschrijving").Value).toLowerCase())
                oRs.MoveNext();
                while (!oRs.eof && oRs("alg_gebouw_naam").Value == thisbuilding)
                {
                    Response.write("<br>"+safe.html(oRs("aantal").Value +" "+oRs("ins_discipline_omschrijving").Value).toLowerCase())
                    oRs.MoveNext();
                }
%>
                </div>
              </div>
            </div>
            <%
            pos ++;
            //oRs.MoveNext();
        }
        oRs.Close();

        if (pos > 0)
        {
            %>
                </div></td></tr></table></div>
            <%
        }

    %>
        </div>
    <%
        if (pos == 1)  // Er is maar 1 gebouw om uit te kiezen. Dat is makkelijk!
        {
            %><script>continue_with_bld(<%=gebkey%>, -1, -1, true);</script><%
        }
    } // geb_key


    // 2. KIES DATUM VOOR GEGEVEN GEBOUW/DISCIPLINE INDIEN NOG NIET BEKEND
    // Dit is een kalender per discipline, na datumkeuze is impliciet ook de discipline gekozen

    if (geb_key>0 && resdate == null)
    {
    %>
    <div id='accordion'>
    <%
    sql = "SELECT g.alg_gebouw_werkdagen, "
        + "       g.alg_gebouw_naam"
        + "  FROM alg_gebouw g "
        + " WHERE g.alg_gebouw_key = " + geb_key;
    oRs = Oracle.Execute(sql)
    var werkdagen = oRs("alg_gebouw_werkdagen").Value;
    var gebouw_naam = oRs("alg_gebouw_naam").Value;  // theoretisch kunnen dit er meerdere zijn, dan nog aanpassen
    oRs.close();

    sql = rdpt.dagbezetting_resdelen_in_aanweziggebouw_sql(res_disc_key_arr, res_deel_key, geb_key, dateoffset, datelimit, act_key);

    var oRs = Oracle.Execute(sql)
    var pos = 0;
    var prevdisc = "";
    while (!oRs.Eof)
    {
        if  (oRs("delen").Value == 0) {
            oRs.MoveNext();
            continue;
        }
        // Andere discipline = andere sectie
        if (oRs("ins_discipline_omschrijving").Value != prevdisc)
        {
            if (pos > 0)    // dan de voorgaan afsluiten
            {
                Response.write("</div></td></tr></table></div>");
            }
            // Ander icon ook wellicht
            var licon = I((oRs("ins_discipline_image").Value || "fa-circle") + " fa-2x");
            catalogus_header("day", {bld: gebouw_naam, disc: oRs("ins_discipline_omschrijving").Value});
            prevdisc = oRs("ins_discipline_omschrijving").Value
        }

        var reserveerbaredag = true;
        var aantalitems = oRs("delen").Value;
        var calc_dagcapaciteit = rdpt.dagcapaciteitCalc(new Date(oRs("datum").Value), dagcapaciteit, act_key, res_disc_key_arr, geb_key);
        if (!calc_dagcapaciteit)
        {
            __Log("No capacity on " + toDateString(oRs("datum").Value, { isLocal: true }));
            oRs.MoveNext();
            continue;
        }

        if (ischild)
        {
            // We veronderstellen (mogelijk onterecht) dat elk van de aantalitems even lang beschikbaar is op een dag
            // Als er maar één master is per dag is dat zeker logisch
            var blok_per_dag = Math.floor(calc_dagcapaciteit / res_activiteit_duur)*aantalitems;
            beschikbaarheid = blok_per_dag - oRs("gevuld").Value/res_activiteit_duur;
        }
        else
        {
            var beschikbaarheid = ((1 - (oRs("gevuld").Value/(calc_dagcapaciteit*aantalitems)))*100).toFixed(0); // 0..100
        }
        var bcls = rdpt.bezettings_class(oRs("gevuld").Value, calc_dagcapaciteit*aantalitems, minimumbeschikbaarheid*aantalitems);
        if (oRs("vrijedag").Value > 0)
        {
            bcls += " vrijedag";
            reserveerbaredag = false;
        }
        if (oRs("weekdag").Value == 1 || oRs("weekdag").Value == 7)
        {
            if (werkdagen)
            {
                bcls += " vrijweekend";
                reserveerbaredag = false;
            }
            else
            {
                bcls += " werkweekend";
            }
        }
        var clickaction = (reserveerbaredag && (!(res_deel_key > 0) || beschikbaarheid > 0) ? "onclick='continue_with_date_bld(new Date("+ new Date(oRs("datum").Value).getTime()+"), "+oRs("ins_discipline_key").Value+");'" : "");
        var noTimezoneDifferences = Session("time_zone") == S("fac_server_timezone") && local_tz == S("fac_server_timezone");
      %>
        <div class='iconmenu<%=clickaction ? "" : " no-action"%>'
              style='width:14%; height: 12vw;' <%=clickaction%>>
           <div class="iconitem">
               <div class="icondate iconimg <%=bcls%>"><%=toDateString(oRs("datum").Value, { pretty: noTimezoneDifferences, isLocal: true }) %></div>
               <div class="res-iconlabel"><%=licon%><%=aantalitems+" "+safe.html(oRs("ins_discipline_omschrijving").Value).toLowerCase()%>
                                      <br><%=L("lcl_mobile_resbeschikbaar")+" " +(ischild?(beschikbaarheid+ "/" + blok_per_dag):beschikbaarheid +"%") %>
               </div>
           </div>
        </div>
    <%
        oRs.MoveNext();
        pos ++;
    }
    oRs.Close();
    %>
          </div></td></tr></table></div>
    </div>
    <%
    } // resdate

    // 3. KIES VERDIEPING INDIEN GEWENST EN NOG NIET BEKEND
    if (resdate && floorselect == 1 && geb_key > -1 && floor_key == -1)
    {
%>
        <div id='accordion'>
<%
        var sql = rdpt.mijn_verdiepingen_met_resdelen_sql(res_disc_key_arr, geb_key, ALGwritelevel, dateoffset, resdate);
        var oRs = Oracle.Execute(sql)
        var pos = 0;
        var avail_flrs = [];

        // Nu per verdieping doorlopen
        while (!oRs.Eof)
        {
            var gebkey = oRs("alg_gebouw_key").Value; // dan weet ik hem nog na de close
            var flrkey = oRs("alg_verdieping_key").Value; // dan weet ik hem nog na de close
            var disckey = oRs("ins_discipline_key").Value; // dan weet ik hem nog na de close
            if (pos == 0)
            {   // Catalogus-header; niet noodzakelijk als het er maar eentje is, maar hoort ook dan bij de accordeon
                catalogus_header( "flr"
                                , { bld: oRs("alg_gebouw_naam").Value
                                  , disc: oRs("ins_discipline_omschrijving").Value
                                  , resdate: resdate
                                  , keys: {'gebkey': gebkey, 'flrkey': flrkey, 'disckey': disckey}
                                  });
            }
            avail_flrs.push(flrkey);
            var aantalitems = oRs("aantal").Value;
            var flr_icon = '<div class="flooravatar">'+safe.html(oRs("alg_verdieping_code").Value)+'</div>';

            var sql2 = rdpt.dagbezetting_resdelen_in_gebouw_sql(res_disc_key_arr, gebkey, flrkey, dateoffset, datelimit, resdate);
            var oRs2 = Oracle.Execute(sql2);

            var beschikbaarheid = ((1 - (oRs2("gevuld").Value/(dagcapaciteit*aantalitems)))*100); // 0..100
            var fcls = rdpt.bezettings_class(oRs2("gevuld").Value, dagcapaciteit*aantalitems, minimumbeschikbaarheid*aantalitems);

    %>
    <div class='iconmenu'
          title='<%=safe.htmlattr(oRs("alg_locatie_plaats").Value+"-"+oRs("alg_gebouw_naam").Value)%>'
          onclick='continue_with_bld(<%=oRs("alg_gebouw_key").Value%>,<%=oRs("alg_verdieping_key").Value%>,<%=oRs("ins_discipline_key").Value%>);'>
       <div class="iconitem">
           <div class="iconimg iconbld <%=fcls%>"><%=flr_icon%></div>
           <div class="res-iconlabel" ><%=safe.html(oRs("alg_verdieping_omschrijving").Value) +"<br>"+safe.html(oRs("aantal").Value +" "+oRs("ins_discipline_omschrijving").Value).toLowerCase() %><br><%=L("lcl_mobile_resbeschikbaar")+" "+safe.html(beschikbaarheid.toFixed(0) +"%") %></div>
       </div>
    </div>
    <%
            oRs2.Close();
            pos ++;
            oRs.MoveNext();
            if (oRs.Eof)
            {
    %>
      <input type="hidden" id="avail_flrs" value="<%=avail_flrs%>">
      </div></td></tr></table></div>
    <%
            }
        }
        oRs.Close();
    %>
        </div>
    <%
        if (pos == 1)  // Er is maar 1 verdieping om uit te kiezen. Dat is makkelijk!
        {
            %><script>continue_with_bld(<%=gebkey%>, <%=flrkey%>,<%=disckey%>, true);</script><%
        }
    } // floor_key


    // 4. ALS JE HIER BENT, WEET JE EEN GEBOUW, DESGEWENST ZELFS EEN VERDIEPING, EN EEN DATUM(B)
    // Dan willen we verder tot een res_deel_key en concrete van/tot-tijden
    if (resdate && geb_key > 0 && (floorselect == 0 || (floorselect == 1 && floor_key > -1)))
    {
        if (res_deel_key > -1)
        {   // Is er al een werkplek bekend? Kijk dan of deze voor vandaag vrij is.
            var is_beschikbaar = 2;
            var sql = "SELECT totaal"
                    + "     , CASE WHEN totaal = 0 THEN 2" // geheel beschikbaar
                    + "            WHEN " + dagcapaciteit + " - totaal < " + minimumbeschikbaarheid + " THEN 0" // niet meer beschikbaar
                    + "            ELSE 1" // gedeeltelijk beschikbaar
                    + "        END beschikbaarheid"
                    + "  FROM ("
                            +  "SELECT SUM(r.res_rsv_deel_tot - r.res_rsv_deel_van)*24 totaal"
                            +  "  FROM res_rsv_deel r"
                            +  "     , res_deel     d"
                            +  " WHERE d.res_deel_key = r.res_deel_key"
                            +  "   AND d.res_deel_verwijder IS NULL"
                            +  "   AND (  d.res_deel_vervaldatum IS NULL"
                            +  "       OR d.res_deel_vervaldatum < " + resdate.toSQL()
                            +  "       )"
                            +  "   AND r.res_rsv_deel_verwijder IS NULL"
                            +  "   AND TRUNC(r.res_rsv_deel_van) = " + resdate.toSQL()
                            +  "   AND r.res_deel_key = " + res_deel_key
                    + "       )"
            var oRs = Oracle.Execute(sql);
            is_beschikbaar = oRs("beschikbaarheid").Value;
            oRs.Close();
            if (is_beschikbaar > 0)
            {   // Werkplek is voor deze datum nog niet gereserveerd.
                // Gelijk de popup om te reserveren.
                %>
                <script>
                    function res_flex_callback(json)
                    {
                        if (json.cancel)
                            location.href = location.href.replace(/date=\d+\&?/, ""); // Terug naar datum selectie
                        else
                            FcltMgr.reload();
                    }
                    $(function() {
                            var url = "../pda/reserveringen.asp?qrc=1&modal=1"
                                    + "&res_deel_key=<%=res_deel_key%>&res_van=<%=(resdate?resdate.getTime():0)%>"
                                    + "&link2res=<%=link2res%>"
                                    + "&act_key=<%=act_key%>";
                            FcltMgr.openModalDetail(url, "", { alwaysCallback: true, callback: res_flex_callback, width: 650 });
                        });
                </script>
                <%
            }
        }
        else
        {
            if (selectmode != 1)
            {
                // als er een plattegrond bestaat van de verdiepingen van het gebouw, dan verder naar plattegrond
                var sql = "SELECT COUNT (*) tekeningen"
                        + "  FROM cad_tekening t, alg_v_aanwezigverdieping v "
                        + " WHERE     t.alg_verdieping_key = v.alg_verdieping_key "
                        + "       AND cad_tekening_verwijder IS NULL "
                        + (floor_key > -1
                            ? " AND v.alg_verdieping_key = " + floor_key
                            : " AND v.alg_gebouw_key = " + geb_key
                          );
                var oRs = Oracle.Execute(sql)
                var aantaltekeningen = oRs("tekeningen").Value;
                oRs.Close();
            }

            if (selectmode != 1 && aantaltekeningen > 0)
            {
                // Er zijn tekeningen en er wordt niet naar een lijst geforceerd

                // hier de (2D/3D) plattegrond openen met de juiste parameters
                // Merk op dat daar ins_discpline(s) moeten worden gebruikt ipv de hier bekende res_discpline..
                sql = "SELECT DISTINCT (id.ins_discipline_key) ins_discipline_key"
                    + "  FROM res_v_aanwezigdeel rd, ins_v_aanwezigdeel id "
                    + " WHERE rd.res_ins_deel_key = id.ins_deel_key AND rd.res_discipline_key IN (" + res_disc_key_arr.join(",") + ")";
                oRs = Oracle.Execute(sql)
                var ins_disc_key = oRs("ins_discipline_key").Value; // VERONDERSTELT 1-op-1, we pakken iig de eerste ins_discipline
                oRs.Close();

                // Wanneer er een disc_key wordt meegegeven worden alleen de juiste verdiepingen getoond. Echter zijn er dan ook nog impliciete
                // afhankelijkheden die we daar moeten aanpassen denk ik. Het thema moet dan bv een objectthema zijn, daar moet nog wat verbeterd worden.
                // Wat moeten we hier dan nog doen?

                // LET OP: hieronder moeten de views achter themaI en labelI een kolom FCLT_F_DATUM bevatten!
                %>
                <script>
                     window.location.href = "../cad/infobord.asp?discs=<%=ins_disc_key%>&geb_key=<%=geb_key%>&floor_key=<%=floor_key%>&avail_flrs=<%=avail_flrs%>"
                                          + "&bordlabel_key=<%=bordlabel_key%>&themaI=<%=themaI_key%>&labelI=<%=labelI_key%>&thema_key=<%=thema_key%>&label_key=<%=label_key%>"
                                          + "&datumfilter=<%=resdate.getTime()%>&contmode=<%=contmode%>"
                                          + "&link2res=<%=link2res%>"
                                          + "&deel2res=<%=deel2res%>"
                                          + "&restrict2res_disc=<%=res_disc_key_arr.join(",")%>"
                                          + "&zoomScale=<%=zoomScale%>&zoomDWGX=<%=zoomDWGX%>&zoomDWGY=<%=zoomDWGY%>"
                                          + "&fac_usrrap_key=<%=fac_usrrap_key%>"
                                          + "<%=(selectmode != 0 ? '&showmode='+selectmode : "")%>";
                </script>
                <%
            }
            else
            {
                // Er zijn geen tekeningen of er wordt naar een lijst geforceerd

                sql = "SELECT alg_gebouw_naam"
                    + "  FROM alg_v_aanweziggebouw"
                    + " WHERE alg_gebouw_key = " + geb_key;
                oRs = Oracle.Execute(sql)
                var gebouw_naam = oRs("alg_gebouw_naam").Value;
                oRs.Close();

                var bloktijden = [];
                if (act_key > 0)
                {
                    bloktijden = res.getBloktijdenAct(act_key, resdate, geb_key);
                }
                if (!bloktijden.length)
                {
                    // Neem bij meerdere disciplines alleen de eerste: De bloktijden zouden hetzelfde moeten zijn. Mergen van twee disciplines is niet mogelijk.
                    bloktijden = res.getBloktijdenDisc(res_disc_key_arr[0], resdate, geb_key);
                }

                function fnIntervallen(oRs)
                {
                    var res = rdpt.getIntervalString(oRs("res_deel_key").Value, resdate, bloktijden, geb_key);
                    if (res =="") res = L("lcl_res_intervalbezet");
                    return res;
                }

                function fnResDeelPhoto(oRs)
                {
                    return SYMBOL(oRs("res_deel_image").Value, { "module": "RESPHD", "defVal": "fa-th-list fa-2x" });
                }

                function fnResDeelIcon(oRs)
                {
                    // een gekleurde indicatie
                    var lcls = rdpt.bezettings_class(oRs("bezet").Value, dagcapaciteit, minimumbeschikbaarheid);
                    var licon = I((oRs("ins_discipline_image").Value || "fa-circle") + " fa-2x");
                    return ('<span class="{0}">' + licon + '</span>').format(lcls, licon);
                }

                function fnrowClass(oRs)
                {
                    // Ik wil een kleur naar gelang het aantal nog beschikbare intervallen. Dat bepalen we indirect in fnIntervallen()
                    // dat is al per regel, en dat wil ik hier niet nogmaals doen. Vooralsnog een benadering obv tijd, wat wel
                    // als voordeel heeft dat ook bezetting buiten de intervallen mee telt. Wat goed of fout kan zijn.
                    // Gedachte is een globaal array te maken met voor elke plek het aantal intervallen, dat alleen wordt berekend
                    // als dat nog niet eerder gebeurde.
                    return rdpt.bezettings_class(oRs("bezet").Value, dagcapaciteit, minimumbeschikbaarheid);
                }

                sql = rdpt.res_deel_bezetting_op_dag_sql(res_disc_key_arr, geb_key, floor_key, resdate, (onlyfree ? dagcapaciteit - minimumbeschikbaarheid : null));

                buttons.push({ icon: "fa-arrow-left"
                             , title: L("lcl_back")
                             , action: "go_back('wpl', {'resdate': new Date("+resdate.getTime()+"),'disckey':"+res_disc_key_arr[0]+",'flrkey':-1})"
                             });

                var rst = new ResultsetTable({ keyColumn: "res_deel_key",
                                               ID: "resdltable",
                                               sql: sql,
                                               title: L("lcl_resdeel_beschikbaar_op").format(gebouw_naam, toDateString(resdate, { isLocal: true })),
                                               buttons: buttons,
                                               emptySetString: L("lcl_res_niets_beschikbaar"),
                                               showAll: showAll,
                                               noExcel: true
                                           });
                if (fotos)
                    rst.addColumn(new Column({caption: "", content: fnResDeelPhoto, colName: "fnResDeelPhoto", classList: "placephoto"}));
                rst.addColumn(new Column({caption: L("lcl_floor"), content: "alg_verdieping_omschrijving", nowrap: true}));
                rst.addColumn(new Column({caption: L("lcl_room"), content: "plaats", nowrap: true}));
                rst.addColumn(new Column({caption: L("lcl_estate_ruimte_man_descr"), content: "alg_ruimte_omschrijving", nowrap: true}));
                rst.addColumn(new Column({caption: catalogusnaam, content: "res_deel_omschrijving", nowrap: true}));
                rst.addColumn(new Column({caption: "", content: fnResDeelIcon, colName: "fnResDeelIcon", classList: "placeicon", align: "center", tooltip: "ins_discipline_omschrijving" }));
                rst.addColumn(new Column({caption: L("lcl_res_interval_opties"), content: fnIntervallen, nowrap: true}));
                // debug: rst.addColumn(new Column({caption: L("lcl_res_dagbezetting"), content: "bezet", datatype: "currency", total: true}));
                rst.addAction({ action: "reserveerinsdeel", caption: "", isDefault: true });
                var cnt = rst.processResultset();

            }
        }
    }
%>
</body>
</html>
    <script>
        $(function ()
            {   // Naam van de header hier aanpassen. Anders wordt deze overschreven door de IFRAMER zelf.
                var tabtitle = FcltMgr.getTitle();
                FcltMgr.setFrameTitle(tabtitle, {id:1});
            });
    </script>
<% ASPPAGE_END(); %>
