// jquery.geko.js
// 1.0.0
// pixelGeko
//
// Dependencies:
// jQuery
//
// Project and documentation site:
// http://pixelgeko.com


// CLOSURE

(function(jQuery) {
		  

// PRIVATE FUNCTIONS


// PLUGIN DEFINITION **********************************************************************

	//CHAMELEON FIELD
	jQuery.fn.gekoChameleonField = function() {
		$(this).focus( function() {
			if( !$(this).hasClass( "active" ) ) {
				$(this).addClass( "active" );
			}
			if( $(this).val() == $(this).attr( "rel" ) ) {
				$(this).val( "" );
			}
		});
		$(this).blur( function() {
			$(this).removeClass( "active" );
			if( $(this).val() == '' ) { 
				$(this).val( $(this).attr( "rel" ) ); 
				return false; 
			}
		});
	};
	
	//CHAMELEON SLIDE
	var slideData = new Array();
	var slideConfig;
	var slideCount;
	var slidePosition;
	var slideTarget;
	var slideTimer;
	var slideActive;
	var slideQueue;
	/*
	@Params
	- options
	  - defaultProject
	  - canvasHeight
	  - canvasWidth
	  - imageHeight
	  - imageWidth
	  - imageMargin
	  - numberVisible
	  - titleTarget
	  - detailsTarget
	  -	delayTime
	  - slideTime
	  - easing
	*/
	jQuery.fn.gekoChameleonSlide = function( options, menu ) {
		slideConfig = options;
		slideTarget = $(this);
		slideActive = false;
		slideQueue = new Array();
		//Obtain slide data
		$.get('slides.xml', function(data) {
			$(data).find('group').each(function () {
				var group = {
					name: $(this).children('name').text(), 
					type: $(this).children('type').text(), 
					description: $(this).children('description').text(),
					url: $(this).children('url').text(),
					theme: $(this).children('theme').text()
				};
				var groupItems = new Array();
				$(this).children('items').find('item').each( function() {
					var item = { 
						name: $(this).children('name').text(), 
						imageurl: $(this).children('imageurl').text(), 
						description: $(this).children('description').text()
					};
					groupItems.push( item );
				});
				group.items = groupItems;
				slideData.push( group );
			});
			
			var setProject = function( projectIndex ) {
				slideActive = true;
				var project = slideData[ projectIndex ];
				//Set project title
				$( slideConfig.titleTarget ).html( '<h2>'+project.name+' / <span class="project-type">'+project.type+'</span></h2>' );
				
				//Set project description
				$( slideConfig.detailsTarget ).html( '<p>'+project.description+'</p>' );
				
				//Set project theme
				$.stylesheetSwitch(project.theme);
				
				//Set project images
				slideCount = project.items.length;
				slidePosition = 0;
				if( slideTimer ) {
					clearInterval( slideTimer );
				}
				if( slideTarget.children( '.project' ).size() && slideTarget.children('.p'+projectIndex).size() < 1 ) {
					slideTarget.append( '<div class="project p'+projectIndex+'" style="height:'+slideConfig.imageHeight+'px; width:'+(slideConfig.imageWidth * slideCount + slideConfig.imageMargin * (slideCount - 1))+'px; white-space:nowrap; position:absolute; top:-'+(slideConfig.imageHeight + slideConfig.imageMargin)+'px;"></div>' );
					var slideFrame;
					slideTarget.children('.p'+projectIndex).width( project.items.length * (slideConfig.imageWidth + slideConfig.imageMargin) );
					for( var i in project.items ) {
						slideFrame = $('<div>').css('background', '#FFFFFF url(images/loader.gif) center center no-repeat');
						slideFrame.css('width', slideConfig.imageWidth);
						slideFrame.css('height', slideConfig.imageHeight);
						slideFrame.css('margin-right', slideConfig.imageMargin);
						slideFrame.css('float', 'left');
						slideFrame.addClass('item'+i);
						slideTarget.children('.p'+projectIndex).append( slideFrame );
						$('<img />')
							.attr('src', project.items[i].imageurl)
							.addClass('item'+i)
							.load(function() {
								var imgClass = $(this).attr('class');
								$('.p' + projectIndex + ' .' + imgClass).css('background', '#FFFFFF');
								$('.p' + projectIndex + ' .' + imgClass).append( $(this) );
							});
						if( i > 0) {
							slideTarget.children('.p'+projectIndex).children('.item'+i).css('opacity', '0.50');
						}
					}
					slideTarget.children('.project').animate(
						{"top": "+="+(slideConfig.imageHeight + slideConfig.imageMargin)},
						{
							queue:false, 
							duration:slideConfig.slideTime, 
							easing:slideConfig.easing, 
							complete:function(){ 
								slideTarget.children('.project').each( function() {
									if( !$(this).hasClass('p'+projectIndex) ) {
										$(this).remove();
									}
								});
								slideActive = false;
								/*
								var queuedProject = slideQueue.shift();
								if(slideQueue.length > 0) {
									alert( queuedProject );
									setProject( queuedProject );
								}
								
								//Set autoscrolling
								if( $(this).hasClass('p'+projectIndex) ) {
									slideTimer = setInterval( function() {
										slideTarget.children('.project').children('.item'+slidePosition).css('opacity', '0.50');
										if( slidePosition < (slideCount - 1)) {
											slidePosition++;
											if( slidePosition < (slideCount - 1)) {
												slideTarget.children('.project').eq(0).animate(
													{"left": "-="+(slideConfig.imageWidth + slideConfig.imageMargin)},
													{queue:false, duration:slideConfig.slideTime, easing:slideConfig.easing}
												);
											}
										} else {
											slidePosition = 0;
											slideTarget.children('.project').eq(0).animate(
												{"left": "0"},
												{queue:false, duration:slideConfig.slideTime, easing:slideConfig.easing}
											);
										}
										slideTarget.children('.project').children('.item'+slidePosition).css('opacity', '1');
									}, slideConfig.delayTime);
								}*/
							}
						}
					);
				} else {
					slideTarget.html( '<div class="project p'+projectIndex+'" style="height:'+slideConfig.imageHeight+'px; width:'+(slideConfig.imageWidth * slideCount + slideConfig.imageMargin * (slideCount - 1))+'px; white-space:nowrap; position:absolute;"></div>' );
					for( var i in project.items ) {
						slideTarget.children('.p'+projectIndex).append( '<img class="item'+i+'" src="'+project.items[i].imageurl+'" alt="'+project.items[i].name+'" style="margin-right: '+slideConfig.imageMargin+'px" />' );
						if( i > 0) {
							slideTarget.children('.p'+projectIndex).children('.item'+i).css('opacity', '0.50');
						}
					}
					slideActive = false;
				}
				
				//Set autoscrolling
				slideTimer = gekoActivateSlides();
				/*slideTimer = setInterval( function() {
					slideTarget.children('.project').children('.item'+slidePosition).css('opacity', '0.50');
					if( slidePosition < (slideCount - 1)) {
						slidePosition++;
						if( slidePosition < (slideCount - 1)) {
							slideTarget.children('.project').eq(0).animate(
								{"left": "-="+(slideConfig.imageWidth + slideConfig.imageMargin)},
								{queue:false, duration:slideConfig.slideTime, easing:slideConfig.easing}
							);
						}
					} else {
						slidePosition = 0;
						slideTarget.children('.project').eq(0).animate(
							{"left": "0"},
							{queue:false, duration:slideConfig.slideTime, easing:slideConfig.easing}
						);
					}
					slideTarget.children('.project').children('.item'+slidePosition).css('opacity', '1');
				}, slideConfig.delayTime);*/
			};
			
			for( var i in slideData ) {
				var linkText = options.defaultProject;
				if( linkText == slideData[i].name.toLowerCase() + ' / ' + slideData[i].type.toLowerCase() ) {
					break;
				}
			}
			
			setProject( i );
			menu.find('a').each( function() {
				$(this).click( function() {
					for( var i in slideData ) {
						var linkText = $(this).text().toLowerCase();
						if( linkText == slideData[i].name.toLowerCase() + ' / ' + slideData[i].type.toLowerCase() ) {
							break;
						}
					}
					if( !slideActive ) {
						setProject( i );
					}/* else {
						slideQueue.push( i );
					}*/
				});
			});
		});
	};
	function gekoActivateSlides() {
		var gekoTimer;
		gekoTimer = setInterval( function() {
			slideTarget.children('.project').children('.item'+slidePosition).css('opacity', '0.50');
			if( slidePosition < (slideCount - 1)) {
				slidePosition++;
				if( slidePosition < (slideCount - 1)) {
					slideTarget.children('.project').eq(0).animate(
						{"left": "-="+(slideConfig.imageWidth + slideConfig.imageMargin)},
						{queue:false, duration:slideConfig.slideTime, easing:slideConfig.easing}
					);
				}
			} else {
				slidePosition = 0;
				slideTarget.children('.project').eq(0).animate(
					{"left": "0"},
					{queue:false, duration:slideConfig.slideTime, easing:slideConfig.easing}
				);
			}
			slideTarget.children('.project').children('.item'+slidePosition).css('opacity', '1');
		}, slideConfig.delayTime);
		return gekoTimer;
	}
	
	//SCROLL MENU
	jQuery.fn.gekoScrollMenu = function() {
		target = $(this);
			
		var mWidth = 0;
		target.find('li').each( function() {
			mWidth = mWidth + $(this).outerWidth(true);
		});	
		mWidth += 5;
		target.children().eq(0).width( mWidth );
		//$('#debugging_mouse_axis').html( mWidth );
		//Scroll the menu on mouse move above the target layer
		target.mousemove(function(e) {
			var targetLeft = parseInt(target.offset().left);
			var menuWidth = target.children().eq(0).width();
			var targetWidth = target.width();
			var fudgeFactor = 1.10;
			var leftValue = Math.round( ((targetLeft - e.pageX) / targetWidth) * ( menuWidth - targetWidth ) * fudgeFactor );
			//$('#debugging_mouse_axis').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY + " | Offset " + targetLeft + " | Width " + targetWidth);
			//$('#debugging_status').html( leftValue );
			
			target.children().eq(0).animate({left: leftValue}, { queue:false, duration:500, easing: "expoEaseOut"});
		});
	};
	
	//CONTENT SWITCH
	var switchActive = false;
	var activeContent = 'work';
	jQuery.fn.gekoContentSwitch = function() {
		if(switchActive) {
			return false;
		}
		var newContent = $(this).text();
		switchActive = true;
		clearInterval( slideTimer );
		$('#' + activeContent + '-wrapper').fadeOut(300, function(){
			activeContent = newContent;
			$('#' + activeContent + '-wrapper').fadeIn(300, function(){
				if( activeContent == 'work' ) {
					slideTimer = gekoActivateSlides();
				}
				$('#' + activeContent + '-wrapper').css('position', 'relative').css('left', 0).css('top', 0);
				switchActive = false;
			});
		});
	}
})(jQuery);