we don't want red on the map

This commit is contained in:
liamcottle
2024-03-31 18:53:11 +13:00
parent c358a66617
commit 011713badf

View File

@ -43,12 +43,6 @@
} }
.icon-offline { .icon-offline {
background-color: #dc2626;
border-radius: 25px;
border: 1px solid white;
}
.icon-unknown {
background-color: #2563eb; background-color: #2563eb;
border-radius: 25px; border-radius: 25px;
border: 1px solid white; border: 1px solid white;
@ -1651,11 +1645,6 @@
iconSize: [16, 16], // increase from 12px to 16px to make hover easier iconSize: [16, 16], // increase from 12px to 16px to make hover easier
}); });
var iconUnknown = L.divIcon({
className: 'icon-unknown',
iconSize: [16, 16], // increase from 12px to 16px to make hover easier
});
// create legend // create legend
var legendLayerGroup = new L.LayerGroup(); var legendLayerGroup = new L.LayerGroup();
var legend = L.control({position: 'bottomleft'}); var legend = L.control({position: 'bottomleft'});
@ -1665,8 +1654,7 @@
div.style.padding = '12px'; div.style.padding = '12px';
div.innerHTML = `<div style="margin-bottom:6px;"><strong>MQTT Connection</strong></div>` div.innerHTML = `<div style="margin-bottom:6px;"><strong>MQTT Connection</strong></div>`
+ `<div style="display:flex"><div class="icon-online" style="width:12px;height:12px;margin-right:4px;margin-top:auto;margin-bottom:auto;"></div> Connected</div>` + `<div style="display:flex"><div class="icon-online" style="width:12px;height:12px;margin-right:4px;margin-top:auto;margin-bottom:auto;"></div> Connected</div>`
+ `<div style="display:flex"><div class="icon-offline" style="width:12px;height:12px;margin-right:4px;margin-top:auto;margin-bottom:auto;"></div> Disconnected</div>` + `<div style="display:flex"><div class="icon-offline" style="width:12px;height:12px;margin-right:4px;margin-top:auto;margin-bottom:auto;"></div> Disconnected</div>`;
+ `<div style="display:flex"><div class="icon-unknown" style="width:12px;height:12px;margin-right:4px;margin-top:auto;margin-bottom:auto;"></div> Not Seen Yet</div>`;
return div; return div;
}; };
@ -1970,11 +1958,9 @@
} }
// icon based on mqtt connection state // icon based on mqtt connection state
var icon = iconUnknown; var icon = iconOffline;
if(node.mqtt_connection_state === "online"){ if(node.mqtt_connection_state === "online"){
icon = iconOnline; icon = iconOnline;
} else if(node.mqtt_connection_state === "offline"){
icon = iconOffline;
} }
// create node marker // create node marker
@ -2227,9 +2213,9 @@
if(node.mqtt_connection_state === "online"){ if(node.mqtt_connection_state === "online"){
mqttStatus = `<span class="text-green-700">Online</span> ${mqttStatusLastUpdated}`; mqttStatus = `<span class="text-green-700">Online</span> ${mqttStatusLastUpdated}`;
} else if(node.mqtt_connection_state === "offline"){ } else if(node.mqtt_connection_state === "offline"){
mqttStatus = `<span class="text-red-700">Offline</span> ${mqttStatusLastUpdated}`; mqttStatus = `<span class="text-blue-700">Offline</span> ${mqttStatusLastUpdated}`;
} else { } else {
mqttStatus = `<span class="text-blue-700">Not Seen Yet</span>`; mqttStatus = `<span class="text-blue-700">Offline</span>`;
} }
var tooltip = `<img class="mb-4 w-40 mx-auto" src="/images/devices/${node.hardware_model_name}.png" onerror="this.classList.add('hidden')"/>` + var tooltip = `<img class="mb-4 w-40 mx-auto" src="/images/devices/${node.hardware_model_name}.png" onerror="this.classList.add('hidden')"/>` +