Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 | 5x 5x 13x 13x 13x 1x 1x 1x 13x 1x 1x 1x 13x 1x 1x 1x 13x 1x 1x 1x 13x 1x 1x 13x 1x 1x 13x 1x 1x 13x 1x 1x 13x 1x 1x 13x 1x 1x | import { FrameAnimationPropertiesType } from '../types/AnimationTypes';
import { EditorAPI, Id } from '../types/CommonTypes';
import { getEditorResponseData } from '../utils/EditorResponseData';
/**
* The AnimationController is responsible for all communication regarding Animations.
* Methods inside this controller can be called by `window.SDK.animation.{method-name}`
*/
export class AnimationController {
/**
* @ignore
*/
#editorAPI: EditorAPI;
/**
* @ignore
*/
constructor(children: EditorAPI) {
this.#editorAPI = children;
}
/**
* This method returns all animations on current layout
* @returns list of all animation on current layout
*/
getAllOnSelectedLayout = async () => {
const res = await this.#editorAPI;
return res
.getAnimationsOnSelectedLayout()
.then((result) => getEditorResponseData<FrameAnimationPropertiesType[]>(result));
};
/**
* This method returns an animation for a given frame and layout IDs
* @param id the id of a specific frame
* @param layoutId the id of a specific layout
* @returns animation properties for a given frame and layout
*/
getByFrameId = async (id: Id, layoutId?: Id) => {
const res = await this.#editorAPI;
return res
.getAnimationByFrameId<string>(id, layoutId)
.then((result) => getEditorResponseData<FrameAnimationPropertiesType>(result));
};
/**
* This method returns the animations for a given layout id
* @param id the id of a specific layout
* @returns animation properties for a given layout
*/
getByLayoutId = async (id: Id) => {
const res = await this.#editorAPI;
return res
.getAnimationsByLayoutId(id)
.then((result) => getEditorResponseData<FrameAnimationPropertiesType>(result));
};
/**
* This method sets the animation state for a certain Frame
* @param animation animation properties
* @returns updated animation properties
*/
setFrameAnimation = async (animation: FrameAnimationPropertiesType) => {
const res = await this.#editorAPI;
return res
.setFrameAnimation(JSON.stringify(animation))
.then((result) =>
getEditorResponseData<FrameAnimationPropertiesType>({ ...result, data: JSON.stringify(animation) }),
);
};
/**
* This method triggers the animation to play
* @returns
*/
play = async () => {
const res = await this.#editorAPI;
return res.playAnimation().then((result) => getEditorResponseData<null>(result));
};
/**
* This method triggers the animation to pause
* @returns
*/
pause = async () => {
const res = await this.#editorAPI;
return res.pauseAnimation().then((result) => getEditorResponseData<null>(result));
};
/**
* This method sets the animation time to a certain time, expressed in milliseconds
* @param timeInMS the time expressed in milliseconds
* @returns
*/
setScrubberPosition = async (timeInMS: number) => {
const res = await this.#editorAPI;
return res.setScrubberPosition(timeInMS).then((result) => getEditorResponseData<null>(result));
};
/**
* This method sets the total and maximum duration of the animation, expressed in milliseconds
* @param timeInMS the time expressed in milliseconds
* @returns
*/
setDuration = async (timeInMS: number) => {
const res = await this.#editorAPI;
return res.setAnimationDuration(timeInMS).then((result) => getEditorResponseData<null>(result));
};
/**
* This method resets the animation to its initial state
* @param id the id of a certain frame
* @returns
*/
resetFrameAnimation = async (id: Id) => {
const res = await this.#editorAPI;
return res.resetFrameAnimation(id).then((result) => getEditorResponseData<null>(result));
};
/**
* This method resets the layout's animations and animation duration to its initial state
* @returns
*/
reset = async () => {
const res = await this.#editorAPI;
return res.resetAnimation().then((result) => getEditorResponseData<null>(result));
};
}
|