MediaWiki:Common.js

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)
• Internet Explorer/Edge: PressioneCtrl enquanto clica Recarregar, ou Pressione Ctrl-F5
• Opera: Pressione Ctrl-F5.

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

    var API = "https://api.pkro.com.br";

    function roColorToHtml(text) {
        var html = "";
        var colorStack = false;

        var parts = text.split(/\^([0-9A-Fa-f]{6})/);

        for (var i = 0; i < parts.length; i++) {
            if (i % 2 === 1) {
                if (colorStack) html += "</span>";
                html += '<span style="color:#' + parts[i] + '">';
                colorStack = true;
            } else {
                html += parts[i];
            }
        }

        if (colorStack) html += "</span>";

        return html.replace(/\n/g, "<br>");
    }

    document.querySelectorAll(".mw-item").forEach(function (el) {

        if (el.dataset.loaded) return; // evita duplicar
        el.dataset.loaded = "1";

        var id = el.dataset.id;

        fetch(API + "/item/" + id)
            .then(function (r) { return r.json(); })
            .then(function (item) {

                el.innerHTML = '<img src="' + API + item.icon + '" width="32">';

                el.addEventListener("mouseenter", function () {

                    var tip = document.createElement("div");
                    tip.className = "item-tooltip";

                    tip.innerHTML =
                        '<img class="icon" src="' + API + item.icon + '">' +
                        '<div class="title">' + item.name + '</div>' +
                        '<div class="text">' +
                        roColorToHtml(item.description) +
                        '</div>';

                    document.body.appendChild(tip);

                    var move = function (ev) {
                        var x = ev.clientX + 20;
                        var y = ev.clientY + 20;

                        if (x + 280 > window.innerWidth)
                            x = ev.clientX - 300;

                        if (y + 120 > window.innerHeight)
                            y = ev.clientY - 140;

                        tip.style.left = x + "px";
                        tip.style.top = y + "px";
                    };


                    document.addEventListener("mousemove", move);

                    el.addEventListener("mouseleave", function () {
                        tip.remove();
                        document.removeEventListener("mousemove", move);
                    }, { once: true });

                });

            })
            .catch(function (err) {
                console.error("Item API erro:", err);
                el.innerHTML = "[erro]";
            });

    });

});