//------------------------------------------------------------GLOBALS	
var map;								//Openelayers map layer
var theMapFile = "/var/www/html/mapstudio/mapstudio.map";	//Path to the map file
var http;
var vlayer;								//Layer that contains the mapping
var rLayer;								//Layer that contains Radials
var baselayer;							//Layer that contains the mapping
var pointLayer = new OpenLayers.Layer.Markers( "Markers" );
var polygonExtentFeature;
var polygonRadialFeature = new Array();
var drawFeatureControl;
var modifyControl;
var zoomScales = new Array(11320000,5660000,2830000,1132000,566000,283000,113200,56600,28300,11320,5660);  
var initialExtent = new Array(1800000,-4000000,3800000,-2400000);
var fullExtent = new Array(0,-5000000,5000000,0);
var baseMapLayers = '20m 10m 5m 2m 1m 500k 200k 100k 50k 20k';
var zoomWidth = 16000
var popup, feature, marker;


var drawPointControl;		
var dragFeatureControl;
var editingLayer;


OpenLayers.Feature.Vector.style['default']['strokeWidth'] = '3';
OpenLayers.Feature.Vector.style['default']['fillColor'] = 'red';
OpenLayers.Feature.Vector.style['default']['strokeColor'] = 'red';
OpenLayers.Feature.Vector.style['default']['fillOpacity'] = '0.3';
OpenLayers.Feature.Vector.style['default']['graphicOpacity'] = '1';
OpenLayers.Feature.Vector.style['select']['strokeWidth'] = '3';
OpenLayers.Feature.Vector.style['select']['fillColor'] = 'red';
OpenLayers.Feature.Vector.style['select']['strokeColor'] = 'red';
OpenLayers.Feature.Vector.style['select']['fillOpacity'] = '0.3';
OpenLayers.Feature.Vector.style['select']['graphicOpacity'] = '1';

//------------------------------------------------------------MAP SETUP

//**************************************Initializes the map

var SHADOW_Z_INDEX = 10;
var MARKER_Z_INDEX = 11;


function initMap(passedCoordinates,passedRadials,passedCenter,userX,userY){
	
	
	
		
		
	//Define graphic map styles
	var layer_style = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
	layer_style.fillOpacity = 0.2;
	layer_style.graphicOpacity = 1;

	//Map extent styles
	mapextenstyle = OpenLayers.Util.extend({}, layer_style);
	mapextenstyle.strokeColor = "#CC0000";
	mapextenstyle.fillColor = "#666666";
	mapextenstyle.strokeWidth = 4;
	//If a map already set destroy it
	if(map != null){
		map.destroy();
	}
		
	//Define the map and relvant options
	map = new OpenLayers.Map( $('plotMap'), { controls: [], 
	//map = new OpenLayers.Map( mapObj, { controls: [], 
		//projection: 'EPSG:2805',    //4326',
		units:'m',  
		maxExtent: new OpenLayers.Bounds(fullExtent[0],fullExtent[1],fullExtent[2],fullExtent[3]), 				
		scales: zoomScales});



	//Create base mapping layer				  
	baselayer = new OpenLayers.Layer.MapServer( "Base",
					"http://www.planvu.co.uk/cgi-bin/mapserv",
					{ map: theMapFile,
					  layers: baseMapLayers}, { singleTile: true, isBaseLayer: true, transitionEffect: 'resize'});				  
	
	editingLayer = new OpenLayers.Layer.Vector(
		"User Marker",
		{
			styleMap: new OpenLayers.StyleMap({
				// Set the external graphic and background graphic images.
				externalGraphic: "images/mapmarker.png",   
				pointRadius: 15
			}),
			rendererOptions: {yOrdering: true}
		}
	);
	
	//Create layer for markers to be drawn on
	map.addLayers([baselayer, pointLayer, editingLayer]);
	map.fractionalZoom = false;
	
	var bounds = new OpenLayers.Bounds(initialExtent[0],initialExtent[1],initialExtent[2],initialExtent[3]);
	if (!map.getCenter()) map.zoomToExtent(bounds);
	 	 
	//Add map controls 
	map.addControl(new OpenLayers.Control.PanZoomBar());
  	map.addControl(new OpenLayers.Control.Navigation());
	
	//Draw point fetaure control
	drawPointControl = new OpenLayers.Control.DrawFeature(editingLayer,OpenLayers.Handler.Point);
	map.addControl(drawPointControl)

	//Add a drag feature control to move point feature around.
    dragFeatureControl = new OpenLayers.Control.DragFeature(editingLayer);
    map.addControl(dragFeatureControl);	  

	//Add user point and store the x-y coordinate
	editingLayer.events.register('featureadded', editingLayer, function(evt) { 
		if(editingLayer.features.length > 0){
			/*var theGeometryasBounds = editingLayer.features[0].geometry.getBounds();
			var centreLatLon = theGeometryasBounds.getCenterLonLat();
			var theX = centreLatLon.lon;
			var theY = centreLatLon.lat; 
			document.getElementById("userX").value = theX;
			document.getElementById("userY").value = theY;*/
			drawPointControl.deactivate();
			dragFeatureControl.activate();
		}
	
	});  
	//Remove any existing points before adding a new one  
	editingLayer.events.register('beforefeaturesadded', editingLayer, function(evt) { 
		if(editingLayer.features.length > 0){
			editingLayer.removeFeatures(editingLayer.features[0]);
		}		
	});

	
	if((userX!="") && (userY!="")){
		//alert("info has been passed")
		userZoom(userX,userY);
	} 
	
	
	
	



	
	//Redraw any passed extent or radials
		if(passedCoordinates != ""){
			alert("Passed Coordinates doesn\'t equal nothing!")
			recreateExtent(passedCoordinates);		
			if(passedRadials != ""){
				addExtent(passedRadials, 'circle');
			}
		}
		
	//Redraw any passed extent or radials
		
		if(passedCenter != ""){
			var centerArray = passedCenter.split("|")
			var cX = Number(centerArray[0])
			var cY = Number(centerArray[1])
			recreatePoint(cX,cY,zoomWidth)		
		}
		
		 

}


function plotMe(){
	if(editingLayer.features.length > 0){
		var theGeometryasBounds = editingLayer.features[0].geometry.getBounds();
		var centreLatLon = theGeometryasBounds.getCenterLonLat();
		var theX = centreLatLon.lon;
		var theY = centreLatLon.lat; 
		document.getElementById("userX").value = theX;
		document.getElementById("userY").value = theY;
		drawPointControl.deactivate();
		dragFeatureControl.activate();
		
		var theName = document.getElementById("name").value;
		var theEmail = document.getElementById("email").value;
		var thePhone = document.getElementById("tel").value;
		var theAddress1 = document.getElementById("address1").value;
		var theAddress2 = document.getElementById("address2").value;
		var theAddressCity = document.getElementById("addressCity").value;
		var theAddressProvince = document.getElementById("addressProvince").value;
		var theUsername = document.getElementById("username").value;
		var thePassword = document.getElementById("password").value;
		var thePointTitle = document.getElementById("pointTitle").value;
		var insertX = theX;
		var insertY = theY;
		
		if(theUsername == ""){
			alert("Please enter your desired username!")
		}else if((theX == "") && (theY == "")){
			alert("Please plot yourself on the map by clicking on your location!")
		}else{
			document.frmSignup.action = "plot-me.php?x="+insertX+"&y="+insertY;
			document.frmSignup.submit()
		}
	}else{
		alert("Please mark your location on the map");
	}
}
function activateTool(){
	drawPointControl.activate();
}




//Function to zoom to the point if a user has included X&Y in URL
function userZoom(theX,theY){

	var shopZoomLevel = 100000
	var theX = theX
	var theY = theY

	var blx = theX - (shopZoomLevel/2);
	var bly = theY - (shopZoomLevel/2);
	var urx = theX + (shopZoomLevel/2);
	var ury = theY + (shopZoomLevel/2);
    
	var zoomCenter = new OpenLayers.LonLat(theX,theY)
	var bounds = new OpenLayers.Bounds(blx,bly,urx,ury);
	
	map.zoomToExtent(bounds);
	map.setCenter(zoomCenter,map.getZoom(),false,false);

	addMarker(theX,theY)

 }


//--Function to add an extent to the map
function addExtent(theSize, theType){
   
 //Get the map centre
 var theMapCentre = map.getCenter(); 
 var centreX = theMapCentre.lon; 
 var centreY = theMapCentre.lat;  
 
 if(theType == "rect"){  
 
  //Remove any existing
  if(polygonExtentFeature != null){
   vlayer.destroyFeatures()
  }
 
  var pointList = [];
  var newPoint = new OpenLayers.Geometry.Point(centreX - (theSize/2),centreY - (theSize/2));
  pointList.push(newPoint); 
  var newPoint = new OpenLayers.Geometry.Point(centreX - (theSize/2),centreY + (theSize/2));
  pointList.push(newPoint);  
  var newPoint = new OpenLayers.Geometry.Point(centreX + (theSize/2),centreY + (theSize/2));
  pointList.push(newPoint);  
  var newPoint = new OpenLayers.Geometry.Point(centreX + (theSize/2),centreY - (theSize/2));
  pointList.push(newPoint);    
  pointList.push(pointList[0]);
  
  var linearRing = new OpenLayers.Geometry.LinearRing(pointList);
  polygonExtentFeature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon([linearRing]),null,mapextenstyle);
 
  vlayer.addFeatures(polygonExtentFeature);
  
  //Zoom to shape
		  var theGeometryasBounds = vlayer.features[0].geometry.getBounds();
		  var theExtentWidth = theGeometryasBounds.getWidth();
		  var theExtentHeight = theGeometryasBounds.getHeight();
		  var centreLatLon = theGeometryasBounds.getCenterLonLat();
		  var theX = centreLatLon.lon;
		  var theY = centreLatLon.lat; 
		  var blx = (theX - (theExtentWidth/2)) - (theExtentWidth/4);
		  var bly = (theY - (theExtentHeight/2)) - (theExtentHeight/4);
		  var urx = (theX + (theExtentWidth/2)) + (theExtentWidth/4);
		  var ury = (theY + (theExtentHeight/2)) + (theExtentWidth/4);
		  var bounds = new OpenLayers.Bounds(blx,bly,urx,ury);
		  map.zoomToExtent(bounds);
 }
 else if(theType=='circle'){
	 
	 //Remove any existing
	 for (i=0;i<polygonRadialFeature.length;i++){
	  if(polygonRadialFeature[i] != null){
	   rlayer.removeFeatures(polygonRadialFeature[i])
	  }
	 }
		
	 if (theSize != 'user'){
		var radialArray = new Array()
		theWidth = vlayer.features[0].geometry.getBounds().getWidth();
		theHeight = vlayer.features[0].geometry.getBounds().getHeight();
		
		
		if (theWidth > theHeight){
			var maxSize = theWidth/2
		}else{
			var maxSize = theHeight/2
		}
		//alert(maxSize)
		var currentSize = Number(theSize)
		
		for(i=0;i<50;i++)	{
			if(currentSize > maxSize){
				break
			}
			radialArray[i] = currentSize
			currentSize += Number(theSize)
		}
	 }else{
		if(document.getElementById('txtRadial').value == ''){
		alert('Please enter a value')
		}else{
	 	var radialArray = document.getElementById('txtRadial').value.split(" ")
			for (i=0; i < radialArray.length; i++){
			radialArray[i] = radialArray[i]*1000
			}
		}
	}
	 
	 for (i=0; i < radialArray.length; i++){
    //alert(radialFeatures[i2])
    var pointList = [];
    for (n=0;n<72;n++){
     strXtemp = (Math.round(((Math.cos((n*5)*(Math.PI/180)))*Number(radialArray[i]))))  + centreX;
     strYtemp = (Math.round(((Math.sin((n*5)*(Math.PI/180)))*Number(radialArray[i]))))  + centreY;
     var newPoint = new OpenLayers.Geometry.Point(strXtemp,strYtemp);
     pointList.push(newPoint);
     
    }
    pointList.push(pointList[0]);   
    var linearRing = new OpenLayers.Geometry.LinearRing(pointList);
    radialArray[i] = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon([linearRing]),null,radialStyle);
	polygonRadialFeature = radialArray
    rlayer.addFeatures(radialArray[i]);
 
   }

 }
}


function recreateExtent(passedCoordinates){	
		vlayer.destroyFeatures()
		var pointList = [];			
		var theCoordArray = passedCoordinates.split(",");		
		for (c=0; c< theCoordArray.length ;c++){
			var theXY =  theCoordArray[c].split(" ");
			var newPoint = new OpenLayers.Geometry.Point(theXY[0],theXY[1]);
			pointList.push(newPoint);
		}				
		//pointList.push(pointList[0]);	
		var linearRing = new OpenLayers.Geometry.LinearRing(pointList);
		polygonExtentFeature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Polygon([linearRing]),null,mapextenstyle);
		vlayer.addFeatures(polygonExtentFeature);
		
		//Zoom to shape
		var theGeometryasBounds = vlayer.features[0].geometry.getBounds();
		var theExtentWidth = theGeometryasBounds.getWidth();
		var theExtentHeight = theGeometryasBounds.getHeight();
		var centreLatLon = theGeometryasBounds.getCenterLonLat();
		var theX = centreLatLon.lon;
		var theY = centreLatLon.lat;	
		var blx = (theX - (theExtentWidth/2)) - (theExtentWidth/4);
		var bly = (theY - (theExtentHeight/2)) - (theExtentHeight/4);
		var urx = (theX + (theExtentWidth/2)) + (theExtentWidth/4);
		var ury = (theY + (theExtentHeight/2)) + (theExtentWidth/4);
		var bounds = new OpenLayers.Bounds(blx,bly,urx,ury);
		map.zoomToExtent(bounds)
	
	}



 
 function destroyMap(){
	vlayer.destroyFeatures()
	rlayer.destroyFeatures()
	map.zoomToMaxExtent();
}

function destroyExtent(){
	vlayer.destroyFeatures()
	rlayer.destroyFeatures()
}


function zoomToPoint(){
	
	var theCoords = document.getElementById("theCoords").value
	//alert(theCoords)
	var coordArray = theCoords.split(",")
	
	var theX = Number(coordArray[0])
	var theY = Number(coordArray[1])
	
	
	//alert("X: " + theX)
	//alert("Y: " + theY)
	
	var blx = theX - (zoomWidth/2);
	var bly = theY - (zoomWidth/2);
	var urx = theX + (zoomWidth/2);
	var ury = theY + (zoomWidth/2);
	
	//alert("blx: " + blx)
	//alert("bly " + bly)
	
	var bounds = new OpenLayers.Bounds(blx,bly,urx,ury);
	map.zoomToExtent(bounds);
	
	//alert(map.getExtent().toString())
	
	var theLoc = document.getElementById("location").value


	document.getElementById("distanceStart").innerHTML = theLoc;

	addMarker(theX,theY)
}

function addMarker(theMarkerX,theMarkerY) {
	var size = new OpenLayers.Size(22,36);
	var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
	var theIcon = new OpenLayers.Icon('http://77.246.172.232/images/mapmarker.png',size,offset);
	
	feature = new OpenLayers.Feature(pointLayer, new OpenLayers.LonLat(theMarkerX,theMarkerY), {icon: theIcon});
	marker = feature.createMarker();
	pointLayer.addMarker(marker);
	
	marker.events.register("click", marker, showPopup); 
}

function showPopup(evt) {
	if (popup == null){
		
		
		var popupHTML = "<div style='height:162px;padding:15px;background-image:url(images/distanceBackground.png);'> \
						Hello! \
						</div>";
		
		
		popup = feature.createPopup(true);
		popup.setContentHTML(popupHTML);
		popup.setBackgroundColor("transparent");
		popup.setBorder("2px solid black");
		//popup.autoSize=true;  
		popup.setOpacity(1);
		pointLayer.map.addPopup(popup);
	}else{
		popup.toggle();
	}
	OpenLayers.Event.stop(evt);
} 

function getUserLoc(userID){
	if(editingLayer.features.length > 0){
		var theGeometryasBounds = editingLayer.features[0].geometry.getBounds();
		var centreLatLon = theGeometryasBounds.getCenterLonLat();
		var theX = centreLatLon.lon;
		var theY = centreLatLon.lat; 
		document.getElementById("userX").value = theX;
		document.getElementById("userY").value = theY;
		drawPointControl.deactivate();
		dragFeatureControl.activate();
		
	
		var theUsername = document.getElementById("username").value;
		var theURL = document.getElementById("web").value;
		var insertX = theX;
		var insertY = theY;
		
		if(theUsername == ""){
			alert("Please enter your desired username!")
		}else if((theX == "") && (theY == "")){
			alert("Please plot yourself on the map by clicking on your location!")
		}else{
			
			document.frmSignup.action = "plot-me.php?x="+insertX+"&y="+insertY+"&userID="+userID;
			document.frmSignup.submit()
		}
	}else{
		alert("Please mark your location on the map");
	}
}








function createMap(){
	if(editingLayer.features.length > 0){
		var theGeometryasBounds = editingLayer.features[0].geometry.getBounds();
		var centreLatLon = theGeometryasBounds.getCenterLonLat();
		var theX = centreLatLon.lon;
		var theY = centreLatLon.lat; 
		document.getElementById("userX").value = theX;
		document.getElementById("userY").value = theY;
		drawPointControl.deactivate();
		dragFeatureControl.activate();
		
	
		var theUsername = document.getElementById("username").value;
		var theURL = document.getElementById("web").value;
		var insertX = theX;
		var insertY = theY;
		
		if(theUsername == ""){
			alert("Please enter your desired username!")
		}else if((theX == "") && (theY == "")){
			alert("Please plot yourself on the map by clicking on your location!")
		}else{
			document.frmSignup.action = "plot-me-noreg.php?x="+insertX+"&y="+insertY;
			document.frmSignup.submit()
		}
	}else{
		alert("Please mark your location on the map");
	}
}


