var SVU = SVU || {};

SVU.Message = {
	initialize: function () {
		if ($('#oob_content').get(0)) { SVU.Message.OOB.initialize(); }
	}
};

// OOB Messaging
SVU.Message.OOB = {
	analytics: {
		category: 'OOB Messaging'
	},
	buttons: {},
	containers: {},
	information: {
		previousSlide: null,
		currentSlide: null,
		hasLooped: false,
		isBusy: false,
		isPlaying: false
	},
	interval: null,
	messages: [],
	navigation: [],
	options: {
		duration: 1000,
		wait: 10000
	},
	
	initialize: function () {
		// Define Containers
		this.containers.main = $('#oob_content').get(0);
		this.containers.viewport = $('#oob-viewport').get(0);
		this.containers.messages = $('#oob-messages').get(0);
		this.containers.navigation = $('#oob-navigation').get(0);
		
		// Define Buttons
		this.buttons.playpause = $('#oob-playpause').get(0);
		
		// Build Navigation
		this.buildNavigation();
		
		// Build Slides
		this.buildSlides();
		
		// Start Slideshow
		this.startSlideshow();
	},
	
	getMessages: function () {
		// Find all messages in message container
		return $('li', this.containers.messages).get();
	},
	
	getNavigation: function () {
		// Find all navigation elements in navigation container
		return $('li a[id!="oob-playpause"]', this.containers.navigation).get();
	},
	
	getSlideIndexById: function (id) {
		for (var i=0; i < this.messages.length; i++) {
			if (id === this.messages[i].id) {
				return i;
			}
		};
	},
	
	buildNavigation: function () {
		var that = this;
		
		// Get all navigation elements
		this.navigation = this.getNavigation();
		
		// Set Navigation Items click handler and set first to active
		$(this.navigation).each(function(index) {
			if (index === 0) {
				$(this).addClass('active');
			}
			
			this.rel = this.hash.substr(1);
			$(this).bind('mousedown', SVU.Utils.Delegate.create(that, that.handleNavigation)).bind('click', SVU.Utils.dummyEventHandler);
		});
		
		// Set Play/Pause click handler
		$(this.buttons.playpause).bind('mousedown', SVU.Utils.Delegate.create(this, this.handlePlayPause)).bind('click', SVU.Utils.dummyEventHandler);
	},
	
	buildSlides: function () {
		// Get All Messages
		this.messages = this.getMessages();
		
		// Set initial currentSlide index
		this.information.currentSlide = this.information.previousSlide = 0;
		
		// Hide all messages except for first
		for (var i=0; i < this.messages.length; i++) {
			if(i !== 0) {
				$(this.messages[i]).hide();
			}
		}
	},
	
	startSlideshow: function () {
		// Set State
		this.information.isPlaying = true;
		
		// Set Play Button
		$(this.buttons.playpause).removeClass('play');
		$(this.buttons.playpause).addClass('pause');
		
		// Start Interval
		this.interval = setInterval(SVU.Utils.Delegate.create(this, this.nextSlide), this.options.wait);
	},
	
	stopSlideshow: function () {
		// Set State
		this.information.isPlaying = false;
		
		// Set Pause Button
		$(this.buttons.playpause).removeClass('pause');
		$(this.buttons.playpause).addClass('play');
		
		// Stop Interval
		clearInterval(this.interval);
	},
	
	goToSlide: function (index) {
		// Don't transition if current slide is the one selected or if it's currently animating
		if (index === this.information.currentSlide || this.information.isBusy) {
			return
		}		
		// Set current slide to previous
		this.information.previousSlide = this.information.currentSlide;
		this.information.currentSlide = index;
		
		// Set to busy
		this.information.isBusy = true;
		
		// Fade out current slide
		$(this.messages[this.information.previousSlide]).fadeOut({duration: this.options.duration});
		
		// Fade in next slide
		$(this.messages[index]).fadeIn(this.options.duration, function () {
			SVU.Message.OOB.information.isBusy = false;
		});
		
		// Set active navigation item
		for (var i=0; i < this.navigation.length; i++) {
			if (this.navigation[i].rel === this.messages[index].id) {
				$(this.navigation[i]).addClass('active');
			} else {
				$(this.navigation[i]).removeClass('active');
			}
		}
		
		// Stop slideshow on slide 1 if it has looped once
		if (this.information.hasLooped && index === 0) {
			this.stopSlideshow();
		}
	},
	
	nextSlide: function (e) {
		// Determine Next Slide
		if (this.information.currentSlide + 1 === this.messages.length) {
			this.information.hasLooped = true;
			this.goToSlide(0);
		} else {
			this.goToSlide(this.information.currentSlide + 1);
		}
		
	},
	
	handlePlayPause: function (e) {
		if(this.information.isPlaying === true) {	
			// Pause slideshow
			this.isPlaying = false;
			this.stopSlideshow();
		} else {
			// Play slideshow
			this.information.isPlaying = true;
			this.startSlideshow();
		}
	},
	
	handleNavigation: function (e) {
		// Get index and hold it temporarily
		var index = this.getSlideIndexById(e.currentTarget.rel);
		
		// Go to slide by index
		this.information.hasLooped = false;
		this.stopSlideshow();
		this.goToSlide(index);
	}
};

// Utility namespace
SVU.Utils = {};

// Event Delegate
SVU.Utils.Delegate = {
	create: function (obj, func) {
		return function (e) {
			e = e || {};
			// Forces currentTarget property of the Event object for browsers that don't correctly support it
			e.currentTarget = this;
			// Call function within context of specified object
			func.apply(obj, [e]);
		};
	}
};

// Image Preloader
SVU.Utils.ImagePreloader = {
	paths: [],
	
	add: function (path) {
		var that = this;
		if (typeof path === 'String') {
			this.paths.push(path);
		} else if (typeof path === 'object'){
			$(path).each(function () {
				that.paths.push(this);
			});
		}
	},
	
	load: function () {
		// Load images into empty elements
		$(this.paths).each(function () {
			jQuery('<img>').attr('src', this);
		});
		
		// Clear out paths cache
		this.paths = [];
	}
};

// Dummy event handler that prevents default event behavior
SVU.Utils.dummyEventHandler = function (e) {
	e.preventDefault();
};


$(document).ready(function () {
	SVU.Message.initialize();
});