// ==UserScript==
// @name         Bina Top - ניקוי דף הבית בלבד
// @namespace    https://bina.top/
// @version      5.0.0
// @description  מסתיר בלוקים בדף הבית בלבד ומרחיב את הקטגוריות, ללא שינוי בסרגלי הצד
// @match        https://bina.top/*
// @run-at       document-start
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    // ============================================================
    // שמות האלמנטים שהסקריפט עצמו משנה
    // ============================================================

    const STYLE_ID = 'bina-top-home-only-style';

    const MODIFIED_CLASS =
        'bina-top-home-modified';


    // ============================================================
    // האם זה דף הקטגוריות?
    // ============================================================

    function isCategoriesPage() {

        return (
            document.body &&
            document.body.classList.contains(
                'page-categories'
            )
        );
    }


    // ============================================================
    // CSS - רק לדף הקטגוריות
    //
    // חשוב:
    // אין כאן שום selector של:
    //
    // .sidebar-left
    // .sidebar-right
    // nav.sidebar
    //
    // ============================================================

    function addHomeStyle() {

        if (document.getElementById(STYLE_ID)) {
            return;
        }

        const style =
            document.createElement('style');

        style.id = STYLE_ID;

        style.textContent = `

            /* ====================================================
               הקרוסלה העליונה
               ==================================================== */

            body.page-categories
            #content
            .recent-cards-plugin {

                display: none !important;

                height: 0 !important;
                min-height: 0 !important;
                max-height: 0 !important;

                width: 0 !important;

                margin: 0 !important;
                padding: 0 !important;
                border: 0 !important;
            }


            /* ====================================================
               ה-wrapper של הקרוסלה
               ==================================================== */

            body.page-categories
            #content
            > [data-widget-area="header"] {

                display: none !important;

                height: 0 !important;
                min-height: 0 !important;

                margin: 0 !important;
                padding: 0 !important;
            }


            /* ====================================================
               עמודת הווידג'טים של דף הקטגוריות בלבד
               ==================================================== */

            body.page-categories
            #content
            > .row
            > [data-widget-area="sidebar"] {

                display: none !important;

                width: 0 !important;
                max-width: 0 !important;

                flex: 0 0 0 !important;

                margin: 0 !important;
                padding: 0 !important;
            }


            /* ====================================================
               עמודת הקטגוריות
               75% -> 100%
               ==================================================== */

            body.page-categories
            #content
            > .row
            > .col-lg-9 {

                width: 100% !important;
                max-width: 100% !important;

                flex: 0 0 100% !important;

                margin-left: 0 !important;
                margin-right: 0 !important;
            }


            /* ====================================================
               רשימת הקטגוריות
               ==================================================== */

            body.page-categories
            #content
            .categories-list {

                width: 100% !important;
                max-width: 100% !important;

                margin-left: 0 !important;
                margin-right: 0 !important;
            }


            /* ====================================================
               הקטגוריות עצמן
               ==================================================== */

            body.page-categories
            #content
            [component="categories/category"] {

                width: 100% !important;
                max-width: 100% !important;
            }


            /* ====================================================
               הרוחב הפנימי של כל קטגוריה
               ==================================================== */

            body.page-categories
            #content
            [component="categories/category"]
            > .col-lg-7 {

                width: 58.333333% !important;
                max-width: 58.333333% !important;

                flex: 0 0 58.333333% !important;
            }


            body.page-categories
            #content
            [component="categories/category"]
            > .col-lg-5 {

                width: 41.666667% !important;
                max-width: 41.666667% !important;

                flex: 0 0 41.666667% !important;
            }

        `;

        document.head.appendChild(style);
    }


    // ============================================================
    // הסרת ה-CSS של הסקריפט
    //
    // חשוב במיוחד במעבר SPA של NodeBB.
    // ============================================================

    function removeHomeStyle() {

        const style =
            document.getElementById(STYLE_ID);

        if (style) {
            style.remove();
        }
    }


    // ============================================================
    // ניקוי inline styles שהסקריפט עצמו הוסיף
    // ============================================================

    function removeOurInlineStyles() {

        const elements =
            document.querySelectorAll(
                '.' + MODIFIED_CLASS
            );

        elements.forEach(function (element) {

            /*
             * מחזירים רק properties שהסקריפט
             * הזה עצמו שינה.
             */

            element.style.removeProperty(
                'display'
            );

            element.style.removeProperty(
                'height'
            );

            element.style.removeProperty(
                'min-height'
            );

            element.style.removeProperty(
                'max-height'
            );

            element.style.removeProperty(
                'width'
            );

            element.style.removeProperty(
                'max-width'
            );

            element.style.removeProperty(
                'flex'
            );

            element.style.removeProperty(
                'margin'
            );

            element.style.removeProperty(
                'margin-left'
            );

            element.style.removeProperty(
                'margin-right'
            );

            element.style.removeProperty(
                'padding'
            );

            element.classList.remove(
                MODIFIED_CLASS
            );
        });
    }


    // ============================================================
    // הפעלה בדף הבית
    // ============================================================

    function applyHomeLayout() {

        if (!isCategoriesPage()) {

            /*
             * לא דף הבית:
             *
             * הסר את ה-CSS שלנו.
             */
            removeHomeStyle();

            return;
        }


        addHomeStyle();
    }


    // ============================================================
    // מעקב אחרי שינויי NodeBB
    // ============================================================

    let timer = null;

    function schedule() {

        if (timer !== null) {
            return;
        }

        timer = setTimeout(function () {

            timer = null;

            applyHomeLayout();

        }, 50);
    }


    // ============================================================
    // Observer
    // ============================================================

    function startObserver() {

        const observer =
            new MutationObserver(function (mutations) {

                let relevant = false;

                for (const mutation of mutations) {

                    if (
                        mutation.type === 'childList' ||
                        mutation.type === 'attributes'
                    ) {
                        relevant = true;
                        break;
                    }
                }

                if (relevant) {
                    schedule();
                }

            });


        observer.observe(
            document.documentElement,
            {
                childList: true,
                subtree: true,
                attributes: true,
                attributeFilter: [
                    'class'
                ]
            }
        );
    }


    // ============================================================
    // NodeBB Ajax navigation
    // ============================================================

    function setupNavigation() {

        /*
         * NodeBB משתמש ב-Ajaxify.
         *
         * לכן כאשר עוברים:
         *
         * דף הבית -> נושא
         *
         * ה-body משתנה מ:
         *
         * page-categories
         *
         * ל:
         *
         * page-topic
         *
         * ואז ה-CSS שלנו מוסר.
         */

        if (window.jQuery) {

            jQuery(document).on(
                'action:ajaxify.end',
                function () {

                    schedule();

                }
            );
        }


        window.addEventListener(
            'popstate',
            function () {

                setTimeout(
                    schedule,
                    50
                );

            }
        );
    }


    // ============================================================
    // הפעלה ראשונית
    // ============================================================

    function start() {

        applyHomeLayout();

        startObserver();

        setupNavigation();

        /*
         * הרצות נוספות בגלל טעינה דינמית.
         */

        setTimeout(
            applyHomeLayout,
            100
        );

        setTimeout(
            applyHomeLayout,
            500
        );

        setTimeout(
            applyHomeLayout,
            1000
        );
    }


    // ============================================================
    // DOM Ready
    // ============================================================

    if (
        document.readyState ===
        'loading'
    ) {

        document.addEventListener(
            'DOMContentLoaded',
            start,
            {
                once: true
            }
        );

    } else {

        start();

    }

})();