Index: openacs-4/packages/ajaxhelper/www/resources/yui/container/container.js
===================================================================
RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/resources/yui/container/container.js,v
diff -u -r1.3 -r1.4
--- openacs-4/packages/ajaxhelper/www/resources/yui/container/container.js	8 Sep 2007 14:22:01 -0000	1.3
+++ openacs-4/packages/ajaxhelper/www/resources/yui/container/container.js	9 Apr 2009 17:03:49 -0000	1.4
@@ -1,8 +1,8 @@
 /*
-Copyright (c) 2007, Yahoo! Inc. All rights reserved.
+Copyright (c) 2009, Yahoo! Inc. All rights reserved.
 Code licensed under the BSD License:
 http://developer.yahoo.net/yui/license.txt
-version: 2.3.0
+version: 2.7.0
 */
 (function () {
 
@@ -18,26 +18,20 @@
     * @param {Object} owner The owner Object to which this Config Object belongs
     */
     YAHOO.util.Config = function (owner) {
-    
+
         if (owner) {
-    
             this.init(owner);
-    
         }
-    
-        if (!owner) { 
-        
-    
-        }
-    
+
+
     };
 
 
     var Lang = YAHOO.lang,
-        CustomEvent = YAHOO.util.CustomEvent,        
+        CustomEvent = YAHOO.util.CustomEvent,
         Config = YAHOO.util.Config;
-    
 
+
     /**
      * Constant representing the CustomEvent type for the config changed event.
      * @property YAHOO.util.Config.CONFIG_CHANGED_EVENT
@@ -203,16 +197,19 @@
         getConfig: function () {
         
             var cfg = {},
+                currCfg = this.config,
                 prop,
                 property;
                 
-            for (prop in this.config) {
-                property = this.config[prop];
-                if (property && property.event) {
-                    cfg[prop] = property.value;
+            for (prop in currCfg) {
+                if (Lang.hasOwnProperty(currCfg, prop)) {
+                    property = currCfg[prop];
+                    if (property && property.event) {
+                        cfg[prop] = property.value;
+                    }
                 }
             }
-            
+
             return cfg;
         },
         
@@ -353,7 +350,7 @@
                         if (queueItem) {
                             queueItemKey = queueItem[0];
                             queueItemValue = queueItem[1];
-                            
+
                             if (queueItemKey == key) {
     
                                 /*
@@ -381,37 +378,37 @@
                 }
         
                 if (property.supercedes) {
-        
+
                     sLen = property.supercedes.length;
-        
+
                     for (s = 0; s < sLen; s++) {
-        
+
                         supercedesCheck = property.supercedes[s];
                         qLen = this.eventQueue.length;
-        
+
                         for (q = 0; q < qLen; q++) {
                             queueItemCheck = this.eventQueue[q];
-        
+
                             if (queueItemCheck) {
                                 queueItemCheckKey = queueItemCheck[0];
                                 queueItemCheckValue = queueItemCheck[1];
-                                
+
                                 if (queueItemCheckKey == 
                                     supercedesCheck.toLowerCase() ) {
-    
+
                                     this.eventQueue.push([queueItemCheckKey, 
                                         queueItemCheckValue]);
-    
+
                                     this.eventQueue[q] = null;
                                     break;
-    
+
                                 }
                             }
                         }
                     }
                 }
 
-        
+
                 return true;
             } else {
                 return false;
@@ -460,37 +457,23 @@
         applyConfig: function (userConfig, init) {
         
             var sKey,
-                oValue,
                 oConfig;
 
             if (init) {
-
                 oConfig = {};
-
                 for (sKey in userConfig) {
-                
                     if (Lang.hasOwnProperty(userConfig, sKey)) {
-
                         oConfig[sKey.toLowerCase()] = userConfig[sKey];
-
                     }
-                
                 }
-
                 this.initialConfig = oConfig;
-
             }
 
             for (sKey in userConfig) {
-            
                 if (Lang.hasOwnProperty(userConfig, sKey)) {
-            
                     this.queueProperty(sKey, userConfig[sKey]);
-                
                 }
-
             }
-
         },
         
         /**
@@ -499,11 +482,13 @@
         * @method refresh
         */
         refresh: function () {
-        
+
             var prop;
-        
+
             for (prop in this.config) {
-                this.refireEvent(prop);
+                if (Lang.hasOwnProperty(this.config, prop)) {
+                    this.refireEvent(prop);
+                }
             }
         },
         
@@ -527,9 +512,14 @@
                     key = queueItem[0];
                     value = queueItem[1];
                     property = this.config[key];
-        
+
                     property.value = value;
-        
+
+                    // Clear out queue entry, to avoid it being 
+                    // re-added to the queue by any queueProperty/supercedes
+                    // calls which are invoked during fireEvent
+                    this.eventQueue[i] = null;
+
                     this.fireEvent(key,value);
                 }
             }
@@ -557,19 +547,12 @@
             var property = this.config[key.toLowerCase()];
     
             if (property && property.event) {
-    
                 if (!Config.alreadySubscribed(property.event, handler, obj)) {
-    
                     property.event.subscribe(handler, obj, override);
-    
                 }
-    
                 return true;
-    
             } else {
-    
                 return false;
-    
             }
     
         },
@@ -689,31 +672,24 @@
             i;
 
         if (nSubscribers > 0) {
-
             i = nSubscribers - 1;
-        
             do {
-
                 subsc = evt.subscribers[i];
-
                 if (subsc && subsc.obj == obj && subsc.fn == fn) {
-        
                     return true;
-        
-                }    
-            
+                }
             }
             while (i--);
-        
         }
-    
+
         return false;
-    
+
     };
-    
+
     YAHOO.lang.augmentProto(Config, YAHOO.util.EventProvider);
 
 }());
+
 (function () {
 
     /**
@@ -746,25 +722,19 @@
     * documentation for more details.
     */
     YAHOO.widget.Module = function (el, userConfig) {
-    
         if (el) {
-    
             this.init(el, userConfig);
-    
         } else {
-    
-    
         }
-    
     };
 
-
     var Dom = YAHOO.util.Dom,
         Config = YAHOO.util.Config,
         Event = YAHOO.util.Event,
         CustomEvent = YAHOO.util.CustomEvent,
         Module = YAHOO.widget.Module,
-        
+        UA = YAHOO.env.ua,
+
         m_oModuleTemplate,
         m_oHeaderTemplate,
         m_oBodyTemplate,
@@ -778,7 +748,6 @@
         * @type Object
         */
         EVENT_TYPES = {
-        
             "BEFORE_INIT": "beforeInit",
             "INIT": "init",
             "APPEND": "append",
@@ -793,7 +762,6 @@
             "SHOW": "show",
             "BEFORE_HIDE": "beforeHide",
             "HIDE": "hide"
-        
         },
             
         /**
@@ -810,21 +778,24 @@
                 value: true, 
                 validator: YAHOO.lang.isBoolean 
             },
-        
-            "EFFECT": { 
-                key: "effect", 
-                suppressEvent: true, 
-                supercedes: ["visible"] 
+
+            "EFFECT": {
+                key: "effect",
+                suppressEvent: true,
+                supercedes: ["visible"]
             },
-        
-            "MONITOR_RESIZE": { 
-                key: "monitorresize", 
-                value: true  
+
+            "MONITOR_RESIZE": {
+                key: "monitorresize",
+                value: true
+            },
+
+            "APPEND_TO_DOCUMENT_BODY": {
+                key: "appendtodocumentbody",
+                value: false
             }
-        
         };
 
-    
     /**
     * Constant representing the prefix path to use for non-secure images
     * @property YAHOO.widget.Module.IMG_ROOT
@@ -860,7 +831,7 @@
     * @type String
     */
     Module.CSS_HEADER = "hd";
-    
+
     /**
     * Constant representing the module body
     * @property YAHOO.widget.Module.CSS_BODY
@@ -888,20 +859,46 @@
     * @type String
     */
     Module.RESIZE_MONITOR_SECURE_URL = "javascript:false;";
-    
+
     /**
+    * Constant representing the buffer amount (in pixels) to use when positioning
+    * the text resize monitor offscreen. The resize monitor is positioned
+    * offscreen by an amount eqaul to its offsetHeight + the buffer value.
+    * 
+    * @property YAHOO.widget.Module.RESIZE_MONITOR_BUFFER
+    * @static
+    * @type Number
+    */
+    // Set to 1, to work around pixel offset in IE8, which increases when zoom is used
+    Module.RESIZE_MONITOR_BUFFER = 1;
+
+    /**
     * Singleton CustomEvent fired when the font size is changed in the browser.
     * Opera's "zoom" functionality currently does not support text 
     * size detection.
     * @event YAHOO.widget.Module.textResizeEvent
     */
     Module.textResizeEvent = new CustomEvent("textResize");
 
+    /**
+     * Helper utility method, which forces a document level 
+     * redraw for Opera, which can help remove repaint
+     * irregularities after applying DOM changes.
+     *
+     * @method YAHOO.widget.Module.forceDocumentRedraw
+     * @static
+     */
+    Module.forceDocumentRedraw = function() {
+        var docEl = document.documentElement;
+        if (docEl) {
+            docEl.className += " ";
+            docEl.className = YAHOO.lang.trim(docEl.className);
+        }
+    };
 
     function createModuleTemplate() {
 
         if (!m_oModuleTemplate) {
-
             m_oModuleTemplate = document.createElement("div");
             
             m_oModuleTemplate.innerHTML = ("<div class=\"" + 
@@ -912,55 +909,34 @@
             m_oHeaderTemplate = m_oModuleTemplate.firstChild;
             m_oBodyTemplate = m_oHeaderTemplate.nextSibling;
             m_oFooterTemplate = m_oBodyTemplate.nextSibling;
-
         }
 
         return m_oModuleTemplate;
-
     }
 
-
     function createHeader() {
-
         if (!m_oHeaderTemplate) {
-        
             createModuleTemplate();
-        
         }
-        
         return (m_oHeaderTemplate.cloneNode(false));
-
     }
-    
 
     function createBody() {
-
         if (!m_oBodyTemplate) {
-        
             createModuleTemplate();
-        
         }
-        
         return (m_oBodyTemplate.cloneNode(false));
-    
     }
-    
 
     function createFooter() {
-
         if (!m_oFooterTemplate) {
-        
             createModuleTemplate();
-        
         }
-        
         return (m_oFooterTemplate.cloneNode(false));
-
     }
-    
 
     Module.prototype = {
-    
+
         /**
         * The class's constructor function
         * @property contructor
@@ -974,35 +950,35 @@
         * @type HTMLElement
         */
         element: null,
-        
+
         /**
         * The header element, denoted with CSS class "hd"
         * @property header
         * @type HTMLElement
         */
         header: null,
-        
+
         /**
         * The body element, denoted with CSS class "bd"
         * @property body
         * @type HTMLElement
         */
         body: null,
-        
+
         /**
         * The footer element, denoted with CSS class "ft"
         * @property footer
         * @type HTMLElement
         */
         footer: null,
-        
+
         /**
         * The id of the element
         * @property id
         * @type String
         */
         id: null,
-        
+
         /**
         * A string representing the root path for all images created by
         * a Module instance.
@@ -1012,16 +988,16 @@
         * @type String
         */
         imageRoot: Module.IMG_ROOT,
-    
+
         /**
         * Initializes the custom events for Module which are fired 
         * automatically at appropriate times by the Module class.
         * @method initEvents
         */
         initEvents: function () {
-        
+
             var SIGNATURE = CustomEvent.LIST;
-        
+
             /**
             * CustomEvent fired prior to class initalization.
             * @event beforeInitEvent
@@ -1030,7 +1006,7 @@
             */
             this.beforeInitEvent = this.createEvent(EVENT_TYPES.BEFORE_INIT);
             this.beforeInitEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired after class initalization.
             * @event initEvent
@@ -1039,20 +1015,19 @@
             */  
             this.initEvent = this.createEvent(EVENT_TYPES.INIT);
             this.initEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired when the Module is appended to the DOM
             * @event appendEvent
             */
             this.appendEvent = this.createEvent(EVENT_TYPES.APPEND);
             this.appendEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired before the Module is rendered
             * @event beforeRenderEvent
             */
-            this.beforeRenderEvent = 
-                this.createEvent(EVENT_TYPES.BEFORE_RENDER);
+            this.beforeRenderEvent = this.createEvent(EVENT_TYPES.BEFORE_RENDER);
             this.beforeRenderEvent.signature = SIGNATURE;
         
             /**
@@ -1069,8 +1044,7 @@
             * @param {String/HTMLElement} content String/element representing 
             * the new header content
             */
-            this.changeHeaderEvent = 
-                this.createEvent(EVENT_TYPES.CHANGE_HEADER);
+            this.changeHeaderEvent = this.createEvent(EVENT_TYPES.CHANGE_HEADER);
             this.changeHeaderEvent.signature = SIGNATURE;
             
             /**
@@ -1089,77 +1063,67 @@
             * @param {String/HTMLElement} content String/element representing 
             * the new footer content
             */
-            this.changeFooterEvent = 
-                this.createEvent(EVENT_TYPES.CHANGE_FOOTER);
+            this.changeFooterEvent = this.createEvent(EVENT_TYPES.CHANGE_FOOTER);
             this.changeFooterEvent.signature = SIGNATURE;
         
             /**
             * CustomEvent fired when the content of the Module is modified
             * @event changeContentEvent
             */
-            this.changeContentEvent = 
-                this.createEvent(EVENT_TYPES.CHANGE_CONTENT);
+            this.changeContentEvent = this.createEvent(EVENT_TYPES.CHANGE_CONTENT);
             this.changeContentEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired when the Module is destroyed
             * @event destroyEvent
             */
             this.destroyEvent = this.createEvent(EVENT_TYPES.DESTORY);
             this.destroyEvent.signature = SIGNATURE;
-            
+
             /**
             * CustomEvent fired before the Module is shown
             * @event beforeShowEvent
             */
             this.beforeShowEvent = this.createEvent(EVENT_TYPES.BEFORE_SHOW);
             this.beforeShowEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired after the Module is shown
             * @event showEvent
             */
             this.showEvent = this.createEvent(EVENT_TYPES.SHOW);
             this.showEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired before the Module is hidden
             * @event beforeHideEvent
             */
             this.beforeHideEvent = this.createEvent(EVENT_TYPES.BEFORE_HIDE);
             this.beforeHideEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired after the Module is hidden
             * @event hideEvent
             */
             this.hideEvent = this.createEvent(EVENT_TYPES.HIDE);
             this.hideEvent.signature = SIGNATURE;
         }, 
-        
+
         /**
         * String representing the current user-agent platform
         * @property platform
         * @type String
         */
         platform: function () {
-        
             var ua = navigator.userAgent.toLowerCase();
-        
+
             if (ua.indexOf("windows") != -1 || ua.indexOf("win32") != -1) {
-        
                 return "windows";
-        
             } else if (ua.indexOf("macintosh") != -1) {
-        
                 return "mac";
-        
             } else {
-        
                 return false;
-        
             }
-        
         }(),
         
         /**
@@ -1169,40 +1133,24 @@
         * @type String
         */
         browser: function () {
-        
             var ua = navigator.userAgent.toLowerCase();
-            
             /*
                  Check Opera first in case of spoof and check Safari before
                  Gecko since Safari's user agent string includes "like Gecko"
             */
-
             if (ua.indexOf('opera') != -1) { 
-            
                 return 'opera';
-            
             } else if (ua.indexOf('msie 7') != -1) {
-            
                 return 'ie7';
-            
             } else if (ua.indexOf('msie') != -1) {
-            
                 return 'ie';
-            
             } else if (ua.indexOf('safari') != -1) { 
-            
                 return 'safari';
-            
             } else if (ua.indexOf('gecko') != -1) {
-            
                 return 'gecko';
-            
             } else {
-            
                 return false;
-            
             }
-        
         }(),
         
         /**
@@ -1212,27 +1160,19 @@
         * @type Boolean
         */
         isSecure: function () {
-        
             if (window.location.href.toLowerCase().indexOf("https") === 0) {
-        
                 return true;
-        
             } else {
-        
                 return false;
-        
             }
-        
         }(),
         
         /**
         * Initializes the custom events for Module which are fired 
         * automatically at appropriate times by the Module class.
         */
         initDefaultConfig: function () {
-    
             // Add properties //
-        
             /**
             * Specifies whether the Module is visible on the page.
             * @config visible
@@ -1244,10 +1184,20 @@
                 value: DEFAULT_CONFIG.VISIBLE.value, 
                 validator: DEFAULT_CONFIG.VISIBLE.validator
             });
-            
+
             /**
+            * <p>
             * Object or array of objects representing the ContainerEffect 
             * classes that are active for animating the container.
+            * </p>
+            * <p>
+            * <strong>NOTE:</strong> Although this configuration 
+            * property is introduced at the Module level, an out of the box
+            * implementation is not shipped for the Module class so setting
+            * the proroperty on the Module class has no effect. The Overlay 
+            * class is the first class to provide out of the box ContainerEffect 
+            * support.
+            * </p>
             * @config effect
             * @type Object
             * @default null
@@ -1256,7 +1206,7 @@
                 suppressEvent: DEFAULT_CONFIG.EFFECT.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.EFFECT.supercedes
             });
-            
+
             /**
             * Specifies whether to create a special proxy iframe to monitor 
             * for user font resizing in the document
@@ -1268,15 +1218,36 @@
                 handler: this.configMonitorResize,
                 value: DEFAULT_CONFIG.MONITOR_RESIZE.value
             });
-            
+
+            /**
+            * Specifies if the module should be rendered as the first child 
+            * of document.body or appended as the last child when render is called
+            * with document.body as the "appendToNode".
+            * <p>
+            * Appending to the body while the DOM is still being constructed can 
+            * lead to Operation Aborted errors in IE hence this flag is set to 
+            * false by default.
+            * </p>
+            * 
+            * @config appendtodocumentbody
+            * @type Boolean
+            * @default false
+            */
+            this.cfg.addProperty(DEFAULT_CONFIG.APPEND_TO_DOCUMENT_BODY.key, {
+                value: DEFAULT_CONFIG.APPEND_TO_DOCUMENT_BODY.value
+            });
         },
-        
+
         /**
         * The Module class's initialization method, which is executed for
         * Module and all of its subclasses. This method is automatically 
         * called by the constructor, and  sets up all DOM references for 
         * pre-existing markup, and creates required markup if it is not 
         * already present.
+        * <p>
+        * If the element passed in does not have an id, one will be generated
+        * for it.
+        * </p>
         * @method init
         * @param {String} el The element ID representing the Module <em>OR</em>
         * @param {HTMLElement} el The element representing the Module
@@ -1285,321 +1256,323 @@
         * See configuration documentation for more details.
         */
         init: function (el, userConfig) {
-        
-            var elId, i, child;
-        
+
+            var elId, child;
+
             this.initEvents();
-        
             this.beforeInitEvent.fire(Module);
-        
+
             /**
             * The Module's Config object used for monitoring 
             * configuration properties.
             * @property cfg
             * @type YAHOO.util.Config
             */
             this.cfg = new Config(this);
-        
+
             if (this.isSecure) {
                 this.imageRoot = Module.IMG_ROOT_SSL;
             }
-        
-            if (typeof el == "string") {
 
+            if (typeof el == "string") {
                 elId = el;
-        
                 el = document.getElementById(el);
-
                 if (! el) {
-
                     el = (createModuleTemplate()).cloneNode(false);
-
                     el.id = elId;
-
                 }
-
             }
-        
+
+            this.id = Dom.generateId(el);
             this.element = el;
-        
-            if (el.id) {
-                this.id = el.id;
-            }
-        
+
             child = this.element.firstChild;
-            
-            if (child) {
 
+            if (child) {
+                var fndHd = false, fndBd = false, fndFt = false;
                 do {
-
-                    switch (child.className) {
-    
-                    case Module.CSS_HEADER:
-    
-                        this.header = child;
-    
-                        break;
-    
-                    case Module.CSS_BODY:
-    
-                        this.body = child;
-    
-                        break;
-    
-                    case Module.CSS_FOOTER:
-    
-                        this.footer = child;
-    
-                        break;
-    
+                    // We're looking for elements
+                    if (1 == child.nodeType) {
+                        if (!fndHd && Dom.hasClass(child, Module.CSS_HEADER)) {
+                            this.header = child;
+                            fndHd = true;
+                        } else if (!fndBd && Dom.hasClass(child, Module.CSS_BODY)) {
+                            this.body = child;
+                            fndBd = true;
+                        } else if (!fndFt && Dom.hasClass(child, Module.CSS_FOOTER)){
+                            this.footer = child;
+                            fndFt = true;
+                        }
                     }
-                    
                 } while ((child = child.nextSibling));
-            
             }
 
-        
             this.initDefaultConfig();
-        
+
             Dom.addClass(this.element, Module.CSS_MODULE);
-        
+
             if (userConfig) {
                 this.cfg.applyConfig(userConfig, true);
             }
-        
+
             /*
                 Subscribe to the fireQueue() method of Config so that any 
                 queued configuration changes are excecuted upon render of 
                 the Module
             */ 
-            
-            if (!Config.alreadySubscribed(this.renderEvent, 
-                this.cfg.fireQueue, this.cfg)) {
 
+            if (!Config.alreadySubscribed(this.renderEvent, this.cfg.fireQueue, this.cfg)) {
                 this.renderEvent.subscribe(this.cfg.fireQueue, this.cfg, true);
-
             }
-        
+
             this.initEvent.fire(Module);
         },
-        
+
         /**
-        * Initialized an empty IFRAME that is placed out of the visible area 
+        * Initialize an empty IFRAME that is placed out of the visible area 
         * that can be used to detect text resize.
         * @method initResizeMonitor
         */
         initResizeMonitor: function () {
-        
+
+            var isGeckoWin = (UA.gecko && this.platform == "windows");
+            if (isGeckoWin) {
+                // Help prevent spinning loading icon which 
+                // started with FireFox 2.0.0.8/Win
+                var self = this;
+                setTimeout(function(){self._initResizeMonitor();}, 0);
+            } else {
+                this._initResizeMonitor();
+            }
+        },
+
+        /**
+         * Create and initialize the text resize monitoring iframe.
+         * 
+         * @protected
+         * @method _initResizeMonitor
+         */
+        _initResizeMonitor : function() {
+
             var oDoc, 
                 oIFrame, 
                 sHTML;
-        
+
             function fireTextResize() {
-        
                 Module.textResizeEvent.fire();
-        
             }
-        
-            if (!YAHOO.env.ua.opera) {
-        
+
+            if (!UA.opera) {
                 oIFrame = Dom.get("_yuiResizeMonitor");
-        
+
+                var supportsCWResize = this._supportsCWResize();
+
                 if (!oIFrame) {
-        
                     oIFrame = document.createElement("iframe");
-        
-                    if (this.isSecure && Module.RESIZE_MONITOR_SECURE_URL && 
-                        YAHOO.env.ua.ie) {
-    
+
+                    if (this.isSecure && Module.RESIZE_MONITOR_SECURE_URL && UA.ie) {
                         oIFrame.src = Module.RESIZE_MONITOR_SECURE_URL;
-    
                     }
 
+                    if (!supportsCWResize) {
+                        // Can't monitor on contentWindow, so fire from inside iframe
+                        sHTML = ["<html><head><script ",
+                                 "type=\"text/javascript\">",
+                                 "window.onresize=function(){window.parent.",
+                                 "YAHOO.widget.Module.textResizeEvent.",
+                                 "fire();};<",
+                                 "\/script></head>",
+                                 "<body></body></html>"].join('');
 
-                    /*
-                        Need to set "src" attribute of the iframe to 
-                        prevent the browser from reporting duplicate 
-                        cookies. (See SourceForge bug #1721755)
-                    */
-        
-                    if (YAHOO.env.ua.gecko) {
-
-                        sHTML = "<html><head><script " +
-                                "type=\"text/javascript\">" + 
-                                "window.onresize=function(){window.parent." +
-                                "YAHOO.widget.Module.textResizeEvent." +
-                                "fire();};window.parent.YAHOO.widget.Module." +
-                                "textResizeEvent.fire();</script></head>" + 
-                                "<body></body></html>";
-
-                        oIFrame.src = "data:text/html;charset=utf-8," + 
-                            encodeURIComponent(sHTML);
-
+                        oIFrame.src = "data:text/html;charset=utf-8," + encodeURIComponent(sHTML);
                     }
 
                     oIFrame.id = "_yuiResizeMonitor";
-                    
+                    oIFrame.title = "Text Resize Monitor";
                     /*
                         Need to set "position" property before inserting the 
                         iframe into the document or Safari's status bar will 
                         forever indicate the iframe is loading 
                         (See SourceForge bug #1723064)
                     */
-                    
                     oIFrame.style.position = "absolute";
                     oIFrame.style.visibility = "hidden";
-        
-                    document.body.appendChild(oIFrame);
-        
-                    oIFrame.style.width = "10em";
-                    oIFrame.style.height = "10em";
-                    oIFrame.style.top = (-1 * oIFrame.offsetHeight) + "px";
-                    oIFrame.style.left = (-1 * oIFrame.offsetWidth) + "px";
+
+                    var db = document.body,
+                        fc = db.firstChild;
+                    if (fc) {
+                        db.insertBefore(oIFrame, fc);
+                    } else {
+                        db.appendChild(oIFrame);
+                    }
+
+                    oIFrame.style.width = "2em";
+                    oIFrame.style.height = "2em";
+                    oIFrame.style.top = (-1 * (oIFrame.offsetHeight + Module.RESIZE_MONITOR_BUFFER)) + "px";
+                    oIFrame.style.left = "0";
                     oIFrame.style.borderWidth = "0";
                     oIFrame.style.visibility = "visible";
-        
-                    if (YAHOO.env.ua.webkit) {
-        
+
+                    /*
+                       Don't open/close the document for Gecko like we used to, since it
+                       leads to duplicate cookies. (See SourceForge bug #1721755)
+                    */
+                    if (UA.webkit) {
                         oDoc = oIFrame.contentWindow.document;
-        
                         oDoc.open();
                         oDoc.close();
-        
                     }
-
                 }
-        
+
                 if (oIFrame && oIFrame.contentWindow) {
+                    Module.textResizeEvent.subscribe(this.onDomResize, this, true);
 
-                    Module.textResizeEvent.subscribe(this.onDomResize, 
-                        this, true);
-        
                     if (!Module.textResizeInitialized) {
-
-                        if (!Event.on(oIFrame.contentWindow, "resize", 
-                            fireTextResize)) {
-
-                            /*
-                                 This will fail in IE if document.domain has 
-                                 changed, so we must change the listener to 
-                                 use the oIFrame element instead
-                            */
-
-                            Event.on(oIFrame, "resize", fireTextResize);
-
+                        if (supportsCWResize) {
+                            if (!Event.on(oIFrame.contentWindow, "resize", fireTextResize)) {
+                                /*
+                                     This will fail in IE if document.domain has 
+                                     changed, so we must change the listener to 
+                                     use the oIFrame element instead
+                                */
+                                Event.on(oIFrame, "resize", fireTextResize);
+                            }
                         }
-
                         Module.textResizeInitialized = true;
-
                     }
-
                     this.resizeMonitor = oIFrame;
-
                 }
-        
             }
-        
         },
-        
+
         /**
+         * Text resize monitor helper method.
+         * Determines if the browser supports resize events on iframe content windows.
+         * 
+         * @private
+         * @method _supportsCWResize
+         */
+        _supportsCWResize : function() {
+            /*
+                Gecko 1.8.0 (FF1.5), 1.8.1.0-5 (FF2) won't fire resize on contentWindow.
+                Gecko 1.8.1.6+ (FF2.0.0.6+) and all other browsers will fire resize on contentWindow.
+
+                We don't want to start sniffing for patch versions, so fire textResize the same
+                way on all FF2 flavors
+             */
+            var bSupported = true;
+            if (UA.gecko && UA.gecko <= 1.8) {
+                bSupported = false;
+            }
+            return bSupported;
+        },
+
+        /**
         * Event handler fired when the resize monitor element is resized.
         * @method onDomResize
         * @param {DOMEvent} e The DOM resize event
         * @param {Object} obj The scope object passed to the handler
         */
         onDomResize: function (e, obj) {
-        
-            var nLeft = -1 * this.resizeMonitor.offsetWidth,
-                nTop = -1 * this.resizeMonitor.offsetHeight;
-        
+
+            var nTop = -1 * (this.resizeMonitor.offsetHeight + Module.RESIZE_MONITOR_BUFFER);
+
             this.resizeMonitor.style.top = nTop + "px";
-            this.resizeMonitor.style.left =  nLeft + "px";
-        
+            this.resizeMonitor.style.left = "0";
         },
-        
+
         /**
-        * Sets the Module's header content to the HTML specified, or appends 
+        * Sets the Module's header content to the string specified, or appends 
         * the passed element to the header. If no header is present, one will 
-        * be automatically created.
+        * be automatically created. An empty string can be passed to the method
+        * to clear the contents of the header.
+        * 
         * @method setHeader
-        * @param {String} headerContent The HTML used to set the header 
+        * @param {String} headerContent The string used to set the header.
+        * As a convenience, non HTMLElement objects can also be passed into 
+        * the method, and will be treated as strings, with the header innerHTML
+        * set to their default toString implementations.
         * <em>OR</em>
         * @param {HTMLElement} headerContent The HTMLElement to append to 
-        * the header
+        * <em>OR</em>
+        * @param {DocumentFragment} headerContent The document fragment 
+        * containing elements which are to be added to the header
         */
         setHeader: function (headerContent) {
-
             var oHeader = this.header || (this.header = createHeader());
-        
-            if (typeof headerContent == "string") {
 
-                oHeader.innerHTML = headerContent;
-
-            } else {
-
+            if (headerContent.nodeName) {
                 oHeader.innerHTML = "";
                 oHeader.appendChild(headerContent);
-
+            } else {
+                oHeader.innerHTML = headerContent;
             }
-        
+
             this.changeHeaderEvent.fire(headerContent);
             this.changeContentEvent.fire();
 
         },
-        
+
         /**
         * Appends the passed element to the header. If no header is present, 
         * one will be automatically created.
         * @method appendToHeader
-        * @param {HTMLElement} element The element to append to the header
+        * @param {HTMLElement | DocumentFragment} element The element to 
+        * append to the header. In the case of a document fragment, the
+        * children of the fragment will be appended to the header.
         */
         appendToHeader: function (element) {
-
             var oHeader = this.header || (this.header = createHeader());
-        
+
             oHeader.appendChild(element);
 
             this.changeHeaderEvent.fire(element);
             this.changeContentEvent.fire();
 
         },
-        
+
         /**
-        * Sets the Module's body content to the HTML specified, or appends the
-        * passed element to the body. If no body is present, one will be 
-        * automatically created.
+        * Sets the Module's body content to the HTML specified. 
+        * 
+        * If no body is present, one will be automatically created. 
+        * 
+        * An empty string can be passed to the method to clear the contents of the body.
         * @method setBody
-        * @param {String} bodyContent The HTML used to set the body <em>OR</em>
-        * @param {HTMLElement} bodyContent The HTMLElement to append to the body
+        * @param {String} bodyContent The HTML used to set the body. 
+        * As a convenience, non HTMLElement objects can also be passed into 
+        * the method, and will be treated as strings, with the body innerHTML
+        * set to their default toString implementations.
+        * <em>OR</em>
+        * @param {HTMLElement} bodyContent The HTMLElement to add as the first and only
+        * child of the body element.
+        * <em>OR</em>
+        * @param {DocumentFragment} bodyContent The document fragment 
+        * containing elements which are to be added to the body
         */
         setBody: function (bodyContent) {
-
             var oBody = this.body || (this.body = createBody());
-        
-            if (typeof bodyContent == "string") {
 
-                oBody.innerHTML = bodyContent;
-
-            } else {
-
+            if (bodyContent.nodeName) {
                 oBody.innerHTML = "";
                 oBody.appendChild(bodyContent);
-
+            } else {
+                oBody.innerHTML = bodyContent;
             }
-        
+
             this.changeBodyEvent.fire(bodyContent);
             this.changeContentEvent.fire();
-
         },
-        
+
         /**
         * Appends the passed element to the body. If no body is present, one 
         * will be automatically created.
         * @method appendToBody
-        * @param {HTMLElement} element The element to append to the body
+        * @param {HTMLElement | DocumentFragment} element The element to 
+        * append to the body. In the case of a document fragment, the
+        * children of the fragment will be appended to the body.
+        * 
         */
         appendToBody: function (element) {
-
             var oBody = this.body || (this.body = createBody());
         
             oBody.appendChild(element);
@@ -1612,58 +1585,72 @@
         /**
         * Sets the Module's footer content to the HTML specified, or appends 
         * the passed element to the footer. If no footer is present, one will 
-        * be automatically created.
+        * be automatically created. An empty string can be passed to the method
+        * to clear the contents of the footer.
         * @method setFooter
         * @param {String} footerContent The HTML used to set the footer 
+        * As a convenience, non HTMLElement objects can also be passed into 
+        * the method, and will be treated as strings, with the footer innerHTML
+        * set to their default toString implementations.
         * <em>OR</em>
         * @param {HTMLElement} footerContent The HTMLElement to append to 
         * the footer
+        * <em>OR</em>
+        * @param {DocumentFragment} footerContent The document fragment containing 
+        * elements which are to be added to the footer
         */
         setFooter: function (footerContent) {
 
             var oFooter = this.footer || (this.footer = createFooter());
-        
-            if (typeof footerContent == "string") {
 
-                oFooter.innerHTML = footerContent;
-
-            } else {
-
+            if (footerContent.nodeName) {
                 oFooter.innerHTML = "";
                 oFooter.appendChild(footerContent);
-
+            } else {
+                oFooter.innerHTML = footerContent;
             }
-        
+
             this.changeFooterEvent.fire(footerContent);
             this.changeContentEvent.fire();
-
         },
-        
+
         /**
         * Appends the passed element to the footer. If no footer is present, 
         * one will be automatically created.
         * @method appendToFooter
-        * @param {HTMLElement} element The element to append to the footer
+        * @param {HTMLElement | DocumentFragment} element The element to 
+        * append to the footer. In the case of a document fragment, the
+        * children of the fragment will be appended to the footer
         */
         appendToFooter: function (element) {
 
             var oFooter = this.footer || (this.footer = createFooter());
-        
+
             oFooter.appendChild(element);
 
             this.changeFooterEvent.fire(element);
             this.changeContentEvent.fire();
 
         },
-        
+
         /**
         * Renders the Module by inserting the elements that are not already 
         * in the main Module into their correct places. Optionally appends 
         * the Module to the specified node prior to the render's execution. 
-        * NOTE: For Modules without existing markup, the appendToNode argument 
+        * <p>
+        * For Modules without existing markup, the appendToNode argument 
         * is REQUIRED. If this argument is ommitted and the current element is 
         * not present in the document, the function will return false, 
         * indicating that the render was a failure.
+        * </p>
+        * <p>
+        * NOTE: As of 2.3.1, if the appendToNode is the document's body element
+        * then the module is rendered as the first child of the body element, 
+        * and not appended to it, to avoid Operation Aborted errors in IE when 
+        * rendering the module before window's load event is fired. You can 
+        * use the appendtodocumentbody configuration property to change this 
+        * to append to document.body if required.
+        * </p>
         * @method render
         * @param {String} appendToNode The element id to which the Module 
         * should be appended to prior to rendering <em>OR</em>
@@ -1674,118 +1661,74 @@
         * @return {Boolean} Success or failure of the render
         */
         render: function (appendToNode, moduleElement) {
-        
+
             var me = this,
                 firstChild;
-        
-            function appendTo(element) {
-                if (typeof element == "string") {
-                    element = document.getElementById(element);
+
+            function appendTo(parentNode) {
+                if (typeof parentNode == "string") {
+                    parentNode = document.getElementById(parentNode);
                 }
-        
-                if (element) {
-                    element.appendChild(me.element);
+
+                if (parentNode) {
+                    me._addToParent(parentNode, me.element);
                     me.appendEvent.fire();
                 }
             }
-        
+
             this.beforeRenderEvent.fire();
-        
+
             if (! moduleElement) {
                 moduleElement = this.element;
             }
-        
-            if (appendToNode) {
 
+            if (appendToNode) {
                 appendTo(appendToNode);
-
             } else { 
-
-                /*
-                     No node was passed in. If the element is not already in 
-                     the Dom, this fails
-                */
-
+                // No node was passed in. If the element is not already in the Dom, this fails
                 if (! Dom.inDocument(this.element)) {
-
-
                     return false;
-
                 }
-
             }
-        
+
             // Need to get everything into the DOM if it isn't already
-        
             if (this.header && ! Dom.inDocument(this.header)) {
-
-                /*
-                    There is a header, but it's not in the DOM yet... 
-                    need to add it
-                */
-
+                // There is a header, but it's not in the DOM yet. Need to add it.
                 firstChild = moduleElement.firstChild;
-
-                if (firstChild) { // Insert before first child if exists
-
+                if (firstChild) {
                     moduleElement.insertBefore(this.header, firstChild);
-
-                } else { // Append to empty body because there are no children
-
+                } else {
                     moduleElement.appendChild(this.header);
-
                 }
-
             }
-        
-            if (this.body && ! Dom.inDocument(this.body)) {
 
-                /*
-                     There is a body, but it's not in the DOM yet... 
-                     need to add it
-                */
-
-
-                // Insert before footer if exists in DOM
-
-                if (this.footer && Dom.isAncestor(
-                    this.moduleElement, this.footer)) { 
-
+            if (this.body && ! Dom.inDocument(this.body)) {
+                // There is a body, but it's not in the DOM yet. Need to add it.		
+                if (this.footer && Dom.isAncestor(this.moduleElement, this.footer)) {
                     moduleElement.insertBefore(this.body, this.footer);
-
-                } else { // Append to element because there is no footer
-
+                } else {
                     moduleElement.appendChild(this.body);
-
                 }
-
             }
-        
-            if (this.footer && ! Dom.inDocument(this.footer)) {
 
-                /*
-                     There is a footer, but it's not in the DOM yet... 
-                     need to add it
-                */
-
+            if (this.footer && ! Dom.inDocument(this.footer)) {
+                // There is a footer, but it's not in the DOM yet. Need to add it.
                 moduleElement.appendChild(this.footer);
-
             }
-        
+
             this.renderEvent.fire();
             return true;
         },
-        
+
         /**
         * Removes the Module element from the DOM and sets all child elements 
         * to null.
         * @method destroy
         */
         destroy: function () {
-        
-            var parent,
-                e;
-        
+
+            var parent;
+
             if (this.element) {
                 Event.purgeElement(this.element, true);
                 parent = this.element.parentNode;
@@ -1806,15 +1749,8 @@
             this.cfg = null;
 
             this.destroyEvent.fire();
-        
-            for (e in this) {
-                if (e instanceof CustomEvent) {
-                    e.unsubscribeAll();
-                }
-            }
-
         },
-        
+
         /**
         * Shows the Module element by setting the visible configuration 
         * property to true. Also fires two events: beforeShowEvent prior to 
@@ -1824,7 +1760,7 @@
         show: function () {
             this.cfg.setProperty("visible", true);
         },
-        
+
         /**
         * Hides the Module element by setting the visible configuration 
         * property to false. Also fires two events: beforeHideEvent prior to 
@@ -1836,7 +1772,6 @@
         },
         
         // BUILT-IN EVENT HANDLERS FOR MODULE //
-        
         /**
         * Default event handler for changing the visibility property of a 
         * Module. By default, this is achieved by switching the "display" style 
@@ -1861,7 +1796,7 @@
                 this.hideEvent.fire();
             }
         },
-        
+
         /**
         * Default event handler for the "monitorresize" configuration property
         * @param {String} type The CustomEvent type (usually the property name)
@@ -1872,23 +1807,40 @@
         * @method configMonitorResize
         */
         configMonitorResize: function (type, args, obj) {
-
             var monitor = args[0];
-
             if (monitor) {
-
                 this.initResizeMonitor();
-
             } else {
-
-                Module.textResizeEvent.unsubscribe(
-                    this.onDomResize, this, true);
-
+                Module.textResizeEvent.unsubscribe(this.onDomResize, this, true);
                 this.resizeMonitor = null;
             }
+        },
 
+        /**
+         * This method is a protected helper, used when constructing the DOM structure for the module 
+         * to account for situations which may cause Operation Aborted errors in IE. It should not 
+         * be used for general DOM construction.
+         * <p>
+         * If the parentNode is not document.body, the element is appended as the last element.
+         * </p>
+         * <p>
+         * If the parentNode is document.body the element is added as the first child to help
+         * prevent Operation Aborted errors in IE.
+         * </p>
+         *
+         * @param {parentNode} The HTML element to which the element will be added
+         * @param {element} The HTML element to be added to parentNode's children
+         * @method _addToParent
+         * @protected
+         */
+        _addToParent: function(parentNode, element) {
+            if (!this.cfg.getProperty("appendtodocumentbody") && parentNode === document.body && parentNode.firstChild) {
+                parentNode.insertBefore(element, parentNode.firstChild);
+            } else {
+                parentNode.appendChild(element);
+            }
         },
-        
+
         /**
         * Returns a String representation of the Object.
         * @method toString
@@ -1897,12 +1849,12 @@
         toString: function () {
             return "Module " + this.id;
         }
-        
     };
-    
+
     YAHOO.lang.augmentProto(Module, YAHOO.util.EventProvider);
 
 }());
+
 (function () {
 
     /**
@@ -1914,7 +1866,7 @@
     * properly rendered above SELECT elements.
     * @namespace YAHOO.widget
     * @class Overlay
-    * @extends Module
+    * @extends YAHOO.widget.Module
     * @param {String} el The element ID representing the Overlay <em>OR</em>
     * @param {HTMLElement} el The element representing the Overlay
     * @param {Object} userConfig The configuration object literal containing 
@@ -1923,20 +1875,22 @@
     * @constructor
     */
     YAHOO.widget.Overlay = function (el, userConfig) {
-    
         YAHOO.widget.Overlay.superclass.constructor.call(this, el, userConfig);
-    
     };
 
-
     var Lang = YAHOO.lang,
         CustomEvent = YAHOO.util.CustomEvent,
         Module = YAHOO.widget.Module,
         Event = YAHOO.util.Event,
         Dom = YAHOO.util.Dom,
         Config = YAHOO.util.Config,
+        UA = YAHOO.env.ua,
         Overlay = YAHOO.widget.Overlay,
-        
+
+        _SUBSCRIBE = "subscribe",
+        _UNSUBSCRIBE = "unsubscribe",
+        _CONTAINED = "contained",
+
         m_oIFrameTemplate,
 
         /**
@@ -1947,12 +1901,10 @@
         * @type Object
         */
         EVENT_TYPES = {
-        
             "BEFORE_MOVE": "beforeMove",
             "MOVE": "move"
-        
         },
-        
+
         /**
         * Constant representing the Overlay's configuration properties
         * @property DEFAULT_CONFIG
@@ -1961,74 +1913,85 @@
         * @type Object
         */
         DEFAULT_CONFIG = {
-        
+
             "X": { 
                 key: "x", 
                 validator: Lang.isNumber, 
                 suppressEvent: true, 
-                supercedes: ["iframe"] 
+                supercedes: ["iframe"]
             },
-        
+
             "Y": { 
                 key: "y", 
                 validator: Lang.isNumber, 
                 suppressEvent: true, 
-                supercedes: ["iframe"] 
+                supercedes: ["iframe"]
             },
-        
+
             "XY": { 
                 key: "xy", 
                 suppressEvent: true, 
                 supercedes: ["iframe"] 
             },
-        
+
             "CONTEXT": { 
                 key: "context", 
                 suppressEvent: true, 
                 supercedes: ["iframe"] 
             },
-        
+
             "FIXED_CENTER": { 
                 key: "fixedcenter", 
                 value: false, 
-                validator: Lang.isBoolean, 
                 supercedes: ["iframe", "visible"] 
             },
-        
+
             "WIDTH": { 
-                key: "width", 
-                suppressEvent: true, 
-                supercedes: ["context", "fixedcenter", "iframe"] 
+                key: "width",
+                suppressEvent: true,
+                supercedes: ["context", "fixedcenter", "iframe"]
             }, 
-        
+
             "HEIGHT": { 
                 key: "height", 
                 suppressEvent: true, 
                 supercedes: ["context", "fixedcenter", "iframe"] 
-            }, 
-        
+            },
+
+            "AUTO_FILL_HEIGHT" : {
+                key: "autofillheight",
+                supercedes: ["height"],
+                value:"body"
+            },
+
             "ZINDEX": { 
                 key: "zindex", 
                 value: null 
-            }, 
-        
+            },
+
             "CONSTRAIN_TO_VIEWPORT": { 
                 key: "constraintoviewport", 
                 value: false, 
                 validator: Lang.isBoolean, 
-                supercedes: ["iframe", "x", "y", "xy"] 
+                supercedes: ["iframe", "x", "y", "xy"]
             }, 
-        
+
             "IFRAME": { 
                 key: "iframe", 
-                value: (YAHOO.env.ua.ie == 6 ? true : false), 
+                value: (UA.ie == 6 ? true : false), 
                 validator: Lang.isBoolean, 
                 supercedes: ["zindex"] 
+            },
+
+            "PREVENT_CONTEXT_OVERLAP": {
+                key: "preventcontextoverlap",
+                value: false,
+                validator: Lang.isBoolean,  
+                supercedes: ["constraintoviewport"]
             }
-        
+
         };
 
-
     /**
     * The URL that will be placed in the iframe
     * @property YAHOO.widget.Overlay.IFRAME_SRC
@@ -2040,16 +2003,27 @@
 
     /**
     * Number representing how much the iframe shim should be offset from each 
-    * side of an Overlay instance.
+    * side of an Overlay instance, in pixels.
     * @property YAHOO.widget.Overlay.IFRAME_SRC
     * @default 3
     * @static
     * @final
     * @type Number
     */
     Overlay.IFRAME_OFFSET = 3;
-    
+
     /**
+    * Number representing the minimum distance an Overlay instance should be 
+    * positioned relative to the boundaries of the browser's viewport, in pixels.
+    * @property YAHOO.widget.Overlay.VIEWPORT_OFFSET
+    * @default 10
+    * @static
+    * @final
+    * @type Number
+    */
+    Overlay.VIEWPORT_OFFSET = 10;
+
+    /**
     * Constant representing the top left corner of an element, used for 
     * configuring the context element alignment
     * @property YAHOO.widget.Overlay.TOP_LEFT
@@ -2058,7 +2032,7 @@
     * @type String
     */
     Overlay.TOP_LEFT = "tl";
-    
+
     /**
     * Constant representing the top right corner of an element, used for 
     * configuring the context element alignment
@@ -2068,7 +2042,7 @@
     * @type String
     */
     Overlay.TOP_RIGHT = "tr";
-    
+
     /**
     * Constant representing the top bottom left corner of an element, used for 
     * configuring the context element alignment
@@ -2078,7 +2052,7 @@
     * @type String
     */
     Overlay.BOTTOM_LEFT = "bl";
-    
+
     /**
     * Constant representing the bottom right corner of an element, used for 
     * configuring the context element alignment
@@ -2088,7 +2062,7 @@
     * @type String
     */
     Overlay.BOTTOM_RIGHT = "br";
-    
+
     /**
     * Constant representing the default CSS class used for an Overlay
     * @property YAHOO.widget.Overlay.CSS_OVERLAY
@@ -2097,84 +2071,89 @@
     * @type String
     */
     Overlay.CSS_OVERLAY = "yui-overlay";
-    
-    
+
     /**
+     * Constant representing the names of the standard module elements
+     * used in the overlay.
+     * @property YAHOO.widget.Overlay.STD_MOD_RE
+     * @static
+     * @final
+     * @type RegExp
+     */
+    Overlay.STD_MOD_RE = /^\s*?(body|footer|header)\s*?$/i;
+
+    /**
     * A singleton CustomEvent used for reacting to the DOM event for 
     * window scroll
     * @event YAHOO.widget.Overlay.windowScrollEvent
     */
     Overlay.windowScrollEvent = new CustomEvent("windowScroll");
-    
+
     /**
     * A singleton CustomEvent used for reacting to the DOM event for
     * window resize
     * @event YAHOO.widget.Overlay.windowResizeEvent
     */
     Overlay.windowResizeEvent = new CustomEvent("windowResize");
-    
+
     /**
     * The DOM event handler used to fire the CustomEvent for window scroll
     * @method YAHOO.widget.Overlay.windowScrollHandler
     * @static
     * @param {DOMEvent} e The DOM scroll event
     */
     Overlay.windowScrollHandler = function (e) {
-    
-        if (YAHOO.env.ua.ie) {
-    
-            if (! window.scrollEnd) {
-    
-                window.scrollEnd = -1;
-    
+        var t = Event.getTarget(e);
+
+        // - Webkit (Safari 2/3) and Opera 9.2x bubble scroll events from elements to window
+        // - FF2/3 and IE6/7, Opera 9.5x don't bubble scroll events from elements to window
+        // - IE doesn't recognize scroll registered on the document.
+        //
+        // Also, when document view is scrolled, IE doesn't provide a target, 
+        // rest of the browsers set target to window.document, apart from opera 
+        // which sets target to window.
+        if (!t || t === window || t === window.document) {
+            if (UA.ie) {
+
+                if (! window.scrollEnd) {
+                    window.scrollEnd = -1;
+                }
+
+                clearTimeout(window.scrollEnd);
+        
+                window.scrollEnd = setTimeout(function () { 
+                    Overlay.windowScrollEvent.fire(); 
+                }, 1);
+        
+            } else {
+                Overlay.windowScrollEvent.fire();
             }
-    
-            clearTimeout(window.scrollEnd);
-    
-            window.scrollEnd = setTimeout(function () { 
-            
-                Overlay.windowScrollEvent.fire(); 
-    
-            }, 1);
-    
-        } else {
-    
-            Overlay.windowScrollEvent.fire();
-    
         }
-    
     };
-    
+
     /**
     * The DOM event handler used to fire the CustomEvent for window resize
     * @method YAHOO.widget.Overlay.windowResizeHandler
     * @static
     * @param {DOMEvent} e The DOM resize event
     */
     Overlay.windowResizeHandler = function (e) {
-    
-        if (YAHOO.env.ua.ie) {
-    
+
+        if (UA.ie) {
             if (! window.resizeEnd) {
                 window.resizeEnd = -1;
             }
-    
+
             clearTimeout(window.resizeEnd);
-    
+
             window.resizeEnd = setTimeout(function () {
-    
                 Overlay.windowResizeEvent.fire(); 
-    
             }, 100);
-    
         } else {
-    
             Overlay.windowResizeEvent.fire();
-    
         }
-    
     };
-    
+
     /**
     * A boolean that indicated whether the window resize and scroll events have 
     * already been subscribed to.
@@ -2183,19 +2162,55 @@
     * @type Boolean
     */
     Overlay._initialized = null;
-    
+
     if (Overlay._initialized === null) {
-    
         Event.on(window, "scroll", Overlay.windowScrollHandler);
         Event.on(window, "resize", Overlay.windowResizeHandler);
-    
         Overlay._initialized = true;
-    
     }
-    
+
+    /**
+     * Internal map of special event types, which are provided
+     * by the instance. It maps the event type to the custom event 
+     * instance. Contains entries for the "windowScroll", "windowResize" and
+     * "textResize" static container events.
+     *
+     * @property YAHOO.widget.Overlay._TRIGGER_MAP
+     * @type Object
+     * @static
+     * @private
+     */
+    Overlay._TRIGGER_MAP = {
+        "windowScroll" : Overlay.windowScrollEvent,
+        "windowResize" : Overlay.windowResizeEvent,
+        "textResize"   : Module.textResizeEvent
+    };
+
     YAHOO.extend(Overlay, Module, {
-    
+
         /**
+         * <p>
+         * Array of default event types which will trigger
+         * context alignment for the Overlay class.
+         * </p>
+         * <p>The array is empty by default for Overlay,
+         * but maybe populated in future releases, so classes extending
+         * Overlay which need to define their own set of CONTEXT_TRIGGERS
+         * should concatenate their super class's prototype.CONTEXT_TRIGGERS 
+         * value with their own array of values.
+         * </p>
+         * <p>
+         * E.g.:
+         * <code>CustomOverlay.prototype.CONTEXT_TRIGGERS = YAHOO.widget.Overlay.prototype.CONTEXT_TRIGGERS.concat(["windowScroll"]);</code>
+         * </p>
+         * 
+         * @property CONTEXT_TRIGGERS
+         * @type Array
+         * @final
+         */
+        CONTEXT_TRIGGERS : [],
+
+        /**
         * The Overlay initialization method, which is executed for Overlay and  
         * all of its subclasses. This method is automatically called by the 
         * constructor, and  sets up all DOM references for pre-existing markup, 
@@ -2208,46 +2223,42 @@
         * See configuration documentation for more details.
         */
         init: function (el, userConfig) {
-    
+
             /*
                  Note that we don't pass the user config in here yet because we
                  only want it executed once, at the lowest subclass level
             */
-    
-            Overlay.superclass.init.call(this, el/*, userConfig*/);  
-            
+
+            Overlay.superclass.init.call(this, el/*, userConfig*/);
+
             this.beforeInitEvent.fire(Overlay);
-            
+
             Dom.addClass(this.element, Overlay.CSS_OVERLAY);
-            
+
             if (userConfig) {
-    
                 this.cfg.applyConfig(userConfig, true);
-    
             }
-            
-            if (this.platform == "mac" && YAHOO.env.ua.gecko) {
-    
+
+            if (this.platform == "mac" && UA.gecko) {
+
                 if (! Config.alreadySubscribed(this.showEvent,
                     this.showMacGeckoScrollbars, this)) {
-    
+
                     this.showEvent.subscribe(this.showMacGeckoScrollbars, 
                         this, true);
-    
+
                 }
-    
+
                 if (! Config.alreadySubscribed(this.hideEvent, 
                     this.hideMacGeckoScrollbars, this)) {
-    
+
                     this.hideEvent.subscribe(this.hideMacGeckoScrollbars, 
                         this, true);
-    
+
                 }
-    
             }
-            
+
             this.initEvent.fire(Overlay);
-        
         },
         
         /**
@@ -2256,11 +2267,11 @@
         * @method initEvents
         */
         initEvents: function () {
-    
+
             Overlay.superclass.initEvents.call(this);
-            
+
             var SIGNATURE = CustomEvent.LIST;
-            
+
             /**
             * CustomEvent fired before the Overlay is moved.
             * @event beforeMoveEvent
@@ -2269,7 +2280,7 @@
             */
             this.beforeMoveEvent = this.createEvent(EVENT_TYPES.BEFORE_MOVE);
             this.beforeMoveEvent.signature = SIGNATURE;
-            
+
             /**
             * CustomEvent fired after the Overlay is moved.
             * @event moveEvent
@@ -2278,7 +2289,7 @@
             */
             this.moveEvent = this.createEvent(EVENT_TYPES.MOVE);
             this.moveEvent.signature = SIGNATURE;
-        
+
         },
         
         /**
@@ -2289,8 +2300,9 @@
         initDefaultConfig: function () {
     
             Overlay.superclass.initDefaultConfig.call(this);
-            
-            
+
+            var cfg = this.cfg;
+
             // Add overlay config properties //
             
             /**
@@ -2299,161 +2311,249 @@
             * @type Number
             * @default null
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.X.key, { 
+            cfg.addProperty(DEFAULT_CONFIG.X.key, { 
     
                 handler: this.configX, 
                 validator: DEFAULT_CONFIG.X.validator, 
                 suppressEvent: DEFAULT_CONFIG.X.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.X.supercedes
     
             });
-        
-    
+
             /**
             * The absolute y-coordinate position of the Overlay
             * @config y
             * @type Number
             * @default null
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.Y.key, {
-    
+            cfg.addProperty(DEFAULT_CONFIG.Y.key, {
+
                 handler: this.configY, 
                 validator: DEFAULT_CONFIG.Y.validator, 
                 suppressEvent: DEFAULT_CONFIG.Y.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.Y.supercedes
-    
+
             });
-        
-    
+
             /**
             * An array with the absolute x and y positions of the Overlay
             * @config xy
             * @type Number[]
             * @default null
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.XY.key, {
-            
+            cfg.addProperty(DEFAULT_CONFIG.XY.key, {
                 handler: this.configXY, 
                 suppressEvent: DEFAULT_CONFIG.XY.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.XY.supercedes
-            
             });
-        
-    
+
             /**
-            * The array of context arguments for context-sensitive positioning.  
-            * The format is: [id or element, element corner, context corner]. 
-            * For example, setting this property to ["img1", "tl", "bl"] would 
-            * align the Overlay's top left corner to the context element's 
-            * bottom left corner.
+            * <p>
+            * The array of context arguments for context-sensitive positioning. 
+            * </p>
+            *
+            * <p>
+            * The format of the array is: <code>[contextElementOrId, overlayCorner, contextCorner, arrayOfTriggerEvents (optional)]</code>, the
+            * the 4 array elements described in detail below:
+            * </p>
+            *
+            * <dl>
+            * <dt>contextElementOrId &#60;String|HTMLElement&#62;</dt>
+            * <dd>A reference to the context element to which the overlay should be aligned (or it's id).</dd>
+            * <dt>overlayCorner &#60;String&#62;</dt>
+            * <dd>The corner of the overlay which is to be used for alignment. This corner will be aligned to the 
+            * corner of the context element defined by the "contextCorner" entry which follows. Supported string values are: 
+            * "tr" (top right), "tl" (top left), "br" (bottom right), or "bl" (bottom left).</dd>
+            * <dt>contextCorner &#60;String&#62;</dt>
+            * <dd>The corner of the context element which is to be used for alignment. Supported string values are the same ones listed for the "overlayCorner" entry above.</dd>
+            * <dt>arrayOfTriggerEvents (optional) &#60;Array[String|CustomEvent]&#62;</dt>
+            * <dd>
+            * <p>
+            * By default, context alignment is a one time operation, aligning the Overlay to the context element when context configuration property is set, or when the <a href="#method_align">align</a> 
+            * method is invoked. However, you can use the optional "arrayOfTriggerEvents" entry to define the list of events which should force the overlay to re-align itself with the context element. 
+            * This is useful in situations where the layout of the document may change, resulting in the context element's position being modified.
+            * </p>
+            * <p>
+            * The array can contain either event type strings for events the instance publishes (e.g. "beforeShow") or CustomEvent instances. Additionally the following
+            * 3 static container event types are also currently supported : <code>"windowResize", "windowScroll", "textResize"</code> (defined in <a href="#property__TRIGGER_MAP">_TRIGGER_MAP</a> private property).
+            * </p>
+            * </dd>
+            * </dl>
+            *
+            * <p>
+            * For example, setting this property to <code>["img1", "tl", "bl"]</code> will 
+            * align the Overlay's top left corner to the bottom left corner of the
+            * context element with id "img1".
+            * </p>
+            * <p>
+            * Adding the optional trigger values: <code>["img1", "tl", "bl", ["beforeShow", "windowResize"]]</code>,
+            * will re-align the overlay position, whenever the "beforeShow" or "windowResize" events are fired.
+            * </p>
+            *
             * @config context
             * @type Array
             * @default null
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.CONTEXT.key, {
-            
+            cfg.addProperty(DEFAULT_CONFIG.CONTEXT.key, {
                 handler: this.configContext, 
                 suppressEvent: DEFAULT_CONFIG.CONTEXT.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.CONTEXT.supercedes
-            
             });
-        
-    
+
             /**
-            * True if the Overlay should be anchored to the center of 
-            * the viewport.
+            * Determines whether or not the Overlay should be anchored 
+            * to the center of the viewport.
+            * 
+            * <p>This property can be set to:</p>
+            * 
+            * <dl>
+            * <dt>true</dt>
+            * <dd>
+            * To enable fixed center positioning
+            * <p>
+            * When enabled, the overlay will 
+            * be positioned in the center of viewport when initially displayed, and 
+            * will remain in the center of the viewport whenever the window is 
+            * scrolled or resized.
+            * </p>
+            * <p>
+            * If the overlay is too big for the viewport, 
+            * it's top left corner will be aligned with the top left corner of the viewport.
+            * </p>
+            * </dd>
+            * <dt>false</dt>
+            * <dd>
+            * To disable fixed center positioning.
+            * <p>In this case the overlay can still be 
+            * centered as a one-off operation, by invoking the <code>center()</code> method,
+            * however it will not remain centered when the window is scrolled/resized.
+            * </dd>
+            * <dt>"contained"<dt>
+            * <dd>To enable fixed center positioning, as with the <code>true</code> option.
+            * <p>However, unlike setting the property to <code>true</code>, 
+            * when the property is set to <code>"contained"</code>, if the overlay is 
+            * too big for the viewport, it will not get automatically centered when the 
+            * user scrolls or resizes the window (until the window is large enough to contain the 
+            * overlay). This is useful in cases where the Overlay has both header and footer 
+            * UI controls which the user may need to access.
+            * </p>
+            * </dd>
+            * </dl>
+            *
             * @config fixedcenter
-            * @type Boolean
+            * @type Boolean | String
             * @default false
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.FIXED_CENTER.key, {
-            
+            cfg.addProperty(DEFAULT_CONFIG.FIXED_CENTER.key, {
                 handler: this.configFixedCenter,
                 value: DEFAULT_CONFIG.FIXED_CENTER.value, 
                 validator: DEFAULT_CONFIG.FIXED_CENTER.validator, 
                 supercedes: DEFAULT_CONFIG.FIXED_CENTER.supercedes
-            
             });
-        
     
             /**
             * CSS width of the Overlay.
             * @config width
             * @type String
             * @default null
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.WIDTH.key, {
-            
+            cfg.addProperty(DEFAULT_CONFIG.WIDTH.key, {
                 handler: this.configWidth, 
                 suppressEvent: DEFAULT_CONFIG.WIDTH.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.WIDTH.supercedes
-            
             });
-            
+
             /**
             * CSS height of the Overlay.
             * @config height
             * @type String
             * @default null
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.HEIGHT.key, {
-            
+            cfg.addProperty(DEFAULT_CONFIG.HEIGHT.key, {
                 handler: this.configHeight, 
                 suppressEvent: DEFAULT_CONFIG.HEIGHT.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.HEIGHT.supercedes
-            
             });
-            
+
             /**
+            * Standard module element which should auto fill out the height of the Overlay if the height config property is set.
+            * Supported values are "header", "body", "footer".
+            *
+            * @config autofillheight
+            * @type String
+            * @default null
+            */
+            cfg.addProperty(DEFAULT_CONFIG.AUTO_FILL_HEIGHT.key, {
+                handler: this.configAutoFillHeight, 
+                value : DEFAULT_CONFIG.AUTO_FILL_HEIGHT.value,
+                validator : this._validateAutoFill,
+                supercedes: DEFAULT_CONFIG.AUTO_FILL_HEIGHT.supercedes
+            });
+
+            /**
             * CSS z-index of the Overlay.
             * @config zIndex
             * @type Number
             * @default null
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.ZINDEX.key, {
-    
+            cfg.addProperty(DEFAULT_CONFIG.ZINDEX.key, {
                 handler: this.configzIndex,
                 value: DEFAULT_CONFIG.ZINDEX.value
-    
             });
-            
+
             /**
             * True if the Overlay should be prevented from being positioned 
             * out of the viewport.
             * @config constraintoviewport
             * @type Boolean
             * @default false
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.key, {
-            
+            cfg.addProperty(DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.key, {
+
                 handler: this.configConstrainToViewport, 
                 value: DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.value, 
                 validator: DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.validator, 
                 supercedes: DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.supercedes
-            
+
             });
-            
+
             /**
             * @config iframe
             * @description Boolean indicating whether or not the Overlay should 
-            * have an IFRAME shim; used to prevent <SELECT> elements from 
+            * have an IFRAME shim; used to prevent SELECT elements from 
             * poking through an Overlay instance in IE6.  When set to "true", 
             * the iframe shim is created when the Overlay instance is intially
             * made visible.
             * @type Boolean
             * @default true for IE6 and below, false for all other browsers.
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.IFRAME.key, {
-            
+            cfg.addProperty(DEFAULT_CONFIG.IFRAME.key, {
+
                 handler: this.configIframe, 
                 value: DEFAULT_CONFIG.IFRAME.value, 
                 validator: DEFAULT_CONFIG.IFRAME.validator, 
                 supercedes: DEFAULT_CONFIG.IFRAME.supercedes
-            
+
             });
-        
+
+            /**
+            * @config preventcontextoverlap
+            * @description Boolean indicating whether or not the Overlay should overlap its 
+            * context element (defined using the "context" configuration property) when the 
+            * "constraintoviewport" configuration property is set to "true".
+            * @type Boolean
+            * @default false
+            */
+            cfg.addProperty(DEFAULT_CONFIG.PREVENT_CONTEXT_OVERLAP.key, {
+
+                value: DEFAULT_CONFIG.PREVENT_CONTEXT_OVERLAP.value, 
+                validator: DEFAULT_CONFIG.PREVENT_CONTEXT_OVERLAP.validator, 
+                supercedes: DEFAULT_CONFIG.PREVENT_CONTEXT_OVERLAP.supercedes
+
+            });
+
         },
-        
+
         /**
         * Moves the Overlay to the specified position. This function is  
         * identical to calling this.cfg.setProperty("xy", [x,y]);
@@ -2462,39 +2562,47 @@
         * @param {Number} y The Overlay's new y position
         */
         moveTo: function (x, y) {
-    
             this.cfg.setProperty("xy", [x, y]);
-    
         },
-        
+
         /**
         * Adds a CSS class ("hide-scrollbars") and removes a CSS class 
         * ("show-scrollbars") to the Overlay to fix a bug in Gecko on Mac OS X 
         * (https://bugzilla.mozilla.org/show_bug.cgi?id=187435)
         * @method hideMacGeckoScrollbars
         */
         hideMacGeckoScrollbars: function () {
-    
-            Dom.removeClass(this.element, "show-scrollbars");
-            Dom.addClass(this.element, "hide-scrollbars");
-    
+            Dom.replaceClass(this.element, "show-scrollbars", "hide-scrollbars");
         },
-        
+
         /**
         * Adds a CSS class ("show-scrollbars") and removes a CSS class 
         * ("hide-scrollbars") to the Overlay to fix a bug in Gecko on Mac OS X 
         * (https://bugzilla.mozilla.org/show_bug.cgi?id=187435)
         * @method showMacGeckoScrollbars
         */
         showMacGeckoScrollbars: function () {
-    
-            Dom.removeClass(this.element, "hide-scrollbars");
-            Dom.addClass(this.element, "show-scrollbars");
-    
+            Dom.replaceClass(this.element, "hide-scrollbars", "show-scrollbars");
         },
-        
+
+        /**
+         * Internal implementation to set the visibility of the overlay in the DOM.
+         *
+         * @method _setDomVisibility
+         * @param {boolean} visible Whether to show or hide the Overlay's outer element
+         * @protected
+         */
+        _setDomVisibility : function(show) {
+            Dom.setStyle(this.element, "visibility", (show) ? "visible" : "hidden");
+
+            if (show) {
+                Dom.removeClass(this.element, "yui-overlay-hidden");
+            } else {
+                Dom.addClass(this.element, "yui-overlay-hidden");
+            }
+        },
+
         // BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
-        
         /**
         * The default event handler fired when the "visible" property is 
         * changed.  This method is responsible for firing showEvent
@@ -2507,150 +2615,104 @@
         * this will usually equal the owner.
         */
         configVisible: function (type, args, obj) {
-    
+
             var visible = args[0],
                 currentVis = Dom.getStyle(this.element, "visibility"),
                 effect = this.cfg.getProperty("effect"),
                 effectInstances = [],
-                isMacGecko = (this.platform == "mac" && YAHOO.env.ua.gecko),
+                isMacGecko = (this.platform == "mac" && UA.gecko),
                 alreadySubscribed = Config.alreadySubscribed,
                 eff, ei, e, i, j, k, h,
                 nEffects,
                 nEffectInstances;
-    
-    
+
             if (currentVis == "inherit") {
-    
                 e = this.element.parentNode;
-    
+
                 while (e.nodeType != 9 && e.nodeType != 11) {
-    
                     currentVis = Dom.getStyle(e, "visibility");
-    
-                    if (currentVis != "inherit") { 
-    
-                        break; 
-    
+
+                    if (currentVis != "inherit") {
+                        break;
                     }
-    
+
                     e = e.parentNode;
-    
                 }
-    
+
                 if (currentVis == "inherit") {
-    
                     currentVis = "visible";
-                
                 }
-    
             }
-        
-    
+
             if (effect) {
-    
                 if (effect instanceof Array) {
-
                     nEffects = effect.length;
-    
+
                     for (i = 0; i < nEffects; i++) {
-    
                         eff = effect[i];
-    
                         effectInstances[effectInstances.length] = 
                             eff.effect(this, eff.duration);
-    
+
                     }
-    
                 } else {
-    
                     effectInstances[effectInstances.length] = 
                         effect.effect(this, effect.duration);
-    
                 }
-    
             }
-    
-        
+
             if (visible) { // Show
-    
                 if (isMacGecko) {
-    
                     this.showMacGeckoScrollbars();
-    
                 }
-                
-    
+
                 if (effect) { // Animate in
-    
-    
                     if (visible) { // Animate in if not showing
-    
-    
                         if (currentVis != "visible" || currentVis === "") {
-    
                             this.beforeShowEvent.fire();
-
                             nEffectInstances = effectInstances.length;
-    
+
                             for (j = 0; j < nEffectInstances; j++) {
-    
                                 ei = effectInstances[j];
-    
                                 if (j === 0 && !alreadySubscribed(
                                         ei.animateInCompleteEvent, 
                                         this.showEvent.fire, this.showEvent)) {
-    
+
                                     /*
                                          Delegate showEvent until end 
                                          of animateInComplete
                                     */
-    
+
                                     ei.animateInCompleteEvent.subscribe(
                                      this.showEvent.fire, this.showEvent, true);
-    
                                 }
-    
                                 ei.animateIn();
-    
                             }
-    
                         }
-    
                     }
-    
                 } else { // Show
-    
                     if (currentVis != "visible" || currentVis === "") {
-    
                         this.beforeShowEvent.fire();
-    
-                        Dom.setStyle(this.element, "visibility", "visible");
-    
+
+                        this._setDomVisibility(true);
+
                         this.cfg.refireEvent("iframe");
                         this.showEvent.fire();
-    
+                    } else {
+                        this._setDomVisibility(true);
                     }
-        
                 }
-        
             } else { // Hide
-    
+
                 if (isMacGecko) {
-    
                     this.hideMacGeckoScrollbars();
-    
                 }
-                    
+
                 if (effect) { // Animate out if showing
-    
                     if (currentVis == "visible") {
-    
                         this.beforeHideEvent.fire();
 
                         nEffectInstances = effectInstances.length;
-    
                         for (k = 0; k < nEffectInstances; k++) {
-    
                             h = effectInstances[k];
     
                             if (k === 0 && !alreadySubscribed(
@@ -2666,51 +2728,63 @@
                                     this.hideEvent.fire, this.hideEvent, true);
     
                             }
-    
                             h.animateOut();
-    
                         }
-    
+
                     } else if (currentVis === "") {
-    
-                        Dom.setStyle(this.element, "visibility", "hidden");
-    
+                        this._setDomVisibility(false);
                     }
-    
+
                 } else { // Simple hide
-    
+
                     if (currentVis == "visible" || currentVis === "") {
-    
                         this.beforeHideEvent.fire();
-    
-                        Dom.setStyle(this.element, "visibility", "hidden");
-
+                        this._setDomVisibility(false);
                         this.hideEvent.fire();
-    
+                    } else {
+                        this._setDomVisibility(false);
                     }
-    
                 }
-    
             }
-    
         },
-        
+
         /**
-        * Center event handler used for centering on scroll/resize, but only if 
-        * the Overlay is visible
+        * Fixed center event handler used for centering on scroll/resize, but only if 
+        * the overlay is visible and, if "fixedcenter" is set to "contained", only if 
+        * the overlay fits within the viewport.
+        *
         * @method doCenterOnDOMEvent
         */
         doCenterOnDOMEvent: function () {
-    
-            if (this.cfg.getProperty("visible")) {
-    
-                this.center();
-    
+            var cfg = this.cfg,
+                fc = cfg.getProperty("fixedcenter");
+
+            if (cfg.getProperty("visible")) {
+                if (fc && (fc !== _CONTAINED || this.fitsInViewport())) {
+                    this.center();
+                }
             }
-    
         },
-        
+
         /**
+         * Determines if the Overlay (including the offset value defined by Overlay.VIEWPORT_OFFSET) 
+         * will fit entirely inside the viewport, in both dimensions - width and height.
+         * 
+         * @method fitsInViewport
+         * @return boolean true if the Overlay will fit, false if not
+         */
+        fitsInViewport : function() {
+            var nViewportOffset = Overlay.VIEWPORT_OFFSET,
+                element = this.element,
+                elementWidth = element.offsetWidth,
+                elementHeight = element.offsetHeight,
+                viewportWidth = Dom.getViewportWidth(),
+                viewportHeight = Dom.getViewportHeight();
+
+            return ((elementWidth + nViewportOffset < viewportWidth) && (elementHeight + nViewportOffset < viewportHeight));
+        },
+
+        /**
         * The default event handler fired when the "fixedcenter" property 
         * is changed.
         * @method configFixedCenter
@@ -2721,50 +2795,35 @@
         * this will usually equal the owner.
         */
         configFixedCenter: function (type, args, obj) {
-    
+
             var val = args[0],
                 alreadySubscribed = Config.alreadySubscribed,
                 windowResizeEvent = Overlay.windowResizeEvent,
                 windowScrollEvent = Overlay.windowScrollEvent;
-            
+
             if (val) {
-    
                 this.center();
-            
-                if (!alreadySubscribed(this.beforeShowEvent, 
-                    this.center, this)) {
-    
+
+                if (!alreadySubscribed(this.beforeShowEvent, this.center)) {
                     this.beforeShowEvent.subscribe(this.center);
-    
                 }
-            
-                if (!alreadySubscribed(windowResizeEvent, 
-                    this.doCenterOnDOMEvent, this)) {
-    
-                    windowResizeEvent.subscribe(this.doCenterOnDOMEvent, 
-                        this, true);
-    
+
+                if (!alreadySubscribed(windowResizeEvent, this.doCenterOnDOMEvent, this)) {
+                    windowResizeEvent.subscribe(this.doCenterOnDOMEvent, this, true);
                 }
-            
-                if (!alreadySubscribed(windowScrollEvent, 
-                    this.doCenterOnDOMEvent, this)) {
-        
-                    windowScrollEvent.subscribe(this.doCenterOnDOMEvent, 
-                        this, true);
-    
+
+                if (!alreadySubscribed(windowScrollEvent, this.doCenterOnDOMEvent, this)) {
+                    windowScrollEvent.subscribe(this.doCenterOnDOMEvent, this, true);
                 }
-    
+
             } else {
-    
                 this.beforeShowEvent.unsubscribe(this.center);
-    
+
                 windowResizeEvent.unsubscribe(this.doCenterOnDOMEvent, this);
                 windowScrollEvent.unsubscribe(this.doCenterOnDOMEvent, this);
-    
             }
-    
         },
-        
+
         /**
         * The default event handler fired when the "height" property is changed.
         * @method configHeight
@@ -2775,16 +2834,52 @@
         * this will usually equal the owner.
         */
         configHeight: function (type, args, obj) {
-    
+
             var height = args[0],
                 el = this.element;
-    
+
             Dom.setStyle(el, "height", height);
             this.cfg.refireEvent("iframe");
-    
         },
-        
+
         /**
+         * The default event handler fired when the "autofillheight" property is changed.
+         * @method configAutoFillHeight
+         *
+         * @param {String} type The CustomEvent type (usually the property name)
+         * @param {Object[]} args The CustomEvent arguments. For configuration 
+         * handlers, args[0] will equal the newly applied value for the property.
+         * @param {Object} obj The scope object. For configuration handlers, 
+         * this will usually equal the owner.
+         */
+        configAutoFillHeight: function (type, args, obj) {
+            var fillEl = args[0],
+                cfg = this.cfg,
+                autoFillHeight = "autofillheight",
+                height = "height",
+                currEl = cfg.getProperty(autoFillHeight),
+                autoFill = this._autoFillOnHeightChange;
+
+            cfg.unsubscribeFromConfigEvent(height, autoFill);
+            Module.textResizeEvent.unsubscribe(autoFill);
+            this.changeContentEvent.unsubscribe(autoFill);
+
+            if (currEl && fillEl !== currEl && this[currEl]) {
+                Dom.setStyle(this[currEl], height, "");
+            }
+
+            if (fillEl) {
+                fillEl = Lang.trim(fillEl.toLowerCase());
+
+                cfg.subscribeToConfigEvent(height, autoFill, this[fillEl], this);
+                Module.textResizeEvent.subscribe(autoFill, this[fillEl], this);
+                this.changeContentEvent.subscribe(autoFill, this[fillEl], this);
+
+                cfg.setProperty(autoFillHeight, fillEl, true);
+            }
+        },
+
+        /**
         * The default event handler fired when the "width" property is changed.
         * @method configWidth
         * @param {String} type The CustomEvent type (usually the property name)
@@ -2794,15 +2889,14 @@
         * this will usually equal the owner.
         */
         configWidth: function (type, args, obj) {
-    
+
             var width = args[0],
                 el = this.element;
-    
+
             Dom.setStyle(el, "width", width);
             this.cfg.refireEvent("iframe");
-    
         },
-        
+
         /**
         * The default event handler fired when the "zIndex" property is changed.
         * @method configzIndex
@@ -2813,38 +2907,31 @@
         * this will usually equal the owner.
         */
         configzIndex: function (type, args, obj) {
-    
+
             var zIndex = args[0],
                 el = this.element;
-        
+
             if (! zIndex) {
-    
                 zIndex = Dom.getStyle(el, "zIndex");
-        
                 if (! zIndex || isNaN(zIndex)) {
-    
                     zIndex = 0;
-    
                 }
-    
             }
-            
-            if (this.iframe) {
-    
+
+            if (this.iframe || this.cfg.getProperty("iframe") === true) {
                 if (zIndex <= 0) {
-    
                     zIndex = 1;
-    
                 }
-    
-                Dom.setStyle(this.iframe, "zIndex", (zIndex - 1));
             }
-            
+
             Dom.setStyle(el, "zIndex", zIndex);
             this.cfg.setProperty("zIndex", zIndex, true);
-    
+
+            if (this.iframe) {
+                this.stackIframe();
+            }
         },
-        
+
         /**
         * The default event handler fired when the "xy" property is changed.
         * @method configXY
@@ -2855,25 +2942,24 @@
         * this will usually equal the owner.
         */
         configXY: function (type, args, obj) {
-    
+
             var pos = args[0],
                 x = pos[0],
                 y = pos[1];
-            
+
             this.cfg.setProperty("x", x);
             this.cfg.setProperty("y", y);
-            
+
             this.beforeMoveEvent.fire([x, y]);
-            
+
             x = this.cfg.getProperty("x");
             y = this.cfg.getProperty("y");
-            
-            
+
+
             this.cfg.refireEvent("iframe");
             this.moveEvent.fire([x, y]);
-    
         },
-        
+
         /**
         * The default event handler fired when the "x" property is changed.
         * @method configX
@@ -2884,27 +2970,26 @@
         * this will usually equal the owner.
         */
         configX: function (type, args, obj) {
-    
+
             var x = args[0],
                 y = this.cfg.getProperty("y");
-            
+
             this.cfg.setProperty("x", x, true);
             this.cfg.setProperty("y", y, true);
-            
+
             this.beforeMoveEvent.fire([x, y]);
-            
+
             x = this.cfg.getProperty("x");
             y = this.cfg.getProperty("y");
             
             Dom.setX(this.element, x, true);
-            
+
             this.cfg.setProperty("xy", [x, y], true);
-           
+
             this.cfg.refireEvent("iframe");
             this.moveEvent.fire([x, y]);
-    
         },
-        
+
         /**
         * The default event handler fired when the "y" property is changed.
         * @method configY
@@ -2915,25 +3000,24 @@
         * this will usually equal the owner.
         */
         configY: function (type, args, obj) {
-    
+
             var x = this.cfg.getProperty("x"),
                 y = args[0];
-        
+
             this.cfg.setProperty("x", x, true);
             this.cfg.setProperty("y", y, true);
-            
+
             this.beforeMoveEvent.fire([x, y]);
-            
+
             x = this.cfg.getProperty("x");
             y = this.cfg.getProperty("y");
-            
+
             Dom.setY(this.element, y, true);
-            
+
             this.cfg.setProperty("xy", [x, y], true);
-            
+
             this.cfg.refireEvent("iframe");
             this.moveEvent.fire([x, y]);
-    
         },
         
         /**
@@ -2946,33 +3030,23 @@
                 oParentNode;
 
             if (oIFrame) {
-    
                 oParentNode = this.element.parentNode;
 
                 if (oParentNode != oIFrame.parentNode) {
-
-                    oParentNode.appendChild(oIFrame);
-                
+                    this._addToParent(oParentNode, oIFrame);
                 }
-
                 oIFrame.style.display = "block";
-    
             }
-    
         },
-        
+
         /**
         * Hides the iframe shim, if it has been enabled.
         * @method hideIframe
         */
         hideIframe: function () {
-    
             if (this.iframe) {
-    
                 this.iframe.style.display = "none";
-    
             }
-    
         },
 
         /**
@@ -2988,37 +3062,44 @@
                 nDimensionOffset = (nOffset * 2),
                 aXY;
 
-
             if (oIFrame) {
-
                 // Size <iframe>
+                oIFrame.style.width = (oElement.offsetWidth + nDimensionOffset + "px");
+                oIFrame.style.height = (oElement.offsetHeight + nDimensionOffset + "px");
 
-                oIFrame.style.width = 
-                    (oElement.offsetWidth + nDimensionOffset + "px");
-
-                oIFrame.style.height = 
-                    (oElement.offsetHeight + nDimensionOffset + "px");
-
-
                 // Position <iframe>
-
                 aXY = this.cfg.getProperty("xy");
 
                 if (!Lang.isArray(aXY) || (isNaN(aXY[0]) || isNaN(aXY[1]))) {
-
                     this.syncPosition();
-
                     aXY = this.cfg.getProperty("xy");
-
                 }
-
                 Dom.setXY(oIFrame, [(aXY[0] - nOffset), (aXY[1] - nOffset)]);
+            }
+        },
 
+        /**
+         * Sets the zindex of the iframe shim, if it exists, based on the zindex of
+         * the Overlay element. The zindex of the iframe is set to be one less 
+         * than the Overlay element's zindex.
+         * 
+         * <p>NOTE: This method will not bump up the zindex of the Overlay element
+         * to ensure that the iframe shim has a non-negative zindex.
+         * If you require the iframe zindex to be 0 or higher, the zindex of 
+         * the Overlay element should be set to a value greater than 0, before 
+         * this method is called.
+         * </p>
+         * @method stackIframe
+         */
+        stackIframe: function () {
+            if (this.iframe) {
+                var overlayZ = Dom.getStyle(this.element, "zIndex");
+                if (!YAHOO.lang.isUndefined(overlayZ) && !isNaN(overlayZ)) {
+                    Dom.setStyle(this.iframe, "zIndex", (overlayZ - 1));
+                }
             }
-        
         },
 
-        
         /**
         * The default event handler fired when the "iframe" property is changed.
         * @method configIframe
@@ -3036,157 +3117,127 @@
 
                 var oIFrame = this.iframe,
                     oElement = this.element,
-                    oParent,
-                    aXY;
+                    oParent;
 
-
                 if (!oIFrame) {
-
                     if (!m_oIFrameTemplate) {
-    
                         m_oIFrameTemplate = document.createElement("iframe");
 
                         if (this.isSecure) {
-        
                             m_oIFrameTemplate.src = Overlay.IFRAME_SRC;
-        
                         }
 
                         /*
                             Set the opacity of the <iframe> to 0 so that it 
                             doesn't modify the opacity of any transparent 
                             elements that may be on top of it (like a shadow).
                         */
-        
-                        if (YAHOO.env.ua.ie) {
-        
+                        if (UA.ie) {
                             m_oIFrameTemplate.style.filter = "alpha(opacity=0)";
-        
                             /*
                                  Need to set the "frameBorder" property to 0 
                                  supress the default <iframe> border in IE.  
                                  Setting the CSS "border" property alone 
                                  doesn't supress it.
                             */
-        
                             m_oIFrameTemplate.frameBorder = 0;
-        
                         }
                         else {
-        
                             m_oIFrameTemplate.style.opacity = "0";
-                        
                         }
 
                         m_oIFrameTemplate.style.position = "absolute";
                         m_oIFrameTemplate.style.border = "none";
                         m_oIFrameTemplate.style.margin = "0";
                         m_oIFrameTemplate.style.padding = "0";
                         m_oIFrameTemplate.style.display = "none";
-    
+                        m_oIFrameTemplate.tabIndex = -1;
                     }
 
                     oIFrame = m_oIFrameTemplate.cloneNode(false);
-
                     oParent = oElement.parentNode;
 
-                    if (oParent) {
+                    var parentNode = oParent || document.body;
 
-                        oParent.appendChild(oIFrame);
-
-                    } else {
-
-                        document.body.appendChild(oIFrame);
-
-                    }
-                    
+                    this._addToParent(parentNode, oIFrame);
                     this.iframe = oIFrame;
-
                 }
 
-
                 /*
                      Show the <iframe> before positioning it since the "setXY" 
                      method of DOM requires the element be in the document 
                      and visible.
                 */
-
                 this.showIframe();
 
-
                 /*
                      Syncronize the size and position of the <iframe> to that 
                      of the Overlay.
                 */
-                
                 this.syncIframe();
+                this.stackIframe();
 
-
                 // Add event listeners to update the <iframe> when necessary
-
                 if (!this._hasIframeEventListeners) {
-
                     this.showEvent.subscribe(this.showIframe);
                     this.hideEvent.subscribe(this.hideIframe);
                     this.changeContentEvent.subscribe(this.syncIframe);
 
                     this._hasIframeEventListeners = true;
-                    
                 }
-                
             }
 
-
             function onBeforeShow() {
-            
                 createIFrame.call(this);
-        
                 this.beforeShowEvent.unsubscribe(onBeforeShow);
-                
                 this._iframeDeferred = false;
-            
             }
-            
 
             if (bIFrame) { // <iframe> shim is enabled
-                
-                if (this.cfg.getProperty("visible")) {
 
+                if (this.cfg.getProperty("visible")) {
                     createIFrame.call(this);
-                
-                }
-                else {
-
+                } else {
                     if (!this._iframeDeferred) {
-
                         this.beforeShowEvent.subscribe(onBeforeShow);
-
                         this._iframeDeferred = true;
-                    
                     }
-                
                 }
-    
+
             } else {    // <iframe> shim is disabled
-    
                 this.hideIframe();
 
                 if (this._hasIframeEventListeners) {
-
                     this.showEvent.unsubscribe(this.showIframe);
                     this.hideEvent.unsubscribe(this.hideIframe);
                     this.changeContentEvent.unsubscribe(this.syncIframe);
 
                     this._hasIframeEventListeners = false;
-
                 }
-                
             }
-    
         },
-        
-        
+
         /**
+         * Set's the container's XY value from DOM if not already set.
+         * 
+         * Differs from syncPosition, in that the XY value is only sync'd with DOM if 
+         * not already set. The method also refire's the XY config property event, so any
+         * beforeMove, Move event listeners are invoked.
+         * 
+         * @method _primeXYFromDOM
+         * @protected
+         */
+        _primeXYFromDOM : function() {
+            if (YAHOO.lang.isUndefined(this.cfg.getProperty("xy"))) {
+                // Set CFG XY based on DOM XY
+                this.syncPosition();
+                // Account for XY being set silently in syncPosition (no moveTo fired/called)
+                this.cfg.refireEvent("xy");
+                this.beforeShowEvent.unsubscribe(this._primeXYFromDOM);
+            }
+        },
+
+        /**
         * The default event handler fired when the "constraintoviewport" 
         * property is changed.
         * @method configConstrainToViewport
@@ -3198,30 +3249,25 @@
         * this will usually equal the owner.
         */
         configConstrainToViewport: function (type, args, obj) {
-    
             var val = args[0];
-    
+
             if (val) {
-    
-                if (! Config.alreadySubscribed(this.beforeMoveEvent, 
-                    this.enforceConstraints, this)) {
-    
-                    this.beforeMoveEvent.subscribe(this.enforceConstraints, 
-                        this, true);
-    
+                if (! Config.alreadySubscribed(this.beforeMoveEvent, this.enforceConstraints, this)) {
+                    this.beforeMoveEvent.subscribe(this.enforceConstraints, this, true);
                 }
-    
+                if (! Config.alreadySubscribed(this.beforeShowEvent, this._primeXYFromDOM)) {
+                    this.beforeShowEvent.subscribe(this._primeXYFromDOM);
+                }
             } else {
-    
+                this.beforeShowEvent.unsubscribe(this._primeXYFromDOM);
                 this.beforeMoveEvent.unsubscribe(this.enforceConstraints, this);
-    
             }
-    
         },
-        
-        /**
-        * The default event handler fired when the "context" property 
+
+         /**
+        * The default event handler fired when the "context" property
         * is changed.
+        * 
         * @method configContext
         * @param {String} type The CustomEvent type (usually the property name)
         * @param {Object[]} args The CustomEvent arguments. For configuration 
@@ -3230,44 +3276,119 @@
         * this will usually equal the owner.
         */
         configContext: function (type, args, obj) {
-    
+
             var contextArgs = args[0],
                 contextEl,
                 elementMagnetCorner,
-                contextMagnetCorner;
-            
+                contextMagnetCorner,
+                triggers,
+                defTriggers = this.CONTEXT_TRIGGERS;
+
             if (contextArgs) {
-            
+
                 contextEl = contextArgs[0];
                 elementMagnetCorner = contextArgs[1];
                 contextMagnetCorner = contextArgs[2];
-                
+                triggers = contextArgs[3];
+
+                if (defTriggers && defTriggers.length > 0) {
+                    triggers = (triggers || []).concat(defTriggers);
+                }
+
                 if (contextEl) {
-    
                     if (typeof contextEl == "string") {
-    
-                        this.cfg.setProperty("context", 
-                            [document.getElementById(contextEl), 
-                                elementMagnetCorner, contextMagnetCorner], 
+                        this.cfg.setProperty("context", [
+                                document.getElementById(contextEl), 
+                                elementMagnetCorner,
+                                contextMagnetCorner,
+                                triggers ],
                                 true);
-    
                     }
-                    
+
                     if (elementMagnetCorner && contextMagnetCorner) {
-    
                         this.align(elementMagnetCorner, contextMagnetCorner);
-    
                     }
-    
+
+                    if (this._contextTriggers) {
+                        // Unsubscribe Old Set
+                        this._processTriggers(this._contextTriggers, _UNSUBSCRIBE, this._alignOnTrigger);
+                    }
+
+                    if (triggers) {
+                        // Subscribe New Set
+                        this._processTriggers(triggers, _SUBSCRIBE, this._alignOnTrigger);
+                        this._contextTriggers = triggers;
+                    }
                 }
-    
             }
-    
         },
-        
-        
+
+        /**
+         * Custom Event handler for context alignment triggers. Invokes the align method
+         * 
+         * @method _alignOnTrigger
+         * @protected
+         * 
+         * @param {String} type The event type (not used by the default implementation)
+         * @param {Any[]} args The array of arguments for the trigger event (not used by the default implementation)
+         */
+        _alignOnTrigger: function(type, args) {
+            this.align();
+        },
+
+        /**
+         * Helper method to locate the custom event instance for the event name string
+         * passed in. As a convenience measure, any custom events passed in are returned.
+         *
+         * @method _findTriggerCE
+         * @private
+         *
+         * @param {String|CustomEvent} t Either a CustomEvent, or event type (e.g. "windowScroll") for which a 
+         * custom event instance needs to be looked up from the Overlay._TRIGGER_MAP.
+         */
+        _findTriggerCE : function(t) {
+            var tce = null;
+            if (t instanceof CustomEvent) {
+                tce = t;
+            } else if (Overlay._TRIGGER_MAP[t]) {
+                tce = Overlay._TRIGGER_MAP[t];
+            }
+            return tce;
+        },
+
+        /**
+         * Utility method that subscribes or unsubscribes the given 
+         * function from the list of trigger events provided.
+         *
+         * @method _processTriggers
+         * @protected 
+         *
+         * @param {Array[String|CustomEvent]} triggers An array of either CustomEvents, event type strings 
+         * (e.g. "beforeShow", "windowScroll") to/from which the provided function should be 
+         * subscribed/unsubscribed respectively.
+         *
+         * @param {String} mode Either "subscribe" or "unsubscribe", specifying whether or not
+         * we are subscribing or unsubscribing trigger listeners
+         * 
+         * @param {Function} fn The function to be subscribed/unsubscribed to/from the trigger event.
+         * Context is always set to the overlay instance, and no additional object argument 
+         * get passed to the subscribed function.
+         */
+        _processTriggers : function(triggers, mode, fn) {
+            var t, tce;
+
+            for (var i = 0, l = triggers.length; i < l; ++i) {
+                t = triggers[i];
+                tce = this._findTriggerCE(t);
+                if (tce) {
+                    tce[mode](fn, this, true);
+                } else {
+                    this[mode](t, fn);
+                }
+            }
+        },
+
         // END BUILT-IN PROPERTY EVENT HANDLERS //
-        
         /**
         * Aligns the Overlay to its context element using the specified corner 
         * points (represented by the constants TOP_LEFT, TOP_RIGHT, BOTTOM_LEFT, 
@@ -3279,45 +3400,34 @@
         * that the elementAlign corner should stick to.
         */
         align: function (elementAlign, contextAlign) {
-    
+
             var contextArgs = this.cfg.getProperty("context"),
                 me = this,
                 context,
                 element,
                 contextRegion;
-    
-    
+
             function doAlign(v, h) {
     
                 switch (elementAlign) {
     
                 case Overlay.TOP_LEFT:
-    
                     me.moveTo(h, v);
-    
                     break;
     
                 case Overlay.TOP_RIGHT:
-    
                     me.moveTo((h - element.offsetWidth), v);
-    
                     break;
     
                 case Overlay.BOTTOM_LEFT:
-    
                     me.moveTo(h, (v - element.offsetHeight));
-    
                     break;
     
                 case Overlay.BOTTOM_RIGHT:
-    
                     me.moveTo((h - element.offsetWidth), 
                         (v - element.offsetHeight));
-    
                     break;
-    
                 }
-    
             }
     
     
@@ -3328,55 +3438,41 @@
                 me = this;
                 
                 if (! elementAlign) {
-    
                     elementAlign = contextArgs[1];
-    
                 }
                 
                 if (! contextAlign) {
-    
                     contextAlign = contextArgs[2];
-    
                 }
                 
                 if (element && context) {
-    
                     contextRegion = Dom.getRegion(context);
-                    
+
                     switch (contextAlign) {
     
                     case Overlay.TOP_LEFT:
-    
                         doAlign(contextRegion.top, contextRegion.left);
-    
                         break;
     
                     case Overlay.TOP_RIGHT:
-    
                         doAlign(contextRegion.top, contextRegion.right);
-    
                         break;
     
                     case Overlay.BOTTOM_LEFT:
-    
                         doAlign(contextRegion.bottom, contextRegion.left);
-    
                         break;
     
                     case Overlay.BOTTOM_RIGHT:
-    
                         doAlign(contextRegion.bottom, contextRegion.right);
-    
                         break;
-    
                     }
     
                 }
     
             }
             
         },
-        
+
         /**
         * The default event handler executed when the moveEvent is fired, if the 
         * "constraintoviewport" is set to true.
@@ -3388,228 +3484,728 @@
         * this will usually equal the owner.
         */
         enforceConstraints: function (type, args, obj) {
-    
-            var pos = args[0],
-                x = pos[0],
-                y = pos[1],
-                offsetHeight = this.element.offsetHeight,
-                offsetWidth = this.element.offsetWidth,
+            var pos = args[0];
+            
+            var cXY = this.getConstrainedXY(pos[0], pos[1]);
+            this.cfg.setProperty("x", cXY[0], true);
+            this.cfg.setProperty("y", cXY[1], true);
+            this.cfg.setProperty("xy", cXY, true);
+        },
+
+
+        /**
+         * Given x coordinate value, returns the calculated x coordinate required to 
+         * position the Overlay if it is to be constrained to the viewport, based on the 
+         * current element size, viewport dimensions and scroll values.
+         *
+         * @param {Number} x The X coordinate value to be constrained
+         * @return {Number} The constrained x coordinate
+         */		
+        getConstrainedX: function (x) {
+
+            var oOverlay = this,
+                oOverlayEl = oOverlay.element,
+                nOverlayOffsetWidth = oOverlayEl.offsetWidth,
+
+                nViewportOffset = Overlay.VIEWPORT_OFFSET,
                 viewPortWidth = Dom.getViewportWidth(),
-                viewPortHeight = Dom.getViewportHeight(),
                 scrollX = Dom.getDocumentScrollLeft(),
-                scrollY = Dom.getDocumentScrollTop(),
-                topConstraint = scrollY + 10,
-                leftConstraint = scrollX + 10,
-                bottomConstraint = scrollY + viewPortHeight - offsetHeight - 10,
-                rightConstraint = scrollX + viewPortWidth - offsetWidth - 10;
-        
+
+                bCanConstrain = (nOverlayOffsetWidth + nViewportOffset < viewPortWidth),
+
+                aContext = this.cfg.getProperty("context"),
+                oContextEl,
+                nContextElX,
+                nContextElWidth,
+
+                bFlipped = false,
+
+                nLeftRegionWidth,
+                nRightRegionWidth,
+
+                leftConstraint = scrollX + nViewportOffset,
+                rightConstraint = scrollX + viewPortWidth - nOverlayOffsetWidth - nViewportOffset,
+
+                xNew = x,
+
+                oOverlapPositions = {
+
+                    "tltr": true,
+                    "blbr": true,
+                    "brbl": true,
+                    "trtl": true
+                
+                };
+
+
+            var flipHorizontal = function () {
+            
+                var nNewX;
+            
+                if ((oOverlay.cfg.getProperty("x") - scrollX) > nContextElX) {
+                    nNewX = (nContextElX - nOverlayOffsetWidth);
+                }
+                else {
+                    nNewX = (nContextElX + nContextElWidth);
+                }
+                
     
-            if (x < leftConstraint) {
+                oOverlay.cfg.setProperty("x", (nNewX + scrollX), true);
     
-                x = leftConstraint;
+                return nNewX;
     
-            } else if (x > rightConstraint) {
+            };
+
+
+
+            /*
+                 Uses the context element's position to calculate the availble width 
+                 to the right and left of it to display its corresponding Overlay.
+            */
+
+            var getDisplayRegionWidth = function () {
+
+                // The Overlay is to the right of the context element
+
+                if ((oOverlay.cfg.getProperty("x") - scrollX) > nContextElX) {
+                    return (nRightRegionWidth - nViewportOffset);
+                }
+                else {	// The Overlay is to the left of the context element
+                    return (nLeftRegionWidth - nViewportOffset);
+                }
+            
+            };
     
-                x = rightConstraint;
+
+            /*
+                Positions the Overlay to the left or right of the context element so that it remains 
+                inside the viewport.
+            */
     
-            }
+            var setHorizontalPosition = function () {
             
-            if (y < topConstraint) {
+                var nDisplayRegionWidth = getDisplayRegionWidth(),
+                    fnReturnVal;
+
+                if (nOverlayOffsetWidth > nDisplayRegionWidth) {
+        
+                    if (bFlipped) {
+        
+                        /*
+                             All possible positions and values have been 
+                             tried, but none were successful, so fall back 
+                             to the original size and position.
+                        */
     
-                y = topConstraint;
+                        flipHorizontal();
+                        
+                    }
+                    else {
+        
+                        flipHorizontal();
+
+                        bFlipped = true;
+        
+                        fnReturnVal = setHorizontalPosition();
+        
+                    }
+                
+                }
+        
+                return fnReturnVal;
+            
+            };
+
+            // Determine if the current value for the Overlay's "x" configuration property will
+            // result in the Overlay being positioned outside the boundaries of the viewport
+            
+            if (x < leftConstraint || x > rightConstraint) {
+
+                // The current value for the Overlay's "x" configuration property WILL
+                // result in the Overlay being positioned outside the boundaries of the viewport
+
+                if (bCanConstrain) {
+
+                    //	If the "preventcontextoverlap" configuration property is set to "true", 
+                    //	try to flip the Overlay to both keep it inside the boundaries of the 
+                    //	viewport AND from overlaping its context element.
     
-            } else if (y > bottomConstraint) {
-    
-                y = bottomConstraint;
-    
+                    if (this.cfg.getProperty("preventcontextoverlap") && aContext && 
+                        oOverlapPositions[(aContext[1] + aContext[2])]) {
+        
+                        oContextEl = aContext[0];
+                        nContextElX = Dom.getX(oContextEl) - scrollX;
+                        nContextElWidth = oContextEl.offsetWidth;
+                        nLeftRegionWidth = nContextElX;
+                        nRightRegionWidth = (viewPortWidth - (nContextElX + nContextElWidth));
+        
+                        setHorizontalPosition();
+                        
+                        xNew = this.cfg.getProperty("x");
+                    
+                    }
+                    else {
+
+                        if (x < leftConstraint) {
+                            xNew = leftConstraint;
+                        } else if (x > rightConstraint) {
+                            xNew = rightConstraint;
+                        }
+
+                    }
+
+                } else {
+                    //	The "x" configuration property cannot be set to a value that will keep
+                    //	entire Overlay inside the boundary of the viewport.  Therefore, set  
+                    //	the "x" configuration property to scrollY to keep as much of the 
+                    //	Overlay inside the viewport as possible.                
+                    xNew = nViewportOffset + scrollX;
+                }
+
             }
+
+            return xNew;
+        
+        },
+
+
+        /**
+         * Given y coordinate value, returns the calculated y coordinate required to 
+         * position the Overlay if it is to be constrained to the viewport, based on the 
+         * current element size, viewport dimensions and scroll values.
+         *
+         * @param {Number} y The Y coordinate value to be constrained
+         * @return {Number} The constrained y coordinate
+         */		
+        getConstrainedY: function (y) {
+
+            var oOverlay = this,
+                oOverlayEl = oOverlay.element,
+                nOverlayOffsetHeight = oOverlayEl.offsetHeight,
             
-            this.cfg.setProperty("x", x, true);
-            this.cfg.setProperty("y", y, true);
-            this.cfg.setProperty("xy", [x, y], true);
+                nViewportOffset = Overlay.VIEWPORT_OFFSET,
+                viewPortHeight = Dom.getViewportHeight(),
+                scrollY = Dom.getDocumentScrollTop(),
+
+                bCanConstrain = (nOverlayOffsetHeight + nViewportOffset < viewPortHeight),
+
+                aContext = this.cfg.getProperty("context"),
+                oContextEl,
+                nContextElY,
+                nContextElHeight,
+
+                bFlipped = false,
+
+                nTopRegionHeight,
+                nBottomRegionHeight,
+
+                topConstraint = scrollY + nViewportOffset,
+                bottomConstraint = scrollY + viewPortHeight - nOverlayOffsetHeight - nViewportOffset,
+
+                yNew = y,
+                
+                oOverlapPositions = {
+                    "trbr": true,
+                    "tlbl": true,
+                    "bltl": true,
+                    "brtr": true
+                };
+
+
+            var flipVertical = function () {
+
+                var nNewY;
+            
+                // The Overlay is below the context element, flip it above
+                if ((oOverlay.cfg.getProperty("y") - scrollY) > nContextElY) { 
+                    nNewY = (nContextElY - nOverlayOffsetHeight);
+                }
+                else {	// The Overlay is above the context element, flip it below
+                    nNewY = (nContextElY + nContextElHeight);
+                }
     
-        },
+                oOverlay.cfg.setProperty("y", (nNewY + scrollY), true);
+                
+                return nNewY;
+            
+            };
+
+
+            /*
+                 Uses the context element's position to calculate the availble height 
+                 above and below it to display its corresponding Overlay.
+            */
+
+            var getDisplayRegionHeight = function () {
+
+                // The Overlay is below the context element
+                if ((oOverlay.cfg.getProperty("y") - scrollY) > nContextElY) {
+                    return (nBottomRegionHeight - nViewportOffset);				
+                }
+                else {	// The Overlay is above the context element
+                    return (nTopRegionHeight - nViewportOffset);				
+                }
         
+            };
+
+
+            /*
+                Trys to place the Overlay in the best possible position (either above or 
+                below its corresponding context element).
+            */
+        
+            var setVerticalPosition = function () {
+        
+                var nDisplayRegionHeight = getDisplayRegionHeight(),
+                    fnReturnVal;
+                    
+
+                if (nOverlayOffsetHeight > nDisplayRegionHeight) {
+                   
+                    if (bFlipped) {
+        
+                        /*
+                             All possible positions and values for the 
+                             "maxheight" configuration property have been 
+                             tried, but none were successful, so fall back 
+                             to the original size and position.
+                        */
+    
+                        flipVertical();
+                        
+                    }
+                    else {
+        
+                        flipVertical();
+
+                        bFlipped = true;
+        
+                        fnReturnVal = setVerticalPosition();
+        
+                    }
+                
+                }
+        
+                return fnReturnVal;
+        
+            };
+
+
+            // Determine if the current value for the Overlay's "y" configuration property will
+            // result in the Overlay being positioned outside the boundaries of the viewport
+
+            if (y < topConstraint || y  > bottomConstraint) {
+        
+                // The current value for the Overlay's "y" configuration property WILL
+                // result in the Overlay being positioned outside the boundaries of the viewport
+
+                if (bCanConstrain) {	
+
+                    //	If the "preventcontextoverlap" configuration property is set to "true", 
+                    //	try to flip the Overlay to both keep it inside the boundaries of the 
+                    //	viewport AND from overlaping its context element.
+        
+                    if (this.cfg.getProperty("preventcontextoverlap") && aContext && 
+                        oOverlapPositions[(aContext[1] + aContext[2])]) {
+        
+                        oContextEl = aContext[0];
+                        nContextElHeight = oContextEl.offsetHeight;
+                        nContextElY = (Dom.getY(oContextEl) - scrollY);
+        
+                        nTopRegionHeight = nContextElY;
+                        nBottomRegionHeight = (viewPortHeight - (nContextElY + nContextElHeight));
+        
+                        setVerticalPosition();
+        
+                        yNew = oOverlay.cfg.getProperty("y");
+        
+                    }
+                    else {
+
+                        if (y < topConstraint) {
+                            yNew  = topConstraint;
+                        } else if (y  > bottomConstraint) {
+                            yNew  = bottomConstraint;
+                        }
+                    
+                    }
+                
+                }
+                else {
+                
+                    //	The "y" configuration property cannot be set to a value that will keep
+                    //	entire Overlay inside the boundary of the viewport.  Therefore, set  
+                    //	the "y" configuration property to scrollY to keep as much of the 
+                    //	Overlay inside the viewport as possible.
+                
+                    yNew = nViewportOffset + scrollY;
+                }
+        
+            }
+
+            return yNew;
+        },
+
+
         /**
+         * Given x, y coordinate values, returns the calculated coordinates required to 
+         * position the Overlay if it is to be constrained to the viewport, based on the 
+         * current element size, viewport dimensions and scroll values.
+         *
+         * @param {Number} x The X coordinate value to be constrained
+         * @param {Number} y The Y coordinate value to be constrained
+         * @return {Array} The constrained x and y coordinates at index 0 and 1 respectively;
+         */
+        getConstrainedXY: function(x, y) {
+            return [this.getConstrainedX(x), this.getConstrainedY(y)];
+        },
+
+        /**
         * Centers the container in the viewport.
         * @method center
         */
         center: function () {
-    
-            var scrollX = Dom.getDocumentScrollLeft(),
-                scrollY = Dom.getDocumentScrollTop(),
-    
-                viewPortWidth = Dom.getClientWidth(),
-                viewPortHeight = Dom.getClientHeight(),
+
+            var nViewportOffset = Overlay.VIEWPORT_OFFSET,
                 elementWidth = this.element.offsetWidth,
                 elementHeight = this.element.offsetHeight,
-                x = (viewPortWidth / 2) - (elementWidth / 2) + scrollX,
-                y = (viewPortHeight / 2) - (elementHeight / 2) + scrollY;
-            
+                viewPortWidth = Dom.getViewportWidth(),
+                viewPortHeight = Dom.getViewportHeight(),
+                x,
+                y;
+
+            if (elementWidth < viewPortWidth) {
+                x = (viewPortWidth / 2) - (elementWidth / 2) + Dom.getDocumentScrollLeft();
+            } else {
+                x = nViewportOffset + Dom.getDocumentScrollLeft();
+            }
+
+            if (elementHeight < viewPortHeight) {
+                y = (viewPortHeight / 2) - (elementHeight / 2) + Dom.getDocumentScrollTop();
+            } else {
+                y = nViewportOffset + Dom.getDocumentScrollTop();
+            }
+
             this.cfg.setProperty("xy", [parseInt(x, 10), parseInt(y, 10)]);
-            
             this.cfg.refireEvent("iframe");
-    
+
+            if (UA.webkit) {
+                this.forceContainerRedraw();
+            }
         },
-        
+
         /**
         * Synchronizes the Panel's "xy", "x", and "y" properties with the 
         * Panel's position in the DOM. This is primarily used to update  
         * position information during drag & drop.
         * @method syncPosition
         */
         syncPosition: function () {
-    
+
             var pos = Dom.getXY(this.element);
-    
+
             this.cfg.setProperty("x", pos[0], true);
             this.cfg.setProperty("y", pos[1], true);
             this.cfg.setProperty("xy", pos, true);
-    
+
         },
-        
+
         /**
         * Event handler fired when the resize monitor element is resized.
         * @method onDomResize
         * @param {DOMEvent} e The resize DOM event
         * @param {Object} obj The scope object
         */
         onDomResize: function (e, obj) {
-    
+
             var me = this;
-    
+
             Overlay.superclass.onDomResize.call(this, e, obj);
-    
+
             setTimeout(function () {
                 me.syncPosition();
                 me.cfg.refireEvent("iframe");
                 me.cfg.refireEvent("context");
             }, 0);
+        },
+
+        /**
+         * Determines the content box height of the given element (height of the element, without padding or borders) in pixels.
+         *
+         * @method _getComputedHeight
+         * @private
+         * @param {HTMLElement} el The element for which the content height needs to be determined
+         * @return {Number} The content box height of the given element, or null if it could not be determined.
+         */
+        _getComputedHeight : (function() {
+
+            if (document.defaultView && document.defaultView.getComputedStyle) {
+                return function(el) {
+                    var height = null;
+                    if (el.ownerDocument && el.ownerDocument.defaultView) {
+                        var computed = el.ownerDocument.defaultView.getComputedStyle(el, '');
+                        if (computed) {
+                            height = parseInt(computed.height, 10);
+                        }
+                    }
+                    return (Lang.isNumber(height)) ? height : null;
+                };
+            } else {
+                return function(el) {
+                    var height = null;
+                    if (el.style.pixelHeight) {
+                        height = el.style.pixelHeight;
+                    }
+                    return (Lang.isNumber(height)) ? height : null;
+                };
+            }
+        })(),
+
+        /**
+         * autofillheight validator. Verifies that the autofill value is either null 
+         * or one of the strings : "body", "header" or "footer".
+         *
+         * @method _validateAutoFillHeight
+         * @protected
+         * @param {String} val
+         * @return true, if valid, false otherwise
+         */
+        _validateAutoFillHeight : function(val) {
+            return (!val) || (Lang.isString(val) && Overlay.STD_MOD_RE.test(val));
+        },
+
+        /**
+         * The default custom event handler executed when the overlay's height is changed, 
+         * if the autofillheight property has been set.
+         *
+         * @method _autoFillOnHeightChange
+         * @protected
+         * @param {String} type The event type
+         * @param {Array} args The array of arguments passed to event subscribers
+         * @param {HTMLElement} el The header, body or footer element which is to be resized to fill
+         * out the containers height
+         */
+        _autoFillOnHeightChange : function(type, args, el) {
+            var height = this.cfg.getProperty("height");
+            if ((height && height !== "auto") || (height === 0)) {
+                this.fillHeight(el);
+            }
+        },
+
+        /**
+         * Returns the sub-pixel height of the el, using getBoundingClientRect, if available,
+         * otherwise returns the offsetHeight
+         * @method _getPreciseHeight
+         * @private
+         * @param {HTMLElement} el
+         * @return {Float} The sub-pixel height if supported by the browser, else the rounded height.
+         */
+        _getPreciseHeight : function(el) {
+            var height = el.offsetHeight;
+
+            if (el.getBoundingClientRect) {
+                var rect = el.getBoundingClientRect();
+                height = rect.bottom - rect.top;
+            }
+
+            return height;
+        },
+
+        /**
+         * <p>
+         * Sets the height on the provided header, body or footer element to 
+         * fill out the height of the container. It determines the height of the 
+         * containers content box, based on it's configured height value, and 
+         * sets the height of the autofillheight element to fill out any 
+         * space remaining after the other standard module element heights 
+         * have been accounted for.
+         * </p>
+         * <p><strong>NOTE:</strong> This method is not designed to work if an explicit 
+         * height has not been set on the container, since for an "auto" height container, 
+         * the heights of the header/body/footer will drive the height of the container.</p>
+         *
+         * @method fillHeight
+         * @param {HTMLElement} el The element which should be resized to fill out the height
+         * of the container element.
+         */
+        fillHeight : function(el) {
+            if (el) {
+                var container = this.innerElement || this.element,
+                    containerEls = [this.header, this.body, this.footer],
+                    containerEl,
+                    total = 0,
+                    filled = 0,
+                    remaining = 0,
+                    validEl = false;
+
+                for (var i = 0, l = containerEls.length; i < l; i++) {
+                    containerEl = containerEls[i];
+                    if (containerEl) {
+                        if (el !== containerEl) {
+                            filled += this._getPreciseHeight(containerEl);
+                        } else {
+                            validEl = true;
+                        }
+                    }
+                }
+
+                if (validEl) {
+
+                    if (UA.ie || UA.opera) {
+                        // Need to set height to 0, to allow height to be reduced
+                        Dom.setStyle(el, 'height', 0 + 'px');
+                    }
+
+                    total = this._getComputedHeight(container);
+
+                    // Fallback, if we can't get computed value for content height
+                    if (total === null) {
+                        Dom.addClass(container, "yui-override-padding");
+                        total = container.clientHeight; // Content, No Border, 0 Padding (set by yui-override-padding)
+                        Dom.removeClass(container, "yui-override-padding");
+                    }
     
+                    remaining = Math.max(total - filled, 0);
+    
+                    Dom.setStyle(el, "height", remaining + "px");
+    
+                    // Re-adjust height if required, to account for el padding and border
+                    if (el.offsetHeight != remaining) {
+                        remaining = Math.max(remaining - (el.offsetHeight - remaining), 0);
+                    }
+                    Dom.setStyle(el, "height", remaining + "px");
+                }
+            }
         },
 
         /**
         * Places the Overlay on top of all other instances of 
         * YAHOO.widget.Overlay.
         * @method bringToTop
         */
-        bringToTop: function() {
-    
+        bringToTop: function () {
+
             var aOverlays = [],
                 oElement = this.element;
-    
+
             function compareZIndexDesc(p_oOverlay1, p_oOverlay2) {
-        
+
                 var sZIndex1 = Dom.getStyle(p_oOverlay1, "zIndex"),
-        
                     sZIndex2 = Dom.getStyle(p_oOverlay2, "zIndex"),
-        
-                    nZIndex1 = (!sZIndex1 || isNaN(sZIndex1)) ? 
-                        0 : parseInt(sZIndex1, 10),
-        
-                    nZIndex2 = (!sZIndex2 || isNaN(sZIndex2)) ? 
-                        0 : parseInt(sZIndex2, 10);
-        
+
+                    nZIndex1 = (!sZIndex1 || isNaN(sZIndex1)) ? 0 : parseInt(sZIndex1, 10),
+                    nZIndex2 = (!sZIndex2 || isNaN(sZIndex2)) ? 0 : parseInt(sZIndex2, 10);
+
                 if (nZIndex1 > nZIndex2) {
-        
                     return -1;
-        
                 } else if (nZIndex1 < nZIndex2) {
-        
                     return 1;
-        
                 } else {
-        
                     return 0;
-        
                 }
-        
             }
-        
+
             function isOverlayElement(p_oElement) {
-        
-                var oOverlay = Dom.hasClass(p_oElement, Overlay.CSS_OVERLAY),
+
+                var isOverlay = Dom.hasClass(p_oElement, Overlay.CSS_OVERLAY),
                     Panel = YAHOO.widget.Panel;
-            
-                if (oOverlay && !Dom.isAncestor(oElement, oOverlay)) {
-                
+
+                if (isOverlay && !Dom.isAncestor(oElement, p_oElement)) {
                     if (Panel && Dom.hasClass(p_oElement, Panel.CSS_PANEL)) {
-        
                         aOverlays[aOverlays.length] = p_oElement.parentNode;
-                    
-                    }
-                    else {
-        
+                    } else {
                         aOverlays[aOverlays.length] = p_oElement;
-        
                     }
-                
                 }
-            
             }
-            
+
             Dom.getElementsBy(isOverlayElement, "DIV", document.body);
-    
+
             aOverlays.sort(compareZIndexDesc);
-            
+
             var oTopOverlay = aOverlays[0],
                 nTopZIndex;
-            
+
             if (oTopOverlay) {
-    
                 nTopZIndex = Dom.getStyle(oTopOverlay, "zIndex");
-    
-                if (!isNaN(nTopZIndex) && oTopOverlay != oElement) {
-    
-                    this.cfg.setProperty("zindex", 
-                        (parseInt(nTopZIndex, 10) + 2));
-    
+
+                if (!isNaN(nTopZIndex)) {
+                    var bRequiresBump = false;
+
+                    if (oTopOverlay != oElement) {
+                        bRequiresBump = true;
+                    } else if (aOverlays.length > 1) {
+                        var nNextZIndex = Dom.getStyle(aOverlays[1], "zIndex");
+                        // Don't rely on DOM order to stack if 2 overlays are at the same zindex.
+                        if (!isNaN(nNextZIndex) && (nTopZIndex == nNextZIndex)) {
+                            bRequiresBump = true;
+                        }
+                    }
+                    if (bRequiresBump) {
+                        this.cfg.setProperty("zindex", (parseInt(nTopZIndex, 10) + 2));
+                    }
                 }
-            
             }
-        
         },
-        
+
         /**
         * Removes the Overlay element from the DOM and sets all child 
         * elements to null.
         * @method destroy
         */
         destroy: function () {
-    
+
             if (this.iframe) {
-    
                 this.iframe.parentNode.removeChild(this.iframe);
-    
             }
-        
+
             this.iframe = null;
-        
+
             Overlay.windowResizeEvent.unsubscribe(
                 this.doCenterOnDOMEvent, this);
     
             Overlay.windowScrollEvent.unsubscribe(
                 this.doCenterOnDOMEvent, this);
-        
+
+            Module.textResizeEvent.unsubscribe(this._autoFillOnHeightChange);
+
             Overlay.superclass.destroy.call(this);
         },
-        
+
         /**
+         * Can be used to force the container to repaint/redraw it's contents.
+         * <p>
+         * By default applies and then removes a 1px bottom margin through the 
+         * application/removal of a "yui-force-redraw" class.
+         * </p>
+         * <p>
+         * It is currently used by Overlay to force a repaint for webkit 
+         * browsers, when centering.
+         * </p>
+         * @method forceContainerRedraw
+         */
+        forceContainerRedraw : function() {
+            var c = this;
+            Dom.addClass(c.element, "yui-force-redraw");
+            setTimeout(function() {
+                Dom.removeClass(c.element, "yui-force-redraw");
+            }, 0);
+        },
+
+        /**
         * Returns a String representation of the object.
         * @method toString
         * @return {String} The string representation of the Overlay.
         */
         toString: function () {
-    
             return "Overlay " + this.id;
-    
         }
-    
+
     });
-    
 }());
+
 (function () {
-    
+
     /**
     * OverlayManager is used for maintaining the focus status of 
     * multiple Overlays.
@@ -3623,20 +4219,16 @@
     * configuration of the OverlayManager
     */
     YAHOO.widget.OverlayManager = function (userConfig) {
-    
         this.init(userConfig);
-    
     };
 
-
     var Overlay = YAHOO.widget.Overlay,
         Event = YAHOO.util.Event,
         Dom = YAHOO.util.Dom,
         Config = YAHOO.util.Config,
         CustomEvent = YAHOO.util.CustomEvent,
         OverlayManager = YAHOO.widget.OverlayManager;
 
-    
     /**
     * The CSS class representing a focused Overlay
     * @property OverlayManager.CSS_FOCUSED
@@ -3645,29 +4237,28 @@
     * @type String
     */
     OverlayManager.CSS_FOCUSED = "focused";
-    
+
     OverlayManager.prototype = {
-    
+
         /**
         * The class's constructor function
         * @property contructor
         * @type Function
         */
         constructor: OverlayManager,
-        
+
         /**
         * The array of Overlays that are currently registered
         * @property overlays
         * @type YAHOO.widget.Overlay[]
         */
         overlays: null,
-        
+
         /**
         * Initializes the default configuration of the OverlayManager
         * @method initDefaultConfig
         */
         initDefaultConfig: function () {
-        
             /**
             * The collection of registered Overlays in use by 
             * the OverlayManager
@@ -3676,17 +4267,16 @@
             * @default null
             */
             this.cfg.addProperty("overlays", { suppressEvent: true } );
-        
+
             /**
             * The default DOM event that should be used to focus an Overlay
             * @config focusevent
             * @type String
             * @default "mousedown"
             */
             this.cfg.addProperty("focusevent", { value: "mousedown" } );
-        
         },
-        
+
         /**
         * Initializes the OverlayManager
         * @method init
@@ -3704,22 +4294,22 @@
             * @type Config
             */
             this.cfg = new Config(this);
-        
+
             this.initDefaultConfig();
-        
+
             if (userConfig) {
                 this.cfg.applyConfig(userConfig, true);
             }
             this.cfg.fireQueue();
-        
+
             /**
             * The currently activated Overlay
             * @property activeOverlay
             * @private
             * @type YAHOO.widget.Overlay
             */
             var activeOverlay = null;
-        
+
             /**
             * Returns the currently focused Overlay
             * @method getActive
@@ -3728,141 +4318,137 @@
             this.getActive = function () {
                 return activeOverlay;
             };
-        
+
             /**
             * Focuses the specified Overlay
             * @method focus
             * @param {Overlay} overlay The Overlay to focus
             * @param {String} overlay The id of the Overlay to focus
             */
             this.focus = function (overlay) {
-        
                 var o = this.find(overlay);
-        
                 if (o) {
-        
-                    if (activeOverlay != o) {
-        
-                        if (activeOverlay) {
-        
-                            activeOverlay.blur();
-        
-                        }
-        
-                        this.bringToTop(o);
-                        
-                        activeOverlay = o;
-        
-                        Dom.addClass(activeOverlay.element, 
-                            OverlayManager.CSS_FOCUSED);
-
-                        o.focusEvent.fire();
-                        
-                    }
-        
+                    o.focus();
                 }
-        
             };
-        
+
             /**
             * Removes the specified Overlay from the manager
             * @method remove
             * @param {Overlay} overlay The Overlay to remove
             * @param {String} overlay The id of the Overlay to remove
             */
             this.remove = function (overlay) {
-    
-                var o = this.find(overlay),
-                    originalZ;
-        
-                if (o) {
 
+                var o = this.find(overlay), 
+                        originalZ;
+
+                if (o) {
                     if (activeOverlay == o) {
-                    
                         activeOverlay = null;
-                    
                     }
 
-                    originalZ = Dom.getStyle(o.element, "zIndex");
+                    var bDestroyed = (o.element === null && o.cfg === null) ? true : false;
 
-                    o.cfg.setProperty("zIndex", -1000, true);
+                    if (!bDestroyed) {
+                        // Set it's zindex so that it's sorted to the end.
+                        originalZ = Dom.getStyle(o.element, "zIndex");
+                        o.cfg.setProperty("zIndex", -1000, true);
+                    }
 
                     this.overlays.sort(this.compareZIndexDesc);
+                    this.overlays = this.overlays.slice(0, (this.overlays.length - 1));
 
-                    this.overlays = 
-                        this.overlays.slice(0, (this.overlays.length - 1));
-        
                     o.hideEvent.unsubscribe(o.blur);
                     o.destroyEvent.unsubscribe(this._onOverlayDestroy, o);
-        
-                    if (o.element) {
-        
-                        Event.removeListener(o.element, 
-                            this.cfg.getProperty("focusevent"), 
-                            this._onOverlayElementFocus);
-        
+                    o.focusEvent.unsubscribe(this._onOverlayFocusHandler, o);
+                    o.blurEvent.unsubscribe(this._onOverlayBlurHandler, o);
+
+                    if (!bDestroyed) {
+                        Event.removeListener(o.element, this.cfg.getProperty("focusevent"), this._onOverlayElementFocus);
+                        o.cfg.setProperty("zIndex", originalZ, true);
+                        o.cfg.setProperty("manager", null);
                     }
-        
-                    o.cfg.setProperty("zIndex", originalZ, true);
-                    o.cfg.setProperty("manager", null);
-        
-                    o.focusEvent.unsubscribeAll();
-                    o.blurEvent.unsubscribeAll();
-        
-                    o.focusEvent = null;
-                    o.blurEvent = null;
-        
-                    o.focus = null;
-                    o.blur = null;
-                }
 
+                    /* _managed Flag for custom or existing. Don't want to remove existing */
+                    if (o.focusEvent._managed) { o.focusEvent = null; }
+                    if (o.blurEvent._managed) { o.blurEvent = null; }
+
+                    if (o.focus._managed) { o.focus = null; }
+                    if (o.blur._managed) { o.blur = null; }
+                }
             };
-        
+
             /**
             * Removes focus from all registered Overlays in the manager
             * @method blurAll
             */
             this.blurAll = function () {
-    
+
                 var nOverlays = this.overlays.length,
                     i;
 
                 if (nOverlays > 0) {
-
                     i = nOverlays - 1;
-                    
                     do {
-
-                        this.overlays[i].blur();                    
-                    
+                        this.overlays[i].blur();
                     }
                     while(i--);
-                
                 }
-    
             };
-        
-        
-            this._onOverlayBlur = function (p_sType, p_aArgs) {
 
-                activeOverlay = null;
+            /**
+             * Updates the state of the OverlayManager and overlay, as a result of the overlay
+             * being blurred.
+             * 
+             * @method _manageBlur
+             * @param {Overlay} overlay The overlay instance which got blurred.
+             * @protected
+             */
+            this._manageBlur = function (overlay) {
+                var changed = false;
+                if (activeOverlay == overlay) {
+                    Dom.removeClass(activeOverlay.element, OverlayManager.CSS_FOCUSED);
+                    activeOverlay = null;
+                    changed = true;
+                }
+                return changed;
+            };
 
+            /**
+             * Updates the state of the OverlayManager and overlay, as a result of the overlay 
+             * receiving focus.
+             *
+             * @method _manageFocus
+             * @param {Overlay} overlay The overlay instance which got focus.
+             * @protected
+             */
+            this._manageFocus = function(overlay) {
+                var changed = false;
+                if (activeOverlay != overlay) {
+                    if (activeOverlay) {
+                        activeOverlay.blur();
+                    }
+                    activeOverlay = overlay;
+                    this.bringToTop(activeOverlay);
+                    Dom.addClass(activeOverlay.element, OverlayManager.CSS_FOCUSED);
+                    changed = true;
+                }
+                return changed;
             };
-        
-        
+
             var overlays = this.cfg.getProperty("overlays");
-        
+
             if (! this.overlays) {
                 this.overlays = [];
             }
-        
+
             if (overlays) {
                 this.register(overlays);
                 this.overlays.sort(this.compareZIndexDesc);
             }
         },
-        
-        
+
         /**
         * @method _onOverlayElementFocus
         * @description Event handler for the DOM event that is used to focus 
@@ -3873,26 +4459,17 @@
         * object passed back by the event utility (Event).
         */
         _onOverlayElementFocus: function (p_oEvent) {
-        
+
             var oTarget = Event.getTarget(p_oEvent),
                 oClose = this.close;
-        
-            
-            if (oClose && (oTarget == oClose || 
-                    Dom.isAncestor(oClose, oTarget))) {
-            
+
+            if (oClose && (oTarget == oClose || Dom.isAncestor(oClose, oTarget))) {
                 this.blur();
-            
-            }
-            else {
-            
+            } else {
                 this.focus();
-            
             }
-        
         },
-        
-        
+
         /**
         * @method _onOverlayDestroy
         * @description "destroy" event handler for the Overlay.
@@ -3901,115 +4478,194 @@
         * that was fired.
         * @param {Array} p_aArgs Array of arguments sent when the event 
         * was fired.
-        * @param {Overlay} p_oOverlay Object representing the menu that 
+        * @param {Overlay} p_oOverlay Object representing the overlay that 
         * fired the event.
         */
         _onOverlayDestroy: function (p_sType, p_aArgs, p_oOverlay) {
-        
             this.remove(p_oOverlay);
-        
         },
-        
+
         /**
-        * Registers an Overlay or an array of Overlays with the manager. Upon 
-        * registration, the Overlay receives functions for focus and blur, 
-        * along with CustomEvents for each.
-        * @method register
-        * @param {Overlay} overlay  An Overlay to register with the manager.
-        * @param {Overlay[]} overlay  An array of Overlays to register with 
-        * the manager.
-        * @return {Boolean} True if any Overlays are registered.
+        * @method _onOverlayFocusHandler
+        *
+        * focusEvent Handler, used to delegate to _manageFocus with the 
+        * correct arguments.
+        *
+        * @private
+        * @param {String} p_sType String representing the name of the event  
+        * that was fired.
+        * @param {Array} p_aArgs Array of arguments sent when the event 
+        * was fired.
+        * @param {Overlay} p_oOverlay Object representing the overlay that 
+        * fired the event.
         */
-        register: function (overlay) {
-        
-            var mgr = this,
-                zIndex,
-                regcount,
-                i,
-                nOverlays;
-        
-            if (overlay instanceof Overlay) {
+        _onOverlayFocusHandler: function(p_sType, p_aArgs, p_oOverlay) {
+            this._manageFocus(p_oOverlay);
+        },
 
-                overlay.cfg.addProperty("manager", { value: this } );
-        
+        /**
+        * @method _onOverlayBlurHandler
+        *
+        * blurEvent Handler, used to delegate to _manageBlur with the 
+        * correct arguments.
+        *
+        * @private
+        * @param {String} p_sType String representing the name of the event  
+        * that was fired.
+        * @param {Array} p_aArgs Array of arguments sent when the event 
+        * was fired.
+        * @param {Overlay} p_oOverlay Object representing the overlay that 
+        * fired the event.
+        */
+        _onOverlayBlurHandler: function(p_sType, p_aArgs, p_oOverlay) {
+            this._manageBlur(p_oOverlay);
+        },
+
+        /**
+         * Subscribes to the Overlay based instance focusEvent, to allow the OverlayManager to
+         * monitor focus state.
+         * 
+         * If the instance already has a focusEvent (e.g. Menu), OverlayManager will subscribe 
+         * to the existing focusEvent, however if a focusEvent or focus method does not exist
+         * on the instance, the _bindFocus method will add them, and the focus method will 
+         * update the OverlayManager's state directly.
+         * 
+         * @method _bindFocus
+         * @param {Overlay} overlay The overlay for which focus needs to be managed
+         * @protected
+         */
+        _bindFocus : function(overlay) {
+            var mgr = this;
+
+            if (!overlay.focusEvent) {
                 overlay.focusEvent = overlay.createEvent("focus");
                 overlay.focusEvent.signature = CustomEvent.LIST;
-        
-                overlay.blurEvent = overlay.createEvent("blur");
-                overlay.blurEvent.signature = CustomEvent.LIST;
-        
+                overlay.focusEvent._managed = true;
+            } else {
+                overlay.focusEvent.subscribe(mgr._onOverlayFocusHandler, overlay, mgr);
+            }
+
+            if (!overlay.focus) {
+                Event.on(overlay.element, mgr.cfg.getProperty("focusevent"), mgr._onOverlayElementFocus, null, overlay);
                 overlay.focus = function () {
-                    mgr.focus(this);
+                    if (mgr._manageFocus(this)) {
+                        // For Panel/Dialog
+                        if (this.cfg.getProperty("visible") && this.focusFirst) {
+                            this.focusFirst();
+                        }
+                        this.focusEvent.fire();
+                    }
                 };
-        
-                overlay.blur = function () {
-    
-                    if (mgr.getActive() == this) {
+                overlay.focus._managed = true;
+            }
+        },
 
-                        Dom.removeClass(this.element, 
-                            OverlayManager.CSS_FOCUSED);
+        /**
+         * Subscribes to the Overlay based instance's blurEvent to allow the OverlayManager to
+         * monitor blur state.
+         *
+         * If the instance already has a blurEvent (e.g. Menu), OverlayManager will subscribe 
+         * to the existing blurEvent, however if a blurEvent or blur method does not exist
+         * on the instance, the _bindBlur method will add them, and the blur method 
+         * update the OverlayManager's state directly.
+         *
+         * @method _bindBlur
+         * @param {Overlay} overlay The overlay for which blur needs to be managed
+         * @protected
+         */
+        _bindBlur : function(overlay) {
+            var mgr = this;
 
-                        this.blurEvent.fire();
+            if (!overlay.blurEvent) {
+                overlay.blurEvent = overlay.createEvent("blur");
+                overlay.blurEvent.signature = CustomEvent.LIST;
+                overlay.focusEvent._managed = true;
+            } else {
+                overlay.blurEvent.subscribe(mgr._onOverlayBlurHandler, overlay, mgr);
+            }
 
+            if (!overlay.blur) {
+                overlay.blur = function () {
+                    if (mgr._manageBlur(this)) {
+                        this.blurEvent.fire();
                     }
-
                 };
-        
-                overlay.blurEvent.subscribe(mgr._onOverlayBlur);
-        
-                overlay.hideEvent.subscribe(overlay.blur);
-                
-                overlay.destroyEvent.subscribe(this._onOverlayDestroy, 
-                    overlay, this);
-        
-                Event.on(overlay.element, this.cfg.getProperty("focusevent"), 
-                    this._onOverlayElementFocus, null, overlay);
-        
-                zIndex = Dom.getStyle(overlay.element, "zIndex");
+                overlay.blur._managed = true;
+            }
 
-                if (!isNaN(zIndex)) {
+            overlay.hideEvent.subscribe(overlay.blur);
+        },
 
-                    overlay.cfg.setProperty("zIndex", parseInt(zIndex, 10));
+        /**
+         * Subscribes to the Overlay based instance's destroyEvent, to allow the Overlay
+         * to be removed for the OverlayManager when destroyed.
+         * 
+         * @method _bindDestroy
+         * @param {Overlay} overlay The overlay instance being managed
+         * @protected
+         */
+        _bindDestroy : function(overlay) {
+            var mgr = this;
+            overlay.destroyEvent.subscribe(mgr._onOverlayDestroy, overlay, mgr);
+        },
 
-                } else {
+        /**
+         * Ensures the zIndex configuration property on the managed overlay based instance
+         * is set to the computed zIndex value from the DOM (with "auto" translating to 0).
+         *
+         * @method _syncZIndex
+         * @param {Overlay} overlay The overlay instance being managed
+         * @protected
+         */
+        _syncZIndex : function(overlay) {
+            var zIndex = Dom.getStyle(overlay.element, "zIndex");
+            if (!isNaN(zIndex)) {
+                overlay.cfg.setProperty("zIndex", parseInt(zIndex, 10));
+            } else {
+                overlay.cfg.setProperty("zIndex", 0);
+            }
+        },
 
-                    overlay.cfg.setProperty("zIndex", 0);
+        /**
+        * Registers an Overlay or an array of Overlays with the manager. Upon 
+        * registration, the Overlay receives functions for focus and blur, 
+        * along with CustomEvents for each.
+        *
+        * @method register
+        * @param {Overlay} overlay  An Overlay to register with the manager.
+        * @param {Overlay[]} overlay  An array of Overlays to register with 
+        * the manager.
+        * @return {boolean} true if any Overlays are registered.
+        */
+        register: function (overlay) {
 
-                }
-        
+            var registered = false,
+                i,
+                n;
 
-                this.overlays.push(overlay);
+            if (overlay instanceof Overlay) {
 
+                overlay.cfg.addProperty("manager", { value: this } );
+
+                this._bindFocus(overlay);
+                this._bindBlur(overlay);
+                this._bindDestroy(overlay);
+                this._syncZIndex(overlay);
+
+                this.overlays.push(overlay);
                 this.bringToTop(overlay);
 
-                return true;
+                registered = true;
 
             } else if (overlay instanceof Array) {
 
-                regcount = 0;
-                nOverlays = overlay.length;
-
-                for (i = 0; i < nOverlays; i++) {
-
-                    if (this.register(overlay[i])) {
-
-                        regcount++;
-
-                    }
+                for (i = 0, n = overlay.length; i < n; i++) {
+                    registered = this.register(overlay[i]) || registered;
                 }
 
-                if (regcount > 0) {
-
-                    return true;
-
-                }
-
-            } else {
-
-                return false;
-
             }
 
+            return registered;
         },
 
         /**
@@ -4031,30 +4687,36 @@
             if (oOverlay) {
 
                 aOverlays = this.overlays;
-
                 aOverlays.sort(this.compareZIndexDesc);
-                
+
                 oTopOverlay = aOverlays[0];
-                
-                if (oTopOverlay) {
 
+                if (oTopOverlay) {
                     nTopZIndex = Dom.getStyle(oTopOverlay.element, "zIndex");
-    
-                    if (!isNaN(nTopZIndex) && oTopOverlay != oOverlay) {
-    
-                        oOverlay.cfg.setProperty("zIndex", 
-                            (parseInt(nTopZIndex, 10) + 2));
-    
+
+                    if (!isNaN(nTopZIndex)) {
+
+                        var bRequiresBump = false;
+
+                        if (oTopOverlay !== oOverlay) {
+                            bRequiresBump = true;
+                        } else if (aOverlays.length > 1) {
+                            var nNextZIndex = Dom.getStyle(aOverlays[1].element, "zIndex");
+                            // Don't rely on DOM order to stack if 2 overlays are at the same zindex.
+                            if (!isNaN(nNextZIndex) && (nTopZIndex == nNextZIndex)) {
+                                bRequiresBump = true;
+                            }
+                        }
+
+                        if (bRequiresBump) {
+                            oOverlay.cfg.setProperty("zindex", (parseInt(nTopZIndex, 10) + 2));
+                        }
                     }
-    
                     aOverlays.sort(this.compareZIndexDesc);
-                
                 }
-
             }
-        
         },
-        
+
         /**
         * Attempts to locate an Overlay by instance or ID.
         * @method find
@@ -4064,49 +4726,27 @@
         * cannot be located.
         */
         find: function (overlay) {
-        
-            var aOverlays = this.overlays,
-                nOverlays = aOverlays.length,
+
+            var isInstance = overlay instanceof Overlay,
+                overlays = this.overlays,
+                n = overlays.length,
+                found = null,
+                o,
                 i;
 
-            if (nOverlays > 0) {
-
-                i = nOverlays - 1;
-
-                if (overlay instanceof Overlay) {
-
-                    do {
-
-                        if (aOverlays[i] == overlay) {
-
-                            return aOverlays[i];
-
-                        }
-                    
+            if (isInstance || typeof overlay == "string") {
+                for (i = n-1; i >= 0; i--) {
+                    o = overlays[i];
+                    if ((isInstance && (o === overlay)) || (o.id == overlay)) {
+                        found = o;
+                        break;
                     }
-                    while(i--);
-
-                } else if (typeof overlay == "string") {
-
-                    do {
-
-                        if (aOverlays[i].id == overlay) {
-
-                            return aOverlays[i];
-
-                        }
-
-                    }
-                    while(i--);
-
                 }
-
-                return null;
-            
             }
 
+            return found;
         },
-        
+
         /**
         * Used for sorting the manager's Overlays by z-index.
         * @method compareZIndexDesc
@@ -4115,69 +4755,53 @@
         * fall in the stacking order.
         */
         compareZIndexDesc: function (o1, o2) {
-    
-            var zIndex1 = o1.cfg.getProperty("zIndex"),
-                zIndex2 = o2.cfg.getProperty("zIndex");
-        
-            if (zIndex1 > zIndex2) {
+
+            var zIndex1 = (o1.cfg) ? o1.cfg.getProperty("zIndex") : null, // Sort invalid (destroyed)
+                zIndex2 = (o2.cfg) ? o2.cfg.getProperty("zIndex") : null; // objects at bottom.
+
+            if (zIndex1 === null && zIndex2 === null) {
+                return 0;
+            } else if (zIndex1 === null){
+                return 1;
+            } else if (zIndex2 === null) {
                 return -1;
+            } else if (zIndex1 > zIndex2) {
+                return -1;
             } else if (zIndex1 < zIndex2) {
                 return 1;
             } else {
                 return 0;
             }
         },
-        
+
         /**
         * Shows all Overlays in the manager.
         * @method showAll
         */
         showAll: function () {
-        
-            var aOverlays = this.overlays,
-                nOverlays = aOverlays.length,
+            var overlays = this.overlays,
+                n = overlays.length,
                 i;
 
-            if (nOverlays > 0) {
-            
-                i = nOverlays - 1;
-                
-                do {
-
-                    aOverlays[i].show();
-                
-                }
-                while(i--);
-            
+            for (i = n - 1; i >= 0; i--) {
+                overlays[i].show();
             }
-    
         },
-        
+
         /**
         * Hides all Overlays in the manager.
         * @method hideAll
         */
         hideAll: function () {
-        
-            var aOverlays = this.overlays,
-                nOverlays = aOverlays.length,
+            var overlays = this.overlays,
+                n = overlays.length,
                 i;
 
-            if (nOverlays > 0) {
-            
-                i = nOverlays - 1;
-                
-                do {
-
-                    aOverlays[i].hide();
-                
-                }
-                while(i--);
-            
+            for (i = n - 1; i >= 0; i--) {
+                overlays[i].hide();
             }
-    
         },
-        
+
         /**
         * Returns a string representation of the object.
         * @method toString
@@ -4186,10 +4810,9 @@
         toString: function () {
             return "OverlayManager";
         }
-    
     };
-
 }());
+
 (function () {
 
     /**
@@ -4207,19 +4830,19 @@
     * documentation for more details.
     */
     YAHOO.widget.Tooltip = function (el, userConfig) {
-    
         YAHOO.widget.Tooltip.superclass.constructor.call(this, el, userConfig);
-    
     };
 
-
     var Lang = YAHOO.lang,
         Event = YAHOO.util.Event,
+        CustomEvent = YAHOO.util.CustomEvent,
         Dom = YAHOO.util.Dom,
         Tooltip = YAHOO.widget.Tooltip,
-    
+        UA = YAHOO.env.ua,
+        bIEQuirks = (UA.ie && (UA.ie <= 6 || document.compatMode == "BackCompat")),
+
         m_oShadowTemplate,
-        
+
         /**
         * Constant representing the Tooltip's configuration properties
         * @property DEFAULT_CONFIG
@@ -4228,44 +4851,61 @@
         * @type Object
         */
         DEFAULT_CONFIG = {
-        
+
             "PREVENT_OVERLAP": { 
                 key: "preventoverlap", 
                 value: true, 
                 validator: Lang.isBoolean, 
                 supercedes: ["x", "y", "xy"] 
             },
-        
+
             "SHOW_DELAY": { 
                 key: "showdelay", 
                 value: 200, 
                 validator: Lang.isNumber 
             }, 
-        
+
             "AUTO_DISMISS_DELAY": { 
                 key: "autodismissdelay", 
                 value: 5000, 
                 validator: Lang.isNumber 
             }, 
-        
+
             "HIDE_DELAY": { 
                 key: "hidedelay", 
                 value: 250, 
                 validator: Lang.isNumber 
             }, 
-        
+
             "TEXT": { 
                 key: "text", 
                 suppressEvent: true 
             }, 
-        
+
             "CONTAINER": { 
                 key: "container"
+            },
+
+            "DISABLED": {
+                key: "disabled",
+                value: false,
+                suppressEvent: true
             }
-        
+        },
+
+        /**
+        * Constant representing the name of the Tooltip's events
+        * @property EVENT_TYPES
+        * @private
+        * @final
+        * @type Object
+        */
+        EVENT_TYPES = {
+            "CONTEXT_MOUSE_OVER": "contextMouseOver",
+            "CONTEXT_MOUSE_OUT": "contextMouseOut",
+            "CONTEXT_TRIGGER": "contextTrigger"
         };
 
-    
     /**
     * Constant representing the Tooltip CSS class
     * @property YAHOO.widget.Tooltip.CSS_TOOLTIP
@@ -4275,45 +4915,34 @@
     */
     Tooltip.CSS_TOOLTIP = "yui-tt";
 
+    function restoreOriginalWidth(sOriginalWidth, sForcedWidth) {
 
-    /* 
-        "hide" event handler that sets a Tooltip instance's "width"
-        configuration property back to its original value before 
-        "setWidthToOffsetWidth" was called.
-    */
-    
-    function restoreOriginalWidth(p_sType, p_aArgs, p_oObject) {
-
-        var sOriginalWidth = p_oObject[0],
-            sNewWidth = p_oObject[1],
-            oConfig = this.cfg,
+        var oConfig = this.cfg,
             sCurrentWidth = oConfig.getProperty("width");
 
-        if (sCurrentWidth == sNewWidth) {
-            
+        if (sCurrentWidth == sForcedWidth) {
             oConfig.setProperty("width", sOriginalWidth);
-        
         }
-
-        this.unsubscribe("hide", this._onHide, p_oObject);
-    
     }
 
     /* 
-        "beforeShow" event handler that sets a Tooltip instance's "width"
+        changeContent event handler that sets a Tooltip instance's "width"
         configuration property to the value of its root HTML 
-        elements's offsetWidth
+        elements's offsetWidth if a specific width has not been set.
     */
 
     function setWidthToOffsetWidth(p_sType, p_aArgs) {
 
+        if ("_originalWidth" in this) {
+            restoreOriginalWidth.call(this, this._originalWidth, this._forcedWidth);
+        }
+
         var oBody = document.body,
             oConfig = this.cfg,
             sOriginalWidth = oConfig.getProperty("width"),
             sNewWidth,
             oClone;
 
-        
         if ((!sOriginalWidth || sOriginalWidth == "auto") && 
             (oConfig.getProperty("container") != oBody || 
             oConfig.getProperty("x") >= Dom.getViewportWidth() || 
@@ -4323,47 +4952,36 @@
             oClone.style.visibility = "hidden";
             oClone.style.top = "0px";
             oClone.style.left = "0px";
-            
+
             oBody.appendChild(oClone);
 
             sNewWidth = (oClone.offsetWidth + "px");
-            
+
             oBody.removeChild(oClone);
-            
             oClone = null;
 
             oConfig.setProperty("width", sNewWidth);
-            
             oConfig.refireEvent("xy");
-            
-            this.subscribe("hide", restoreOriginalWidth, 
-                [(sOriginalWidth || ""), sNewWidth]);
-        
-        }
 
+            this._originalWidth = sOriginalWidth || "";
+            this._forcedWidth = sNewWidth;
+        }
     }
 
-
     // "onDOMReady" that renders the ToolTip
 
     function onDOMReady(p_sType, p_aArgs, p_oObject) {
-    
         this.render(p_oObject);
-    
     }
 
-
     //  "init" event handler that automatically renders the Tooltip
 
     function onInit() {
-
         Event.onDOMReady(onDOMReady, this.cfg.getProperty("container"), this);
-
     }
 
-    
     YAHOO.extend(Tooltip, YAHOO.widget.Overlay, { 
-    
+
         /**
         * The Tooltip initialization method. This method is automatically 
         * called by the constructor. A Tooltip is automatically rendered by 
@@ -4377,33 +4995,94 @@
         * See configuration documentation for more details.
         */
         init: function (el, userConfig) {
-    
-    
+
+
             Tooltip.superclass.init.call(this, el);
-    
+
             this.beforeInitEvent.fire(Tooltip);
-    
+
             Dom.addClass(this.element, Tooltip.CSS_TOOLTIP);
-    
-            if (userConfig) {
 
+            if (userConfig) {
                 this.cfg.applyConfig(userConfig, true);
-
             }
-    
+
             this.cfg.queueProperty("visible", false);
             this.cfg.queueProperty("constraintoviewport", true);
-    
+
             this.setBody("");
 
-            this.subscribe("beforeShow", setWidthToOffsetWidth);
+            this.subscribe("changeContent", setWidthToOffsetWidth);
             this.subscribe("init", onInit);
             this.subscribe("render", this.onRender);
-    
+
             this.initEvent.fire(Tooltip);
+        },
 
+        /**
+        * Initializes the custom events for Tooltip
+        * @method initEvents
+        */
+        initEvents: function () {
+
+            Tooltip.superclass.initEvents.call(this);
+            var SIGNATURE = CustomEvent.LIST;
+
+            /**
+            * CustomEvent fired when user mouses over a context element. Returning false from
+            * a subscriber to this event will prevent the tooltip from being displayed for
+            * the current context element.
+            * 
+            * @event contextMouseOverEvent
+            * @param {HTMLElement} context The context element which the user just moused over
+            * @param {DOMEvent} e The DOM event object, associated with the mouse over
+            */
+            this.contextMouseOverEvent = this.createEvent(EVENT_TYPES.CONTEXT_MOUSE_OVER);
+            this.contextMouseOverEvent.signature = SIGNATURE;
+
+            /**
+            * CustomEvent fired when the user mouses out of a context element.
+            * 
+            * @event contextMouseOutEvent
+            * @param {HTMLElement} context The context element which the user just moused out of
+            * @param {DOMEvent} e The DOM event object, associated with the mouse out
+            */
+            this.contextMouseOutEvent = this.createEvent(EVENT_TYPES.CONTEXT_MOUSE_OUT);
+            this.contextMouseOutEvent.signature = SIGNATURE;
+
+            /**
+            * CustomEvent fired just before the tooltip is displayed for the current context.
+            * <p>
+            *  You can subscribe to this event if you need to set up the text for the 
+            *  tooltip based on the context element for which it is about to be displayed.
+            * </p>
+            * <p>This event differs from the beforeShow event in following respects:</p>
+            * <ol>
+            *   <li>
+            *    When moving from one context element to another, if the tooltip is not
+            *    hidden (the <code>hidedelay</code> is not reached), the beforeShow and Show events will not
+            *    be fired when the tooltip is displayed for the new context since it is already visible.
+            *    However the contextTrigger event is always fired before displaying the tooltip for
+            *    a new context.
+            *   </li>
+            *   <li>
+            *    The trigger event provides access to the context element, allowing you to 
+            *    set the text of the tooltip based on context element for which the tooltip is
+            *    triggered.
+            *   </li>
+            * </ol>
+            * <p>
+            *  It is not possible to prevent the tooltip from being displayed
+            *  using this event. You can use the contextMouseOverEvent if you need to prevent
+            *  the tooltip from being displayed.
+            * </p>
+            * @event contextTriggerEvent
+            * @param {HTMLElement} context The context element for which the tooltip is triggered
+            */
+            this.contextTriggerEvent = this.createEvent(EVENT_TYPES.CONTEXT_TRIGGER);
+            this.contextTriggerEvent.signature = SIGNATURE;
         },
-        
+
         /**
         * Initializes the class's configurable properties which can be 
         * changed using the Overlay's Config object (cfg).
@@ -4412,7 +5091,7 @@
         initDefaultConfig: function () {
 
             Tooltip.superclass.initDefaultConfig.call(this);
-        
+
             /**
             * Specifies whether the Tooltip should be kept from overlapping 
             * its context element.
@@ -4425,7 +5104,7 @@
                 validator: DEFAULT_CONFIG.PREVENT_OVERLAP.validator, 
                 supercedes: DEFAULT_CONFIG.PREVENT_OVERLAP.supercedes
             });
-        
+
             /**
             * The number of milliseconds to wait before showing a Tooltip 
             * on mouseover.
@@ -4438,7 +5117,7 @@
                 value: 200, 
                 validator: DEFAULT_CONFIG.SHOW_DELAY.validator
             });
-        
+
             /**
             * The number of milliseconds to wait before automatically 
             * dismissing a Tooltip after the mouse has been resting on the 
@@ -4452,10 +5131,10 @@
                 value: DEFAULT_CONFIG.AUTO_DISMISS_DELAY.value,
                 validator: DEFAULT_CONFIG.AUTO_DISMISS_DELAY.validator
             });
-        
+
             /**
             * The number of milliseconds to wait before hiding a Tooltip 
-            * on mouseover.
+            * after mouseout.
             * @config hidedelay
             * @type Number
             * @default 250
@@ -4465,9 +5144,9 @@
                 value: DEFAULT_CONFIG.HIDE_DELAY.value, 
                 validator: DEFAULT_CONFIG.HIDE_DELAY.validator
             });
-        
+
             /**
-            * Specifies the Tooltip's text.
+            * Specifies the Tooltip's text. 
             * @config text
             * @type String
             * @default null
@@ -4488,8 +5167,24 @@
                 handler: this.configContainer,
                 value: document.body
             });
-        
+
             /**
+            * Specifies whether or not the tooltip is disabled. Disabled tooltips
+            * will not be displayed. If the tooltip is driven by the title attribute
+            * of the context element, the title attribute will still be removed for 
+            * disabled tooltips, to prevent default tooltip behavior.
+            * 
+            * @config disabled
+            * @type Boolean
+            * @default false
+            */
+            this.cfg.addProperty(DEFAULT_CONFIG.DISABLED.key, {
+                handler: this.configContainer,
+                value: DEFAULT_CONFIG.DISABLED.value,
+                supressEvent: DEFAULT_CONFIG.DISABLED.suppressEvent
+            });
+
+            /**
             * Specifies the element or elements that the Tooltip should be 
             * anchored to on mouseover.
             * @config context
@@ -4547,16 +5242,11 @@
         * this will usually equal the owner.
         */
         configContainer: function (type, args, obj) {
-
             var container = args[0];
 
             if (typeof container == 'string') {
-
-                this.cfg.setProperty("container", 
-                    document.getElementById(container), true);
-
+                this.cfg.setProperty("container", document.getElementById(container), true);
             }
-
         },
         
         /**
@@ -4571,36 +5261,20 @@
                 nElements,
                 oElement,
                 i;
-        
-            
+
             if (aElements) {
-        
                 nElements = aElements.length;
-                
                 if (nElements > 0) {
-                
                     i = nElements - 1;
-                    
                     do {
-        
                         oElement = aElements[i];
-        
-                        Event.removeListener(oElement, "mouseover", 
-                            this.onContextMouseOver);
-
-                        Event.removeListener(oElement, "mousemove", 
-                            this.onContextMouseMove);
-
-                        Event.removeListener(oElement, "mouseout", 
-                            this.onContextMouseOut);
-                    
+                        Event.removeListener(oElement, "mouseover", this.onContextMouseOver);
+                        Event.removeListener(oElement, "mousemove", this.onContextMouseMove);
+                        Event.removeListener(oElement, "mouseout", this.onContextMouseOut);
                     }
                     while (i--);
-                
                 }
-        
             }
-        
         },
         
         /**
@@ -4614,78 +5288,53 @@
         * this will usually equal the owner.
         */
         configContext: function (type, args, obj) {
-        
+
             var context = args[0],
                 aElements,
                 nElements,
                 oElement,
                 i;
-            
-        
+
             if (context) {
-        
+
                 // Normalize parameter into an array
                 if (! (context instanceof Array)) {
-
                     if (typeof context == "string") {
-
-                        this.cfg.setProperty("context", 
-                            [document.getElementById(context)], true);
-
+                        this.cfg.setProperty("context", [document.getElementById(context)], true);
                     } else { // Assuming this is an element
-
                         this.cfg.setProperty("context", [context], true);
-
                     }
-
                     context = this.cfg.getProperty("context");
-
                 }
-        
-        
+
                 // Remove any existing mouseover/mouseout listeners
                 this._removeEventListeners();
-        
+
                 // Add mouseover/mouseout listeners to context elements
                 this._context = context;
-        
+
                 aElements = this._context;
-                
+
                 if (aElements) {
-            
                     nElements = aElements.length;
-                    
                     if (nElements > 0) {
-                    
                         i = nElements - 1;
-                        
                         do {
-            
                             oElement = aElements[i];
-            
-                            Event.on(oElement, "mouseover", 
-                                this.onContextMouseOver, this);
-
-                            Event.on(oElement, "mousemove", 
-                                this.onContextMouseMove, this);
-
-                            Event.on(oElement, "mouseout", 
-                                this.onContextMouseOut, this);
-                        
+                            Event.on(oElement, "mouseover", this.onContextMouseOver, this);
+                            Event.on(oElement, "mousemove", this.onContextMouseMove, this);
+                            Event.on(oElement, "mouseout", this.onContextMouseOut, this);
                         }
                         while (i--);
-                    
                     }
-            
                 }
-        
             }
         },
-        
+
         // END BUILT-IN PROPERTY EVENT HANDLERS //
-        
+
         // BEGIN BUILT-IN DOM EVENT HANDLERS //
-        
+
         /**
         * The default event handler fired when the user moves the mouse while 
         * over the context element.
@@ -4696,9 +5345,8 @@
         onContextMouseMove: function (e, obj) {
             obj.pageX = Event.getPageX(e);
             obj.pageY = Event.getPageY(e);
-        
         },
-        
+
         /**
         * The default event handler fired when the user mouses over the 
         * context element.
@@ -4707,34 +5355,34 @@
         * @param {Object} obj The object argument
         */
         onContextMouseOver: function (e, obj) {
-        
             var context = this;
-        
-            if (obj.hideProcId) {
 
-                clearTimeout(obj.hideProcId);
-
-
-                obj.hideProcId = null;
-
-            }
-        
-            Event.on(context, "mousemove", obj.onContextMouseMove, obj);
-        
             if (context.title) {
                 obj._tempTitle = context.title;
                 context.title = "";
             }
-        
-            /**
-            * The unique process ID associated with the thread responsible 
-            * for showing the Tooltip.
-            * @type int
-            */
-            obj.showProcId = obj.doShow(e, context);
 
+            // Fire first, to honor disabled set in the listner
+            if (obj.fireEvent("contextMouseOver", context, e) !== false 
+                    && !obj.cfg.getProperty("disabled")) {
+
+                // Stop the tooltip from being hidden (set on last mouseout)
+                if (obj.hideProcId) {
+                    clearTimeout(obj.hideProcId);
+                    obj.hideProcId = null;
+                }
+
+                Event.on(context, "mousemove", obj.onContextMouseMove, obj);
+
+                /**
+                * The unique process ID associated with the thread responsible 
+                * for showing the Tooltip.
+                * @type int
+                */
+                obj.showProcId = obj.doShow(e, context);
+            }
         },
-        
+
         /**
         * The default event handler fired when the user mouses out of 
         * the context element.
@@ -4744,96 +5392,97 @@
         */
         onContextMouseOut: function (e, obj) {
             var el = this;
-        
+
             if (obj._tempTitle) {
                 el.title = obj._tempTitle;
                 obj._tempTitle = null;
             }
-        
+
             if (obj.showProcId) {
                 clearTimeout(obj.showProcId);
                 obj.showProcId = null;
             }
-        
+
             if (obj.hideProcId) {
                 clearTimeout(obj.hideProcId);
                 obj.hideProcId = null;
             }
-        
-        
+
+            obj.fireEvent("contextMouseOut", el, e);
+
             obj.hideProcId = setTimeout(function () {
                 obj.hide();
-    
             }, obj.cfg.getProperty("hidedelay"));
-    
         },
-        
+
         // END BUILT-IN DOM EVENT HANDLERS //
-        
+
         /**
         * Processes the showing of the Tooltip by setting the timeout delay 
         * and offset of the Tooltip.
         * @method doShow
         * @param {DOMEvent} e The current DOM event
+        * @param {HTMLElement} context The current context element
         * @return {Number} The process ID of the timeout function associated 
         * with doShow
         */
         doShow: function (e, context) {
-        
+
             var yOffset = 25,
                 me = this;
-        
-            if (YAHOO.env.ua.opera && context.tagName && 
-                context.tagName.toUpperCase() == "A") {
 
+            if (UA.opera && context.tagName && 
+                context.tagName.toUpperCase() == "A") {
                 yOffset += 12;
-
             }
-        
+
             return setTimeout(function () {
-        
-                if (me._tempTitle) {
+
+                var txt = me.cfg.getProperty("text");
+
+                // title does not over-ride text
+                if (me._tempTitle && (txt === "" || YAHOO.lang.isUndefined(txt) || YAHOO.lang.isNull(txt))) {
                     me.setBody(me._tempTitle);
                 } else {
                     me.cfg.refireEvent("text");
                 }
-        
+
                 me.moveTo(me.pageX, me.pageY + yOffset);
 
                 if (me.cfg.getProperty("preventoverlap")) {
                     me.preventOverlap(me.pageX, me.pageY);
                 }
-        
-                Event.removeListener(context, "mousemove", 
-                    me.onContextMouseMove);
-        
+
+                Event.removeListener(context, "mousemove", me.onContextMouseMove);
+
+                me.contextTriggerEvent.fire(context);
+
                 me.show();
+
                 me.hideProcId = me.doHide();
 
-
             }, this.cfg.getProperty("showdelay"));
-        
         },
-        
+
         /**
         * Sets the timeout for the auto-dismiss delay, which by default is 5 
         * seconds, meaning that a tooltip will automatically dismiss itself 
         * after 5 seconds of being displayed.
         * @method doHide
         */
         doHide: function () {
-        
+
             var me = this;
-        
-        
+
+
             return setTimeout(function () {
-        
+
                 me.hide();
-        
+
             }, this.cfg.getProperty("autodismissdelay"));
-        
+
         },
-        
+
         /**
         * Fired when the Tooltip is moved, this event handler is used to 
         * prevent the Tooltip from overlapping with its context element.
@@ -4872,35 +5521,30 @@
             function sizeShadow() {
     
                 var oElement = this.element,
-                    oShadow = this._shadow;
+                    oShadow = this.underlay;
             
                 if (oShadow) {
-            
                     oShadow.style.width = (oElement.offsetWidth + 6) + "px";
                     oShadow.style.height = (oElement.offsetHeight + 1) + "px"; 
-            
                 }
             
             }
 
-
             function addShadowVisibleClass() {
-            
-                Dom.addClass(this._shadow, "yui-tt-shadow-visible");
-            
+                Dom.addClass(this.underlay, "yui-tt-shadow-visible");
+
+                if (UA.ie) {
+                    this.forceUnderlayRedraw();
+                }
             }
-            
 
             function removeShadowVisibleClass() {
-        
-                Dom.removeClass(this._shadow, "yui-tt-shadow-visible");
-            
+                Dom.removeClass(this.underlay, "yui-tt-shadow-visible");
             }
-    
-    
+
             function createShadow() {
     
-                var oShadow = this._shadow,
+                var oShadow = this.underlay,
                     oElement,
                     Module,
                     nIE,
@@ -4910,80 +5554,72 @@
     
                     oElement = this.element;
                     Module = YAHOO.widget.Module;
-                    nIE = YAHOO.env.ua.ie;
+                    nIE = UA.ie;
                     me = this;
-    
+
                     if (!m_oShadowTemplate) {
-        
                         m_oShadowTemplate = document.createElement("div");
                         m_oShadowTemplate.className = "yui-tt-shadow";
-                    
                     }
-        
+
                     oShadow = m_oShadowTemplate.cloneNode(false);
-        
+
                     oElement.appendChild(oShadow);
-                    
-                    this._shadow = oShadow;
-    
+
+                    this.underlay = oShadow;
+
+                    // Backward compatibility, even though it's probably 
+                    // intended to be "private", it isn't marked as such in the api docs
+                    this._shadow = this.underlay;
+
                     addShadowVisibleClass.call(this);
-        
+
                     this.subscribe("beforeShow", addShadowVisibleClass);
-                    this.subscribe("beforeHide", removeShadowVisibleClass);
+                    this.subscribe("hide", removeShadowVisibleClass);
 
-                    if (nIE == 6 || 
-                        (nIE == 7 && document.compatMode == "BackCompat")) {
-                
+                    if (bIEQuirks) {
                         window.setTimeout(function () { 
-        
                             sizeShadow.call(me); 
-        
                         }, 0);
     
                         this.cfg.subscribeToConfigEvent("width", sizeShadow);
                         this.cfg.subscribeToConfigEvent("height", sizeShadow);
                         this.subscribe("changeContent", sizeShadow);
-    
-                        Module.textResizeEvent.subscribe(sizeShadow, 
-                                                            this, true);
-                        
+
+                        Module.textResizeEvent.subscribe(sizeShadow, this, true);
                         this.subscribe("destroy", function () {
-                        
-                            Module.textResizeEvent.unsubscribe(sizeShadow, 
-                                                                    this);
-                        
+                            Module.textResizeEvent.unsubscribe(sizeShadow, this);
                         });
-                
                     }
-                
                 }
-    
             }
-    
-    
+
             function onBeforeShow() {
-            
                 createShadow.call(this);
-    
                 this.unsubscribe("beforeShow", onBeforeShow);
-            
             }
-    
-    
+
             if (this.cfg.getProperty("visible")) {
-    
                 createShadow.call(this);
-            
-            }
-            else {
-    
+            } else {
                 this.subscribe("beforeShow", onBeforeShow);
-            
             }
         
         },
-        
+
         /**
+         * Forces the underlay element to be repainted, through the application/removal
+         * of a yui-force-redraw class to the underlay element.
+         * 
+         * @method forceUnderlayRedraw
+         */
+        forceUnderlayRedraw : function() {
+            var tt = this;
+            Dom.addClass(tt.underlay, "yui-force-redraw");
+            setTimeout(function() {Dom.removeClass(tt.underlay, "yui-force-redraw");}, 0);
+        },
+
+        /**
         * Removes the Tooltip element from the DOM and sets all child 
         * elements to null.
         * @method destroy
@@ -4992,7 +5628,7 @@
         
             // Remove any existing mouseover/mouseout listeners
             this._removeEventListeners();
-        
+
             Tooltip.superclass.destroy.call(this);  
         
         },
@@ -5009,14 +5645,15 @@
     });
 
 }());
+
 (function () {
 
     /**
     * Panel is an implementation of Overlay that behaves like an OS window, 
     * with a draggable header and an optional close icon at the top right.
     * @namespace YAHOO.widget
     * @class Panel
-    * @extends Overlay
+    * @extends YAHOO.widget.Overlay
     * @constructor
     * @param {String} el The element ID representing the Panel <em>OR</em>
     * @param {HTMLElement} el The element representing the Panel
@@ -5025,21 +5662,24 @@
     * documentation for more details.
     */
     YAHOO.widget.Panel = function (el, userConfig) {
-    
         YAHOO.widget.Panel.superclass.constructor.call(this, el, userConfig);
-    
     };
 
+    var _currentModal = null;
 
     var Lang = YAHOO.lang,
-        DD = YAHOO.util.DD,
-        Dom = YAHOO.util.Dom,
-        Event = YAHOO.util.Event,
+        Util = YAHOO.util,
+        Dom = Util.Dom,
+        Event = Util.Event,
+        CustomEvent = Util.CustomEvent,
+        KeyListener = YAHOO.util.KeyListener,
+        Config = Util.Config,
         Overlay = YAHOO.widget.Overlay,
-        CustomEvent = YAHOO.util.CustomEvent,
-        Config = YAHOO.util.Config,
         Panel = YAHOO.widget.Panel,
+        UA = YAHOO.env.ua,
 
+        bIEQuirks = (UA.ie && (UA.ie <= 6 || document.compatMode == "BackCompat")),
+
         m_oMaskTemplate,
         m_oUnderlayTemplate,
         m_oCloseIconTemplate,
@@ -5052,13 +5692,11 @@
         * @type Object
         */
         EVENT_TYPES = {
-        
             "SHOW_MASK": "showMask",
             "HIDE_MASK": "hideMask",
             "DRAG": "drag"
-        
         },
-        
+
         /**
         * Constant representing the Panel's configuration properties
         * @property DEFAULT_CONFIG
@@ -5067,43 +5705,57 @@
         * @type Object
         */
         DEFAULT_CONFIG = {
-        
+
             "CLOSE": { 
                 key: "close", 
                 value: true, 
                 validator: Lang.isBoolean, 
                 supercedes: ["visible"] 
             },
-            
-            "DRAGGABLE": { 
+
+            "DRAGGABLE": {
                 key: "draggable", 
-                value: (DD ? true : false), 
+                value: (Util.DD ? true : false), 
                 validator: Lang.isBoolean, 
                 supercedes: ["visible"]  
             },
-            
+
+            "DRAG_ONLY" : {
+                key: "dragonly",
+                value: false,
+                validator: Lang.isBoolean,
+                supercedes: ["draggable"]
+            },
+
             "UNDERLAY": { 
                 key: "underlay", 
                 value: "shadow", 
                 supercedes: ["visible"] 
             },
-            
+
             "MODAL": { 
                 key: "modal", 
                 value: false, 
                 validator: Lang.isBoolean, 
-                supercedes: ["visible"] 
+                supercedes: ["visible", "zindex"]
             },
-            
-            "KEY_LISTENERS": { 
-                key: "keylisteners", 
-                suppressEvent: true, 
-                supercedes: ["visible"] 
+
+            "KEY_LISTENERS": {
+                key: "keylisteners",
+                suppressEvent: true,
+                supercedes: ["visible"]
+            },
+
+            "STRINGS" : {
+                key: "strings",
+                supercedes: ["close"],
+                validator: Lang.isObject,
+                value: {
+                    close: "Close"
+                }
             }
-        
         };
 
-
     /**
     * Constant representing the default CSS class used for a Panel
     * @property YAHOO.widget.Panel.CSS_PANEL
@@ -5123,6 +5775,23 @@
     */
     Panel.CSS_PANEL_CONTAINER = "yui-panel-container";
 
+    /**
+     * Constant representing the default set of focusable elements 
+     * on the pagewhich Modal Panels will prevent access to, when
+     * the modal mask is displayed
+     * 
+     * @property YAHOO.widget.Panel.FOCUSABLE
+     * @static
+     * @type Array
+     */
+    Panel.FOCUSABLE = [
+        "a",
+        "button",
+        "select",
+        "textarea",
+        "input",
+        "iframe"
+    ];
 
     // Private CustomEvent listeners
 
@@ -5133,16 +5802,11 @@
     */
 
     function createHeader(p_sType, p_aArgs) {
-
-        if (!this.header) {
-
+        if (!this.header && this.cfg.getProperty("draggable")) {
             this.setHeader("&#160;");
-
         }
-
     }
 
-
     /* 
         "hide" event handler that sets a Panel instance's "width"
         configuration property back to its original value before 
@@ -5157,16 +5821,12 @@
             sCurrentWidth = oConfig.getProperty("width");
 
         if (sCurrentWidth == sNewWidth) {
-            
             oConfig.setProperty("width", sOriginalWidth);
-        
         }
 
         this.unsubscribe("hide", restoreOriginalWidth, p_oObject);
-    
     }
 
-
     /* 
         "beforeShow" event handler that sets a Panel instance's "width"
         configuration property to the value of its root HTML 
@@ -5175,12 +5835,11 @@
 
     function setWidthToOffsetWidth(p_sType, p_aArgs) {
 
-        var nIE = YAHOO.env.ua.ie,
-            oConfig,
+        var oConfig,
             sOriginalWidth,
             sNewWidth;
 
-        if (nIE == 6 || (nIE == 7 && document.compatMode == "BackCompat")) {
+        if (bIEQuirks) {
 
             oConfig = this.cfg;
             sOriginalWidth = oConfig.getProperty("width");
@@ -5190,183 +5849,354 @@
                 sNewWidth = (this.element.offsetWidth + "px");
     
                 oConfig.setProperty("width", sNewWidth);
-                
+
                 this.subscribe("hide", restoreOriginalWidth, 
                     [(sOriginalWidth || ""), sNewWidth]);
             
             }
-        
         }
-
     }
 
-    /* 
-        "focus" event handler for a focuable element.  Used to automatically 
-        blur the element when it receives focus to ensure that a Panel 
-        instance's modality is not compromised.
-    */
+    YAHOO.extend(Panel, Overlay, {
 
-    function onElementFocus() {
+        /**
+        * The Overlay initialization method, which is executed for Overlay and 
+        * all of its subclasses. This method is automatically called by the 
+        * constructor, and  sets up all DOM references for pre-existing markup, 
+        * and creates required markup if it is not already present.
+        * @method init
+        * @param {String} el The element ID representing the Overlay <em>OR</em>
+        * @param {HTMLElement} el The element representing the Overlay
+        * @param {Object} userConfig The configuration object literal 
+        * containing the configuration that should be set for this Overlay. 
+        * See configuration documentation for more details.
+        */
+        init: function (el, userConfig) {
+            /*
+                 Note that we don't pass the user config in here yet because 
+                 we only want it executed once, at the lowest subclass level
+            */
 
-        this.blur();
+            Panel.superclass.init.call(this, el/*, userConfig*/);
 
-    }
+            this.beforeInitEvent.fire(Panel);
 
-    /* 
-        "showMask" event handler that adds a "focus" event handler to all
-        focusable elements in the document to enforce a Panel instance's 
-        modality from being compromised.
-    */
+            Dom.addClass(this.element, Panel.CSS_PANEL);
 
-    function addFocusEventHandlers(p_sType, p_aArgs) {
+            this.buildWrapper();
 
-        var me = this;
+            if (userConfig) {
+                this.cfg.applyConfig(userConfig, true);
+            }
 
-        function isFocusable(el) {
+            this.subscribe("showMask", this._addFocusHandlers);
+            this.subscribe("hideMask", this._removeFocusHandlers);
+            this.subscribe("beforeRender", createHeader);
 
-            var sTagName = el.tagName.toUpperCase(),
-                bFocusable = false;
-            
-            switch (sTagName) {
-            
-            case "A":
-            case "BUTTON":
-            case "SELECT":
-            case "TEXTAREA":
+            this.subscribe("render", function() {
+                this.setFirstLastFocusable();
+                this.subscribe("changeContent", this.setFirstLastFocusable);
+            });
 
-                if (!Dom.isAncestor(me.element, el)) {
-                    Event.on(el, "focus", onElementFocus, el, true);
-                    bFocusable = true;
+            this.subscribe("show", this.focusFirst);
+
+            this.initEvent.fire(Panel);
+        },
+
+        /**
+         * @method _onElementFocus
+         * @private
+         *
+         * "focus" event handler for a focuable element. Used to automatically
+         * blur the element when it receives focus to ensure that a Panel
+         * instance's modality is not compromised.
+         *
+         * @param {Event} e The DOM event object
+         */
+        _onElementFocus : function(e){
+
+            if(_currentModal === this) {
+
+                var target = Event.getTarget(e),
+                    doc = document.documentElement,
+                    insideDoc = (target !== doc && target !== window);
+
+                // mask and documentElement checks added for IE, which focuses on the mask when it's clicked on, and focuses on 
+                // the documentElement, when the document scrollbars are clicked on
+                if (insideDoc && target !== this.element && target !== this.mask && !Dom.isAncestor(this.element, target)) {
+                    try {
+                        if (this.firstElement) {
+                            this.firstElement.focus();
+                        } else {
+                            if (this._modalFocus) {
+                                this._modalFocus.focus();
+                            } else {
+                                this.innerElement.focus();
+                            }
+                        }
+                    } catch(err){
+                        // Just in case we fail to focus
+                        try {
+                            if (insideDoc && target !== document.body) {
+                                target.blur();
+                            }
+                        } catch(err2) { }
+                    }
                 }
+            }
+        },
 
-                break;
+        /** 
+         *  @method _addFocusHandlers
+         *  @protected
+         *  
+         *  "showMask" event handler that adds a "focus" event handler to all
+         *  focusable elements in the document to enforce a Panel instance's 
+         *  modality from being compromised.
+         *
+         *  @param p_sType {String} Custom event type
+         *  @param p_aArgs {Array} Custom event arguments
+         */
+        _addFocusHandlers: function(p_sType, p_aArgs) {
+            if (!this.firstElement) {
+                if (UA.webkit || UA.opera) {
+                    if (!this._modalFocus) {
+                        this._createHiddenFocusElement();
+                    }
+                } else {
+                    this.innerElement.tabIndex = 0;
+                }
+            }
+            this.setTabLoop(this.firstElement, this.lastElement);
+            Event.onFocus(document.documentElement, this._onElementFocus, this, true);
+            _currentModal = this;
+        },
 
-            case "INPUT":
+        /**
+         * Creates a hidden focusable element, used to focus on,
+         * to enforce modality for browsers in which focus cannot
+         * be applied to the container box.
+         * 
+         * @method _createHiddenFocusElement
+         * @private
+         */
+        _createHiddenFocusElement : function() {
+            var e = document.createElement("button");
+            e.style.height = "1px";
+            e.style.width = "1px";
+            e.style.position = "absolute";
+            e.style.left = "-10000em";
+            e.style.opacity = 0;
+            e.tabIndex = -1;
+            this.innerElement.appendChild(e);
+            this._modalFocus = e;
+        },
 
-                if (el.type != "hidden" && 
-                    !Dom.isAncestor(me.element, el)) {
+        /**
+         *  @method _removeFocusHandlers
+         *  @protected
+         *
+         *  "hideMask" event handler that removes all "focus" event handlers added 
+         *  by the "addFocusEventHandlers" method.
+         *
+         *  @param p_sType {String} Event type
+         *  @param p_aArgs {Array} Event Arguments
+         */
+        _removeFocusHandlers: function(p_sType, p_aArgs) {
+            Event.removeFocusListener(document.documentElement, this._onElementFocus, this);
 
-                    Event.on(el, "focus", onElementFocus, el, true);
-                    bFocusable = true;
+            if (_currentModal == this) {
+                _currentModal = null;
+            }
+        },
 
+        /**
+         * Sets focus to the first element in the Panel.
+         *
+         * @method focusFirst
+         */
+        focusFirst: function (type, args, obj) {
+            var el = this.firstElement;
+
+            if (args && args[1]) {
+                Event.stopEvent(args[1]);
+            }
+
+            if (el) {
+                try {
+                    el.focus();
+                } catch(err) {
+                    // Ignore
                 }
+            }
+        },
 
-                break;
-            
+        /**
+         * Sets focus to the last element in the Panel.
+         *
+         * @method focusLast
+         */
+        focusLast: function (type, args, obj) {
+            var el = this.lastElement;
+
+            if (args && args[1]) {
+                Event.stopEvent(args[1]);
             }
 
-            return bFocusable;
+            if (el) {
+                try {
+                    el.focus();
+                } catch(err) {
+                    // Ignore
+                }
+            }
+        },
 
-        }
+        /**
+         * Sets up a tab, shift-tab loop between the first and last elements
+         * provided. NOTE: Sets up the preventBackTab and preventTabOut KeyListener
+         * instance properties, which are reset everytime this method is invoked.
+         *
+         * @method setTabLoop
+         * @param {HTMLElement} firstElement
+         * @param {HTMLElement} lastElement
+         *
+         */
+        setTabLoop : function(firstElement, lastElement) {
 
-        this.focusableElements = Dom.getElementsBy(isFocusable);
-    
-    }
+            var backTab = this.preventBackTab, tab = this.preventTabOut,
+                showEvent = this.showEvent, hideEvent = this.hideEvent;
 
-    /* 
-        "hideMask" event handler that removes all "focus" event handlers added 
-        by the "addFocusEventHandlers" method.
-    */
-    
-    function removeFocusEventHandlers(p_sType, p_aArgs) {
+            if (backTab) {
+                backTab.disable();
+                showEvent.unsubscribe(backTab.enable, backTab);
+                hideEvent.unsubscribe(backTab.disable, backTab);
+                backTab = this.preventBackTab = null;
+            }
 
-        var aElements = this.focusableElements,
-            nElements = aElements.length,
-            el2,
-            i;
+            if (tab) {
+                tab.disable();
+                showEvent.unsubscribe(tab.enable, tab);
+                hideEvent.unsubscribe(tab.disable,tab);
+                tab = this.preventTabOut = null;
+            }
 
-        for (i = 0; i < nElements; i++) {
-            el2 = aElements[i];
-            Event.removeListener(el2, "focus", onElementFocus);
-        }
+            if (firstElement) {
+                this.preventBackTab = new KeyListener(firstElement, 
+                    {shift:true, keys:9},
+                    {fn:this.focusLast, scope:this, correctScope:true}
+                );
+                backTab = this.preventBackTab;
 
-    }
+                showEvent.subscribe(backTab.enable, backTab, true);
+                hideEvent.subscribe(backTab.disable,backTab, true);
+            }
 
-    
-    YAHOO.extend(Panel, Overlay, {
-    
+            if (lastElement) {
+                this.preventTabOut = new KeyListener(lastElement, 
+                    {shift:false, keys:9}, 
+                    {fn:this.focusFirst, scope:this, correctScope:true}
+                );
+                tab = this.preventTabOut;
+
+                showEvent.subscribe(tab.enable, tab, true);
+                hideEvent.subscribe(tab.disable,tab, true);
+            }
+        },
+
         /**
-        * The Overlay initialization method, which is executed for Overlay and 
-        * all of its subclasses. This method is automatically called by the 
-        * constructor, and  sets up all DOM references for pre-existing markup, 
-        * and creates required markup if it is not already present.
-        * @method init
-        * @param {String} el The element ID representing the Overlay <em>OR</em>
-        * @param {HTMLElement} el The element representing the Overlay
-        * @param {Object} userConfig The configuration object literal 
-        * containing the configuration that should be set for this Overlay. 
-        * See configuration documentation for more details.
-        */
-        init: function (el, userConfig) {
-    
-            /*
-                 Note that we don't pass the user config in here yet because 
-                 we only want it executed once, at the lowest subclass level
-            */
+         * Returns an array of the currently focusable items which reside within
+         * Panel. The set of focusable elements the method looks for are defined
+         * in the Panel.FOCUSABLE static property
+         *
+         * @method getFocusableElements
+         * @param {HTMLElement} root element to start from.
+         */
+        getFocusableElements : function(root) {
 
-            Panel.superclass.init.call(this, el/*, userConfig*/);  
-        
-            this.beforeInitEvent.fire(Panel);
-        
-            Dom.addClass(this.element, Panel.CSS_PANEL);
-        
-            this.buildWrapper();
-        
-            if (userConfig) {
+            root = root || this.innerElement;
 
-                this.cfg.applyConfig(userConfig, true);
+            var focusable = {};
+            for (var i = 0; i < Panel.FOCUSABLE.length; i++) {
+                focusable[Panel.FOCUSABLE[i]] = true;
+            }
 
+            function isFocusable(el) {
+                if (el.focus && el.type !== "hidden" && !el.disabled && focusable[el.tagName.toLowerCase()]) {
+                    return true;
+                }
+                return false;
             }
-        
-            this.subscribe("showMask", addFocusEventHandlers);
-            this.subscribe("hideMask", removeFocusEventHandlers);
 
-            this.initEvent.fire(Panel);
-            
+            // Not looking by Tag, since we want elements in DOM order
+            return Dom.getElementsBy(isFocusable, null, root);
         },
-        
+
         /**
-        * Initializes the custom events for Module which are fired 
-        * automatically at appropriate times by the Module class.
-        */
+         * Sets the firstElement and lastElement instance properties
+         * to the first and last focusable elements in the Panel.
+         *
+         * @method setFirstLastFocusable
+         */
+        setFirstLastFocusable : function() {
+
+            this.firstElement = null;
+            this.lastElement = null;
+
+            var elements = this.getFocusableElements();
+            this.focusableElements = elements;
+
+            if (elements.length > 0) {
+                this.firstElement = elements[0];
+                this.lastElement = elements[elements.length - 1];
+            }
+
+            if (this.cfg.getProperty("modal")) {
+                this.setTabLoop(this.firstElement, this.lastElement);
+            }
+        },
+
+        /**
+         * Initializes the custom events for Module which are fired 
+         * automatically at appropriate times by the Module class.
+         */
         initEvents: function () {
             Panel.superclass.initEvents.call(this);
-        
+
             var SIGNATURE = CustomEvent.LIST;
-        
+
             /**
             * CustomEvent fired after the modality mask is shown
             * @event showMaskEvent
             */
             this.showMaskEvent = this.createEvent(EVENT_TYPES.SHOW_MASK);
             this.showMaskEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired after the modality mask is hidden
             * @event hideMaskEvent
             */
             this.hideMaskEvent = this.createEvent(EVENT_TYPES.HIDE_MASK);
             this.hideMaskEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent when the Panel is dragged
             * @event dragEvent
             */
             this.dragEvent = this.createEvent(EVENT_TYPES.DRAG);
             this.dragEvent.signature = SIGNATURE;
-        
         },
-        
+
         /**
-        * Initializes the class's configurable properties which can be changed 
-        * using the Panel's Config object (cfg).
-        * @method initDefaultConfig
-        */
+         * Initializes the class's configurable properties which can be changed 
+         * using the Panel's Config object (cfg).
+         * @method initDefaultConfig
+         */
         initDefaultConfig: function () {
             Panel.superclass.initDefaultConfig.call(this);
-        
+
             // Add panel config properties //
-        
+
             /**
             * True if the Panel should display a "close" button
             * @config close
@@ -5379,7 +6209,7 @@
                 validator: DEFAULT_CONFIG.CLOSE.validator, 
                 supercedes: DEFAULT_CONFIG.CLOSE.supercedes 
             });
-        
+
             /**
             * Boolean specifying if the Panel should be draggable.  The default 
             * value is "true" if the Drag and Drop utility is included, 
@@ -5402,14 +6232,41 @@
             * @type Boolean
             * @default true
             */
-            this.cfg.addProperty(DEFAULT_CONFIG.DRAGGABLE.key, { 
-                handler: this.configDraggable, 
-                value: DEFAULT_CONFIG.DRAGGABLE.value, 
-                validator: DEFAULT_CONFIG.DRAGGABLE.validator, 
-                supercedes: DEFAULT_CONFIG.DRAGGABLE.supercedes 
+            this.cfg.addProperty(DEFAULT_CONFIG.DRAGGABLE.key, {
+                handler: this.configDraggable,
+                value: (Util.DD) ? true : false,
+                validator: DEFAULT_CONFIG.DRAGGABLE.validator,
+                supercedes: DEFAULT_CONFIG.DRAGGABLE.supercedes
             });
-        
+
             /**
+            * Boolean specifying if the draggable Panel should be drag only, not interacting with drop 
+            * targets on the page.
+            * <p>
+            * When set to true, draggable Panels will not check to see if they are over drop targets,
+            * or fire the DragDrop events required to support drop target interaction (onDragEnter, 
+            * onDragOver, onDragOut, onDragDrop etc.).
+            * If the Panel is not designed to be dropped on any target elements on the page, then this 
+            * flag can be set to true to improve performance.
+            * </p>
+            * <p>
+            * When set to false, all drop target related events will be fired.
+            * </p>
+            * <p>
+            * The property is set to false by default to maintain backwards compatibility but should be 
+            * set to true if drop target interaction is not required for the Panel, to improve performance.</p>
+            * 
+            * @config dragOnly
+            * @type Boolean
+            * @default false
+            */
+            this.cfg.addProperty(DEFAULT_CONFIG.DRAG_ONLY.key, { 
+                value: DEFAULT_CONFIG.DRAG_ONLY.value, 
+                validator: DEFAULT_CONFIG.DRAG_ONLY.validator, 
+                supercedes: DEFAULT_CONFIG.DRAG_ONLY.supercedes 
+            });
+
+            /**
             * Sets the type of underlay to display for the Panel. Valid values 
             * are "shadow," "matte," and "none".  <strong>PLEASE NOTE:</strong> 
             * The creation of the underlay element is deferred until the Panel 
@@ -5441,7 +6298,7 @@
                 validator: DEFAULT_CONFIG.MODAL.validator, 
                 supercedes: DEFAULT_CONFIG.MODAL.supercedes 
             });
-        
+
             /**
             * A KeyListener (or array of KeyListeners) that will be enabled 
             * when the Panel is shown, and disabled when the Panel is hidden.
@@ -5454,9 +6311,25 @@
                 suppressEvent: DEFAULT_CONFIG.KEY_LISTENERS.suppressEvent, 
                 supercedes: DEFAULT_CONFIG.KEY_LISTENERS.supercedes 
             });
-        
+
+            /**
+            * UI Strings used by the Panel
+            * 
+            * @config strings
+            * @type Object
+            * @default An object literal with the properties shown below:
+            *     <dl>
+            *         <dt>close</dt><dd><em>String</em> : The string to use for the close icon. Defaults to "Close".</dd>
+            *     </dl>
+            */
+            this.cfg.addProperty(DEFAULT_CONFIG.STRINGS.key, { 
+                value:DEFAULT_CONFIG.STRINGS.value,
+                handler:this.configStrings,
+                validator:DEFAULT_CONFIG.STRINGS.validator,
+                supercedes:DEFAULT_CONFIG.STRINGS.supercedes
+            });
         },
-        
+
         // BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
         
         /**
@@ -5473,55 +6346,52 @@
         configClose: function (type, args, obj) {
 
             var val = args[0],
-                oClose = this.close;
-        
-            function doHide(e, obj) {
+                oClose = this.close,
+                strings = this.cfg.getProperty("strings");
 
-                obj.hide();
-
-            }
-        
             if (val) {
-
                 if (!oClose) {
 
                     if (!m_oCloseIconTemplate) {
-
-                        m_oCloseIconTemplate = document.createElement("span");
-                        m_oCloseIconTemplate.innerHTML = "&#160;";
+                        m_oCloseIconTemplate = document.createElement("a");
                         m_oCloseIconTemplate.className = "container-close";
-
+                        m_oCloseIconTemplate.href = "#";
                     }
 
                     oClose = m_oCloseIconTemplate.cloneNode(true);
-
                     this.innerElement.appendChild(oClose);
 
-                    Event.on(oClose, "click", doHide, this);
-                    
+                    oClose.innerHTML = (strings && strings.close) ? strings.close : "&#160;";
+
+                    Event.on(oClose, "click", this._doClose, this, true);
+
                     this.close = oClose;
-                    
 
                 } else {
-
                     oClose.style.display = "block";
-
                 }
 
             } else {
-
                 if (oClose) {
-
                     oClose.style.display = "none";
-
                 }
-
             }
 
         },
 
+        /**
+         * Event handler for the close icon
+         * 
+         * @method _doClose
+         * @protected
+         * 
+         * @param {DOMEvent} e
+         */
+        _doClose : function (e) {
+            Event.preventDefault(e);
+            this.hide();
+        },
 
-
         /**
         * The default event handler fired when the "draggable" property 
         * is changed.
@@ -5533,53 +6403,35 @@
         * this will usually equal the owner.
         */
         configDraggable: function (type, args, obj) {
-        
             var val = args[0];
 
             if (val) {
-        
-                if (!DD) {
-            
-        
+                if (!Util.DD) {
                     this.cfg.setProperty("draggable", false);
-            
                     return;
-                
                 }
-        
-                if (this.header) {
 
+                if (this.header) {
                     Dom.setStyle(this.header, "cursor", "move");
-
                     this.registerDragDrop();
-
                 }
 
-                this.subscribe("beforeRender", createHeader);
                 this.subscribe("beforeShow", setWidthToOffsetWidth);
 
             } else {
 
                 if (this.dd) {
-
                     this.dd.unreg();
-
                 }
 
                 if (this.header) {
-
                     Dom.setStyle(this.header,"cursor","auto");
-
                 }
 
-                this.unsubscribe("beforeRender", createHeader);
                 this.unsubscribe("beforeShow", setWidthToOffsetWidth);
-
             }
-
         },
       
-
         /**
         * The default event handler fired when the "underlay" property 
         * is changed.
@@ -5591,159 +6443,105 @@
         * this will usually equal the owner.
         */
         configUnderlay: function (type, args, obj) {
-    
-            var UA = YAHOO.env.ua,
-                bMacGecko = (this.platform == "mac" && UA.gecko),
+
+            var bMacGecko = (this.platform == "mac" && UA.gecko),
                 sUnderlay = args[0].toLowerCase(),
                 oUnderlay = this.underlay,
                 oElement = this.element;
 
-
             function createUnderlay() {
-
-                var nIE;
-
+                var bNew = false;
                 if (!oUnderlay) { // create if not already in DOM
 
                     if (!m_oUnderlayTemplate) {
-
                         m_oUnderlayTemplate = document.createElement("div");
                         m_oUnderlayTemplate.className = "underlay";
-                    
                     }
 
                     oUnderlay = m_oUnderlayTemplate.cloneNode(false);
                     this.element.appendChild(oUnderlay);
-                    
+
                     this.underlay = oUnderlay;
 
-                    nIE = UA.ie;
-
-                    if (nIE == 6 || 
-                        (nIE == 7 && document.compatMode == "BackCompat")) {
-                            
+                    if (bIEQuirks) {
                         this.sizeUnderlay();
+                        this.cfg.subscribeToConfigEvent("width", this.sizeUnderlay);
+                        this.cfg.subscribeToConfigEvent("height", this.sizeUnderlay);
 
-                        this.cfg.subscribeToConfigEvent("width", 
-                            this.sizeUnderlay);
-
-                        this.cfg.subscribeToConfigEvent("height", 
-                            this.sizeUnderlay);
-
                         this.changeContentEvent.subscribe(this.sizeUnderlay);
+                        YAHOO.widget.Module.textResizeEvent.subscribe(this.sizeUnderlay, this, true);
+                    }
 
-                        YAHOO.widget.Module.textResizeEvent.subscribe(
-                            this.sizeUnderlay, this, true);
-                    
+                    if (UA.webkit && UA.webkit < 420) {
+                        this.changeContentEvent.subscribe(this.forceUnderlayRedraw);
                     }
 
+                    bNew = true;
                 }
-
             }
 
-
             function onBeforeShow() {
-            
-                createUnderlay.call(this);
-    
+                var bNew = createUnderlay.call(this);
+                if (!bNew && bIEQuirks) {
+                    this.sizeUnderlay();
+                }
                 this._underlayDeferred = false;
-    
                 this.beforeShowEvent.unsubscribe(onBeforeShow);
-            
             }
 
-            
             function destroyUnderlay() {
-
                 if (this._underlayDeferred) {
-
                     this.beforeShowEvent.unsubscribe(onBeforeShow);
-                
                     this._underlayDeferred = false;
-
                 }
-            
+
                 if (oUnderlay) {
-            
-                    this.cfg.unsubscribeFromConfigEvent("width", 
-                        this.sizeUnderlay);
-    
-                    this.cfg.unsubscribeFromConfigEvent("height", 
-                        this.sizeUnderlay);
-    
+                    this.cfg.unsubscribeFromConfigEvent("width", this.sizeUnderlay);
+                    this.cfg.unsubscribeFromConfigEvent("height",this.sizeUnderlay);
                     this.changeContentEvent.unsubscribe(this.sizeUnderlay);
-    
-                    YAHOO.widget.Module.textResizeEvent.unsubscribe(
-                        this.sizeUnderlay, this, true);
-    
+                    this.changeContentEvent.unsubscribe(this.forceUnderlayRedraw);
+                    YAHOO.widget.Module.textResizeEvent.unsubscribe(this.sizeUnderlay, this, true);
+
                     this.element.removeChild(oUnderlay);
-                    
-                    this.underlay = null;
 
+                    this.underlay = null;
                 }
-                    
             }
-        
 
             switch (sUnderlay) {
-    
-            case "shadow":
-
-                Dom.removeClass(oElement, "matte");
-                Dom.addClass(oElement, "shadow");
-
-                break;
-
-            case "matte":
-
-                if (!bMacGecko) {
-
-                    destroyUnderlay.call(this);
-
-                }
-            
-                Dom.removeClass(oElement, "shadow");
-                Dom.addClass(oElement, "matte");
-
-                break;
-
-            default:
-
-                if (!bMacGecko) {
-
-                    destroyUnderlay.call(this);
-
-                }
-            
-                Dom.removeClass(oElement, "shadow");
-                Dom.removeClass(oElement, "matte");
-
-                break;
-
+                case "shadow":
+                    Dom.removeClass(oElement, "matte");
+                    Dom.addClass(oElement, "shadow");
+                    break;
+                case "matte":
+                    if (!bMacGecko) {
+                        destroyUnderlay.call(this);
+                    }
+                    Dom.removeClass(oElement, "shadow");
+                    Dom.addClass(oElement, "matte");
+                    break;
+                default:
+                    if (!bMacGecko) {
+                        destroyUnderlay.call(this);
+                    }
+                    Dom.removeClass(oElement, "shadow");
+                    Dom.removeClass(oElement, "matte");
+                    break;
             }
 
-
             if ((sUnderlay == "shadow") || (bMacGecko && !oUnderlay)) {
-                
                 if (this.cfg.getProperty("visible")) {
-                
-                    createUnderlay.call(this);
-                
-                }
-                else {
-
+                    var bNew = createUnderlay.call(this);
+                    if (!bNew && bIEQuirks) {
+                        this.sizeUnderlay();
+                    }
+                } else {
                     if (!this._underlayDeferred) {
-
                         this.beforeShowEvent.subscribe(onBeforeShow);
-                    
                         this._underlayDeferred = true;
-
                     }
-                
                 }
-
             }
-    
         },
         
         /**
@@ -5760,9 +6558,7 @@
         configModal: function (type, args, obj) {
 
             var modal = args[0];
-
             if (modal) {
-
                 if (!this._hasModalityEventListeners) {
 
                     this.subscribe("beforeShow", this.buildMask);
@@ -5774,18 +6570,13 @@
                         this, true);
 
                     this._hasModalityEventListeners = true;
-
                 }
-
             } else {
-
                 if (this._hasModalityEventListeners) {
 
                     if (this.cfg.getProperty("visible")) {
-                    
                         this.hideMask();
                         this.removeMask();
-                    
                     }
 
                     this.unsubscribe("beforeShow", this.buildMask);
@@ -5794,44 +6585,35 @@
                     this.unsubscribe("hide", this.hideMask);
 
                     Overlay.windowResizeEvent.unsubscribe(this.sizeMask, this);
-                    
+
                     this._hasModalityEventListeners = false;
-                
                 }
-
             }
-
         },
-        
+
         /**
         * Removes the modality mask.
         * @method removeMask
         */
         removeMask: function () {
-        
+
             var oMask = this.mask,
                 oParentNode;
-        
+
             if (oMask) {
-            
                 /*
                     Hide the mask before destroying it to ensure that DOM
                     event handlers on focusable elements get removed.
                 */
-        
                 this.hideMask();
-            
+
                 oParentNode = oMask.parentNode;
-        
                 if (oParentNode) {
-        
                     oParentNode.removeChild(oMask);
-        
                 }
-        
+
                 this.mask = null;
             }
-            
         },
         
         /**
@@ -5878,7 +6660,6 @@
                             this.destroyEvent.subscribe(listener.disable, 
                                 listener, true);
                         }
-
                     }
 
                 } else {
@@ -5906,8 +6687,17 @@
             }
 
         },
-        
+
         /**
+        * The default handler for the "strings" property
+        * @method configStrings
+        */
+        configStrings : function(type, args, obj) {
+            var val = Lang.merge(DEFAULT_CONFIG.STRINGS.value, args[0]);
+            this.cfg.setProperty(DEFAULT_CONFIG.STRINGS.key, val, true);
+        },
+
+        /**
         * The default event handler fired when the "height" property is changed.
         * @method configHeight
         * @param {String} type The CustomEvent type (usually the property name)
@@ -5917,16 +6707,35 @@
         * this will usually equal the owner.
         */
         configHeight: function (type, args, obj) {
-    
             var height = args[0],
                 el = this.innerElement;
-    
+
             Dom.setStyle(el, "height", height);
             this.cfg.refireEvent("iframe");
-    
         },
-        
+
         /**
+         * The default custom event handler executed when the Panel's height is changed, 
+         * if the autofillheight property has been set.
+         *
+         * @method _autoFillOnHeightChange
+         * @protected
+         * @param {String} type The event type
+         * @param {Array} args The array of arguments passed to event subscribers
+         * @param {HTMLElement} el The header, body or footer element which is to be resized to fill
+         * out the containers height
+         */
+        _autoFillOnHeightChange : function(type, args, el) {
+            Panel.superclass._autoFillOnHeightChange.apply(this, arguments);
+            if (bIEQuirks) {
+                var panel = this;
+                setTimeout(function() {
+                    panel.sizeUnderlay();
+                },0);
+            }
+        },
+
+        /**
         * The default event handler fired when the "width" property is changed.
         * @method configWidth
         * @param {String} type The CustomEvent type (usually the property name)
@@ -5955,35 +6764,25 @@
         * this will usually equal the owner.
         */
         configzIndex: function (type, args, obj) {
-    
             Panel.superclass.configzIndex.call(this, type, args, obj);
-        
-            var maskZ = 0,
-                currentZ = Dom.getStyle(this.element, "zIndex");
-        
-            if (this.mask) {
 
-                if (!currentZ || isNaN(currentZ)) {
-                    currentZ = 0;
+            if (this.mask || this.cfg.getProperty("modal") === true) {
+                var panelZ = Dom.getStyle(this.element, "zIndex");
+                if (!panelZ || isNaN(panelZ)) {
+                    panelZ = 0;
                 }
-        
-                if (currentZ === 0) {
 
+                if (panelZ === 0) {
+                    // Recursive call to configzindex (which should be stopped
+                    // from going further because panelZ should no longer === 0)
                     this.cfg.setProperty("zIndex", 1);
-
                 } else {
-
-                    maskZ = currentZ - 1;
-                    Dom.setStyle(this.mask, "zIndex", maskZ);
-
+                    this.stackMask();
                 }
-        
             }
         },
-        
+
         // END BUILT-IN PROPERTY EVENT HANDLERS //
-        
-        
         /**
         * Builds the wrapping container around the Panel that is used for 
         * positioning the shadow and matte underlays. The container element is 
@@ -5992,147 +6791,135 @@
         * @method buildWrapper
         */
         buildWrapper: function () {
-    
+
             var elementParent = this.element.parentNode,
                 originalElement = this.element,
                 wrapper = document.createElement("div");
-    
+
             wrapper.className = Panel.CSS_PANEL_CONTAINER;
             wrapper.id = originalElement.id + "_c";
-        
+
             if (elementParent) {
                 elementParent.insertBefore(wrapper, originalElement);
             }
-        
+
             wrapper.appendChild(originalElement);
-        
+
             this.element = wrapper;
             this.innerElement = originalElement;
-        
+
             Dom.setStyle(this.innerElement, "visibility", "inherit");
         },
-        
+
         /**
         * Adjusts the size of the shadow based on the size of the element.
         * @method sizeUnderlay
         */
         sizeUnderlay: function () {
-
             var oUnderlay = this.underlay,
                 oElement;
 
             if (oUnderlay) {
-
                 oElement = this.element;
-
                 oUnderlay.style.width = oElement.offsetWidth + "px";
                 oUnderlay.style.height = oElement.offsetHeight + "px";
-
             }
-
         },
 
-        
         /**
         * Registers the Panel's header for drag & drop capability.
         * @method registerDragDrop
         */
         registerDragDrop: function () {
-    
+
             var me = this;
-    
+
             if (this.header) {
-        
-                if (!DD) {
-        
-        
+
+                if (!Util.DD) {
                     return;
-                
                 }
-        
-                this.dd = new DD(this.element.id, this.id);
-        
+
+                var bDragOnly = (this.cfg.getProperty("dragonly") === true);
+                this.dd = new Util.DD(this.element.id, this.id, {dragOnly: bDragOnly});
+
                 if (!this.header.id) {
                     this.header.id = this.id + "_h";
                 }
-        
-    
+
                 this.dd.startDrag = function () {
-        
+
                     var offsetHeight,
                         offsetWidth,
                         viewPortWidth,
                         viewPortHeight,
                         scrollX,
-                        scrollY,
-                        topConstraint,
-                        leftConstraint,
-                        bottomConstraint,
-                        rightConstraint;
-    
+                        scrollY;
+
                     if (YAHOO.env.ua.ie == 6) {
                         Dom.addClass(me.element,"drag");
                     }
-        
+
                     if (me.cfg.getProperty("constraintoviewport")) {
-    
+
+                        var nViewportOffset = Overlay.VIEWPORT_OFFSET;
+
                         offsetHeight = me.element.offsetHeight;
                         offsetWidth = me.element.offsetWidth;
-                        
+
                         viewPortWidth = Dom.getViewportWidth();
                         viewPortHeight = Dom.getViewportHeight();
-                        
+
                         scrollX = Dom.getDocumentScrollLeft();
                         scrollY = Dom.getDocumentScrollTop();
-                        
-                        topConstraint = scrollY + 10;
-                        leftConstraint = scrollX + 10;
 
-                        bottomConstraint = 
-                            scrollY + viewPortHeight - offsetHeight - 10;
+                        if (offsetHeight + nViewportOffset < viewPortHeight) {
+                            this.minY = scrollY + nViewportOffset;
+                            this.maxY = scrollY + viewPortHeight - offsetHeight - nViewportOffset;
+                        } else {
+                            this.minY = scrollY + nViewportOffset;
+                            this.maxY = scrollY + nViewportOffset;
+                        }
 
-                        rightConstraint = 
-                            scrollX + viewPortWidth - offsetWidth - 10;
-        
-                        this.minX = leftConstraint;
-                        this.maxX = rightConstraint;
+                        if (offsetWidth + nViewportOffset < viewPortWidth) {
+                            this.minX = scrollX + nViewportOffset;
+                            this.maxX = scrollX + viewPortWidth - offsetWidth - nViewportOffset;
+                        } else {
+                            this.minX = scrollX + nViewportOffset;
+                            this.maxX = scrollX + nViewportOffset;
+                        }
+
                         this.constrainX = true;
-        
-                        this.minY = topConstraint;
-                        this.maxY = bottomConstraint;
                         this.constrainY = true;
-    
                     } else {
-    
                         this.constrainX = false;
                         this.constrainY = false;
-    
                     }
-        
+
                     me.dragEvent.fire("startDrag", arguments);
                 };
-        
+
                 this.dd.onDrag = function () {
                     me.syncPosition();
                     me.cfg.refireEvent("iframe");
                     if (this.platform == "mac" && YAHOO.env.ua.gecko) {
                         this.showMacGeckoScrollbars();
                     }
-        
+
                     me.dragEvent.fire("onDrag", arguments);
                 };
-        
+
                 this.dd.endDrag = function () {
 
                     if (YAHOO.env.ua.ie == 6) {
                         Dom.removeClass(me.element,"drag");
                     }
-        
+
                     me.dragEvent.fire("endDrag", arguments);
                     me.moveEvent.fire(me.cfg.getProperty("xy"));
-                    
+
                 };
-        
+
                 this.dd.setHandleElId(this.header.id);
                 this.dd.addInvalidHandleType("INPUT");
                 this.dd.addInvalidHandleType("SELECT");
@@ -6146,42 +6933,41 @@
         * @method buildMask
         */
         buildMask: function () {
-    
             var oMask = this.mask;
-    
             if (!oMask) {
-
                 if (!m_oMaskTemplate) {
-                
                     m_oMaskTemplate = document.createElement("div");
                     m_oMaskTemplate.className = "mask";
                     m_oMaskTemplate.innerHTML = "&#160;";
-                
                 }
-
                 oMask = m_oMaskTemplate.cloneNode(true);
                 oMask.id = this.id + "_mask";
 
                 document.body.insertBefore(oMask, document.body.firstChild);
-                
+
                 this.mask = oMask;
 
-            }
+                if (YAHOO.env.ua.gecko && this.platform == "mac") {
+                    Dom.addClass(this.mask, "block-scrollbars");
+                }
 
+                // Stack mask based on the element zindex
+                this.stackMask();
+            }
         },
-        
+
         /**
         * Hides the modality mask.
         * @method hideMask
         */
         hideMask: function () {
             if (this.cfg.getProperty("modal") && this.mask) {
                 this.mask.style.display = "none";
-                this.hideMaskEvent.fire();
                 Dom.removeClass(document.body, "masked");
+                this.hideMaskEvent.fire();
             }
         },
-        
+
         /**
         * Shows the modality mask.
         * @method showMask
@@ -6194,24 +6980,55 @@
                 this.showMaskEvent.fire();
             }
         },
-        
+
         /**
         * Sets the size of the modality mask to cover the entire scrollable 
         * area of the document
         * @method sizeMask
         */
         sizeMask: function () {
-
             if (this.mask) {
 
-                this.mask.style.height = Dom.getDocumentHeight() + "px";
-                this.mask.style.width = Dom.getDocumentWidth() + "px";
+                // Shrink mask first, so it doesn't affect the document size.
+                var mask = this.mask,
+                    viewWidth = Dom.getViewportWidth(),
+                    viewHeight = Dom.getViewportHeight();
 
+                if (mask.offsetHeight > viewHeight) {
+                    mask.style.height = viewHeight + "px";
+                }
+
+                if (mask.offsetWidth > viewWidth) {
+                    mask.style.width = viewWidth + "px";
+                }
+
+                // Then size it to the document
+                mask.style.height = Dom.getDocumentHeight() + "px";
+                mask.style.width = Dom.getDocumentWidth() + "px";
             }
+        },
 
+        /**
+         * Sets the zindex of the mask, if it exists, based on the zindex of 
+         * the Panel element. The zindex of the mask is set to be one less 
+         * than the Panel element's zindex.
+         * 
+         * <p>NOTE: This method will not bump up the zindex of the Panel
+         * to ensure that the mask has a non-negative zindex. If you require the
+         * mask zindex to be 0 or higher, the zindex of the Panel 
+         * should be set to a value higher than 0, before this method is called.
+         * </p>
+         * @method stackMask
+         */
+        stackMask: function() {
+            if (this.mask) {
+                var panelZ = Dom.getStyle(this.element, "zIndex");
+                if (!YAHOO.lang.isUndefined(panelZ) && !isNaN(panelZ)) {
+                    Dom.setStyle(this.mask, "zIndex", panelZ - 1);
+                }
+            }
         },
 
-        
         /**
         * Renders the Panel by inserting the elements that are not already in 
         * the main Panel into their correct places. Optionally appends the 
@@ -6240,22 +7057,27 @@
         * @method destroy
         */
         destroy: function () {
-        
             Overlay.windowResizeEvent.unsubscribe(this.sizeMask, this);
-            
             this.removeMask();
-        
             if (this.close) {
-            
                 Event.purgeElement(this.close);
-        
             }
-        
             Panel.superclass.destroy.call(this);  
-        
         },
-        
+
         /**
+         * Forces the underlay element to be repainted through the application/removal 
+         * of a yui-force-redraw class to the underlay element.
+         *
+         * @method forceUnderlayRedraw
+         */
+        forceUnderlayRedraw : function () {
+            var u = this.underlay;
+            Dom.addClass(u, "yui-force-redraw");
+            setTimeout(function(){Dom.removeClass(u, "yui-force-redraw");}, 0);
+        },
+
+        /**
         * Returns a String representation of the object.
         * @method toString
         * @return {String} The string representation of the Panel.
@@ -6267,15 +7089,26 @@
     });
 
 }());
+
 (function () {
 
     /**
+    * <p>
     * Dialog is an implementation of Panel that can be used to submit form 
-    * data. Built-in functionality for buttons with event handlers is included, 
-    * and button sets can be build dynamically, or the preincluded ones for 
-    * Submit/Cancel and OK/Cancel can be utilized. Forms can be processed in 3
-    * ways -- via an asynchronous Connection utility call, a simple form 
-    * POST or GET, or manually.
+    * data.
+    * </p>
+    * <p>
+    * Built-in functionality for buttons with event handlers is included. 
+    * If the optional YUI Button dependancy is included on the page, the buttons
+    * created will be instances of YAHOO.widget.Button, otherwise regular HTML buttons
+    * will be created.
+    * </p>
+    * <p>
+    * Forms can be processed in 3 ways -- via an asynchronous Connection utility call, 
+    * a simple form POST or GET, or manually. The YUI Connection utility should be
+    * included if you're using the default "async" postmethod, but is not required if
+    * you're using any of the other postmethod values.
+    * </p>
     * @namespace YAHOO.widget
     * @class Dialog
     * @extends YAHOO.widget.Panel
@@ -6287,38 +7120,31 @@
     * documentation for more details.
     */
     YAHOO.widget.Dialog = function (el, userConfig) {
-    
         YAHOO.widget.Dialog.superclass.constructor.call(this, el, userConfig);
-    
     };
 
-
     var Event = YAHOO.util.Event,
         CustomEvent = YAHOO.util.CustomEvent,
         Dom = YAHOO.util.Dom,
-        KeyListener = YAHOO.util.KeyListener,
-        Connect = YAHOO.util.Connect,
         Dialog = YAHOO.widget.Dialog,
         Lang = YAHOO.lang,
 
         /**
-        * Constant representing the name of the Dialog's events
-        * @property EVENT_TYPES
-        * @private
-        * @final
-        * @type Object
-        */
+         * Constant representing the name of the Dialog's events
+         * @property EVENT_TYPES
+         * @private
+         * @final
+         * @type Object
+         */
         EVENT_TYPES = {
-        
             "BEFORE_SUBMIT": "beforeSubmit",
             "SUBMIT": "submit",
             "MANUAL_SUBMIT": "manualSubmit",
             "ASYNC_SUBMIT": "asyncSubmit",
             "FORM_SUBMIT": "formSubmit",
             "CANCEL": "cancel"
-        
         },
-        
+
         /**
         * Constant representing the Dialog's configuration properties
         * @property DEFAULT_CONFIG
@@ -6327,19 +7153,29 @@
         * @type Object
         */
         DEFAULT_CONFIG = {
-        
+
             "POST_METHOD": { 
                 key: "postmethod", 
-                value: "async" 
+                value: "async"
             },
-            
-            "BUTTONS": { 
-                key: "buttons", 
-                value: "none" 
+
+            "POST_DATA" : {
+                key: "postdata",
+                value: null
+            },
+
+            "BUTTONS": {
+                key: "buttons",
+                value: "none",
+                supercedes: ["visible"]
+            },
+
+            "HIDEAFTERSUBMIT" : {
+                key: "hideaftersubmit",
+                value: true
             }
-        
-        };    
 
+        };
 
     /**
     * Constant representing the default CSS class used for a Dialog
@@ -6350,7 +7186,6 @@
     */
     Dialog.CSS_DIALOG = "yui-dialog";
 
-
     function removeButtonEventHandlers() {
 
         var aButtons = this._aButtons,
@@ -6359,42 +7194,28 @@
             i;
 
         if (Lang.isArray(aButtons)) {
-
             nButtons = aButtons.length;
 
             if (nButtons > 0) {
-
                 i = nButtons - 1;
-
                 do {
-
                     oButton = aButtons[i];
-                    
-                    if (oButton instanceof YAHOO.widget.Button) {
-                        
+
+                    if (YAHOO.widget.Button && oButton instanceof YAHOO.widget.Button) {
                         oButton.destroy();
-                        
                     }
                     else if (oButton.tagName.toUpperCase() == "BUTTON") {
-
                         Event.purgeElement(oButton);
                         Event.purgeElement(oButton, false);
-
                     }
-
                 }
                 while (i--);
-            
             }
-        
         }
-
     }
-    
-    
+
     YAHOO.extend(Dialog, YAHOO.widget.Panel, { 
 
-        
         /**
         * @property form
         * @description Object reference to the Dialog's 
@@ -6412,44 +7233,67 @@
         */
         initDefaultConfig: function () {
             Dialog.superclass.initDefaultConfig.call(this);
-        
+
             /**
             * The internally maintained callback object for use with the 
-            * Connection utility
+            * Connection utility. The format of the callback object is 
+            * similar to Connection Manager's callback object and is 
+            * simply passed through to Connection Manager when the async 
+            * request is made.
             * @property callback
             * @type Object
             */
             this.callback = {
-    
+
                 /**
                 * The function to execute upon success of the 
-                * Connection submission
+                * Connection submission (when the form does not
+                * contain a file input element).
+                * 
                 * @property callback.success
                 * @type Function
                 */
                 success: null,
-    
+
                 /**
                 * The function to execute upon failure of the 
                 * Connection submission
                 * @property callback.failure
                 * @type Function
                 */
                 failure: null,
-    
+
                 /**
+                *<p>
+                * The function to execute upon success of the 
+                * Connection submission, when the form contains
+                * a file input element.
+                * </p>
+                * <p>
+                * <em>NOTE:</em> Connection manager will not
+                * invoke the success or failure handlers for the file
+                * upload use case. This will be the only callback
+                * handler invoked.
+                * </p>
+                * <p>
+                * For more information, see the <a href="http://developer.yahoo.com/yui/connection/#file">
+                * Connection Manager documenation on file uploads</a>.
+                * </p>
+                * @property callback.upload
+                * @type Function
+                */
+
+                /**
                 * The arbitraty argument or arguments to pass to the Connection 
                 * callback functions
                 * @property callback.argument
                 * @type Object
                 */
                 argument: null
-    
+
             };
-        
 
             // Add form dialog config properties //
-            
             /**
             * The method to use for posting the Dialog's form. Possible values 
             * are "async", "form", and "manual".
@@ -6469,55 +7313,107 @@
                     }
                 }
             });
-            
+
             /**
+            * Any additional post data which needs to be sent when using the 
+            * <a href="#config_postmethod">async</a> postmethod for dialog POST submissions.
+            * The format for the post data string is defined by Connection Manager's 
+            * <a href="YAHOO.util.Connect.html#method_asyncRequest">asyncRequest</a> 
+            * method.
+            * @config postdata
+            * @type String
+            * @default null
+            */
+            this.cfg.addProperty(DEFAULT_CONFIG.POST_DATA.key, {
+                value: DEFAULT_CONFIG.POST_DATA.value
+            });
+
+            /**
+            * This property is used to configure whether or not the 
+            * dialog should be automatically hidden after submit.
+            * 
+            * @config hideaftersubmit
+            * @type Boolean
+            * @default true
+            */
+            this.cfg.addProperty(DEFAULT_CONFIG.HIDEAFTERSUBMIT.key, {
+                value: DEFAULT_CONFIG.HIDEAFTERSUBMIT.value
+            });
+
+            /**
             * Array of object literals, each containing a set of properties 
             * defining a button to be appended into the Dialog's footer.
-            * Each button object in the buttons array can have three properties:
-            * <dt>text:</dt>
-            * <dd>The text that will display on the face of the button.  <em>
-            * Please note:</em> As of version 2.3, the text can include 
-            * HTML.</dd>
-            * <dt>handler:</dt>
-            * <dd>Can be either:
-            *     <ol>
-            *         <li>A reference to a function that should fire when the 
-            * button is clicked.  (In this case scope of this function is 
-            * always its Dialog instance.)</li>
-            *         <li>An object literal representing the code to be 
-            * executed when the button is clicked.  Format:<br> <code> {<br>  
-            * <strong>fn:</strong> Function,   &#47;&#47; The handler to call 
-            * when  the event fires.<br> <strong>obj:</strong> Object, 
-            * &#47;&#47; An  object to pass back to the handler.<br> <strong>
-            * scope:</strong>  Object &#47;&#47; The object to use for the 
-            * scope of the handler. <br> } </code> <br><em>Please note: this 
-            * functionality was added in version 2.3.</em></li>
+            *
+            * <p>Each button object in the buttons array can have three properties:</p>
+            * <dl>
+            *    <dt>text:</dt>
+            *    <dd>
+            *       The text that will display on the face of the button. The text can 
+            *       include HTML, as long as it is compliant with HTML Button specifications.
+            *    </dd>
+            *    <dt>handler:</dt>
+            *    <dd>Can be either:
+            *    <ol>
+            *       <li>A reference to a function that should fire when the 
+            *       button is clicked.  (In this case scope of this function is 
+            *       always its Dialog instance.)</li>
+            *
+            *       <li>An object literal representing the code to be 
+            *       executed when the button is clicked.
+            *       
+            *       <p>Format:</p>
+            *
+            *       <p>
+            *       <code>{
+            *       <br>
+            *       <strong>fn:</strong> Function, &#47;&#47;
+            *       The handler to call when  the event fires.
+            *       <br>
+            *       <strong>obj:</strong> Object, &#47;&#47; 
+            *       An  object to pass back to the handler.
+            *       <br>
+            *       <strong>scope:</strong> Object &#47;&#47; 
+            *       The object to use for the scope of the handler.
+            *       <br>
+            *       }</code>
+            *       </p>
+            *       </li>
             *     </ol>
-            * </dd>
-            * <dt>isDefault:</dt>
-            * <dd>An optional boolean value that specifies that a button 
-            * should be highlighted and focused by default.</dd>
+            *     </dd>
+            *     <dt>isDefault:</dt>
+            *     <dd>
+            *        An optional boolean value that specifies that a button 
+            *        should be highlighted and focused by default.
+            *     </dd>
+            * </dl>
+            *
+            * <em>NOTE:</em>If the YUI Button Widget is included on the page, 
+            * the buttons created will be instances of YAHOO.widget.Button. 
+            * Otherwise, HTML Buttons (<code>&#60;BUTTON&#62;</code>) will be 
+            * created.
+            *
             * @config buttons
             * @type {Array|String}
             * @default "none"
             */
             this.cfg.addProperty(DEFAULT_CONFIG.BUTTONS.key, {
                 handler: this.configButtons,
-                value: DEFAULT_CONFIG.BUTTONS.value
+                value: DEFAULT_CONFIG.BUTTONS.value,
+                supercedes : DEFAULT_CONFIG.BUTTONS.supercedes
             }); 
-            
+
         },
-        
+
         /**
         * Initializes the custom events for Dialog which are fired 
         * automatically at appropriate times by the Dialog class.
         * @method initEvents
         */
         initEvents: function () {
             Dialog.superclass.initEvents.call(this);
-        
+
             var SIGNATURE = CustomEvent.LIST;
-        
+
             /**
             * CustomEvent fired prior to submission
             * @event beforeSubmitEvent
@@ -6534,27 +7430,29 @@
             this.submitEvent.signature = SIGNATURE;
         
             /**
-            * CustomEvent fired prior to manual submission
+            * CustomEvent fired for manual submission, before the generic submit event is fired
             * @event manualSubmitEvent
             */
             this.manualSubmitEvent = 
                 this.createEvent(EVENT_TYPES.MANUAL_SUBMIT);
             this.manualSubmitEvent.signature = SIGNATURE;
-        
+
             /**
-            * CustomEvent fired prior to asynchronous submission
+            * CustomEvent fired after asynchronous submission, before the generic submit event is fired
+            *
             * @event asyncSubmitEvent
-            */ 
+            * @param {Object} conn The connection object, returned by YAHOO.util.Connect.asyncRequest
+            */
             this.asyncSubmitEvent = this.createEvent(EVENT_TYPES.ASYNC_SUBMIT);
             this.asyncSubmitEvent.signature = SIGNATURE;
-        
+
             /**
-            * CustomEvent fired prior to form-based submission
+            * CustomEvent fired after form-based submission, before the generic submit event is fired
             * @event formSubmitEvent
             */
             this.formSubmitEvent = this.createEvent(EVENT_TYPES.FORM_SUBMIT);
             this.formSubmitEvent.signature = SIGNATURE;
-        
+
             /**
             * CustomEvent fired after cancel
             * @event cancelEvent
@@ -6569,6 +7467,7 @@
         * all of its subclasses. This method is automatically called by the 
         * constructor, and  sets up all DOM references for pre-existing markup, 
         * and creates required markup if it is not already present.
+        * 
         * @method init
         * @param {String} el The element ID representing the Dialog <em>OR</em>
         * @param {HTMLElement} el The element representing the Dialog
@@ -6584,25 +7483,25 @@
             */
 
             Dialog.superclass.init.call(this, el/*, userConfig*/); 
-        
+
             this.beforeInitEvent.fire(Dialog);
-        
+
             Dom.addClass(this.element, Dialog.CSS_DIALOG);
-        
+
             this.cfg.setProperty("visible", false);
-        
+
             if (userConfig) {
                 this.cfg.applyConfig(userConfig, true);
             }
-        
+
             this.showEvent.subscribe(this.focusFirst, this, true);
             this.beforeHideEvent.subscribe(this.blurButtons, this, true);
 
             this.subscribe("changeBody", this.registerForm);
-        
+
             this.initEvent.fire(Dialog);
         },
-        
+
         /**
         * Submits the Dialog's form depending on the value of the 
         * "postmethod" configuration property.  <strong>Please note:
@@ -6618,216 +7517,200 @@
         * @method doSubmit
         */
         doSubmit: function () {
-    
-            var oForm = this.form,
+
+            var Connect = YAHOO.util.Connect,
+                oForm = this.form,
                 bUseFileUpload = false,
                 bUseSecureFileUpload = false,
                 aElements,
                 nElements,
                 i,
-                sMethod;
+                formAttrs;
 
-
             switch (this.cfg.getProperty("postmethod")) {
-    
-            case "async":
 
-                aElements = oForm.elements;
-                nElements = aElements.length;
+                case "async":
+                    aElements = oForm.elements;
+                    nElements = aElements.length;
 
-                if (nElements > 0) {
-                
-                    i = nElements - 1;
-                
-                    do {
-                    
-                        if (aElements[i].type == "file") {
-                        
-                            bUseFileUpload = true;
-                            break;
-                        
+                    if (nElements > 0) {
+                        i = nElements - 1;
+                        do {
+                            if (aElements[i].type == "file") {
+                                bUseFileUpload = true;
+                                break;
+                            }
                         }
-                    
+                        while(i--);
                     }
-                    while(i--);
-                
-                }
 
-                if (bUseFileUpload && YAHOO.env.ua.ie && this.isSecure) {
+                    if (bUseFileUpload && YAHOO.env.ua.ie && this.isSecure) {
+                        bUseSecureFileUpload = true;
+                    }
 
-                    bUseSecureFileUpload = true;
-                
-                }
+                    formAttrs = this._getFormAttributes(oForm);
 
-                sMethod = 
-                    (oForm.getAttribute("method") || "POST").toUpperCase();
+                    Connect.setForm(oForm, bUseFileUpload, bUseSecureFileUpload);
 
-                Connect.setForm(oForm, bUseFileUpload, bUseSecureFileUpload);
+                    var postData = this.cfg.getProperty("postdata");
+                    var c = Connect.asyncRequest(formAttrs.method, formAttrs.action, this.callback, postData);
 
-                Connect.asyncRequest(sMethod, oForm.getAttribute("action"), 
-                    this.callback);
+                    this.asyncSubmitEvent.fire(c);
 
-                this.asyncSubmitEvent.fire();
+                    break;
 
-                break;
+                case "form":
+                    oForm.submit();
+                    this.formSubmitEvent.fire();
+                    break;
 
-            case "form":
+                case "none":
+                case "manual":
+                    this.manualSubmitEvent.fire();
+                    break;
+            }
+        },
 
-                oForm.submit();
-                this.formSubmitEvent.fire();
+        /**
+         * Retrieves important attributes (currently method and action) from
+         * the form element, accounting for any elements which may have the same name 
+         * as the attributes. Defaults to "POST" and "" for method and action respectively
+         * if the attribute cannot be retrieved.
+         *
+         * @method _getFormAttributes
+         * @protected
+         * @param {HTMLFormElement} oForm The HTML Form element from which to retrieve the attributes
+         * @return {Object} Object literal, with method and action String properties.
+         */
+        _getFormAttributes : function(oForm){
+            var attrs = {
+                method : null,
+                action : null
+            };
 
-                break;
+            if (oForm) {
+                if (oForm.getAttributeNode) {
+                    var action = oForm.getAttributeNode("action");
+                    var method = oForm.getAttributeNode("method");
 
-            case "none":
-            case "manual":
+                    if (action) {
+                        attrs.action = action.value;
+                    }
 
-                this.manualSubmitEvent.fire();
+                    if (method) {
+                        attrs.method = method.value;
+                    }
 
-                break;
-    
+                } else {
+                    attrs.action = oForm.getAttribute("action");
+                    attrs.method = oForm.getAttribute("method");
+                }
             }
-    
+
+            attrs.method = (Lang.isString(attrs.method) ? attrs.method : "POST").toUpperCase();
+            attrs.action = Lang.isString(attrs.action) ? attrs.action : "";
+
+            return attrs;
         },
-        
-        
+
         /**
         * Prepares the Dialog's internal FORM object, creating one if one is
         * not currently present.
         * @method registerForm
         */
-        registerForm: function () {
-    
-            var form = this.element.getElementsByTagName("form")[0],
-                me = this,
-                firstElement,
-                lastElement;
+        registerForm: function() {
 
+            var form = this.element.getElementsByTagName("form")[0];
 
             if (this.form) {
-
-                if (this.form == form && 
-                    Dom.isAncestor(this.element, this.form)) {
-    
+                if (this.form == form && Dom.isAncestor(this.element, this.form)) {
                     return;
-    
-                }
-                else {
-
+                } else {
                     Event.purgeElement(this.form);
-                    
-                    this.form = null;                
-                
+                    this.form = null;
                 }
-            
             }
-        
 
             if (!form) {
-
                 form = document.createElement("form");
                 form.name = "frm_" + this.id;
-
                 this.body.appendChild(form);
+            }
 
+            if (form) {
+                this.form = form;
+                Event.on(form, "submit", this._submitHandler, this, true);
             }
+        },
 
+        /**
+         * Internal handler for the form submit event
+         *
+         * @method _submitHandler
+         * @protected
+         * @param {DOMEvent} e The DOM Event object
+         */
+        _submitHandler : function(e) {
+            Event.stopEvent(e);
+            this.submit();
+            this.form.blur();
+        },
 
-            if (form) {
+        /**
+         * Sets up a tab, shift-tab loop between the first and last elements
+         * provided. NOTE: Sets up the preventBackTab and preventTabOut KeyListener
+         * instance properties, which are reset everytime this method is invoked.
+         *
+         * @method setTabLoop
+         * @param {HTMLElement} firstElement
+         * @param {HTMLElement} lastElement
+         *
+         */
+        setTabLoop : function(firstElement, lastElement) {
 
-                this.form = form;
+            firstElement = firstElement || this.firstButton;
+            lastElement = this.lastButton || lastElement;
 
-                Event.on(form, "submit", function (e) {
+            Dialog.superclass.setTabLoop.call(this, firstElement, lastElement);
+        },
 
-                    Event.stopEvent(e);
+        /**
+         * Configures instance properties, pointing to the 
+         * first and last focusable elements in the Dialog's form.
+         *
+         * @method setFirstLastFocusable
+         */
+        setFirstLastFocusable : function() {
 
-                    this.submit();
-                    this.form.blur();
-        
-                });
+            Dialog.superclass.setFirstLastFocusable.call(this);
 
+            var i, l, el, elements = this.focusableElements;
 
-                this.firstFormElement = function () {
-        
-                    var f, el, nElements = form.elements.length;
-        
-                    for (f = 0; f < nElements; f++) {
-    
-                        el = form.elements[f];
-    
-                        if (el.focus && !el.disabled && el.type != "hidden") {
-    
-                            return el;
-    
-                        }
-    
+            this.firstFormElement = null;
+            this.lastFormElement = null;
+
+            if (this.form && elements && elements.length > 0) {
+                l = elements.length;
+
+                for (i = 0; i < l; ++i) {
+                    el = elements[i];
+                    if (this.form === el.form) {
+                        this.firstFormElement = el;
+                        break;
                     }
-    
-                    return null;
-                    
-                }();
-            
-                this.lastFormElement = function () {
-        
-                    var f, el, nElements = form.elements.length;
-        
-                    for (f = nElements - 1; f >= 0; f--) {
-    
-                        el = form.elements[f];
-    
-                        if (el.focus && !el.disabled && el.type != "hidden") {
-    
-                            return el;
-    
-                        }
-    
+                }
+
+                for (i = l-1; i >= 0; --i) {
+                    el = elements[i];
+                    if (this.form === el.form) {
+                        this.lastFormElement = el;
+                        break;
                     }
-    
-                    return null;
-    
-                }();
-            
-                if (this.cfg.getProperty("modal")) {
-            
-                    firstElement = this.firstFormElement || this.firstButton;
-        
-                    if (firstElement) {
-    
-                        this.preventBackTab = new KeyListener(firstElement, 
-                            { shift: true, keys: 9 }, 
-                            { fn: me.focusLast, scope: me, 
-                            correctScope: true });
-    
-                        this.showEvent.subscribe(this.preventBackTab.enable, 
-                            this.preventBackTab, true);
-    
-                        this.hideEvent.subscribe(this.preventBackTab.disable, 
-                            this.preventBackTab, true);
-                    }
-            
-                    lastElement = this.lastButton || this.lastFormElement;
-    
-                    if (lastElement) {
-    
-                        this.preventTabOut = new KeyListener(lastElement, 
-                            { shift: false, keys: 9 }, 
-                            { fn: me.focusFirst, scope: me, 
-                            correctScope: true });
-    
-                        this.showEvent.subscribe(this.preventTabOut.enable, 
-                            this.preventTabOut, true);
-    
-                        this.hideEvent.subscribe(this.preventTabOut.disable, 
-                            this.preventTabOut, true);
-    
-                    }
                 }
-            
             }
-
         },
-        
+
         // BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
-        
         /**
         * The default event handler fired when the "close" property is 
         * changed. The method controls the appending or hiding of the close
@@ -6841,31 +7724,23 @@
         * this will usually equal the owner.
         */
         configClose: function (type, args, obj) {
-            var val = args[0];
-        
-            function doCancel(e, obj) {
-                obj.cancel();
-            }
-        
-            if (val) {
-                if (! this.close) {
-                    this.close = document.createElement("div");
-                    Dom.addClass(this.close, "container-close");
-        
-                    this.close.innerHTML = "&#160;";
-                    this.innerElement.appendChild(this.close);
-                    Event.on(this.close, "click", doCancel, this);
-                } else {
-                    this.close.style.display = "block";
-                }
-            } else {
-                if (this.close) {
-                    this.close.style.display = "none";
-                }
-            }
+            Dialog.superclass.configClose.apply(this, arguments);
         },
-        
+
         /**
+         * Event handler for the close icon
+         * 
+         * @method _doClose
+         * @protected
+         * 
+         * @param {DOMEvent} e
+         */
+         _doClose : function(e) {
+            Event.preventDefault(e);
+            this.cancel();
+        },
+
+        /**
         * The default event handler for the "buttons" configuration property
         * @method configButtons
         * @param {String} type The CustomEvent type (usually the property name)
@@ -6875,7 +7750,7 @@
         * this will usually equal the owner.
         */
         configButtons: function (type, args, obj) {
-    
+
             var Button = YAHOO.widget.Button,
                 aButtons = args[0],
                 oInnerElement = this.innerElement,
@@ -6888,293 +7763,234 @@
                 i;
 
             removeButtonEventHandlers.call(this);
-            
+
             this._aButtons = null;
 
             if (Lang.isArray(aButtons)) {
 
                 oSpan = document.createElement("span");
                 oSpan.className = "button-group";
-
                 nButtons = aButtons.length;
 
                 this._aButtons = [];
-        
-                for (i = 0; i < nButtons; i++) {
+                this.defaultHtmlButton = null;
 
+                for (i = 0; i < nButtons; i++) {
                     oButton = aButtons[i];
 
                     if (Button) {
+                        oYUIButton = new Button({ label: oButton.text});
+                        oYUIButton.appendTo(oSpan);
 
-                        oYUIButton = new Button({ label: oButton.text, 
-                                            container: oSpan });
-
                         oButtonEl = oYUIButton.get("element");
 
                         if (oButton.isDefault) {
-
                             oYUIButton.addClass("default");
-
                             this.defaultHtmlButton = oButtonEl;
-
                         }
-    
+
                         if (Lang.isFunction(oButton.handler)) {
-    
-                            oYUIButton.set("onclick", { fn: oButton.handler, 
-                                obj: this, scope: this });
-            
-                        }
-                        else if (Lang.isObject(oButton.handler) && 
-                            Lang.isFunction(oButton.handler.fn)) {
 
-                            oYUIButton.set("onclick", { fn: oButton.handler.fn, 
-                                obj: ((!Lang.isUndefined(oButton.handler.obj)) ? 
-                                oButton.handler.obj : this), 
-                                scope: (oButton.handler.scope || this) });
-    
+                            oYUIButton.set("onclick", { 
+                                fn: oButton.handler, 
+                                obj: this, 
+                                scope: this 
+                            });
+
+                        } else if (Lang.isObject(oButton.handler) && Lang.isFunction(oButton.handler.fn)) {
+
+                            oYUIButton.set("onclick", { 
+                                fn: oButton.handler.fn, 
+                                obj: ((!Lang.isUndefined(oButton.handler.obj)) ? oButton.handler.obj : this), 
+                                scope: (oButton.handler.scope || this) 
+                            });
+
                         }
 
                         this._aButtons[this._aButtons.length] = oYUIButton;
 
-                    }
-                    else {
-        
+                    } else {
+
                         oButtonEl = document.createElement("button");
                         oButtonEl.setAttribute("type", "button");
-            
+
                         if (oButton.isDefault) {
                             oButtonEl.className = "default";
                             this.defaultHtmlButton = oButtonEl;
                         }
-    
+
                         oButtonEl.innerHTML = oButton.text;
-    
+
                         if (Lang.isFunction(oButton.handler)) {
-    
-                            Event.on(oButtonEl, "click", oButton.handler, 
-                                this, true);
-            
-                        }
-                        else if (Lang.isObject(oButton.handler) && 
+                            Event.on(oButtonEl, "click", oButton.handler, this, true);
+                        } else if (Lang.isObject(oButton.handler) && 
                             Lang.isFunction(oButton.handler.fn)) {
     
-                            Event.on(oButtonEl, "click", oButton.handler.fn, 
-                                ((!Lang.isUndefined(oButton.handler.obj)) ? 
-                                oButton.handler.obj : this), 
+                            Event.on(oButtonEl, "click", 
+                                oButton.handler.fn, 
+                                ((!Lang.isUndefined(oButton.handler.obj)) ? oButton.handler.obj : this), 
                                 (oButton.handler.scope || this));
-    
                         }
-            
+
                         oSpan.appendChild(oButtonEl);
-                        
                         this._aButtons[this._aButtons.length] = oButtonEl;
-                        
                     }
 
                     oButton.htmlButton = oButtonEl;
-        
+
                     if (i === 0) {
                         this.firstButton = oButtonEl;
                     }
-        
+
                     if (i == (nButtons - 1)) {
                         this.lastButton = oButtonEl;
                     }
-        
                 }
-        
+
                 this.setFooter(oSpan);
 
                 oFooter = this.footer;
-                
-                if (Dom.inDocument(this.element) && 
-                    !Dom.isAncestor(oInnerElement, oFooter)) {
-    
+
+                if (Dom.inDocument(this.element) && !Dom.isAncestor(oInnerElement, oFooter)) {
                     oInnerElement.appendChild(oFooter);
-                
                 }
 
                 this.buttonSpan = oSpan;
 
             } else { // Do cleanup
-
                 oSpan = this.buttonSpan;
                 oFooter = this.footer;
-
                 if (oSpan && oFooter) {
-
                     oFooter.removeChild(oSpan);
-
                     this.buttonSpan = null;
                     this.firstButton = null;
                     this.lastButton = null;
                     this.defaultHtmlButton = null;
-
                 }
-
             }
 
-            this.cfg.refireEvent("iframe");
-            this.cfg.refireEvent("underlay");
-
+            this.changeContentEvent.fire();
         },
 
-
         /**
         * @method getButtons
         * @description Returns an array containing each of the Dialog's 
-        * buttons, by default an array of HTML <code>&#60;BUTTON&#60;</code> 
+        * buttons, by default an array of HTML <code>&#60;BUTTON&#62;</code> 
         * elements.  If the Dialog's buttons were created using the 
         * YAHOO.widget.Button class (via the inclusion of the optional Button 
         * dependancy on the page), an array of YAHOO.widget.Button instances 
         * is returned.
         * @return {Array}
         */
         getButtons: function () {
-        
-            var aButtons = this._aButtons;
-            
-            if (aButtons) {
-            
-                return aButtons;
-            
-            }
-        
+            return this._aButtons || null;
         },
 
-        
         /**
-        * Sets focus to the first element in the Dialog's form or the first 
-        * button defined via the "buttons" configuration property. Called 
-        * when the Dialog is made visible.
-        * @method focusFirst
-        */
+         * <p>
+         * Sets focus to the first focusable element in the Dialog's form if found, 
+         * else, the default button if found, else the first button defined via the 
+         * "buttons" configuration property.
+         * </p>
+         * <p>
+         * This method is invoked when the Dialog is made visible.
+         * </p>
+         * @method focusFirst
+         */
         focusFirst: function (type, args, obj) {
-    
-            var oElement = this.firstFormElement,
-                oEvent;
 
-            if (args) {
+            var el = this.firstFormElement;
 
-                oEvent = args[1];
-
-                if (oEvent) {
-
-                    Event.stopEvent(oEvent);
-
-                }
-
+            if (args && args[1]) {
+                Event.stopEvent(args[1]);
             }
-        
 
-            if (oElement) {
-
-                /*
-                    Place the call to the "focus" method inside a try/catch
-                    block to prevent IE from throwing JavaScript errors if
-                    the element is disabled or hidden.
-                */
-
+            if (el) {
                 try {
-
-                    oElement.focus();
-
+                    el.focus();
+                } catch(oException) {
+                    // Ignore
                 }
-                catch(oException) {
-
-                }
-
             } else {
-
-                this.focusDefaultButton();
-
+                if (this.defaultHtmlButton) {
+                    this.focusDefaultButton();
+                } else {
+                    this.focusFirstButton();
+                }
             }
-
         },
-        
+
         /**
         * Sets focus to the last element in the Dialog's form or the last 
         * button defined via the "buttons" configuration property.
         * @method focusLast
         */
         focusLast: function (type, args, obj) {
-    
+
             var aButtons = this.cfg.getProperty("buttons"),
-                oElement = this.lastFormElement,
-                oEvent;
-    
-            if (args) {
+                el = this.lastFormElement;
 
-                oEvent = args[1];
-
-                if (oEvent) {
-
-                    Event.stopEvent(oEvent);
-
-                }
-
+            if (args && args[1]) {
+                Event.stopEvent(args[1]);
             }
-            
-            if (aButtons && Lang.isArray(aButtons)) {
 
+            if (aButtons && Lang.isArray(aButtons)) {
                 this.focusLastButton();
-
             } else {
-
-                if (oElement) {
-
-                    /*
-                        Place the call to the "focus" method inside a try/catch
-                        block to prevent IE from throwing JavaScript errors if
-                        the element is disabled or hidden.
-                    */
-    
+                if (el) {
                     try {
-    
-                        oElement.focus();
-    
+                        el.focus();
+                    } catch(oException) {
+                        // Ignore
                     }
-                    catch(oException) {
-    
-                    }
-
                 }
+            }
+        },
 
+        /**
+         * Helper method to normalize button references. It either returns the 
+         * YUI Button instance for the given element if found,
+         * or the passes back the HTMLElement reference if a corresponding YUI Button
+         * reference is not found or YAHOO.widget.Button does not exist on the page.
+         *
+         * @method _getButton
+         * @private
+         * @param {HTMLElement} button
+         * @return {YAHOO.widget.Button|HTMLElement}
+         */
+        _getButton : function(button) {
+            var Button = YAHOO.widget.Button;
+
+            // If we have an HTML button and YUI Button is on the page, 
+            // get the YUI Button reference if available.
+            if (Button && button && button.nodeName && button.id) {
+                button = Button.getButton(button.id) || button;
             }
 
+            return button;
         },
-        
+
         /**
         * Sets the focus to the button that is designated as the default via 
         * the "buttons" configuration property. By default, this method is 
         * called when the Dialog is made visible.
         * @method focusDefaultButton
         */
         focusDefaultButton: function () {
-        
-            var oElement = this.defaultHtmlButton;
-        
-            if (oElement) {
-
+            var button = this._getButton(this.defaultHtmlButton);
+            if (button) {
                 /*
                     Place the call to the "focus" method inside a try/catch
                     block to prevent IE from throwing JavaScript errors if
                     the element is disabled or hidden.
                 */
-
                 try {
-
-                    oElement.focus();
-                
+                    button.focus();
+                } catch(oException) {
                 }
-                catch(oException) {
-                
-                }
-
             }
         },
-        
+
         /**
         * Blurs all the buttons defined via the "buttons" 
         * configuration property.
@@ -7189,124 +8005,84 @@
                 i;
 
             if (aButtons && Lang.isArray(aButtons)) {
-            
                 nButtons = aButtons.length;
-                
                 if (nButtons > 0) {
-                
                     i = (nButtons - 1);
-                    
                     do {
-                    
                         oButton = aButtons[i];
-                        
                         if (oButton) {
-
-                            oElement = oButton.htmlButton;
-
+                            oElement = this._getButton(oButton.htmlButton);
                             if (oElement) {
-
                                 /*
                                     Place the call to the "blur" method inside  
                                     a try/catch block to prevent IE from  
                                     throwing JavaScript errors if the element 
                                     is disabled or hidden.
                                 */
-    
                                 try {
-            
                                     oElement.blur();
-                                
+                                } catch(oException) {
+                                    // ignore
                                 }
-                                catch(oException) {
-                                
-                                
-                                }
-                            
                             }
-
                         }
-                    
-                    }
-                    while(i--);
-                
+                    } while(i--);
                 }
-            
             }
-
         },
-        
+
         /**
         * Sets the focus to the first button created via the "buttons"
         * configuration property.
         * @method focusFirstButton
         */
         focusFirstButton: function () {
-    
+
             var aButtons = this.cfg.getProperty("buttons"),
                 oButton,
                 oElement;
 
             if (aButtons && Lang.isArray(aButtons)) {
-
                 oButton = aButtons[0];
-
                 if (oButton) {
-
-                    oElement = oButton.htmlButton;
-                    
+                    oElement = this._getButton(oButton.htmlButton);
                     if (oElement) {
-
                         /*
                             Place the call to the "focus" method inside a 
                             try/catch block to prevent IE from throwing 
                             JavaScript errors if the element is disabled 
                             or hidden.
                         */
-    
                         try {
-    
                             oElement.focus();
-                        
+                        } catch(oException) {
+                            // ignore
                         }
-                        catch(oException) {
-                        
-                        
-                        }
-                    
                     }
-
                 }
-
             }
         },
-        
+
         /**
         * Sets the focus to the last button created via the "buttons" 
         * configuration property.
         * @method focusLastButton
         */
         focusLastButton: function () {
-    
+
             var aButtons = this.cfg.getProperty("buttons"),
                 nButtons,
                 oButton,
                 oElement;
 
             if (aButtons && Lang.isArray(aButtons)) {
-
                 nButtons = aButtons.length;
-                
                 if (nButtons > 0) {
-
                     oButton = aButtons[(nButtons - 1)];
-                    
-                    if (oButton) {
-                    
-                        oElement = oButton.htmlButton;
 
+                    if (oButton) {
+                        oElement = this._getButton(oButton.htmlButton);
                         if (oElement) {
-
                             /*
                                 Place the call to the "focus" method inside a 
                                 try/catch block to prevent IE from throwing 
@@ -7315,25 +8091,16 @@
                             */
         
                             try {
-        
                                 oElement.focus();
-                            
+                            } catch(oException) {
+                                // Ignore
                             }
-                            catch(oException) {
-                            
-                            
-                            }
-                        
                         }
-                    
                     }
-                
                 }
-            
             }
-
         },
-        
+
         /**
         * The default event handler for the "postmethod" configuration property
         * @method configPostMethod
@@ -7345,13 +8112,9 @@
         * this will usually equal the owner.
         */
         configPostMethod: function (type, args, obj) {
-    
-            var postmethod = args[0];
-        
             this.registerForm();
-    
         },
-        
+
         // END BUILT-IN PROPERTY EVENT HANDLERS //
         
         /**
@@ -7366,22 +8129,30 @@
         },
         
         /**
-        * Executes a submit of the Dialog followed by a hide, if validation 
-        * is successful.
+        * Executes a submit of the Dialog if validation 
+        * is successful. By default the Dialog is hidden
+        * after submission, but you can set the "hideaftersubmit"
+        * configuration property to false, to prevent the Dialog
+        * from being hidden.
+        * 
         * @method submit
         */
         submit: function () {
             if (this.validate()) {
                 this.beforeSubmitEvent.fire();
                 this.doSubmit();
                 this.submitEvent.fire();
-                this.hide();
+
+                if (this.cfg.getProperty("hideaftersubmit")) {
+                    this.hide();
+                }
+
                 return true;
             } else {
                 return false;
             }
         },
-        
+
         /**
         * Executes the cancel of the Dialog followed by a hide.
         * @method cancel
@@ -7399,7 +8170,7 @@
         * current form.
         */
         getData: function () {
-        
+
             var oForm = this.form,
                 aElements,
                 nTotalElements,
@@ -7420,26 +8191,20 @@
                 n;    
     
             function isFormElement(p_oElement) {
-            
                 var sTag = p_oElement.tagName.toUpperCase();
-                
                 return ((sTag == "INPUT" || sTag == "TEXTAREA" || 
                         sTag == "SELECT") && p_oElement.name == sName);
-    
             }
-    
-    
+
             if (oForm) {
-        
+
                 aElements = oForm.elements;
                 nTotalElements = aElements.length;
                 oData = {};
-    
-        
+
                 for (i = 0; i < nTotalElements; i++) {
-        
                     sName = aElements[i].name;
-        
+
                     /*
                         Using "Dom.getElementsBy" to safeguard user from JS 
                         errors that result from giving a form field (or set of 
@@ -7450,169 +8215,109 @@
                         discovered that it won't return a collection of fields 
                         in Gecko.
                     */
-        
+
                     oElement = Dom.getElementsBy(isFormElement, "*", oForm);
                     nElements = oElement.length;
-        
+
                     if (nElements > 0) {
-        
                         if (nElements == 1) {
-        
                             oElement = oElement[0];
-        
+
                             sType = oElement.type;
                             sTagName = oElement.tagName.toUpperCase();
-        
+
                             switch (sTagName) {
-        
-                            case "INPUT":
-    
-                                if (sType == "checkbox") {
-    
-                                    oData[sName] = oElement.checked;
-    
-                                }
-                                else if (sType != "radio") {
-    
+                                case "INPUT":
+                                    if (sType == "checkbox") {
+                                        oData[sName] = oElement.checked;
+                                    } else if (sType != "radio") {
+                                        oData[sName] = oElement.value;
+                                    }
+                                    break;
+
+                                case "TEXTAREA":
                                     oData[sName] = oElement.value;
+                                    break;
     
-                                }
+                                case "SELECT":
+                                    aOptions = oElement.options;
+                                    nOptions = aOptions.length;
+                                    aValues = [];
     
-                                break;
+                                    for (n = 0; n < nOptions; n++) {
+                                        oOption = aOptions[n];
     
-                            case "TEXTAREA":
-    
-                                oData[sName] = oElement.value;
-    
-                                break;
-    
-                            case "SELECT":
-    
-                                aOptions = oElement.options;
-                                nOptions = aOptions.length;
-                                aValues = [];
-    
-                                for (n = 0; n < nOptions; n++) {
-    
-                                    oOption = aOptions[n];
-    
-                                    if (oOption.selected) {
-    
-                                        sValue = oOption.value;
-    
-                                        if (!sValue || sValue === "") {
-    
-                                            sValue = oOption.text;
-    
+                                        if (oOption.selected) {
+                                            sValue = oOption.value;
+                                            if (!sValue || sValue === "") {
+                                                sValue = oOption.text;
+                                            }
+                                            aValues[aValues.length] = sValue;
                                         }
-    
-                                        aValues[aValues.length] = sValue;
-    
                                     }
-    
-                                }
-    
-                                oData[sName] = aValues;
-    
-                                break;
-        
+                                    oData[sName] = aValues;
+                                    break;
                             }
         
-        
-                        }
-                        else {
-        
+                        } else {
                             sType = oElement[0].type;
-        
                             switch (sType) {
-        
-                            case "radio":
-    
-                                for (n = 0; n < nElements; n++) {
-    
-                                    oRadio = oElement[n];
-    
-                                    if (oRadio.checked) {
-    
-                                        oData[sName] = oRadio.value;
-                                        break;
-    
+                                case "radio":
+                                    for (n = 0; n < nElements; n++) {
+                                        oRadio = oElement[n];
+                                        if (oRadio.checked) {
+                                            oData[sName] = oRadio.value;
+                                            break;
+                                        }
                                     }
-    
-                                }
-    
-                                break;
-    
-                            case "checkbox":
-    
-                                aValues = [];
-    
-                                for (n = 0; n < nElements; n++) {
-    
-                                    oCheckbox = oElement[n];
-    
-                                    if (oCheckbox.checked) {
-    
-                                        aValues[aValues.length] = 
-                                            oCheckbox.value;
-    
-                                    }
-    
-                                }
-    
-                                oData[sName] = aValues;
-    
-                                break;
+                                    break;
         
+                                case "checkbox":
+                                    aValues = [];
+                                    for (n = 0; n < nElements; n++) {
+                                        oCheckbox = oElement[n];
+                                        if (oCheckbox.checked) {
+                                            aValues[aValues.length] =  oCheckbox.value;
+                                        }
+                                    }
+                                    oData[sName] = aValues;
+                                    break;
                             }
-        
                         }
-        
                     }
-        
                 }
-        
             }
-        
-        
+
             return oData;
-        
         },
-        
+
         /**
         * Removes the Panel element from the DOM and sets all child elements 
         * to null.
         * @method destroy
         */
         destroy: function () {
-        
             removeButtonEventHandlers.call(this);
-            
+
             this._aButtons = null;
 
             var aForms = this.element.getElementsByTagName("form"),
                 oForm;
-            
-            if (aForms.length > 0) {
 
+            if (aForms.length > 0) {
                 oForm = aForms[0];
 
                 if (oForm) {
-                   
                     Event.purgeElement(oForm);
-            
-                    this.body.removeChild(oForm);
-                    
+                    if (oForm.parentNode) {
+                        oForm.parentNode.removeChild(oForm);
+                    }
                     this.form = null;
-            
                 }
-            
             }
-        
-            Dialog.superclass.destroy.call(this);  
-        
+            Dialog.superclass.destroy.call(this);
         },
-        
+
         /**
         * Returns a string representation of the object.
         * @method toString
@@ -7625,6 +8330,7 @@
     });
 
 }());
+
 (function () {
 
     /**
@@ -7911,7 +8617,7 @@
             }
 
         },
-        
+
         /**
         * Fired when the "text" property is set.
         * @method configText
@@ -7939,10 +8645,36 @@
         toString: function () {
             return "SimpleDialog " + this.id;
         }
-    
+
+        /**
+        * <p>
+        * Sets the SimpleDialog's body content to the HTML specified. 
+        * If no body is present, one will be automatically created. 
+        * An empty string can be passed to the method to clear the contents of the body.
+        * </p>
+        * <p><strong>NOTE:</strong> SimpleDialog provides the <a href="#config_text">text</a>
+        * and <a href="#config_icon">icon</a> configuration properties to set the contents
+        * of it's body element in accordance with the UI design for a SimpleDialog (an 
+        * icon and message text). Calling setBody on the SimpleDialog will not enforce this 
+        * UI design constraint and will replace the entire contents of the SimpleDialog body. 
+        * It should only be used if you wish the replace the default icon/text body structure 
+        * of a SimpleDialog with your own custom markup.</p>
+        * 
+        * @method setBody
+        * @param {String} bodyContent The HTML used to set the body. 
+        * As a convenience, non HTMLElement objects can also be passed into 
+        * the method, and will be treated as strings, with the body innerHTML
+        * set to their default toString implementations.
+        * <em>OR</em>
+        * @param {HTMLElement} bodyContent The HTMLElement to add as the first and only child of the body element.
+        * <em>OR</em>
+        * @param {DocumentFragment} bodyContent The document fragment 
+        * containing elements which are to be added to the body
+        */
     });
 
 }());
+
 (function () {
 
     /**
@@ -7966,14 +8698,12 @@
     * @param {class} Optional. The animation class to instantiate. Defaults to 
     * YAHOO.util.Anim. Other options include YAHOO.util.Motion.
     */
-    YAHOO.widget.ContainerEffect = 
-    
-        function (overlay, attrIn, attrOut, targetElement, animClass) {
-    
+    YAHOO.widget.ContainerEffect = function (overlay, attrIn, attrOut, targetElement, animClass) {
+
         if (!animClass) {
             animClass = YAHOO.util.Anim;
         }
-        
+
         /**
         * The overlay to animate
         * @property overlay
@@ -8014,7 +8744,6 @@
 
     var Dom = YAHOO.util.Dom,
         CustomEvent = YAHOO.util.CustomEvent,
-        Easing = YAHOO.util.Easing,
         ContainerEffect = YAHOO.widget.ContainerEffect;
 
 
@@ -8028,80 +8757,82 @@
     * @return {YAHOO.widget.ContainerEffect} The configured ContainerEffect object
     */
     ContainerEffect.FADE = function (overlay, dur) {
-    
-        var fade = new ContainerEffect(overlay, 
-        
-            { attributes: { opacity: { from: 0, to: 1 } }, 
-                duration: dur, 
-                method: Easing.easeIn }, 
-            
-            { attributes: { opacity: { to: 0 } },
-                duration: dur, 
-                method: Easing.easeOut }, 
-            
-            overlay.element);
-        
-    
-        fade.handleStartAnimateIn = function (type,args,obj) {
+
+        var Easing = YAHOO.util.Easing,
+            fin = {
+                attributes: {opacity:{from:0, to:1}},
+                duration: dur,
+                method: Easing.easeIn
+            },
+            fout = {
+                attributes: {opacity:{to:0}},
+                duration: dur,
+                method: Easing.easeOut
+            },
+            fade = new ContainerEffect(overlay, fin, fout, overlay.element);
+
+        fade.handleUnderlayStart = function() {
+            var underlay = this.overlay.underlay;
+            if (underlay && YAHOO.env.ua.ie) {
+                var hasFilters = (underlay.filters && underlay.filters.length > 0);
+                if(hasFilters) {
+                    Dom.addClass(overlay.element, "yui-effect-fade");
+                }
+            }
+        };
+
+        fade.handleUnderlayComplete = function() {
+            var underlay = this.overlay.underlay;
+            if (underlay && YAHOO.env.ua.ie) {
+                Dom.removeClass(overlay.element, "yui-effect-fade");
+            }
+        };
+
+        fade.handleStartAnimateIn = function (type, args, obj) {
             Dom.addClass(obj.overlay.element, "hide-select");
-        
-            if (! obj.overlay.underlay) {
+
+            if (!obj.overlay.underlay) {
                 obj.overlay.cfg.refireEvent("underlay");
             }
-        
-            if (obj.overlay.underlay) {
-    
-                obj.initialUnderlayOpacity = 
-                    Dom.getStyle(obj.overlay.underlay, "opacity");
-    
-                obj.overlay.underlay.style.filter = null;
-    
-            }
-        
-            Dom.setStyle(obj.overlay.element, "visibility", "visible");
+
+            obj.handleUnderlayStart();
+
+            obj.overlay._setDomVisibility(true);
             Dom.setStyle(obj.overlay.element, "opacity", 0);
         };
-        
-    
+
         fade.handleCompleteAnimateIn = function (type,args,obj) {
             Dom.removeClass(obj.overlay.element, "hide-select");
-        
+
             if (obj.overlay.element.style.filter) {
                 obj.overlay.element.style.filter = null;
             }
-        
-            if (obj.overlay.underlay) {
-                Dom.setStyle(obj.overlay.underlay, "opacity", 
-                    obj.initialUnderlayOpacity);
-            }
-        
+
+            obj.handleUnderlayComplete();
+
             obj.overlay.cfg.refireEvent("iframe");
             obj.animateInCompleteEvent.fire();
         };
-        
-    
+
         fade.handleStartAnimateOut = function (type, args, obj) {
             Dom.addClass(obj.overlay.element, "hide-select");
-        
-            if (obj.overlay.underlay) {
-                obj.overlay.underlay.style.filter = null;
-            }
+            obj.handleUnderlayStart();
         };
-        
-    
+
         fade.handleCompleteAnimateOut =  function (type, args, obj) {
             Dom.removeClass(obj.overlay.element, "hide-select");
             if (obj.overlay.element.style.filter) {
                 obj.overlay.element.style.filter = null;
             }
-            Dom.setStyle(obj.overlay.element, "visibility", "hidden");
+            obj.overlay._setDomVisibility(false);
             Dom.setStyle(obj.overlay.element, "opacity", 1);
-        
+
+            obj.handleUnderlayComplete();
+
             obj.overlay.cfg.refireEvent("iframe");
-        
             obj.animateOutCompleteEvent.fire();
         };
-        
+
         fade.init();
         return fade;
     };
@@ -8117,33 +8848,32 @@
     * @return {YAHOO.widget.ContainerEffect} The configured ContainerEffect object
     */
     ContainerEffect.SLIDE = function (overlay, dur) {
-    
-        var x = overlay.cfg.getProperty("x") || Dom.getX(overlay.element),
-    
+        var Easing = YAHOO.util.Easing,
+
+            x = overlay.cfg.getProperty("x") || Dom.getX(overlay.element),
             y = overlay.cfg.getProperty("y") || Dom.getY(overlay.element),
-    
             clientWidth = Dom.getClientWidth(),
-    
             offsetWidth = overlay.element.offsetWidth,
-    
-            slide = new ContainerEffect(overlay, 
-            
-            { attributes: { points: { to: [x, y] } },
+
+            sin =  { 
+                attributes: { points: { to: [x, y] } },
                 duration: dur,
-                method: Easing.easeIn },
-    
-            { attributes: { points: { to: [(clientWidth + 25), y] } },
+                method: Easing.easeIn 
+            },
+
+            sout = {
+                attributes: { points: { to: [(clientWidth + 25), y] } },
                 duration: dur,
-                method: Easing.easeOut },
-    
-            overlay.element, YAHOO.util.Motion);
-        
-        
+                method: Easing.easeOut 
+            },
+
+            slide = new ContainerEffect(overlay, sin, sout, overlay.element, YAHOO.util.Motion);
+
         slide.handleStartAnimateIn = function (type,args,obj) {
             obj.overlay.element.style.left = ((-25) - offsetWidth) + "px";
             obj.overlay.element.style.top  = y + "px";
         };
-        
+
         slide.handleTweenAnimateIn = function (type, args, obj) {
         
             var pos = Dom.getXY(obj.overlay.element),
@@ -8153,7 +8883,7 @@
             if (Dom.getStyle(obj.overlay.element, "visibility") == 
                 "hidden" && currentX < x) {
 
-                Dom.setStyle(obj.overlay.element, "visibility", "visible");
+                obj.overlay._setDomVisibility(true);
 
             }
         
@@ -8173,11 +8903,9 @@
     
             var vw = Dom.getViewportWidth(),
                 pos = Dom.getXY(obj.overlay.element),
-                yso = pos[1],
-                currentTo = obj.animOut.attributes.points.to;
+                yso = pos[1];
     
             obj.animOut.attributes.points.to = [(vw + 25), yso];
-    
         };
         
         slide.handleTweenAnimateOut = function (type, args, obj) {
@@ -8191,18 +8919,18 @@
         };
         
         slide.handleCompleteAnimateOut = function (type, args, obj) {
-            Dom.setStyle(obj.overlay.element, "visibility", "hidden");
-        
+            obj.overlay._setDomVisibility(false);
+
             obj.overlay.cfg.setProperty("xy", [x, y]);
             obj.animateOutCompleteEvent.fire();
         };
-        
+
         slide.init();
         return slide;
     };
-    
+
     ContainerEffect.prototype = {
-    
+
         /**
         * Initializes the animation classes and events.
         * @method init
@@ -8251,7 +8979,7 @@
             this.beforeAnimateInEvent.fire();
             this.animIn.animate();
         },
-        
+
         /**
         * Triggers the out-animation.
         * @method animateOut
@@ -8260,7 +8988,7 @@
             this.beforeAnimateOutEvent.fire();
             this.animOut.animate();
         },
-        
+
         /**
         * The default onStart handler for the in-animation.
         * @method handleStartAnimateIn
@@ -8269,7 +8997,7 @@
         * @param {Object} obj The scope object
         */
         handleStartAnimateIn: function (type, args, obj) { },
-    
+
         /**
         * The default onTween handler for the in-animation.
         * @method handleTweenAnimateIn
@@ -8278,7 +9006,7 @@
         * @param {Object} obj The scope object
         */
         handleTweenAnimateIn: function (type, args, obj) { },
-    
+
         /**
         * The default onComplete handler for the in-animation.
         * @method handleCompleteAnimateIn
@@ -8287,7 +9015,7 @@
         * @param {Object} obj The scope object
         */
         handleCompleteAnimateIn: function (type, args, obj) { },
-        
+
         /**
         * The default onStart handler for the out-animation.
         * @method handleStartAnimateOut
@@ -8296,7 +9024,7 @@
         * @param {Object} obj The scope object
         */
         handleStartAnimateOut: function (type, args, obj) { },
-    
+
         /**
         * The default onTween handler for the out-animation.
         * @method handleTweenAnimateOut
@@ -8305,7 +9033,7 @@
         * @param {Object} obj The scope object
         */
         handleTweenAnimateOut: function (type, args, obj) { },
-    
+
         /**
         * The default onComplete handler for the out-animation.
         * @method handleCompleteAnimateOut
@@ -8327,10 +9055,10 @@
             }
             return output;
         }
-    
     };
 
     YAHOO.lang.augmentProto(ContainerEffect, YAHOO.util.EventProvider);
 
 })();
-YAHOO.register("container", YAHOO.widget.Module, {version: "2.3.0", build: "442"});
+
+YAHOO.register("container", YAHOO.widget.Module, {version: "2.7.0", build: "1799"});