Em_selector_gradable = function(){
    this.gradData = [];
}

Em_selector_gradable.factory = function(xInput, datas,opt, boxOptions){
    selector = new Em_selector_gradable();
    selector._init(xInput, datas,opt, boxOptions);
    return selector;
}

Em_selector_gradable.prototype = new Em_selector_simple();

Em_selector_gradable.prototype.setGradData = function(gradData){
    function _setParentNode(node, parent){
        if(typeof(node) == 'object'){
            if(parent != null){
                node['_parent_'] = parent;
            }
            for(key in node){
                if(key != '_parent_'){
                    _setParentNode(node[key], node);
                }
            }
        }
    }
    //try add node of parent grad
    _setParentNode(gradData);
    this.gradData = gradData;
}

Em_selector_gradable.prototype.onShowFirst = function(){
    //Add a btn to reutrn rott
    //this.btnRoot = $('<input type="button" value="R">').appendTo(this.btnDiv);
    //this.btnRoot.bind('click', {selector: this}, this.onRootClick);
}

Em_selector_gradable.prototype.onShow = function(){
    this._drawGrad(this.gradData);
}

//
Em_selector_gradable.prototype._heightSelected = function(){
    var html = '>>';
    
    div = this.notesDiv;
    div.empty();
    
    if(this.options.multiple){
        inputType = 'checkbox';
    }else{
        inputType = 'radio';
    }
    
    //reset all items
    for(key in this.items){
        this.items[key].removeClass('selected');
        $("input:"+ inputType,this.items[key]).attr('checked',false);
    }
    
    for(key in this.items_selected){
    
        //list selected
        $('<span><input type="'+ inputType +'" checked>'+  this.items_selected[key] + '</span>').appendTo(div)
            .bind('click', {selector : this, index : key}, this.onItemClick);
        
        //height current items
        if(key in this.items){
            this.items[key].addClass('selected');
            $("input:"+ inputType,this.items[key]).attr('checked',true);
        }
        
    }
    
}

Em_selector_gradable.prototype._drawGrad = function(grad){

    this.contentDiv.empty();
    this.items = []
    
    ul = $("<ul class='Emxs_list_grid'></ul>").appendTo(this.contentDiv);
    for(key in grad){
        if(key == '_title_'){
            continue;
        }
    
        var item = $("<li></li>").appendTo(ul);
        
        if(key == '_parent_'){
            item.html('<< Return');
            item.bind('click', {selector : this, grad : grad[key]}, this.onNodeClick);
            item.addClass('node');
            item.addClass('return_parent');
            item.prependTo(ul);
        }else if(typeof grad[key] == 'object'){
            if(grad[key]['_title_'] != null){
                title = grad[key]['_title_'];
            }else if (key in this.datas){
                title = this.datas[key];
            }else{
                title = 'NONE Title';
            }
            item.html(title);
            item.bind('click', {selector : this, grad : grad[key]}, this.onNodeClick);
            item.addClass('node');
        }else{
            if(this.options.multiple){
                inputType = 'checkbox';
            }else{
                inputType = 'radio';
            }
            if(typeof grad[key] == 'string'){
                item.html('<input type="'+ inputType +'">' + grad[key]);
            }else{
                item.html('<input type="'+ inputType +'">' + this.datas[key]);
            }        
            item.bind('click', {selector : this, index : key}, this.onItemClick);
            item.addClass('item');        
        }
         
        item.mouseover(function(){$(this).addClass('active');});
        item.mouseout(function(){$(this).removeClass('active');});
        this.items[key] = item;
    }
    
    this._heightSelected();
}

Em_selector_gradable.prototype.onRootClick = function(event){
    event.data.selector._drawGrad(event.data.selector.gradData);
}

Em_selector_gradable.prototype.itemClick = function(key){
    if(key in this.items_selected){
        this.removeSelect(key);
    }else{
        this.addSelect(key);
    }
    
    this._heightSelected();
    
    /*
    if(!this.options.multiple){
        this.setInput();
        this.close();
    }
    */
}

Em_selector_gradable.prototype.onNodeClick = function(event){
    event.data.selector._drawGrad(event.data.grad);
}