var zentall;
zentall = zentall || {};
zentall.page = zentall.page || {};
zentall.carousel = zentall.carousel || {};
zentall.portfolio = zentall.portfolio || {};

zentall.page.DEBUGGING = true;


$(document).ready(function(){
	zentall.page.init();
	zentall.portfolio.init();
	zentall.carousel.init();	
});

zentall.page.init = function() {
	
	//ie6 image flicker
	try {
	  document.execCommand("BackgroundImageCache", false, true);
	} catch(err) {}
	

	//portfolio carousel links
	$("#detail-close").click(function(event){
		event.preventDefault();
		$('#detail-dialog').fadeOut('fast', function() { 
			$("#overlay").fadeOut('fast');
			$('#captionpanel').css('visibility', 'hidden');
			$('#captionpanel').css('width', '100%');
			$('#screenshot').remove(); 
			$('#captiontext').remove(); 
		});
	});
		
	if ($.browser.msie) {
		$('a').bind('focus', function(event) {
			$(this).blur();
		});
	}
};


//*******************//
// PORTFOLIO         //
//*******************//

zentall.portfolio.SCROLL_LOCK = false;
zentall.portfolio.CAROUSEL_POS = 0;

zentall.portfolio.init = function() {
	
	//only initialize the portfolio page if we're on the portfolio page
	if($('#portfolio').length > 0) {
	
			var p_index = location.hash.split('#')[1];
			var zoomOnceFlag = false;
	
			if (p_index != undefined) {
				if (!zoomOnceFlag) {
		
					zentall.portfolio.moveToProject(parseInt(p_index));
					zoomOnceFlag = true;
			
			
				}
			}
			
			var nDots = $('#dots li').length;
			$('#dots').css({width: 10*nDots});
	 
			//dynamically sizing 3 columns
			col1 = $('.col1');
			col1_last = $('.col1 .last .topright');
			col2 = $('.col2');
			col2_last = $('.col2 .last .topright');
			col3 = $('.col3');
			col3_last = $('.col3 .last .topright');
	
			if (col1.height() > col2.height() && col1.height() > col3.height()) {
				//col1
					col2_last.css({paddingBottom: col1.height() - col2.height() + 4.5});
					col3_last.css({paddingBottom: col1.height() - col3.height() + 4.5});	
			} else if (col2.height() > col1.height() && col2.height() > col3.height()) {
				//col2
					col1_last.css({paddingBottom: col2.height() - col1.height() + 4.5});
					col3_last.css({paddingBottom: col2.height() - col3.height() + 4.5});	
			} else {
				//col3
				col1_last.css({paddingBottom: col3.height() - col1.height() + 4.5});
				col2_last.css({paddingBottom: col3.height() - col2.height() + 4.5});	
			}
	
			
			//right and left hover effects
			$("#portcarousel-right").hover(
				function () {
					$(this).find("img")[0].src = $(this).find("img")[0].src.replace(/.png/,'-over.png');	
				}, 
				function () {
					$(this).find("img")[0].src = $(this).find("img")[0].src.replace(/-over.png/,'.png');	
				}
			);
			$("#portcarousel-left").hover(
			 	function () {
			 		$(this).find("img")[0].src = $(this).find("img")[0].src.replace(/.png/,'-over.png');	
			 	}, 
				function () {
					$(this).find("img")[0].src = $(this).find("img")[0].src.replace(/-over.png/,'.png');	
				}
			);
	
			//dots clicks
			$("#dots > li").each(function(){ 
				$(this).click(function(event){
		
					event.preventDefault();
					var thisIndex = parseInt($(this).attr('id').substring(4));
					zentall.portfolio.moveToProject(thisIndex);		
	
				});
			});
	
			//move right
			$("#portcarousel-right").click(function(event){
			   event.preventDefault();

				//move portcarousel
				var kids = $('#dots > li');
				if (zentall.portfolio.CAROUSEL_POS < (kids.length - 1) && !zentall.portfolio.SCROLL_LOCK) {
					$("#portcarousel-detail").stop();

					zentall.portfolio.CAROUSEL_POS = zentall.portfolio.CAROUSEL_POS + 1;
					var newPos = (zentall.portfolio.CAROUSEL_POS + 1) * 887; 
					$("#portcarousel-detail").animate({ 
						left: "-"+newPos+"px"
				    }, 700 );

					//move dots		
					var selectNextFlag = false;
					$('#dots > li').each(function() {
						if ( $(this).hasClass('selected') ) {
							$(this).removeClass('selected');
							selectNextFlag = true;
						} else {
							if (selectNextFlag) {
								$(this).addClass('selected');
								selectNextFlag = false;
							}
						}	
					});

				} else {

					$("#portcarousel-detail").stop();

					zentall.portfolio.SCROLL_LOCK = true;
					zentall.portfolio.CAROUSEL_POS = zentall.portfolio.CAROUSEL_POS + 1;
					var newPos = (zentall.portfolio.CAROUSEL_POS + 1) * 887; 
					zentall.portfolio.CAROUSEL_POS = 0;
					$("#portcarousel-detail").animate({ 
						left: "-"+newPos+"px"
				      }, 700, function() {
							//after
							$('#portcarousel-detail').css('left', '-887px');
							zentall.portfolio.SCROLL_LOCK = false;
						});


					$('#dots > li:last').removeClass('selected');
					$('#dots > li:first').addClass('selected');

				}


			 });
			
			//move left
			$("#portcarousel-left").click(function(event){
			   event.preventDefault();

				var kids = $('#dots > li');


				//move carousel
				if (zentall.portfolio.CAROUSEL_POS > 0 && !zentall.portfolio.SCROLL_LOCK) {
					$("#portcarousel-detail").stop();			
					zentall.portfolio.CAROUSEL_POS = zentall.portfolio.CAROUSEL_POS - 1;
					var newPos = (zentall.portfolio.CAROUSEL_POS + 1) * 887;
					$("#portcarousel-detail").animate({ 
						left: "-"+newPos+"px"
				      }, 700 );

					//move dots
					for(var i = 0; i < kids.length; i++) {
						thisKid = kids[i];
						if ($(thisKid).hasClass('selected')) {
							$(thisKid).removeClass('selected');

							prevKid = kids[i-1];
							$(prevKid).addClass('selected');
						} 

					}

				} else {
						zentall.portfolio.SCROLL_LOCK = true;
						$("#portcarousel-detail").stop();
						zentall.portfolio.CAROUSEL_POS = kids.length - 1;

						$("#portcarousel-detail").animate({ 
							left: "0px"
					      }, 700, function() {
								//after
								var newPos2 = (kids.length) * 887; 
								$("#portcarousel-detail").css('left', '-'+newPos2+'px');
								zentall.portfolio.SCROLL_LOCK = false;
						});

						$('#dots > li:last').addClass('selected');
						$('#dots > li:first').removeClass('selected');
				}


			 });
	
			//$(".zoom").each(function(){ 
			$(".portcarousel-item a").each(function(){ 
				
				$(this).click(function(event){
					event.preventDefault();

					zentall.portfolio.projectZoom($(this));

				});
			});
	
			$(".quicklink").each(function(){ 
				$(this).click(function(event){
					event.preventDefault();
					var thisIndex = parseInt($(this).attr('id').substring(5));
		
					zentall.portfolio.moveToProject(thisIndex);
		
				});
		
			});
	}
};

zentall.portfolio.moveToProject = function(thisIndex) {
		var newPos = (thisIndex + 1) * 887;
		zentall.portfolio.CAROUSEL_POS = thisIndex;
		$("#portcarousel-detail").stop();
		$("#portcarousel-detail").animate({ 
			left: "-"+newPos+"px"
      	}, 700);

		
		var kids = $('#dots > li');
		for(var i = 0; i < kids.length; i++) {
			thisKid = kids[i];
			if ($(thisKid).hasClass('selected') && $(thisKid).attr('id') != ('dot_'+thisIndex)) {
				$(thisKid).removeClass('selected');
			} else if ($(thisKid).attr('id') == ('dot_'+thisIndex)) {
				$(thisKid).addClass('selected');
			}
		}
};

zentall.portfolio.projectZoom = function(thisZoomBtn) {
	
	
		$("#detail-dialog").append('<img id="screenshot" src="'+thisZoomBtn.attr("href")+'" border="0">');
		
		$("#overlay").fadeIn('fast');
		$('#detail-dialog').fadeIn('slow');

		thisCaptionText = thisZoomBtn.find('img').attr('alt');
		if (thisCaptionText != '') {
			//$('#caption').append('<span id="captiontext">'+thisCaptionText+'</span>');
			//$('#captionpanel').css('visibility', 'visible');
				
			// Don't bring in the caption until the image is loaded, so that
			// dimensions etc. get calculated correctly.
			$('#screenshot').load(function() {
				$('#caption').append('<span id="captiontext">'+thisCaptionText+'</span>');
				$('#captionpanel').css('visibility', 'visible');
				var margin = 14;
				var width = $('#caption').width() + 2*margin;
				$('#captionpanel').css('width', width+'px');
			});
		}
	
	
};


/************************/
/* MAIN CAROUSEL        */
/************************/


zentall.carousel.LOADED_COUNT = 0;
zentall.carousel.BEGIN_FLAG = false;
zentall.carousel.CAROUSEL_POS = 0;
zentall.carousel.MOVE_LOCK = false;
zentall.carousel.ADVANCE_TIMER = {};
zentall.carousel.ADVANCE_INTERVAL = 5000;

zentall.carousel.INIT_DURATION = 1000;
zentall.carousel.ADV_DURATION = 500;



zentall.carousel.init = function () {
	
	//debug('carousel init');
	
	if($('#home').length > 0) {
		
			var maxlength = $('#carousel-screens li').length;
			//debug('maxlength '+maxlength);


			$('#carousel-screens li').each(function() {
				var thisImg = $(this).find('img');
				debug(thisImg.attr('alt'));

				var newImage = new Image(392, 320);
				newImage.src = thisImg.attr('alt');
				newImage.name = thisImg.attr('name');
				//debug(newImage);
		

					$(newImage).bind('load', function(e) {
						debug('image loaded');
				
						var imageObject = $(this);
						var imageName = $(this).attr('name');
						var imageSrc = $(this).attr('src');


						if (!imageObject) {
							debug('no image object');
						}

						if (imageObject && imageName != null && document.images) {
							document.images[imageName].src = imageSrc;
						}


						if (!$.browser.msie) {
							thisImg.reflect({height: 0.3, opacity: 0.3});
						}
						thisImg.height(121);
						thisImg.width(148);


						zentall.carousel.LOADED_COUNT++;

						debug('loadedCount '+zentall.carousel.LOADED_COUNT+' maxlength '+maxlength+' beginFlag '+zentall.carousel.BEGIN_FLAG)

						if (zentall.carousel.LOADED_COUNT >= maxlength && zentall.carousel.BEGIN_FLAG == false) {
					
							debug('begin carousel anim');
					
							zentall.carousel.BEGIN_FLAG = true;
							$.timer(1000, function(timer) {
								timer.stop();
								zentall.carousel.beginAnim();
							});

						}

					});
			});
	

			$('#up').click(function(event) {
				event.preventDefault();
				zentall.carousel.advance(true);

			});

			$('#down').click(function(event) {
				event.preventDefault();
				zentall.carousel.retreat();

			});
	}

};

zentall.carousel.beginAnim = function() {
	debug('begin anim');
	
	zentall.carousel.MOVE_LOCK = true;
	
	$("#carousel-screens").fadeIn();
 
	$('#carousel-screens .cimg_1').each(function(){

		
		$(this).find('~ .reflection').each(function() {
			
			$(this).css({display: 'block'});
			
			$(this).find('canvas').each(function() {
				$(this).height(35);
				$(this).width(148);
				$(this).css({position: 'absolute', right: '118px', top: '-183px'});
				
				$(this).animate({ 
			    	height: '90px',
					width: '380px',
					right: '-1px', 
					top: '65px'
			      }, zentall.carousel.INIT_DURATION);
			});
				
		});
	
		if ($.browser.msie) {
			$(this).css({opacity: 0, display: 'block'}).animate({ 
		        opacity: 1,
				height: '309px',
				width: '379px',
				top: '60px',
				right: '0px'
		      }, zentall.carousel.INIT_DURATION, zentall.carousel.showControlsAndDescription );
		} else {
	
			$(this).animate({ 
		        opacity: 1,
				height: '309px',
				width: '379px',
				top: '60px',
				right: '0px'
		      }, zentall.carousel.INIT_DURATION, zentall.carousel.showControlsAndDescription ); 
		
		}
	});
	

	$.timer((zentall.carousel.INIT_DURATION * .1), function (timer) {
		$('#carousel-screens .cimg_2').each(function(){
			
			
			if ($.browser.msie) {
					$(this).css({opacity: 0, display: 'block'}).animate({ 
				        opacity: 0.8,		
						height: '230px',
						width: '282px',
						top: '34px',
						right: '50px'
				      }, (zentall.carousel.INIT_DURATION * .9) );
			} else {
				$(this).animate({ 
			        opacity: 0.8,		
					height: '230px',
					width: '282px',
					top: '34px',
					right: '50px'
			      }, (zentall.carousel.INIT_DURATION * .9) );
			}
	
		});
   		timer.stop();
   	});

	$.timer((zentall.carousel.INIT_DURATION * .2), function (timer) {
		$('#carousel-screens .cimg_3').each(function(){
			
			if ($.browser.msie) {
				$(this).css({opacity: 0, display: 'block'}).animate({ 
			        opacity: 0.6,		
					height: '167px',
					width: '205px',
					top: '15px',
					right: '89px'
			      }, (zentall.carousel.INIT_DURATION * .8) );
			} else {
				$(this).animate({ 
			        opacity: 0.6,		
					height: '167px',
					width: '205px',
					top: '15px',
					right: '89px'
			      }, (zentall.carousel.INIT_DURATION * .8) );
			}
			
		});
   		timer.stop();
   	});

	$.timer((zentall.carousel.INIT_DURATION * .47), function (timer) {
		$('#carousel-screens .cimg_4').each(function(){
			
			if ($.browser.msie) {
					$(this).css({opacity: 0, display: 'block'}).animate({ 
				        opacity: 0.4
				      }, (zentall.carousel.INIT_DURATION * .53) );
			} else {
				$(this).animate({ 
			        opacity: 0.4
			      }, (zentall.carousel.INIT_DURATION * .53) );
			}

		});
   		timer.stop();
   	});

	zentall.carousel.ADVANCE_TIMER = $.timer(zentall.carousel.ADVANCE_INTERVAL, function (timer) {
		if (!zentall.carousel.TIMER_LOCK) {
			zentall.carousel.advance(false);
		}
	});
	
};

zentall.carousel.showControlsAndDescription = function() {
	
	zentall.carousel.MOVE_LOCK = false;

	$('#carousel-control').fadeIn();

	$('#carousel-description ul li:first').fadeIn().addClass('active');
};

zentall.carousel.advance = function(userInitiatedFlag) {
	//debug('advance');

	if (!zentall.carousel.MOVE_LOCK) {
		
		if (userInitiatedFlag) {
			zentall.carousel.TIMER_LOCK = true;
		}
		zentall.carousel.MOVE_LOCK = true;
		zentall.carousel.CAROUSEL_POS++;
		if (zentall.carousel.CAROUSEL_POS > $('#carousel-screens ul li').length) {
			zentall.carousel.CAROUSEL_POS = 1;
		}
	
		$('#carousel-screens .cimg_1').each(function(){
			$(this).css({
				"z-index": '500'
			});
			$(this).animate({ 
				top: '-320px'
	      }, zentall.carousel.ADV_DURATION, "easeOutExpo" );
	
			$(this).find('~ .reflection').each(function() {

				$(this).find('canvas').each(function() {
				
					$(this).animate({ 
						top: '-320px'
				      }, zentall.carousel.ADV_DURATION, "easeOutExpo", function() {
						$(this).find('~ .reflection').css({display: 'none'});
					});
				});
				
			});
	
		});
	
		$('#carousel-screens .cimg_2').each(function(){
			$(this).css({
				"z-index": '400'
			});
			$(this).animate({ 
		        opacity: 1,
				height: '309px',
				width: '379px',
				top: '60px',
				right: '0px'
		      }, zentall.carousel.ADV_DURATION, zentall.carousel.advanceFinish );
		
			$(this).find('~ .reflection').each(function() {

					$(this).css({display: 'block'});

					$(this).find('canvas').each(function() {
					
						$(this).height(69);
						$(this).width(282);
						$(this).css({position: 'absolute', right: '50px', top: '-39px'});

						$(this).animate({ 
					    	height: '90px',
							width: '380px',
							right: '-1px', 
							top: '65px'
					      }, zentall.carousel.ADV_DURATION);
					});
				});
		
		
		});
	
	$('#carousel-screens .cimg_3').each(function(){
		$(this).css({
			"z-index": '300'
		});
		$(this).animate({ 
	        opacity: 0.8,		
			height: '230px',
			width: '282px',
			top: '34px',
			right: '50px'
	      }, zentall.carousel.ADV_DURATION );
	});
	$('#carousel-screens .cimg_4').each(function(){
		$(this).css({
			"z-index": '200',
			display:  'block'
		});
		$(this).animate({ 
	        opacity: 0.6,		
			height: '167px',
			width: '205px',
			top: '15px',
			right: '89px'
	      }, zentall.carousel.ADV_DURATION );
	});

	$.timer((zentall.carousel.ADV_DURATION * .47), function (timer) {
		$('#carousel-screens .cimg_5').each(function(){
			$(this).css({
				"z-index": '100',
				display: 'block',
				opacity: 0
			});
			$(this).animate({ 
		        opacity: 0.4
		      }, (zentall.carousel.ADV_DURATION * .53) );
		});
   		timer.stop();
   	});

	
		$('#carousel-description .active').fadeOut();
	
		$('#carousel-description li.active').each(function(){
			$(this).removeClass('active');
			var nextSibling = $(this).next();
			if (nextSibling.length > 0) {
			
				nextSibling.fadeIn().addClass('active');
			} else {
			
				$('#carousel-description li:first').fadeIn().addClass('active');
			}
		});
	
	}
};

zentall.carousel.advanceFinish = function() {

	zentall.carousel.ADVANCE_TIMER.reset(zentall.carousel.ADVANCE_INTERVAL);
	
	var carouselLength = $('#carousel-screens li').length;
	$('#carousel-screens li img').each(function(){
		//debug($(this).attr('name')+' '+carouselLength);
		
		var nextIndex = 0;
		var thisIndex = parseInt($(this).attr('class').substr(5));
		if (thisIndex == 1) {
			nextIndex = carouselLength;
			$(this).css({ display: 'none', height:'121px', width:'148px', top: 0, right: '118px' }).fadeOut('fast');
		} else {
			nextIndex = thisIndex - 1;
		}
		$(this).removeClass('cimg_'+thisIndex);
		$(this).addClass('cimg_'+nextIndex);
		
	});
	
	zentall.carousel.MOVE_LOCK = false;
	
	$.timer(5000, function (timer) {
		zentall.carousel.TIMER_LOCK = false;
		timer.stop();
	});
}

zentall.carousel.retreat = function() {


	if (!zentall.carousel.MOVE_LOCK) {

		zentall.carousel.TIMER_LOCK = true;
		zentall.carousel.MOVE_LOCK = true;
		zentall.carousel.CAROUSEL_POS--;
		if (zentall.carousel.CAROUSEL_POS < 1) {
			zentall.carousel.CAROUSEL_POS = $('#carousel-screens ul li').length;
		}
		
		debug(zentall.carousel.CAROUSEL_POS);

		$('#carousel-screens .cimg_1').each(function(){
			$(this).css({
				"z-index": '300'
			});
			
			
			$(this).animate({ 
				opacity: 0.8,		
				height: '230px',
				width: '282px',
				top: '34px',
				right: '50px'
	      }, zentall.carousel.ADV_DURATION, zentall.carousel.retreatFinish );
	
			$(this).find('~ .reflection').each(function() {

					$(this).css({display: 'block'});

					$(this).find('canvas').each(function() {
						$(this).animate({ 
					    	height: '69px',
							width: '282px',
							right: '50px', 
							top: '-39px'
					      }, zentall.carousel.ADV_DURATION, '', function() {
							
						});
					});
				});
	
		});
		
		$('#carousel-screens .cimg_2').each(function(){
			$(this).css({
				"z-index": '200'
			});
			$(this).animate({ 
		        opacity: 0.6,		
				height: '167px',
				width: '205px',
				top: '15px',
				right: '89px'
		      }, zentall.carousel.ADV_DURATION );
		});

		$('#carousel-screens .cimg_3').each(function(){
			$(this).css({
				"z-index": '100'
			});
			$(this).animate({ 
		        opacity: 0.4,		
				height: '121px',
				width: '148px',
				top: '0px',
				right: '118px'
		      }, zentall.carousel.ADV_DURATION );
		});
		
		$('#carousel-screens .cimg_4').each(function(){
			$(this).animate({ 
		        opacity: 0	
		    }, (zentall.carousel.ADV_DURATION * .5), 'easeOutExpo' );
		});
		
		var lastScreenNum = $('#carousel-screens ul li').length;
		$('#carousel-screens .cimg_'+lastScreenNum).each(function(){
			$(this).css({
				opacity: 1,
				height: '309px',
				width: '379px',
				top: '-320px',
				right: '0px',
				"z-index": '400',
				display: 'block'
			});
			$(this).animate({ 
		        top: '60px'		
		    }, zentall.carousel.ADV_DURATION, 'easeOutExpo' );
		
			$(this).find('~ .reflection').each(function() {

					$(this).css({display: 'block'});

					$(this).find('canvas').each(function() {
					
						$(this).height(90);
						$(this).width(380);
						$(this).css({position: 'absolute', right: '-1px', top: '-320px'});
						
						$(this).animate({ 
					    	top: '65px'
					      }, zentall.carousel.ADV_DURATION, 'easeOutExpo' );
					});
				});
		
		
		});
		
		$('#carousel-description .active').fadeOut();
	
	
		$('#carousel-description li.active').each(function(){
			$(this).removeClass('active');
			var prevSibling = $(this).prev();
			if (prevSibling.length > 0) {
				
				prevSibling.fadeIn().addClass('active');
			} else {
				
				$('#carousel-description li:last').fadeIn().addClass('active');
			}
		});
		
	}

};

zentall.carousel.retreatFinish = function() {
	
		zentall.carousel.ADVANCE_TIMER.reset(zentall.carousel.ADVANCE_INTERVAL);
	
		var carouselLength = $('#carousel-screens li').length;
		$('#carousel-screens li img').each(function(){
			//debug($(this).attr('name')+' '+carouselLength);

			var nextIndex = 0;
			var thisIndex = parseInt($(this).attr('class').substr(5));
			if (thisIndex == carouselLength) {
				nextIndex = 1;

			} else {
				nextIndex = thisIndex + 1;
			}
			$(this).removeClass('cimg_'+thisIndex);
			$(this).addClass('cimg_'+nextIndex);
	

		});
	
		zentall.carousel.MOVE_LOCK = false;
		
		$.timer(5000, function (timer) {
			zentall.carousel.TIMER_LOCK = false;
			timer.stop();
		});
	
};

//*******************//
//* HELPER FUNCTIONS //
//*******************//

function debug(msg, blank)
{
    if (!zentall.page.DEBUGGING) { return; }

	//if (BrowserDetect.browser == 'Firefox' && console.firebug != undefined) {
	if (window.console && console.log) {
		console.log(msg); //console is the firebug debugging display that can also handle objects
	}
};


/**
 * get DOM elements by html class
 *
 * @param string class_name - name of class
 * @param node node - search only sub nodes of this node (optional)
 * @param string tag - search only these tags (optional)
 */
function getElementsByClassName(class_name, node, tag)
{
    var classElements = new Array();

    if (node == null) {
        node = document;
    }
    if (tag == null) {
        tag = '*';
    }

    var j = 0, teststr;
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;

    for (i = 0; i < elsLen; i++) {
        if (els[i].className.indexOf(class_name) != -1) {
            teststr = "," + els[i].className.split(" ").join(",") + ",";
            if (teststr.indexOf("," + class_name + ",") != -1) {
                classElements[j] = els[i];
                j++;
            }
        }
    }
    return classElements;
};