User:Stumblean/common.js: Difference between revisions
No edit summary Tags: Mobile edit Mobile web edit Advanced mobile edit |
No edit summary Tags: Mobile edit Mobile web edit Advanced mobile edit |
||
Line 1: | Line 1: | ||
(function () { | (function () { | ||
const icon = "https://files.catbox.moe/wk78nl.jpg"; | const icon = "https://files.catbox.moe/wk78nl.jpg"; | ||
const menu = document.createElement("div"); | const menu = document.createElement("div"); | ||
Line 18: | Line 17: | ||
boxShadow: "0 0 10px black", | boxShadow: "0 0 10px black", | ||
touchAction: "none", | touchAction: "none", | ||
width: "300px", | |||
}); | }); | ||
Line 71: | Line 71: | ||
}); | }); | ||
const | // YouTube embed container, hidden by default | ||
const ytContainer = document.createElement("div"); | |||
ytContainer.style.display = "none"; | |||
ytContainer.style.marginTop = "10px"; | |||
ytContainer.style.textAlign = "center"; | |||
const ytIframe = document.createElement("iframe"); | |||
ytIframe.width = "280"; | |||
ytIframe.height = "157"; // 16:9 aspect ratio for 280 width | |||
ytIframe.src = "https://www.youtube.com/embed/MtYy5YMF6fk?autoplay=1"; | |||
ytIframe.title = "Self Embodiment of Perfection OST - Mahito Theme"; | |||
ytIframe.frameBorder = "0"; | |||
ytIframe.allow = | |||
"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"; | |||
ytIframe.allowFullscreen = true; | |||
ytContainer.appendChild(ytIframe); | |||
const btnEncouragement = makeButton("Encouragement", () => { | |||
if (ytContainer.style.display === "none") { | |||
ytContainer.style.display = "block"; | |||
} else { | |||
ytContainer.style.display = "none"; | |||
// Stop the video by resetting the src | |||
ytIframe.src = ytIframe.src; | |||
} | |||
}); | }); | ||
menu.appendChild(header); | menu.appendChild(header); | ||
menu.appendChild(btn1); | menu.appendChild(btn1); | ||
menu.appendChild(btn2); | menu.appendChild(btn2); | ||
menu.appendChild( | menu.appendChild(btnEncouragement); | ||
menu.appendChild(ytContainer); | |||
document.body.appendChild(menu); | document.body.appendChild(menu); | ||
// === DRAGGING === | // === DRAGGING === | ||
let isDragging = false; | let isDragging = false; | ||
let offsetX = 0, offsetY = 0; | let offsetX = 0, | ||
offsetY = 0; | |||
function startDrag(x, y) { | function startDrag(x, y) { |