added alert classes and supporting functions

README.md

@@ -1 +1,3 @@
 # atlhousingreport
+
+# Summary

classes/Alerts.php

@@ -0,0 +1,392 @@
+<?php
+
+// ============
+// Alerts Class
+// ============
+
+class Alerts extends Base {
+
+    // Variables.
+
+    private $current_user_id = "";
+    private $current_user_name = "";
+    private $current_user_email = "";
+    private $pagination_size = 20;
+    private $pagination_page = 1;
+
+    // ==================
+    // Class Constructor.
+    // ==================
+
+    public function __construct() {
+
+        set_error_handler(array($this, "displayError"));
+
+        date_default_timezone_set(self::TIMEZONE);
+
+        $this->current_user_id = $_SESSION[self::USER_ID] ?? "";
+        $this->current_user_name = $_SESSION[self::USER_NAME] ?? "";
+        $this->current_user_email = $_SESSION[self::USER_EMAIL] ?? "";
+
+        $this->pagination_page = $_SESSION[self::PAGINATION_PAGE] ?? 1;
+    }
+
+    // ============
+    // Setup Alerts
+    // ============
+
+    public function setupAlerts() {
+
+        $alerts = $this->getAlertsPage();
+
+        $popovers = (new Popovers())->getPopovers();
+
+        $XML = $this->mergeXML($alerts, "<XML/>");
+        $XML = $this->mergeXML($popovers, $XML);
+
+        $content = $this->applyXSL($XML, $this->getXSL("setupAlerts"));
+
+        $this->displayContent($content);
+    }
+
+    // =========
+    // Add Alert
+    // =========
+
+    public function addAlert() {
+
+        $step = filter_input(INPUT_POST, "step") ?: "prompt";
+
+        switch ($step) {
+
+            case "prompt":
+
+                $content = $this->applyXSL("", $this->getXSL("addAlert"));
+
+                $this->displayContent($content);
+
+                break;
+
+            case "add":
+
+                $alert_title = filter_input(INPUT_POST, "alert_title") ?: "";
+                $alert_starts_date = filter_input(INPUT_POST, "alert_starts_date") ?: "";
+                $alert_starts_time = filter_input(INPUT_POST, "alert_starts_time") ?: "";
+                $alert_expires_date = filter_input(INPUT_POST, "alert_expires_date") ?: "";
+                $alert_expires_time = filter_input(INPUT_POST, "alert_expires_time") ?: "";
+                $alert_message = filter_input(INPUT_POST, "alert_message") ?: "";
+
+                $alert_starts = date("Y-m-d H:i", strtotime("{$alert_starts_date} {$alert_starts_time}"));
+                $alert_expires = date("Y-m-d H:i", strtotime("{$alert_expires_date} {$alert_expires_time}"));
+
+                $SQL = "insert into alerts
+          
+                         (  alert_title,
+                            alert_started,
+                            alert_expired,
+                            alert_message,
+                            alert_creator,
+                            alert_created )
+                               
+                  VALUES ( :alert_title,
+                           :alert_started,
+                           :alert_expired,
+                           :alert_message,
+                           :alert_creator,
+                           :alert_created )";
+
+                $statement = $this->connect()->prepare($SQL);
+
+                $statement->bindValue(":alert_title", $alert_title);
+                $statement->bindValue(":alert_started", $alert_starts);
+                $statement->bindValue(":alert_expired", $alert_expires);
+                $statement->bindValue(":alert_message", $alert_message);
+                $statement->bindValue(":alert_creator", $this->current_user_name);
+                $statement->bindValue(":alert_created", $this->getTimestamp());
+
+                $statement->execute();
+
+                break;
+
+            default:
+
+                $this->displayHome();
+        }
+    }
+
+    // ============
+    // Delete Alert
+    // ============
+
+    public function deleteAlert() {
+
+        $alert_serial = filter_input(INPUT_POST, "alert_serial", FILTER_SANITIZE_NUMBER_INT) ?: 0;
+
+        $alert = $this->getAlert($alert_serial);
+
+        if ($alert->count() == 0) {
+            $this->logError("Invalid Alert ({$alert_serial}). " . __METHOD__);
+        }
+
+        $SQL = "delete from alerts
+                 where alert_serial = {$alert_serial}";
+
+        $this->executeSQL($SQL);
+    }
+
+    // ==========
+    // Edit Alert
+    // ==========
+
+    public function editAlert() {
+
+        $step = filter_input(INPUT_POST, "step") ?: "prompt";
+
+        switch ($step) {
+
+            case "prompt":
+
+                $alert_serial = filter_input(INPUT_POST, "alert_serial", FILTER_SANITIZE_NUMBER_INT) ?: 0;
+
+                $alert = $this->getAlert($alert_serial);
+
+                if ($alert->count() == 0) {
+                    $this->logError("Invalid Alert ({$alert_serial}): " . __METHOD__);
+                }
+
+                $content = $this->applyXSL($alert, $this->getXSL("editAlert"));
+
+                $this->displayContent($content);
+
+                break;
+
+            case "update":
+
+                $alert_serial = filter_input(INPUT_POST, "alert_serial") ?: 0;
+                $alert_title = filter_input(INPUT_POST, "alert_title") ?: "";
+                $alert_starts_date = filter_input(INPUT_POST, "alert_starts_date") ?: "";
+                $alert_starts_time = filter_input(INPUT_POST, "alert_starts_time") ?: "";
+                $alert_expires_date = filter_input(INPUT_POST, "alert_expires_date") ?: "";
+                $alert_expires_time = filter_input(INPUT_POST, "alert_expires_time") ?: "";
+                $alert_message = filter_input(INPUT_POST, "alert_message") ?: "";
+
+                $alert_starts = date("Y-m-d H:i", strtotime("{$alert_starts_date} {$alert_starts_time}"));
+                $alert_expires = date("Y-m-d H:i", strtotime("{$alert_expires_date} {$alert_expires_time}"));
+
+                $alert = $this->getAlert($alert_serial);
+
+                if ($alert->count() === 0) {
+                    $this->logError("Invalid Alert ({$alert_serial}). " . __METHOD__);
+                }
+
+                $connection = $this->connect();
+
+                $SQL = "update alerts
+                           set alert_title   = :alert_title,
+                               alert_started = :alert_started,
+                               alert_expired = :alert_expired,
+                               alert_message = :alert_message
+                         where alert_serial  = :alert_serial";
+
+                $statement = $connection->prepare($SQL);
+
+                $statement->bindValue(":alert_serial", $alert_serial);
+                $statement->bindValue(":alert_title", $alert_title);
+                $statement->bindValue(":alert_started", $alert_starts);
+                $statement->bindValue(":alert_expired", $alert_expires);
+                $statement->bindValue(":alert_message", $alert_message);
+
+                $statement->execute();
+
+                break;
+
+            default:
+
+                $this->displayHome();
+        }
+    }
+
+    // =====================
+    // Return a Alert Object
+    // =====================
+
+    public function getAlert($alert_serial = 0) {
+
+        $SQL = "select *,
+                   date_format(alert_started, '%Y')                 as alert_started_year,
+                   date_format(alert_started, '%m')                 as alert_started_month,
+                   date_format(alert_started, '%b')                 as alert_started_month_abbreviated,
+                   date_format(alert_started, '%M')                 as alert_started_month_verbose,
+                   date_format(alert_started, '%d')                 as alert_started_day,
+                   date_format(alert_started, '%a')                 as alert_started_day_abbreviated,
+                   date_format(alert_started, '%W')                 as alert_started_day_verbose,
+                   date_format(alert_started, '%Y-%m-%d')           as alert_started_date,
+                   date_format(alert_started, '%W, %M %D')          as alert_started_date_verbose,
+                   date_format(alert_started, '%H:%i')              as alert_started_time,
+                   date_format(alert_started, '%l:%i %p')           as alert_started_time_verbose,
+                   date_format(alert_started, '%Y-%m-%d %l:%i %p')  as alert_started_verbose,
+
+                   date_format(alert_expired, '%Y')                as alert_expired_year,
+                   date_format(alert_expired, '%m')                as alert_expired_month,
+                   date_format(alert_expired, '%b')                as alert_expired_month_abbreviated,
+                   date_format(alert_expired, '%M')                as alert_expired_month_verbose,
+                   date_format(alert_expired, '%d')                as alert_expired_day,
+                   date_format(alert_expired, '%a')                as alert_expired_day_abbreviated,
+                   date_format(alert_expired, '%W')                as alert_expired_day_verbose,
+                   date_format(alert_expired, '%Y-%m-%d')          as alert_expired_date,
+                   date_format(alert_expired, '%W, %M %D')         as alert_expired_date_verbose,
+                   date_format(alert_expired, '%H:%i')             as alert_expired_time,
+                   date_format(alert_expired, '%l:%i %p')          as alert_expired_time_verbose,
+                   date_format(alert_expired, '%Y-%m-%d %l:%i %p') as alert_expired_verbose
+
+              from alerts
+
+             where alert_serial = {$alert_serial}";
+
+        return $this->getTable("alerts", $SQL);
+    }
+
+    // ========================
+    // Return a Alerts Object
+    // ========================
+
+    public function getAlerts() {
+
+        $SQL = "select view_alerts.* 
+                  from view_alerts";
+
+        return $this->getTable("alerts", $SQL);
+    }
+
+    // ===========================
+    // Return a Alerts Page Object
+    // ===========================
+
+    public function getAlertsPage() {
+
+        // Find Criteria
+
+        $find_alert = filter_input(INPUT_POST, "find_alert") ?: "";
+        $find_words = $this->sanitizeString($find_alert);
+
+        // Show Per Page
+
+        $this->pagination_size = filter_input(INPUT_POST, "alerts_per_page", FILTER_SANITIZE_NUMBER_INT) ?: $this->pagination_size;
+
+        // Record Count
+
+        $connection = $this->connect();
+
+        $SQL = "select count(*) as count
+                  from view_alerts
+                 where alert_title regexp :alert_title";
+
+        $statement = $connection->prepare($SQL);
+
+        $statement->bindValue(":alert_title", $find_words);
+
+        $statement->execute();
+
+        $recordset = $statement->fetch(PDO::FETCH_ASSOC);
+
+        $count = (count($recordset) > 0) ? (integer) $recordset["count"] : (integer) 0;
+
+        // Pagination
+
+        $pagination = filter_input(INPUT_POST, "pagination") ?: "";
+
+        switch ($pagination) {
+
+            case "first" : $this->pagination_page = 1;
+                break;
+            case "previous" : $this->pagination_page = max(($this->pagination_page - 1), 1);
+                break;
+            case "next" : $this->pagination_page = ($this->pagination_page + 1);
+                break;
+            case "last" : $this->pagination_page = ($count / $this->pagination_size);
+                break;
+        }
+
+        $offset = (($this->pagination_page * $this->pagination_size) - $this->pagination_size);
+        $start = ($offset + 1);
+        $end = min($count, (($start + $this->pagination_size) - 1));
+
+        // Data
+
+        $SQL = "select view_alerts.*
+                  from view_alerts
+                 where alert_title regexp :alert_title
+                 limit {$this->pagination_size}
+                offset {$offset}";
+
+        $statement = $connection->prepare($SQL);
+
+        $statement->bindValue(":alert_title", $find_words);
+
+        $statement->execute();
+
+        $alerts = $this->getTableXML("alerts", $statement);
+
+        // Insert Pagination Attributes
+
+        $alerts->addAttribute("count", $count);
+        $alerts->addAttribute("start", $start);
+        $alerts->addAttribute("end", $end);
+        $alerts->addAttribute("page", $this->pagination_page);
+
+        $_SESSION[self::PAGINATION_PAGE] = $this->pagination_page;
+
+        return $alerts;
+    }
+
+    // ===============================
+    // Return an Active Alerts Object.
+    // ===============================
+
+    public function getActiveAlerts() {
+
+        $SQL = "select *,
+
+                   date_format(alert_started, '%Y')                 as alert_started_year,
+                   date_format(alert_started, '%m')                 as alert_started_month,
+                   date_format(alert_started, '%b')                 as alert_started_month_abbreviated,
+                   date_format(alert_started, '%M')                 as alert_started_month_verbose,
+                   date_format(alert_started, '%d')                 as alert_started_day,
+                   date_format(alert_started, '%a')                 as alert_started_day_abbreviated,
+                   date_format(alert_started, '%W')                 as alert_started_day_verbose,
+                   date_format(alert_started, '%Y-%m-%d')           as alert_started_date,
+                   date_format(alert_started, '%W, %M %D')          as alert_started_date_verbose,
+                   date_format(alert_started, '%H:%i')              as alert_started_time,
+                   date_format(alert_started, '%l:%i %p')           as alert_started_time_verbose,
+                   date_format(alert_started, '%Y-%m-%d %l:%i %p')  as alert_started_verbose,
+
+                   date_format(alert_expired, '%Y')                as alert_expired_year,
+                   date_format(alert_expired, '%m')                as alert_expired_month,
+                   date_format(alert_expired, '%b')                as alert_expired_month_abbreviated,
+                   date_format(alert_expired, '%M')                as alert_expired_month_verbose,
+                   date_format(alert_expired, '%d')                as alert_expired_day,
+                   date_format(alert_expired, '%a')                as alert_expired_day_abbreviated,
+                   date_format(alert_expired, '%W')                as alert_expired_day_verbose,
+                   date_format(alert_expired, '%Y-%m-%d')          as alert_expired_date,
+                   date_format(alert_expired, '%W, %M %D')         as alert_expired_date_verbose,
+                   date_format(alert_expired, '%H:%i')             as alert_expired_time,
+                   date_format(alert_expired, '%l:%i %p')          as alert_expired_time_verbose,
+                   date_format(alert_expired, '%Y-%m-%d %l:%i %p') as alert_expired_verbose
+
+              from alerts
+
+             where (alert_started < now() and alert_expired > now())
+
+          order by alert_expired";
+
+        $alerts = $this->getTable("alerts", $SQL);
+
+        foreach ($alerts as $alert) {
+            $alert->alert_time_elapsed = $this->getTimeElapsed((string) $alert->alert_started);
+        }
+
+        return $alerts;
+    }
+}
+
+?>

classes/Base.php

@@ -90,6 +90,8 @@ class Base {
         $XSLParms["RANDOM_NUMBER"] = rand();
         $XSLParms["TODAY_YYYYMMDD"] = date("Y-m-d");
         $XSLParms["TODAY_MMDDYYYY"] = date("m/d/Y");
+        $XSLParms["TODAY_HHMM"] = date("Hi");
+        $XSLParms["COPYRIGHT"] = date("Y");
 
         $XML = new DOMDocument();
         $XSL = new DOMDocument();

classes/Subscriptions.php

@@ -577,9 +577,11 @@ class Subscriptions extends Base {
     public function userSubscriptions() {
 
         $subscriptions = $this->getUsersActiveSubscriptions($this->current_user_serial);
+        $alerts = (new Alerts())->getActiveAlerts();
         $popovers = (new Popovers())->getPopovers();
 
         $XML = $this->mergeXML($subscriptions, "<XML/>");
+        $XML = $this->mergeXML($alerts, $XML);
         $XML = $this->mergeXML($popovers, $XML);
 
         $content = $this->applyXSL($XML, $this->getXSL("userSubscriptions"));
@@ -602,7 +604,7 @@ class Subscriptions extends Base {
 
         return $this->getTable("usersubscriptions", $SQL);
     }
-    
+
     // ============================
     // Return a Users Subscriptions
     // ============================

js/addAlert.js

@@ -0,0 +1,255 @@
+
+// =========
+// Add Alert
+// =========
+
+$(document).ready(function () {
+
+    var $application = $("#APPLICATION_MNEMONIC").val(), $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}"), $CKEditor;
+
+    // ----------------------
+    // Initialize the Editor.
+    // ----------------------
+
+    ClassicEditor
+            .create(document.querySelector('#alert_message'), {
+                toolbar: {
+                    items: [
+                        'heading',
+                        '|',
+                        'bold',
+                        'italic',
+                        'underline',
+                        'link',
+                        'bulletedList',
+                        'numberedList',
+                        '|',
+                        'fontColor',
+                        'fontSize',
+                        'fontFamily',
+                        '|',
+                        'indent',
+                        'outdent',
+                        'alignment',
+                        '|',
+                        'horizontalLine',
+                        'insertTable',
+                        '|',
+                        'undo',
+                        'redo',
+                        '|'
+                    ]},
+                link: {
+                    addTargetToExternalLinks: true,
+                    defaultProtocol: "http://"
+
+                }
+            })
+            .then(editor => {
+                $CKEditor = editor;
+            })
+            .catch(error => {
+                console.error('CK-Editor error...');
+                console.error(error);
+            });
+
+
+    // ------------
+    // Date Pickers
+    // ------------
+
+    $("#alert_starts_date").datepicker({format: "yyyy-mm-dd",
+        container: "div.starts-date",
+        keyboardNavigation: false,
+        autoclose: true,
+        orientation: "bottom",
+        todayBtn: "linked",
+        todayHighlight: true});
+
+    $("#alert_expires_date").datepicker({format: "yyyy-mm-dd",
+        container: "div.expires-date",
+        keyboardNavigation: false,
+        autoclose: true,
+        orientation: "bottom",
+        todayBtn: "linked",
+        todayHighlight: true});
+
+    $("#alert_starts_time").inputmask({alias: "datetime",
+        placeholder: "HH:MM",
+        inputFormat: "HH:MM",
+        insertMode: false,
+        showMaskOnHover: false,
+        hourFormat: 24
+    });
+
+    $("#alert_expires_time").inputmask({alias: "datetime",
+        placeholder: "HH:MM",
+        inputFormat: "HH:MM",
+        insertMode: false,
+        showMaskOnHover: false,
+        hourFormat: 24
+    });
+
+    // ---------------------
+    // Show Calendar Buttons
+    // ---------------------
+
+    $(".btnAlertStartDateCalendar").on("click", function (e) {
+        e.preventDefault();
+        $("#alert_starts_date").focus().datepicker("show");
+    });
+
+    $(".btnAlertExpiresDateCalendar").on("click", function (e) {
+        e.preventDefault();
+        $("#alert_expires_date").focus().datepicker("show");
+    });
+
+
+    $("#alert_starts_date").on("blur", function () {
+        $("#alert_starts_time").focus();
+    });
+
+    $("#alert_expires_date").on("blur", function () {
+        $("#alert_expires_time").focus();
+    });
+
+    // -----------
+    // Save Button
+    // -----------
+
+    $(".btnSave").on("click", function (e) {
+
+        e.preventDefault();
+
+        $("#addAlert").submit();
+
+    });
+
+    // -------------
+    // Cancel Button
+    // -------------
+
+    $(".btnCancel").on("click", function () {
+
+        $sessionStorage.action = $sessionStorage.addAlert || "";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        formSubmit($sessionStorage);
+
+    });
+
+    // ---------------
+    // Validate Inputs
+    // ---------------
+
+    $("#addAlert").submit(function (e) {
+
+        var alert_title = $("#alert_title"),
+                alert_starts_date = $("#alert_starts_date"),
+                alert_starts_time = $("#alert_starts_time"),
+                alert_expires_date = $("#alert_expires_date"),
+                alert_expires_time = $("#alert_expires_time"),
+                alert_message = $("#alert_message");
+
+        clearInputErrors();
+
+        alert_title.val(alert_title.val().replace(/\s+/g, " ").trim());
+
+        if (isBlank(alert_title)) {
+            createInputError(alert_title, "Title is required");
+            return false;
+        }
+
+
+        if ((!isBlank(alert_starts_date)) && (!isDate(alert_starts_date))) {
+            createInputError(alert_starts_date, "Date is invalid");
+            return false;
+        }
+
+        if (isBlank(alert_starts_time)) {
+            createInputError(alert_starts_time, "Please enter a Time");
+            return false;
+        }
+
+        if (!alert_starts_time.inputmask("isComplete")) {
+            createInputError(alert_starts_time, "Please enter a Time");
+            return false;
+        }
+
+        if (isBlank(alert_expires_date)) {
+            createInputError(alert_expires_date, "Please enter a Date");
+            return false;
+        }
+
+        if ((!isBlank(alert_expires_date)) && (!isDate(alert_expires_date))) {
+            createInputError(alert_expires_date, "Date is invalid");
+            return false;
+        }
+
+        if (isBlank(alert_expires_time)) {
+            createInputError(alert_expires_time, "Please enter a Time");
+            return false;
+        }
+
+        if (!alert_expires_time.inputmask("isComplete")) {
+            createInputError(alert_expires_time, "Please enter a Time");
+            return false;
+        }
+
+//        if (isBlank(alert_message)) {
+//            createInputError(alert_message, "Please enter a Message");
+//            return false;
+//        }
+
+        if (!checkDateTime(alert_starts_date, alert_starts_time, alert_expires_date, alert_expires_time)) {
+            createInputError(alert_expires_time, "Cannot be prior to Start");
+            return false;
+        }
+
+        e.preventDefault();
+
+        $CKEditor.updateSourceElement();
+
+        $.post("./", $(this).serialize())
+
+                .done(function () {
+
+                    $sessionStorage.action = $sessionStorage.addAlert || "";
+
+                    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+                    formSubmit($sessionStorage);
+
+                });
+
+    });
+
+});
+
+// -----------------------------------------------------
+// Expires date/time cannot be prior to Start date/time.
+// -----------------------------------------------------
+
+function checkDateTime(alert_starts_date, alert_starts_time, alert_expires_date, alert_expires_time) {
+
+    var starts_date_parts = alert_starts_date.val().split("-"),
+            starts_time_parts = alert_starts_time.val().split(":"),
+            expires_date_parts = alert_expires_date.val().split("-"),
+            expires_time_parts = alert_expires_time.val().split(":"),
+            starts_date,
+            expires_date;
+
+    starts_date = new Date(starts_date_parts[0], parseInt(starts_date_parts[1], 10) - 1, starts_date_parts[2]);
+    expires_date = new Date(expires_date_parts[0], parseInt(expires_date_parts[1], 10) - 1, expires_date_parts[2]);
+
+    starts_date.setHours(starts_time_parts[0], starts_time_parts[1], 0, 0);
+    expires_date.setHours(expires_time_parts[0], expires_time_parts[1], 0, 0);
+
+    if (expires_date.getTime() < starts_date.getTime()) {
+        return false;
+    } else {
+        return true;
+    }
+
+}

js/addDropdown.js

@@ -3,66 +3,66 @@
 // Add Dropdown
 // ============
 
-$(document).ready(function() {
+$(document).ready(function () {
 
-  var $application    = "ATLHOUSINGREPORT",
+    var $application = $("#APPLICATION_MNEMONIC").val(),
-      $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
+            $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
-  
-  // -----------
-  // Save Button
-  // -----------
-  
-  $(".btnSave").on("click", function(e) {
-    e.preventDefault();
-    $("#addDropdown").submit();
-  });
 
-  // --------------
+    // -----------
-  // Cancel Button.
+    // Save Button
-  // --------------
+    // -----------
 
-  $(".btnCancel").on("click", function() {
+    $(".btnSave").on("click", function (e) {
-    formSubmit({ action : $sessionStorage.addDropdown });
+        e.preventDefault();
-  });
+        $("#addDropdown").submit();
-
-  // ---------------
-  // Validate Inputs
-  // ---------------
-
-  $("#addDropdown").submit( function(e) {
-
-    var dropdowntype_serial = $("#dropdowntype_serial").val(),
-        dropdown_value      = $("#dropdown_value");
-        
-    clearInputErrors();
-    
-    dropdown_value.val(trimString(dropdown_value.val()));
-
-    if (isBlank(dropdown_value)) {
-      createInputError(dropdown_value, "Value is required");
-      return false;
-    }
-    
-    if (formPost({ action : "Dropdowns.dropdownExists", dropdowntype_serial : dropdowntype_serial, dropdown_serial : 0, dropdown_value : dropdown_value.val() }) === true) {
-      createInputError(dropdown_value, "Value already exists");
-      return false;
-    }
-    
-    e.preventDefault();
-    
-    $.post("./", $(this).serialize())
-    
-      .done(function() {
-    
-        $sessionStorage.action = $sessionStorage.addDropdown || "";
-        $sessionStorage.toast  = "Dropdown was Added";
-
-        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-
-        formSubmit($sessionStorage);
-    
     });
-    
+
-  });
+    // --------------
-  
+    // Cancel Button.
+    // --------------
+
+    $(".btnCancel").on("click", function () {
+        formSubmit({action: $sessionStorage.addDropdown});
+    });
+
+    // ---------------
+    // Validate Inputs
+    // ---------------
+
+    $("#addDropdown").submit(function (e) {
+
+        var dropdowntype_serial = $("#dropdowntype_serial").val(),
+                dropdown_value = $("#dropdown_value");
+
+        clearInputErrors();
+
+        dropdown_value.val(trimString(dropdown_value.val()));
+
+        if (isBlank(dropdown_value)) {
+            createInputError(dropdown_value, "Value is required");
+            return false;
+        }
+
+        if (formPost({action: "Dropdowns.dropdownExists", dropdowntype_serial: dropdowntype_serial, dropdown_serial: 0, dropdown_value: dropdown_value.val()}) === true) {
+            createInputError(dropdown_value, "Value already exists");
+            return false;
+        }
+
+        e.preventDefault();
+
+        $.post("./", $(this).serialize())
+
+                .done(function () {
+
+                    $sessionStorage.action = $sessionStorage.addDropdown || "";
+                    $sessionStorage.toast = "Dropdown was Added";
+
+                    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+                    formSubmit($sessionStorage);
+
+                });
+
+    });
+
 });

js/addDropdowntype.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/addStatus.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/content.js

@@ -263,6 +263,23 @@ $(document).ready(function () {
 
     });
 
+    // --------------
+    // Setup Alerts
+    // --------------
+
+    $(".setup-alerts").on("click", function () {
+
+        $sessionStorage.action = "Alerts.setupAlerts";
+        $sessionStorage.pagination = "first";
+        $sessionStorage.find_alert = "";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        formSubmit($sessionStorage);
+
+    });
+
+
     // -------------
     // Setup Reports
     // -------------

js/editAlert.js

@@ -0,0 +1,255 @@
+
+// ==========
+// Edit Alert
+// ==========
+
+$(document).ready(function () {
+
+    var $application = $("#APPLICATION_MNEMONIC").val(), $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}"), $CKEditor;
+
+    // ----------------------
+    // Initialize the Editor.
+    // ----------------------
+
+    ClassicEditor
+            .create(document.querySelector('#alert_message'), {
+                toolbar: {
+                    items: [
+                        'heading',
+                        '|',
+                        'bold',
+                        'italic',
+                        'underline',
+                        'link',
+                        'bulletedList',
+                        'numberedList',
+                        '|',
+                        'fontColor',
+                        'fontSize',
+                        'fontFamily',
+                        '|',
+                        'indent',
+                        'outdent',
+                        'alignment',
+                        '|',
+                        'horizontalLine',
+                        'insertTable',
+                        '|',
+                        'undo',
+                        'redo',
+                        '|'
+                    ]},
+                link: {
+                    addTargetToExternalLinks: true,
+                    defaultProtocol: "http://"
+
+                }
+            })
+            .then(editor => {
+                $CKEditor = editor;
+            })
+            .catch(error => {
+                console.error('CK-Editor error...');
+                console.error(error);
+            });
+
+
+    // ------------
+    // Date Pickers
+    // ------------
+
+    $("#alert_starts_date").datepicker({format: "yyyy-mm-dd",
+        container: "div.starts-date",
+        keyboardNavigation: false,
+        autoclose: true,
+        orientation: "bottom",
+        todayBtn: "linked",
+        todayHighlight: true});
+
+    $("#alert_expires_date").datepicker({format: "yyyy-mm-dd",
+        container: "div.expires-date",
+        keyboardNavigation: false,
+        autoclose: true,
+        orientation: "bottom",
+        todayBtn: "linked",
+        todayHighlight: true});
+
+    $("#alert_starts_time").inputmask({alias: "datetime",
+        placeholder: "HH:MM",
+        inputFormat: "HH:MM",
+        insertMode: false,
+        showMaskOnHover: false,
+        hourFormat: 24
+    });
+
+    $("#alert_expires_time").inputmask({alias: "datetime",
+        placeholder: "HH:MM",
+        inputFormat: "HH:MM",
+        insertMode: false,
+        showMaskOnHover: false,
+        hourFormat: 24
+    });
+
+    // ---------------------
+    // Show Calendar Buttons
+    // ---------------------
+
+    $(".btnAlertStartDateCalendar").on("click", function (e) {
+        e.preventDefault();
+        $("#alert_starts_date").focus().datepicker("show");
+    });
+
+    $(".btnAlertExpiresDateCalendar").on("click", function (e) {
+        e.preventDefault();
+        $("#alert_expires_date").focus().datepicker("show");
+    });
+
+
+    $("#alert_starts_date").on("blur", function () {
+        $("#alert_starts_time").focus();
+    });
+
+    $("#alert_expires_date").on("blur", function () {
+        $("#alert_expires_time").focus();
+    });
+
+    // -----------
+    // Save Button
+    // -----------
+
+    $(".btnSave").on("click", function (e) {
+
+        e.preventDefault();
+
+        $("#editAlert").submit();
+
+    });
+
+    // -------------
+    // Cancel Button
+    // -------------
+
+    $(".btnCancel").on("click", function () {
+
+        $sessionStorage.action = $sessionStorage.editAlert || "";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        formSubmit($sessionStorage);
+
+    });
+
+    // ---------------
+    // Validate Inputs
+    // ---------------
+
+    $("#editAlert").submit(function (e) {
+
+        var alert_title = $("#alert_title"),
+                alert_starts_date = $("#alert_starts_date"),
+                alert_starts_time = $("#alert_starts_time"),
+                alert_expires_date = $("#alert_expires_date"),
+                alert_expires_time = $("#alert_expires_time"),
+                alert_message = $("#alert_message");
+
+        clearInputErrors();
+
+        alert_title.val(alert_title.val().replace(/\s+/g, " ").trim());
+
+        if (isBlank(alert_title)) {
+            createInputError(alert_title, "Title is required");
+            return false;
+        }
+
+
+        if ((!isBlank(alert_starts_date)) && (!isDate(alert_starts_date))) {
+            createInputError(alert_starts_date, "Date is invalid");
+            return false;
+        }
+
+        if (isBlank(alert_starts_time)) {
+            createInputError(alert_starts_time, "Please enter a Time");
+            return false;
+        }
+
+        if (!alert_starts_time.inputmask("isComplete")) {
+            createInputError(alert_starts_time, "Please enter a Time");
+            return false;
+        }
+
+        if (isBlank(alert_expires_date)) {
+            createInputError(alert_expires_date, "Please enter a Date");
+            return false;
+        }
+
+        if ((!isBlank(alert_expires_date)) && (!isDate(alert_expires_date))) {
+            createInputError(alert_expires_date, "Date is invalid");
+            return false;
+        }
+
+        if (isBlank(alert_expires_time)) {
+            createInputError(alert_expires_time, "Please enter a Time");
+            return false;
+        }
+
+        if (!alert_expires_time.inputmask("isComplete")) {
+            createInputError(alert_expires_time, "Please enter a Time");
+            return false;
+        }
+
+//        if (isBlank(alert_message)) {
+//            createInputError(alert_message, "Please enter a Message");
+//            return false;
+//        }
+
+        if (!checkDateTime(alert_starts_date, alert_starts_time, alert_expires_date, alert_expires_time)) {
+            createInputError(alert_expires_time, "Cannot be prior to Start");
+            return false;
+        }
+
+        e.preventDefault();
+
+        $CKEditor.updateSourceElement();
+
+        $.post("./", $(this).serialize())
+
+                .done(function () {
+
+                    $sessionStorage.action = $sessionStorage.addAlert || "";
+
+                    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+                    formSubmit($sessionStorage);
+
+                });
+
+    });
+
+});
+
+// -----------------------------------------------------
+// Expires date/time cannot be prior to Start date/time.
+// -----------------------------------------------------
+
+function checkDateTime(alert_starts_date, alert_starts_time, alert_expires_date, alert_expires_time) {
+
+    var starts_date_parts = alert_starts_date.val().split("-"),
+            starts_time_parts = alert_starts_time.val().split(":"),
+            expires_date_parts = alert_expires_date.val().split("-"),
+            expires_time_parts = alert_expires_time.val().split(":"),
+            starts_date,
+            expires_date;
+
+    starts_date = new Date(starts_date_parts[0], parseInt(starts_date_parts[1], 10) - 1, starts_date_parts[2]);
+    expires_date = new Date(expires_date_parts[0], parseInt(expires_date_parts[1], 10) - 1, expires_date_parts[2]);
+
+    starts_date.setHours(starts_time_parts[0], starts_time_parts[1], 0, 0);
+    expires_date.setHours(expires_time_parts[0], expires_time_parts[1], 0, 0);
+
+    if (expires_date.getTime() < starts_date.getTime()) {
+        return false;
+    } else {
+        return true;
+    }
+
+}

js/editDropdown.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/editDropdowntype.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/editPopover.js

@@ -3,160 +3,160 @@
 // Edit Popover
 // ============
 
-$(document).ready(function() {
+$(document).ready(function () {
 
-  var $application    = "ATLHOUSINGREPORT",
+    var $application = $("#APPLICATION_MNEMONIC").val(),
-      $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}"),
+            $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}"),
-      $CKEditor;
+            $CKEditor;
 
-  // ----------------------
+    // ----------------------
-  // Initialize the Editor.
+    // Initialize the Editor.
-  // ----------------------
+    // ----------------------
 
-ClassicEditor
+    ClassicEditor
-  .create( document.querySelector( '#popover_text' ), {
+            .create(document.querySelector('#popover_text'), {
-    toolbar: {
+                toolbar: {
-      items: [
+                    items: [
-              'heading',
+                        'heading',
-              '|',
+                        '|',
-              'bold',
+                        'bold',
-              'italic',
+                        'italic',
-              'underline',
+                        'underline',
-              'link',
+                        'link',
-              'bulletedList',
+                        'bulletedList',
-              'numberedList',
+                        'numberedList',
-              '|',
+                        '|',
-              'fontColor',
+                        'fontColor',
-              'fontSize',
+                        'fontSize',
-              'fontFamily',
+                        'fontFamily',
-              '|',
+                        '|',
-              'indent',
+                        'indent',
-              'outdent',
+                        'outdent',
-              'alignment',
+                        'alignment',
-              '|',
+                        '|',
-              'horizontalLine',
+                        'horizontalLine',
-              'insertTable',
+                        'insertTable',
-              '|',
+                        '|',
-              'undo',
+                        'undo',
-              'redo',
+                        'redo',
-              '|'
+                        '|'
-      ] },
+                    ]},
-    link: {
+                link: {
-      addTargetToExternalLinks : true,
+                    addTargetToExternalLinks: true,
-      defaultProtocol          : "http://"
+                    defaultProtocol: "http://"
-      
-    }
-  })
-  .then( editor => {
-          $CKEditor = editor;
-  })
-  .catch( error => {
-          console.error( 'CK-Editor error...' );
-          console.error( error );
-  });		
-  
-  // -----------
-  // Save Button
-  // -----------
-  
-  $(".btnSave").on("click", function(e) {
-    
-    e.preventDefault();
-    
-    $("#editPopover").submit();
-    
-  });
 
-  // --------------
+                }
-  // Cancel Button.
+            })
-  // --------------
+            .then(editor => {
+                $CKEditor = editor;
+            })
+            .catch(error => {
+                console.error('CK-Editor error...');
+                console.error(error);
+            });
 
-  $(".btnCancel").on("click", function() {
+    // -----------
-    
+    // Save Button
-    $sessionStorage.action = $sessionStorage.editPopover || "";
+    // -----------
-    
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
 
-    formSubmit($sessionStorage);
+    $(".btnSave").on("click", function (e) {
-    
-  });
 
-  // -------------
+        e.preventDefault();
-  // Delete Button
-  // -------------
 
-  $(".btnDelete").on("click", function() {
+        $("#editPopover").submit();
 
-    $("#confirm-dialog").removeClass().addClass("modal confirm-delete-popover")
-                        .find(".modal-title").html("Confirm Delete Popover").end()
-                        .find(".modal-body").html("Are you sure you wish to delete this Popover?").end()
-                        .modal("show");
-
-  });
-
-  $("body").on("click", ".confirm-delete-popover .btnConfirmDialogConfirm", function() {
-    
-    $.post("./", { action : "Popovers.deletePopover", popover_serial : $sessionStorage.popover_serial })
-    
-      .done(function() {
-    
-        $sessionStorage.action = $sessionStorage.editPopover || "";
-    
-        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-
-        formSubmit($sessionStorage);
-        
     });
-    
-  });
 
-  // ---------------
+    // --------------
-  // Validate Inputs
+    // Cancel Button.
-  // ---------------
+    // --------------
 
-  $("#editPopover").submit( function(e) {
+    $(".btnCancel").on("click", function () {
 
-    var popover_serial = $("#popover_serial"),
+        $sessionStorage.action = $sessionStorage.editPopover;
-        popover_name   = $("#popover_name"),
-        popover_title  = $("#popover_title"),
-        popover_text   = $("#popover_text");
-        
-    clearInputErrors();
-    
-    popover_name.val(popover_name.val().replace(/\s+/g, " ").trim());
-    popover_title.val(popover_title.val().replace(/\s+/g, " ").trim());
-
-    if (isBlank(popover_name)) {
-      createInputError(popover_name, "Name is required");
-      return false;
-    }
-    
-    if (formPost({ action : "Popovers.popoverExists", popover_serial : popover_serial.val(), popover_name : popover_name.val() }) === true) {
-      createInputError(popover_name, "Name already exists");
-      return false;
-    }
-
-    if (isBlank(popover_title)) {
-      createInputError(popover_title, "Title is required");
-      return false;
-    }
-
-    e.preventDefault();
-
-    $CKEditor.updateSourceElement();
-    
-    $.post("./", $(this).serialize())
-    
-      .done(function() {
-    
-        $sessionStorage.action = $sessionStorage.editPopover || "";
 
         sessionStorage.setItem($application, JSON.stringify($sessionStorage));
 
         formSubmit($sessionStorage);
-    
+
     });
-    
+
-  });
+    // -------------
-  
+    // Delete Button
+    // -------------
+
+    $(".btnDelete").on("click", function () {
+
+        $("#confirm-dialog").removeClass().addClass("modal confirm-delete-popover")
+                .find(".modal-title").html("Confirm Delete Popover").end()
+                .find(".modal-body").html("Are you sure you wish to delete this Popover?").end()
+                .modal("show");
+
+    });
+
+    $("body").on("click", ".confirm-delete-popover .btnConfirmDialogConfirm", function () {
+
+        $.post("./", {action: "Popovers.deletePopover", popover_serial: $sessionStorage.popover_serial})
+
+                .done(function () {
+
+                    $sessionStorage.action = $sessionStorage.editPopover || "";
+
+                    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+                    formSubmit($sessionStorage);
+
+                });
+
+    });
+
+    // ---------------
+    // Validate Inputs
+    // ---------------
+
+    $("#editPopover").submit(function (e) {
+
+        var popover_serial = $("#popover_serial"),
+                popover_name = $("#popover_name"),
+                popover_title = $("#popover_title"),
+                popover_text = $("#popover_text");
+
+        clearInputErrors();
+
+        popover_name.val(popover_name.val().replace(/\s+/g, " ").trim());
+        popover_title.val(popover_title.val().replace(/\s+/g, " ").trim());
+
+        if (isBlank(popover_name)) {
+            createInputError(popover_name, "Name is required");
+            return false;
+        }
+
+        if (formPost({action: "Popovers.popoverExists", popover_serial: popover_serial.val(), popover_name: popover_name.val()}) === true) {
+            createInputError(popover_name, "Name already exists");
+            return false;
+        }
+
+        if (isBlank(popover_title)) {
+            createInputError(popover_title, "Title is required");
+            return false;
+        }
+
+        e.preventDefault();
+
+        $CKEditor.updateSourceElement();
+
+        $.post("./", $(this).serialize())
+
+                .done(function () {
+
+                    $sessionStorage.action = $sessionStorage.editPopover;
+
+                    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+                    formSubmit($sessionStorage);
+
+                });
+
+    });
+
 });

js/editStatus.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/selectReport.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/setupAlerts.js

@@ -0,0 +1,205 @@
+
+// ==============
+// Setup Alerts
+// ==============
+
+$(document).ready(function () {
+
+    var $application = $("#APPLICATION_MNEMONIC").val(),
+            $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
+
+    // -----------
+    // Find Button
+    // -----------
+
+    $(".btnFind").on("click", function () {
+
+        $sessionStorage.action = "Alerts.setupAlerts";
+        $sessionStorage.pagination = "first";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        $("#spinner-dialog").modal("show");
+
+        formSubmit($sessionStorage);
+
+    });
+
+    $("#find_alert").on("keyup", function (e) {
+        if (e.key === "Enter") {
+            $(".btnFind").trigger("click");
+        }
+    });
+
+    // -----------------
+    // Clear Find Button
+    // -----------------
+
+    $(".btnClearFind").on("click", function () {
+
+        $("#find_alert").val("").trigger("change");
+
+        $sessionStorage.action = "Alerts.setupAlerts";
+        $sessionStorage.pagination = "first";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        $("#spinner-dialog").modal("show");
+
+        formSubmit($sessionStorage);
+
+    });
+
+    // ------------------
+    // Pagination Buttons
+    // ------------------
+
+    $(".btnPagination").on("click", function () {
+
+        $sessionStorage.action = "Alerts.setupAlerts";
+        $sessionStorage.pagination = $(this).data("pagination");
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        $("#spinner-dialog").modal("show");
+
+        formSubmit($sessionStorage);
+
+        delete $sessionStorage.pagination;
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+    });
+
+    // ----------
+    // Add Button
+    // ----------
+
+    $(".btnAdd").on("click", function () {
+
+        $sessionStorage.action = "Alerts.addAlert";
+        $sessionStorage.addAlert = "Alerts.setupAlerts";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        formSubmit($sessionStorage);
+
+    });
+
+    // -----------
+    // Done Button
+    // -----------
+
+    $(".btnDone").on("click", function () {
+
+        formSubmit({action: ""});
+
+    });
+
+    // ----
+    // Edit
+    // ----
+
+    $("#alerts-table tbody").on("click touch", "tr", function (e) {
+
+        e.preventDefault();
+
+        $sessionStorage.action = "Alerts.editAlert";
+        $sessionStorage.alert_serial = $(this).data("alert-serial");
+        $sessionStorage.editAlert = "Alerts.setupAlerts";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        formSubmit($sessionStorage);
+
+    });
+
+    // -------------------
+    // Save Changed Inputs
+    // -------------------
+
+    $(".autosave").on("change", function (e) {
+
+        switch (e.target.type) {
+
+            case "text"       :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+            case "radio"      :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+            case "checkbox"   :
+                $sessionStorage[e.target.name] = $(this).prop("checked");
+                break;
+            case "select-one" :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+            case "hidden"     :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+
+            default           :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+
+        }
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+    });
+
+    // ----------------
+    // Initalize Inputs
+    // ----------------
+
+    $.each($sessionStorage, function (name, value) {
+
+        var $input = $(":input").filter("[name='" + name + "']");
+
+        if ($input.length > 0) {
+
+            switch ($input.prop("type")) {
+
+                case "text"       :
+                    $input.val(value);
+                    break;
+                case "radio"      :
+                    $input.filter("[value=" + value + "]").prop("checked", true);
+                    break;
+                case "checkbox"   :
+                    $input.prop("checked", value);
+                    break;
+                case "select-one" :
+                    $input.val(value);
+                    break;
+                case "hidden"     :
+                    $input.val(value);
+                    break;
+
+                default           :
+                    $input.val(value);
+                    break;
+
+            }
+
+        }
+
+    });
+
+    // ------------------
+    // Save preset Inputs
+    // ------------------
+
+    $("input[type=radio]:checked").trigger("change");
+
+    // -----------------
+    // Per Page Dropdown
+    // -----------------
+
+    $("#alerts_per_page").on("change", function () {
+
+        $(".btnFind").trigger("click");
+
+    });
+
+});

js/setupDropdowns.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // --------------------------------

js/setupDropdowntypes.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/setupPopovers.js

@@ -3,179 +3,203 @@
 // Setup Popovers
 // ==============
 
-$(document).ready(function() {
+$(document).ready(function () {
 
-  var $application    = "PARKS",
+    var $application = $("#APPLICATION_MNEMONIC").val(),
-      $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
+            $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
-  
-  // -----------
-  // Find Button
-  // -----------
-  
-  $(".btnFind").on("click", function() {
-    
-    $sessionStorage.action     = "Popovers.setupPopovers";
-    $sessionStorage.pagination = "first";
-    
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-    
-    $("#spinner-dialog").modal("show");
-    
-    formSubmit($sessionStorage);
-    
-  });
 
-  $("#find_popover").on("keyup", function(e) {
+    // -----------
-    if (e.key === "Enter") {
+    // Find Button
-      $(".btnFind").trigger("click");
+    // -----------
-    }
-  });
-  
-  // -----------------
-  // Clear Find Button
-  // -----------------
-  
-  $(".btnClearFind").on("click", function() {
- 
-    $("#find_popover").val("").trigger("change");
-    
-    $sessionStorage.action     = "Popovers.setupPopovers";
-    $sessionStorage.pagination = "first";
-    
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-    
-    $("#spinner-dialog").modal("show");
-    
-    formSubmit($sessionStorage);
-     
-  });
-  
-  // ------------------
-  // Pagination Buttons
-  // ------------------
-  
-  $(".btnPagination").on("click", function() {
-    
-    $sessionStorage.action     = "Popovers.setupPopovers";
-    $sessionStorage.pagination = $(this).data("pagination");
-    
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-    
-    $("#spinner-dialog").modal("show");
-    
-    formSubmit($sessionStorage);
-    
-    delete $sessionStorage.pagination;
-    
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-    
-  });
-  
-  // ----------
-  // Add Button
-  // ----------
-  
-  $(".btnAdd").on("click", function() {
-    
-    $sessionStorage.action     = "Popovers.addPopover";
-    $sessionStorage.addPopover = "Popovers.setupPopovers";
-    
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-    
-    formSubmit($sessionStorage);
-    
-  });
-  
-  // -----------
-  // Done Button
-  // -----------
-  
-  $(".btnDone").on("click", function() {
-    
-    formSubmit({ action : "" });
-    
-  });
 
-  // ----
+    $(".btnFind").on("click", function () {
-  // Edit
-  // ----
 
-  $("#popovers-table tbody").on("click touch", "tr", function(e) {
+        $sessionStorage.action = "Popovers.setupPopovers";
+        $sessionStorage.pagination = "first";
 
-    e.preventDefault();
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-    
-    $sessionStorage.action         = "Popovers.editPopover";
-    $sessionStorage.popover_serial = $(this).data("popover-serial");
-    $sessionStorage.editPopover    = "Popovers.setupPopovers";
-    
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-    
-    formSubmit($sessionStorage);
 
-  });  
+        $("#spinner-dialog").modal("show");
 
-  // -------------------
+        formSubmit($sessionStorage);
-  // Save Changed Inputs
-  // -------------------
 
-  $(".autosave").on("change", function(e) {
+    });
 
-    switch (e.target.type) {
+    $("#find_popover").on("keyup", function (e) {
+        if (e.key === "Enter") {
+            $(".btnFind").trigger("click");
+        }
+    });
 
-      case "text"       : $sessionStorage[e.target.name] = $(this).val();           break;
+    // -----------------
-      case "radio"      : $sessionStorage[e.target.name] = $(this).val();           break;
+    // Clear Find Button
-      case "checkbox"   : $sessionStorage[e.target.name] = $(this).prop("checked"); break;
+    // -----------------
-      case "select-one" : $sessionStorage[e.target.name] = $(this).val();           break;
-      case "hidden"     : $sessionStorage[e.target.name] = $(this).val();           break;
 
-      default           : $sessionStorage[e.target.name] = $(this).val();           break;
+    $(".btnClearFind").on("click", function () {
 
-    }
+        $("#find_popover").val("").trigger("change");
 
-    sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+        $sessionStorage.action = "Popovers.setupPopovers";
+        $sessionStorage.pagination = "first";
 
-  });
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
 
-  // ----------------
+        $("#spinner-dialog").modal("show");
-  // Initalize Inputs
-  // ----------------
 
-  $.each($sessionStorage, function(name, value) {
+        formSubmit($sessionStorage);
 
-    var $input = $(":input").filter("[name='" + name + "']");
+    });
 
-    if ($input.length > 0) {
+    // ------------------
+    // Pagination Buttons
+    // ------------------
 
-      switch ($input.prop("type")) {
+    $(".btnPagination").on("click", function () {
 
-        case "text"       : $input.val(value);                                            break;
+        $sessionStorage.action = "Popovers.setupPopovers";
-        case "radio"      : $input.filter("[value=" + value + "]").prop("checked", true); break;
+        $sessionStorage.pagination = $(this).data("pagination");
-        case "checkbox"   : $input.prop("checked", value);                                break;
-        case "select-one" : $input.val(value);                                            break;
-        case "hidden"     : $input.val(value);                                            break;
 
-        default           : $input.val(value);                                            break;
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
 
-      }
+        $("#spinner-dialog").modal("show");
 
-    }
+        formSubmit($sessionStorage);
 
-  });
+        delete $sessionStorage.pagination;
 
-  // ------------------
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
-  // Save preset Inputs
-  // ------------------
 
-  $("input[type=radio]:checked").trigger("change");
+    });
 
-  // -----------------
+    // ----------
-  // Per Page Dropdown
+    // Add Button
-  // -----------------
+    // ----------
 
-  $("#popovers_per_page").on("change", function() {
+    $(".btnAdd").on("click", function () {
+
+        $sessionStorage.action = "Popovers.addPopover";
+        $sessionStorage.addPopover = "Popovers.setupPopovers";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        formSubmit($sessionStorage);
+
+    });
+
+    // -----------
+    // Done Button
+    // -----------
+
+    $(".btnDone").on("click", function () {
+
+        formSubmit({action: ""});
+
+    });
+
+    // ----
+    // Edit
+    // ----
+
+    $("#popovers-table tbody").on("click touch", "tr", function (e) {
+
+        e.preventDefault();
+
+        $sessionStorage.action = "Popovers.editPopover";
+        $sessionStorage.popover_serial = $(this).data("popover-serial");
+        $sessionStorage.editPopover = "Popovers.setupPopovers";
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+        formSubmit($sessionStorage);
+
+    });
+
+    // -------------------
+    // Save Changed Inputs
+    // -------------------
+
+    $(".autosave").on("change", function (e) {
+
+        switch (e.target.type) {
+
+            case "text"       :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+            case "radio"      :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+            case "checkbox"   :
+                $sessionStorage[e.target.name] = $(this).prop("checked");
+                break;
+            case "select-one" :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+            case "hidden"     :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+
+            default           :
+                $sessionStorage[e.target.name] = $(this).val();
+                break;
+
+        }
+
+        sessionStorage.setItem($application, JSON.stringify($sessionStorage));
+
+    });
+
+    // ----------------
+    // Initalize Inputs
+    // ----------------
+
+    $.each($sessionStorage, function (name, value) {
+
+        var $input = $(":input").filter("[name='" + name + "']");
+
+        if ($input.length > 0) {
+
+            switch ($input.prop("type")) {
+
+                case "text"       :
+                    $input.val(value);
+                    break;
+                case "radio"      :
+                    $input.filter("[value=" + value + "]").prop("checked", true);
+                    break;
+                case "checkbox"   :
+                    $input.prop("checked", value);
+                    break;
+                case "select-one" :
+                    $input.val(value);
+                    break;
+                case "hidden"     :
+                    $input.val(value);
+                    break;
+
+                default           :
+                    $input.val(value);
+                    break;
+
+            }
+
+        }
+
+    });
+
+    // ------------------
+    // Save preset Inputs
+    // ------------------
+
+    $("input[type=radio]:checked").trigger("change");
+
+    // -----------------
+    // Per Page Dropdown
+    // -----------------
+
+    $("#popovers_per_page").on("change", function () {
+
+        $(".btnFind").trigger("click");
+
+    });
 
-    $(".btnFind").trigger("click");
-    
-  });
-  
 });

js/setupReports.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
   
   // -----------

js/viewJournal.js

@@ -5,7 +5,7 @@
 
 $(document).ready(function() {
 
-  var $application    = "ATLHOUSINGREPORT",
+  var $application = $("#APPLICATION_MNEMONIC").val(),
       $sessionStorage = JSON.parse(sessionStorage.getItem($application) || "{}");
  
   // -----------

nbproject/private/private.xml

@@ -2,10 +2,6 @@
 <project-private xmlns="http://www.netbeans.org/ns/project-private/1">
     <editor-bookmarks xmlns="http://www.netbeans.org/ns/editor-bookmarks/2" lastBookmarkId="0"/>
     <open-files xmlns="http://www.netbeans.org/ns/projectui-open-files/2">
-        <group>
+        <group/>
-            <file>file:/C:/Users/JamesRichie/OneDrive%20-%20OneSource%20IT%20Solutions%20LLC/Documents/NetBeansProjects/dec-international/atlhousingreport/classes/SupportTickets.php</file>
-            <file>file:/C:/Users/JamesRichie/OneDrive%20-%20OneSource%20IT%20Solutions%20LLC/Documents/NetBeansProjects/dec-international/atlhousingreport/xsl/viewSupportTickets.xsl</file>
-            <file>file:/C:/Users/JamesRichie/OneDrive%20-%20OneSource%20IT%20Solutions%20LLC/Documents/NetBeansProjects/dec-international/atlhousingreport/js/viewSupportTickets.js</file>
-        </group>
     </open-files>
 </project-private>

tables/alerts.php

@@ -0,0 +1,23 @@
+<?php
+
+$SQL = "create table alerts
+
+        (
+
+          alert_serial          serial,
+          alert_title           varchar(100)      default null,
+          alert_started         datetime          default null,  
+          alert_expired         datetime          default null,  
+          alert_message         varchar(1000)     default null,
+          
+          alert_creator         varchar(100)      default null,
+          alert_created         datetime          default null,  
+          alert_changer         varchar(100)      default null,
+          alert_changed         datetime          default null,  
+          
+          primary key (alert_serial)
+          
+        )
+
+        default character set = utf8";
+?>

views/view_alerts.php

@@ -0,0 +1,16 @@
+<?php
+
+$SQL = "create view view_alerts as
+
+          select alerts.*,
+          
+                 date_format(alert_created, '%c/%e/%Y %l:%i %p') as alert_created_verbose,
+                 date_format(alert_changed, '%c/%e/%Y %l:%i %p') as alert_changed_verbose,
+                 date_format(alert_started, '%c/%e/%Y %l:%i %p') as alert_started_verbose,
+                 date_format(alert_expired, '%c/%e/%Y %l:%i %p') as alert_expires_verbose
+                 
+            from alerts
+            
+        order by alert_created";
+
+?>

xsl/addAlert.xsl

@@ -0,0 +1,137 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
+    <xsl:output method="html" encoding="utf-8" indent="yes"/>
+
+    <!-- Parameters -->
+
+    <xsl:param name="VERSION">1.0</xsl:param>
+    <xsl:param name="PAGE-TITLE">Add Alert</xsl:param>
+    <xsl:param name="PAGE-NAME">addAlert</xsl:param>
+
+    <xsl:template match="/">
+    
+        <script src="js/{$PAGE-NAME}.js?version={$VERSION}"/>   
+        <script src="js/ckeditor.js?version={$VERSION}"/>   
+
+        <div class="{$PAGE-NAME}">
+      
+            <div class="card">
+        
+                <div class="card-header bg-primary text-white p-1 ps-3 border-bottom-0">
+                    <i class="bi bi-plus-lg me-2"/>
+                    <xsl:value-of select="$PAGE-TITLE"/>
+          
+                </div>
+        
+                <div class="card-body">
+          
+                    <form action="" name="{$PAGE-NAME}" method="post" id="{$PAGE-NAME}" enctype="multipart/form-data">
+
+                        <input type="hidden" name="action" value="Alerts.addAlert"/>
+                        <input type="hidden" name="step"   value="add"/>
+            
+                        <div class="row">
+
+                            <div class="col-lg-5 mb-3">
+                                <label class="form-label" for="alert_title">Title</label>
+                                <input type="text" class="form-control form-control-sm" name="alert_title" id="alert_title" maxlength="100" autocomplete="off" autofocus="yes"/>
+                            </div>
+
+                        </div>
+                                    
+                        <div class="row">
+                            
+                            <div class="col-md-3 mb-3">
+
+                                <label class="form-label" for="alert_starts_date">Start Date</label>
+
+                                <div class="input-group input-group-sm starts-date">
+                                    
+                                    <span class="input-group-text">Date:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_starts_date" id="alert_starts_date" autocomplete="off" maxlength="10"
+                                           value="{$TODAY_YYYYMMDD}"/>
+                                    <button class="btn btn-outline-primary btnAlertStartDateCalendar" type="button" data-target="#alert_starts_date" data-bs-toggle="tooltip" data-bs-title="Calendar" tabindex="-1">
+                                        <i class="bi bi-calendar3"></i>
+                                    </button>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                            <div class="col-md-3 mb-3">
+                                
+                                <label class="form-label" for="alert_starts_time">Start Time <span class="text-small text-muted text-nowrap ml-2">(24-Hour format)</span></label>
+
+                                <div class="input-group input-group-sm">
+                                    
+                                    <span class="input-group-text">Time:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_starts_time" id="alert_starts_time" autocomplete="off" maxlength="10"
+                                           value="{$TODAY_HHMM}"/>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                        </div>
+                        <div class="row">
+                            
+                            <div class="col-md-3 mb-3">
+
+                                <label class="form-label" for="alert_expires_date">Expires Date</label>
+
+                                <div class="input-group input-group-sm expires-date">
+                                    
+                                    <span class="input-group-text">Date:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_expires_date" id="alert_expires_date" autocomplete="off" maxlength="10"/>
+                                    <button class="btn btn-outline-primary btnAlertExpiresDateCalendar" type="button" data-target="#alert_expires_date" data-bs-toggle="tooltip" data-bs-title="Calendar" tabindex="-1">
+                                        <i class="bi bi-calendar3"></i>
+                                    </button>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                            <div class="col-md-3 mb-3">
+                                
+                                <label class="form-label" for="alert_expires_time">Expires Time <span class="text-small text-muted text-nowrap ml-2">(24-Hour format)</span></label>
+
+                                <div class="input-group input-group-sm start_date">
+                                    
+                                    <span class="input-group-text">Time:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_expires_time" id="alert_expires_time" autocomplete="off" maxlength="10"/>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                        </div>
+
+                              
+                        <div class="row">
+
+                            <div class="col-lg-12 mb-3">
+                                <label class="form-label" for="alert_message">Alert Message</label>
+                                <textarea class="form-control form-control-sm" name="alert_message" id="alert_message"/>
+                            </div>
+
+                        </div>
+            
+                    </form>
+
+                    <div class="buttons mt-1 mb-2">
+                        <button type="button" class="btn btn-sm btn-primary me-2 btnCancel">
+                            <i class="bi bi-box-arrow-left me-2"/>Cancel</button>
+                        <button type="button" class="btn btn-sm btn-primary me-2 btnSave">
+                            <i class="bi bi-save me-2"/>Save</button>
+                    </div>
+          
+                </div>
+        
+            </div>
+      
+        </div>
+          
+    </xsl:template>
+
+</xsl:stylesheet>

xsl/content.xsl

@@ -178,6 +178,9 @@
                                         <xsl:if test="$USER_ROLE = 'Administrator' or $USER_ROLE = 'System Administrator'">
                                             
                                             <div class="dropdown-divider mt-1 mb-1"/>
+                                            
+                                            <a class="dropdown-item ps-2 setup-alerts" href="javascript:void(0);">
+                                                <i class="bi bi-info-circle me-2"/>Alerts</a>
                       
                                             <a class="dropdown-item ps-2 setup-counties" href="javascript:void(0);">
                                                 <i class="bi bi-building me-2"/>Counties
@@ -218,7 +221,7 @@
                                                 <i class="bi bi-journal me-2"/>Journal
                                             </a>
                                             
-<!--                                            <a class="dropdown-item ps-2 view-support-tickets" href="javascript:void(0);">
+                                            <!--                                            <a class="dropdown-item ps-2 view-support-tickets" href="javascript:void(0);">
                                                 <i class="bi bi-question-circle me-2"/>Support Tickets
                                             </a>-->
                                             

xsl/editAlert.xsl

@@ -0,0 +1,143 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
+    <xsl:output method="html" encoding="utf-8" indent="yes"/>
+
+    <!-- Parameters -->
+
+    <xsl:param name="VERSION">1.0</xsl:param>
+    <xsl:param name="PAGE-TITLE">Edit Alert</xsl:param>
+    <xsl:param name="PAGE-NAME">editAlert</xsl:param>
+
+    <xsl:template match="/">
+    
+        <script src="js/{$PAGE-NAME}.js?version={$VERSION}"/>   
+        <script src="js/ckeditor.js?version={$VERSION}"/>   
+
+        <div class="{$PAGE-NAME}">
+      
+            <div class="card">
+        
+                <div class="card-header bg-primary text-white p-1 ps-3 border-bottom-0">
+          
+                    <i class="bi bi-chat-square-dots me-2"/>
+                    <xsl:value-of select="$PAGE-TITLE"/>
+          
+                </div>
+        
+                <div class="card-body">
+          
+                    <form action="" name="{$PAGE-NAME}" method="post" id="{$PAGE-NAME}" enctype="multipart/form-data">
+
+                        <input type="hidden" name="action" value="Alerts.editAlert"/>
+                        <input type="hidden" name="step"   value="update"/>
+            
+                        <input type="hidden" name="alert_serial" id="alert_serial" value="{//alerts/record/alert_serial}"/>
+          
+                        <div class="row">
+
+                            <div class="col-lg-5 mb-3">
+                                <label class="form-label" for="alert_title">Title</label>
+                                <input type="text" class="form-control form-control-sm" name="alert_title" id="alert_title" maxlength="100" autocomplete="off" value="{//alerts/record/alert_title}"/>
+                            </div>
+
+                        </div>
+            
+                        <div class="row">
+                            
+                            <div class="col-md-3 mb-3">
+
+                                <label class="form-label" for="alert_starts_date">Start Date</label>
+
+                                <div class="input-group input-group-sm starts-date">
+                                    
+                                    <span class="input-group-text">Date:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_starts_date" id="alert_starts_date" autocomplete="off" maxlength="10"
+                                           value="{//alerts/record/alert_started_date}"/>
+                                    <button class="btn btn-outline-primary btnAlertStartDateCalendar" type="button" data-target="#alert_starts_date" data-bs-toggle="tooltip" data-bs-title="Calendar" tabindex="-1">
+                                        <i class="bi bi-calendar3"></i>
+                                    </button>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                            <div class="col-md-3 mb-3">
+                                
+                                <label class="form-label" for="alert_starts_time">Start Time <span class="text-small text-muted text-nowrap ml-2">(24-Hour format)</span></label>
+
+                                <div class="input-group input-group-sm">
+                                    
+                                    <span class="input-group-text">Time:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_starts_time" id="alert_starts_time" autocomplete="off" maxlength="10"
+                                           value="{//alerts/record/alert_started_time}"/>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                        </div>
+                        <div class="row">
+                            
+                            <div class="col-md-3 mb-3">
+
+                                <label class="form-label" for="alert_expires_date">Expires Date</label>
+
+                                <div class="input-group input-group-sm expires-date">
+                                    
+                                    <span class="input-group-text">Date:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_expires_date" id="alert_expires_date" autocomplete="off" maxlength="10"
+                                           value="{//alerts/record/alert_expired_date}"/>
+                                    <button class="btn btn-outline-primary btnAlertExpiresDateCalendar" type="button" data-target="#alert_expires_date" data-bs-toggle="tooltip" data-bs-title="Calendar" tabindex="-1">
+                                        <i class="bi bi-calendar3"></i>
+                                    </button>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                            <div class="col-md-3 mb-3">
+                                
+                                <label class="form-label" for="alert_expires_time">Expires Time <span class="text-small text-muted text-nowrap ml-2">(24-Hour format)</span></label>
+
+                                <div class="input-group input-group-sm start_date">
+                                    
+                                    <span class="input-group-text">Time:</span>
+                                    <input type="text" class="form-control form-control-sm date-mask" name="alert_expires_time" id="alert_expires_time" autocomplete="off" maxlength="10" value="{//alerts/record/alert_expired_time}"/>
+                                    
+                                </div>
+                                
+                            </div>
+                            
+                        </div>
+
+                              
+                        <div class="row">
+
+                            <div class="col-lg-12 mb-3">
+                                <label class="form-label" for="alert_message">Alert Message</label>
+                                <textarea class="form-control form-control-sm" name="alert_message" id="alert_message">
+                                    <xsl:value-of select="//alerts/record/alert_message"/>
+                                </textarea>
+                            </div>
+
+                        </div>
+            
+                    </form>
+
+                    <div class="buttons mt-1 mb-2">
+                        <button type="button" class="btn btn-sm btn-primary me-2 btnCancel">
+                            <i class="bi bi-box-arrow-left me-2"/>Cancel</button>
+                        <button type="button" class="btn btn-sm btn-primary me-2 btnSave">
+                            <i class="bi bi-save me-2"/>Save</button>
+                    </div>
+          
+                </div>
+        
+            </div>
+      
+        </div>
+          
+    </xsl:template>
+
+</xsl:stylesheet>

xsl/setupAlerts.xsl

@@ -0,0 +1,160 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
+    <xsl:output method="html" encoding="utf-8" indent="yes"/>
+
+    <!-- Parameters -->
+
+    <xsl:param name="VERSION">1.0</xsl:param>
+    <xsl:param name="PAGE-TITLE">Alerts</xsl:param>
+    <xsl:param name="PAGE-NAME">setupAlerts</xsl:param>
+
+    <!-- Variables --> 
+
+    <xsl:variable name="PAGINATION_COUNT" select="//alerts/@count"/>
+    <xsl:variable name="PAGINATION_START" select="//alerts/@start"/>
+    <xsl:variable name="PAGINATION_END"   select="//alerts/@end"/>
+    <xsl:variable name="PAGINATION_PAGE"  select="//alerts/@page"/>
+
+    <!-- Main Template -->
+
+    <xsl:template match="/">
+
+        <script src="js/{$PAGE-NAME}.js?version={$VERSION}"/>   
+
+        <div class="{$PAGE-NAME}">
+      
+            <div class="card">
+        
+                <div class="card-header bg-primary text-white p-1 ps-3 border-bottom-0">
+                    <i class="bi bi-info-circle me-2"/>
+                    <xsl:value-of select="$PAGE-TITLE"/>
+                    <xsl:if test="$PAGINATION_COUNT > 0">
+                        <xsl:text> | Showing </xsl:text>
+                        <xsl:value-of select="format-number($PAGINATION_START, '###,##0')"/>
+                        <xsl:text> to </xsl:text>
+                        <xsl:value-of select="format-number($PAGINATION_END, '###,##0')"/>
+                        <xsl:text> of </xsl:text>
+                        <xsl:value-of select="format-number($PAGINATION_COUNT, '###,##0')"/>
+                    </xsl:if>
+                </div>
+        
+                <div class="card-body">
+
+                    <div class="row align-items-center mt-2 mb-3">
+            
+                        <div class="col-lg-4">
+                            <div class="input-group input-group-sm">
+                                <input type="text" class="form-control autosave" name="find_alert" id="find_alert" maxlength="100" autocomplete="off" placeholder="{//popovers/record[popover_name = 'find_alert']/popover_placeholder}" autofocus="autofocus"/>
+                                <button type="button" class="btn btn-primary fw-bold btnFind" data-bs-toggle="tooltip" data-bs-title="{//popovers/record[popover_name = 'find_alert']/popover_text}" data-bs-html="true" data-bs-custom-class="custom-tooltip">
+                                    <i class="bi bi-search"/>
+                                </button>
+                                <button type="button" class="btn btn-primary fw-bold btnClearFind" data-bs-toggle="tooltip" data-bs-title="Clear Find" data-bs-custom-class="custom-tooltip">
+                                    <i class="bi bi-arrow-clockwise"/>
+                                </button>
+                            </div>
+                        </div>
+
+                        <div class="col-auto">
+                            <div class="input-group input-group-sm" data-bs-toggle="tooltip" data-bs-title="Show Per Page" data-bs-custom-class="custom-tooltip">
+                                <div class="input-group-text">
+                                    <i class="bi bi-list-ol"/>
+                                </div>
+                                <select class="form-select autosave" name="alerts_per_page" id="alerts_per_page">
+                                    <option value="20">20</option>
+                                    <option value="40">40</option>
+                                    <option value="60">60</option>
+                                    <option value="80">80</option>
+                                    <option value="100">100</option>
+                                </select>
+                            </div>
+                        </div>
+            
+                    </div>
+ 
+                    <!-- Action Buttons --> 
+
+                    <div class="buttons mt-3 mb-2">
+            
+                        <button type="button" class="btn btn-sm btn-primary me-2 btnDone">
+                            <i class="bi bi-box-arrow-left me-2"/>Done</button>
+                        <button type="button" class="btn btn-sm btn-primary me-2 btnAdd">
+                            <i class="bi bi-plus-lg me-2"/>Add</button>
+
+                        <div class="btn-group ms-2" role="group">
+                            <xsl:if test="$PAGINATION_PAGE > 1">
+                                <button type="button" class="btn btn-sm btn-primary btnPagination" data-pagination="first" data-bs-toggle="tooltip" data-bs-title="First Page" data-bs-custom-class="custom-tooltip">
+                                    <i class="bi bi-chevron-bar-left me-1"/>First</button>
+                                <button type="button" class="btn btn-sm btn-primary btnPagination" data-pagination="previous" data-bs-toggle="tooltip" data-bs-title="Previous Page" data-bs-custom-class="custom-tooltip">
+                                    <i class="bi bi-chevron-left me-1"/>Previous</button>
+                            </xsl:if>
+                            <xsl:if test="$PAGINATION_COUNT > $PAGINATION_END">
+                                <button type="button" class="btn btn-sm btn-primary btnPagination" data-pagination="next" data-bs-toggle="tooltip" data-bs-title="Next Page" data-bs-custom-class="custom-tooltip">
+                                    <i class="bi bi-chevron-right me-1"/>Next</button>
+                                <button type="button" class="btn btn-sm btn-primary btnPagination" data-pagination="last" data-bs-toggle="tooltip" data-bs-title="Last Page" data-bs-custom-class="custom-tooltip">
+                                    <i class="bi bi-chevron-bar-right me-1"/>Last</button>
+                            </xsl:if>
+                        </div>
+            
+                    </div>
+
+                    <hr class="mt-3 mb-2"/> 
+
+                    <xsl:choose>
+            
+                        <xsl:when test="count(//alerts/record) = 0">
+          
+                            <div class="fs-5 text-danger fw-bold fst-italic mt-3 mb-1">
+                                <xsl:text>There are no Alerts to view...</xsl:text>
+                            </div>
+              
+                        </xsl:when>
+            
+                        <xsl:otherwise>
+
+                            <div class="table-wrapper table-responsive">
+                                <table class="table table-sm table-striped table-hover base-table table-auto" id="alerts-table">
+                                    <thead>
+                                        <th>Title</th>
+                                        <th>Starts</th>
+                                        <th>Expires</th>
+                                    </thead>
+                                    <tbody>
+                                        <xsl:apply-templates select="//alerts"/>
+                                    </tbody>
+                                </table>
+                            </div>
+            
+                        </xsl:otherwise>
+            
+                    </xsl:choose>
+          
+                </div>
+        
+            </div>
+      
+        </div>
+                        
+    </xsl:template>
+
+    <!-- Template for table rows -->
+
+    <xsl:template match="alerts/record">
+    
+        <tr class="hoverable alert-row" data-alert-serial="{alert_serial}" data-alert-name="{alert_title}">
+      
+            <td class="alert_title">
+                <xsl:value-of select="alert_title"/>
+            </td>
+            <td class="alert_start">
+                <xsl:value-of select="alert_started_verbose"/>
+            </td>
+            <td class="alert_end">
+                <xsl:value-of select="alert_expires_verbose"/>
+            </td>
+            
+        </tr>
+    
+    </xsl:template>
+
+</xsl:stylesheet>

xsl/userSubscriptions.xsl

@@ -16,6 +16,26 @@
         <script src="js/{$PAGE-NAME}.js?version={$VERSION}"/>   
 
         <div class="{$PAGE-NAME}">
+            
+            <xsl:choose>
+            
+                <xsl:when test="count(//alerts/record) > 0">
+          
+                    <div class="card mb-4">
+        
+                        <div class="card-header bg-danger text-white p-1 ps-3">
+                            <i class="bi bi-info-circle me-2"/>
+                            Messages
+                        </div>
+        
+                        <div class="card-body">
+                            <xsl:apply-templates select="//alerts"/>    
+                        </div>
+                    </div>
+              
+                </xsl:when>
+            
+            </xsl:choose>
       
             <div class="card">
         
@@ -101,5 +121,29 @@
         </tr>
     
     </xsl:template>
+    
+    <!-- Template to create Alerts objects -->
+
+    <xsl:template match="alerts">
+
+        <xsl:for-each select="record">
+
+            <div class="row">
+                <xsl:value-of select="alert_message" disable-output-escaping="yes"/>
+            </div>
+            
+            <!--            <div class="row alert-time-elapsed-row mb-0 text-muted">
+                <div class="col alert-company">
+                    <xsl:value-of select="alert_time_elapsed"/>
+                </div>
+            </div>-->
+
+            <xsl:if test="position() != last()">
+                <hr class="mt-1 mb-1"/>
+            </xsl:if>
+
+        </xsl:for-each>
+
+    </xsl:template>
 
 </xsl:stylesheet>