Widget:Hotspots: Unterschied zwischen den Versionen

Aus Freifunk Dresden - Anwender-Wiki
Zur Navigation springen Zur Suche springen
Zeile 56: Zeile 56:
  
 
jQuery(document).ready(function() {
 
jQuery(document).ready(function() {
   $('#example').DataTable( {
+
   jQuery('#example').DataTable( {
 
"processing": true,
 
"processing": true,
 
//"responsive": true,
 
//"responsive": true,

Version vom 15. September 2018, 21:54 Uhr

<script type="text/javascript" src="/hotspots/js/jquery.js"></script> <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 Ok
GW
Tage
Registriert Name Map Firmware AU SSID Gateway
aktuell/bevorzugt.
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();

}

/* If for some reason two versions of jQuery are loaded (which is not recommended), calling $.noConflict(true) from the second version will return the globally scoped jQuery variables to those of the first version. Some times it could be issue with older version (or not stable) of JQuery files.

Solution use $.noConflict();

  • /

try {

 $.noConflict(true);

} catch(err) { }


jQuery(document).ready(function() {

 jQuery('#example').DataTable( {

"processing": true, //"responsive": true, "pageLength" : 25, "lengthMenu": [[ 25, 50, 100, 200, -1 ], [25,50,100,200,"All"]], "order" : 0,'asc',

// define nowrap for specific columns "columnDefs": [ { className: "dt-nowrap", "targets": [0,1,2,3,4,5,6,7,8,9,10,11,12 ] }

],

       "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 'Ja' + 'Ja' + '[' + 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", "render" : function (data, type, row) { return data.substring(0,25); } }, { "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": "status.autoupdate", "render" : function (data, type, row) { if ( type === 'display' || type === 'filter' ) { var img_o = data ? 'yes.png' : 'no.png'; return 'Ja'; } return data; } }, { "data": "status.ssid"}, { "data": "status", "render" : function (data, type, row) { if ( type === 'display' || type === 'filter' ) { return data.selected_gateway + '(' + data.preferred_gateway + ')'; } return data.selected_gateway; } }, { "data": "model", "render" : function (data, type, row) { return data.substring(0,25); } }, { "data": "location", "render" : function (data, type, row) { return data.substring(0,25); } }, { "data": "note", "render" : function (data, type, row) { return data.substring(0,40); } },

       ]
   } );
 } );

</script>