//debugger;
function ImageWarp(src, minHeight, maxHeight, minVPos, duration, interval, delay) {
  var imageNode;
  
  var id;
  var aniDelay;
  var aniDirection = -1;
  var aniPos = 0;
  
  function sinusEase(aniPos, ease) {
    if (aniPos > 1) aniPos = 1;
    else if (aniPos < 0) aniPos = 0;
    if (ease > 1) ease = 1;
    else if (ease < 0) ease = 0;
    return (Math.sin((aniPos - 0.5) * Math.PI) / 2 + 0.5) * ease + aniPos * (1 - ease);
  };
  
  function animate() {
    if (aniDelay > 0) {
      aniDelay -= interval;
      id = window.setTimeout(arguments.callee, interval);
      return;
    };
    aniPos += 1 / (1000 / interval * (duration / 1000)) * aniDirection;
    var easing = sinusEase(aniPos, 1);
    if (window.console) console.log(aniPos, "; ", easing);
    imageNode.style.height = Math.round(minHeight + (maxHeight - minHeight) * easing) + "px";
    imageNode.style.backgroundPosition = "0 -" + Math.round(minVPos - minVPos * easing) + "px";
    
    if (aniDirection > 0 && aniPos >= 1 || aniDirection < 0 && aniPos <= 0) {
      aniPos = aniDirection > 0 ? 1 : 0;
      id = null;
      return;
    }
    id = window.setTimeout(arguments.callee, interval);
  };
  
  function onMouseOver(e) {
    if (!id) aniDelay = delay;  
    aniDirection = 1;
    animate();
  };
  
  function onMouseOut(e) {
    aniDirection = -1;
    animate();
  };
  
  for (; this.childNodes[0];) this.removeChild(this.childNodes[0]);
    
  imageNode = document.createElement('div');
  imageNode.className = "image";
  
  imageNode.style.height = minHeight + "px";
  imageNode.style.backgroundImage = "url('" + src + "')";
  imageNode.style.backgroundPosition = "0 -" + minVPos + "px";
  
  imageNode.appendChild(document.createElement('div'));
  imageNode.childNodes[0].className = "bottom";  
  
  this.appendChild(imageNode);
  
  if (this.addEventListener) {
    this.addEventListener('mouseover', onMouseOver, false);
    this.addEventListener('mouseout', onMouseOut, false);
  }
  else if (this.attachEvent) {
    this.attachEvent('onmouseenter', onMouseOver);
    this.attachEvent('onmouseleave', onMouseOut);
  };
    
  
  this.undefine = function() {
    if (id) window.clearTimeout(id);
    if (this.addEventListener) {
      this.removeEventListener('mouseover', onMouseOver, false);
      this.removeEventListener('mouseout', onMouseOut, false);
    }
    else if (this.attachEvent) {
      this.detachEvent('onmouseenter', onMouseOver);
      this.detachEvent('onmouseleave', onMouseOut);
    };
    
  };  
};


var windowOnLoad = function(e) {
  var divId = "banner";
  
  var imageSource = [
    "/fileadmin/templates/pix/header/27.jpg",
    "/fileadmin/templates/pix/header/28.jpg",
    "/fileadmin/templates/pix/header/29.jpg",
    "/fileadmin/templates/pix/header/30.jpg",
    "/fileadmin/templates/pix/header/31.jpg",
    "/fileadmin/templates/pix/header/32.jpg",
    "/fileadmin/templates/pix/header/33.jpg",
    "/fileadmin/templates/pix/header/34.jpg",
    "/fileadmin/templates/pix/header/35.jpg",
    "/fileadmin/templates/pix/header/36.jpg",
    "/fileadmin/templates/pix/header/37.jpg",
    "/fileadmin/templates/pix/header/38.jpg",
    "/fileadmin/templates/pix/header/39.jpg",
    "/fileadmin/templates/pix/header/40.jpg",
    "/fileadmin/templates/pix/header/41.jpg"];
    
  var imageVPos = [
    479,
    299,
    462,
    209,
    173,
    266,
    279,
    385,
    146,
    264,
    327,
    489,
    293,
    285,
    321];
    
  var minHeight = 131;
  var maxHeight = 670;
  
  var aniDuration = 2000;
  var aniInterval = 40;
  var aniDelay = 500;
  
  var index = Math.floor(Math.random() * imageSource.length);
  var node = document.getElementById(divId);
  ImageWarp.call(node, imageSource[index], minHeight, maxHeight, imageVPos[index], aniDuration, aniInterval, aniDelay);
  
  if (window.addEventListener) {
    window.removeEventListener('DOMContentLoaded', windowOnLoad, false);
    window.removeEventListener('load', windowOnLoad, false);
    window.addEventListener('unload', node.undefine, false);
  } 
  else if (window.attachEvent) {
    window.detachEvent('onload', windowOnLoad);
    window.attachEvent('onunload', node.undefine);
  };
  windowOnLoad = undefined;
};


if (window.addEventListener) {
  window.addEventListener('DOMContentLoaded', windowOnLoad, false);
  window.addEventListener('load', windowOnLoad, false);
} else if (window.attachEvent) window.attachEvent('onload', windowOnLoad);
