var centreLat=0.0;
    var centreLon=0.0;
    var zoomOffset = 2;
	var zoomLevels = 7;
	var initialZoom = 1;
    var imageWraps=false; 
    var map; //the GMap2 itself;


/////////////////////
//Custom projection
/////////////////////
function CustomProjection(a,b){
	this.imageDimension=65536;
	this.pixelsPerLonDegree=[];
	this.pixelOrigin=[];
	this.tileBounds=[];
	this.tileSize=256;
    this.isWrapped=b;
	var b=this.tileSize;
	var c=1;
	
	for(var d=0;d<a;d++){
	  var e=b/2;
	  this.pixelsPerLonDegree.push(b/360);
	  this.pixelOrigin.push(new GPoint(e,e));
	  this.tileBounds.push(c);
	  b*=2;
	  c*=2
	}
}
 
var CustomProjection;

function initCustomProjection() {

	CustomProjection.prototype= new GProjection();
	
	CustomProjection.prototype.fromLatLngToPixel=function(latlng,zoom){
		var c=Math.round(this.pixelOrigin[zoom].x+latlng.lng()*this.pixelsPerLonDegree[zoom]);
		var d=Math.round(this.pixelOrigin[zoom].y+(-2*latlng.lat())*this.pixelsPerLonDegree[zoom]);
		return new GPoint(c,d)
	};
	
	CustomProjection.prototype.fromPixelToLatLng=function(pixel,zoom,unbounded){
		var d=(pixel.x-this.pixelOrigin[zoom].x)/this.pixelsPerLonDegree[zoom];
		var e=-0.5*(pixel.y-this.pixelOrigin[zoom].y)/this.pixelsPerLonDegree[zoom];
		return new GLatLng(e,d,unbounded)
	};
	
	CustomProjection.prototype.tileCheckRange=function(tile,zoom,tilesize){
		var tileBounds=this.tileBounds[zoom];
		if (tile.y<0 || tile.y >= tileBounds) {return false;}
		if (this.isWrapped) {
			if (tile.x<0 || tile.x>=tileBounds) { 
				tile.x = tile.x%tileBounds; 
				if (tile.x < 0) {tile.x+=tileBounds} 
			}
		}
		else { 
				if (tile.x<0 || tile.x>=tileBounds) {return false;}
		}  
		return true;
	};
	  
	CustomProjection.prototype.getWrapWidth=function(zoom) {
		return this.tileBounds[zoom]*this.tileSize;
	};

}


function customGetTileURL(point, zoom) {
    	//var tileStr =  "/tiles/" + (zoom - zoomOffset + 4) + "_" + point.x + "_" + point.y  + ".jpg";
		var zoomFileNumber = (zoom - zoomOffset + 8);
		var tileStr =  "stackView/" + (zoom - zoomOffset + 8) + "_" + point.x + "_" + point.y  + ".jpg";  
		//alert(tileStr);
		
		if (zoomFileNumber === 10) {
			if ((point.x == 15) || (point.y == 15)) 
				tileStr = "stackView/"+"default.jpg";
		}
		if (zoomFileNumber === 11) {
			if (((point.x >= 30) && (point.x <= 31)) || ((point.y >= 30) && (point.y <= 31))) 
				tileStr = "stackView/"+"default.jpg";
		}
		if (zoomFileNumber === 12) {
			if (((point.x >= 59) && (point.x <= 63)) || ((point.y >= 59) && (point.y <= 63))) 
				tileStr = "stackView/"+"default.jpg";
		}
		if (zoomFileNumber === 13) {
			if (((point.x >= 118) && (point.x <= 127)) || ((point.y >= 118) && (point.y <= 127))) 
				tileStr = "stackView/"+"default.jpg";
		}
		if (zoomFileNumber === 13) {
			if (((point.x >= 0) && (point.x <= 0)) || ((point.y >= 0) && (point.y <= 0))) 
				tileStr = "stackView/"+"default.jpg";
		}
		return tileStr;
}  

function customMap() {  
    var copyCollection = new google.maps.CopyrightCollection('');  
    var copyright = new google.maps.Copyright(1, new google.maps.LatLngBounds(new google.maps.LatLng(-90, -180), new google.maps.LatLng(90, 180)), 0, "");  
    copyCollection.addCopyright(copyright);  
  
	var high_level = zoomOffset - 1;  
	var low_level = zoomOffset + zoomLevels - 1;  
	var tilelayers = [new google.maps.TileLayer(copyCollection, high_level, low_level)];

    tilelayers[0].getTileUrl = customGetTileURL;
	tilelayers[0].isPng = function() { return false; };
	tilelayers[0].getOpacity = function() { return 1.0; };
	
	
        
		
	
	var proj = new CustomProjection(9,imageWraps);
    var pic_customMap = new GMapType(tilelayers, proj, "Pic",
            {maxResolution:7, minResolution:2, errorMessage:"No Image HERE"});
    
    //var pic_customMap = new google.maps.MapType(tilelayers, new google.maps.MercatorProjection(low_level + 1), "Chart", {errorMessage:"No image"});  
    return pic_customMap;  
}  


function init()
{
    if (GBrowserIsCompatible()) {
         
		 initCustomProjection();
		 
		var customType = customMap();  
		map = new google.maps.Map2(document.getElementById("map"), {mapTypes: [customType]});  

		//create a custom picture layer
        /*var pic_tileLayers = [ new GTileLayer(copyrightCollection , high_level, low_level)];
        
		pic_tileLayers[0].getTileUrl = customGetTileURL;
        pic_tileLayers[0].isPng = function() { return false; };
        pic_tileLayers[0].getOpacity = function() { return 1.0; };
        
		var proj=new CustomProjection(9,imageWraps);
        var pic_customMap = new GMapType(pic_tileLayers, proj, "Pic",
            {maxResolution:13, minResolution:1, errorMessage:"End"});*/


        //Now create the custom map. 
		//Would normally be G_NORMAL_MAP,G_SATELLITE_MAP,G_HYBRID_MAP
        //map = new GMap2(document.getElementById("map"),{mapTypes:[pic_customMap]});
        map.addControl(new GMapTypeControl());
 /*   	map.enableDoubleClickZoom();*/
		map.enableContinuousZoom();
		map.enableScrollWheelZoom();
		var mt = map.getMapTypes();
		// Overwrite the getMinimumResolution() and getMaximumResolution() methods
		//for (var i=0; i<mt.length; i++) {
//		mt[i].getMinimumResolution = function() {return 0;}
//		mt[i].getMaximumResolution = function() {return 17;}
//		} 
		var slidePosition = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(20, 40));
		map.addControl(new GSmallMapControl(), slidePosition);
        map.setCenter(new GLatLng(4,-12), initialZoom+1);
/*
GEvent.addListener(map, "click", function(overlay, latlng) {
//create an HTML DOM form element
var inputForm = document.createElement("form");
inputForm.setAttribute("action","");
inputForm.onsubmit = function() {storeMarker(); return false;};
//retrieve the longitude and lattitude of the click point
var lng = latlng.lng();
var lat = latlng.lat();
inputForm.innerHTML = '<fieldset style="width:150px;">'
+ '<legend>New Marker</legend>'
+ '<label for="found">Found</label>'
+ '<input type="text" id="found" style="width:100%;"/>'
+ '<label for="left">Left</label>'
+ '<input type="text" id="left" style="width:100%;"/>'
+ '<input type="submit" value="Save"/>'
+ '<input type="hidden" id="longitude" value="' + lng + '"/>'
+ '<input type="hidden" id="latitude" value="' + lat + '"/>'
+ '</fieldset>';
map.openInfoWindow (latlng,inputForm);
});*/
			
    	}
}





window.onload = init;
window.onunload = GUnload;

function storeMarker(){
	var lng = document.getElementById("longitude").value;
	var lat = document.getElementById("latitude").value;

	var getVars =  "?found=" + document.getElementById("found").value
	+ "&left=" + document.getElementById("left").value
	+ "&lng=" + lng
	+ "&lat=" + lat ;

	var request = GXmlHttp.create();

	//open the request to storeMakres.php on your server
	request.open('GET', 'storeMarker.php' + getVars, true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			//the request in complete

			var xmlDoc = request.responseXML;

			//retrieve the root document element (response)
			var responseNode = xmlDoc.documentElement;

			//retrieve the type attribute of the node
			var type = responseNode.getAttribute("type");

			//retrieve the content of the responseNode
			var content = responseNode.firstChild.nodeValue;

			//check to see if it was an error or success
			if(type!='success') {
				alert(content);
			} else {
				//Create a new marker and add it's info window.
				var latlng = new GLatLng(parseFloat(lat),parseFloat(lng));

				var marker = createMarker(latlng, content);

				map.addOverlay(marker);
				map.closeInfoWindow();
			}
		}
	}
	request.send(null);
	return false;
}

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

function retrieveMarkers() {
	var request = GXmlHttp.create();

	//tell the request where to retrieve data from.
	request.open('GET', 'retrieveMarkers.php', true);

	//tell the request what to do when the state changes.
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var xmlDoc = request.responseXML;

			var markers = xmlDoc.documentElement.getElementsByTagName("marker");
			for (var i = 0; i < markers.length; i++) {
				var lng = markers[i].getAttribute("lng");
				var lat = markers[i].getAttribute("lat");
				//check for lng and lat so MSIE does not error
				//on parseFloat of a null value
				if(lng && lat) {
					var latlng = new GLatLng(parseFloat(lat),parseFloat(lng));

					var html = '<div><b>Found</b> '
					+ markers[i].getAttribute("found")
					+ '</div><div><b>Left</b> '
					+ markers[i].getAttribute("left")
					+ '</div>';

					var marker = createMarker(latlng, html);
					map.addOverlay(marker);
				}
			} //for
		} //if
	} //function

	request.send(null);
}