Container Release Notes *** version 2.6.0 *** Changes: -------- + 1px rounded corners in Sam-Skin, added in 2.3.0, are no longer rendered in IE6 or IE7. hasLayout and relative positioning applied to the header, body and footer elements to achieve the 1px rounded corners had functional side effects (such as the inability to shrink-wrap auto width containers, and the creation of invalid stacking contexts) 1px rounded corners can be re-applied with a CSS patch if required, as discussed on the container documentation web page. + We now attempt to focus the first focusable element inside a Panel, when it is shown (as is done with Dialog). + Setting the "height" configuration property will now result in the container's body element being resized to fill out any empty vertical space. This behavior can be configured using the "autofillheight" configuration property discussed below. Added the following features: ----------------------------- + Added a new "preventcontextoverlap" configuration property used to manage whether or not an Overlay instance should overlap its context element (defined using the "context" configuration property) when the "constraintoviewport" configuration property is set to "true". + Added ability to specify event triggers when using the "context" configuration property. The container wil re-align itself with the context element in response to these trigger events. See context configuration property documentation for usage details. + Added "autofillheight" configuration property, which is set to "body" by default. This configuration property can be used to specify which of the 3 container element - "header", "body", "footer" should be resized to fill out any remaining vertical space when the container's "height" configuration property is set. The property can be set to false/null to disable the feature if desired. + Panel now supports focusFirst and focusLast methods, as well as tab, shift-tab looping when modal (similar to Dialog). Fixed the following bugs: ------------------------- + Fixed issue with tooltip iframe remaining visible in situations where the page was scrolled down. + Fixed OverlayManager.find to return null, if the Overlay cannot be found. + OverlayManager no longer overwrites focus or blur methods on the registered container, if they already exist (e.g. for Menu). Instead it registers focus/blur event listeners to maintain OverlayManager state in such situations. + Panels/Dialogs without a fixed width specified (auto width containers) now shrink-wrap correctly in IE6, IE7 (see 1px rounded corner discussion above) + Added text to the close icon, to enhance accessibility for screen readers. Also changed the close icon element from a span, to an anchor to facilate keyboard tab access. + Added title to text resize monitor iframe, to assist screen readers. + Fixed modal mask resizing when going from a larger to a smaller window size. + hideMaskEvent is now fired after all modal mask relatd state changes (including changes to the document.body) have taken place. Originally it was fired before removing the "masked" class from document.body. + Fixed Sam Skin look/feel for default Dialog buttons. Originally disabled default buttons looked the same as enabled default buttons. + Fixed asynchronous Dialog submission failure for cases where the form contained elements named "action" or "method". + Fixed Dialog button focus methods when using YUI Buttons. + Modal Dialogs buttons are now included in the tab, shift-tab flow. Originally buttons in Modal dialogs were unreachable when tabbing. + Individual focus handlers attached to all non-container focusable elements (used to enforce modality), resulted in poor performance when showing/hiding modal Panels, especially in IE, on pages with a large number of focusable elements. Instead of individual listeners, Panel now registers a single focus listener on the document to enforce modality, improving performance and scalability for modal solutions. + Files for optional component dependencies (e.g. animation, dragdrop, connection) can now be included after container's js files, without breaking related functionality. + Fixed Config to remove (null out) current entry from the config queue, before invoking fireEvent for the entry, to keep it from being re-added to the end of the queue if listeners were to set a property which superceded the entry. *** version 2.5.2 *** + No change. *** version 2.5.1 *** Fixed the following bugs: ------------------------- + Module.setBody, setHeader and setFooter methods now accept DocumentFragments. This feature was implicitly available in versions prior to 2.5.0 and is now officially supported. Changes: -------- + Optimized addition of Modality focus handlers on masked elements (which are used to enforce modality) and added ability to disable feature, to avoid timeout script errors in IE if your page contains a very large number of focusable elements. Additionally changes to Event in 2.5.1 should allow for increased scalability, when using Modal panels containing large numbers of focusable elements on the page. Added a YAHOO.widget.Panel.FOCUSABLE property, defining the set of elements which should have focus handlers applied when covered by the Modal mask. If you wish to disable the addition of focus handlers to all focusable elements on the page when a Modal Panel is displayed, the property can be set to an empty array: YAHOO.widget.Panel.FOCUSABLE = []; NOTE: This will mean that elements under mask may still be accessible using the keyboard, however the mask will still prevent mouse access to elements. *** version 2.5.0 *** Fixed the following bugs: ------------------------- + We now add the text resize monitor iframe to the DOM in a timeout, to help alleviate the perpetual loading indicator seen in Firefox 2.0.0.8 (Gecko 1.8.1.8) and above on Windows. + Changed the closing script tag string used in the resize monitor, to allow container-min.js, container_core-min.js content to be used inline. + Fixed problem with underlay size being too short in IE6 when setting up an initially visible Dialog with buttons. + Removed overflow:auto applied to the modal mask for all browsers other than gecko/MacOS to help avoid the "missing text cursor" Gecko bug. Overflow:auto is still applied to for Gecko/MacOS to help avoid scrollbar bleedthrough, another Gecko bug (discussed in Container's known issues section). Added the following features: ----------------------------- + Added a "hideaftersubmit" config property to Dialog, to allow the end user to configure whether or not the Dialog should be hidden after it has been submitted. By default it is set to false, to provide backwards compatibility. + Added contextMouseOverEvent, contextMouseOutEvent and contextTriggerEvent events to Tooltip, which provide access to the context element when the user mouses over a context element, mouses out of a context element, and before a tooltip is about to be triggered (displayed) for a context element. See the API docs for these events for futher details. + Added a "disabled" config property to Tooltip, to allow the user to dynamically disable a tooltip. Changes: -------- + Optimized constraintoviewport handling for Overlays which haven't been specifically positioned, so that the constraint checks aren't made before every show. *** version 2.4.0 *** Fixed the following bugs: ------------------------- + constraintoviewport and fixedcenter now handle Overlays which are larger than the viewport. The Overlay will be positioned such that it's top, left corner is in the viewport. Panel's draggable behavior now also honors constraintoviewport, if the panel is larger than the viewport. + constrainToViewport will now correctly constrain Overlays which haven't been specifically positioned (don't have an XY value set). + Overlay/OverlayManager bringToTop methods will bring Overlays to the top of the stack, even if their current zindex is the same as other Overlays on the page. + Fixed double textResizeEvents fired on gecko based browsers (e.g Firefox 2.x). + Panel underlay now resizes correctly in Safari 2.x, when the content of the Panel is modified (e.g. when setBody() is called). + Tooltip "text" configuration property is no longer overridden by the "title" attribute value on the context element if both are set. The "text" configuration property takes precedence (as indicated in the Tooltip documentation). + Transparent shadows no longer become opaque (black) in IE6/IE7 when a Panel with ContainerEffect.FADE is hidden and then shown again. Also on IE6/IE7 transparent shadows no longer appear opaque while animation is in progress. + An empty header is no longer created for non-draggable Dialogs/SimpleDialogs which don't provide their own headers. By design, an empty header is still created for draggable Dialogs/SimpleDialogs which don't provide a header, in order to provide a drag handle. + Select boxes inside Modal Panels on IE6 are no longer hidden. + In Sam Skin, Dialog/SimpleDialog default and non-default HTML buttons (used when YUI Button is not included on the page) now have a consistent look. Previously style properties intended for default YUI Buttons, were being incorrectly applied to default HTML buttons, giving them a look inconsistent with non-default buttons. Added the following features: ----------------------------- + Added "dragOnly" configuration property to Panel, to leverage the "dragOnly" configuration property added to the DragDrop utility for 2.4.0. When the "dragOnly" configuration property is set to true, the DD instance created for the Panel will not check for drop targets on the page, improving performance during drag operations which don't require drop target interaction. The property is set to "false" by default to maintain backwards compatibility with older 2.x releases, but should be set to "true" if no drop targets for the Panel exist on the page. See the DragDrop utilities 2.4.0 README for additional information. *** version 2.3.1 *** Fixed the following bugs: ------------------------- + To help reduce the occurrence of "Operation Aborted" errors in IE, containers which are rendered to the document's BODY element (e.g. myOverlay.render(document.body)) are now inserted before the first child of the BODY element. This applies to both the container element as well as the iframe shim if enabled. Prior to 2.3.1, these two elements were appended as the last children of the BODY element. When rendering to any other element on the page, the behavior is unchanged and both the container and shim are appended as the last children of the element. Upgrade Impact For Containers Rendered To Document.Body ------------------------------------------------------- If you have an xy coordinate and non-zero z-index specified for your container there should be no negative impact. If you haven't specified an xy position, the fix could result in a shift in your container position, depending on other elements on the page. If you haven't specified a z-index and are relying on DOM order to stack the container, you may see a change in stacking order of the container or iframe shim. Both these changes can be resolved by setting a specific z-index and position based on the layout of other elements on your page. If you do need to revert to 2.3.0 behavior, a configuration property "appendtodocumentbody" has been added to Module, which can be set to true. The change to stacking order is discussed in detail below in relation to other z-index fixes made for 2.3.1. + Z-index is now applied correctly for Overlay/Panel elements, their corresponding iframe shims, and modal masks (for Panels). This fix applies to both the default z-index based on the CSS for the Overlay/Panel and specific z-indices set using the "zindex" configuration parameter. Default z-index values are: Overlay/Panel element: 2 Iframe shim: 1 Mask: 1 The iframe shim and modal mask z-index will always be set to one less than the Overlay/Panel z-index. PLEASE NOTE: As a result of the fix to reduce "Operation Aborted" errors, setting a z-index of 1 on an Overlay/Panel rendered to document.body will result in its iframe shim and modal mask (which will have a z-index of 0) being rendered behind other positioned elements in the document. This is because the Overlay/Panel, iframe shim and mask are inserted as the first children of the BODY element and hence any positioned elements with a z-index of 0 or auto which occur after them in the document will be stacked on top of them as per W3C spec. If you need to keep the Overlay/Panel above positioned elements on your page, it's z-index needs to be set to 2 or more. In general it's advisable to manage the z-index of positioned elements on your page deliberately by setting a z-index, to avoid having their order in the document define their stacking order. For detailed stacking order information see: - http://www.w3.org/TR/CSS21/visuren.html#layers - http://developer.mozilla.org/en/docs/Understanding_CSS_z-index:The_st acking_context + Module now correctly recognizes standard module header, body and footer DIVs when they have extra CSS classes applied in addition to the required hd, bd, and ft classes. e.g.
. + An empty header (set to $#160;) is created for draggable Panels which don't have a header specified, to provide a drag handle. This fixes a regression introduced in 2.3.0 so that 2.2.2 behavior is restored. + Dialog.destroy has been fixed to account for Dialog form elements which may not be direct children of the standard module body ("bd") element. + SimpleDialog.destory now completes successfully if the optional button-beta.js dependancy is not included on the page. + Destroying Overlays registered with the OverlayManager no longer results in a JavaScript error. The Overlay is destroyed and removed from the OverlayManager correctly. + Submitting a Dialog form directly (e.g. using a "submit" button, hitting enter on a single text field form) no longer throws a JavaScript error. Known Issues ------------ + IE: Borders for tables with border-collapse:collapse remain visible ------------------------------------------------------------------- If an Overlay, or any of its subclasses, contains a table with its border-collapse CSS property set to "collapse" instead of the default value of "separate", the borders of the table will remain visible, when the Overlay is configured to be hidden initially. The table contents will be hidden correctly. This is due to an IE bug, reproducible by the basic test case below:
1 2
Setting the DIV elements "style.visibility" JS property fixes the problem with the simple test case. NOTE: Setting the style in markup using the DIV's style attribute does not. Extending this to Container, the simplest workaround if you're not using effects, is to use Overlay's hide() method to setup visibility. This will set the Overlay's element "style.visibility" property. e.g. // Start visible, then hide. var ovr = YAHOO.widget.Overlay("ovr"); ovr.render(); ovr.hide(); You can also apply this workaround if you want to use effects by setting the effect up after you hide. e.g. // Start visible, but don't apply effects, // to avoid initial animation. var ovr = YAHOO.widget.Overlay("ovr"); ovr.render(); ovr.hide(); ovr.cfg.setProperty("effect", {effect:.....}); If initial flicker is a problem with the above, you can set the visibility directly on the Overlay element after rendering e.g. var ovr = YAHOO.widget.Overlay("ovr", {visible:false}); ovr.render(); YAHOO.util.Dom.setStyle(ovr.element, "visibility", "hidden"); but if possible one of the previous methods should be used since they use the public API as opposed to manipulating the DOM directly. *** version 2.3.0 *** Fixed the following bugs: ------------------------- + Improved creation of the