Resonator on map

Change:
Add "RESONATOR_DISPLAY_ZOOM_LEVEL" to control minimum zoom level resonator will display
Add layerGroup "resonatorsLayers" to draw resonators on it.
Add "window.resonators" to store references to resonators on map

Resonator will have guid of portal with ".11" or ".12" replaced with ".r0"~".r7"
Add function "window.renderResontor" to draw resonators (use sorgo's code [sorgo](https://github.com/sorgo))
"window.renderPortal" will call "window.renderResontor" before add portal to portalsLayers
Change "window.removeByGuid" to handle resonators
Change "window.cleanUp" to handle resonators cleanup

code/boot.js

@@ -81,6 +81,15 @@ window.setupMap = function() {
   map.addLayer(linksLayer, true);
   addLayers['Links'] = linksLayer;
 
+  resonatorsLayers = [];
+  for(var i = 1; i <= 8; i++) {
+    resonatorsLayers[i] = L.layerGroup([]);
+    map.addLayer(resonatorsLayers[i]);
+    var t = 'Level ' + i + ' Portal resonators';
+    addLayers[t] = resonatorsLayers[i];
+  }
+  
+
   map.addControl(new L.Control.Layers({
     'OSM Cloudmade Midnight': views[0],
     'OSM Cloudmade Minimal': views[1],

code/map_data.js

@@ -146,9 +146,15 @@ window.cleanUp = function() {
     portalsLayers[i].eachLayer(function(portal) {
       // portal must be in bounds and have a high enough level. Also don’t
       // remove if it is selected.
-      if(portal.options.guid == window.selectedPortal ||
+      var portalGuid = portal.options.guid;
+      if(portalGuid == window.selectedPortal ||
         (b.contains(portal.getLatLng()) && i >= minlvl)) return;
+
       cnt[0]++;
+
+      //remove attached resonators
+      for(var j = 0; j <= 7; j++) removeByGuid( portalResonatorGuid(portalGuid,j) );
+
       portalsLayers[i].removeLayer(portal);
     });
   }
@@ -162,6 +168,14 @@ window.cleanUp = function() {
     cnt[2]++;
     fieldsLayer.removeLayer(field);
   });
+  // remove all resonator if zoom level become 
+  // lower than RESONATOR_DISPLAY_ZOOM_LEVEL
+  if (map.getZoom() < RESONATOR_DISPLAY_ZOOM_LEVEL){
+    for(var i = 1; i < resonatorsLayers.length; i++){
+      resonatorsLayers[i].clearLayers();
+    }
+    console.log('removed all resonators');
+  }
   console.log('removed out-of-bounds: '+cnt[0]+' portals, '+cnt[1]+' links, '+cnt[2]+' fields');
 }
 
@@ -183,6 +197,10 @@ window.removeByGuid = function(guid) {
       if(!window.fields[guid]) return;
       fieldsLayer.removeLayer(window.fields[guid]);
       break;
+    case TYPE_RESONATOR:
+      if(!window.resonators[guid]) return;
+      resonatorsLayers[window.resonators[guid].options.pLevel].removeLayer(window.resonators[guid]);
+      break;
     default:
       console.warn('unknown GUID type: ' + guid);
       //window.debug.printStackTrace();
@@ -244,10 +262,73 @@ window.renderPortal = function(ent) {
     window.renderPortalDetails(ent[0]);
     window.map.setView(latlng, 17);
   });
+
+  window.renderResonator(ent);
+
   // portalLevel contains a float, need to round down
   p.addTo(portalsLayers[parseInt(portalLevel)]);
 }
 
+window.renderResonator = function(ent) {
+
+  var portalLevel = getPortalLevel(ent[2]);
+  if(portalLevel < getMinPortalLevel()  && ent[0] != selectedPortal) return;
+
+  if(map.getZoom() < RESONATOR_DISPLAY_ZOOM_LEVEL) return;
+
+  for(var i=0; i<ent[2].resonatorArray.resonators.length; i++) {
+    var rdata = ent[2].resonatorArray.resonators[i];
+    
+    if (rdata==null) continue;
+    
+    if (window.resonators[portalResonatorGuid(ent[0],i)]) continue;
+
+    var SLOT_TO_LAT = [0, Math.sqrt(2)/2, 1, Math.sqrt(2)/2, 0, -Math.sqrt(2)/2, -1, -Math.sqrt(2)/2];
+    var SLOT_TO_LNG = [1, Math.sqrt(2)/2, 0, -Math.sqrt(2)/2, -1, -Math.sqrt(2)/2, 0, Math.sqrt(2)/2];
+ 	
+    //Earths radius, sphere
+    var Radius=6378137;
+	
+    //offsets in meters
+    var dn = rdata.distanceToPortal*SLOT_TO_LAT[rdata.slot];
+    var de = rdata.distanceToPortal*SLOT_TO_LNG[rdata.slot];
+ 	 
+    //Coordinate offsets in radians
+    var dLat = dn/Radius;
+    var dLon = de/(Radius*Math.cos(Math.PI/180*(ent[2].locationE6.latE6/1E6)));
+ 	
+    //OffsetPosition, decimal degrees
+    var lat0 = ent[2].locationE6.latE6/1E6 + dLat * 180/Math.PI;
+    var lon0 = ent[2].locationE6.lngE6/1E6 + dLon * 180/Math.PI;
+    var Rlatlng = [lat0, lon0];
+    var r =  L.circleMarker(Rlatlng, {
+        radius: 4,
+        // #AAAAAA outline seems easier to see the fill opacity
+        color: '#AAAAAA',
+        opacity: 1,
+        weight: 1,
+        fillColor: COLORS_LVL[rdata.level],
+        fillOpacity: rdata.energyTotal/RESO_NRG[rdata.level],
+        clickable: false,
+        level: rdata.level,
+        pLevel: parseInt(portalLevel),
+        details: rdata,
+        pDetails: ent[2],
+        guid: portalResonatorGuid(ent[0],i) });
+
+    r.on('remove',   function() { delete window.resonators[this.options.guid]; });
+    r.on('add',      function() { window.resonators[this.options.guid] = this; });
+
+    r.addTo(resonatorsLayers[parseInt(portalLevel)]);
+  }
+}
+
+// replace .11 or .12 in portal guid with .r[slot] to
+// get guid for resonators
+window.portalResonatorGuid = function(portalGuid, slot){
+  return portalGuid.slice(0,32) + '.r' + slot;
+}
+
 window.portalResetColor = function(portal) {
   portal.setStyle({color: portal.options.fillColor});
 }

code/utils_misc.js

@@ -147,6 +147,8 @@ window.getTypeByGuid = function(guid) {
   // .b  == fields
   // .c  == player/creator
   // .d  == chat messages
+  // 
+  // .r0~.r7 == resonators
   switch(guid.slice(33)) {
     case '11':
     case '12':
@@ -164,6 +166,16 @@ window.getTypeByGuid = function(guid) {
     case 'd':
       return TYPE_CHAT;
 
+    case 'r0':
+    case 'r1':
+    case 'r2':
+    case 'r3':
+    case 'r4':
+    case 'r5':
+    case 'r6':
+    case 'r7':
+      return TYPE_RESONATOR;
+
     default:
       return TYPE_UNKNOWN;
   }

main.js

@@ -139,11 +139,14 @@ var NOMINATIM = 'http://nominatim.openstreetmap.org/search?format=json&limit=1&q
 var DEG2RAD = Math.PI / 180;
 var TEAM_NONE = 0, TEAM_RES = 1, TEAM_ENL = 2;
 var TEAM_TO_CSS = ['none', 'res', 'enl'];
-var TYPE_UNKNOWN = 0, TYPE_PORTAL = 1, TYPE_LINK = 2, TYPE_FIELD = 3, TYPE_PLAYER = 4, TYPE_CHAT = 5;
+var TYPE_UNKNOWN = 0, TYPE_PORTAL = 1, TYPE_LINK = 2, TYPE_FIELD = 3, TYPE_PLAYER = 4, TYPE_CHAT = 5, TYPE_RESONATOR = 6;
 // make PLAYER variable available in site context
 var PLAYER = window.PLAYER;
 var CHAT_SHRINKED = 60;
 
+// Minimum zoom level resonator will display
+var RESONATOR_DISPLAY_ZOOM_LEVEL = 16;
+
 // STORAGE ///////////////////////////////////////////////////////////
 // global variables used for storage. Most likely READ ONLY. Proper
 // way would be to encapsulate them in an anonymous function and write
@@ -156,7 +159,7 @@ window.selectedPortal = null;
 window.portalRangeIndicator = null;
 window.portalAccessIndicator = null;
 window.mapRunsUserAction = false;
-var portalsLayers, linksLayer, fieldsLayer;
+var portalsLayers, linksLayer, fieldsLayer, resonatorsLayers;
 
 // contain references to all entities shown on the map. These are
 // automatically kept in sync with the items on *sLayer, so never ever
@@ -164,6 +167,7 @@ var portalsLayers, linksLayer, fieldsLayer;
 window.portals = {};
 window.links = {};
 window.fields = {};
+window.resonators = {};
 
 // plugin framework. Plugins may load earlier than iitc, so don’t
 // overwrite data