@needle-tools/engine 4.10.0-next.4f9d92a → 4.10.0-next.870425c

package/CHANGELOG.md

@@ -4,14 +4,19 @@ All notable changes to this package will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-## [4.10.0-beta] - 2025-09-18
+## [4.10.0] - 2025-09-29
+- **NEW**: [**Scrollytelling Bike Example**](https://scrollytelling-bike-z23hmxb2gnu5a.needle.run/) – This example uses ViewBox, FocusRect and ScrollFollow to create a scrollytelling experience. All project files are [available on Github](<https://github.com/needle-engine/needle-engine-bike-scrollytelling>).
 - **NEW**: HoverAnimation component. Use this component to get a scale hover animation of an object when the cursor is hovering over the object or one of it's children.
+- **NEW**: ViewBox component. Use this component to automatically perfectly fit your 3D scene into the camera view. Try the Scrollytelling Example to see it in action, test the [example on Stackblitz](<https://stackblitz.com/edit/needle-engine-view-box-example?file=src%2Fmain.ts>) or see the [ViewBox documentation](<https://engine.needle.tools/docs/api/ViewBox>) for details.
 - Add: `fitCamera` function
-- Add: `<needle-engine poster>` attribute. It works with an URL to an image that should be shown as a poster image. If no URL is assigned then the poster that is automatically generated during the first frame will be used
+- Add: `<needle-engine poster>` attribute. It works with an URL to an image that should be shown as a poster image. If no URL is assigned then the poster that is automatically generated during the first frame will be used.
+- Add: `<needle-engine focus-rect="<html_selector">` attribute. Assign a HTML selector to the attribute to use a specific HTML element on screen offset the 3D camera center to the center of the HTML element. (The same can be done programmatically using `ctx.setCameraFocusRect(<html_element|DOMRect>)`)
+- Add: Timeline [ScrollMarker](<https://engine.needle.tools/docs/api/ScrollMarkerModel>) for Unity and Blender timeline animations to control timing based on HTML visibility.  
 - Fix: Renderer `material` accessing error when component was not yet initialized 
 - Fix: Poster screenshot glitch during the first frame (development only)
+- Fix: HTC Vive Focus 3 controller movement ([forum post](<https://forum.needle.tools/t/movement-via-controller-in-vr-with-htc-vive-focus-3/2718>))
 - Change: Loading display does not show Needle logo anymore by default
-- Change: Use fallback raycast method for lowpoly meshes while BVH is being generated
+- Change: Use fallback raycast method for lowpoly meshes while the faster mesh BVH is being generated
 
 ## [4.9.3] - 2025-09-15
 - Fix: SpriteRenderer index issue when animated where animation precision issue was causing the wrong sprite to be selected ([issue](<https://forum.needle.tools/t/switching-sprite-images-via-timeline-causes-ghosting-glitches-when-exported/2709>))

package/README.md

@@ -63,7 +63,8 @@ npm install @needle-tools/engine
 | [![](https://cdn.needle.tools/static/images/changelog/4.8.8-focus-thumbnail.jpg)](https://responsive-layout-z23hmxb22no6t.needle.run/) | [Camera Focus DIV 1](https://responsive-layout-z23hmxb22no6t.needle.run/) | Responsive layout with camera focus | [Code on Stackblitz](https://stackblitz.com/edit/needle-engine-camera-focus-rect?file=src%2Fsidebar.ts,index.html,src%2Fmain.ts) |
 | [![](https://cdn.needle.tools/static/images/changelog/4.8.8-focus-2-thumbnail.jpg)](https://responsive-layout-click-example-z23hmxbzuyk6y.needle.run/) | [Camera Focus DIV 2](https://responsive-layout-click-example-z23hmxbzuyk6y.needle.run/) | Click-to-move camera focus example | [Code on Stackblitz](https://stackblitz.com/edit/needle-engine-camera-focus-rect-click-to-move?file=index.html,src%2Fmain.ts) |
 | [![](https://cdn.needle.tools/static/images/changelog/fasthdr-thumbnail.jpg?1)](https://fasthdr-needle-engine-zubcks1li2iy.needle.run/) | [FastHDR Loading](https://fasthdr-needle-engine-zubcks1li2iy.needle.run/) | 10x faster than EXR, non-blocking, 95% less GPU memory | [Code on Stackblitz](https://stackblitz.com/edit/needle-fast-hdri-needle-engine) • [Learn more](https://cloud.needle.tools/hdris) |
-| [![](https://cdn.needle.tools/static/images/changelog/scrollytelling-2-thumbnail.jpg)](https://scrollytelling-2-z23hmxby7c6x.needle.run/) | [Scrollytelling Example](https://scrollytelling-2-z23hmxby7c6x.needle.run/) | No-Code example for using browser scroll and cursor to create playful and stunning 3D backgrounds | [Included in Samples Package](https://samples.needle.tools) |
+| [![](https://cdn.needle.tools/static/images/changelog/scrollytelling-2-thumbnail.jpg)](https://scrollytelling-2-z23hmxby7c6x.needle.run/) | [Scrollytelling Example](https://scrollytelling-2-z23hmxby7c6x.needle.run/) | Scroll, physics and cursor interaction: a playful 3D interactive scrollytelling website | [Included in Samples Package](https://samples.needle.tools) |
+| [![](https://cdn.needle.tools/static/images/changelog/scrollytelling-bike-thumbnail.jpg)](https://scrollytelling-bike-z23hmxb2gnu5a.needle.run/) | [Scrollytelling Bike Example](https://scrollytelling-bike-z23hmxb2gnu5a.needle.run/) | Timeline Animation using ScrollFollow, ViewBox and FocusRect | [Project on Github](https://github.com/needle-engine/needle-engine-bike-scrollytelling) |
 | | [AR Restaurant](https://ar-restaurant-example-zubcks1t14le.needle.run/) | Interactive AR restaurant experience | [Code on Github](https://github.com/needle-engine/ar-restaurant-example) |
 | | [Custom Loading Overlay](https://lods-loading-overlay-z23hmxbz29h8vr.needle.run/) | Wait for LODs with custom loading states | [Code on Stackblitz](https://stackblitz.com/edit/needle-engine-wait-for-lods) |
 | | [React Shopping Cart](https://reactshoppingcart-z23hmxbzcfkmf.needle.run/) | E-commerce integration with React | [Code on Stackblitz](https://stackblitz.com/edit/needle-react-shopping-cart-2) |