//This is the template for the job search mapped-in pane
//------------------------------------------------------------------------------------------------------------------------------
	var job_search_pane = 	'<div id="job_search_pane">' +
				'<br><div id="logo" align="center">' +
					'<img src="files/mapped-in.gif" alt="Mapped-In" style="border: 1px solid black;"/>' +
				'</div> <br>' +
				'<div class="tab-pane" id="searchPane" align="center">' +							    						    				
					'<div class="tab-page" id="mPage1">' +						
						'<h2 class="tab">Quick Job Search</h2>' +
						'<br>powered by <img src="http://www.indeed.com/p/jobsearch.gif" style="border: 0; vertical-align: middle;" alt="job search">' +
						'<form name="qcSearch" action="javascript:loadQc()">' +
						'<br><b>What:</b> &nbsp;&nbsp;<input type="text" name="what"/>' +
						'&nbsp;&nbsp;&nbsp;&nbsp;' +
						'<b>Where:</b> &nbsp;&nbsp;<input type="text" name="where" />' +
						'&nbsp;&nbsp;&nbsp;&nbsp;' +
						'&nbsp;&nbsp;<input type="button" name="jobs" value="Search Jobs" onClick="javascript:loadQc()"/>' +
						'</form>' +
						'(query? what - c++  where - NY)' +
					'</div>' +
					'<div class="tab-page" id="mPage2">' +
						'<h2 class="tab">Advanced Job Search</h2>' +
						'powered by <img src="http://www.indeed.com/p/jobsearch.gif" style="border: 0; vertical-align: middle;" alt="job search">' +
						'<form name="adSearch" action="javascript:loadAd()">' +
						'<br><b>What:</b> &nbsp;&nbsp;<input type="text" name="what"/>' +
						'&nbsp;&nbsp;&nbsp;&nbsp;' +
						'<b>Where:</b> &nbsp;&nbsp;<input type="text" name="where" />' +
						'&nbsp;&nbsp;&nbsp;&nbsp;' +
						'<br><br><b>Age:</b> &nbsp;&nbsp;<select name="age">' +
									'<option value="30">anytime</option>' +
									'<option value="15">within 15 days</option>' +
									'<option value="7">within 7 days</option>' +
									'<option value="3">within 3 days</option>' +
									'</select>' +
						'&nbsp;&nbsp;&nbsp;&nbsp;' +
						'<b>Display:</b> &nbsp;&nbsp;<select name="display">' +
									'<option value="10">10 per page</option>' +
									'<option value="20">20 per page</option>' +
									'<option value="30">30 per page</option>' +
									'<option value="50">50 per page</option>' +
									'</select>' +
						'&nbsp;&nbsp;&nbsp;&nbsp;' +
						'<b>Sorted by:</b> &nbsp;&nbsp;<select name="sort">' +
									'<option value="date">date</option>' +
									'<option value="relevance">relevance</option>' +
									'</select>' +
						'&nbsp;&nbsp;&nbsp;&nbsp;' +
						'<br><br>&nbsp;&nbsp;<input type="button" name="jobs" value="Search Jobs" onClick="javascript:loadAd()"/>' +
						'</form>' +
						'(query? what-c++, where-NY, Age-30, Display-20, sorted-date)' +
					'</div>' +
				'</div>' ;
				'</div>';
//------------------------------------------------------------------------------------------------------------------------------

    var bird_view_pane = '<div id="BirdViewMap">Loading Bird View</div>';

    //These variables are used for google
    var map;
    var icon;
    var customIcons = [];
    var gmarkers = [];
    var i = 0;
    var img_path = 'png/set1/';
    var t_url;
    var type_url = "&p_type=job"; 
    var pre_url = "proxy.php?p_url=";	
    var post_url = "&format=xml&key=b514e18440264741df940d1ff419a568&latlong=1";

    //template variables for the Dhtml window
    var searchwin;
    var detailed_job_search_result;    
    var side_column = "";
    var bottom_column = "";
    var main_column = "";

    //Variables obtained by parsing the webservices xml file
    var what;	
    var where;
    var totalresults = 0;
    var start = 0;
    var end = 0;
    var jobtitle;
    var company;
    var city;
    var state;
    var country;
    var source;
    var date;
    var snippet;
    var url;
    var lat;
    var lng;

    var count = 0;
    var isQuickSearch = 0;
    var where_value = "";
	


    function myclick(i) {
      GEvent.trigger(gmarkers[i], "click");
    }

    function init() {
      	if (GBrowserIsCompatible()) {
	//Creating a new GMap2 instance
        map = new GMap2(document.getElementById("map"));

	//Setting the Map Center
	map.setCenter(new GLatLng(39.707186656827, -94.5703125), 4);

	//Adding the terrain map type
	map.addMapType(G_PHYSICAL_MAP);

	//Adding all the controls
  	map.addControl(new GZoomControl(
		/* first set of options is for the visual overlay.*/
		{
			nOpacity:.2,
			sBorder:"2px solid red"
		},
		/* second set of options is for everything else */
		{
			sButtonHTML:"<img src='files/zoom-button.gif' />",
			sButtonZoomingHTML:"<img src='files/zoom-button-activated.gif' />",
			oButtonStartingStyle:{width:'24px',height:'24px'}
		}
	));		
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	map.setMapType(G_NORMAL_MAP);
	map.addControl(new GScaleControl());
	map.addControl(new GOverviewMapControl());
	map.enableScrollWheelZoom();
	}
	else {
		alert("Browser is not Compatible. Install a browser which supports javascript!!!");		
	}
    }


    function loadnewSearch() {
	detailed_job_search_result.hide();
	document.qcSearch.what.value = "";
	document.qcSearch.where.value = "";
	document.adSearch.what.value = "";
	document.adSearch.where.value = "";
	start = 0;
	end = 0;
	totalresults = 0;
	searchwin.show();
    }

    function loadSearch() {
	searchwin=dhtmlwindow.open("search", "inline",
	    job_search_pane, "Mapped-In Job Search",
	    "width=600px,height=340px,resize=0,scrolling=0,center=1", "recal")
	searchwin.onclose=function(){ 
		return window.confirm("Are you sure you want to close it?")
	}
    }

    function loadBirdView(lat, lng) {
	alert(lat);
	//GetBirdView(lat, lng);
	birdviewwin=dhtmlwindow.open("birdview", "inline",
	    bird_view_pane, "Bird View",
	    "width=400px,height=400px,resize=0,scrolling=0,center=1", "recal")
	birdviewwin.onclose=function(){ 
		return window.confirm("Are you sure you want to close it?")
	}
    }


    function update_bottom_column(){
  	bottom_column = 'powered by <img src="http://www.indeed.com/p/jobsearch.gif" style="border: 0; vertical-align: middle;" alt="job search">' +
			'<br>Results&nbsp;<b>' + start + '</b>&nbsp;to&nbsp;<b>' + end + '</b>&nbsp;of&nbsp;<b>' + totalresults + '</b>&nbsp;jobs for&nbsp;<b>' + what + '</b><br>' +
			'<a href="javascript:loadPrev()"><b>[prev]</b></a>&nbsp;&nbsp;<a href="javascript:loadNext()"><b>[next]</b></a>' +
			'&nbsp;&nbsp;<a href="javascript:loadnewSearch()"><b>[new search]</b><br><br>';	
    }

    function loadPrev() {
	if(isQuickSearch == 1) {
		if(count > 0) {
			count -= 10;
		} 
		loadQc();
	}
	else {
		if(count > 0) {
			count -= parseInt(document.adSearch.display.value);
		} 
		loadAd();
	}
    }

    function loadNext() {
	if(isQuickSearch == 1) {
		if(count < parseInt(totalresults)) {
			count += 10;
		} 
		loadQc();
	}
	else {
		if(count < parseInt(totalresults)) {
			count += parseInt(document.adSearch.display.value);
		} 
		loadAd();
	}
    }


    function loadQc() {
	isQuickSearch = 1;
    	side_column = "";
    	bottom_column = "";
	map.clearOverlays();
	var q_url = "q=" + document.qcSearch.what.value + "&l=" + document.qcSearch.where.value + "&start=" + count;
	t_url = pre_url + encodeURIComponent(q_url + post_url) + type_url; 
	where_value = document.qcSearch.where.value;
	load(); 
    }

    function loadAd() {
	isQuickSearch = 0;
    	side_column = "";
    	bottom_column = "";
	map.clearOverlays();
	var q_url = "q=" + document.adSearch.what.value + "&l=" + document.adSearch.where.value + "&start=" + count;
	var a_url = "&sort=" + document.adSearch.sort.value + "&limit=" + document.adSearch.display.value + "&fromage=" + document.adSearch.age.value;
	t_url = pre_url + encodeURIComponent(q_url) + encodeURIComponent(a_url) + encodeURIComponent(post_url) + type_url; 
	where_value = document.adSearch.where.value;
	load(); 		
    }

    function load() {
      if (GBrowserIsCompatible()) {
        GDownloadUrl(t_url, function(data) {
          var xml = GXml.parse(data);
	  
	    if (xml.getElementsByTagName("query")[0].lastChild) {
		if(xml.getElementsByTagName("query")[0].firstChild.nodeValue != null) {
	  		what = xml.getElementsByTagName("query")[0].firstChild.nodeValue;
	    	} else { what = "unknown"; }
	    }

	    if (xml.getElementsByTagName("location")[0].lastChild) {
		if(xml.getElementsByTagName("location")[0].firstChild.nodeValue != null) {
	  		where = xml.getElementsByTagName("location")[0].firstChild.nodeValue;
	    	} else { where = "unknown"; }
	    }

	    if (xml.getElementsByTagName("totalresults")[0].lastChild) {
		if(xml.getElementsByTagName("totalresults")[0].firstChild.nodeValue != null) {
	  		totalresults = xml.getElementsByTagName("totalresults")[0].firstChild.nodeValue;
	    	} else { totalresults = 0; }
	    }

	    if (xml.getElementsByTagName("start")[0].lastChild) {
		if(xml.getElementsByTagName("start")[0].firstChild.nodeValue != null) {
	  		start = xml.getElementsByTagName("start")[0].firstChild.nodeValue;
	    	} else { start = 0; }
	    }
	  
	    if (xml.getElementsByTagName("end")[0].lastChild) {
		if(xml.getElementsByTagName("end")[0].firstChild.nodeValue != null) {
	  		end = xml.getElementsByTagName("end")[0].firstChild.nodeValue;
	    	} else { end = "unknown"; }
	    }
	
	  update_bottom_column();

          var results = xml.documentElement.getElementsByTagName("result");
          for (var i = 0; i < results.length; i++) {
	    if (results[i].getElementsByTagName("jobtitle")[0].lastChild) {
	    	if(results[i].getElementsByTagName("jobtitle")[0].firstChild.nodeValue != null) {
			jobtitle = results[i].getElementsByTagName("jobtitle")[0].firstChild.nodeValue;
	    	} else { jobtitle = "unknown"; }
	    }
	    if (results[i].getElementsByTagName("company")[0].lastChild) {
	    	if( results[i].getElementsByTagName("company")[0].firstChild.nodeValue != null  ) {
			company = results[i].getElementsByTagName("company")[0].firstChild.nodeValue;
	    	} else { company = "unknown"; }           
	    }
	    if (results[i].getElementsByTagName("city")[0].lastChild) {
	    	if(results[i].getElementsByTagName("city")[0].firstChild.nodeValue != null) {
			city = results[i].getElementsByTagName("city")[0].firstChild.nodeValue;
	    	} else { city = "unknown"; }
	    }
	    if (results[i].getElementsByTagName("state")[0].lastChild) {
	    	if(results[i].getElementsByTagName("state")[0].firstChild.nodeValue != null) {
			state = results[i].getElementsByTagName("state")[0].firstChild.nodeValue;
	    	} else { state = "unknown"; }
	    }
	    if (results[i].getElementsByTagName("country")[0].lastChild) {
	    	if(results[i].getElementsByTagName("country")[0].firstChild.nodeValue != null) {
			country = results[i].getElementsByTagName("country")[0].firstChild.nodeValue;
	    	} else { country = "unknown"; }
	    }
	    if (results[i].getElementsByTagName("source")[0].lastChild) {
	    	if(results[i].getElementsByTagName("source")[0].firstChild.nodeValue != null) {
			source = results[i].getElementsByTagName("source")[0].firstChild.nodeValue;
	    	} else { source = "unknown"; }
 	    }
	    if (results[i].getElementsByTagName("date")[0].lastChild) {
	    	if(results[i].getElementsByTagName("date")[0].firstChild.nodeValue != null) {
			date = results[i].getElementsByTagName("date")[0].firstChild.nodeValue;
	    	} else { date = "unknown"; }
	    }
	    if (results[i].getElementsByTagName("snippet")[0].lastChild) {
	    	if(results[i].getElementsByTagName("snippet")[0].firstChild.nodeValue != null) {
			snippet = results[i].getElementsByTagName("snippet")[0].firstChild.nodeValue;
	    	} else { snippet = "unknown"; }
	    }
	    if (results[i].getElementsByTagName("url")[0].lastChild) {
	    	if(results[i].getElementsByTagName("url")[0].firstChild.nodeValue != null) {
			url = results[i].getElementsByTagName("url")[0].firstChild.nodeValue;
	    	} else { url = "unknown"; }
	    }
	    lat = parseFloat(results[i].getElementsByTagName("latitude")[0].firstChild.nodeValue);
	    lng = parseFloat(results[i].getElementsByTagName("longitude")[0].firstChild.nodeValue);

            var point = new GLatLng(parseFloat(results[i].getElementsByTagName("latitude")[0].firstChild.nodeValue),
                                    parseFloat(results[i].getElementsByTagName("longitude")[0].firstChild.nodeValue));
	    if( parseFloat(results[i].getElementsByTagName("latitude")[0].firstChild.nodeValue) == 0 && parseFloat(results[i].getElementsByTagName("longitude")[0].firstChild.nodeValue) == 0 ) {
		continue;
	    }
	    var img_file = 'iimm2-red.png';
	    var shdw_file = "iimm2-shadow.png";
	    icon = new GIcon();
	    icon.image = img_path + img_file;
	    icon.shadow = img_path + shdw_file;
	    icon.iconSize = new GSize(32, 32);
	    icon.shadowSize = new GSize(32, 32);
	    icon.iconAnchor = new GPoint(16, 16);
	    icon.infoWindowAnchor = new GPoint(10, 0);


            var marker = createMarker(point, jobtitle, company, city, state, country, source, date, snippet, url, icon);
            map.addOverlay(marker);
            bounds.extend(point);	     
          }
	    map.setZoom(map.getBoundsZoomLevel(bounds));            
	    map.setCenter(bounds.getCenter());	   

	    searchwin.hide();
	    detailed_job_search_result=dhtmlwindow.open("Results", "inline",
		bottom_column, "Job Search Results",
		"width=340px,height=400px,resize=1,scrolling=1,center=0,left=50px, top=100px", "recal")
		detailed_job_search_result.onclose=function(){ 
			return window.confirm("Are you sure you want to close it?")
		}
            });
      }
    }

    function createMarker(point, jobtitle, company, city, state, country, source, date, snippet, url, icon) {      
      customIcons[i] = icon;
      var marker = new GMarker(point, icon);
      var html      = '<div id="m_job" style="font-family:Verdana, Helvetica, Arial; font-size:10px;" align="left">' +
		      '<a href="' + url + '" target="_blank"><b>' + jobtitle + '</b> </a>' + 
		      '<br><b>company:&nbsp</b>' + company +
		      '<br><b>Location:&nbsp</b>' + city + ',' + state + ',' + country + 
		      '<br><b>Source:&nbsp</b>' + source +
		      '<br><b>Date:&nbsp</b>' + date;
		      //'<br><a href="javascript:loadBirdView(lat,lng)" onclick=javascript:loadBirdView(lat,lng)>bird view</a>';

      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
      });
      gmarkers[i] = marker;
      side_column += '<img src="png/icons/building.png"/> &nbsp; <a href="javascript:myclick(' + i + ')"><b>' + jobtitle + '</b> </a> &nbsp; [' + company + ']<br><br>';
      bottom_column += '<a href="javascript:myclick(' + i + ')"><b>' + jobtitle + '</b> </a>' + 
		      '<br><b>company:&nbsp</b>' + company +
		      '<br><b>Location:&nbsp</b>' + city + ',' + state + ',' + country + 
		      '<br><b>Source:&nbsp</b>' + source +
		      '<br><b>Date:&nbsp</b>' + date +
		      '<br><b>Description:&nbsp</b>' + snippet + 
		      '<br><b>Link:&nbsp</b><a href="' + url + '" target="_blank">' + 'click here' + '</a>' +
		      '<br><a href="http://www.indeed.com/salary?q1=' + jobtitle + '&l1=' + where_value + '" target="_blank">[salary trend]</a>' +
		      '&nbsp;&nbsp;<a href="http://www.indeed.com/jobtrends?q=' + jobtitle + '&l=' + where_value + '" target="_blank">[job trend]</a><br><br>'; 
      i++;
      return marker;
    }