MediaWiki:Common.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

//Close x
// The core logic for handling the dismissible cards.
        const initializeDismissibleCards = () => {
            // Function to check local storage and hide cards on page load
            const hideClosedCards = () => {
                const closedCards = JSON.parse(localStorage.getItem('closedCards')) || [];
                closedCards.forEach(cardId => {
                    const card = document.getElementById(cardId);
                    if (card) {
                        card.classList.add('hidden');
                        card.style.display = 'none';
                    }
                });
            };

            // Run the function on load
            hideClosedCards();

            // Select all elements with the class 'close-button'.
            const closeButtons = document.querySelectorAll('.close-button');

            // Loop through each close button and add a click event listener.
            closeButtons.forEach(button => {
                button.addEventListener('click', () => {
                    // Find the closest parent element with the class '.isclosed'.
                    const elementToClose = button.closest('.isclosed');
                    if (elementToClose) {
                        // Apply a class to trigger the CSS transition.
                        elementToClose.classList.add('hidden');

                        // Get the ID of the card to save its state
                        const cardId = elementToClose.id;
                        if (cardId) {
                            // Get existing closed cards from local storage or create a new array
                            const closedCards = JSON.parse(localStorage.getItem('closedCards')) || [];
                            // Add the current card's ID to the list if it's not already there
                            if (!closedCards.includes(cardId)) {
                                closedCards.push(cardId);
                                localStorage.setItem('closedCards', JSON.stringify(closedCards));
                            }
                        }

                        // Set a timeout to completely remove the element from the flow after the animation.
                        setTimeout(() => {
                            elementToClose.style.display = 'none';
                        }, 500); // This duration should match the CSS transition time.
                    }
                });
            });
        };

        // Use a conditional check to ensure the script runs reliably on all pages.
        // This is important for scripts in Common.js where the page might be ready before the script loads.
        if (document.readyState === 'loading') {  // If the document is still loading
            document.addEventListener('DOMContentLoaded', initializeDismissibleCards);
        } else {  // If the document has already loaded
            initializeDismissibleCards();
}