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

    File:               mld_object.asp
    Description:        (Modal)dialoog om objecten aan melding te kunnen koppelen
    Globalen:
        mld_key         Nodig?
    Context:
    Note:               Moet nodig eens herontworpen worden
*/
%>

<!-- #include file="../Shared/common.inc" -->
<!-- #include file="../Shared/selector.inc" -->
<!-- #include file="../Shared/iface.inc" -->
<!-- #include file="./mld.inc" -->
<!-- #include file="../Shared/get_objecten_sql.inc" -->

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

var mld_key = getQParamInt("mld_key");
// Selects all objects that are present in a given room and/or owned by a given person
// Since FSN#150, this is not restricted by any Objects authorizations.
var alg_key = getQParamInt("alg_key", -1);
var alg_niveau = getQParam("alg_niveau", -1);
var prs_key = getQParamInt("person", -1);
var stdmld_key = getQParamInt("stdm_key");
var inst_key = "";
var inst_type = "";

var sql = "SELECT mld_stdmelding_objects_allowed"
        + "  FROM mld_stdmelding"
        + " WHERE mld_stdmelding_key = " + stdmld_key;
var oRs = Oracle.Execute(sql);
var objects_allowed = oRs("mld_stdmelding_objects_allowed").Value;
oRs.Close();
%>

<html>
  <head>
<%  FCLTHeader.Generate() %>
    <script>
      var objects_allowed = 2;
      var objects_count = 0;
      $(function ()
      {
        var params = FcltMgr.dialogArguments();
        $("#fldobjExist").html(params.obj_html); // De options (html) komen tussen <SELECT id="fldobjExist" ...> en </SELECT>
        FcltMgr.resized();

        $("#fldobjExist").on("change", show_info);
        $("#fldobjExist").on("focus", show_info);  // voor als je weer dezelfde in de lijst kiest!
        $("#fldobjPossible").on("change", show_info);
        $("#fldobjPossible").on("focus", show_info);
        $("#fldcompPossible").on("change", show_info);
        $("#fldcompPossible").on("focus", show_info);

        $("#fldobjPossible").on("click", deselectComp); // Deselecteer alle onderdelen als er op een object wordt geklikt.

        show_info(null, true);
        $("#fldobjPossible").filterByText("#autofilter", true);
        $("#fldobjExist").filterByText("#autofilterExist", true);
        $("#autofilter").focus();

        objects_allowed = params.objects_allowed;
        objects_count = $("#fldobjExist")[0].length;

        //addTooltip(); // Wegens performance hier niet.
      });

      function delayed(delay, fn)
      {
          if (window.timerID)
              clearTimeout(window.timerID);
          window.timerID = setTimeout(fn, delay);
      }

      function doFilter(deze)
      {
          var deze = $("#autofilter");
          var valThis = deze.val().toLowerCase();
          $("table.rstable > tbody > tr").each(function(){
              var text = $(this).text().toLowerCase();
              $(this).toggle(text.indexOf(valThis) > -1);
         });
      }

      function addTooltip()
      { // De gekoppelde objecten krijgen ze clientside door via dialogArguments.
        // Zoek de kenmerken erbij in de lijst met mogelijke objecten.
        var objexist_key;
        var objposib_key;
        $("#fldobjExist option").each(function(j, selected)
            {
              objexist_key = $(selected).val();
              var poss = $("#fldobjPossible option[value="+objexist_key+"]");
              $(selected).attr("title", poss.attr("title"));
            });
      }

      function show_info(event, init)
      {
        var selectedValues = null;
        if (init) {
          if ($("#fldobjExist option").length == 1) {
            selectedValues = $("#fldobjExist").val();
          } else if ($("#fldobjPossible option").length == 1) {
            selectedValues = $("#fldobjPossible").val();
          }
        } else {
          selectedValues = $(event.target).val();
        }
        if (selectedValues && selectedValues.length == 1 && selectedValues[0] > -1)
        {
          var ins_key = selectedValues[0];
          var dest = "mld_load_obj_info.asp?ins_key=" + ins_key
                   + "&max_rows=3"; // maximaal aantal te tonen kenmerken
          $(".mldobj-container").load(dest);
        }
        else
          $(".mldobj-container").html("");
        FcltMgr.resized(window);
      }

      function deselectComp(event, init)
      { // Deselecteer alle onderdelen
        $("#fldcompPossible option:selected").prop("selected", false);
      }

      function moveRight(obj)
      {
        $("#autofilterExist").val("");
        $("#autofilterExist").trigger("change");
        var selected_key_arr_obj = new Array(); // Array met geselecteerde Objecten.
        var selected_key_arr_comp = new Array(); // Array met geselecteerde onderdelen/Components.
        $("#fldcompPossible :selected").each(function(i, selected)
                                             {
                                               if ($(selected).val() > 0)
                                                 selected_key_arr_comp.push($(selected).val());
                                             });
        // Moeten er objecten of onderdelen toegevoegd worden aan de lijst. Dit is afhankelijk of er onderdelen zijn geselecteerd.
        if (selected_key_arr_comp.length > 0)
        { // Onderdelen toevoegen aan de lijst.
          $("#fldobjPossible option:selected").each(function(i, obj)
                                                    {
                                                      if ($(obj).val() > 0)
                                                        selected_key_arr_obj.push($(obj).val());
                                                    });

          $("#fldcompPossible option:selected").each(function()
          {
            var have = false;
            var $want = $(this).removeAttr("selected");
            $("#fldobjExist option").each(function() {
              have |= $(this).removeAttr("selected")[0].isEqualNode($want[0]);
            });
            if (!have)
            {
              $("#fldobjExist").append($want);
              var options = $("#fldcompPossible option")
              for (var i = options.length - 1; i >= 0; i--)
              {
                if (options[i].isEqualNode($want[0])) {
                  options.splice(i, 1);
                }
              }
              $("#fldcompPossible").data("options", options);
            }
          });
        }
        else
        { // Objecten toevoegen aan de lijst.
          if ((objects_allowed == 0) || (objects_allowed == 1 && objects_count == 1) )
          {
            FcltMgr.alert(L("mld_stdmelding_objects_allowed_msg1"));
          }
          else
          {
            $("#fldobjPossible option:selected").each(function(i, obj) {
              if ($(obj).val() > 0)
              {
                selected_key_arr_obj.push($(obj).val());
                var have = false;
                var $want = $(this).removeAttr("selected").clone();
                $("#fldobjExist option").each(function() {
                  have |= $(this).removeAttr("selected")[0].isEqualNode($want[0]);
                });
                if (!have)
                {
                  objects_count ++;
                  $("#fldobjExist").append($want);
                  var options = $("#fldobjPossible").data("options");
                  for (var i = options.length - 1; i >= 0; i--)
                  {
                    if (options[i].isEqualNode($want[0]))
                    {
                      options.splice(i, 1);
                    }
                  }
                  $ ("#fldobjPossible").data("options", options);
                }
              }
            });
          }
        }

        reloadObjPossible(selected_key_arr_obj);
      }

      function removeObj(obj)
      {
        $("#fldobjExist option:selected").remove();
        objects_count = $("#fldobjExist")[0].length;

        var selected_key_arr_obj = new Array(); // Objecten arary.
        $("#fldobjPossible :selected").each(function(i, selected)
                                            {
                                              if ($(selected).val() > 0)
                                                selected_key_arr_obj.push($(selected).val());
                                            });
        reloadObjPossible(selected_key_arr_obj);
      }

      function removeAllObj()
      { // Maak de gehele lijst leeg.
        objects_count = 0;
        document.getElementById("fldobjExist").innerHTML = "";
        var selected_key_arr_obj = new Array(); // Objecten arary.
        $("#fldobjPossible :selected").each(function(i, selected)
                                            {
                                              if ($(selected).val() > 0)
                                                selected_key_arr_obj.push($(selected).val());
                                            });
        reloadObjPossible(selected_key_arr_obj);
      }

      function reloadObjPossible(obj_init_arr)
      { // Herlaad de objecten lijst.
        var exclude_deel_key_arr = new Array();
        $("#fldobjExist option").each(function(i, obj)
                                      {
                                        if ($(obj).val() > 0)
                                          exclude_deel_key_arr.push($(obj).val());
                                      });

        $("#fldobjPossible").load("../Shared/loadDeel.asp?" + serializeObj(
                                  { deel_key_arr: obj_init_arr || [],
                                    exclude_deel_key_arr: exclude_deel_key_arr,
                                    alg_key: <%=alg_key%>,
                                    alg_niveau: "<%=alg_niveau%>",
                                    prs_key: <%=prs_key%>,
                                    stdmld_key: <%=stdmld_key%>,
                                    module: "INS",
                                    extracode: "UITV",
                                    multi: 1,
                                    startmulti: (objects_allowed == 2 ? 1 : 0),
                                    showasmulti: true,
                                    size: 5,
                                    extraParamValue: "uitvoertijd"
                                  }),
                                  function ()
                                  {
                                    onChangeObject();
                                  }
                                 );

        // Het kan zijn dat er objecten of onderdelen aan de rechten lijst zijn toegevoegd.
        // Het filter van de rechter lijst met gekozen objecten en onderdelen moet dan wel blijven werken.
        $("#fldobjExist").filterByText("#autofilterExist", true);
      }

      function obj_info(ins_key)
      {
          ins_key = ins_key || sel[0].value;
          var url = "appl/ins/ins_deel.asp?urole=bo&ins_key=" + ins_key;
          FcltMgr.openDetail(url, "");
      }

      function onChangeObject()
      { // Laad de onderdelen die bij het geselecteerde object horen in de onderdelen lijst.
        var deel_parent_key_arr = new Array();
        $("#fldobjPossible :selected").each(function(i, selected)
                                            {
                                              if ($(selected).val() > 0)
                                                deel_parent_key_arr.push($(selected).val());
                                            });
        var exclude_deel_key_arr = new Array();
        $("#fldobjExist option").each(function(i, selected)
                                      {
                                        if ($(selected).val() > 0)
                                          exclude_deel_key_arr.push($(selected).val());
                                      });
        $("#fldcompPossible").load("../Shared/loadDeel.asp?" + serializeObj(
                                   { deel_parent_key_arr: deel_parent_key_arr,
                                     exclude_deel_key_arr: exclude_deel_key_arr,
                                     components: 1,
                                     alg_key: <%=alg_key%>,
                                     alg_niveau: "<%=alg_niveau%>",
                                     prs_key: <%=prs_key%>,
                                     stdmld_key: <%=stdmld_key%>,
                                     module: "INS",
                                     extracode: "UITV",
                                     multi: 1,
                                     startmulti: (objects_allowed == 2 ? 1 : 0),
                                     showasmulti: true,
                                     size: 5,
                                     extraParamValue: "uitvoertijd"
                                   })
                                  );
      }

</script>
  </head>
  <body class="fclt-modal" id="mod_mldobj">
    <% MODAL_START(); %>
    <form name="u2" action="mld_object.asp?submit=1&mld_key=<%=mld_key%>" method="post" onsubmit="return false;">
<%
            MODAL_BLOCK_START("", L("lcl_mld_objects_select"), { icon: "fa-plus-hexagon", wide: true });
%>
              </table>
              <div class="row">
                <div class="col-5">
                  <table style="width: 95%">
                    <span><%=I("fa-ballot-check fa-2x", {fastyle: "far"})%></span>
                    <%=L("lcl_mld_objects_available")%>
                    </br>
                    <label for="fldobjPossible"><%=L("lcl_mld_objects")%></label>
                    <input id="autofilter" type="text" placeholder="<%=L('lcl_autofilter')%>">
<%
                    var sql = get_objecten_sql(alg_key, alg_niveau, prs_key, null, stdmld_key, {extracode: "UITV"});
                    FCLTselector("fldobjPossible",
                                 sql,
                                 { startmulti: (objects_allowed == 2 ? 1 : 0),
                                   showasmulti: true,
                                   size: 10,
                                   extraParamValue: "uitvoertijd",
                                   onChange: "onChangeObject()" } );
%>
                    <label for="fldcompPossible"><%=L("lcl_mld_subobjects")%></label>
<%
                    FCLTselector("fldcompPossible",
                                "",
                                { initKey: null,
                                  startmulti: (objects_allowed == 2 ? 1 : 0),
                                  showasmulti: true,
                                  size: 5,
                                  extraParamValue: "uitvoertijd" } );
%>
                  </table>
                </div>

                <div class="col-1 cnt-scope-buttons">
                  <span class="mover" onclick="moveRight()" title="<%=L("lcl_mld_object_add")%>"><%=I("fa-arrow-square-right")%></span>
                </div>
                <div class="col-1 cnt-scope-buttons">
                  <span class="mover" onclick="removeObj()" title="<%=L("lcl_mld_object_remove")%>"><%=I("fa-arrow-square-left")%></span><br><br>
                  <span class="mover" onclick="removeAllObj()" title="<%=L("lcl_mld_object_remove_all")%>"><%=I("fa-trash-alt")%></span>
                </div>

                <div class="col-5">
                  <table id="cntlocscope_list">
                    <span><%=I("fa-ballot-check fa-2x", {fastyle: "far"})%></span>
                    <%=L("lcl_mld_objects_selected")%>
                    </br>
                    <label for="fldobjExist"><%=L("lcl_mld_obj_and_subobj")%></label>
                    <input id="autofilterExist" type="text" placeholder="<%=L('lcl_autofilter')%>">
<%
                    sql = "SELECT 1 FROM DUAL WHERE 1=0"; // We krijgen ze clientside door via dialogArguments
                    FCLTselector("fldobjExist", sql, {startmulti: true, size: 10});
%>
                  </table>
                </div>
              </div>
              </br>

              <div id="mldsimilar" class="mldobj-container col mldsimilar">
                <div class="mldobj-info-wrapper">
                  <div class="mldobj-info">
                    <div></div>
                  </div>
                </div>
              </div>
              <table>
<%
            MODAL_BLOCK_END();
%>

<%
      var buttons = [{title: L("lcl_submit"), icon: "fa-fclt-save", action: "FcltMgr.closeDetail(window, { obj_html: $('#fldobjExist').html() })", importance: 1},
                     {title: L("lcl_cancel"), icon: "fa-fclt-cancel", action: "FcltMgr.closeDetail(window, { cancel: true })", importance: 3}];
      SIMPLE_BLOCK_START();
        CreateButtons(buttons);
      SIMPLE_BLOCK_END();
      IFACE.FORM_END();
%>
    </form>
    <% MODAL_END(); %>
  </body>
</html>
<% ASPPAGE_END(); %>
