aBankingCalendar.prg

<?php
/**
 * @author MGHandy: 7/28/17
 * @package BankingCalendar
 *
 * @uses display dates indicating the credit union will be CLOSED for business.
 * view/edit: the current calendar year
 * view/edit the next calendar year
 * view the previous calendar year
 *
 * @param operation string: database operation to perform
 *   operation: readCalendar, updateCalendar
 * @param calendar string: year and list of dates to create or
 *  update.
 *
 * @return aryReply array: errors or information and calendar data
 */

require_once("$admLibrary/aBankingCalendar.i");

try {
  $admVars = array();
  $admOk = array(
    "operation" => array("filter" => FILTER_SANITIZE_STRING),
    "calendar" => array("filter" => FILTER_SANITIZE_STRING)
  );
  HCU_ImportVars($admVars, "CALENDAR", $admOk);

  $cOperation = isset($admVars["CALENDAR"]["operation"]) ? $admVars["CALENDAR"]["operation"] : null;
  $cCalendar = isset($admVars["CALENDAR"]["calendar"]) ? $admVars["CALENDAR"]["calendar"] : null;

  $aryResult = array();
  $aryReply = array();

  switch ($cOperation) {
    case "":
      PrintBankingCalendar();
      break;
    case "readCalendar":
      $yearCurrent = date("Y");
      $yearNext = date("Y") + 1;
      $yearLast = date("Y") - 1;

      $dataCurrent = BankingCalendarRead($SYSENV, $dbh, $Cu, $yearCurrent);
      $dataLast = BankingCalendarRead($SYSENV, $dbh, $Cu, $yearLast);
      $dataNext = BankingCalendarRead($SYSENV, $dbh, $Cu, $yearNext);

      $fechaPasado = $dataLast['calendar']['dates'];
      $fechaAhora = $dataCurrent['calendar']['dates'];
      $fechaSiguiente = $dataNext['calendar']['dates'];

      // New functionality: if the banking calendar is not created but there have been notifications then dates will be saved as '{"lastnotified":"11-01-2018"}'.
      // If there are dates, then the record is saved as '["01-01-2018"]'.  It is easier to check this way.
      $aryResult['data'][$yearCurrent] = $fechaAhora && substr(trim($fechaAhora), 0, 1) != "{" ? HCU_JsonDecode($fechaAhora) : null;
      $aryResult['data'][$yearLast] = $fechaPasado && substr(trim($fechaPasado), 0, 1) != "{" ? HCU_JsonDecode($fechaPasado) : null;
      $aryResult['data'][$yearNext] =  $fechaSiguiente && substr(trim($fechaSiguiente), 0, 1) != "{" ? HCU_JsonDecode($fechaSiguiente) : null;

      BankingCalendarReplay($aryResult, $aryReply, $cOperation);
      break;
    case "updateCalendar":
      $calendarValidate = BankingCalendarValidate($SYSENV, $cCalendar, true);
      $calendarYear = $calendarValidate['validate']['year'];
      $calendarDates = $calendarValidate['validate']['dates'];

      $calendarExists = BankingCalendarRead($SYSENV, $dbh, $Cu, $calendarYear);
      $calendarUpdate = null;
      if ($calendarExists['calendar']) {
        $calendarUpdate = BankingCalendarUpdate($SYSENV, $dbh, $Cu, $calendarYear, $calendarDates);
      } else {
        $calendarUpdate = BankingCalendarCreate($SYSENV, $dbh, $Cu, $calendarYear, $calendarDates);
      }

      $aryResult['info'] = $calendarUpdate['message'];
      $aryResult['data'] = $calendarUpdate['calendar'];
      BankingCalendarReplay($aryResult, $aryReply, $cOperation);
      break;
    default:
      throw new Exception("Unknown server request: " . $cOperation);
      break;
  }
} catch (Exception $e) {
  $aryReply['error'][] = $e->getMessage();
  $aryResult['data'] = array();
  $aryResult['info'] = array();

  BankingCalendarReplay($aryResult, $aryReply, $cOperation);
}

/**
 * @uses print all html and javascript neccessary for the user to
 * view and interact with the Banking Calendar feature.
 */
function PrintBankingCalendar() { ?>

<script type="text/javascript">
  <?php getShowWaitFunctions(); ?>

  var yearCurrent = new Date().getFullYear();
  var yearLast = yearCurrent -1;
  var yearNext = yearCurrent +1;

  var calendarData = {};
  var calendarDataSource = null;

  var window_stack = [];

  function InitDataSources() {

    calendarDataSource = new kendo.data.DataSource({
      transport: {
        read: {
          url: "main.prg",
          dataType: "json",
          contentType: "application/x-www-form-urlencoded",
          type: "GET",
          data: {
            ft: "52"
          },
          cache: false
        }
      },
      requestStart: function(request) {
        showWaitWindow();
      },
      requestEnd: function(response) {
        setTimeout(hideWaitWindow, 500);

        if (response.hasOwnProperty("response")) {
          if (response.response.hasOwnProperty("Results")) {
            var results = response.response.Results;

            if (results.hasOwnProperty("error")) {
              $.homecuValidator.homecuResetMessage = true;
              $.homecuValidator.displayMessage(results.error, $.homecuValidator.settings.statusError);
            } else if (results.hasOwnProperty("info")) {
              $.homecuValidator.homecuResetMessage = true;
              $.homecuValidator.displayMessage(results.info, $.homecuValidator.settings.statusSuccess);
            }
          } else {
            $.homecuValidator.displayMessage("Error Parsing Server", $.homecuValidator.settings.statusError);
          }
        } else {
          $.homecuValidator.displayMessage("Error Parsing Server", $.homecuValidator.settings.statusError);
        }
      },
      schema: {
        parse: function(data) {
          var results = null;
          var resultData = null;
          var resultOperation = null;

          if (data.hasOwnProperty("Results")) {
            results = data.Results;
            resultData = results.data;
            resultOperation = results.operation;
          }

          if (results.hasOwnProperty("error")) {
            return [];
          }

          if (resultData === null || resultData === undefined) {
            return [];
          }

          switch (resultOperation) {
            case "readCalendar":
              calendarData[yearCurrent] = resultData[yearCurrent] ?
                resultData[yearCurrent] : [];
              calendarData[yearLast] = resultData[yearLast] ?
                resultData[yearLast] : [];
              calendarData[yearNext] = resultData[yearNext] ?
                resultData[yearNext] : [];

              BuildCalendar(yearCurrent);
              ResetCalendar(yearCurrent);
              break;
            case "updateCalendar":

              break;
            default:
              break;
          }
          return [];
        }
      }
    });

    // set up initial structure for last year
    // set up initial structure for this year
    // set up initial structure for next year
    calendarData[yearLast] = [];
    calendarData[yearCurrent] = [];
    calendarData[yearNext] = [];

    yearChanged = {
      current: yearCurrent,
      selected: null,
      changed: false
    };
  }

  function InitDataViews() {

    // setup calendars for current year
    // setup calendars with initial data
    BuildCalendar(yearCurrent);
    ResetCalendar(yearCurrent);

    // initialize dropdown for year select
    $("#yearSelect").kendoDropDownList({
      dataSource: [
        { value: yearLast, text: yearLast },
        { value: yearCurrent, text: yearCurrent },
        { value: yearNext, text: yearNext }
      ],
      dataValueField: "value",
      dataTextField: "text",
      value: yearCurrent,
      select: function(e) {
        if (yearChanged.changed === false) {
          if (HasChanges(false)) {
            e.preventDefault();
            yearChanged.selected = e.dataItem.value;
            yearChanged.changed = true;
            $("#dialogDiscard").data("kendoDialog").open();
          }
        }
      },
      change: function(e) {
        // reset calendars to new year
        // reset calendar dates
        BuildCalendar(this.value());
        ResetCalendar(this.value());

        yearChanged.changed = false;
        yearChanged.current = parseInt(this.value());
      }
    }).trigger("change");

    $("#btnUpdate").on("click", function(e) {
      if (HasChanges(true)) {
        var _request = {
          operation: "updateCalendar",
          calendar: JSON.stringify({
            year: yearChanged.current,
            dates: calendarData[yearChanged.current]
          })
        };

        calendarDataSource.transport.options.read.type = "POST";
        calendarDataSource.read(_request);
      }
    });

    $("#lnkCancel").on("click", function(e) {
      if (HasChanges(false)) {
        $("#dialogReset").data("kendoDialog").open();
      }
    });

    $("#dialogDiscard").kendoDialog({
      title: "Discard Changes",
      model: true,
      visible: false,
      resizable: false,
      show: function() {
        window_stack.push(this);
      },
      close: function() {
        window_stack.pop();
        yearChanged.changed = false;
      },
      actions: [
        { text: "No",
          action: function() { }
        },
        {
          text: "Yes", primary: true,
          action: function() {
            $("#yearSelect").data("kendoDropDownList").value(yearChanged.selected);
            $("#yearSelect").data("kendoDropDownList").trigger("change");
          }
        }
      ]
    });

    $("#dialogReset").kendoDialog({
      title: "Discard Changes",
      model: true,
      visible: false,
      resizable: false,
      show: function() {
        window_stack.push(this);
      },
      close: function() {
        window_stack.pop();
      },
      actions: [
        { text: "No",
          action: function() { }
        },
        {
          text: "Yes", primary: true,
          action: function() {
            // reset calendars for currently select year
            // reset calendars for original data for currently select year
            var _year = yearChanged.current;
            BuildCalendar(_year);
            ResetCalendar(_year);
          }
        }
      ]
    });
  }

  function HasChanges(update) {
    var _hasChanges = false;
    var _year = yearChanged.current;
    var _yearData = calendarData[_year];

    // iterate all dates
    $("div[id^=calendar]").find("table tbody td").each(function(i) {
      var _cell = $(this);
      var _cellSelected = _cell.hasClass("local-date-selected");

      // check if cell isselected
      // selected: check if not in original data
      // not selected: check if in original data
      var _dateString = _cell.find("a").attr("title");
      if (_dateString) {
        var _date = kendo.toString(new Date(_dateString), "yyyy-MM-dd");
        var _dateIndex = $.inArray(_date, _yearData);

        if (_cellSelected) {
          if (_dateIndex === -1) {
            _hasChanges = true;

            // if update, add to list
            if (update) {
              _yearData.push(_date);
            }
          }
        } else {
          if (_dateIndex !== -1) {
            _hasChanges = true;

            // if update, remove from list
            if (update) {
              _yearData.splice(_dateIndex, 1);
            }
          }
        }
      }

    });

    return _hasChanges;
  }

  function BuildCalendar(year) {
    var _year = parseInt(year);

    $("div[id^=calendar]").each(function(i) {
      var _calendar = $(this);
      // must destroy calendars if they exist
      if (_calendar.data("kendoCalendar") !== undefined) {
        _calendar.data("kendoCalendar").destroy();
        _calendar.empty();
      }

      // re create calendars
      _calendar.kendoCalendar({
        footer: false,
        min: new Date(_year, i, 1),
        max: LastDayOfMonth(_year, i),
        change: function(e) {
          var _cell = this._cell;
          var _selected = _cell.hasClass("k-state-selected");

          if (_selected) {
            _cell.removeClass("k-state-selected");
          }
        },
        disableDates: function(date) {
          // if calendar year is
          var _weekday = date.getDay();
          var _year = date.getFullYear();

          // if year is last year, disable everything
          // if day is sturday or sunday disable
          if  (_year == yearLast) {
            return true;
          }

          if (_weekday == 0 || _weekday == 6) {
            return true;
          }
        }
      });

      // the main reason for destroying and re-creating is this event
      // gets overridden when changing the year
      _calendar.find("table tbody td").on("click", function() {
        var _cell = $(this);
        var _cellSelected = _cell.hasClass("local-date-selected");
        var _dateString = _cell.find("a").attr("title");
        var _year = yearChanged.current;
        _year = parseInt(_year);

        // this click event allows clicks on
        // cells without dates
        if (_dateString === undefined) {
          return false;
        } else {
          var _weekday = _dateString.split(",")[0];
          if (_weekday === "Saturday" || _weekday === "Sunday") {
            return false;
          }
        }

        // if calendar year iss last year, do not allow changes
        if (_year === yearLast) {
          return false;
        }

        if (_cellSelected) {
          _cell.removeClass("local-date-selected");
        } else {
          _cell.addClass("local-date-selected");
        }
      });
    });
  }

  function ResetCalendar(year) {
    var _year = parseInt(year);
    var _yearData = calendarData[_year];

    // iterate all calendars and days
    $("div[id^=calendar]").find("table tbody td").each(function(i) {
      var _cell = $(this);
      var _dateString = _cell.find("a").attr("title");

      if (_dateString) {
        var _date = kendo.toString(new Date(_dateString), "yyyy-MM-dd");
        var _dateIndex = $.inArray(_date, _yearData);

        if (_dateIndex !== -1) {
          _cell.addClass("local-date-selected");
        }
      }
    });
  }

  function LastDayOfMonth(year, month) {
    var _days = 32 - new Date(year, month, 32).getDate();
    return new Date(year, month, _days);
  }

  $(document).ready(function() {
    InitDataSources();
    InitDataViews();

    // begin read
    calendarDataSource.transport.options.read.type = "POST";
    calendarDataSource.read({
      operation: "readCalendar"
    });
  });

  $(document).on("click", ".k-overlay", function () {
    if(window_stack.length > 0) {
      window_stack[window_stack.length-1].close();
    }
  });

</script>

<style type="text/css">
  #bankingCalendar {
    max-width: 768px;
    margin-left: 0;
  }

  input[type="radio"],
  input[type="checkbox"] {
    margin-top: -3px;
  }

  div[id^="calendar"] .k-nav-prev,
  div[id^="calendar"] .k-nav-next {
    display: none;
  }

  div[id^="calendar"] .local-date-selected {
    border-color: #1a87cd;
    background-color: #1984c8;
    opacity: 0.7;
  }

  div[id^="calendar"] .local-date-selected a,
  div[id^="calendar"] .local-date-selected.k-today a {
    color: #fff;
  }

</style>

<br>
<div class="container-fluid" id="bankingCalendar">
  <div class="well well-sm col-sm-12">
    <h2>Banking Calendar</h2>

    <br>

    <div class="row">
      <div class="col-sm-12">
        <div class="hcu-secondary">
          <div class="vsgSecondary">
            <span>Use the calendar below to mark non-business days or holidays by clicking the day. </span>
          </div>
        </div>
      </div>
      <div class="col-sm-12">
        <input id="yearSelect">
      </div>
    </div>

    <br>

    <div class="row">
      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarJanuary"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarFebruary"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarMarch"></div>
      </div>
    </div>
    <div class="row">
      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarApril"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarMay"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarJune"></div>
      </div>
    </div>
    <div class="row">
      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarJuly"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarAugust"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarSeptember"></div>
      </div>
    </div>
    <div class="row">
      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarOctober"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarNovember"></div>
      </div>

      <div class="col-sm-4">
        <div class="hcu-all-100" id="calendarDecember"></div>
      </div>
    </div>
  </div>

  <div class="hcu-template">
    <div class="hcu-edit-buttons k-state-default">
      <a href="##" id="lnkCancel" style=""
        data-bind="events:{ click: scheduleCancel }">Cancel</a>
      &emsp;
      <a href="##" id="btnUpdate" class="k-button k-primary"
        data-bind="
          events:{ click: scheduleSave }">
        <i class="fa fa-check fa-lg"></i>Update
      </a>
    </div>
  </div>
</div>

<div id="dialogDiscard">
  <p>You are about to change years, any changes to this calendar will be lost.</p>
  <p>Do you wish to continue?</p>
</div>

<div id="dialogReset">
  <p>You are about to reset this calendar to the original data.</p>
  <p>Do you wish to continue?</p>
</div>

<?php }