Live Reaction helper

This is a helper script to make the Live Page Reaction userscript work.

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==UserScript==
// @name         Live Reaction helper
// @namespace    http://tampermonkey.net/
// @version      2024-09-05
// @description  This is a helper script to make the Live Page Reaction userscript work.
// @author       Riedler
// @match        https://*/*
// @icon         https://riedler.wien/favicon.png
// @grant        none
// @license      CC0
// ==/UserScript==

(function() {
    'use strict';

    document.body.id = 'livereaction-mainbody'

    let overlayElement = document.createElement('DIV')
    overlayElement.id = 'livereaction-overlay'
    overlayElement.innerHTML = "<span>LIVE</span><span id='livereaction-cam1'></span><span>REACTION</span><div id='livereaction-cam2'></div>"
    overlayElement.style.backgroundColor = window.getComputedStyle(document.body, null).getPropertyValue('background-color')
    document.documentElement.appendChild(overlayElement)
    document.addEventListener('scroll',(_event)=>{
        let offset = document.scrollingElement.scrollTop;
        document.documentElement.style.setProperty('--scrollTop', offset + 'px')
    })
    const rO = new ResizeObserver((entries)=>{
        let height = document.body.clientHeight;
        document.documentElement.style.setProperty('--clientHeight', height + 'px')
    });
    rO.observe(document.body)

})();