FreshRSS Double-Tap and Auto-Scroll

Double-tap to close active articles and auto-scroll to the active article in FreshRSS.
当前为 2025-02-04 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         FreshRSS Double-Tap and Auto-Scroll
// @namespace    http://tampermonkey.net/
// @version      1.1
// @description  Double-tap to close active articles and auto-scroll to the active article in FreshRSS.
// @author       Your Name
// @homepage     https://greasyfork.org/en/scripts/525912
// @match        http://192.168.1.2:1030/*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    // Double-tap event to close active articles
    document.addEventListener('dblclick', function (event) {
        // Check if the double-tap is on an interactive element
        const interactiveElements = ['A', 'BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'LABEL'];
        if (interactiveElements.includes(event.target.tagName)) {
            return; // Ignore double-taps on interactive elements
        }

        // Find the closest element with 'active' classes
        const activeElement = event.target.closest('.active');
        if (activeElement) {
            // Remove the 'active' class
            activeElement.classList.remove('active');
            // console.log('Removed "active" class from:', activeElement);

            // Scroll the page to the closed article (activeElement)
            activeElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
        }
    });

    // Automatically scroll to the active article when it gains the 'active' class
    const observeActiveElements = () => {
        // Set up a MutationObserver to watch for changes to the 'active' class
        const observer = new MutationObserver((mutations) => {
            mutations.forEach((mutation) => {
                if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
                    const targetElement = mutation.target;
                    if (targetElement.classList.contains('active')) {
                        // Scroll the active element into view
                        targetElement.scrollIntoView({ behavior: 'smooth', block: 'top' });
                    }
                }
            });
        });

        // Observe all elements with the 'flux' class (potential candidates for 'active')
        const currentElements = document.querySelectorAll('.flux');
        currentElements.forEach((element) => {
            observer.observe(element, { attributes: true });
        });
    };

    // Start observing for changes
    observeActiveElements();
})();