/**
   * Header rotation
   *
   * @author Kai Vogel <k.vogel@21torr.com>
   * @package TYPO3
   * @copyright (c) 2009 by 21TORR Interactive GmbH
   * @version 1.0
   * @since 27.03.2009
   */
  var sDefaultImage = 'fileadmin/media/images/_all/home_visuals/home_keyvisual.jpg';
  var iRotationPointer = 0;
  var aBoxes = new Array();
  var oObserver = {
    stopLink: function(oEvent) {
      Event.stop(oEvent);
    }
  }

  oObserver.oHandle = oObserver.stopLink.bindAsEventListener(oObserver);



  /**
   * Get all IDs and positions
   */
  function vSetBoxes () {
    aElements = $$('div#header_rotation .header_box');

    // Switch objects with their id
    for (i = 0; i < aElements.length; i++) {
      sID = aElements[i].identify();
      sID = sID.substr(sID.indexOf('box_')+4, sID.length);
      aBoxes[i] = new Object();
      aBoxes[i]['id'] = sID;
      aBoxes[i]['left'] = aElements[i].style.left;
    }
  }

  /**
   * Get a random pointer
   */
  function iGetRandomPointer () {
    var iCount = aBoxes.length;

    return Math.ceil(Math.random() * 1000) % iCount;
  }


  /**
   * Get next pointer
   */
  function iGetNextPointer () {
    if(typeof aBoxes[iRotationPointer + 1] != "undefined") {
      return iRotationPointer + 1;
    } else {
      return 0;
    }
  }


  /**
   * Start / stop event observer
   */
  function vStartStopObserver (bEnable) {
    var oCurrentLink = $('header_link_'+aBoxes[iRotationPointer]['id']);

    if (bEnable) {
      oCurrentLink.stopObserving('click', oObserver.oHandle);
      oCurrentLink.style.cursor = 'pointer';
    } else {
      oCurrentLink.observe('click', oObserver.oHandle);
      oCurrentLink.style.cursor = 'default';
    }
  }

  /**
   * Rotate images and related text box
   */
  function vRotate () {
    var iContainerWidth = $('header_rotation').getWidth();
    var oCurrentImage   = $('header_image_'+aBoxes[iRotationPointer]['id']);
    var oCurrentBox     = $('header_box_'+aBoxes[iRotationPointer]['id']);
    var iNext           = iGetNextPointer();
    var oNextImage      = $('header_image_'+aBoxes[iNext]['id']);
    var oNextBox        = $('header_box_'+aBoxes[iNext]['id']);
    var iCurrentLeft    = parseInt(oCurrentBox.getStyle('left'));
    var iCurrentTop     = parseInt(oCurrentBox.getStyle('top'));
    var iNextWidth      = parseInt(oNextBox.getWidth());
    var iNextTop        = parseInt(oNextBox.getStyle('top'));
    var sNextLeft       = aBoxes[iNext]['left'];
    var iNextLeft       = sNextLeft.substr(0,sNextLeft.length-2); // remove "px"

    iRotationPointer    = iNext;

    // Move current box out
    new Effect.Move(oCurrentBox, {
      x: iContainerWidth,
      y: iCurrentTop,
      mode: 'absolute',
      duration: 0.6,
      transition: Effect.Transitions.sinoidal,
      queue: {
        position: 'front',
        scope: 'rotation'
      },
      beforeStart : function () {
        vStartStopObserver(false);
      },
      afterFinish : function () {
        oCurrentBox.hide();
      }
    });

    // Fade current image out and next image in
    new Effect.Parallel([
      new Effect.Opacity(oCurrentImage, {
        from: 1.0,
        to: 0,
        sync: true
      }),
      new Effect.Opacity(oNextImage, {
        from: 0,
        to: 1.0,
        sync: true
      })
    ], {
      duration: 1,
      transition: Effect.Transitions.sinoidal,
      queue: {
        position: 'end',
        scope: 'rotation'
      },
      beforeStart : function () {
        oNextImage.setOpacity(0);
        oNextImage.show();
      },
      afterFinish : function () {
        oCurrentImage.hide();
      }
    });

    // Move next box in
    new Effect.Move(oNextBox, {
      x: iNextLeft,
      y: iNextTop,
      mode: 'absolute',
      duration: 0.7,
      transition: Effect.Transitions.sinoidal,
      queue: {
        position: 'end',
        scope: 'rotation'
      },
      beforeStart : function () {
        oNextBox.style.left = iContainerWidth+'px';
        oNextBox.show();
      },
      afterFinish : function () {
        vStartStopObserver(true);
      }
    });
  }


  /**
   * Switch header visuals
   */
  function vSwitchVisual () {
    var iLastIndex        = 0;
    var iTimeout          = 60;
    var oFirst            = null;
    var oDefault          = null;

    // Set all IDs and positions
    vSetBoxes();

    // Get random pointer
    iRotationPointer = iGetRandomPointer();

    // Set variables
    var iContainerWidth   = $('header_rotation').getWidth();
    var oTextBox          = $('header_box_'+aBoxes[iRotationPointer]['id']);
    var iNextTop          = parseInt(oTextBox.getStyle('top'));
    var sNextLeft         = oTextBox.style.left;
    var iNextLeft         = sNextLeft.substr(0,sNextLeft.length-2); // remove "px"

    // Make boxes opaque
    $$('div#header_rotation .header_box').each(function (poTextBox) {
      poTextBox.setOpacity(0.8);
    });

    // Get default image
    oDefault = $('header_image_0');

    // Get first - random - image
    oFirst = $('header_image_'+aBoxes[iRotationPointer]['id']);
    oFirst.setOpacity(1);
    oFirst.show();

    // Fade current image out and next image in
    new Effect.Parallel([
      new Effect.Opacity(oDefault, {
        from: 1.0,
        to: 0,
        sync: true
      }),
      new Effect.Opacity(oFirst, {
        from: 0,
        to: 1.0,
        sync: true
      })
    ], {
      duration: 1,
      transition: Effect.Transitions.sinoidal,
      queue: {
        position: 'front',
        scope: 'defaultimg'
      },
      beforeStart : function () {
        oFirst.setOpacity(0);
        oFirst.show();
      },
      afterFinish : function () {
        oDefault.remove();
      }
    });

    // Move first box in
    new Effect.Move(oTextBox, {
      x: iNextLeft,
      y: iNextTop,
      mode: 'absolute',
      duration: 0.7,
      transition: Effect.Transitions.sinoidal,
      queue: {
        position: 'end',
        scope: 'defaultimg'
      },
      beforeStart : function () {
        oTextBox.style.left = iContainerWidth+'px';
        oTextBox.show();
      },
      afterFinish : function () {
        vStartStopObserver(true);
      }
    });

    // Rotate
    new PeriodicalExecuter(function(poExecuter) {
      vRotate();
    }, 8);
  }


  /**
   * Show default image before starting rotation
   */
  function vShowDefaultImage () {
    $('header_rotation').insert('<img title="" alt="Hear the World" src="' + sDefaultImage + '" style="opacity: 1; display: block;" id="header_image_0" class="header_image"/>');
  }

  // Start
  vShowDefaultImage();

  // Then start rotation...
  setTimeout("vSwitchVisual()", 3500);