diff --git a/js/jquery.mobile.transition.js b/js/jquery.mobile.transition.js index 315c1159..6d07b0e7 100644 --- a/js/jquery.mobile.transition.js +++ b/js/jquery.mobile.transition.js @@ -2,99 +2,92 @@ * "transitions" plugin - Page change tranistions */ -//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); -//>>description: Page change tranistions. -//>>label: Page Transitions - -// TODO the dependency defined here for transitions is to make sure -// that the defaultTransitionHandler is defined _after_ navigation has been defined -// This requires a rework/rethinking -define( [ "jquery.mobile.core", "order!jquery.mobile.navigation" ], function() { -//>>excludeEnd("jqmBuildExclude"); (function( $, window, undefined ) { -function css3TransitionHandler( name, reverse, $to, $from ) { - +function outInTransitionHandler( name, reverse, $to, $from ) { + var deferred = new $.Deferred(), reverseClass = reverse ? " reverse" : "", active = $.mobile.urlHistory.getActive(), touchOverflow = $.support.touchOverflow && $.mobile.touchOverflowEnabled, toScroll = active.lastScroll || ( touchOverflow ? 0 : $.mobile.defaultHomeScroll ), - viewportClass = "ui-mobile-viewport-transitioning viewport-" + name, screenHeight = $.mobile.getScreenHeight(), - doneFunc = function() { + viewportClass = "ui-mobile-viewport-transitioning viewport-" + name, + doneOut = function() { - $to.add( $from ).removeClass( "out in reverse " + name ); - - if ( $from && $from[ 0 ] !== $to[ 0 ] ) { - $from.removeClass( $.mobile.activePageClass ); + if ( $from ) { + $from + .removeClass( $.mobile.activePageClass + " out in reverse " + name ) + .height( "" ); } - - $to.parent().removeClass( viewportClass ); - //reset $to height back - if( !touchOverflow ){ - $to.height( "" ); - } + $to + .animationComplete( doneIn ) + .addClass( $.mobile.activePageClass ); - // Jump to top or prev scroll, sometimes on iOS the page has not rendered yet. - if( !touchOverflow ){ - $.mobile.silentScroll( toScroll ); - } + // Send focus to page as it is now display: block + $.mobile.focusPage( $to ); + + if( touchOverflow && toScroll ){ - //trigger show/hide events - if( $from ) { - if( !touchOverflow ){ - $from.height( "" ); + //set page's scrollTop to remembered distance + if( $to.is( ".ui-native-fixed" ) ){ + $to.find( ".ui-content" ).scrollTop( toScroll ); + } + else{ + $to.scrollTop( toScroll ); } } + + // Jump to top or prev scroll, sometimes on iOS the page has not rendered yet. + if( !touchOverflow ){ + $to.height( screenHeight + toScroll ); + + $.mobile.silentScroll( toScroll ); + } + + $to.addClass( name + " in" + reverseClass ); + + }, + + doneIn = function() { - deferred.resolve( name, reverse, $to, $from ); + $to + .removeClass( "out in reverse " + name ) + .parent().removeClass( viewportClass ) + .height( "" ); + + deferred.resolve( name, reverse, $to, $from, true ); }; - - $to.animationComplete( doneFunc ); - - $to.parent().addClass( viewportClass ); - - // Scroll to top, hide addr bar - window.scrollTo( 0, $.mobile.defaultHomeScroll ); - - if( !touchOverflow){ - $to.height( screenHeight + toScroll ); - } - - if( touchOverflow && toScroll ){ - $to.addClass( "ui-mobile-pre-transition" ); - - // Send focus to page as it is now display: block - $.mobile.focusPage( $to ); - - //set page's scrollTop to remembered distance - if( $to.is( ".ui-native-fixed" ) ){ - $to.find( ".ui-content" ).scrollTop( toScroll ); - } - else{ - $to.scrollTop( toScroll ); - } - } + $to + .parent().addClass( viewportClass ); //clear page loader $.mobile.hidePageLoadingMsg(); if ( $from ) { - $from.addClass( name + " out" + reverseClass ); + $from + .height( screenHeight + $(window ).scrollTop() ) + .animationComplete( doneOut ) + .addClass( name + " out" + reverseClass ); + } + else { + doneOut(); } - - $to.addClass( $.mobile.activePageClass + " " + name + " in" + reverseClass ); return deferred.promise(); } // Make our transition handler public. -$.mobile.css3TransitionHandler = css3TransitionHandler; +$.mobile.outInTransitionHandler = outInTransitionHandler; + +// If the default transition handler is the 'none' handler, replace it with our handler. +if ( $.mobile.defaultTransitionHandler === $.mobile.noneTransitionHandler ) { + $.mobile.defaultTransitionHandler = outInTransitionHandler; +} + +// add class for where 3d transforms are supported, or not +$( "html" ).addClass( $.support.cssTransform3d ? "ui-supported-csstransform3d" : "ui-unsupported-csstransform3d" ); })( jQuery, this ); -//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); -}); -//>>excludeEnd("jqmBuildExclude"); diff --git a/js/jquery.mobile.transition.outin.js b/js/jquery.mobile.transition.outin.js deleted file mode 100644 index 6d07b0e7..00000000 --- a/js/jquery.mobile.transition.outin.js +++ /dev/null @@ -1,93 +0,0 @@ -/* -* "transitions" plugin - Page change tranistions -*/ - -(function( $, window, undefined ) { - -function outInTransitionHandler( name, reverse, $to, $from ) { - - var deferred = new $.Deferred(), - reverseClass = reverse ? " reverse" : "", - active = $.mobile.urlHistory.getActive(), - touchOverflow = $.support.touchOverflow && $.mobile.touchOverflowEnabled, - toScroll = active.lastScroll || ( touchOverflow ? 0 : $.mobile.defaultHomeScroll ), - screenHeight = $.mobile.getScreenHeight(), - viewportClass = "ui-mobile-viewport-transitioning viewport-" + name, - doneOut = function() { - - if ( $from ) { - $from - .removeClass( $.mobile.activePageClass + " out in reverse " + name ) - .height( "" ); - } - - $to - .animationComplete( doneIn ) - .addClass( $.mobile.activePageClass ); - - // Send focus to page as it is now display: block - $.mobile.focusPage( $to ); - - if( touchOverflow && toScroll ){ - - //set page's scrollTop to remembered distance - if( $to.is( ".ui-native-fixed" ) ){ - $to.find( ".ui-content" ).scrollTop( toScroll ); - } - else{ - $to.scrollTop( toScroll ); - } - } - - // Jump to top or prev scroll, sometimes on iOS the page has not rendered yet. - if( !touchOverflow ){ - $to.height( screenHeight + toScroll ); - - $.mobile.silentScroll( toScroll ); - } - - $to.addClass( name + " in" + reverseClass ); - - }, - - doneIn = function() { - - $to - .removeClass( "out in reverse " + name ) - .parent().removeClass( viewportClass ) - .height( "" ); - - deferred.resolve( name, reverse, $to, $from, true ); - }; - - $to - .parent().addClass( viewportClass ); - - //clear page loader - $.mobile.hidePageLoadingMsg(); - - if ( $from ) { - $from - .height( screenHeight + $(window ).scrollTop() ) - .animationComplete( doneOut ) - .addClass( name + " out" + reverseClass ); - } - else { - doneOut(); - } - - return deferred.promise(); -} - -// Make our transition handler public. -$.mobile.outInTransitionHandler = outInTransitionHandler; - -// If the default transition handler is the 'none' handler, replace it with our handler. -if ( $.mobile.defaultTransitionHandler === $.mobile.noneTransitionHandler ) { - $.mobile.defaultTransitionHandler = outInTransitionHandler; -} - -// add class for where 3d transforms are supported, or not -$( "html" ).addClass( $.support.cssTransform3d ? "ui-supported-csstransform3d" : "ui-unsupported-csstransform3d" ); - -})( jQuery, this );