From bd991365eb970ff8eaf5532a0fa1ce3e39cf6b89 Mon Sep 17 00:00:00 2001 From: Tcharp38 Date: Sun, 30 Jun 2024 14:13:54 +0200 Subject: [PATCH] Network layout --- desktop/php/AbeilleNetworkMap.php | 273 +++++++++++++++++------------- 1 file changed, 151 insertions(+), 122 deletions(-) diff --git a/desktop/php/AbeilleNetworkMap.php b/desktop/php/AbeilleNetworkMap.php index f9e42b7bc7..bfb234f869 100644 --- a/desktop/php/AbeilleNetworkMap.php +++ b/desktop/php/AbeilleNetworkMap.php @@ -205,23 +205,23 @@ - + {{Coordinateur}} - + {{Routeur}} - + {{Bout de chaine}} - + {{Type inconnu}} - + {{Sans vie}} @@ -483,6 +483,7 @@ function checkGrpLimits(grpX, grpY) { } // Ensure that device coordinates are within background map size + // Note: Requires 'viewImageMaxX' set by 'refreshBackgroundMap()' function checkPosLimits(devLogicId) { dev = devList[devLogicId]; posX = dev['posX']; @@ -973,7 +974,7 @@ function getDevColor(zbType) { return color; } - // Combine LQI + Jeedom infos + // Build a device list per network, combining LQI table + Jeedom infos function buildDevList() { console.log("buildDevList()"); @@ -990,7 +991,7 @@ function buildDevList() { lineId = 0; // To identify lines connecting nodes - // Listing devices on the network + // Listing devices on the network (from lqiTable) for (rLogicId in netw.lqiTable.routers) { router = netw.lqiTable.routers[rLogicId]; // console.log("router " + rLogicId + "=", router); @@ -1002,16 +1003,21 @@ function buildDevList() { devR['addr'] = router['addr']; devR['name'] = router['name']; devR['icon'] = router['icon']; - if (devR['addr'] == '0000') + if (devR['addr'] == '0000') { devR['color'] = getDevColor("Coordinator"); // Coordinator - else + } else { devR['color'] = getDevColor("Router"); // Router + } if (typeof jeedomDevices[rLogicId] !== "undefined") { devR['posX'] = jeedomDevices[rLogicId].x; devR['posY'] = jeedomDevices[rLogicId].y; devR['posZ'] = (typeof jeedomDevices[rLogicId].z !== "undefined") ? jeedomDevices[rLogicId].z : 0; devR['jeedomId'] = jeedomDevices[rLogicId].id; // devR['posChanged'] = false; + } else { + devR['posX'] = 0; + devR['posY'] = 0; + devR['posZ'] = 0; } devR['links'] = new Object(); @@ -1033,10 +1039,6 @@ function buildDevList() { devN['addr'] = neighbor['addr']; devN['name'] = neighbor['name']; devN['icon'] = neighbor['icon']; - // if ( neighbor['type'] == "End Device" ) { devN['color'] = zbEndDeviceColor; } - // else if ( neighbor['type'] == "Router" ) { devN['color'] = zbRouterColor; } - // else if ( neighbor['type'] == "Coordinator" ) { devN['color'] = zbCoordinatorColor; } - // else devN['color'] = "Yellow"; devN['color'] = getDevColor(neighbor['type']) if (typeof jeedomDevices[nLogicId] !== "undefined") { devN['posX'] = jeedomDevices[nLogicId].x; @@ -1044,6 +1046,10 @@ function buildDevList() { devN['posZ'] = (typeof jeedomDevices[nLogicId].z !== "undefined") ? jeedomDevices[nLogicId].z : 0; devN['jeedomId'] = jeedomDevices[nLogicId].id; // devN['posChanged'] = false; + } else { + devN['posX'] = 0; + devN['posY'] = 0; + devN['posZ'] = 0; } devN['links'] = new Object(); @@ -1059,6 +1065,7 @@ function buildDevList() { netw.linksList[lineId] = { 'src': rLogicId, 'dst': nLogicId, 'lqi': neighbor['lqi'] }; lineId++; } + } // End 'for (rLogicId in lqiTable.routers)' // Checking devices in Jeedom but not visible on the network @@ -1085,6 +1092,27 @@ function buildDevList() { netw.devListNb++; } + // Checking & updating devices positions + devListNb = netw.devListNb; + for (devLogicId in netw.devList) { + dev = netw.devList[devLogicId]; + if (dev['addr'] == '0000') + isCoordinator = true; + else + isCoordinator = false; + + if (dev['posX'] == 0) // 0 is forbidden + netw.devList[devLogicId]['posX'] = setAutoX(isCoordinator, devListNb); + if (dev['posY'] == 0) // 0 is forbidden + netw.devList[devLogicId]['posY'] = setAutoY(isCoordinator, devListNb); + if (typeof dev['posZ'] === "undefined") + netw.devList[devLogicId]['posZ'] = 0; + + // Can't do it there since refreshBackgroundMap() is not executed yet + // devList = netw.devList; + // checkPosLimits(devLogicId); + } + console.log("Net "+n+" devList=", netw.devList); } } @@ -1100,37 +1128,22 @@ function refreshPage() { refreshBackgroundMap(viewLevel); lesAbeilles = ""; - for (n = 0; n < networks.length; n++) { - netw = networks[n]; + for (netIdx = 0; netIdx < networks.length; netIdx++) { + netw = networks[netIdx]; // Display of this network is enabled ? - elm = document.getElementById("idViewNet-"+n); + elm = document.getElementById("idViewNet-"+netIdx); if (!elm.checked) continue; - devList = netw.devList; - devListNb = netw.devListNb; - for (devLogicId in devList) { - if (typeof devList[devLogicId]['posZ'] !== "undefined") - posZ = devList[devLogicId]['posZ']; - else - posZ = 0; - if (posZ != viewLevel) { - console.log(devLogicId+" is not part of current level "+viewLevel); - continue; - } - lesAbeilles += drawDevice(devLogicId); - } - - // TEMP - // lesAbeilles += ''; - // END TEMP - // Displaying links ? if (viewLinks) - drawLinks(n); + drawLinks(netIdx); + + // Drawing devices after links to have them behind devices + lesAbeilles += drawDevices(netIdx); } - // document.getElementById("idDevices").innerHTML = lesAbeilles; + document.getElementById("idGraph").innerHTML = lesAbeilles; // If config mode, add event listener on node menu @@ -1154,110 +1167,127 @@ function refreshPage() { // X = eval('center.X + center.rayon * Math.cos(2*Math.PI*iAbeille/nbAbeille)'); // Y = eval('center.Y + center.rayon * Math.sin(2*Math.PI*iAbeille/nbAbeille)'); - function setAutoX(isZigate) { - if (isZigate == true) + function setAutoX(isCoordinator, devListNb) { + if (isCoordinator == true) return centerX; posX = centerX + centerR * Math.cos(2 * Math.PI * autoXIdx / (devListNb - 1)); autoXIdx++; return posX; } - function setAutoY(isZigate) { - if (isZigate == true) + function setAutoY(isCoordinator, devListNb) { + if (isCoordinator == true) return centerY; posY = centerY + centerR * Math.sin(2 * Math.PI * autoYIdx / (devListNb - 1)); autoYIdx++; return posY; } - function drawDevice(devLogicId) { - console.log("drawDevice("+devLogicId+")"); - dev = devList[devLogicId]; - console.log("dev=", dev); - - nodeColor = dev['color']; - addr = dev['addr']; - if (addr == '0000') - isZigate = true; - else - isZigate = false; - if (dev['posX'] == 0) // 0 is forbidden - dev['posX'] = setAutoX(isZigate); - if (dev['posY'] == 0) // 0 is forbidden - dev['posY'] = setAutoY(isZigate); + function drawDevices(netIdx) { + console.log("drawDevices(netIdx="+netIdx+")"); - // dev['posX'] = 25; - // dev['posY'] = 25; // TEMP + netw = networks[netIdx]; + devList = netw.devList; + allDevices = ""; + for (devLogicId in devList) { + // Set by buildDevList() + // if (typeof devList[devLogicId]['posZ'] !== "undefined") + // posZ = devList[devLogicId]['posZ']; + // else + // posZ = 0; + if (devList[devLogicId]['posZ'] != viewLevel) { + console.log(devLogicId+" is not part of current level "+viewLevel); + continue; + } + dev = devList[devLogicId]; + console.log("dev=", dev); + + nodeColor = dev['color']; + // addr = dev['addr']; + // if (addr == '0000') + // isZigate = true; + // else + // isZigate = false; + // Set by buildDevList() + // if (dev['posX'] == 0) // 0 is forbidden + // dev['posX'] = setAutoX(isZigate); + // if (dev['posY'] == 0) // 0 is forbidden + // dev['posY'] = setAutoY(isZigate); + + // dev['posX'] = 25; + // dev['posY'] = 25; // TEMP + + // Checking limits vs map size + checkPosLimits(devLogicId); + + // Computing positions based on node central coordinates + posX = dev['posX']; + posY = dev['posY']; + grpX = posX - 25; + grpY = posY - 25; + // imgX = posX - 20; + // imgY = posY - 20; + imgX = 5; + imgY = 5; + // Text is on top of the group + // txtX = posX + 22; + // txtY = posY + 0; + // txtX = 25; + // txtY = -5; // Placed on top of group + txtX = grpX; + txtY = grpY - 10; + + // if (configMode) + // newG = ''; + // else + // newG = ''; + // newG += ''; + newG = ''; + newG += ''; + // if (configMode) { + // // Add a button to select level + // newG += ''; + // // newG += ''; + // } + if (configMode) + newG += ''; + else + newG += ''; + // newG += ''+dev['name']+''; + // newG += ''; - // Checking limits vs map size - checkPosLimits(devLogicId); + if (typeof dev['dead'] !== 'undefined') { + deadX = 32; + deadY = 28; + newG += ''; + } - // Computing positions based on node central coordinates - posX = dev['posX']; - posY = dev['posY']; - grpX = posX - 25; - grpY = posY - 25; - // imgX = posX - 20; - // imgY = posY - 20; - imgX = 5; - imgY = 5; - // Text is on top of the group - // txtX = posX + 22; - // txtY = posY + 0; - // txtX = 25; - // txtY = -5; // Placed on top of group - txtX = grpX; - txtY = grpY - 10; - - // if (configMode) - // newG = ''; - // else - // newG = ''; - // newG += ''; - newG = ''; - newG += ''; - // if (configMode) { - // // Add a button to select level - // newG += ''; - // // newG += ''; - // } - if (configMode) - newG += ''; - else - newG += ''; - // newG += ''+dev['name']+''; - // newG += ''; - - if (typeof dev['dead'] !== 'undefined') { - deadX = 32; - deadY = 28; - newG += ''; - } + // newG += ''; + // newG += ''+dev['name']+''; + newG += ''+dev['name']+''; + // newG += ''; - // newG += ''; - // newG += ''+dev['name']+''; - newG += ''+dev['name']+''; - // newG += ''; + // If config mode, add a button to select level + if (configMode) { + // btnX = grpX + 25; + // btnY = grpY; + // newG += ''; + // newG += ''; + newG += ''; - // If config mode, add a button to select level - if (configMode) { - // btnX = grpX + 25; - // btnY = grpY; - // newG += ''; - // newG += ''; - newG += ''; + // newG += ''; + } + newG += ''; + console.log("newG=", newG); - // newG += ''; + allDevices += newG; } - newG += ''; - - console.log("newG=", newG); - return newG; + return allDevices; } function drawLinks(n) { - console.log("drawLinks("+n+")"); + console.log("drawLinks(netIdx="+n+")"); netw = networks[n]; linksList = netw.linksList; @@ -1268,7 +1298,6 @@ function drawLinks(n) { // Reminder: linksList[linkId] = { "src": ss, "dst": ddd } link = linksList[linkId]; // console.log('link['+linkId+']=', link); - // linkId = link.id; srcDev = devList[link.src]; x1 = srcDev['posX']; @@ -1303,7 +1332,7 @@ function drawLinks(n) { } } else { if (z1 != viewLevel) { - console.log("Not corresonding view level => Link not displayed") + console.log("Not corresponding view level => Link not displayed") continue; } @@ -1418,9 +1447,6 @@ function nodeMenuBtnCb(evt) { // 1000 // ms // ); - // Combine LQI + Jeedom infos - buildDevList(); - // Display options var viewLinks = true; // Set to false to hide links @@ -1439,6 +1465,9 @@ function nodeMenuBtnCb(evt) { autoXIdx = 0; autoYIdx = 0; + // Combine LQI + Jeedom infos + buildDevList(); + refreshPage(); // console.log("End of script");