/**
 * Project slider - Concrete
 * @Author: Jochen Vandendriessche <jochen@builtbyrobot.com>
**/

(function($){

	var methods = {
		init : function(p) {
			if ($(this).length){
				$(this).data('settings', {
					nodes: false,
					orientation: 'horizontal',
					prevBtn: null,
					nextBtn: null,
					page: 0,
					max: 0,
					width: 0,
					height: 0
				});

				var settings = $(this).data('settings');
				var test = $(this).data('settings');

				if (p){
					if (p.orientation){
						settings.orientation = p.orientation;
					}
				}

				settings.width = parseInt($(this).find('li').css('width').replace(/px/, ''));
				settings.width += parseInt($(this).find('li').css('margin-left').replace(/px/, ''));
				settings.width += parseInt($(this).find('li').css('margin-right').replace(/px/, ''));
				settings.width += parseInt($(this).find('li').css('padding-left').replace(/px/, ''));
				settings.width += parseInt($(this).find('li').css('padding-right').replace(/px/, ''));
				settings.height = parseInt($(this).find('li').css('height').replace(/px/, ''));
				settings.height += parseInt($(this).find('li').css('margin-top').replace(/px/, ''));
				settings.height += parseInt($(this).find('li').css('margin-bottom').replace(/px/, ''));
				settings.height += parseInt($(this).find('li').css('padding-top').replace(/px/, ''));
				settings.height += parseInt($(this).find('li').css('padding-bottom').replace(/px/, ''));

				if (settings.orientation == 'horizontal'){
					settings.max = Math.ceil($(this).find('li').length / 5);
					if ($(this).find('.active').length){
						var o = $(this).find('.active');
						o.removeClass('active');
						this.projectSlider('makeActive', $(o).find('a'));
					}else{
						// first thumb is active on the project detail
						if ($('.project-detail').length){
							// check if we have an active, if not take the first
								this.projectSlider('makeActive', $(this).find('a:first'));
						}
					}
				}else{

					settings.max = Math.ceil(($(this).find('li').length - 3) / 4) -2;
					if ((($(this).find('li').length - 3) % 4) == 0){
						settings.max += 1;
					}
				}
				
				settings.nodes = $(this).find('li');
				
				this.projectSlider('addNavigation');
				this.projectSlider('fancyHover');
				this.projectSlider('fillGaps');
			}
		},
		
		fillGaps : function(){
			var settings = $(this).data('settings'),
				_a = 0;
			// check the amount of empty thumbs
			if (settings.orientation == 'horizontal'){
				// check the amount of items
				if (settings.nodes.length < 5){
					_a = 5 - settings.nodes.length;
				}else{
					_a = Math.ceil(settings.nodes.length / 5) * 5 - settings.nodes.length;
				}
			}else{
				if (settings.nodes.length < 14){
					_a = 14 - settings.nodes.length;
				}else{
					_a = Math.ceil(settings.nodes.length / 14) * 14 - settings.nodes.length;
				}
			}
			
			for (var n = 0;n<_a;n++){
				$('<li class="empty">&nbsp;</li>').appendTo($(this));
			}
		},
		
		fancyHover : function(){
			var _p = $(this);
			$(this).find('li a')
				.each(function(){
					$('<b>&nbsp;</b>').appendTo($(this));
					$(this).hover(
						function(){
							if (!$(this).hasClass('active')){
								$(this).find('img').addClass('des').pixastic("desaturate");
							}
							// check for data attributes!
							var _pName = $(this).attr('data-projectname'),
									_pDate = $(this).attr('data-clientdate');

							if (_pName && _pDate){
								$('#section-header #baseline').css('display', 'none');
								if (!$('#section-header .project-name').length){
									$('<h1 class="project-name">' + _pName + '</h1>').appendTo('#section-header')
								}
								if (!$('#section-header .client-date').length){
									$('<h2 class="client-date">' + _pDate + '</h2>').appendTo('#section-header')
								}
							}
						},
						function(){
							if (!$(this).hasClass('active')){
								Pixastic.revert($(this).find('.des').get(0));
							}
							if ($('#section-header #baseline').length){
								$('#section-header h1').remove();
								$('#section-header h2').remove();
								$('#section-header #baseline').css('display', 'block');
							}
						}
					);
					$(this).click(function(){
						// only for horizontal sliders
						var settings = $(_p).data('settings');
						if (settings.orientation == 'horizontal'){
							_p.projectSlider('makeActive', this);
						}
					});
				});
		},
		
		makeActive : function(o){
				var old = $(this).find('.active');
				if (old.length){
					Pixastic.revert($(old).find('.des').get(0));
				}
				old.removeClass('active');
				$(o).addClass('active');
				if ($(o).find('img').length){
					$(o).find('img').addClass('des').pixastic("desaturate");
				}
				// check the current item and see what page it's on
				var gt = Math.floor($(this).find('a').index($(o)) / 5),
						settings = $(this).data('settings');
				if (gt < 0 || gt > settings.max -1){
					gt = 0;
				}
				$(this).projectSlider('goTo', gt);
		},
		
		addNavigation : function(){
			var settings = $(this).data('settings');
			settings.prevBtn = document.createElement('span');
			if (settings.page <= 0){
				settings.prevBtn.className = 'previous disabled';
			}else{
				settings.prevBtn.className = 'previous';
			}
			settings.prevBtn.appendChild(document.createTextNode('&lt;'));
			settings.nextBtn = document.createElement('span');
			if (settings.page == settings.max - 1 || settings.max <= 0){
				settings.nextBtn.className = 'next disabled';
			}else{
				settings.nextBtn.className = 'next';
			}
			settings.nextBtn.appendChild(document.createTextNode('&gt;'));
			$(this).parent().append(settings.prevBtn);
			$(this).parent().append(settings.nextBtn);
			var _tmp = this;
			settings.prevBtn.onclick = function(){
				_tmp.projectSlider('goToPrevious');
			}
			settings.nextBtn.onclick = function(){
				_tmp.projectSlider('goToNext');
			}
		},
		goTo : function(i){
			var settings = $(this).data('settings');
			settings.page = i;
			if (settings.page == 0){
				$(settings.prevBtn).addClass('disabled');
			}else{
				$(settings.prevBtn).removeClass('disabled');
			}
			if (settings.page >= settings.max -1){
				$(settings.nextBtn).addClass('disabled');
			}else{
				$(settings.nextBtn).removeClass('disabled');
			}
			if (settings.orientation == 'horizontal'){
				$(this).animate({
					left: 0 - settings.page * settings.width * 5 + 'px'
				})
			}else{
				$(this).animate({
					top: 0 - settings.page * settings.height + 'px'
				})
			}
		},
		goToPrevious : function(){
			var settings = $(this).data('settings');
			if(!$(settings.prevBtn).hasClass('disabled')){
				// $(settings.nextBtn).removeClass('disabled');
				settings.page--;
				if (settings.page <= 0){
					settings.page = 0;
					// $(settings.prevBtn).addClass('disabled');
				}
				$(this).projectSlider('goTo', settings.page);
			}
		},
		goToNext : function(){
			var settings = $(this).data('settings');
			if(!$(settings.nextBtn).hasClass('disabled')){
				// $(settings.prevBtn).removeClass('disabled');
				settings.page++;
				if (settings.page >= settings.max -1){
					settings.page = settings.max -1;
					// $(settings.nextBtn).addClass('disabled');
				}
				$(this).projectSlider('goTo', settings.page);
			}
		}
	};

	$.fn.projectSlider = function(method){
		
		if ( methods[method] ) {
		      return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
		    } else if ( typeof method === 'object' || ! method ) {
		      return methods.init.apply( this, arguments );
		    } else {
		      $.error( 'Method ' +  method + ' does not exist on jQuery.projectSlider' );
		}
		
	}
	
})(this.jQuery);