rotate-screen

旋轉網頁, Ctrl + Alt + 方向鍵

// ==UserScript==
// @name           rotate-screen
// @namespace      http://tampermonkey.net/
// @version        1.0.0
// @author         Vanisoul
// @description    旋轉網頁, Ctrl + Alt + 方向鍵
// @match          *://*/*
// @grant          none
// ==/UserScript==

(function () {
    'use strict';

    function rotatePage(degrees) {
        const originalWidth = document.documentElement.clientWidth || window.innerWidth;
        const originalHeight = document.documentElement.clientHeight || window.innerHeight;
        let container = document.querySelector('.rotate-container');
        if (!container) {
            container = document.createElement('div');
            container.classList.add('rotate-container');
            while (document.body.firstChild) {
                container.appendChild(document.body.firstChild);
            }
            document.body.appendChild(container);
        }
        container.style.cssText = "";
        if (degrees === 90 || degrees === -90) {
            container.style.width = `${originalHeight}px`;
            container.style.height = `${originalWidth}px`;
            container.style.maxWidth = '100vh';
            container.style.maxHeight = '100vw';
            container.style.overflow = 'auto';
            container.style.position = 'absolute';
            container.style.top = '50%';
            container.style.left = '50%';
            container.style.transform = `translate(-50%, -50%) rotate(${degrees}deg)`;
        }
        else if (degrees === 180 || degrees === -180) {
            container.style.width = `${originalWidth}px`;
            container.style.height = `${originalHeight}px`;
            container.style.overflow = 'auto';
            container.style.position = 'absolute';
            container.style.top = '50%';
            container.style.left = '50%';
            container.style.transform = `translate(-50%, -50%) rotate(${degrees}deg)`;
        }
    }
    document.addEventListener('keydown', function (event) {
        const controlKey = event.ctrlKey;
        const altKey = event.altKey;
        const touchKey = controlKey && altKey;
        if (touchKey) {
            switch (event.key) {
                case "ArrowUp":
                    rotatePage(180);
                    break;
                case "ArrowDown":
                    rotatePage(0);
                    break;
                case "ArrowLeft":
                    rotatePage(90);
                    break;
                case "ArrowRight":
                    rotatePage(-90);
                    break;
            }
        }
    });

})();