//function add_video()
//				{
//					var agent = navigator.userAgent.toLowerCase();
//					var is_iphone = (agent.indexOf('iphone') != -1 || agent.indexOf('ipod') != -1);				
//					if (!is_iphone)
//					{
//						var animationdiv = document.getElementById('animation');
//						animationdiv.innerHTML = '<embed src="/videos/faces.mp4" bgcolor="transparent" width="225" height="336" loop="true" controller="false" enablejavascript="true" cache="true" kioskmode="true" showlogo="false">';
//					}
//				}


// Document load functions
$(document).ready(function(){


// Quicktime
//$.embedquicktime({
//  jquery: 'http://bitwink.dev/js/jquery-1.3.2.min.js', 
//  plugin: 'http://bitwink.dev/js/jquery.embedquicktime.js'
//});
//$('.video').media( { width: 225, height: 336, autoplay: true,  
//										 attrs: { controller:  false,  loop: true, bgcolor: 'transparent' } } );

// Start
    var $panels = $('#slider .scrollContainer > div');
    var $container = $('#slider .scrollContainer');
    var $video_panels = $('#videos .videoScrollContainer > div');
    var $video_container = $('#videos .videoScrollContainer');

    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });
        $video_panels.css({
            'float' : 'left',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', $panels[0].offsetWidth * $panels.length);
        $video_container.css('width', $video_panels[0].offsetWidth * $video_panels.length);
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#slider .scroll').css('overflow', 'hidden');
    var $videoScroll = $('#videos .videoScroll').css('overflow', 'hidden');

    // handle nav selection
    function selectNav() {
      $('#buttons > a > img.selected').removeClass("selected");
			$(this).find("img").addClass("selected");
    }

    $('#buttons').find('a').click(selectNav);

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
        var el = $('#buttons').find('a[href$="' + data.id + '"]').get(0);
        selectNav.call(el);
        $('#video_' + data.id + ' > .video_qt').removeClass('hidden');
        return true;
    }
    
    
    function scrollVideo(e, anchor, target) {
        $('.videoScroll').scrollTo( '#video_' + anchor.id, 300 );
        $('.video_qt').addClass('hidden');
        return true;
    }
    
    function showTarget(target) {
        $('#video_' + target.id + ' > .video_qt').addClass('hidden');
        return true;
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;
        
    var video_offset = parseInt((horizontal ? 
        $video_container.css('paddingTop') : 
        $video_container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow

        // can be a selector which will be relative to the target
        items: $panels,

        navigation: '#buttons a',

        // allow the scroll effect to run both directions
        axis: 'xy',
				
				onBefore: scrollVideo, 
        onAfter: trigger, // our final callback
        hash: false,

        offset: offset,

        // duration of the sliding effect
        duration: 300,

    };

    var videoScrollOptions = {
        target: $videoScroll, // the element that has the overflow

        // can be a selector which will be relative to the target
        items: $video_panels,

        navigation: '#buttons a',

        // allow the scroll effect to run both directions
        axis: 'xy',

//        onBefore: hideAnchor, 
//        onAfter: showTarget,
        offset: video_offset,

        // duration of the sliding effect
        duration: 300,

    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#slider').serialScroll(scrollOptions);
    $('#videos').serialScroll(videoScrollOptions);

    // now apply localScroll to hook any other arbitrary links to trigger 
    // the effect
    $.localScroll(scrollOptions);

    // finally, if the URL has a hash, move the slider in to position, 
    // setting the duration to 1 because I don't want it to scroll in the
    // very first page load.  We don't always need this, but it ensures
    // the positioning is absolutely spot on when the pages loads.

        // Automatically scroll to the last item
    		$('.scroll').scrollTo( 'max', 0 );
    		$('.videoScroll').scrollTo( 'max', 0 );
    		$('#buttons a:last').click();
    



// end


	//add_video();
	
	/*
	$('#buttons > a').each(function() {
		$(this).unbind('click').click(function(event) {
			$('#buttons > a > img.selected').removeClass("selected");
			$(this).find("img").addClass("selected");
			
			// Get the screenshot / movie type
			var type = $(this).attr('href');
			


//			$('#slider').scrollTo($(this).attr('href'), 300);
			$('#slider').scrollTo($scroll, 300);
*/
			

				
//				$('#movie .hvlog').css({'display' : 'none'});
//				$('#movie .hvlog').replaceWith('<div class="hvlog {controller: \'false\', loop: \'false\'}"><a href="rw_common/themes/littlesnappertouch/movies/LittleSnapperTouch.mov" rel="enclosure"> <img src="rw_common/themes/littlesnappertouch/images/click_to_play.png" />Click To Play Movie</a></div>');
//				
//				jQuery.embedquicktime({
//					jquery: 'rw_common/themes/littlesnappertouch/js/jquery-1.3.2.min.js', 
//					plugin: 'rw_common/themes/littlesnappertouch/js/jquery.embedquicktime.js'
//				});
			

//		});
//	});

	
	// Setup for QT Embed plugin
//	jQuery.embedquicktime({
//		jquery: 'rw_common/themes/littlesnappertouch/js/jquery-1.3.2.min.js', 
//		plugin: 'rw_common/themes/littlesnappertouch/js/jquery.embedquicktime.js'
//	});
//	
	//find out which browser we're in
//	var b='';
//	$.each($.browser, function(i, val) {
//		if (i=='safari' && val==true){b='safari';}
//		if (i=='opera' && val==true){b='opera';}
//		if (i=='msie' && val==true){b='msie';}
//		if (i=='mozilla' && val==true){b='mozilla';}
//	});
//		
	// Scale up the alert box (only works in safari)
//	$('img.alert').delay(2500, function(){
//		$(this).css({
//			'-webkit-transform' : 'scale(1)'
//		});
//	});
//	
	// Clicked on the cancel button
//	$('.cancel').click(function() {
		//if browser is safari scale the alert box down
//		if (b=='safari'){
//			$('img.alert').css({
//				'-webkit-transform' : 'scale(0)'
//			});
		//otherwise just hide the box
//		} else {
//			$('img.alert').css({
//				'display' : 'none'
//			});
//		}
//		
		//then remove the ok and cancel buttons
//		$('.hvlog a').css({'display' : 'none'});
//		$(this).css({'display' : 'none'});
//	});
//	
	// Find all the thumbnail links
//	$('.thumbs a').each(function() {
//		$(this).unbind('click').click(function(event) {
			// Add and remove selected class
//			$('.selected').removeClass("selected");
//			$(this).addClass("selected");
//			
			// Get the screenshot / movie type
//			var type = $(this).attr('href');
//			
			// Use this if we want the screenshots to "pop"
//			/*
//			if (type === '#main') {
//				$('.screenshots-wrap').scrollTo( '#'+$(this).attr('id'), 500, {easing:'easeOutBack'});//specify an easing equation , {offset:-50}
//			} else if (type === '#movie') {
//				$('.screenshots-wrap').scrollTo( '#'+$(this).attr('id'), 500, {easing:'easeOutBack'});//specify an easing equation , {offset:-50}
//			} else {
//				$('.screenshots-wrap').scrollTo('#'+$(this).attr('id'), 300);
//			}
//			*/
//
			// Add the scrolling. If shift is clicked, make it slooooow!
//			if(event.shiftKey === true) {
//				$('.screenshots-wrap').scrollTo($(this).attr('href'), 3000);
//			} else {
//				$('.screenshots-wrap').scrollTo($(this).attr('href'), 300);
//			}
//			
			// If they want to see the movie
//			if (type === '#movie') {
				// Scale up the alert box if we're in safari
//				if (b=='safari'){
//					$('img.alert').delay(1000, function(){
//						$(this).css({
//							'-webkit-transform' : 'scale(1)'
//						});
//					});
				//otherwise just show the box
//				} else {
//					$('img.alert').css({
//						'display' : 'block'
//					});
//				}
//				
				// Display OK / Cancel links
//				$('.cancel').css({'display' : 'block'});
//				$('.hvlog a').css({'display' : 'block'});
//				
			// All other screenshots
//			} else {
				// Scale down the alert box if we're in safari
//				if (b=='safari'){
//					$('img.alert').css({
//						'-webkit-transform' : 'scale(0)'
//					});
				//otherwise just hide the box
//				} else {
//					$('img.alert').css({
//						'display' : 'none'
//					});
//				}
//				
				// Hide OK / Cancel links
//				$('.cancel').css({'display' : 'none'});
//				$('.hvlog a').css({'display' : 'none'});
//				
				// Reset Movie HTML back to default. The Embed script will have
				// modified by now
//				$('#movie .hvlog').css({'display' : 'none'});
//				$('#movie .hvlog').replaceWith('<div class="hvlog {controller: \'false\', loop: \'false\'}"><a href="rw_common/themes/littlesnappertouch/movies/LittleSnapperTouch.mov" rel="enclosure"> <img src="rw_common/themes/littlesnappertouch/images/click_to_play.png" />Click To Play Movie</a></div>');
//				
				// Get the Embed plugin setup again
//				jQuery.embedquicktime({
//					jquery: 'rw_common/themes/littlesnappertouch/js/jquery-1.3.2.min.js', 
//					plugin: 'rw_common/themes/littlesnappertouch/js/jquery.embedquicktime.js'
//				});
//			}
//			
			// Don't flicker!
//			return false;
//		});
//	});
});