Index: src/django_gheat/wlheatmap/static/heatmap_extensions.js
===================================================================
--- src/django_gheat/wlheatmap/static/heatmap_extensions.js	(revision 9655)
+++ src/django_gheat/wlheatmap/static/heatmap_extensions.js	(revision 9779)
@@ -26,4 +26,5 @@
 }
 
+
 $(window).load(function() {
   var signallayer = '';
@@ -31,4 +32,8 @@
   var nodelist = new Array();
 
+  function update_raw_filter() {
+     $("#raw_filter").val(get_raw_filter());
+  }
+
   /**
    * Adds colourpicker for layer colour.
@@ -45,8 +50,12 @@
     onSelect: function(dateValue, inst){
       $("#end_date").datepicker("option", "minDate", dateValue);
+      update_raw_filter();
     }
   });
   $("#end_date").datepicker({
-    dateFormat: "dd/mm/yy"
+    dateFormat: "dd/mm/yy",
+    onSelect: function(dateValue, inst){
+      update_raw_filter();
+    }
   });
 
@@ -62,4 +71,5 @@
   function update_sig_slider(min,max) {
       $("#select_sig_value").text("Signal Strength: " + min + " - " + max);
+      update_raw_filter();
   };
 
@@ -240,10 +250,16 @@
   $("#select_user").change(function(){
     update_lname();
+    update_raw_filter();
   });
   $("#select_dataset").change(function(){
     update_lname();
+    update_raw_filter();
   });
   $("#select_node").change(function(){
     update_lname();
+    update_raw_filter();
+  });
+  $("#colour").change(function(){
+    update_raw_filter();
   });
 
@@ -316,12 +332,5 @@
   });
 
-  /**
-   * Adds a new layer when clicked.
-   * Filters set by user are used as layer parameters.
-   * Colour is either chosen or randomized.
-   * Blank parameters are ignored.
-   */
-  $('#add_filter').click(function(){
-    // get values from elements
+  function get_raw_filter() {
     user = $('#select_user option:selected').text();
     dataset = $('#select_dataset option:selected').text();
@@ -330,5 +339,4 @@
     end_date = $('#end_date').val();
     colour = $("#colour").val();
-    lname = $("#lname").val();
 
     /**
@@ -385,11 +393,26 @@
       colour = Math.floor(Math.random()*256)+','+Math.floor (Math.random()*256)+','+Math.floor(Math.random()*256);
     }
-    if (lname == ''){
-      lname= 'Custom Filter';
-    }
 
     var min = $("#select_sig_slider").slider("values")[0];
     var max = $("#select_sig_slider").slider("values")[1];
     signal = '&signaal__gte=' + min + '&signaal__lte=' + max;
+
+    var raw_filter = "colour=" + colour + user + dataset + wlnode + start_date + end_date + signal
+    return raw_filter;
+  }
+
+  /**
+   * Adds a new layer when clicked.
+   * Filters set by user are used as layer parameters.
+   * Colour is either chosen or randomized.
+   * Blank parameters are ignored.
+   */
+  $('#add_filter').click(function(){
+    // get values from elements
+
+    lname = $("#lname").val();
+    if (lname == ''){
+      lname= 'Custom Filter';
+    }
 
     // setting layer
@@ -397,5 +420,5 @@
       initialize: function(name, options) {
         var url = [
-          "tile/${z}/${x},${y}.png?colour=" + colour + user + dataset + wlnode + start_date + end_date + signal
+          "tile/${z}/${x},${y}.png?" + $("#raw_filter").val(),
         ];
         options = OpenLayers.Util.extend({ numZoomLevels: 21 }, options);
Index: src/django_gheat/wlheatmap/static/style.css
===================================================================
--- src/django_gheat/wlheatmap/static/style.css	(revision 9655)
+++ src/django_gheat/wlheatmap/static/style.css	(revision 9779)
@@ -75,5 +75,5 @@
 #filter_text{
   height:100%;
-  width:570px;
+  width:200px;
   overflow:hidden;
   float:left;
@@ -82,5 +82,4 @@
 #filter_list{
   padding:5px;
-  width:200px;
   border-left: 1px solid #BA0000;
   float:right;