BGG Simplify Mark Read Button

Replaces 'Mark All Read' with a direct 'Mark Current Page Read' button and hides unnecessary elements.

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

You will need to install an extension such as Tampermonkey to install this script.

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

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

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

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

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

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

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

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

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

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

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

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

// ==UserScript==
// @name         BGG Simplify Mark Read Button
// @namespace    https://github.com/kofaysi/bgg-userscripts/blob/main/bgg-simplify-mark-read-button.user.js
// @version      1.5
// @description  Replaces 'Mark All Read' with a direct 'Mark Current Page Read' button and hides unnecessary elements.
// @author       https://github.com/kofaysi/
// @match        https://boardgamegeek.com/subscriptions*
// @license      MIT
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    function simplifyMarkReadButton() {
        // Find the 'Mark All Read' button by its content
        const buttons = document.querySelectorAll("button");
        let markAllReadButton = null;

        buttons.forEach(button => {
            if (button.textContent.includes("Mark All Read")) {
                markAllReadButton = button;
            }
        });

        if (!markAllReadButton) return;

        // Find its dropdown container
        const dropdownContainer = markAllReadButton.closest("div.dropdown");
        if (!dropdownContainer) return;

        // Find the dropdown menu
        let dropdownMenu = dropdownContainer.querySelector(".dropdown-menu");
        if (!dropdownMenu) return;

        // Find the 'Mark Current Page Read' button inside the dropdown
        let markCurrentPageButton = null;
        dropdownMenu.querySelectorAll("button").forEach(button => {
            if (button.textContent.includes("Mark Current Page Read")) {
                markCurrentPageButton = button;
            }
        });

        if (!markCurrentPageButton) return;

        // Clone 'Mark Current Page Read' and replace the main button
        const newButton = markCurrentPageButton.cloneNode(true);
        newButton.onclick = () => markCurrentPageButton.click();
        newButton.className = markAllReadButton.className.replace("dropdown-toggle", ""); // Remove dropdown-toggle class
        newButton.textContent = "Mark Current Page Read";

        // Change button color
        newButton.style.setProperty("--bs-btn-bg", "#005bca");
        newButton.style.setProperty("--bs-btn-hover-bg", "#004a9f");
        newButton.style.setProperty("--bs-btn-border-color", "#005bca");
        newButton.style.setProperty("--bs-btn-hover-border-color", "#004a9f");
        newButton.style.setProperty("--bs-btn-active-border-color", "#004a9f");
        newButton.style.setProperty("--bs-btn-active-color", "#004a9f");

        // Replace 'Mark All Read' button with new one
        markAllReadButton.replaceWith(newButton);

        // Hide the dropdown menu
        dropdownMenu.style.display = "none";
    }

    // Use MutationObserver to wait for dynamically loaded content
    function observePage() {
        const observer = new MutationObserver(() => {
            simplifyMarkReadButton();
        });
        observer.observe(document.body, { childList: true, subtree: true });
    }

    window.addEventListener('load', () => {
        setTimeout(simplifyMarkReadButton, 2000); // Delay execution to ensure elements are fully loaded
        observePage();
    });
})();