@vib3code/sdk 2.0.3-canary.590fbae → 2.0.3-canary.69d53b3

package/src/experimental/VIB3Actor.js

@@ -0,0 +1,138 @@
+/**
+ * VIB3Actor - A VIB3+ Entity with Personality
+ *
+ * Wraps a VIB3Engine instance with emotional state and expression logic.
+ * Actors can "emote" (transition parameters based on mood) and "speak"
+ * (modulate geometry).
+ *
+ * @experimental
+ */
+import { TransitionAnimator } from '../creative/TransitionAnimator.js';
+
+export class VIB3Actor {
+    /**
+     * @param {VIB3Engine} engine - The VIB3 engine instance
+     * @param {string|object} profile - Personality profile name or object
+     */
+    constructor(engine, profile = 'neutral') {
+        this.engine = engine;
+        this.id = `actor_${Math.random().toString(36).substr(2, 9)}`;
+        this.active = true;
+
+        // Emotional State (-1.0 to 1.0)
+        this.emotion = {
+            valence: 0, // Positive/Negative
+            arousal: 0  // High/Low Energy
+        };
+
+        // Animation system
+        this.animator = new TransitionAnimator(
+            (k, v) => this.engine.setParameter(k, v),
+            (k) => this.engine.getParameter(k)
+        );
+
+        // Load profile
+        this.profile = typeof profile === 'string' ? this._getProfile(profile) : profile;
+
+        // Apply base state
+        this.reset();
+    }
+
+    /**
+     * Update loop called by Orchestrator.
+     * @param {number} time - Total elapsed simulation time
+     * @param {number} dt - Delta time in seconds
+     */
+    update(time, dt) {
+        if (!this.active) return;
+
+        // Idle behavior (breathing)
+        // Sync morphFactor to universe time
+        const breath = Math.sin(time * 2.0) * 0.1; // 2.0 rad/s
+
+        // Apply breath modulation on top of base profile
+        // Note: This is a simple additive modulation.
+        // A real system would blend this with active transitions.
+        const currentMorph = this.engine.getParameter('morphFactor') || 1.0;
+        // Only modulate if not transitioning heavily
+        if (!this.animator.isAnimating()) {
+             // Gentle idle sway
+             this.engine.setParameter('morphFactor', 1.0 + breath);
+        }
+    }
+
+    /**
+     * Express an emotion.
+     * @param {string} emotionName - e.g., 'joy', 'anger', 'fear', 'sadness'
+     * @param {number} intensity - 0.0 to 1.0
+     * @param {number} duration - Transition duration in ms
+     */
+    emote(emotionName, intensity = 1.0, duration = 1000) {
+        const mapping = this.profile.emotions[emotionName];
+        if (!mapping) {
+            console.warn(`VIB3Actor: Unknown emotion '${emotionName}' for profile '${this.profile.name}'`);
+            return;
+        }
+
+        const targetParams = {};
+        for (const [param, baseVal] of Object.entries(mapping)) {
+            // Lerp between current/neutral and target based on intensity
+            // Simplified: just setting target value scaled by intensity logic could go here
+            // For now, we just use the mapped value directly as the "100% intensity" target
+            targetParams[param] = baseVal;
+        }
+
+        // Apply global intensity modifiers
+        if (targetParams.intensity) targetParams.intensity *= intensity;
+        if (targetParams.speed) targetParams.speed *= intensity;
+
+        this.animator.transition(targetParams, duration, 'easeOut');
+
+        // Update internal state (simplified)
+        this.emotion.lastEmote = emotionName;
+    }
+
+    /**
+     * Reset to neutral state.
+     */
+    reset(duration = 1000) {
+        this.animator.transition(this.profile.base, duration, 'easeInOut');
+    }
+
+    /**
+     * Get a predefined personality profile.
+     * @param {string} name
+     */
+    _getProfile(name) {
+        const profiles = {
+            neutral: {
+                name: 'neutral',
+                base: { hue: 200, saturation: 0.5, intensity: 0.5, chaos: 0, speed: 1.0, gridDensity: 20 },
+                emotions: {
+                    joy: { hue: 50, saturation: 1.0, intensity: 0.8, speed: 2.0, chaos: 0.2 },
+                    anger: { hue: 0, saturation: 1.0, intensity: 0.9, speed: 3.0, chaos: 0.8 },
+                    sadness: { hue: 240, saturation: 0.2, intensity: 0.3, speed: 0.2, chaos: 0 },
+                    fear: { hue: 280, saturation: 0.8, intensity: 0.6, speed: 2.5, chaos: 0.9, gridDensity: 50 }
+                }
+            },
+            heroic: {
+                name: 'heroic',
+                base: { hue: 210, saturation: 0.8, intensity: 0.7, chaos: 0.1, speed: 1.0, gridDensity: 15 },
+                emotions: {
+                    joy: { hue: 50, saturation: 1.0, intensity: 1.0, speed: 1.5, morphFactor: 1.2 },
+                    anger: { hue: 20, saturation: 1.0, intensity: 1.0, speed: 2.5, chaos: 0.5 },
+                    determination: { hue: 220, saturation: 0.9, intensity: 0.9, speed: 1.2, gridDensity: 10 }
+                }
+            },
+            glitch: {
+                name: 'glitch',
+                base: { hue: 120, saturation: 0.0, intensity: 0.4, chaos: 0.5, speed: 2.0, gridDensity: 40 },
+                emotions: {
+                    panic: { hue: 0, saturation: 0, intensity: 0.9, speed: 5.0, chaos: 1.0, rot4dXW: 1.5 },
+                    calm: { hue: 120, saturation: 0.5, intensity: 0.4, speed: 0.5, chaos: 0.2 }
+                }
+            }
+        };
+        return profiles[name] || profiles.neutral;
+    }
+}

package/src/experimental/VIB3Compositor.js

@@ -0,0 +1,117 @@
+/**
+ * VIB3Compositor - Visual Layering and Scene Management
+ *
+ * Handles the complexity of rendering multiple VIB3+ instances into a cohesive visual.
+ * Manages DOM structure, Z-indexing, masking, and blend modes for "Universe" rendering.
+ *
+ * @experimental
+ */
+export class VIB3Compositor {
+    constructor(containerId = 'vib3-universe') {
+        this.containerId = containerId;
+        this.layers = []; // Ordered list of layer configs
+        this.activeInstances = new Map(); // instanceId -> DOM element
+
+        // Ensure container exists
+        if (typeof document !== 'undefined') {
+            this.container = document.getElementById(containerId);
+            if (!this.container) {
+                this.container = document.createElement('div');
+                this.container.id = containerId;
+                this.container.style.position = 'relative';
+                this.container.style.width = '100vw';
+                this.container.style.height = '100vh';
+                this.container.style.overflow = 'hidden';
+                document.body.appendChild(this.container);
+            }
+        }
+    }
+
+    /**
+     * Register a VIB3 instance to be composited.
+     * @param {string} instanceId - Unique ID for the VIB3 instance
+     * @param {HTMLElement} canvasElement - The canvas element of the VIB3 instance
+     * @param {object} options - Layer configuration (zIndex, blendMode, opacity)
+     */
+    addInstance(instanceId, canvasElement, options = {}) {
+        if (this.activeInstances.has(instanceId)) {
+            console.warn(`VIB3Compositor: Instance ${instanceId} already registered.`);
+            return;
+        }
+
+        // Apply default styles for compositing
+        canvasElement.style.position = 'absolute';
+        canvasElement.style.top = '0';
+        canvasElement.style.left = '0';
+        canvasElement.style.width = '100%';
+        canvasElement.style.height = '100%';
+
+        // Apply options
+        this.updateLayer(instanceId, options);
+
+        this.container.appendChild(canvasElement);
+        this.activeInstances.set(instanceId, canvasElement);
+        this.layers.push(instanceId);
+
+        console.log(`VIB3Compositor: Added instance ${instanceId}`);
+    }
+
+    /**
+     * Remove a VIB3 instance from the compositor.
+     * @param {string} instanceId
+     */
+    removeInstance(instanceId) {
+        if (this.activeInstances.has(instanceId)) {
+            const canvasElement = this.activeInstances.get(instanceId);
+            if (canvasElement.parentNode) {
+                canvasElement.parentNode.removeChild(canvasElement);
+            }
+            this.activeInstances.delete(instanceId);
+            this.layers = this.layers.filter(id => id !== instanceId);
+            console.log(`VIB3Compositor: Removed instance ${instanceId}`);
+        }
+    }
+
+    /**
+     * Update visual properties of a layer.
+     * @param {string} instanceId
+     * @param {object} options - { zIndex, blendMode, opacity, visible }
+     */
+    updateLayer(instanceId, options) {
+        const canvasElement = this.activeInstances.get(instanceId);
+        if (!canvasElement) return;
+
+        if (options.zIndex !== undefined) canvasElement.style.zIndex = options.zIndex;
+        if (options.blendMode !== undefined) canvasElement.style.mixBlendMode = options.blendMode;
+        if (options.opacity !== undefined) canvasElement.style.opacity = options.opacity;
+        if (options.visible !== undefined) canvasElement.style.display = options.visible ? 'block' : 'none';
+
+        // Handle masking if provided (experimental CSS mask)
+        if (options.maskImage) {
+            canvasElement.style.webkitMaskImage = `url(${options.maskImage})`;
+            canvasElement.style.maskImage = `url(${options.maskImage})`;
+        }
+    }
+
+    /**
+     * Reorder layers based on a list of IDs.
+     * @param {string[]} order - Array of instance IDs, from bottom to top
+     */
+    setLayerOrder(order) {
+        order.forEach((id, index) => {
+            this.updateLayer(id, { zIndex: index });
+        });
+        this.layers = order;
+    }
+
+    /**
+     * Clear all instances.
+     */
+    clear() {
+        this.activeInstances.forEach((el, id) => {
+            if (el.parentNode) el.parentNode.removeChild(el);
+        });
+        this.activeInstances.clear();
+        this.layers = [];
+    }
+}

package/src/experimental/VIB3Link.js

@@ -0,0 +1,122 @@
+/**
+ * VIB3Link - Multi-User Synchronization
+ *
+ * Provides a networking layer (mocked for now) to sync VIB3Universe state
+ * between multiple clients. Handles entity updates, parameter deltas, and events.
+ *
+ * @experimental
+ */
+export class VIB3Link {
+    constructor() {
+        this.connected = false;
+        this.roomId = null;
+        this.isHost = false;
+        this.peers = new Set();
+        this.eventBus = new EventTarget();
+
+        // Bind methods
+        this.handleMessage = this.handleMessage.bind(this);
+    }
+
+    /**
+     * Connect to a shared room.
+     * @param {string} roomId
+     */
+    async connect(roomId) {
+        this.roomId = roomId;
+        this.connected = true;
+
+        // Mock connection logic
+        console.log(`VIB3Link: Connected to room ${roomId}`);
+
+        // In a real implementation, we would establish WebRTC/WebSocket here
+        // and negotiate host status. For now, assume single-player or host.
+        this.isHost = true;
+
+        this.emit('connected', { roomId, isHost: this.isHost });
+    }
+
+    /**
+     * Disconnect from the room.
+     */
+    disconnect() {
+        this.connected = false;
+        this.peers.clear();
+        console.log(`VIB3Link: Disconnected.`);
+        this.emit('disconnected', {});
+    }
+
+    /**
+     * Broadcast an event to all peers.
+     * @param {string} type - Message type (upd, prm, evt)
+     * @param {object} payload
+     */
+    broadcast(type, payload) {
+        if (!this.connected) return;
+
+        const message = {
+            t: type,
+            s: Date.now(), // simple sequence
+            p: payload
+        };
+
+        // In real impl: webrtcChannel.send(JSON.stringify(message));
+
+        // Mock loopback for local testing (optional)
+        // this.handleMessage(message);
+    }
+
+    /**
+     * Handle an incoming message from the network.
+     * @param {object} message
+     */
+    handleMessage(message) {
+        const { t, p } = message;
+
+        switch (t) {
+            case 'upd':
+                this.emit('entityUpdate', p);
+                break;
+            case 'prm':
+                this.emit('parameterDelta', p);
+                break;
+            case 'evt':
+                this.emit('universeEvent', p);
+                break;
+            default:
+                console.warn(`VIB3Link: Unknown message type ${t}`);
+        }
+    }
+
+    /**
+     * Sync the state of all entities. Called by Orchestrator tick.
+     * @param {Map<string, object>} entities
+     */
+    sync(entities) {
+        if (!this.connected || !this.isHost) return;
+
+        // Collect dirty state
+        // In a real optimized system, we'd diff state or only send moved entities
+        // For now, let's just log that we would sync
+        // console.log(`VIB3Link: Syncing ${entities.size} entities`);
+    }
+
+    /**
+     * Emit a local event for system consumption.
+     * @param {string} name
+     * @param {object} detail
+     */
+    emit(name, detail) {
+        const event = new CustomEvent(name, { detail });
+        this.eventBus.dispatchEvent(event);
+    }
+
+    /**
+     * Listen for network events.
+     * @param {string} name
+     * @param {function} callback
+     */
+    on(name, callback) {
+        this.eventBus.addEventListener(name, (e) => callback(e.detail));
+    }
+}

package/src/experimental/VIB3Orchestrator.js

@@ -0,0 +1,146 @@
+/**
+ * VIB3Orchestrator - The Core of the VIB3 Universe
+ *
+ * Manages the lifecycle and coordination of multiple VIB3+ entities (visualizers).
+ * Implements the "Universe" concept where multiple instances share a clock,
+ * physics, and event bus.
+ *
+ * @experimental
+ */
+export class VIB3Orchestrator {
+    constructor() {
+        this.entities = new Map(); // id -> Entity
+        this.nextEntityId = 1;
+
+        // Master Clock
+        this.time = 0;
+        this.lastFrameTime = 0;
+        this.paused = false;
+
+        // Systems
+        this.eventBus = new EventTarget();
+
+        // Bind loop
+        this.tick = this.tick.bind(this);
+    }
+
+    /**
+     * Start the universe simulation loop.
+     */
+    start() {
+        if (this.running) return;
+        this.running = true;
+        this.lastFrameTime = performance.now();
+        requestAnimationFrame(this.tick);
+        console.log('VIB3Orchestrator: Universe started.');
+    }
+
+    /**
+     * Stop the universe simulation loop.
+     */
+    stop() {
+        this.running = false;
+        console.log('VIB3Orchestrator: Universe stopped.');
+    }
+
+    /**
+     * Spawn a new VIB3 entity.
+     * @param {string} type - 'actor', 'prop', 'environment'
+     * @param {object} config - Configuration for the entity
+     * @returns {string} Entity ID
+     */
+    spawn(type, config = {}) {
+        const id = `vib3_entity_${this.nextEntityId++}`;
+
+        // In a real implementation, this would instantiate VIB3Actor or VIB3Prop
+        // For now, we store a mock object representing the entity state
+        const entity = {
+            id,
+            type,
+            config,
+            position: config.position || { x: 0, y: 0, z: 0 },
+            rotation: config.rotation || { x: 0, y: 0, z: 0, w: 0 }, // 4D rotation
+            active: true,
+
+            // Mock VIB3Engine interface
+            engine: {
+                setParameter: (k, v) => console.log(`[${id}] set ${k}=${v}`),
+                getParameter: (k) => 0
+            },
+
+            update: (dt) => {
+                // Default update logic
+                // e.g., apply basic physics or script behavior
+            }
+        };
+
+        this.entities.set(id, entity);
+        this.emit('entitySpawned', { id, type });
+        console.log(`VIB3Orchestrator: Spawned ${type} (${id})`);
+
+        return id;
+    }
+
+    /**
+     * Remove an entity from the universe.
+     * @param {string} id
+     */
+    kill(id) {
+        if (this.entities.has(id)) {
+            const entity = this.entities.get(id);
+            // Cleanup logic (e.g., destroy VIB3Engine instance)
+            if (entity.destroy) entity.destroy();
+
+            this.entities.delete(id);
+            this.emit('entityDespawned', { id });
+            console.log(`VIB3Orchestrator: Killed entity ${id}`);
+        }
+    }
+
+    /**
+     * The main simulation loop.
+     * Prioritizes Physics -> Narrative -> Visuals.
+     * @param {number} timestamp
+     */
+    tick(timestamp) {
+        if (!this.running) return;
+
+        const dt = (timestamp - this.lastFrameTime) / 1000;
+        this.lastFrameTime = timestamp;
+        this.time += dt;
+
+        // 1. Physics / Logic Update
+        this.entities.forEach(entity => {
+            if (entity.active && entity.update) {
+                entity.update(this.time, dt);
+            }
+        });
+
+        // 2. Event Processing (Mock)
+        // Check for collisions, triggers, etc.
+
+        // 3. Visual Sync (Mock)
+        // Ensure all entities are rendering the current frame
+
+        requestAnimationFrame(this.tick);
+    }
+
+    /**
+     * Emit a global universe event.
+     * @param {string} name
+     * @param {object} detail
+     */
+    emit(name, detail) {
+        const event = new CustomEvent(name, { detail });
+        this.eventBus.dispatchEvent(event);
+    }
+
+    /**
+     * Listen for global universe events.
+     * @param {string} name
+     * @param {function} callback
+     */
+    on(name, callback) {
+        this.eventBus.addEventListener(name, (e) => callback(e.detail));
+    }
+}

package/src/experimental/VIB3Universe.js

@@ -0,0 +1,109 @@
+/**
+ * VIB3Universe - High-Level Entry Point for VIB3+ Ultra
+ *
+ * Combines Orchestrator (Logic) and Compositor (Visuals) into a single API.
+ * Manages the "World" where multiple VIB3+ instances coexist.
+ *
+ * @experimental
+ */
+import { VIB3Orchestrator } from './VIB3Orchestrator.js';
+import { VIB3Compositor } from './VIB3Compositor.js';
+import { VIB3Actor } from './VIB3Actor.js';
+import { VIB3Engine } from '../core/VIB3Engine.js';
+
+export class VIB3Universe {
+    /**
+     * @param {string} containerId - DOM ID for the universe container
+     */
+    constructor(containerId = 'vib3-universe') {
+        this.orchestrator = new VIB3Orchestrator();
+        this.compositor = new VIB3Compositor(containerId);
+        this.actors = new Map(); // id -> VIB3Actor
+    }
+
+    /**
+     * Start the universe simulation.
+     */
+    start() {
+        this.orchestrator.start();
+    }
+
+    /**
+     * Stop the universe simulation.
+     */
+    stop() {
+        this.orchestrator.stop();
+    }
+
+    /**
+     * Spawn a new actor into the universe.
+     * @param {object} config
+     * @param {string} config.personality - Actor personality profile
+     * @param {string} config.system - Visualization system ('quantum', 'faceted', 'holographic')
+     * @param {number} config.geometry - Initial geometry index
+     * @param {object} config.layer - Layer options { zIndex, blendMode, opacity, position }
+     * @returns {Promise<VIB3Actor>} The spawned actor
+     */
+    async spawnActor(config = {}) {
+        const actorId = `actor_${Date.now()}_${Math.floor(Math.random() * 1000)}`;
+
+        // 1. Create a container for this actor's engine
+        const container = document.createElement('div');
+        container.id = `container_${actorId}`;
+        container.style.width = '100%';
+        container.style.height = '100%';
+        container.style.pointerEvents = 'none'; // Default to pass-through events
+
+        // 2. Add to compositor (visual layer)
+        this.compositor.addInstance(actorId, container, config.layer || {});
+
+        // 3. Initialize VIB3 Engine
+        const engine = new VIB3Engine({
+            system: config.system || 'holographic',
+            preferWebGPU: true // Ultra tier defaults to high perf
+        });
+
+        // Initialize engine within the container
+        // Note: VIB3Engine.initialize expects a container ID
+        await engine.initialize(container.id);
+
+        // Set initial state
+        if (config.geometry !== undefined) {
+            engine.setParameter('geometry', config.geometry);
+        }
+
+        // 4. Wrap in Actor (logic layer)
+        const actor = new VIB3Actor(engine, config.personality || 'neutral');
+        actor.id = actorId;
+
+        // 5. Register with Orchestrator (simulation loop)
+        this.orchestrator.entities.set(actorId, actor);
+        this.actors.set(actorId, actor);
+
+        console.log(`VIB3Universe: Spawned actor ${actorId}`);
+        return actor;
+    }
+
+    /**
+     * Remove an actor from the universe.
+     * @param {string} actorId
+     */
+    despawnActor(actorId) {
+        const actor = this.actors.get(actorId);
+        if (actor) {
+            // Remove from logic
+            this.orchestrator.kill(actorId);
+
+            // Cleanup engine
+            if (actor.engine && actor.engine.destroy) {
+                actor.engine.destroy();
+            }
+
+            // Remove from visuals
+            this.compositor.removeInstance(actorId);
+            this.actors.delete(actorId);
+
+            console.log(`VIB3Universe: Despawned actor ${actorId}`);
+        }
+    }
+}