<% /*
     $Revision$
     $Id$

     File:          Calendar.inc
     Description:   generic interface function for selecting a 'date' and/or time

*/ %>

<%
FCLTHeader.Requires({ plugins: ["jQuery"],
                      js: ["jquery-ui.js", "date.js"],
                      extrahead: _initVrijedagen });

if (!Date.prototype.toISOString) {
    Date.prototype.toISOString = function() {
        function pad(n) { return n < 10 ? '0' + n : n }
        return this.getUTCFullYear() + '-'
            + pad(this.getUTCMonth() + 1) + '-'
            + pad(this.getUTCDate()) + 'T'
            + pad(this.getUTCHours()) + ':'
            + pad(this.getUTCMinutes()) + ':'
            + pad(this.getUTCSeconds()) + 'Z';
    };
}

function _initVrijedagen()
{
  var sql = "SELECT mld_vrije_dagen_datum FROM mld_vrije_dagen";
  var oRs = Oracle.Execute(sql);
  var mld_vrije_dagen = "0";
  while (!oRs.Eof)
  {
      mld_vrije_dagen += ", " + (new Date(oRs("mld_vrije_dagen_datum").value)).getTime();
      oRs.MoveNext;
  }
  oRs.Close();
%>
  <script type="text/javascript">
    // Fix 'unspecfied error' op document.activeelement bij openen
    // http://bugs.jquery.com/ticket/13378
    var agent = navigator.userAgent;
    if (agent.match(/MSIE 7\.0|MSIE 8\.0|MSIE 9\.0/))
    {
        jQuery(function () { try { document.documentElement.focus(); } catch(e) {/* soms met IE8 op 'remembered' tabbladen */}  });
    }
    var mld_vrije_dagen = [<%=mld_vrije_dagen%>];
    var calArray = new Array();
    // Zie ook kenmerk_common.inc. Delen code was iets te lastig
    $(document).ready(function () {

        $.datepicker.setDefaults({
                altFormat: "@",
                // buttonImage: font-awesome calendar,
                // buttonImageOnly: true,
                // showOn: "<%=device.test(device.isMobile)?"focus":S("cal_showOn")%>",
                showOn: "none",
                dateFormat: 'D dd-mm-yy',
                changeYear: true,
                changeMonth: true,
                duration: 'fast',
                dayNames: calendar_names.days,
                dayNamesMin: calendar_names.daysMin,
                dayNamesShort: calendar_names.daysMin,
                weekHeader: calendar_names.weekMin,
                firstDay: 1,
                monthNamesShort: calendar_names.monthsShort,
                monthNames: calendar_names.months,
                showOtherMonths:true,
                selectOtherMonths:true,
                beforeShowDay: function(datum)
                    {
                        if ($.inArray(datum.getTime(), mld_vrije_dagen) > -1)
                            return [ true, 'ui-state-disabled' ];
                        else
                            return [ true, '' ];
                    },
                showWeek: true
            });
        })
   </script>
<%
}
// TODO met params.mode kan evt beperkingen worden meegegeven, vgl. suggest filtcode

// fieldID is het id van een datumveld in het formulier
// Daartoe wordt een hidden veld aangemaakt met dat id waar de geselecteerde datum in komt
// Een tweede show_<id> veld wordt aangemaakt met de zichtbare datum
//
// params
//      label: te tonen label
//      datum: default datum (jScript date object)
//      timeField ook van-tijd toestaan
//      timeStep in minuten bijvoorbeeld 15 voor kwartieren (wat de default is)
//      timeFrom bijvoorbeeld voor 8 uur 's ochtends (wat de default is)
//      trlass:   wordt ook op de <tr> gezet
//      maxFuture en maxPast: aantal dagen limitering. -1 voor geen limiet
//      trhidden: De hele tr moet hidden en niet alleen het inputveld
//      hidden: de calender is hidden (maar tijd is er mogelijk wel)
//              Bij afhankelijke calenders wordt de datum dan helemaal gelijk gehouden
//      timeTo bijvoorbeeld 18 voor 6 uur 's avonds (wat de default is)
//      readonly: Toon de calendar readonly. Dat wordt er uiteraard ook niets gesubmit (toch?)
//      saveValue: Ondanks het readonly zijn van de datum, deze toch opslaan (hidden waarden veld aanmaken en vullen).
//      onChange: functie om aan te roepen als datum gewijzigd is
//      onChangeDate: functie om aan te roepen als alleen het datumveld gewijzigd is
//      onChangeTime: functie om aan te roepen als alleen het tijdsveld gewijzigd is
//      TODO: TimeTo ook tot-tijd toestaan
function FCLTcalendar (fieldID, params)
{
    params = params || {};
    if ((params.datum == null || params.datum == "") && params.suppressEmpty)
      return; // snel klaar
    if (params.label)
    {
      if (params.mobile)
      { %>
        <div><label class="ed"><%=params.label%>:</label>
<%    }
      else
      { %>
        <tr <%=params.trclass? "class='" + params.trclass + "'" : ""%> <%=params.trhidden? "style='display:none'" : ""%>>
        <td class="label"><label for="show_<%=fieldID%>" style="white-space: nowrap;"><%=params.label%>:</label></td>
        <td>
    <% }
    }

    _FCLTcalendar (fieldID, params)

    if (params.label)
    {
      if (params.mobile)
      { %>
        </div>
<%    }
      else
      { %>
        </td></tr>
<%    }
    }
}

function _FCLTcalendar (fieldID, params)
{
  var initDate = params.datum || new Date();

  if (params.initEmpty == 1)
  {
      var iniDate = "";
      var iniDateVal = null;
      if (params.initTimeEmpty == 1)
        var iniTime = "";
      else
        var iniTime = toTimeString(initDate);
  }
  else
  {
      var iniDate = toDateString(initDate);
      var iniDateVal = initDate.valueOf();
      if (params.initTimeEmpty == 1)
        var iniTime = "";
      else
        var iniTime = toTimeString(initDate);
  }

  var readotag = params.readonly? " readonly" : "";
  var hiddentag = params.hidden? " style='display:none'" : ""; // Alleen op de calender, niet de tijd

  %>
  <input class="flddate<%=!params.readonly&&params.required?" required":""%><%=params.addClass? " " + params.addClass : ""%>" type="<%=params.hidden?"hidden":"text"%>" <%=readotag%> <%=hiddentag%> id="show_<%=fieldID%>" value="<%=iniDate%>" nofollow="<%=params.nofollow? 1 : 0%>">
<% if (!params.hidden && !params.readonly) { %>
  <i class='fa fa-calendar fa-fw dateklikker' onclick='$("#show_<%=fieldID%>").click().focus()'></i>
<% } %>
<%
  if (params.timeField)
  { %>
    <input type="text" step='<%=60*(params.timeStep||15)%>'
           class="fldtime<%=!params.readonly&&params.required?" required":"" + " " + (params.timeClass||"")%><%=params.addClass? " " + params.addClass : ""%>"
           id="time_from_<%=fieldID%>" <%=readotag%> size="5" value="<%=iniTime%>">
<%   if (!params.readonly) { %>
        <i class='fa fa-clock-o fa-fw timeklikker <%=(params.timeClass||"")%>' onclick='$("#time_from_<%=fieldID%>")[0].click(); FcltMgr.stopPropagation(event);'></i>
<%   }
   }


  if (!params.readonly || (params.readonly && params.saveValue))
  { %>
    <input type="hidden" id="<%=fieldID%>" name="<%=fieldID%>" value="<%=iniDateVal%>">
<%
  }
  if (params.readonly) return; // dan zijn we wel klaar
%>
  <script type="text/javascript">
    jQuery(document).ready(
      function()
      {
        $("#show_<%=fieldID%>")[0].onSelect = function()
        {
            cal_onChange('<%=fieldID%>',
                { volgnr: <%=params.volgnr?params.volgnr:'null'%>,
                  onChange: '<%=safe.jsstring(params.onChange)%>',
                  onChangeDate: '<%=safe.jsstring(params.onChangeDate)%>'});
        }
     <%   // Indien er niveau's zijn in tijd tussen meerdere kalenders
        if (params.volgnr)
        { %>
<%        if (params.volgnr == 1)
          { // Als er opnieuw kalenders worden geladen moet de calArray op nul worden gezet anders worden nieuwe kalenders aan de vorig toegevoegd.
            %>
            if (calArray.length > 0)
            {
              calArray.length = 0;
            }
<%        } %>

          // Nieuwe kalender wordt op volgorde toegevoegd aan calArray
          if (calArray.length == 0)
            calArray.push({ id: "<%=fieldID%>", volgnr: <%=params.volgnr%>}); // Eerste kalender wordt toegevoegd.
          else
          {
            // kalender op volgorde van volgnummer aan calArray toevoegen voor als er meer dan twee calenders worden gebruikt.
            // Toevoegen lege kalender
            // Is het veld al aanwezig dan veld in in calArray NIET toevoegen. Komt voor als calender via jquery load functie wordt herladen.
            var aanwezig = false;
            for (var i = 0; i < calArray.length; i++)
            {
              if (calArray[i].id == "<%=fieldID%>" && calArray[i].volgnr == <%=params.volgnr%>)
                aanwezig = true;
            }
            if (!aanwezig)
            {
              calArray.push({ id: "", volgnr: 0});
              for (var i = 1; i <= calArray.length; i++)
              {
                if (calArray.length - i > 0 && calArray[calArray.length-1-i].volgnr > <%=params.volgnr%>)
                { // Opschuiven
                  calArray[calArray.length - i].id = calArray[calArray.length - 1 - i].id;
                  calArray[calArray.length - i].volgnr = calArray[calArray.length - 1 - i].volgnr;
                }
                else
                { // Kalender toevoegen
                  calArray[calArray.length - i].id = "<%=fieldID%>";
                  calArray[calArray.length - i].volgnr = <%=params.volgnr%>;
                  break;
                }
              }
            }
          }
     <%   // TODO: Controle of Initiële datums op volgorde zijn.
          //for (var i = 1; i < calArray.length; i++)
          //{
          //  if (calArray[i].volgnr == < %=params.volgnr% > && $("#" + calArray[i-1].id).val() > $("#" + calArray[i].id).val())
          //    FcltMgr.alert("ERROR: Initiële datum van kalender met volgnummer " + calArray[i].volgnr + " is eerder als voorafgaande datum");
          //}

        } %>
        if (typeof Modernizr == "undefined" || !Modernizr.inputtypes.date)
        {
            $("#show_<%=fieldID%>").datepicker(
                {   altField: "#<%=fieldID%>",
                    // Volgorde in tijd: maxPast, minPast, sysdate, minFuture, maxFuture
                    <%=(params.minDate instanceof Date)? "minDate : new Date(" + params.minDate.valueOf() + ")," : ""%>
                    <%=(params.maxDate instanceof Date)? "maxDate : new Date(" + params.maxDate.valueOf() + ")," : ""%>
                    <%=(typeof params.maxPast == "number" && params.maxPast >= 0)? "minDate : '-" + params.maxPast + "d'," : ""%>
                    <%=(typeof params.minPast == "number" && params.minPast >= 0)? "maxDate : '-" + params.minPast + "d'," : ""%>
                    <%=(typeof params.maxFuture == "number" && params.maxFuture >= 0)? "maxDate : '+" + params.maxFuture + "d'," : ""%>
                    <%=(typeof params.minFuture == "number" && params.minFuture >= 0)? "minDate : '+" + params.minFuture + "d'," : ""%>
                    <%=(params.autosize)? "beforeShow: function(input, inst) { setTimeout('FcltMgr.resized(window)', 100) }," : ""%>
                    numberOfMonths: <%=(device.test(device.isMobile)?1:params.calendars) || 1%>,
                    <%= params.hidden? "showOn:'focus'," : ""%>
                    onSelect: $("#show_<%=fieldID%>")[0].onSelect
               }).change(cal_show_onChange);
               $("#show_<%=fieldID%>").on('focus', function() { $("#show_<%=fieldID%>").datepicker('show') });

         <% if (params.autoopen){ %>
              $("#show_<%=fieldID%>").datepicker('show');
         <% } %>
        }
        else
        {
            $("#show_<%=fieldID%>").attr("type", "date")
                                   .val("<%=iniDate?initDate.toISOString().substr(0,10):""%>")
                                   .change(function ()
                                        {
                                          var dt = new Date(this.value);
                                          $('#<%=fieldID%>').val(dt.getTime())
                                          $("#time_from_<%=fieldID%>").change();
                                        });
        }
<%
        if (params.timeField)
        {
          if (typeof params.startTime == "number")
          {
            var hh = Math.floor(params.startTime);
            var mi = params.startTime * 60 % 60;
            params.startTime = (hh < 10? "0" : "") + hh + ":" + (mi < 10? "0" : "") + mi;
          }
          if (typeof params.endTime == "number")
          {
            var hh = Math.floor(params.endTime);
            var mi = params.endTime * 60 % 60;
            params.endTime = (hh < 10? "0" : "") + hh + ":" + (mi < 10? "0" : "") + mi;
          }

%>
        if (typeof Modernizr == "undefined" || !Modernizr.inputtypes.date)
        {
          $("#time_from_<%=fieldID%>").timePicker(
              { step: <%=(params.timeStep || 15)%>,
                startTime : "<%=params.startTime%>",
                endTime : "<%=params.endTime%>",
                columns: <%=S("timepickercolumns")%>,
                onChange: function (newVal)
                {
                  $("#time_from_<%=fieldID%>").removeClass('bad');
                  if ($('#<%=fieldID%>').val() != "")
                  { // Er is een tijd ingevuld m.b.v. de timePicker
                    var dt = new Date(parseInt($('#<%=fieldID%>').val())).midnight();
                    var tm = $("#time_from_<%=fieldID%>").timePickerGetTime().getTime();
                    dt.setSeconds(tm / 1000); // setSeconds gaat goed om met zomertijd/wintertijd
                    $('#<%=fieldID%>').val(dt.getTime());
                  }
               <% if (params.volgnr)
                  { %>
                    cal_checkVolgnr("<%=fieldID%>", <%=params.volgnr%>, true);
               <% }
                  if (params.onChange) {
                    Response.Write(params.onChange);
                  }
                  if (params.onChangeTime) {
                    Response.Write(params.onChangeTime);
                  } %>
                }
              })
         }
        else
        {   // Native activeren
            $("#time_from_<%=fieldID%>").attr("type", "time")
        }

          $("#time_from_<%=fieldID%>").change(function () { time_show_onChange('time_from_<%=fieldID%>',
                                                                               '<%=fieldID%>',
                                                                               { volgnr: <%=params.volgnr?params.volgnr:'null'%>,
                                                                                 onChange: '<%=safe.jsstring(params.onChange)%>',
                                                                                 onChangeTime: '<%=safe.jsstring(params.onChangeTime)%>'}) })
                                      .focus(function () { this.select() });
<%      } %>
      });
  </script>
<%
}
%>