Changeset 9220 for src/django_gheat/website

Timestamp:

May 30, 2011, 2:49:46 PM (14 years ago)

Author:

dennisw

Message:

Fixed form except encryption & date.

Location:

src/django_gheat/website

Files:

• static/heatmap_extensions.js (modified) (6 diffs)
• templates/home.html (modified) (1 diff)

src/django_gheat/website/static/heatmap_extensions.js

@@ -1 +1 @@
 // Base stolen from http://java.sun.com/developer/technicalArticles/J2EE/AJAX/RealtimeValidation/
-function AjaxRequest(url, callback, filter) {
+function AjaxRequest(url, callback, filter, field) {
 
   var req = init();
@@ -17 +17 @@
       if (req.status == 200) {
         if (callback) {
-          if (filter) callback(filter, req.responseText);
+          if (filter) callback(filter, field, req.responseText);
           else callback(req.responseText);
         }
@@ -56 +56 @@
 
 function get_filters() {
+
+  // Create form
   var formstart = '<form method="get" action="">';
   var formend = '<input type="button" value="Add filter" onClick="addFilter()"/></form>';
@@ -61 +63 @@
   var colour = '<input type="text" id="colour" name="colour" size="10"/> Colour<br />';
   var user = '<select id="user" style="width:104px"><option></option></select> User<br />';
-var dataset = '<select id="dataset" style="width:104px"><option></option></select> Dataset<br />';
-var node = '<select id="node" style="width:104px"><option></option></select> Node<br />';
+  var dataset = '<select id="dataset" style="width:104px"><option></option></select> Dataset<br />';
+  var node = '<select id="node" style="width:104px"><option></option></select> Node<br />';
+  var enc = '<select id="enc" style="width:104px"><option></option></select> Encryption<br />';
+  var date = '<select id="date" style="width:104px"><option></option></select> Date<br />';
 
-  document.getElementById('filter_list').innerHTML+=formstart;
-  document.getElementById('filter_list').innerHTML+=user;
-
-  var filters = new Array('user');
+  // Write form to document
+  document.getElementById('filter_list').innerHTML+=(formstart + user + dataset + node + enc + date + colour + layername + formend);
+  
+  // Get values for select boxes
+  // filters[] first value is what to get, second value is which field values will be shown in select box
+  var filters = [['user','naam'],['dataset','naam'],['node','ssid']]
   for (var i=0; i<filters.length; i++) {
-    get_json(filters[i]);
+    get_json(filters[i][0], filters[i][1]);
   }
-
-  // todo: Fix formend, it is called before the 'for' filter is completed, making the form look silly.
-  document.getElementById('filter_list').innerHTML+=formend;
 }
 
 
-function get_json(filter) {
+function get_json(filter, field) {
   var url = "/website/filter/filter_" + filter;
-  var ajax = new AjaxRequest(url, set_filter, filter); 
+  var ajax = new AjaxRequest(url, set_filter, filter, field); 
   ajax.doGet(); 
 }
 
 
-function set_filter(filter, responseText) {
+function set_filter(filter, field, responseText) {
   json=eval('(' + responseText + ')');
   var options = '';
   for (var i=0; i<json.length; i++){
-    options += '<option>' + json[i].fields.naam + '</option>';
+    options += '<option>' + json[i].fields[field] + '</option>';
   }
-  document.getElementById('user').innerHTML+=options;
+  document.getElementById(filter).innerHTML+=options;
 }
 
@@ -97 +100 @@
 
   var user = encodeURIComponent(document.getElementById("user").value);
-  var dataset = '';
-  var wlnode = '';
-  var enc ='';
-  var date = '';
-  var colour = '';
-  var lname = '';
+  var dataset = encodeURIComponent(document.getElementById("dataset").value);
+  var wlnode = encodeURIComponent(document.getElementById("node").value);
+  var enc = encodeURIComponent(document.getElementById("enc").value);
+  var date = encodeURIComponent(document.getElementById("date").value);
+  var colour = encodeURIComponent(document.getElementById("colour").value);
+  var lname = encodeURIComponent(document.getElementById("lname").value);
 
   if (user != ''){user='&gebruiker__naam='+user;} 
@@ -131 +134 @@
   map.addLayer(filterlayer);
 }
-
-
-/*
-
-The following code is old, broken and for reference purposes. Will be removed when new code is done.
-The above (new) code was used instead to make everything more easy when adding new pieces.
-
-// Get filter values from django view and serve as option list
-function getFilters(){
-  var filterlist;
-  var nodelist;
-  var userlist;
-  var datasetlist;
-
-  if (window.XMLHttpRequest){
-    nodelist=new XMLHttpRequest();
-    userlist=new XMLHttpRequest();
-    datasetlist=new XMLHttpRequest();
-  }
-  else{
-    nodelist=new ActiveXObject("Microsoft.XMLHTTP");
-    userlist=new ActiveXObject("Microsoft.XMLHTTP");
-    datasetlist=new ActiveXObject("Microsoft.XMLHTTP");
-  }
-
-  var list = '<form method="get" action="">';
-
-
-  // todo: Get new options if one option is selected; every user has different datasets, make sure when user 'John' is selected, you can only choose datasets who are his.
-
-  userlist.onreadystatechange=function(){
-    if (userlist.readyState==4 && userlist.status==200){
-      userlist=eval('(' + userlist.responseText + ')');
-      
-      list += '<select id="user" style="width:104px"><option></option>';
-      for (var i=0; i<userlist.length; i++){
-        list += '<option>' + userlist[i].fields.naam + '</option>';
-      }
-      list += '</select> User<br />';
-
-      document.getElementById('filter_list').innerHTML=list;
-    }
-  }
-
-
-
-
-  nodelist.onreadystatechange=function(){
-    if (nodelist.readyState==4 && nodelist.status==200){
-      nodelist=eval('(' + nodelist.responseText + ')');
-
-      list += '<select id="wlnode" style="width:104px"><option></option>';
-      for (var i=0; i<nodelist.length; i++){
-        list += '<option>' + nodelist[i].fields.ssid + '</option>';
-      }
-      list += '</select> WLnode<br />';
-
-      document.getElementById('filter_list').innerHTML=list;
-    }
-  }
-
-
-  datasetlist.onreadystatechange=function(){
-    if (datasetlist.readyState==4 && datasetlist.status==200){
-      datasetlist=eval('(' + datasetlist.responseText + ')');
-
-      list += '<select id="dataset" style="width:104px"><option></option>';
-      for (var i=0; i<datasetlist.length; i++){
-        list += '<option>' + datasetlist[i].fields.naam + '</option>';
-      }
-      list += '</select> Dataset<br />';
-
-      document.getElementById('filter_list').innerHTML=list;
-    }
-  }
-
-
-  list += '<input type="text" id="enc" name="enc" size="10"/> Encrypted<br />';
-  list += '<input type="text" id="colour" name="colour" size="10"/> Colour<br />';
-  list += '<input type="text" id="lname" name="lname" size="10"/> Layername<br />';
-  list += '<input type="button" value="Add filter" onClick="addFilter()"/>';
-  list += '</form>';
-
-
-
-
-
-  nodelist.open("GET","/website/filters/1",true);
-  nodelist.send();
-  userlist.open("GET","/website/filters/2",true);
-  userlist.send();
-  datasetlist.open("GET","/website/filters/3",true);
-  datasetlist.send();
-}
-*/

src/django_gheat/website/templates/home.html

@@ -29 +29 @@
 
 
-<body onload="init(), filter_node()">
+<body onload="init(), get_filters()">
   <div id="heatmap"></div>
   <div id="container">