smueller/youtube-music
1
0
Fork 0
mirror of https://github.com/th-ch/youtube-music.git synced 2026-01-13 11:21:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add option useNativePiP in PiP plugin to use native PiP

Browse Source
This commit is contained in:
TC
2023-02-01 22:25:33 +01:00
parent d44fb5c840
commit 8a9a3fc69d
1 changed files with 28 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
plugins/picture-in-picture/front.js
View File

@ -5,6 +5,7 @@ const { ElementFromFile, templatePath } = require("../utils");
function $(selector) { return document.querySelector(selector); } function $(selector) { return document.querySelector(selector); }
let useNativePiP = false;
let menu = null; let menu = null;
const pipButton = ElementFromFile( const pipButton = ElementFromFile(
templatePath(__dirname, "picture-in-picture.html") templatePath(__dirname, "picture-in-picture.html")
@ -39,8 +40,24 @@ const observer = new MutationObserver(() => {
menu.prepend(pipButton); menu.prepend(pipButton);
}); });
global.togglePictureInPicture = () => { global.togglePictureInPicture = async () => {
if (useNativePiP) {
const isInPiP = document.pictureInPictureElement !== null;
const video = $("video");
const togglePiP = () =>
isInPiP
? document.exitPictureInPicture.call(document)
: video.requestPictureInPicture.call(video);
try {
await togglePiP();
$("#icon").click(); // Close the menu
return true;
} catch {}
}
ipcRenderer.send("picture-in-picture"); ipcRenderer.send("picture-in-picture");
return false;
}; };
const listenForToggle = () => { const listenForToggle = () => {
@ -75,19 +92,24 @@ const listenForToggle = () => {
} }
function observeMenu(options) { function observeMenu(options) {
useNativePiP = options.useNativePiP;
document.addEventListener( document.addEventListener(
"apiLoaded", "apiLoaded",
() => { () => {
listenForToggle(); if (!useNativePiP) {
listenForToggle();
}
// remove native listeners // remove native listeners
cloneButton(".player-minimize-button").onclick = () => { cloneButton(".player-minimize-button").onclick = async () => {
global.togglePictureInPicture(); const isUsingNativePiP = await global.togglePictureInPicture();
setTimeout(() => $('#player').click()); if (!isUsingNativePiP) {
setTimeout(() => $("#player").click());
}
}; };
// allows easily closing the menu by programmatically clicking outside of it // allows easily closing the menu by programmatically clicking outside of it
$("#expanding-menu").removeAttribute("no-cancel-on-outside-click"); $("#expanding-menu").removeAttribute("no-cancel-on-outside-click");
// TODO: think about wether an additional button in songMenu is needed // TODO: think about wether an additional button in songMenu is needed
observer.observe($("ytmusic-popup-container"), { observer.observe($("ytmusic-popup-container"), {
childList: true, childList: true,
subtree: true, subtree: true,