var tab = function(){
    
    return {
        Elm : false,
        
        init : function(id) {
            this.Elm = Ext.get(id);
            
            this.Elm.select('.content > div').enableDisplayMode().hide();
            this.Elm.select('.header li:last-child', true).setStyle('border', '0');
            this.Elm.select('.header li:last-child').createChild({
                tag : 'img',
                src : 'images/tab/corner/tl.png',
                cls : 'tl'
            });
            
            this.Elm.select('ul.header li:last-child').createChild({
                tag : 'img',
                src : 'images/tab/corner/tr.png',
                cls : 'tr'
            });
            
            this.rules();
            
            return this.Elm.select('ul.header li');
        },
        
        rules : function() {
            var tabs = this.Elm.select('ul.header li');
            
            tabs.on('mouseover', function(e) {
                Ext.get(e.target).setStyle('cursor', 'pointer');
            });
            tabs.on('mouseout', function(e) {
                Ext.get(e.target).setStyle('cursor', 'default');
            });
        },
        
        pushContent : function(e, o, opt) {
            this.Elm.select('.content > div').enableDisplayMode().hide();
            this.Elm.select('.header li').addClass('off')
            
            var selector = '.content > div#'+opt;
            this .Elm.select(selector).show(true);
            Ext.get(e.target).removeClass('off');
        }
    }    
}();
