Limited availability
Note: This feature is available in Dedicated Web Workers.
The sourceclose event is fired when a MediaSource object's readyState changes to "closed". This indicates that the MediaSource has been detached from the media element.
Use the event name in methods like addEventListener(), or set an event handler property.
addEventListener("sourceclose", (event) => { })
onsourceclose = (event) => { }
A generic Event.
This example demonstrates detaching a media element from a MediaSource and handling the sourceclose event for proper resource management. The code sets up a MediaSource, attaches it to a video element, and listens for the sourceclose event. When the event fires, it performs cleanup tasks (revokeObjectURL).
const video = document.getElementById("myVideo");
const mediaSource = new MediaSource();
video.src = URL.createObjectURL(mediaSource);
mediaSource.addEventListener("sourceopen", (event) => {
const sourceBuffer = mediaSource.addSourceBuffer(
'video/mp4; codecs="avc1.42E01E"',
);
fetch("video-data.mp4")
.then((response) => response.arrayBuffer())
.then((data) => {
sourceBuffer.appendBuffer(data);
});
});
function detachMediaSource() {
video.src = null; // Detach the MediaSource
}
mediaSource.addEventListener("sourceclose", (event) => {
console.log("MediaSource sourceclose:", event);
// Perform cleanup tasks here, e.g., release resources, update UI
URL.revokeObjectURL(video.src); // Clean up the object URL
});
// Call detachMediaSource() when appropriate, e.g., on a button click
document
.getElementById("detachButton")
.addEventListener("click", detachMediaSource);
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4