Widget:Hotspots: Unterschied zwischen den Versionen
| Zeile 1: | Zeile 1: | ||
| − | + | ||
<link rel="stylesheet" type="text/css" href="/hotspots/datatables/datatables.min.css"/> | <link rel="stylesheet" type="text/css" href="/hotspots/datatables/datatables.min.css"/> | ||
<script type="text/javascript" src="/hotspots/datatables/datatables.min.js"></script> | <script type="text/javascript" src="/hotspots/datatables/datatables.min.js"></script> | ||
Version vom 15. September 2018, 13:25 Uhr
<link rel="stylesheet" type="text/css" href="/hotspots/datatables/datatables.min.css"/> <script type="text/javascript" src="/hotspots/datatables/datatables.min.js"></script> <script type="text/javascript" src="https://api.main.freifunk-dresden.de/freifunk-dresden-hotspots.json.js"></script>
<thead> </thead> <tfoot> </tfoot>| Node | IP | Online Gateway Offline Tage |
Registriert | Name | Map | Firmware | Model | Ort | Kommentar |
|---|---|---|---|---|---|---|---|---|---|
<script type="text/javascript">
function getIp(node) {
var _middle = Math.floor((node / 255)) % 256; var _minor = (node % 255) + 1; return '10.200.' + _middle.toString() + '.' + _minor.toString();
}
$('#example').DataTable( {
"processing": true,
//"responsive": true,
"pageLength" : -1,
"lengthMenu": [[ 25, 50, 100, 200, -1 ], [25,50,100,200,"All"]],
"order" : 0,'asc',
"data": dataSet,
// https://datatables.net/reference/option/rowCallback "rowCallback": function( row, data ) {
if ( data.id < 1000 ) { row.style.backgroundColor= (row.className=="odd") ? "#bbddbb" : "#cceecc"; row.firstChild.style.backgroundColor = row.style.backgroundColor; }
if ( data.id > 1000 && data.id < 51000 ) { row.style.backgroundColor= (row.className=="odd") ? "#ddddee" : "#eeeeff"; row.firstChild.style.backgroundColor = row.style.backgroundColor; }
if ( data.status.offline_since > 2 ) { //row.style.backgroundColor= (row.className=="odd") ? "#cccccc" : "#dddddd"; row.style.backgroundColor= "#cccccc"; row.firstChild.style.backgroundColor = row.style.backgroundColor; } }, // see: https://datatables.net/manual/data/orthogonal-data
"columns": [
{ "data": "id" },
{ "data": "id", //use "id" as input data for renderer
"render" : function (data, type, row) {
// If display or filter data is requested, format the date
if ( type === 'display' || type === 'filter' ) {
var ip = getIp(data);
return '<a href="http://' + ip + '/">' + ip + '</a>';
}
//else return id that is used when sorting this column
return data;
}
},
{ "data": "status",
"render" : function (data, type, row) {
if ( type === 'display' || type === 'filter' ) {
var img_o = data.online ? 'yes.png' : 'no.png';
var img_g = data.gateway ? 'yes.png' : 'no.png';
return ''
+ '
'
+ '[' + data.offline_since + ']';
}
return data.offline_since;
}
},
{ "data": "status.registered",
"render" : function (data, type, row) {
if ( type === 'display' || type === 'filter' ) {
var t = new Date(data*1000);
var day = ( '0' + t.getDate() ).slice(-2);
var month = ( '0' + t.getMonth() ).slice(-2);
var h = ( '0' + t.getHours() ).slice(-2);
var m = ( '0' + t.getMinutes() ).slice(-2);
return day + '.' + month + '.' + t.getFullYear()
+ '[' + h + ':' + m + ']';
}
return data;
}
},
{ "data": "name" },
{ "data": "position",
"render" : function (data, type, row) {
if ( type === 'display' || type === 'filter' ) {
return '<a href="http://maps.google.de/maps?f=q&hl=de&q='
+ data.lat.toString() + ','
+ data.lon.toString() + '&ie=UTF8&z=15&iwloc=addr&om=1">Map</a>';
} return 0; } }, { "data": "firmware" }, { "data": "model" }, { "data": "location" }, { "data": "note" },
] } );
</script>
