Sprites.Browser
The browser viewport as reactive values. Size keeps the width and height values you pass following the viewport, through a shared driver, as the window resizes. So a lens on either follows the change and other values derive from them.
Sprites.Browser.Size Void
Sprites.Browser.Size(width, height)
Keep the width and height values following the viewport. It does not return the size; it updates the values you pass, through a shared driver, as the window resizes. Make them Pending to start pending until the first measure. Either may be left out.
| Input | Type | Description |
|---|---|---|
width | Sprites.Reactive.Value | The value updated with the viewport width, or left out. |
height | Sprites.Reactive.Value | The value updated with the viewport height, or left out. |
Returns nothing; it writes the width and height values as the viewport resizes.
const width = Sprites.Reactive.Pending(0);
const height = Sprites.Reactive.Pending(0);
Sprites.Browser.Size(width, height);
Sprites.Ui.Dom.Text('width = ', width);
Sprites.Ui.Dom.Text(' height = ', height);Sprites.Browser.ElementSize Void
Sprites.Browser.ElementSize(element, width, height)
Keep the width and height values following a specific element's client size, through a ResizeObserver. It is the element companion to Size, for a fit that needs the real size of the stage rather than the whole window. Make the values Pending to start pending until the first measure. Either may be left out.
| Input | Type | Description |
|---|---|---|
element | Element | The element observed for its client width and height. |
width | Sprites.Reactive.Value | The value updated with the element's client width, or left out. |
height | Sprites.Reactive.Value | The value updated with the element's client height, or left out. |
Returns nothing; it writes the width and height values as the element resizes.
const width = Sprites.Reactive.Pending(0);
const height = Sprites.Reactive.Pending(0);
const stage = Sprites.Reactive.currentElement;
Sprites.Browser.ElementSize(stage, width, height);
Sprites.Ui.Dom.Text('width = ', width);
Sprites.Ui.Dom.Text(' height = ', height);