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

     File:        bes_fe_menu.asp
     Description: Alternatieve interface om (eenvoudig) een bestelartikel te kunnen kiezen
                  Veronderstelt wel dat er niet al te schrikbarend veel artikelen zijn.
     Parameters:

     Context:     -
     Note:        TODO: als er maar weinig groepen zijn: allemaal uitklappen, als er weinig artikelen zijn: combineren oid

*/%>
<!-- #include file="../Shared/common.inc" -->
<!-- #include file="../shared/iface.inc" -->
<!-- #include file="../Shared/FlexFiles.inc" -->
<%

FCLTHeader.Requires({ plugins: ["jQuery"],
                      js: ["jQuery-ui.js"]
                    });

var urole = "fe";
var disc_key = getQParamInt("disc", -1);
var adres_key = getQParamInt("adres_key", -1);
%>

<html>
  <head>
<%  FCLTHeader.Generate(); %>
    <script type="text/javascript">

        function run_create_bes(p_disc_key, p_product_key)
        {
            var url = "appl/bes/bes_bestelling.asp?urole=<%=urole%>&artikel_key="+p_product_key+"&dis_key="+p_disc_key;
<%          if (adres_key > 0)
            { %>
            url += "&adres_key=<%=adres_key%>";
<%          } %>
            FcltMgr.openDetail(url);
	    }

        var lastIconMenu = null;
        function showIconMenu(key) {
            if (lastIconMenu !== key) {
                $(".seperator").hide();
                if ($(".col").children().find("div:visible").length > 0) {
                    $("div[class*='icmenu']").hide();
                    $(".icmenu"+key).fadeIn(150);
                } else {
                    if ($(".icmenu"+key).is(":visible")) {
                        $("div[class*='icmenu']").hide();
                    } else {
                        $(".icmenu"+key).fadeIn(150);
                    }
                }
                $(".seperator").each(function() {
                    if ($(this).attr("data-menuid") == key) {
                        $(this).show();
                    }
                });
            }
            lastIconMenu = key;
            $(".icmenu"+key).first().focus();
        }

        // Deze functie escaped all characters die in een regex ge-escaped moeten worden
        function escapeRegExp(s) {
            return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
        }

        $(function ()
        {
            FcltMgr.setTitle(L("lcl_menu_bes_fe_3"));

            // show items by default when there is only one header
            if ($("div.bes-menu-button").length == 1) {
                showIconMenu(1);
            }

            // Zoekfilter
            $("#iframerextratitle").after("<input id='autofilter' type='text' placeholder='" + safe.htmlattr(L("lcl_autofilter")) + "'>");
            $("#autofilter").on("keyup", function(e)
            {
                $(".seperator, .besicmenu").hide();
                lastIconMenu = null;

                // De highlight van oude zoekresultaten afhalen
                $("span.highlight-text").contents().unwrap();

                // Escape leegt het filter
                if (e.keyCode == 27) {
                    $(this).val("");
                    return;
                }

                var searchStr = $(this).val();
                if (searchStr != "")
                {
                    var regex = new RegExp("("+escapeRegExp(searchStr)+")", "gi");
                    $(".besicmenu").each(function()
                    {
                        var anyFound = false;
                        $(this).find(".bes-iconlabel").find("*").filter(function () { return $(this).css("display") != "none"; }).each(function() {
                            var findStr = $(this).text();
                            if (findStr.toLowerCase().indexOf(searchStr.toLowerCase()) !== -1)
                            {
                                anyFound = true;

                                // Highlight de zoekterm, encode (FcltJuery.js) de resulterende string en vervangt de html()
                                $(this).html(function() {
                                    var split_arr = findStr.split(regex);
                                    var new_html = "";
                                    for (var i = 0; i < split_arr.length; i++)
                                        new_html += (i % 2 == 0 ? "{0}" : "<span class='highlight-text'>{0}</span>").format(safe.html(split_arr[i]));
                                    return new_html.replace(/\n/g, "\n<br>");
                                });
                            }
                        });
                        if (anyFound)
                        {
                            $(this).show(); // Show me
                            var menuid = $(this).attr("data-menuid");
                            $(".seperator[data-menuid="+menuid+"]").show(); // Show my header
                        }
                    });
                }
            }).focus();
        });

    </script>
  </head>

<body class="menumode">
<%  PAGE_START();
    IFRAMER_HEADER(L("lcl_bes_fe_menu_frame"));

var sql = "SELECT bes_srtdeel_key product_key, "
        +         lcl.xsql('sd.bes_srtdeel_omschrijving', 'sd.bes_srtdeel_key')+" product,"
        + "       'besartikel' soort, 3 rang, bes.getsrtdeelprijs(sd.bes_srtdeel_key, null) prijs,"
        +         lcl.xsql('sd.bes_srtdeel_eenheid', 'sd.bes_srtdeel_key') + " eenheid,"
        + "       p.prs_bedrijf_naam extra,"
        + "       sg.ins_discipline_key disc_key, "
        + "       null vakgroeptype,"
        + "       sg.bes_srtgroep_key,"
        +         lcl.xsql('sg.bes_srtgroep_omschrijving', 'sg.bes_srtgroep_key') + " groep,"
        +         lcl.xsql('d.ins_discipline_omschrijving', 'd.ins_discipline_key') + " vakgroep,"
        +         lcl.xsql('sd.bes_srtdeel_opmerking', 'sd.bes_srtdeel_key')+ " opmerking,"
        + "       NVL2(sd.bes_srtdeel_image, p.prs_bedrijf_image_loc || sd.bes_srtdeel_image, NULL) foto"
        + "  FROM bes_v_aanwezigsrtdeel sd"
        + ",      bes_srtgroep sg"
        + ",      bes_v_aanwezigdiscipline d"
        + ",      prs_bedrijf p"
        + ",      fac_v_webgebruiker fvw"
        + ",      fac_functie f"
        + " WHERE sd.bes_srtgroep_key = sg.bes_srtgroep_key"
        + "   AND sg.ins_discipline_key = d.ins_discipline_key"
        + "   AND (sd.bes_srtdeel_vervaldatum IS NULL OR sd.bes_srtdeel_vervaldatum > SYSDATE)"
        + "   AND sd.prs_bedrijf_key IS NOT NULL"  // best overbodig want dit is een inner join
        + "   AND p.prs_bedrijf_verwijder IS NULL"   // want ook die geven later een error en kunnen niet besteld worden
        + "   AND sd.prs_bedrijf_key = p.prs_bedrijf_key"
        + "   AND fvw.ins_discipline_key = d.ins_discipline_key"
        + "   AND fvw.fac_functie_key = f.fac_functie_key"
        + "   AND fvw.fac_gebruiker_alg_level_write < 9"
        + "   AND fvw.fac_gebruiker_prs_level_write < 9"
        + "   AND f.fac_functie_code = 'WEB_BESUSE'"
        + "   AND fvw.prs_perslid_key = " + user_key;

if (disc_key > 0) {
      sql += " AND d.ins_discipline_key = " + disc_key;
}

sql += " ORDER BY sg.bes_srtgroep_volgnr"
     + "        , " + lcl.xsql('sg.bes_srtgroep_omschrijving', 'sg.bes_srtgroep_key')
     + "        , sg.bes_srtgroep_key"
     + "        , sd.bes_srtdeel_volgnr"
     + "        , " + lcl.xsql('sd.bes_srtdeel_omschrijving', 'sd.bes_srtdeel_key')
     + "        , sd.bes_srtdeel_key";

var oRs = Oracle.Execute(sql)
var last_srtgroep = "";
var isFA = false;
var menuid = 0;
var main_menu_html = "";
var sub_menu_html = "";
while (!oRs.Eof)
{
    if (last_srtgroep != oRs("groep").Value)
    {   // Vakgroep header. Is denkbaar dat we hier het aantal items tonen?
        menuid++;
        main_menu_html += '<div onclick="showIconMenu(' + menuid + ')" tabindex="0" onkeypress="this.click()" class="bes-menu-button"><h3><a>' + I("fa-chevron-right" + (S("fac_betafeatures") & 2 ? " fa-2x" : "")) + '&nbsp;' + safe.html(    oRs("groep").Value) + '</a></h3></div>';
        sub_menu_html += '<div class="seperator" style="display: none;" data-menuid="' + menuid + '"><span>' + safe.html(oRs("groep").Value) + '</span></div>';
    }
    sub_menu_html += '<div style="display: none;" tabindex="0" onkeypress="this.click()" class="col-6 col-lg-4 col-xl-3 col-xxl-2 besicmenu icmenu' + menuid + '" data-menuid="' + menuid + '" onclick="run_create_bes(' + safe.html(oRs("disc_key").Value) + ',' + safe.html(oRs("product_key").Value) +');">'
                   + '  <div class="iconitem">'
                   + '    <div class="bes-icon-wrapper">'
                   +        SYMBOL(oRs("foto").Value, { "module": "BESPH", "key": oRs("product_key").Value, "defVal": "fa-question" })
                   + '    </div>'
                   + '    <div class="bes-iconlabel">'
                   + (disc_key == -1 ? '<span class="iprdvg">'+safe.html(oRs("vakgroep").value) + '</span>' : '')
                   + '      <span class="iprd">'+safe.html(oRs("product").value) + '</span>'
                   +        (oRs("prijs").value ? ('<span class="iprs">' + S("currency_pref") + safe.curr(oRs("prijs").value) + '</span>') : '')
                   +        (oRs("eenheid").value ? ('<span class="ieenh"> / ' + safe.html(oRs("eenheid").value) + '</span>') : '')
                   +        (oRs("opmerking").value ? ('<div class="iopm" title="' + safe.htmlattr(oRs("opmerking").value) + '">' + safe.html(oRs("opmerking").value) + '</div>') : '')
                   + '    </div>'
                   + '  </div>'
                   + '</div>';
    last_srtgroep = oRs("groep").Value;
    oRs.MoveNext();
}
oRs.Close();
%>
<div class="col-xxl-3 col-xl-4 col-6 nopadding bes-menu-col<%=(S("fac_betafeatures") & 2 ? " beta" : "")%>"><%
Response.Write(main_menu_html);
%>
</div>
<div class="col bes-menu-col<%=(S("fac_betafeatures") & 2 ? " beta" : "")%>">
    <div class="row"><%
Response.Write(sub_menu_html);
%>  </div>
</div>
<% PAGE_END(); %>
</body>
</html>
<% ASPPAGE_END(); %>
