change save button when unsaved changes

public-typescript/lotEdit.js

@@ -9,13 +9,26 @@ Object.defineProperty(exports, "__esModule", { value: true });
     const isCreate = lotId === '';
     // Main form
     let refreshAfterSave = isCreate;
+    function setUnsavedChanges() {
+        var _a;
+        los.setUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--lot']")) === null || _a === void 0 ? void 0 : _a.classList.remove('is-light');
+    }
+    function clearUnsavedChanges() {
+        var _a;
+        los.clearUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--lot']")) === null || _a === void 0 ? void 0 : _a.classList.add('is-light');
+    }
     const formElement = document.querySelector('#form--lot');
     function updateLot(formEvent) {
         formEvent.preventDefault();
-        cityssm.postJSON(los.urlPrefix + '/lots/' + (isCreate ? 'doCreateLot' : 'doUpdateLot'), formElement, (responseJSON) => {
+        cityssm.postJSON(los.urlPrefix + '/lots/' + (isCreate ? 'doCreateLot' : 'doUpdateLot'), formElement, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                los.clearUnsavedChanges();
+                clearUnsavedChanges();
                 if (isCreate || refreshAfterSave) {
                     window.location.href = los.getLotURL(responseJSON.lotId, true, true);
                 }
@@ -38,7 +51,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
     formElement.addEventListener('submit', updateLot);
     const formInputElements = formElement.querySelectorAll('input, select');
     for (const formInputElement of formInputElements) {
-        formInputElement.addEventListener('change', los.setUnsavedChanges);
+        formInputElement.addEventListener('change', setUnsavedChanges);
     }
     los.initializeUnlockFieldButtons(formElement);
     (_a = document

public-typescript/lotEdit.ts

@@ -20,6 +20,20 @@ declare const bulmaJS: BulmaJS
 
   let refreshAfterSave = isCreate
 
+  function setUnsavedChanges(): void {
+    los.setUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--lot']")
+      ?.classList.remove('is-light')
+  }
+
+  function clearUnsavedChanges(): void {
+    los.clearUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--lot']")
+      ?.classList.add('is-light')
+  }
+
   const formElement = document.querySelector('#form--lot') as HTMLFormElement
 
   function updateLot(formEvent: SubmitEvent): void {
@@ -28,13 +42,15 @@ declare const bulmaJS: BulmaJS
     cityssm.postJSON(
       los.urlPrefix + '/lots/' + (isCreate ? 'doCreateLot' : 'doUpdateLot'),
       formElement,
-      (responseJSON: {
+      (rawResponseJSON) => {
+        const responseJSON = rawResponseJSON as {
           success: boolean
           lotId?: number
           errorMessage?: string
-      }) => {
+        }
+
         if (responseJSON.success) {
-          los.clearUnsavedChanges()
+          clearUnsavedChanges()
 
           if (isCreate || refreshAfterSave) {
             window.location.href = los.getLotURL(responseJSON.lotId, true, true)
@@ -60,7 +76,7 @@ declare const bulmaJS: BulmaJS
   const formInputElements = formElement.querySelectorAll('input, select')
 
   for (const formInputElement of formInputElements) {
-    formInputElement.addEventListener('change', los.setUnsavedChanges)
+    formInputElement.addEventListener('change', setUnsavedChanges)
   }
 
   los.initializeUnlockFieldButtons(formElement)

public-typescript/lotOccupancyEdit.js

@@ -10,15 +10,28 @@ Object.defineProperty(exports, "__esModule", { value: true });
      * Main form
      */
     let refreshAfterSave = isCreate;
+    function setUnsavedChanges() {
+        var _a;
+        los.setUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--lotOccupancy']")) === null || _a === void 0 ? void 0 : _a.classList.remove('is-light');
+    }
+    function clearUnsavedChanges() {
+        var _a;
+        los.clearUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--lotOccupancy']")) === null || _a === void 0 ? void 0 : _a.classList.add('is-light');
+    }
     const formElement = document.querySelector('#form--lotOccupancy');
     formElement.addEventListener('submit', (formEvent) => {
         formEvent.preventDefault();
         cityssm.postJSON(los.urlPrefix +
             '/lotOccupancies/' +
-            (isCreate ? 'doCreateLotOccupancy' : 'doUpdateLotOccupancy'), formElement, (responseJSON) => {
+            (isCreate ? 'doCreateLotOccupancy' : 'doUpdateLotOccupancy'), formElement, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                los.clearUnsavedChanges();
+                clearUnsavedChanges();
                 if (isCreate || refreshAfterSave) {
                     window.location.href = los.getLotOccupancyURL(responseJSON.lotOccupancyId, true, true);
                 }
@@ -40,15 +53,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
     });
     const formInputElements = formElement.querySelectorAll('input, select');
     for (const formInputElement of formInputElements) {
-        formInputElement.addEventListener('change', los.setUnsavedChanges);
+        formInputElement.addEventListener('change', setUnsavedChanges);
     }
     function doCopy() {
         cityssm.postJSON(los.urlPrefix + '/lotOccupancies/doCopyLotOccupancy', {
             lotOccupancyId
-        }, (responseJSON) => {
+        }, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                cityssm.disableNavBlocker();
+                clearUnsavedChanges();
                 window.location.href = los.getLotOccupancyURL(responseJSON.lotOccupancyId, true);
             }
             else {
@@ -88,10 +102,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
         function doDelete() {
             cityssm.postJSON(los.urlPrefix + '/lotOccupancies/doDeleteLotOccupancy', {
                 lotOccupancyId
-            }, (responseJSON) => {
+            }, (rawResponseJSON) => {
                 var _a;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.success) {
-                    cityssm.disableNavBlocker();
+                    clearUnsavedChanges();
                     window.location.href = los.getLotOccupancyURL();
                 }
                 else {
@@ -119,7 +134,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
         let createCloseModalFunction;
         function doCreate(formEvent) {
             formEvent.preventDefault();
-            cityssm.postJSON(los.urlPrefix + '/workOrders/doCreateWorkOrder', formEvent.currentTarget, (responseJSON) => {
+            cityssm.postJSON(los.urlPrefix + '/workOrders/doCreateWorkOrder', formEvent.currentTarget, (rawResponseJSON) => {
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.success) {
                     createCloseModalFunction();
                     bulmaJS.confirm({
@@ -188,8 +204,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
             }
             cityssm.postJSON(los.urlPrefix + '/lotOccupancies/doGetOccupancyTypeFields', {
                 occupancyTypeId: occupancyTypeIdElement.value
-            }, (responseJSON) => {
+            }, (rawResponseJSON) => {
                 var _a, _b;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.occupancyTypeFields.length === 0) {
                     lotOccupancyFieldsContainerElement.innerHTML = `<div class="message is-info">
               <p class="message-body">There are no additional fields for this ${los.escapedAliases.occupancy} type.</p>
@@ -297,8 +314,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
         function searchLots() {
             lotSelectResultsElement.innerHTML =
                 los.getLoadingParagraphHTML('Searching...');
-            cityssm.postJSON(los.urlPrefix + '/lots/doSearchLots', lotSelectFormElement, (responseJSON) => {
+            cityssm.postJSON(los.urlPrefix + '/lots/doSearchLots', lotSelectFormElement, (rawResponseJSON) => {
                 var _a, _b;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.count === 0) {
                     lotSelectResultsElement.innerHTML = `<div class="message is-info">
               <p class="message-body">No results.</p>
@@ -340,8 +358,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
         function createLotAndSelect(submitEvent) {
             submitEvent.preventDefault();
             const lotName = lotSelectModalElement.querySelector('#lotCreate--lotName').value;
-            cityssm.postJSON(los.urlPrefix + '/lots/doCreateLot', submitEvent.currentTarget, (responseJSON) => {
+            cityssm.postJSON(los.urlPrefix + '/lots/doCreateLot', submitEvent.currentTarget, (rawResponseJSON) => {
                 var _a;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.success) {
                     renderSelectedLotAndClose(responseJSON.lotId, lotName);
                 }

public-typescript/lotOccupancyEdit/lotOccupancyEdit.js

@@ -10,15 +10,28 @@ Object.defineProperty(exports, "__esModule", { value: true });
      * Main form
      */
     let refreshAfterSave = isCreate;
+    function setUnsavedChanges() {
+        var _a;
+        los.setUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--lotOccupancy']")) === null || _a === void 0 ? void 0 : _a.classList.remove('is-light');
+    }
+    function clearUnsavedChanges() {
+        var _a;
+        los.clearUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--lotOccupancy']")) === null || _a === void 0 ? void 0 : _a.classList.add('is-light');
+    }
     const formElement = document.querySelector('#form--lotOccupancy');
     formElement.addEventListener('submit', (formEvent) => {
         formEvent.preventDefault();
         cityssm.postJSON(los.urlPrefix +
             '/lotOccupancies/' +
-            (isCreate ? 'doCreateLotOccupancy' : 'doUpdateLotOccupancy'), formElement, (responseJSON) => {
+            (isCreate ? 'doCreateLotOccupancy' : 'doUpdateLotOccupancy'), formElement, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                los.clearUnsavedChanges();
+                clearUnsavedChanges();
                 if (isCreate || refreshAfterSave) {
                     window.location.href = los.getLotOccupancyURL(responseJSON.lotOccupancyId, true, true);
                 }
@@ -40,15 +53,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
     });
     const formInputElements = formElement.querySelectorAll('input, select');
     for (const formInputElement of formInputElements) {
-        formInputElement.addEventListener('change', los.setUnsavedChanges);
+        formInputElement.addEventListener('change', setUnsavedChanges);
     }
     function doCopy() {
         cityssm.postJSON(los.urlPrefix + '/lotOccupancies/doCopyLotOccupancy', {
             lotOccupancyId
-        }, (responseJSON) => {
+        }, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                cityssm.disableNavBlocker();
+                clearUnsavedChanges();
                 window.location.href = los.getLotOccupancyURL(responseJSON.lotOccupancyId, true);
             }
             else {
@@ -88,10 +102,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
         function doDelete() {
             cityssm.postJSON(los.urlPrefix + '/lotOccupancies/doDeleteLotOccupancy', {
                 lotOccupancyId
-            }, (responseJSON) => {
+            }, (rawResponseJSON) => {
                 var _a;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.success) {
-                    cityssm.disableNavBlocker();
+                    clearUnsavedChanges();
                     window.location.href = los.getLotOccupancyURL();
                 }
                 else {
@@ -119,7 +134,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
         let createCloseModalFunction;
         function doCreate(formEvent) {
             formEvent.preventDefault();
-            cityssm.postJSON(los.urlPrefix + '/workOrders/doCreateWorkOrder', formEvent.currentTarget, (responseJSON) => {
+            cityssm.postJSON(los.urlPrefix + '/workOrders/doCreateWorkOrder', formEvent.currentTarget, (rawResponseJSON) => {
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.success) {
                     createCloseModalFunction();
                     bulmaJS.confirm({
@@ -188,8 +204,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
             }
             cityssm.postJSON(los.urlPrefix + '/lotOccupancies/doGetOccupancyTypeFields', {
                 occupancyTypeId: occupancyTypeIdElement.value
-            }, (responseJSON) => {
+            }, (rawResponseJSON) => {
                 var _a, _b;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.occupancyTypeFields.length === 0) {
                     lotOccupancyFieldsContainerElement.innerHTML = `<div class="message is-info">
               <p class="message-body">There are no additional fields for this ${los.escapedAliases.occupancy} type.</p>
@@ -297,8 +314,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
         function searchLots() {
             lotSelectResultsElement.innerHTML =
                 los.getLoadingParagraphHTML('Searching...');
-            cityssm.postJSON(los.urlPrefix + '/lots/doSearchLots', lotSelectFormElement, (responseJSON) => {
+            cityssm.postJSON(los.urlPrefix + '/lots/doSearchLots', lotSelectFormElement, (rawResponseJSON) => {
                 var _a, _b;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.count === 0) {
                     lotSelectResultsElement.innerHTML = `<div class="message is-info">
               <p class="message-body">No results.</p>
@@ -340,8 +358,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
         function createLotAndSelect(submitEvent) {
             submitEvent.preventDefault();
             const lotName = lotSelectModalElement.querySelector('#lotCreate--lotName').value;
-            cityssm.postJSON(los.urlPrefix + '/lots/doCreateLot', submitEvent.currentTarget, (responseJSON) => {
+            cityssm.postJSON(los.urlPrefix + '/lots/doCreateLot', submitEvent.currentTarget, (rawResponseJSON) => {
                 var _a;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.success) {
                     renderSelectedLotAndClose(responseJSON.lotId, lotName);
                 }

public-typescript/lotOccupancyEdit/lotOccupancyEdit.ts

@@ -23,6 +23,20 @@ declare const bulmaJS: BulmaJS
 
   let refreshAfterSave = isCreate
 
+  function setUnsavedChanges(): void {
+    los.setUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--lotOccupancy']")
+      ?.classList.remove('is-light')
+  }
+
+  function clearUnsavedChanges(): void {
+    los.clearUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--lotOccupancy']")
+      ?.classList.add('is-light')
+  }
+
   const formElement = document.querySelector(
     '#form--lotOccupancy'
   ) as HTMLFormElement
@@ -35,13 +49,15 @@ declare const bulmaJS: BulmaJS
         '/lotOccupancies/' +
         (isCreate ? 'doCreateLotOccupancy' : 'doUpdateLotOccupancy'),
       formElement,
-      (responseJSON: {
+      (rawResponseJSON) => {
+        const responseJSON = rawResponseJSON as {
           success: boolean
           lotOccupancyId?: number
           errorMessage?: string
-      }) => {
+        }
+
         if (responseJSON.success) {
-          los.clearUnsavedChanges()
+          clearUnsavedChanges()
 
           if (isCreate || refreshAfterSave) {
             window.location.href = los.getLotOccupancyURL(
@@ -69,7 +85,7 @@ declare const bulmaJS: BulmaJS
   const formInputElements = formElement.querySelectorAll('input, select')
 
   for (const formInputElement of formInputElements) {
-    formInputElement.addEventListener('change', los.setUnsavedChanges)
+    formInputElement.addEventListener('change', setUnsavedChanges)
   }
 
   function doCopy(): void {
@@ -78,13 +94,16 @@ declare const bulmaJS: BulmaJS
       {
         lotOccupancyId
       },
-      (responseJSON: {
+      (rawResponseJSON) => {
+        const responseJSON = rawResponseJSON as {
           success: boolean
           errorMessage?: string
           lotOccupancyId?: number
-      }) => {
+        }
+
         if (responseJSON.success) {
-          cityssm.disableNavBlocker()
+          clearUnsavedChanges()
+
           window.location.href = los.getLotOccupancyURL(
             responseJSON.lotOccupancyId,
             true
@@ -135,9 +154,14 @@ declare const bulmaJS: BulmaJS
           {
             lotOccupancyId
           },
-          (responseJSON: { success: boolean; errorMessage?: string }) => {
+          (rawResponseJSON) => {
+            const responseJSON = rawResponseJSON as {
+              success: boolean
+              errorMessage?: string
+            }
+
             if (responseJSON.success) {
-              cityssm.disableNavBlocker()
+              clearUnsavedChanges()
               window.location.href = los.getLotOccupancyURL()
             } else {
               bulmaJS.alert({
@@ -174,11 +198,13 @@ declare const bulmaJS: BulmaJS
         cityssm.postJSON(
           los.urlPrefix + '/workOrders/doCreateWorkOrder',
           formEvent.currentTarget,
-          (responseJSON: {
+          (rawResponseJSON) => {
+            const responseJSON = rawResponseJSON as {
               success: boolean
               errorMessage?: string
               workOrderId?: number
-          }) => {
+            }
+
             if (responseJSON.success) {
               createCloseModalFunction()
 
@@ -287,9 +313,11 @@ declare const bulmaJS: BulmaJS
         {
           occupancyTypeId: occupancyTypeIdElement.value
         },
-        (responseJSON: {
+        (rawResponseJSON) => {
+          const responseJSON = rawResponseJSON as {
             occupancyTypeFields: recordTypes.OccupancyTypeField[]
-        }) => {
+          }
+
           if (responseJSON.occupancyTypeFields.length === 0) {
             lotOccupancyFieldsContainerElement.innerHTML = `<div class="message is-info">
               <p class="message-body">There are no additional fields for this ${los.escapedAliases.occupancy} type.</p>
@@ -459,7 +487,12 @@ declare const bulmaJS: BulmaJS
       cityssm.postJSON(
         los.urlPrefix + '/lots/doSearchLots',
         lotSelectFormElement,
-        (responseJSON: { count: number; lots: recordTypes.Lot[] }) => {
+        (rawResponseJSON) => {
+          const responseJSON = rawResponseJSON as {
+            count: number
+            lots: recordTypes.Lot[]
+          }
+
           if (responseJSON.count === 0) {
             lotSelectResultsElement.innerHTML = `<div class="message is-info">
               <p class="message-body">No results.</p>
@@ -520,11 +553,13 @@ declare const bulmaJS: BulmaJS
       cityssm.postJSON(
         los.urlPrefix + '/lots/doCreateLot',
         submitEvent.currentTarget,
-        (responseJSON: {
+        (rawResponseJSON) => {
+          const responseJSON = rawResponseJSON as {
             success: boolean
             errorMessage?: string
             lotId?: number
-        }) => {
+          }
+
           if (responseJSON.success) {
             renderSelectedLotAndClose(responseJSON.lotId!, lotName)
           } else {

public-typescript/mapEdit.js

@@ -8,12 +8,25 @@ Object.defineProperty(exports, "__esModule", { value: true });
         .value;
     const isCreate = mapId === '';
     const mapForm = document.querySelector('#form--map');
+    function setUnsavedChanges() {
+        var _a;
+        los.setUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--map']")) === null || _a === void 0 ? void 0 : _a.classList.remove('is-light');
+    }
+    function clearUnsavedChanges() {
+        var _a;
+        los.clearUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--map']")) === null || _a === void 0 ? void 0 : _a.classList.add('is-light');
+    }
     function updateMap(formEvent) {
         formEvent.preventDefault();
-        cityssm.postJSON(los.urlPrefix + '/maps/' + (isCreate ? 'doCreateMap' : 'doUpdateMap'), mapForm, (responseJSON) => {
+        cityssm.postJSON(los.urlPrefix + '/maps/' + (isCreate ? 'doCreateMap' : 'doUpdateMap'), mapForm, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                cityssm.disableNavBlocker();
+                clearUnsavedChanges();
                 if (isCreate) {
                     window.location.href = los.getMapURL(responseJSON.mapId, true);
                 }
@@ -36,7 +49,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
     mapForm.addEventListener('submit', updateMap);
     const inputElements = mapForm.querySelectorAll('input, select');
     for (const inputElement of inputElements) {
-        inputElement.addEventListener('change', cityssm.enableNavBlocker);
+        inputElement.addEventListener('change', setUnsavedChanges);
     }
     (_a = document
         .querySelector('#button--deleteMap')) === null || _a === void 0 ? void 0 : _a.addEventListener('click', (clickEvent) => {
@@ -44,8 +57,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
         function doDelete() {
             cityssm.postJSON(los.urlPrefix + '/maps/doDeleteMap', {
                 mapId
-            }, (responseJSON) => {
+            }, (rawResponseJSON) => {
                 var _a;
+                const responseJSON = rawResponseJSON;
                 if (responseJSON.success) {
                     window.location.href = los.getMapURL();
                 }

public-typescript/mapEdit.ts

@@ -16,19 +16,35 @@ declare const bulmaJS: BulmaJS
 
   const mapForm = document.querySelector('#form--map') as HTMLFormElement
 
+  function setUnsavedChanges(): void {
+    los.setUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--map']")
+      ?.classList.remove('is-light')
+  }
+
+  function clearUnsavedChanges(): void {
+    los.clearUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--map']")
+      ?.classList.add('is-light')
+  }
+
   function updateMap(formEvent: SubmitEvent): void {
     formEvent.preventDefault()
 
     cityssm.postJSON(
       los.urlPrefix + '/maps/' + (isCreate ? 'doCreateMap' : 'doUpdateMap'),
       mapForm,
-      (responseJSON: {
+      (rawResponseJSON) => {
+        const responseJSON = rawResponseJSON as {
           success: boolean
           mapId?: number
           errorMessage?: string
-      }) => {
+        }
+
         if (responseJSON.success) {
-          cityssm.disableNavBlocker()
+          clearUnsavedChanges()
 
           if (isCreate) {
             window.location.href = los.getMapURL(responseJSON.mapId, true)
@@ -55,7 +71,7 @@ declare const bulmaJS: BulmaJS
     mapForm.querySelectorAll('input, select')
 
   for (const inputElement of inputElements) {
-    inputElement.addEventListener('change', cityssm.enableNavBlocker)
+    inputElement.addEventListener('change', setUnsavedChanges)
   }
 
   document
@@ -69,7 +85,12 @@ declare const bulmaJS: BulmaJS
           {
             mapId
           },
-          (responseJSON: { success: boolean; errorMessage?: string }) => {
+          (rawResponseJSON) => {
+            const responseJSON = rawResponseJSON as {
+              success: boolean
+              errorMessage?: string
+            }
+
             if (responseJSON.success) {
               window.location.href = los.getMapURL()
             } else {

public-typescript/workOrderEdit.js

@@ -11,14 +11,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
         .querySelector('#workOrderEdit--workOrderOpenDateString')
         .closest('.field'));
     los.initializeUnlockFieldButtons(workOrderFormElement);
+    function setUnsavedChanges() {
+        var _a;
+        los.setUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--workOrderEdit']")) === null || _a === void 0 ? void 0 : _a.classList.remove('is-light');
+    }
+    function clearUnsavedChanges() {
+        var _a;
+        los.clearUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--workOrderEdit']")) === null || _a === void 0 ? void 0 : _a.classList.add('is-light');
+    }
     workOrderFormElement.addEventListener('submit', (submitEvent) => {
         submitEvent.preventDefault();
         cityssm.postJSON(los.urlPrefix +
             '/workOrders/' +
-            (isCreate ? 'doCreateWorkOrder' : 'doUpdateWorkOrder'), submitEvent.currentTarget, (responseJSON) => {
+            (isCreate ? 'doCreateWorkOrder' : 'doUpdateWorkOrder'), submitEvent.currentTarget, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                cityssm.disableNavBlocker();
+                clearUnsavedChanges();
                 if (isCreate) {
                     window.location.href = los.getWorkOrderURL(responseJSON.workOrderId, true);
                 }
@@ -38,9 +51,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
             }
         });
     });
-    const inputElements = workOrderFormElement.querySelectorAll('input, select');
+    const inputElements = workOrderFormElement.querySelectorAll('input, select, textarea');
     for (const inputElement of inputElements) {
-        inputElement.addEventListener('change', cityssm.enableNavBlocker);
+        inputElement.addEventListener('change', setUnsavedChanges);
     }
     /*
      * Work Order Options
@@ -48,9 +61,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
     function doClose() {
         cityssm.postJSON(los.urlPrefix + '/workOrders/doCloseWorkOrder', {
             workOrderId
-        }, (responseJSON) => {
+        }, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
+                clearUnsavedChanges();
                 window.location.href = los.getWorkOrderURL(workOrderId);
             }
             else {
@@ -65,9 +80,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
     function doDelete() {
         cityssm.postJSON(los.urlPrefix + '/workOrders/doDeleteWorkOrder', {
             workOrderId
-        }, (responseJSON) => {
+        }, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
+                clearUnsavedChanges();
                 window.location.href = los.urlPrefix + '/workOrders';
             }
             else {
@@ -109,8 +126,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
         else {
             bulmaJS.confirm({
                 title: 'Close Work Order',
-                message: 'Are you sure you want to close this work order?',
+                message: los.hasUnsavedChanges()
-                contextualColorName: 'info',
+                    ? 'Are you sure you want to close this work order with unsaved changes?'
+                    : 'Are you sure you want to close this work order?',
+                contextualColorName: los.hasUnsavedChanges() ? 'warning' : 'info',
                 okButton: {
                     text: 'Yes, Close Work Order',
                     callbackFunction: doClose
@@ -902,8 +921,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
     /*
      * Milestones
      */
-    function processMilestoneResponse(responseJSON) {
+    function processMilestoneResponse(rawResponseJSON) {
         var _a;
+        const responseJSON = rawResponseJSON;
         if (responseJSON.success) {
             workOrderMilestones = responseJSON.workOrderMilestones;
             renderMilestones();

public-typescript/workOrderEdit/workOrderEdit.js

@@ -11,14 +11,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
         .querySelector('#workOrderEdit--workOrderOpenDateString')
         .closest('.field'));
     los.initializeUnlockFieldButtons(workOrderFormElement);
+    function setUnsavedChanges() {
+        var _a;
+        los.setUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--workOrderEdit']")) === null || _a === void 0 ? void 0 : _a.classList.remove('is-light');
+    }
+    function clearUnsavedChanges() {
+        var _a;
+        los.clearUnsavedChanges();
+        (_a = document
+            .querySelector("button[type='submit'][form='form--workOrderEdit']")) === null || _a === void 0 ? void 0 : _a.classList.add('is-light');
+    }
     workOrderFormElement.addEventListener('submit', (submitEvent) => {
         submitEvent.preventDefault();
         cityssm.postJSON(los.urlPrefix +
             '/workOrders/' +
-            (isCreate ? 'doCreateWorkOrder' : 'doUpdateWorkOrder'), submitEvent.currentTarget, (responseJSON) => {
+            (isCreate ? 'doCreateWorkOrder' : 'doUpdateWorkOrder'), submitEvent.currentTarget, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
-                cityssm.disableNavBlocker();
+                clearUnsavedChanges();
                 if (isCreate) {
                     window.location.href = los.getWorkOrderURL(responseJSON.workOrderId, true);
                 }
@@ -38,9 +51,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
             }
         });
     });
-    const inputElements = workOrderFormElement.querySelectorAll('input, select');
+    const inputElements = workOrderFormElement.querySelectorAll('input, select, textarea');
     for (const inputElement of inputElements) {
-        inputElement.addEventListener('change', cityssm.enableNavBlocker);
+        inputElement.addEventListener('change', setUnsavedChanges);
     }
     /*
      * Work Order Options
@@ -48,9 +61,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
     function doClose() {
         cityssm.postJSON(los.urlPrefix + '/workOrders/doCloseWorkOrder', {
             workOrderId
-        }, (responseJSON) => {
+        }, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
+                clearUnsavedChanges();
                 window.location.href = los.getWorkOrderURL(workOrderId);
             }
             else {
@@ -65,9 +80,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
     function doDelete() {
         cityssm.postJSON(los.urlPrefix + '/workOrders/doDeleteWorkOrder', {
             workOrderId
-        }, (responseJSON) => {
+        }, (rawResponseJSON) => {
             var _a;
+            const responseJSON = rawResponseJSON;
             if (responseJSON.success) {
+                clearUnsavedChanges();
                 window.location.href = los.urlPrefix + '/workOrders';
             }
             else {
@@ -109,8 +126,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
         else {
             bulmaJS.confirm({
                 title: 'Close Work Order',
-                message: 'Are you sure you want to close this work order?',
+                message: los.hasUnsavedChanges()
-                contextualColorName: 'info',
+                    ? 'Are you sure you want to close this work order with unsaved changes?'
+                    : 'Are you sure you want to close this work order?',
+                contextualColorName: los.hasUnsavedChanges() ? 'warning' : 'info',
                 okButton: {
                     text: 'Yes, Close Work Order',
                     callbackFunction: doClose
@@ -144,8 +163,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
     /*
      * Milestones
      */
-    function processMilestoneResponse(responseJSON) {
+    function processMilestoneResponse(rawResponseJSON) {
         var _a;
+        const responseJSON = rawResponseJSON;
         if (responseJSON.success) {
             workOrderMilestones = responseJSON.workOrderMilestones;
             renderMilestones();

public-typescript/workOrderEdit/workOrderEdit.ts

@@ -28,6 +28,20 @@ declare const bulmaJS: BulmaJS
   )
   los.initializeUnlockFieldButtons(workOrderFormElement)
 
+  function setUnsavedChanges(): void {
+    los.setUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--workOrderEdit']")
+      ?.classList.remove('is-light')
+  }
+
+  function clearUnsavedChanges(): void {
+    los.clearUnsavedChanges()
+    document
+      .querySelector("button[type='submit'][form='form--workOrderEdit']")
+      ?.classList.add('is-light')
+  }
+
   workOrderFormElement.addEventListener('submit', (submitEvent) => {
     submitEvent.preventDefault()
 
@@ -36,13 +50,15 @@ declare const bulmaJS: BulmaJS
         '/workOrders/' +
         (isCreate ? 'doCreateWorkOrder' : 'doUpdateWorkOrder'),
       submitEvent.currentTarget,
-      (responseJSON: {
+      (rawResponseJSON) => {
+        const responseJSON = rawResponseJSON as {
           success: boolean
           workOrderId?: number
           errorMessage?: string
-      }) => {
+        }
+
         if (responseJSON.success) {
-          cityssm.disableNavBlocker()
+          clearUnsavedChanges()
 
           if (isCreate) {
             window.location.href = los.getWorkOrderURL(
@@ -66,11 +82,11 @@ declare const bulmaJS: BulmaJS
     )
   })
 
-  const inputElements: NodeListOf<HTMLInputElement | HTMLSelectElement> =
+  const inputElements: NodeListOf<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> =
-    workOrderFormElement.querySelectorAll('input, select')
+    workOrderFormElement.querySelectorAll('input, select, textarea')
 
   for (const inputElement of inputElements) {
-    inputElement.addEventListener('change', cityssm.enableNavBlocker)
+    inputElement.addEventListener('change', setUnsavedChanges)
   }
 
   /*
@@ -83,8 +99,14 @@ declare const bulmaJS: BulmaJS
       {
         workOrderId
       },
-      (responseJSON: { success: boolean; errorMessage?: string }) => {
+      (rawResponseJSON) => {
+        const responseJSON = rawResponseJSON as {
+          success: boolean
+          errorMessage?: string
+        }
+
         if (responseJSON.success) {
+          clearUnsavedChanges()
           window.location.href = los.getWorkOrderURL(workOrderId)
         } else {
           bulmaJS.alert({
@@ -103,8 +125,14 @@ declare const bulmaJS: BulmaJS
       {
         workOrderId
       },
-      (responseJSON: { success: boolean; errorMessage?: string }) => {
+      (rawResponseJSON) => {
+        const responseJSON = rawResponseJSON as {
+          success: boolean
+          errorMessage?: string
+        }
+
         if (responseJSON.success) {
+          clearUnsavedChanges()
           window.location.href = los.urlPrefix + '/workOrders'
         } else {
           bulmaJS.alert({
@@ -150,8 +178,10 @@ declare const bulmaJS: BulmaJS
       } else {
         bulmaJS.confirm({
           title: 'Close Work Order',
-          message: 'Are you sure you want to close this work order?',
+          message: los.hasUnsavedChanges()
-          contextualColorName: 'info',
+            ? 'Are you sure you want to close this work order with unsaved changes?'
+            : 'Are you sure you want to close this work order?',
+          contextualColorName: los.hasUnsavedChanges() ? 'warning' : 'info',
           okButton: {
             text: 'Yes, Close Work Order',
             callbackFunction: doClose
@@ -194,11 +224,13 @@ declare const bulmaJS: BulmaJS
    * Milestones
    */
 
-  function processMilestoneResponse(responseJSON: {
+  function processMilestoneResponse(rawResponseJSON: unknown): void {
+    const responseJSON = rawResponseJSON as {
       success: boolean
       errorMessage?: string
       workOrderMilestones?: recordTypes.WorkOrderMilestone[]
-  }): void {
+    }
+
     if (responseJSON.success) {
       workOrderMilestones = responseJSON.workOrderMilestones!
       renderMilestones()

public/javascripts/mapEdit.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),(()=>{var e;const a=exports.los,t=document.querySelector("#map--mapId").value,s=""===t,l=document.querySelector("#form--map");l.addEventListener("submit",function(e){e.preventDefault(),cityssm.postJSON(a.urlPrefix+"/maps/"+(s?"doCreateMap":"doUpdateMap"),l,e=>{var t;e.success?(cityssm.disableNavBlocker(),s?window.location.href=a.getMapURL(e.mapId,!0):bulmaJS.alert({message:a.escapedAliases.Map+" Updated Successfully",contextualColorName:"success"})):bulmaJS.alert({title:"Error Updating "+a.escapedAliases.Map,message:null!==(t=e.errorMessage)&&void 0!==t?t:"",contextualColorName:"danger"})})});const o=l.querySelectorAll("input, select");for(const e of o)e.addEventListener("change",cityssm.enableNavBlocker);null===(e=document.querySelector("#button--deleteMap"))||void 0===e||e.addEventListener("click",e=>{e.preventDefault(),bulmaJS.confirm({title:"Delete "+a.escapedAliases.Map,message:`Are you sure you want to delete this ${a.escapedAliases.map} and all related ${a.escapedAliases.lots}?`,contextualColorName:"warning",okButton:{text:`Yes, Delete ${a.escapedAliases.Map}`,callbackFunction:function(){cityssm.postJSON(a.urlPrefix+"/maps/doDeleteMap",{mapId:t},e=>{var t;e.success?window.location.href=a.getMapURL():bulmaJS.alert({title:"Error Deleting "+a.escapedAliases.Map,message:null!==(t=e.errorMessage)&&void 0!==t?t:"",contextualColorName:"danger"})})}}})})})();
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),(()=>{var e;const t=exports.los,a=document.querySelector("#map--mapId").value,s=""===a,o=document.querySelector("#form--map");function l(){var e;t.setUnsavedChanges(),null===(e=document.querySelector("button[type='submit'][form='form--map']"))||void 0===e||e.classList.remove("is-light")}o.addEventListener("submit",function(e){e.preventDefault(),cityssm.postJSON(t.urlPrefix+"/maps/"+(s?"doCreateMap":"doUpdateMap"),o,e=>{var a;const o=e;o.success?(function(){var e;t.clearUnsavedChanges(),null===(e=document.querySelector("button[type='submit'][form='form--map']"))||void 0===e||e.classList.add("is-light")}(),s?window.location.href=t.getMapURL(o.mapId,!0):bulmaJS.alert({message:t.escapedAliases.Map+" Updated Successfully",contextualColorName:"success"})):bulmaJS.alert({title:"Error Updating "+t.escapedAliases.Map,message:null!==(a=o.errorMessage)&&void 0!==a?a:"",contextualColorName:"danger"})})});const r=o.querySelectorAll("input, select");for(const e of r)e.addEventListener("change",l);null===(e=document.querySelector("#button--deleteMap"))||void 0===e||e.addEventListener("click",e=>{e.preventDefault(),bulmaJS.confirm({title:"Delete "+t.escapedAliases.Map,message:`Are you sure you want to delete this ${t.escapedAliases.map} and all related ${t.escapedAliases.lots}?`,contextualColorName:"warning",okButton:{text:`Yes, Delete ${t.escapedAliases.Map}`,callbackFunction:function(){cityssm.postJSON(t.urlPrefix+"/maps/doDeleteMap",{mapId:a},e=>{var a;const s=e;s.success?window.location.href=t.getMapURL():bulmaJS.alert({title:"Error Deleting "+t.escapedAliases.Map,message:null!==(a=s.errorMessage)&&void 0!==a?a:"",contextualColorName:"danger"})})}}})})})();

views/lot-edit.ejs

@@ -68,7 +68,7 @@
       </div>
     <% } %>
     <div class="level-item">
-      <button class="button is-primary" type="submit" form="form--lot">
+      <button class="button is-light is-primary" type="submit" form="form--lot">
         <span class="icon is-small"><i class="fas fa-save" aria-hidden="true"></i></span>
         <span>
           <%= (isCreate ? "Create" : "Update") %>
@@ -80,7 +80,7 @@
   
 </div>
 
-<form id="form--lot">
+<form class="mb-5" id="form--lot">
   <input id="lot--lotId" name="lotId" type="hidden" value="<%= isCreate ? "" : lot.lotId %>" />
 
   <div class="panel">

views/lotOccupancy-edit.ejs

@@ -118,7 +118,7 @@
       </div>
     <% } %>
     <div class="level-item">
-      <button class="button is-success" type="submit" form="form--lotOccupancy">
+      <button class="button is-primary is-light" type="submit" form="form--lotOccupancy">
         <span class="icon is-small"><i class="fas fa-save" aria-hidden="true"></i></span>
         <span>
           <%= (isCreate ? "Create" : "Update") %>

views/map-edit.ejs

@@ -68,7 +68,7 @@
       </div>
     <% } %>
     <div class="level-item">
-      <button class="button is-primary" type="submit" form="form--map">
+      <button class="button is-primary is-light" type="submit" form="form--map">
         <span class="icon is-small"><i class="fas fa-save" aria-hidden="true"></i></span>
         <span>
             <%= (isCreate ? "Create": "Update") %>

views/workOrder-edit.ejs

@@ -111,7 +111,7 @@
           </div>
         </div>
       <% } %>
-      <button class="button is-success" type="submit" form="form--workOrderEdit">
+      <button class="button is-primary is-light" type="submit" form="form--workOrderEdit">
         <span class="icon is-small"><i class="fas fa-save" aria-hidden="true"></i></span>
         <span>
           <%= (isCreate ? "Create" : "Update") %>