/**
<div id="header-image-controls">
  <span class="image-forward"></span>
  <span class="image-number">Bild 0/0</span>
  <span class="image-backward"></span>
</div>
<div class="clear"></div>
**/

var mmFX = function() {

  config = {
  
    //autorun für die home
    autorun:false,
    
    //fadein dauer
    duration:1000,
    
    //dauer bis nächstes bild
    interval:5000,
    
    //selector-string für die vor und zurück buttons
    buttonNext:'#header-image-controls .image-forward',
    buttonPrevious:'#header-image-controls .image-backward',
    labelIndex:'#header-image-controls .image-number > span',
    controls:'#header-image-controls',
    
    //zuerst headerimages, dann home images
    imageSelector:'#header-image div',
    altImageSelector:'#home-image div'
  }

  currentImage = 0;
  lastImage = 0;
  images = new Array();
  autorunInterval = null;
  locked = false;
  this.init();
}
mmFX.prototype = new Object();

mmFX.prototype.init = function() {

  var selector = config.imageSelector;
  if($(selector).length == 0)
    selector = config.altImageSelector;

  $(selector).css('position','absolute');
  images = $(selector);
  
  if(images.length == 0) {
    if($(config.controls).length > 0) {
        $(config.controls).css('display','none');
    }
  } else {
    config.autorun = true;
    this.onFadeInBefore();
    this.initAutorun();
    this.setButtonStates();
  }
}
mmFX.prototype.next = function() {
  if(!locked) {
    ++currentImage;
    this.show();
  }
  return false;
}
mmFX.prototype.previous = function(event) {
  if(!locked) {
    --currentImage;
    this.show();
  }
  return false;
}
mmFX.prototype.show = function() {
  this.lock();
  if(typeof(this.onFadeInBefore) == "function") {
    this.onFadeInBefore();
  }

  $(images[lastImage]).css('z-index',images.length);
  for(var i = 0; i<images.length; i++) {
    if(i == lastImage || i == currentImage) continue;
    $(images[i]).css('z-index',i);
  }
  $(images[currentImage]).css('display','none');
  $(images[currentImage]).css('z-index',images.length + 1);
  var scope = this;
  $(images[currentImage]).fadeIn(config.duration, function() {
    scope.onFadeInAfter();
  });
  lastImage = currentImage
}

// Hooks
mmFX.prototype.onFadeInBefore = function() {
  if(config.autorun) {
    window.clearInterval(autorunInterval);
    if(currentImage == images.length) {
      currentImage = 0;
    }
  }
  if($(config.labelIndex).length > 0) {
    $(config.labelIndex).html((currentImage + 1) + '/' + images.length);
  }
}

mmFX.prototype.onFadeInAfter = function() {
  this.setButtonStates();
  this.initAutorun();
  this.unlock();
}


// Helpers
mmFX.prototype.stopAutorun = function() {
    window.clearInterval(autorunInterval);
    config.autorun = false;
}
mmFX.prototype.lock = function() {
  locked = true;
}
mmFX.prototype.unlock = function() {
  locked = false;
}
mmFX.prototype.setButtonStates = function() {
  if( $(config.buttonNext).length > 0 &&  $(config.buttonPrevious).length > 0 ) {
    this.bindButton($(config.buttonNext), (currentImage < images.length - 1), 'click', function(event) {
        event.data.scope.stopAutorun();
        event.data.scope.next();
    });
    this.bindButton($(config.buttonPrevious), (currentImage > 0), 'click', function(event) {
        event.data.scope.stopAutorun();
        event.data.scope.previous();
    });
  }
}
mmFX.prototype.bindButton = function(btn, bind, event, func) {
  if(bind) {
    btn.bind(event, {scope:this}, func);
    btn.css('cursor','pointer');
  } else {
    btn.unbind(event);
    btn.css('cursor','default');
  }
}
mmFX.prototype.initAutorun = function () {
  if(config.autorun && images.length > 1) {
    var scope = this;
    autorunInterval = window.setInterval(function() {
      scope.next();
    }, config.interval);
  }
}



/** START **/
$(document).ready(function() {
  var fx = new mmFX();
  
  $('tbody tr:even').css('background-color', '#f2f2f2');
  
  //find all form with class jqtransform and apply the plugin
  $("form.jqTransform").jqTransform();
});