three-zoo 0.5.1 → 0.5.3

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.
Files changed (2) hide show
  1. package/README.md +52 -58
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -1,4 +1,9 @@
1
- # 🦁 three-zoo
1
+ <p align="center">
2
+ <h1 align="center">🦁 three-zoo</h1>
3
+ <p align="center">
4
+ A modest collection of Three.js utilities designed to simplify common 3D development tasks.
5
+ </p>
6
+ </p>
2
7
 
3
8
  <p align="center">
4
9
  <a href="https://www.npmjs.com/package/three-zoo"><img src="https://img.shields.io/npm/v/three-zoo.svg" alt="npm version"></a>
@@ -8,117 +13,106 @@
8
13
  <a href="https://threejs.org/"><img src="https://img.shields.io/badge/Three.js-%5E0.175.0-green" alt="Three.js"></a>
9
14
  </p>
10
15
 
11
- A modest collection of Three.js utilities designed to simplify common 3D development tasks.
16
+ ## Features
12
17
 
13
- ## 📦 Install
18
+ - 📷 **DualFovCamera** - Independent horizontal and vertical FOV control with auto-fitting
19
+ - ☀️ **Sun** - Intuitive spherical positioning for directional lights with HDR integration
20
+ - 🔍 **SceneTraversal** - Find and manipulate objects and materials in scene graphs
21
+ - 🎭 **SkinnedMeshBaker** - Convert animated meshes to static geometry
22
+
23
+ ## Installation
14
24
 
15
25
  ```bash
16
26
  npm install three-zoo
17
27
  ```
18
28
 
19
- ## 🎯 Overview
20
-
21
- **three-zoo** provides focused solutions for recurring challenges in 3D web development:
22
-
23
- - **Advanced camera controls** with independent FOV management and auto-fitting
24
- - **Intuitive lighting** with spherical positioning and HDR integration
25
- - **Scene graph utilities** for finding and manipulating objects and materials
26
- - **Animation baking** to convert skinned meshes to static geometry
27
-
28
- Each utility is designed to work seamlessly with existing Three.js workflows without imposing architectural constraints.
29
-
30
- ## 🛠️ Tools
29
+ ## DualFovCamera
31
30
 
32
- ### 📷 DualFovCamera
33
-
34
- Camera with independent horizontal and vertical field of view control, plus advanced fitting capabilities:
31
+ Advanced camera with independent horizontal and vertical field of view:
35
32
 
36
33
  ```typescript
37
- const camera = new DualFovCamera(90, 60); // hFov, vFov
38
- camera.horizontalFov = 100; // Change horizontal FOV
39
- camera.verticalFov = 70; // Change vertical FOV
34
+ const camera = new DualFovCamera(90, 60);
35
+
36
+ // Independent FOV control
37
+ camera.horizontalFov = 100;
38
+ camera.verticalFov = 70;
40
39
 
41
- // Automatically adjust FOV to fit objects
40
+ // Auto-fit objects in view
42
41
  camera.fitVerticalFovToPoints(vertices);
43
42
  camera.fitVerticalFovToBox(boundingBox);
44
43
  camera.fitVerticalFovToMesh(skinnedMesh);
45
44
 
46
- // Point camera at mesh center of mass
45
+ // Smart camera positioning
47
46
  camera.lookAtMeshCenterOfMass(skinnedMesh);
48
-
49
- // Get actual FOV after aspect ratio calculations
50
- const actualHFov = camera.getActualHorizontalFov();
51
- const actualVFov = camera.getActualVerticalFov();
52
47
  ```
53
48
 
54
- ### ☀️ Sun
49
+ ## Sun
55
50
 
56
- Directional light with intuitive spherical positioning and automatic shadow configuration:
51
+ Directional light with spherical positioning:
57
52
 
58
53
  ```typescript
59
54
  const sun = new Sun();
60
55
 
61
- // Spherical positioning
56
+ // Spherical coordinates
62
57
  sun.elevation = Math.PI / 4; // 45° above horizon
63
58
  sun.azimuth = Math.PI / 2; // 90° rotation
64
59
  sun.distance = 100; // Distance from origin
65
60
 
66
- // Automatically configure shadows for optimal coverage
61
+ // Automatic shadow configuration
67
62
  sun.configureShadowsForBoundingBox(sceneBounds);
68
63
 
69
- // Position sun based on brightest point in HDR environment map
64
+ // Position from HDR environment map
70
65
  sun.setDirectionFromHDRTexture(hdrTexture, 50);
71
66
  ```
72
67
 
73
- ### 🔍 SceneTraversal
68
+ ## SceneTraversal
74
69
 
75
- Scene graph navigation and batch operations for finding and manipulating objects:
70
+ Navigate and manipulate Three.js scene graphs:
76
71
 
77
72
  ```typescript
78
- // Find objects and materials by name
79
- const obj = SceneTraversal.getObjectByName(scene, 'player');
80
- const material = SceneTraversal.getMaterialByName(scene, 'metal');
73
+ // Find by name
74
+ const player = SceneTraversal.getObjectByName(scene, 'Player');
75
+ const metal = SceneTraversal.getMaterialByName(scene, 'MetalMaterial');
81
76
 
82
- // Filter with patterns or custom functions
77
+ // Filter with patterns
83
78
  const enemies = SceneTraversal.filterObjects(scene, /^enemy_/);
84
- const glassMaterials = SceneTraversal.filterMaterials(scene, /glass/i);
79
+ const glassMats = SceneTraversal.filterMaterials(scene, /glass/i);
85
80
 
86
- // Find objects that use specific materials
87
- const meshesWithGlass = SceneTraversal.findMaterialUsers(scene, /glass/i);
81
+ // Find material users
82
+ const glassObjects = SceneTraversal.findMaterialUsers(scene, /glass/i);
88
83
 
89
- // Batch operations on specific object types
90
- SceneTraversal.enumerateObjectsByType(scene, Mesh, (mesh) => {
91
- mesh.castShadow = true;
92
- });
93
-
94
- // Process all materials in the scene
84
+ // Batch operations
95
85
  SceneTraversal.enumerateMaterials(scene, (material) => {
96
86
  if ('roughness' in material) material.roughness = 0.8;
97
87
  });
98
88
  ```
99
89
 
100
- ### 🎭 SkinnedMeshBaker
90
+ ## SkinnedMeshBaker
101
91
 
102
- Converts animated skinned meshes to static geometry:
92
+ Convert animated meshes to static geometry:
103
93
 
104
94
  ```typescript
105
- // Bake current pose to static mesh
95
+ // Bake current pose
106
96
  const staticMesh = SkinnedMeshBaker.bakePose(skinnedMesh);
107
97
 
108
98
  // Bake specific animation frame
109
99
  const frameMesh = SkinnedMeshBaker.bakeAnimationFrame(
110
- armature, // Root object with bones
111
- skinnedMesh, // Mesh to bake
112
- 1.5, // Time in seconds
113
- animationClip // Animation to sample
100
+ armature,
101
+ skinnedMesh,
102
+ 1.5, // Time in seconds
103
+ animationClip
114
104
  );
115
105
  ```
116
106
 
117
- ## Requirements
107
+ ## Requirements
118
108
 
119
- - Three.js >= 0.150.0
109
+ - Three.js ^0.175.0 (peer dependency)
120
110
  - TypeScript support included
121
111
 
122
- ## 📄 License
112
+ ## Contributing
113
+
114
+ Contributions are welcome! Please feel free to submit issues and pull requests.
115
+
116
+ ## License
123
117
 
124
- MIT
118
+ MIT © [jango](https://github.com/jango-git)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "three-zoo",
3
- "version": "0.5.1",
3
+ "version": "0.5.3",
4
4
  "description": "Some reusable bits for building things with Three.js ",
5
5
  "scripts": {
6
6
  "clean": "rm -rf dist",