// Display Functions
var browser;
var toolbar_dir = image_dir+'toolbar/';
var toolwindow_dir = image_dir+'toolwindow/';
var toolbar_buttons = new Object;
var homePos = new GLatLng(homelat, homelng); 
var map = null;
var geocoder = null;
var gmarkers=[];
var gmarker_pos = 0;
var apticon;
var desticon;
var currentDest="Center of Campus";
toolbar_buttons['lease'] = new tbbutton('lease', 'Lease Information');
toolbar_buttons['basics'] = new tbbutton('basics', 'Apartment Basics');
toolbar_buttons['features'] = new tbbutton('features', 'Apartment Features');
toolbar_buttons['tools'] = new tbbutton('tools', 'Other Tools');	

function page_init() {
	browser = navigator.appName;
}

var fadeInSuggestion = function(suggestionBox, suggestionIframe) {
	$(suggestionBox).fadeTo(300,0.6);
};

var fadeOutSuggestion = function(suggestionBox, suggestionIframe) {
	$(suggestionBox).fadeTo(300,0);
};

var destLabel = function(data) {
	$('#destination_label').html('of <strong>' + data.value + '</strong>');
	currentDest = data.value;
	$('#dest_lat').val(data.lat);
	$('#dest_lng').val(data.lng);
	sendRequest(1);
};

function sendRequest($page) {
	var lat = $('#dest_lat').val();
	var lng = $('#dest_lng').val();

	$.post(base_url + 'search/getApts/', {
			page : $page,
			landlord : $('#landlord').val(),
			lease_type :$('#lease_type').val(),
			lease_avail :$('#lease_avail').val(),
			rent_min :$('#rent_min').val(),
			rent_max :$('#rent_max').val(),
			bedrooms_min :$('#bedrooms_min').val(),
			bedrooms_max :$('#bedrooms_max').val(),
			bathrooms_min :$('#bathrooms_min').val(),
			bathrooms_max :$('#bathrooms_max').val(),
			distance :$('#distance_val').val(),
			travel_mode :$('#travel_mode').val(),
			dest_lat :lat,
			dest_lng :lng
			}, function(response){
		$('#status_loader').show();
		$('#status_text').text('Status: Processing...');
		document.getElementById('results_iframe').contentWindow.writeApts(response);
		$('#status_loader').hide();
		$('#status_text').text('Status: Finished');
    });
	
	// alert($('#landlord').val() + ', ' + $('#lease_type').val() + ', ' + $('#lease_avail').val() + ', ' + $('#rent_min').val() + ', ' + $('#rent_max').val() + ', ' + $('#bedrooms_min').val() + ', ' + $('#bedrooms_max').val() + ', ' + $('#bathrooms_min').val() + ', ' + $('#bathrooms_max').val() + ', ' + $('#distance_val').val() + ', ' + $('#dest_lat').val() + ', ' + $('#dest_lng').val());
}

$(document).ready(function() {
	//init state
	tbClick('basics');
	$('#tools_content').show();//hack for it to show up in safari
	$('#toolbar_left').addClass('toolbar_left_open');
	$('#loader').hide();

	//set lat lng
	$('#dest_lat').val(homelat);
	$('#dest_lng').val(homelng);
	$('#destination').focus(function() { if($('#destination').val() == 'Center of Campus') $('#destination').val(''); });
	
	//toolbar stuff--------------------------------------------------------------------------------------------
	//buttons on click
	$('#button_lease').click(function(){ tbClick('lease'); });
	$('#button_basics').click(function(){ tbClick('basics'); });
	$('#button_features').click(function(){ tbClick('features'); });
	$('#button_tools').click(function(){ tbClick('tools'); });
	
	//buts on mouseovers
	$('#button_lease').hover(function(){ tbMouseOver('lease'); }, function(){ tbMouseOut('lease'); });
	$('#button_basics').hover(function(){ tbMouseOver('basics'); }, function(){ tbMouseOut('basics'); });
	$('#button_features').hover(function(){ tbMouseOver('features'); }, function(){ tbMouseOut('features'); });
	$('#button_tools').hover(function(){ tbMouseOver('tools'); }, function(){ tbMouseOut('tools'); });

	$('#status_loading').ajaxStart(function() {
		$(this).show();
		$('#status_text').text('Status: Loading...');
	}).ajaxStop(function() {
		$(this).hide();
		$('#status_text').text('Status: Finished');
	}).hide();
	
	$('#toolbar_left').dblclick(function() { 
		$('#toolbar_center').SlideToggleRight('fast');
		document.getElementById('button_toolbar_left').src = image_dir+'toolbar/toolbar_bg_left_closed.png';
		$('#toolwindow').hide();
		tbCloseAll();
	});
	
	$('#collapse_tools').click(function() {
		$('#toolbar_center').SlideToggleRight('fast');
		document.getElementById('button_toolbar_left').src = image_dir+'toolbar/toolbar_bg_left_closed.png';
		$('#toolwindow').hide();
	});
	
	//icon stuff-----------------------------------------------------------------------------------------
	apticon = new GIcon();
	apticon.image = image_dir+"markers/apt.png";
	apticon.shadow = image_dir+"markers/shadow.png";
	apticon.iconSize = new GSize(21, 31);
	apticon.shadowSize = new GSize(52, 29);
	apticon.iconAnchor = new GPoint(8, 31);
	apticon.infoWindowAnchor = new GPoint(18, 3);
	desticon = new GIcon();
	desticon.image = image_dir+"markers/dest.png";
	desticon.shadow = image_dir+"markers/shadow.png";
	desticon.iconSize = new GSize(21, 31);
	desticon.shadowSize = new GSize(52, 29);
	desticon.iconAnchor = new GPoint(8, 31);
	desticon.infoWindowAnchor = new GPoint(18, 3);
	
	//toolwindow stuff-----------------------------------------------------------------------------------------
	$('#lease_type').change(function() { 
		$('#lease_type_label').html('a <strong>' + $('#lease_type').val() + '</strong>'); 
		sendRequest(1); });
	$('#lease_avail').change(function() { 
		$('#lease_avail_label').html('starting in <strong>' + $('#lease_avail').val() + '</strong>');
		sendRequest(1); });
	$('#landlord').change(function() { sendRequest(1); });
	$('#travel_mode').change(function() { sendRequest(1); });
	
	$('.rent_slider').Slider({
		accept : '.rent_indicator',
		restricted: false,
		opacity: 0.9,
		onSlide : function(procx, procy, x, y) {
			price = parseInt((parseInt(1000 * procx/100))/25) * 25;
			if(this.SliderIteration == 0) {
				$('#rent_max').val(price+'');
				$("#rent_max_label").html(price+'');
			} else {
				$('#rent_min').val(price+'');			
				$("#rent_min_label").html(price+'');
			}
		},
		onChange : function() { sendRequest(1); }, 
		values: [
			[115,0],
			[0,0]
		]
	});
	
	$('.bedrooms_slider').Slider({
		accept : '.bedrooms_indicator',
		restricted: false,
		fractions:14,
		opacity: 0.9,
		onSlide : function(procx, procy, x, y) {
			amt = parseInt(procx/7) + 1;
			if(this.SliderIteration == 0) {
				$('#bedrooms_max').val(amt+'');
				$("#bedrooms_max_label").html(amt+'');
			} else {
				$('#bedrooms_min').val(amt+'');			
				$("#bedrooms_min_label").html(amt+'');
			}
		},
		onChange : function() { sendRequest(1); }, 
		values: [
			[55,0],
			[25,0]
		]
	});
	
	$('.bathrooms_slider').Slider({
		accept : '.bathrooms_indicator',
		restricted: false,
		fractions: 10,
		opacity: 0.9,
		onSlide : function(procx, procy, x, y) {
			amt = procx/20;
			if(this.SliderIteration == 0) {
				$('#bathrooms_max').val(amt+'');
				$("#bathrooms_max_label").html(amt+'');
			} else {
				$('#bathrooms_min').val(amt+'');			
				$("#bathrooms_min_label").html(amt+'');
			}
		},
		onChange : function() { sendRequest(1); }, 
		values: [
			[230,0],
			[0,0]
		]
	});	
	

	$('#destination').Autocomplete( {
		source: (base_url + 'home/getDestinations/'),
		delay: 500,
		fx: {
			type: 'slide',
			duration: 10000
		},
		// autofill: true,
		minchars: 3,
		helperClass: 'autocompleter',
		selectClass: 'selectAutocompleter',
		onSelect : destLabel,
		onShow : fadeInSuggestion,
		onHide : fadeOutSuggestion
	});
		
	$('.distance_slider').Slider({
		accept : '.distance_indicator',
		restricted: false,
		opacity: 0.9,
		onSlide : function(procx, procy, x, y) {
			amt = 3 + parseInt(procx/3.6);
			$('#distance_val').val(amt+'');
			$("#distance_amt").html(amt+'');
		},
		onChange : function() { sendRequest(1); }, 
		values: [
			[0,0]
		]
	});	
	
	//hack to get distance slider showing up -weird	
	$('#tools_content').show();
	$('.distance_slider').SliderSetValues([[125,0]]);
	$('#tools_content').hide();
});

/***************************MAP FUNCTIONS******************************/
// init stuff when page loads
function mapLoad() {
	if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("map"));
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.setCenter(homePos, 14);
		geocoder = new GClientGeocoder();
	}
}

function clearMarkers() {
	map.clearOverlays();
	gmarkers = [];
	gmarker_pos = 0;
}

function writeMarker(name, address1, address2, lat, lng, bid) {
	var point = new GLatLng(lat, lng);
	var html = '<div class="map_overlay"><h1>'+name+'</h1><h3>Address:</h3><p>'+address1+'<br />'+address2+'</p></div>';
	var marker = createMarker(point, html, bid);
	map.addOverlay(marker);
};

function writeBasicMarker(name, lat, lng) {
	var point = new GLatLng(lat, lng);
	var html = '<div class="map_overlay"><h1>'+name+'</h1></div>';
	var marker = createBasicMarker(point, html);
	map.addOverlay(marker);
};

function writeDestMarker() {
	var dest = currentDest;
	var lat = $('#dest_lat').val();
	var lng = $('#dest_lng').val();
	if(lat == homelat && lng == homelng) {
		dest = "Center of Campus";
	}
	writeBasicMarker(dest, lat, lng);
}

// A function to create the marker and set up the event window
// Each instance of the function preserves the contends of a different instance
// of the "marker" and "html" variables which will be needed later when the event triggers.    
function createMarker(point,html, bid) {
	var marker = new GMarker(point, apticon);
	gmarker_pos++;
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(html);
		document.getElementById('results_iframe').contentWindow.markerClick(bid);
	});
	gmarkers[gmarker_pos] = marker;
	return marker;
}

function createBasicMarker(point,html) {
	var marker = new GMarker(point, desticon);
	gmarker_pos++;
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(html);
	});
	gmarkers[gmarker_pos] = marker;
	return marker;
}

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

function getGMarkerPos() {
	return gmarker_pos;
}
	  
/***************************TOOLBAR FUNCTIONS******************************/
function tbbutton(name, title) {
	this.name = name;
	this.title = title;
	this.state = 'normal';
	this.out = toolbar_dir + 'button_' + name + '_out.png';
	this.over = toolbar_dir + 'button_' + name + '_over.png';
	this.on = toolbar_dir + 'button_' + name + '_on.png';
}

function tbCloseAll() {
	for(key in toolbar_buttons) {
		toolbar_buttons[key].state = 'normal';
		$('#button_'+key).attr("src", toolbar_buttons[key].out);
		$('#'+key+'_content').hide();
	}
}

function tbClick(name) {
	if(toolbar_buttons[name].state == 'on') {
		toolbar_buttons[name].state = 'normal';
		$('#button_'+name).attr("src", toolbar_buttons[name].out);
		$('#toolwindow').DropOutRight();
	} else {
		tbCloseAll();
		
		toolbar_buttons[name].state = 'on';
		$('#button_'+name).attr("src", toolbar_buttons[name].on);
		$('#toolwindow_title').text(toolbar_buttons[name].title);
		$('#toolwindow').DropInRight();
		$('#'+name+'_content').show();
	}
}

function tbMouseOver(name) {
	if(toolbar_buttons[name].state == 'normal') {
		$('#button_'+name).attr("src", toolbar_buttons[name].over);
	}
}

function tbMouseOut(name) {
	if(toolbar_buttons[name].state == 'normal') {
		$('#button_'+name).attr("src", toolbar_buttons[name].out);
	}
}

/***************************WINDOW FUNCTIONS******************************/
//updates height and width of objects on screen
function update_objects() {	
	if (document.getElementById) {
		var windowHeight=getWindowHeight();
		var windowWidth=getWindowWidth();
		
		var contentElement = document.getElementById('content_right');
		var mapElement = document.getElementById('map');
		var iframeElement = document.getElementById('results_iframe');
		var containerElement = document.getElementById('container');
		var footerElement = document.getElementById('footer');
		var headerElement = document.getElementById('header');
		var statusElement = document.getElementById('content_status');
		
		var footerTop = findPos(footerElement);
		var headerTop = findPos(headerElement);
		var iframeTop = findPos(iframeElement);
		
		var myHeight = "370px";
		var mapHeight = "350px";
		var iframeHeight = "370px";
		if(browser=="Microsoft Internet Explorer")
			var iframeHeight = "368px";
		var contentWidth = "480px";
		var containerWidth="1000px";
		
		if (windowHeight > 499) {
			myHeight = (footerTop[1]-iframeTop[1] - 10) + 'px';
			mapHeight = (footerTop[1]-iframeTop[1] - 30) + 'px';
			iframeHeight = (footerTop[1]-iframeTop[1] - 10) + 'px';
			if(browser=="Microsoft Internet Explorer")
				iframeHeight = (footerTop[1]-iframeTop[1] - 12) + 'px';
		}
		
		if(windowWidth > 999) {
			contentWidth = (windowWidth - 520) + "px";
			containerWidth = windowWidth;
		}
		
		containerElement.style.width = containerWidth;
		iframeElement.style.height = iframeHeight;
		contentElement.style.height = myHeight;
		mapElement.style.height = mapHeight;
		contentElement.style.width = contentWidth;
		mapElement.style.width = contentWidth;
		statusElement.style.width = contentWidth;		
	}
}

//to hide, cmd = hide, to show, cmd= show
function toggleObject(obj, cmd) {
	var el = document.getElementById(obj);
	
	if(typeof cmd == "undefined") {
		cmd = "auto";
	}
	
	if ((cmd == "auto" && el.style.display != 'none') || cmd == "hide") {
		el.style.display = 'none';
	} else {
		el.style.display = '';
	}
	
	return el.style.display;
}

//changes class of selected element
function toggleClass(obj, class1, class2) {
	var el = document.getElementById(obj);
	if(el.className == class1) {
		el.className = class2; 
	} else {
		el.className = class1;
	}
	return true; 
}

//returns the .style.display attrib of an obj by id
function displayState(obj) {
	var el = document.getElementById(obj);
	return el.style.display;
}

//gets y pixel of top of element
function findPos(obj) {
		var curleft = curtop = 0;
		if (obj.offsetParent) {
			curleft = obj.offsetLeft
			curtop = obj.offsetTop
			while (obj = obj.offsetParent) {
				curleft += obj.offsetLeft
				curtop += obj.offsetTop
			}
		}
		return [curleft,curtop];
}

function getWindowHeight() {
	var windowHeight=0;
	if (typeof(window.innerHeight)=='number') {
		windowHeight=window.innerHeight;
	}
	else {
		if (document.documentElement && document.documentElement.clientHeight) {
			windowHeight = document.documentElement.clientHeight;
		}
		else {
			if (document.body&&document.body.clientHeight) {
				windowHeight=document.body.clientHeight;
			}
		}
	}
	return windowHeight;
}

function getWindowWidth() {
	var windowWidth=0;
	if (typeof(window.innerWidth)=='number') {
		windowWidth=window.innerWidth;
	}
	else {
		if (document.documentElement && document.documentElement.clientWidth) {
			windowWidth = document.documentElement.clientWidth;
		}
		else {
			if (document.body&&document.body.clientWidth) {
				windowWidth=document.body.clientWidth;
			}
		}
	}
	return windowWidth;
}