SOOP 플레이어 바 숨기기

상단 방송 정보 오버레이와 하단 재생 컨트롤을 숨깁니다. 마우스를 움직이면 나타나고, 0.5초 후 다시 숨겨집니다.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

// ==UserScript==

// @name         SOOP Hide Player Bars
// @name:ko      SOOP 플레이어 바 숨기기

// @description  Hides the top info overlay and bottom playback controls. Bars reappear while the mouse is moving and hide again 0.5s after it stops.
// @description:ko  상단 방송 정보 오버레이와 하단 재생 컨트롤을 숨깁니다. 마우스를 움직이면 나타나고, 0.5초 후 다시 숨겨집니다.

// @author       NWP
// @namespace    https://greatest.deepsurf.us/users/877912
// @version      1.1.0
// @license      MIT
// @match        https://play.sooplive.com/*
// @grant        GM_addStyle
// ==/UserScript==

(function () {
    'use strict';
 
    const CSS_ID = 'soop-hide-bars-style';
 
    const HIDE_CSS = `
        /* 상단 오버레이: 스트리머 이름, 시청자 수, 방송 제목 */
        /* Top overlay: streamer name, viewer count, title */
        #player_info,
        #player_info .detail_info {
            display: none !important;
        }
 
        /* 하단 재생 컨트롤: 재생/일시정지, 볼륨, 화질, 전체화면 등 */
        /* Bottom player controls: play/pause, volume, quality, fullscreen, etc. */
        .player_ctrlBox {
            display: none !important;
        }
 
        /* 채팅/목록/선물 토글 버튼 */
        /* Mini view-control buttons: chat/list/gift toggles */
        .view_ctrl {
            display: none !important;
        }
 
        /* 마우스 커서 숨기기 */
        /* Hide mouse cursor */
        * {
            cursor: none !important;
        }
    `;
 
    const HIDE_DELAY = 500; // 마우스 정지 후 숨기기까지 대기 시간 (ms) / ms to wait after mouse stops before hiding
 
    let hideTimer = null;
 
    function applyHide() {
        if (!document.getElementById(CSS_ID)) {
            const style = document.createElement('style');
            style.id = CSS_ID;
            style.textContent = HIDE_CSS;
            document.head.appendChild(style);
        }
    }
 
    function removeHide() {
        const style = document.getElementById(CSS_ID);
        if (style) style.remove();
    }
 
    function onMouseMove() {
        // 마우스 움직임 감지 시 즉시 표시 / Show bars immediately when mouse moves
        removeHide();
 
        // 타이머 재시작 / Restart the hide countdown
        clearTimeout(hideTimer);
        hideTimer = setTimeout(applyHide, HIDE_DELAY);
    }
 
    // 페이지 로드 시 숨긴 상태로 시작, 첫 마우스 움직임에 표시됨
    // Start hidden; bars appear on first mouse movement
    applyHide();
    document.addEventListener('mousemove', onMouseMove);
})();;