source: src/django_gheat/website/static/heatmap.js@ 9203

var map;
function init(){

        var projection_wgs = new OpenLayers.Projection("EPSG:4326"); // WGS 1984

        map = new OpenLayers.Map('heatmap', {
                controls: [
                                new OpenLayers.Control.Navigation(),
                                new OpenLayers.Control.PanZoomBar(),
                                new OpenLayers.Control.ScaleLine(),
                                new OpenLayers.Control.LayerSwitcher(),
                                new OpenLayers.Control.MousePosition({ 'displayProjection' : projection_wgs }),
                ],
                maxExtent: new OpenLayers.Bounds(-20037508.3427892,-20037508.3427892,20037508.3427892,20037508.3427892), 
                numZoomLevels:16, 
                maxResolution:156543.0339, 
                units:'m', 
                projection: "EPSG:900913",
                displayProjection: new OpenLayers.Projection("EPSG:4326")
        });

        map.events.register('click', map, GetMousePos);
        function GetMousePos(pos) {
                var pix = map.getLonLatFromPixel(new OpenLayers.Pixel(pos.xy.x,pos.xy.y));
                var mousepos = OpenLayers.Layer.SphericalMercator.inverseMercator(pix.lon, pix.lat);
                var zoomlevel = map.getZoom();
                getNodeList(zoom, mousepos);
        }

        layerMapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik");
        map.addLayer(layerMapnik);

        layerHeatmap2 = new OpenLayers.Layer.OSM.Overlay2("All Access points", {isBaseLayer: false, visibility: true});
        map.addLayer(layerHeatmap2);

        layerHeatmap3 = new OpenLayers.Layer.OSM.Overlay3("Wireless Leiden Only", {isBaseLayer: false, visibility: true});
        map.addLayer(layerHeatmap3);

        layerHeatmap = new OpenLayers.Layer.OSM.Overlay1("Original Heatmap generator", {isBaseLayer: false, visibility: false});
        map.addLayer(layerHeatmap);
        
        var lon   = 4.48319;
        var lat   = 52.14068;
        var zoom  = 16;

        var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
        map.setCenter (lonLat, zoom);
}

function getNodeList(zoomlevel, mousepos){
  var nodelist;
  if (window.XMLHttpRequest){
    // code for IE7+, Firefox, Chrome, Opera, Safari
    nodelist=new XMLHttpRequest();
  }
  else{
    // code for IE6, IE5
    nodelist=new ActiveXObject("Microsoft.XMLHTTP");
  }

  nodelist.onreadystatechange=function(){
    if (nodelist.readyState==4 && nodelist.status==200){
      json=eval('(' + nodelist.responseText + ')');
      var list = '<br>';
      for (var i=0; i<json.length; i++){
        list += json[i].fields.ssid + '<br>';
      }
      document.getElementById('filters').innerHTML=list;
    }
  }
  nodelist.open("GET","/website/nodelist/" + zoomlevel + "," + mousepos.lat + "," + mousepos.lon,true);
  nodelist.send();
}

var apid = 1;

function filters(){
  var filter;
  if (window.XMLHttpRequest){
    // code for IE7+, Firefox, Chrome, Opera, Safari
    filter=new XMLHttpRequest();
  }
  else{
    // code for IE6, IE5
    filter=new ActiveXObject("Microsoft.XMLHTTP");
  }

  filter.onreadystatechange=function(){
    if (filter.readyState==4 && filter.status==200){
      map.addLayer(layerHeatmap3);
    }
  }
  var apid = encodeURIComponent(document.getElementById("apid").value);
  addFilter(apid);
}

function addFilter(apid){
  OpenLayers.Layer.OSM.Overlay = OpenLayers.Class(OpenLayers.Layer.OSM, {
    initialize: function(name, options) {
      var url = [
        "/website/tile/${z}/${x},${y}.png?colour=0,0,255&accespoint__id=" + apid
      ];
      options = OpenLayers.Util.extend({ numZoomLevels: 21 }, options);
      var newArguments = [name, url, options];
      OpenLayers.Layer.OSM.prototype.initialize.apply(this, newArguments);
    },
  CLASS_NAME: "OpenLayers.Layer.Overlay"
  });

  testlayer = new OpenLayers.Layer.OSM.Overlay("addFilter layer", {isBaseLayer: false, visibility: true});
  map.addLayer(testlayer);
}