reduce nesting

handlers/lotOccupancies-post/doSearchLotOccupancies.js

@@ -7,6 +7,7 @@ export const handler = async (request, response) => {
     });
     response.json({
         count: result.count,
+        offset: Number.parseInt(request.body.offset, 10),
         lotOccupancies: result.lotOccupancies
     });
 };

handlers/lotOccupancies-post/doSearchLotOccupancies.ts

@@ -11,6 +11,7 @@ export const handler: RequestHandler = async (request, response) => {
 
     response.json({
         count: result.count,
+        offset: Number.parseInt(request.body.offset, 10),
         lotOccupancies: result.lotOccupancies
     });
 };

public-typescript/lotOccupancySearch.js

@@ -7,16 +7,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
     const searchResultsContainerElement = document.querySelector("#container--searchResults");
     const limit = Number.parseInt(document.querySelector("#searchFilter--limit").value, 10);
     const offsetElement = document.querySelector("#searchFilter--offset");
-    const getLotOccupancies = () => {
+    function renderLotOccupancies(responseJSON) {
-        const offset = Number.parseInt(offsetElement.value, 10);
-        searchResultsContainerElement.innerHTML =
-            '<div class="has-text-grey has-text-centered">' +
-                '<i class="fas fa-5x fa-circle-notch fa-spin" aria-hidden="true"></i><br />' +
-                "Loading " +
-                exports.aliases.occupancies +
-                "..." +
-                "</div>";
-        cityssm.postJSON(los.urlPrefix + "/lotOccupancies/doSearchLotOccupancies", searchFilterFormElement, (responseJSON) => {
         if (responseJSON.lotOccupancies.length === 0) {
             searchResultsContainerElement.innerHTML =
                 '<div class="message is-info">' +
@@ -142,22 +133,22 @@ Object.defineProperty(exports, "__esModule", { value: true });
                 ('<div class="level-left">' +
                     '<div class="level-item has-text-weight-bold">' +
                     "Displaying " +
-                        (offset + 1).toString() +
+                    (responseJSON.offset + 1).toString() +
                     " to " +
-                        Math.min(responseJSON.count, limit + offset) +
+                    Math.min(responseJSON.count, limit + responseJSON.offset) +
                     " of " +
                     responseJSON.count +
                     "</div>" +
                     "</div>") +
                 ('<div class="level-right">' +
-                        (offset > 0
+                    (responseJSON.offset > 0
                         ? '<div class="level-item">' +
                             '<button class="button is-rounded is-link is-outlined" data-page="previous" type="button" title="Previous">' +
                             '<i class="fas fa-arrow-left" aria-hidden="true"></i>' +
                             "</button>" +
                             "</div>"
                         : "") +
-                        (limit + offset < responseJSON.count
+                    (limit + responseJSON.offset < responseJSON.count
                         ? '<div class="level-item">' +
                             '<button class="button is-rounded is-link" data-page="next" type="button" title="Next">' +
                             "<span>Next</span>" +
@@ -168,26 +159,35 @@ Object.defineProperty(exports, "__esModule", { value: true });
                     "</div>") +
                 "</div>";
         searchResultsContainerElement.querySelector("table").append(resultsTbodyElement);
-            if (offset > 0) {
+        if (responseJSON.offset > 0) {
             searchResultsContainerElement.querySelector("button[data-page='previous']").addEventListener("click", previousAndGetLotOccupancies);
         }
-            if (limit + offset < responseJSON.count) {
+        if (limit + responseJSON.offset < responseJSON.count) {
             searchResultsContainerElement.querySelector("button[data-page='next']").addEventListener("click", nextAndGetLotOccupancies);
         }
-        });
+    }
-    };
+    function getLotOccupancies() {
-    const resetOffsetAndGetLotOccupancies = () => {
+        searchResultsContainerElement.innerHTML =
+            '<div class="has-text-grey has-text-centered">' +
+                '<i class="fas fa-5x fa-circle-notch fa-spin" aria-hidden="true"></i><br />' +
+                "Loading " +
+                exports.aliases.occupancies +
+                "..." +
+                "</div>";
+        cityssm.postJSON(los.urlPrefix + "/lotOccupancies/doSearchLotOccupancies", searchFilterFormElement, renderLotOccupancies);
+    }
+    function resetOffsetAndGetLotOccupancies() {
         offsetElement.value = "0";
         getLotOccupancies();
-    };
+    }
-    const previousAndGetLotOccupancies = () => {
+    function previousAndGetLotOccupancies() {
         offsetElement.value = Math.max(Number.parseInt(offsetElement.value, 10) - limit, 0).toString();
         getLotOccupancies();
-    };
+    }
-    const nextAndGetLotOccupancies = () => {
+    function nextAndGetLotOccupancies() {
         offsetElement.value = (Number.parseInt(offsetElement.value, 10) + limit).toString();
         getLotOccupancies();
-    };
+    }
     const filterElements = searchFilterFormElement.querySelectorAll("input, select");
     for (const filterElement of filterElements) {
         filterElement.addEventListener("change", resetOffsetAndGetLotOccupancies);

public-typescript/lotOccupancySearch.ts

@@ -24,21 +24,11 @@ declare const cityssm: cityssmGlobal;
     );
     const offsetElement = document.querySelector("#searchFilter--offset") as HTMLInputElement;
 
-    const getLotOccupancies = () => {
+    function renderLotOccupancies(responseJSON: {
-        const offset = Number.parseInt(offsetElement.value, 10);
+        count: number;
-
+        offset: number;
-        searchResultsContainerElement.innerHTML =
+        lotOccupancies: recordTypes.LotOccupancy[];
-            '<div class="has-text-grey has-text-centered">' +
+    }) {
-            '<i class="fas fa-5x fa-circle-notch fa-spin" aria-hidden="true"></i><br />' +
-            "Loading " +
-            exports.aliases.occupancies +
-            "..." +
-            "</div>";
-
-        cityssm.postJSON(
-            los.urlPrefix + "/lotOccupancies/doSearchLotOccupancies",
-            searchFilterFormElement,
-            (responseJSON: { count: number; lotOccupancies: recordTypes.LotOccupancy[] }) => {
         if (responseJSON.lotOccupancies.length === 0) {
             searchResultsContainerElement.innerHTML =
                 '<div class="message is-info">' +
@@ -176,22 +166,22 @@ declare const cityssm: cityssmGlobal;
             ('<div class="level-left">' +
                 '<div class="level-item has-text-weight-bold">' +
                 "Displaying " +
-                        (offset + 1).toString() +
+                (responseJSON.offset + 1).toString() +
                 " to " +
-                        Math.min(responseJSON.count, limit + offset) +
+                Math.min(responseJSON.count, limit + responseJSON.offset) +
                 " of " +
                 responseJSON.count +
                 "</div>" +
                 "</div>") +
             ('<div class="level-right">' +
-                        (offset > 0
+                (responseJSON.offset > 0
                     ? '<div class="level-item">' +
                       '<button class="button is-rounded is-link is-outlined" data-page="previous" type="button" title="Previous">' +
                       '<i class="fas fa-arrow-left" aria-hidden="true"></i>' +
                       "</button>" +
                       "</div>"
                     : "") +
-                        (limit + offset < responseJSON.count
+                (limit + responseJSON.offset < responseJSON.count
                     ? '<div class="level-item">' +
                       '<button class="button is-rounded is-link" data-page="next" type="button" title="Next">' +
                       "<span>Next</span>" +
@@ -204,7 +194,7 @@ declare const cityssm: cityssmGlobal;
 
         searchResultsContainerElement.querySelector("table")!.append(resultsTbodyElement);
 
-                if (offset > 0) {
+        if (responseJSON.offset > 0) {
             (
                 searchResultsContainerElement.querySelector(
                     "button[data-page='previous']"
@@ -212,7 +202,7 @@ declare const cityssm: cityssmGlobal;
             ).addEventListener("click", previousAndGetLotOccupancies);
         }
 
-                if (limit + offset < responseJSON.count) {
+        if (limit + responseJSON.offset < responseJSON.count) {
             (
                 searchResultsContainerElement.querySelector(
                     "button[data-page='next']"
@@ -220,26 +210,40 @@ declare const cityssm: cityssmGlobal;
             ).addEventListener("click", nextAndGetLotOccupancies);
         }
     }
-        );
-    };
 
-    const resetOffsetAndGetLotOccupancies = () => {
+    function getLotOccupancies() {
+        searchResultsContainerElement.innerHTML =
+            '<div class="has-text-grey has-text-centered">' +
+            '<i class="fas fa-5x fa-circle-notch fa-spin" aria-hidden="true"></i><br />' +
+            "Loading " +
+            exports.aliases.occupancies +
+            "..." +
+            "</div>";
+
+        cityssm.postJSON(
+            los.urlPrefix + "/lotOccupancies/doSearchLotOccupancies",
+            searchFilterFormElement,
+            renderLotOccupancies
+        );
+    }
+
+    function resetOffsetAndGetLotOccupancies() {
         offsetElement.value = "0";
         getLotOccupancies();
-    };
+    }
 
-    const previousAndGetLotOccupancies = () => {
+    function previousAndGetLotOccupancies() {
         offsetElement.value = Math.max(
             Number.parseInt(offsetElement.value, 10) - limit,
             0
         ).toString();
         getLotOccupancies();
-    };
+    }
 
-    const nextAndGetLotOccupancies = () => {
+    function nextAndGetLotOccupancies() {
         offsetElement.value = (Number.parseInt(offsetElement.value, 10) + limit).toString();
         getLotOccupancies();
-    };
+    }
 
     const filterElements = searchFilterFormElement.querySelectorAll("input, select") as NodeListOf<
         HTMLInputElement | HTMLSelectElement

public/javascripts/lotOccupancySearch.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),(()=>{const t=exports.los,a=document.querySelector("#form--searchFilters"),e=document.querySelector("#container--searchResults"),s=Number.parseInt(document.querySelector("#searchFilter--limit").value,10),c=document.querySelector("#searchFilter--offset"),i=()=>{const i=Number.parseInt(c.value,10);e.innerHTML='<div class="has-text-grey has-text-centered"><i class="fas fa-5x fa-circle-notch fa-spin" aria-hidden="true"></i><br />Loading '+exports.aliases.occupancies+"...</div>",cityssm.postJSON(t.urlPrefix+"/lotOccupancies/doSearchLotOccupancies",a,a=>{if(0===a.lotOccupancies.length)return void(e.innerHTML='<div class="message is-info"><p class="message-body">There are no '+cityssm.escapeHTML(exports.aliases.occupancy.toLowerCase())+" records that meet the search criteria.</p></div>");const c=document.createElement("tbody"),r=cityssm.dateToString(new Date);for(const e of a.lotOccupancies){let a="";a=e.occupancyStartDateString<=r&&(""===e.occupancyEndDateString||e.occupancyEndDateString>=r)?'<span class="has-tooltip-right" data-tooltip="Current '+exports.aliases.occupancy+'"><i class="fas fa-play" aria-label="Current '+exports.aliases.occupancy+'"></i></span>':e.occupancyStartDateString>r?'<span class="has-tooltip-right" data-tooltip="Future '+exports.aliases.occupancy+'"><i class="fas fa-fast-forward" aria-label="Future '+exports.aliases.occupancy+'"></i></span>':'<span class="has-tooltip-right" data-tooltip="Past '+exports.aliases.occupancy+'"><i class="fas fa-stop" aria-label="Past '+exports.aliases.occupancy+'"></i></span>';let s="";for(const t of e.lotOccupancyOccupants)s+='<span class="has-tooltip-left" data-tooltip="'+cityssm.escapeHTML(t.lotOccupantType||"")+'"><i class="fas fa-fw fa-'+cityssm.escapeHTML(t.fontAwesomeIconClass||"user")+'" aria-hidden="true"></i> '+cityssm.escapeHTML(t.occupantName||"")+"</span><br />";c.insertAdjacentHTML("beforeend",'<tr><td class="has-width-1">'+a+'</td><td><a class="has-text-weight-bold" href="'+t.urlPrefix+"/lotOccupancies/"+e.lotOccupancyId+'">'+cityssm.escapeHTML(e.occupancyType)+"</a></td><td>"+(e.lotName?'<a class="has-tooltip-right" data-tooltip="'+cityssm.escapeHTML(e.lotType||"")+'" href="'+t.urlPrefix+"/lots/"+e.lotId+'">'+cityssm.escapeHTML(e.lotName)+"</a>":'<span class="has-text-grey">(No '+cityssm.escapeHTML(exports.aliases.lot)+")</span>")+'<br /><span class="is-size-7">'+cityssm.escapeHTML(e.mapName||"")+"</span></td><td>"+e.occupancyStartDateString+"</td><td>"+(e.occupancyEndDate?e.occupancyEndDateString:'<span class="has-text-grey">(No End Date)</span>')+"</td><td>"+s+"</td><td>"+(e.printEJS?'<a class="button is-small" data-tooltip="Print" href="'+t.urlPrefix+"/print/"+e.printEJS+"/?lotOccupancyId="+e.lotOccupancyId+'" target="_blank"><i class="fas fa-print" aria-label="Print"></i></a>':"")+"</td></tr>")}e.innerHTML='<table class="table is-fullwidth is-striped is-hoverable has-sticky-header"><thead><tr><th class="has-width-1"></th><th>'+cityssm.escapeHTML(exports.aliases.occupancy)+" Type</th><th>"+cityssm.escapeHTML(exports.aliases.lot)+"</th><th>"+cityssm.escapeHTML(exports.aliases.occupancyStartDate)+"</th><th>End Date</th><th>"+cityssm.escapeHTML(exports.aliases.occupants)+'</th><th class="has-width-1"><span class="is-sr-only">Print</span></th></tr></thead><table><div class="level"><div class="level-left"><div class="level-item has-text-weight-bold">Displaying '+(i+1).toString()+" to "+Math.min(a.count,s+i)+" of "+a.count+'</div></div><div class="level-right">'+(i>0?'<div class="level-item"><button class="button is-rounded is-link is-outlined" data-page="previous" type="button" title="Previous"><i class="fas fa-arrow-left" aria-hidden="true"></i></button></div>':"")+(s+i<a.count?'<div class="level-item"><button class="button is-rounded is-link" data-page="next" type="button" title="Next"><span>Next</span><span class="icon"><i class="fas fa-arrow-right" aria-hidden="true"></i></span></button></div>':"")+"</div></div>",e.querySelector("table").append(c),i>0&&e.querySelector("button[data-page='previous']").addEventListener("click",o),s+i<a.count&&e.querySelector("button[data-page='next']").addEventListener("click",n)})},r=()=>{c.value="0",i()},o=()=>{c.value=Math.max(Number.parseInt(c.value,10)-s,0).toString(),i()},n=()=>{c.value=(Number.parseInt(c.value,10)+s).toString(),i()},l=a.querySelectorAll("input, select");for(const t of l)t.addEventListener("change",r);a.addEventListener("submit",t=>{t.preventDefault(),r()}),i()})();
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),(()=>{const t=exports.los,e=document.querySelector("#form--searchFilters"),a=document.querySelector("#container--searchResults"),s=Number.parseInt(document.querySelector("#searchFilter--limit").value,10),c=document.querySelector("#searchFilter--offset");function i(e){if(0===e.lotOccupancies.length)return void(a.innerHTML='<div class="message is-info"><p class="message-body">There are no '+cityssm.escapeHTML(exports.aliases.occupancy.toLowerCase())+" records that meet the search criteria.</p></div>");const c=document.createElement("tbody"),i=cityssm.dateToString(new Date);for(const a of e.lotOccupancies){let e="";e=a.occupancyStartDateString<=i&&(""===a.occupancyEndDateString||a.occupancyEndDateString>=i)?'<span class="has-tooltip-right" data-tooltip="Current '+exports.aliases.occupancy+'"><i class="fas fa-play" aria-label="Current '+exports.aliases.occupancy+'"></i></span>':a.occupancyStartDateString>i?'<span class="has-tooltip-right" data-tooltip="Future '+exports.aliases.occupancy+'"><i class="fas fa-fast-forward" aria-label="Future '+exports.aliases.occupancy+'"></i></span>':'<span class="has-tooltip-right" data-tooltip="Past '+exports.aliases.occupancy+'"><i class="fas fa-stop" aria-label="Past '+exports.aliases.occupancy+'"></i></span>';let s="";for(const t of a.lotOccupancyOccupants)s+='<span class="has-tooltip-left" data-tooltip="'+cityssm.escapeHTML(t.lotOccupantType||"")+'"><i class="fas fa-fw fa-'+cityssm.escapeHTML(t.fontAwesomeIconClass||"user")+'" aria-hidden="true"></i> '+cityssm.escapeHTML(t.occupantName||"")+"</span><br />";c.insertAdjacentHTML("beforeend",'<tr><td class="has-width-1">'+e+'</td><td><a class="has-text-weight-bold" href="'+t.urlPrefix+"/lotOccupancies/"+a.lotOccupancyId+'">'+cityssm.escapeHTML(a.occupancyType)+"</a></td><td>"+(a.lotName?'<a class="has-tooltip-right" data-tooltip="'+cityssm.escapeHTML(a.lotType||"")+'" href="'+t.urlPrefix+"/lots/"+a.lotId+'">'+cityssm.escapeHTML(a.lotName)+"</a>":'<span class="has-text-grey">(No '+cityssm.escapeHTML(exports.aliases.lot)+")</span>")+'<br /><span class="is-size-7">'+cityssm.escapeHTML(a.mapName||"")+"</span></td><td>"+a.occupancyStartDateString+"</td><td>"+(a.occupancyEndDate?a.occupancyEndDateString:'<span class="has-text-grey">(No End Date)</span>')+"</td><td>"+s+"</td><td>"+(a.printEJS?'<a class="button is-small" data-tooltip="Print" href="'+t.urlPrefix+"/print/"+a.printEJS+"/?lotOccupancyId="+a.lotOccupancyId+'" target="_blank"><i class="fas fa-print" aria-label="Print"></i></a>':"")+"</td></tr>")}a.innerHTML='<table class="table is-fullwidth is-striped is-hoverable has-sticky-header"><thead><tr><th class="has-width-1"></th><th>'+cityssm.escapeHTML(exports.aliases.occupancy)+" Type</th><th>"+cityssm.escapeHTML(exports.aliases.lot)+"</th><th>"+cityssm.escapeHTML(exports.aliases.occupancyStartDate)+"</th><th>End Date</th><th>"+cityssm.escapeHTML(exports.aliases.occupants)+'</th><th class="has-width-1"><span class="is-sr-only">Print</span></th></tr></thead><table><div class="level"><div class="level-left"><div class="level-item has-text-weight-bold">Displaying '+(e.offset+1).toString()+" to "+Math.min(e.count,s+e.offset)+" of "+e.count+'</div></div><div class="level-right">'+(e.offset>0?'<div class="level-item"><button class="button is-rounded is-link is-outlined" data-page="previous" type="button" title="Previous"><i class="fas fa-arrow-left" aria-hidden="true"></i></button></div>':"")+(s+e.offset<e.count?'<div class="level-item"><button class="button is-rounded is-link" data-page="next" type="button" title="Next"><span>Next</span><span class="icon"><i class="fas fa-arrow-right" aria-hidden="true"></i></span></button></div>':"")+"</div></div>",a.querySelector("table").append(c),e.offset>0&&a.querySelector("button[data-page='previous']").addEventListener("click",r),s+e.offset<e.count&&a.querySelector("button[data-page='next']").addEventListener("click",l)}function o(){a.innerHTML='<div class="has-text-grey has-text-centered"><i class="fas fa-5x fa-circle-notch fa-spin" aria-hidden="true"></i><br />Loading '+exports.aliases.occupancies+"...</div>",cityssm.postJSON(t.urlPrefix+"/lotOccupancies/doSearchLotOccupancies",e,i)}function n(){c.value="0",o()}function r(){c.value=Math.max(Number.parseInt(c.value,10)-s,0).toString(),o()}function l(){c.value=(Number.parseInt(c.value,10)+s).toString(),o()}const p=e.querySelectorAll("input, select");for(const t of p)t.addEventListener("change",n);e.addEventListener("submit",t=>{t.preventDefault(),n()}),o()})();