Make hypnotube.com video auto fullscreen on playlist plays
// ==UserScript==
// @name Hypnotube.com Playlist Auto Fullscreen
// @namespace http://tampermonkey.net/
// @version 1.0
// @description Make hypnotube.com video auto fullscreen on playlist plays
// @author MattD
// @license MIT
// @match https://hypnotube.com/video/*
// @icon https://cdn.hypnotube.com/templates/hypnotube/images/touch/fav.png
// @grant none
// ==/UserScript==
(function() {
'use strict';
const createExitButton = (video, originalStyles) => {
const exitBtn = document.createElement('button');
exitBtn.textContent = '✕';
Object.assign(exitBtn.style, {
position: 'fixed',
top: '10px',
right: '10px',
zIndex: '10000',
width: '30px',
height: '30px',
background: 'rgba(0,0,0,0.5)',
color: 'white',
border: 'none',
borderRadius: '50%',
cursor: 'pointer',
fontSize: '16px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
});
document.body.appendChild(exitBtn);
exitBtn.addEventListener('click', () => {
Object.assign(video.style, originalStyles);
document.body.style.overflow = '';
exitBtn.remove();
console.log(`Exited fullscreen`);
});
};
const setFullscreen = () => {
const video = document.querySelector(".plyr--video");
if (!video) return;
const originalStyles = {
position: video.style.position,
top: video.style.top,
left: video.style.left,
width: video.style.width,
height: video.style.height,
zIndex: video.style.zIndex,
background: video.style.background,
};
Object.assign(video.style, {
position: 'fixed',
top: '0',
left: '0',
width: '100vw',
height: '100vh',
zIndex: '9999',
background: 'black',
});
document.body.style.overflow = 'hidden';
console.log(`Fullscreen set`);
createExitButton(video, originalStyles);
};
const init = () => {
console.log(`Hypnotube Automatic Fullscreen Init`);
const isTherePlaylist = document.querySelector(".playlist-widget");
if (isTherePlaylist){setFullscreen()} else{console.log(`Not in a playlist queue, not setting fullscreen`)}
};
document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", init) : init();
})();