Skip to content

Commit

Permalink
Ff105 offscreen not experimental (#21098)
Browse files Browse the repository at this point in the history
  • Loading branch information
hamishwillee committed Sep 27, 2022
1 parent 87b4c5a commit cd793f0
Show file tree
Hide file tree
Showing 13 changed files with 26 additions and 51 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,7 @@ browser-compat: api.CanvasRenderingContext2D.getTransform

{{APIRef}}

The
**`CanvasRenderingContext2D.getTransform()`**
method of the Canvas 2D API retrieves the current transformation matrix being applied to
the context.
The **`CanvasRenderingContext2D.getTransform()`** method of the Canvas 2D API retrieves the current transformation matrix being applied to the context.

## Syntax

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,10 @@ tags:
- Event
- Reference
- Canvas
- Experimental
browser-compat: api.HTMLCanvasElement.contextlost_event
---

{{APIRef}}{{SeeCompatTable}}
{{APIRef}}

The **`contextlost`** event of the [Canvas API](/en-US/docs/Web/API/Canvas_API) is fired if the user agent detects that the backing storage associated with a [`CanvasRenderingContext2D`](/en-US/docs/Web/API/CanvasRenderingContext2D) context is lost.
Contexts can be lost for several reasons like driver crashes or the application runs out of memory, etc.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,10 @@ tags:
- Event
- Reference
- Canvas
- Experimental
browser-compat: api.HTMLCanvasElement.contextrestored_event
---

{{APIRef}}{{SeeCompatTable}}
{{APIRef}}

The **`contextrestored`** event of the [Canvas API](/en-US/docs/Web/API/Canvas_API) is fired if the user agent restores the backing storage for a [`CanvasRenderingContext2D`](/en-US/docs/Web/API/CanvasRenderingContext2D).

Expand Down
6 changes: 3 additions & 3 deletions files/en-us/web/api/htmlcanvaselement/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,16 +42,16 @@ _Inherits methods from its parent, {{domxref("HTMLElement")}}._
- : Returns a data-URL containing a representation of the image in the format specified by the `type` parameter (defaults to `png`). The returned image is in a resolution of 96dpi.
- {{domxref("HTMLCanvasElement.toBlob()")}}
- : Creates a {{domxref("Blob")}} object representing the image contained in the canvas; this file may be cached on the disk or stored in memory at the discretion of the user agent.
- {{domxref("HTMLCanvasElement.transferControlToOffscreen()")}} {{experimental_inline}}
- {{domxref("HTMLCanvasElement.transferControlToOffscreen()")}}
- : Transfers control to an {{domxref("OffscreenCanvas")}} object, either on the main thread or on a worker.

## Events

Listen to these events using [`addEventListener()`](/en-US/docs/Web/API/EventTarget/addEventListener).

- [`contextlost`](/en-US/docs/Web/API/HTMLCanvasElement/contextlost_event) {{Experimental_Inline}}
- [`contextlost`](/en-US/docs/Web/API/HTMLCanvasElement/contextlost_event)
- : Fired if the user agent detects that the backing storage associated with a `CanvasRenderingContext2D` or an `OffscreenCanvasRenderingContext2D` context has been lost.
- [`contextrestored`](/en-US/docs/Web/API/HTMLCanvasElement/contextrestored_event) {{Experimental_Inline}}
- [`contextrestored`](/en-US/docs/Web/API/HTMLCanvasElement/contextrestored_event)
- : Fired if the user agent successfully restores a `CanvasRenderingContext2D` or an `OffscreenCanvasRenderingContext2D` context.
- [`webglcontextcreationerror`](/en-US/docs/Web/API/HTMLCanvasElement/webglcontextcreationerror_event)
- : Fired if the user agent is unable to create a `WebGLRenderingContext` or `WebGL2RenderingContext` context.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,16 @@ slug: Web/API/HTMLCanvasElement/transferControlToOffscreen
page-type: web-api-instance-method
tags:
- API
- Experimental
- HTMLCanvasElement
- Method
- OffscreenCanvas
- Reference
browser-compat: api.HTMLCanvasElement.transferControlToOffscreen
---

{{APIRef("Canvas API")}} {{SeeCompatTable}}
{{APIRef("Canvas API")}}

The
**`HTMLCanvasElement.transferControlToOffscreen()`**
method transfers control to an {{domxref("OffscreenCanvas")}} object, either on the main
thread or on a worker.
The **`HTMLCanvasElement.transferControlToOffscreen()`** method transfers control to an {{domxref("OffscreenCanvas")}} object, either on the main thread or on a worker.

## Syntax

Expand Down
3 changes: 1 addition & 2 deletions files/en-us/web/api/offscreencanvas/converttoblob/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,13 @@ page-type: web-api-instance-method
tags:
- API
- Canvas
- Experimental
- Method
- OffscreenCanvas
- Reference
browser-compat: api.OffscreenCanvas.convertToBlob
---

{{APIRef("Canvas API")}} {{SeeCompatTable}}
{{APIRef("Canvas API")}}

The **`OffscreenCanvas.convertToBlob()`** method creates a {{domxref("Blob")}} object representing the image contained in the canvas.

Expand Down
7 changes: 3 additions & 4 deletions files/en-us/web/api/offscreencanvas/getcontext/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,13 @@ page-type: web-api-instance-method
tags:
- API
- Canvas
- Experimental
- Method
- OffscreenCanvas
- Reference
browser-compat: api.OffscreenCanvas.getContext
---

{{APIRef("Canvas API")}} {{SeeCompatTable}}
{{APIRef("Canvas API")}}

The **`OffscreenCanvas.getContext()`** method returns a drawing context for an offscreen canvas, or [`null`](/en-US/docs/Web/JavaScript/Reference/Operators/null) if the context identifier is not supported.

Expand All @@ -33,7 +32,7 @@ getContext(contextType, contextAttributes)
- `webgl`
- : Creates a {{domxref("WebGLRenderingContext")}} object representing a three-dimensional rendering context.
This context is only available on browsers that implement [WebGL](/en-US/docs/Web/API/WebGL_API) version 1 (OpenGL ES 2.0).
- `webgl2` {{experimental_inline}}
- `webgl2`
- : Creates a {{domxref("WebGL2RenderingContext")}} object representing a three-dimensional rendering context.
This context is only available on browsers that implement [WebGL](/en-US/docs/Web/API/WebGL_API) version 2 (OpenGL ES 3.0).
- `bitmaprenderer`
Expand All @@ -55,7 +54,7 @@ getContext(contextType, contextAttributes)

- `alpha`
- : Boolean that indicates if the canvas contains an alpha channel. If set to `false`, the browser now knows that the backdrop is always opaque, which can speed up drawing of transparent content and images then.
- `willReadFrequently` {{non-standard_inline}} (Gecko only)
- `willReadFrequently` {{non-standard_inline}} (Firefox only)
- : Boolean that indicates whether or not a lot of read-back operations are planned.
This will force the use of a software (instead of hardware accelerated) 2D canvas and can save memory when calling {{domxref("CanvasRenderingContext2D.getImageData", "getImageData()")}} frequently.
This option is only available, if the flag `gfx.canvas.willReadFrequently.enable` is set to `true` (which, by default, is only the case for B2G/Firefox OS).
Expand Down
9 changes: 3 additions & 6 deletions files/en-us/web/api/offscreencanvas/height/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,24 +5,21 @@ page-type: web-api-instance-property
tags:
- API
- Canvas
- Experimental
- OffscreenCanvas
- Property
- Reference
browser-compat: api.OffscreenCanvas.height
---

{{APIRef("Canvas API")}} {{SeeCompatTable}}
{{APIRef("Canvas API")}}

The **`height`** property returns and sets the height of an
{{domxref("OffscreenCanvas")}} object.
The **`height`** property returns and sets the height of an {{domxref("OffscreenCanvas")}} object.

## Value

## Examples

Creating a new offscreen canvas and returning or setting the height of the offscreen
canvas:
Creating a new offscreen canvas and returning or setting the height of the offscreen canvas:

```js
const offscreen = new OffscreenCanvas(256, 256);
Expand Down
3 changes: 1 addition & 2 deletions files/en-us/web/api/offscreencanvas/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,10 @@ tags:
- Canvas
- Interface
- Reference
- Experimental
browser-compat: api.OffscreenCanvas
---

{{APIRef("Canvas API")}}{{SeeCompatTable}}
{{APIRef("Canvas API")}}

When using the {{HtmlElement("canvas")}} element or the [Canvas API](/en-US/docs/Web/API/Canvas_API), rendering, animation, and user interaction usually happen on the main execution thread of a web application.
The computation relating to canvas animations and rendering can have a significant impact on application performance.
Expand Down
12 changes: 4 additions & 8 deletions files/en-us/web/api/offscreencanvas/offscreencanvas/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,17 +6,15 @@ tags:
- API
- Canvas
- Constructor
- Experimental
- OffscreenCanvas
- Reference
- WebGL
browser-compat: api.OffscreenCanvas.OffscreenCanvas
---

{{APIRef("Canvas API")}} {{SeeCompatTable}}
{{APIRef("Canvas API")}}

The **`OffscreenCanvas()`** constructor returns a newly
instantiated {{domxref("OffscreenCanvas")}} object.
The **`OffscreenCanvas()`** constructor returns a newly instantiated {{domxref("OffscreenCanvas")}} object.

## Syntax

Expand All @@ -33,10 +31,8 @@ new OffscreenCanvas(width, height)

## Examples

This example creates a new offscreen canvas using the `OffscreenCanvas()`
constructor. We then initialize a [WebGL](/en-US/docs/Web/API/WebGL_API)
context on it using the {{domxref("OffscreenCanvas.getContext()", "getContext()")}}
method.
This example creates a new offscreen canvas using the `OffscreenCanvas()` constructor.
We then initialize a [WebGL](/en-US/docs/Web/API/WebGL_API) context on it using the {{domxref("OffscreenCanvas.getContext()", "getContext()")}} method.

```js
const offscreen = new OffscreenCanvas(256, 256);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,15 @@ page-type: web-api-instance-method
tags:
- API
- Canvas
- Experimental
- Method
- OffscreenCanvas
- Reference
browser-compat: api.OffscreenCanvas.transferToImageBitmap
---

{{APIRef("Canvas API")}} {{SeeCompatTable}}
{{APIRef("Canvas API")}}

The **`OffscreenCanvas.transferToImageBitmap()`** method
creates an {{domxref("ImageBitmap")}} object from the most recently rendered image of
the `OffscreenCanvas`.
The **`OffscreenCanvas.transferToImageBitmap()`** method creates an {{domxref("ImageBitmap")}} object from the most recently rendered image of the `OffscreenCanvas`.

## Syntax

Expand Down
9 changes: 3 additions & 6 deletions files/en-us/web/api/offscreencanvas/width/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,24 +5,21 @@ page-type: web-api-instance-property
tags:
- API
- Canvas
- Experimental
- OffscreenCanvas
- Property
- Reference
browser-compat: api.OffscreenCanvas.width
---

{{APIRef("Canvas API")}} {{SeeCompatTable}}
{{APIRef("Canvas API")}}

The **`width`** property returns and sets the width of an
{{domxref("OffscreenCanvas")}} object.
The **`width`** property returns and sets the width of an {{domxref("OffscreenCanvas")}} object.

## Value

## Examples

Creating a new offscreen canvas and returning or setting the width of the offscreen
canvas:
Creating a new offscreen canvas and returning or setting the width of the offscreen canvas:

```js
const offscreen = new OffscreenCanvas(256, 256);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -213,7 +213,7 @@ The following methods can be used to manipulate paths of objects.

Objects in the `CanvasRenderingContext2D` rendering context have a current transformation matrix and methods to manipulate it. The transformation matrix is applied when creating the current default path, painting text, shapes and {{domxref("Path2D")}} objects. The methods listed below remain for historical and compatibility reasons as {{domxref("DOMMatrix")}} objects are used in most parts of the API nowadays and will be used in the future instead.

- {{domxref("CanvasRenderingContext2D.getTransform()")}} {{Experimental_Inline}}
- {{domxref("CanvasRenderingContext2D.getTransform()")}}
- : Retrieves the current transformation matrix being applied to the context.
- {{domxref("CanvasRenderingContext2D.rotate()")}}
- : Adds a rotation to the transformation matrix. The angle argument represents a clockwise rotation angle and is expressed in radians.
Expand Down

0 comments on commit cd793f0

Please sign in to comment.