This commit is contained in:
Martin Geno 2017-05-16 16:00:32 +02:00
parent 2e2142b155
commit d3fcd7f232
No known key found for this signature in database
GPG Key ID: F0D39A37E925E941
12 changed files with 74 additions and 51 deletions

View File

@ -1 +1,2 @@
document.title = config.title /* global config */
document.title = config.title;

View File

@ -1,10 +1,12 @@
/* exported config */
var config = { var config = {
title: 'FreifunkManager - Breminale', title: 'FreifunkManager - Breminale',
backend: 'ws://'+location.host+'/websocket', backend: 'ws://'+location.host+'/websocket',
map: { map: {
view: {bound: [53.07093, 8.79464], zoom: 17}, view: {bound: [53.07093, 8.79464], zoom: 17},
maxZoom: 20, maxZoom: 20,
tileLayer: '//tiles.bremen.freifunk.net/{z}/{x}/{y}.png', tileLayer: 'https://tiles.bremen.freifunk.net/{z}/{x}/{y}.png',
/* heatmap settings /* heatmap settings
size: in meters (default: 30km) size: in meters (default: 30km)
opacity: in percent/100 (default: 1) opacity: in percent/100 (default: 1)
@ -21,7 +23,7 @@ var config = {
crit:{wifi24:30,wifi5:30} crit:{wifi24:30,wifi5:30}
}, },
geojson: { geojson: {
url: '//events.ffhb.de/data/ground.geojson', url: 'http://events.ffhb.de/data/ground.geojson',
pointToLayer: function (feature, latlng){ pointToLayer: function (feature, latlng){
feature.properties.radius = 10; feature.properties.radius = 10;
return L.circleMarker(latlng, feature.properties); return L.circleMarker(latlng, feature.properties);

View File

@ -1,3 +1,5 @@
/* exported domlin */
var domlib = {}; var domlib = {};
(function(){ (function(){
domlib.newAt = function(at,eltype) { domlib.newAt = function(at,eltype) {
@ -11,4 +13,4 @@ var domlib = {};
el.removeChild(el.firstChild); el.removeChild(el.firstChild);
} }
}; };
})() })();

View File

@ -1,3 +1,5 @@
/* exported gui,router */
/* globals socket,notify,domlib,guiList,guiMap,guiStats,guiNode */
var gui = {}; var gui = {};
var router = new Navigo(null, true, '#'); var router = new Navigo(null, true, '#');
@ -8,7 +10,7 @@ var router = new Navigo(null, true, '#');
var status = document.getElementsByClassName('status')[0]; var status = document.getElementsByClassName('status')[0];
if (status === undefined){ if (status === undefined){
console.log("unable to render, render later"); console.log("unable to render, render later");
setTimeout(render,100); window.setTimeout(render,100);
return; return;
} }
status.classList.remove('connecting','offline'); status.classList.remove('connecting','offline');
@ -24,7 +26,7 @@ var router = new Navigo(null, true, '#');
function setView(c){ function setView(c){
currentView = c; currentView = c;
var main = document.querySelector('main') var main = document.querySelector('main');
domlib.removeChildren(main); domlib.removeChildren(main);
currentView.bind(main); currentView.bind(main);
currentView.render(); currentView.render();
@ -61,12 +63,12 @@ var router = new Navigo(null, true, '#');
if (timeout){ if (timeout){
console("skip rendering, because to often"); console("skip rendering, because to often");
clearTimeout(timeout); window.clearTimeout(timeout);
} else { } else {
render(); render();
} }
timeout = setTimeout(reset, 100); timeout = window.setTimeout(reset, 100);
} };
window.onload = gui.render; window.onload = gui.render;
})(); })();

View File

@ -1,3 +1,6 @@
/* exported guiList */
/* global domlib,store,router */
var guiList = {}; var guiList = {};
(function(){ (function(){
@ -31,11 +34,11 @@ var guiList = {};
return a.statistics.clients.wifi24 - b.statistics.clients.wifi24; return a.statistics.clients.wifi24 - b.statistics.clients.wifi24;
case "ChanUtil": case "ChanUtil":
var aMax = a.statistics.wireless.map(function(d){ var aMax = a.statistics.wireless.map(function(d){
return d.ChanUtil return d.ChanUtil;
}).sort(sortNumber); }).sort(sortNumber);
var bMax = b.statistics.wireless.map(function(d){ var bMax = b.statistics.wireless.map(function(d){
return d.ChanUtil return d.ChanUtil;
}).sort(sortNumber); }).sort(sortNumber);
if(!sortReverse){ if(!sortReverse){
@ -55,8 +58,7 @@ var guiList = {};
var startdate = new Date(); var startdate = new Date();
startdate.setMinutes(startdate.getMinutes() - 1); startdate.setMinutes(startdate.getMinutes() - 1);
if(new Date(node.lastseen) < startdate) if(new Date(node.lastseen) < startdate)
tr.classList.add('offline') tr.classList.add('offline');
var td;
domlib.newAt(tr,'td').innerHTML = moment(node.lastseen).fromNow(true); domlib.newAt(tr,'td').innerHTML = moment(node.lastseen).fromNow(true);
domlib.newAt(tr,'td').innerHTML = node.node_id; domlib.newAt(tr,'td').innerHTML = node.node_id;
@ -98,7 +100,7 @@ var guiList = {};
domlib.newAt(chanUtil,'span').innerHTML = chanUtil5.ChanUtil||'-'; domlib.newAt(chanUtil,'span').innerHTML = chanUtil5.ChanUtil||'-';
var option = domlib.newAt(tr,'td'); var option = domlib.newAt(tr,'td');
edit = domlib.newAt(option,'div'); var edit = domlib.newAt(option,'div');
edit.classList.add('btn'); edit.classList.add('btn');
edit.innerHTML = 'Edit'; edit.innerHTML = 'Edit';
edit.addEventListener('click',function(){ edit.addEventListener('click',function(){
@ -115,11 +117,11 @@ var guiList = {};
if(hostnameFilter && hostnameFilter.value != "") if(hostnameFilter && hostnameFilter.value != "")
nodes = nodes.filter(function(d){ nodes = nodes.filter(function(d){
return d.hostname.toLowerCase().indexOf(hostnameFilter.value) > -1; return d.hostname.toLowerCase().indexOf(hostnameFilter.value) > -1;
}) });
if(nodeidFilter && nodeidFilter.value != "") if(nodeidFilter && nodeidFilter.value != "")
nodes = nodes.filter(function(d){ nodes = nodes.filter(function(d){
return d.node_id.indexOf(nodeidFilter.value) > -1; return d.node_id.indexOf(nodeidFilter.value) > -1;
}) });
nodes = nodes.sort(sort); nodes = nodes.sort(sort);

View File

@ -1,3 +1,6 @@
/* exported guiMap */
/* global config,store,domlib,socket */
var guiMap = {}; var guiMap = {};
(function(){ (function(){
@ -87,14 +90,14 @@ var guiMap = {};
return; return;
} }
return [node.location.latitude,node.location.longitude,node.statistics.clients.wifi24 * 2 || 0]; return [node.location.latitude,node.location.longitude,node.statistics.clients.wifi24 * 2 || 0];
}) });
clientLayer24.setData(clientData24); clientLayer24.setData(clientData24);
var clientData5 = nodes.map(function(node){ var clientData5 = nodes.map(function(node){
if(node.location === undefined || node.location.latitude === undefined || node.location.longitude === undefined) { if(node.location === undefined || node.location.latitude === undefined || node.location.longitude === undefined) {
return; return;
} }
return [node.location.latitude,node.location.longitude,node.statistics.clients.wifi5 || 0]; return [node.location.latitude,node.location.longitude,node.statistics.clients.wifi5 || 0];
}) });
clientLayer5.setData(clientData5); clientLayer5.setData(clientData5);
} }
@ -121,7 +124,7 @@ var guiMap = {};
maxZoom: config.map.maxZoom, maxZoom: config.map.maxZoom,
}).addTo(map); }).addTo(map);
layerControl = L.control.layers().addTo(map); var layerControl = L.control.layers().addTo(map);
geoJsonLayer = L.geoJson.ajax(config.map.geojson.url, config.map.geojson); geoJsonLayer = L.geoJson.ajax(config.map.geojson.url, config.map.geojson);
@ -141,5 +144,5 @@ var guiMap = {};
}); });
update(); update();
} };
})() })();

View File

@ -1,3 +1,5 @@
/* exported guiNode */
/* globals store, socket, domlib, config,notify */
var guiNode = {}; var guiNode = {};
(function(){ (function(){
@ -32,10 +34,10 @@ var guiNode = {};
var startdate = new Date(); var startdate = new Date();
startdate.setMinutes(startdate.getMinutes() - 1); startdate.setMinutes(startdate.getMinutes() - 1);
if(new Date(node.lastseen) < startdate){ if(new Date(node.lastseen) < startdate){
ago.classList.add('offline') ago.classList.add('offline');
ago.classList.remove('online'); ago.classList.remove('online');
}else{ }else{
ago.classList.remove('offline') ago.classList.remove('offline');
ago.classList.add('online'); ago.classList.add('online');
} }
ago.innerHTML = moment(node.lastseen).fromNow() + ' ('+node.lastseen+')'; ago.innerHTML = moment(node.lastseen).fromNow() + ' ('+node.lastseen+')';
@ -51,7 +53,7 @@ var guiNode = {};
view.setNodeID = function (nodeID){ view.setNodeID = function (nodeID){
current_node_id = nodeID; current_node_id = nodeID;
} };
view.bind = function(el) { view.bind = function(el) {
container = el; container = el;
@ -69,7 +71,7 @@ var guiNode = {};
var title = domlib.newAt(el,'h1'); var title = domlib.newAt(el,'h1');
titleName = domlib.newAt(title,'span'); titleName = domlib.newAt(title,'span');
title.appendChild(document.createTextNode(" - ")) title.appendChild(document.createTextNode(" - "));
titleID = domlib.newAt(title,'i'); titleID = domlib.newAt(title,'i');
var lastseen = domlib.newAt(el,'p'); var lastseen = domlib.newAt(el,'p');
@ -86,10 +88,10 @@ var guiNode = {};
geoJsonLayer = L.geoJson.ajax(config.map.geojson.url, config.map.geojson).addTo(map); geoJsonLayer = L.geoJson.ajax(config.map.geojson.url, config.map.geojson).addTo(map);
marker = L.marker(config.map.view.bound,{draggable:true,opacity:0.5}).addTo(map); marker = L.marker(config.map.view.bound,{draggable:true,opacity:0.5}).addTo(map);
marker.on('dragstart', function(e){ marker.on('dragstart', function(){
editing = true; editing = true;
}); });
marker.on('dragend', function(e){ marker.on('dragend', function(){
editing = false; editing = false;
var pos = marker.getLatLng(); var pos = marker.getLatLng();
updatePosition(pos.lat,pos.lng); updatePosition(pos.lat,pos.lng);
@ -109,7 +111,7 @@ var guiNode = {};
return; return;
} }
btnGPS.innerHTML = 'Following position'; btnGPS.innerHTML = 'Following position';
if (!!navigator.geolocation) if (navigator.geolocation !== undefined)
editLocationGPS = navigator.geolocation.watchPosition( editLocationGPS = navigator.geolocation.watchPosition(
function geo_success(position) { function geo_success(position) {
btnGPS.innerHTML = "Stop following"; btnGPS.innerHTML = "Stop following";
@ -123,7 +125,7 @@ var guiNode = {};
case error.TIMEOUT: case error.TIMEOUT:
notify.send("error","Find Location timeout"); notify.send("error","Find Location timeout");
break; break;
}; }
}, },
{ {
enableHighAccuracy: true, enableHighAccuracy: true,
@ -131,10 +133,10 @@ var guiNode = {};
timeout: 27000 timeout: 27000
}); });
else else
notify.send("error","Browser did not support Location") notify.send("error","Browser did not support Location");
}); });
update(); update();
} };
})() })();

View File

@ -1,3 +1,5 @@
/* exported guiSkel */
/* globals domlib */
var guiSkel = {}; var guiSkel = {};
(function(){ (function(){
@ -22,5 +24,5 @@ var guiSkel = {};
el = domlib.newAt(container,'div'); el = domlib.newAt(container,'div');
update(); update();
} };
})() })();

View File

@ -1,3 +1,5 @@
/* exported guiStats */
/* globals store, domlib */
var guiStats = {}; var guiStats = {};
(function(){ (function(){
@ -35,13 +37,13 @@ var guiStats = {};
var tr,title; var tr,title;
tr = domlib.newAt(table,'tr'); tr = domlib.newAt(table,'tr');
title = domlib.newAt(tr,'th') title = domlib.newAt(tr,'th');
title.innerHTML = "Nodes"; title.innerHTML = "Nodes";
title.setAttribute("colspan","2"); title.setAttribute("colspan","2");
nodes = domlib.newAt(tr,'td'); nodes = domlib.newAt(tr,'td');
tr = domlib.newAt(table,'tr'); tr = domlib.newAt(table,'tr');
title = domlib.newAt(tr,'th') title = domlib.newAt(tr,'th');
title.innerHTML = "Clients"; title.innerHTML = "Clients";
title.setAttribute("colspan","2"); title.setAttribute("colspan","2");
clients = domlib.newAt(tr,'td'); clients = domlib.newAt(tr,'td');
@ -58,5 +60,5 @@ var guiStats = {};
clientsWifi5 = domlib.newAt(tr,'td'); clientsWifi5 = domlib.newAt(tr,'td');
update(); update();
} };
})() })();

View File

@ -1,12 +1,13 @@
var notify = {}; /* exported notify */
var notify = {};
(function(){ (function(){
var container; var container;
var messages = []; var messages = [];
if ("Notification" in window) { if ("Notification" in window) {
Notification.requestPermission(); window.Notification.requestPermission();
} }
function removeLast (){ function removeLast (){
@ -28,15 +29,15 @@ var notify = {};
}); });
} }
setInterval(removeLast,15000); window.setInterval(removeLast,15000);
notify.bind = function(el) { notify.bind = function(el) {
container = el; container = el;
}; };
notify.send = function(type, text){ notify.send = function(type, text){
if("Notification" in window && Notification.permission === "granted") { if("Notification" in window && window.Notification.permission === "granted") {
new Notification(text,{body:type,icon:'/img/logo.jpg'}); new window.Notification(text,{body:type,icon:'/img/logo.jpg'});
return; return;
} }
if(messages.length > 10){ if(messages.length > 10){
@ -47,4 +48,4 @@ var notify = {};
renderMsg(msg); renderMsg(msg);
}; };
})() })();

View File

@ -1,3 +1,5 @@
/* exported socket */
/*globals notify,gui,store,config*/
var socket = {readyState:0}; var socket = {readyState:0};
(function(){ (function(){
@ -39,18 +41,18 @@ var socket = {readyState:0};
console.log("socket closed by server"); console.log("socket closed by server");
notify.send("warn","Es besteht ein Verbindungsproblem!"); notify.send("warn","Es besteht ein Verbindungsproblem!");
gui.render(); gui.render();
setTimeout(connect, 5000); window.setTimeout(connect, 5000);
} }
function sendnode(node) { function sendnode(node) {
var msg = {type:"to-update",node:node}; var msg = {type:"to-update",node:node};
var string = JSON.stringify(msg); var string = JSON.stringify(msg);
socket.send(string) socket.send(string);
notify.send("success","Node '"+node.node_id+"' mit neuen Werten wurde übermittelt."); notify.send("success","Node '"+node.node_id+"' mit neuen Werten wurde übermittelt.");
} }
function connect() { function connect() {
socket = new WebSocket(config.backend); socket = new window.WebSocket(config.backend);
socket.onopen = onopen; socket.onopen = onopen;
socket.onerror = onerror; socket.onerror = onerror;
socket.onmessage = onmessage; socket.onmessage = onmessage;

View File

@ -1,3 +1,5 @@
/* exported store */
var store = { var store = {
_list:{}, _list:{},
_toupdate:{}, _toupdate:{},