1 | define(["dojo/_base/array", "dojo/dom-style", "dojo/promise/all", "dojo/sniff", "./transition"], |
---|
2 | function(darray, domStyle, all, has, transition){ |
---|
3 | // module: |
---|
4 | // dojox/css3/transit |
---|
5 | |
---|
6 | var transit = function(/*DomNode*/from, /*DomNode*/to, /*Object?*/options){ |
---|
7 | // summary: |
---|
8 | // Performs a transition to hide a node and show another node. |
---|
9 | // description: |
---|
10 | // This module defines the transit method which is used |
---|
11 | // to transit the specific region of an application from |
---|
12 | // one view/page to another view/page. This module relies |
---|
13 | // on utilities provided by dojox/css3/transition for the |
---|
14 | // transition effects. |
---|
15 | // options: |
---|
16 | // The argument to specify the transit effect and direction. |
---|
17 | // The effect can be specified in options.transition. The |
---|
18 | // valid values are 'slide', 'flip', 'fade', 'none'. |
---|
19 | // The direction can be specified in options.reverse. If it |
---|
20 | // is true, the transit effects will be conducted in the |
---|
21 | // reverse direction to the default direction. Finally the duration |
---|
22 | // of the transition can be overridden by setting the duration property. |
---|
23 | var rev = (options && options.reverse) ? -1 : 1; |
---|
24 | if(!options || !options.transition || !transition[options.transition] || (has("ie") && has("ie") < 10)){ |
---|
25 | if(from){ |
---|
26 | domStyle.set(from,"display","none"); |
---|
27 | } |
---|
28 | if(to){ |
---|
29 | domStyle.set(to, "display", ""); |
---|
30 | } |
---|
31 | if(options.transitionDefs){ |
---|
32 | if(options.transitionDefs[from.id]){ |
---|
33 | options.transitionDefs[from.id].resolve(from); |
---|
34 | } |
---|
35 | if(options.transitionDefs[to.id]){ |
---|
36 | options.transitionDefs[to.id].resolve(to); |
---|
37 | } |
---|
38 | } |
---|
39 | // return any empty promise/all if the options.transition="none" |
---|
40 | return new all([]); |
---|
41 | }else{ |
---|
42 | var defs = []; |
---|
43 | var transit = []; |
---|
44 | var duration = 2000; |
---|
45 | if(!options.duration){ |
---|
46 | duration = 250; |
---|
47 | if(options.transition === "fade"){ |
---|
48 | duration = 600; |
---|
49 | }else if (options.transition === "flip"){ |
---|
50 | duration = 200; |
---|
51 | } |
---|
52 | }else{ |
---|
53 | duration = options.duration; |
---|
54 | } |
---|
55 | if(from){ |
---|
56 | domStyle.set(from, "display", ""); |
---|
57 | //create transition to transit "from" out |
---|
58 | var fromTransit = transition[options.transition](from, { |
---|
59 | "in": false, |
---|
60 | direction: rev, |
---|
61 | duration: duration, |
---|
62 | deferred: (options.transitionDefs && options.transitionDefs[from.id]) ? options.transitionDefs[from.id] : null |
---|
63 | }); |
---|
64 | defs.push(fromTransit.deferred);//every transition object should have a deferred. |
---|
65 | transit.push(fromTransit); |
---|
66 | } |
---|
67 | if(to){ |
---|
68 | domStyle.set(to, "display", ""); |
---|
69 | //create transition to transit "to" in |
---|
70 | var toTransit = transition[options.transition](to, { |
---|
71 | direction: rev, |
---|
72 | duration: duration, |
---|
73 | deferred: (options.transitionDefs && options.transitionDefs[to.id]) ? options.transitionDefs[to.id] : null |
---|
74 | }); |
---|
75 | defs.push(toTransit.deferred);//every transition object should have a deferred. |
---|
76 | transit.push(toTransit); |
---|
77 | } |
---|
78 | //If it is flip use the chainedPlay, otherwise |
---|
79 | //play fromTransit and toTransit together |
---|
80 | if(options.transition === "flip"){ |
---|
81 | transition.chainedPlay(transit); |
---|
82 | }else{ |
---|
83 | transition.groupedPlay(transit); |
---|
84 | } |
---|
85 | |
---|
86 | return all(defs); |
---|
87 | } |
---|
88 | }; |
---|
89 | |
---|
90 | return transit; |
---|
91 | }); |
---|