recursal/MDN huggingface dataset:
RTCDataChannel: bufferedamountlow event
=======================================

A **`bufferedamountlow`** event is sent to an `RTCDataChannel` when the number of bytes currently in the outbound data transfer buffer falls below the threshold specified in `bufferedAmountLowThreshold`. `bufferedamountlow` events aren't sent if `bufferedAmountLowThreshold` is 0.

This event is not cancelable and does not bubble.

Syntax
------

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


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

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

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

A generic `Event`.

Examples
--------

This example sets up a handler for `bufferedamountlow` to request more data any time the data channel's buffer falls below the number of bytes specified by `bufferedAmountLowThreshold`, which we have set to 65536. In other words, we'll try to keep at least 64kB of data in the buffer, reading 64kB at a time from the source.


```js
let pc = new RTCPeerConnection();
let dc = pc.createDataChannel("SendFile");
// source data object
let source = (dc.bufferedAmountLowThreshold = 65536);

pc.addEventListener(
  "bufferedamountlow",
  (ev) => {
    if (source.position <= source.length) {
      dc.send(source.readFile(65536));
    }
  },
  false,
);
```


After creating the `RTCPeerConnection`, this calls `RTCPeerConnection.createDataChannel()` to create the data channel. Then a listener is created for `bufferedamountlow` to refill the incoming data buffer any time its contents fall below 65536 bytes.

You can also set up a listener for `bufferedamountlow` using its event handler property, `onbufferedamountlow`:


```js
pc.onbufferedamountlow = (ev) => {
  if (source.position <= source.length) {
    dc.send(source.readFile(65536));
  }
};
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # event-datachannel-bufferedamountlow |
| WebRTC: Real-Time Communication in Browsers # dom-rtcdatachannel-onbufferedamountlow |

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

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

See also
--------

* WebRTC API
* `RTCDataChannel`
* `RTCDataChannel.bufferedAmountLowThreshold`
RTCDataChannel: bufferedAmount property
=======================================

 The read-only `RTCDataChannel` property
 **`bufferedAmount`** returns the number of bytes of data
 currently queued to be sent over the data channel. The queue may build up as a
 result of calls to the `send()` method. This only
 includes data buffered by the user agent itself; it doesn't include any framing overhead
 or buffering done by the operating system or network hardware.

 The user agent may implement the process of actually sending data in any way it
 chooses; this may be done periodically during the event loop or truly asynchronously. As
 messages are actually sent, this value is reduced accordingly.


**Note:** Closing the data channel doesn't reset this count, even though the user agent purges
 the queued messages. However, even after closing the channel, attempts to send
 messages continue to add to the `bufferedAmount` value, even though the
 messages are neither sent nor buffered.


 Whenever this value decreases to fall to or below the value specified in the
 `bufferedAmountLowThreshold`
 property, the user agent fires the `bufferedamountlow` event. This event may
 be used, for example, to implement code which queues more messages to be sent whenever
 there's room to buffer them.

Value
-----

 The number of bytes of data currently queued to be sent over the data channel but have
 not yet been sent.

Example
-------

 The snippet below includes a function which changes the contents of a block with the ID
 "bufferSize" to a string indicating the number of bytes currently buffered on an
 `RTCDataChannel`.


```js
const dc = peerConnection.createDataChannel("File Transfer");

// …

function showBufferedAmount(channel) {
  const el = document.getElementById("bufferSize");

  el.innerText = `${channel.bufferedAmount} bytes`;
}
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-datachannel-bufferedamount |

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

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

See also
--------

* WebRTC
* Using WebRTC data channels
* `RTCDataChannel`
* `RTCDataChannel.bufferedAmountLowThreshold`
* `bufferedamountlow` event
RTCDataChannel: maxRetransmits property
=======================================

 The read-only `RTCDataChannel` property
 **`maxRetransmits`** returns the maximum number of times the
 browser should try to retransmit a message before giving up, as set when the data
 channel was created, or `null`, which indicates that there is no
 maximum. This can only be set when the `RTCDataChannel` is created
 by calling `RTCPeerConnection.createDataChannel()`, using the
 `maxRetransmits` field in the specified `options`.

Value
-----

 The maximum number of times the browser will try to retransmit a message before giving
 up, or `null` if not set when
 `RTCPeerConnection.createDataChannel()` was called. The default is
 `null`.

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-datachannel-maxretransmits |

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

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

See also
--------

* WebRTC
* `RTCDataChannel`
* `RTCDataChannel.maxPacketLifetime`
* `RTCPeerConnection.createDataChannel()`
RTCDataChannel: open event
==========================

The WebRTC **`open`** event is sent to an `RTCDataChannel` object's `onopen` event handler when the underlying transport used to send and receive the data channel's messages is opened or reopened.

This event is not cancelable and does not bubble.

Syntax
------

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


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

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

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

An `RTCDataChannelEvent`. Inherits from `Event`.

Event

RTCDataChannelEventEvent properties
----------------

*Also inherits properties from its parent interface, `Event`.*

`channel` Read only 

Returns the `RTCDataChannel` associated with the event.

Examples
--------

This example adds to the `RTCDataChannel` `dc` a handler for the `open` event that adjusts the user interface to indicate that a chat window is ready to be used after a connection has been established. It enables the message input box and send button as well as enabling the disconnect button and disabling the connect button. Finally, the message input box is focused so the user can immediately begin to type.


```js
dc.addEventListener(
  "open",
  (ev) => {
    messageInputBox.disabled = false;
    sendMessageButton.disabled = false;
    disconnectButton.disabled = false;
    connectButton.disabled = true;

    messageInputBox.focus();
  },
  false,
);
```


This can also be done by directly setting the value of the channel's `onopen` event handler property.


```js
dc.onopen = (ev) => {
  messageInputBox.disabled = false;
  sendMessageButton.disabled = false;
  disconnectButton.disabled = false;
  connectButton.disabled = true;

  messageInputBox.focus();
};
```

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

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

See also
--------

* WebRTC API
* A simple RTCDataChannel example
* Related events: `message`, `close`, and `error`
RTCDataChannel: binaryType property
===================================

 The property **`binaryType`** on the
 `RTCDataChannel` interface is a string which specifies
 the type of object which should be used to represent binary data received
 on the `RTCDataChannel`. Values allowed by the
 `WebSocket.binaryType` property are also permitted here:
 `blob` if `Blob` objects are being used or
 `arraybuffer` if `ArrayBuffer` objects are being used. The
 default is `blob`.

 When a binary message is received on the data channel, the resulting
 `message` event's `MessageEvent.data` property is an object of
 the type specified by the `binaryType`.

Value
-----

A string that can have one of these values:

`"blob"`

Received binary messages' contents will be contained in `Blob` objects.

`"arraybuffer"`

 Received binary messages' contents will be contained in `ArrayBuffer`
 objects.


Example
-------

 This code configures a data channel to receive binary data in
 `ArrayBuffer` objects, and establishes a listener for `message`
 events which constructs a string representing the received data as a list of hexadecimal
 byte values.


```js
const dc = peerConnection.createDataChannel("Binary");
dc.binaryType = "arraybuffer";

dc.onmessage = (event) => {
  const byteArray = new Uint8Array(event.data);
  let hexString = "";

  byteArray.forEach((byte) => {
    hexString += `${byte.toString(16)} `;
  });
};
```

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

| Specification |
| --- |
| WebRTC: Real-Time Communication in Browsers # dom-datachannel-binarytype |

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

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

See also
--------

* WebRTC
* Using WebRTC data channels
* `RTCDataChannel`
* `RTCDataChannel.send()`
VideoColorSpace: transfer property
==================================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
The **`transfer`** read-only property of the `VideoColorSpace` interface returns the opto-electronic transfer characteristics of the video.

Value
-----

A string containing one of the following values:

`"bt709"`

Transfer characteristics used by BT.709.

`"smpte170m"`

Transfer characteristics used by BT.601 NTSC.

`"iec61966-2-1"`

Transfer characteristics used by sRGBA.

Examples
--------

In the following example, `colorSpace` is a `VideoColorSpace` object returned from `VideoFrame`. The value of `transfer` is printed to the console.


```js
let colorSpace = VideoFrame.colorSpace;
console.log(colorSpace.transfer);
```

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

| Specification |
| --- |
| WebCodecs # dom-videocolorspace-transfer |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoColorSpace: VideoColorSpace() constructor
==============================================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
The **`VideoColorSpace()`** constructor creates a new `VideoColorSpace` object which represents a video color space.

Syntax
------


```js
new VideoColorSpace()
new VideoColorSpace(options)
```

### Parameters

All values default to `null` when they are not present.

`options` Optional

An object containing the following:

`primaries` Optional

One of the following strings:

* `"bt709"`
* `"bt470bg"`
* `"smpte170m"`

`transfer` Optional

One of the following strings:

* `"bt709"`
* `"smpte170m"`
* `"iec61966-2-1"`

`matrix` Optional

One of the following strings:

* `"rgb"`
* `"bt709"`
* `"bt470bg"`
* `"smpte170m"`

`fullRange` Optional

A `Boolean`, `true` if full-range color values are used in the video.


Examples
--------

The following example creates a new `VideoColorSpace` object with `VideoColorSpace.primaries` set to `"bt709"`, and `VideoColorSpace.primaries` set to `true`.


```js
const options = {
  primaries: "bt709",
  fullRange: true,
};

const colorSpace = new VideoColorSpace(options);
console.log(colorSpace);
```

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

| Specification |
| --- |
| WebCodecs # dom-videocolorspace-videocolorspace |

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

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

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
The **`fullRange`** read-only property of the `VideoColorSpace` interface returns `true` if full-range color values are used.

Value
-----

A `Boolean`, `true` if full-range color values are used.

Examples
--------

In the following example, `colorSpace` is a `VideoColorSpace` object returned from `VideoFrame`. The value of `fullRange` is printed to the console.


```js
let colorSpace = VideoFrame.colorSpace;
console.log(colorSpace.fullRange);
```

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

| Specification |
| --- |
| WebCodecs # dom-videocolorspace-fullrange |

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

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

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
The **`primaries`** read-only property of the `VideoColorSpace` interface returns the color gamut of the video.

Value
-----

A string containing one of the following values:

`"bt709"`

Color primaries used by BT.709 and sRGB.

`"bt470bg"`

Color primaries used by BT.601 PAL.

`"smpte170m"`

Color primaries used by BT.601 NTSC.

Examples
--------

In the following example, `colorSpace` is a `VideoColorSpace` object returned from `VideoFrame`. The value of `primaries` is printed to the console.


```js
let colorSpace = VideoFrame.colorSpace;
console.log(colorSpace.primaries);
```

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

| Specification |
| --- |
| WebCodecs # dom-videocolorspace-primaries |

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
VideoColorSpace: toJSON() method
================================

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
The **`toJSON()`** method of the `VideoColorSpace` interface is a *serializer* that returns a JSON representation of the `VideoColorSpace` object.

Syntax
------


```js
toJSON()
```

### Parameters

None.

### Return value

A JSON object.

Examples
--------

In the following example, `colorSpace` is a `VideoColorSpace` object returned from `VideoFrame`. This object is then printed to the console as JSON.


```js
let colorSpace = VideoFrame.colorSpace;
console.log(colorSpace.toJSON());
```

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

| Specification |
| --- |
| WebCodecs # dom-videocolorspace-tojson |

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

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

Limited availability
--------------------

This feature is not Baseline because it does not work in some of the most widely-used browsers.

* Learn more
* See full compatibility
* Report feedback
The **`matrix`** read-only property of the `VideoColorSpace` interface returns the matrix coefficient of the video. Matrix coefficients describe the relationship between sample component values and color coordinates.

Value
-----

A string containing one of the following values:

`"rgb"`

Matrix coefficients used by sRGB.

`"bt709"`

Matrix coefficients used by BT.709.

`"bt470bg"`

Matrix coefficients used by BT.601 PAL.

`"smpte170m"`

Matrix coefficients used by BT.601 NTSC.

Examples
--------

In the following example, `colorSpace` is a `VideoColorSpace` object returned from `VideoFrame`. The value of `matrix` is printed to the console.


```js
let colorSpace = VideoFrame.colorSpace;
console.log(colorSpace.matrix);
```

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

| Specification |
| --- |
| WebCodecs # dom-videocolorspace-matrix |

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

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

 The `HTMLFormElement` property
 **`elements`** returns an
 `HTMLFormControlsCollection` listing all the form controls contained in
 the `<form>` element.

 Independently, you can obtain just the
 number of form controls using the `length`
 property.

 You can access a particular form control in the returned collection by using either an
 index or the element's `name` or `id` attributes.

 Prior to HTML 5, the returned object was an `HTMLCollection`, on which
 `HTMLFormControlsCollection` is based.

**Note:** Similarly, you can get a list of all of the forms contained within a given document using the document's `forms` property.

Value
-----

 An `HTMLFormControlsCollection` containing all non-image controls in the form.
 This is a live collection; if form controls are added to or removed from the form, this collection will update to reflect the change.

 The form controls in the returned collection are in the same order in which they appear in the form by following a preorder, depth-first traversal of the tree.
 This is called **tree order**.

Only the following elements are returned:

* `<button>`
* `<fieldset>`
* `<input>` (with the exception that any whose `type` is `"image"` are omitted for historical reasons)
* `<object>`
* `<output>`
* `<select>`
* `<textarea>`
Examples
--------

### Quick syntax example

In this example, we see how to obtain the list of form controls as well as how to access its members by index and by name or ID.


```html
<form id="my-form">
  <label>
    Username:
    <input type="text" name="username" />
  </label>
  <label>
    Full name:
    <input type="text" name="full-name" />
  </label>
  <label>
    Password:
    <input type="password" name="password" />
  </label>
</form>
```



```js
const inputs = document.getElementById("my-form").elements;
const inputByIndex = inputs[0];
const inputByName = inputs["username"];
```

### Accessing form controls

 This example gets the form's element list, then iterates over the list, looking for
 `<input>` elements of type
 `"text"` so that some
 form of processing can be performed on them.


```js
const inputs = document.getElementById("my-form").elements;

// Iterate over the form controls
for (let i = 0; i < inputs.length; i++) {
  if (inputs[i].nodeName === "INPUT" && inputs[i].type === "text") {
    // Update text input
    inputs[i].value.toLocaleUpperCase();
  }
}
```

### Disabling form controls


```js
const inputs = document.getElementById("my-form").elements;

// Iterate over the form controls
for (let i = 0; i < inputs.length; i++) {
  // Disable all form controls
  inputs[i].setAttribute("disabled", "");
}
```

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

| Specification |
| --- |
| HTML Standard # dom-form-elements-dev |

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

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

The **`HTMLFormElement.encoding`** property is an alternative name for the `enctype` element on the DOM `HTMLFormElement` object.

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

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
HTMLFormElement: submit event
=============================

The **`submit`** event fires when a `<form>` is submitted.

Note that the `submit` event fires on the `<form>` element itself, and not on any `<button>` or `<input type="submit">` inside it. However, the `SubmitEvent` which is sent to indicate the form's submit action has been triggered includes a `submitter` property, which is the button that was invoked to trigger the submit request.

The `submit` event fires when:

* the user clicks a submit button,
* the user presses `Enter` while editing a field (e.g. <input type="text">) in a form,
* a script calls the `form.requestSubmit()` method

However, the event is *not* sent to the form when a script calls the `form.submit()` method directly.

**Note:** Trying to submit a form that does not pass validation triggers an `invalid` event. In this case, the validation prevents form submission, and thus there is no `submit` event.

Syntax
------

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


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

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

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

A `SubmitEvent`. Inherits from `Event`.

Event

SubmitEventEvent properties
----------------

*In addition to the properties listed below, this interface inherits the properties of its parent interface, `Event`.*

`submitter` Read only 

An `HTMLElement` object which identifies the button or other element which was invoked to trigger the form being submitted.

Examples
--------

This example uses `EventTarget.addEventListener()` to listen for form submit, and logs the current `Event.timeStamp` whenever that occurs, then prevents the default action of submitting the form.

### HTML


```html
<form id="form">
  <label>Test field: <input type="text" /></label>
  <br /><br />
  <button type="submit">Submit form</button>
</form>
<p id="log"></p>
```

### JavaScript


```js
function logSubmit(event) {
  log.textContent = `Form Submitted! Timestamp: ${event.timeStamp}`;
  event.preventDefault();
}

const form = document.getElementById("form");
const log = document.getElementById("log");
form.addEventListener("submit", logSubmit);
```

### Result

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

| Specification |
| --- |
| HTML Standard # event-submit |
| HTML Standard # handler-onsubmit |

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

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

See also
--------

* HTML `<form>` element
* Related event: `invalid`