.

src/App.svelte

@@ -38,6 +38,9 @@
 
   const wsManager = new WebSocketManager(deviceList, debug);
 
+  let layoutJson = wsManager.layoutJson;
+  $: layoutJson = wsManager.layoutJson;
+
   router.subscribe(handleNavigation);
 
   function handleNavigation() {
@@ -283,7 +286,7 @@
           <Alarm title="Подключение через {wsManager.remainingTimeout} сек." />
         {:else}
           <Route path="/">
-            <DashboardPage show={wsManager.pageReady.dash} layoutJson={wsManager.layoutJson} pages={wsManager.pages} wsPush={(ws, topic, status) => wsManager.wsPush(ws, topic, status)} />
+            <DashboardPage show={wsManager.pageReady.dash} layoutJson={layoutJson} pages={wsManager.pages} wsPush={(ws, topic, status) => wsManager.wsPush(ws, topic, status)} />
           </Route>
           <!--<Route path="/config">
             <ConfigPage show={pageReady.config} bind:configJson={configJson} bind:scenarioTxt={scenarioTxt} widgetsJson={widgetsJson} itemsJson={itemsJson} saveConfig={() => saveConfig()} cleanLogs={() => cleanLogs()} rebootEsp={() => rebootEsp()} moduleOrder={(id, key, value) => moduleOrder(id, key, value)} userdata={userdata} />

src/WebSocketManager.js

@@ -346,6 +346,10 @@ class WebSocketManager {
 
   sortingLayout(ws) {
     this.layoutJson.sort((a, b) => a.descr.localeCompare(b.descr));
+    this.pages = Array.from(new Set(this.layoutJson.map(({ page }) => page)))
+      .map((page) => ({ page }))
+      .sort((a, b) => a.page.localeCompare(b.page));
+    console.log("[3]", ws, "layout sort, requested params...");
     this.wsSendMsg(ws, "/params|");
   }
 
@@ -500,11 +504,8 @@ class WebSocketManager {
     });
   }
 
-  //слияние layout-ов всех устройств в общий layout
   async combineLayoutsInOne(ws, devLayout) {
-    for (let i = 0; i < devLayout.length; i++) {
+    devLayout.forEach((item) => (item.ws = ws));
-      devLayout[i].ws = ws;
-    }
     this.layoutJson = this.layoutJson.concat(devLayout);
     console.log("[2]", ws, "devLayout pushed to layout");
     this.sortingLayout(ws);
@@ -512,61 +513,19 @@ class WebSocketManager {
 
   updateAllStatuses(ws) {
     for (const [key, value] of Object.entries(this.paramsJson)) {
-      for (let i = 0; i < this.layoutJson.length; i++) {
+      this.layoutJson.forEach((item) => {
-        let topic = this.layoutJson[i].topic;
+        let topic = item.topic;
         if (topic) {
-          //this.layoutJson[i].ws = ws;
+          topic = topic.substring(topic.lastIndexOf("/") + 1);
-          topic = topic.substring(topic.lastIndexOf("/") + 1, topic.length);
           if (key === topic) {
             console.log("[i]", "updated =>" + topic, value);
-            this.layoutJson[i].status = value;
+            item.status = value;
-            break;
-          }
           }
         }
+      });
     }
     this.wsSendMsg(ws, "/charts|");
   }
-
-  sortingLayout(ws) {
-    //сортируем весь layout по алфавиту
-    this.layoutJson.sort(function (a, b) {
-      if (a.descr < b.descr) {
-        return -1;
-      }
-      if (a.descr > b.descr) {
-        return 1;
-      }
-      return 0;
-    });
-    //формируем json всех карточек
-    this.pages = [];
-    const newPage = Array.from(new Set(Array.from(this.layoutJson, ({ page }) => page)));
-    newPage.forEach((item, i, arr) => {
-      this.pages = [
-        ...this.pages,
-        JSON.parse(
-          JSON.stringify({
-            page: item,
-          })
-        ),
-      ];
-    });
-    //сортируем карточки по алфавиту
-    this.pages.sort(function (a, b) {
-      if (a.page < b.page) {
-        return -1;
-      }
-      if (a.page > b.page) {
-        return 1;
-      }
-      return 0;
-    });
-
-    this.layoutJson = this.layoutJson;
-    console.log("[3]", ws, "layout sort, requested params...");
-    this.wsSendMsg(ws, "/params|");
-  }
 }
 
 export default WebSocketManager;