﻿//document.write("<script src='http://maps.google.com/maps/api/js?sensor=false'><\/script>"); 
function RenderOnTheRoadMapWidget(uID, data) {
	var uiHolder = document.getElementById(uID);
	var mapSize = data.MapSize.split(', ');
	
	var mapHolder = document.createElement('div');
	mapHolder.setAttribute('id', 'mapHolder');
	mapHolder.style.width = mapSize[0] + 'px';
	mapHolder.style.height = mapSize[1] + 'px';
	uiHolder.appendChild(mapHolder);

	var mapOptions = {
		zoom: 8,
		center: new google.maps.LatLng(-34.397, 150.644),
		mapTypeId: google.maps.MapTypeId.ROADMAP
	};
	var map = new google.maps.Map(mapHolder, mapOptions);

	var bounds = new google.maps.LatLngBounds();
	var pathPoints = new Array();
	for (var i = 0; i < data.Posts.length; i++) {
		var post = data.Posts[i];
		var latLng = new google.maps.LatLng(post.Lat, post.Lng);

		pathPoints.push(latLng);
		bounds.extend(latLng);
		
		var image = new google.maps.MarkerImage(
			'http://www.ontheroad.to/res/skins/default/stop.png',
			new google.maps.Size(22, 22),
			new google.maps.Point(0, 0),
			new google.maps.Point(11, 11)
		);
		
		var marker = new google.maps.Marker({
			position: latLng,
			map: map,
			icon: image
		});
		
		var content = [];
		content.push('<div id="content">');
			content.push('<div id="siteNotice"></div>');
			content.push('<h3 id="thirdHeading" class="thirdHeading"><a href="' + post.Url + '">' + post.Title + '</a></h3>');
			content.push('<div id="bodyContent">');
				content.push('<p>' + post.Body + '</p>');
				
				for (var j = 0; j < post.Images.length; j++) {
					var image = post.Images[j];
					content.push('<a href="' + image.url + '">');
						content.push('<img src="' + image.tUrl + '" width="75px" height="75px" style="border:0;margin: 0px 5px 5px 0px;" />');
					content.push('</a>');
				}
				
			content.push('</div');
		content.push('</div');
		
		marker.attachInfoWindow({content: content.join('')});
	}

	var path = new google.maps.Polyline({
		path: pathPoints,
		strokeColor: "#1282C0",
		strokeOpacity: 1.0,
		strokeWeight: 2
	});
	path.setMap(map);

	map.fitBounds(bounds);
}

/**
* attachInfoWindow() binds InfoWindow to a Marker 
* Creates InfoWindow instance if it does not exist already 
* @extends Marker
* @param InfoWindow options
* @author Esa 2009
*/
google.maps.Marker.prototype.attachInfoWindow = function(options) {
	var map_ = this.getMap();
	map_.bubble_ = map_.bubble_ || new google.maps.InfoWindow();
	google.maps.event.addListener(this, 'click', function() {
		map_.bubble_.setOptions(options);
		map_.bubble_.open(map_, this);
	});
	map_.infoWindowClickShutter = map_.infoWindowClickShutter ||
  google.maps.event.addListener(map_, 'click', function() {
  	map_.bubble_.close();
  });
}

/**
* accessInfoWindow()
* @extends Map
* @returns {InfoWindow} reference to the InfoWindow object instance
* Creates InfoWindow instance if it does not exist already 
* @author Esa 2009
*/
google.maps.Map.prototype.accessInfoWindow = function() {
	this.bubble_ = this.bubble_ || new google.maps.InfoWindow();
	return this.bubble_;
}