$(document).ready(function() {
	
	//add Class=Last to last child of LIs
	$("li:last-child").addClass('last');
		
	
	//-------------------------------------------------------------------
	//----------- STUPID BROWSER DETECTION (IE6) ------------ (I HATE IE)
	
	//detect the sucker
	function badBrowser(){
		if($.browser.msie && parseInt($.browser.version) <= 6) {
			return true;
		} else {
			//if($.browser.mozilla || $.browser.safari){ return true;} //test Firefox or Safari
			return false;
		}
	}
	
	//plant cookie
	function setBadBrowser(c_name,value,expiredays) {
		var exdate=new Date();
		exdate.setDate(exdate.getDate()+expiredays);
		document.cookie=c_name+ "=" + escape(value) +
	        ((expiredays==null) ? "" : ";expires=" +
	        exdate.toGMTString());
	}
	
	//get cookie
	function getBadBrowser(c_name) {
		if (document.cookie.length>0){
		   c_start=document.cookie.indexOf(c_name + "=");
		   if (c_start!=-1){
		    c_start=c_start + c_name.length+1;
		    c_end=document.cookie.indexOf(";",c_start);
		    if (c_end==-1) c_end=document.cookie.length;
		    return unescape(document.cookie.substring(c_start,c_end));
		    }
		}
	return "";
	}
	
	//handle the sucker
	if(badBrowser() && getBadBrowser('browserWarning')!='seen' ){
		$("<div id='browserWarning'><h1>Warning!</h1><p>The web browser that you are currently using can not support many enhanced features this website and many others provide.<br />Please switch to <a href='http://getfirefox.com'>FireFox</a>, <a href='http://www.apple.com/safari/'>Safari</a> or <a href='http://www.microsoft.com/windows/downloads/ie/getitnow.mspx'>Internet Explorer 7</a>. Thanks!</p><a id='warningClose' href='#'>close</a></div>").prependTo("body");
	}
				
	$('div#browserWarning a#warningClose').click(function(){
		setBadBrowser('browserWarning','seen');
		$('#browserWarning').remove();
		$("div#warningBg").remove();
		return false;			 
	});
	
	
	//-------------------------------------------------------------------	
	//-------------------------- TOP BAR --------------------------------
		
	$('#topbar #utilsleft li, #topbar #utilsright li')
	.removeClass('highlight')
	.find('a')
	.append('<span class="hover" />').each(function () {

		var $span = $('> span.hover', this).css('opacity', 0);

		$(this).hover(function () {
			$span.stop().fadeTo(300, 1);
		}, function () {
			$span.stop().fadeTo(500, 0);		
		});
	});
	
	//-------------------------------------------------------------------
	//------------------------- TOOL TIPS -------------------------------
	
	//----- Add Tooltips -----
	
	// TopBar
	$('ul#utilsright').after('<div class="toptip">&nbsp;</div>');
	// Sidebar Resume
	$('a#downloadresume').before('<div class="resumetip">File Size = <strong>164 Kb</strong><br/><small>You can also check the <br/><a href="http://www.sebastianjt.com/about/resume">online version</a></small>.</div>');
	// Twitter Thumbnail
	$('#twittertop a.twitterthumbcont').before('<div class="tweettip">I like sharing all kinds of useful, web-related resources. Come and <a href="http://twitter.com/sebastianjt">follow me</a>!</div>');
	// Flickr Photos
	$('ul#photostream').before('<div class="flickrtip"></div>');

	
	//----- Setting CSS Rules (validation) -----
	
	$('div.toptip, div.resumetip, div.tweettip, div.flickertip').css({'_background-color' : '#fff'});
	$('div.toptip, div.flickrtip').css({'-moz-box-shadow' : '0px 0px 6px #222', '-webkit-box-shadow' : '0px 0px 6px #222', '-moz-border-radius' : '8px', '-webkit-border-radius' : '8px'});
	
	//----- Activate Tool tips -----
	
	$("#topbar a[title]").tooltip({
		tip: '.toptip',
		effect: 'fade',
		fadeOutSpeed: 500,
		position: 'bottom center',
		offset: [0, 0],
		opacity: 0.9
	}).dynamic({
		left: {
			offset: [0, -45]
		},
		classNames: 'top right bottom left'
	});
	
	$("#downloadresume").tooltip({
		tip: 'div.resumetip'
	});

	$("#twittertop a.twitterthumbcont img").tooltip({
		tip: 'div.tweettip',
		position: 'top center',
		offset: [25, 32.5]
	});

	$("#photostream a[title]").tooltip({
		tip: 'div.flickrtip',
		effect: 'toggle',
		position: 'top center',
		offset: [10, 0],
		opacity: 0.9,
		lazy: true
	});

	//-------------------------------------------------------------------	
	//---------------------- PROMO BANNER -------------------------------
	
	//----- Promo Banner Open Close -----
	
	var $cropbox = $('#promobanner div#crop');
	$cropbox.after('<div id="openclose"><span id="close"><img src="http://www.sebastianjt.com/imgs/promo_banner_arrow_up.jpg" alt="Close promo banner" /></span><span id="open"><img src="imgs/promo_banner_arrow_down.jpg" alt="Open promo banner" /></span></div>');
		
	$('div#openclose').toggle(
				
		function(){
			$cropbox.fadeOut(400);
			$('div#promobanner img.slideimg').fadeOut(400);
			$('a#backbtn').fadeOut(400);
			$('a#nextbtn').fadeOut(400);
			$('div#navi').fadeOut(400);				
			
			setTimeout(function(){
				$('div#promobanner').animate({height: "26px"}, 500);
				$('span#open').fadeIn('medium');	
				$('span#close').fadeOut('medium');
			}, 410);
		},
		
		function(){
			$('div#promobanner').animate({height: "192px"}, 500);
			$('span#close').fadeIn('medium');
			$('span#open').fadeOut('medium');
			
			setTimeout(function(){
				$cropbox.fadeIn(600);
				$('div#promobanner img.slideimg').fadeIn(300);
				$('a#backbtn').fadeIn(450);
				$('a#nextbtn').fadeIn(450);
				$('div#navi').fadeIn(450);
			}, 650);
			
		}

	);
	
	//----- Promo Banner Slider -----
	
	if (!$("#promobanner div.slide").hasClass("dberror")) {
		//Add Navi and Next/Prev Buttons for navigation
		$("#promobanner #crop").before('<div id="navi"></div>');
		$("#promobanner #crop").after('<a id="backbtn">Back</a>');
		$("#promobanner #crop").after('<a id="nextbtn">Next</a>');

		// initialize scrollable  
	    $('div#crop').scrollable({ 
	        size: 1, 
	        items: 'div#widearea',
			next: 'a#nextbtn',
	   		prev: 'a#backbtn',
			hoverClass: 'hover',
			speed: 500
	    }).circular().autoscroll({
			interval: 10000
		}).navigator({ 
	        navi: "#navi", 
	        activeClass: 'current'
	    });		
	}

	//-------------------------------------------------------------------	
	//-------------------- PROJECT SCROLLER -----------------------------

	$("#projectcont .thumbscroller").after('<div id="navi"></div>');
	$("#projectcont .thumbscroller").after('<a id="backbtn">Back</a>');
	$("#projectcont .thumbscroller").after('<a id="nextbtn">Next</a>');

	// initialize scrollable  
    $('div.thumbscroller').scrollable({ 
        size: 1, 
		next: 'a#nextbtn',
   		prev: 'a#backbtn',
		speed: 500
    }).circular().autoscroll({
		interval: 5000
	}).navigator({ 
        navi: "#navi", 
        activeClass: 'current'
    });		
	
	//-------------------------------------------------------------------
	//---------------------- FORM VALIDATION ----------------------------
	
	// Add Disabled Attribute and Class to Send Button
	$("form#contactform input#sendbtn").addClass('disabled').attr({ disabled: "disabled"});
				
	// Add check boxes to form
	$("form#contactform div.indv_box input, form#contactform textarea").after("<span class='checked'/>");
	
	// Add X to email
	$("form#contactform div.indv_box input#email").after("<span class='cross'/>");
		
	// Form Focus - remove text
	$("form#contactform input.text, form#contactform textarea").focus(function() {
		if (this.value == this.defaultValue) {
			$(this).val("");
		}
	});
	
	// Trim String
	function trim(stringToTrim) {
		return(stringToTrim.replace(/^\s+|\s+$/g,""));
	}

	// Value Cleanup Function
	function formValueCleanUp(inputInstance) {
		if (inputInstance.value == '' || inputInstance.value == null){  
			inputInstance.value = inputInstance.defaultValue;
			return false;
		}
		if (inputInstance.value == inputInstance.defaultValue) {
			return false;
		}
		if (inputInstance.value != '' && inputInstance.value != inputInstance.defaultValue) {			
			return true;
		}
	}
	
	// Form Blur - Return Text
	$("form#contactform input.text, form#contactform textarea").blur(function() {
		this.value = trim(this.value);
				
		//----- Check for all correct inputs -----

		// First Name
		if (this.id == 'fname'){  
			if (formValueCleanUp(this)) {
				$(this).nextAll("span").fadeIn(1000);
				fnameChecked = true;
			} else {
				$(this).nextAll("span").fadeOut(1000);
				fnameChecked = false;
			}
		} 

		// Last Name
		if (this.id == 'lname'){  
			if (formValueCleanUp(this)) {
				$(this).nextAll("span").fadeIn(1000);
				lnameChecked = true;
			} else {
				$(this).nextAll("span").fadeOut(1000);
				lnameChecked = false;
			}
		}

		// Email
		if (this.id == 'email'){
			if (formValueCleanUp(this)) {
				var emailToVal = this.value;
				var emailPattern = /^\w+([\.\-]?\w+)*@{1}\w+([\.\-]?\w+)*(\.{1}[a-zA-Z]{2,4})+$/;
				var validation = emailPattern.test(emailToVal);

				if (validation) {
					$(this).nextAll("span.checked").fadeIn(1000);
					$(this).nextAll("span.cross").fadeOut(200);
					emailChecked = true;
				} else {
					$(this).nextAll("span.checked").fadeOut(200);
					$(this).nextAll("span.cross").fadeIn(1000);
					emailChecked = false;
				}		
			} else {
				$(this).nextAll("span").fadeOut(1000);
				emailChecked = false;
			} 
		}
		
		// Coming Message
		if (this.id == 'comingmessage'){  
			if (formValueCleanUp(this)) {
				$(this).nextAll("span").fadeIn(1000);
				comingMessageChecked = true;
			} else {
				$(this).nextAll("span").fadeOut(1000);
				comingMessageChecked = false;
			}
		} 
		
		// Are all values checked ?
		if (fnameChecked && lnameChecked && emailChecked && comingMessageChecked) {						
			activateSendButton();					
		} else {			
			deactivateSendButton();
		}				
	});
						
	function activateSendButton(){
		$("form#contactform input#sendbtn").removeAttr("disabled").removeClass('disabled');
	}
	
	function deactivateSendButton(){
		$("form#contactform input#sendbtn").attr({ disabled: "disabled"}).addClass('disabled');
	}
						
	// ------------------------
	// Clear all checked values
	$("form#contactform input.reset").click(function() {
		$("form#contactform input.text, form#contactform textarea").nextAll("span").fadeOut(500);
		deactivateSendButton();
		
		fnameChecked = false;
		lnameChecked = false;
		emailChecked = false;
		comingMessageChecked = false;
	
	});

	//-------------------------------------------------------------------	
	//--------------------- COLLAPSABLE ITEMS ---------------------------

	// Capture the original height of each collapsable element
	// Set the height of the collapsable element to 0px
	$('.collapsable').each(function(){
		$(this).attr({ name : $(this).css('height') });
		$(this).css({height : '0px'});
	});
	
	// Add View More/Less Button	
	$('.collapsable').after('<a class="viewmore down" href="#">View More</a>');
	
	// The Button Functionality
	$(".collapsable + a.viewmore").toggle(
		
		function () {
			// Properties for the View More/Less Button
			$(this).removeClass('down');
			$(this).addClass('up');
			$(this).html('View Less');
			
			// the collapsable div
			var boxHeight = $(this).prev('.collapsable').attr('name');		
			$(this).prev('.collapsable').animate({height: boxHeight}, 500);
	    },

		function () {
			// Properties for the View More/Less Button
			$(this).removeClass('up');
			$(this).addClass('down');
			$(this).html('View More');

			// the collapsable div
			$(this).prev('.collapsable').animate({height: "0px"}, 500);
	    }
	);
	
	//--------------------------------
	
	// Capture the original height of each collapsable element
	$('.collapsable2').each(function(){
		$(this).attr({ name : $(this).css('height') });
	});
	
	// Add View More/Less Button	
	$('.collapsable2').after('<a class="viewmore up" href="#">View Less</a>');
	
	// The Button Functionality
	$(".collapsable2 + a.viewmore").toggle(
		
		function () {
			// Properties for the View More/Less Button
			$(this).removeClass('up');
			$(this).addClass('down');
			$(this).html('View More');

			// the collapsable div
			$(this).prev('.collapsable2').animate({height: "0px"}, 500);
	    },

		function () {
			// Properties for the View More/Less Button
			$(this).removeClass('down');
			$(this).addClass('up');
			$(this).html('View Less');
			
			// the collapsable div
			var boxHeight = $(this).prev('.collapsable2').attr('name');		
			$(this).prev('.collapsable2').animate({height: boxHeight}, 500);
	    }
	);

			
	//-------------------------------------------------------------------	
	//------------------------- FANCY BOX -------------------------------
	
	// Project Page
	$("#content div#projectcont div.images a.plaunch.fancy").fancybox({ 
		'zoomSpeedIn': 400, 
		'zoomSpeedOut': 400,
		'overlayOpacity': 0.6,
		'overlayShow': true,
		'frameHeight': 530,
		'frameWidth': 730
	});
 	
	// Portfolio Page
	$("#content ul.projectcont li.project a.plaunch.fancy").fancybox({ 
		'zoomSpeedIn': 400, 
		'zoomSpeedOut': 400,
		'overlayOpacity': 0.6,
		'overlayShow': true,
		'frameHeight': 530,
		'frameWidth': 730
	});
		
	// Networks Flickr Photos
	$("#content div#flickr ul#photostream li a").fancybox({ 
		'zoomSpeedIn': 400, 
		'zoomSpeedOut': 400,
		'overlayOpacity': 0.6,
		'overlayShow': true,
		'frameHeight': 500,
		'frameWidth': 800
	});
		   		
	//-------------------------------------------------------------------
	//---------------- EXTERNAL LINKS - Parent Window -------------------

	// To make links external add the external class to them - class="external"
	$("a.external").attr({ target: "_blank"});
	
	$(".external a").attr({ target: "_blank"});
	
	// ---------------------
	// Other Links that need to be accessed differently
	
	// Footer Links
	$("div#footer div#flickrbox a, div#footer div#twitter_container a").attr({ target: "_blank"});

	// Networks Page Links
	$("div#twitter a, div#flickr a").attr({ target: "_blank"});
	
	// Portfolio Page Links
	$("body#portfolio.web a.plaunch").attr({ target: "_blank"});
	
	//-------------------------------------------------------------------
	//-------------------------------------------------------------------	

});