@agrhub/engine-pixi 0.0.0-stage → 1.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +47 -0
- package/NOTICE.md +19 -0
- package/README.md +6 -2
- package/dist/animation/block-reveal-animation.d.ts +33 -0
- package/dist/animation/easings.d.ts +4 -0
- package/dist/animation/gsap-animation.d.ts +32 -0
- package/dist/animation/index.d.ts +9 -0
- package/dist/animation/keyframe-animation.d.ts +11 -0
- package/dist/animation/mask-animation.d.ts +145 -0
- package/dist/animation/pixi-animation-utils.d.ts +10 -0
- package/dist/animation/registry.d.ts +11 -0
- package/dist/animation/types.d.ts +205 -0
- package/dist/animation/wipe-animation.d.ts +53 -0
- package/dist/clips/audio-clip.d.ts +122 -0
- package/dist/clips/backdrop-clip.d.ts +56 -0
- package/dist/clips/base-clip.d.ts +150 -0
- package/dist/clips/base-text-clip.d.ts +228 -0
- package/dist/clips/caption-clip.d.ts +129 -0
- package/dist/clips/clip-registry.d.ts +56 -0
- package/dist/clips/effect-clip.d.ts +37 -0
- package/dist/clips/iclip.d.ts +231 -0
- package/dist/clips/image-clip.d.ts +116 -0
- package/dist/clips/index.d.ts +20 -0
- package/dist/clips/placeholder-clip.d.ts +22 -0
- package/dist/clips/shape-clip.d.ts +59 -0
- package/dist/clips/text-clip.d.ts +148 -0
- package/dist/clips/transition-clip.d.ts +41 -0
- package/dist/clips/video-clip.d.ts +215 -0
- package/dist/compositor/audio-mixer.d.ts +8 -0
- package/dist/compositor/av-encoder.d.ts +17 -0
- package/dist/compositor/clip-style-renderer.d.ts +23 -0
- package/dist/compositor/compositor-renderer.d.ts +29 -0
- package/dist/compositor/effect-manager.d.ts +28 -0
- package/dist/compositor/scheduler.d.ts +8 -0
- package/dist/compositor/transition-manager.d.ts +45 -0
- package/dist/compositor.d.ts +157 -0
- package/dist/effect/constant/index.d.ts +566 -0
- package/dist/effect/effect.d.ts +9 -0
- package/dist/effect/glsl/custom-glsl.d.ts +1043 -0
- package/dist/effect/glsl/gl-effect.d.ts +38 -0
- package/dist/effect/interface/index.d.ts +25 -0
- package/dist/effect/types.d.ts +26 -0
- package/dist/effect/vertex.d.ts +1 -0
- package/dist/event-emitter.d.ts +55 -0
- package/dist/filters/outline-filter.d.ts +28 -0
- package/dist/index.d.ts +27 -0
- package/dist/index.es.js +16038 -0
- package/dist/index.es.js.map +1 -0
- package/dist/index.umd.cjs +3335 -0
- package/dist/index.umd.cjs.map +1 -0
- package/dist/json-serialization.d.ts +310 -0
- package/dist/mp4-utils/index.d.ts +31 -0
- package/dist/mp4-utils/mp4box-utils.d.ts +44 -0
- package/dist/mp4-utils/sample-transform.d.ts +26 -0
- package/dist/sprite/base-sprite.d.ts +255 -0
- package/dist/sprite/pixi-sprite-renderer.d.ts +68 -0
- package/dist/standalone/index.es.js +94023 -0
- package/dist/standalone/index.es.js.map +1 -0
- package/dist/studio/history-manager.d.ts +46 -0
- package/dist/studio/resource-manager.d.ts +53 -0
- package/dist/studio/selection-manager.d.ts +66 -0
- package/dist/studio/timeline-model.d.ts +117 -0
- package/dist/studio/transport.d.ts +44 -0
- package/dist/studio-bridge.d.ts +50 -0
- package/dist/studio.d.ts +527 -0
- package/dist/transformer/handle.d.ts +17 -0
- package/dist/transformer/snapping.d.ts +45 -0
- package/dist/transformer/transformer.d.ts +38 -0
- package/dist/transformer/wireframe.d.ts +5 -0
- package/dist/transition/fragment.d.ts +1 -0
- package/dist/transition/glsl/custom-glsl.d.ts +231 -0
- package/dist/transition/glsl/gl-transition.d.ts +42 -0
- package/dist/transition/transition.d.ts +6 -0
- package/dist/transition/types.d.ts +29 -0
- package/dist/transition/uniforms.d.ts +35 -0
- package/dist/transition/vertex.d.ts +1 -0
- package/dist/utils/asset-manager.d.ts +15 -0
- package/dist/utils/audio-codec-detector.d.ts +39 -0
- package/dist/utils/audio.d.ts +81 -0
- package/dist/utils/chromakey.d.ts +24 -0
- package/dist/utils/color-adjustment.d.ts +53 -0
- package/dist/utils/color.d.ts +17 -0
- package/dist/utils/common.d.ts +7 -0
- package/dist/utils/dom.d.ts +48 -0
- package/dist/utils/effect.d.ts +1 -0
- package/dist/utils/fonts.d.ts +21 -0
- package/dist/utils/index.d.ts +6 -0
- package/dist/utils/log.d.ts +27 -0
- package/dist/utils/media-cache.d.ts +45 -0
- package/dist/utils/stream-utils.d.ts +4 -0
- package/dist/utils/video.d.ts +16 -0
- package/dist/utils/worker-timer.d.ts +1 -0
- package/package.json +63 -3
package/LICENSE
ADDED
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
# OpenVideo License
|
|
2
|
+
|
|
3
|
+
Depending on the type of your legal entity, you are granted permission to use OpenVideo for your project. Individuals and small companies are allowed to use OpenVideo for free (even commercially), while a company license is required for for-profit organizations of a certain size. This two-tier system was designed to ensure funding for this project while still allowing the source code to be available and the program to be free for most. Read below for the exact terms of use.
|
|
4
|
+
|
|
5
|
+
- [Free License](#free-license)
|
|
6
|
+
- [Company License](#company-license)
|
|
7
|
+
|
|
8
|
+
## Free License
|
|
9
|
+
|
|
10
|
+
Copyright © 2026 [OpenVideo](https://openvideo.dev)
|
|
11
|
+
|
|
12
|
+
### Eligibility
|
|
13
|
+
|
|
14
|
+
You are eligible to use OpenVideo for free if you are:
|
|
15
|
+
|
|
16
|
+
- an individual
|
|
17
|
+
- a for-profit organization with up to 3 employees
|
|
18
|
+
- a non-profit or not-for-profit organization
|
|
19
|
+
- evaluating whether OpenVideo is a good fit, and are not yet using it in a commercial way
|
|
20
|
+
|
|
21
|
+
### Allowed use cases
|
|
22
|
+
|
|
23
|
+
Permission is hereby granted, free of charge, to any person eligible for the "Free License", to use the software non-commercially or commercially for the purpose of creating videos and images and to modify the software to their own liking, for the purpose of fulfilling their custom use case or to contribute bug fixes or improvements back to OpenVideo.
|
|
24
|
+
|
|
25
|
+
This license applies to all packages, applications, and services within the OpenVideo monorepo.
|
|
26
|
+
|
|
27
|
+
### Disallowed use cases
|
|
28
|
+
|
|
29
|
+
It is not allowed to copy or modify OpenVideo code for the purpose of selling, renting, licensing, relicensing, or sublicensing your own derivative of OpenVideo.
|
|
30
|
+
|
|
31
|
+
### Warranty notice
|
|
32
|
+
|
|
33
|
+
The software is provided "as is", without warranty of any kind, express or implied, including but not limited to the warranties of merchantability, fitness for a particular purpose, and non-infringement. In no event shall the author or copyright holders be liable for any claim, damages or other liability, whether in an action of contract, tort or otherwise, arising from, out of or in connection with the software or the use or other dealings in the software.
|
|
34
|
+
|
|
35
|
+
### Support
|
|
36
|
+
|
|
37
|
+
Support is provided on a best-we-can-do basis via GitHub Issues and Discord.
|
|
38
|
+
|
|
39
|
+
## Company License
|
|
40
|
+
|
|
41
|
+
You are required to obtain a Company License to use OpenVideo if you are not within the group of entities eligible for a Free License. This license will enable you to use OpenVideo for the allowed use cases specified in the Free License.
|
|
42
|
+
|
|
43
|
+
Contact hello@openvideo.dev for pricing and to buy a license.
|
|
44
|
+
|
|
45
|
+
### FAQs
|
|
46
|
+
|
|
47
|
+
Are you not sure whether you need a Company License because of an edge case? Contact hello@openvideo.dev with your situation.
|
package/NOTICE.md
ADDED
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
# Notice
|
|
2
|
+
|
|
3
|
+
`@agrhub/engine-pixi` is a modified fork of [`@openvideo/engine-pixi`](https://www.npmjs.com/package/@openvideo/engine-pixi) (based on 1.3.2),
|
|
4
|
+
part of OpenVideo by OpenVideoDev (https://openvideo.dev).
|
|
5
|
+
|
|
6
|
+
It is distributed under the **OpenVideo License** — see [LICENSE](./LICENSE). That license applies to
|
|
7
|
+
this fork as well: in particular, organisations that are not eligible for the Free License need an
|
|
8
|
+
OpenVideo Company License, and the code may not be copied or modified to sell, rent, license,
|
|
9
|
+
relicense or sublicense a derivative of OpenVideo.
|
|
10
|
+
|
|
11
|
+
## Changes in this fork
|
|
12
|
+
|
|
13
|
+
- Renamed to @agrhub/engine-pixi; source rebuilt from OpenVideo 1.3.0 with the 1.3.2 changes ported (Backdrop clip, BlockRevealAnimation, text/caption layout, effect and bridge fixes).
|
|
14
|
+
- Dependencies are external (single PixiJS/@agrhub/core instance in the app); a self-contained build is published at "@agrhub/engine-pixi/standalone".
|
|
15
|
+
- Video: the first decodable frame is held before its timestamp (no black frames at clip start); stale overlapping updateFrame calls no longer hide frames.
|
|
16
|
+
- Captions/Text: glyph atlases are not cached before the web font loads; refreshes resolve after the final pass; track/clip styles (background, lineHeight, letterSpacing, textCase) are applied.
|
|
17
|
+
- Shared MediaCache: one download per URL (in-flight dedupe + memory LRU + atomic OPFS persistence).
|
|
18
|
+
- StudioBridge: patches applied in order, rebuilds coalesced, latest-wins seeking, listener-safe dispose.
|
|
19
|
+
- Export: falls back to an encodable audio codec (AAC -> 44.1 kHz -> Opus) instead of failing; long audio decodes no longer abort the export.
|
package/README.md
CHANGED
|
@@ -1,3 +1,7 @@
|
|
|
1
|
-
#
|
|
1
|
+
# @agrhub/engine-pixi
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Fork of `@openvideo/engine-pixi` for the AgrHub video editor. See [NOTICE.md](./NOTICE.md) for the changes and licensing.
|
|
4
|
+
|
|
5
|
+
```bash
|
|
6
|
+
npm install @agrhub/engine-pixi
|
|
7
|
+
```
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { AnimationOptions, AnimationTransform, IAnimation } from './types';
|
|
2
|
+
export type BlockRevealDirection = "left" | "right" | "top" | "bottom";
|
|
3
|
+
/**
|
|
4
|
+
* "reveal": a solid block grows across the text, then retracts the other way, uncovering it.
|
|
5
|
+
* Any other mode: a block of `blockSize` sweeps across the text.
|
|
6
|
+
*/
|
|
7
|
+
export type BlockRevealMode = "reveal" | "sweep";
|
|
8
|
+
export interface BlockRevealParams {
|
|
9
|
+
/** Block colour (default white) */
|
|
10
|
+
blockColor?: string | number;
|
|
11
|
+
/** Colour of the text where the block covers it (default black) */
|
|
12
|
+
textColorInside?: string | number;
|
|
13
|
+
direction?: BlockRevealDirection;
|
|
14
|
+
mode?: BlockRevealMode;
|
|
15
|
+
/** Sweep mode: block size as a fraction of the line (default 0.3) */
|
|
16
|
+
blockSize?: number;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* BlockRevealAnimation (text/caption clips)
|
|
20
|
+
*
|
|
21
|
+
* A coloured block wipes across each text line; where it covers the text, the text is drawn in
|
|
22
|
+
* `textColorInside`. Draws directly on the clip's text container in apply().
|
|
23
|
+
*/
|
|
24
|
+
export declare class BlockRevealAnimation implements IAnimation {
|
|
25
|
+
readonly id: string;
|
|
26
|
+
readonly type = "blockReveal";
|
|
27
|
+
readonly options: Required<AnimationOptions>;
|
|
28
|
+
readonly params: BlockRevealParams;
|
|
29
|
+
constructor(params: BlockRevealParams, options: AnimationOptions);
|
|
30
|
+
getTransform(_time: number): AnimationTransform;
|
|
31
|
+
apply(target: any, time: number): void;
|
|
32
|
+
cleanup(target: any): void;
|
|
33
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { EasingFunction } from './types';
|
|
2
|
+
export declare const easings: Record<string, EasingFunction>;
|
|
3
|
+
export declare function createSlowMo(linearRatio?: number, power?: number, yoyoMode?: boolean): EasingFunction;
|
|
4
|
+
export declare function getEasing(easing: string | EasingFunction | undefined): EasingFunction;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { AnimationOptions, AnimationTransform, IAnimation } from './types';
|
|
2
|
+
export interface GsapAnimationParams {
|
|
3
|
+
/**
|
|
4
|
+
* Animation presets or custom GSAP vars
|
|
5
|
+
*/
|
|
6
|
+
type: "character" | "word" | "line";
|
|
7
|
+
from: gsap.TweenVars;
|
|
8
|
+
to: gsap.TweenVars;
|
|
9
|
+
stagger?: number | gsap.StaggerVars;
|
|
10
|
+
}
|
|
11
|
+
export declare class GsapAnimation implements IAnimation {
|
|
12
|
+
readonly id: string;
|
|
13
|
+
readonly type: string;
|
|
14
|
+
readonly options: Required<AnimationOptions>;
|
|
15
|
+
readonly params: GsapAnimationParams;
|
|
16
|
+
private timeline;
|
|
17
|
+
private lastTarget;
|
|
18
|
+
private originalProperties;
|
|
19
|
+
constructor(params: GsapAnimationParams, options: AnimationOptions, type?: string);
|
|
20
|
+
getTransform(_time: number): AnimationTransform;
|
|
21
|
+
get isOutAnimation(): boolean;
|
|
22
|
+
restoreOriginals(): void;
|
|
23
|
+
getTargetCount(target: any): number;
|
|
24
|
+
apply(target: any, time: number): void;
|
|
25
|
+
/**
|
|
26
|
+
* Get current animation targets from the container based on animation type.
|
|
27
|
+
* Used to compare against GSAP's cached targets to detect when children are recreated.
|
|
28
|
+
*/
|
|
29
|
+
private getCurrentTargets;
|
|
30
|
+
private initTimeline;
|
|
31
|
+
destroy(): void;
|
|
32
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export * from './types';
|
|
2
|
+
export * from './easings';
|
|
3
|
+
export * from './registry';
|
|
4
|
+
export * from './keyframe-animation';
|
|
5
|
+
export * from './wipe-animation';
|
|
6
|
+
export * from './block-reveal-animation';
|
|
7
|
+
export * from './mask-animation';
|
|
8
|
+
export * from './gsap-animation';
|
|
9
|
+
export * from './pixi-animation-utils';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { AnimationOptions, AnimationTransform, IAnimation, KeyframeData } from './types';
|
|
2
|
+
export declare class KeyframeAnimation implements IAnimation {
|
|
3
|
+
readonly id: string;
|
|
4
|
+
readonly type: string;
|
|
5
|
+
readonly options: Required<AnimationOptions>;
|
|
6
|
+
readonly params: any;
|
|
7
|
+
private frames;
|
|
8
|
+
constructor(data: KeyframeData | any[], options: AnimationOptions, type?: string);
|
|
9
|
+
getTransform(time: number): AnimationTransform;
|
|
10
|
+
private interpolateProps;
|
|
11
|
+
}
|
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
import { AnimationOptions, AnimationTransform, IAnimation, MaskTransform } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Base class for all mask animations.
|
|
4
|
+
* Subclasses override `buildMask(progress)` to define the mask shape.
|
|
5
|
+
*/
|
|
6
|
+
declare abstract class BaseMaskAnimation implements IAnimation {
|
|
7
|
+
readonly id: string;
|
|
8
|
+
abstract readonly type: string;
|
|
9
|
+
readonly options: Required<AnimationOptions>;
|
|
10
|
+
readonly params: any;
|
|
11
|
+
constructor(params: any, options: AnimationOptions);
|
|
12
|
+
getTransform(time: number): AnimationTransform;
|
|
13
|
+
protected abstract buildMask(progress: number): MaskTransform;
|
|
14
|
+
}
|
|
15
|
+
export interface CircleRevealParams {
|
|
16
|
+
mode?: "reveal" | "conceal";
|
|
17
|
+
/** Origin of expansion. Default: "center" */
|
|
18
|
+
origin?: MaskTransform["origin"];
|
|
19
|
+
/** Feather (soft edge) in pixels */
|
|
20
|
+
feather?: number;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* CircleReveal / CircleConceal
|
|
24
|
+
*
|
|
25
|
+
* An ellipse mask that expands from an origin point outward (or contracts inward).
|
|
26
|
+
* Works on any clip type.
|
|
27
|
+
*
|
|
28
|
+
* ```ts
|
|
29
|
+
* clip.addAnimation("circleReveal", { duration: 1_000_000, easing: "easeOutCubic" }, {
|
|
30
|
+
* mode: "reveal",
|
|
31
|
+
* origin: "center",
|
|
32
|
+
* feather: 10,
|
|
33
|
+
* });
|
|
34
|
+
* ```
|
|
35
|
+
*/
|
|
36
|
+
export declare class CircleRevealAnimation extends BaseMaskAnimation {
|
|
37
|
+
readonly type = "circleReveal";
|
|
38
|
+
constructor(params: CircleRevealParams, options: AnimationOptions);
|
|
39
|
+
protected buildMask(progress: number): MaskTransform;
|
|
40
|
+
}
|
|
41
|
+
export interface RectExpandParams {
|
|
42
|
+
mode?: "reveal" | "conceal";
|
|
43
|
+
/** Origin of expansion. Default: "center" */
|
|
44
|
+
origin?: MaskTransform["origin"];
|
|
45
|
+
/** Feather in pixels */
|
|
46
|
+
feather?: number;
|
|
47
|
+
}
|
|
48
|
+
/**
|
|
49
|
+
* RectExpand / RectShrink
|
|
50
|
+
*
|
|
51
|
+
* A rectangle mask that grows outward from an origin (or shrinks inward).
|
|
52
|
+
* Useful for "iris box" style reveals.
|
|
53
|
+
*
|
|
54
|
+
* ```ts
|
|
55
|
+
* clip.addAnimation("rectExpand", { duration: 1_000_000, easing: "easeInOutQuad" }, {
|
|
56
|
+
* mode: "reveal",
|
|
57
|
+
* origin: "center",
|
|
58
|
+
* });
|
|
59
|
+
* ```
|
|
60
|
+
*/
|
|
61
|
+
export declare class RectExpandAnimation extends BaseMaskAnimation {
|
|
62
|
+
readonly type = "rectExpand";
|
|
63
|
+
constructor(params: RectExpandParams, options: AnimationOptions);
|
|
64
|
+
protected buildMask(progress: number): MaskTransform;
|
|
65
|
+
}
|
|
66
|
+
export interface CenterExpandParams {
|
|
67
|
+
mode?: "reveal" | "conceal";
|
|
68
|
+
/**
|
|
69
|
+
* Axis of expansion:
|
|
70
|
+
* "vertical" → starts full-width, expands top + bottom (default)
|
|
71
|
+
* "horizontal" → starts full-height, expands left + right
|
|
72
|
+
* "both" → expands in all directions simultaneously (true center iris)
|
|
73
|
+
*/
|
|
74
|
+
axis?: "vertical" | "horizontal" | "both";
|
|
75
|
+
}
|
|
76
|
+
/**
|
|
77
|
+
* CenterExpand
|
|
78
|
+
*
|
|
79
|
+
* Reveals the clip from the center outward.
|
|
80
|
+
* Default: starts as a full-width zero-height bar, expands up and down.
|
|
81
|
+
*
|
|
82
|
+
* ```ts
|
|
83
|
+
* clip.addAnimation("centerExpand", { duration: 1_000_000, easing: "easeOutCubic" }, {
|
|
84
|
+
* mode: "reveal",
|
|
85
|
+
* axis: "vertical",
|
|
86
|
+
* });
|
|
87
|
+
* ```
|
|
88
|
+
*/
|
|
89
|
+
export declare class CenterExpandAnimation extends BaseMaskAnimation {
|
|
90
|
+
readonly type = "centerExpand";
|
|
91
|
+
constructor(params: CenterExpandParams, options: AnimationOptions);
|
|
92
|
+
protected buildMask(progress: number): MaskTransform;
|
|
93
|
+
}
|
|
94
|
+
export interface AngleWipeParams {
|
|
95
|
+
mode?: "reveal" | "conceal";
|
|
96
|
+
/** Wipe angle in degrees. 0 = left→right, 90 = top→bottom, 45 = diagonal */
|
|
97
|
+
angle?: number;
|
|
98
|
+
/** Feather in pixels */
|
|
99
|
+
feather?: number;
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* AngleWipe
|
|
103
|
+
*
|
|
104
|
+
* A wipe that sweeps at an arbitrary angle (diagonal, rotated, etc.).
|
|
105
|
+
* The `angle` param rotates the sweep direction from the default left→right.
|
|
106
|
+
*
|
|
107
|
+
* ```ts
|
|
108
|
+
* clip.addAnimation("angleWipe", { duration: 1_000_000, easing: "linear" }, {
|
|
109
|
+
* mode: "reveal",
|
|
110
|
+
* angle: 45, // diagonal
|
|
111
|
+
* });
|
|
112
|
+
* ```
|
|
113
|
+
*/
|
|
114
|
+
export declare class AngleWipeAnimation extends BaseMaskAnimation {
|
|
115
|
+
readonly type = "angleWipe";
|
|
116
|
+
constructor(params: AngleWipeParams, options: AnimationOptions);
|
|
117
|
+
protected buildMask(progress: number): MaskTransform;
|
|
118
|
+
}
|
|
119
|
+
export interface StarRevealParams {
|
|
120
|
+
mode?: "reveal" | "conceal";
|
|
121
|
+
/** Number of star points. Default: 5 */
|
|
122
|
+
points?: number;
|
|
123
|
+
/** Inner radius ratio relative to outer (0–1). Default: 0.4 */
|
|
124
|
+
innerRatio?: number;
|
|
125
|
+
}
|
|
126
|
+
/**
|
|
127
|
+
* StarReveal
|
|
128
|
+
*
|
|
129
|
+
* Reveals the clip through a star-shaped mask that grows from the center.
|
|
130
|
+
* Demonstrates the custom `painter` pattern — no renderer changes needed.
|
|
131
|
+
*
|
|
132
|
+
* ```ts
|
|
133
|
+
* clip.addAnimation("starReveal", { duration: 1_000_000, easing: "easeOutBack" }, {
|
|
134
|
+
* mode: "reveal",
|
|
135
|
+
* points: 5,
|
|
136
|
+
* innerRatio: 0.4,
|
|
137
|
+
* });
|
|
138
|
+
* ```
|
|
139
|
+
*/
|
|
140
|
+
export declare class StarRevealAnimation extends BaseMaskAnimation {
|
|
141
|
+
readonly type = "starReveal";
|
|
142
|
+
constructor(params: StarRevealParams, options: AnimationOptions);
|
|
143
|
+
protected buildMask(progress: number): MaskTransform;
|
|
144
|
+
}
|
|
145
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export declare const pixiProps: string[];
|
|
2
|
+
export declare const hasPixiProp: (obj: any) => any;
|
|
3
|
+
export declare const prepareVars: (vars: any) => any;
|
|
4
|
+
export declare function resolveValue(val: any, baseVal: number): number;
|
|
5
|
+
export declare function resolveVars(from: any, to: any, baseSource: Record<string, any>, isOut: boolean): {
|
|
6
|
+
resolvedFrom: Record<string, any>;
|
|
7
|
+
resolvedTo: Record<string, any>;
|
|
8
|
+
};
|
|
9
|
+
export declare function getAnimatedKeys(from: any, to: any): string[];
|
|
10
|
+
export declare function getPixiProperty(t: any, key: string): number;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { AnimationOptions, IAnimation } from './types';
|
|
2
|
+
export type AnimationFactory = (options: AnimationOptions, params?: any) => IAnimation;
|
|
3
|
+
declare class AnimationRegistry {
|
|
4
|
+
private factories;
|
|
5
|
+
constructor();
|
|
6
|
+
register(name: string, factory: AnimationFactory): void;
|
|
7
|
+
create(name: string, options: AnimationOptions, params?: any): IAnimation;
|
|
8
|
+
has(name: string): boolean;
|
|
9
|
+
}
|
|
10
|
+
export declare const animationRegistry: AnimationRegistry;
|
|
11
|
+
export {};
|
|
@@ -0,0 +1,205 @@
|
|
|
1
|
+
export type EasingFunction = (t: number) => number;
|
|
2
|
+
export interface AnimationProps {
|
|
3
|
+
x?: number;
|
|
4
|
+
y?: number;
|
|
5
|
+
width?: number;
|
|
6
|
+
height?: number;
|
|
7
|
+
scale?: number;
|
|
8
|
+
scaleX?: number;
|
|
9
|
+
scaleY?: number;
|
|
10
|
+
opacity?: number;
|
|
11
|
+
angle?: number;
|
|
12
|
+
blur?: number;
|
|
13
|
+
brightness?: number;
|
|
14
|
+
mirror?: number;
|
|
15
|
+
motionBlur?: number;
|
|
16
|
+
}
|
|
17
|
+
export interface AnimationOptions {
|
|
18
|
+
duration: number;
|
|
19
|
+
delay?: number;
|
|
20
|
+
easing?: string | EasingFunction;
|
|
21
|
+
iterCount?: number;
|
|
22
|
+
id?: string;
|
|
23
|
+
disableGlobalEasing?: boolean;
|
|
24
|
+
}
|
|
25
|
+
export interface IAnimation {
|
|
26
|
+
readonly id: string;
|
|
27
|
+
readonly type: string;
|
|
28
|
+
readonly options: Required<AnimationOptions>;
|
|
29
|
+
readonly params?: any;
|
|
30
|
+
/**
|
|
31
|
+
* Calculate offsets and multipliers for the given time
|
|
32
|
+
* @param time Relative time from the start of the clip in microseconds
|
|
33
|
+
* @returns Partial state containing offsets/multipliers
|
|
34
|
+
*/
|
|
35
|
+
getTransform(time: number): AnimationTransform;
|
|
36
|
+
/**
|
|
37
|
+
* Apply complex animations (like GSAP character animations) directly to a target
|
|
38
|
+
* @param target The target object (e.g., PixiJS Container)
|
|
39
|
+
* @param time Relative time in microseconds
|
|
40
|
+
*/
|
|
41
|
+
apply?(target: any, time: number): void;
|
|
42
|
+
}
|
|
43
|
+
export interface AnimationTransform {
|
|
44
|
+
x?: number;
|
|
45
|
+
y?: number;
|
|
46
|
+
width?: number;
|
|
47
|
+
height?: number;
|
|
48
|
+
scale?: number;
|
|
49
|
+
scaleX?: number;
|
|
50
|
+
scaleY?: number;
|
|
51
|
+
opacity?: number;
|
|
52
|
+
angle?: number;
|
|
53
|
+
blur?: number;
|
|
54
|
+
brightness?: number;
|
|
55
|
+
mirror?: number;
|
|
56
|
+
motionBlur?: number;
|
|
57
|
+
mask?: MaskTransform;
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* Custom mask painter function.
|
|
61
|
+
* Called by PixiSpriteRenderer when shape === "custom".
|
|
62
|
+
* Receives a cleared Graphics object; draw your shape into it using Pixi's
|
|
63
|
+
* Graphics API. Fill with white (0xffffff) — alpha determines mask opacity.
|
|
64
|
+
*
|
|
65
|
+
* @param g The cleared Graphics object to draw into
|
|
66
|
+
* @param width Clip's logical width in pixels
|
|
67
|
+
* @param height Clip's logical height in pixels
|
|
68
|
+
* @param progress Normalized reveal progress 0→1
|
|
69
|
+
*/
|
|
70
|
+
export type MaskPainter = (g: {
|
|
71
|
+
rect: any;
|
|
72
|
+
circle: any;
|
|
73
|
+
ellipse: any;
|
|
74
|
+
fill: any;
|
|
75
|
+
poly: any;
|
|
76
|
+
[key: string]: any;
|
|
77
|
+
}, width: number, height: number, progress: number) => void;
|
|
78
|
+
export interface MaskTransform {
|
|
79
|
+
/** Mask shape. Use "custom" and provide a `painter` for arbitrary paths. */
|
|
80
|
+
shape: "rect" | "circle" | "ellipse" | "custom";
|
|
81
|
+
/**
|
|
82
|
+
* Normalized progress 0–1 controlling how much of the clip is revealed.
|
|
83
|
+
* 0 = fully hidden, 1 = fully visible.
|
|
84
|
+
*/
|
|
85
|
+
progress: number;
|
|
86
|
+
/** For rect: which edge the wipe sweeps from. For circle/ellipse: ignored. */
|
|
87
|
+
direction?: "left" | "right" | "top" | "bottom";
|
|
88
|
+
/** For angled wipe: rotation of the mask edge in degrees (0 = vertical sweep) */
|
|
89
|
+
angle?: number;
|
|
90
|
+
/** Origin point for expand masks (circle/ellipse/rectExpand). Default: "center" */
|
|
91
|
+
origin?: "center" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight";
|
|
92
|
+
/** Soft edge width in pixels. 0 = hard edge. */
|
|
93
|
+
feather?: number;
|
|
94
|
+
/**
|
|
95
|
+
* Normalized starting size of the mask (0–1). Default: 0.
|
|
96
|
+
* e.g. 0.2 means the mask starts at 20% size and grows to 100%.
|
|
97
|
+
* The painter receives a `progress` value already remapped from
|
|
98
|
+
* initialProgress→1 so individual painters don't need to handle this.
|
|
99
|
+
*/
|
|
100
|
+
initialProgress?: number;
|
|
101
|
+
/**
|
|
102
|
+
* Custom painter for shape === "custom".
|
|
103
|
+
* Draw any path into the provided Graphics object.
|
|
104
|
+
* The renderer calls this instead of its built-in shape dispatch.
|
|
105
|
+
*/
|
|
106
|
+
painter?: MaskPainter;
|
|
107
|
+
}
|
|
108
|
+
export interface KeyframeData {
|
|
109
|
+
[key: string]: Partial<AnimationProps & {
|
|
110
|
+
easing?: string | EasingFunction;
|
|
111
|
+
}>;
|
|
112
|
+
}
|
|
113
|
+
export declare const ANIMATABLE_PROPERTIES: {
|
|
114
|
+
readonly x: {
|
|
115
|
+
readonly label: "X Position";
|
|
116
|
+
readonly min: -2000;
|
|
117
|
+
readonly max: 2000;
|
|
118
|
+
readonly step: 1;
|
|
119
|
+
readonly default: 0;
|
|
120
|
+
};
|
|
121
|
+
readonly y: {
|
|
122
|
+
readonly label: "Y Position";
|
|
123
|
+
readonly min: -2000;
|
|
124
|
+
readonly max: 2000;
|
|
125
|
+
readonly step: 1;
|
|
126
|
+
readonly default: 0;
|
|
127
|
+
};
|
|
128
|
+
readonly width: {
|
|
129
|
+
readonly label: "Width";
|
|
130
|
+
readonly min: -1000;
|
|
131
|
+
readonly max: 1000;
|
|
132
|
+
readonly step: 1;
|
|
133
|
+
readonly default: 0;
|
|
134
|
+
};
|
|
135
|
+
readonly height: {
|
|
136
|
+
readonly label: "Height";
|
|
137
|
+
readonly min: -1000;
|
|
138
|
+
readonly max: 1000;
|
|
139
|
+
readonly step: 1;
|
|
140
|
+
readonly default: 0;
|
|
141
|
+
};
|
|
142
|
+
readonly scale: {
|
|
143
|
+
readonly label: "Scale";
|
|
144
|
+
readonly min: 0;
|
|
145
|
+
readonly max: 3;
|
|
146
|
+
readonly step: 0.1;
|
|
147
|
+
readonly default: 1;
|
|
148
|
+
};
|
|
149
|
+
readonly scaleX: {
|
|
150
|
+
readonly label: "Scale X";
|
|
151
|
+
readonly min: 0;
|
|
152
|
+
readonly max: 3;
|
|
153
|
+
readonly step: 0.1;
|
|
154
|
+
readonly default: 1;
|
|
155
|
+
};
|
|
156
|
+
readonly scaleY: {
|
|
157
|
+
readonly label: "Scale Y";
|
|
158
|
+
readonly min: 0;
|
|
159
|
+
readonly max: 3;
|
|
160
|
+
readonly step: 0.1;
|
|
161
|
+
readonly default: 1;
|
|
162
|
+
};
|
|
163
|
+
readonly opacity: {
|
|
164
|
+
readonly label: "Opacity";
|
|
165
|
+
readonly min: 0;
|
|
166
|
+
readonly max: 1;
|
|
167
|
+
readonly step: 0.01;
|
|
168
|
+
readonly default: 1;
|
|
169
|
+
};
|
|
170
|
+
readonly angle: {
|
|
171
|
+
readonly label: "Rotation";
|
|
172
|
+
readonly min: -360;
|
|
173
|
+
readonly max: 360;
|
|
174
|
+
readonly step: 1;
|
|
175
|
+
readonly default: 0;
|
|
176
|
+
};
|
|
177
|
+
readonly blur: {
|
|
178
|
+
readonly label: "Blur";
|
|
179
|
+
readonly min: 0;
|
|
180
|
+
readonly max: 100;
|
|
181
|
+
readonly step: 1;
|
|
182
|
+
readonly default: 0;
|
|
183
|
+
};
|
|
184
|
+
readonly brightness: {
|
|
185
|
+
readonly label: "Brightness";
|
|
186
|
+
readonly min: 0;
|
|
187
|
+
readonly max: 5;
|
|
188
|
+
readonly step: 0.1;
|
|
189
|
+
readonly default: 1;
|
|
190
|
+
};
|
|
191
|
+
readonly mirror: {
|
|
192
|
+
readonly label: "Mirror";
|
|
193
|
+
readonly min: 0;
|
|
194
|
+
readonly max: 1;
|
|
195
|
+
readonly step: 1;
|
|
196
|
+
readonly default: 0;
|
|
197
|
+
};
|
|
198
|
+
readonly motionBlur: {
|
|
199
|
+
readonly label: "Motion Blur";
|
|
200
|
+
readonly min: 0;
|
|
201
|
+
readonly max: 500;
|
|
202
|
+
readonly step: 1;
|
|
203
|
+
readonly default: 0;
|
|
204
|
+
};
|
|
205
|
+
};
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { AnimationOptions, AnimationTransform, IAnimation } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Direction the wipe edge travels FROM:
|
|
4
|
+
* "left" → wipe sweeps left-to-right (mask grows from left)
|
|
5
|
+
* "right" → wipe sweeps right-to-left (mask grows from right)
|
|
6
|
+
* "top" → wipe sweeps top-to-bottom (mask grows from top)
|
|
7
|
+
* "bottom" → wipe sweeps bottom-to-top (mask grows from bottom)
|
|
8
|
+
*/
|
|
9
|
+
export type WipeDirection = "left" | "right" | "top" | "bottom";
|
|
10
|
+
/**
|
|
11
|
+
* "reveal" = wipe IN (mask expands, more of the clip becomes visible)
|
|
12
|
+
* "conceal"= wipe OUT (mask shrinks, clip disappears progressively)
|
|
13
|
+
*/
|
|
14
|
+
export type WipeMode = "reveal" | "conceal";
|
|
15
|
+
export interface WipeAnimationParams {
|
|
16
|
+
direction: WipeDirection;
|
|
17
|
+
mode: WipeMode;
|
|
18
|
+
/** Optional angle offset for diagonal wipes (degrees) */
|
|
19
|
+
angle?: number;
|
|
20
|
+
/** Soft edge feather width in pixels. 0 = hard edge. */
|
|
21
|
+
feather?: number;
|
|
22
|
+
/** Starting mask size 0–1. Default: 0 (starts from nothing). */
|
|
23
|
+
initialProgress?: number;
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* WipeAnimation
|
|
27
|
+
*
|
|
28
|
+
* Rectangular edge-sweep mask animation. Emits a MaskTransform via
|
|
29
|
+
* getTransform() so it composes cleanly with other animations.
|
|
30
|
+
* The actual mask drawing is handled by PixiSpriteRenderer's unified
|
|
31
|
+
* mask compositor, which reads renderTransform.mask each frame.
|
|
32
|
+
*
|
|
33
|
+
* Example (AI usage):
|
|
34
|
+
*
|
|
35
|
+
* ```ts
|
|
36
|
+
* clip.addAnimation("wipe", {
|
|
37
|
+
* duration: 1_000_000, // 1 second in microseconds
|
|
38
|
+
* easing: "easeInOutCubic",
|
|
39
|
+
* }, {
|
|
40
|
+
* direction: "left",
|
|
41
|
+
* mode: "reveal",
|
|
42
|
+
* feather: 0, // hard edge (default)
|
|
43
|
+
* });
|
|
44
|
+
* ```
|
|
45
|
+
*/
|
|
46
|
+
export declare class WipeAnimation implements IAnimation {
|
|
47
|
+
readonly id: string;
|
|
48
|
+
readonly type = "wipe";
|
|
49
|
+
readonly options: Required<AnimationOptions>;
|
|
50
|
+
readonly params: WipeAnimationParams;
|
|
51
|
+
constructor(params: WipeAnimationParams, options: AnimationOptions);
|
|
52
|
+
getTransform(time: number): AnimationTransform;
|
|
53
|
+
}
|