/** * Animate Sprite {@link https://github.com/its2easy/animate-sprite/} * @example * let sprite = new AnimateSprite( document.getElementById('sprite'), { * width: 720, * height: 405, * frames: 20, * cols: 5, * fps: 60, * }); */ declare class AnimateSprite { /** * Creates plugin instance * @param {Element|HTMLElement} node - HTML element * @param {PluginOptions} options */ constructor(node: Element | HTMLElement, options: PluginOptions); /** * Start animation * @returns {AnimateSprite} - plugin instance */ play(): AnimateSprite; /** * Stop animation * @returns {AnimateSprite} - plugin instance */ stop(): AnimateSprite; /** * Toggle between start and stop * @returns {AnimateSprite} - plugin instance */ toggle(): AnimateSprite; /** * Show the next frame * @returns {AnimateSprite} - plugin instance */ next(): AnimateSprite; /** * Show the previous frame * @returns {AnimateSprite} - plugin instance */ prev(): AnimateSprite; /** * Set frame (without animation) * @param {number} frameNumber - Number of the frame to show * @returns {AnimateSprite} - plugin instance */ setFrame(frameNumber: number): AnimateSprite; /** * Starts the animation, that plays until the specified frame number * @param {number} frameNumber - Target frame number * @param {Object} [options] - Options * @param {boolean} [options.shortestPath=false] - If set to true and loop enabled, will use the shortest path * @returns {AnimateSprite} - plugin instance */ playTo(frameNumber: number, options?: { shortestPath?: boolean; }): AnimateSprite; /** * Starts the animation in the current direction with the specified number of frames in queue * @param {number} [numberOfFrames=0] - Number of frames to play * @returns {AnimateSprite} - plugin instance */ playFrames(numberOfFrames?: number): AnimateSprite; /** * Change the direction of the animation. Alias to setOption('reverse', true) * @param {boolean} [reverse=true] True for backward animation, false for forward * @returns {AnimateSprite} - plugin instance */ setReverse(reverse?: boolean): AnimateSprite; /** Get current reverse option. Alias to getOption('reverse') * @returns {boolean} - reverse or not */ getReverse(): boolean; /** * Calculate new dimensions (sprite element and frame), this function should be called if element size was changed by a script. * Called automatically after page resize * @returns {AnimateSprite} - plugin instance */ updateSizes(): AnimateSprite; /** * Returns option value * @param {string} option - Option name. All options are allowed. * @returns {*} - Option value */ getOption(option: string): any; /** * Set new option value * @param {string} option - Option name. All options are allowed. * @param {*} value - new value * @returns {AnimateSprite} - plugin instance */ setOption(option: string, value: any): AnimateSprite; /** @returns {number} - current frame number */ getCurrentFrame(): number; /** @returns {boolean} - animating or not */ isAnimating(): boolean; /** * Stop the animation and return to the first frame * @returns @returns {AnimateSprite} - plugin instance */ reset(): AnimateSprite; /** * Stop animation, remove event listeners. Method doesn't remove sprite element from the DOM */ destroy(): void; #private; } type PluginOptions = { /** * - Width of one frame in sprite */ width: number; /** * - Height of one frame in sprite */ height: number; /** * - Number of frames */ frames: number; /** * - Number of cols if more than 1 row */ cols?: number | false; /** * - Whether to loop the animation */ loop?: boolean; /** * - Autoplay */ autoplay?: boolean; /** * - ms, time between frames */ frameTime?: number | false; /** * - ms, total time, alternative to frameTime */ duration?: number | false; /** * - fps, alternative to frameTime */ fps?: number | false; /** * - Reverse direction of animation */ reverse?: boolean; /** * - Draggable by mouse or touch */ draggable?: number | boolean; /** * - Inversion changes drag direction */ inversion?: boolean; /** * - Sensitivity factor for user interaction. Only positive numbers are allowed */ dragModifier?: number; /** * - Page scroll behavior with touch events (preventPageScroll,allowPageScroll, pageScrollTimer) */ touchScrollMode?: 'pageScrollTimer' | 'preventPageScroll' | 'allowPageScroll'; /** * - Time in ms when touch scroll will be disabled during interaction * if options.touchScrollMode = "pageScrollTimer" */ pageScrollTimerDelay?: number; /** * - Occurs when animation has ended */ onAnimationEnd?: (arg0: AnimateSprite) => void; /** * - Occurs after the frame has switched */ onAfterFrameChange?: (arg0: AnimateSprite) => void; }; export { AnimateSprite as default };