@omnimedia/omnitool 1.1.0-4 → 1.1.0-5

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@omnimedia/omnitool",
-	"version": "1.1.0-4",
+	"version": "1.1.0-5",
 	"description": "open source video processing tools",
 	"license": "MIT",
 	"author": "Przemysław Gałęzki",
@@ -37,6 +37,7 @@
 		"@e280/stz": "^0.0.0-34",
 		"@huggingface/transformers": "^3.7.1",
 		"comrade": "^0.0.3",
+		"gl-transitions": "^1.43.0",
 		"mediabunny": "^1.4.4",
 		"mp4-muxer": "^5.2.1",
 		"pixi.js": "^8.10.1",

package/s/demo/routines/transitions-test.ts

@@ -0,0 +1,43 @@
+import {Application, Sprite} from "pixi.js"
+
+import {Driver} from "../../driver/driver.js"
+import {DecoderSource} from "../../driver/fns/schematic.js"
+import {makeTransition} from "../../features/transition/transition.js"
+
+export async function setupTransitionsTest(driver: Driver, source: DecoderSource) {
+	const app = new Application()
+	await app.init({width: 300, height: 300, preference: "webgl"})
+	const sprite = new Sprite({width: 300, height: 300})
+
+	app.stage.addChild(sprite)
+
+	document.body.appendChild(app.canvas)
+	const transition = makeTransition({name: "circle", renderer: app.renderer})
+
+	async function run() {
+		const readables = driver.decode({
+			source,
+			async onFrame(frame) {
+				const texture = transition.render({
+					from: frame,
+					to: frame,
+					progress: 0.7,
+					width: app.canvas.width,
+					height: app.canvas.height
+				})
+				sprite.texture = texture
+				return frame
+			}
+		})
+
+		await driver.encode({
+			readables,
+			config: {
+				audio: {codec: "opus", bitrate: 128000},
+				video: {codec: "vp9", bitrate: 1000000}
+			}
+		})
+	}
+
+	return {run}
+}

package/s/features/transition/parts/fragment.ts

@@ -0,0 +1,24 @@
+export const fragment = (glsl: string) => `
+	precision highp float;
+	varying vec2 vTextureCoord;
+	varying vec2 _uv;
+	uniform sampler2D from, to;
+	uniform float progress, ratio, _fromR, _toR;
+	uniform float customUniform;
+
+	vec4 getFromColor(vec2 uv){
+		return texture2D(from, .5+(uv-.5)*vec2(max(ratio/_fromR,1.), max(_fromR/ratio,1.)));
+	}
+	vec4 getToColor(vec2 uv){
+		return texture2D(to, .5+(uv-.5)*vec2(max(ratio/_toR,1.), max(_toR/ratio,1.)));
+	}
+
+	// gl-transition code here
+	${glsl}
+	// gl-transition code end
+
+	void main(){
+		vec2 uv = vTextureCoord.xy;
+		gl_FragColor = transition(vTextureCoord);
+	}
+`

package/s/features/transition/parts/types.ts

@@ -0,0 +1,94 @@
+import {Renderer} from "pixi.js"
+
+export interface TransitionOptions {
+	name: Transition
+	renderer: Renderer
+}
+
+export interface TransitionRendererOptions {
+	from: VideoFrame
+	to: VideoFrame
+	progress: number
+	width: number
+	height: number
+}
+
+export interface GLTransition {
+	author: string
+	createdAt: string
+	glsl: string
+	license: string
+	name: Transition
+	updatedAt: string
+	defaultParams: any
+	paramsTypes: any
+}
+
+export type Transition =
+  | "Bounce"
+  | "BowTieHorizontal"
+  | "BowTieVertical"
+  | "ButterflyWaveScrawler"
+  | "CircleCrop"
+  | "ColourDistance"
+  | "CrazyParametricFun"
+  | "CrossZoom"
+  | "Directional"
+  | "DoomScreenTransition"
+  | "Dreamy"
+  | "DreamyZoom"
+  | "GlitchDisplace"
+  | "GlitchMemories"
+  | "GridFlip"
+  | "InvertedPageCurl"
+  | "LinearBlur"
+  | "Mosaic"
+  | "PolkaDotsCurtain"
+  | "Radial"
+  | "SimpleZoom"
+  | "StereoViewer"
+  | "Swirl"
+  | "WaterDrop"
+  | "ZoomInCircles"
+  | "angular"
+  | "burn"
+  | "cannabisleaf"
+  | "circle"
+  | "circleopen"
+  | "colorphase"
+  | "crosshatch"
+  | "crosswarp"
+  | "cube"
+  | "directionalwarp"
+  | "directionalwipe"
+  | "displacement"
+  | "doorway"
+  | "fade"
+  | "fadecolor"
+  | "fadegrayscale"
+  | "flyeye"
+  | "heart"
+  | "hexagonalize"
+  | "kaleidoscope"
+  | "luma"
+  | "luminance_melt"
+  | "morph"
+  | "multiply_blend"
+  | "perlin"
+  | "pinwheel"
+  | "pixelize"
+  | "polar_function"
+  | "randomsquares"
+  | "ripple"
+  | "rotate_scale_fade"
+  | "squareswire"
+  | "squeeze"
+  | "swap"
+  | "undulatingBurnOut"
+  | "wind"
+  | "windowblinds"
+  | "windowslice"
+  | "wipeDown"
+  | "wipeLeft"
+  | "wipeRight"
+  | "wipeUp"

package/s/features/transition/parts/uniforms.ts

@@ -0,0 +1,29 @@
+import {GLTransition} from "./types.js"
+
+export const uniforms = {
+	custom: (transition: GLTransition) => Object.fromEntries(
+		Object.entries(transition.defaultParams).map(([name, value]) => [
+			name,
+			{
+				value,
+				type: getUniformType(transition.paramsTypes[name])
+			}
+		])
+	),
+	basics: {
+		_fromR: {value: 1, type: "f32"},
+		_toR: {value: 1, type: "f32"},
+		ratio: {value: 1, type: "f32"},
+		progress: {value: 0, type: "f32"},
+		customUniform: {value: 0, type: "f32"},
+	}
+}
+
+const getUniformType = (type: string) => {
+	if(type === "f32" || type === "i32") {
+		return type
+	} else if(type === "float") {
+		return "f32"
+	}
+	else return `${type}<f32>`
+}

package/s/features/transition/parts/vertex.ts

@@ -0,0 +1,31 @@
+export const vertex = `
+	in vec2 aPosition;
+	varying vec2 _uv;                          // gl-transition
+	uniform mat3 projectionMatrix;
+	uniform vec4 uInputSize;
+	uniform vec4 uOutputFrame;
+	out vec2 vTextureCoord;
+	uniform vec4 uOutputTexture;
+
+	vec4 filterVertexPosition( void )
+	{
+			vec2 position = aPosition * uOutputFrame.zw + uOutputFrame.xy;
+
+			position.x = position.x * (2.0 / uOutputTexture.x) - 1.0;
+			position.y = position.y * (2.0*uOutputTexture.z / uOutputTexture.y) - uOutputTexture.z;
+
+			return vec4(position, 0.0, 1.0);
+	}
+
+	vec2 filterTextureCoord( void )
+	{
+	return aPosition * (uOutputFrame.zw * uInputSize.zw);
+	}
+
+	void main(void)
+	{
+	gl_Position = filterVertexPosition();
+	vTextureCoord = filterTextureCoord();
+	_uv = vec2(0.5, 0.5) * (aPosition +vec2(1.0, 1.0));    // gl-transition
+	}
+`

package/s/features/transition/transition.ts

@@ -0,0 +1,60 @@
+//@ts-ignore
+import transitions from "gl-transitions"
+import {Filter, GlProgram, Sprite, Texture, ImageSource} from "pixi.js"
+
+import {vertex} from "./parts/vertex.js"
+import {uniforms} from "./parts/uniforms.js"
+import {fragment} from "./parts/fragment.js"
+import {GLTransition, TransitionOptions, TransitionRendererOptions} from "./parts/types.js"
+
+export function makeTransition({name, renderer}: TransitionOptions) {
+	const transition = transitions.find((t: GLTransition) => t.name === name) as GLTransition
+	const transitionSprite = new Sprite()
+	const transitionTexture = new Texture()
+	const sourceFrom = new ImageSource({})
+	const sourceTo = new ImageSource({})
+
+	const filter = new Filter({
+		glProgram: new GlProgram({
+			vertex,
+			fragment: fragment(transition.glsl),
+		}),
+		resources: {
+			from: sourceFrom,
+			to: sourceTo,
+			uniforms: {
+				...uniforms.basics,
+				...uniforms.custom(transition)
+			}
+		}
+	})
+
+	transitionSprite.filters = [filter]
+
+	return {
+		render({width, height, from, to, progress}: TransitionRendererOptions) {
+			if(transitionSprite.width !== width || transitionSprite.height !== height) {
+				transitionSprite.setSize({width, height})
+				transitionTexture.source.resize(width, height)
+			}
+
+			sourceFrom.resource = from
+			sourceTo.resource = to
+			sourceFrom.update()
+			sourceTo.update()
+
+			filter.resources.uniforms.uniforms.progress = progress
+
+			renderer.render({
+				container: transitionSprite,
+				target: transitionTexture,
+				clear: false,
+				width,
+				height
+			})
+
+			return transitionTexture
+		}
+	}
+}
+

package/x/demo/routines/transitions-test.d.ts

@@ -0,0 +1,5 @@
+import { Driver } from "../../driver/driver.js";
+import { DecoderSource } from "../../driver/fns/schematic.js";
+export declare function setupTransitionsTest(driver: Driver, source: DecoderSource): Promise<{
+    run: () => Promise<void>;
+}>;

package/x/demo/routines/transitions-test.js

@@ -0,0 +1,35 @@
+import { Application, Sprite } from "pixi.js";
+import { makeTransition } from "../../features/transition/transition.js";
+export async function setupTransitionsTest(driver, source) {
+    const app = new Application();
+    await app.init({ width: 300, height: 300, preference: "webgl" });
+    const sprite = new Sprite({ width: 300, height: 300 });
+    app.stage.addChild(sprite);
+    document.body.appendChild(app.canvas);
+    const transition = makeTransition({ name: "circle", renderer: app.renderer });
+    async function run() {
+        const readables = driver.decode({
+            source,
+            async onFrame(frame) {
+                const texture = transition.render({
+                    from: frame,
+                    to: frame,
+                    progress: 0.7,
+                    width: app.canvas.width,
+                    height: app.canvas.height
+                });
+                sprite.texture = texture;
+                return frame;
+            }
+        });
+        await driver.encode({
+            readables,
+            config: {
+                audio: { codec: "opus", bitrate: 128000 },
+                video: { codec: "vp9", bitrate: 1000000 }
+            }
+        });
+    }
+    return { run };
+}
+//# sourceMappingURL=transitions-test.js.map

package/x/demo/routines/transitions-test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transitions-test.js","sourceRoot":"","sources":["../../../s/demo/routines/transitions-test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAE,MAAM,EAAC,MAAM,SAAS,CAAA;AAI3C,OAAO,EAAC,cAAc,EAAC,MAAM,yCAAyC,CAAA;AAEtE,MAAM,CAAC,KAAK,UAAU,oBAAoB,CAAC,MAAc,EAAE,MAAqB;IAC/E,MAAM,GAAG,GAAG,IAAI,WAAW,EAAE,CAAA;IAC7B,MAAM,GAAG,CAAC,IAAI,CAAC,EAAC,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,OAAO,EAAC,CAAC,CAAA;IAC9D,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC,EAAC,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAC,CAAC,CAAA;IAEpD,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAA;IAE1B,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;IACrC,MAAM,UAAU,GAAG,cAAc,CAAC,EAAC,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,CAAC,QAAQ,EAAC,CAAC,CAAA;IAE3E,KAAK,UAAU,GAAG;QACjB,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC;YAC/B,MAAM;YACN,KAAK,CAAC,OAAO,CAAC,KAAK;gBAClB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,CAAC;oBACjC,IAAI,EAAE,KAAK;oBACX,EAAE,EAAE,KAAK;oBACT,QAAQ,EAAE,GAAG;oBACb,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,KAAK;oBACvB,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,MAAM;iBACzB,CAAC,CAAA;gBACF,MAAM,CAAC,OAAO,GAAG,OAAO,CAAA;gBACxB,OAAO,KAAK,CAAA;YACb,CAAC;SACD,CAAC,CAAA;QAEF,MAAM,MAAM,CAAC,MAAM,CAAC;YACnB,SAAS;YACT,MAAM,EAAE;gBACP,KAAK,EAAE,EAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAC;gBACvC,KAAK,EAAE,EAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAC;aACvC;SACD,CAAC,CAAA;IACH,CAAC;IAED,OAAO,EAAC,GAAG,EAAC,CAAA;AACb,CAAC"}

package/x/features/transition/parts/fragment.d.ts

@@ -0,0 +1 @@
+export declare const fragment: (glsl: string) => string;

package/x/features/transition/parts/fragment.js

@@ -0,0 +1,25 @@
+export const fragment = (glsl) => `
+	precision highp float;
+	varying vec2 vTextureCoord;
+	varying vec2 _uv;
+	uniform sampler2D from, to;
+	uniform float progress, ratio, _fromR, _toR;
+	uniform float customUniform;
+
+	vec4 getFromColor(vec2 uv){
+		return texture2D(from, .5+(uv-.5)*vec2(max(ratio/_fromR,1.), max(_fromR/ratio,1.)));
+	}
+	vec4 getToColor(vec2 uv){
+		return texture2D(to, .5+(uv-.5)*vec2(max(ratio/_toR,1.), max(_toR/ratio,1.)));
+	}
+
+	// gl-transition code here
+	${glsl}
+	// gl-transition code end
+
+	void main(){
+		vec2 uv = vTextureCoord.xy;
+		gl_FragColor = transition(vTextureCoord);
+	}
+`;
+//# sourceMappingURL=fragment.js.map

package/x/features/transition/parts/fragment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fragment.js","sourceRoot":"","sources":["../../../../s/features/transition/parts/fragment.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,IAAY,EAAE,EAAE,CAAC;;;;;;;;;;;;;;;;GAgBvC,IAAI;;;;;;;CAON,CAAA"}

package/x/features/transition/parts/types.d.ts

@@ -0,0 +1,23 @@
+import { Renderer } from "pixi.js";
+export interface TransitionOptions {
+    name: Transition;
+    renderer: Renderer;
+}
+export interface TransitionRendererOptions {
+    from: VideoFrame;
+    to: VideoFrame;
+    progress: number;
+    width: number;
+    height: number;
+}
+export interface GLTransition {
+    author: string;
+    createdAt: string;
+    glsl: string;
+    license: string;
+    name: Transition;
+    updatedAt: string;
+    defaultParams: any;
+    paramsTypes: any;
+}
+export type Transition = "Bounce" | "BowTieHorizontal" | "BowTieVertical" | "ButterflyWaveScrawler" | "CircleCrop" | "ColourDistance" | "CrazyParametricFun" | "CrossZoom" | "Directional" | "DoomScreenTransition" | "Dreamy" | "DreamyZoom" | "GlitchDisplace" | "GlitchMemories" | "GridFlip" | "InvertedPageCurl" | "LinearBlur" | "Mosaic" | "PolkaDotsCurtain" | "Radial" | "SimpleZoom" | "StereoViewer" | "Swirl" | "WaterDrop" | "ZoomInCircles" | "angular" | "burn" | "cannabisleaf" | "circle" | "circleopen" | "colorphase" | "crosshatch" | "crosswarp" | "cube" | "directionalwarp" | "directionalwipe" | "displacement" | "doorway" | "fade" | "fadecolor" | "fadegrayscale" | "flyeye" | "heart" | "hexagonalize" | "kaleidoscope" | "luma" | "luminance_melt" | "morph" | "multiply_blend" | "perlin" | "pinwheel" | "pixelize" | "polar_function" | "randomsquares" | "ripple" | "rotate_scale_fade" | "squareswire" | "squeeze" | "swap" | "undulatingBurnOut" | "wind" | "windowblinds" | "windowslice" | "wipeDown" | "wipeLeft" | "wipeRight" | "wipeUp";

package/x/features/transition/parts/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/x/features/transition/parts/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../s/features/transition/parts/types.ts"],"names":[],"mappings":""}

package/x/features/transition/parts/uniforms.d.ts

@@ -0,0 +1,31 @@
+import { GLTransition } from "./types.js";
+export declare const uniforms: {
+    custom: (transition: GLTransition) => {
+        [k: string]: {
+            value: unknown;
+            type: string;
+        };
+    };
+    basics: {
+        _fromR: {
+            value: number;
+            type: string;
+        };
+        _toR: {
+            value: number;
+            type: string;
+        };
+        ratio: {
+            value: number;
+            type: string;
+        };
+        progress: {
+            value: number;
+            type: string;
+        };
+        customUniform: {
+            value: number;
+            type: string;
+        };
+    };
+};

package/x/features/transition/parts/uniforms.js

@@ -0,0 +1,27 @@
+export const uniforms = {
+    custom: (transition) => Object.fromEntries(Object.entries(transition.defaultParams).map(([name, value]) => [
+        name,
+        {
+            value,
+            type: getUniformType(transition.paramsTypes[name])
+        }
+    ])),
+    basics: {
+        _fromR: { value: 1, type: "f32" },
+        _toR: { value: 1, type: "f32" },
+        ratio: { value: 1, type: "f32" },
+        progress: { value: 0, type: "f32" },
+        customUniform: { value: 0, type: "f32" },
+    }
+};
+const getUniformType = (type) => {
+    if (type === "f32" || type === "i32") {
+        return type;
+    }
+    else if (type === "float") {
+        return "f32";
+    }
+    else
+        return `${type}<f32>`;
+};
+//# sourceMappingURL=uniforms.js.map

package/x/features/transition/parts/uniforms.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"uniforms.js","sourceRoot":"","sources":["../../../../s/features/transition/parts/uniforms.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,QAAQ,GAAG;IACvB,MAAM,EAAE,CAAC,UAAwB,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,CACvD,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC;QAC/D,IAAI;QACJ;YACC,KAAK;YACL,IAAI,EAAE,cAAc,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;SAClD;KACD,CAAC,CACF;IACD,MAAM,EAAE;QACP,MAAM,EAAE,EAAC,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAC;QAC/B,IAAI,EAAE,EAAC,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAC;QAC7B,KAAK,EAAE,EAAC,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAC;QAC9B,QAAQ,EAAE,EAAC,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAC;QACjC,aAAa,EAAE,EAAC,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAC;KACtC;CACD,CAAA;AAED,MAAM,cAAc,GAAG,CAAC,IAAY,EAAE,EAAE;IACvC,IAAG,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;QACrC,OAAO,IAAI,CAAA;IACZ,CAAC;SAAM,IAAG,IAAI,KAAK,OAAO,EAAE,CAAC;QAC5B,OAAO,KAAK,CAAA;IACb,CAAC;;QACI,OAAO,GAAG,IAAI,OAAO,CAAA;AAC3B,CAAC,CAAA"}

package/x/features/transition/parts/vertex.d.ts

@@ -0,0 +1 @@
+export declare const vertex = "\n\tin vec2 aPosition;\n\tvarying vec2 _uv;                          // gl-transition\n\tuniform mat3 projectionMatrix;\n\tuniform vec4 uInputSize;\n\tuniform vec4 uOutputFrame;\n\tout vec2 vTextureCoord;\n\tuniform vec4 uOutputTexture;\n\n\tvec4 filterVertexPosition( void )\n\t{\n\t\t\tvec2 position = aPosition * uOutputFrame.zw + uOutputFrame.xy;\n\n\t\t\tposition.x = position.x * (2.0 / uOutputTexture.x) - 1.0;\n\t\t\tposition.y = position.y * (2.0*uOutputTexture.z / uOutputTexture.y) - uOutputTexture.z;\n\n\t\t\treturn vec4(position, 0.0, 1.0);\n\t}\n\n\tvec2 filterTextureCoord( void )\n\t{\n\treturn aPosition * (uOutputFrame.zw * uInputSize.zw);\n\t}\n\n\tvoid main(void)\n\t{\n\tgl_Position = filterVertexPosition();\n\tvTextureCoord = filterTextureCoord();\n\t_uv = vec2(0.5, 0.5) * (aPosition +vec2(1.0, 1.0));    // gl-transition\n\t}\n";

package/x/features/transition/parts/vertex.js

@@ -0,0 +1,32 @@
+export const vertex = `
+	in vec2 aPosition;
+	varying vec2 _uv;                          // gl-transition
+	uniform mat3 projectionMatrix;
+	uniform vec4 uInputSize;
+	uniform vec4 uOutputFrame;
+	out vec2 vTextureCoord;
+	uniform vec4 uOutputTexture;
+
+	vec4 filterVertexPosition( void )
+	{
+			vec2 position = aPosition * uOutputFrame.zw + uOutputFrame.xy;
+
+			position.x = position.x * (2.0 / uOutputTexture.x) - 1.0;
+			position.y = position.y * (2.0*uOutputTexture.z / uOutputTexture.y) - uOutputTexture.z;
+
+			return vec4(position, 0.0, 1.0);
+	}
+
+	vec2 filterTextureCoord( void )
+	{
+	return aPosition * (uOutputFrame.zw * uInputSize.zw);
+	}
+
+	void main(void)
+	{
+	gl_Position = filterVertexPosition();
+	vTextureCoord = filterTextureCoord();
+	_uv = vec2(0.5, 0.5) * (aPosition +vec2(1.0, 1.0));    // gl-transition
+	}
+`;
+//# sourceMappingURL=vertex.js.map

package/x/features/transition/parts/vertex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vertex.js","sourceRoot":"","sources":["../../../../s/features/transition/parts/vertex.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BrB,CAAA"}

package/x/features/transition/transition.d.ts

@@ -0,0 +1,5 @@
+import { Texture } from "pixi.js";
+import { TransitionOptions, TransitionRendererOptions } from "./parts/types.js";
+export declare function makeTransition({ name, renderer }: TransitionOptions): {
+    render({ width, height, from, to, progress }: TransitionRendererOptions): Texture<import("pixi.js").TextureSource<any>>;
+};

package/x/features/transition/transition.js

@@ -0,0 +1,50 @@
+//@ts-ignore
+import transitions from "gl-transitions";
+import { Filter, GlProgram, Sprite, Texture, ImageSource } from "pixi.js";
+import { vertex } from "./parts/vertex.js";
+import { uniforms } from "./parts/uniforms.js";
+import { fragment } from "./parts/fragment.js";
+export function makeTransition({ name, renderer }) {
+    const transition = transitions.find((t) => t.name === name);
+    const transitionSprite = new Sprite();
+    const transitionTexture = new Texture();
+    const sourceFrom = new ImageSource({});
+    const sourceTo = new ImageSource({});
+    const filter = new Filter({
+        glProgram: new GlProgram({
+            vertex,
+            fragment: fragment(transition.glsl),
+        }),
+        resources: {
+            from: sourceFrom,
+            to: sourceTo,
+            uniforms: {
+                ...uniforms.basics,
+                ...uniforms.custom(transition)
+            }
+        }
+    });
+    transitionSprite.filters = [filter];
+    return {
+        render({ width, height, from, to, progress }) {
+            if (transitionSprite.width !== width || transitionSprite.height !== height) {
+                transitionSprite.setSize({ width, height });
+                transitionTexture.source.resize(width, height);
+            }
+            sourceFrom.resource = from;
+            sourceTo.resource = to;
+            sourceFrom.update();
+            sourceTo.update();
+            filter.resources.uniforms.uniforms.progress = progress;
+            renderer.render({
+                container: transitionSprite,
+                target: transitionTexture,
+                clear: false,
+                width,
+                height
+            });
+            return transitionTexture;
+        }
+    };
+}
+//# sourceMappingURL=transition.js.map

package/x/features/transition/transition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition.js","sourceRoot":"","sources":["../../../s/features/transition/transition.ts"],"names":[],"mappings":"AAAA,YAAY;AACZ,OAAO,WAAW,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAEvE,OAAO,EAAC,MAAM,EAAC,MAAM,mBAAmB,CAAA;AACxC,OAAO,EAAC,QAAQ,EAAC,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EAAC,QAAQ,EAAC,MAAM,qBAAqB,CAAA;AAG5C,MAAM,UAAU,cAAc,CAAC,EAAC,IAAI,EAAE,QAAQ,EAAoB;IACjE,MAAM,UAAU,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC,CAAe,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,IAAI,CAAiB,CAAA;IACzF,MAAM,gBAAgB,GAAG,IAAI,MAAM,EAAE,CAAA;IACrC,MAAM,iBAAiB,GAAG,IAAI,OAAO,EAAE,CAAA;IACvC,MAAM,UAAU,GAAG,IAAI,WAAW,CAAC,EAAE,CAAC,CAAA;IACtC,MAAM,QAAQ,GAAG,IAAI,WAAW,CAAC,EAAE,CAAC,CAAA;IAEpC,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;QACzB,SAAS,EAAE,IAAI,SAAS,CAAC;YACxB,MAAM;YACN,QAAQ,EAAE,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC;SACnC,CAAC;QACF,SAAS,EAAE;YACV,IAAI,EAAE,UAAU;YAChB,EAAE,EAAE,QAAQ;YACZ,QAAQ,EAAE;gBACT,GAAG,QAAQ,CAAC,MAAM;gBAClB,GAAG,QAAQ,CAAC,MAAM,CAAC,UAAU,CAAC;aAC9B;SACD;KACD,CAAC,CAAA;IAEF,gBAAgB,CAAC,OAAO,GAAG,CAAC,MAAM,CAAC,CAAA;IAEnC,OAAO;QACN,MAAM,CAAC,EAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAE,QAAQ,EAA4B;YACpE,IAAG,gBAAgB,CAAC,KAAK,KAAK,KAAK,IAAI,gBAAgB,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;gBAC3E,gBAAgB,CAAC,OAAO,CAAC,EAAC,KAAK,EAAE,MAAM,EAAC,CAAC,CAAA;gBACzC,iBAAiB,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;YAC/C,CAAC;YAED,UAAU,CAAC,QAAQ,GAAG,IAAI,CAAA;YAC1B,QAAQ,CAAC,QAAQ,GAAG,EAAE,CAAA;YACtB,UAAU,CAAC,MAAM,EAAE,CAAA;YACnB,QAAQ,CAAC,MAAM,EAAE,CAAA;YAEjB,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,GAAG,QAAQ,CAAA;YAEtD,QAAQ,CAAC,MAAM,CAAC;gBACf,SAAS,EAAE,gBAAgB;gBAC3B,MAAM,EAAE,iBAAiB;gBACzB,KAAK,EAAE,KAAK;gBACZ,KAAK;gBACL,MAAM;aACN,CAAC,CAAA;YAEF,OAAO,iBAAiB,CAAA;QACzB,CAAC;KACD,CAAA;AACF,CAAC"}

package/x/index.html

@@ -80,7 +80,7 @@ body {
 				<body>
 
 	<section>
-		<h1>Omnitool <small>v1.1.0-4</small></h1>
+		<h1>Omnitool <small>v1.1.0-5</small></h1>
 		<button class=fetch>fetch</button>
 		<button class="import">import</button>
 		<div class=results></div>