Namespace: ModuleAnimations

Oracle® JavaScript Extension Toolkit (JET)
2.0.0

E70325-01

QuickNav

Fields

oj. ModuleAnimations

Version:
  • 2.0.0
A collection of ModuleAnimation implementations that can be specified on the "animation" option of ojModule binding.

These implementations assume that either the ojModule binding is on a real HTML element or, for ojModule binding on virtual element, each view is contained by a single HTML root element.
Source:

Fields

<static> coverStart

ModuleAnimation implementation for changing views by sliding the new view in to cover the old view.

This will take the text direction of the page into account. On "ltr" page, the new view will slide to the left. On "rtl" page, it will slide to the right.
Source:

<static> coverUp

ModuleAnimation implementation for changing views by sliding the new view up to cover the old view.
Source:

<static> drillIn

ModuleAnimation implementation for drilling in to views by using animations that are dependent on the platform theme.

The default animations for each platform theme are as follows:

  • Web theme: coverStart
  • iOS theme: coverStart
  • Android theme: coverUp
  • Windows theme: zoomIn

The default animation can be changed with the following theme variable:
$animationDrillInDefault: specify the animation for drilling in to views.

Valid values are the names of specific animation implementations such as "coverStart".

Source:
Example

Set the default in the theme (SCSS) :

$animationDrillInDefault:  coverStart  !default;

<static> drillOut

ModuleAnimation implementation for drilling out of views by using animations that are dependent on the platform theme.

The default animations for each platform theme are as follows:

  • Web theme: revealEnd
  • iOS theme: revealEnd
  • Android theme: revealDown
  • Windows theme: zoomOut

The default animation can be changed with the following theme variable:
$animationDrillOutDefault: specify the animation for drilling out of views.

Valid values are the names of specific animation implementations such as "revealEnd".

Source:
Example

Set the default in the theme (SCSS) :

$animationDrillOutDefault:  revealEnd  !default;

<static> fade

ModuleAnimation implementation for changing views by fading in the new view and fading out the old view.
Source:

<static> revealDown

ModuleAnimation implementation for changing views by sliding the old view down to reveal the new view.
Source:

<static> revealEnd

ModuleAnimation implementation for changing views by sliding the old view out to reveal the new view.

This will take the text direction of the page into account. On "ltr" page, the old view will slide to the right. On "rtl" page, it will slide to the left.
Source:

<static> zoomIn

ModuleAnimation implementation for changing views by zooming in on the new view.
Source:

<static> zoomOut

ModuleAnimation implementation for changing views by zooming out on the old view.
Source:

Methods

<static> switcher(callback) → {Object}

Returns an implementation of ModuleAnimation interface that switches between different animation implementations
Parameters:
Name Type Description
callback Function a callback function whose return value should be a string containing one of the animation types supported by oj.ModuleAnimations. The function will be passed a context object with the keys detailed below:
  • node - a DOM node where the ojModule binding is attached. This may be a virtual/comment node
  • valueAccessor - value accessor for the binding
  • isInitial - true if the initial View is about to be displayed, false otherwise
  • oldViewModel - the instance of the ViewModel for the old View
  • newViewModel - the instance of the ViewModel for the new View
Source:
Returns:
switching implementation of the ModuleAnimation interface
Type
Object