/*----------------------------------------------------------------------
[Slideshow JavaScript ] 
Desc: homepage slider feature

Created by:		Adam Foster 2011	
-----------------------------------------------------------------------*/

(function($) {
    $.fn.extend({
		slideshow: function(options) { 
												
			var items = [];
			
			var config = {};
				config.current = 0;
				config.loaded = 0;
				config.time = 7000;
				config.touchDevice = 'ontouchstart' in document;
				
			var o = {};
				o.wrapper = this;
				o.controls = $j('#feature-pips', o.wrapper);
				o.imgBox = $j('#featured-img', o.wrapper);
				o.bg = $j('#feature-bg div', o.wrapper);
				o.progress = $j('.bar', o.controls);
				o.bod = $('body');
							
			if(options) {
				$.extend(items, options);
			};
			
			/* init ----------------------------------------------------------*/
			
			function _init() {
								
				/* setup */
				config.total = items.length;
				
				_setup();
			};
			
			/* setup ---------------------------------------------------------*/
			
			function _setup() {								
				
				/* Add pips */
				var pip = '';
				for (i=0;i<config.total;i++){
					pip += '<li rel="' + i + '" class="disabled';
					if(i==0) pip += ' selected';
					pip += '"><span></span></li>';
				};
				o.pips = $j(pip);
				o.pips.css('opacity',0.3);
				
				/* show controls */
				o.controls.prepend(o.pips);
				o.controls.css('display','block');
				
				o.pips.click(function(e){
					if($j(this).hasClass('disabled')) return false;
					o.progress.stop().css('width',0);
					config.current = $j(this).attr('rel');
					_hide_image();
				});
				
				o.bg.css('opacity',0);
				
				$.each(items, function(k,v) { 
					_load_images(k,v.hero);
					_load_images(k,v.bg);
				});	
			};
									
			/* load image ----------------------------------------------------*/
			
			function _load_images(i,src) {
								
				/* load images */
				var imgPreload = new Image();
				imgPreload.onload = function() {
										
					/* test both images are loaded */
					if(items[i].loaded == true){
						
						config.loaded++;
						
						/* activate pips */
						o.pips.filter(':eq(' + i + ')').animate({opacity: 1}, 150).removeClass('disabled');
						
						/* start the show*/
						if(i == 0) _show_image(i);
						if(config.loaded == config.total) _start();
						
					}else{
						items[i].loaded = true;	
					};
																
					imgPreload.onload=function(){};
				};
				imgPreload.src = src;
					
			};
			
			/* start ---------------------------------------------------------*/
			
			function _start() {								
				//_set_interface();
				o.progress.stop().animate({width: '100%'}, config.time, 'linear',function(){
					o.progress.css('width',0);
					config.current++;
					if(config.current==config.total) config.current = 0;
					_hide_image();	
				});
			};
			
			/* show image -----------------------------------------------------*/
			
			function _show_image(id){
								
				// if image showing fade backgrond out?
				
				//swap image
				
				if(o.img){
					o.img.attr('src',items[id].hero);
										
					/* update current */
					o.pips.filter('.selected').removeClass('selected');
					o.pips.filter(':eq(' + id + ')').addClass('selected');
					
					/* animate back in*/
					o.imgBox.animate({bottom: 0}, 500, 'easeInOutQuad',function(){
						_start();
						if(config.touchDevice) return false;
						o.imgBox.animate({right: '-50px'}, config.time, 'linear');
						//o.bg.animate({left: '30px'}, config.time, 'linear');
					});
				}else{
					/* add for the first time */
					o.img = $j('<img src="' + items[id].hero + '" height="517" width="909"/>');
					o.imgBox.append(o.img);
					o.imgBox.css('right', 80);
					o.imgBox.stop().animate({bottom: 0}, 500, 'easeInOutQuad',function(){
						if(config.touchDevice) return false;
						o.imgBox.animate({right: '-50px'}, config.time, 'linear');
						//o.bg.animate({left: '30px'}, config.time, 'linear');
					});
				};
				
				o.bg.css({'background-image' : 'url('+ items[id].bg +')', 'background-color' : items[id].hex }).animate({opacity: 1}, 300, 'easeInOutQuad');
																	
			};
			
			/* hide image -----------------------------------------------------*/
			
			function _hide_image(){
				o.imgBox.stop().animate({bottom: -520}, 350, 'easeInOutQuad',function(){
					_show_image(config.current);
					o.imgBox.css('right', 80);
				});
				o.bg.stop().animate({opacity: 0}, 300, 'easeInOutQuad', function(){
					//o.bg.css('left', 0);
				});
			};
			
			_init();
		}
	})
})(jQuery);
