@ntalmagor/3drize-viewer 0.1.2

package/dist/utils/shaderUtils.js

@@ -0,0 +1,145 @@
+import { Color } from 'three';
+export function update3driseShaderUniforms(uniforms, effects, u_time, pointer) {
+    if (!uniforms)
+        return;
+    if (uniforms.u_time)
+        uniforms.u_time.value = u_time;
+    if (uniforms.u_pointer)
+        uniforms.u_pointer.value = pointer;
+    if (effects.pointer) {
+        const { global, vertex, fragment } = effects.pointer;
+        if (uniforms.uPointerEffectRadius)
+            uniforms.uPointerEffectRadius.value = global.radius;
+        if (uniforms.uRippleEnabled)
+            uniforms.uRippleEnabled.value = vertex.ripple.enabled;
+        if (uniforms.uRippleIntensity)
+            uniforms.uRippleIntensity.value = vertex.ripple.intensity;
+        if (uniforms.uRippleSpeed)
+            uniforms.uRippleSpeed.value = vertex.ripple.speed;
+        if (uniforms.uGeneralRippleFrequency)
+            uniforms.uGeneralRippleFrequency.value = vertex.ripple.frequency;
+        if (uniforms.uDisplacementEnabled)
+            uniforms.uDisplacementEnabled.value = vertex.displacement.enabled;
+        if (uniforms.uDisplacementIntensity)
+            uniforms.uDisplacementIntensity.value = vertex.displacement.intensity;
+        if (uniforms.uScaleEnabled)
+            uniforms.uScaleEnabled.value = vertex.scale.enabled;
+        if (uniforms.uScaleIntensity)
+            uniforms.uScaleIntensity.value = vertex.scale.intensity;
+        if (uniforms.uMinScale)
+            uniforms.uMinScale.value = vertex.scale.minScale;
+        if (uniforms.uMaxScale)
+            uniforms.uMaxScale.value = vertex.scale.maxScale;
+        if (uniforms.uVortexEnabled)
+            uniforms.uVortexEnabled.value = vertex.vortex.enabled;
+        if (uniforms.uVortexIntensity)
+            uniforms.uVortexIntensity.value = vertex.vortex.intensity;
+        if (uniforms.uVortexSpeed)
+            uniforms.uVortexSpeed.value = vertex.vortex.speed;
+        if (uniforms.uWaveEnabled)
+            uniforms.uWaveEnabled.value = vertex.wave.enabled;
+        if (uniforms.uWaveIntensity)
+            uniforms.uWaveIntensity.value = vertex.wave.intensity;
+        if (uniforms.uWaveFrequency)
+            uniforms.uWaveFrequency.value = vertex.wave.frequency;
+        if (uniforms.uGlowEnabled)
+            uniforms.uGlowEnabled.value = fragment.glow.enabled;
+        if (uniforms.uGlowIntensity)
+            uniforms.uGlowIntensity.value = fragment.glow.intensity;
+        if (uniforms.uGlowColor)
+            uniforms.uGlowColor.value = new Color(fragment.glow.color);
+        if (uniforms.uColorShiftEnabled)
+            uniforms.uColorShiftEnabled.value = fragment.colorShift.enabled;
+        if (uniforms.uColorShiftIntensity)
+            uniforms.uColorShiftIntensity.value = fragment.colorShift.intensity;
+        if (uniforms.uColorShiftTarget)
+            uniforms.uColorShiftTarget.value = new Color(fragment.colorShift.targetColor);
+        if (uniforms.uBrightnessEnabled)
+            uniforms.uBrightnessEnabled.value = fragment.brightness.enabled;
+        if (uniforms.uBrightnessIntensity)
+            uniforms.uBrightnessIntensity.value = fragment.brightness.intensity;
+        if (uniforms.uPulseEnabled)
+            uniforms.uPulseEnabled.value = fragment.pulse.enabled;
+        if (uniforms.uPulseIntensity)
+            uniforms.uPulseIntensity.value = fragment.pulse.intensity;
+        if (uniforms.uPulseSpeed)
+            uniforms.uPulseSpeed.value = fragment.pulse.speed;
+        if (uniforms.uPointerGrayscaleEnabled)
+            uniforms.uPointerGrayscaleEnabled.value = fragment.grayscale.enabled;
+        if (uniforms.uPointerGrayscaleIntensity)
+            uniforms.uPointerGrayscaleIntensity.value = fragment.grayscale.intensity;
+        if (uniforms.uPointerGrayscaleContrast)
+            uniforms.uPointerGrayscaleContrast.value = fragment.grayscale.contrast;
+        if (uniforms.uPointerGrayscaleBrightness)
+            uniforms.uPointerGrayscaleBrightness.value = fragment.grayscale.brightness;
+    }
+    if (effects.general) {
+        const { wave, vortex, ripple, grayscale } = effects.general;
+        if (uniforms.uGeneralWaveEnabled)
+            uniforms.uGeneralWaveEnabled.value = wave.enabled;
+        if (uniforms.uGeneralWaveIntensity)
+            uniforms.uGeneralWaveIntensity.value = wave.intensity;
+        if (uniforms.uGeneralWaveFrequency)
+            uniforms.uGeneralWaveFrequency.value = wave.frequency;
+        if (uniforms.uGeneralWaveSpeed)
+            uniforms.uGeneralWaveSpeed.value = wave.speed;
+        if (uniforms.uGeneralWaveDirection) {
+            uniforms.uGeneralWaveDirection.value =
+                wave.direction === 'horizontal' ? 0.0 :
+                    wave.direction === 'vertical' ? 1.0 : 2.0;
+        }
+        if (uniforms.uGeneralVortexEnabled)
+            uniforms.uGeneralVortexEnabled.value = vortex.enabled;
+        if (uniforms.uGeneralVortexIntensity)
+            uniforms.uGeneralVortexIntensity.value = vortex.intensity;
+        if (uniforms.uGeneralVortexSpeed)
+            uniforms.uGeneralVortexSpeed.value = vortex.speed;
+        if (uniforms.uGeneralVortexCenterX)
+            uniforms.uGeneralVortexCenterX.value = vortex.centerX;
+        if (uniforms.uGeneralVortexCenterY)
+            uniforms.uGeneralVortexCenterY.value = vortex.centerY;
+        if (uniforms.uGeneralRippleEnabled)
+            uniforms.uGeneralRippleEnabled.value = ripple.enabled;
+        if (uniforms.uGeneralRippleIntensity)
+            uniforms.uGeneralRippleIntensity.value = ripple.intensity;
+        if (uniforms.uGeneralRippleFrequency)
+            uniforms.uGeneralRippleFrequency.value = ripple.frequency;
+        if (uniforms.uGeneralRippleSpeed)
+            uniforms.uGeneralRippleSpeed.value = ripple.speed;
+        if (uniforms.uGeneralRippleCenterX)
+            uniforms.uGeneralRippleCenterX.value = ripple.centerX;
+        if (uniforms.uGeneralRippleCenterY)
+            uniforms.uGeneralRippleCenterY.value = ripple.centerY;
+        if (uniforms.uGeneralGrayscaleEnabled)
+            uniforms.uGeneralGrayscaleEnabled.value = grayscale.enabled;
+        if (uniforms.uGeneralGrayscaleMode) {
+            uniforms.uGeneralGrayscaleMode.value =
+                grayscale.mode === 'static' ? 0.0 :
+                    grayscale.mode === 'wave' ? 1.0 :
+                        grayscale.mode === 'pulse' ? 2.0 : 3.0;
+        }
+        if (uniforms.uGeneralGrayscaleIntensity)
+            uniforms.uGeneralGrayscaleIntensity.value = grayscale.intensity;
+        if (uniforms.uGeneralGrayscaleContrast)
+            uniforms.uGeneralGrayscaleContrast.value = grayscale.contrast;
+        if (uniforms.uGeneralGrayscaleBrightness)
+            uniforms.uGeneralGrayscaleBrightness.value = grayscale.brightness;
+        if (uniforms.uGeneralGrayscaleWaveFreq)
+            uniforms.uGeneralGrayscaleWaveFreq.value = grayscale.waveFrequency;
+        if (uniforms.uGeneralGrayscaleWaveSpeed)
+            uniforms.uGeneralGrayscaleWaveSpeed.value = grayscale.waveSpeed;
+        if (uniforms.uGeneralGrayscaleWaveDir) {
+            uniforms.uGeneralGrayscaleWaveDir.value =
+                grayscale.waveDirection === 'horizontal' ? 0.0 :
+                    grayscale.waveDirection === 'vertical' ? 1.0 : 2.0;
+        }
+        if (uniforms.uGeneralGrayscalePulseSpeed)
+            uniforms.uGeneralGrayscalePulseSpeed.value = grayscale.pulseSpeed;
+        if (uniforms.uGeneralGrayscaleRippleSpeed)
+            uniforms.uGeneralGrayscaleRippleSpeed.value = grayscale.rippleSpeed;
+        if (uniforms.uGeneralGrayscaleRippleCenterX)
+            uniforms.uGeneralGrayscaleRippleCenterX.value = grayscale.rippleCenterX;
+        if (uniforms.uGeneralGrayscaleRippleCenterY)
+            uniforms.uGeneralGrayscaleRippleCenterY.value = grayscale.rippleCenterY;
+    }
+}

package/dist/utils/textEffects.d.ts

@@ -0,0 +1,31 @@
+import type { TextEffect, TextEffectType } from '@ntalmagor/3drize-core';
+export interface TextEffectState {
+    typewriterIndex: number;
+    lastTypewriterTime: number;
+}
+export declare const createTextEffectState: () => TextEffectState;
+export declare const getEffect: (effects: TextEffect[], type: TextEffectType) => TextEffect | undefined;
+export declare const hasEnabledEffects: (effects: TextEffect[]) => boolean;
+export declare const getTypewriterText: (fullText: string, effect: TextEffect, time: number, _state: TextEffectState) => {
+    displayText: string;
+    showCursor: boolean;
+};
+export declare const getNeonProps: (effect: TextEffect) => {
+    outlineWidth: number;
+    outlineColor: string;
+    outlineBlur: number;
+};
+export declare const getShadowProps: (effect: TextEffect) => {
+    outlineWidth: number;
+    outlineOffsetX: number;
+    outlineOffsetY: number;
+    outlineColor: string;
+    outlineBlur: number;
+};
+export declare const getGlowProps: (effect: TextEffect) => {
+    outlineWidth: number;
+    outlineColor: string;
+    outlineBlur: number;
+};
+export declare const getTextEffectProps: (effects: TextEffect[]) => Record<string, unknown>;
+//# sourceMappingURL=textEffects.d.ts.map

package/dist/utils/textEffects.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textEffects.d.ts","sourceRoot":"","sources":["../../src/utils/textEffects.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEzE,MAAM,WAAW,eAAe;IAC9B,eAAe,EAAE,MAAM,CAAC;IACxB,kBAAkB,EAAE,MAAM,CAAC;CAC5B;AAED,eAAO,MAAM,qBAAqB,QAAO,eAGvC,CAAC;AAEH,eAAO,MAAM,SAAS,GAAI,SAAS,UAAU,EAAE,EAAE,MAAM,cAAc,KAAG,UAAU,GAAG,SACpC,CAAC;AAElD,eAAO,MAAM,iBAAiB,GAAI,SAAS,UAAU,EAAE,KAAG,OAC5B,CAAC;AAE/B,eAAO,MAAM,iBAAiB,GAC5B,UAAU,MAAM,EAChB,QAAQ,UAAU,EAClB,MAAM,MAAM,EACZ,QAAQ,eAAe,KACtB;IAAE,WAAW,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,OAAO,CAAA;CAsB5C,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,QAAQ,UAAU;;;;CAI9C,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,QAAQ,UAAU;;;;;;CAYhD,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,QAAQ,UAAU;;;;CAI9C,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,SAAS,UAAU,EAAE,KAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAWhF,CAAC"}

package/dist/utils/textEffects.js

@@ -0,0 +1,61 @@
+export const createTextEffectState = () => ({
+    typewriterIndex: 0,
+    lastTypewriterTime: 0,
+});
+export const getEffect = (effects, type) => effects.find(e => e.type === type && e.enabled);
+export const hasEnabledEffects = (effects) => effects.some(e => e.enabled);
+export const getTypewriterText = (fullText, effect, time, _state) => {
+    const delay = (effect.options?.delay ?? 100) / 1000;
+    const loop = effect.options?.loop ?? false;
+    const cursor = effect.options?.cursor ?? true;
+    const cursorChar = effect.options?.cursorChar ?? '|';
+    const speed = effect.speed ?? 1;
+    const charIndex = Math.floor(time * speed / delay);
+    const totalLength = fullText.length;
+    let currentIndex;
+    if (loop) {
+        const cycleLength = totalLength + 10;
+        currentIndex = Math.min(charIndex % cycleLength, totalLength);
+    }
+    else {
+        currentIndex = Math.min(charIndex, totalLength);
+    }
+    const displayText = fullText.slice(0, currentIndex);
+    const showCursor = cursor && (currentIndex < totalLength || (loop && Math.floor(time * 2) % 2 === 0));
+    return { displayText: showCursor ? displayText + cursorChar : displayText, showCursor };
+};
+export const getNeonProps = (effect) => {
+    const glowColor = effect.options?.glowColor ?? '#00ffff';
+    const glowIntensity = (effect.options?.glowIntensity ?? 0.02) * (effect.intensity ?? 1);
+    return { outlineWidth: glowIntensity, outlineColor: glowColor, outlineBlur: glowIntensity * 0.5 };
+};
+export const getShadowProps = (effect) => {
+    const shadowColor = effect.options?.shadowColor ?? '#000000';
+    const shadowOffset = effect.options?.shadowOffset ?? [0.02, -0.02];
+    const shadowBlur = effect.options?.shadowBlur ?? 0.01;
+    const intensity = effect.intensity ?? 1;
+    return {
+        outlineWidth: 0,
+        outlineOffsetX: shadowOffset[0] * intensity,
+        outlineOffsetY: shadowOffset[1] * intensity,
+        outlineColor: shadowColor,
+        outlineBlur: shadowBlur * intensity,
+    };
+};
+export const getGlowProps = (effect) => {
+    const glowColor = effect.options?.glowColor ?? '#ffffff';
+    const glowIntensity = (effect.options?.glowIntensity ?? 0.02) * (effect.intensity ?? 1);
+    return { outlineWidth: glowIntensity, outlineColor: glowColor, outlineBlur: glowIntensity * 0.8 };
+};
+export const getTextEffectProps = (effects) => {
+    const neonEffect = getEffect(effects, 'neon');
+    if (neonEffect)
+        return getNeonProps(neonEffect);
+    const glowEffect = getEffect(effects, 'glow');
+    if (glowEffect)
+        return getGlowProps(glowEffect);
+    const shadowEffect = getEffect(effects, 'shadow');
+    if (shadowEffect)
+        return getShadowProps(shadowEffect);
+    return {};
+};

package/dist/utils/utils3d.d.ts

@@ -0,0 +1,7 @@
+import type { AnchorSettings, Vector3Array } from '@ntalmagor/3drize-core';
+import { CatmullRomCurve3, Vector3 } from 'three';
+export { createSunPosition } from '@ntalmagor/3drize-core';
+export declare const applyAnchorSettings: (anchor: AnchorSettings | null, object: any, initialRotation?: Vector3Array) => void;
+export declare const createCurves: (paths?: number[][] | null, pointsPaths?: Vector3[][] | null) => CatmullRomCurve3[];
+export declare const randomRange: (min: number, max: number) => number;
+//# sourceMappingURL=utils3d.d.ts.map

package/dist/utils/utils3d.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils3d.d.ts","sourceRoot":"","sources":["../../src/utils/utils3d.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGlD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE3D,eAAO,MAAM,mBAAmB,GAC9B,QAAQ,cAAc,GAAG,IAAI,EAC7B,QAAQ,GAAG,EACX,kBAAiB,YAAwB,SAoB1C,CAAC;AAEF,eAAO,MAAM,YAAY,GACvB,QAAQ,MAAM,EAAE,EAAE,GAAG,IAAI,EACzB,cAAc,OAAO,EAAE,EAAE,GAAG,IAAI,KAC/B,gBAAgB,EAgBlB,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,KAAK,MAAM,EAAE,KAAK,MAAM,KAAG,MACpB,CAAC"}

package/dist/utils/utils3d.js

@@ -0,0 +1,34 @@
+import { CatmullRomCurve3, Vector3 } from 'three';
+import { cameraManager } from './CameraSingleton';
+export { createSunPosition } from '@ntalmagor/3drize-core';
+export const applyAnchorSettings = (anchor, object, initialRotation = [0, 0, 0]) => {
+    if (!anchor || !anchor.enabled)
+        return;
+    if (anchor.fixedPosition && object) {
+        const anchoredPosition = cameraManager.getAnchorPosition(anchor.anchor || 'center', 0, anchor?.offset || { y: 0, x: 0, z: 0 }, anchor?.padding || 0);
+        object.position.set(anchoredPosition.x, anchoredPosition.y, anchoredPosition.z);
+    }
+    if (anchor.fixedRotation && object) {
+        const cameraRotation = cameraManager.getRotation();
+        object.rotation.set(cameraRotation.x + initialRotation[0], cameraRotation.y + initialRotation[1], cameraRotation.z + initialRotation[2]);
+    }
+};
+export const createCurves = (paths, pointsPaths) => {
+    const curves = [];
+    if (paths && paths.length > 0) {
+        paths.forEach((path) => {
+            const points = [];
+            for (let i = 0; i < path.length; i += 3) {
+                points.push(new Vector3(path[i], path[i + 1], path[i + 2]));
+            }
+            curves.push(new CatmullRomCurve3(points));
+        });
+    }
+    else if (pointsPaths && pointsPaths.length > 0) {
+        pointsPaths.forEach((points) => {
+            curves.push(new CatmullRomCurve3(points));
+        });
+    }
+    return curves;
+};
+export const randomRange = (min, max) => Math.random() * (max - min) + min;

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@ntalmagor/3drize-viewer",
+  "version": "0.1.2",
+  "private": false,
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc --build",
+    "dev": "tsc --build --watch",
+    "clean": "rimraf dist",
+    "pub": "npm version patch && npm run build && npm publish --access public"
+  },
+  "peerDependencies": {
+    "@ntalmagor/3drize-core": "*",
+    "@react-three/drei": "^10",
+    "@react-three/fiber": "^9",
+    "@reduxjs/toolkit": "^2",
+    "react": "^18 || ^19",
+    "react-redux": "^9",
+    "three": "^0.170"
+  },
+  "devDependencies": {
+    "@ntalmagor/3drize-core": "*",
+    "@react-three/drei": "^10.0.0",
+    "@react-three/fiber": "^9.0.0",
+    "@reduxjs/toolkit": "^2.6.1",
+    "react": "^19.0.0",
+    "@types/react": "^19.0.0",
+    "react-redux": "^9.2.0",
+    "three": "^0.170.0",
+    "typescript": "^5.7.2"
+  }
+}