soop(숲) 방송국 팬 리스트 접기 (초코)

Greasy Fork is available in English.
soop(숲) 방송국 팬 리스트 접기 (초코)

접기 상태를 기억하여 다른 방송국이나 재방문 시에도 유지됩니다.
换行
// ==UserScript==
// @name         soop(숲) 방송국 팬 리스트 접기 (초코)
// @namespace    http://tampermonkey.net/
// @version      2.2
// @license      MIT
// @icon         https://res.sooplive.com/afreeca.ico
// @homepageURL  https://www.sooplive.com/station/cctvno
// @description  접기 상태를 기억하여 다른 방송국이나 재방문 시에도 유지됩니다.
// @author       초코
// @match        *://www.sooplive.com/*
// @match        *://*.sooplive.com/*
// @run-at       document-end
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const style = document.createElement('style');
    style.innerHTML = `
        .choco-fold-btn {
            cursor: pointer !important;
            font-size: 11px !important;
            color: #ff4500 !important;
            border: 1px solid #ff4500 !important;
            padding: 1px 5px !important;
            border-radius: 4px !important;
            margin-left: 10px !important;
            display: inline-block !important;
            background-color: #ffffff !important;
            z-index: 99999 !important;
            font-weight: bold !important;
            transition: all 0.2s !important;
        }
        .choco-is-folded {
            background-color: #eeeeee !important;
            color: #888888 !important;
            border-color: #888888 !important;
        }
        .choco-hide-list { display: none !important; }
    `;
    document.head.appendChild(style);

    const applyFolding = () => {
        const allTags = document.querySelectorAll('h3, .title_fan, .list_fan strong');

        allTags.forEach(el => {
            const txt = el.innerText.trim();
            if ((txt.includes("열혈팬") || txt.includes("구독팬")) && !el.querySelector('.choco-fold-btn')) {

                const btn = document.createElement('span');
                btn.className = 'choco-fold-btn';
                btn.innerText = '접기';
                el.appendChild(btn);

                let container = el.closest('div') || el.parentElement;
                let list = container.querySelector('ul') || container.nextElementSibling;

                if (list) {
                    // ★ 핵심: 저장된 기억 불러오기 (txt는 "열혈팬" 또는 "구독팬")
                    const savedState = localStorage.getItem(`choco_fold_${txt}`);

                    if (savedState === 'true') {
                        list.classList.add('choco-hide-list');
                        btn.classList.add('choco-is-folded');
                        btn.innerText = '펼치기';
                    }

                    btn.onclick = (e) => {
                        e.preventDefault();
                        e.stopPropagation();

                        const isHidden = list.classList.toggle('choco-hide-list');

                        // ★ 핵심: 클릭할 때마다 상태 저장
                        localStorage.setItem(`choco_fold_${txt}`, isHidden);

                        if (isHidden) {
                            btn.classList.add('choco-is-folded');
                            btn.innerText = '펼치기';
                        } else {
                            btn.classList.remove('choco-is-folded');
                            btn.innerText = '접기';
                        }
                    };
                }
            }
        });
    };

    setInterval(applyFolding, 500);
})();