/**************************************/
/******** Site Public Functions *******/
/**************************************/

this.zoomImage = function(){
	
	//alert('1');
	/*
	$('a.bwGal').zoomimage({
	border: 10,
	centered: true,
	hideSource: true
	});
	*/
	
	$('a.customGal').zoomimage({
	centered: true,
	controlsTrigger: 'mouseover',
	className: 'custom',
	shadow: 40,
	controls: true,
	opacity: .5,
	beforeZoomIn: function(boxID) {
		$('#' + boxID)
			.find('img')
			.css('opacity', 0)
			.animate(
				{'opacity':1},
				{ duration: 500, queue: false }
			);
	},
	beforeZoomOut: function(boxID) {
		$('#' + boxID)
			.find('img')
			.css('opacity', 1)
			.animate(
				{'opacity':0},
				{ duration: 500, queue: false }
			);
	}

	});
	
}

/*****************/

this.accessibility = function(){
	var pg = $(".main").attr("rel");
	//if(pg!='art'){alert('1');}
	if (($('#art').length >0)||($('#design').length >0)) {
		setMenu();
		
		$(".exit a").click(function(){
			var http_root = $("body").attr("rel");
			document.location = http_root;
			return false;
		});
		
		scrollbarImg_option();
		scrollbarImg_content();
		
	}
	if(($('#art').length >0)&&(pg!='art')||($('#design').length >0)&&(pg!='design')){
		var pg_url = $(".main").attr("rel");
		
		$(".exit a").click(function(){
			var http_root = $("body").attr("rel");
			document.location = http_root;
			return false;
		});
		scrollbarImg_option();
		scrollbarImg_content();
		
		//alert(pg_url);
		//var pg = 'alstom';
		
		$(".panel-4").html('<img src="'+http_root+rp_image_global+img_loader+'"/> loading');
		$(".panel-4").load( http_root+rp_layout+'backbone_content.php?pg_url='+pg_url, {}, function(){
					
		$(".panel-4").hide().fadeIn(1000, function(){
			scrollbarImg_content();
		});
					
		$(".panel-4 p:last").css({
			padding:'0px'
			});			
		});
		
		setMenu();
	}

}

/*****************/

this.scrollbar = function(){	
$('#pane1').jScrollPane();
$('.scroll-pane').bind('scroll',function(event){
	console.log(event.target);
	});
};

this.scrollbarImg_content= function(){
$('.content-scroll').jScrollPane({
	showArrows:false, 
	scrollbarWidth: 10,
	reinitialiseOnImageLoad: true
	});
};

this.scrollbarImg_option = function(){
$('.option-scroll').jScrollPane({
	showArrows:false, 
	scrollbarWidth: 10,
	reinitialiseOnImageLoad: true
	});
};

/*****************/

this.loadMain = function(){
$("#menu-home a").click(function(){
		$("#tooltip").remove();
		var pg = $(this).attr("rel");
		//var pg = $(this).attr("href");
		//alert(pg);
		
		/* load #canvas starts*/
		$("#canvas").html('<img src="'+rp_image_global+img_loader+'"/> loading');
		$("#canvas").load( rp_layout+'canvas.php?pg_url='+pg, {}, function(){
		//$("#canvas").load( rp_layout+'canvas.php?pg_url='+pg, {}, function(){
			
			document.title = 'LAU THIAM KOK :: '+pg.toUpperCase();
			
			exitMain();
			setMenu();
			setMenuTag();
			setMenuAbout();
			
			$('#supersize').fadeTo(500, 1);
			$("#canvas").hide().fadeIn(1000, function(){
				scrollbarImg_option();
				scrollbarImg_content();
				tooltip();
				});

			loadContent();
			
			}); /* load #canvas ends*/
		
		return false;
	});
}

/*****************/

this.setMenu = function(){
	if ($('#art').length >0) {
		$(".main").css({
		background:'url('+http_root+rp_image_local+'transparent_content_white.png) repeat'
		});
	}else{
		$(".main").css({
		background:'url('+http_root+rp_image_local+'transparent_content_black.png) repeat'
		});
	}
	$(".menu > ul > li:last-child").addClass("last");
	$(".menu > ul > li:first-child").addClass("first"); 
	
	$(".menu h2:first").css({background:'#dd0806'});
	$(".menu h2:first").next().next().css({background:'#808080'});
	$(".menu h2:first").next().next().next().next().css({background:'#999999'});
	
	$(".menu .current-menu").append('<span> <img src="'+rp_image_local+'bullet_arrow_red_left.png" alt="thumb"/></span>');
	
	$(".menu h2").click(function(){
		$(this).next().slideToggle("slow");
		$(this).toggleClass("active");
		return false;
	});
	
	/*
	$(".content img").parent("a").parent("p").css({
		padding:'0px'
		});
	
	$(".content img").parent("p").css({
		padding:'0px'
		});
	*/
	
	$(".content-scroll p:last").css({
		padding:'0px'
	});
	
	$(".option-scroll .current-option").append('<a href="#" class="highlight"></a>');
	$(".highlight").click(function(){
		return false;
	});
	
	//alert('1');
}

/*****************/

this.resetOption = function(){
	$("#tooltip").remove();
	$(".option-scroll li:first").addClass("current-option");
		$(".option-scroll .current-option").append('<a class="highlight"></a>');
		$(".highlight").click(function(){
			$(".highlight").unbind('click');
			$(".highlight").unbind('mouseenter mouseleave');
			return false;
		});
}

/*****************/

this.setMenuTag = function(){
	resetOption();
	/* load .option starts*/
	$(".menu .menu-tag > li > a").click(function(){
		
		var pg = "";
		var tag = $(this).attr("rel");
		var parent_id = $(this).attr("name");
		//alert(tag);
		//alert(parent_id);
		
		$("img").parent("span").remove(); 
		
		// check if this clicked button has the class of 'current-menu'.
		if ($(this).parent("li").hasClass("current-menu")) {
			
			// get the variables.
			var pg = $(".main").attr("rel");
			var parent_id = $(this).attr("name");
			var tag = "";
			//alert(parent_id);
			
			// remove the class of 'current-menu' from this clicked button.
			$(this).parent("li").toggleClass("current-menu");
			
			// call the function to load all the options.
			loadOption(tag,parent_id,pg);
			
			// don't return the link to <a>.
			//alert('2');
			return false;
			//break;
			
		}else {
			// when click on a tag in the menu, remove the class of 'current-menu' from <li>.
			$("li").removeClass("current-menu"); 
			
			// add a class of 'current-menu' to this clicked button only.
			$(this).parent("li").addClass("current-menu");
			
			// call the function to load all the options.
			loadOption(tag,parent_id,pg);
			//alert('1');
		}
		$(".menu .current-menu").append('<span> <img src="'+rp_image_local+'bullet_arrow_red_left.png" alt="thumb"/></span>');
		
		return false;
	});/* load .option ends*/
}

/*****************/

this.setMenuAbout = function(){
	
	$(".menu .menu-about > li > a").click(function(){
		
		if($(this).parent("li").hasClass("contact")){
			
			$("#panel-2").slideToggle("slow");
			$("#tab-contact-me .btn-slide").toggleClass("active");
			//$(this).parent("li").addClass("current-menu");
			return false;
		}

		if($(this).parent("li").hasClass("biography")){
			var pg = $(this).attr("rel");
			$("img").parent("span").remove(); 
			$(".menu .menu-tag > li").removeClass("current-menu"); 
			$(this).parent("li").toggleClass("current-menu");
			$(".menu .current-menu").append('<span> <img src="'+rp_image_local+'bullet_arrow_red_left.png" alt="thumb"/></span>');
			
			if($(this).parent("li").hasClass("current-menu")){
				$(this).parent("li").addClass("current-menu");
				$(".panel-4").fadeOut(1000, function(){
					$(".panel-4").show();
					$(".panel-4").html('<img src="'+rp_image_global+img_loader+'"/> loading');
					$(".panel-4").load( rp_layout+'image.php?pg='+pg, {}, function(){
						setTimeout('scrollbarImg_content();', 500); 
						$(".content-scroll p").css({
							padding:'0px 0px 20px 0px'
						});
						$(".content-scroll p:last").css({
							padding:'0px'
						});
					});
					});
				$(".panel-3").fadeOut(1000, function(){
					$("#tooltip").remove();
					$(".panel-3").show();
					$(".panel-3").html('<img src="'+rp_image_global+img_loader+'"/> loading');

					$(".panel-3").load( rp_layout+'backbone_content.php?pg_url='+pg, {}, function(){
						setTimeout('scrollbarImg_content();', 500); 
						$(".content-scroll p").css({
							padding:'0px 0px 20px 0px'
						});
						$(".content-scroll p:last").css({
							padding:'0px'
						});
					});
				});
				
			}else {
				var tag = "";
				var pg = $(".main").attr("rel");
				var parent_id = $(this).attr("name");
				loadOption(tag,parent_id,pg);
			}
			return false;
		}
		return false;
	});
}

/*****************/

this.loadOption = function(tag,parent_id,pg){
	//load processOption
	$(".panel-4").fadeOut(1000, function(){
		$(".panel-4").show();
		$(".panel-4").html('<img src="'+rp_image_global+img_loader+'"/> loading');
		});
	$(".panel-3").html('<img src="'+rp_image_global+img_loader+'"/> loading');
	$(".panel-3").load( rp_layout+'option.php?tag='+tag+'&parent_id='+parent_id+'&pg='+pg, {}, function(){		

	resetOption();
	$(".panel-3").hide().fadeIn(1000, function(){
		scrollbarImg_option();
		loadContent();
		var pg_first = $(".option-scroll li:first a").attr("rel");
		//alert(pg_first);
		$(".panel-4").load( rp_layout+'backbone_content.php?pg_url='+pg_first, {}, function(){
			$(".panel-4").hide().fadeIn(1000, function(){
				tooltip();
				zoomImage();
				setTimeout('scrollbarImg_content();', 500); 
				});
				$(".panel-4 p:last").css({
					padding:'0px'
				});
			});
					
		});
	});//load processOption ends
}

/*****************/

this.loadContent = function(){
	
	/* load .content starts*/
	$(".option-scroll a").click(function(){ 
		//$(".content").unbind('load', scrollbarImg_content)
		var pg_url = $(this).attr("rel");
		//var tag = $(this).attr("href");
		//alert(tag);
		
		$("li").removeClass("current-option"); 
		$(".highlight").remove();
		$(this).parent("li").addClass("current-option");
		$(".option-scroll .current-option").append('<a class="highlight"></a>');
		$(".highlight").click(function(){
			$(".highlight").unbind('click');
			return false;
		});
		$(".panel-4").html('<img src="'+rp_image_global+img_loader+'"/> loading');
		$(".panel-4").load( rp_layout+'backbone_content.php?pg_url='+pg_url, {}, function(){
		//$(".panel-4").load( rp_layout+'content.php?pg='+pg+'&tag='+tag, {}, function(){
						
			$(".panel-4").hide().fadeIn(1000, function(){
				zoomImage();
				setTimeout('scrollbarImg_content();', 500); 
			});
							
			$(".content-scroll p:last").css({
				padding:'0px'
			});
					
		});
	return false;
	}); /* load .content ends*/
}

/*****************/

this.exitMain = function(){
	$(".exit a").click(function(){
		$("#canvas").fadeOut(500, function(){	
			$("#canvas").load( rp_template+'home.php', {}, function(){
				
				document.title = 'LAU THIAM KOK :: HOME';
				
				resetElements();
				$("#canvas").show();
				$("#menu-home").css({display:'block'});
				$('#menu-home li').css({opacity: 0}).fadeTo(1500, 1);
				hoverLink();
				tooltip();
				loadMain();
				
				/*
				$("#canvas").fadeIn(100, function(){
					$("#btn-intro").css({display:'block'});
					$('#btn-intro a').fadeTo(1500, 1);
					controlBackground();
					tooltip();
					loadContent();
					});
				
				*/
				});
			});
		return false;
	});
}

/*****************/

this.resetElements = function(){
	/* varying radii, "all" browsers */
	DD_roundies.addRule('.button-public', '3px', true);
	DD_roundies.addRule('.popup', '10px', true);
	DD_roundies.addRule('.popup_content', '5px', true);
	
	DD_roundies.addRule('#tab-background h2', '0px 0px 8px 8px', true);
	DD_roundies.addRule('#tab-contact-me h2', '8px 8px 0px 0px', true);
	
	DD_roundies.addRule('#panel-1', '0px 0px 0px 4px', true);
	DD_roundies.addRule('#panel-2', '0px 4px 0px 0px', true);
	
	//DD_roundies.addRule('.main', '6px 0px 6px 6px', true); // causing bugs in IE
	//DD_roundies.addRule('.exit', '8px 8px 0px 0px', true); // causing bugs in IE
	
	//DD_roundies.addRule('.menu h2 ', '4px', true); // causing bugs in IE
}

/*****************/

this.loadBackground = function(){
	
	/*
	$(function(){
		$.fn.supersized.options = {  
			startwidth: 1024,  
			startheight: 768,
			minsize: .50,
			slideshow: 0,
			slideinterval: 5000  
		};
        $('#supersize').supersized(); 
    });
	*/
	
	$.fn.supersized.options = {  
			startwidth: 1024,  
			startheight: 768,
			minsize: .50,
			slideshow: 0,
			slideinterval: 5000  
	};
	$('#supersize').supersized(); 
	
	/*
	$("#supersize").css({opacity: '0.00'});
	
	$('#supersize').fadeTo(1500, 1, function(){										 
		$("#btn-intro").css({display:'block'});
		$('#btn-intro a').fadeTo(1500, 1);
		//$('#year a').animate({opacity: "0.4"}, "slow")
	});
	
	or
	
	$('#supersize').css('opacity', 0).animate({
    	opacity: 1
  	}, 1500);
	*/
	
	$("#supersize").hide().fadeIn(1500, function(){
		$("#menu-home").css({display:'block'});
		$('#menu-home li').fadeTo(1500, 1);
	});
	
}

/*****************/

this.hoverLink = function(){

	$("#alert-home").css({display:'none'});
	$("#menu-home li").css({opacity: 0});
	
	$("#menu-home li").hover(
      function () {
		$(this).fadeTo(500, .3);
		//$('#supersize').fadeTo(500, .8);
      }, 
      function () { 
		$(this).fadeTo(500, 1);
		//$('#supersize').fadeTo(500, 1);
      }
    );
}

/*****************/

this.toggleTab = function(){
	$("#tab-background .btn-slide").click(function(){
		$("#panel-1").slideToggle("slow");
		$(this).toggleClass("active");
		return false;
	});
	
	$("#tab-contact-me .btn-slide").click(function(){
		$("#panel-2").slideToggle("slow");
		$(this).toggleClass("active"); 
		return false;
	});
}
	
/*****************/

this.changeBackground = function(){
$("#panel-1 a").click(function(){
		//var path = $(this).attr("href");
		var img_id = $(this).attr("rel");
		var http_root = $("body").attr("rel");
		$('#supersize').fadeTo(1000, .0, function(){
			$(document.body).append("<div class=\"processing_background\"></div>");			
			var processing = $('.processing_background');
			processing
				.css({
					margin:"5px 0px 0px 5px",
					position:"absolute",
					visibility:"visible",
					zIndex: '100',
					top:'0',
					left:'0'
					});
			processing.html('<img src="'+http_root+rp_image_global+img_loader+'"/> loading');
			
			$("#supersize").load( http_root+rp_layout+'background_supersize.php?img_id='+img_id, {}, function(){
				$(".processing_background").remove();
				$("#supersize").css({opacity: 0});
				$('#supersize').supersized(); 
				$('#supersize').fadeTo(1500, 1.0);	
			});
		});
		
		return false;
	});
}

/*****************/

this.corner = function(){
$(function(){
		//$('h2').corner('6px');
		$('#tab_background h2').corner("bottom 8px");
		$('#tab_contact_me h2').corner("top 8px");
    });

}

/*****************/

this.tooltip = function(){	
	/* CONFIG */		
		xOffset = 10;
		yOffset = 20;		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result		
	/* END CONFIG */		
	$(".tooltip > a").hover(function(e){											  
		this.t = this.name;
		this.title = "";									  
		$("body").append("<p id='tooltip'>"+ this.t +"</p>");
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")
			.fadeIn("fast");		
    },
	function(){
		//this.title = this.t;		
		$("#tooltip").remove();
    });	
	
	$(".tooltip > a").mousemove(function(e){
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});
	
	$(".highlight").unbind('mouseenter mouseleave');
	/*
	$(".highlight").hover(function(e){											  
		$("#tooltip").remove();
		},function(){	
		$("#tooltip").remove();
    });
	*/
};

/*****************/

this.postForm_message = function(){
$("#form_data_message").submit(function(){
	$(".popup").remove();
	var path = $(this).attr('action');
	var http_root = $("body").attr("rel");
	var processing = $('.processing');
	processing
		.css({
			margin:"5px 0px 0px 10px",
			position:"absolute",
			visibility:"visible"
			});
		
	processing.html('<div><p><img src="'+http_root+rp_image_global+img_loader+'"/> loading</p></div>');
	$.post(path, $("#form_data_message").serialize(),function(xml){
			//var str = $("#form_data_message").serialize();
			//alert(str);
			$("label").removeClass('error');
			$("form img").css({visibility:'hidden'});
			processing
				.css({
					visibility:"hidden"
					});
			processForm_message(xml,http_root);
		});
	return false;
	});
}

this.processForm_message = function(xml,http_root){
	$(document.body).append("<div id=\"popup_result\" class=\"popup\"></div>");
	var target = $('#popup_result');
	var scrollTop = $(window).scrollTop();
	var scrollLeft = $(window).scrollLeft();
	var width = 400;
	var top = 200;
	var marginLeft = "-"+ ((scrollLeft + width)/2);
	target
		.css({
			//top:(scrollTop + top) + "px", 
			top:"50%",
			left:"50%",
			marginTop:"-100px",
			marginLeft:marginLeft + "px",
			width:width + "px",
			zIndex:"200",
			display:"none"
			});
		
	target.load(http_root+rp_layout+"result.php", {}, function(){
		$("error", xml).each(function(){
			var elementid = $(this).attr('elementid');
			var message = $(this).attr('message');
			$("#"+elementid+"_label").addClass('error');
			$("#"+elementid+"_img").css({visibility:'visible'});
			$(".result").append("<img src='"+http_root+rp_image_global+"attention.png' /> <b>" + message + "</b> <br />");
			target.fadeIn('slow', function(){	
				closePopup(target);
			});	
		});
		
		$("confirm", xml).each(function(){
		var message = $(this).attr('message');
		//alert(message);
		
		$(".result").append("<img src='"+http_root+rp_image_global+"attention.png' /> <b>If you have entered your email incorrectly you will not receive the activation email, and the message will not be able to reach me. Is your email correct?</b><br /><br /><b>" + message + "</b> <br /><br />");
		target.fadeIn('fast', function(){
			$(".form-confirm").css({display:'block'});
			postForm_confirm();
			closePopup(target);		
			});
		});
		
		$("result", xml).each(function(){
		var message = $(this).attr('message');
		$(".result").append("<img src='"+http_root+rp_image_global+"info.png' /> <b>" + message + "</b> <br />");
		target.fadeIn('fast', function(){
			clearFormElements('#form_data_message');
			closePopup(target);		
			});
		});
	});
}

this.postForm_confirm = function(){
	var target = $(".popup");
	var http_root = $("body").attr("rel");
	$("input[name=yes]").click(function(){
		$("#form-confirm").submit(function(){
			var path_post = $(this).attr('action');
			//alert(path_post);
			
			target.fadeOut('fast', function(){
				target.remove();
			});
			$.post(path_post, $("#form_data_message").serialize(),function(xml){
				//var str = $("#form_data_message").serialize();
				//alert(str);
				processForm_message(xml,http_root);
			});
			return false;
		});
	});	
	
	$("input[name=no]").click(function(){
		$("#form-confirm").submit(function(){
			target.fadeOut('fast', function(){
				target.remove();
			});
			return false;
		})	
	});
	
}