var scroll = null;
var fadeOutImage = null;
var marginscroll = null;
var current_image = 0;
var gallery_numImages = 0;
var gallery_opacity = 0.30;

function scrollGallery() {
	if (gallery_numImages > 0) {
    var mgstyle = $('motiongallery').getStyle('margin-left').toInt();
    var x =  Math.floor((window.getWidth()-$('img'+current_image).getElement('img').clientWidth)/2)
          - $('img'+current_image).getLeft() + mgstyle;
    marginscroll.stop();
    marginscroll.start({'margin-left': [$('motiongallery').getStyle('margin-left'), x]});
  }
}

function fadeInImage() {
  $('img'+current_image).effect('opacity', {duration: 500}).start(gallery_opacity,1);
}

window.addEvent('domready', function() {
  $('gallery').setStyle('overflow','hidden');
  var w = 0;
  $('motiongallery').getElements('div').each(function(el) {
    w += el.clientWidth+80;
    el.setOpacity(gallery_opacity);
  });
  $('motiongallery').setStyle('width', w+'px');
  
  marginscroll = $('motiongallery').effects({duration: 1000,
                                             onComplete: fadeInImage});
  
  $('nav_left').addEvent('click', function(e){
    e = new Event(e).stop();
    if (current_image > 0) {
      $('img'+current_image).effect('opacity', {duration: 500, onComplete:scrollGallery}).start(1,gallery_opacity);
      current_image--;
    }
	});

  $('nav_right').addEvent('click', function(e){
    e = new Event(e).stop();
    if (current_image < gallery_numImages - 1) {
      $('img'+current_image).effect('opacity', {duration: 500, onComplete:scrollGallery}).start(1,gallery_opacity);
      current_image++;
    }
	});

  $('nav_left').addEvent('mouseenter', function(e){
    e = new Event(e).stop();
    this.getElement('img').src = base_url+'img/fl/arrow_left_h.gif';
	});
  $('nav_left').addEvent('mouseleave', function(e){
    e = new Event(e).stop();
    this.getElement('img').src = base_url+'img/fl/arrow_left.gif';
	});
	
  $('nav_right').addEvent('mouseenter', function(e){
    e = new Event(e).stop();
    this.getElement('img').src = base_url+'img/fl/arrow_right_h.gif';
	});
  $('nav_right').addEvent('mouseleave', function(e){
    e = new Event(e).stop();
    this.getElement('img').src = base_url+'img/fl/arrow_right.gif';
	});
  scrollGallery();
	
});