var Tabber = new Class({
     
      initialize : function(tabs,items,show){
           this.tabs = tabs;
           this.items = items;
           this.active = show || -1;

           this.tabs.each(function(tab,idx){
                 tab.addEvent('click', this.clicked.pass(idx,this) );
           },this);

           this.items.each(function(item,idx){
                new Element('div',{
                    'class' : 'closing',
                    'html' : '<a>Close</a>',
                    'events' : {
                        'click' : this.close.pass(idx,this)
                    }
                }).inject(item,'top');
            },this);
     },

     'clicked' : function(idx){
            if(this.active != -1) this.items[this.active].setStyle('display','none');
            this.items[idx].setStyle('display','block');
            this.active = idx;
     },

    'close' : function(idx){
        this.items[idx].setStyle('display','none'),
        this.active = -1;
    }

});

window.addEvent('domready',function(){
    new Tabber($$('a.popup'),$$('div.popup'));
    new Accordion('#AccordionContainer .AccordionTitle', '#AccordionContainer .AccordionContent',{display : -1});
    
	 var drag_zidx = 10;

	$$('#word-container li').makeDraggable({ onBeforeStart : function(el){ drag_zidx++; el.setStyle('z-index',drag_zidx); } });
});