Changeset 9213 for src/django_gheat/website/static

Timestamp:

May 24, 2011, 4:08:04 PM (14 years ago)

Author:

dennisw

Message:

Added nodelist to layout again. Progress on filters (remains of useless code may still be there, will clean up later when filters work as planned).

Location:

src/django_gheat/website/static

Files:

• heatmap_extensions.js (modified) (2 diffs)
• style.css (modified) (5 diffs)

src/django_gheat/website/static/heatmap_extensions.js

@@ -13 +13 @@
     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>';
+      var list;
+      if (json.length>0){
+        list = '<center>Wireless Leiden nodes on mouseposition:<br /><b>';
+        for (var i=0; i<json.length; i++){
+          list += json[i].fields.ssid + '<br />';
+        }
+        list += '</b></center>';
       }
-      document.getElementById('nodelist').innerHTML=list;
+      else{
+        list = '<center>No nodes to display.</center>';
+      }
+      document.getElementById('node_list').innerHTML=list;
     }
   }
@@ -25 +32 @@
 
 
-// Retrieve form values for filter and pass them on to addFilter()
-function filters(){
-  var user = encodeURIComponent(document.getElementById("user").value);
-  var dataset = encodeURIComponent(document.getElementById("dataset").value);
-  var wlnode = encodeURIComponent(document.getElementById("wlnode").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);
+// Get filter values from django view and serve as option list
+function getFilters(){
+  var filterlist;
 
-  addFilter(user, dataset, wlnode, enc, date, colour, lname);
+  if (window.XMLHttpRequest){
+    filterlist=new XMLHttpRequest();
+  }
+  else{
+    filterlist=new ActiveXObject("Microsoft.XMLHTTP");
+  }
+
+  filterlist.onreadystatechange=function(){
+    if (filterlist.readyState==4 && filterlist.status==200){
+      json=eval('(' + filterlist.responseText + ')');
+      var list = '<form method="get" action="">';
+      list += '<select id="wlnode" style="width:104px"><option></option>';
+      for (var i=0; i<json.length; i++){
+        list += '<option>' + json[i].fields.ssid + '</option>';
+      }
+      list += '</select> WLnode<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>';
+      document.getElementById('filter_list').innerHTML=list;
+    }
+  }
+  filterlist.open("GET","/website/filters",true);
+  filterlist.send();
 }
 
 
 // Some value checks, create an overlay using these values and place it on the map.
-function addFilter(user, dataset, wlnode, enc, date, colour, lname){
+function addFilter(){
+
+  var user = '';
+  var dataset = '';
+  var wlnode = encodeURIComponent(document.getElementById("wlnode").value);
+  var enc ='';
+  var date = '';
+  var colour = encodeURIComponent(document.getElementById("colour").value);
+  var lname = encodeURIComponent(document.getElementById("lname").value);
 
   if (user != ''){user='&accespoint__id='+user;} 

src/django_gheat/website/static/style.css

@@ -57 +57 @@
 }
 
-#filters{
+#filter{
   width:100%-10px;
   display:none;
@@ -63 +63 @@
 }
 
-#filters_text{
+#filter_text{
   height:100%;
   width:570px;
@@ -70 +70 @@
 }
 
-#filters_list{
+#filter_list{
   padding:5px;
   width:200px;
@@ -76 +76 @@
   float:right;
   margin-bottom:5px;
+}
+
+#node_list{
+  position:absolute;
+  left:50%;
+  margin-left:-150px;
+  bottom:-2px;
+  width:300px;
+  background-color:#FFF;
+  border:2px solid #BA0000;
+  z-index:1;
+  padding:5px;
 }
         
@@ -84 +96 @@
 A:link{
   color:#FFF;
+  padding-left:8px;
 }