| 1 | /**
|
|---|
| 2 | * Uses zoomleven and mouseposition to call nodelist.py view.
|
|---|
| 3 | * View returns nodes in json format, values are printed in doc element.
|
|---|
| 4 | */
|
|---|
| 5 | function getNodeList(zoomlevel, mousepos){
|
|---|
| 6 | $.getJSON("nodelist/" + zoomlevel + "," + mousepos.lat + "," + mousepos.lon,
|
|---|
| 7 | function(json){
|
|---|
| 8 | content = 'Wireless Leiden nodes on mouseposition:<br /><b>';
|
|---|
| 9 | $.each(json, function(i,json){
|
|---|
| 10 | content += json.fields.ssid + '<br />';
|
|---|
| 11 | });
|
|---|
| 12 | content += '</b>';
|
|---|
| 13 | $("#node_list").html(content);
|
|---|
| 14 | }
|
|---|
| 15 | );
|
|---|
| 16 | }
|
|---|
| 17 |
|
|---|
| 18 | /**
|
|---|
| 19 | * Right way to get url parameters?
|
|---|
| 20 | * http://stackoverflow.com/questions/1403888/get-url-parameter-with-jquery/1404100#1404100
|
|---|
| 21 | */
|
|---|
| 22 | function getURLParameter(name) {
|
|---|
| 23 | return decodeURI(
|
|---|
| 24 | (RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
|
|---|
| 25 | );
|
|---|
| 26 | }
|
|---|
| 27 |
|
|---|
| 28 |
|
|---|
| 29 | $(window).load(function() {
|
|---|
| 30 | var signallayer = '';
|
|---|
| 31 | var userlist = new Array();
|
|---|
| 32 | var nodelist = new Array();
|
|---|
| 33 |
|
|---|
| 34 | function update_raw_filter() {
|
|---|
| 35 | $("#raw_filter").val(get_raw_filter());
|
|---|
| 36 | }
|
|---|
| 37 |
|
|---|
| 38 | /**
|
|---|
| 39 | * Adds colourpicker for layer colour.
|
|---|
| 40 | * Function set in: 'colourpicker.js'
|
|---|
| 41 | */
|
|---|
| 42 | $("#colour").colorPicker();
|
|---|
| 43 |
|
|---|
| 44 | /**
|
|---|
| 45 | * Adds datepicker for start & end date
|
|---|
| 46 | * Function set in: 'jquery-ui-1.8.13.custom.min.js'
|
|---|
| 47 | */
|
|---|
| 48 | $("#start_date").datepicker({
|
|---|
| 49 | dateFormat: "dd/mm/yy",
|
|---|
| 50 | onSelect: function(dateValue, inst){
|
|---|
| 51 | $("#end_date").datepicker("option", "minDate", dateValue);
|
|---|
| 52 | update_raw_filter();
|
|---|
| 53 | }
|
|---|
| 54 | });
|
|---|
| 55 | $("#end_date").datepicker({
|
|---|
| 56 | dateFormat: "dd/mm/yy",
|
|---|
| 57 | onSelect: function(dateValue, inst){
|
|---|
| 58 | update_raw_filter();
|
|---|
| 59 | }
|
|---|
| 60 | });
|
|---|
| 61 |
|
|---|
| 62 | /**
|
|---|
| 63 | * Adds slider for signal strength layer.
|
|---|
| 64 | * Function set in: 'jquery-ui-1.8.13.custom.min.js'
|
|---|
| 65 | */
|
|---|
| 66 | function update_slider(min,max) {
|
|---|
| 67 | $("#sig_value").text("All AccessPoints Signal Strength: " + min + " - " + max);
|
|---|
| 68 | $("#signallayer font").text("All AccessPoints Signal: " + min + " - " + max);
|
|---|
| 69 | };
|
|---|
| 70 |
|
|---|
| 71 | function update_sig_slider(min,max) {
|
|---|
| 72 | $("#select_sig_value").text("Signal Strength: " + min + " - " + max);
|
|---|
| 73 | update_raw_filter();
|
|---|
| 74 | };
|
|---|
| 75 |
|
|---|
| 76 | $("#slider").slider({
|
|---|
| 77 | range: true,
|
|---|
| 78 | min: 0,
|
|---|
| 79 | max: 100,
|
|---|
| 80 | values: [0, 100],
|
|---|
| 81 | // while sliding, it changes the text above the slider to show the values realtime
|
|---|
| 82 | slide: function(event, sig){
|
|---|
| 83 | update_slider(sig.values[0], sig.values[1]);
|
|---|
| 84 | },
|
|---|
| 85 | // on slider stop, it sets a new URL with updated values and redraws the layer
|
|---|
| 86 | stop: function(event, sig){
|
|---|
| 87 | signallayer = map.getLayersByName('signallayer');
|
|---|
| 88 | signallayer[0].setUrl("tile/${z}/${x},${y}.png?colour=90,90,90&signaal__gte=" + sig.values[0] + "&signaal__lte=" + sig.values[1]);
|
|---|
| 89 | signallayer[0].redraw();
|
|---|
| 90 | }
|
|---|
| 91 | });
|
|---|
| 92 | $("#select_sig_slider").slider({
|
|---|
| 93 | range: true,
|
|---|
| 94 | min: 0,
|
|---|
| 95 | max: 100,
|
|---|
| 96 | values: [0,100],
|
|---|
| 97 | // while sliding, it changes the text above the slider to show the values realtime
|
|---|
| 98 | slide: function(event, sig){
|
|---|
| 99 | update_sig_slider(sig.values[0], sig.values[1]);
|
|---|
| 100 | }
|
|---|
| 101 | });
|
|---|
| 102 |
|
|---|
| 103 |
|
|---|
| 104 | function init_slider(min, max) {
|
|---|
| 105 | $("#slider").slider( "option", "values", [min,max] );
|
|---|
| 106 | signallayer = map.getLayersByName('signallayer');
|
|---|
| 107 | signallayer[0].setUrl("tile/${z}/${x},${y}.png?colour=90,90,90&signaal__gte=" + min + "&signaal__lte=" + max);
|
|---|
| 108 | signallayer[0].redraw();
|
|---|
| 109 | update_slider(min,max);
|
|---|
| 110 | };
|
|---|
| 111 |
|
|---|
| 112 | function init_select_slider(min, max) {
|
|---|
| 113 | $("#select_sig_slider").slider( "option", "values", [min,max] );
|
|---|
| 114 | update_sig_slider(min,max);
|
|---|
| 115 | };
|
|---|
| 116 |
|
|---|
| 117 |
|
|---|
| 118 |
|
|---|
| 119 | /**
|
|---|
| 120 | * Toggles layer visibility on checkbox use from layerswitcher.
|
|---|
| 121 | */
|
|---|
| 122 | $("#togglelayer").live('click', function(){
|
|---|
| 123 | layername = $(this).parents('span').attr('id');
|
|---|
| 124 | layer = map.getLayersByName(layername);
|
|---|
| 125 | if(this.checked){
|
|---|
| 126 | layer[0].setVisibility(true);
|
|---|
| 127 | }
|
|---|
| 128 | else{
|
|---|
| 129 | layer[0].setVisibility(false);
|
|---|
| 130 | }
|
|---|
| 131 | });
|
|---|
| 132 |
|
|---|
| 133 | /**
|
|---|
| 134 | * Toggles layer visibility per category on checkbox use from layerswitcher.
|
|---|
| 135 | */
|
|---|
| 136 | $("#togglecat").live("click", function(){
|
|---|
| 137 | layertype = $(this).attr('class');
|
|---|
| 138 | layers = new Array();
|
|---|
| 139 | layers = $('#' + layertype).children('span');
|
|---|
| 140 | if(this.checked){
|
|---|
| 141 | $.each(layers, function(l, layer){
|
|---|
| 142 | layer = map.getLayersByName(layer.id);
|
|---|
| 143 | layer[0].setVisibility(true);
|
|---|
| 144 | $(this).children('input').attr('checked', true);
|
|---|
| 145 | });
|
|---|
| 146 | }
|
|---|
| 147 | else{
|
|---|
| 148 | $.each(layers, function(l, layer){
|
|---|
| 149 | layer = map.getLayersByName(layer.id);
|
|---|
| 150 | layer[0].setVisibility(false);
|
|---|
| 151 | $(this).children('input').attr('checked', false);
|
|---|
| 152 | });
|
|---|
| 153 | }
|
|---|
| 154 | });
|
|---|
| 155 |
|
|---|
| 156 | /**
|
|---|
| 157 | * Removes layer from map and layerswitcher.
|
|---|
| 158 | */
|
|---|
| 159 | $("#rmvlayer").live("click", function(){
|
|---|
| 160 | layername = $(this).closest('span').attr('id');
|
|---|
| 161 | layer = map.getLayersByName(layername);
|
|---|
| 162 | map.removeLayer(layer[0]);
|
|---|
| 163 | $(this).closest('span').remove();
|
|---|
| 164 | });
|
|---|
| 165 |
|
|---|
| 166 | /**
|
|---|
| 167 | * Toggles text shown on website.
|
|---|
| 168 | * 'info' shows info text.
|
|---|
| 169 | * 'filter' page shows text on filters & filter options.
|
|---|
| 170 | */
|
|---|
| 171 | $("#menu_filter").click(function(){
|
|---|
| 172 | $("#filter").slideToggle("fast");
|
|---|
| 173 | $("#info").slideUp("fast");
|
|---|
| 174 | });
|
|---|
| 175 | $("#menu_info").click(function(){
|
|---|
| 176 | $("#filter").slideUp("fast");
|
|---|
| 177 | $("#info").slideToggle("fast");
|
|---|
| 178 | });
|
|---|
| 179 | $("#hide_parent").live("click",function(){
|
|---|
| 180 | parent = $(this).parent("div");
|
|---|
| 181 | $(parent).slideUp("fast");
|
|---|
| 182 | });
|
|---|
| 183 |
|
|---|
| 184 |
|
|---|
| 185 |
|
|---|
| 186 | /**
|
|---|
| 187 | * Toggles layerswitcher visibility.
|
|---|
| 188 | * On 'off', toggler shows a '+'.
|
|---|
| 189 | * On 'on', toggler shows a '-'.
|
|---|
| 190 | */
|
|---|
| 191 | $("#layer_switcher_toggle").click(function(){
|
|---|
| 192 | $("#layer_switcher").toggle();
|
|---|
| 193 | if($(this).text() == '+'){
|
|---|
| 194 | $(this).html('-');
|
|---|
| 195 | }
|
|---|
| 196 | else{
|
|---|
| 197 | $(this).html('+');
|
|---|
| 198 | }
|
|---|
| 199 | });
|
|---|
| 200 |
|
|---|
| 201 | /**
|
|---|
| 202 | * Toggles category visibility.
|
|---|
| 203 | * On 'visible', toggler shows a '^'.
|
|---|
| 204 | * On 'invisible', toggler shows a 'v'.
|
|---|
| 205 | */
|
|---|
| 206 | $("#cat_hide").live("click", function(){
|
|---|
| 207 | cat = $(this).parent('div').next('p').children('span')
|
|---|
| 208 | cat.toggle();
|
|---|
| 209 | if(cat.is(":visible")){
|
|---|
| 210 | //FIXME: images are getting loaded the hard way. Replace '/static/'. '{{ STATIC_URL }}' doesn't seem to work here.
|
|---|
| 211 | $(this).css('background-image', "url(/static/img/up.png)");
|
|---|
| 212 | }
|
|---|
| 213 | else{
|
|---|
| 214 | $(this).css('background-image', "url(/static/img/down.png)");
|
|---|
| 215 | }
|
|---|
| 216 | });
|
|---|
| 217 |
|
|---|
| 218 | /**
|
|---|
| 219 | * Fastest?
|
|---|
| 220 | * http://stackoverflow.com/questions/170986/what-is-the-best-way-to-add-options-to-a-select-from-an-array-with-jquery
|
|---|
| 221 | */
|
|---|
| 222 | $.getJSON("filters/",
|
|---|
| 223 | function(json) {
|
|---|
| 224 | $.each(json, function(i,json){
|
|---|
| 225 | $("#select_user").append($("<option/>").attr("value",json.gebruiker).text(json.gebruiker));
|
|---|
| 226 | userlist.push(json.gebruiker);
|
|---|
| 227 | $.each(json.meetrondje, function(m, meetrondje){
|
|---|
| 228 | $("#select_dataset").append($("<option/>").attr({"class":json.gebruiker, "value": meetrondje.naam}).text(meetrondje.naam));
|
|---|
| 229 | $.each(meetrondje.nodes, function(n, nodes){
|
|---|
| 230 | $("#select_node").append($("<option/>").attr({"class":json.gebruiker + "\\" + meetrondje.naam, "value":nodes}).text(nodes));
|
|---|
| 231 | if(jQuery.inArray(nodes, nodelist)<0){
|
|---|
| 232 | nodelist.push(nodes);
|
|---|
| 233 | }
|
|---|
| 234 | });
|
|---|
| 235 | });
|
|---|
| 236 | });
|
|---|
| 237 | // Initiate the chain
|
|---|
| 238 | $("#select_dataset").chained("#select_user");
|
|---|
| 239 | $("#select_node").chained("#select_user, #select_dataset");
|
|---|
| 240 | }
|
|---|
| 241 | );
|
|---|
| 242 |
|
|---|
| 243 | /**
|
|---|
| 244 | * Earlier process got all users in JSON and put them in array.
|
|---|
| 245 | * For each user in array, new layer is added with username as parameter.
|
|---|
| 246 | * Layercolour is randomized.
|
|---|
| 247 | * If button is pressed again, layers will be deleted.
|
|---|
| 248 | */
|
|---|
| 249 | function update_lname() {
|
|---|
| 250 | $("#lname").val($("#select_user option:selected").text() + " - " + $("#select_dataset option:selected").text() + " - " + $("#select_node option:selected").text());
|
|---|
| 251 | }
|
|---|
| 252 | $("#select_user").change(function(){
|
|---|
| 253 | update_lname();
|
|---|
| 254 | update_raw_filter();
|
|---|
| 255 | });
|
|---|
| 256 | $("#select_dataset").change(function(){
|
|---|
| 257 | update_lname();
|
|---|
| 258 | update_raw_filter();
|
|---|
| 259 | });
|
|---|
| 260 | $("#select_node").change(function(){
|
|---|
| 261 | update_lname();
|
|---|
| 262 | update_raw_filter();
|
|---|
| 263 | });
|
|---|
| 264 | $("#select_nodetype").change(function(){
|
|---|
| 265 | update_raw_filter();
|
|---|
| 266 | });
|
|---|
| 267 | $("#colour").change(function(){
|
|---|
| 268 | update_raw_filter();
|
|---|
| 269 | });
|
|---|
| 270 |
|
|---|
| 271 | $('#user_filter').click(function(){
|
|---|
| 272 | if(this.text=='(Add all users)'){
|
|---|
| 273 | $.each(userlist, function(u, user){
|
|---|
| 274 | colour = Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256);
|
|---|
| 275 | OpenLayers.Layer.OSM.Overlay = OpenLayers.Class(OpenLayers.Layer.OSM, {
|
|---|
| 276 | initialize: function(name, options) {
|
|---|
| 277 | var url = [
|
|---|
| 278 | "tile/${z}/${x},${y}.png?&colour=" + colour + "&meetrondje__gebruiker__naam=" + user
|
|---|
| 279 | ];
|
|---|
| 280 | options = OpenLayers.Util.extend({ numZoomLevels: 21 }, options);
|
|---|
| 281 | var newArguments = [name, url, options];
|
|---|
| 282 | OpenLayers.Layer.OSM.prototype.initialize.apply(this, newArguments);
|
|---|
| 283 | },
|
|---|
| 284 | CLASS_NAME: "OpenLayers.Layer.Overlay"
|
|---|
| 285 | });
|
|---|
| 286 | filterlayer = new OpenLayers.Layer.OSM.Overlay(user, {isBaseLayer: false, visibility: true});
|
|---|
| 287 | map.addLayer(filterlayer);
|
|---|
| 288 | $("#user").append("<span id=\"" + user + "\"><div id='layer_switcher_colour' style='background-color:rgb(" + colour + ")' /><input type=checkbox id=togglelayer checked /><font>" + user + " </font><a id=rmvlayer>X</a><br /></span>");
|
|---|
| 289 | });
|
|---|
| 290 | $(this).text('(Del all users');
|
|---|
| 291 | }
|
|---|
| 292 | else{
|
|---|
| 293 | $(this).text('(Add all users)');
|
|---|
| 294 | $.each($('#user span'), function(s, span){
|
|---|
| 295 | layer = map.getLayersByName(span.id);
|
|---|
| 296 | map.removeLayer(layer[0]);
|
|---|
| 297 | $(span).remove();
|
|---|
| 298 | });
|
|---|
| 299 | }
|
|---|
| 300 | });
|
|---|
| 301 |
|
|---|
| 302 | /**
|
|---|
| 303 | * Earlier process got all nodes in JSON and put them in array.
|
|---|
| 304 | * For each node in array, new layer is added with node as parameter.
|
|---|
| 305 | * Layercolour is randomized.
|
|---|
| 306 | * If button is pressed again, layers will be deleted.
|
|---|
| 307 | */
|
|---|
| 308 | $('#node_filter').click(function(){
|
|---|
| 309 | if(this.text=='(Add all nodes)'){
|
|---|
| 310 | $.each(nodelist, function(n, node){
|
|---|
| 311 | colour = Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256)+','+Math.floor(Math.random()*256);
|
|---|
| 312 | OpenLayers.Layer.OSM.Overlay = OpenLayers.Class(OpenLayers.Layer.OSM, {
|
|---|
| 313 | initialize: function(name, options) {
|
|---|
| 314 | var url = [
|
|---|
| 315 | "tile/${z}/${x},${y}.png?&colour=" + colour + "&accesspoint__ssid=" + node
|
|---|
| 316 | ];
|
|---|
| 317 | options = OpenLayers.Util.extend({ numZoomLevels: 21 }, options);
|
|---|
| 318 | var newArguments = [name, url, options];
|
|---|
| 319 | OpenLayers.Layer.OSM.prototype.initialize.apply(this, newArguments);
|
|---|
| 320 | },
|
|---|
| 321 | CLASS_NAME: "OpenLayers.Layer.Overlay"
|
|---|
| 322 | });
|
|---|
| 323 | nodefilterlayer = new OpenLayers.Layer.OSM.Overlay(node, {isBaseLayer: false, visibility: true});
|
|---|
| 324 | map.addLayer(nodefilterlayer);
|
|---|
| 325 | $("#node").append("<span class='node' id=\"" + node + "\"><div id='layer_switcher_colour' style='background-color:rgb(" + colour + ")' /><input type=checkbox id=togglelayer checked /><font>" + node + " </font><a id=rmvlayer>X</a><br /></span>");
|
|---|
| 326 | });
|
|---|
| 327 | $(this).text('(Del all nodes)');
|
|---|
| 328 | }
|
|---|
| 329 | else{
|
|---|
| 330 | $(this).text('(Add all nodes)');
|
|---|
| 331 | $.each($('#node span'), function(s, span){
|
|---|
| 332 | layer = map.getLayersByName(span.id);
|
|---|
| 333 | map.removeLayer(layer[0]);
|
|---|
| 334 | $(span).remove();
|
|---|
| 335 | });
|
|---|
| 336 | }
|
|---|
| 337 | });
|
|---|
| 338 |
|
|---|
| 339 | function get_raw_filter() {
|
|---|
| 340 | var query_array = [];
|
|---|
| 341 |
|
|---|
| 342 | /* Values to be used to create the filter */
|
|---|
| 343 | user = $('#select_user option:selected').val();
|
|---|
| 344 | dataset = $('#select_dataset option:selected').val();
|
|---|
| 345 | wlnode = $('#select_node option:selected').val();
|
|---|
| 346 | nodetype = $('#select_nodetype option:selected').val();
|
|---|
| 347 | start_date = $('#start_date').val();
|
|---|
| 348 | end_date = $('#end_date').val();
|
|---|
| 349 | colour = $("#colour").val();
|
|---|
| 350 |
|
|---|
| 351 | // some checks if values are correct, and adding them to parts of the link
|
|---|
| 352 | if (user != 'all') {
|
|---|
| 353 | query_array.push('meetrondje__gebruiker__naam=' + user);
|
|---|
| 354 | }
|
|---|
| 355 | if (dataset != 'all') {
|
|---|
| 356 | query_array.push('meetrondje__naam=' + dataset);
|
|---|
| 357 | }
|
|---|
| 358 | if (wlnode != 'all') {
|
|---|
| 359 | query_array.push('accesspoint__ssid=' + wlnode);
|
|---|
| 360 | }
|
|---|
| 361 | if (nodetype) {
|
|---|
| 362 | query_array.push(nodetype);
|
|---|
| 363 | }
|
|---|
| 364 |
|
|---|
| 365 | if (start_date){
|
|---|
| 366 | sd_d=start_date.substr(0,2);
|
|---|
| 367 | sd_m=start_date.substr(3,2);
|
|---|
| 368 | sd_y=start_date.substr(6,4);
|
|---|
| 369 | query_array.push('meetrondje__datum__gte=' + sd_y +'-'+ sd_m +'-'+ sd_d);
|
|---|
| 370 | }
|
|---|
| 371 | if (end_date){
|
|---|
| 372 | ed_d=end_date.substr(0,2);
|
|---|
| 373 | ed_m=end_date.substr(3,2);
|
|---|
| 374 | ed_y=end_date.substr(6,4);
|
|---|
| 375 | query_array.push('meetrondje__datum__lte=' + ed_y +'-'+ ed_m +'-'+ ed_d);
|
|---|
| 376 | }
|
|---|
| 377 |
|
|---|
| 378 | var min = $("#select_sig_slider").slider("values")[0];
|
|---|
| 379 | var max = $("#select_sig_slider").slider("values")[1];
|
|---|
| 380 | query_array.push('signaal__gte=' + min);
|
|---|
| 381 | query_array.push('signaal__lte=' + max);
|
|---|
| 382 |
|
|---|
| 383 | /**
|
|---|
| 384 | * On HEX to RGB:
|
|---|
| 385 | * http://stackoverflow.com/questions/5798868/need-some-tips-with-how-to-convert-a-hexadecimal-color-value-to-a-rgb-one/5798900#5798900
|
|---|
| 386 | * If no colour is defined, use a random colour
|
|---|
| 387 | */
|
|---|
| 388 | if (colour){
|
|---|
| 389 | colour = [parseInt((colour.substr(1, 2)),16), parseInt((colour.substr(3, 2)),16), parseInt((colour.substr(5, 2)),16)];
|
|---|
| 390 | } else {
|
|---|
| 391 | colour = [Math.floor(Math.random()*256), Math.floor (Math.random()*256), Math.floor(Math.random()*256)];
|
|---|
| 392 | }
|
|---|
| 393 | query_array.push('colour=' + colour.join(','));
|
|---|
| 394 |
|
|---|
| 395 | /* Return final result */
|
|---|
| 396 | var raw_filter = query_array.filter(function() {return true;}).sort().join('&');
|
|---|
| 397 | return raw_filter;
|
|---|
| 398 | }
|
|---|
| 399 |
|
|---|
| 400 | /**
|
|---|
| 401 | * Adds a new layer when clicked.
|
|---|
| 402 | * Filters set by user are used as layer parameters.
|
|---|
| 403 | * Colour is either chosen or randomized.
|
|---|
| 404 | * Blank parameters are ignored.
|
|---|
| 405 | */
|
|---|
| 406 | function add_filter(lname, filter, colour) {
|
|---|
| 407 | // setting layer
|
|---|
| 408 | OpenLayers.Layer.OSM.Overlay = OpenLayers.Class(OpenLayers.Layer.OSM, {
|
|---|
| 409 | initialize: function(name, options) {
|
|---|
| 410 | var url = [
|
|---|
| 411 | "tile/${z}/${x},${y}.png?" + filter,
|
|---|
| 412 | ];
|
|---|
| 413 | options = OpenLayers.Util.extend({ numZoomLevels: 21 }, options);
|
|---|
| 414 | var newArguments = [name, url, options];
|
|---|
| 415 | OpenLayers.Layer.OSM.prototype.initialize.apply(this, newArguments);
|
|---|
| 416 | },
|
|---|
| 417 | colour: colour,
|
|---|
| 418 | CLASS_NAME: "OpenLayers.Layer.Overlay"
|
|---|
| 419 | });
|
|---|
| 420 |
|
|---|
| 421 | // adding layer
|
|---|
| 422 | filterlayer = new OpenLayers.Layer.OSM.Overlay(lname, {isBaseLayer: false, visibility: true});
|
|---|
| 423 | map.addLayer(filterlayer);
|
|---|
| 424 |
|
|---|
| 425 | $("#custom").append("<span id=\"" + lname + "\"><div id='layer_switcher_colour' style='background-color:rgb(" + colour + ")' /><input type=checkbox id=togglelayer checked /><font>" + lname + " </font><a id=rmvlayer>X</a><br /></span>");
|
|---|
| 426 | }
|
|---|
| 427 |
|
|---|
| 428 | $('#add_filter').click(function(){
|
|---|
| 429 | lname = $("#lname").val();
|
|---|
| 430 | if (lname == ''){
|
|---|
| 431 | lname= 'Custom Filter';
|
|---|
| 432 | }
|
|---|
| 433 | add_filter(lname, $("#raw_filter").val(), colour);
|
|---|
| 434 |
|
|---|
| 435 | });
|
|---|
| 436 |
|
|---|
| 437 | // Parse the parameters
|
|---|
| 438 | var items = window.location.search.slice(1).split('&');
|
|---|
| 439 | var params = new Object;
|
|---|
| 440 | for (var i=0; i < items.length; i++) {
|
|---|
| 441 | var kv = items[i].split('=');
|
|---|
| 442 | params[kv[0]] = decodeURIComponent(kv[1]);
|
|---|
| 443 | }
|
|---|
| 444 |
|
|---|
| 445 | init_heatmap();
|
|---|
| 446 | init_slider(35,75,0,100);
|
|---|
| 447 | init_select_slider(0,100);
|
|---|
| 448 |
|
|---|
| 449 |
|
|---|
| 450 | // Initiate the custom filters
|
|---|
| 451 | if (params['layercount']) {
|
|---|
| 452 | for (var i=1; i <= params['layercount']; i++) {
|
|---|
| 453 | add_filter(params['layername' + i], params['layerfilter' + i], params['layercolour' + i]);
|
|---|
| 454 | }
|
|---|
| 455 | }
|
|---|
| 456 | var pl = map.getControlsByClass('OpenLayers.Control.Permalink');
|
|---|
| 457 | pl.updateLink;
|
|---|
| 458 | });
|
|---|
