add function to check for window width and use that throughout the app for more convenient future use

src/web/App.mjs

@@ -50,6 +50,9 @@ class App {
         this.breakpoint = 768;
     }
 
+    isMobileView() {
+        return window.innerWidth < this.breakpoint;
+    }
 
     /**
      * This function sets up the stage and creates listeners for all events.
@@ -297,7 +300,7 @@ class App {
      * @param {boolean} [minimise=false] - Set this flag if attempting to minimise frames to 0 width
      */
     initialiseUI() {
-        if (window.innerWidth < this.breakpoint) {
+        if (this.isMobileView()) {
             this.setMobileUI();
         } else {
             this.setDesktopUI(false);

src/web/HTMLOperation.mjs

@@ -64,14 +64,14 @@ class HTMLOperation {
 
         if (removeIcon) {
             html += "<i class='material-icons remove-icon op-icon'>delete</i>";
-        } else if (!removeIcon && window.innerWidth < this.app.breakpoint) {
+        } else if (!removeIcon && this.app.isMobileView()) {
             html += "<i class='material-icons check-icon op-icon'>check</i>";
         }
 
         // check if local storage is available *and* has favourites at all ( otherwise we use the default favs )
         const isFavourite = this.app.isLocalStorageAvailable() && localStorage.favourites?.includes(this.name);
 
-        if (window.innerWidth < this.app.breakpoint) {
+        if (this.app.isMobileView()) {
             html += `<i title="${this.name}" class='material-icons icon-add-favourite star-icon op-icon ${isFavourite ? "fav-op" : ""}'>
                     ${isFavourite ? "star" : "star_outline"}
                 </i>`;

src/web/waiters/ControlsWaiter.mjs

@@ -450,7 +450,7 @@ ${navigator.userAgent}
         if (maximise) {
             pane.style.height = `${window.innerHeight - 40}px`;
         } else {
-            if (window.innerWidth < this.app.breakpoint) {
+            if (this.app.isMobileView()) {
                 this.app.assignAvailableHeight();
             }
         }

src/web/waiters/OperationsWaiter.mjs

@@ -183,7 +183,7 @@ class OperationsWaiter {
      * @param {event} e
      */
     opListCreate(e) {
-        if (window.innerWidth < this.app.breakpoint) {
+        if (this.app.isMobileView()) {
             this.createMobileOpList(e);
         } else {
             this.createDesktopOpList(e);
@@ -313,7 +313,7 @@ class OperationsWaiter {
             this.removeIntent = false;
         }.bind(this));
 
-        if (window.innerWidth >= this.app.breakpoint) {
+        if (!this.app.isMobileView()) {
             $("#edit-favourites-list [data-toggle=popover]").popover();
         }
         $("#favourites-modal").modal();

src/web/waiters/RecipeWaiter.mjs

@@ -33,7 +33,7 @@ class RecipeWaiter {
      */
     initialiseOperationDragNDrop() {
         const recList = document.getElementById("rec-list");
-        const isMobileView = window.innerWidth < this.app.breakpoint;
+        const isMobileView = this.app.isMobileView();
 
         // Recipe list
         Sortable.create(recList, {

src/web/waiters/WindowWaiter.mjs

@@ -30,7 +30,7 @@ class WindowWaiter {
      * continuous resetting).
      */
     windowResize() {
-        if (window.innerWidth >= this.app.breakpoint) {
+        if (!this.app.isMobileView()) {
             this.onResizeToDesktop();
         } else {
             this.onResizeToMobile();