feat: refactor imports to use bundled library and enhance ECS core exports

Author: kalwalt

examples/minimal/app.js

@@ -3,13 +3,25 @@
  * Demonstrates the new ECS architecture with plugins
  */
 
-import { Engine } from '../../src/core/engine.js';
+/*import { Engine } from '../../src/core/engine.js';
 import { CaptureSystem } from '../../src/systems/capture-system.js';
 import { webcamPlugin } from '../../plugins/source/webcam.js';
 import { videoPlugin } from '../../plugins/source/video.js';
 import { imagePlugin } from '../../plugins/source/image.js';
 import { defaultProfilePlugin } from '../../plugins/profile/default-policy.js';
-import { EVENTS, RESOURCES, SOURCE_TYPES } from '../../src/core/components.js';
+import { EVENTS, RESOURCES, SOURCE_TYPES } from '../../src/core/components.js';*/
+
+import {
+  Engine,
+  CaptureSystem,
+  webcamPlugin,
+  videoPlugin,
+  imagePlugin,
+  defaultProfilePlugin,
+  EVENTS,
+  RESOURCES,
+  SOURCE_TYPES,
+} from '../../dist/arjs-core.mjs';
 
 // Create the engine
 const engine = new Engine();

examples/vite-artoolkit/main.js

@@ -1,13 +1,14 @@
 // Example: AR.js Core ECS + ArtoolkitPlugin with Start/Stop/Load buttons
+// Import everything from the bundled lib.
 
-import { Engine } from '../../src/core/engine.js';
-import { CaptureSystem } from '../../src/systems/capture-system.js';
-import { SOURCE_TYPES } from '../../src/core/components.js';
-import { FramePumpSystem } from '../../src/systems/frame-pump-system.js';
-
-import { webcamPlugin } from '../../plugins/source/webcam.js';
-import { defaultProfilePlugin } from '../../plugins/profile/default-policy.js';
-import { imagePlugin as artookit } from '../../plugins';
+import {
+  Engine,
+  CaptureSystem,
+  FramePumpSystem,
+  SOURCE_TYPES,
+  webcamPlugin,
+  defaultProfilePlugin,
+} from '../../dist/arjs-core.mjs';
 
 // UI
 const statusEl = document.getElementById('status');
@@ -26,21 +27,18 @@ function attachVideoToViewport(ctx) {
   if (!viewport) return;
 
   try {
-    // Detach from body if plugin appended it
     if (videoEl.parentNode && videoEl.parentNode !== viewport) {
       videoEl.parentNode.removeChild(videoEl);
     }
   } catch {}
 
-  // Ensure attributes optimal for inline playback
   try {
     videoEl.setAttribute('playsinline', '');
     videoEl.setAttribute('autoplay', '');
     videoEl.muted = true;
     videoEl.controls = false;
   } catch {}
 
-  // Override any offscreen styles the source plugin applied
   Object.assign(videoEl.style, {
     position: 'relative',
     top: '0px',
@@ -81,19 +79,19 @@ let cameraStarted = false;
 async function bootstrap() {
   engine = new Engine();
 
-  // Register core/source plugins
+  // Register core/source plugins from the bundled lib
   engine.pluginManager.register(defaultProfilePlugin.id, defaultProfilePlugin);
   engine.pluginManager.register(webcamPlugin.id, webcamPlugin);
 
-  // Load ArtoolkitPlugin ESM from bundled vendor (ensure assets folder is present and served)
+  // Load ArtoolkitPlugin ESM (local vendor or CDN)
   const mod = await import('./vendor/arjs-plugin-artoolkit/arjs-plugin-artoolkit.esm.js');
   const ArtoolkitPlugin = mod.ArtoolkitPlugin || mod.default;
 
   // Set up UI listeners BEFORE enable to avoid missing early 'ready'
   engine.eventBus.on('ar:workerReady', () => {
     log('Worker ready');
     setStatus('Worker ready. You can start the webcam and load the marker.', 'success');
-    loadBtn.disabled = false; // allow loading even before camera (matches minimal example)
+    loadBtn.disabled = false;
   });
   engine.eventBus.on('ar:workerError', (e) => {
     log(`workerError: ${JSON.stringify(e)}`);
@@ -109,13 +107,11 @@ async function bootstrap() {
   await engine.pluginManager.enable(defaultProfilePlugin.id, ctx);
   await engine.pluginManager.enable(webcamPlugin.id, ctx);
 
-  // Create ARToolKit plugin and wire it EXPLICITLY to this engine context
+  // Create ARToolKit plugin and wire it to this engine context
   artoolkit = new ArtoolkitPlugin({
     cameraParametersUrl: '/examples/vite-artoolkit/data/camera_para.dat',
     minConfidence: 0.6,
   });
-
-  // IMPORTANT: bind to engine context so events go to engine.eventBus
   await artoolkit.init(ctx);
   await artoolkit.enable();
 
@@ -129,17 +125,6 @@ async function bootstrap() {
     loadBtn.disabled = false;
   } else {
     setStatus('Plugin initialized. Waiting for worker…', 'normal');
-    // Tiny watchdog in case the ready event is missed due to external wiring
-    const t0 = Date.now();
-    const iv = setInterval(() => {
-      if (artoolkit.workerReady) {
-        loadBtn.disabled = false;
-        setStatus('Worker ready. You can start the webcam and load the marker.', 'success');
-        clearInterval(iv);
-      } else if (Date.now() - t0 > 5000) {
-        clearInterval(iv);
-      }
-    }, 100);
   }
 
   // UI initial state
@@ -223,7 +208,6 @@ async function loadMarker() {
     log('loadMarker failed: ' + (err?.message || err));
     setStatus('Failed to load marker', 'error');
   } finally {
-    // Re-enable for retry/replace
     loadBtn.disabled = false;
   }
 }

src/index.js

@@ -1,16 +1,23 @@
-// Public entry for the AR.js Core library.
-// Re-export the modules you want consumers to import from 'ar.js-core'.
-
-// Core
+// New ECS Core exports
 export { Engine } from './core/engine.js';
-export { PluginManager } from './core/plugin-manager.js';
+export { ECS } from './core/ecs.js';
 export { EventBus } from './core/event-bus.js';
-export * as Components from './core/components.js';
+export { PluginManager } from './core/plugin-manager.js';
+export {
+  COMPONENTS,
+  RESOURCES,
+  EVENTS,
+  CAPTURE_STATES,
+  SOURCE_TYPES,
+  DEVICE_PROFILES,
+  QUALITY_TIERS,
+} from './core/components.js';
 
 // Systems
 export { CaptureSystem } from './systems/capture-system.js';
+export { FramePumpSystem } from './systems/frame-pump-system.js';
 
-// Source plugins
+// Source plugins (exposed for examples/consumers)
 export { webcamPlugin } from '../plugins/source/webcam.js';
 export { videoPlugin } from '../plugins/source/video.js';
 export { imagePlugin } from '../plugins/source/image.js';