$(document).ready(function(){
  var panel12_currentPosition = 0;
  var panel12_slideWidth = 600;
  var panel12_slides = $('.panel12_slide');
  var panel12_numberOfSlides = panel12_slides.length;

  // Remove scrollbar in JS
  $('#panel12_slideshow').css('overflow', 'hidden');
  $('#panel12_slideshow').css('width', '580px');
  $('.ninesixty .panel .details').css('width', '330px');
  $('.ninesixty .panel #panel12_slideshow').css('width', '580px');

  // Wrap all .slides with #slideInner div
  panel12_slides
  .wrapAll('<div id="panel12_slideInner"></div>')
  // Float left to display horizontally, readjust .slides width
  .css({
    'float' : 'left',
    'width' : panel12_slideWidth
  });

  // Set #slideInner width equal to total width of all slides
  $('#panel12_slideInner').css('width', panel12_slideWidth * panel12_numberOfSlides);

  // Insert left and right arrow controls in the DOM
  $('.ninesixty #panel12 .link')
  	.append('<div id="panel12_slideshow_controls"><span class="panel12_control" id="panel12_previous">Previous</span><span class="panel12_control" id="panel12_next">Next</span></div>');

  // Hide left arrow control on first load
  manageControls(panel12_currentPosition);

  // Create event listeners for .controls clicks
  $('.panel12_control')
    .bind('click', function(){
    // Determine new position
      panel12_currentPosition = ($(this).attr('id')=='panel12_next')
    ? panel12_currentPosition+1 : panel12_currentPosition-1;

      // Hide / show controls
      manageControls(panel12_currentPosition);
      // Move slideInner using margin-left
      $('#panel12_slideInner').animate({
        'marginLeft' : panel12_slideWidth*(-panel12_currentPosition)
      });
    });

  // manageControls: Hides and shows controls depending on currentPosition
  function manageControls(position){
    // Hide left arrow if position is first slide
    if(position==0){ $('#panel12_previous').hide() }
    else{ $('#panel12_previous').show() }
    // Hide right arrow if position is last slide
    if(position==panel12_numberOfSlides-1){ $('#panel12_next').hide() }
    else{ $('#panel12_next').show() }
    }
  });

