var closeSpeed = 200;//Actually handles opening
var openSpeed = 200;//Actually handles closing
var transitioneffect = 2;
var effects = true;
var inProgress = false;

//Initialization
$(document).ready(
	function(){
		//Hide the Transition Effects
		$("#rightCurtain").css('display','none');
		$("#rightInnerCurtain").css('display','none');
		
		$("#curtainLogo").css('display','none');
		
		$("#leftCurtain").css('display','none');
		$("#leftInnerCurtain").css('display','none');
		//END Hide the Transition Effects
		
		//Add scrollbar to readmore
		$("#readmore").jScrollPane({autoReinitialise: true});
	}
);



function navChange(page){
		switch(page){
		case "1":
			//window.location.href = "/#!/our-practice";
			//framePage("part.ourpractice.html");
			getPage("/part.ourpractice.html?js=1");
			break;
		case "2":
			//window.location.href = "/#!/our-services";
			getPage("/part.ourservices.html?js=1");
			break;
		case "3":
			//window.location.href = "/#!/eyecare-library";
			getPage("/part.eyecarelibrary.html?js=1");
			break;
		case "4":
			//window.location.href = "/#!/eyewear-gallery";
			getPage("/part.eyeweargallery.html?js=1");
			break;
		case "5":
			getPage("/part.patientsupport.html?js=1");
			break;
		case "6":
			window.open("http://www.visionsource-2020medical.com/");
			break;
	}
}
function framePage(hurl){
	document.getElementById("frame1").src = "./"+hurl;
}
function getPage(hurl){
	if(effects){
		if(!inProgress){
			switch(transitioneffect){
				case 1:
					$("#actualcontent").hide("fold",{ direction: "horizontal" }, closeSpeed, function(){
							$.ajax({
							  url: hurl,
							  context: document.body,
							  success: function(data, status, xhroractivexobject){
								$("#actualcontent").html(data);	
								$("#actualcontent img").fadeTo(10,1);
								$("#actualcontent img").hover(imageWhiteOut,imageReturn);							
								$("#actualcontent").show(
									"fold",
									{direction: "horizontal"},
									openSpeed,
									function(){}
								);
							  }});
					});
				break;
				case 2:
					$("#curtains").css('display', 'block');
					
					var isUIDone = {
						curtain1: false,  	//this is the first curtain
						curtain2: false,  	//this is the second curtain
						started: false,   	//Makes sure that because these calls are async then if it has started to run already please do not run it again.
						closeCurtain: function(curtaintoclose) {
							switch(curtaintoclose){
								case 1:
									this.curtain1 = true;
								break;
								case 2:
									this.curtain2 = true;
								break;
							}
						},
						openCurtain:function(curtaintoopen){
							switch(curtaintoopen){
								case 1:
									this.curtain1 = false;
								break;
								case 2:
									this.curtain2 = false;
								break;
							}
						},
						check : function(){
							if((this.curtain1 && this.curtain2) && !this.started){
								this.started = true;
								//Code that runs once both curtains are finished
								$("#actualcontent").css('display','none');
								//$("#actualcontent").hide(function(){
										$.ajax({
										  url: hurl,
										  context: document.body,
										  success: function(data, status, xhroractivexobject){
												$("#actualcontent").html(data);												
												$("#actualcontent img").fadeTo(10,1);
												$("#actualcontent img").hover(imageWhiteOut,imageReturn);
												setTimeout(function(){
													$("#actualcontent").css('display','block');
													$('.overflow').jScrollPane();
													$("#curtainLogo").hide("clip",{direction:"vertical"},closeSpeed, function(){
														$("#leftInnerCurtain").hide("slide",{ direction: "right" },closeSpeed,function(){$("#leftCurtain").hide("slide",{ direction: "right" },closeSpeed/2);});
														
														$("#rightInnerCurtain").hide("slide",{ direction: "left" },closeSpeed,function(){$("#rightCurtain").hide("slide",{ direction: "left" },closeSpeed/2);});
														
													});
												},closeSpeed*2);
												setTimeout(function(){inProgress = false;},500+closeSpeed+300);//set UI effects to resume cool flashy effects
																			
										  }});
							}
						}					
					}; //OBJECT created
					$("#leftCurtain").show(
						"slide",
						{ direction: "right" },
						openSpeed,
						function(){return function(checking){
							
							checking.closeCurtain(1);checking.check();}(isUIDone);
						}
					);
					setTimeout(function(){$("#leftInnerCurtain").show("slide",{direction:"right"},openSpeed*2);},openSpeed/4);
					
					$("#rightCurtain").show(
						"slide",
						{ direction: "left" },
						openSpeed,
						 function(){return function(checking){
							
							checking.closeCurtain(2);checking.check();}(isUIDone);
						}
					);					
					setTimeout(function(){$("#rightInnerCurtain").show("slide",{direction:"left"},openSpeed*2)},openSpeed/4);
					
					setTimeout(function(){$("#curtainLogo").show("clip",{direction:"vertical"},openSpeed/2)},openSpeed);				
					
				break;
				case 3: //same as case 2 but the close transition is different
					$("#curtains").css('display', 'block');
					
					var isUIDone = {
						curtain1: false,  	//this is the first curtain
						curtain2: false,  	//this is the second curtain
						started: false,   	//Makes sure that because these calls are async then if it has started to run already please do not run it again.
						closeCurtain: function(curtaintoclose) {
							switch(curtaintoclose){
								case 1:
									this.curtain1 = true;
								break;
								case 2:
									this.curtain2 = true;
								break;
							}
						},
						openCurtain:function(curtaintoopen){
							switch(curtaintoopen){
								case 1:
									this.curtain1 = false;
								break;
								case 2:
									this.curtain2 = false;
								break;
							}
						},
						check : function(){
							if((this.curtain1 && this.curtain2) && !this.started){
								this.started = true;
								//Code that runs once both curtains are finished
								$("#actualcontent").css('display','none');
								//$("#actualcontent").hide(function(){
										$.ajax({
										  url: hurl,
										  context: document.body,
										  success: function(data, status, xhroractivexobject){
												$("#actualcontent").html(data);												
												$("#actualcontent img").fadeTo(10,1);
												$("#actualcontent img").hover(imageWhiteOut,imageReturn);
												setTimeout(function(){
													$("#actualcontent").css('display','block');
													$('.overflow').jScrollPane();
													$("#curtainLogo").hide("clip",{direction:"vertical"},closeSpeed, function(){
													
														$("#leftInnerCurtain").hide("slide",{ direction: "right" },closeSpeed,function(){});
														setTimeout(function(){$("#leftCurtain").hide("slide",{ direction: "right" },closeSpeed/2);},closeSpeed/2);
														
														$("#rightInnerCurtain").hide("slide",{ direction: "left" },closeSpeed,function(){});
														setTimeout(function(){$("#rightCurtain").hide("slide",{ direction: "left" },closeSpeed/2);},closeSpeed/2);
														
													});
												},closeSpeed*2);
												setTimeout(function(){inProgress = false;},500+closeSpeed+300);//set UI effects to resume cool flashy effects
																			
										  }});
							}
						}					
					}; //OBJECT created
					$("#leftCurtain").show(
						"slide",
						{ direction: "right" },
						openSpeed,
						function(){return function(checking){
							
							checking.closeCurtain(1);checking.check();}(isUIDone);
						}
					);
					setTimeout(function(){$("#leftInnerCurtain").show("slide",{direction:"right"},openSpeed*2);},openSpeed/4);
					
					$("#rightCurtain").show(
						"slide",
						{ direction: "left" },
						openSpeed,
						 function(){return function(checking){
							
							checking.closeCurtain(2);checking.check();}(isUIDone);
						}
					);					
					setTimeout(function(){$("#rightInnerCurtain").show("slide",{direction:"left"},openSpeed*2)},openSpeed/4);
					
					setTimeout(function(){$("#curtainLogo").show("clip",{direction:"vertical"},openSpeed/2)},openSpeed);				
					
				break;
			}
			inProgress = true;
		}else{
				$.ajax({
				  url: hurl,
				  context: document.body,
				  success: function(data, status, xhroractivexobject){
					$("#actualcontent").html(data);
					$('.overflow').jScrollPane();
				}});
		}
	}else{
		$.ajax({
		  url: hurl,
		  context: document.body,
		  success: function(data, status, xhroractivexobject){
			$("#actualcontent").html(data);
		  }});
	}
}
function PopupDialog(resource){
	var maxHeight = 500;
	var minHeight = 500;
	var maxWidth = 600;
	var minWidth = 600;
	$.ajax({
		url: resource+"?readmore=1",
		context: document.body,
		success:function(data){			
			var read = $("#readmore").data('jsp').getContentPane().html(data);
			$("#readmore img").fadeTo(10,1);
			$("#readmore img").hover(imageWhiteOut,imageReturn);
			if(effects){				
				$("#readmore").dialog({
					height:minHeight,
					minHeight:minHeight,
					maxHeight: maxHeight,
					show:"scale",
					width:minWidth,
					minWidth:minWidth,
					maxWidth:maxWidth,
					resizable:false
				});				
			}else{
				$("#readmore").dialog({
					height:minHeight,
					minHeight:minHeight,
					maxHeight: maxHeight,						
					width:minWidth,
					minWidth:minWidth,
					maxWidth:maxWidth,
					resizable:false
				});
			}
		}		
	});		
	return false;
}
/**
	Function adds an overlay to the image which makes it appear to have more "Life".
*/
function imageWhiteOut(){
	if(effects){//check to see if effects are enabled
		$(this).fadeTo(200, .6);
		setTimeout(function(elem){$(elem).fadeTo(500, .85);}(this), 210);
	}
	/*this.overlay = (this.overlay) ? this.overlay : document.createElement("div");
	this.parentNode.appendChild(this.overlay);
	var overlay =  $(this.overlay);
	overlay.css("position", "absolute");
	overlay.css("top",$(this).position().top+2+1);
	overlay.css("left",$(this).position().left+5+1);
	overlay.css('width', $(this).width()+"px");
	overlay.css('height', $(this).height()+"px");
	overlay.overlay = this.overlay;
	overlay.hover(imageWhiteOut,imageReturn);//set effects on any images returned.
	if(effects){//check to see if effects are enabled
		$(this.overlay).fadeTo(500, .75);
		setTimeout(function(elem){$(elem.overlay).fadeTo(500, .5);}(this), 500);
	}*/
}
/**
	Function returns the image to its original view state.
*/
function imageReturn(){
	if(effects){//check to see if effects are enabled
			$(this).fadeTo(200, 1);
	}
}