recursal/MDN huggingface dataset:
DOMPoint: DOMPoint() constructor
================================

 The **`DOMPoint()`** constructor
 creates and returns a new `DOMPoint` object, given the values for some or
 all of its properties.

 You can also create a `DOMPoint` by calling the
 `DOMPoint.fromPoint()` static function. That function accepts any object with the required parameters, including a `DOMPoint` or
 `DOMPointReadOnly`.

Syntax
------


```js
new DOMPoint()
new DOMPoint(x)
new DOMPoint(x, y)
new DOMPoint(x, y, z)
new DOMPoint(x, y, z, w)
```

### Parameters

`x` Optional

The `x` coordinate for the new `DOMPoint`.

`y` Optional

The `y` coordinate for the new `DOMPoint`.

`z` Optional

The `z` coordinate for the new `DOMPoint`.

`w` Optional

The perspective value of the new `DOMPoint`.

Examples
--------

 This example creates a `DOMPoint` representing the top-left corner of the
 current window, then creates a second point based on the first, which is then offset by
 100 pixels both vertically and horizontally.


```js
const windTopLeft = new DOMPoint(window.screenX, window.screenY);
const newTopLeft = DOMPoint.fromPoint(windTopLeft);
newTopLeft.x += 100;
newTopLeft.y += 100;
```

Specifications
--------------

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-dompoint-dompoint |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `DOMPointReadOnly()`
* `DOMRect`
* `DOMMatrix`
DOMPoint: x property
====================

 The **`DOMPoint`** interface's
 **`x`** property holds the horizontal coordinate, x, for a
 point in space.

 In general, positive values `x` mean to the right,
 and negative values of `x` means to the left, barring any transforms that may
 have altered the orientation of the axes.

Value
-----

 A double-precision floating-point value indicating the x coordinate's value for the
 point. This value is **unrestricted**, meaning that it is allowed to be
 infinite or invalid (that is, its value may be `NaN` or `±Infinity`).

Specifications
--------------

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-dompointreadonly-x |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The other coordinate properties: `y`,
 `z`, and the perspective value, `w`.
DOMPoint: y property
====================

 The **`DOMPoint`** interface's
 **`y`** property holds the vertical coordinate, *y*,
 for a point in space.

 Unless transforms have been applied to alter the
 orientation, the value of `y` increases downward and decreases upward.

Value
-----

 A double-precision floating-point value indicating the *y* coordinate's value
 for the point. This value is **unrestricted**, meaning that it is allowed
 to be infinite or invalid (that is, its value may be `NaN` or
 `±Infinity`).

Specifications
--------------

| Specification |
| --- |
| Geometry Interfaces Module Level 1 # dom-dompointreadonly-y |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* The other coordinate properties: `x`,
 `z`, and the perspective value, `w`.
XRQuadLayer: space property
===========================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`space`** property of the `XRQuadLayer` interface represents the layer's spatial relationship with the user's physical environment.

Value
-----

An `XRSpace`.

Examples
--------

### Setting a layer's dimension and position

This example code positions the layer two meters away from `newSpace` with a `height` and `width` of 1.5 meters.


```js
const quadLayer = xrGlBinding.createQuadLayer({
  space: xrReferenceSpace,
  viewPixelWidth: 512,
  viewPixelHeight: 512,
});

quadLayer.space = newSpace;
quadLayer.transform = new XRRigidTransform({ z: -2 });
quadLayer.width = 1.5;
quadLayer.height = 1.5;
```

Specifications
--------------

| Specification |
| --- |
| WebXR Layers API Level 1 # dom-xrquadlayer-space |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `XRSpace`
* `XRQuadLayer.transform`
XRQuadLayer: width property
===========================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`width`** property of the `XRQuadLayer` interface represents the width of the layer in meters.

Value
-----

A number representing the width of the layer in meters.

Examples
--------

### Setting a layer's dimension and position

This example code positions the layer two meters away from the origin of `xrReferenceSpace` with a `height` and `width` of 1.5 meters.


```js
const quadLayer = xrGlBinding.createQuadLayer({
  space: xrReferenceSpace,
  viewPixelWidth: 512,
  viewPixelHeight: 512,
});

quadLayer.transform = new XRRigidTransform({ z: -2 });
quadLayer.width = 1.5;
quadLayer.height = 1.5;
```

Specifications
--------------

| Specification |
| --- |
| WebXR Layers API Level 1 # dom-xrquadlayer-width |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `XRQuadLayer.height`
XRQuadLayer: transform property
===============================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`transform`** property of the `XRQuadLayer` interface represents the offset and orientation relative to the layer's `space`.

Value
-----

An `XRRigidTransform`.

Examples
--------

### Setting a layer's dimension and position

This example code positions the layer two meters away from the origin of `xrReferenceSpace` with a `height` and `width` of 1.5 meters.


```js
const quadLayer = xrGlBinding.createQuadLayer({
  space: xrReferenceSpace,
  viewPixelWidth: 512,
  viewPixelHeight: 512,
});

quadLayer.transform = new XRRigidTransform({ z: -2 });
quadLayer.width = 1.5;
quadLayer.height = 1.5;
```

Specifications
--------------

| Specification |
| --- |
| WebXR Layers API Level 1 # dom-xrquadlayer-transform |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `XRRigidTransform`
* `XRQuadLayer.space`
XRQuadLayer: height property
============================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The **`height`** property of the `XRQuadLayer` interface represents the height of the layer in meters.

Value
-----

A number representing the height of the layer in meters.

Examples
--------

### Setting a layer's dimension and position

This example code positions the layer two meters away from the origin of `xrReferenceSpace` with a `height` and `width` of 1.5 meters.


```js
const quadLayer = xrGlBinding.createQuadLayer({
  space: xrReferenceSpace,
  viewPixelWidth: 512,
  viewPixelHeight: 512,
});

quadLayer.transform = new XRRigidTransform({ z: -2 });
quadLayer.width = 1.5;
quadLayer.height = 1.5;
```

Specifications
--------------

| Specification |
| --- |
| WebXR Layers API Level 1 # dom-xrquadlayer-height |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `XRQuadLayer.width`
XRQuadLayer: redraw event
=========================

**Experimental:** **This is an experimental technology**  
Check the Browser compatibility table carefully before using this in production.

The `redraw` event is sent to the `XRQuadLayer` object when the underlying resources of the layer are lost or when the XR Compositor can no longer reproject the layer. If this event is sent, authors should redraw the content of the layer in the next XR animation frame.

See also the `XRCompositionLayer.needsRedraw` property which is also available to `XRQuadLayer` objects through inheritance from `XRCompositionLayer`.

Syntax
------

Use the event name in methods like `addEventListener()`, or set an event handler property.


```js
addEventListener("redraw", (event) => {});

onredraw = (event) => {};
```

Event type
----------

An `XRLayerEvent`. Inherits from `Event`.

Event properties
----------------

*In addition to the properties listed below, properties from the parent interface, `Event`, are available.*

`layer` Read only 

The `XRLayer` which generated the event.

Examples
--------

### Using the `redraw` event

You can pass `redraw` to `addEventListener()`:


```js
quadLayer.addEventListener("redraw", (event) => {
  // redraw the layer
});
```


Alternatively, you can use the `onredraw` event handler property to establish a handler for the `redraw` event:


```js
quadLayer.onredraw = (event) => {
  // redraw the layer
};
```

Specifications
--------------

| Specification |
| --- |
| WebXR Layers API Level 1 # eventdef-xrlayer-redraw |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `XRCompositionLayer.needsRedraw`
AuthenticatorAssertionResponse: signature property
==================================================

**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

 The **`signature`** read-only property of the
 `AuthenticatorAssertionResponse` interface is an `ArrayBuffer`
 object which is the signature of the authenticator for both
 `AuthenticatorAssertionResponse.authenticatorData` and a SHA-256 hash of
 the client data
 (`AuthenticatorAssertionResponse.clientDataJSON`).

 This signature will be sent to the server for control, as part of the response. It
 provides the proof that an authenticator does possess the private key which was used for
 the credential's generation.

Value
-----

 An `ArrayBuffer` object which the signature of the authenticator (using its
 private key) for both `AuthenticatorAssertionResponse.authenticatorData`
 and a SHA-256 hash given by the client for its data (the challenge, the origin, etc. and
 available from
 `AuthenticatorAssertionResponse.clientDataJSON`).

Examples
--------

See User login using the WebAuthn API for a detailed example.

Specifications
--------------

| Specification |
| --- |
| Web Authentication: An API for accessing Public Key Credentials - Level 3 # dom-authenticatorassertionresponse-signature |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
AuthenticatorAssertionResponse: authenticatorData property
==========================================================

**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The **`authenticatorData`** property of the `AuthenticatorAssertionResponse` interface returns an `ArrayBuffer` containing information from the authenticator such as the Relying Party ID Hash (rpIdHash), a signature counter, test of user presence, user verification flags, and any extensions processed by the authenticator.

Value
-----

An `ArrayBuffer` with a `ArrayBuffer.byteLength` of at least 37 bytes, which contains the data structure explained in Authenticator data.

Examples
--------

See User login using the WebAuthn API for a detailed example.

Specifications
--------------

| Specification |
| --- |
| Web Authentication: An API for accessing Public Key Credentials - Level 3 # dom-authenticatorassertionresponse-authenticatordata |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
AuthenticatorAssertionResponse: userHandle property
===================================================

**Secure context:** This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The **`userHandle`** read-only property of the `AuthenticatorAssertionResponse` interface is an `ArrayBuffer` object providing an opaque identifier for the given user. Such an identifier can be used by the relying party's server to link the user account with its corresponding credentials and other data.

This value is specified as `user.id` in the options passed to the originating `navigator.credentials.create()` call.

Value
-----

An `ArrayBuffer` object representing an identifier for the current user. This is not intended to be human-readable. The relying party should make sure that the `user.id` passed into the originating `create()` call does **not** contain any personally identifying information (for example user name, email, or phone number).

For `navigator.credentials.create()` calls made with a non-empty `allowCredentials` properties, the returned `userHandle` may be null.

Examples
--------

See User login using the WebAuthn API for a detailed example.

Specifications
--------------

| Specification |
| --- |
| Web Authentication: An API for accessing Public Key Credentials - Level 3 # dom-authenticatorassertionresponse-userhandle |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `CredentialsContainer.create()` that sets the value of this property
OES\_draw\_buffers\_indexed: colorMaskiOES() method
===================================================

The `colorMaskiOES()` method of the `OES_draw_buffers_indexed` WebGL extension sets which color components to enable or to disable when drawing or rendering for a particular draw buffer. It's the indexed version of WebGL 1's `WebGLRenderingContext.colorMask()` method.

Syntax
------


```js
colorMaskiOES(buf, r, g, b, a)
```

### Parameters

`buf`

An integer `i` specifying the draw buffer associated with the constant `gl.DRAW_BUFFERi`, see WebGL draw buffer constants.

`r`

A `GLboolean` specifying whether or not the red color component should be written into the draw buffer.

`g`

A `GLboolean` specifying whether or not the green color component should be written into the draw buffer.

`b`

A `GLboolean` specifying whether or not the blue color component should be written into the draw buffer.

`a`

A `GLboolean` specifying whether or not the red alpha (transparency) component should be written into the draw buffer.

### Return value

None (`undefined`).

### Exceptions

* If `buf`, `r`, `b`, `g`, or `a` are not a valid values, a `gl.INVALID_VALUE` error is thrown.
Examples
--------

### Setting and getting color masks

You can set the color masks for the `gl.DRAW_BUFFER0` and `gl.DRAW_BUFFER1` draw buffers like this:


```js
const ext = gl.getExtension("OES\_draw\_buffers\_indexed");

ext.colorMaskiOES(0, 1, 0, 0, 0);
ext.colorMaskiOES(1, 0, 1, 0, 0);
```


To get the color masks for the `gl.DRAW_BUFFER0` and `gl.DRAW_BUFFER1` draw buffers, query the `COLOR_WRITEMASK` constant using `WebGL2RenderingContext.getIndexedParameter()`:


```js
gl.getIndexedParameter(gl.COLOR\_WRITEMASK, 0);
gl.getIndexedParameter(gl.COLOR\_WRITEMASK, 1);
```

Specifications
--------------

| Specification |
| --- |
| WebGL OES\_draw\_buffers\_indexed Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `WebGL2RenderingContext.getIndexedParameter()`
* `WebGLRenderingContext.colorMask()`
OES\_draw\_buffers\_indexed: disableiOES() method
=================================================

The `disableiOES()` method of the `OES_draw_buffers_indexed` WebGL extension enables blending for a particular draw buffer.

Syntax
------


```js
disableiOES(target, index)
```

### Parameters

`target`

Must be `gl.BLEND`.

`index`

An integer `i` specifying the draw buffer associated with the constant `gl.DRAW_BUFFERi`, see WebGL draw buffer constants.

### Return value

None (`undefined`).

### Exceptions

* If `target` is not `gl.BLEND`, a `gl.INVALID_ENUM` error is thrown.
* If `index` is not a valid value, a `gl.INVALID_VALUE` error is thrown.
Examples
--------

### Disabling blending for draw buffers

The following two calls disable blending for the draw buffers `gl.DRAW_BUFFER0` and `gl.DRAW_BUFFER1`.


```js
const ext = gl.getExtension("OES\_draw\_buffers\_indexed");

ext.disableiOES(gl.BLEND, 0);
ext.disableiOES(gl.BLEND, 1);
```

Specifications
--------------

| Specification |
| --- |
| WebGL OES\_draw\_buffers\_indexed Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `OES_draw_buffers_indexed.enableiOES()`
* WebGL draw buffer constants
OES\_draw\_buffers\_indexed: blendEquationSeparateiOES() method
===============================================================

The `blendEquationSeparateiOES()` method of the `OES_draw_buffers_indexed` WebGL extension sets the RGB and alpha blend equations separately for a particular draw buffer.

See `OES_draw_buffers_indexed.blendEquationiOES()` for setting RGB and alpha together and `WebGLRenderingContext.blendEquationSeparate()` for the WebGL 1 version of this method.

Syntax
------


```js
blendEquationSeparateiOES(buf, modeRGB, modeAlpha)
```

### Parameters

`buf`

An integer `i` specifying the draw buffer associated with the constant `gl.DRAW_BUFFERi`, see WebGL draw buffer constants.

`modeRGB`

A `GLenum` specifying how source and destination RGB color components are combined. Accepts the same enums as the `modeRGB` parameter in `WebGLRenderingContext.blendEquationSeparate()`.

`modeAlpha`

A `GLenum` specifying how source and destination alpha color components are combined. Accepts the same enums as the `modeAlpha` parameter in `WebGLRenderingContext.blendEquationSeparate()`.

### Return value

None (`undefined`).

### Exceptions

* If `buf` is not a valid value, a `gl.INVALID_VALUE` error is thrown.
* If `modeRGB` or `modeAlpha` are not set to one of the possible values, a `gl.INVALID_ENUM` error is thrown.
Examples
--------

### Setting and getting blend equations

The following sets the blend equations for the draw buffers `gl.DRAW_BUFFER0` (call where `buf` is 0) and `gl.DRAW_BUFFER1` (call where `buf` is 1).


```js
const ext = gl.getExtension("OES\_draw\_buffers\_indexed");

ext.blendEquationSeparateiOES(0, gl.FUNC\_ADD, gl.FUNC\_SUBTRACT);
ext.blendEquationSeparateiOES(1, gl.FUNC\_ADD, gl.FUNC\_SUBTRACT);
```


To get the blend equations for `gl.DRAW_BUFFER0` and `gl.DRAW_BUFFER1`, query the `BLEND_EQUATION_RGB` and `BLEND_EQUATION_ALPHA` constants using `WebGL2RenderingContext.getIndexedParameter()`:


```js
// For gl.DRAW\_BUFFER0
gl.getIndexedParameter(gl.BLEND\_EQUATION\_RGB, 0);
gl.getIndexedParameter(gl.BLEND\_EQUATION\_ALPHA, 0);

// for gl.DRAW\_BUFFER1
gl.getIndexedParameter(gl.BLEND\_EQUATION\_RGB, 1);
gl.getIndexedParameter(gl.BLEND\_EQUATION\_ALPHA, 1);
```

Specifications
--------------

| Specification |
| --- |
| WebGL OES\_draw\_buffers\_indexed Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `OES_draw_buffers_indexed.blendEquationiOES()`
* `WebGLRenderingContext.blendEquationSeparate()`
OES\_draw\_buffers\_indexed: blendFunciOES() method
===================================================

The `blendFunciOES()` method of the `OES_draw_buffers_indexed` WebGL extension defines which function is used when blending pixels for a particular draw buffer.

See `OES_draw_buffers_indexed.blendFuncSeparateiOES()` for setting RGB and alpha components separately and `WebGLRenderingContext.blendFunc()` for the WebGL 1 version of this method.

Syntax
------


```js
blendFunciOES(buf, src, dst)
```

### Parameters

`buf`

An integer `i` specifying the draw buffer associated with the constant `gl.DRAW_BUFFERi`, see WebGL draw buffer constants.

`src`

A `GLenum` specifying a multiplier for the source blending factors. Accepts the same enums as the `sfactor` parameter in `WebGLRenderingContext.blendFunc()`.

`dst`

A `GLenum` specifying a multiplier for the destination blending factors. Accepts the same enums as the `dfactor` parameter in `WebGLRenderingContext.blendFunc()`.

### Return value

None (`undefined`).

### Exceptions

* If `buf` is not a valid value, a `gl.INVALID_VALUE` error is thrown.
* If `src` or `dst` are not one of the possible values, a `gl.INVALID_ENUM` error is thrown.
* The same blending limitations as for `WebGLRenderingContext.blendFunc()` apply: If a constant color and a constant alpha value are used together as source and destination factors, a `gl.INVALID_ENUM` error is thrown.
Examples
--------

### Setting and getting blend functions

You can set the blend functions for the `gl.DRAW_BUFFER0` and `gl.DRAW_BUFFER1` draw buffers like this:


```js
const ext = gl.getExtension("OES\_draw\_buffers\_indexed");

ext.blendFunciOES(0, gl.ONE, gl.ONE);
ext.blendFunciOES(1, gl.SRC\_ALPHA, gl.ONE\_MINUS\_SRC\_ALPHA);
```


To get the blend functions for the `gl.DRAW_BUFFER0` and `gl.DRAW_BUFFER1` draw buffers, query the `BLEND_SRC_RGB`, `BLEND_SRC_ALPHA`, `BLEND_DST_RGB`, and `BLEND_DST_ALPHA` constants using `WebGL2RenderingContext.getIndexedParameter()`:


```js
// For gl.DRAW\_BUFFER0
gl.getIndexedParameter(gl.BLEND\_SRC\_RGB, 0);
gl.getIndexedParameter(gl.BLEND\_SRC\_ALPHA, 0);
gl.getIndexedParameter(gl.BLEND\_DST\_RGB, 0);
gl.getIndexedParameter(gl.BLEND\_DST\_ALPHA, 0);

// For gl.DRAW\_BUFFER0
gl.getIndexedParameter(gl.BLEND\_SRC\_RGB, 1);
gl.getIndexedParameter(gl.BLEND\_SRC\_ALPHA, 1);
gl.getIndexedParameter(gl.BLEND\_DST\_RGB, 1);
gl.getIndexedParameter(gl.BLEND\_DST\_ALPHA, 1);
```

Specifications
--------------

| Specification |
| --- |
| WebGL OES\_draw\_buffers\_indexed Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `OES_draw_buffers_indexed.blendFuncSeparateiOES()`
* `WebGLRenderingContext.blendFunc()`
OES\_draw\_buffers\_indexed: enableiOES() method
================================================

The `enableiOES()` method of the `OES_draw_buffers_indexed` WebGL extension enables blending for a particular draw buffer.

Syntax
------


```js
enableiOES(target, index)
```

### Parameters

`target`

Must be `gl.BLEND`.

`index`

An integer `i` specifying the draw buffer associated with the constant `gl.DRAW_BUFFERi`, see WebGL draw buffer constants.

### Return value

None (`undefined`).

### Exceptions

* If `target` is not `gl.BLEND`, a `gl.INVALID_ENUM` error is thrown.
* If `index` is not a valid value, a `gl.INVALID_VALUE` error is thrown.
Examples
--------

### Enabling blending for draw buffers

The following two calls enable blending for the draw buffers `gl.DRAW_BUFFER0` and `gl.DRAW_BUFFER1`.


```js
const ext = gl.getExtension("OES\_draw\_buffers\_indexed");

ext.enableiOES(gl.BLEND, 0);
ext.enableiOES(gl.BLEND, 1);
```


You can use `WebGLRenderingContext.getParameter()` to see how many draw buffers are available.


```js
const maxDrawBuffers = gl.getParameter(gl.MAX\_DRAW\_BUFFERS);
```

Specifications
--------------

| Specification |
| --- |
| WebGL OES\_draw\_buffers\_indexed Extension Specification  |

Browser compatibility
---------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

See also
--------

* `OES_draw_buffers_indexed.disableiOES()`
* WebGL draw buffer constants