/**
 * @author Keith Foster
 */
if(!site) var site = {};

site.Marquee = (function(){
	/* variables & methods set once for all the instances */
	
	function prebind_html_css(marquee, map, settings) {
		var marquee_width = settings.feature_count * settings.full_item_width;
		var map_buttons = Math.ceil(settings.feature_count/settings.per_set);
		//var map_width = (map_buttons+1) * settings.map_item_width;
		marquee.css('width', marquee_width);
		//map.parent().css('width', map_width);
		build_map(map, map_buttons);
	}
	
	function build_map(element, n) {
		var output = '';
		var css_class = ' class="current"';
		for(var i=0; i<n; i++) {
			output += '<li><a'+((i==0)?css_class:'')+' href="#" rel='+i+'>'+(i+1)+'</a></li>';
		}
		element.html(output);
	}

	function get_controls(element) {
		var controls = new Array();
		controls['next'] = element.find('a.next');
		controls['previous'] = element.find('a.previous');
		controls['map_buttons'] = element.find('ul.map a');
		controls['playpause'] = element.find('a.play-pause')
		return controls;
	}
	
	function set_active_map(elements, index) {
		for(var i=0; n=elements.length, i<n; i++) {
			elements[i].className = '';
		}
		elements[index].className = 'current';
	}
	
	return function(id, config) {
		/* instance specific variables & methods */
		var settings = new Array();
		var set = 0, maxsets = 1, autoplayTimer = null, playing = true, paused = false, isLoaded = new Array(), slideShowImages = null;
		
		settings['per_set'] = (config && config.per_set) ? config.per_set : 3;
		settings['full_item_width'] = (config && config.full_item_width) ? config.full_item_width : 191;
		settings['map_item_width'] = (config && config.map_item_width) ? config.map_item_width : 14;
		
		if(!config.delay) config.delay = 3000;
				
		var marquee = null;
		var map = null;
		var features = null; 		// this will be an array of html elements.
		var controls = new Array(); // an array of html elements that are bound for click events.
		var container = null;
		var sliding = false;		// variable that holds whether or not we're currently an
		
		var animate = {
			fade:function(end){
				// lazy load the fade mask.
				var fadeMask = fadeMask = document.getElementById('fade-mask');
				if(!fadeMask) {
					var fadeMask = document.createElement('div');
					fadeMask.id = 'fade-mask';
					document.getElementById('feature-images').appendChild(fadeMask);
				}
				// position it above the iamges... at this point its hidden.
				fadeMask.style.zIndex = '10';
				
				// fade the mask in
				fadeMask.style.visibility = 'visible';
				jQuery(fadeMask).animate({opacity:1}, 500, function(){
					// position hte marquee.
					marquee.css('margin-left', end);
					// fade out the mask
					setTimeout(function(){
						jQuery(fadeMask).animate({opacity:0}, 500, function(){
							fadeMask.style.zIndex = '1';
							sliding=false;
							
							if(!config.flash && config.autoplay && playing) {
								autoplayTimer = setTimeout(function(){
									play();
								}, config.delay);
							}
						});
					}, 500);
				});
			},
			slide:function(end){
				marquee.animate({marginLeft: end}, 300, function(e){
					sliding = false;
					
					if(!config.flash && config.autoplay && playing){
						autoplayTimer = setTimeout(function(){
							play();
						}, config.delay);
					}
				});
			}
		}		
		
		function reveal(margin) {
			if(config.livetext || (config.flash || isLoaded[slideShowImages.get(set).src])) {
				sliding = true;
				switch(config.transitionType){
					case 'fade':
						animate.fade(margin)
						break;
					default:
						animate.slide(margin);
						break;
				}
			} else {
				setTimeout(function(){
					reveal(margin)
				}, 500);
			}
		}
		
		function scroll(direction, mapped) {
			if( (direction>0 && set==0 && !mapped) || (direction<0 && set == (maxsets-1) && !mapped) ) return;
			var start = parseInt(marquee.css('margin-left'));
			var end = (mapped) ? (-1*(direction * (settings.per_set * settings.full_item_width))):(start + (direction * (settings.per_set * settings.full_item_width)));
			
			set = mapped ? direction : (set+(direction*-1));
			set_active_map(controls.map_buttons, set);
			
			if(config.flash) {
				var prevItem = (set == 0) ? maxsets - 1 : set - 1;
				if (typeof(headerPlayer)!='undefined') {
					headerPlayer[prevItem].sendEvent('SEEK', 0);
					headerPlayer[prevItem].sendEvent('STOP');
					
					if (playing) {
						setTimeout(function() { headerPlayer[set].sendEvent('PLAY', 'true'); }, 100);
					}
				}				
			}
			
			reveal(end);
		}
		
		function bind(elements) {
			elements.next.click(function(e){
				if(!sliding) scroll(-1);
				return false;
			});
			elements.previous.click(function(e){
				if(!sliding) scroll(1);
				return false;
			});
			elements.map_buttons.click(function(){
				stop();
				if(!sliding) {
					var set = parseInt(this.rel);
					scroll(set, true);
				}
				return false;
			});
			elements.playpause.click(function(){
				if(playing){
					playing = false;
					elements.playpause.removeClass('pause');
					stop();
				} else {
					playing = true;
					elements.playpause.addClass('pause')
					if(config.flash) {
						window.marquee.play();
					} else {
						play();
					}
				}
				
				return false;
			});
			
			slideShowImages = marquee.find('img');
			var tempImage = new Image();
			for (var i = 0, img = null; img = slideShowImages[i]; i++) {
				tempImage.src = slideShowImages[i].src;
				img.onload = function(){
					isLoaded[this.src] = true;
				}
				img.src = '/wp-content/themes/fb/m/img/nada.gif';
				img.src = tempImage.src;
			}
		}
		
		function buildFlashPieces(movieData) {
			var movieListItem = '';
			for(var i = 0; i < movieData.length; i++) {
				movieListItem = document.createElement('li');
				movieReplaceItem = document.createElement('div');
				movieReplaceItem.id = 'movie-' + i;
				movieListItem.appendChild(movieReplaceItem);
				marquee.append(movieListItem);
				
				var flashvars = {
					controlbar: 'none',
					file: movieData[i].url,
					displayclick: 'none',
					id: movieReplaceItem.id,
					bufferlength: 5
				};
				
				var params = {
					allowfullscreen: false,
					allowscriptaccess: 'always',
					wmode: 'transparent'
				};
				
				var attributes = {};
				
				swfobject.embedSWF('/wp-content/themes/fb/m/fla/player.swf', movieReplaceItem.id, '906', '350', '9.0.0', '/wp-content/themes/fb/m/fla/expressInstall.swf', flashvars, params, attributes);
			}
		}
		
		function initialise(id) {
			container = jQuery(id);
			if(container.length == 0) return;
			
			marquee = container.find('ul.items');
			
			if(config.flash && typeof(JSON) != 'undefined' && typeof(swfobject) != 'undefined') {
				var movieData = JSON.parse(container.find('textarea').html());
				marquee.html('');
				buildFlashPieces(movieData);
			}
			
			features = marquee.find('li');
			
			map = container.find('ul.map');
			
			settings['feature_count'] = features.length;
			maxsets = Math.ceil(features.length / settings.per_set);
			
			prebind_html_css(marquee, map, settings);
			controls = get_controls(container);
			
			bind(controls);
			
			if(config.autoplay && !config.flash) {
				autoplayTimer = setTimeout(function(){
					play();
				}, config.delay);
			}
		}
		
		function play() {
			set = (set==(maxsets-1)) ? 0 : set + 1;
			scroll(set, true);
		}
		
		this.isPlaying = function() {
			return playing;
		}
		
		this.getMaxSets = function() {
			return maxsets;
		}
		
		this.play = function() {
			if(paused == true) {
				headerPlayer[set].sendEvent('PLAY', 'true');
				paused = false;
			} else {
				set = (set==(maxsets-1)) ? 0 : set + 1;
				scroll(set, true);
			}
		}
		
		function stop(){
			if(config.flash) {
				for(i = 0; i < headerPlayer.length; i++) {
					if(i == set) {
						headerPlayer[set].sendEvent('PLAY', 'false');
						paused = true;
					} else {
						headerPlayer[i].sendEvent('STOP');
					}
				}
			} else {
				clearTimeout(autoplayTimer);
			}
			sliding = false;
		}
		
		this.stop = function() {
			stop();
		}
		
		initialise(id);
	}
})();