jQuery(function($){
	// determine if we should show video or image
	var hasFlash = (parseInt(flashembed.getVersion()) > 8);

	if($('#navigator').length) {

		function showHideNavigator() {
			/* if IE6 or lower, let's not go any further */
			if($.browser.msie && parseInt($.browser.version) < 7) return false;
		
			function showHide() {
				if($navigator.hasClass('close')) {
					$navigator.animate({ 'left' : '0px' }, 400, 'easeOutCubic');
				} else {
					$navigator.animate({ 'left' : '-285px' }, 400, 'easeOutCubic');
				}
				$navigator.toggleClass('close');
			}
			
			$navigatorHandle.click(function(e) {
				showHide();
				e.preventDefault();
			});
			
			var timeoutHide = true;
			var mouseoverHandler = function() {
				timeoutHide = false;
				$navigator.unbind('mouseover', mouseoverHandler);
			}
			var mouseleaveHandler = function() {
				if(! timeoutHide) {
					showHide();
					$navigator.unbind('mouseleave', mouseleaveHandler);
				}
			};
			
			$navigator.mouseover( mouseoverHandler );
			$navigator.mouseleave( mouseleaveHandler );
				
			setTimeout(function() {
				if(timeoutHide) {
					showHide();
					$navigator.unbind('mouseover', mouseoverHandler);
					$navigator.unbind('mouseleave', mouseleaveHandler);
				}
			}, 5000);
		}
		
		function resetImage(data) {
		
			$helperDiv = $('<div>');
			$(data).appendTo($helperDiv);
			
			var $theSrc = $helperDiv.find('#fs_artwork');
		
			if(hasFlash && $theSrc.hasClass('video')) {
				$my.artworkIsMovie = true;
				$('body').find('#player').remove().end().prepend('<div id="player"></div>');
				jQuery.fn.fullscreenr({  width: 600, height: 450, bgID: '#player' });
				setMovie($theSrc.attr('rel'));
				$navigatorContent.html(data);
				$navigatorHandle.removeClass('loading');
			} else {
				$my.artworkIsMovie = false;
		
				// load image
				var img = new Image();
				$(img)
					// once the image has loaded, execute this code
					.load(function () {
						$('body')
							.find('#player').remove()
							.end().prepend($(this).attr('id', 'player'));
						$('#player').animate({'opacity' : '1.0'}, 200);
						jQuery.fn.fullscreenr({  width: 1250, height: 900, bgID: '#player' });
			
						$navigatorContent.html(data);
						$navigatorHandle.removeClass('loading');
			
					})
					// if there was an error loading the image, put everything back as was
					.error(function () {
						$navigatorContent.html(data);
						$navigatorHandle.removeClass('loading');
					})
					
					// *finally*, set the src attribute of the new image to our image
					.attr('src', $theSrc.attr('href'));
	
			}
		}
		
		function setMovie(theUrl) {
			flowplayer(
				"player",
				$my.flowplayerConfig,
				{
					clip: {
						url : theUrl,
						autoPlay : true, 
						autoBuffering : true,
						onBeforeFinish: function () {
						      this.play();
						    },
						onBeforePause: function() {
				            return false;
				        }
					},
					canvas: {
					   backgroundColor: '#000000',
					   backgroundGradient: 'none'
					},
					play: null,
					plugins: {controls: null}
				}
			);
			$('#player').css('opacity', '1.0');
		}

		$navigator = $('#navigator');
		$navigatorHandle = $('#handle');
		$navigatorContent = $navigator.find('.content');
		$my.artworkIsMovie = false;
	
		$my.flowplayerConfig = {
			src : '/style/flash/flowplayer-3.1.5.swf',
			wmode: 'opaque'
		};
		
		if(hasFlash && ! $('#fs_artwork').hasClass('image')) {
			$my.artworkIsMovie = true;
			$('body').prepend('<div id="player" class="video"></div>');
			jQuery.fn.fullscreenr({  width: 600, height: 450, bgID: '#player' });
		
			setMovie($('#fs_artwork').attr('rel'));
		} else {
			var img = new Image();
			$(img)
				.load(function () {
					$('body').prepend($(this).attr('id', 'player').attr('class', 'image'));
					jQuery.fn.fullscreenr({  width: 1250, height: 900, bgID: '#player' });
					$('#player').animate({'opacity' : '1.0'}, 200);
				})
				.attr('src', $('#fs_artwork').attr('href'));
		}
		
	
		// hijack navigator prev/next links
		$(".nav a", "#navigator").live('click', function(e) {
		
			$navigatorHandle.addClass('loading');
			
			if($my.artworkIsMovie) {
				flowplayer().stop();
			}
	
			$('#player').animate({'opacity' : '0.3'}, 200);
	
			$.get('site/single/' + $(this).attr('rel') + '/', function(data) {
				resetImage(data);
			});
	
			e.preventDefault();
		});
	
		// set up the show/hide feature
		showHideNavigator();
	
	}
	
});