1.1 --- a/rectangle-overlay-params.html	Wed Apr 09 12:36:39 2014 +0200
     1.2 +++ b/rectangle-overlay-params.html	Wed Apr 09 13:41:29 2014 +0200
     1.3 @@ -39,7 +39,10 @@
     1.4         */
     1.5        function init() {
     1.6  	  
     1.7 +		//window.alert("Init called");
     1.8 +	  
     1.9  	  	var qs = GetQueryString();
    1.10 +		//qs = decodeURIComponent(qs);
    1.11  		
    1.12  		//Set map width if specified
    1.13  		if (!(typeof qs.width === "undefined"))	{
    1.14 @@ -61,13 +64,14 @@
    1.15  					<li>\'n\' for northernmost latitude.</li>\
    1.16  					<li>\'e\' for easternmost longitude.</li>\
    1.17  					<li>\'w\' for westernmost longitude.</li>\
    1.18 -					<li>\'c\' Specify a <a href="http://www.w3schools.com/cssref/css_colornames.asp">color name</a> for your rectangles.</li>\
    1.19 +					<li>\'c\' Specify a <a href="http://www.w3schools.com/cssref/css_colornames.asp">color name</a> or value (use %23FFFFFF for white) for your rectangles.</li>\
    1.20 +					<li>\'a\' Specify alpha opacity of your rectangle fill, it should be between 1 and 0. For instance 0.5 makes it half transparent.</li>\
    1.21  					<li>\'width\' Map width in pixels, default is 1200.</li>\
    1.22  					<li>\'height\' Map heigh in pixels, default is 800.</li>\
    1.23  					</ul>\
    1.24  					You can specify any number of rectangles.<br />\
    1.25  					Map will be centered on the first rectangle.<br />\
    1.26 -					Click <a href="rectangle-overlay-params.html?w=8.619000&n=50.134350&e=8.714110&s=50.091180&w=8.657227&n=50.119630&e=8.673706&s=50.108644&w=8.652547&n=50.109318&e=8.658400&s=50.105320&c=black&c=red&c=green">here</a> for an example.';
    1.27 +					Click <a href="rectangle-overlay-params.html?w=8.619000&n=50.134350&e=8.714110&s=50.091180&w=8.657227&n=50.119630&e=8.673706&s=50.108644&w=8.652547&n=50.109318&e=8.658400&s=50.105320&c=black&c=%23FF0000&c=green&a=0.3&a=0.75&c=0.5">here</a> for an example.';
    1.28  
    1.29  			//Still display the map
    1.30  			map = new google.maps.Map(document.getElementById('map'), {
    1.31 @@ -92,12 +96,19 @@
    1.32            'mapTypeId': google.maps.MapTypeId.ROADMAP
    1.33          });
    1.34  
    1.35 +		//window.alert(qs.s.length);
    1.36          
    1.37  		//Create all our rectangles
    1.38 -		rectangles = []; //Create rentangles array
    1.39 +		rectangles = []; //Create rectangles array
    1.40  		for (var i = 0; i < qs.s.length; i++) {
    1.41 -		rectangles.push(new google.maps.Rectangle({map: map,fillColor: (typeof qs.c === "undefined" || typeof qs.c[i] === "undefined"?'#666666':qs.c[i]) }));
    1.42 -		//window.alert(qs.c[i]);
    1.43 +		rectangles.push(new google.maps.Rectangle({	map: map,
    1.44 +													fillColor: (typeof qs.c === "undefined" || typeof qs.c[i] === "undefined"?'#666666':decodeURIComponent(qs.c[i])),
    1.45 +													fillOpacity: (typeof qs.a === "undefined" || typeof qs.a[i] === "undefined"?'0.2':decodeURIComponent(qs.a[i])),
    1.46 +													strokeColor: (typeof qs.c === "undefined" || typeof qs.c[i] === "undefined"?'#666666':decodeURIComponent(qs.c[i])),
    1.47 +													strokeOpacity: 1.0,
    1.48 +													strokeWeight: 1
    1.49 +													}));
    1.50 +		//window.alert(decodeURIComponent(qs.c[i]));
    1.51  		}
    1.52  		
    1.53          redraw();
    1.54 @@ -106,7 +117,7 @@
    1.55        /**
    1.56         * Updates the Rectangle's bounds to resize its dimensions.
    1.57         */
    1.58 -      function redraw() {
    1.59 +      function redraw() {	  
    1.60  	    var qs = GetQueryString();
    1.61  		for (var i = 0; i < qs.s.length; i++) {		
    1.62          var latLngBounds = new google.maps.LatLngBounds(
    1.63 @@ -125,14 +136,18 @@
    1.64  	  var query_string = {};
    1.65  	  var query = window.location.search.substring(1);
    1.66  	  var vars = query.split("&");
    1.67 -	  for (var i=0;i<vars.length;i++) {
    1.68 +	  //window.alert("URL param count: " + vars.length);
    1.69 +	  for (var i=0;i<vars.length;i++) {	  
    1.70  		var pair = vars[i].split("=");
    1.71  			// If first entry with this name
    1.72  		if ((typeof query_string[pair[0]] === "undefined") ) {
    1.73 -		  query_string[pair[0]] = pair[1];
    1.74 - 		  var arr = [ query_string[pair[0]], pair[1] ];
    1.75 +		  //Instantiate an array for that parameter
    1.76 + 		  var arr = [ pair[1] ];
    1.77  		  query_string[pair[0]] = arr;
    1.78 +		  //window.alert("Create param '" + pair[0] + "' with value: " + pair[1]);
    1.79  		} else {
    1.80 +		  //Add a value to our existing parameter array
    1.81 +		  //window.alert("Add param '" + pair[0] + "' with value: " + pair[1]);
    1.82  		  query_string[pair[0]].push(pair[1]);
    1.83  		}
    1.84  	  }