The expected prototype for a transitionHandler is as follows:
function handler(name, reverse, $to, $from)
The name parameter is the name of the transition as specified by @data-transition attribute, reverse is a boolean that is false for a normal transition, and true for a reverse transition. The $to param is a jQuery collection containing the page that is being transitioned "to", and $from is an optional collection that tells us what page we are transitioning "from". Because $from is optional, handler developers should take care and check $from to make sure it is not undefined before attempting to dereference it.
In addition to registering custom transition by name, developers can specify a handler to use in the case where a transition name is specified and does not exist within the $.mobile.transitionHanlders dictionary. Within jQuery Mobile, the default handler for unknown transition types is the $.mobile.css3Transition() handler. This handler always assumes that the transition name is to be used as a CSS class to be placed on the $to and $from elements. To change the default handler, simply set $.mobile.defaultTransitionHandler to you function handler:
$.mobile.defaultTransitionHandler = myTransitionHandler;
The changes to make all this necessary are as follows:
- Created $.mobile.noneTransitionHandler which is the default transitionHandler for the framework that simply adds and removes the page active class on the $from and $to pages with no animations.
- Moved class based transition code into a new plugin jquery.mobile.transition.js file. This plugin, when present, overrides the noneTransitionHandler as the defaultTranstionHandler for the framework so that CSS3 animation transitions are available.
- Removed code related to the setting/removal of the ui-mobile-viewport-perspective class. The css3TransitionHandler plugin takes care of automatically placing a "viewport-<transition name>" class on the viewport (body) element. This allows any other transition to specify properties on the viewport that are necessary to accomplish the transition.
- changed the CSS class ui-mobile-viewport-perspective to viewport-flip to match code changes. This makes it more apparent that setting -webkit-perspective is only used with the flip transition.
- Updated js/index.php, Makefile and build.xml to include the new jquery.mobile.transition.js file.
https://github.com/jquery/jquery-mobile/pull/649
- Changed hideOnTouchEnabed to touchToggleEnabled.
- Fixed problem that would allow the toolbars to show on touchstop, if the starting state was "inline" to begin with.
- Moved the touchToggleEnabled checks in touchstart/touchstop so that they wrap the entire code in the function. We don't want to do any work if we don't need to.
- Removed the forced hide() call in touchstart.
Added the missing fadeout animation reference inthe fade.in transition rule.
- Removed -webkit-backface-visibility from all general rules and placed it in the .slide transition rule. It was impacting scroll performance and causing some rendering problems on iOS 3.1.x and some Android platforms.
- Added a -webkit-perspective property to the body element, since it is the container for the element (ui-page) that actually flips. We need specify this so a projection matrix gets created, giving the viewer some perspective. The 1000 represents the depth in pixels (the distance from the viewer to the z-plane). According to the CSS3 spec 1000 is a moderate value. Lower values make the effect more extreme.
"Global: blinky page transitions"
According to the CSS Animations spec as soon as an animation completes, any properties that were animated revert back to their previous values. This means that the CSS rule that refers to the animation by name must also have the "To" property values specified.
Edited the PHP combiner and .htaccess logic to accommodate this change, as well as allowing manifest files to use a "../" when referencing files, which will be handy when adding themes that don't include structural files yet.
Modified all HTML files to point to /themes/default for their theme.
