v0.3.0-alpha.8
This includes updates from v0.3.0-alpha.4
to v0.3.0-alpha.8
Get them while they're hot!
Features
- feat (from alpha.2): add the
VisualLayers
class adapted from my work at https://discourse.threejs.org/t/multiple-scenes-vs-layers/12503/34. We will soon use this to implement a declarative way for specifying visual layers in HTML markup. bdac4ee - feat: add a
center-geometry
boolean attribute to<lume-gltf-model>
that whentrue
centers all of the model's geometry at the origin. f1a2856 - feat: add an interactive boolean attribute to
<camera-rig>
that whenfalse
disables user interaction, useful for non-interative positioning of a camera using acamera-rig
as the positioning mechanism. 76da7ed - feat: add
fogMode
,fogNear
,fogFar
, andfogColor
attributes to<lume-scene>
to set a visual fog. 18fe01a - feat: add a
.fogDensity
property to Scene to configure fog density withfogMode
isexpo2
. 3e45dd0 - feat:
cameraNear
andcameraFar
properties to control the near and far of aScene
's default camera. e24cdb7 - feat: Pass a second argument to render tasks containing the delta time for convenience. 0051a78
- feat: add a
.swapLayers
property toScene
to allow the CSS layer to be rendered below the WebGL layer. 762704f - feat: feat: initial
<lume-instanced-mesh>
element. We are able to supply instance positions, rotations, and colors via
properties or attributes of those names, each taking an array of numbers. Attributes accept a string of comma-separated number triplets such asposition="1 2 3, 4 5 6, 7 8 9"
with each triplet being an X, Y and Z value. ec85416 20b9906
Fixes
- fix: don't forget to remove
ScrollFling
's andFlingRotation
's render tasks (i.e. terminate any animations) onstop()
. ded9fe2 - fix: disconnected children were not having their three object removed from rendering. 21f40de
- fix: Firefox has the older version of ResizeObserver without the arrays of size values for column layouts, so LUME was broken in Firefox. Adds a fallback to the non-array contentBoxSize value. 97de8f8
- fix: improve Scene's shadow DOM so that absolutely nothing in there can be interacted with, i.e. no pointer events, etc (it is implementation detail for rendering only). 84762e1
BREAKING CHANGES:
- breaking: A
FlingRotation
instance no longer automatically starts on construction; thestart()
method should be called manually after instantiation. 8a1b4b7 - feat / breaking: ShadowDOM composition edge case bugs are fixed, and thus it is finally and officially fully supported, plus new DOM traversal APIs! See more info below. 23033d2 aa25085
- breaking: all Solid.js dependencies updated to v1.0. This may make newer elements incompatible with older elements due to underlying differing compilation outputs depending on different Solid runtimes for HTML/JSX template functionality. 598d1b5 9056944
feat/breaking: ShadowDOM composition edge case bugs are fixed, plus a few new APIs.
Massive cleanup:
Factor out some old code from a few years back, making the tree structure
easier to understand and less error prone. This allowed us to make more sense
of the ShadowDOM composition stuff and to be able to finally polish the
remaining rough edges. 🎉
BREAKING CHANGES:
To clean up the code and finish ShadowDOM composition, we removed some APIs:
- Removed the TreeNode APIs
add
,addChildren
,removeNode
,
removeChildren
,removeAllChildren
,childCount
,subnodes
, and
parent
. You must now simply use the actual DOM APIs likeappend
,
appendChild
,remove
,removeChild
,parentElement
,children
, etc. - Removed
Scene.mount()
andScene.unmount()
. Just use regular DOM APIs to
append or remove aScene
from the DOM.
Unrelated to ShadowDOM composition, we cleaned up some other things too:
- Removed the old
imperativeCounterpart
property. - Renamed
_render()
toupdate()
because it is called from the outside in
theMotor
class.
The stuff we removed existed for two reasons:
- The TreeNode APIs (
add
,removeChild
, etc) existed from before we were
using Custom Elements, just plain JS objects, so we needed our own tree API
in order to create our scene graph - When we added support for Custom Elements, we initially had two trees, the
DOM tree and our own scene graph tree. Our tree had all the logic and the
DOM tree was merely an interface that proxied data to/from our tree. The
idea was that a plain JS user could use our tree APIs in non-DOM
environments, and DOM users could use the custom element tree. We have since
merged the two trees so our LUME objects are also the custom elements
themselves. With removal of our old TreeNode APIs, we can later support
non-DOM environments by instead polyfilling some of the DOM tree APIs as
needed in those environments.
Other new features:
feat: Added new APIs that are LUME-specific and complementary to DOM APIs:
.lumeParent
- Get the parent element of the current LUME element only if
the parent is a LUME element. Returns null if there is no DOM parent, or if
the DOM parent is not a LUME element..lumeChildren
- Get the child LUME elements of the current LUME element.
This ignores any DOM children that are not LUME elements; those elements will
not be included in the result array..lumeChildCount
- Get the count of child LUME elements of the current LUME
element. This ignores child elements that are not LUME elements.composedLumeParent
- The composed parent LUME element (based on the composed tree) of the current LUME element.composedLumeChildren
- The composed child LUME elements (based on the composed tree) of the current LUME element..traverseSceneGraph(visitorFn)
- Traverses the composed tree of LUME
elements in pre-order. The tree that this traverses is the tree that is
composed from the hierarchy of ShadowRoot trees with elements distributed
through those trees via slot elements.
In these new APIs, non-LUME elements are ignored similarly to how some regular
DOM APIs ignore text nodes (.children
, .parentElement
, .assignedElements
,
etc). To certain LUME elements like <lume-node>
or <lume-mixed-plane>
,
non-LUME HTML elements and text nodes are merely content that render on their
rectangular flat surface, and those non-LUME elements are not part of the
hierarchy of 3D objects, so these new APIs make it easier to traverse LUME elements
while ignoring the rest.