var buttonSlideLeft = document.getElementById('buttonSlideLeft');
var buttonSlideRight = document.getElementById('buttonSlideRight');

var photoLeftSlide = document.getElementById('leftSlide');
var photoRightSlide = document.getElementById('rightSlide');

var imageLoading = 'images/loader.gif';
var imageSlideLeft = 'images/buttonslideleft.gif';
var imageSlideRight = 'images/buttonslideright.gif';
var imageSlideLeftHover = 'images/buttonslidelefthover.gif';
var imageSlideRightHover = 'images/buttonsliderighthover.gif';
var imageSlideLeftDisabled = 'images/buttonslideleftdisabled.gif';
var imageSlideRightDisabled = 'images/buttonsliderightdisabled.gif';

var imageWidth = 290;
var imageHeight = 290;

var slidePosition = 0;

var slideFiles = [];

var sliderTimer = null;
var autoSlideDelay = 4000;
var autoSlideActive = true;

function resetAutoSlider()
{
  if (sliderTimer != null)
  {
    clearTimeout(sliderTimer);
  }
  if (autoSlideActive)
  {
    sliderTimer = setTimeout(autoSlide, autoSlideDelay);
  }
}

function autoSlide()
{
  if (slidePosition > 0 && slidePosition >= (slideFiles.length - 2))
  {
    slidePosition = 0;
    updateSlides();
    resetAutoSlider();
  }
  else
  {
    slideRight();
  }
}

function enableButtons()
{
  if (buttonSlideLeft == null)
  {
	return;
  }
  buttonSlideLeft.onclick = function() {
    autoSlideActive = false;
    slideLeft();
  };
  buttonSlideRight.onclick = function() {
    autoSlideActive = false;
    slideRight();
  };
  if (slidePosition === 0)
  {
    buttonSlideLeft.src = imageSlideLeftDisabled;
    buttonSlideLeft.onmouseover = null;
    buttonSlideLeft.onmouseout = null;
  }
  else
  {
    buttonSlideLeft.src = imageSlideLeft;
    buttonSlideLeft.onmouseover = function() {
      this.src = imageSlideLeftHover;
    };
    buttonSlideLeft.onmouseout = function() {
      this.src = imageSlideLeft;
    };
  }
  if (slidePosition == slideFiles.length - 2)
  {
    buttonSlideRight.src = imageSlideRightDisabled;
    buttonSlideRight.onmouseover = null;
    buttonSlideRight.onmouseout = null;
  }
  else
  {
    buttonSlideRight.src = imageSlideRight;
    buttonSlideRight.onmouseover = function() {
      this.src = imageSlideRightHover;
    };
    buttonSlideRight.onmouseout = function() {
      this.src = imageSlideRight;
    };
  }
  if (slideFiles.length <= 2)
  {
    document.getElementById('slideControls').style.visibility = 'hidden';
  }
}

function setCallbacks(image, element)
{
  $('#' + element.id).fadeOut(100);
  image.onload = function()
  {
    $('#' + element.id).hide().fadeIn(600);
    element.src = image.src;
    enableButtons();
  };
  image.onerror = function(error)
  {
    enableButtons();
  };
}

function slideLeft()
{
  if (slidePosition >= 2)
  {
    showLoading(buttonSlideLeft);
    slidePosition = slidePosition - 2;
    updateSlides();
  }
  resetAutoSlider();
}

function updateSlides()
{
  if (photoLeftSlide && photoRightSlide)
  {
    photoLeftSlide.src = slideFiles[slidePosition + 0];
    photoRightSlide.src = slideFiles[slidePosition + 1];
    var imageLeft = new Image();
    var imageRight = new Image();
    setCallbacks(imageLeft, photoLeftSlide);
    setCallbacks(imageRight, photoRightSlide);
    imageLeft.src = slideFiles[slidePosition + 0];
    imageRight.src = slideFiles[slidePosition + 1];
  }
}

function slideRight()
{
  if (slidePosition < (slideFiles.length - 2))
  {
    showLoading(buttonSlideRight);
    slidePosition = slidePosition + 2;
    updateSlides();
  }
  resetAutoSlider();
}

function showLoading(loadingButton)
{
  if (buttonSlideLeft == null)
  {
	return;
  }
  if (loadingButton == buttonSlideLeft)
  {
    buttonSlideLeft.src = imageLoading;
    buttonSlideRight.src = imageSlideRightDisabled;
  }
  if (loadingButton == buttonSlideRight)
  {
    buttonSlideLeft.src = imageSlideLeftDisabled;
    buttonSlideRight.src = imageLoading;
  }
  buttonSlideLeft.onclick = '';
  buttonSlideRight.onclick = '';
}

function setSlideFiles(files)
{
  slideFiles = files;
  enableButtons();
}

resetAutoSlider();