jQuery(document).ready(function(){ 
	
	// CONTACT FORM
	clique_contact_form();
	
	var projectPath;
	//init_mainScroll();
	
	jQuery.address.change(function(event) {  
		pageAddress = event.value.split('/')[1];
		var projectName = event.value.split('/')[2];
		//alert(pageAddress);
		//alert(event.path);
		//alert(projectName);
		//console.info(pageAddress);
		
		// if all projects page is opened
		if(pageAddress == 'projects' && projectName == undefined || pageAddress == '' && projectName == undefined){
			$.address.path('projects');
			$.address.title(titleBase + '| ' + pageAddress);
			currentPage = 'projects';
			currentSection = 'works';
			activeLink(pageAddress);
			openProjectsPage();
		}
		// if any perticular project is opened
		else if(pageAddress == 'projects' && projectName != ''){
			projectPath = event.path.substr(1);
			currentPage = projectName;
			currentSection = 'work';
			openProject(projectPath);
			if(currentProjectID==0){
				setCurrentProjectID(projectPath);
				//console.info(currentProjectID);
			}
		}
		// if any studio page is opened
		else if(pageAddress == 'about' || pageAddress == 'services' || pageAddress == 'clients' || pageAddress == 'jobs' || pageAddress == 'contact'){
			currentPage = pageAddress;
			currentSection = 'studio';
			$.address.title(titleBase + '| ' + pageAddress);
			// make clicked menu link current/active
			activeLink(pageAddress);
			openStudio(pageAddress);
			//console.info("PA-"+pageAddress);
		}
	});
	
	// PER PROJECT CLICK ADDRESS UPDATE
	// ---------------------------------
	jQuery('.scroll-item-img a').click(function(event) {
		event.preventDefault();
		
		// change address bar link to cliked project link
		jQuery('.scroll-item-img a').address(function() {
			return jQuery(this).attr('href').replace(/^#/, '');
		});
		
		currentProjectID = jQuery(this).parent().parent().index()+1;
		//console.info("fromClick:CURRENT PROJECT ID: " + currentProjectID);
	}); 
	
	// MAIN MENU CLICK ADDRESS UPDATE
	// -------------------------------
	jQuery('.topmenu li a').click(function(event) {
		event.preventDefault();
		// call #studio-content.animate() only when menu 
		// link is clicked and not while user scroll ends
		initFromMenuClick = true;
		pageUrl = $(this).attr('href').replace(/^#/, '');
		$.address.path(pageUrl);
	});
	
	// LOGO CLICK ADDRESS UPDATE
	// --------------------------
	jQuery('div.logo p a').click(function(event) {
		event.preventDefault();
		
		// change address bar link to projects link
		jQuery('div.logo p a').address(function() {
			return jQuery(this).attr('href').replace(/^#/, '');
		});
	});
	
	
	
	// PREV BUTTON ON MAIN PAGE
	// -------------------------
	jQuery('#main-nav-bar .btn-next').click(function(event) {
		event.preventDefault();
		/* if(counter<14){
			counter++;
			}
		nextElement = '#content-holder .scroll-content-item:nth-child('+counter+')';
		mainScroll.scrollToElement(nextElement, 400); */
		screenWidth = jQuery('body').width();
		maxProjectScroll = screenWidth - jQuery('#content-holder').width();
		if(mainScroll.x > maxProjectScroll ){
			mainScroll.scrollTo(screenWidth/2, 0, 600, true);
		}
	});
	
	// NEXT BUTTON ON MAIN PAGE
	// -------------------------
	jQuery('#main-nav-bar .btn-prev').click(function(event) {
		event.preventDefault();
		/* if(counter>1){
			counter--;
			}
		prevElement = '#content-holder .scroll-content-item:nth-child('+counter+')';
		mainScroll.scrollToElement(prevElement, 400); */
		screenWidth = jQuery('body').width();
		maxProjectScroll = screenWidth - jQuery('#content-holder').width();
		if(mainScroll.x < 0 ){
			mainScroll.scrollTo(-screenWidth/2, 0, 600, true);
		}
	});
	
	// PREV BUTTON CLICK
	// ------------------
	jQuery('a.prev-project').click(function(event) {
		event.preventDefault();
		prevProject();
	});
	
	// NEXT BUTTON CLICK 
	// ------------------
	jQuery('a.next-project').click(function(event) {
		event.preventDefault();
		nextProject();
	});
	
	// BACK/GRID BUTTON CLICK ADDRESS UPDATE
	// --------------------------------------
	jQuery('a.home').click(function(event) {
		event.preventDefault();
		
		// change address bar link to projects link
		jQuery('a.home').address(function() {
			return jQuery(this).attr('href').replace(/^#/, '');
		});
	});
	
	
	// CHANGE MOUSE CURSOR TO HAND GRAB ON SCROLLS
	// --------------------------------------------
	jQuery('#studio-scroll,#works-scroll,#project-content').hover(function(){
		$(this).css('cursor', 'url('+$.address.baseURL()+'/images/cursors/hand.cur), url('+$.address.baseURL()+'/images/cursors/hand.gif), move');
	});
	jQuery('#studio-scroll,#works-scroll,#project-content').mousedown(function(){
		$(this).css('cursor', 'url('+$.address.baseURL()+'/images/cursors/hand_grab.cur), url('+$.address.baseURL()+'/images/cursors/hand_grab.gif), move');
	});
	jQuery('#studio-scroll,#works-scroll,#project-content').mouseup(function(){
		$(this).css('cursor', 'url('+$.address.baseURL()+'/images/cursors/hand.cur), url('+$.address.baseURL()+'/images/cursors/hand.gif), move');
	});
	
	
	// STOP .ANIMATE() IF CLICKED WHILE ANIMATING
	// -------------------------------------------
	jQuery('#studio-content').click(function(event) {
		jQuery('#studio-content').stop();
		enableStudioScroll();
	});
	
	
	// SHOW/HIDE VIEW MORE BUTTON ON SINGLE PROJECT
	// -------------------------------------------
	jQuery('.view-more-left').click(function(event){
		event.preventDefault();
		screenWidth = jQuery('body').width();
		maxProjectScroll = screenWidth - jQuery('#project-content').width() - 340;// 340 is description div 300px + 40px padding
		if(projectScroll.x < 0 ){
			projectScroll.scrollTo(-600, 0, 400, true);
		}
	});
	// SHOW/HIDE VIEW MORE BUTTON ON SINGLE PROJECT
	// -------------------------------------------
	jQuery('.view-more-right').click(function(event){
		event.preventDefault();
		screenWidth = jQuery('body').width();
		maxProjectScroll = screenWidth - jQuery('#project-content').width() - 340;// 340 is description div 300px + 40px padding
		if(projectScroll.x > maxProjectScroll ){
			projectScroll.scrollTo(600, 0, 400, true);
		}
	});
	jQuery('#project-content,.view-more-left,.view-more-right').mouseenter(function(){
		jQuery('.view-more-left,.view-more-right').fadeIn(0);
	});

	jQuery('#project-content').mouseleave(function(){
		jQuery('.view-more-left,.view-more-right').fadeOut(0);
	});
	
	
	// READ APPLICATION GUIDELINES LINK
	// ----------------------------------
	jQuery('.application-guideline').click(function(event){
		event.preventDefault();
		myWindow=window.open('application-guideline.html','','width=450,height=600');
		myWindow.focus();
	});
	
	
	
});
// END document load 


////////////////////////////////////////////////////////////////////////
///////////////////     ALL SITE FUNCTIONS     /////////////////////////
////////////////////////////////////////////////////////////////////////

var counter=0;
var currentProjectID=0;
var nextProjectElement;
var prevProjectElement;
var mainScroll;
var studioScroll;
var projectScroll;
var currentPage;
var currentSection;
var pageAddress;
var initFromMenuClick = true;
var studioAnimTime = 700;
var easingType = 'easeInOutQuart';
var titleBase = 'Clique Studios Delhi India ';

/*
 * ADD .active CLASS TO CLICKED MENUBAR LINK
 */
function activeLink(activeUrl){
	// make clicked menu link current/active
	$('.topmenu ul li a').attr('class','');
	$(".topmenu [href='#" + activeUrl +"']").attr('class',"active");
}

/*
 * ADD FACEBOOK LIKE BUTTON
 */
function facebookLike() {
	jQuery('#social-elements').fadeIn(300); // show social elements
	var currentPageUrl = document.location.href;
	$('#social-elements').html('<fb:like href="' + currentPageUrl + '" layout="button_count" show_faces="false" send="true" width="170" action="like" font="segoe ui" colorscheme="light" />')
	if (typeof FB  != "undefined"){
		FB.XFBML.parse(document.getElementById('social-elements'))
	}
}

/*
 * SET NEXT PROJECT LINK
 */
function nextProject() {
	//console.info("fromNext:CURRENT PROJECT ID: " + currentProjectID);
	nextProjectElement = jQuery('#content-holder').find('.scroll-content-item').slice(currentProjectID,currentProjectID+1);
	var nextProjectLink = nextProjectElement.find('a').attr('href');

	jQuery('#social-elements').fadeOut(300); // hide social elements

	$.address.path(nextProjectLink); // change addressbar link to next project
	currentProjectID = currentProjectID+1;
	//console.info("next++CURRENT PROJECT ID: " + currentProjectID);
}

/*
 * SET PREV PROJECT LINK
 */
function prevProject() {
	//console.info("fromPrev:CURRENT PROJECT ID: " + currentProjectID);
	prevProjectElement = jQuery('#content-holder').find('.scroll-content-item').slice(currentProjectID-2,currentProjectID-1);
	
	if(currentProjectID > 1){
	var prevProjectLink = prevProjectElement.find('a').attr('href');
		currentProjectID = currentProjectID-1;
		prevProjectElement = jQuery('#content-holder').find('.scroll-content-item').slice(0,currentProjectID-1);
		jQuery('#social-elements ').fadeOut(300); // hide social elements
	}else{
		currentProjectID = 1;
	}

	$.address.path(prevProjectLink); // change addressbar link to prev project
	//console.info("prev--CURRENT PROJECT ID: " + currentProjectID);
}

/*
 * SET ID OF CURRENTLY OPENED PROJECT
 */
function setCurrentProjectID(currentAddress) {
	currentProjectID = jQuery('a[href$="'+ currentAddress +'"]').parent().parent().index()+1;
	//alert(currentProjectID);
}

/*
 * CLOSES STUDIO PAGE
 */
function closeStudioPage(){
	jQuery('#studio-scroll').fadeOut(300);
	if(studioScroll){
		//studioScroll.destroy();
		//studioScroll = null;
		studioScroll.disable();
	}
}

/*
 * CLOSES MAIN PAGE
 */
function closeMainPage(){
	jQuery('#content-holder').fadeOut(300);
	jQuery('#main-nav-bar').fadeOut(300);
	if(mainScroll){
		//mainScroll.destroy();
		//mainScroll = null;
		mainScroll.disable();
	}
}

/*
 * CLOSES SINGLE PROJECT PAGE
 */
function closeProjectPage(){
	jQuery('#project-pane').fadeOut(300);
	if(projectScroll){
		//projectScroll.destroy();
		//projectScroll = null;
		projectScroll.disable();
	}
}

/*
 * OPEN STUDIO PAGE
 */
function openStudio(pageAddress){	
	jQuery('#social-elements').fadeOut(300); // hide social elements
	closeMainPage();	// close all projects page
	closeProjectPage();	// close single project
		
	if(currentSection=='studio' && counter!=0){scrollDelay = 50;}else{scrollDelay = 500;}
	// open studio page
	jQuery('#studio-scroll').delay(scrollDelay).fadeIn(500, function(){
		counter++;
		init_studioScroll();
		//console.info("STUDIO scroll created");

		if(studioScroll){
			studioScroll.enable();
			//console.info(initFromMenuClick);
			//if(initFromMenuClick){
				scrollToStudioPage();
			//}
		}
	});
}

/*
 * SCROLLS TO CURRENT PAGE'S POSITION
 */
function scrollToStudioPage(){
	if(pageAddress=='about'){disableStudioScroll();$('#studio-content').animate({left:0},studioAnimTime, easingType, enableStudioScroll);}
	if(pageAddress=='services'){disableStudioScroll();$('#studio-content').animate({left:-520},studioAnimTime, easingType, enableStudioScroll);}
	if(pageAddress=='clients'){disableStudioScroll();$('#studio-content').animate({left:-1250},studioAnimTime, easingType, enableStudioScroll);}
	if(pageAddress=='jobs'){disableStudioScroll();$('#studio-content').animate({left:-1905},studioAnimTime, easingType, enableStudioScroll);}
	if(pageAddress=='contact'){disableStudioScroll();$('#studio-content').animate({left:-2365},studioAnimTime, easingType, enableStudioScroll);}
}
function disableStudioScroll(){
	studioScroll.disable();
	$('#studio-content').attr('class','disable');
}
function enableStudioScroll(){
	studioScroll.enable();
	$('#studio-content').removeAttr('class','disable');
}
	
/*
 * OPENS SPECIFIED PROJECT
 */
function openProject(projectName) {

	closeMainPage();	// close projects scroll
	closeStudioPage();	// close studio scroll
	
	if(!projectScroll){
		init_projectScroll();
	}
	projectScroll.enable();
	
	jQuery('#project-pane').delay(400).fadeIn(500);

	// fade off previous projects images
	jQuery("#project-content").fadeOut(300, function() {
		jQuery('#project-content').html("");
	});
	
	// hide previous projects desc on load so we can fadeIn new desc
	jQuery(".project-details").fadeOut(300, function() {
		jQuery(".project-details").remove();
	});
	
	// make sure to append / after projectName whether its present or not
	projectName = projectName.replace(/\/$/, '') + '/';
	projectUrl = projectName + 'index.php';
	
	// add preloading message
	jQuery('#project-preloader').remove(); 
	jQuery('<div id="project-preloader" style="position:fixed;width:140px;padding-top:225px;background: url(images/loading.gif) no-repeat scroll 0 226px transparent;">Loading project</div>').prependTo('#project-scroll');
	
	jQuery.ajax({
		type : 'POST',
		url: projectUrl,
		cache: false,

		data: {
			key : 'clique2011'
		},
		success: function(data){
						
			// remove preloading message  
			jQuery('#project-preloader').fadeOut(300,function(){
				jQuery('#project-preloader').remove();
			});
	

			//$(".fb-meta").remove();
			//$('head').append('<meta class="fb-meta" content="TESTING CLIQUE STUDIOS PVT LTD" property="og:title">  <meta  class="fb-meta" content="website" property="og:type">  <meta  class="fb-meta" content="http://cliqueanimation.com" property="og:url">  <meta class="fb-meta"  content="http://cliqueanimation.com/images/clique_logo_blk.jpg" property="og:image">  <meta class="fb-meta" content="Clique Studios" property="og:site_name">  <meta class="fb-meta" content="Share out work with your friends" property="og:description">');

			
			facebookLike();
			
			// enabling this used to show project-content only after first image loaded completely
			// jQuery('#project-content').hide(); // line#423 also commented
			
			jQuery('#projectImages li iframe').css('background','none');
			
			jQuery('#project-content').html(data);
			
			// remove proj desc from original loaded data
			project_detail = jQuery("#project-content div").detach();
			
			// get/set per project title + strip html tags from h1
			pTitle = jQuery(project_detail).find('h1').html().replace(/(<([^>]+)>)/ig,""); 
			$.address.title(titleBase + '| ' + pTitle);
			
			// set scrollers width
			projectWidth = jQuery("#projectImages").attr("width");
			jQuery('#project-content').css('width', parseInt(projectWidth)+0);

			// remove previous description
			jQuery(".project-details").remove();
			
			// add desc to project description div
			jQuery(project_detail).prependTo('#project-description');
			jQuery(".project-details").hide();
			jQuery(".project-details").fadeIn(300);
			
			// show social elements
			jQuery('#social-elements').fadeIn(300);
			
			// show video loader gif
			if ($("#projectImages li iframe").length > 0){
				jQuery('#projectImages li iframe').css('background','url(images/loading_video.gif) no-repeat scroll 50% 50% transparent');
			}

			projectScroll.refresh();
			load_images();
		}
	}) 
	
	var async = false ;
	var images = [];
	var baseUrl = getBaseURL();
	var imgUrl;

	function load_images(){
		// store all images found in an array
		tn_array = jQuery("#projectImages img").map(function() {
			return jQuery(this).attr("src");
		});
		
		for ( var i = 0; i < tn_array.length; i++ ) {
			imgUrl = baseUrl + tn_array[i];
			
			images.push(imgUrl);
		} 
		
		jQuery({}).imageLoader({
			images: images,
			async: async,
			complete: function() {
				jQuery('#project-content').fadeIn(300);
				projectScroll.refresh();
			}
		});	
	}
}

/*
 * OPENS ALL PROJECTS PAGE
 */
function openProjectsPage() {
	// intro mainScroll animation happens in 
	// "\js\preloader\queryLoader.js" near line#181
	closeStudioPage();							// close studio page
	jQuery('#social-elements ').fadeOut(300);	// hide social elements
	closeProjectPage();							// hide opened project
	
	jQuery('#main-nav-bar').delay(700).fadeIn(500);
	jQuery('#content-holder').delay(500).fadeIn(300, function(){
		if(!mainScroll){
			init_mainScroll();
			//console.info('now created main scroll - '+ mainScroll);
		}
	});
	if(mainScroll){
		mainScroll.enable();
	}
}

/*
 * GET SITES BASE URL
 */
function getBaseURL() {
    var url = location.href;  // entire url including querystring - also: window.location.href;
    var baseURL = url.substring(0, url.indexOf('/', 14));

    if (baseURL.indexOf('http://localhost') != -1) {
        // Base Url for localhost
        var url = location.href;  // window.location.href;
        var pathname = location.pathname;  // window.location.pathname;
        var index1 = url.indexOf(pathname);
        var index2 = url.indexOf("/", index1 + 1);
        var baseLocalUrl = url.substr(0, index2);

        return baseLocalUrl + "/";
    }
    else {
        // Root Url for domain name
         return baseURL + "/";
		//return baseURL + "/"  + "rnd/clique_2011/";
    }

}


/*
 * INSTANTIATE MAIN ISCROLL
 */
function init_mainScroll() {
	
	mainScroll = new iScroll('works-scroll', {
		bounce: false,
		vScroll: false,
		momentum: true,
		hScrollbar: false,
		vScrollbar: false
	 });
}

/*
 * INSTANTIATE STUDIO ISCROLL
 */
function init_studioScroll() {
	if(!studioScroll){
		studioScroll = new iScroll('studio-scroll', {
			/*snap: '.section',  */
			useTransform: false,
			bounce: false,
			vScroll: false,
			momentum: true,
			hScrollbar: false,
			vScrollbar: false,
			onBeforeScrollStart: function (e) {
				var target = e.target;
				var ie = (document.all) ? true : false;
				if(!ie){
					while (target.nodeType != 1) target = target.parentNode;

					if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA')
						e.preventDefault();

				}
			},
			onScrollMove: function (){
				//console.info(this.x);
				initFromMenuClick = false;
				if(this.x<=0 && this.x>-280){activeLink('about');}
				if(this.x<-280 && this.x > -700){activeLink('services');}
				if(this.x<-700 && this.x > -1500){activeLink('clients');}
				if(this.x<-1500 && this.x > -2200){activeLink('jobs');}
				if(this.x<-2200){activeLink('contact');}
			},
			onScrollEnd: function () {
				//console.info(this.x);
				initFromMenuClick = false;
				if(this.x<=0 && this.x>-280){$.address.path('about');scrollToStudioPage();activeLink('about');}
				if(this.x<-280 && this.x > -700){if(this.x!=-520){$.address.path('services');scrollToStudioPage();activeLink('services')}}
				if(this.x<-700 && this.x > -1500){if(this.x!=-1250){$.address.path('clients');scrollToStudioPage();activeLink('clients');}}
				if(this.x<-1500 && this.x > -2200){if(this.x!=-2000){$.address.path('jobs');scrollToStudioPage();activeLink('jobs');}}
				if(this.x<-2200)
					{
						$.address.path('contact');activeLink('contact');
						$('#studio-content').animate({left:-2365},studioAnimTime, easingType);
					}
			}
		 });
	 }
}

/*
 * INSTANTIATE PROJECTS ISCROLL
 */
function init_projectScroll() {
	
	projectScroll = new iScroll('project-scroll', {
		bounce: false,
		vScroll: false,
		momentum: true,
		hScrollbar: false,
		vScrollbar: false
	 });
}


/*
 * GET SCROLLING DIVS MARIX VALUES
 */
var notDefined = function(value) {
        return value == null || value == undefined || value == "" || value == "none";
    },
    
    // Tries to read the CSS rotate data.
    // Starts by reading -webkit-transform, if it
    // fails then read -moz-transform and so on
    getTranslation = function ($e) {
        var value = $e.css('-webkit-transform');
		alert(value);
        if (notDefined(value)) {
            value = $e.css('-moz-transform');
            if (notDefined(value)) {
                value = $e.css('-o-transform');
                if (notDefined(value)) {
                    value = $e.css('-ms-transform');
                    if (notDefined(value)) {
                        value = $e.css('transform');
                    }
                }
            }
        }
		
		// Get translate x & y
		var explodedMatrix = value.replace(/^matrix\(/i, '').split(/, |\)$/g);
			translate = {
				x: parseInt(explodedMatrix[4], 10),
				y: parseInt(explodedMatrix[5], 10)
			};
        return translate;
    };	

function clique_contact_form(){

	$('#Send').click(function() {
			
			$(".success").fadeOut(300);
			
			// name validation
			var nameVal = $("#name").val();
			if(nameVal == '') {
				
				$("#name_error").remove();
				$("#name").after('<label class="error" id="name_error">Please enter your name.</label>');
				$("#name_error").hide();
				$("#name_error").fadeIn(300);
				return false
			}
			else
			{
				$("#name_error").fadeOut(300);
			}
			
			// email validation
			//var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
			var emailReg = /^\w[\w|\.|\-]+@\w[\w|\.|\-]+\.[a-zA-Z]{2,4}$/;
			var emailaddressVal = $("#email").val();
			
			if(emailaddressVal == '') {
				$("#email_error").remove();
				$("#email").after('<label class="error" id="email_error">Please enter your email address.</label>');
				$("#email_error").hide();
				$("#email_error").fadeIn(300);
				return false
			}
			else if(!emailReg.test(emailaddressVal)) {
				$("#email_error").remove();
				$("#email").after('<label class="error" id="email_error">Enter a valid email address.</label>');
				$("#email_error").hide(); 
				$("#email_error").fadeIn(300);
				return false
			}
			else
			{
				$("#email_error").fadeOut(300);
			}
			
		jQuery('#Send').attr('disabled', 'disabled');
		
		jQuery('.loadergif').fadeIn(200);
		var mailData = $("#MYFORM").serialize();
			jQuery.ajax({
				type: "POST",
				url: "js/contact/sendmail.php",
				data: mailData,
				success: function(response){
					if(response==1)
					{	
						$('#Send').removeAttr('disabled');
						$('.loadergif').fadeOut(200);
						$("#after_submit").remove();
						$("#Send").after('<label class="success" id="after_submit">Your message has been submitted.</label>');
						$(".success").hide();
						$(".success").fadeIn(300);
						change_captcha();
						clear_form();
					}
					else
					{	
						$('.loadergif').fadeOut(200);
						$("#after_submit").remove();
						$("#Send").after('<label class="error" id="after_submit">Error ! invalid captcha code .</label>');
						$(".success").hide();
						$("#after_submit").hide();
						$("#after_submit").fadeIn(300);
					}
				}				
			});
		return false;
	});
	 
	 // refresh captcha
	$('img#refresh').click(function(){  
			change_captcha();
	});
	 
	function change_captcha()
	{
	 	document.getElementById('captcha').src="js/contact/get_captcha.php?rnd=" + Math.random();
	}
	 
	function clear_form()
	{
		$("#name").val('');
		$("#email").val('');
		$("#message").val('');
		$("#code").val('');
	}
}