	//function called on body onLoad to load basic Map in the div
	var Ship_Icon = new GIcon();
    Ship_Icon.image = icon_ship;
    Ship_Icon.iconSize = new GSize(32,32);
    Ship_Icon.iconAnchor = new GPoint(16,11);
    Ship_Icon.infoWindowAnchor = new GPoint(7,7);


  //function to list the form data(Ship Lines of a cruise Line) below the Map
	function page_list(pg)
	{
		var scrt=document.list_ships.sortcrt.value;
		var sorder=document.list_ships.sortorder.value;	
		var cruise_id = document.list_ships.cruise_id.value;
		var lat = document.list_ships.lat.value;
		var lng = document.list_ships.lng.value;

	
		document.list_ships.pagenum.value=pg;

		var parameters='';
		//-------Variables for searching by id---------//
	//	if(cpaging!='' && cpaging!=undefined) parameters= parameters+"&paging="+cpaging;
		if(cruise_id!='' && cruise_id!=undefined) parameters= parameters+"&cruise_id="+cruise_id;
		if(scrt!='' && scrt!=undefined) parameters= parameters+"&sortcrt="+scrt;
		if(sorder!='' && sorder!=undefined) parameters= parameters+"&sortorder="+sorder;

		//alert(parameters);

		callAjax( "ship_listing", "ajax/getShipListing.php", {
		params:"pagenum="+pg+"&"+parameters+"&rand="+Math.random(),
		meth:"post",
		async:true,
		startfunc:"",
		endfunc:"",
		errorfunc:"" }
		);
	}


	// global arrays to hold copies of the markers and html used by the Name of 'Ship Line'
	var gmarkers = [];
    var htmls = [];
	var closers = [];

	// This function picks up the click on the name of "Ship Line"
    function myclick(i) {

	  gmarkers[i].openInfoWindowTabsHtml([new GInfoWindowTab("Description",htmls[i]), new GInfoWindowTab("Get Closer",closers[i])],{maxWidth:350,autoScroll:true});
    }

	//function to list the form Right Panel(AOI near it - in the bounds of the map)
	function list_AOI()
	{
		var northlat = document.list_ships.northlat_area.value;
		var southlat = document.list_ships.southlat_area.value;
		var northlng = document.list_ships.northlng_area.value;
		var southlng = document.list_ships.southlng_area.value;
		var cruise_id = document.list_ships.cruise_id.value;

		var params_AOI = '';
		if(northlat!='' && northlat!=undefined) params_AOI= params_AOI+"Nlat="+northlat;
		if(southlat!='' && southlat!=undefined) params_AOI= params_AOI+"&Slat="+southlat;
		if(northlng!='' && northlng!=undefined) params_AOI= params_AOI+"&Nlng="+northlng;
		if(southlng!='' && southlng!=undefined) params_AOI= params_AOI+"&Slng="+southlng;
		if(cruise_id!='' && cruise_id!=undefined) params_AOI= params_AOI+"&cruise_id="+cruise_id;

		callAjax( "AOI_display", "codelibrary/inc/area_interests_ships.php", {
		params:params_AOI+"&rand="+Math.random(),
		meth:"post",
		async:true,
		startfunc:"",
		endfunc:"",
		errorfunc:"" }
		);
	}


//function called on Load of the Map so that Port is located on it, param shows the thing to be displayed maybe a Port or an AOI
    function load_Ship(filename) 
	{
		var lat = document.list_ships.lat.value;
		var lng = document.list_ships.lng.value;
        var zoom_level = parseInt(document.list_ships.zoom_level.value);

		 if (GBrowserIsCompatible()) {
    		var map = new GMap2(document.getElementById("map"));
	        map.addControl(new GLargeMapControl());
		    map.addControl(new GMapTypeControl());	
			map.addControl(new GScaleControl()); 
			map.setCenter(new GLatLng(lat,lng), zoom_level);
		
			plot_points_dynamic(filename,map);
			GEvent.addListener(map, "moveend", function(){plot_points_aoi(filename,map);});	 
		
      }
    }

	var bounds=null;
	bounds = new GLatLngBounds(); 

	//function to plot the port on the Map
	function plot_points_dynamic(filename,map)
	{
		

			var marker_id = document.list_ships.marker_id.value;
			


			var pg = document.list_ships.pagenum.value;
			page_list(pg); //Call the function to list all the data on the top
			
			GDownloadUrl(filename, function(data) {	
		    var xml = GXml.parse(data);
		    var markers = xml.documentElement.getElementsByTagName("marker");
          //  var markers_aoi = xml.documentElement.getElementsByTagName("marker_aoi");
			map.clearOverlays();  //get rid of existing markers
			for (var i = 0; i < markers.length; i++) 
			{
				var id = markers[i].getAttribute("id");
				var cruise_line = markers[i].getAttribute("cruise_line");
				var ship_line = markers[i].getAttribute("ship_line");
				var country_name = markers[i].getAttribute("country_name");
				var port_name = markers[i].getAttribute("port_name");
				var lat = markers[i].getAttribute("lat");
				var lng = markers[i].getAttribute("lng");
				var shipid = markers[i].getAttribute("shipid");
				var cruiseid = markers[i].getAttribute("cruiseid");
				var point = new GLatLng(parseFloat(lat),parseFloat(lng));
			 	var marker = createMarker(id,point,cruise_line, ship_line, port_name, country_name,cruiseid,shipid);
				map.addOverlay(marker);
				bounds.extend(point);
				zoom_level_bound = map.getBoundsZoomLevel(bounds);
				map.setCenter(bounds.getCenter(), zoom_level_bound);
          }

        });
	}
	
	//Plot Ship Marker
    function createMarker(id,point,cruise_line,ship_line, port_name,country_name,cruiseid,shipid) 
	{

		var marker = new GMarker(point, Ship_Icon);
	    //Description tab starts
		 var html = description_tab_ship(ship_line, cruise_line, port_name, country_name,cruiseid,shipid); 
    	//Description tab ends

		//Get Closer Tab starts
		var closer =  get_closer_tab_ship(ship_line, country_name, "ship",cruiseid,shipid);
		//Get Closer Tab ends

	    GEvent.addListener(marker, 'click', function() {
		marker.openInfoWindowTabsHtml([new GInfoWindowTab("Description",html), new GInfoWindowTab("Get Closer",closer)],{maxWidth:350,autoScroll:true});
    //   marker.openInfoWindowHtml(html);

      });

	  gmarkers[id] = marker;
      htmls[id] = html;
	  closers[id] = closer;
      return marker;
    }


	function plot_points_aoi(filename,map)//function to plot the AOI's on the Map
	{
			//get the viewing area of the map...to be used to plot the List the AOI's under it
	        var bounds_map = map.getBounds();
			var NE = bounds_map.getNorthEast();
			var SW = bounds_map.getSouthWest();

			var Nlat = NE.lat();
			var Slat = SW.lat();
			var Nlng = NE.lng();
			var Slng = SW.lng();

//		alert(bounds.GetMidpoint(map));
			var new_center = bounds_map.getCenter(); //called to populate the lat , lng on the main form so that the center is changed on load of the Map
			newlat = new_center.lat();
			newlng = new_center.lng();
			document.list_ships.lat.value = newlat;
			document.list_ships.lng.value = newlng;

			marker_id = document.list_ships.marker_id.value;
			var param = "&id="+marker_id+"&Nlat="+Nlat+"&Slat="+Slat+"&Nlng="+Nlng+"&Slng="+Slng;
			var filename = filename+param+"&rand="+Math.random();

			document.list_ships.northlat_area.value = Nlat;
			document.list_ships.southlat_area.value = Slat;
			document.list_ships.northlng_area.value = Nlng;
			document.list_ships.southlng_area.value = Slng;	
			document.list_ships.zoom_level.value = map.getZoom();
			list_AOI(); 

			 GDownloadUrl(filename, function(data) {	
			 var xml = GXml.parse(data);
		     var markers_aoi = xml.documentElement.getElementsByTagName("marker_aoi");
		
		
		  for (var i = 0; i < markers_aoi.length; i++) 
		  {
				var id = markers_aoi[i].getAttribute("id");
				var name = markers_aoi[i].getAttribute("name");
				var description = markers_aoi[i].getAttribute("description");
				var address = markers_aoi[i].getAttribute("address");
				var type = markers_aoi[i].getAttribute("type");
				var point = new GLatLng(parseFloat(markers_aoi[i].getAttribute("lat")),
										parseFloat(markers_aoi[i].getAttribute("lng")));
			
				var marker = createMarkerAOI(id,point, name,description , address, type);
				map.addOverlay(marker);
			
		  }
        });

	}

		

	//Plot AOI marker
	function createMarkerAOI(id,point, name,description,address, type) {
	  var marker = new GMarker(point, customIcons[type]);

	//description tab info ends here
	 var html = description_tab_aoi(name, address, description); 
	//Description tab info starts here
	
		//Get Closer Tab starts
		var closer =  get_closer_tab(name, address, "aoi");
		//Get Closer Tab ends

    GEvent.addListener(marker, 'click', function() {
  marker.openInfoWindowTabsHtml([new GInfoWindowTab("Description",html), new GInfoWindowTab("Get Closer",closer)],{maxWidth:350,autoScroll:true});
        //marker.openInfoWindowHtml(html);

      });

	  
      return marker;
    }
   //]]>