function resImg(img, maxh, maxw) {
	if ((img.height > maxh) || (img.width > maxw)){
		// need to scale the image
		var ratio = maxh/maxw;
		if (img.height/img.width > ratio){
			// height is the problem
			if (img.height > maxh){
				img.width = Math.round(img.width*(maxh/img.height));
				img.height = maxh;
				img.style.marginLeft = Math.round((maxw - img.width) / 2)+'px';
				img.style.marginRight = Math.round((maxw - img.width) / 2)+'px';
			}
		} else {
			// width is the problem
			if (img.width > maxh){
				img.height = Math.round(img.height*(maxw/img.width));
				img.width = maxw;
				img.style.marginTop = Math.round((maxh - img.height) / 2)+'px';
			}
		}
	}else{
		// just need margins
		img.style.marginTop = Math.round((maxh - img.height) / 2)+'px';
		img.style.marginLeft = Math.round((maxw - img.width) / 2)+'px';
		img.style.marginRight = Math.round((maxw - img.width) / 2)+'px';
		//if (maxh == 300) alert(Math.round((maxw - img.width) / 2)+'px');
	}
}

function getPageSizeWithScroll(){
	if (window.innerHeight && window.scrollMaxY) {// Firefox
		yWithScroll = window.innerHeight + window.scrollMaxY;
		xWithScroll = window.innerWidth + window.scrollMaxX;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		yWithScroll = document.body.scrollHeight;
		xWithScroll = document.body.scrollWidth;
	} else { // works in Explorer 6 Strict, Mozilla (not FF) and Safari
		yWithScroll = document.body.offsetHeight;
		xWithScroll = document.body.offsetWidth;
  	}
	arrayPageSizeWithScroll = new Array(xWithScroll,yWithScroll);
	//alert( 'The height is ' + yWithScroll + ' and the width is ' + xWithScroll );
	return arrayPageSizeWithScroll;
}

function closeSuggestion(){
	document.getElementById('suggestionContainer').style.display='none';
	document.getElementById('suggestionOverlay').style.display='none';
}


// simple modal window based on jQuery (must be called after jQuery)
$(document).ready(function() {	

	//select all the a tag with name equal to modal
	$('a[name=modal]').click(function(e) {
		//Cancel the link behavior
		e.preventDefault();
		
		//Get the A tag
		var id = $(this).attr('href');
	
		//Get the screen height and width
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
	
		//Set heigth and width to mask to fill up the whole screen
		$('#mask').css({'width':maskWidth,'height':maskHeight});
		
		//transition effect		
		$('#mask').fadeIn(1000);	
		$('#mask').fadeTo("slow",0.8);	
	
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
		var winS = $(window).scrollTop();
              
		//Set the popup window to center
		$(id).css('top',  winH/2-$(id).height()/2+winS);
		$(id).css('left', winW/2-$(id).width()/2);
	
		//transition effect
		$(id).fadeIn(1000); 
	
	});
	
	//if close button is clicked
	$('.window .close').click(function (e) {
		//Cancel the link behavior
		e.preventDefault();
		
		$('#mask').hide();
		$('.window').hide();
	});		
	
	//if mask is clicked
	$('#mask').click(function () {
		$(this).hide();
		$('.window').hide();
	});			
	
});