2 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
3 //>>description: Animated page change core logic and sequence handlers
4 //>>label: Transition Core
6 //>>css: ../css/themes/default/jquery.mobile.theme.css, ../css/structure/jquery.mobile.transition.css
8 define( [ "jquery", "./jquery.mobile.core" ], function( $ ) {
9 //>>excludeEnd("jqmBuildExclude");
10 (function( $, window, undefined ) {
12 var createHandler = function( sequential ){
14 // Default to sequential
15 if( sequential === undefined ){
19 return function( name, reverse, $to, $from ) {
21 var deferred = new $.Deferred(),
22 reverseClass = reverse ? " reverse" : "",
23 active = $.mobile.urlHistory.getActive(),
24 toScroll = active.lastScroll || $.mobile.defaultHomeScroll,
25 screenHeight = $.mobile.getScreenHeight(),
26 maxTransitionOverride = $.mobile.maxTransitionWidth !== false && $( window ).width() > $.mobile.maxTransitionWidth,
27 none = !$.support.cssTransitions || maxTransitionOverride || !name || name === "none",
28 toggleViewportClass = function(){
29 $.mobile.pageContainer.toggleClass( "ui-mobile-viewport-transitioning viewport-" + name );
31 scrollPage = function(){
32 // By using scrollTo instead of silentScroll, we can keep things better in order
33 // Just to be precautios, disable scrollstart listening like silentScroll would
34 $.event.special.scrollstart.enabled = false;
36 window.scrollTo( 0, toScroll );
38 // reenable scrollstart listening like silentScroll would
39 setTimeout(function() {
40 $.event.special.scrollstart.enabled = true;
43 cleanFrom = function(){
45 .removeClass( $.mobile.activePageClass + " out in reverse " + name )
48 startOut = function(){
49 // if it's not sequential, call the doneOut transition to start the TO page animating in simultaneously
54 $from.animationComplete( doneOut );
57 // Set the from page's height and start it transitioning out
58 // Note: setting an explicit height helps eliminate tiling in the transitions
60 .height( screenHeight + $(window ).scrollTop() )
61 .addClass( name + " out" + reverseClass );
64 doneOut = function() {
66 if ( $from && sequential ) {
75 $to.addClass( $.mobile.activePageClass );
77 // Send focus to page as it is now display: block
78 $.mobile.focusPage( $to );
81 $to.height( screenHeight + toScroll );
86 $to.animationComplete( doneIn );
89 $to.addClass( name + " in" + reverseClass );
107 .removeClass( "out in reverse " + name )
110 toggleViewportClass();
112 // In some browsers (iOS5), 3D transitions block the ability to scroll to the desired location during transition
113 // This ensures we jump to that spot after the fact, if we aren't there already.
114 if( $( window ).scrollTop() !== toScroll ){
118 deferred.resolve( name, reverse, $to, $from, true );
121 toggleViewportClass();
123 if ( $from && !none ) {
130 return deferred.promise();
134 // generate the handlers from the above
135 var sequentialHandler = createHandler(),
136 simultaneousHandler = createHandler( false );
138 // Make our transition handler the public default.
139 $.mobile.defaultTransitionHandler = sequentialHandler;
141 //transition handler dictionary for 3rd party transitions
142 $.mobile.transitionHandlers = {
143 "default": $.mobile.defaultTransitionHandler,
144 "sequential": sequentialHandler,
145 "simultaneous": simultaneousHandler
148 $.mobile.transitionFallbacks = {};
151 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
153 //>>excludeEnd("jqmBuildExclude");