storysplat-viewer 0.1.21 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -17,6 +17,7 @@ export declare class CameraManager {
17
17
  private _isMobile;
18
18
  navigationManager: NavigationManager;
19
19
  private _analyticsManager;
20
+ onCameraModeChange?: (mode: CameraMode) => void;
20
21
  constructor(canvas: HTMLCanvasElement, scene: Scene, data: StorySplatData, options?: ViewerOptions, // Correct options parameter
21
22
  analyticsManager?: AnalyticsManager);
22
23
  get camera(): UniversalCamera | null;
@@ -0,0 +1,34 @@
1
+ import { Scene } from "@babylonjs/core/scene";
2
+ import { Camera } from "@babylonjs/core/Cameras/camera";
3
+ import * as BABYLON from "@babylonjs/core";
4
+ import { ViewerData } from "../types/dataTypes";
5
+ import { Hotspot } from "../types/hotspotTypes";
6
+ export interface CustomScriptAPI {
7
+ scene: Scene;
8
+ camera: Camera;
9
+ BABYLON: typeof BABYLON;
10
+ canvas: HTMLCanvasElement;
11
+ getScrollPercentage: () => number;
12
+ getCurrentWaypointIndex: () => number;
13
+ getHotspots: () => Hotspot[];
14
+ getHTMLMeshes: () => any[];
15
+ getSplats: () => any[];
16
+ }
17
+ export declare class CustomScriptManager {
18
+ private scene;
19
+ private camera;
20
+ private customScript;
21
+ private scriptCleanup;
22
+ private isInitialized;
23
+ private scrollPercentage;
24
+ private currentWaypointIndex;
25
+ private hotspots;
26
+ private htmlMeshes;
27
+ constructor(scene: Scene, data?: ViewerData);
28
+ setCamera(camera: Camera): void;
29
+ updateScrollPercentage(percentage: number): void;
30
+ updateCurrentWaypointIndex(index: number): void;
31
+ execute(): void;
32
+ private cleanup;
33
+ dispose(): void;
34
+ }
@@ -0,0 +1,23 @@
1
+ import { Scene } from "@babylonjs/core/scene";
2
+ import { HtmlMesh } from "@babylonjs/addons";
3
+ import { HTMLMesh } from "../types/htmlMeshTypes";
4
+ export declare class HTMLMeshManager {
5
+ private scene;
6
+ private renderer;
7
+ private babylonMeshes;
8
+ private meshes;
9
+ private onMeshClick?;
10
+ constructor(scene: Scene, onMeshClick?: (meshId: string) => void);
11
+ private initializeRenderer;
12
+ createHTMLMesh(meshData: HTMLMesh): void;
13
+ private createHTMLElement;
14
+ private createFormElement;
15
+ private applyElementStyles;
16
+ private mapFitStrategy;
17
+ createAllHTMLMeshes(htmlMeshesData: HTMLMesh[]): void;
18
+ updateHTMLMesh(meshId: string, updates: Partial<HTMLMesh>): void;
19
+ deleteHTMLMesh(meshId: string): void;
20
+ getHTMLMesh(meshId: string): HtmlMesh | undefined;
21
+ getAllHTMLMeshes(): HTMLMesh[];
22
+ dispose(): void;
23
+ }
@@ -142,5 +142,9 @@ export declare class NavigationManager {
142
142
  getTargetRotation(): Quaternion;
143
143
  /** Called by external systems (like RenderLoopManager) to indicate interpolation can stop. */
144
144
  markInterpolationComplete(): void;
145
+ /** Gets the current scroll progress as a percentage (0-1). */
146
+ getScrollProgress(): number;
147
+ /** Gets the current waypoint index based on scroll position. */
148
+ getCurrentWaypointIndex(): number;
145
149
  dispose(): void;
146
150
  }
@@ -9,6 +9,7 @@ import { Waypoint } from './types/navigationTypes';
9
9
  import { CameraManager } from './core/cameraManager';
10
10
  import { NavigationManager } from './features/navigationManager';
11
11
  import { SplatSwapManager } from './features/splatSwapManager';
12
+ import { CustomScriptManager } from './features/customScriptManager';
12
13
  export * from './types';
13
14
  export { Viewer } from './viewer';
14
15
  export interface ViewerInstance {
@@ -19,6 +20,7 @@ export interface ViewerInstance {
19
20
  cameraManager: CameraManager;
20
21
  navigationManager: NavigationManager;
21
22
  splatSwapManager: SplatSwapManager | undefined;
23
+ customScriptManager: CustomScriptManager | undefined;
22
24
  getHotspotData: (id: string | number) => Hotspot | undefined;
23
25
  getWaypointData: (name: string) => Waypoint | undefined;
24
26
  setCameraMode: (mode: CameraMode) => void;
@@ -195,6 +195,7 @@ export interface StorySplatData {
195
195
  splatScale?: number;
196
196
  invertXScale?: boolean;
197
197
  invertYScale?: boolean;
198
+ customScript?: string;
198
199
  }
199
200
  export interface UIOptionsData {
200
201
  infoPosition?: "controls" | "corner" | string;
@@ -0,0 +1,121 @@
1
+ import { ViewerOptions } from "../types/viewerOptions";
2
+ import { PreloaderUI } from "./preloader";
3
+ import { AudioManager } from "../features/audioManager";
4
+ import { NavigationManager } from "../features/navigationManager";
5
+ import { CameraManager } from "../core/cameraManager";
6
+ /**
7
+ * Manages UI layout templates for the StorySplat viewer
8
+ * Renders different UI layouts based on the uiType from scene JSON
9
+ */
10
+ export declare class TemplateManager {
11
+ private targetElement;
12
+ private options;
13
+ private uiType;
14
+ private preloaderUI;
15
+ private startButtonUI;
16
+ private watermarkUI;
17
+ private helpPanelUI;
18
+ private muteButtonUI;
19
+ private controlsContainer;
20
+ private modeToggleContainer;
21
+ private progressContainer;
22
+ private navigationContainer;
23
+ constructor(targetElement: HTMLElement, options: ViewerOptions);
24
+ /**
25
+ * Initialize UI components based on template type
26
+ */
27
+ initializeUI(audioManager: AudioManager | null, navigationManager: NavigationManager | null, cameraManager: CameraManager | null, onStartExperience?: () => void): Promise<void>;
28
+ /**
29
+ * Create base UI components common to all templates
30
+ */
31
+ private createBaseComponents;
32
+ /**
33
+ * Apply Minimal template layout (overlay controls)
34
+ */
35
+ private applyMinimalTemplate;
36
+ /**
37
+ * Apply Standard template layout (bottom navigation)
38
+ */
39
+ private applyStandardTemplate;
40
+ /**
41
+ * Apply Pro template layout (enhanced bottom navigation)
42
+ */
43
+ private applyProTemplate;
44
+ /**
45
+ * Helper to determine if mode toggle should be shown
46
+ */
47
+ private shouldShowModeToggle;
48
+ /**
49
+ * Create minimal overlay controls
50
+ */
51
+ private createMinimalControls;
52
+ /**
53
+ * Create standard bottom controls
54
+ */
55
+ private createStandardControls;
56
+ /**
57
+ * Create pro enhanced controls
58
+ */
59
+ private createProControls;
60
+ /**
61
+ * Create minimal mode toggle
62
+ */
63
+ private createMinimalModeToggle;
64
+ /**
65
+ * Create standard mode toggle
66
+ */
67
+ private createStandardModeToggle;
68
+ /**
69
+ * Create pro mode toggle (left side)
70
+ */
71
+ private createProModeToggle;
72
+ /**
73
+ * Create pro waypoint info display
74
+ */
75
+ private createProWaypointInfo;
76
+ /**
77
+ * Helper to create navigation buttons
78
+ */
79
+ private createNavButton;
80
+ /**
81
+ * Connect navigation controls to NavigationManager
82
+ */
83
+ private connectNavigationControls;
84
+ /**
85
+ * Apply minimal template styles
86
+ */
87
+ private applyMinimalStyles;
88
+ /**
89
+ * Apply standard template styles
90
+ */
91
+ private applyStandardStyles;
92
+ /**
93
+ * Apply pro template styles
94
+ */
95
+ private applyProStyles;
96
+ /**
97
+ * Update progress display
98
+ */
99
+ updateProgress(percentage: number): void;
100
+ /**
101
+ * Get preloader UI instance (for direct access if needed)
102
+ */
103
+ getPreloaderUI(): PreloaderUI | null;
104
+ /**
105
+ * Show/hide preloader
106
+ */
107
+ showPreloader(): void;
108
+ hidePreloader(): void;
109
+ /**
110
+ * Update preloader progress
111
+ */
112
+ updatePreloaderProgress(percentage: number, text?: string): void;
113
+ /**
114
+ * Update mode toggle button states
115
+ */
116
+ private updateModeToggleState;
117
+ /**
118
+ * Clean up and dispose
119
+ */
120
+ dispose(): void;
121
+ }
@@ -101,5 +101,13 @@ export declare class Viewer {
101
101
  * Get the underlying ViewerInstance (for advanced usage)
102
102
  */
103
103
  getInstance(): ViewerInstance | null;
104
+ /**
105
+ * Execute custom script in the viewer
106
+ */
107
+ executeCustomScript(script?: string): void;
108
+ /**
109
+ * Update custom script state (scroll percentage, waypoint index)
110
+ */
111
+ updateCustomScriptState(scrollPercentage?: number, waypointIndex?: number): void;
104
112
  }
105
113
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "storysplat-viewer",
3
- "version": "0.1.21",
3
+ "version": "0.2.0",
4
4
  "description": "A viewer component for StorySplat scenes.",
5
5
  "main": "dist/esm/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -15,7 +15,10 @@
15
15
  "test:build-watch": "npm run build && concurrently \"npm run dev\" \"npm run test:serve\"",
16
16
  "test": "npm run build && npm run test:serve",
17
17
  "test:python": "npm run build && python3 test/simple-server.py",
18
- "test:open": "npm run build && open http://localhost:8080/test/index.html && npm run test:serve"
18
+ "test:open": "npm run build && open http://localhost:8080/test/index.html && npm run test:serve",
19
+ "docs:serve": "bash scripts/serve-docs.sh",
20
+ "docs:build": "bash scripts/build-docs.sh",
21
+ "docs:deploy": "bash scripts/deploy-docs.sh"
19
22
  },
20
23
  "devDependencies": {
21
24
  "@babylonjs/core": "^8.4.1",