PaperWave
Provides all the logic to produce a one-time rippling effect.
Constructor Summary
Public Constructor | ||
public |
constructor(objectPattern: {"$": *, "recenters": *, "center": *, "initialOpacity": *, "opacityDecayVelocity": *}): PaperWave Initializes a new instance of the |
Member Summary
Public Members | ||
public |
Represents the object wrapped around the main DOM element that belongs to the current instance. |
|
public |
Represents the object wrapped around the |
|
public |
Determines whether the wave should start a movement from the center of its container. |
|
public |
Gets or sets the color of the wave. |
|
public |
Gets or sets the container metrics of the wave. |
|
public get |
currentPosition: {x: Number, y: Number}: * Gets the wave's current position. |
|
public |
endPosition: {x: Number, y: Number} Gets or sets the end position of the wave. |
|
public |
Gets initial opacity of the wave. |
|
public get |
Determines whether the animation of rippling effect completed or not. |
|
public get |
Determines whether the wave reached its max radius or not. |
|
public get |
isTouchDown: Boolean: * Determines whether the pointing device is still in interaction with the current wave. |
|
public get |
Determines whether the wave is fully opaque or not. |
|
public |
Gets or sets max radius of the wave. |
|
public get |
Gets the total interaction time. |
|
public get |
Gets the wave's opacity at the current time. |
|
public |
Gets opacity decay velocity of the wave. |
|
public get |
outerOpacity: Number: * Gets the wave's outer opacity at the current time. |
|
public get |
Gets the wave's radius at the current time. |
|
public |
Determines whether the wave should be re-centered towards the center of its container. |
|
public |
startPosition: {x: Number, y: Number} Gets or sets the start position of the wave. |
|
public get |
Gets the time in milliseconds elapsed from the moment where interaction with the wave was started. |
|
public get |
Gets the time in seconds elapsed since the moment where interaction with the wave was started. |
|
public |
Gets or sets the time of starting interaction with the wave. |
|
public get |
touchUpElapsed: Number: * Gets the time in milliseconds elapsed from the moment where interaction with the wave was ended. |
|
public get |
Gets the time in seconds elapsed since the moment where interaction with the wave was ended. |
|
public |
Gets or sets the time of ending interaction with the wave. |
|
public get |
Gets the wave's translation fraction value. |
Method Summary
Public Methods | ||
public |
downAction(event: Event | Object): PaperWave Performs ripple-down effect on the current wave. |
|
public |
Performs updating of the wave's values. |
|
public |
Removes the wave from a DOM. |
|
public |
Resets all the wave's values. |
|
public |
Performs ripple-up effect on the current wave. |
Public Constructors
public constructor(objectPattern: {"$": *, "recenters": *, "center": *, "initialOpacity": *, "opacityDecayVelocity": *}): PaperWave source
Initializes a new instance of the PaperWave
class with the specified PaperRipple
instance.
Params:
Name | Type | Attribute | Description |
objectPattern | {"$": *, "recenters": *, "center": *, "initialOpacity": *, "opacityDecayVelocity": *} |
|
Example:
var paperWave = new PaperWave(paperRipple);
paperWave.downAction(null);
paperWave.upAction();
if (paperWave.isAnimationCompleted) {
paperWave.remove();
}
Public Members
public $: Object source
Represents the object wrapped around the main DOM element that belongs to the current instance.
public $wave: Object source
Represents the object wrapped around the wave
DOM element that belongs to the current instance.
public center: Boolean source
Determines whether the wave should start a movement from the center of its container.
public get isAnimationComplete: Boolean: * source
Determines whether the animation of rippling effect completed or not.
public get isMaxRadiusReached: Boolean: * source
Determines whether the wave reached its max radius or not.
public get isTouchDown: Boolean: * source
Determines whether the pointing device is still in interaction with the current wave.
public recenters: Boolean source
Determines whether the wave should be re-centered towards the center of its container.
public get touchDownElapsed: Number: * source
Gets the time in milliseconds elapsed from the moment where interaction with the wave was started.
public get touchDownElapsedSeconds: Number: * source
Gets the time in seconds elapsed since the moment where interaction with the wave was started.
public get touchUpElapsed: Number: * source
Gets the time in milliseconds elapsed from the moment where interaction with the wave was ended.
Public Methods
public downAction(event: Event | Object): PaperWave source
Performs ripple-down effect on the current wave.