@otto-assistant/bridge 0.4.92

package/skills/jitter/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "jitter-utils",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "esbuild utils/index.ts --bundle --format=iife --global-name=jitterUtils --outfile=dist/jitter-utils.js",
+    "typecheck": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "esbuild": "^0.24.2",
+    "typescript": "^5.9.2"
+  }
+}

package/skills/jitter/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "lib": ["ES2022", "DOM"],
+    "types": []
+  },
+  "include": ["utils/**/*.ts"]
+}

package/skills/jitter/utils/actions.ts

@@ -0,0 +1,212 @@
+// Action helpers for modifying Jitter projects
+
+import type { LayerProperties } from './types'
+
+function dispatch(action: Record<string, unknown>): void {
+  window.app.dispatchAction(action)
+}
+
+/**
+ * Replace the URL of an asset node (image, SVG, video)
+ */
+export function replaceAssetUrl(nodeId: string, newUrl: string): void {
+  dispatch({
+    type: 'updateObjWithUndo',
+    objId: nodeId,
+    data: { url: newUrl },
+  })
+}
+
+/**
+ * Replace text content of a text node
+ */
+export function replaceText(nodeId: string, newText: string): void {
+  dispatch({
+    type: 'updateObjWithUndo',
+    objId: nodeId,
+    data: { text: newText },
+  })
+}
+
+/**
+ * Update multiple properties on a node
+ */
+export function updateNode(
+  nodeId: string,
+  properties: Partial<LayerProperties> & { url?: string; text?: string },
+): void {
+  dispatch({
+    type: 'updateObjWithUndo',
+    objId: nodeId,
+    data: properties,
+  })
+}
+
+export interface ReplacementItem {
+  nodeId: string
+  data: Partial<LayerProperties> & { url?: string; text?: string }
+}
+
+/**
+ * Batch update multiple nodes at once
+ */
+export function batchReplace(replacements: ReplacementItem[]): void {
+  for (const { nodeId, data } of replacements) {
+    dispatch({
+      type: 'updateObjWithUndo',
+      objId: nodeId,
+      data: data,
+    })
+  }
+}
+
+/**
+ * Select specific nodes by their IDs
+ */
+export function selectNodes(nodeIds: string[]): void {
+  dispatch({
+    type: 'setSelection',
+    selection: { nodesIds: nodeIds },
+    saveInCmdHistory: true,
+  })
+}
+
+/**
+ * Clear the current selection
+ */
+export function clearSelection(): void {
+  dispatch({ type: 'emptySelection' })
+}
+
+/**
+ * Delete the currently selected nodes
+ */
+export function deleteSelection(): void {
+  dispatch({ type: 'deleteCurrentSelection' })
+}
+
+/**
+ * Remove specific nodes by their IDs
+ */
+export function removeNodes(nodeIds: string[]): void {
+  dispatch({
+    type: 'removeObjWithUndo',
+    objIds: nodeIds,
+  })
+}
+
+/**
+ * Undo the last action
+ */
+export function undo(): void {
+  dispatch({ type: 'undo' })
+}
+
+/**
+ * Redo the last undone action
+ */
+export function redo(): void {
+  dispatch({ type: 'redo' })
+}
+
+/**
+ * Rename a node
+ */
+export function renameNode(nodeId: string, newName: string): void {
+  selectNodes([nodeId])
+  dispatch({
+    type: 'renameSelection',
+    name: newName,
+  })
+}
+
+/**
+ * Update node position
+ */
+export function moveNode(nodeId: string, x: number, y: number): void {
+  dispatch({
+    type: 'updateObjWithUndo',
+    objId: nodeId,
+    data: { x, y },
+  })
+}
+
+/**
+ * Update node size
+ */
+export function resizeNode(
+  nodeId: string,
+  width: number,
+  height: number,
+): void {
+  dispatch({
+    type: 'updateObjWithUndo',
+    objId: nodeId,
+    data: { width, height },
+  })
+}
+
+/**
+ * Update node opacity (0-100)
+ */
+export function setOpacity(nodeId: string, opacity: number): void {
+  dispatch({
+    type: 'updateObjWithUndo',
+    objId: nodeId,
+    data: { opacity },
+  })
+}
+
+/**
+ * Update node rotation angle in degrees
+ */
+export function setRotation(nodeId: string, angle: number): void {
+  dispatch({
+    type: 'updateObjWithUndo',
+    objId: nodeId,
+    data: { angle },
+  })
+}
+
+/**
+ * Set the current playhead time for an artboard
+ */
+export function setCurrentTime(artboardId: string, timeMs: number): void {
+  dispatch({
+    type: 'setArtboardsTime',
+    times: { [artboardId]: timeMs },
+  })
+}
+
+/**
+ * Jump playhead to start
+ */
+export function jumpToStart(): void {
+  dispatch({ type: 'jumpToStartTime' })
+}
+
+/**
+ * Jump playhead to end
+ */
+export function jumpToEnd(): void {
+  dispatch({ type: 'jumpToEndTime' })
+}
+
+/**
+ * Add a new object to the project
+ */
+export function addObject(
+  parentId: string,
+  id: string,
+  item: LayerProperties,
+  index?: string,
+): void {
+  dispatch({ type: 'saveSelectionForUndo' })
+  dispatch({
+    type: 'addObjWithUndo',
+    parentId,
+    objData: { id, item },
+    index,
+  })
+  selectNodes([id])
+}

package/skills/jitter/utils/export.ts

@@ -0,0 +1,114 @@
+// Export URL generation utilities
+
+import type { ExportProfile } from './types'
+import { getArtboards } from './traverse'
+
+export interface ExportUrlOptions {
+  fileId: string
+  artboardId: string
+  width: number
+  height: number
+  profile?: ExportProfile
+}
+
+/**
+ * Generate a Jitter export URL for downloading Lottie/video/etc
+ */
+export function generateExportUrl(options: ExportUrlOptions): string {
+  const { fileId, artboardId, width, height, profile = 'lottie' } = options
+  const params = new URLSearchParams({
+    file: fileId,
+    artboardId: artboardId,
+    profile: profile,
+    width: width.toString(),
+    height: height.toString(),
+  })
+  return `https://jitter.video/export/?${params.toString()}`
+}
+
+export interface CurrentProjectExportOptions {
+  artboardName?: string
+  profile?: ExportProfile
+}
+
+/**
+ * Generate export URL from the currently open project
+ */
+export function generateExportUrlFromCurrentProject(
+  options: CurrentProjectExportOptions = {},
+): string {
+  const { artboardName, profile = 'lottie' } = options
+  const fileId = window.app.props.fileMeta.id
+  const artboards = getArtboards()
+
+  const artboard = artboardName
+    ? artboards.find((a) => a.name === artboardName)
+    : artboards[0]
+
+  if (!artboard) {
+    throw new Error(
+      artboardName
+        ? `Artboard "${artboardName}" not found`
+        : 'No artboard found in project',
+    )
+  }
+
+  return generateExportUrl({
+    fileId,
+    artboardId: artboard.id,
+    width: artboard.width,
+    height: artboard.height,
+    profile,
+  })
+}
+
+export interface ParsedJitterUrl {
+  fileId: string | null
+  nodeId: string | null
+}
+
+/**
+ * Parse a Jitter project URL to extract file and node IDs
+ */
+export function parseJitterUrl(url: string): ParsedJitterUrl {
+  const parsed = new URL(url)
+  return {
+    fileId: parsed.searchParams.get('id'),
+    nodeId: parsed.searchParams.get('nodeId'),
+  }
+}
+
+/**
+ * Get the current project's file metadata
+ */
+export function getFileMeta(): {
+  id: string
+  name: string
+  bucket: string
+  teamId?: string
+} {
+  return window.app.props.fileMeta
+}
+
+/**
+ * Generate a URL to open a specific node in the editor
+ */
+export function generateNodeUrl(fileId: string, nodeId: string): string {
+  const params = new URLSearchParams({
+    id: fileId,
+    nodeId: nodeId,
+  })
+  return `https://jitter.video/file/?${params.toString()}`
+}
+
+/**
+ * Get URL for the currently open project
+ */
+export function getCurrentProjectUrl(nodeId?: string): string {
+  const fileId = window.app.props.fileMeta.id
+  const params = new URLSearchParams({ id: fileId })
+  if (nodeId) {
+    params.set('nodeId', nodeId)
+  }
+  return `https://jitter.video/file/?${params.toString()}`
+}

package/skills/jitter/utils/index.ts

@@ -0,0 +1,141 @@
+// Jitter Utils - Bundle entry point
+// Exports all utilities and attaches to globalThis.jitterUtils
+
+export * from './types'
+export * from './traverse'
+export * from './actions'
+export * from './export'
+export * from './snapshot'
+export * from './wait'
+
+// Re-export specific functions for easier access
+import {
+  findNodeById,
+  findAllMediaNodes,
+  findAllTextNodes,
+  getArtboards,
+  findNodesByType,
+  findNodesByName,
+  getParentNode,
+  getAncestors,
+  flattenTree,
+} from './traverse'
+
+import {
+  replaceAssetUrl,
+  replaceText,
+  updateNode,
+  batchReplace,
+  selectNodes,
+  clearSelection,
+  deleteSelection,
+  removeNodes,
+  undo,
+  redo,
+  renameNode,
+  moveNode,
+  resizeNode,
+  setOpacity,
+  setRotation,
+  setCurrentTime,
+  jumpToStart,
+  jumpToEnd,
+  addObject,
+} from './actions'
+
+import {
+  generateExportUrl,
+  generateExportUrlFromCurrentProject,
+  parseJitterUrl,
+  getFileMeta,
+  generateNodeUrl,
+  getCurrentProjectUrl,
+} from './export'
+
+import {
+  createSnapshot,
+  restoreFromSnapshot,
+  duplicateProject,
+  deleteProject,
+  createMediaSnapshot,
+  createTextSnapshot,
+  withTemporaryChanges,
+} from './snapshot'
+
+import {
+  waitForApp,
+  waitForSync,
+  waitFor,
+  waitForNode,
+  waitForConfigChange,
+  isReadOnly,
+  isAppReady,
+} from './wait'
+
+const jitterUtils = {
+  // Traverse
+  findNodeById,
+  findAllMediaNodes,
+  findAllTextNodes,
+  getArtboards,
+  findNodesByType,
+  findNodesByName,
+  getParentNode,
+  getAncestors,
+  flattenTree,
+
+  // Actions
+  replaceAssetUrl,
+  replaceText,
+  updateNode,
+  batchReplace,
+  selectNodes,
+  clearSelection,
+  deleteSelection,
+  removeNodes,
+  undo,
+  redo,
+  renameNode,
+  moveNode,
+  resizeNode,
+  setOpacity,
+  setRotation,
+  setCurrentTime,
+  jumpToStart,
+  jumpToEnd,
+  addObject,
+
+  // Export
+  generateExportUrl,
+  generateExportUrlFromCurrentProject,
+  parseJitterUrl,
+  getFileMeta,
+  generateNodeUrl,
+  getCurrentProjectUrl,
+
+  // Snapshot
+  createSnapshot,
+  restoreFromSnapshot,
+  duplicateProject,
+  deleteProject,
+  createMediaSnapshot,
+  createTextSnapshot,
+  withTemporaryChanges,
+
+  // Wait
+  waitForApp,
+  waitForSync,
+  waitFor,
+  waitForNode,
+  waitForConfigChange,
+  isReadOnly,
+  isAppReady,
+}
+
+// Attach to globalThis for browser access
+if (typeof globalThis !== 'undefined') {
+  ;(globalThis as unknown as { jitterUtils: typeof jitterUtils }).jitterUtils =
+    jitterUtils
+}
+
+export default jitterUtils

package/skills/jitter/utils/snapshot.ts

@@ -0,0 +1,154 @@
+// Snapshot and restore utilities for temporary project modifications
+
+import type { LayerProperties } from './types'
+import { findNodeById } from './traverse'
+
+export type Snapshot = Record<string, LayerProperties>
+
+/**
+ * Create a snapshot of specific nodes' current state
+ * Use this before making temporary changes that you want to restore later
+ */
+export function createSnapshot(nodeIds: string[]): Snapshot {
+  const snapshot: Snapshot = {}
+
+  for (const nodeId of nodeIds) {
+    const node = findNodeById(nodeId)
+    if (node?.item) {
+      // Deep clone the item to avoid reference issues
+      snapshot[nodeId] = JSON.parse(JSON.stringify(node.item))
+    }
+  }
+
+  return snapshot
+}
+
+/**
+ * Restore nodes to their previously saved state
+ */
+export function restoreFromSnapshot(snapshot: Snapshot): void {
+  for (const [nodeId, data] of Object.entries(snapshot)) {
+    window.app.dispatchAction({
+      type: 'updateObjWithUndo',
+      objId: nodeId,
+      data: data,
+    })
+  }
+}
+
+/**
+ * Duplicate the current project file
+ * Returns the new file's ID
+ */
+export async function duplicateProject(): Promise<string> {
+  const currentFileId = window.app.props.fileMeta.id
+  return await window.app.props.fileActions.duplicateFile(currentFileId)
+}
+
+/**
+ * Delete a project file by ID
+ */
+export async function deleteProject(fileId: string): Promise<void> {
+  await window.app.props.fileActions.deleteFile(fileId)
+}
+
+/**
+ * Create a snapshot of all media nodes for easy restoration
+ */
+export function createMediaSnapshot(): {
+  snapshot: Snapshot
+  nodeIds: string[]
+} {
+  const conf = window.app.props.observableImmutableConf.lastImmutableConf
+  const nodeIds: string[] = []
+  const mediaTypes = new Set(['svg', 'image', 'video', 'gif'])
+
+  const collectIds = (node: {
+    id: string
+    item?: { type: string }
+    children?: unknown[]
+  }): void => {
+    if (node.item && mediaTypes.has(node.item.type)) {
+      nodeIds.push(node.id)
+    }
+    if (node.children) {
+      ;(node.children as (typeof node)[]).forEach(collectIds)
+    }
+  }
+
+  ;(conf.roots || []).forEach(collectIds)
+
+  return {
+    snapshot: createSnapshot(nodeIds),
+    nodeIds,
+  }
+}
+
+/**
+ * Create a snapshot of all text nodes for easy restoration
+ */
+export function createTextSnapshot(): {
+  snapshot: Snapshot
+  nodeIds: string[]
+} {
+  const conf = window.app.props.observableImmutableConf.lastImmutableConf
+  const nodeIds: string[] = []
+
+  const collectIds = (node: {
+    id: string
+    item?: { type: string }
+    children?: unknown[]
+  }): void => {
+    if (node.item?.type === 'text') {
+      nodeIds.push(node.id)
+    }
+    if (node.children) {
+      ;(node.children as (typeof node)[]).forEach(collectIds)
+    }
+  }
+
+  ;(conf.roots || []).forEach(collectIds)
+
+  return {
+    snapshot: createSnapshot(nodeIds),
+    nodeIds,
+  }
+}
+
+export interface ExportWithRestoreOptions {
+  replacements: Array<{ nodeId: string; data: Record<string, unknown> }>
+  onBeforeExport?: () => void | Promise<void>
+}
+
+/**
+ * Apply temporary changes, run a callback, then restore original state
+ * Useful for exporting with temporary asset replacements
+ */
+export async function withTemporaryChanges<T>(
+  nodeIds: string[],
+  changes: Record<string, Record<string, unknown>>,
+  callback: () => T | Promise<T>,
+): Promise<T> {
+  // Create snapshot before changes
+  const snapshot = createSnapshot(nodeIds)
+
+  try {
+    // Apply changes
+    for (const [nodeId, data] of Object.entries(changes)) {
+      window.app.dispatchAction({
+        type: 'updateObjWithUndo',
+        objId: nodeId,
+        data: data,
+      })
+    }
+
+    // Wait for changes to sync
+    await new Promise((resolve) => setTimeout(resolve, 1000))
+
+    // Run callback
+    return await callback()
+  } finally {
+    // Always restore original state
+    restoreFromSnapshot(snapshot)
+  }
+}