var ProtoBox=Class.create({initialize:function(b,a){this.parent=$(b);this.config=a;this.config.timeout=this.config.timeout||5;this.config.defaultColor=this.config.defaultColor||"#ffffff";this.config.activeColor=this.config.activeColor||"#002465";this.config.pointerStartPos=this.config.pointerStartPos||20;this.config.pointerMoveDist=this.config.pointerMoveDist||35;this.headings=$(b).select("div.article > h2");this.articles=$(b).select("div.article");this.index=[0,0,0];this.pe="";this.animating=false;this.buildBox()},buildBox:function(){var b=new Element("div",{"class":"left"});var a=new Element("div",{"class":"right"});var c=new Element("img",{src:this.config.pathToPointer,alt:PbLib.g("Use cue to show the user which part of the ProtoBox is active"),id:"pBox-pointer"});this.parent.appendChild(b);this.parent.appendChild(a);this.headings.each(function(d){b.insert({bottom:d});d.observe("click",function(f,e){this.handleClick(d)}.bindAsEventListener(this,d))}.bind(this));this.articles.each(function(d){a.insert({bottom:d})});this.parent.insert({top:c});this.articles.each(function(d){d.hide();d.setAttribute("aria-hidden","true")});this.articles[this.index[1]].show();this.articles[this.index[1]].setAttribute("aria-hidden","false");this.headings[this.index[0]].setStyle({color:this.config.activeColor});this.pe=new PeriodicalExecuter(this.startLoop.bind(this),this.config.timeout)},handleClick:function(a){if(this.animating==false){this.index[2]=this.index[0];this.index[0]=this.headings.indexOf(a);this.startAnimation();this.pe.stop();this.pe.registerCallback()}},startLoop:function(){if(this.animating==false){this.index[2]=this.index[0];this.index[0]=this.index[0]+1;if(this.index[0]<this.headings.length){this.startAnimation()}else{this.index[0]=0;this.startAnimation()}}},startAnimation:function(){this.animateArticle();this.animating=true;new Effect.Morph("pBox-pointer",{style:{top:this.index[0]*this.config.pointerMoveDist+this.config.pointerStartPos+"px"},duration:0.8,afterFinish:function(){this.animating=false}.bind(this)});new Effect.Morph(this.headings[this.index[2]],{style:{color:this.config.defaultColor},duration:0.4,afterFinish:function(){new Effect.Morph(this.headings[this.index[0]],{style:{color:this.config.activeColor},duration:0.4})}.bind(this)})},animateArticle:function(){new Effect.Fade(this.articles[this.index[1]],{duration:0.4,afterFinish:function(){this.articles[this.index[1]].setAttribute("aria-hidden","true");this.index[1]=this.index[0];new Effect.Appear(this.articles[this.index[1]],{duration:0.4,afterFinish:function(){this.articles[this.index[1]].setAttribute("aria-hidden","false")}.bind(this)})}.bind(this)})}});