var MultiTabTeaser=Class.create();

MultiTabTeaser.prototype = {

  pages:new Array(),
  currentPageIndex:0,
  autoPage:null,
  id:null,
  interval:null,
  
  initialize:function(teaser_container) {
    this.id = teaser_container
  },
  
  addTeaser:function(teaser){
    this.pages[teaser.readAttribute("sonderangebotIndex")] = teaser.id;
    teaser.button = teaser.id+"_button"
  },
  
  showNextTeaser:function(b){
    var a;

    if(b != null && b == true){
      this.stopAutoTeaser()
    }
		a = ( this.currentPageIndex == this.pages.length-1 ) ? 0 : Number(this.currentPageIndex)+1;
    this.exchangeTeaser(this.currentPageIndex,a);
    this.currentPageIndex=a
  },
  
  showPrevTeaser: function(b){
    var a;

    if(b != null && b == true){
      this.stopAutoTeaser()
    }
		a = ( this.currentPageIndex==0 ) ? this.pages.length-1 : Number(this.currentPageIndex)-1;
    this.exchangeTeaser(this.currentPageIndex,a);
    this.currentPageIndex=a
  },
  
  startAutoTeaser:function() {
    this.autoPage=true;
    var _function="MultiTeaserHelper.multiTabTeaser.showNextTeaser()";
    this.interval=window.setInterval(_function, 6000);
  },
  
  stopAutoTeaser:function(){

    if(this.autoPage){
      this.autoPage=false;window.clearInterval(this.interval)
    }
  },
  
  showTeaser:function(a){

    this.stopAutoTeaser();
    this.exchangeTeaser(this.currentPageIndex,a);
    this.currentPageIndex=a
  },
  
  exchangeTeaser:function(e,c){

    var d=$(this.pages[e]);
    var b=$(this.pages[c]);
    var a="slideHorizontal";

    $(d.button).addClassName("inactive");/**/
    $(d.button).removeClassName("active");

    $(b.button).addClassName("active");
    $(b.button).removeClassName("inactive");/**/
    
     if(a=="slideHorizontal"){
       if(b.id!=d.id){
         var g=this.pages.length;
         var f=1;
         if((this.pages[g-1]==d.id&&b.id<d.id&&(b.id!=this.pages[0]||g<3))||(this.pages[g-1]!=d.id&&b.id<d.id)||(this.pages[0]==d.id&&b.id==this.pages[g-1]&&g>2)){
           f=-1
         }

         b.style.cssText = "z-index:100;position:absolute;top:0px;left:"+b.getWidth()*f+"px";
         d.style.zIndex = "5";

         new Effect.Parallel([new Effect.Appear(b,{sync:true,duration:0.01}),
         new Effect.Move(d,{sync:true,x:-b.getWidth()*f,y:0,mode:"absolute"}),
         new Effect.Move(b,{sync:true,x:0,y:0,mode:"absolute"})],{duration:0.8,delay:0})
      }
    }
  }
};

	var MultiTeaserHelper = {

		multiTabTeaser: {},

		initilize: function(teaser_container) {
			var teaser_list = teaser_container.select(".sonderangebot"),
				  idx,
					len = teaser_list.length;

			this.multiTabTeaser = new MultiTabTeaser(teaser_container);

			for(idx = 0; idx < len; idx = idx + 1) {
				this.multiTabTeaser.addTeaser(teaser_list[idx]);
				teaser_list[idx].spotId = teaser_container;
				teaser_list[idx].showTeaser =  function(multiTabTeaser) {
					return function() {
						multiTabTeaser.showTeaser($(this.id).readAttribute("sonderangebotIndex"))
					}
				}(this.multiTabTeaser)
			}

			this.multiTabTeaser.startAutoTeaser();
		},

		toggleAutoTeaser: function(element) {
			if(this.multiTabTeaser.autoPage) {
				element.className = "scroll_play";
				this.multiTabTeaser.stopAutoTeaser();
			} else {
				element.className = "scroll_pause";
				this.multiTabTeaser.startAutoTeaser();
			}
		},

		stopAutoTeaser: function() {
			this.multiTabTeaser.stopAutoTeaser();
		},

		startAutoTeaser: function() {
			this.multiTabTeaser.startAutoTeaser();
		}

	};

  function initMultipageTeaser() {
		MultiTeaserHelper.initilize($('sonderangebotContainer'));
		
  }
/*	
	function toggleAutoPage(element) {

console.info(scroll_handle.autoPage)

		if(scroll_handle.autoPage) {
			element.className = "scroll_play";
			scroll_handle.stopAutoTeaser();
		} else {
			element.className = "scroll_pause";
			scroll_handle.startAutoPage();
		}
console.info(scroll_handle.autoPage)
	}
*/