var ModalWindow = {

	
	show: function(title, id){
		///alert("I'm trying to show");
		$('body').append('<div id="' + id + '" class="modal-content">' +
							'<img class="modal-stem" alt="" src="/images/modalstem.png"/><div class="modal-inner">' +
								'<img class="right" alt="" src="/images/small_logo.png"/>' +
								'<h3>' + title + '</h3><br/><br/><br/>' +
								'<p><a href="#" onclick="ModalWindow.hide()">Close</a></p>' +
								'</div></div>' +
								'<div id="modal-background"></div>');
		ModalWindow.loadModalWindow(id);
		ModalWindow.centerModalWindow(id);
	},

	
	showTeamApplyWindow: function(id, team_name, team_id, member_id, return_url){
		$('body').append('<div id="' + id + '" class="modal-content">' +
							'<img class="modal-stem" alt="" src="/images/modalstem.png"/><div class="modal-inner">' +
								'<img class="right" alt="" src="/images/small_logo.png"/>' +
								'<h3>Team Application</h3>' +
								'<form method="post">' + 
								'<p><strong class="push">You are applying to the team ' + team_name + '</strong><br/>' +
								'<strong class="push">Comments:</strong>' +
								'<textarea name="comments" rows="10" cols="40"></textarea>' +
								'<input type="hidden" name="action" value="send_application" />' +
								'<input type="hidden" name="controller" value="Team" />' +
								'<input type="hidden" name="return" value="'+ return_url +'" />' +
								'<input type="hidden" name="team_id" value="'+ team_id +'" />' +
								'<input type="hidden" name="member_id" value="'+ member_id +'" /></p>' +
								'<p class="buttons">' +
								'<input class="sm-image-button sm-apply-button" type="image" src="/images/buttons/sm-apply-button.png" value="Apply" /> ' + 
								'<a href="#" class="modal-cancel"><img src="/images/buttons/sm-cancel-button.png" alt="cancel" /></a>' +
								'</p>' +
								'</form>' + 
								'</div></div>' +
								'<div id="modal-background"></div>');
		ModalWindow.loadModalWindow(id);
		ModalWindow.centerModalWindow(id);
		$('.modal-cancel').click(function(){
			ModalWindow.hide();
		});
	},
	
	loadModalWindow: function(id){
			$("#modal-background").css({"opacity": "0.7"});
			$("#modal-background").fadeIn("fast");
			$("#"+id).fadeIn("fast");

	},
	
	centerModalWindow: function(id){
		var windowWidth = document.documentElement.clientWidth;
		var windowHeight = document.documentElement.clientHeight;
		var modalHeight = $("#" + id).height();
		var modalWidth = $("#" + id).width();
		
	/*	$("#" + id).css({  
		"position": "absolute",  
		"top": windowHeight/2-modalHeight/2,  
		"left": windowWidth/2-modalWidth/2  
		}); */ 
		
		
		$("#"+id).css({marginLeft: '-' + parseInt((modalWidth / 2), 10) + 'px'});
		if ( !(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away IE6
			$("#"+id).css({marginTop: '-' + parseInt((modalHeight / 2),10) + 'px'});
		}
		
		//only need force for IE6  

	/*	$("#modal-background").css({  
		"height": windowHeight  
		});*/
		
		
		
	},
	
	hide: function(){
			$("#modal-background").fadeOut("fast");
			$(".modal-content").fadeOut("fast");
			$('body').remove("#modal-background");
			$('body').remove(".modal-content");
	} 
};