Ir para o conteúdo

MediaWiki:Common.js

De SplixMMO wiki

Nota: Após publicar, você pode ter que limpar o "cache" do seu navegador para ver as alterações.

  • Firefox / Safari: Pressione Shift enquanto clica Recarregar, ou pressione Ctrl-F5 ou Ctrl-R (⌘-R no Mac)
  • Google Chrome: Pressione Ctrl-Shift-R (⌘-Shift-R no Mac)
  • Edge: Pressione Ctrl enquanto clica Recarregar, ou pressione Ctrl-F5.
  • Opera: Pressione Ctrl-F5.
/* Códigos JavaScript aqui colocados serão carregados por todos aqueles que acessarem alguma página deste wiki */
/* =========================================================
   SPLIXMMO WIKI
   MediaWiki:Common.js
   ========================================================= */


/* =========================================================
   MENU PRINCIPAL SEMPRE FIXADO
   ========================================================= */

(function () {

	'use strict';

	function splixPinMainMenu() {

		var pinButton = document.querySelector(
			'[data-event-name="pinnable-header.vector-main-menu.pin"]'
		);

		/*
		 * Se existir o botão "fixar", significa que o menu
		 * ainda está no modo hambúrguer.
		 */

		if (pinButton) {
			pinButton.click();
		}
	}


	/*
	 * Se o Vector já terminou de inicializar,
	 * fixa imediatamente.
	 */

	if (
		document.documentElement.classList.contains(
			'vector-animations-ready'
		)
	) {
		splixPinMainMenu();
		return;
	}


	/*
	 * Caso contrário, aguarda a inicialização do Vector.
	 */

	var observer = new MutationObserver(function () {

		if (
			document.documentElement.classList.contains(
				'vector-animations-ready'
			)
		) {

			splixPinMainMenu();

			observer.disconnect();
		}
	});


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

})();







/* ==========================================================
   SPLIX - MASONRY DAS SKILLS
   ========================================================== */

(function () {
    'use strict';

    function resizeMasonryItem(item) {

        var grid = item.parentElement;

        if (!grid) {
            return;
        }


        /* Mobile: fluxo normal */
        if (window.innerWidth <= 950) {
            item.style.gridRowEnd = '';
            return;
        }


        var gridStyle =
            window.getComputedStyle(grid);


        var rowHeight =
            parseInt(
                gridStyle.getPropertyValue('grid-auto-rows'),
                10
            );


        var rowGap =
            parseInt(
                gridStyle.getPropertyValue('row-gap'),
                10
            );


        if (!rowHeight) {
            rowHeight = 8;
        }

        if (!rowGap) {
            rowGap = 16;
        }


        /*
         * Remove o span anterior antes de medir.
         */
        item.style.gridRowEnd = 'auto';


        /*
         * Altura real do card.
         */
        var itemHeight =
            item.getBoundingClientRect().height;


        /*
         * Fórmula correta considerando:
         *
         * altura das linhas +
         * gaps existentes entre elas.
         */
        var rowSpan =
            Math.ceil(
                (itemHeight + rowGap) /
                (rowHeight + rowGap)
            );


        item.style.gridRowEnd =
            'span ' + rowSpan;
    }


    function resizeAllMasonryItems() {

        var items =
            document.querySelectorAll(
                '.splix-rebalance-skill-grid > .splix-rebalance-skill'
            );


        items.forEach(function (item) {
            resizeMasonryItem(item);
        });

    }


    function scheduleMasonry() {

        window.requestAnimationFrame(function () {
            resizeAllMasonryItems();
        });

    }


    /* ======================================================
       MEDIAWIKI
       ====================================================== */

    mw.hook('wikipage.content').add(function () {

        scheduleMasonry();


        /*
         * Recalcula depois que imagens carregarem.
         */
        document
            .querySelectorAll(
                '.splix-rebalance-skill-grid img'
            )
            .forEach(function (img) {

                if (!img.complete) {

                    img.addEventListener(
                        'load',
                        scheduleMasonry,
                        { once: true }
                    );

                }

            });


        /*
         * Segunda medição após renderização
         * de fontes/estilos.
         */
        setTimeout(scheduleMasonry, 100);
        setTimeout(scheduleMasonry, 300);

    });


    /* ======================================================
       RESIZE
       ====================================================== */

    var resizeTimer;

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

            clearTimeout(resizeTimer);

            resizeTimer =
                setTimeout(
                    resizeAllMasonryItems,
                    120
                );

        }
    );

})();






mw.hook('wikipage.content').add(function ($content) {

    $content.find('.splix-class-nav-card[data-anchor]').each(function () {

        var card = this;
        var anchor = card.getAttribute('data-anchor');

        if (!anchor) {
            return;
        }

        card.setAttribute('role', 'link');
        card.setAttribute('tabindex', '0');

        card.addEventListener('click', function () {
            window.location.hash = anchor;
        });

        card.addEventListener('keydown', function (event) {
            if (event.key === 'Enter' || event.key === ' ') {
                event.preventDefault();
                window.location.hash = anchor;
            }
        });

    });

});