Changeset 9235 for src/django_gheat


Ignore:
Timestamp:
Jun 7, 2011, 1:53:26 PM (13 years ago)
Author:
dennisw
Message:

More jquery, lot less code needed now.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • src/django_gheat/website/static/heatmap_extensions_test.js

    r9234 r9235  
    1 // Base stolen from http://java.sun.com/developer/technicalArticles/J2EE/AJAX/RealtimeValidation/
    2 var json;
    3 function AjaxRequest(url, callback, filter, field) {
    4 
    5   var req = init();
    6   req.onreadystatechange = processRequest;
    7        
    8   function init() {
    9     if (window.XMLHttpRequest) {
    10       return new XMLHttpRequest();
    11     } else if (window.ActiveXObject) {
    12       return new ActiveXObject("Microsoft.XMLHTTP");
    13     }
    14   }
    15    
    16   function processRequest () {
    17     if (req.readyState == 4) {
    18       if (req.status == 200) {
    19         if (callback) {
    20           callback(req.responseText);
    21         }
    22       }
    23     }
    24   }
    25 
    26   this.doGet = function() {
    27     req.open("GET", url, true);
    28     req.send(null);
    29   }
    30 }
    31 
    32 
    331// Uses zoomlevel en mouseposition to call the nodelist.py view. View returns nodes in json format which is read and printed in document element.
    342function getNodeList(zoomlevel, mousepos) {
    … …  
    4513}
    4614
     15// set filter values
     16$(document).ready(function() {
     17  $.getJSON("/website/foofilter",
     18    function(json) {
     19      $.each(json, function(i,json){
     20        $("<option>" + json.gebruiker + "</option>").appendTo("#select_user");
     21        $.each(json.meetrondje, function(m, meetrondje){
     22          $("<option>" + meetrondje.naam + "</option>").appendTo("#select_dataset");
     23          $.each(meetrondje.nodes, function(n, nodes){
     24            $("<option>" + nodes + "</option>").appendTo("#select_node");
     25          });
     26          $("<option>" + meetrondje.datum + "</option>").appendTo("#select_date");
     27        });
     28      });
     29    }
     30  );
     31});
    4732
    48 function get_filters() {
    49   // Create form
    50   var formstart = '<form method="get" action="">';
    51   var formend = '<input type="button" value="Add filter" onClick="addFilter()"/></form>';
    52   var layername = '<input type="text" id="lname" name="lname" size="10"/> Layername<br />';
    53   var colour = '<input type="text" id="colour" name="colour" size="10"/> Colour<br />';
    54   var user = '<select id="user" style="width:104px"></select> User<br />';
    55   var dataset = '<select id="dataset" style="width:104px"></select> Dataset<br />';
    56   var node = '<select id="node" style="width:104px"></select> Node<br />';
    57   var enc = '<select id="enc" style="width:104px"></select> Encryption<br />';
    58   var date = '<select id="date" style="width:104px"></select> Date<br />';
     33// add filter
     34$(function(){
     35  $('#add_filter').click(function(){
    5936
    60   // Write form to document
    61   document.getElementById('filter_list').innerHTML+=(formstart + date + user + dataset + node + enc + colour + layername + formend);
    62  
    63   // Request JSON with filter values
    64   var url = "/website/foofilter";
    65   var ajax = new AjaxRequest(url, set_filters);
    66   ajax.doGet();
    67 }
     37    user = $('#select_user option:selected').text();
     38    dataset = $('#select_dataset option:selected').text();
     39    wlnode = $('#select_node option:selected').text();
     40    enc = $('#select_enc option:selected').text();
     41    date = $('#select_date option:selected').text();
     42    colour = encodeURIComponent(document.getElementById("colour").value);
     43    lname = encodeURIComponent(document.getElementById("lname").value);
    6844
     45    if (user != 'All'){user='&meetrondje__gebruiker__naam='+user;}
     46    else{user='';}
     47    if (dataset != 'All'){dataset='&meetrondje__naam='+dataset;}
     48    else{dataset='';}
     49    if (wlnode != 'All'){wlnode='&accespoint__ssid='+wlnode;}
     50    else{wlnode='';}
     51    if (enc != ''){enc='&accespoint__encryptie='+enc;}
     52    if (date != 'All'){date='&meetrondje__datum='+date;}
     53    else{date='';}
     54    if (colour != ''){colour='colour='+colour;}
     55    else {colour = '&colour='+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256);}
     56    if (lname != ''){lname=lname;}
     57    else {lname = 'Custom Filter';}
    6958
    70 function set_filters(responseText) {
    71   json=eval('(' + responseText + ')');
    72   var user = '<option>All</option>';
    73   var dataset = '<option>All</option>';
    74   var date = '<option>All</option>';
    75   var node = '<option>All</option>';
    76   for (var i=0; i<json.length; i++){
    77     user += '<option>' + json[i].gebruiker + '</option>';
    78     for (m in json[i].meetrondje){
    79       dataset += '<option>' + json[i].meetrondje[m].naam + '</option>';
    80       date += '<option>' + json[i].meetrondje[m].datum + '</option>';
    81       for (n in json[i].meetrondje[m].nodes){
    82         node += '<option>' + json[i].meetrondje[m].nodes[n] + '</option>';
    83       }
    84     }
    85   }
    86   document.getElementById('user').innerHTML=user;
    87   document.getElementById('dataset').innerHTML=dataset;
    88   document.getElementById('date').innerHTML=date;
    89   document.getElementById('node').innerHTML=node;
    90 }
     59    var baseurl = "/website/tile/${z}/${x},${y}.png?";
    9160
     61    OpenLayers.Layer.OSM.Overlay = OpenLayers.Class(OpenLayers.Layer.OSM, {
     62      initialize: function(name, options) {
     63        var url = [
     64          baseurl + colour + user + dataset + wlnode + enc + date
     65        ];
     66        document.getElementById('filter_text').innerHTML+="<br />Added: " + url;
     67        options = OpenLayers.Util.extend({ numZoomLevels: 21 }, options);
     68        var newArguments = [name, url, options];
     69        OpenLayers.Layer.OSM.prototype.initialize.apply(this, newArguments);
     70      },
     71    CLASS_NAME: "OpenLayers.Layer.Overlay"
     72    });
    9273
    93 function addFilter(){
    94 
    95   var user = $('#user option:selected').text();
    96   var dataset = $('#dataset option:selected').text();
    97   var wlnode = $('#node option:selected').text();
    98   var enc = $('#enc option:selected').text();
    99   var date = $('#date option:selected').text();
    100   var colour = encodeURIComponent(document.getElementById("colour").value);
    101   var lname = encodeURIComponent(document.getElementById("lname").value);
    102 
    103   if (user != 'All'){user='&meetrondje__gebruiker__naam='+user;}
    104   else{user='';}
    105   if (dataset != 'All'){dataset='&meetrondje__naam='+dataset;}
    106   else{dataset='';}
    107   if (wlnode != 'All'){wlnode='&accespoint__ssid='+wlnode;}
    108   else{wlnode='';}
    109   if (enc != ''){enc='&accespoint__encryptie='+enc;}
    110   if (date != 'All'){date='&meetrondje__datum='+date;}
    111   else{date='';}
    112   if (colour != ''){colour='colour='+colour;}
    113   else {colour = '&colour='+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256);}
    114   if (lname != ''){lname=lname;}
    115   else {lname = 'Custom Filter';}
    116 
    117   var baseurl = "/website/tile/${z}/${x},${y}.png?";
    118 
    119   OpenLayers.Layer.OSM.Overlay = OpenLayers.Class(OpenLayers.Layer.OSM, {
    120     initialize: function(name, options) {
    121       var url = [
    122         baseurl + colour + user + dataset + wlnode + enc + date
    123       ];
    124       document.getElementById('filter_text').innerHTML+="<br />Added: " + url;
    125       options = OpenLayers.Util.extend({ numZoomLevels: 21 }, options);
    126       var newArguments = [name, url, options];
    127       OpenLayers.Layer.OSM.prototype.initialize.apply(this, newArguments);
    128     },
    129   CLASS_NAME: "OpenLayers.Layer.Overlay"
     74    filterlayer = new OpenLayers.Layer.OSM.Overlay(lname, {isBaseLayer: false, visibility: true});
     75    map.addLayer(filterlayer);
    13076  });
    131 
    132   filterlayer = new OpenLayers.Layer.OSM.Overlay(lname, {isBaseLayer: false, visibility: true});
    133   map.addLayer(filterlayer);
    134 }
     77});
Note: See TracChangeset for help on using the changeset viewer.