Commit 183c91c6 authored by Kai Uwe Broulik's avatar Kai Uwe Broulik 🍇

Install MutationObserver immediately

Don't wait for DOMContentLoaded as document.documentElement is always there (at least as far as HTML is concerned)
and a website might dynamically create objects before that

Differential Revision: https://phabricator.kde.org/D14217
parent 298dac69
......@@ -369,90 +369,90 @@ function playerPause() {
}
function loadMpris() {
document.addEventListener("DOMContentLoaded", function() {
registerAllPlayers();
// TODO figure out somehow when a <video> tag is added dynamically and autoplays
// as can happen on Ajax-heavy pages like YouTube
// could also be done if we just look for the "audio playing in this tab" and only then check for player?
// cf. "checkPlayer" event above
var observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
mutation.addedNodes.forEach(function (node) {
if (typeof node.matches !== "function" || typeof node.querySelectorAll !== "function") {
return;
}
// TODO figure out somehow when a <video> tag is added dynamically and autoplays
// as can happen on Ajax-heavy pages like YouTube
// could also be done if we just look for the "audio playing in this tab" and only then check for player?
// cf. "checkPlayer" event above
var observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
mutation.addedNodes.forEach(function (node) {
if (typeof node.matches !== "function" || typeof node.querySelectorAll !== "function") {
return;
}
// first check whether the node itself is audio/video
if (node.matches("video,audio")) {
registerPlayer(node);
return;
}
// first check whether the node itself is audio/video
if (node.matches("video,audio")) {
registerPlayer(node);
return;
}
// if not, check whether any of its children are
var players = node.querySelectorAll("video,audio");
players.forEach(function (player) {
registerPlayer(player);
});
// if not, check whether any of its children are
var players = node.querySelectorAll("video,audio");
players.forEach(function (player) {
registerPlayer(player);
});
});
mutation.removedNodes.forEach(function (node) {
if (typeof node.matches !== "function" || typeof node.querySelectorAll !== "function") {
return;
mutation.removedNodes.forEach(function (node) {
if (typeof node.matches !== "function" || typeof node.querySelectorAll !== "function") {
return;
}
if (node.matches("video,audio")) {
if (node == activePlayer) {
sendPlayerGone();
}
return;
}
if (node.matches("video,audio")) {
if (node == activePlayer) {
sendPlayerGone();
}
var players = node.querySelectorAll("video,audio");
players.forEach(function (player) {
if (player == activePlayer) {
sendPlayerGone();
return;
}
var players = node.querySelectorAll("video,audio");
players.forEach(function (player) {
if (player == activePlayer) {
sendPlayerGone();
return;
}
});
});
});
});
});
observer.observe(document.documentElement, {
childList: true,
subtree: true
});
// Observe changes to the <title> tag in case it is updated after the player has started playing
var titleTag = document.querySelector("head > title");
if (titleTag) {
var titleObserver = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
var pageTitle = mutation.target.textContent;
if (pageTitle) {
sendMessage("mpris", "titlechange", {
pageTitle: pageTitle
});
}
});
});
observer.observe(document.documentElement, {
childList: true,
subtree: true
});
titleObserver.observe(titleTag, {
childList: true, // text content is technically a child node
subtree: true,
characterData: true
// Observe changes to the <title> tag in case it is updated after the player has started playing
var titleTag = document.querySelector("head > title");
if (titleTag) {
var titleObserver = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
var pageTitle = mutation.target.textContent;
if (pageTitle) {
sendMessage("mpris", "titlechange", {
pageTitle: pageTitle
});
}
});
}
});
window.addEventListener("beforeunload", function () {
// about to navigate to a different page, tell our extension that the player will be gone shortly
// we listen for tab closed in the extension but we don't for navigating away as URL change doesn't
// neccesarily mean a navigation but beforeunload *should* be the thing we want
sendPlayerGone();
titleObserver.observe(titleTag, {
childList: true, // text content is technically a child node
subtree: true,
characterData: true
});
}
window.addEventListener("beforeunload", function () {
// about to navigate to a different page, tell our extension that the player will be gone shortly
// we listen for tab closed in the extension but we don't for navigating away as URL change doesn't
// neccesarily mean a navigation but beforeunload *should* be the thing we want
sendPlayerGone();
});
document.addEventListener("DOMContentLoaded", function() {
registerAllPlayers();
});
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment