315 lines
16 KiB
HTML
315 lines
16 KiB
HTML
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
|
||
<link rel="stylesheet" href="../files/bootstrap.min.css">
|
||
<link rel="stylesheet" href="../files/layout.css">
|
||
<script src="../files/jquery-3.3.1.min.js"></script>
|
||
<script src="../files/popper.min.js"></script>
|
||
<script src="../files/bootstrap.min.js"></script>
|
||
<script src="./base.js"></script>
|
||
<title id="pt_v">iForte</title>
|
||
</head>
|
||
<body>
|
||
<nav class="navbar fixed-top navbar-expand-md navbar-dark bg-dark">
|
||
<div class="container">
|
||
<a class="navbar-brand" href="./index.html">
|
||
<img src="../files/robe_logo_white.svg">
|
||
</a>
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar">
|
||
<span class="navbar-toggler-icon"></span>
|
||
</button>
|
||
<div class="collapse navbar-collapse" id="navbar">
|
||
<ul class="navbar-nav mr-auto">
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="./index.html">Status</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="./personality.html">Personality</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="./logs.html">Logs</a>
|
||
</li>
|
||
<li class="nav-item snz">
|
||
<a class="nav-link" href="./sensors.html">RAINS logs</a>
|
||
</li>
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="./discovery.html">Discovery</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="#" id="scfg">Settings</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="#" id="idnt">
|
||
<img class="rdmi" src="../files/identify.svg">
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<div class="fixed-top text-center device-label" id="pth">iForte</div>
|
||
<div class="container-fluid in">
|
||
<h1>Discovery</h1>
|
||
<div class="row" id="boxes">
|
||
<div class="col-12">
|
||
<div class="clearfix">
|
||
<div class="float-left pt02">
|
||
<input type="checkbox" id="w-ot">
|
||
<label for="w-ot" class="pl04"> Move devices with warning to top</label>
|
||
</div>
|
||
<button class="btn btn-primary float-right" id="scan">Discover (1)</button>
|
||
</div>
|
||
<h2>Columns selection (max. 7 items)</h2>
|
||
<div class="clearfix" id="cols">
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" checked="" id="cchb-0">
|
||
<label for="cchb-0">DMX address</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" checked="" id="cchb-1">
|
||
<label for="cchb-1">DMX preset</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" checked="" id="cchb-2">
|
||
<label for="cchb-2">RDM UID</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" checked="" id="cchb-3">
|
||
<label for="cchb-3">IP address</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" id="cchb-4" disabled="disabled">
|
||
<label for="cchb-4">Head temperature [°C]</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" id="cchb-5" disabled="disabled">
|
||
<label for="cchb-5">Relative humidity [%]</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" checked="" id="cchb-6">
|
||
<label for="cchb-6">RAINS (max wet)</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" id="cchb-7" disabled="disabled">
|
||
<label for="cchb-7">Last pressure test</label>
|
||
</div>
|
||
<div class="dchb">
|
||
<input type="checkbox" class="cchb" checked="" id="cchb-8">
|
||
<label for="cchb-8">Device status</label>
|
||
</div>
|
||
</div>
|
||
<div class="clearfix">
|
||
<button class="btn btn-primary float-right" id="acs">Apply selection</button>
|
||
</div>
|
||
<div class="table-responsive">
|
||
<table class="table mt-2" id="d-t">
|
||
<thead id="dmax">
|
||
<tr>
|
||
<th>
|
||
<i class="as"></i>
|
||
<i class="ab"></i> Device
|
||
</th>
|
||
<th>
|
||
<i></i>
|
||
<i class="ab"></i> DMX address
|
||
</th>
|
||
<th>
|
||
<i></i>
|
||
<i class="ab"></i> DMX preset
|
||
</th>
|
||
<th>
|
||
<i></i>
|
||
<i class="ab"></i> RDM UID
|
||
</th>
|
||
<th>
|
||
<i></i>
|
||
<i class="ab"></i> IP address
|
||
</th>
|
||
<th style="display: none;">
|
||
<i></i>
|
||
<i class="ab"></i> Head temperature [°C]
|
||
</th>
|
||
<th style="display: none;">
|
||
<i></i>
|
||
<i class="ab"></i> Relative humidity [%]
|
||
</th>
|
||
<th>
|
||
<i></i>
|
||
<i class="ab"></i> RAINS (max wet)
|
||
</th>
|
||
<th style="display: none;">
|
||
<i></i>
|
||
<i class="ab"></i> Last pressure test
|
||
</th>
|
||
<th>
|
||
<i></i>
|
||
<i class="ab"></i> Device status
|
||
</th>
|
||
<th> </th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr id="myd" class="myd">
|
||
<td>iForte</td>
|
||
<td>350</td>
|
||
<td>Mode 1 (54 channels)</td>
|
||
<td>52:53:01:2c:00:0e</td>
|
||
<td>2.247.136.14</td>
|
||
<td style="display: none;">47</td>
|
||
<td style="display: none;">14.0</td>
|
||
<td>
|
||
<div class="rains sl">
|
||
<div style="width:63%"></div>
|
||
</div>
|
||
</td>
|
||
<td style="display: none;">2.3.2023 16:19:02 - OK</td>
|
||
<td>active</td>
|
||
<td></td>
|
||
</tr>
|
||
</tbody>
|
||
<tbody class="rd" id="scd"></tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="cfg-modal" class="modal fade" tabindex="-1" role="dialog">
|
||
<div class="modal-dialog" role="document">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<img src="../files/settings.svg">
|
||
<h5 class="modal-title" id="m-t"></h5>
|
||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||
<span aria-hidden="true">×</span>
|
||
</button>
|
||
</div>
|
||
<div class="modal-body" id="m-b"></div>
|
||
<div class="modal-footer" id="m-f">
|
||
<button type="button" class="btn btn-primary sb">Save</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script>
|
||
$(document).ready(function() {
|
||
$('h1').html('Discovery');
|
||
$('#boxes').html(' < div class = "col-12" > < div class = "clearfix" > < div class = "float-left pt02" > < input type = "checkbox"
|
||
id = "w-ot" > < label
|
||
for = "w-ot"
|
||
class = "pl04" > Move devices with warning to top < /label> < /div> < button class = "btn btn-primary float-right"
|
||
id = "scan"
|
||
disabled > < div class = "loader" > < /div> Discovering < /button> < /div> < h2 > Columns selection(max.7 items) < /h2> < div class = "clearfix"
|
||
id = "cols" > < /div> < div class = "clearfix" > < button class = "btn btn-primary float-right"
|
||
id = "acs" > Apply selection < /button> < /div> < div class = "table-responsive" > < table class = "table mt-2"
|
||
id = "d-t" > < thead id = "dmax" > < tr > < th > < i > < /i> < i class = "ab" > < /i> Device < /th> < /tr> < /thead> < tbody > < tr id = "myd"
|
||
class = "myd" > < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < /tr> < /tbody> < tbody class = "rd"
|
||
id = "scd" > < /tbody> < /table> < /div> < /div>');var s=0;var bsy=false;var i=0;var ti;var tb;var tr;var c_n=['DMX address','DMX preset','RDM UID','IP address','Head temperature [°C]','Relative humidity [%]','RAINS (max wet)','Last pressure test','Device status'];var c_js=['dmxa','dmxp','rdm','ip','t','rh','wet','prt','sta'];var c_s=get_cookie('dc_sel',335);var i=0;c_n.forEach(function(v){$('#dmax>tr').append(' < th > < i > < /i> < i class = "ab" > < /i> '+v+' < /th>');$('#cols').append(' < div class = "dchb" > < input type = "checkbox"
|
||
class = "cchb"
|
||
'+((c_s & (1< < i)) ? ' checked' : '') + ' id="cchb-' + i + '"> < label
|
||
for = "cchb-'+i+'" > '+v+' < /label> < /div>');i++});$('#dmax>tr').append(' < th > & nbsp; < /th>');var ccb=$('#cols .cchb');var tcs=$('#dmax>tr>th');function upd_cols_in_rows(){var c_s=get_cookie('dc_sel',335);var r=$('#d-t>tbody>tr');r.each(function(){var c=$(this).find('td');c.each(function(i){if((i > 0)&&(i<=c_js.length)){if(c_s & (1<<(i - 1))) $(this).show();else $(this).hide()}})})}function ccb_en_dis(){var chck=ccb.filter(':checked');if(chck.length>=6){ccb.filter(':not(":checked")').attr('disabled',true)} else ccb.removeAttr('disabled')}ccb_en_dis();$('.cchb').change(function(){ccb_en_dis()});$('#acs').click(function(){var c_s=0;var i=0;c_n.forEach(function(v){if(ccb.eq(i).prop('checked')) c_s|=(1< < i);
|
||
if (c_s & (1 < < i)) tcs.eq(i + 1).show();
|
||
else tcs.eq(i + 1).hide();
|
||
i++
|
||
});
|
||
document.cookie = 'dc_sel=' + c_s;
|
||
upd_cols_in_rows();
|
||
var ups = $('#dmax>tr i.as');
|
||
if (ups.parent().is(':hidden')) tcs.eq(0).find('i').eq(0).click()
|
||
});
|
||
$('#acs').click();
|
||
$('#scan').click(function() {
|
||
if (bsy) return;
|
||
$('#dmax').removeClass('dmax');
|
||
$('#scan').html(' < div class = "loader" > < /div> Discovering');$('#scd').html('');set_bsy(true);set_bsy(true,true);do_ajax('/start - scan ',{},function (json){if(json){set_bsy(false);s=0;clearInterval(tr)} else set_bsy(false);$('
|
||
body ').click()})});function set_bsy(v,b_o=false){if(!b_o) bsy=v;clearTimeout(tb);tb=setTimeout(function(){if(!v) $('
|
||
#scan ').removeAttr('
|
||
disabled ');else $('
|
||
#scan ').attr('
|
||
disabled ','
|
||
1 ')},b_o ? 5:400)}function max_w(w){if(isNaN(w)) return w;else return ' < div class = "rains sl" > < div style = "width:'+w+'%" > < /div> < /div>'}function do_scan(){if(bsy) return;switch (s){case 0:set_bsy(true);do_ajax('/get - child ',{},function (json){if(json){if(json['
|
||
sd ']==0){s=1;i=0;if(json['
|
||
max ']==1) $('
|
||
#dmax ').addClass('
|
||
dmax ')}} else s=255;set_bsy(false)});break;case 1:set_bsy(true);do_ajax(' / get - child ','
|
||
i = '+i,function (json){if(json){if(json['
|
||
ip ']){$('
|
||
#scd ').append(' < tr data - value = "'+json['ip']+'"
|
||
class = "dn dis" > < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < /td> < td > < img class = "rdmi a dn"
|
||
src = "../files/identify.svg" > < button class = "btn btn-danger btn-sm drem dn" > & #10005;</button>
|
||
</td>
|
||
</tr>');upd_cols_in_rows();i++} else s= 2
|
||
}
|
||
else s = 255;
|
||
set_bsy(false)
|
||
});
|
||
break;
|
||
case 2: clearInterval(tr);
|
||
set_bsy(true);
|
||
$('#scan').html(' < div class = "loader" > < /div> Collecting');var devs=$('#scd tr');if(devs.length==0){$('#scan').html('Discover (1)');set_bsy(false);s=255} else {i=0;devs.each(function(){var r=$(this);if(r.attr('data-value')){do_ajax('http:/
|
||
'+' / '+r.attr('
|
||
data - value ')+' / remote ',{},function (json){var t=r.find('
|
||
td ');if(json){t.eq(0).html(' < a href = "http:/'+'/'+r.attr('data-value')+'"
|
||
target = "_blank" > '+json['
|
||
dn ']+' < /a>');c_js.forEach(function(v,i){if(json[v]){if(i!=6) t.eq(i+1).html(json[v]);else {t.eq(i+1).html(max_w(json[v]));t.eq(i+1).attr('data-value',json[v])}} else t.eq(i+1).html('-')});r.removeClass('na');r.find('.drem').hide();if(json['stat']==1) r.addClass('err');else r.removeClass('err');r.removeClass('dis');r.show();if(json['rdmi']==1) r.find('.rdmi').show();else r.find('.rdmi').hide()} else {if(r.hasClass('dis')){r.remove()} else {r.addClass('na').removeClass('err');r.find('.drem').show()}t.eq(9).html('disconnected')}i++;if(i>=devs.length){set_bsy(false);s=255;$('#scan').html('Discover ('+($('#scd tr').length+1)+')');tr=setInterval(function(){set_bsy(true,true);s=2},10000);$('#d-t th i.as').click()}})} else { i++}})}break}}ti=setInterval(do_scan,100);function getp(){do_ajax('/pdev_i
|
||
',{},function (json){var c=$('
|
||
#myd > td ');if(json){c.eq(0).html(json['
|
||
dn ']);c_js.forEach(function(v,i){c.eq(i+1).html(i==6 ? max_w(json[v]):json[v])});upd_cols_in_rows();$('
|
||
#myd ').removeClass('
|
||
na ')} else {c.eq(9).html('
|
||
disconnected ');$('
|
||
#myd ').addClass('
|
||
na ')}})}getp();setInterval(getp,8000);do_ajax(' / status_i ',{},function (json){if(json){ptit(json['
|
||
pt '])}});$(document).on('
|
||
click ','.drem ',function(){if(confirm('
|
||
Are you sure to remove offline device from list ? ')) $(this).parents().eq(1).remove()});var sort_i=0;var sort_d=-1;function ldz3(v){return ('
|
||
000 '+v).substr(-3,3)}function my_sort(a,b){var A;var B;console.log(A);if(sort_i==7){B=$(a).children('
|
||
td ').eq(sort_i).attr('
|
||
data - value ');A=$(b).children('
|
||
td ').eq(sort_i).attr('
|
||
data - value ')} else {A=$(a).children('
|
||
td ').eq(sort_i).text();B=$(b).children('
|
||
td ').eq(sort_i).text()}switch (sort_i){case 1:case 5:case 6:case 7:A=parseInt(A);B=parseInt(B);break;case 4:A=A.split('.
|
||
');A=ldz3(A[0])+ldz3(A[2])+ldz3(A[3])+ldz3(A[4]);B=B.split('.
|
||
');B=ldz3(B[0])+ldz3(B[2])+ldz3(B[3])+ldz3(B[4]);break}if(A > B) return 1*sort_d;else if(A < B) return -1 * sort_d;
|
||
else return 0
|
||
}
|
||
$('table th i').click(function() {
|
||
$('table th i').removeClass('as');
|
||
$(this).addClass('as');
|
||
sort_i = $(this).parent().index();
|
||
sort_d = $(this).hasClass('ab') ? -1 : 1;
|
||
document.cookie = 'srt_s=' + sort_i;
|
||
document.cookie = 'srt_d=' + sort_d;
|
||
var et = $('#w-ot').prop('checked');
|
||
if (et == true) {
|
||
var rw_e = $('#d-t tbody.rd tr.err').remove();
|
||
var rw_n = $('#d-t tbody.rd tr.na').remove();
|
||
rw_e.sort(my_sort);
|
||
rw_n.sort(my_sort)
|
||
}
|
||
var rw = $('#d-t tbody.rd tr').remove();
|
||
rw.sort(my_sort);
|
||
if (et == true) {
|
||
$.each(rw_e, function(i, r) {
|
||
$('#d-t').children('tbody.rd').append(r)
|
||
});
|
||
$.each(rw_n, function(i, r) {
|
||
$('#d-t').children('tbody.rd').append(r)
|
||
})
|
||
}
|
||
$.each(rw, function(i, r) {
|
||
$('#d-t').children('tbody.rd').append(r)
|
||
})
|
||
});
|
||
sort_d = get_cookie('srt_d', 1);
|
||
$('#d-t th i').eq(get_cookie('srt_s', 0) * 2 + (sort_d == 1 ? 0 : 1)).click();
|
||
if (get_cookie('wot', 1) == 1) $('#w-ot').prop('checked', true);
|
||
$('#w-ot').change(function() {
|
||
document.cookie = 'wot=' + ($('#w-ot').prop('checked') == true ? 1 : 0);
|
||
$('#d-t th i.as').click()
|
||
})
|
||
});
|
||
</script>
|
||
</body>
|
||
</html> |