var hid = 0;
var count = 1;

window.addEvent('domready', function() {

  var imgs = $(document.body).getElements('div[class="header-image"]');
  count = imgs.length;

  $('header-image-' + hid).setStyle('display', '');

  /*$('header-image-' + hid).setStyle('opacity', '0');
  $('header-image-' + hid).fade('in');*/

  setTimeout(changeHeader, 10000);


  if($('gallery-scroller') == null) {
    return;
  }

  var scrollRight = function(event) {

    var left = $('gallery-container').getScroll().x;
    var width = $('gallery-container').getSize().x;
    var size = $('gallery-container').getScrollSize().x;

    //alert("left " + left + " width " + width + " size " + size);

    var scrollFX = new Fx.Scroll($('gallery-container'), {fps: 50, duration: 800}); //, transition: 'linear'});
    scrollFX.start(left + 435, 0);
  };

  if($('gallery-button-right') != null) {
    $('gallery-button-right').addEvent('click', scrollRight);
  }

  var scrollLeft = function(event) {

    var left = $('gallery-container').getScroll().x;
    var scrollFX = new Fx.Scroll($('gallery-container'), {fps: 50, duration: 800}); //, transition: 'linear'});
    scrollFX.start(left - 435, 0);
  };

  if($('gallery-button-left') != null) {
    $('gallery-button-left').addEvent('click', scrollLeft);
  }


});

function changeHeader() {

  $('header-image-' + hid).set('tween', {duration: 'long'});
  $('header-image-' + hid).fade('out');

  hid++;
  if(hid > (count - 1))
    hid = 1;
    

  $('header-image-' + hid).setStyle('opacity', '0');
  $('header-image-' + hid).setStyle('display', '');

  $('header-image-' + hid).set('tween', {duration: 'long'});
  $('header-image-' + hid).fade('in');

  setTimeout(changeHeader, 10000);
}


function showInfo(id) {

  var info = $('item-info-' + id);
  if(info == undefined)
    return;

  visible = (info.getStyle('display') == "block");
  if(visible) {
    return;
  }

  info.fade('hide');
  info.setStyle('display', 'block');
  info.get('tween', {property: 'opacity', duration: 'short'}).start(1);
}

function hideInfo(id) {

  var info = $('item-info-' + id);
  if(info == undefined)
    return;

  visible = (info.getStyle('display') == "block");
  if(!visible) {
    return;
  }

  info.get('tween', {property: 'opacity', duration: 'short'}).start(0).chain (
    function() {
      this.element.setStyle('display', 'none')
    }
  );
}