/*
    Base Widget Class
    
        - widgets are based on a particular HTML structure
        - widget can be created from passed html string, element, or element id
        - widget init enriches HTML structure by attach points defined by classes
        - you can deal with widgets as an elements, just via $ - $(new widgets.Dropdown(..)).inject(document.body)
        - widgets are skinnable, that's mean innerHTML can be changed during runtime, 
          so critical widgets can implement dispose method, for unregistering document events etc.
*/

(function() {

    AUI.widgets = {};

    AUI.widgets.Base = new Class({

        Implements: [Events, Options],
        
        classes: null, // for sake of consistency, widgets classes goes here

        options: {
            skin: null, // optional skin instance
            document: document
        },
        
        initialize: function(el, options) {
			this.setOptions(options);
            if ($type(el) == 'string' && el.contains('<')) {
				var temp = this.options.document.createElement('div');
				temp.innerHTML = el;
				el = temp.getElementsByTagName('*')[0];
            }
            this.element = $(el);
        },

        registerSkinUnload: function() {
            var skin = this.options.skin || AUI.Skin && AUI.Skin.instances[0];
            if (!skin || !this.dispose) return;
            var that = this;
            skin.addEvent('unload', function() {
                skin.removeEvent.delay(1, skin, ['unload', arguments.callee]);
                that.dispose();
            });
        },

        toElement: function() {
            return this.element;
        },

        dispose: function() {
            this.element.destroy();
        }

    });

})();