// This code is adapted from the slideshow tutorial from SixRevisions
	// 	See: http://sixrevisions.com/tutorials/javascript_tutorial/create-a-slick-and-accessible-slideshow-using-jquery/
	//
	//	Assumptions:
	//		1.	There is a slideshow div named				#slideshow
	// 		2. There is a container named 					#slideshow_container
	//		3.	The container has divs with the class .slide
	//		4. The CSS styles are defined in msm.slideshow.css
	
	var rewind_slideshow = true;  
    var slide_transition_time = 1000;  
    var display_slideshow_control_panel = true;    
    var autostart_slideshow = false;  
    var slide_viewing_time = 3000;  

    var slideshow_control_icons = new Array();  
    slideshow_control_icons['play']    = '/static/img/control_play.png';  
    slideshow_control_icons['pause'] = '/static/img/control_pause.png';     
    var interval;  
    var slideshow_start_mode = false;
	 
	var slideshow_width 	= 640;
	var slideshow_height 	= 400;
	
	function slideshow_container_width()
	{
		return slideshow_width - 80;
	}
	 
	function slide_width()
	{
		return slideshow_container_width();
	}
	
	var currentPosition = 0;
       
	// manageControls: Hides and Shows controls depending on currentPosition
	function manageControls(position,numberOfSlides){
		// Hide left arrow if position is first slide
		if(position==0)
		{ $('#slideshow_leftControl').hide() } 
		else
		{ $('#slideshow_leftControl').show() }
		
		// Hide right arrow if position is last slide
		if(position==numberOfSlides-1 && rewind_slideshow == false)
		{ $('#slideshow_rightControl').hide() } 
		else
		{ $('#slideshow_rightControl').show() }
		
		if(position == numberOfSlides && rewind_slideshow == true)
		{  
          currentPosition = 0;  
           $('#slideshow_leftControl').hide();  
		}  

	}	
  
    function start_slideshow() {  
         slideshow_start_mode = true;  
         interval = setInterval(show_next_slide, slide_viewing_time );  
    }  
       
    function show_next_slide(){  
        $('#slideshow_rightControl').click();  
    }  
       
    function pause_slideshow() {  
        slideshow_start_mode = false;  
             clearInterval(interval);  
    } 
	 
	function SetUpSlideShow()
	{
		var slides = $('.slide');
		var numberOfSlides = slides.length;

		// Remove scrollbar in JS
		$('#slideshow').css({
			'width' 	: slideshow_width,
			'height'	: slideshow_height
		});

		// Remove scrollbar in JS
		$('#slideshow_container').css({
			'overflow' : 'hidden', 
			'width' : slideshow_container_width(),
			'height'	: slideshow_height
		});

		// Wrap all .slides with #slideInner div
		slides
			.wrapAll('<div id="slideInner"></div>')
			// Float left to display horizontally, readjust .slides width
			.css({
					  'float' : 'left',
					  'width' : slide_width(),
					  'height'	: slideshow_height

			});

		// Set #slideInner width equal to total width of all slides
		$('#slideInner').css('width', slide_width() * numberOfSlides);

		// Insert controls in the DOM
		$('#slideshow')
			.prepend('<span class="slideshow_control" id="slideshow_leftControl">Clicking moves left</span>')
			.append('<span class="slideshow_control" id="slideshow_rightControl">Clicking moves right</span>');

		$('.slideshow_control').css({
			'height'	: slideshow_height,
			'background-color' : 'black'
		});

		// Hide left arrow control on first load
		manageControls(currentPosition);

		if(display_slideshow_control_panel == true)
		{  
			$('#slideshow_container').prepend('<img id="slideshow_control_panel" src="" alt="Slideshow Control Panel" />');  
			if(autostart_slideshow == true)
			{  
				$('#slideshow_control_panel').attr('src',slideshow_control_icons['pause']);  
			}
			else
			{  
				$('#slideshow_control_panel').attr('src',slideshow_control_icons['play']);    
			}  
			
			$('#slideshow_control_panel').bind('click', function(){  
				if(slideshow_start_mode == true)
				{  
					$(this).attr('src',slideshow_control_icons['play']);  
					pause_slideshow();  
				}
				else
				{  
					$(this).attr('src',slideshow_control_icons['pause']);  
					start_slideshow();  
				}  
			});  
		}  

		// Create event listeners for .controls clicks
		$('.slideshow_control')
			.bind('click', function(){
				// Determine new position
				currentPosition = ($(this).attr('id')=='slideshow_rightControl') ? currentPosition+1 : currentPosition-1;
			
				if(currentPosition == numberOfSlides && rewind_slideshow == false )
				{  
					currentPosition--;  
					pause_slideshow();  
				}  
				
				// Hide / show controls
				manageControls(currentPosition,numberOfSlides);
				// Move slideInner using margin-left
				transition_time = (currentPosition == 0) ? 0 : slide_transition_time;
				$('#slideInner').animate({
				  'marginLeft' : slide_width() * (-currentPosition)
				}, transition_time);
		});
		
		if (autostart_slideshow == true)  
			start_slideshow();  
	}