Thread: [wnmap-commits] SF.net SVN: wnmap: [43] branches/gmap2-port/web

SourceForge Headquarters 225 Broadway Suite 1600 San Diego, CA 92101 +1 (858) 422-6466

Revision: 43
Author:   cphillip
Date:     2006-04-30 18:09:56 -0700 (Sun, 30 Apr 2006)
ViewCVS:  http://svn.sourceforge.net/wnmap/?rev=43&view=rev

Log Message:
-----------
Initial work to port WNMap to GMap2.

* web/index.php
  Ask Google to return version 2 of their Maps API.

* web/js/NodeMarker.js
  (NodeMarker): - This instance of GPoint is now a GLatLng.

                - Previously, GPoint's members could be accessed directly.  Now
                  those values must be retrieved in GLatLng via accessor
                  methods such as .lat() and .lng().

                - GMap.centerAndZoom() has been replaced by GMap2.setCenter().

                - The .prototype technique alone wasn't properly creating a
                  subclass of GMarker.  Add a helper function that does a
                  better job.

* web/js/nodemap.js
  (createMap): - Maps v2 provides a GMap object, but we'll port to the newer
                 GMap2, instead.

               - map.centerAndZoom() has been replaced with map.setCenter().

               - map.setMapType() and map.getMapTypes() have changed.  Hack
                 around that for now.

               - Turn off the keyboard handler for now.  Things break with it
                 on (likely due to a lurking problem).

               - Previously, GPoint's members could be accessed directly.  Now
                 those values must be retrieved in GLatLng via accessor
                 methods such as .lat() and .lng().

               - The subclass of GMarker into NodeMarker isn't complete, so
                 avoid calling our methods on the new object.

               - Debugging alert()s left in for on-going effort.

Modified Paths:
--------------
    branches/gmap2-port/web/index.php
    branches/gmap2-port/web/js/NodeMarker.js
    branches/gmap2-port/web/js/nodemap.js
Modified: branches/gmap2-port/web/index.php
===================================================================

--- branches/gmap2-port/web/index.php	2006-05-01 00:36:16 UTC (rev 42)
+++ branches/gmap2-port/web/index.php	2006-05-01 01:09:56 UTC (rev 43)
@@ -26,7 +26,7 @@
 	<head>
 		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
 
-		<script src="http://maps.google.com/maps?file=api&v=1&key=<?=GOOGLE_MAP_KEY?>" type="text/javascript"></script>
+		<script src="http://maps.google.com/maps?file=api&v=2&key=<?=GOOGLE_MAP_KEY?>" type="text/javascript"></script>
 		<script src="js.php?file=nodemap" type="text/javascript"></script>
 		<script src="js.php?file=gui" type="text/javascript"></script>
 		<script src="js.php?file=geocode" type="text/javascript"></script>

Modified: branches/gmap2-port/web/js/NodeMarker.js
===================================================================
--- branches/gmap2-port/web/js/NodeMarker.js	2006-05-01 00:36:16 UTC (rev 42)
+++ branches/gmap2-port/web/js/NodeMarker.js	2006-05-01 01:09:56 UTC (rev 43)
@@ -10,7 +10,7 @@
 	this.visible = true;
 	this.streetAddress = "n/a";
 	
-	var point = new GPoint (lng, lat);
+	var point = new GLatLng (lat, lng);
 
 	switch (state.toLowerCase()) {
 		case 'active':
@@ -71,7 +71,7 @@
 
 			var pos = document.createElement ("div");
 			pos.className = "position";
-			pos.innerHTML = "<b>Latitude:</b> " + Math.round(this.point.y*1000000)/1000000 + "<br/><b>Longitude:</b> " + Math.round(this.point.x*1000000)/1000000;
+			pos.innerHTML = "<b>Latitude:</b> " + Math.round(this.point.lat()*1000000)/1000000 + "<br/><b>Longitude:</b> " + Math.round(this.point.lng()*1000000)/1000000;
 			thing.appendChild (pos);
 
 			var address = document.createElement ("div");
@@ -81,7 +81,7 @@
 
 			var distance = document.createElement ("div");
 			distance.className = "position";
-			distance.innerHTML = "<b>Distance to center:</b> " + distanceToCenterPretty(this.point.y, this.point.x);
+			distance.innerHTML = "<b>Distance to center:</b> " + distanceToCenterPretty(this.point.lat(), this.point.lng());
 			//thing.appendChild (distance);
 
 			var actionList = document.createElement ("ul");
@@ -91,7 +91,7 @@
 			var addActionLink = document.createElement ("a");
 			addActionLink.innerHTML = "Add this to our database as a location for a potential node.<br/>";
 
-			url = WNMAP_MAP_URL + "/AddPotentialNode.php?lon=" + this.point.x + "&lat=" + this.point.y + "&name=" + URLEncode (this.name) + "&addr='" + encode64 (this.streetAddress) + "'";
+			url = WNMAP_MAP_URL + "/AddPotentialNode.php?lon=" + this.point.lng() + "&lat=" + this.point.lat() + "&name=" + URLEncode (this.name) + "&addr='" + encode64 (this.streetAddress) + "'";
 			addActionLink.href = "javascript:window.open (url, null,'menubar=no,scrollbars=yes,addressbar=no,locationbar=no,status=no,height=530,width=440'); void(0);";
 			
 			addActionItem.appendChild (addActionLink);
@@ -180,7 +180,7 @@
 
 			var pos = document.createElement ("div");
 			pos.className = "position";
-			pos.innerHTML = "<b>Latitude:</b> " + Math.round(this.point.y*1000000)/1000000 + "<br/><b>Longitude:</b> " + Math.round(this.point.x*1000000)/1000000;
+			pos.innerHTML = "<b>Latitude:</b> " + Math.round(this.point.lat()*1000000)/1000000 + "<br/><b>Longitude:</b> " + Math.round(this.point.lng()*1000000)/1000000;
 			thing.appendChild (pos);
 
 			var address = document.createElement ("div");
@@ -190,7 +190,7 @@
 
 			var distance = document.createElement ("div");
 			distance.className = "position";
-			distance.innerHTML = "<b>Distance to center:</b> " + distanceToCenterPretty(this.point.y, this.point.x);
+			distance.innerHTML = "<b>Distance to center:</b> " + distanceToCenterPretty(this.point.lat(), this.point.lng());
 			//thing.appendChild (distance);
 
 			var f = document.createElement ("div");
@@ -209,7 +209,7 @@
 
 	this.zoomTo = function () {
 		this.destroyTooltip ();
-		map.centerAndZoom (this.point, 0);
+		map.setCenter (this.point, 17);
 	}
 
 	this.showTooltip = function () {
@@ -228,7 +228,7 @@
 	            	tooltip.style.filter = "alpha(opacity=" + opacity + ")";
 	                tooltip.style.opacity = opacity;
 
-			var b = map.spec.getBitmapCoordinate (this.point.y, this.point.x, map.getZoomLevel());
+			var b = map.spec.getBitmapCoordinate (this.point.lat(), this.point.lng(), map.getZoom());
 		        var c = map.getDivCoordinate (b.x, b.y);
 			tooltip.style.left = c.x + (this.icon.iconAnchor.x + 5) + "px";
 			tooltip.style.top = c.y - (this.icon.iconAnchor.y) + "px";
@@ -261,4 +261,14 @@
 
 }
 
-NodeMarker.prototype = new GMarker;
+extend = function(subClass, baseClass) {
+   function inheritance() {}
+   inheritance.prototype = baseClass.prototype;
+
+   subClass.prototype = new inheritance();
+   subClass.prototype.constructor = subClass;
+   subClass.baseConstructor = baseClass;
+   subClass.superClass = baseClass.prototype;
+}
+
+extend(NodeMarker, GMarker);

Modified: branches/gmap2-port/web/js/nodemap.js
===================================================================
--- branches/gmap2-port/web/js/nodemap.js	2006-05-01 00:36:16 UTC (rev 42)
+++ branches/gmap2-port/web/js/nodemap.js	2006-05-01 01:09:56 UTC (rev 43)
@@ -17,20 +17,22 @@
 
 function createMap ()
 {
-	map = new GMap(document.getElementById("mapColumn"));
+	map = new GMap2(document.getElementById("mapColumn"));
 	map.addControl(new GLargeMapControl());
 	map.addControl (new GMapTypeControl());
-	map.centerAndZoom(new GPoint(WNMAP_MAP_START_LON, WNMAP_MAP_START_LAT), parseInt(WNMAP_MAP_START_ZOOM));
+	// FIXME
+	// map.centerAndZoom(new GPoint(WNMAP_MAP_START_LON, WNMAP_MAP_START_LAT), parseInt(WNMAP_MAP_START_ZOOM));
+	map.setMapType (G_NORMAL_MAP);
 	map.addControl(new GScaleControl());
-	map.registerKeyHandlers (window);
+	// GKeyboardHandler(map); // with this on, "this.lg is not a function"
 
-	// Set default map type to WNMAP_MAP_START_TYPE
-	var mapTypes = map.getMapTypes();
-	map.setMapType(mapTypes[WNMAP_MAP_START_TYPE]);
+	// // Set default map type to WNMAP_MAP_START_TYPE
+	// var mapTypes = map.getMapTypes();
+	// map.setMapType(mapTypes[WNMAP_MAP_START_TYPE]);
 
 	GEvent.addListener (map, 'click', function (overlay, point) {
 		if (!overlay) {
-			addMarker (point.y, point.x, '');
+			addMarker (point.lat(), point.lng(), '');
 		}
 	});
 
@@ -56,7 +58,9 @@
 				var lat = parseFloat(markersFromXml[i].getAttribute("lat"));
 
 				var node = new NodeMarker (name, desc, state, lng, lat);
-				node.setStreetAddress (addr);
+				//var node = new GMarker (new GLatLng(lat, lng));
+				//node.setStreetAddress (addr);
+				//node.name = name;
 
 				markers[node.name] = node;
 			}
@@ -92,7 +96,7 @@
 
 							var bad = false;
 							for (key in markers) {
-								if (markers[key].point.x == x & markers[key].point.y == y) {
+								if (markers[key].point.lng() == x & markers[key].point.lat() == y) {
 									bad = true;
 									break;
 								}
@@ -106,6 +110,8 @@
 
 							// If a street address is bundled in the cookie data, add it to the marker object.
 							if (markerParameters [3]) {
+								//var decodedStreetAddress = decode64 (markerParameters [3]);
+								//alert('sa is ' + decodedStreetAddress);
 								marker.setStreetAddress (decode64 (markerParameters [3]));
 							}
 						}
@@ -128,9 +134,11 @@
 	nodeList.innerHTML = "";
 	markerList.innerHTML = "";
 
-	// Add Markers
-	for (key in markers) {
+	// Add Markers // inside here: a.initialize is not a function
+	for (var key in markers) {
+//alert("key = " + key);
 		var node = markers[key];
+//alert("node = " + node);
 	
 		if (node.state == 'active' && document.getElementById ("showActive").checked == false) {
 			node.visible = false;
@@ -142,7 +150,8 @@
 
 		node.visible = true;
 
-		map.addOverlay (node);
+		map.addOverlay (node); // inside here: a.initialize is not a function // is node not
+                                       // a proper marker overlay?
 
 		if (node.state == 'active' | node.state == 'potential') {
 			nodeList.innerHTML += '<li onmouseover="getMarker(\'' + encode64(node.name) + '\').showTooltip();" onmouseout="getMarker(\'' + encode64(node.name) + '\').destroyTooltip();" class="nodeitem-' + node.state + '"><a href="javascript:getMarker(\'' + encode64(node.name) + '\').select();" style="font-weight: bold;">' + node.name + '</a>&nbsp;&nbsp;<a href="javascript:getMarker(\'' + encode64(node.name) + '\').zoomTo();" class="zoomLink">zoom</a></li>';
@@ -177,7 +186,7 @@
 	for (key in markers) {
 		var marker = markers[key];
 		if (marker.state == 'marker') {
-			arr.push(encode64 (marker.name) + ',' + marker.point.x + ',' + marker.point.y + ',' + encode64 (marker.streetAddress));
+			arr.push(encode64 (marker.name) + ',' + marker.point.lng() + ',' + marker.point.lat() + ',' + encode64 (marker.streetAddress));
 		}
 	}
 	value = arr.join("|");
@@ -206,21 +215,21 @@
 	return markers[index];
 }
 
-function addMarker (y, x, b64addr) 
+function addMarker (lat, lng, b64addr) 
 {
 	var streetAddress = decode64 (b64addr);
 
 	showMarkers ();
 
 	for (key in markers) {
-                if (markers[key].point.x == x & markers[key].point.y == y) {
+                if (markers[key].point.lng() == lng & markers[key].point.lat() == lat) {
                         alert ("A marker at this point already exists.");
                         return;
                 }
         }
 
 	markerCount ++;
-	var marker = new NodeMarker ("Untitled Marker " + markerCount, '', 'marker', x, y);
+	var marker = new NodeMarker ("Untitled Marker " + markerCount, '', 'marker', lng, lat);
 
 	// store the street address if it was passed in
 	if ( streetAddress != '' ) {


This was sent by the SourceForge.net collaborative development platform, the world's largest Open Source development site.



