TobiasH/network-devices
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Update, update some stylings and much more

Browse Source 
Took 55 minutes
This commit is contained in:
Tobias Hopp 2021-08-27 12:02:08 +02:00
parent 29a7ae49e8
commit 09c030ea06
2 changed files with 47 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
index.js
View File

@ -33,8 +33,9 @@ const apiResponse = {
app.get( '/api/getDeviceStatus/:ipAddress', async ( req, res ) => {
console.log( 'Loading device status for ' + req.params.ipAddress + '...' );
let ping_response = await ping.promise.probe(req.params.ipAddress, {
timeout: 5,
timeout: 1,
extra: ['-i', '1'],
});

56
views/index.pug
View File

@ -24,7 +24,8 @@ html(lang='de')
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
button#reloadDeviceBtn(onclick='reloadDevices();' style='float:right; margin-top: 25px; width:15%; height:40px;') Reload devices
button#reloadDeviceBtn(onclick='reloadAllPings();' style='float:right; margin-top: 25px; width:15%; height:40px;') Reload pings
table
thead
tr
@ -36,16 +37,19 @@ html(lang='de')
script.
let openPings = 0;
function pingHost( ipAddress )
{
console.log( "pinging...");
console.log( "Pinging " + ipAddress + "..." );
let statusField = $('#ping-' + ipAddress.replaceAll( '.', '-' ) );
let lastStatus;
if( statusField.text().startsWith( 'Online' ) )
{
lastStatus = true;
}
else
else if( statusField.text().startsWith( 'Offline' ) )
{
lastStatus = false;
}
@ -60,33 +64,56 @@ html(lang='de')
success: function( data ) {
console.log( data );
openPings--;
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 )
if( lastStatus === false )
{
$('#device_online_count').html( parseInt( txt )+ 1 );
$('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: #00e1ff">Online (' + data.data.avg + ' ms)</a>' );
}
else
{
$('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: green">Online (' + data.data.avg + ' ms)</a>' );
}
//#00e1ff
}
else
{
$('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: red">Offline (' + data.data.avg + ' ms)</a>' );
if( lastStatus )
if( lastStatus === true )
{
$('#device_online_count').html( parseInt( txt )- 1 );
$('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: #ff00cc">Offline (' + data.data.avg + ' ms)</a>' );
}
else
{
$('#ping-' + ipAddress.replaceAll( '.', '-' ) ).html( '<a href="javascript:pingHost(\'' + ipAddress + '\');" style="color: red">Offline (' + data.data.avg + ' ms)</a>' );
}
}
}
});
},100 )
},5 );
}
function reloadAllPings()
{
$('#devices').find('tr').each (( row, tr ) =>
{
pingHost( $( tr ).find( 'td' ).eq( 3 )[0].id.replaceAll( '-', '.' ).replaceAll( 'ping.', '' ) );
});
}
function reloadDevices()
{
$('#reloadDeviceBtn').prop( 'disabled', true );
$.ajax({
url : `/api/getDevices`,
type : 'GET',
@ -94,7 +121,7 @@ html(lang='de')
dataType : 'json',
success: function( data ) {
console.log( data );
const table = $('#devices');
table.empty();
let device_count = $('#device_count');
@ -103,13 +130,20 @@ html(lang='de')
$( 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 );
setTimeout( () => { pingHost( entry.ipAddress ); openPings +=1; }, 1 );
let txt = device_count.html();
$('#device_count').html( parseInt( txt ) +1 );
});
setTimeout ( () => {
$('#reloadDeviceBtn').prop( 'disabled', false );
}, 500 );
}
});
}
reloadDevices();