~andreserl/maas/packaging_precise_rebase

« back to all changes in this revision

Viewing changes to debian/extras/jslibs/yui/transition/transition-debug.js

  • Committer: Andres Rodriguez
  • Date: 2013-03-20 18:12:30 UTC
  • mfrom: (145.2.22 precise.sru)
  • Revision ID: andreserl@ubuntu.com-20130320181230-6l5guc0nhlv2z4p7
Re-base againts latest quantal released branch towards SRU

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/*
 
2
YUI 3.5.1 (build 22)
 
3
Copyright 2012 Yahoo! Inc. All rights reserved.
 
4
Licensed under the BSD License.
 
5
http://yuilibrary.com/license/
 
6
*/
 
7
YUI.add('transition', function(Y) {
 
8
 
 
9
/**
 
10
* Provides the transition method for Node.
 
11
* Transition has no API of its own, but adds the transition method to Node.
 
12
*
 
13
* @module transition
 
14
* @requires node-style
 
15
*/
 
16
 
 
17
var CAMEL_VENDOR_PREFIX = '',
 
18
    VENDOR_PREFIX = '',
 
19
    DOCUMENT = Y.config.doc,
 
20
    DOCUMENT_ELEMENT = 'documentElement',
 
21
    TRANSITION = 'transition',
 
22
    TRANSITION_CAMEL = 'Transition',
 
23
    TRANSITION_PROPERTY_CAMEL,
 
24
    TRANSITION_PROPERTY,
 
25
    TRANSITION_DURATION,
 
26
    TRANSITION_TIMING_FUNCTION,
 
27
    TRANSITION_DELAY,
 
28
    TRANSITION_END,
 
29
    ON_TRANSITION_END,
 
30
    TRANSFORM_CAMEL,
 
31
 
 
32
    EMPTY_OBJ = {},
 
33
 
 
34
    VENDORS = [
 
35
        'Webkit',
 
36
        'Moz'
 
37
    ],
 
38
 
 
39
    VENDOR_TRANSITION_END = {
 
40
        Webkit: 'webkitTransitionEnd'
 
41
    },
 
42
 
 
43
/**
 
44
 * A class for constructing transition instances.
 
45
 * Adds the "transition" method to Node.
 
46
 * @class Transition
 
47
 * @constructor
 
48
 */
 
49
 
 
50
Transition = function() {
 
51
    this.init.apply(this, arguments);
 
52
};
 
53
 
 
54
Transition._toCamel = function(property) {
 
55
    property = property.replace(/-([a-z])/gi, function(m0, m1) {
 
56
        return m1.toUpperCase();
 
57
    });
 
58
 
 
59
    return property;
 
60
};
 
61
 
 
62
Transition._toHyphen = function(property) {
 
63
    property = property.replace(/([A-Z]?)([a-z]+)([A-Z]?)/g, function(m0, m1, m2, m3) {
 
64
        var str = ((m1) ? '-' + m1.toLowerCase() : '') + m2;
 
65
        
 
66
        if (m3) {
 
67
            str += '-' + m3.toLowerCase();
 
68
        }
 
69
 
 
70
        return str;
 
71
    }); 
 
72
 
 
73
    return property;
 
74
};
 
75
 
 
76
Transition.SHOW_TRANSITION = 'fadeIn';
 
77
Transition.HIDE_TRANSITION = 'fadeOut';
 
78
 
 
79
Transition.useNative = false;
 
80
 
 
81
Y.Array.each(VENDORS, function(val) { // then vendor specific
 
82
    var property = val + TRANSITION_CAMEL;
 
83
    if (property in DOCUMENT[DOCUMENT_ELEMENT].style) {
 
84
        CAMEL_VENDOR_PREFIX = val;
 
85
        VENDOR_PREFIX = Transition._toHyphen(val) + '-';
 
86
 
 
87
        Transition.useNative = true;
 
88
        Transition.supported = true; // TODO: remove
 
89
        Transition._VENDOR_PREFIX = val;
 
90
    }
 
91
});
 
92
 
 
93
TRANSITION_CAMEL = CAMEL_VENDOR_PREFIX + TRANSITION_CAMEL;
 
94
TRANSITION_PROPERTY_CAMEL = CAMEL_VENDOR_PREFIX + 'TransitionProperty';
 
95
TRANSITION_PROPERTY = VENDOR_PREFIX + 'transition-property';
 
96
TRANSITION_DURATION = VENDOR_PREFIX + 'transition-duration';
 
97
TRANSITION_TIMING_FUNCTION = VENDOR_PREFIX + 'transition-timing-function';
 
98
TRANSITION_DELAY = VENDOR_PREFIX + 'transition-delay';
 
99
TRANSITION_END = 'transitionend';
 
100
ON_TRANSITION_END = 'on' + CAMEL_VENDOR_PREFIX.toLowerCase() + 'transitionend';
 
101
 
 
102
TRANSITION_END = VENDOR_TRANSITION_END[CAMEL_VENDOR_PREFIX] || TRANSITION_END;
 
103
 
 
104
TRANSFORM_CAMEL = CAMEL_VENDOR_PREFIX + 'Transform';
 
105
 
 
106
Transition.fx = {};
 
107
Transition.toggles = {};
 
108
 
 
109
Transition._hasEnd = {};
 
110
 
 
111
Transition._reKeywords = /^(?:node|duration|iterations|easing|delay|on|onstart|onend)$/i;
 
112
 
 
113
Y.Node.DOM_EVENTS[TRANSITION_END] = 1; 
 
114
 
 
115
Transition.NAME = 'transition';
 
116
 
 
117
Transition.DEFAULT_EASING = 'ease';
 
118
Transition.DEFAULT_DURATION = 0.5;
 
119
Transition.DEFAULT_DELAY = 0;
 
120
 
 
121
Transition._nodeAttrs = {};
 
122
 
 
123
Transition.prototype = {
 
124
    constructor: Transition,
 
125
    init: function(node, config) {
 
126
        var anim = this;
 
127
        anim._node = node;
 
128
        if (!anim._running && config) {
 
129
            anim._config = config;
 
130
            node._transition = anim; // cache for reuse
 
131
 
 
132
            anim._duration = ('duration' in config) ?
 
133
                config.duration: anim.constructor.DEFAULT_DURATION;
 
134
 
 
135
            anim._delay = ('delay' in config) ?
 
136
                config.delay: anim.constructor.DEFAULT_DELAY;
 
137
 
 
138
            anim._easing = config.easing || anim.constructor.DEFAULT_EASING;
 
139
            anim._count = 0; // track number of animated properties
 
140
            anim._running = false;
 
141
 
 
142
        }
 
143
 
 
144
        return anim;
 
145
    },
 
146
 
 
147
    addProperty: function(prop, config) {
 
148
        var anim = this,
 
149
            node = this._node,
 
150
            uid = Y.stamp(node),
 
151
            nodeInstance = Y.one(node),
 
152
            attrs = Transition._nodeAttrs[uid],
 
153
            computed,
 
154
            compareVal,
 
155
            dur,
 
156
            attr,
 
157
            val;
 
158
 
 
159
        if (!attrs) {
 
160
            attrs = Transition._nodeAttrs[uid] = {};
 
161
        }
 
162
 
 
163
        attr = attrs[prop];
 
164
 
 
165
        // might just be a value
 
166
        if (config && config.value !== undefined) {
 
167
            val = config.value;
 
168
        } else if (config !== undefined) {
 
169
            val = config; 
 
170
            config = EMPTY_OBJ;
 
171
        }
 
172
 
 
173
        if (typeof val === 'function') {
 
174
            val = val.call(nodeInstance, nodeInstance);
 
175
        }
 
176
 
 
177
        if (attr && attr.transition) {
 
178
            // take control if another transition owns this property
 
179
            if (attr.transition !== anim) {
 
180
                attr.transition._count--; // remapping attr to this transition
 
181
            }
 
182
        } 
 
183
 
 
184
        anim._count++; // properties per transition
 
185
 
 
186
        // make 0 async and fire events
 
187
        dur = ((typeof config.duration != 'undefined') ? config.duration :
 
188
                    anim._duration) || 0.0001;
 
189
 
 
190
        attrs[prop] = {
 
191
            value: val,
 
192
            duration: dur,
 
193
            delay: (typeof config.delay != 'undefined') ? config.delay :
 
194
                    anim._delay,
 
195
 
 
196
            easing: config.easing || anim._easing,
 
197
 
 
198
            transition: anim
 
199
        };
 
200
 
 
201
        // native end event doesnt fire when setting to same value
 
202
        // supplementing with timer
 
203
        // val may be a string or number (height: 0, etc), but computedStyle is always string
 
204
        computed = Y.DOM.getComputedStyle(node, prop);
 
205
        compareVal = (typeof val === 'string') ? computed : parseFloat(computed);
 
206
 
 
207
        if (Transition.useNative && compareVal === val) {
 
208
            setTimeout(function() {
 
209
                anim._onNativeEnd.call(node, {
 
210
                    propertyName: prop,
 
211
                    elapsedTime: dur
 
212
                });
 
213
            }, dur * 1000);
 
214
        }
 
215
    },
 
216
 
 
217
    removeProperty: function(prop) {
 
218
        var anim = this,
 
219
            attrs = Transition._nodeAttrs[Y.stamp(anim._node)];
 
220
 
 
221
        if (attrs && attrs[prop]) {
 
222
            delete attrs[prop];
 
223
            anim._count--;
 
224
        }
 
225
 
 
226
    },
 
227
 
 
228
    initAttrs: function(config) {
 
229
        var attr,
 
230
            node = this._node;
 
231
 
 
232
        if (config.transform && !config[TRANSFORM_CAMEL]) {
 
233
            config[TRANSFORM_CAMEL] = config.transform;
 
234
            delete config.transform; // TODO: copy
 
235
        }
 
236
 
 
237
        for (attr in config) {
 
238
            if (config.hasOwnProperty(attr) && !Transition._reKeywords.test(attr)) {
 
239
                this.addProperty(attr, config[attr]);
 
240
 
 
241
                // when size is auto or % webkit starts from zero instead of computed 
 
242
                // (https://bugs.webkit.org/show_bug.cgi?id=16020)
 
243
                // TODO: selective set
 
244
                if (node.style[attr] === '') {
 
245
                    Y.DOM.setStyle(node, attr, Y.DOM.getComputedStyle(node, attr));
 
246
                }
 
247
            }
 
248
        }
 
249
    },
 
250
 
 
251
    /**
 
252
     * Starts or an animation.
 
253
     * @method run
 
254
     * @chainable
 
255
     * @private
 
256
     */    
 
257
    run: function(callback) {
 
258
        var anim = this,
 
259
            node = anim._node,
 
260
            config = anim._config,
 
261
            data = {
 
262
                type: 'transition:start',
 
263
                config: config
 
264
            };
 
265
 
 
266
 
 
267
        if (!anim._running) {
 
268
            anim._running = true;
 
269
 
 
270
            if (config.on && config.on.start) {
 
271
                config.on.start.call(Y.one(node), data);
 
272
            }
 
273
 
 
274
            anim.initAttrs(anim._config);
 
275
 
 
276
            anim._callback = callback;
 
277
            anim._start();
 
278
        }
 
279
 
 
280
 
 
281
        return anim;
 
282
    },
 
283
 
 
284
    _start: function() {
 
285
        this._runNative();
 
286
    },
 
287
 
 
288
    _prepDur: function(dur) {
 
289
        dur = parseFloat(dur);
 
290
 
 
291
        return dur + 's';
 
292
    },
 
293
 
 
294
    _runNative: function(time) {
 
295
        var anim = this,
 
296
            node = anim._node,
 
297
            uid = Y.stamp(node),
 
298
            style = node.style,
 
299
            computed = node.ownerDocument.defaultView.getComputedStyle(node),
 
300
            attrs = Transition._nodeAttrs[uid],
 
301
            cssText = '',
 
302
            cssTransition = computed[Transition._toCamel(TRANSITION_PROPERTY)],
 
303
 
 
304
            transitionText = TRANSITION_PROPERTY + ': ',
 
305
            duration = TRANSITION_DURATION + ': ',
 
306
            easing = TRANSITION_TIMING_FUNCTION + ': ',
 
307
            delay = TRANSITION_DELAY + ': ',
 
308
            hyphy,
 
309
            attr,
 
310
            name;
 
311
 
 
312
        // preserve existing transitions
 
313
        if (cssTransition !== 'all') {
 
314
            transitionText += cssTransition + ',';
 
315
            duration += computed[Transition._toCamel(TRANSITION_DURATION)] + ',';
 
316
            easing += computed[Transition._toCamel(TRANSITION_TIMING_FUNCTION)] + ',';
 
317
            delay += computed[Transition._toCamel(TRANSITION_DELAY)] + ',';
 
318
 
 
319
        }
 
320
 
 
321
        // run transitions mapped to this instance
 
322
        for (name in attrs) {
 
323
            hyphy = Transition._toHyphen(name);
 
324
            attr = attrs[name];
 
325
            if ((attr = attrs[name]) && attr.transition === anim) {
 
326
                if (name in node.style) { // only native styles allowed
 
327
                    duration += anim._prepDur(attr.duration) + ',';
 
328
                    delay += anim._prepDur(attr.delay) + ',';
 
329
                    easing += (attr.easing) + ',';
 
330
 
 
331
                    transitionText += hyphy + ',';
 
332
                    cssText += hyphy + ': ' + attr.value + '; ';
 
333
                } else {
 
334
                    this.removeProperty(name);
 
335
                }
 
336
            }
 
337
        }
 
338
 
 
339
        transitionText = transitionText.replace(/,$/, ';');
 
340
        duration = duration.replace(/,$/, ';');
 
341
        easing = easing.replace(/,$/, ';');
 
342
        delay = delay.replace(/,$/, ';');
 
343
 
 
344
        // only one native end event per node
 
345
        if (!Transition._hasEnd[uid]) {
 
346
            node.addEventListener(TRANSITION_END, anim._onNativeEnd, '');
 
347
            Transition._hasEnd[uid] = true;
 
348
 
 
349
        }
 
350
        
 
351
        style.cssText += transitionText + duration + easing + delay + cssText;
 
352
 
 
353
    },
 
354
 
 
355
    _end: function(elapsed) {
 
356
        var anim = this,
 
357
            node = anim._node,
 
358
            callback = anim._callback,
 
359
            config = anim._config,
 
360
            data = {
 
361
                type: 'transition:end',
 
362
                config: config,
 
363
                elapsedTime: elapsed 
 
364
            },
 
365
 
 
366
            nodeInstance = Y.one(node); 
 
367
 
 
368
        anim._running = false;
 
369
        anim._callback = null;
 
370
 
 
371
        if (node) {
 
372
            if (config.on && config.on.end) {
 
373
                setTimeout(function() { // IE: allow previous update to finish
 
374
                    config.on.end.call(nodeInstance, data);
 
375
 
 
376
                    // nested to ensure proper fire order
 
377
                    if (callback) {
 
378
                        callback.call(nodeInstance, data);
 
379
                    }
 
380
 
 
381
                }, 1);
 
382
            } else if (callback) {
 
383
                setTimeout(function() { // IE: allow previous update to finish
 
384
                    callback.call(nodeInstance, data);
 
385
                }, 1);
 
386
            }
 
387
        }
 
388
 
 
389
    },
 
390
 
 
391
    _endNative: function(name) {
 
392
        var node = this._node,
 
393
            value = node.ownerDocument.defaultView.getComputedStyle(node, '')[Transition._toCamel(TRANSITION_PROPERTY)];
 
394
 
 
395
        name = Transition._toHyphen(name);
 
396
        if (typeof value === 'string') {
 
397
            value = value.replace(new RegExp('(?:^|,\\s)' + name + ',?'), ',');
 
398
            value = value.replace(/^,|,$/, '');
 
399
            node.style[TRANSITION_CAMEL] = value;
 
400
        }
 
401
    },
 
402
 
 
403
    _onNativeEnd: function(e) {
 
404
        var node = this,
 
405
            uid = Y.stamp(node),
 
406
            event = e,//e._event,
 
407
            name = Transition._toCamel(event.propertyName),
 
408
            elapsed = event.elapsedTime,
 
409
            attrs = Transition._nodeAttrs[uid],
 
410
            attr = attrs[name],
 
411
            anim = (attr) ? attr.transition : null,
 
412
            data,
 
413
            config;
 
414
 
 
415
        if (anim) {
 
416
            anim.removeProperty(name);
 
417
            anim._endNative(name);
 
418
            config = anim._config[name];
 
419
 
 
420
            data = {
 
421
                type: 'propertyEnd',
 
422
                propertyName: name,
 
423
                elapsedTime: elapsed,
 
424
                config: config
 
425
            };
 
426
 
 
427
            if (config && config.on && config.on.end) {
 
428
                config.on.end.call(Y.one(node), data);
 
429
            }
 
430
 
 
431
            if (anim._count <= 0)  { // after propertyEnd fires
 
432
                anim._end(elapsed);
 
433
                node.style[TRANSITION_PROPERTY_CAMEL] = ''; // clean up style
 
434
            }
 
435
        }
 
436
    },
 
437
 
 
438
    destroy: function() {
 
439
        var anim = this,
 
440
            node = anim._node;
 
441
 
 
442
        if (node) {
 
443
            node.removeEventListener(TRANSITION_END, anim._onNativeEnd, false);
 
444
            anim._node = null;
 
445
        }
 
446
    }
 
447
};
 
448
 
 
449
Y.Transition = Transition;
 
450
Y.TransitionNative = Transition; // TODO: remove
 
451
 
 
452
/** 
 
453
 *   Animate one or more css properties to a given value. Requires the "transition" module.
 
454
 *   <pre>example usage:
 
455
 *       Y.one('#demo').transition({
 
456
 *           duration: 1, // in seconds, default is 0.5
 
457
 *           easing: 'ease-out', // default is 'ease'
 
458
 *           delay: '1', // delay start for 1 second, default is 0
 
459
 *
 
460
 *           height: '10px',
 
461
 *           width: '10px',
 
462
 *
 
463
 *           opacity: { // per property
 
464
 *               value: 0,
 
465
 *               duration: 2,
 
466
 *               delay: 2,
 
467
 *               easing: 'ease-in'
 
468
 *           }
 
469
 *       });
 
470
 *   </pre>
 
471
 *   @for Node
 
472
 *   @method transition
 
473
 *   @param {Object} config An object containing one or more style properties, a duration and an easing.
 
474
 *   @param {Function} callback A function to run after the transition has completed. 
 
475
 *   @chainable
 
476
*/
 
477
Y.Node.prototype.transition = function(name, config, callback) {
 
478
    var 
 
479
        transitionAttrs = Transition._nodeAttrs[Y.stamp(this._node)],
 
480
        anim = (transitionAttrs) ? transitionAttrs.transition || null : null,
 
481
        fxConfig,
 
482
        prop;
 
483
    
 
484
    if (typeof name === 'string') { // named effect, pull config from registry
 
485
        if (typeof config === 'function') {
 
486
            callback = config;
 
487
            config = null;
 
488
        }
 
489
 
 
490
        fxConfig = Transition.fx[name];
 
491
 
 
492
        if (config && typeof config !== 'boolean') {
 
493
            config = Y.clone(config);
 
494
 
 
495
            for (prop in fxConfig) {
 
496
                if (fxConfig.hasOwnProperty(prop)) {
 
497
                    if (! (prop in config)) {
 
498
                        config[prop] = fxConfig[prop]; 
 
499
                    }
 
500
                }
 
501
            }
 
502
        } else {
 
503
            config = fxConfig;
 
504
        }
 
505
 
 
506
    } else { // name is a config, config is a callback or undefined
 
507
        callback = config;
 
508
        config = name;
 
509
    }
 
510
 
 
511
    if (anim && !anim._running) {
 
512
        anim.init(this, config);
 
513
    } else {
 
514
        anim = new Transition(this._node, config);
 
515
    }
 
516
 
 
517
    anim.run(callback);
 
518
    return this;
 
519
};
 
520
 
 
521
Y.Node.prototype.show = function(name, config, callback) {
 
522
    this._show(); // show prior to transition
 
523
    if (name && Y.Transition) {
 
524
        if (typeof name !== 'string' && !name.push) { // named effect or array of effects supercedes default
 
525
            if (typeof config === 'function') {
 
526
                callback = config;
 
527
                config = name;
 
528
            }
 
529
            name = Transition.SHOW_TRANSITION; 
 
530
        }    
 
531
        this.transition(name, config, callback);
 
532
    }    
 
533
    else if (name && !Y.Transition) { Y.log('unable to transition show; missing transition module', 'warn', 'node'); }
 
534
    return this;
 
535
};
 
536
 
 
537
var _wrapCallBack = function(anim, fn, callback) {
 
538
    return function() {
 
539
        if (fn) {
 
540
            fn.call(anim);
 
541
        }
 
542
        if (callback) {
 
543
            callback.apply(anim._node, arguments);
 
544
        }
 
545
    };
 
546
};
 
547
 
 
548
Y.Node.prototype.hide = function(name, config, callback) {
 
549
    if (name && Y.Transition) {
 
550
        if (typeof config === 'function') {
 
551
            callback = config;
 
552
            config = null;
 
553
        }
 
554
 
 
555
        callback = _wrapCallBack(this, this._hide, callback); // wrap with existing callback
 
556
        if (typeof name !== 'string' && !name.push) { // named effect or array of effects supercedes default
 
557
            if (typeof config === 'function') {
 
558
                callback = config;
 
559
                config = name;
 
560
            }
 
561
            name = Transition.HIDE_TRANSITION; 
 
562
        }    
 
563
        this.transition(name, config, callback);
 
564
    } else if (name && !Y.Transition) { Y.log('unable to transition hide; missing transition module', 'warn', 'node');
 
565
    } else {
 
566
        this._hide();
 
567
    }    
 
568
    return this;
 
569
}; 
 
570
 
 
571
/** 
 
572
 *   Animate one or more css properties to a given value. Requires the "transition" module.
 
573
 *   <pre>example usage:
 
574
 *       Y.all('.demo').transition({
 
575
 *           duration: 1, // in seconds, default is 0.5
 
576
 *           easing: 'ease-out', // default is 'ease'
 
577
 *           delay: '1', // delay start for 1 second, default is 0
 
578
 *
 
579
 *           height: '10px',
 
580
 *           width: '10px',
 
581
 *
 
582
 *           opacity: { // per property
 
583
 *               value: 0,
 
584
 *               duration: 2,
 
585
 *               delay: 2,
 
586
 *               easing: 'ease-in'
 
587
 *           }
 
588
 *       });
 
589
 *   </pre>
 
590
 *   @for NodeList
 
591
 *   @method transition
 
592
 *   @param {Object} config An object containing one or more style properties, a duration and an easing.
 
593
 *   @param {Function} callback A function to run after the transition has completed. The callback fires
 
594
 *       once per item in the NodeList.
 
595
 *   @chainable
 
596
*/
 
597
Y.NodeList.prototype.transition = function(config, callback) {
 
598
    var nodes = this._nodes,
 
599
        i = 0,
 
600
        node;
 
601
 
 
602
    while ((node = nodes[i++])) {
 
603
        Y.one(node).transition(config, callback);
 
604
    }
 
605
 
 
606
    return this;
 
607
};
 
608
 
 
609
Y.Node.prototype.toggleView = function(name, on, callback) {
 
610
    this._toggles = this._toggles || [];
 
611
    callback = arguments[arguments.length - 1];
 
612
 
 
613
    if (typeof name == 'boolean') { // no transition, just toggle
 
614
        on = name;
 
615
        name = null;
 
616
    }
 
617
 
 
618
    name = name || Y.Transition.DEFAULT_TOGGLE;
 
619
 
 
620
    if (typeof on == 'undefined' && name in this._toggles) { // reverse current toggle
 
621
        on = ! this._toggles[name];
 
622
    }
 
623
 
 
624
    on = (on) ? 1 : 0;
 
625
    if (on) {
 
626
        this._show();
 
627
    }  else {
 
628
        callback = _wrapCallBack(this, this._hide, callback);
 
629
    }
 
630
 
 
631
    this._toggles[name] = on;
 
632
    this.transition(Y.Transition.toggles[name][on], callback);
 
633
 
 
634
    return this;
 
635
};
 
636
 
 
637
Y.NodeList.prototype.toggleView = function(name, on, callback) {
 
638
    var nodes = this._nodes,
 
639
        i = 0,
 
640
        node;
 
641
 
 
642
    while ((node = nodes[i++])) {
 
643
        Y.one(node).toggleView(name, on, callback);
 
644
    }
 
645
 
 
646
    return this;
 
647
};
 
648
 
 
649
Y.mix(Transition.fx, {
 
650
    fadeOut: {
 
651
        opacity: 0,
 
652
        duration: 0.5,
 
653
        easing: 'ease-out'
 
654
    },
 
655
 
 
656
    fadeIn: {
 
657
        opacity: 1,
 
658
        duration: 0.5,
 
659
        easing: 'ease-in'
 
660
    },
 
661
 
 
662
    sizeOut: {
 
663
        height: 0,
 
664
        width: 0,
 
665
        duration: 0.75,
 
666
        easing: 'ease-out'
 
667
    },
 
668
 
 
669
    sizeIn: {
 
670
        height: function(node) {
 
671
            return node.get('scrollHeight') + 'px';
 
672
        },
 
673
        width: function(node) {
 
674
            return node.get('scrollWidth') + 'px';
 
675
        },
 
676
        duration: 0.5,
 
677
        easing: 'ease-in',
 
678
        
 
679
        on: {
 
680
            start: function() {
 
681
                var overflow = this.getStyle('overflow');
 
682
                if (overflow !== 'hidden') { // enable scrollHeight/Width
 
683
                    this.setStyle('overflow', 'hidden');
 
684
                    this._transitionOverflow = overflow;
 
685
                }
 
686
            },
 
687
 
 
688
            end: function() {
 
689
                if (this._transitionOverflow) { // revert overridden value
 
690
                    this.setStyle('overflow', this._transitionOverflow);
 
691
                    delete this._transitionOverflow;
 
692
                }
 
693
            }
 
694
        } 
 
695
    }
 
696
});
 
697
 
 
698
Y.mix(Transition.toggles, {
 
699
    size: ['sizeOut', 'sizeIn'],
 
700
    fade: ['fadeOut', 'fadeIn']
 
701
});
 
702
 
 
703
Transition.DEFAULT_TOGGLE = 'fade';
 
704
 
 
705
 
 
706
 
 
707
}, '3.5.1' ,{requires:['node-style']});