var width = 2460;
var visibleWidth = 960;

var hiddenWidth = 2460-960;
var visibleRatio = 960/2460*960

$(document).ready(function(){

	
	//$('.slidershow-container').append('<div class="slidershow-progress"><div class="slidershow-current"></div>');
	$('.slidershow-container').mousemove(function(event) {
		// Calculating the relative position (percent) of the cursor on the slider image
		relativePosition = (event.pageX - this.offsetLeft)/960;
		
		// Using the relative position to calculate where the slider block should begin
		// Relative Position * (Image width - visible width) 
		position = Math.round(relativePosition*(width-visibleWidth));
		updateProgress(relativePosition);
		$(this).find('.slidershow-image').css({'margin-left':'-'+position+'px'});
		});
	
	//updateProgress(0);
});

function updateProgress(relativePosition) {
	left = relativePosition * (visibleWidth-visibleRatio);
	$('.slidershow-current').css({'margin-left':left,'width':visibleRatio});
}

/*

var currentPosition = 0;
var slideWidth = 960;
var slideInterval = 8000;
var slideIntervalId = false;
var numberOfSlides;

$(document).ready(function(){
  var container = $('.slideshow-gallery');
  var slideshow = $('.slideshow-gallery .slides');

  var slides = slideshow.find('li');
  numberOfSlides = slides.length;

  container.css('overflow', 'hidden');

  slides.wrapAll('<div class="slidesInner"></div>')
    .css({
      'float' : 'left',
      'width' : slideWidth
    });

  $('.slidesInner').css('width', slideWidth * numberOfSlides);

  controls = $('<ul class="slideshow-controls"></ul>');

  for(var i=0; i<numberOfSlides; i++) {
    $('<li></li>').bind('click', function(e){
      clearInterval(slideIntervalId);
      currentPosition = $('.slideshow-controls li').index(this);
      gotoSlide(currentPosition);
    }).appendTo(controls);
  }

  container.append(controls);

  gotoSlide(0);
  slideIntervalId = setInterval ( "advanceSlide()", slideInterval );

});

function gotoSlide(slideNum) {
  $('.slideshow-controls li').removeClass('selected');
  $('.slideshow-controls li:eq('+slideNum+')').addClass('selected');
  $('.slidesInner').animate({
    'marginLeft' : slideWidth*(-slideNum)
  }, 800);
}

function advanceSlide() {

    if (currentPosition>=numberOfSlides-1) {
        currentPosition = 0;
    } else {
        currentPosition++;
    }
    gotoSlide(currentPosition);
}
*/