var _basics = {
  _getBorderAndPadding: function(el){
    return {
      x : el.getStyle('paddingLeft').toInt() + el.getStyle('paddingRight').toInt() + el.getStyle('borderLeftWidth').toInt() + el.getStyle('borderRightWidth').toInt(),
      y : el.getStyle('paddingTop').toInt() + el.getStyle('paddingBottom').toInt() + el.getStyle('borderTopWidth').toInt() + el.getStyle('borderBottomWidth').toInt()
    };
  },
  
  getAbsoluteSize: function(el,debug){
    return {
      x : el.getSize().x - this._getBorderAndPadding(el).x,
      y : el.getSize().y - this._getBorderAndPadding(el).y
    };
  },
  
  getAbsoluteScrollSize: function(el){
    return {
      x : el.getScrollSize().x - this._getBorderAndPadding(el).x,
      y : el.getScrollSize().y - this._getBorderAndPadding(el).y
    };
  },
  
  debug : {
    win : null,
    msg : function(msg) {
      this.init();
      this.win.set('html',msg);
    },
    
    init : function()
    {
      if(!$chk(this.win))
      {
        this.win = new Element('div', {
          'style' : 'position:absolute;top:0;left:0;width:300px;z-index:99;background:#ff0000;color:#fff'
        })
        .inject($$('body')[0]);
      }
    }
  }
}

_homepage_animation = {
  duration : Browser.Engine.trident ? 800 : 500,
  transition : Fx.Transitions.Sine.easeOut,
  menuitemcounter : 0,
  menuitems : new Array(),
  homepage : null,
    
  init : function()
  {
    if($chk(this.homepage = $$('body#home')[0]))
    {
      // get all navigation elements
      if($chk(navigation = this.homepage.getElement('.rex-navi1')))
      {
        if($chk(menuitems = navigation.getChildren('li')))
          this.menuitems.combine(menuitems);
      }

      this.startscreen = $('intro-page');

      // 1. Zeige Intro-Screeen (Claim + grosses Logo)
      (function(){ this.showPlayButton(); }.bind(this)).delay(2000);
    }
  },
  
  showPlayButton : function()
  {
    // 2.1 Zeige Header-Streifen
    this.moveItem(navigation);

    // 2.2 Zeige Hintergrund-Bloecke
    this.pagewidth = _basics.getAbsoluteSize($('page')).x;
    blockwidth = 90;
    new Fx.Morph($('page'),{
      duration: this.duration/2,
      transition: this.transition,
      onComplete: function()
      {
        $('page').setStyle('background-position','87em 410px');

        // 2.3 Blende Play-Button ein
        this.playbutton = new Element('div')
                          .addClass('play-button')
                          .addEvent('click',function(){
                            this.startContent();
                          }.bind(this))
                          .inject($('page'))
                          .setStyles({'opacity':0,'z-index':80});
    
        new Fx.Morph(this.playbutton,{
          duration: this.duration/2,
          transition: this.transition,
          onComplete: function()
          {
            // 2.4 Belege PlayButton mit Start-Funktion
            this.startscreen.addEvent('click',function(){
              this.startContent();
            }.bind(this));
          }.bind(this)
        })
        .start({
          'opacity':[0,1]
        });
      }.bind(this)
    })
    .start({
      'background-position':[this.pagewidth+' 410px',(this.pagewidth-blockwidth)+' 410px']
    });
    
  },
  
  startContent : function()
  {
    // 3.1 Blende Play-Button aus
    new Fx.Morph(this.playbutton,{
      duration: this.duration/5,
      transition: this.transition,
      onComplete: function()
      {
        this.playbutton.destroy();

        // 3.2 Blende Start-Screen aus
        new Fx.Morph(this.startscreen,{
          duration: this.duration/3,
          transition: this.transition,
          onComplete: function()
          {
            this.startscreen.destroy();
            
            // 3.3 Blende Menüpunkte ein
            if(this.menuitems.length > 0) this.mover();
            else this.fadeInLogo(); // Sonst 3.4: Blende Logo ein

          }.bind(this)
        }).start({'opacity':[1,0]});
      }.bind(this)
    }).start({'opacity':[1,0]});
  },  
  
  mover : function() {
    this.moveItem(this.menuitems[this.menuitemcounter]);
    this.menuitemcounter++;
    if(this.menuitemcounter < this.menuitems.length)
      (function(){ this.mover(); }.bind(this)).delay(this.duration/(3*this.menuitemcounter));
    else
      this.fadeInLogo();
  },
  
  fadeInLogo : function()
  {
    if($chk(logo = $$('.logo')[0]))
    {
      new Fx.Morph(logo,{
        duration: this.duration,
        transition: this.transition,
        onComplete: function()
        {
          this.moveContent();
        }.bind(this)
      })
      .start({
        'opacity':[0,1]
      });
    }

    if($chk(sb = $('search-box')))
    {
      new Fx.Morph(sb,{
        duration: this.duration,
        transition: this.transition
      })
      .start({
        'opacity':[0,1]
      });
    }
  },
  
  moveItem : function(el)
  {
    new Fx.Morph(el,{
      duration: this.duration,
      transition: this.transition,
      onComplete: function()
      {
      }.bind(this)
    })
    .start({
      'margin-left':[el.getStyle('margin-left'),0]
    });
  },
  
  moveContent : function()
  {
    if($chk(contentdiv = $('content')))
    {
    
      $('page').setStyle('overflow','hidden');

      this.homepage.set('id','');
      contentdiv.setStyles({
        'padding-left':this.pagewidth+'px',
        'width':'96em',
        'display':'block',
        'opacity':0
      });

      new Fx.Morph(contentdiv,{
        duration: this.duration/2,
        transition: this.transition,
        onComplete: function()
        {
          $('page').setStyle('overflow','auto');
        }.bind(this)
      })
      .start({
        'padding-left':[this.pagewidth,0],
        'opacity':[contentdiv.getStyle('opacity'),1]
      });
    }
  }
}

var _ie6fix = {
  init : function(){
    if(Browser.Engine.trident && Browser.Engine.version.toInt()<=4)
    {
      $$('.rex-navi1>li').each(function(li,i){
        li.addEvents({
          'mouseenter' : function(){ this.addClass('hover'); }.bind(li),
          'mouseleave' : function(){ this.removeClass('hover'); }.bind(li)
          
        });
      })
    }
  }
}

window.addEvent('domready', function(){
  _homepage_animation.init();
  _ie6fix.init();
});