From 29a7ae49e872ff01f92e09ca077992ca892c7756 Mon Sep 17 00:00:00 2001
From: Tobias Hopp <tobi@gaminggeneration.de>
Date: Fri, 27 Aug 2021 09:32:07 +0200
Subject: [PATCH] Update, update some pings

Took 22 minutes
---
 views/index.pug | 31 ++++++++++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)

diff --git a/views/index.pug b/views/index.pug
index d3453d8..2e6d565 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -23,7 +23,7 @@ html(lang='de')
         script(src='https://code.jquery.com/jquery-3.6.0.min.js')
 
 
-        h1(style='float:left;') Network-Devices
+        h1(style='float:left;') Network-Devices (<span id="device_count">0</span> devices)
         button(onclick='reloadDevices();' style='float:right; margin-top: 25px; width:30%; height:40px;') Reload Devices
         table
             thead
@@ -31,7 +31,7 @@ html(lang='de')
                     th MAC-Address
                     th IP-Address
                     th Hostname
-                    th Status
+                    th Status (<span id="device_online_count">0</span> online devices)
             tbody#devices
 
 
@@ -39,7 +39,18 @@ html(lang='de')
             function pingHost( ipAddress )
             {
                 console.log( "pinging...");
-                $('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: orange;">Pinging... (unknown ms)</a>' );
+                let statusField = $('#ping-' + ipAddress.replaceAll( '.', '-' ) );
+                let lastStatus;
+                if( statusField.text().startsWith( 'Online' ) )
+                {
+                    lastStatus = true;
+                }
+                else
+                {
+                    lastStatus = false;
+                }
+
+                statusField.html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: orange;">Pinging... (unknown ms)</a>' );
                 setTimeout( () => {
                     $.ajax({
                         url : `/api/getDeviceStatus/${ipAddress}` ,
@@ -50,13 +61,22 @@ html(lang='de')
 
                         success: function( data ) {
                             console.log( data );
+                            let txt = $('#device_online_count').text();
                             if( data.data.online )
                             {
                                 $('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: green">Online (' + data.data.avg + ' ms)</a>' );
+                                if( !lastStatus )
+                                {
+                                    $('#device_online_count').html( parseInt( txt )+ 1 );
+                                }
                             }
                             else
                             {
                                 $('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: red">Offline (' + data.data.avg + ' ms)</a>' );
+                                if( lastStatus )
+                                {
+                                    $('#device_online_count').html( parseInt( txt )- 1 );
+                                }
                             }
                         }
 
@@ -77,10 +97,15 @@ html(lang='de')
                         console.log( data );
                         const table = $('#devices');
                         table.empty();
+                        let device_count = $('#device_count');
+                        device_count.html( '0' );
+                        $('#device_online_count').html( '0' );
                         $( data.data ).each( ( key, entry ) => {
                             console.log( entry );
                             table.append( '<tr><td>' + entry.macAddress + '</td><td>' + entry.ipAddress + '</td><td>' + entry.hostname + '</td><td id="ping-' + entry.ipAddress.replaceAll( '.', '-' ) + '">Loading...</td>' )
                             setTimeout( () => { pingHost( entry.ipAddress ); }, 10 );
+                            let txt = device_count.html();
+                            $('#device_count').html( parseInt( txt ) +1 );
                         });
                     }