var gmarkers = new Array();
var marker_index = 0;
// Define classes 		
function cWalker(latlng,opts){
	this.latlng=latlng;
	this.saved_time='';
	this.des='';	
	this.time='';		
	this.opts=opts;
	//this.key=this.opts.key;
	this.name=this.opts.name;
	
	if (this.opts.icon==null || !this.opts.icon){
		this.icon_png = "images/icons/hike.png";
	}else{
		this.icon_png = "images/icons/" + this.opts.icon;
	}	
	this.opts.icon=	new GIcon(G_DEFAULT_ICON, this.icon_png);


	if (this.opts.icon_width && this.opts.icon_height){
		this.opts.icon.iconSize=new GSize(this.opts.icon_width,this.opts.icon_height);
	}

	
	this.opts.draggable=false;
	this.opts.labelOffset=new GSize(-16, -16);
}

cWalker.prototype.create_marker = function() {

	this.marker = new GMarker(this.latlng, this.opts);		
	this.elabel = new ELabel(this.latlng, this.opts.title, "tooltip",new GSize(6,-30), 75);		
	GEvent.bind(this.marker, "click", this, this.onclick);
	this.load_marker();
}

cWalker.prototype.load_marker = function() {
	map.addOverlay(this.elabel);				
	map.addOverlay(this.marker);
	this.elabel.redraw();
}
cWalker.prototype.remove_marker = function() {
	map.removeOverlay(this.elabel);	
	map.removeOverlay(this.marker);	

	delete this.opts;
	delete this.latlng;
	delete this.icon_png;
	delete this.name;
	delete this.elabel;
	delete this.marker;

}

cWalker.prototype.onclick = function() {
	this.marker.openInfoWindowHtml(this.opts.html);
}
cWalker.prototype.openInfoWindow = function() {
	this.marker.openInfoWindowHtml(this.opts.html);
}
cWalker.prototype.closeInfoWindow = function() {
	map.closeInfoWindow(); 	
}

cWalker.prototype.move_to = function(point) {
	map.removeOverlay(this.marker);			
	this.marker.setLatLng(point); 
	map.addOverlay(this.marker);		
}

function wMarker(latlng,options){
	
	this.opts = options;
	
	if (options.type == 'w'){
		this.key=-1;
		// variables for walker only
		this.eventno=options.eventno; 
		this.complete=0;
		this.gpx = '';
		this.lap_markers  = Array();
		this.color = '';
		this.read_trkpt_completed=0;
		this.trackpoints = Array();
		this.photos= Array();		
		this.arrows= Array();				
		this.index=0;
		this.address='';		
	}else{
		this.key=options.key;
	}

	this.latlng=latlng;
	this.name=options.name;
	this.title=options.title;
    this.html=options.html;
	this.icon=options.icon;
	this.icon_width=options.icon_width;
	this.icon_height=options.icon_height;
	this.arrow_path=options.arrow_path;	
	this.image=options.image; 
	this.small_image= 's_' + options.image; 
	this.image_path='upload/' + options.image_path + '/';
	this.image_width= options.image_width;
	this.image_height= options.image_height;

	this.i = 0;	
	this.elabel = '';
	if (this.opts.status=="event"){
		this.status='event';		
	}else{		
		this.status='editor';
	}
	this.wpoints = [];	
	this.wpolyline = '';
	this.slider=null;
	this.showtrack=false;
	this.showmarker=true;	
	this.trackcolour= "#ff00ff";
	this.trackcolorindex=0;	
		
}	

wMarker.prototype.get_key = function() {
	return this.key;
}

wMarker.prototype.get_title = function() {
	return this.title;
}

wMarker.prototype.get_marker = function() {
	return this.marker;
}

wMarker.prototype.get_lat = function() {
	return this.marker.getPoint().lat();
}

wMarker.prototype.get_lng = function() {
	return this.marker.getPoint().lng();
}


wMarker.prototype.create_marker = function() {

	if (this.opts.icon==null || !this.opts.icon){
		this.icon_png = "images/icons/marker_blue.png";
	}else{
		this.icon_png = "images/icons/" + this.opts.icon;
	}	

	this.opts.icon=	new GIcon(G_DEFAULT_ICON, this.icon_png);
	
	if (this.opts.icon_width && this.opts.icon_height){
		this.opts.icon.iconSize=new GSize(this.opts.icon_width,this.opts.icon_height);
	}	

	this.opts.labelOffset=new GSize(-16, -16);	
		
	if (this.status == "event"){ // on event
		this.opts.draggable=false;	
	}else{ // on editor
		this.opts.draggable=true;		
	}
	
	
	this.marker = new GMarker(this.latlng, this.opts);	
	this.elabel = new ELabel(this.latlng, this.title, "tooltip",new GSize(6,-30), 75);	


	if (this.key != -1){ // it is a marker
		this.showhtml = 	'<table><tr><td>Title:</td><td><input type="text" id="title" size="30" value="' +this.title+ '"/></td></tr><tr><td>Desc:</td><td><textarea id="desc" rows="10" cols="30">'+this.html+'</textarea></td></tr><tr><td></td><td><input type="button" value="SAVE" onClick="save_marker_html('+this.key+')" /><input type="button" value="DELETE" onClick="del_marker('+this.key+')" /><input type="button" value="CLOSE" onClick="close_marker_html()" /></td></tr></table>'
	}else{ // it is a walker
		this.showhtml = 	'<table><tr><td>Name:</td><td>' +this.title+ '</td></tr><tr><td>Desc:</td><td><textarea id="desc" rows="10" cols="30">'+this.html+'</textarea></td></tr><tr><td></td><td><input type="button" value="SAVE" onClick="save_marker_html('+this.key+')" /><input type="button" value="CLOSE" onClick="close_marker_html()" /></td></tr></table>'
	}
	
	this.showhtml2 = 	'<table><tr><td>'+this.title+'</td><tr><td>'+this.html+'</td></tr></table>'	
	
    this.showhtml3=  '  <table  border="0" align="center"><tr><td><div align="left">\n'

	for (x in micons){
		this.showhtml3 += ' <img style="cursor: pointer" src="images/icons/'+micons[x]+'" id="'+micons[x]+'" onclick="swapDIcon(this,'+this.key+');" />\n '
	}															
	this.showhtml3 += '	</div></td></tr></table><center><input type="button" value="CLOSE" onClick="close_marker_html()" /></center>\n'

	this.uploadhtml = '<center><a href="javascript:openwin(\''+ this.image_path  + this.image+'\');"><img style="cursor: pointer" src="' + this.image_path  + this.small_image+'" id="walkerphoto" name="'+this.image+'" width="'+this.image_width+'" height="'+this.image_height+'" ></a></center><form id="upload_form" name="upload_form" enctype="multipart/form-data" action="uploadfile.php" method="post" target="_blank"><br>Filename: <input type="file" name="uploadFile"><input type="button" name="button" value="Upload File" onclick="doUploadFile(this.form, this.form.uploadFile.value)"></form><input type="button" value="SAVE" onClick="save_marker_html('+this.key+')" /><input type="button" value="CLOSE" onClick="close_marker_html()" />\n'

	this.showhtml4='<center><a href="javascript:openwin(\'' + this.image_path  + this.image+'\');"><img style="cursor: pointer" src="'+ this.image_path  + this.small_image+'" id="walkerphoto" width="'+this.image_width+'" height="'+this.image_height+'" ></a><br>'+ this.html+'</center>';
	
	this.get_latlon();
	
	
	GEvent.bind(this.marker, "click", this, this.onclick);
	//GEvent.bind(this.marker, "dblclick", this, this.ondblclick);	
	//GEvent.bind(this.marker, "mouseover", this, this.onclick);	
	//GEvent.bind(this.marker, "mouseout", this, this.onMouseout);	
	GEvent.bind(this.marker, "singlerightclick", this, this.rightclick);	
	GEvent.bind(this.marker, "dragstart", this, this.ondragstart);
	GEvent.bind(this.marker, "dragend", this, this.ondragend);

	if (this.opts.type == "m"){ 
		this.load_marker();
	}
		
}

wMarker.prototype.load_marker = function() {

	map.addOverlay(this.elabel);				
	map.addOverlay(this.marker);
	this.elabel.redraw();
	
}
wMarker.prototype.onclick = function() {

	if (this.status == "event"){
		var showhtml4
		if (this.address !=""){
	  		showhtml4 = this.showhtml4+ '<br> Address: '+this.address;		  
		}else{
	  		showhtml4 = this.showhtml4;
		}
        this.marker.openInfoWindowHtml(showhtml4);
	}else{
		this.marker.openInfoWindowTabsHtml([new GInfoWindowTab('Content',this.showhtml),new GInfoWindowTab('Photo',this.uploadhtml),new GInfoWindowTab('Icons',this.showhtml3),new GInfoWindowTab('LatLon',this.latlonhtml)]);
	}

}

wMarker.prototype.rightclick = function() {
	alert("right-click");
	//this.marker.openInfoWindowHtml(this.showhtml2);
}

wMarker.prototype.dblclick = function() {
	this.marker.openInfoWindowHtml(this.showhtml2);
}

wMarker.prototype.ondragstart = function() {
	this.elabel.hide();
	map.closeInfoWindow();
}

wMarker.prototype.ondragend = function() {
	//alert(this.marker.getPoint());
	this.get_latlon();
	this.elabel.setPoint(this.marker.getPoint());
	this.elabel.show();
}

wMarker.prototype.onMouseout = function() {
	map.closeInfoWindow();
}

wMarker.prototype.openInfoWindow = function() {
	var showhtml4
	if (this.address !=""){
		showhtml4 = this.showhtml4+ '<br> Address: '+this.address;		  
	}else{
		showhtml4 = this.showhtml4;
	}
	this.marker.openInfoWindowHtml(showhtml4);	
}
wMarker.prototype.closeInfoWindow = function() {
	map.closeInfoWindow(); 	
}
wMarker.prototype.reload = function() {
	this.latlng = this.marker.getPoint();
	this.remove_marker();
	this.create_marker();
}
wMarker.prototype.remove_marker = function() {
	map.removeOverlay(this.elabel);	
	map.removeOverlay(this.marker);	
}
wMarker.prototype.load_marker = function() {
	map.addOverlay(this.elabel);	
	map.addOverlay(this.marker);	
}

wMarker.prototype.edit = function(title,desc) {
	this.title = title;
	this.html = desc;
	this.reload();
}

wMarker.prototype.swapicon = function(icon) {
	this.icon = icon;
	this.reload();
}

wMarker.prototype.set_center = function() {
	var point = map.getCenter();
	this.latlng = point;
	this.remove_marker();
	this.create_marker();
}

wMarker.prototype.move_to = function(point) {
	this.remove_marker();
	this.marker.setLatLng(point); 
	this.elabel	.point=point; 
	this.load_marker();
}
wMarker.prototype.move = function() {
	this.remove_marker();
	this.load_marker();
}

wMarker.prototype.get_latlon = function() {
	this.latlonhtml='  <table width="100%" border="0" cellpadding="0">';
	this.latlonhtml+='    <tr>';
	this.latlonhtml+='      <td width="8%" scope="row">Lat:</td>';
	this.latlonhtml+='      <td width="92%"> <div id="message"></div><input type="text" size="40" id="gotolat" name="gotolat" value="'+this.get_lat()+'"/></td>';
	this.latlonhtml+='    </tr>';
	this.latlonhtml+='    <tr>';
	this.latlonhtml+='      <td scope="row">Lon:</td>';
	this.latlonhtml+='      <td><input type="text" id="gotolon" size="40" name="gotolon" value="'+this.get_lng()+'"/></td>';
	this.latlonhtml+='    </tr>';
	this.latlonhtml+='    <tr>';	
	this.latlonhtml+='      <td colspan="2" scope="row"><input type="button" id="button_gotolatlon" name="button_gotolatlon" value="Move to the Coordinate" onClick="goto_latlon(\''+this.key+'\')" /><input type="button" value="CLOSE" onClick="close_marker_html()" /></td>';	
	this.latlonhtml+='    </tr>';
	this.latlonhtml+='  </table>';	
}

wMarker.prototype.del_arrows = function() {
	try{
		for (i=0;i<this.arrows.length;i++){
			map.removeOverlay(this.arrows[i].marker);
		}
		this.wpoints = [];	
		map.removeOverlay(this.wpolyline);					
	}catch(e){
	;			
	}			
			
}

// Define functions 
function new_marker(path){
	marker_index++;	
	var clat = map.getCenter().lat();
	var clng = map.getCenter().lng();	
	var point = new GLatLng(clat,clng);
	opts = {
		"key" : marker_index,
		"name" : '',
		"title" : '',
		"html" : '',
		"icon" : '',
		"image" : '',
		"image_path" : path,
		"image_width" : '',
		"image_height" : '',
		"type" : 'm'
	};		
	gmarkers[marker_index] = new wMarker(point,opts);		
	gmarkers[marker_index].create_marker();
	//alert(marker_index);
}

function del_marker(i){
	gmarkers[i].remove_marker();
	//delete gmarkers[i];
	gmarkers[i].elabel=null;
	gmarkers[i]	=null;
	map.closeInfoWindow(); 	
}


function save_marker_html(i){
//alert(i);

	file  = document.getElementById("walkerphoto").name;
	wphoto=file;
	gmarkers[i].image = file;
	gmarkers[i].small_image = 's_'+ file;
	gmarkers[i].image_width=document.getElementById("walkerphoto").width
	gmarkers[i].image_height=document.getElementById("walkerphoto").height
	if (i !=-1){
		gmarkers[i].edit(document.getElementById('title').value,document.getElementById('desc').value);
	}else{
		gmarkers[i].edit(gmarkers[i].title,document.getElementById('desc').value);
	}
	
	map.closeInfoWindow(); 	
}

function close_marker_html(){
	map.closeInfoWindow();	 	 	 
}

function swapDIcon(image,i){
    markerpng=image.id;
	//alert(markerpng);
	/*
	var img  = new Image();	
	img.scr = "images/icons/"+ markerpng;
	alert(img.scr);
	alert(img.width);
	alert(img.height);	
	*/
	gmarkers[i].swapicon(markerpng)
	map.closeInfoWindow();	 	 	 
}

	
//extArray = new Array(".gif", ".jpg", ".png");	
extArray = new Array(".jpg");	
function doUploadFile(form, file) {
	allowSubmit = false;
	if (!file) return;
	while (file.indexOf("\\") != -1){	
		file = file.slice(file.indexOf("\\") + 1);	
	}
	//wphoto=file;
	ext = file.slice(file.indexOf(".")).toLowerCase();
	for (var i = 0; i < extArray.length; i++) {
		if (extArray[i] == ext) { allowSubmit = true; break; }
	}
	
	if (allowSubmit) form.submit();
	else
	alert("Please only upload files that end in types:  " + (extArray.join("  ")));
}