
(function() {
    var Y = Nb.Lib;
    
    var EVT_CLOSE = 'close';
    
    Nb.Wr.UI.Layer = function(config) {
        Nb.Wr.UI.Layer.superclass.constructor.apply(this, arguments);
    }
    
    Nb.Wr.UI.Layer.NAME = "wrLayer";
    Nb.Wr.UI.Layer.ATTRS = {
        colorSchema : {
            value: 'blue'
        },
        content : {
            value: '',
            getter : function(value) {
                if(this.get("element") === null) 
                {
                    return value;
                }
                
                return this._contentEl.get("innerHTML");                
            },
            setter : function(value) {
                if(this.get("element") === null) 
                {
                    return value;
                }

                if (typeof value == 'object')
                {
                    this._contentEl.set('innerHTML', ''); 
                    this._contentEl.appendChild(value);
                }
                else
                {
                    this._contentEl.set('innerHTML', value); 
                }
          
                return value;
            }
        }
    }
    
    Y.extend(Nb.Wr.UI.Layer, Nb.Core.UI.Layer, {
        getHtml : function() {
            return ['<div class="layer layer-' + this.get('colorSchema') + '">',
               '<div class="layer-body-wrapper">',
                   '<div class="layer-headline"></div>',
                   '<div class="layer-body-content"></div>',
                   '<div class="layer-background"></div>',                    
                '</div>',
                '<div class="layer-close"></div>',
                '<div class="layer-east"></div>',
                '<div class="layer-west"></div>',
                '<div class="layer-north-west"></div>',
                '<div class="layer-north">', 
                    '<div class="layer-north-inner"></div>',
                '</div>',
                '<div class="layer-north-east"></div>',
                '<div class="layer-south-west"></div>',
                '<div class="layer-south">',
                    '<div class="layer-south-inner"></div>',
                '</div>',
                '<div class="layer-south-east"></div>',       
            '</div>'].join("");
        }
    });
    
})();

