User:Mafs/GoogleMapExtension/gmap.js

From Meta, a Wikimedia project coordination wiki

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
<pre>
/*
Google Map API Helper Script

Copyright (C) 2005  Gregory Szorc <gregory.szorc@case.edu
              and   M. Arndt <chmarndt@medemsand.de>

       see http://meta.wikimedia.org/wiki/User:IndyGreg/GoogleMapExtension
           http://wiki.case.edu/CaseWiki:Google_Map_Extension
           http://meta.wikimedia.org/wiki/User:Mafs/GoogleMapExtension

This library is free software; you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public
License as published by the Free Software Foundation; either
version 2.1 of the License, or (at your option) any later version.

This library is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
Lesser General Public License for more details.

You should have received a copy of the GNU Lesser General Public
License along with this library; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA
*/



var tempMarker = false;

//finds all of the divs on the page belonging to the Google Map class and turns them into Google Maps
//this function should be called by an onLoad handler
function renderMaps() {
  maps = getElementsByClass("div", "googleMap");
  
  for (i = 0; i < maps.length; i++) {
    renderMap(i+1); 
  }
}

//renders a map n on a page
//data is read from a form with name and id "mapform_n" where n is an integer starting at 1 and incrementing by 1
//the creation of this form is handled by the gmap extension
function renderMap(n) {

  gmap_id = 'gmap_'+n;
  form_id = 'mapform_'+n;
  message_id = 'gmapmessage_'+n;
  message2_id = 'gmapmessage2_'+n;

  var icon = new GIcon();
  icon.image = "http://labs.google.com/ridefinder/images/mm_20_blue.png";
  icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
  icon.iconSize = new GSize(12, 20);
  icon.shadowSize = new GSize(22, 20);
  icon.iconAnchor = new GPoint(6, 20);
  icon.infoWindowAnchor = new GPoint(5, 1);
  
  document.getElementById(gmap_id).style.width = document.getElementById(form_id).width.value;
  document.getElementById(gmap_id).style.height = document.getElementById(form_id).height.value;

  if (isObject(document.getElementById(form_id).path)) var path = document.getElementById(form_id).path.value; else path = '';
  
  var map = new GMap(document.getElementById(gmap_id));
  map.addControl(new GLargeMapControl());
  map.centerAndZoom(new GPoint(parseFloat(document.getElementById(form_id).lon.value), parseFloat(document.getElementById(form_id).lat.value)), parseFloat(document.getElementById(form_id).zoom.value));

  if (document.getElementById(form_id).controls.value == 'yes') {
    map.addControl(new GMapTypeControl());
  }
  
  if (document.getElementById(form_id).type.value == '_SATELLITE_TYPE') {
    map.setMapType(_SATELLITE_TYPE);
  }
  else if (document.getElementById(form_id).type.value == '_MAP_TYPE') {
    map.setMapType(G_MAP_TYPE); 
  }
  else if (document.getElementById(form_id).type.value == '_HYBRID_TYPE') {
    map.setMapType(_HYBRID_TYPE);
  }

GEvent.addListener(map, 'click', function(overlay, point) {
  if (path != '') {
	if (overlay) {
	//map.removeOverlay(overlay);
	
	} else if (point) {
	if (tempMarker) {map.removeOverlay(tempMarker)};
		tempMarker = new GMarker(point, icon)
		map.addOverlay(tempMarker);
		document.getElementById(message_id).innerHTML = '<a href=\"'+path+'/long='+point.x+',lat='+point.y+'\"><strong>Create</strong></a> a gmap page for long='+point.x+',lat='+point.y+'.';
		//
	}
  }
});


if (document.getElementById(form_id).info.value) {
map.openInfoWindow(map.getCenterLatLng(), document.createTextNode(document.getElementById(form_id).info.value));
}
  

  if (document.getElementById(form_id).rss){

    //if the rss form element is defined, plot datapoints from an rss feed
    feedarray = document.getElementById(form_id).rss.value.split('|');
    document.getElementById(message2_id).innerHTML = '<br><strong>Geodata</strong> supplied by:<br>';
    
    for (var i = 0; i < feedarray.length; i++) {
      renderRSSFeed(map, feedarray[i]);
    }
  }
}

function renderRSSFeed(map, rssurl) {

  var request = GXmlHttp.create();

  request.open("GET", rssurl, true);
  request.onreadystatechange = function() {

    if (request.readyState == 4) {

       var xmlDoc = request.responseXML;
       if (isObject(xmlDoc))  {
		var items = xmlDoc.documentElement.getElementsByTagName("item");

		var rssDescription = getValue(xmlDoc.documentElement.getElementsByTagName("description")[0].childNodes[0]);
		var rssTitle = getValue(xmlDoc.documentElement.getElementsByTagName("title")[0].childNodes[0]);
		var rssLink = getValue(xmlDoc.documentElement.getElementsByTagName("link")[0].childNodes[0]);
		rssLink = rssLink.replace(/\/\/AND\/\//g, "&");
		
		
		if (rssTitle != '') document.getElementById(message2_id).innerHTML = document.getElementById(message2_id).innerHTML  +'<a href='+rssLink+'>'+ rssTitle + '</a>&nbsp;&nbsp;' + rssDescription + '<br>'; 
		else document.getElementById(message2_id).innerHTML = document.getElementById(message2_id).innerHTML  + rssTitle + '&nbsp;&nbsp;' + rssDescription + '<br>'; 
		
		if (isObject(document.getElementById(form_id).maxrss)) var  maxrss = document.getElementById(form_id).maxrss.value; else maxrss = 0;

		var gpx_path = [];
		var tp = 0;

		if (maxrss>0 && maxrss<items.length) {
			var n = maxrss;
		} else {
			var n = items.length;
		}
	

		for (var i = 0; i < n; i++) {
			if (isObject(items[i])) {
				itemType = 'point';
				if (isObject(items[i].getElementsByTagName("type")[0])) var itemType = getValue(items[i].getElementsByTagName("type")[0].childNodes[0]);
				if (itemType != 'path') {	
					var marker = createMarkerFromRSSItem(items[i]);
					map.addOverlay(marker);
				} 

				if (itemType == 'path') {
					tp = tp + 1;
					var lat = items[i].getElementsByTagName("geolat")[0].childNodes[0].nodeValue*10/10;
					var lon = items[i].getElementsByTagName("geolong")[0].childNodes[0].nodeValue*10/10;

					gpx_path.push(new GPoint(lon*1.0, lat*1.0));
				}
			}
		}
		if (tp > 1) map.addOverlay(new GPolyline(gpx_path));
	}
     }
  }
  request.send(null);
}


function createMarkerFromRSSItem(item) {

	var title = getValue(item.getElementsByTagName("title")[0].childNodes[0]); 
	var description = getValue(item.getElementsByTagName("description")[0].childNodes[0]); 
	var link = getValue(item.getElementsByTagName("link")[0].childNodes[0]); 
	link = link.replace(/\/\/AND\/\//g, "&");
	
	//var lat = item.getElementsByTagNameNS("http://www.w3.org/2003/01/geo/wgs84_pos#", "lat")[0].childNodes[0].nodeValue;
	//var lon = item.getElementsByTagNameNS("http://www.w3.org/2003/01/geo/wgs84_pos#", "long")[0].childNodes[0].nodeValue;
	
	var lat = item.getElementsByTagName("geolat")[0].childNodes[0].nodeValue;
	var lon = item.getElementsByTagName("geolong")[0].childNodes[0].nodeValue;
	
	var point = new GPoint(parseFloat(lon), parseFloat(lat));
	var marker = new GMarker(point);
	
	if (description != 'itemDescription' && title != 'itemTitle') {
	var html = '<a href="' + link + '">' + title + '</a><br />' + description;
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(html);
	});
	}
	
	return marker;
}


function createMarker(point, html) {
  var marker = new GMarker(point);
  
  GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowHtml(html);
  });
  
  return marker;
}


//a helper function that returns an array of element ids of a given type and class
function getElementsByClass(elem, classname) {
  classes = new Array();
  alltags = document.getElementsByTagName(elem);
  for (i=0; i<alltags.length; i++) {
    if (alltags[i].className == classname) {
      classes.push(alltags[i].id);
    }
  }
  return classes;
}

function isObject (element) {
	if (element && typeof element == 'object') return true; else return false;
}

function getValue (element) {
	if (isObject(element)) return element.nodeValue; else return '';
}</pre>