/**
 * hover.js
 * @author Lewis Howles
 *
 * Change page data on hover and click.
 */

function hover() {
	// Save context searches
	var $commercials = $('#commercials');
	var $commercial = $('#commercial');
	var $commercialLi = $('li', $commercial);
	
	$commercialLi.children('p').css({'display' : 'none'});
	
	$commercialLi.css({
		position : "absolute",
		top : 0,
		left : 0
	});
	
	// Change opacity of preview images
	$('li', $commercials).css({
		opacity : 0.3
	});
	
	//Animate opacity and update displayed details on hover
	$('li', $commercials).hover(
		function() {
			// Mouse in
			var $this = $(this);
			
			if (!$this.data('current')) {
				var current_id = $this.attr('id').substring(8);
				
				$this.animate({opacity : 1.0}, 'fast');
				$('li:data("current=true")', $commercial).children('p').css({'display' : 'none'});
				$('#video-'+current_id, $commercial).children('p').css({'display' : 'block'});
			}
		},
		function() {
			// Mouse out
			var $this = $(this);
			
			if (!$this.data('current')) {
				var current_id = $this.attr('id').substring(8);
				
				$this.animate({opacity : 0.3}, 'fast');
				$('#video-'+current_id, $commercial).children('p').css({'display' : 'none'});
				$('li:data("current=true")', $commercial).children('p').css({'display' : 'block'});
			}
		}
	).click(
		function() {
			// Click
			var $this = $(this);
			
			if (!$this.data('current')) {
				var current_id = $this.attr('id').substring(8);
				var $currentCommercial = $('li:data("current=true")', $commercial);
				var $currentCommercials = $('li:data("current=true")', $commercials);
				var $video = $('#video-'+current_id, $commercial);
				var $preview = $($this, $commercials);
				
				// Hide components of current video
				$currentCommercial.data('current', false).children('p').css({'display' : 'none'});
				
				// Revert current menu item to normal
				$currentCommercials.data('current', false).animate({'opacity' : 0.3}, 'fast');
				
				// Show components of new video
				$video.data('current', true).css({padding : '0'}).children('p').css({'display' : 'block'});
				
				// Set selected menu item
				$preview.data('current', true).animate({'opacity' : 1.0}, 'fast');
			}
		}
	);
};