Code refactoring after #1196

AlexxIT · AlexxIT · commit e6fa97c73856 · 2024-06-16T22:12:52.000+03:00
diff --git a/www/network.html b/www/network.html
@@ -25,73 +25,56 @@
     </style>
 </head>
 <body>
-    <div id="network"></div>
-    <script src="main.js"></script>
-    <script>
-        let network;
-        let nodes = new vis.DataSet();
-        let edges = new vis.DataSet();
-        let seed = "";
-        /* global vis */
-        window.addEventListener('load', () => {
-            const url = new URL('api/streams.dot' + location.search, location.href);
-            const options = {
-                edges: {
-                    font: { align: 'middle' },
-                    smooth: false,
-                },
-                nodes: { shape: 'box' },
-                physics: {
-                    enabled: false,
-                    stabilization: {
-                        enabled: false,
-                    }
-                },
-                autoResize: true,
-                locale: navigator.language.toLowerCase().split('-').slice(0, 2).join('-'),
-            };
-            const container = document.getElementById('network');
+<div id="network"></div>
+<script src="main.js"></script>
+<script>
+    /* global vis */
+    window.addEventListener('load', () => {
+        const url = new URL('api/streams.dot' + location.search, location.href);
 
+        const container = document.getElementById('network');
+        const options = {
+            edges: {
+                font: {align: 'middle'},
+                smooth: false,
+            },
+            nodes: {shape: 'box'},
+            physics: false,
+        };
 
-            async function fetchDataAndUpdateNetwork() {
-                try {
-                    const response = await fetch(url, { cache: 'no-cache' });
-                    const dotData = await response.text();
-                    const data = vis.parseDOTNetwork(dotData);
+        let network;
 
-                    if (!network) {
-                        nodes = new vis.DataSet(data.nodes);
-                        edges = new vis.DataSet(data.edges);
-                        network = new vis.Network(container, { nodes, edges }, options);
-                        network.storePositions();
-                        seed = network.getSeed();
-                    } else {
-                        const positions = network.getPositions();
-                        const viewState = network.getViewPosition();
-                        const scale = network.getScale();
-                        network.setOptions({layout: {
-                            randomSeed: seed
-                        }})
-                        network.setData(data);
+        async function update() {
+            try {
+                const response = await fetch(url, {cache: 'no-cache'});
+                const dotData = await response.text();
+                const data = vis.parseDOTNetwork(dotData);
 
-                        for (const nodeId in positions) {
-                            if (positions.hasOwnProperty(nodeId)) {
-                                network.moveNode(nodeId, Math.floor(positions[nodeId].x), Math.floor(positions[nodeId].y));
-                            }
-                        }
+                if (!network) {
+                    network = new vis.Network(container, data, options);
+                    network.storePositions();
+                } else {
+                    const positions = network.getPositions();
+                    const viewPosition = network.getViewPosition();
+                    const scale = network.getScale();
 
-                        network.moveTo({ position: viewState, scale: scale });
+                    network.setData(data);
+
+                    for (const nodeId in positions) {
+                        network.moveNode(nodeId, positions[nodeId].x, positions[nodeId].y);
                     }
 
-                } catch (error) {
-                    console.error('Error fetching or updating network data:', error);
+                    network.moveTo({position: viewPosition, scale: scale});
                 }
+            } catch (error) {
+                console.error('Error fetching or updating network data:', error);
             }
 
-            fetchDataAndUpdateNetwork();
+            setTimeout(update, 5000);
+        }
 
-            setInterval(fetchDataAndUpdateNetwork, 5000);
-        });
-    </script>
+        update();
+    });
+</script>
 </body>
-</html>
+</html>
