/**
* Handles page peel
*/
jQuery(document).ready(function() {
	jQuery("#pageflip").hover(function() { //On hover...
		jQuery("#pageflip img , .msg_block").stop()
			.animate({ //Animate and expand the image and the msg_block (Width + height)
				width: '307px',
				height: '319px'
			}, 500);
		jQuery(".msg_block .text").css("display", "block");
		} , function() {
		jQuery("#pageflip img").stop() //On hover out, go back to original size 50x52
			.animate({
				width: '110px',
				height: '114px'
			}, 220);
		jQuery(".msg_block .text").css("display", "none");
		jQuery(".msg_block").stop() //On hover out, go back to original size 50x50
			.animate({
				width: '110px',
				height: '110px'
			}, 200); //Note this one retracts a bit faster (to prevent glitching in IE)
		jQuery(".msg_block .text").css("display", "none");
	});
});

/**
* Returns an array of objects by their className
* 
* PS: I took this from the internet so no comments. Most webdevelopers don't seem to be capable of something as advanced as typing slashes and then words...
*/
function getElementsByClass(searchClass,node,tag) {
	
	var classElements = new Array();

	if (node == null) node = document;

	if (tag == null) tag = '*';

	var els = node.getElementsByTagName(tag);

	var elsLen = els.length;

	var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");

	for (i = 0, j = 0; i < elsLen; i++) {

		if ( pattern.test(els[i].className) ) {

			classElements[j] = els[i];

			j++;

		}

	}

	return classElements;

}

/**
* Starts opening animations after initial page load
*/
function startAnimations(sectionTag){
	
	//do animations if this is the homepage
	if (sectionTag == 'nl' || sectionTag == 'de'){
	
		//move image slider overlay
		//setTimeout("moveObject('header-bottom-image-overlay', 960, 0, 550, 0, 350)", 500);
		setTimeout("moveObject('header-bottom-sticker-img', -125, 0, 0, 0, 350)", 500);
		setTimeout("moveObject('header-bottom-search', 215, 75, 215, -27, 250)", 850);
	}
	
	//put things in their place staight away otherwise
	else{
		
		//positions
		//document.getElementById('header-bottom-image-overlay').style['left'] = '550px';
		//document.getElementById('header-bottom-image-overlay').style['top'] = '0px';
		document.getElementById('header-bottom-sticker-img').style['left'] = '0px';
		document.getElementById('header-bottom-sticker-img').style['top'] = '0px';
		document.getElementById('header-bottom-search').style['left'] = '215px';
		document.getElementById('header-bottom-search').style['top'] = '-27px';
	}
}

/**
* Moves the house blocks on homepage
*/
var currentHomeHousesDiv = 0;
function moveHomeHouseBlocks(divNum){
	
	//fetch current position & calc new position
	var curPosition = -(currentHomeHousesDiv * 340);
	var newPosition = -(divNum * 340);
	
	//update links
	var oldLinkObject = document.getElementById('houses-navigation').getElementsByTagName('span')[currentHomeHousesDiv];
	var newLinkObject = document.getElementById('houses-navigation').getElementsByTagName('span')[divNum];
	oldLinkObject.className = 'inactive';
	newLinkObject.className = 'active';
	
	//update currentHousesDiv
	currentHomeHousesDiv = divNum;
	
	//move blocks
	moveObject('houses-overview-blocks', curPosition, 0, newPosition, 0, 500);
}

/**
* Moves the house blocks
*/
var currentHousesDiv = 0;
function moveHouseBlocks(divNum){
	
	//fetch current position & calc new position
	var curPosition = -(currentHousesDiv * 766);
	var newPosition = -(divNum * 766);
	
	//update links
	var oldLinkObject = document.getElementById('house-houses-navigation').getElementsByTagName('span')[currentHousesDiv];
	var newLinkObject = document.getElementById('house-houses-navigation').getElementsByTagName('span')[divNum];
	oldLinkObject.className = 'inactive';
	newLinkObject.className = 'active';
	
	//update currentHousesDiv
	currentHousesDiv = divNum;
	
	//move blocks
	moveObject('house-houses-overview-blocks', curPosition, 0, newPosition, 0, 500);
}

/**
* Moves the house image blocks
*/
var currentHouseImageDiv = 0;
function moveHouseImageBlocks(divNum){
	
	//do nothing if this is the same div
	if (currentHouseImageDiv == divNum) return;
	
	//fetch current position & calc new position
	var curPosition = -(currentHouseImageDiv * 576);
	var newPosition = -(divNum * 576);
	
	//set height property of current block
	var currentHouseBlock = getElementsByClass('single-house-image-block', document.getElementById('single-house-image-overview-blocks'));
	var currentHouseBlockImages = getElementsByClass('single-house-image', currentHouseBlock[currentHouseImageDiv]);
	var numImages = currentHouseBlockImages.length;
	document.getElementById('single-house-image-overview').style['height'] = numImages <= 3 ? '127px' : '254px';
	
	//update links
	var oldLinkObject = document.getElementById('single-house-image-navigation').getElementsByTagName('span')[currentHouseImageDiv];
	var newLinkObject = document.getElementById('single-house-image-navigation').getElementsByTagName('span')[divNum];
	oldLinkObject.className = 'inactive';
	newLinkObject.className = 'active';
	
	//update currentHousesDiv
	currentHouseImageDiv = divNum;
	
	//move blocks
	moveObject('single-house-image-overview-blocks', curPosition, 0, newPosition, 0, 500);
	
	//count images in image block
	currentHouseBlock = getElementsByClass('single-house-image-block', document.getElementById('single-house-image-overview-blocks'));
	currentHouseBlockImages = getElementsByClass('single-house-image', currentHouseBlock[currentHouseImageDiv]);
	numImages = currentHouseBlockImages.length;
	
	//make block slide in if numImages is less than 3 (= one row)
	if (numImages <= 3) scaleObject('single-house-image-overview', 254, 576, 127, 576, 500);
	else if (document.getElementById('single-house-image-overview').style['height'] != '254px') scaleObject('single-house-image-overview', 127, 276, 254, 576, 500);
	
}

/**
* Shows the required drop-down for price ranges (rent or sale) and hides the other
*/
function set_price_ranges(house_type){
	
	//itterate
	var i;
	
	//fetch objects
	var sale_objects = getElementsByClass('price-select-sale', document, 'div');
	var rent_objects = getElementsByClass('price-select-rent', document, 'div');
	
	//in case of rental
	if (house_type == 'rent'){
		
		//set both selects to rent
		document.getElementById('rent-option-header').selected = true;
		if (document.getElementById('rent-option') != null) document.getElementById('rent-option').selected = true;
		
		//hide sale select
		for (i = 0; i < sale_objects.length; i++){
			sale_objects[i].style['display'] = 'none';
			sale_objects[i].style['visibility'] = 'hidden';
		}
		
		//show rent select
		for (i = 0; i < rent_objects.length; i++){
			rent_objects[i].style['display'] = 'block';
			rent_objects[i].style['visibility'] = 'visible';
		}
	}
	
	//in case of sale
	else{
		
		//set both selects to sale
		document.getElementById('sale-option-header').selected = true;
		if (document.getElementById('sale-option') != null) document.getElementById('sale-option').selected = true;
		
		//hide rent select
		for (i = 0; i < rent_objects.length; i++){
			rent_objects[i].style['display'] = 'none';
			rent_objects[i].style['visibility'] = 'hidden';
		}
		
		//show sale select
		for (i = 0; i < sale_objects.length; i++){
			sale_objects[i].style['display'] = 'block';
			sale_objects[i].style['visibility'] = 'visible';
		}
	}
}

/**
* Updates other select objects to show the same value as the one calling
* 
* @input Object selectObj - The object in which the option was changed
*/
function update_select(selectObj){
	
	//update from-sale-select in header
	if (selectObj.id == 'pr-from-sale') document.getElementById('pr-from-sale-option-header-' + selectObj.value).selected = true;
	
	//update to-sale-select in header
	if (selectObj.id == 'pr-to-sale') document.getElementById('pr-to-sale-option-header-' + selectObj.value).selected = true;
	
	//update from-rent-select in header
	if (selectObj.id == 'pr-from-rent') document.getElementById('pr-from-rent-option-header-' + selectObj.value).selected = true;
	
	//update to-rent-select in header
	if (selectObj.id == 'pr-to-rent') document.getElementById('pr-to-rent-option-header-' + selectObj.value).selected = true;
	
	//update area-select in header
	if (selectObj.id == 'area-select') document.getElementById('area-option-header-' + selectObj.value).selected = true;
	
	//update house page only if the form exists
	if (document.getElementById('search-house') != null){
	
		//update from-sale-select on house page
		if (selectObj.id == 'pr-from-sale-header') document.getElementById('pr-from-sale-option-' + selectObj.value).selected = true;
		
		//update to-sale-select on house page
		if (selectObj.id == 'pr-to-sale-header') document.getElementById('pr-to-sale-option-' + selectObj.value).selected = true;
		
		//update from-rent-select on house page
		if (selectObj.id == 'pr-from-rent-header') document.getElementById('pr-from-rent-option-' + selectObj.value).selected = true;
		
		//update to-rent-select on house page
		if (selectObj.id == 'pr-to-rent-header') document.getElementById('pr-to-rent-option-' + selectObj.value).selected = true;
		
		//update area-select on house page
		if (selectObj.id == 'area-select-header') document.getElementById('area-option-' + selectObj.value).selected = true;
	}
}

/**
* Returns page height & width
* 
* As taken and modified from lightbox 2 (http://lokeshdhakar.com/projects/lightbox2/)
*/
function getPageSize() {
	    
	 var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = window.innerWidth + window.scrollMaxX;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else if (document.documentElement.scrollHeight > document.body.scrollHeight){ //IE 8
		xScroll = document.documentElement.scrollWidth;
		yScroll = document.documentElement.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	
	if (self.innerHeight) {	// all except Explorer
		if(document.documentElement.clientWidth){
			windowWidth = document.documentElement.clientWidth; 
		} else {
			windowWidth = self.innerWidth;
		}
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = xScroll;		
	} else {
		pageWidth = windowWidth;
	}

	return [pageWidth,pageHeight];
}

/**
* Loads a popup screen
*/
function loadPopup(lang){
	
	//set language
	if (lang != 'nl' && lang != 'de') lang = 'de';
	
	//get popup and bg
	var popup = document.getElementById('popup');
	var popupBg = document.getElementById('popup-bg');
	
	//get pagesize and set bg
	var pageSize = getPageSize();
	popupBg.style.width = pageSize[0] +'px';
	popupBg.style.height = pageSize[1] +'px';
	
	//load popup content and fade in
	jQuery.get('popup.php?lang='+ lang, function(content, status, jqXHR){
		
		//add content
		document.getElementById('popup-content').innerHTML = content;
		
		//put popup in place
		popup.style.margin = '-213px 0 0 -224px';
		
		//fade in
		$('#popup').fadeIn(300);
		$('#popup-bg').fadeIn(600);
	});
}

/**
* Close popup
*/
function closePopup(){
	
	//fade out
	$('#popup').fadeOut(300, function(){document.getElementById('popup-content').innerHTML = '';});
	$('#popup-bg').fadeOut(600);
}