@omnimedia/omnitool 1.1.0-5 → 1.1.0-51

package/s/timeline/sugar/omni.test.ts

@@ -0,0 +1,210 @@
+
+import {expect, Science, test} from "@e280/science"
+
+import {O} from "./o.js"
+import {Omni} from "./omni.js"
+import {Item} from "../parts/item.js"
+import {Driver} from "../../driver/driver.js"
+import {Datafile} from "../utils/datafile.js"
+import {loadVideo} from "../../demo/routines/load-video.js"
+import {computeItemDuration} from "../renderers/parts/handy.js"
+
+const workerUrl = new URL("../driver/driver.worker.bundle.min.js", import.meta.url)
+export async function setupTest() {
+	const driver = await Driver.setup({workerUrl})
+	const omni = new Omni(driver)
+
+	const testVideo = await loadVideo("/assets/temp/test.mp4")
+	const {videoA} = await omni.load({videoA: Datafile.make(testVideo, "test.mp4")})
+
+	return {driver, omni, testVideo, videoA}
+}
+
+export default Science.suite({
+	"basic demo": test(async () => {
+		const driver = await Driver.setup({workerUrl: new URL("../driver/driver.worker.bundle.min.js", import.meta.url)})
+		const omni = new Omni(driver)
+
+		const testVideo = await loadVideo("/assets/temp/test.mp4")
+		const {videoA} = await omni.load({videoA: Datafile.make(testVideo, "test.mp4")})
+
+		const o = new O({timeline: omni.timeline(o => o.sequence())})
+		const rootItem = o.require<Item.Sequence>(o.timeline.rootId)!
+
+		const video = o.video(videoA)
+		o.addChildren(rootItem, video)
+
+		const videoDuration = computeItemDuration(video.id, o.timeline)
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+
+		expect(videoDuration).is(timelineDuration)
+	}),
+
+	"sequence duration is 3x": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.video(videoA),
+			o.video(videoA),
+			o.video(videoA),
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(videoA.duration * 3)
+	}),
+
+	"stack duration is 1x": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const o = new O({timeline: omni.timeline(o => o.stack(
+			o.video(videoA),
+			o.video(videoA),
+			o.video(videoA),
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(videoA.duration)
+	}),
+
+	"nested stack inside sequence": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.video(videoA),
+			o.stack(
+				o.video(videoA),
+				o.video(videoA)
+			),
+			o.video(videoA),
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(videoA.duration * 3)
+	}),
+
+	"nested sequence inside stack": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const o = new O({timeline: omni.timeline(o => o.stack(
+			o.video(videoA),
+			o.sequence(
+				o.video(videoA),
+				o.video(videoA)
+			)
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(videoA.duration * 2)
+	}),
+
+	"empty timeline duration is 0": test(async () => {
+		const {omni} = await setupTest()
+		const o1 = new O({timeline: omni.timeline(o => o.sequence())})
+		const o2 = new O({timeline: omni.timeline(o => o.stack())})
+		const duration1 = computeItemDuration(o1.timeline.rootId, o1.timeline)
+		const duration2 = computeItemDuration(o2.timeline.rootId, o2.timeline)
+		expect(duration1).is(0)
+		expect(duration2).is(0)
+	}),
+
+	"transition in a sequence": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const transitionDuration = 1000
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.video(videoA),
+			o.transition.crossfade(transitionDuration),
+			o.video(videoA)
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		const expectedDuration = (videoA.duration * 2) - transitionDuration
+		expect(timelineDuration).is(expectedDuration)
+	}),
+
+	"transition in a stack": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const transitionDuration = 1000
+		const o = new O({timeline: omni.timeline(o => o.stack(
+			o.video(videoA),
+			o.transition.crossfade(transitionDuration),
+			o.video(videoA)
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(videoA.duration)
+	}),
+
+	"ignore invalid transition": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.transition.crossfade(1000),
+			o.video(videoA),
+			o.video(videoA),
+			o.transition.crossfade(1000),
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(videoA.duration * 2)
+	}),
+
+	"clamp transition duration on overflow": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const duration = 3000
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.video(videoA, {duration}),
+			o.transition.crossfade(duration * 2),
+			o.video(videoA, {duration})
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(duration)
+	}),
+
+	"multiple transitions": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const transitionDuration = 1000
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.video(videoA),
+			o.transition.crossfade(transitionDuration),
+			o.video(videoA),
+			o.transition.crossfade(transitionDuration),
+			o.video(videoA)
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		const expected = (videoA.duration * 3) - (transitionDuration * 2)
+		expect(timelineDuration).is(expected)
+	}),
+
+	"gap item in a sequence": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const gapDuration = 1000
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.video(videoA),
+			o.gap(gapDuration),
+			o.video(videoA)
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		const expected = videoA.duration * 2 + gapDuration
+		expect(timelineDuration).is(expected)
+	}),
+
+	"gap item in a stack": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const o = new O({timeline: omni.timeline(o => o.stack(
+			o.video(videoA),
+			o.gap(1000),
+			o.video(videoA)
+		))})
+		const timelineDuration = computeItemDuration(o.timeline.rootId, o.timeline)
+		expect(timelineDuration).is(videoA.duration)
+	}),
+
+	"load media into Omni": test(async () => {
+		const driver = await Driver.setup({workerUrl})
+		const omni = new Omni(driver)
+		const testVideo = await loadVideo("/assets/temp/test.mp4")
+		const {videoA} = await omni.load({videoA: Datafile.make(testVideo, "test.mp4")})
+		expect(omni.resources.require(videoA.datafile.checksum.hash)).happy()
+	}),
+
+	"playback seeks to correct time": test(async () => {
+		const {omni, videoA} = await setupTest()
+		const o = new O({timeline: omni.timeline(o => o.sequence(
+			o.video(videoA, {duration: 2000}),
+			o.gap(500),
+			o.video(videoA, {duration: 2500})
+		))})
+		const playback = await omni.playback(o.timeline)
+		await playback.seek(1000)
+		expect(playback.currentTime).is(1000)
+	})
+})
+

package/s/timeline/sugar/omni.ts

@@ -1,30 +1,56 @@
 
 import {O} from "./o.js"
 import {Item} from "../parts/item.js"
+import {fps} from "../../units/fps.js"
 import {Media} from "../parts/media.js"
-import {TimelineFile} from "../parts/basics.js"
+import {Driver} from "../../driver/driver.js"
 import {Datafile} from "../utils/datafile.js"
+import {TimelineFile} from "../parts/basics.js"
 import {ResourcePool} from "../parts/resource-pool.js"
+import {VideoPlayer} from "../renderers/player/player.js"
+import {produce} from "../renderers/export/produce.js"
 
 export class Omni {
 	resources = new ResourcePool()
 
+	constructor(private driver: Driver) {}
+
 	load = async<S extends Record<string, Promise<Datafile>>>(spec: S) => {
 		return Object.fromEntries(await Promise.all(Object.entries(spec).map(
-			async([key, value]) => [key, await this.resources.store(await value)]
+			async ([key, value]) => [key, await this.resources.store(await value)]
 		))) as {[K in keyof S]: Media}
 	}
 
-	timeline = (fn: (o: O) => Item.Sequence): TimelineFile => {
-		const o = new O()
-		const sequence = fn(o)
-		return {
-			format: "timeline",
-			info: "https://omniclip.app/",
-			version: 0,
-			root: o.register(sequence),
-			items: o.items,
-		}
+	timeline = (fn: (o: O) => Item.Any): TimelineFile => {
+		const o = new O({
+			timeline: {
+				format: "timeline",
+				info: "https://omniclip.app/",
+				version: 0,
+				items: [],
+				rootId: 0
+			}
+		})
+		const root = fn(o)
+		o.timeline.rootId = root.id
+		return o.timeline
+	}
+
+	playback = async (timeline: TimelineFile) => {
+		return new VideoPlayer(
+			this.driver,
+			(hash) => this.resources.require(hash).url,
+			timeline
+		)
+	}
+
+	render = async (timeline: TimelineFile, framerate: number = 30) => {
+		return produce({
+			timeline,
+			fps: fps(framerate),
+			driver: this.driver,
+			resolveMedia: (hash) => this.resources.require(hash).url
+		})
 	}
 }
 

package/s/timeline/types.ts

@@ -0,0 +1,29 @@
+export type Interpolation = "linear" | "catmullRom"
+export type Keyframe<Value = number> = [time: number, value: Value]
+export type Keyframes<Value = number> = Keyframe<Value>[]
+export type Vec2 = [x: number, y: number]
+export type Transform = [position: Vec2, scale: Vec2, rotation: number]
+
+export type TrackVec2 = {
+	x: Keyframes
+	y: Keyframes
+}
+
+export type Anim<T> = {
+  terp: Interpolation
+  track: T
+}
+
+export type Animations = Anim<TrackTransform>
+
+export type TrackTransform = {
+	position: TrackVec2
+	scale: TrackVec2
+	rotation: Keyframes
+}
+
+export type TransformOptions = {
+  position?: Vec2
+  scale?: Vec2
+  rotation?: number
+}

package/s/timeline/utils/checksum.ts

@@ -1,11 +1,13 @@
 
 import {Hex, Thumbprint} from "@e280/stz"
 
+import {Hash} from "../parts/basics.js"
+
 export class Checksum {
 	constructor(
 		public data: Uint8Array,
 		public bytes: Uint8Array,
-		public hash: string,
+		public hash: Hash,
 		public nickname: string,
 	) {}
 

package/s/timeline/utils/datafile.ts

@@ -3,19 +3,30 @@ import {Checksum} from "./checksum.js"
 
 export class Datafile {
 	constructor(
+		public url: string,
 		public bytes: Uint8Array,
+		public blob: Blob,
 		public filename: string,
 		public checksum: Checksum,
 	) {}
 
-	static async make(bytes: Uint8Array, name?: string) {
+	static async make(file: Blob, name?: string) {
+		const buffer = await file.arrayBuffer()
+		const bytes = new Uint8Array(buffer)
 		const checksum = await Checksum.make(bytes)
 		const filename = name ?? checksum.nickname
-		return new this(bytes, filename, checksum)
+		const url = URL.createObjectURL(file)
+		return new this(url, bytes, file, filename, checksum)
 	}
 
-	static async load(_path: string): Promise<Datafile> {
-		throw new Error("TODO implement")
+	static async load(path: string) {
+		// const file = await fetch(path)
+		// const buffer = await file.arrayBuffer()
+		// const bytes = new Uint8Array(buffer)
+		// const filename =  file?.headers.get('Content-Disposition')?.split('filename=')[1] ?? "file"
+		// console.log(filename)
+		// const checksum = await Checksum.make(bytes)
+		// return new this(path, bytes, filename, checksum)
 	}
 }
 

package/s/timeline/utils/dummy-data.ts

@@ -1,7 +1,7 @@
 
 import {Datafile} from "./datafile.js"
 
-export const dummyData = () => Datafile.make(
-	new Uint8Array([0xDE, 0xAD, 0xBE, 0xEF])
-)
+// export const dummyData = () => Datafile.make(
+// 	new Uint8Array([0xDE, 0xAD, 0xBE, 0xEF])
+// )
 

package/s/timeline/utils/matrix.ts

@@ -0,0 +1,33 @@
+import {Matrix} from "pixi.js"
+import {Transform} from "../types.js"
+
+export const transformToMat6 = (t: Transform): Mat6 => {
+	const [pos, scl, rotDeg] = t
+	const [x, y] = pos
+	const [sx, sy] = scl
+	const r = rotDeg * Math.PI / 180
+	const cos = Math.cos(r)
+	const sin = Math.sin(r)
+	return [cos * sx, sin * sx, -sin * sy, cos * sy, x, y]
+}
+
+export const mat6ToMatrix = ([a, b, c, d, tx, ty]: Mat6): Matrix =>
+	new Matrix(a, b, c, d, tx, ty)
+
+export const transformToMatrix = (t: Transform) => mat6ToMatrix(transformToMat6(t))
+
+export const mul6 = (local: Mat6, parent: Mat6): Mat6 => {
+	const [a1, b1, c1, d1, tx1, ty1] = local
+	const [a2, b2, c2, d2, tx2, ty2] = parent
+	return [
+		a1 * a2 + c1 * b2,
+		b1 * a2 + d1 * b2,
+		a1 * c2 + c1 * d2,
+		b1 * c2 + d1 * d2,
+		a1 * tx2 + c1 * ty2 + tx1,
+		b1 * tx2 + d1 * ty2 + ty1
+	]
+}
+
+export const I6: Mat6 = [1, 0, 0, 1, 0, 0]
+export type Mat6 = [a: number, b: number, c: number, d: number, tx: number, ty: number]

package/s/units/fps.ts

@@ -0,0 +1,8 @@
+declare const FpsBrand: unique symbol
+
+export type Fps = number & {
+	readonly [FpsBrand]: "fps"
+}
+
+export const fps = (value: number): Fps =>
+	value as Fps

package/s/units/ms.ts

@@ -0,0 +1,8 @@
+declare const MsBrand: unique symbol
+
+export type Ms = number & {
+	readonly [MsBrand]: "ms"
+}
+
+export const ms = (value: number): Ms =>
+	value as Ms

package/s/units/seconds.ts

@@ -0,0 +1,8 @@
+declare const SecondsBrand: unique symbol
+
+export type Seconds = number & {
+	readonly [SecondsBrand]: "s"
+}
+
+export const seconds = (value: number): Seconds =>
+	value as Seconds

package/x/WebGLRenderer-7X274AYV.js

@@ -0,0 +1,2 @@
+import{a}from"./chunk-4ONWQOPX.js";import"./chunk-W5CN46AR.js";import"./chunk-WFT3KTZG.js";export{a as WebGLRenderer};
+//# sourceMappingURL=WebGLRenderer-7X274AYV.js.map

package/x/WebGLRenderer-7X274AYV.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/x/WebGPURenderer-XMCMEXAO.js

@@ -0,0 +1,2 @@
+import{a}from"./chunk-Q7JBQNE4.js";import"./chunk-A45M2HJC.js";import"./chunk-W5CN46AR.js";import"./chunk-WFT3KTZG.js";export{a as WebGPURenderer};
+//# sourceMappingURL=WebGPURenderer-XMCMEXAO.js.map

package/x/WebGPURenderer-XMCMEXAO.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/x/browserAll-6TVTCHHE.js

@@ -0,0 +1,2 @@
+import{a as i,b as o,c as m,d as p,e}from"./chunk-OTQK6FAJ.js";import"./chunk-63NSCXPX.js";import"./chunk-W33LM336.js";import"./chunk-A45M2HJC.js";import{O as t,e as r}from"./chunk-WFT3KTZG.js";r.add(i);r.mixin(t,o);r.add(m);r.mixin(t,p);r.add(e);
+//# sourceMappingURL=browserAll-6TVTCHHE.js.map

package/x/browserAll-6TVTCHHE.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../node_modules/pixi.js/src/accessibility/init.ts", "../node_modules/pixi.js/src/events/init.ts", "../node_modules/pixi.js/src/dom/init.ts"],
+  "sourcesContent": ["import { extensions } from '../extensions/Extensions';\nimport { Container } from '../scene/container/Container';\nimport { AccessibilitySystem } from './AccessibilitySystem';\nimport { accessibilityTarget } from './accessibilityTarget';\n\nextensions.add(AccessibilitySystem);\nextensions.mixin(Container, accessibilityTarget);\n", "import { extensions } from '../extensions/Extensions';\nimport { Container } from '../scene/container/Container';\nimport { EventSystem } from './EventSystem';\nimport { FederatedContainer } from './FederatedEventTarget';\n\nextensions.add(EventSystem);\nextensions.mixin(Container, FederatedContainer);\n", "import { extensions } from '../extensions/Extensions';\nimport { DOMPipe } from './DOMPipe';\n\nexport * from './index';\n\nextensions.add(DOMPipe);\n"],
+  "mappings": "kMAKAA,EAAW,IAAIC,CAAmB,EAClCD,EAAW,MAAME,EAAWC,CAAmB,ECD/CC,EAAW,IAAIC,CAAW,EAC1BD,EAAW,MAAME,EAAWC,CAAkB,ECD9CC,EAAW,IAAIC,CAAO",
+  "names": ["extensions", "AccessibilitySystem", "Container", "accessibilityTarget", "extensions", "EventSystem", "Container", "FederatedContainer", "extensions", "DOMPipe"]
+}