//<![CDATA[
var map = null;
var geocoder = null;
var markerGroups = { "house": [], "condo": []};
var mgr = null;
var batch = [];
var oldclick=null;
var polyline=null;
var polyline2=null;
//var newbatch = [];
var moved= null;
// this variable will collect the html which will eventually be placed in the side_bar
var markerinfo= [];
var loading = false;
var lookurl='?property_type[]=residential';
// arrays to hold copies of the markers and html used by the side_bar
// because the function closure trick doesnt work there
var gmarkers = [];
var iold = 0;
var gicon = new GIcon();
var bhicon = new GIcon();
var opening = false;
var toWidth = 800;

function Gload() {
    var map = new google.maps.Map(
        document.getElementById('map'), {
          center: new google.maps.LatLng(37.4419, -122.1419),
          zoom: 13,
          mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    map.addControl(new MyCustomControl());
    map.setCenter(new GLatLng(35.58, -82.550), 12);
    // map.addMapType(G_PHYSICAL_MAP);
    // map.addControl(new GMapTypeControl());
    //map.setMapType(G_HYBRID_MAP);
    moved = GEvent.addListener(map, "moveend", function() {updateMap();});

    gicon.image = "/images/mapsearch/map_icon_red.png";
    gicon.iconSize = new GSize(10, 18);
    gicon.iconAnchor = new GPoint(5, 18);
    gicon.infoWindowAnchor = new GPoint(5, 1);

    bhicon.image = "/images/mapsearch/map_icon_black.png";
    bhicon.iconSize = new GSize(10, 18);
    bhicon.iconAnchor = new GPoint(5, 18);
    bhicon.infoWindowAnchor = new GPoint(5, 1);
}

function updateMap() {
    if (loading) {
        return;
    }
    loading = true;
    map.clearOverlays();
    batch = [];
    markerinfo = [];
    map.disableDragging();

    lookurl +='&minimum_latitude='+ map.getBounds().getSouthWest().lat();
    lookurl +='&minimum_longitude='+ map.getBounds().getSouthWest().lng();
    lookurl +='&maximum_latitude='+ map.getBounds().getNorthEast().lat();
    lookurl +='&maximum_longitude='+ map.getBounds().getNorthEast().lng();

    loading = true;
    document.getElementById("busyoverlay").style.visibility = 'visible';
    document.getElementById("searching").style.visibility = 'visible';

    GDownloadUrl("/mapsearch/searchresults?"+lookurl, function(data, responseCode) {
        var xml = GXml.parse(data);
        var markers = xml.documentElement.getElementsByTagName("marker");

        for (var i = 0; i < markers.length; i++) {
	        var point = new GLatLng(
                parseFloat(markers[i].getAttribute("lat")),
                parseFloat(markers[i].getAttribute("lng"))
            );

            var markerinfoin = [];
            markerinfoin['lat'] = markers[i].getAttribute("lat");
            markerinfoin['lng'] = markers[i].getAttribute("lng");
            markerinfoin['upd'] = markers[i].getAttribute("upd");
            markerinfoin['name'] = markers[i].getAttribute("name");
            markerinfoin['city'] = markers[i].getAttribute("city");
            markerinfoin['price'] = markers[i].getAttribute("price");
            markerinfoin['img'] = markers[i].getAttribute("img");
            markerinfoin['beds'] = markers[i].getAttribute("beds");
            markerinfoin['baths'] = markers[i].getAttribute("baths");
            markerinfoin['sqft'] = markers[i].getAttribute("sqft");
            markerinfoin['acre'] = markers[i].getAttribute("acre");
            markerinfoin['bhlisting'] = markers[i].getAttribute("bhlisting");
	        markerinfo.push(markerinfoin);

	        var marker = creatMarker(point,batch.length);
	        map.addOverlay(marker);
	        batch.push(marker);
        }

        createListHTML();
        loading = false;
        map.enableDragging();
        document.getElementById("searching").style.visibility = 'hidden';
        document.getElementById("busyoverlay").style.visibility = 'hidden';
    });
}

function showInfoWin(id) {
	var winhtml="<img src='"+markerinfo[id]['img']+"' class='infowin_img'>";
	winhtml+="<br><span class='infowin_title'>"+markerinfo[id]['name']+", "+markerinfo[id]['city']+"</span><br>";
	winhtml+="<br>List Price:<br><span class='infowin_price'>$"+markerinfo[id]['price']+"</span><br><br>";
	winhtml+="<table class='infowin_table'>";
	winhtml+="<tr><td class='infowin_table_label'>Bedrooms:</td><td class='infowin_table_data'>"+markerinfo[id]['beds']+"</td></tr>";
	winhtml+="<tr><td class='infowin_table_label'>Bathrooms:</td><td class='infowin_table_data'>"+markerinfo[id]['baths']+"</td></tr>";
	winhtml+="<tr><td class='infowin_table_label'>Sq. Ft.:</td><td class='infowin_table_data'>"+markerinfo[id]['sqft']+"</td></tr>";
	winhtml+="<tr><td class='infowin_table_label'>Acreage:</td><td class='infowin_table_data'>"+markerinfo[id]['acre']+"</td></tr>";
	winhtml+="<table>";
	document.getElementById("menu_bar_infowin").innerHTML = winhtml;
	document.getElementById("menu_bar_infowin").style.display = 'inline';
}

function hideInfoWin() {
    document.getElementById("menu_bar_infowin").style.display = 'none';
}

function showSrchWin() {
    document.getElementById("busyoverlay").style.visibility = 'visible';
	document.getElementById("map_overlay").style.visibility = 'visible';
}

function hideSrchWin() {
    document.getElementById("map_overlay").style.visibility = 'hidden';
}

function showDetailWin(id) {
    window.open('/search/detail/'+markerinfo[id]['upd']);
}

function switchOptions(n) {
	switch(n) {
        case 'homes':
            document.getElementById("mhomes").style.display = 'none';
            document.getElementById("lands").style.display = 'none';
            document.getElementById("homes").style.display = 'block';
            break;
        case 'mhomes':
            document.getElementById("homes").style.display = 'none';
            document.getElementById("lands").style.display = 'none';
            document.getElementById("mhomes").style.display = 'block';
            break;
        case 'lands':
            document.getElementById("homes").style.display = 'none';
            document.getElementById("mhomes").style.display = 'none';
            document.getElementById("lands").style.display = 'block';
	}
}



function creatMarker(point,id) {
    if (markerinfo[id]['bhlisting']=='true') {
        var marker = new GMarker(point,bhicon);
    } else {
        var marker = new GMarker(point,gicon);
    }
    GEvent.addListener(marker, "mouseover", function() {showInfoWin(id);});
    GEvent.addListener(marker, "mouseout", function() {hideInfoWin();});
    GEvent.addListener(marker, "click", function() {showDetailWin(id);});
    return marker;
}

function listrowOn(lr,id) {
	lr.style.backgroundColor='#ffff99';
	document.getElementById('timage').src='/images/mapsearch/spinner_on_black.gif';
	intY = lr.offsetTop;
	intX = lr.offsetLeft;
	intY=intY+60;intX=intX+30;
	thmb=document.getElementById('thumbnail');
	thmb.style.left=intX+"px";
	thmb.style.top=intY+"px";
	thmb.style.visibility = 'visible';
	document.getElementById('timage').src=markerinfo[id]['img'];
	var bounds = map.getBounds();
	var mleft = bounds.getSouthWest().lng();
	var mright = bounds.getNorthEast().lng();
	var mbot = bounds.getSouthWest().lat();
	var mtop = bounds.getNorthEast().lat();

	polyline = new GPolyline([
        new GLatLng(markerinfo[id]['lat'], mleft),
        new GLatLng(markerinfo[id]['lat'], mright)
	], "#245580", 4);

	polyline2 = new GPolyline([
        new GLatLng(mtop, markerinfo[id]['lng']),
	    new GLatLng(mbot, markerinfo[id]['lng'])
	], "#245580", 4);

    map.addOverlay(polyline);
    map.addOverlay(polyline2);
}

function listrowOut(lr) {
    lr.style.backgroundColor='#ffffff';
    document.getElementById('thumbnail').style.visibility = 'hidden';
    map.removeOverlay(polyline);
    map.removeOverlay(polyline2);
}

function createListHTML() {
	var lhtml = '';
    var openlink='';

	if (markerinfo.length==100) {
	    lhtml += "<div class='listwarn'>"+openlink+"Showing the first 100 listings only!<br>Zoom in, or <a href='javascript:showSrchWin()'>Refine Your Search</a></div>";
	} else {
	    lhtml += "<div class='listnum'>"+openlink+"Your search found "+markerinfo.length+" listings.<br><a href='javascript:showSrchWin()'>Refine Your Search</a></div>";
	}
	lhtml += "<br style='clear:both'><table class='listtable'>";
	lhtml += "<THEAD><tr class='listhead'><td>Address:</td><td>List Price:</td><td>Beds:</td><td>Baths:</td><td>Sq. Ft:</td><td>Acreage:</td><td>MLS #:</td></tr></THEAD>";

	for (var xx = 0; xx < markerinfo.length; xx++) {
        oldclick=xx;
		lhtml += "<tr class='listrow' onmouseout='listrowOut(this);' onmouseover='listrowOn(this,"+ xx +");' >";
		lhtml += "	<td class='listname'><a href='javascript:showDetailWin("+xx+")'>" + markerinfo[xx]['name'] +"</a></td>";
		lhtml += "	<td class='listprice'>$" + markerinfo[xx]['price'] +"</td>";
		lhtml += "	<td class='listmls'>" + markerinfo[xx]['beds'] +"</td>";
		lhtml += "	<td class='listmls'>" + markerinfo[xx]['baths'] +"</td>";
		lhtml += "	<td class='listmls'>" + markerinfo[xx]['sqft'] +"</td>";
		lhtml += "	<td class='listmls'>" + markerinfo[xx]['acre'] +"</td>";
		lhtml += "	<td class='listmls'>" + markerinfo[xx]['upd'] +"</td>";
		lhtml += "</tr>";
	}
	lhtml += "</table><div id='thumbnail'><img id='timage'></div>";
	document.getElementById("menu_bar").innerHTML = lhtml;
}




function createMarker(point,updid,name,type,desc,link,logo) {
    var marker = new GMarker(point,icon);
    GEvent.addListener(marker, "click", function() {

    });

    // save the info we need to use later for the side_bar
    gmarkers[iold] = marker;
    // add a line to the side_bar html
    if (type==1){house_html += '<div class="menuitems"><a href="javascript:myclick(' + i + ')">' + name + '</a></div>';}
    if (type==2){condo_html += '<div class="menuitems"><a href="javascript:myclick(' + i + ')">' + name + '</a></div>';}
    iold++;
    return marker;
}



function sortDist(a, b) {
    return a[0] - b[0];
}

// This function picks up the click and opens the corresponding info window
function myclick(i) {
    GEvent.trigger(gmarkers[i], "click");
}

function reseticon() {
    if (oldclick!=null) {
        var oimg=gmarkers[oldclick].getIcon().image;
        gmarkers[oldclick].setImage(oimg);
    }
}

function formsubmit(ptype) {
    lookurl = $(ptype).serialize();
    lookurl += '&property_type[]='+ptype;
    lookurl += '&minimum_price='+$('mapsearchform').minimum_price.value;
    lookurl += '&maximum_price='+$('mapsearchform').maximum_price.value;
    hideSrchWin();
    updateMap();
}

function openTable() {
    var delay=50;
    var delm = document.getElementById("menu_bar");
    var width  = parseInt(delm.style.width);

    if (width==898 && !opening) {
        toWidth=230;
    } else if (!opening) {
        toWidth=898;
    }

    var change = toWidth-width;
    var total=width+Math.ceil((change/2));

    if (change==-1) {
        total=width-1;
    }

    delm.style.width=total+'px';

    function c() {
       openTable();
    }

    if(change==0) {
        clearTimeout(timer);opening=false;
        return;
    }

    timer=setTimeout(c,delay);
    opening=true;
}

function toggleGroup(type) {
	if (type=='house') {
        var otype='condo';
    } else {
        var otype='house';
    }

    map.closeInfoWindow();

    for (var i = 0; i < markerGroups[otype].length; i++) {
        var marker = markerGroups[otype][i];
        if (!marker.isHidden()) {
            marker.hide();
        }
      }

    for (var i = 0; i < markerGroups[type].length; i++) {
        var marker = markerGroups[type][i];
        if (marker.isHidden()) {
            marker.show();
        }
    }
    document.getElementById("show"+otype).style.display = "inline";
    document.getElementById("show"+type).style.display = "none";
    document.getElementById("map_current_title").innerHTML = eval(type+"_title");
    document.getElementById("menu_bar").innerHTML = eval(type+"_html");
}

function MyCustomControl()
{
    //
}

//Default constructor for GControl
MyCustomControl.prototype = new GControl(false,false);

// Default location for the control
MyCustomControl.prototype.getDefaultPosition = function() {
    return new GControlPosition(G_ANCHOR_TOP_LEFT,new GSize(5,5));
};

MyCustomControl.prototype.initialize = function(gmapref) {

    var container=gmapref.getContainer();

    var c = document.createElement("div");
    c.innerHTML="<img id='mcontrol' style='border: 0px none ; margin: 0px; padding: 0px; position: absolute; left: 0px; top: 0px; width: 211px; height: 126px;' src='/images/mapsearch/mapcontrols.png'/>";
    c.innerHTML+="<div style='position: absolute; left: 22px; top: 0px; width: 18px; height: 18px; cursor: pointer;' title='Pan up' id='panu'/>";

    c.innerHTML+="<div style='position: absolute; left: 3px; top: 21px; width: 18px; height: 18px; cursor: pointer;' title='Pan left' id='panl'/>";

    c.innerHTML+="<div style='position: absolute; left: 39px; top: 21px; width: 18px; height: 18px; cursor: pointer;' title='Pan right' id='panr'/>";

    c.innerHTML+="<div style='position: absolute; left: 22px; top: 40px; width: 18px; height: 18px; cursor: pointer;' title='Pan down' id='pand'/>";

    c.innerHTML+="<div style='position: absolute; width: 18px; height: 18px; cursor: pointer; left: 21px; top: 69px;' title='Zoom In' id='zin'/>";

    c.innerHTML+="<div style='position: absolute; width: 18px; height: 18px; cursor: pointer; left: 21px; top: 96px;' title='Zoom Out' id='zout'/>";
    c.innerHTML+="<div style='position: absolute; width: 145px; height: 27px; cursor: pointer; left: 60px; top: 15px;' title='Searcht' id='srch'/>";
    container.appendChild(c);
    GEvent.addDomListener($('zout'), "click", function() {map.zoomOut();});
    GEvent.addDomListener($('zin'), "click", function() {map.zoomIn();});
    GEvent.addDomListener($('panl'), "click", function() {map.panDirection('1',  '0');});
    GEvent.addDomListener($('panr'), "click", function() {map.panDirection(-1,  0);});
    GEvent.addDomListener($('panu'), "click", function() {map.panDirection(0,  1);});
    GEvent.addDomListener($('pand'), "click", function() {map.panDirection(0,  -1);});
    GEvent.addDomListener($('srch'), "click", function() {showSrchWin();});
    return c;
}

//]]>