// Padillatech.com 2007

function Confirm(observations){
	var _self = this;
	var popup = null;
	var numObs = observations.observations.length;
	
	if(_self.numObs <= 0){
		return;
	}
	//member variables used to create the html table markup
	var myTable = $(document.createElement('table')).addClass("phase_table").css({'font-size':'8pt'});
	var thead = $(document.createElement('thead'));
	var tbody = $(document.createElement('tbody'));
	var myContainer = $(document.createElement('div'));
	var content = $(document.createElement('div')).attr('id', 'confirm').addClass('ui-corner-all').css({'padding':'10px', 'border':'1px solid #999', 'margin':'5px auto'});
	var header = $(document.createElement('h4')).addClass('head').html("&nbsp;");
	var close = $(document.createElement('img')).attr({'src':'images/close.png'}).css({'float':'left', 'cursor':'pointer'}).click(function(){
							try{
								popup.close();
							}catch(e){}
						});
	myContainer.append(header.append(close)).append(content);
	
	//////////////////////// Construct the confirm box \\\\\\\\\\\\\\\\\\\\\\\\\\\
	var row = $(document.createElement('tr'));
		
	row.html('<th><b>art</b></th><th><div><b>vetenskapligt namn</b></div></th><th><b>fas namn</b></th><th><b>datum</b></th><th><b>latitud</b></th><th><b>longitud</b></th><th><b>Observationsplatsens namn</b></th><th><b>Observatör</b></th><th></th>');
	
	thead.append(row);
	
	for(var index = 0; index < numObs; index++){
		tbody.append(createConfirmRowData(observations.observations[index]));
	}
	
	row = $(document.createElement('tr'));
	data = $(document.createElement('td'));
	
	data.attr('colspan', '9');

	//////// Submit button \\\\\\\\\\	
	var input = $(document.createElement('input')).attr({'type':'button'}).val('Skicka in observation(er)').click(function(){
		setTimeout(function(){popup.close();  observations.submit(); }, 400);
	}).button().css({'font-size':'8pt', 'padding':'2px', 'cursor':'pointer', 'margin':'5px'});
	
	data.append(input);	
	
	//  Return to go back and add more \\
	input = $(document.createElement('input')).attr({'type':'button'}).val('Tillbaka').click(function(){
		setTimeout(function(){popup.close();  showSelect()}, 210);  
	}).button().css({'font-size':'8pt', 'padding':'2px', 'cursor':'pointer', 'margin':'5px'});
	
	//put it all together
	data.append(input);
	row.append(data);
	tbody.append(row);
	myTable.append(thead);
	myTable.append(tbody);
	content.append(myTable);
	
	popup = myContainer.popup({classname:'ui-corner-top box ui-dialog ui-widget-content', handle:'.head', modal:true}).data('popup');
	popup.show();
	
	
/********************************** Confirm's Methods Below *************************************/	

	function edit(obj){
		var index = obj.sectionRowIndex;
		try{
			observations.observations[index].edit();
		}catch(e){console.log(e);}
		observations.removeObservation(index);
		setTimeout(function(){
								popup.close();
								showSelect();
							}, 210);
	}
	
	function remove(row){
		var index = row.sectionRowIndex;
		
		if(observations.observations.length == 1){ 
			setTimeout(function(){popup.close(); showSelect();}, 210);  
		}
		
		$(row).remove();
		observations.removeObservation(index);
	}	
	
	function createConfirmRowData(observation){
		if(!observation) return document.createElement('tr');
		
		row = $(document.createElement('tr'));
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.mySpecies.commonName+"</div>");
		row.append(data);
		
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.mySpecies.latinName+"</div>");
		row.append(data);
		
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.myPhenology.tostring()+"</div>");
		row.append(data);
		
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.myDate.tostring()+"</div>");
		row.append(data);
	
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.myLocation.latitudeInitVal+"</div>");
		row.append(data);
		
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.myLocation.longitudeInitVal+"</div>");
		row.append(data);
		
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.myLocation.myNameInitVal+"</div>");
		row.append(data);
		
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		data.html("<div>"+observation.myObserver+"</div>");
		row.append(data);
		
		data = $(document.createElement('td')).css('border-top','1px solid #666');
		var link = $(document.createElement('a')).button().text('Korrigera').click(function(){
			edit(this.parentNode.parentNode);
		}).css({'font-size':'8pt', 'padding':'2px', 'cursor':'pointer', 'margin':'5px'});
		data.append(link);
		
		link = $(document.createElement('a')).button().text('Radera').click(function(){
			remove(this.parentNode.parentNode);
		}).css({'font-size':'8pt', 'padding':'2px', 'cursor':'pointer', 'margin':'5px'});
		data.append(link);
		
		/*
		if(numObs > 1){
			link = $(document.createElement('a')).button().text('Se omgivande observationer').click(function(){
				new Popup(new MapBox(this, observation.observations))};
			data.append(link);
		}*/
		row.append(data);
		return row;
	}
	
	function createConfirmRowControls(){}
}

//used to create thank you as an h1 html element
function TY(){
	var container = $(document.createElement('div'));
	var head = $(document.createElement('h4')).html("&nbsp;");
	var content = $(document.createElement('div')).text('Tack för dina uppgifter!').addClass('ui-corner-all').css({'padding':'10px', 'border':'1px solid #999', 'margin-top':'5px', 'font-size':'18pt', 'font-weight':'500'});
	
	container.append(content);
	return container;
}

//returns an html div element that contains a thank you object and a mapBox  
function TYmap(){
	var observation = myObservations.observations[0];
	var container = $(document.createElement('div'));
	var mapContainer = $(document.createElement('div'));
	var map = mapContainer.displayMap().data('displayMap');
	
	var icon = new GIcon();
	icon.image = "images/mm_20_red.png";
	icon.shadow = "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);
	var point = new GLatLng(observation.myLocation.latitudeInitVal*1, observation.myLocation.longitudeInitVal*1);
	
	container.html("<h1 class='head'>Tack för dina uppgifter!</h1>");
	container.append(mapContainer);
	mapContainer.css('margin','10px auto');
	
	var mapIndicator = mapContainer.indicator().data('indicator');
	var today = new Date();
	var year = today.getFullYear();
	var dateRange = year+"-01-01,"+year+"-12-31";
	var phases = observation.myPhenology.tostring().split(',');
	var newPhases = "";
	for(var i=0; i < phases.length; i++){
		if(newPhases != "")
			newPhases += ",";
		newPhases += "'"+phases[i]+"'";	
	}
	try{
		if(mapIndicator) mapIndicator.start();
	}catch(e){}
	$.get('backend/DataPoints.php?', "species='"+escape(observation.mySpecies.latinName)+"'&phases="+encodeURIComponent(newPhases)+"&dateRange="+escape(dateRange), 
		function(info){	
			try{
				if(!info) { if(mapIndicator) mapIndicator.stop();}
				info = eval('('+info+')');
				createDataStreams(info, map, null);
				setTimeout(function(){if(mapIndicator) mapIndicator.stop();}, info.length);
			}catch(e){
				//console.log(e);
				//alert("There was a problem with the request please try again.");
			}
			
			map.addPoint(point, icon, "Observationsplatsens namn: "+observation.myLocation.myNameInitVal+"<br/>Latitud: "+observation.myLocation.latitudeInitVal+"<br/>Longitud: "+observation.myLocation.longitudeInitVal);
			map.zoomOnPoint(point, 8);
		});
	return container;
}	

function createDataStreams(data, displayMap, legend){
	if(!data) return;
	var icon_images = ["images/mm_20_purple.png", 
						"images/mm_20_red.png", 
						"images/mm_20_green.png", 
						"images/mm_20_blue.png", 
						"images/mm_20_gray.png", 
						"images/mm_20_brown.png",
						"images/mm_20_orange.png",
						"images/mm_20_white.png",
						"images/mm_20_yellow.png"
						];
	var streams = [];
	var datastreams = [];
	var index = 1;
	for(var i=0; i<data.length; i++){
		if(!streams[data[i].latinName]){
			streams[data[i].latinName] = index;
			streams[index-1] = [];
			
			index++;
		}
		
		var val = streams[data[i].latinName] -1;
		var html = "datum: "+data[i].date + "<br> observat&ouml;r: "+ unescape(data[i].username)+"<br> plats: "+ data[i].location;
		data[i]['info'] = html;
		streams[val].push(data[i]);
	}
	
	displayMap.clearMarkers();	
	if(legend) legend.clear();
	for(var k=0; k<streams.length; k++){
		var ds = $(document.createElement('div')).displayMapDataStream({displayMap:displayMap, iconImagePath:icon_images[(k%9)], iconShadowPath:"images/mm_20_shadow.png", dataPoints:streams[k]}).data('displayMapDataStream');
		if(legend) legend.addItem("<li><img src='"+icon_images[(k%9)]+"'/>"+streams[k][0].latinName+"</li>");
	}
	if(streams.length > 0 && legend){
		$("#legend").show();
	}
	return datastreams;	
}