org.wings.js.yui.container.README Maven / Gradle / Ivy
The newest version!
Container Release Notes
*** 2.9.0 ***
New Features:
------------
+ Hide or Show can now be prevented by returning false from beforeHide,
and beforeShow subscribers respectively.
+ Dialog's button configuration now passes "type" onto the YUI Button
constructor, when provided.
+ Added beforeShowMask, beforeHideMask events. Subscribers to these
events can return false to prevent the mask from being shown/hidden
respectively.
Bug Fixes:
----------
+ Fixed config.resetProperty for falsey initial values
+ We no longer use innerHTML to add hidden input to
form in SimpleDialog, so that we don't blow away listeners.
+ Showing a modal dialog, without any focusable content will
now focus on the innerElement (or hidden focus element,
for browsers which don't support tabIndex 0 on divs)
+ public setTabLoop should honor firstElement, lastElement
arguments passed in. Before, since it was being used
as the hook for Dialog to jump in and change the
first/lastElement to account for its buttons, it
was overriding lastElement with lastButton
There is now a separate hook, a protected _setTabLoop
which Dialog overrides instead, to inject it's custom
argumements.
+ Fixed tab behavior for close button. It's now rendered
as the first child of innerElement, as opposed to the
last, so that it fits in with the natural DOM flow.
Also, Dialog, when Tab/Shift-Tabbing in Modal mode,
loops from the lastButton to the firstElement (the
close button usually), instead of to the first form
element (thereby, bypassing the button).
+ Module/Overlay now caches ContainerEffect (and hence
Anim) instances, instead of recreating them each time
hide/show is called. This was required so that we could
correctly stop running Anim instances when switching
between animIn and animOut midway through an animation.
This should also help performance.
If you need to revert back to the pre 2.9.0 behavior
for any reason, you can set the overlay.cacheEffects
property to false on your instance before setting
the effect property, or on the prototype.
Changes
-------
+ Module's destroy method (and the destroy method of all
subclasses) now supports a 'shallowPurge' argument, which
when true, prevents Module from recursively purging DOM
event listeners from all children on destruction.
If the shallowPurge argument is not provided Module will
purge event listeners from all children.
This was preferred, over supporting the opposite
(a 'deepPurge' argument for example), to maintain backwards
compatiblity while supporting intuitive argument values
(false and undefined mean the same thing).
+ APIDocs updated to identify string parameters and
properties, which get added to the DOM as HTML.
These string values should be escaped by the implementor,
if they come from an untrusted external source.
*** version 2.8.2 ***
+ No changes
*** version 2.8.1 ***
+ No changes.
*** version 2.8.0 ***
Bug Fixes:
----------
+ setHeader, setBody, setFooter will create the respective section element
and add it to the DOM if called after render has already been invoked.
+ preventoverlap repositioning logic is now applied for cases where the
constrained Overlay is larger than the viewport also, and takes
precedence over the default behavior for constrained Overlays which are
larger than the viewport.
+ Overlay unsubscribes all context trigger listeners on destroy. Trigger
listeners bound to global custom events such as windowScroll and
windowResize cause JS execptions if left attached after the
Overlay was destroy.
New Features:
-------------
+ Added support for an xy offset parameter to the context argument array.
This allows the user to offset the Overlay by an XY pixel value in cases
where they don't want precise alignment, e.g.:
context:["contextEl", "tl", "tr", ["beforeShow"]]
Would align the overlays top left corner with the top right corner of the
context element exactly.
Using the offset parameter, the Overlay can be offset by a pixel amount
if desired, e.g.:
context:["contextEl", "tl", "tr", ["beforeShow"], [5, 0]]
Would align the overlay's top left corner with the top right corner of the
context element, but offset it along the X axis by 5 pixels, providing a gap
between the overlay and context element edges.
+ Added support for an "xyoffset" parameter to Tooltip, to configure the
offset from the mouse XY position at which the Tooltip should be displayed.
Changes:
--------
+ Users can now prevent Dialog form submission by returning false from a beforeSubmit
event subscriber
*** version 2.7.0 ***
Changes:
--------
+ Added a "yui-overlay-hidden" class to hidden Overlays (and derived widgets).
This class can be used to define CSS properties to work around bugs in
IE6 and IE7's handling of tables with captions, or tables with border-collapse
set to "collapse".
In IE6 and IE7, if the overlay contains tables with captions, the
user will not be able to interact with element which lie underneath
the table, even when the overlay is hidden.
The above marker class can be used to hide tables when the overlay is hidden
to workaround the IE bug:
#containerWithTable.yui-overlay-hidden table {
// Display is used here as an example, you could also
// set the height, or margin, or position for the table to
// hide it if required.
display:none;
}
Also, in IE6 and IE7, if the overlay contains tables with border-collapse
set to "collapse", as is the case for the YUI Calendar's default Sam skin,
the borders will remain visible even when the overlay is hidden.
The above marker class can be used to flip the tables border-collapse setting,
to workaround the IE bug:
#containerWithTable.yui-overlay-hidden table {
// IE hides the border correctly if it is set to "separate"
border-collapse:separate;
}
+ Added tab-index = -1, to iframe shim to take it out of tab flow.
+ Module id is generated using Dom.generateId, if the element
passed to the constructor does not have an id set.
+ Added Module.forceDocumentRedraw method which can be used to
fix occasional content dependant rendering glitches in Opera.
+ Resize monitor is now only positioned offset top, instead of both
offset top and offset left, to avoid scrollbars in RTL pages. A buffer
constant (Module.RESIZE_MONITOR_BUFFER) is also provided, to add a buffer
amount to the offscreen position.
Bug Fixes:
----------
+ Fixed focusFirst behavior to give the default button priority over
the first button if defined.
+ Fixed erratic scrolling when clicking on the scrollbar in IE when a
modal panel is visible.
+ Removed suppressEvent from autofillheight in overlay, was causing
"autofillheight" to not be honored in Panel.
+ Added < 0 check for "autofillheight".
+ Fixed "autofillheight", so that it only takes effect if a non "auto"
height has been set on the container.
+ Fixed shadow in IE6 not being resized correctly when autofillheight
is set, and text is resized.
+ Fixed opacity flash seen when a tooltip with ContainerEffect.FADE
applied, is hidden.
+ Fixed incorrect tooltip width, for the case where the width is
set dynamically (see Tooltip's width configuration property),
and the user moves from one of the Tooltip's context elements
to another, without the tooltip being hidden.
+ Autofillheight if enabled, is recalculated whenever content
changes, to account for changes in section height.
+ Fixed faulty repaint on Safari 3.2/MacOS 10.5, when using fixed
center, by forcing redraw after centering.
New Features:
-------------
+ Dialog now supports a "postdata" configuration parameter which can be
used to define post data to be sent along with any data mined from the
form, for async post requests.
+ Dialog now provides the connection object, as the first argument to
subscribers of the "asyncSubmit" event.
+ Added support for fixedcenter:"contained", which acts like
fixedcenter:true, enabling the user to keep the Overlay centered in
the viewport when scrolling or resizing the window.
However when fixedcenter is set to "contained", if the Overlay is
too big for the viewport, re-centering on scroll will be disabled
until the viewport is large enough to contain the Overlay
completely. This allows the user to scroll the viewport to
access sections of the Overlay outside the current viewport.
*** 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.
New 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).
Bug Fixes:
-------------------------
+ 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 ***
Bug Fixes:
-------------------------
+ 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 ***
Bug Fixes:
-------------------------
+ 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).
New 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 ***
Bug Fixes:
-------------------------
+ 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.
New 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 ***
Bug Fixes:
-------------------------
+ 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 ***
Bug Fixes:
-------------------------
+ Improved creation of the