var icon = new GIcon();
icon.image = '';
icon.iconSize = new GSize(0, 0);
icon.iconAnchor = new GPoint(0, 0);
icon.infoWindowAnchor = new GPoint(300, 20);
var smallOpts = {icon: icon, itemType: "photo", itemFilename: "", tab:"", ownerID: "", ownerDisplayName:"", labelOffset: new GSize(0,-52), labelType: "smallmarker", id:"", title:"", labelClass:"smallmarker_container", clickable:false};
photopath_mini = staticpath+"/asset/photo/37x28/";
videopngpath_mini = "/asset/video/png/37x28/";

var mapedit;
var point;
var homelocation;
var officelocation;
var preloadHomeIcon;
var preloadOfficeIcon;
var map;

var lastestIcon = new GIcon();
lastestIcon.image = "/static/images/overlay-85.png";
lastestIcon.iconSize = new GSize(10, 10);
lastestIcon.iconAnchor = new GPoint(5, 5);
lastestIcon.infoWindowAnchor = new GPoint(0, 0);

//var poly;
var count = 0;
var points = new Array();
var markers = new Array();

var lastID = 1;

var placeList = new Array();
var preloadPlaceIconList = new Array();
var placeImage = ["/static/images/marker/home.png","/static/images/marker/office.png","/static/images/marker/school.png","/static/images/marker/university.png"];

//begin place
var preloadPlaceIconList2 = new Array();
var getPlaceID = 1;
var placeidlist = new Array();
var placelatlnglist = new Array();
var placeinfolist = new Array();
var placefilenamelist = new Array();
var placemarkers = new Array();
var placeIcon = new GIcon();
placeIcon.iconSize = new GSize(0, 0);
placeIcon.iconAnchor = new GPoint(0, 0);
var placeOpts	= {icon: placeIcon, labelText: "", labelOffset: "", labelType: "place", title: "", id: "", width:"", height:"", clickable:false};
//end place
function loadSideMap(){
if(GBrowserIsCompatible()){
		map = new GMap2($("mapbox"));
		map.setCenter(new GLatLng(13.90747, 100.50426), 13);
		
		map.addControl(new ExtMapTypeControl());
		map.addControl(new GSmallZoomControl());
		
		d = loadJSONDoc("/profiles/loadLastLocation",{userid:useridtmp});
		d.addCallback(handleLoadCallback);
		handlePlaceChange();
		GEvent.addListener(map, "zoomend", handleZoomLevelChange);
	}else{
		alert('Your browser is not compatible for displaying google map.');
	}
}

function handleZoomLevelChange(){
	for(var i = 0; i < markers.length; i++){
		markers[i].show();
	}
	var p0 = map.fromDivPixelToLatLng(new GPoint(0,0));
	for(var i = 0; i < placeList.length; i++){
		if(preloadPlaceIconList[i] != undefined){
			var p100 = map.fromDivPixelToLatLng(new GPoint(preloadPlaceIconList[i].width,preloadPlaceIconList[i].height));
			var lat = Math.abs((p0.lat()-p100.lat())/2);
			var lng = Math.abs((p0.lng()-p100.lng())/2);
			var point = placeList[i];
			if(point != undefined){
				var left = point.lng()-lng;
				var right = point.lng()+lng;
				var top = point.lat()+lng;
				var bottom = point.lat()-lng;
				for(var j = 0; j < markers.length; j++){
					var point = points[j]
					if(point.lng() > left && point.lng() < right && point.lat() > bottom && point.lat() < top){
						markers[j].hide();
					}
				}
			}
		}
	}
	for(var i = 0; i < placeidlist.length; i++){
		if(preloadPlaceIconList2[placeidlist[i]] != undefined){
			var p100 = map.fromDivPixelToLatLng(new GPoint(preloadPlaceIconList2[placeidlist[i]].width,preloadPlaceIconList2[placeidlist[i]].height));
			var lat = Math.abs((p0.lat()-p100.lat())/2);
			var lng = Math.abs((p0.lng()-p100.lng())/2);
			var point = placelatlnglist[placeidlist[i]];
			var left = point.lng()-lng;
			var right = point.lng()+lng;
			var top = point.lat()+lng;
			var bottom = point.lat()-lng;
			for(var j = 0; j < markers.length; j++){
				var point = points[j]
				if(point.lng() > left && point.lng() < right && point.lat() > bottom && point.lat() < top){
					markers[j].hide();
				}
			}
		}
	}
}

function handleLoadCallback(result){
	var point,marker;
	if(result.locationList.length > 0 || result.placeList.length > 0){
		lastID = result.lastID;
		if(markers.length > 0){
			points.shift();
			map.removeOverlay(markers[0]);
			markers.shift();
		}else{
            if(result.locationList.length == 0 && result.placeList.length > 0){
				if(result.placeList[0][0] != "" && result.placeList[0][1] != ""){
					map.setCenter(new GLatLng(result.placeList[0][0],result.placeList[0][1]), 13);
				}
            }
			for(var i = 0; i < result.placeList.length; i++){
				if(result.placeList[i][0]!="" && result.placeList[i][1]!=""){
					placeList[i] = new GLatLng(result.placeList[i][0],result.placeList[i][1]);
					preloadPlaceIconList[i] = new Image();
					preloadPlaceIconList[i].id = "preloadPlaceIconList"+i;
					preloadPlaceIconList[i].src = placeImage[i];
					preloadPlaceIconList[i].onload = function(){
						var placeIcon = new GIcon();
						placeIcon.image = this.src;
						placeIcon.iconSize = new GSize(this.width, this.height);
						placeIcon.iconAnchor = new GPoint(this.width/2, this.height/2);
						placeIcon.infoWindowAnchor = new GPoint(0, 0);

						handleZoomLevelChange();

						var point = placeList[this.id.substring(20)];
						var marker = new GMarker(point,placeIcon);
						map.addOverlay(marker);
					}
				}
			}
		}
//		for(var i = result.locationList.length-1; i > 0; i--){
//			point = new GLatLng(result.locationList[i][0],result.locationList[i][1]);
//			points.push(point);
//			marker = new GMarker(point,icon);
//			markers.push(marker);
//			map.addOverlay(marker);
//		}
		if(result.locationList.length > 0){
			point = new GLatLng(result.locationList[0][0][0],result.locationList[0][0][1]);
			points.push(point);

            smallOpts.ownerID	= result.locationList[0][1];
            smallOpts.itemFilename= result.locationList[0][2];

			marker = new LabeledMarker(point,smallOpts);
			markers.push(marker);
			map.addOverlay(marker);
            map.setCenter(point,13);
//			marker.openInfoWindow("");
//			map.closeInfoWindow();
			//poly = new GPolyline(points);
			//map.addOverlay(poly);
		}
		handleZoomLevelChange();
	}
	setTimeout(function(){
		d = loadJSONDoc("/profiles/update",{userid:useridtmp,lastID:lastID});
		d.addCallback(handleLoadCallback);
	},300000);
}
//begin place
function handlePlaceChange() {
	pl = loadJSONDoc("/placeonmap",{getPlaceID: getPlaceID});
	pl.addCallback(handlePlaceCallback);
}

function handlePlaceCallback(result) {
	var placeid;
	for(var i = 0; i < result.PlaceID.length; i++){
		placeid = result.PlaceID[i];
	
		placeidlist.push(placeid);
	
		placeinfolist[placeidlist[i]] = "<b>"+result.PlaceTitle[i]+"</b>:<br/>"+result.PlaceDescription[i]+"<br/><a href='"+result.PlaceLink[i]+"' target='_blank'>readmore</a>";
		placelatlnglist[placeidlist[i]] = new GLatLng(Number(result.PlaceLat[i]),Number(result.PlaceLng[i]));
		placefilenamelist[placeidlist[i]] = result.PlaceFilename[i];
		
		addPlaceMarker(placeid);
		lastPlaceID = placeid;
	}
	getPlaceID = lastPlaceID + 1;
	
	updatePlaceTimer = setTimeout("handlePlaceChange()",60000);
}

function addPlaceMarker(id){
	preloadPlaceIconList2[id] = document.createElement("img");
	preloadPlaceIconList2[id].id = 'placemarker'+id;
	preloadPlaceIconList2[id].src = "/static/images/marker/places/"+placefilenamelist[id];
	preloadPlaceIconList2[id].onload = function(){
		placeOpts.labelText	= this.src;
		placeOpts.title		= placefilenamelist[this.id.substring(11)];
		placeOpts.id		= this.id;
		placeOpts.labelOffset = new GSize(-this.width/2,-this.height*0.8);
		placeOpts.width = this.width;
		placeOpts.height = this.height;
		
		handleZoomLevelChange();
		
		placemarkers[this.id.substring(11)] = new LabeledMarker(placelatlnglist[this.id.substring(11)],placeOpts);
		map.addOverlay(placemarkers[this.id.substring(11)]);
	}
}

function openPlaceInfoWindow(img){
	placeIcon.infoWindowAnchor = new GPoint(68, -img.height*0.6);
	placemarkers[img.id.substring(11)].openExtInfoWindow(
		map,
		"opacity_window",
		"<div>"+
		placeinfolist[img.id.substring(11)]+
		"</div>",
		{beakOffset: 3, paddingLeft: 20+img.width*0.6, paddingBottom: img.height*0.2, isNormalMap: true}
	);
}

function loadGMap(){
	if (GBrowserIsCompatible()){
	    mapedit = new GMap2(document.getElementById("mapedit"));
		mapedit.addControl(new ExtMapTypeControl());
		mapedit.addControl(new GSmallZoomControl());
	    point = new GLatLng(13.744617, 100.533786);
	    mapedit.setCenter(point, 13);

		if($("HomeLatitude").value != "" && $("HomeLongtitude").value != ""){
			homelocation = new GLatLng($("HomeLatitude").value, $("HomeLongtitude").value);
			preloadHomeIcon = new Image();
			preloadHomeIcon.onload = function(){
				var icon = new GIcon();
				icon.image = this.src;
				icon.iconSize = new GSize(this.width, this.height);
				icon.iconAnchor = new GPoint(this.width/2, this.height/2);
				icon.infoWindowAnchor = new GPoint(0, 0);

				homemarker = new GMarker(homelocation, {icon: icon, draggable: true});
				mapedit.addOverlay(homemarker);
				mapedit.setCenter(homelocation, 13);

				GEvent.addListener(homemarker, "dragend", function(){
					homelocation = homemarker.getLatLng();
					$("HomeLatitude").value = homelocation.lat();
					$("HomeLongtitude").value = homelocation.lng();
				});
			}
			preloadHomeIcon.src = "/static/images/marker/home.png";
		}
		if($("OfficeLatitude").value != "" && $("OfficeLongtitude").value != ""){
			officelocation = new GLatLng($("OfficeLatitude").value, $("OfficeLongtitude").value);
			preloadOfficeIcon = new Image();
			preloadOfficeIcon.onload = function(){
				var icon = new GIcon();
				icon.image = this.src;
				icon.iconSize = new GSize(this.width, this.height);
				icon.iconAnchor = new GPoint(this.width/2, this.height/2);
				icon.infoWindowAnchor = new GPoint(0, 0);

				officemarker = new GMarker(officelocation, {icon: icon, draggable: true});
				mapedit.addOverlay(officemarker);
				if(homelocation == undefined) mapedit.setCenter(officelocation, 13);
				
				GEvent.addListener(officemarker, "dragend", function(){
					officelocation = officemarker.getLatLng();
					$("OfficeLatitude").value = officelocation.lat();
					$("OfficeLongtitude").value = officelocation.lng();
				});
			}
			preloadOfficeIcon.src = "/static/images/marker/office.png";
		}
	}
}
function addHomeLocation(){
	GEvent.clearListeners(mapedit, 'click');
	if($("hint").innerHTML != "click on map to add home"){
		$("hint").innerHTML = "click on map to add home";
		$("addHome").value = "cancel";
		GEvent.addListener(mapedit, 'click', function(overlay, point){
			if(point){
				homelocation = point;
				preloadHomeIcon = new Image();
				preloadHomeIcon.onload = function(){
					var icon = new GIcon();
					icon.image = this.src;
					icon.iconSize = new GSize(this.width, this.height);
					icon.iconAnchor = new GPoint(this.width/2, this.height/2);
					icon.infoWindowAnchor = new GPoint(0, 0);

					homemarker = new GMarker(homelocation, {icon: icon, draggable: true});
					mapedit.addOverlay(homemarker);
					GEvent.clearListeners(mapedit, 'click');
					$("HomeLatitude").value = homelocation.lat();
					$("HomeLongtitude").value = homelocation.lng();
					hideElement("addHome");
					$("hint").innerHTML = "";

					GEvent.addListener(homemarker, "dragend", function(){
						homelocation = homemarker.getLatLng();
						$("HomeLatitude").value = homelocation.lat();
						$("HomeLongtitude").value = homelocation.lng();
					});
				}
				preloadHomeIcon.src = "/static/images/marker/home.png";
			}
		});
	}else{
		$("hint").innerHTML = "";
		$("addHome").value = "add home";
		if($("addOffice") != undefined)$("addOffice").value = "add office";
	}
}
function addOfficeLocation(){
	GEvent.clearListeners(mapedit, 'click');
	if($("hint").innerHTML != "click on map to add office"){
		$("hint").innerHTML = "click on map to add office";
		$("addOffice").value = "cancel";
		GEvent.addListener(mapedit, 'click', function(overlay, point){
			if(point){
				officelocation = point;
				preloadOfficeIcon = new Image();
				preloadOfficeIcon.onload = function(){
					var icon = new GIcon();
					icon.image = this.src;
					icon.iconSize = new GSize(this.width, this.height);
					icon.iconAnchor = new GPoint(this.width/2, this.height/2);
					icon.infoWindowAnchor = new GPoint(0, 0);

					officemarker = new GMarker(officelocation, {icon: icon, draggable: true});
					mapedit.addOverlay(officemarker);
					GEvent.clearListeners(mapedit, 'click');
					$("OfficeLatitude").value = officelocation.lat();
					$("OfficeLongtitude").value = officelocation.lng();
					hideElement("addOffice");
					$("hint").innerHTML = "";
						
					GEvent.addListener(officemarker, "dragend", function(){
						officelocation = officemarker.getLatLng();
						$("OfficeLatitude").value = officelocation.lat();
						$("OfficeLongtitude").value = officelocation.lng();
					});
				}
				preloadOfficeIcon.src = "/static/images/marker/office.png";
			}
		});
	}else{
		$("hint").innerHTML = "";
		if($("addHome") != undefined)$("addHome").value = "add home";
		$("addOffice").value = "add office";
	}
}