/*
 * Dependency : WBHelper ( WBHelper.js)
 */
var WBList = new Class( {
		Implements: [Options, Events],
		options : {	elements: {	
			main: {
				'tag' : 'div' ,
				'id': '' 
			},
			list: {
				'tag' : 'div' ,
				'id': ''
			},
			elementContainer: {
				tag: 'h3'			
			},
			element: {
				tag: 'span',
				'class': ''
			},
			subElementContainer: {
				tag: 'div'
			},
			subElement: {
				tag: 'span',
				'class': ''
			}},
			ns : {
				elementContainer : 'CONTAINER_' ,
				element : 'C_' ,
				subElementContainer : 'SUBCONTAINER_' ,
				subElement : 'S_' 
			},
			container : null /*,	
			onGetElementContainer : function( o ){
			},
			onGetSubElementContainer : function( o ){
			},	
			onGetElement : function(){
			},onGetSubElement : function(){
			},
			onAppendElement : function(){
			},
			onAppendSubElement : function(){
			},
			onAppendElements : function(){
			},
			*/
		},
		initialize: function(options){
			if( options )
				this.setOptions( options );			
		},
		render : function(  container , position){
			if (!this.main) {
				this.main = WBHelper.createElement(this.options.elements.main);
				
				if (container) {
					if ($type(container) == 'element') 
						this.container = container;
					else 
						this.container = $(container);
				}
				else 
					if (!this.options.container) 
						this.container = document.body;
					else {
						if ($type(this.options.container) == 'element') 
							this.container = this.options.container;
						else 
							this.container = $(this.options.container);
					}
				if (!position) 
					position = null;
				this.main = this.main.inject(this.container, position);
			}
			this.list = WBHelper.createElement(this.options.elements.list);
			this.list = this.list.inject(this.main, 'top');	
		},
		clear : function(){
			this.list.empty();
		},
		createElement: function(params){
			el = null; 	p = {}; ops = null;
			for (i in params) {
				if (i == 'subElements') {
					ops = params[i];
				}
				else 
					if (i == 'tag') {
						tag = params[i];
					}
					else{
						p[i] = params[i];
					}
			}
			el = new Element(tag, p);
			if (ops) {
				if (tag == 'select') 
					tag = 'option';
				if (tag == 'ul' || tag == 'ol') 
					tag = 'li';
					
				for (i = 0; i < ops.length; i++) {
					new Element(tag, ops[i]).inject(el);
				}
			}
			ops = null;sub = null; p = null;
			return el;
		},
		getElemProperty : function( element , property ){
			return this.options.elements[element][property] ? this.options.elements[element][property] : '' ;
		},
		getDOMId : function( elname , code ){
			return this.options.ns[elname] ? this.options.ns[elname] + code  : code ;
		},
		getCode: function(mix){
			code = '';
			if ($type(mix) == 'element' || $type(mix) == 'object') {
				code = mix.id;
			}else {
				code = mix;
			}
			reg = new RegExp( 	this.options.ns.elementContainer +'|'+
								this.options.ns.element+ '|'+ 
								this.options.ns.subElementContainer+'|'+
								this.options.ns.subElement  , 'i');
						
			return code.replace( reg, '');
		},	
		getElementContainer : function( code ){
			e = WBHelper.createElement( this.options.elements.elementContainer );
			e.setProperty( 'id', this.getDOMId( 'elementContainer' , code) );
			this.fireEvent( 'getElementContainer', { code : code , element : e } );
			return e ;
		},
		getElement: function(o){		
			e = WBHelper.createElement( this.options.elements.element  ); 
			e.setProperties( { 'text' : o.name , 'id' : this.getDOMId( 'element' , o.code)  }) ;	
			o.element = e
			this.fireEvent( 'getElement', o );
			return e ;
		},
		getSubElementContainer : function( code ){
			e = WBHelper.createElement( this.options.elements.subElementContainer );
			e.setProperty( 'id', this.getDOMId( 'subElementContainer' , code) );
			this.fireEvent( 'getSubElementContainer', { code : code , element : e} );
			return e ;
		},
		getSubElement: function(o){		
			e = WBHelper.createElement( this.options.elements.subElement  ); 
			e.setProperties( { 'text' : o.name , 'id' : this.getDOMId( 'subElement' , o.code)  }) ;	
			o.element = e ;
			this.fireEvent( 'getSubElement', o );
			return e ;		
		},
		appendElement: function( params ){
			con = this.getElementContainer( params.code ) ;
			params.children = [] ;
			elem = this.getElement( params  ) ;
			params.children[ params.children.length ] =  elem.inject( con);
			params.element = con.inject( this.list );	 
			this.fireEvent('appendElement', params );
			return params.element ; 
		},
		appendSubElement: function( elemCode , list ){
			con = this.getSubElementContainer( elemCode );
			col = [] ;
			for(k=0;k<list.length;k++){	
				elem = this.getSubElement( list[k] ) ;		
				col[col.length] = elem.inject( con );		
			}		
			con.inject( $( this.getDOMId( 'elementContainer', elemCode )) , 'after');
			this.fireEvent('appendSubElement', { code : elemCode , element : con, children : col});
		},
		appendElements : function( list ){
			col = [];
			for (l = 0; l < list.length; l++) {
				col[ col.length] = this.appendElement( list[l] );
			}
			this.fireEvent('appendElements' , { element: this.list, children : col });
			return col ;
		}
});