define(['leaflet','controller/sidebar','leaflet.label'],function(L,Sidebar){ var data,currentNode; return function(el,config){ var mapEl = document.createElement("div"); mapEl.classList.add("map"); var sideBarEl = document.createElement("div"); var bar = Sidebar(sideBarEl,config); var map = L.map(mapEl,{zoomControl:false}).setView([51.505, -0.09], 13); var layergeojson,layernodes; L.tileLayer( config.map.tiles.url, config.map.tiles.option).addTo(map); map.setView(config.map.view,config.map.zoom); var geoJsonOption = { pointToLayer: function (feature, latlng){ feature.properties.radius = 10; return L.circleMarker(latlng, feature.properties); }, onEachFeature: function(feature, layer) { if(feature.properties.name.length >0) layer.bindLabel(feature.properties.name); }, style: function(feature){ if(feature.geometry.type === "LineString" || feature.geometry.type === "Polygon") return {color: feature.properties.stroke, opacity:feature.properties["stroke-opacity"], fillColor: feature.properties.fill, fillOpacity:feature.properties["fill-opacity"], stroke: true, weight: feature.properties["stroke-width"], lineCap: "round", lineJoin: "round"}; return { color: feature.properties["marker-color"], fillColor: feature.properties["marker-color"], fillOpacity: 0.2, weight: 2, stroke: true }; } }; nodeIcon = L.divIcon({className: "nodeicon"}); render = function(){ if(layernodes) layernodes.clearLayers(); if(layergeojson) layergeojson.clearLayers(); if(data.geojson && Object.keys(data.geojson).length > 0){ layergeojson = L.geoJson(data.geojson,geoJsonOption).addTo(map); map._onResize(); } var nodes = Object.keys(data.nodes).filter(function(key){ if((data.nodes[key].nodeinfo && data.nodes[key].nodeinfo.location) || (data.aliases[key] && data.aliases[key].location)) return true; if(currentNode && currentNode == key) bar.setSelected(key,null,function(){}); return false; }).map(function(key){ var node = data.nodes[key]; var alias = data.aliases[key]; if(alias && alias.location) pos = [alias.location.latitude,alias.location.longitude]; else pos = [node.nodeinfo.location.latitude,node.nodeinfo.location.longitude]; var m = L.marker(pos,{ icon: nodeIcon }); var className = "nodeicon"; if(node.flags && !node.flags.online) className += " offline"; var wifi24="-",wifi5="-",ch24="-",ch5="-",tx24="-",tx5="-"; if(node.statistics && node.statistics.clients){ wifi24 = node.statistics.clients.wifi24; if(wifi24 < config.map.icon.warn.wifi24 && wifi24 > 0) className += " client24"; else if(wifi24 < config.map.icon.crit.wifi24 && wifi24 >= config.map.icon.warn.wifi24) className += ' client24-warn'; else if(wifi24 >= config.map.icon.crit.wifi24) className += ' client24-crit'; wifi5 = node.statistics.clients.wifi5; if(config.map.icon.warn.wifi5 < 20 && wifi5 > 0) className += ' client5'; else if(wifi5 < config.map.icon.crit.wifi5 && wifi5 >= config.map.icon.warn.wifi5) className += ' client5-warn'; else if(wifi5 >= config.map.icon.crit.wifi5) className += ' client5-crit'; } if(node.nodeinfo.wireless){ ch24 = (alias && alias.wireless && alias.wireless.channel24)?alias.wireless.channel24:((node.nodeinfo.wireless.channel24)?node.nodeinfo.wireless.channel24:'-'); ch5 = (alias && alias.wireless && alias.wireless.channel5)?alias.wireless.channel5:((node.nodeinfo.wireless.channel5)?node.nodeinfo.wireless.channel5:'-'); tx24 = (alias && alias.wireless && alias.wireless.txpower24)?alias.wireless.txpower24:((node.nodeinfo.wireless.txpower24)?node.nodeinfo.wireless.txpower24:'-'); tx5 = (alias && alias.wireless && alias.wireless.txpower5)?alias.wireless.txpower5:((node.nodeinfo.wireless.txpower5)?node.nodeinfo.wireless.txpower5:'-'); } m.bindLabel(((alias && alias.hostname)?alias.hostname:node.nodeinfo.hostname)+"
("+key+")"+ ""+ ""+ ""+ "
ClChTx
2.4G"+wifi24+""+ch24+""+tx24+"
5G"+wifi5+""+ch5+""+tx5+"
"+ "
" ); if(currentNode && currentNode == key){ className += ' select'; map.setView(m.getLatLng(),config.map.zoom); m.options.draggable = true; bar.setSelected(key,m,function(){ m.dragging.disable(); m._icon.classList.remove("select"); }); } m.setIcon(L.divIcon({className: className})); m.on("click", function(){ window.location.href = "#map/"+key; currentNode = key; render(); }); return m; }); layernodes = L.featureGroup(nodes).addTo(map); }; return { render: function(nodeid){ currentNode = nodeid; render(); }, storageNotify: function(d){ data = d; bar.storageNotify(d); render(); }, controller: function(){ currentNode = (arguments[0])?arguments[0].toLowerCase():null; el.textContent = ""; el.appendChild(sideBarEl); el.appendChild(mapEl); } }; }; });