dojox.widget.AutoRotator or dojox.widget.rotator does not support nesting!

[cgaeking]

Hello,

when nesting several rotatorwidgets the transition is not working properly anymore. I have made a demo at ​http://78.46.35.20/tst.html

The code that is not working looks like:

<div data-dojo-type="dojox.widget.AutoRotator" class="rotator" id="myAutoRotator2" data-dojo-id="myAutoRotatorInstance2" data-dojo-props="transition:'dojox.widget.rotator.crossFade', duration:2500">
    <div class="pane pane0">
                Pane 0<br/>Panning down to Pane 1
                <div data-dojo-type="dojox.widget.AutoRotator" class="subpane" id="myAutoRotator32" data-dojo-id="myAutoRotatorInstancer32" data-dojo-props="transition:'dojox.widget.rotator.panLeft', duration:500">
                        <div class="divsubpane">abcd</div>
                        <div class="divsubpane">efgh</div>
                        <div class="divsubpane">ijkl</div>
                </div>
    </div>
    <div class="pane pane1">Pane 1<br/>Panning right to Pane 2
                <div data-dojo-type="dojox.widget.AutoRotator" class="subpane" id="myAutoRotator42" data-dojo-id="myAutoRotatorInstancer42" data-dojo-props="transition:'dojox.widget.rotator.panLeft', duration:500">
                        <div class="divsubpane">abcd</div>
                        <div class="divsubpane">efgh</div>
                        <div class="divsubpane">ijkl</div>
                </div>
    </div>
    <div class="pane pane2">Pane 2<br/>Using default transition to pan left to Pane 0</div>
</div>

The second pane is not transitioning well.. Regards,

Christian Gäking

[cgaeking]

Hello,

in the meanwhile I found out what the reason is. In Rotator.js, the line

cb = _t._domNodeContentBox = domGeometry.getContentBox(node), 

is not working, because the parent-div is already set to display:none. That means all values returned by getContentBox are 0. So a maybe dirty hack to make this example work would look like: (The problem is that only the direct parent of the node will be unhidden, more nesting will not work..)

...
                           var _t = this,
                                t = _t.transition,
                                tt = _t._transitions = {},
                                idm = _t._idMap = {},
                                tp = _t.transitionParams = eval("({ " + _t.transitionParams + " })"),
                                node = _t._domNode = dom.byId(node),
                                cb = _t._domNodeContentBox = domGeometry.getContentBox(node), // we are going to assume the rotator will not be changing size

                                // default styles to apply to all the container node and rotator's panes
                                p = {
                                        left: 0,
                                        top: 0
                                },

                                warn = function(bt, dt){
                                        console.warn(_t.declaredClass, ' - Unable to find transition "', bt, '", defaulting to "', dt, '".');
                                };

                        // Check if parent is currently set to display=none to make getContentBox working
                        var par = node.parentNode;
                        if (domStyle.get(par, _displayStr)==_noneStr) {
                                domStyle.set(par, _displayStr, "block");
                                cb = _t._domNodeContentBox = domGeometry.getContentBox(node);
                                domStyle.set(par, _displayStr, _noneStr);
                        }

A more clean solution would be setting the display to none after the parsing of all widgets of the site..

[cgaeking]

What about using opacity instead of the display attribute to hide the elements? That would make it work generally.

[dylan]

Given that no one has shown interest in creating a patch in more than a year, I'm closing this as patchwelcome. Please let us know if you would like to get involved in helping make this change to Dojo!