@digo-org/digo-api 1.0.50 → 1.0.52

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@digo-org/digo-api",
   "private": false,
-  "version": "1.0.50",
+  "version": "1.0.52",
   "type": "module",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/index.ts

@@ -15,3 +15,5 @@ export * from '@digo-org/digo-api/src/constants';
 export * from '@digo-org/digo-api/src/digo-asset';
 
 export * from '@digo-org/digo-api/src/templates/balls';
+
+export * from '@digo-org/digo-api/src/three-utils';

package/src/templates/balls.tsx

@@ -305,7 +305,7 @@ class X {
   }
 
   dispose() {
-    this.#onResizeCleanup();
+    this.onResizeCleanup();
     this.stopAnimation();
     this.clear();
     this._postprocessing?.dispose();
@@ -313,7 +313,7 @@ class X {
     this.isDisposed = true;
   }
 
-  #onResizeCleanup() {
+  private onResizeCleanup() {
     window.removeEventListener('resize', this.onResize.bind(this));
     this.resizeObserver?.disconnect();
     this.intersectionObserver?.disconnect();
@@ -713,11 +713,11 @@ class Z extends InstancedMesh {
     super(geometry, material, config.count);
     this.config  = config;
     this.physics = new W(config);
-    this.#setupLights();
+    this.setupLights();
     this.setColors(config.colors);
   }
 
-  #setupLights() {
+  private setupLights() {
     this.ambientLight = new AmbientLight(
       this.config.ambientColor,
       this.config.ambientIntensity,

package/src/three-utils.ts

@@ -0,0 +1,39 @@
+import * as THREE              from 'three';
+import { useEffect, useState } from 'react';
+import { useGLTF }             from '@react-three/drei';
+
+function normalizeModel(model: THREE.Group): THREE.Group {
+  const boundingBox = new THREE.Box3().setFromObject(model);
+  const size        = new THREE.Vector3();
+  boundingBox.getSize(size);
+
+  const maxDimension = Math.max(size.x, size.y, size.z);
+  const scale        = 1 / maxDimension;
+
+  model.scale.multiplyScalar(scale);
+
+  return model;
+}
+
+function prepareModel(scene: THREE.Group): THREE.Group {
+  const modelClone = scene.clone();
+  return normalizeModel(modelClone);
+}
+
+export function useModel(url: string | undefined): THREE.Group | undefined {
+  if (!url) return undefined;
+
+  const [model, setModel] = useState<THREE.Group | undefined>(undefined);
+
+  const gltf = url ? useGLTF(url) : undefined;
+
+  useEffect(() => {
+    if (!gltf) return;
+
+    const normalizedModel = prepareModel(gltf.scene);
+
+    setModel(normalizedModel);
+  }, [url]);
+
+  return model;
+}

package/src/types-common.ts

@@ -7,6 +7,7 @@ export enum ParameterType {
   TEXT     = 'TEXT',
   GRADIENT = 'GRADIENT',
   RESOURCE = 'RESOURCE',
+  SELECT   = 'SELECT',
 }
 
 export const PARAMETER_TYPES: ParameterType[] = Object.values(ParameterType);
@@ -18,7 +19,7 @@ export interface Parameter {
   arrayValues?: ParameterValueArray;
 }
 
-export type ParameterDefinition = ParameterNumber | ParameterBoolean | ParameterColor | ParameterText | ParameterGradient | ParameterResource;
+export type ParameterDefinition = ParameterNumber | ParameterBoolean | ParameterColor | ParameterText | ParameterGradient | ParameterResource | ParameterSelect;
 
 export interface ParameterNumber {
   defaultValue:  number;
@@ -54,6 +55,12 @@ export interface ParameterBoolean {
   defaultValue: boolean;
 };
 
+export interface ParameterSelect {
+  defaultValue: string;
+  icon?:        string;
+  options:      Option[];
+};
+
 export type ParameterValue = ParameterValueSingle | ParameterValueArray;
 
 export type ParameterValueSingle = number |  boolean | string | GradientStop[];

package/src/types-misc.ts

@@ -77,4 +77,11 @@ export enum ResourceType {
   CSV   = 'CSV',
   DATA  = 'DATA',
   IMAGE = 'IMAGE',
+  MODEL = 'MODEL',
+}
+
+export interface ResourceInfo {
+  name:        string;
+  icon:        string;
+  description: string;
 }