libs/js/jquery-mobile-1.1.0/js/jquery.mobile.transition.js

   1
   2 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
   3 //>>description: Animated page change core logic and sequence handlers
   4 //>>label: Transition Core
   5 //>>group: Transitions
   6 //>>css: ../css/themes/default/jquery.mobile.theme.css, ../css/structure/jquery.mobile.transition.css
   7
   8 define( [ "jquery", "./jquery.mobile.core" ], function( $ ) {
   9 //>>excludeEnd("jqmBuildExclude");
  10 (function( $, window, undefined ) {
  11
  12 var createHandler = function( sequential ){
  13
  14         // Default to sequential
  15         if( sequential === undefined ){
  16                 sequential = true;
  17         }
  18
  19         return function( name, reverse, $to, $from ) {
  20
  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 );
  30                         },
  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;
  35
  36                                 window.scrollTo( 0, toScroll );
  37
  38                                 // reenable scrollstart listening like silentScroll would
  39                                 setTimeout(function() {
  40                                         $.event.special.scrollstart.enabled = true;
  41                                 }, 150 );
  42                         },
  43                         cleanFrom = function(){
  44                                 $from
  45                                         .removeClass( $.mobile.activePageClass + " out in reverse " + name )
  46                                         .height( "" );
  47                         },
  48                         startOut = function(){
  49                                 // if it's not sequential, call the doneOut transition to start the TO page animating in simultaneously
  50                                 if( !sequential ){
  51                                         doneOut();
  52                                 }
  53                                 else {
  54                                         $from.animationComplete( doneOut );
  55                                 }
  56
  57                                 // Set the from page's height and start it transitioning out
  58                                 // Note: setting an explicit height helps eliminate tiling in the transitions
  59                                 $from
  60                                         .height( screenHeight + $(window ).scrollTop() )
  61                                         .addClass( name + " out" + reverseClass );
  62                         },
  63
  64                         doneOut = function() {
  65
  66                                 if ( $from && sequential ) {
  67                                         cleanFrom();
  68                                 }
  69
  70                                 startIn();
  71                         },
  72
  73                         startIn = function(){
  74
  75                                 $to.addClass( $.mobile.activePageClass );
  76
  77                                 // Send focus to page as it is now display: block
  78                                 $.mobile.focusPage( $to );
  79
  80                                 // Set to page height
  81                                 $to.height( screenHeight + toScroll );
  82
  83                                 scrollPage();
  84
  85                                 if( !none ){
  86                                         $to.animationComplete( doneIn );
  87                                 }
  88
  89                                 $to.addClass( name + " in" + reverseClass );
  90
  91                                 if( none ){
  92                                         doneIn();
  93                                 }
  94
  95                         },
  96
  97                         doneIn = function() {
  98
  99                                 if ( !sequential ) {
 100
 101                                         if( $from ){
 102                                                 cleanFrom();
 103                                         }
 104                                 }
 105
 106                                 $to
 107                                         .removeClass( "out in reverse " + name )
 108                                         .height( "" );
 109
 110                                 toggleViewportClass();
 111
 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 ){
 115                                         scrollPage();
 116                                 }
 117
 118                                 deferred.resolve( name, reverse, $to, $from, true );
 119                         };
 120
 121                 toggleViewportClass();
 122
 123                 if ( $from && !none ) {
 124                         startOut();
 125                 }
 126                 else {
 127                         doneOut();
 128                 }
 129
 130                 return deferred.promise();
 131         };
 132 }
 133
 134 // generate the handlers from the above
 135 var sequentialHandler = createHandler(),
 136         simultaneousHandler = createHandler( false );
 137
 138 // Make our transition handler the public default.
 139 $.mobile.defaultTransitionHandler = sequentialHandler;
 140
 141 //transition handler dictionary for 3rd party transitions
 142 $.mobile.transitionHandlers = {
 143         "default": $.mobile.defaultTransitionHandler,
 144         "sequential": sequentialHandler,
 145         "simultaneous": simultaneousHandler
 146 };
 147
 148 $.mobile.transitionFallbacks = {};
 149
 150 })( jQuery, this );
 151 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
 152 });
 153 //>>excludeEnd("jqmBuildExclude");