1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
define("dojo/fx/Toggler", ["../_base/lang","../_base/declare","../_base/fx", "../_base/connect"],
function(lang, declare, baseFx, connectUtil){
// module:
// dojo/fx/Toggler
return declare("dojo.fx.Toggler", null, {
// summary:
// A simple `dojo.Animation` toggler API.
// description:
// class constructor for an animation toggler. It accepts a packed
// set of arguments about what type of animation to use in each
// direction, duration, etc. All available members are mixed into
// these animations from the constructor (for example, `node`,
// `showDuration`, `hideDuration`).
// example:
// | var t = new dojo/fx/Toggler({
// | node: "nodeId",
// | showDuration: 500,
// | // hideDuration will default to "200"
// | showFunc: dojo/fx/wipeIn,
// | // hideFunc will default to "fadeOut"
// | });
// | t.show(100); // delay showing for 100ms
// | // ...time passes...
// | t.hide();
// node: DomNode
// the node to target for the showing and hiding animations
node: null,
// showFunc: Function
// The function that returns the `dojo.Animation` to show the node
showFunc: baseFx.fadeIn,
// hideFunc: Function
// The function that returns the `dojo.Animation` to hide the node
hideFunc: baseFx.fadeOut,
// showDuration:
// Time in milliseconds to run the show Animation
showDuration: 200,
// hideDuration:
// Time in milliseconds to run the hide Animation
hideDuration: 200,
// FIXME: need a policy for where the toggler should "be" the next
// time show/hide are called if we're stopped somewhere in the
// middle.
// FIXME: also would be nice to specify individual showArgs/hideArgs mixed into
// each animation individually.
// FIXME: also would be nice to have events from the animations exposed/bridged
/*=====
_showArgs: null,
_showAnim: null,
_hideArgs: null,
_hideAnim: null,
_isShowing: false,
_isHiding: false,
=====*/
constructor: function(args){
var _t = this;
lang.mixin(_t, args);
_t.node = args.node;
_t._showArgs = lang.mixin({}, args);
_t._showArgs.node = _t.node;
_t._showArgs.duration = _t.showDuration;
_t.showAnim = _t.showFunc(_t._showArgs);
_t._hideArgs = lang.mixin({}, args);
_t._hideArgs.node = _t.node;
_t._hideArgs.duration = _t.hideDuration;
_t.hideAnim = _t.hideFunc(_t._hideArgs);
connectUtil.connect(_t.showAnim, "beforeBegin", lang.hitch(_t.hideAnim, "stop", true));
connectUtil.connect(_t.hideAnim, "beforeBegin", lang.hitch(_t.showAnim, "stop", true));
},
show: function(delay){
// summary:
// Toggle the node to showing
// delay: Integer?
// Amount of time to stall playing the show animation
return this.showAnim.play(delay || 0);
},
hide: function(delay){
// summary:
// Toggle the node to hidden
// delay: Integer?
// Amount of time to stall playing the hide animation
return this.hideAnim.play(delay || 0);
}
});
});
|
