AREO#83998 Savepoint, oa; styling, routing, handtekening, otp, mobile-input-type-date, profielpagina, jquery-lijst-filter-panels -> bootstrap offcanvas, lijst-multiactions/bulkables

svn path=/Website/trunk/; revision=69323

APPL/AUT/login.asp

@@ -270,7 +270,7 @@ if (S("login_remember_days") > 0)
 %>
 <%IFACE.FORM_END();%>
 </form>
-<form name="ifl_f_pm" action="<%=rooturl%>/appl/aut/pass2mail_save.asp" method="post" onsubmit="do_submit();return false;" autocomplete="off" hidden>
+<form name="ifl_f_pm" action="<%=rooturl%>/appl/aut/pass2mail_save.asp" method="post" onsubmit="do_submit();return false;" autocomplete="off" style="display: none;">
       <div class="form-group passtomail">
         <input class="form-control required" type="text" maxlength="200" id="vismail" name="vis_mail" placeholder="<%=L("lcl_noti_sendbymail")%>">
       </div>
@@ -280,7 +280,7 @@ if (S("login_remember_days") > 0)
     CreateButtons(buttons, { entersubmit: true, vertical: true, showIcons: true, display: "flex" });
 %>
 </form>
-<form name="ifl_f_tm" action="<%=rooturl%>/appl/aut/pass2mail_save.asp" method="post" onsubmit="do_submit();return false;" autocomplete="off" hidden>
+<form name="ifl_f_tm" action="<%=rooturl%>/appl/aut/pass2mail_save.asp" method="post" onsubmit="do_submit();return false;" autocomplete="off" style="display: none;">
       <div class="form-group tokentomail">
         <input class="form-control required" type="text" maxlength="200" id="vistoken" name="vis_token" placeholder="<%=L("lcl_token2email")%>">
       </div>
@@ -290,7 +290,7 @@ if (S("login_remember_days") > 0)
     CreateButtons(buttons, { entersubmit: true, vertical: true, showIcons: true, display: "flex" });
 %>
 </form>
-<form name="ifl_f_sr" action="<%=rooturl%>/appl/prs/self_register_save.asp?" method="post" onsubmit="do_submit();return false;" autocomplete="off" hidden>
+<form name="ifl_f_sr" action="<%=rooturl%>/appl/prs/self_register_save.asp?" method="post" onsubmit="do_submit();return false;" autocomplete="off" style="display: none;">
 
       <div class="form-group selfregister">
         <input class="form-control required visselfregister" type="text" maxlength="200" autocomplete="off" name="prs_naam" placeholder="<%=L("lcl_prs_person_name")%>">
@@ -306,7 +306,7 @@ if (S("login_remember_days") > 0)
     CreateButtons(buttons, { entersubmit: true, vertical: true, showIcons: true, display: "flex" });
 %>
 </form>
-<form name="ifl_f_otp" action="<%=rooturl%>/appl/aut/login_save.asp" method="post" onsubmit="do_submit_otp();return false;" autocomplete="off" hidden>
+<form name="ifl_f_otp" action="<%=rooturl%>/appl/aut/login_save.asp" method="post" onsubmit="do_submit_otp();return false;" autocomplete="off" style="display: none;">
     <div class="form-group otp">
       <label for="otpcode"></label>
       <input class="form-control" type="text" maxlength="6" id="otpcode" name="otpcode">

APPL/MSG/msg.inc

@@ -143,7 +143,7 @@ msg = {
         if (msg_info.category_key) {
           carddata.category = msg_info.category_key;
         }
-        CARD_START({ "cls": "msg" + (mode == "show" ? "" : " preview"), "data": carddata });
+        CARD_START({ "cls": "msg" + (mode == "show" ? "" : " preview") + (mode == "list" ? " tappable" : ""), "data": carddata });
         var author = prs.prs_perslid(msg_info.author_key, { withPhoto: true });
 %>      <div class="msg-card-header">
             <span class="msg-info">
@@ -165,7 +165,7 @@ msg = {
             </div>
 <%        } %>
         </div>
-        <div class="card-content<%=(mode == "list" ? " tappable" : "")%>">
+        <div class="card-content">
             <div class="card-title"><%=safe.html(msg_info.msg_subject)%></div>
             <div class="card-descr"><%=safe.fclthtml(msg_info.msg_omschrijving, { "file_params": { "module": "MSG", "key": msg_key }})%></div>
         </div>

APPL/PDA/BijlagenSignature.asp

@@ -71,7 +71,7 @@ if (params.extFilter != "xxx")
         }
         function sig_cancel()
         {
-            window.history.back();
+            mobile.changePage();
         }
 
         function uploadDone(json)
@@ -84,7 +84,7 @@ if (params.extFilter != "xxx")
             // Sla de naam op in het hidden field met het name attribuut zodat we de naam ook in de kenmerk-tabel opslaan
             $("[name=" + btn.id + "]").val(json.safefilename || "");
 
-            var $img = $signatureButton.siblings("img.kenmerk").attr("src", json.fullPath || "");
+            $("#" + $signatureButton.attr("aria-controls")).attr("src", json.fullPath || "");
 
             if (save_url) {
                 $.post(save_url, { flexVal: json.safefilename || "" }); // DIRECT opslaan in de database
@@ -95,7 +95,7 @@ if (params.extFilter != "xxx")
                                 fullPath: json.fullPath || ""
                               };
             window.return_data = return_data;
-            window.history.back();
+            mobile.changePage();
         }
 
         function sig_init()
@@ -131,7 +131,7 @@ if (params.extFilter != "xxx")
         </div>
         <div class="signature-pad--footer">
 <%
-    CONTROLGROUP_START({ horizontal: true });
+    CONTROLGROUP_START();
         BUTTON(L("lcl_filedelete"), { click: "sig_clear()",   icon: "fa-trash-alt" });
         BUTTON(L("lcl_submit"),     { click: "sig_submit()",  icon: "fa-fclt-save" });
         BUTTON(L("lcl_cancel"),     { click: "sig_cancel()",  icon: "fa-fclt-cancel" });

APPL/PDA/Facilitor.asp

@@ -68,10 +68,8 @@ var thisUser = prs.prs_perslid(user_key, { withPhoto: true });
 
     portalnews(user.alg_locatie_key({withcurrent: true}), user.alg_gebouw_key({withcurrent: true}), 1, 1);
 
-    CARDS_WRAPPER_START({ "layout": "horizontal" });
+    fac_list(0);
-        fac_list(0);
+    fac_list(1);
-        fac_list(1);
-    CARDS_WRAPPER_END();
 
     CONTENT_END();
     FOOTER({ mswitch: true, banner: true, nousername: true, thisuser: thisUser });

APPL/PDA/attachments.js

@@ -29,7 +29,7 @@ function addFile(inputEl, file, eagerUpload) {
       );
     }
     fileSpan.append(
-        $('<input>', { type: 'text', 'class': 'icon icon-attachment filename readonly', name: param +'[' + attachmentId + '][filename]', readonly: 'readonly'} ).val(file.name),
+        $('<input>', { type: 'text', 'class': 'icon icon-attachment filename readonly form-control-plaintext', name: param +'[' + attachmentId + '][filename]', readonly: 'readonly'} ).val(file.name),
         $('<input>', { type: 'hidden', 'class': 'token', name: param + '[' + attachmentId + '][token]'} )
         /* Gelijk een Delete knop invoegen is wat te complex */
     ).appendTo(attachmentsFields);

APPL/PDA/berichten.asp

@@ -103,6 +103,7 @@ var authparams = user.checkAutorisation("WEB_MSGUSE");
   </head>
   <body class="body-msg">
 <%
+PAGE_START();
   HEADER({ title: L("lcl_msg_community_title") });
   shared.registeraction("community", { daily: -1 }); // Registreer mijn laatste bezoek
   CONTENT_START();
@@ -138,6 +139,7 @@ var authparams = user.checkAutorisation("WEB_MSGUSE");
 %>    <a href="<%=rooturl + "/appl/pda/bericht.asp?msg_key=-1"%>" class="primary-action-button link-fixed-bottom-right" data-ajax="false"><%=I("fa-plus")%></a><%
   CONTENT_END();
   FOOTER();
+PAGE_END();
 %>
 <% PDA_PAGE_END(); %>
 	</body>

APPL/PDA/cnt_list.asp

@@ -33,11 +33,12 @@ var geb_key = getQParamInt("geb_key", -1);
 var ver_key = getQParamInt("ver_key", -1);
 var rui_key = getQParamInt("rui_key", -1);
 var cntnum = getQParam("cntnum", ""); // Contractnummer (zoekveld, unsafe)
-var cntFFut = getQParamInt("cntFFut", 0) == 1; // Fase toekomstig binnen status actief
+
-var cntFAct = getQParamInt("cntFAct", 0) == 1; // Fase actueel binnen status actief
+var cntFFut = getQParamSafe("cntFFut", "off") == "on"; // Fase toekomstig binnen status actief
-var cntFRap = getQParamInt("cntFRap", 0) == 1; // Fase rappel binnen status actief
+var cntFAct = getQParamSafe("cntFAct", "off") == "on"; // Fase actueel binnen status actief
-var cntFOpz = getQParamInt("cntFOpz", 0) == 1; // Fase in opzegtermijn binnen status actief
+var cntFRap = getQParamSafe("cntFRap", "off") == "on"; // Fase rappel binnen status actief
-var cntFVerl = getQParamInt("cntFVerl", 0) == 1; // Fase verlopen binnen status actief
+var cntFOpz = getQParamSafe("cntFOpz", "off") == "on"; // Fase in opzegtermijn binnen status actief
+var cntFVerl = getQParamSafe("cntFVerl", "off") == "on"; // Fase verlopen binnen status actief
 
 var cntAct = 1; // standard checked
 if (!cntFFut && !cntFAct && !cntFRap && !cntFOpz)
@@ -122,65 +123,48 @@ var autfunction = (urole == "fe" ? "WEB_CNTUSE" : "WEB_CNTMAN");
     PAGE_START();
     HEADER({title: subject, back:!qrc});
 %>
-<script  type="text/javascript" >
+  <script>
-    function openFilterPanel()
-    {
-      $(function ()
-      {
-        $('.cntFilterPanel:visible').panel('open');
-      });
-    }
-
     function cnt_filter()
     {
-          document.forms.cnt_filter_list.submit();
+        document.forms.cnt_filter_list.submit();
     }
 
     function cnt_home()
     {
         window.location.href = rooturl + "/appl/pda/Facilitor.asp";
     }
-</script>
+  </script>
+
+<%  FILTER_PANEL_START(); %>
 
-    <div data-role="panel" data-display="overlay" id="cntFilterP" class="cntFilterPanel">
         <form name="u2" id="cnt_filter_list" action="<%=rooturl%>/appl/pda/cnt_list.asp" method="get">
             <input type="hidden" name="urole" id="urole" value="<%=urole%>">
             <input type="hidden" name="cntAct" id="cntAct" value="<%=params.cntAct%>">
 <%
         CONTROLGROUP_START();
-%>
+          CHB_FIELD("cntFFut", L("lcl_cnt_future"), params.cntFFutu, { "inline": true });
-          <input type="checkbox" class="fldcntFfut" name="cntFFut" id="cntFFut" value="1" <%=params.cntFFutu? "checked" : ""%>>
+          CHB_FIELD("cntFAct", L("lcl_cnt_topical"), params.cntFAct, { "inline": true });
-          <label for="cntFFut"><%=L("lcl_cnt_future")%></label>
+          CHB_FIELD("cntFRap", L("lcl_cnt_warn"), params.cntFRap, { "inline": true });
-          <input type="checkbox" class="fldcntfact" name="cntFAct" id="cntFAct" value="1" <%=params.cntFAct? "checked" : ""%>>
+          CHB_FIELD("cntFOpz", L("lcl_cnt_cancel"), params.cntFOpz, { "inline": true });
-          <label for="cntFAct"><%=L("lcl_cnt_topical")%></label>
+          CHB_FIELD("cntFVerl", L("lcl_cnt_past"), params.cntFVerl, { "inline": true });
-          <input type="checkbox" class="fldcntfrap" name="cntFRap" id="cntFRap" value="1" <%=params.cntFRap? "checked" : ""%>>
-          <label for="cntFRap"><%=L("lcl_cnt_warn")%></label>
-          <input type="checkbox" class="fldcntfopz" name="cntFOpz" id="cntFOpz" value="1" <%=params.cntFOpz? "checked" : ""%>>
-          <label for="cntFOpz"><%=L("lcl_cnt_cancel")%></label>
-          <input type="checkbox" class="fldcntfverl" name="cntFVerl" id="cntFVerl" value="1" <%=params.cntFVerl? "checked" : ""%>>
-          <label for="cntFVerl"><%=L("lcl_cnt_past")%></label>
-<%
         CONTROLGROUP_END();
 
         CONTROLGROUP_START();
-%>
+          RWFIELD("cntnum", L("lcl_cnt_intern_nr"), cntnum);
-          <legend><%=L("lcl_cnt_intern_nr")%>:</legend>
-          <input type="text" class="fldcntnum" name="cntnum" value="<%=safe.htmlattr(cntnum)%>">
-<%
         CONTROLGROUP_END();
 
-        CONTROLGROUP_START({ horizontal: true });
+        CONTROLGROUP_START();
-            BUTTON(L("lcl_mobile_panel_filter"), { id: "search_submit", click: "cnt_filter()", icon: "fa-fclt-refresh", datarel: "close" });
+            BUTTON(L("lcl_mobile_panel_filter"), { id: "search_submit", click: "cnt_filter()", icon: "fa-fclt-refresh" });
-            //BUTTON(L("lcl_home"), { id: "home", click: "cnt_home()", icon: "fa-home", datarel: "close" });
         CONTROLGROUP_END();
 %>
         </form>
-    </div>
+<%  FILTER_PANEL_END();
-<%
+
-    var p_useraction = { icon: "fa-filter-list", action: "openFilterPanel()", label: L("lcl_mld_filter") };
+    HEADER({
-    HEADER({title: subject,
+        title: subject,
-            back:false,
+        back: false,
-            useraction: p_useraction});
+        filterPanel: true
+    });
     CONTENT_START();
 
     var rst = new ResultsetTable({sql: sql,

APPL/PDA/factuur.asp

@@ -50,7 +50,7 @@ var subject = L("lcl_fin_invoice") + " " + fin_key;
       }
 <%    if (fin_key > -1 && this_fin.canAccept) { %>
         function fin_reject_confirm() {
-          $.mobile.changePage("#frej-1-<%=fin_key%>");
+          mobile.changePage("frej-1-<%=fin_key%>");
           return false;
         };
 <%    } %>

APPL/PDA/ins_deel.asp

@@ -876,7 +876,7 @@ if (alg_typ == "R" || alg_typ == "W" || alg_typ == "T")
             else
             {
                 if (btns["ins_save"] && (this_ins.canChangeAlg || this_ins.canChange)) {
-                    BUTTON(L("lcl_cancel"), {datarel: "back", icon: "fa-fclt-cancel"} );
+                    BUTTON(L("lcl_cancel"), {click: "mobile.changePage();", icon: "fa-fclt-cancel"} );
                 }
             }
             CONTROLGROUP_END();

APPL/PDA/ins_inspect_list.asp

@@ -104,22 +104,19 @@ else
   <head>
 <%  FCLTMHeader.Generate({}); %>
     <script>
-      function openFilterPanel() {
-        $(".inspectFilterPanel").panel("open");
-      }
 
       function onClickDone() {
         if (document.getElementById("insInspDone").checked)
         {
           $("[id^=donedate_]").closest("div").show();
           $("[id^=inspsoon_]").closest("div").hide();
-          $("#insInspBusy, #insInspClosed, #insInspSoon").closest(".ui-checkbox").hide();
+          $("#insInspBusy, #insInspClosed, #insInspSoon").closest(".<%=MOBILE_UI_CLASSES.checkbox_wrapper.replace(/^\s*/, "")%>").hide();
         }
         else
         {
           $("[id^=donedate_]").closest("div").hide();
           $("[id^=inspsoon_]").closest("div").show();
-          $("#insInspBusy, #insInspClosed, #insInspSoon").closest(".ui-checkbox").show();
+          $("#insInspBusy, #insInspClosed, #insInspSoon").closest(".<%=MOBILE_UI_CLASSES.checkbox_wrapper.replace(/^\s*/, "")%>").show();
         }
       }
 
@@ -132,78 +129,83 @@ else
   <body>
 <%
     PAGE_START();
-%>
+
-    <div data-role="panel" data-display="overlay" id="inspectFilterP" class="inspectFilterPanel">
+    FILTER_PANEL_START(); %>
+
         <form name="u2" id="inspect_filter_list" action="<%=rooturl%>/appl/pda/ins_inspect_list.asp" method="get">
           <input type="hidden" name="urole" value="<%=urole%>">
 <%
-        FCLTdienstselector("dienst_key", "dienst_key",
-                    { dienstKey : dienst_key,
-                      filtercode: (urole == "b2" ? "OWN" : null),
-                      label: L("lcl_prs_companies_dienst")
-                    });
 
-        CHB_FIELD("insInspDone", L("lcl_ins_controle_done"), (inspDone ? 1 : 0));
+        CONTROLGROUP_START();
+          FCLTdienstselector("dienst_key", "dienst_key",
+                      { dienstKey : dienst_key,
+                        filtercode: (urole == "b2" ? "OWN" : null),
+                        label: L("lcl_prs_companies_dienst")
+                      });
+        CONTROLGROUP_END();
 
-        FCLTcalendar("donedate_from",
+        CONTROLGROUP_START();
-                     {
+          CHB_FIELD("insInspDone", L("lcl_ins_controle_done"), (inspDone ? 1 : 0), { "inline": true });
-                      label: L("lcl_period_from"),
-                      datum: (donedatefrom ? donedatefrom : new Date(new Date().getTime() - 2*24*60*60*1000)),
-                      volgnr: 1,
-                      maxFuture: 0,
-                      nofollow: true,
-                      trhidden: !inspDone,
-                      mobile: true
-                     });
 
-        FCLTcalendar("donedate_to",
+          FCLTcalendar("donedate_from",
-                     {
+                      {
-                      label: L("lcl_period_to"),
+                        label: L("lcl_period_from"),
-                      datum: (donedateto ? donedateto : new Date(new Date().getTime() - 1*24*60*60*1000)),
+                        datum: (donedatefrom ? donedatefrom : new Date(new Date().getTime() - 2*24*60*60*1000)),
-                      volgnr: 2,
+                        volgnr: 1,
-                      maxFuture: 0,
+                        maxFuture: 0,
-                      nofollow: true,
+                        nofollow: true,
-                      trhidden: !inspDone,
+                        trhidden: !inspDone,
-                      mobile: true
+                        mobile: true
-                     });
+                      });
 
-        CHB_FIELD("insInspBusy", L("lcl_ins_controle_busy"), (inspBusy ? 1 : 0));
+          FCLTcalendar("donedate_to",
-        CHB_FIELD("insInspClosed", L("lcl_ins_controle_act_req"), (inspClosed ? 1 : 0));
+                      {
-        CHB_FIELD("insInspSoon", L("lcl_ins_controle_soon"), (inspSoon ? 1 : 0));
+                        label: L("lcl_period_to"),
+                        datum: (donedateto ? donedateto : new Date(new Date().getTime() - 1*24*60*60*1000)),
+                        volgnr: 2,
+                        maxFuture: 0,
+                        nofollow: true,
+                        trhidden: !inspDone,
+                        mobile: true
+                      });
 
-        FCLTcalendar("inspsoon_from",
+          CHB_FIELD("insInspBusy", L("lcl_ins_controle_busy"), (inspBusy ? 1 : 0), { "inline": true });
-                     {
+          CHB_FIELD("insInspClosed", L("lcl_ins_controle_act_req"), (inspClosed ? 1 : 0), { "inline": true });
-                      label: L("lcl_period_from"),
+          CHB_FIELD("insInspSoon", L("lcl_ins_controle_soon"), (inspSoon ? 1 : 0), { "inline": true });
-                      datum: inspsoonfrom,
+        CONTROLGROUP_END();
-                      initEmpty: inspsoonfrom === null,
-                      volgnr: 3,
-                      nofollow: true,
-                      trhidden: inspDone,
-                      mobile: true
-                     });
-        FCLTcalendar("inspsoon_to",
-                     {
-                      label: L("lcl_period_to"),
-                      datum: inspsoonto,
-                      volgnr: 4,
-                      nofollow: true,
-                      trhidden: inspDone,
-                      mobile: true
-                     });
 
-        CONTROLGROUP_START({ horizontal: true });
+        CONTROLGROUP_START();
+          FCLTcalendar("inspsoon_from",
+                      {
+                        label: L("lcl_period_from"),
+                        datum: inspsoonfrom,
+                        initEmpty: inspsoonfrom === null,
+                        volgnr: 3,
+                        nofollow: true,
+                        trhidden: inspDone,
+                        mobile: true
+                      });
+          FCLTcalendar("inspsoon_to",
+                      {
+                        label: L("lcl_period_to"),
+                        datum: inspsoonto,
+                        volgnr: 4,
+                        nofollow: true,
+                        trhidden: inspDone,
+                        mobile: true
+                      });
+        CONTROLGROUP_END();
+
+        CONTROLGROUP_START();
             BUTTON(L("lcl_mobile_panel_filter"), { id: "search_submit", click: "document.forms.inspect_filter_list.submit();", icon: "fa-fclt-refresh", datarel: "close" });
         CONTROLGROUP_END();
 %>
         </form>
-    </div>
+<%  FILTER_PANEL_END();
-<%
+
     HEADER({
-      title: subject,
+        title: subject,
-      useraction: {
+        filterPanel: true
-        icon: "fa-filter-list",
-        action: "openFilterPanel()"
-      }
     });
     CONTENT_START();
 

APPL/PDA/mld_list.asp

@@ -740,7 +740,7 @@ var canAdd = addparams && addparams.ALGwritelevel;
                )
              + "</div>"
            + (oRs("mld_melding_onderwerp").Value != null ? "<span class='subject'>" + safe.html(oRs("mld_melding_onderwerp").Value) + "</span><br>" : "")
-           + (oRs("mld_melding_omschrijving").Value? "<div class='listbodytext'>" + safe.html(shorttxt(shared.stripbbcodes(oRs("mld_melding_omschrijving").Value), S("rs_mobile_maxchar"))) + "</div>" : "");
+           + (oRs("mld_melding_omschrijving").Value? "<div class='listbodytext limit-lines-2'>" + safe.html(shorttxt(shared.stripbbcodes(oRs("mld_melding_omschrijving").Value), S("rs_mobile_maxchar"))) + "</div>" : "");
     };
 
     function fncolStatus(oRs)
@@ -754,15 +754,7 @@ var canAdd = addparams && addparams.ALGwritelevel;
     PAGE_START({ datacache: false });
 
 %>
-<script  type="text/javascript" >
+  <script>
-    function openFilterPanel()
-    {
-      $(function ()
-      {
-        $('.mldFilterPanel:visible').panel('open');
-      });
-    }
-
     function mld_filter()
     {
           document.forms.mld_filter_list.submit();
@@ -794,8 +786,9 @@ var canAdd = addparams && addparams.ALGwritelevel;
         }
      );
 
-</script>
+  </script>
-    <div data-role="panel" data-display="overlay" id="mldFilterP" class="mldFilterPanel">
+
+<%  FILTER_PANEL_START(); %>
         <form name="u2" id="mld_filter_list" action="<%=rooturl%>/appl/pda/mld_list.asp" method="get" accept-charset="utf-8">
             <input type="hidden" name="grp" id="grp" value="<%=safe.htmlattr(grp_sel)%>">
             <input type="hidden" name="urole" value="<%=urole%>">
@@ -807,25 +800,24 @@ var canAdd = addparams && addparams.ALGwritelevel;
             <input type="hidden" name="has_actiecodeFE" id="has_actiecodeFE" value="<%=has_actiecodeFE%>">
             <input type="hidden" name="cnt_disc" id="cnt_disc" value="<%=p_cnt_disc%>">
             <input type="hidden" name="cnt_mld" id="cnt_mld" value="<%=p_cnt_mld%>">
-
 <%
-        CONTROLGROUP_START();
+        if (S("mld_melding_flags") > 1)
-        if (S('mld_melding_flags') > 1)
         {
-            for (flagkey=0; flagkey < S("mld_melding_flags"); flagkey++)
+          CONTROLGROUP_START();
-            { %>
+            for (flagkey=0; flagkey < S("mld_melding_flags"); flagkey++) {
-                <label for="flag<%=flagkey%>">
+              var label_html = '<span class="mldflag' + flagkey + ' flag">' + I("fa-fclt-flag" + (flagkey == 0 ? "0" : ""))
-                  <input type="checkbox"  name="flag<%=flagkey%>" data-mini="true" id="flag<%=flagkey%>" <%=((checkboxParams[flagkey] == "on") ? "checked" : "")%>>
+                             + '  <span>' + L("lcl_mld_flag" + flagkey)
-                  <span class="mldflag<%=flagkey%> mlds">
+                             + '</span>';
-                    <%=I("fa-fclt-flag" + (flagkey == 0 ? "0" : ""))%>
+              CHB_FIELD("flag" + flagkey, label_html, checkboxParams[flagkey] == "on", { "inline": true });
-                  </span>&nbsp;<%=safe.html(L("lcl_mld_flag" + flagkey))%>
-                </label><%
             }
+          CONTROLGROUP_END();
         }
-%>
+
-        <label for="actiecodeFE"><input type="checkbox" name="actiecodeFE" data-mini="true" id="actiecodeFE" <%=((actiecodeFE == "on") ? "checked" : "")%>><span class="mlds"><%=I("fa-user-circle", { fastyle: "fas" })%></span>&nbsp;<%=safe.html(L("lcl_mld_actiecodeFEchk"))%></label>
+        CONTROLGROUP_START();
-        <label for="actiecodeATT"><input type="checkbox" name="actiecodeATT" data-mini="true" id="actiecodeATT" <%=((actiecodeATT == "on") ? "checked" : "")%>><span class="mlds"><%=I("fa-bell", { fastyle: "fas" })%></span>&nbsp;<%=safe.html(L("lcl_mld_actiecodeATTchk"))%></label>
+
-<%
+          CHB_FIELD("actiecodeFE", I("fa-user-circle", { fastyle: "fas" }) + "<span>" + L("lcl_mld_actiecodeFEchk") + "</span>", (actiecodeFE == "on"), { "inline": true });
+          CHB_FIELD("actiecodeATT", I("fa-bell", { fastyle: "fas" }) + "<span>" + L("lcl_mld_actiecodeATTchk") + "</span>", (actiecodeATT == "on"), { "inline": true });
+
         CONTROLGROUP_END();
         if (S("mld_restrict_mobile_to_me") == 1 && self <= 0)
         {
@@ -834,45 +826,40 @@ var canAdd = addparams && addparams.ALGwritelevel;
 <%      }
         else
         {
-        CONTROLGROUP_START();
+          CONTROLGROUP_START();
-%>
+
-         	<input type="radio" name="self" id="mldbehall" data-mini="true" value="-1" <%=((self<=0) ? "checked" : "")%>  />
+            var radios = [
-         	<label for="mldbehall"><%=safe.html(L("lcl_mld_melding_all"))%></label>
+              { id: "mldbehall", value: "-1", checked: (self <= 0), label: L("lcl_mld_melding_all") },
-         	<input type="radio" name="self" id="mldbehown" data-mini="true" value="1" <%=((self > 0) ? "checked" : "")%>  />
+              { id: "mldbehown", value: "1", checked: (self > 0), label: L("lcl_mld_melding_own") }
-         	<label for="mldbehown"><%=safe.html(L("lcl_mld_melding_own"))%></label>
+            ]
-<%
+            RADIO_GROUP("self", radios);
-        CONTROLGROUP_END();
+
+          CONTROLGROUP_END();
         }
-        CONTROLGROUP_START();
+
-        if (status.length == 0)
+        if (status.length == 0) {
-        {
+          CONTROLGROUP_START();
-%>
+            CHB_FIELD("mldtebeh", L("lcl_mld_chk_bo_mldNew"), (fase & 1) == 1, { "inline": true });
-         	<input type="checkbox" name="fase1" id="mldtebeh" value="1" <%=((fase & 1) ? "checked" : "")%>  />
+            CHB_FIELD("mldinbeh", L("lcl_mld_chk_bo_mldSelf"), (fase & 2) == 1, { "inline": true });
-         	<label for="mldtebeh"><%=safe.html(L("lcl_mld_chk_bo_mldNew"))%></label>
+            CHB_FIELD("mldafm", L("lcl_mld_chk_bo_mldAfm"), (fase & 4) == 1, { "inline": true });
-         	<input type="checkbox" name="fase2" id="mldinbeh" value="2" <%=((fase &  2) ? "checked" : "")%>  />
+          CONTROLGROUP_END();
-         	<label for="mldinbeh"><%=safe.html(L("lcl_mld_chk_bo_mldSelf"))%></label>
-         	<input type="checkbox" name="fase4" id="mldafm" value="4" <%=((fase &  4) ? "checked" : "")%>  />
-         	<label for="mldafm"><%=safe.html(L("lcl_mld_chk_bo_mldAfm"))%></label>
-<%
         }
-        CONTROLGROUP_END();
+
         CONTROLGROUP_START();
         if (behandel3_key < 0 && !(S("mld_restrict_mobile_to_me") == 1 && self <= 0))
         {
 %>
-        <div>
+        <label for="behandel"><%=safe.html(L("lcl_mld_no_handler"))%></label>
-        <label style="float: left;" for="behandel"><%=safe.html(L("lcl_mld_no_handler"))%></label>
+        <select name="behandel" id="behandel" class="<%=MOBILE_UI_CLASSES.select%>">
-        <select name="behandel" style="float: left;" id="behandel" data-role="slider" data-mini="true">
             <option value="-2" <%=((behandel3_key == -2) ? "selected" : "")%> ><%=safe.html(L("lcl_Yes"))%></option>
             <option value="-1" <%=((behandel3_key == -1) ? "selected" : "")%> ><%=safe.html(L("lcl_No"))%></option>
         </select>
-        </div>
 <%      }
         CONTROLGROUP_END();
 
         CONTROLGROUP_START();
-%>        <input type="text" placeholder="<%=L("lcl_call_number")%>" class="fldmld_key" id="mld_key" name="mld_key" <%=(mld_key > 0) ? "value='" + mld_key + "'" : ""%>>
+%>        <input type="text" placeholder="<%=L("lcl_call_number")%>" class="<%=MOBILE_UI_CLASSES.input%>" id="mld_key" name="mld_key" <%=(mld_key > 0) ? "value='" + mld_key + "'" : ""%>>
-          <input type="text" placeholder="<%=L("lcl_search_diff_fields")%>" class="searchtekst" id="searchtekst" name="searchtekst" <%=(searchtekst != "") ? "value='" + safe.htmlattr(searchtekst) + "'" : ""%>>
+          <input type="text" placeholder="<%=L("lcl_search_diff_fields")%>" class="<%=MOBILE_UI_CLASSES.input%>" id="searchtekst" name="searchtekst" <%=(searchtekst != "") ? "value='" + safe.htmlattr(searchtekst) + "'" : ""%>>
 <%
           if (inArray(filterLevel, ["L", "D", "A"])) { // Anders is een gebouwfilter niet relevant
 
@@ -923,20 +910,13 @@ var canAdd = addparams && addparams.ALGwritelevel;
 
         CONTROLGROUP_END();
 
-        CONTROLGROUP_START({ horizontal: true });
+        CONTROLGROUP_START();
-            BUTTON(L("lcl_mobile_panel_filter"), {id: "search_submit", click: "mld_filter()", icon: "fa-fclt-refresh", datarel: "close" });
+            BUTTON(L("lcl_mobile_panel_filter"), { id: "search_submit", click: "mld_filter()", icon: "fa-fclt-refresh" });
-            // Sinds 2024.1 zit dit in de navbar BUTTON(L("lcl_home"), {id: "home", click: "mld_home()", icon: "fa-home", datarel: "close"});
-            // Moet er niet een knop bij voor het weer inklappen van het zoekpanel? Voor wie wil kijken waarop gefilterd is?
-            // Dat kan "gewoon" door naast het panel te klikken
         CONTROLGROUP_END();
 %>
         </form>
-    </div>
+<%  FILTER_PANEL_END();
-<%
     var withContext = (ruimte_key > -1 || ins_key > -1 || rsv_ruimte_key > -1);
-
-    var p_useraction = {icon: "fa-filter-list", action: "openFilterPanel()", label: L("lcl_mld_filter")};
-
     var multiactions = [];
     if (user.has("WEB_MLDFOF") || user.has("WEB_MLDBOF")) {
         multiactions.push({ icon: "fa-flag-checkered", action: "mld_close", caption: L("lcl_close") });
@@ -946,7 +926,7 @@ var canAdd = addparams && addparams.ALGwritelevel;
     HEADER({
       title: subject,
       back: (!qrc && withContext),
-      useraction: (!withContext ? p_useraction : null),
+      filterPanel: !withContext,
       addaction: canAdd? (rooturl + "/appl/pda/melding.asp?mld_key=-1" + (ins_key > -1? "&ins_key=" + ins_key : "") + (ruimte_key > -1? "&ruimte_key=" + ruimte_key : "") + "&meldbronkey=" + meldbron_key + (deelsrtcont_key>-1 ? "&deelsrtcont_key=" + deelsrtcont_key : "")) : false,
       multiactions: !group && multiactions.length
     });

APPL/PDA/notitie.asp

@@ -660,8 +660,8 @@ else
         }
 
         CONTROLGROUP_START();
-          BUTTON(L("lcl_submit"), {click:  "note_submit()", icon: "fa-fclt-save", singlepress: true});
+          BUTTON(L("lcl_submit"), {click: "note_submit()", icon: "fa-fclt-save", singlepress: true});
-          BUTTON(L("lcl_cancel"), {datarel: "back", icon: "fa-fclt-cancel"} );
+          BUTTON(L("lcl_cancel"), {click: "history.back()", icon: "fa-fclt-cancel"} );
         CONTROLGROUP_END();
       IFACE.FORM_END();
 %>

APPL/PDA/orders_list.asp

@@ -453,14 +453,7 @@ if (!hasParamFlag)
 
     PAGE_START({datacache:false});
     %>
-  <script  type="text/javascript" >
+  <script>
-    function openFilterPanel()
-    {
-      $(function ()
-      {
-        $('.ordersFilterPanel:visible').panel('open');
-      });
-    }
 
     function orders_filter()
     {
@@ -494,47 +487,34 @@ if (!hasParamFlag)
     }
 
   </script>
-    <div data-role="panel" data-display="overlay" id="ordersFilterP" class="ordersFilterPanel">
+
+<%  FILTER_PANEL_START(); %>
+
         <form name="u2" id="orders_filter_list" action="<%=rooturl%>/appl/pda/orders_list.asp" method="get">
             <input type="hidden" name="grp" id="grp" value="<%=safe.htmlattr(grp_sel)%>">
             <input type="hidden" name="grpby" id="grpby" value="<%=disc_type%>">
             <input type="hidden" name="qrc" id="qrc" value="<%=(qrc ? 1 : 0)%>">
             <input type="hidden" name="deelsrtcont_key" id="deelsrtcont_key" value="<%=deelsrtcont_key%>">
-
 <%
+        if (S("mld_opdracht_flags") > 1)
+        {
+          CONTROLGROUP_START();
+            for (flagkey=0; flagkey < S("mld_opdracht_flags"); flagkey++) {
+              var label_html = '<span class="opdrflag' + flagkey + ' flag">' + I("fa-fclt-flag" + (flagkey == 0 ? "0" : ""))
+                             + '  <span>' + L("lcl_opdr_flag" + flagkey) + '</span>'
+                             + '</span>';
+              CHB_FIELD("flag" + flagkey, label_html, checkboxParams[flagkey] == "on", { "inline": true });
+            }
+          CONTROLGROUP_END();
+        }
+
         CONTROLGROUP_START();
-        if (S('mld_opdracht_flags') > 1)
+            BUTTON(L("lcl_mobile_panel_filter"), { id: "search_submit", click: "orders_filter()", icon: "fa-fclt-refresh" });
-        {
-            for (flagkey=0; flagkey < S("mld_opdracht_flags"); flagkey++)
-            { %>
-              <label for="flag<%=flagkey%>">
-                <input type="checkbox" name="flag<%=flagkey%>" data-mini="true" id="flag<%=flagkey%>" <%=((checkboxParams[flagkey] == "on") ? "checked" : "")%>>
-                <span class="opdrflag<%=flagkey%> opdrs">
-                  <%=I("fa-fclt-flag" + (flagkey == 0 ? "0" : ""))%>
-                </span>&nbsp;<%=safe.html(L("lcl_opdr_flag"+flagkey))%>
-              </label>
-<%          }
-        }
-
-        CONTROLGROUP_END();
-
-        CONTROLGROUP_START({ horizontal: true });
-        if (S("mld_opdracht_flags") > 0)
-        {
-            BUTTON(L("lcl_mobile_panel_filter"), {id: "search_submit", click: "orders_filter()", icon: "fa-fclt-refresh", datarel: "close" });
-        }
-        //BUTTON(L("lcl_home"), {id: "home", click: "orders_home()", icon: "fa-home", datarel: "close"});
         CONTROLGROUP_END();
 %>
         </form>
-    </div>
 <%
-    var p_useraction;
+    FILTER_PANEL_END();
-    // Het filterpanel moet alleen als er content is, dus hetzelfde criterium als hierboven. Dat mag tzt best uitgebreider.
-    if (S("mld_opdracht_flags") > 0)
-    {
-        p_useraction = {icon: "fa-filter-list", action: "openFilterPanel()", label: L("lcl_mld_filter")};
-    }
 
     var multiactions = [];
     if (user.has("WEB_ORDBOF") || user.has("WEB_ORDBO2")) {
@@ -551,10 +531,12 @@ if (!hasParamFlag)
     }
     var isGrouped = (grp_sel == "" && listmode == 2);
 
-    HEADER({title: listtitle,
+    HEADER({
-            useraction: p_useraction,
+        title: listtitle,
-            addaction: addaction,
+        filterPanel: S("mld_opdracht_flags") > 0,
-            multiactions: !isGrouped && multiactions.length});
+        addaction: addaction,
+        multiactions: !isGrouped && multiactions.length
+    });
 
     CONTENT_START();
 

APPL/PDA/setlocation.asp

@@ -158,7 +158,7 @@ function showError(error)
 }
 
 function loc_submit() {
-    var $selected = $("#alg_key.ui-controlgroup").find(".selected");
+    var $selected = $("#alg_key").find(".selected");
     if (!$selected.length)
     {
         jqToast(L("lcl_select_location"));
@@ -236,12 +236,15 @@ $(function()
     else
         gps_btn_params.click = "selectByGPS();";
     BUTTON(L("lcl_mobile_currentgps"), gps_btn_params);
-%>  <input type="text" placeholder="<%=L("lcl_autofilter")%>" id="filter">
+    CONTROLGROUP_END();
-<%
+    CONTROLGROUP_START();
+%>  <input type="text" id="filter" class="<%=MOBILE_UI_CLASSES.input%>" placeholder="<%=L("lcl_autofilter")%>">
+<%  CONTROLGROUP_END();
+    CONTROLGROUP_START();
     var oRs = Oracle.Execute(sql);
     if (!oRs.EoF)
     {
-%>      <fieldset id="alg_key" data-role="controlgroup" data-mini="true" data-filter="true" data-input="#filter"><%
+%>      <fieldset id="alg_key"><%
         while (!oRs.EoF)
         {
             BUTTON(safe.html(oRs("descr").Value), {
@@ -253,6 +256,8 @@ $(function()
 %>      </fieldset ><%
     }
     oRs.Close();
+    CONTROLGROUP_END();
+    CONTROLGROUP_START();
     BUTTON(L("lcl_select"), { click: "loc_submit()", icon: "fa-fclt-save" });
     CONTROLGROUP_END();
     IFACE.FORM_END();

APPL/PDA/user_info.asp

@@ -126,7 +126,7 @@ var photoMap  = thisUser.photomap;   // map waarin de foto wordt opgeslagen
     }
 
 </script>
-        <div style="text-align:center;">
+        <div>
         <form name="u2Photo" id="u2photo" method="post" enctype="multipart/form-data">
           <input type="hidden" name="noresize" id="noresize" value="0">
           <img id="photo" alt="<%=safe.htmlattr(L("fac_profiel")) + " " + safe.htmlattr(L("lcl_photos"))%>"
@@ -135,7 +135,9 @@ var photoMap  = thisUser.photomap;   // map waarin de foto wordt opgeslagen
 <%
         if (S("prs_use_edit_photo") && canChange)
         {
-            %><label><%=L("lcl_pda_change_photo")%></label><%
+            %>
+          <div class="flex-center">
+            <label for="photo"><%=L("lcl_pda_change_photo")%></label><%
 %>          <div class="attachments_form" style="display: none;">
                 <span class="attachments_form">
                   <span class="attachments_fields"></span>
@@ -154,6 +156,7 @@ var photoMap  = thisUser.photomap;   // map waarin de foto wordt opgeslagen
                   </span>
                 </span>
             </div>
+          </div>
 <%
             IFACE.FORM_END();
         }

APPL/Shared/calendar.inc

@@ -184,7 +184,7 @@ function _FCLTcalendar (fieldID, params)
   <input id="show_<%=fieldID%>"
          class="flddate<%=params.required?" required":""%><%=isMobile ? MOBILE_UI_CLASSES.input : ""%><%=params.addClass? " " + params.addClass : ""%>"
          type="<%=params.hidden?'hidden':(isMobile ? 'date' : 'text')%>" <%=hiddentag%>
-         value="<%=safe.htmlattr(iniTextDate)%>"
+         value="<%=safe.htmlattr(isMobile ? iniDateDate : iniTextDate)%>"
          autocomplete="off"
          nofollow="<%=params.nofollow? 1 : 0%>">
 
@@ -349,7 +349,7 @@ function _FCLTcalendar (fieldID, params)
                                                   return fnBeforeShowDay(date, selectableDay);
                                                 }
              }).change(cal_show_onChange)
-               .val("<%=safe.jsstring(iniTextDate)%>");
+               .val("<%=safe.jsstring(isMobile ? iniDateDate : iniTextDate)%>");
              $("#show_<%=fieldID%>").on('focus', function() { $("#show_<%=fieldID%>").datepicker('show'); });
 
        <% if (params.autoopen){ %>

APPL/Shared/default.css

@@ -232,34 +232,6 @@ i.btn_disabled
     pointer-events: none;
 }
 
-/* **************************************************** */
-/* **************************************************** */
-/* ******           UTILITY CLASSES            ******** */
-/* **************************************************** */
-/* **************************************************** */
-.pointer {
-    cursor: pointer;
-}
-
-.limit-lines-1,
-.limit-lines-2 {
-    display: -webkit-box;
-    overflow: hidden;
-    -webkit-box-orient: vertical;
-}
-.limit-lines-1 {
-    -webkit-line-clamp: 1;
-    line-clamp: 1;
-}
-.limit-lines-2 {
-    -webkit-line-clamp: 2;
-    line-clamp: 2;
-}
-
-.semibold {
-    font-weight: 600;
-}
-
 /* **************************************************** */
 /* *****                                          ***** */
 /* *****             LOGIN / PORTAL               ***** */
@@ -362,7 +334,8 @@ i.btn_disabled
     }
 }
 
-.otp label {
+.otp label,
+.otp label.active {
     color: #ffffff; /* todo */
     font-size: 1.25em;
 }
@@ -8821,6 +8794,29 @@ body::-webkit-scrollbar-thumb:horizontal { border-radius: 4px/50%; }
 //                 Utility classes                      //
 //                                                      //
 ////////////////////////////////////////////////////////*/
+.pointer {
+    cursor: pointer;
+}
+
+.limit-lines-1,
+.limit-lines-2 {
+    display: -webkit-box;
+    overflow: hidden;
+    -webkit-box-orient: vertical;
+}
+.limit-lines-1 {
+    -webkit-line-clamp: 1;
+    line-clamp: 1;
+}
+.limit-lines-2 {
+    -webkit-line-clamp: 2;
+    line-clamp: 2;
+}
+
+.semibold {
+    font-weight: 600;
+}
+
 .default-clickable-button {
     cursor: pointer;
     box-shadow: 0 1px 2px var(--fclt-body-color-25);

APPL/Shared/kenmerk_common.inc

@@ -641,7 +641,7 @@ function BijlagenButton(tfield, tprops, tparams)
 
         // Handtekening plaatje
         if (tfield.kdimensie == "xxx") {
-            res += "<img alt='" + safe.htmlattr(L("lcl_flex_preview")) + "' class='preview kenmerk'"
+            res += "<img alt='" + safe.htmlattr(L("lcl_flex_preview")) + "' id='preview_" + tprops.nameprefix + tfield.idCounter + "' class='preview kenmerk'"
                  + " onClick='" + safe.htmlattr(blg) + "'";
             if (lijst.length) {
                 res += " src=' " + protectQS.create(OpenFlexFile(tparams.module, lijst[0].key, { mime_type: "image/png", contentdp: "inline" }));
@@ -687,7 +687,8 @@ function BijlagenButton(tfield, tprops, tparams)
                 "click": blg,
                 "attributes": {
                     "isBijlage": "1",
-                    "nBijlagen": lijst.length
+                    "nBijlagen": lijst.length,
+                    "aria-controls": "preview_" + tprops.nameprefix + tfield.idCounter
                 }
             });
             res = "<div>" + res + "</div>"; // Wrap in divje om conditionele zichtbaarheid makkelijker te kunnen togglen
@@ -911,7 +912,7 @@ function kv2html(pfield, pparams)
                         + '</h4>';
             } else {
                 kvhtml += ('\n <label for="' + pparams.props.nameprefix + pfield.idCounter + 'val"'
-                        + (pfield.krolcode ? ' data-fclt-rolcode="' + pfield.krolcode + '"' : '') 
+                        + (pfield.krolcode ? ' data-fclt-rolcode="' + pfield.krolcode + '"' : '')
                         + '>' + safe_oms + (pparams.label_ext ? " "+pparams.label_ext : "") + pfield.separator
                         + (
                             (pfield.kdimensie != null && pfield.kdimensie != "xxx")

APPL/Shared/variables.css

@@ -62,6 +62,8 @@
     --fclt-body-bg: var(--bs-body-bg);
     --fclt-body-bg-rgb: var(--bs-body-bg-rgb);
 
+    --fclt-body-color-5: rgba(var(--fclt-body-color-rgb), 5%);
+    --fclt-body-color-10: rgba(var(--fclt-body-color-rgb), 10%);
     --fclt-body-color-25: rgba(var(--fclt-body-color-rgb), 25%);
     --fclt-body-color-50: rgba(var(--fclt-body-color-rgb), 50%);
     --fclt-body-color-100: rgba(var(--fclt-body-color-rgb), 100%);