Changelog
A detailed list of all notable changes for every released version.
0.1.3
- Make
TextNodebackend-agnostic, you can now usetoodle.Textwith both WebGPU and WebGL2 backends to measure text positioning. Rendering with webgl2 will throw. - Breaking
import {TextNode, TextNodeOptions} from @bloopjs/toodleinstead of referencing viaText.TextNode
0.1.2
- Breaking: Remove
fflatedependency andloadZiputility function. If you were usingloadZip, you can use the browser's nativeDecompressionStreamAPI or installfflatedirectly in your project.
0.1.0
Add WebGL2 fallback renderer for browsers without WebGPU support. Use backend: "webgl2" in the options passed to Toodle.attach():
ts
const toodle = await Toodle.attach(canvas, {
backend: "webgl2", // or "webgpu" (default)
});Note: WebGL2 fallback is not as performant as WebGPU and does not have feature parity. Currently supported features:
- Quad rendering with default or custom fragment shader
- Shape rendering
- Batched / instanced rendering
- Layout / screen space
- Registering + loading pre-baked texture atlases
Unsupported features:
- Text rendering / font loading
- Custom vertex shaders
- Post-processing
- Runtime packing of textures into an atlas, loading textures individually
- Introduce
IBackendShaderandIRenderBackendinterfaces to support multiple rendering backends - Breaking: GPUDevice and other WebGpu-specific accessors are no longer available on toodle.extra.device() and toodle.debug.device, instead use
(toodle.backend as Backends.WebGpuBackend).deviceto get the GPUDevice, presentation format, render pass etc. - Breaking AssetManager signature has changed. If you are using
AssetManagerdirectly instead of just toodle.assets, you'll need to update to use the newAssetManagerOptions
0.0.104
- Breaking:
shapes.Circle()now takes aradiusparameter instead of usingscalefor sizing. A circle withradius: 50has diameter 100. You can still applyscaleon top of the radius-based size.ts// before toodle.shapes.Circle({ scale: { x: 100, y: 100 } }); // 100px diameter circle // after toodle.shapes.Circle({ radius: 50 }); // 100px diameter circle (radius defaults to 50) - Breaking:
idealSizerenamed tosizethroughout the API (NodeOptions.size,QuadOptions.size, etc.)ts// before toodle.Quad("texture", { idealSize: { width: 100, height: 100 } }); // after toodle.Quad("texture", { size: { width: 100, height: 100 } }); - Breaking:
autoLoadnow defaults totruefor bundle registration. Bundles are loaded to the GPU immediately after registration unless you specifyautoLoad: false.ts// before - had to explicitly load await toodle.assets.registerBundle("sprites", { textures }); await toodle.assets.loadBundle("sprites"); // after - auto-loads by default await toodle.assets.registerBundle("sprites", { textures }); // or opt out with autoLoad: false await toodle.assets.registerBundle("sprites", { textures, autoLoad: false });
0.0.103
- Add
Bundlesclass for renderer-agnostic bundle registration and atlas coordinate lookups. This enables WebGL fallback paths to share bundle registration with WebGPU code. AssetManagernow usesBundlesinternally and exposes it viaassets.bundles- Add
AssetManagerOptionsto pass a customBundlesinstance or texture format toAssetManager - Breaking:
AssetManagerconstructor now takes anoptionsobject as the 4th parameter instead of a positionalformatparameter
0.0.100
- Add
assetManageroption toToodle.QuadandToodle.QuadShader, allowing quads to use a different texture array, for eg an array of rg8 atlases. - Expose
AssetManagerdirectly to allow more control over texture atlases. - Breaking: shader constructor no longer accepts
BlendModeas a positional argument, use theblendModeoption in opts instead.
0.0.99
- Add low level api for post-process (fullscreen) shaders, see post-process example
- Add
Colors.webfor CSS web color names to use when prototyping
0.0.97
- Add MIT license to package.json so it shows up on npm and gh.
0.0.96
- Fix:
toodle.endFramenow clears instance counts even if an uncaught error is thrown to avoid spamming the console with a ToodleInstanceCap error
0.0.94
- Rename package
0.0.89-0.0.93
JumboQuad fixes:
- Fix instance count bug in
QuadShaderwhen usingtoodle.JumboQuadwith layers - Fix
toodle.JumboQuadpositioning bug when offset is 0 - Fix
toodle.JumboQuadtile positioning bug whensizeis provided - Fix
sizeoption ontoodle.JumboQuad
0.0.89
- Add
JumboQuadNodeto render a jumbo texture, see jumbo texture example for more details.
0.0.88
- Error handling: Throw
ToodleInstanceCaperror when too many instances are enqueued for a shader instead of returning an offset out of bounds error.
0.0.87
- Fix: Bundles loaded via pixi prebaked atlases now have the
cropOffsetcalculated correctly
0.0.85 and 0.0.86
(administrative, no changes)
0.0.84
- Add
QuadNode.regionto allow rendering a subregion of a texture (useful for spritesheets / tilemaps), see texel region example for more details. - Breaking: rename
QuadNode.drawOffsettoQuadNode.cropOffsetto avoid confusion with region offset for spritesheets - Add
QuadNode.extra.atlasSizeto get the size of the texture atlas in texels (usually 4096x4096). These dimensions are more commonly available in thetoodle.limitsobject.
0.0.83
- Allow registering bundles with pre-baked texture atlases, see pre-baking atlases for more details.
- Add
toodle.assets.textureIdsto get an array of ids of all currently loaded textures.
0.0.82
- Add
toodle.extra.deviceto get the GPU device used by the toodle instance.
0.0.80
- Fork public domain project to blooper-gg organization
0.0.72
- Add an optional
indexparameter tonode.addto specify where to insert the new child for full control over the draw order when not using layers. - Add
node.childrenalias fornode.kids- ai seems to really want the api to be calledchildren. - Add
QuadNode.isCircleto check if a quad is rendering a circle.
0.0.71
TextNodes are now easier to serialize/deserialize.
- Add
TextNode.fontto get the font used by aTextNode. - Add
font.idto get the id of the font from theAssetManagerperspective. - Fix issue in fallback character logic and squash incorrect warning about missing fallback character.
0.0.70
- Add
Text.TextNodeandText.TextShaderto the toodle exports for use in automated testing outside the browser, egvitestorbun:test. In a browser contexttoodle.Textwill still be the best way to create text nodes.
0.0.69
Transparent cropping is in! Disabled by default, but can be enabled by passing cropTransparentPixels: true to AssetManager.registerBundle.
See the transparent cropping example for more details.
- Add
cropTransparentPixelsoption toAssetManager.registerBundleto strip transparent pixels from textures. - Add
autoLoadoption toAssetManager.registerBundleto automatically load a bundle when it is registered. - Add
drawOffsetoption totoodle.Quadto offset the draw position of the quad's texture. - Add
quad.atlasCoords.uvScaleCroppedto get the cropped uv scale of the quad's texture. - Add
quad.extra.cropRatio()to get the ratio of a cropped quad's opaque texels to its original size.
0.0.67
- [Fix
maxTextLengthoption inToodle.attach] - this is now correctly applied to thetoodle.Textconstructor.
0.0.66
Breaking change
rotation in NodeOptions is now in degrees
ts
// before - constructor for Quad and shapes interpreted rotation as radians
const node = toodle.shapes.Rect({ rotation: Math.PI / 2 });
// but the `rotation` property was interpreted as degrees
node.rotation = 90;
// after - both consistently interpret `rotation` as degrees and `rotationRadians` as radians
toodle.shapes.Rect({ rotation: 90 });
toodle.shapes.Rect({ rotationRadians: Math.PI / 2 });0.0.65
- Default
TextNode.sizeto the size of the text if nosizeis provided. - Accept
keyparameter intoodle.shapes.Lineconstructor. This allows associating a string key with the node for debugging purposes, and may be used for optimizations in the future.
0.0.64
Allow removal of nodes
- Added
node.delete()to remove a node from a parent and all of it's children. - Added
node.remove(node)to remove a node from a parent without deleting it.