REMOVA OS ANÚNCIOS!

Apoiando através de https://apoia.se/arddhu a partir do tier de Apoiador, você pode navegar na wiki sem anúncios e ainda colabora com o projeto!

MediaWiki:Common.js: mudanças entre as edições

De Runarcana Wiki
Sem resumo de edição
Sem resumo de edição
Linha 62: Linha 62:


/* Runa TOC */
/* Runa TOC */
/* TOC */
$(document).ready(function () {
$(document).ready(function () {
    // Funções para gerar o TOC personalizado
  $(function () {
    function generateTOCHTML(sections) {
    var $window,
        let tocHTML = `
      $mwPanel,
        <div id="runa-toc" class="runa-toc runa-dropdown">
      $floatTOC,
            <details class="runa-dropdown-details">
      scrollHandler,
                <summary class="runa-dropdown-summary" title="Conteúdo">
      tocLimit,
                    <span class="runa-ui-icon mw-ui-icon-wikimedia-listBullet"></span>
      headingOffsets,
                    <span>Conteúdo</span>
      headingThreshold,
                </summary>
      $toc = $("#toc");
            </details>
            <nav id="mw-panel-toc" class="runa-toc-card runa-menu__card" role="navigation">
                <a class="runa-toc-top runa-toc-link" title="Voltar ao topo" href="#top">
                    <div class="runa-ui-icon mw-ui-icon-first mw-ui-icon-wikimedia-first"></div>
                    <div class="runa-toc-text">Voltar ao topo</div>
                </a>
                <div class="runa-menu__heading">Conteúdo</div>
                <ul class="runa-toc-contents" id="mw-panel-toc-list">
                    ${generateSectionHTML(sections)}
                </ul>
            </nav>
        </div>`;
        return tocHTML;
    }


     function generateSectionHTML(sections) {
     if (!$toc.length) {
        return sections.map(section => `
      return;
            <li id="toc-${section.anchor}" class="runa-toc-list-item runa-toc-level-${section.toclevel}">
                <a class="runa-toc-link" href="#${section.anchor}">
                    <div class="runa-toc-indicator"></div>
                    <div class="runa-toc-content">
                        <div class="runa-toc-text">
                            <span class="runa-toc-numb">${section.number}</span>
                            <span class="runa-toc-heading">${section.line}</span>
                        </div>
                        ${section.htmlSummary ? `<div class="runa-toc-summary">${section.htmlSummary}</div>` : ""}
                    </div>
                </a>
                ${section.isTopLevel && section.isParentSection ? `
                    <button aria-controls="toc-${section.anchor}-sublist" class="runa-toc-toggle">
                        <span class="runa-ui-icon mw-ui-icon-wikimedia-collapse"></span>
                        <span>Expandir</span>
                    </button>
                ` : ""}
                ${section.arraySections ? `<ul id="toc-${section.anchor}-sublist" class="runa-toc-list">
                    ${generateSectionHTML(section.arraySections)}
                </ul>` : ""}
            </li>
        `).join('');
     }
     }


     // Obter dados das seções
     $window = $(window);
    function getSectionsData() {
    $mwPanel = $("#mw-panel");
        const sections = [];
        $('#mw-content-text h2, #mw-content-text h3').each(function(index, element) {
            const $el = $(element);
            sections.push({
                toclevel: $el.prop('tagName') === 'H2' ? 1 : 2,
                anchor: $el.attr('id'),
                line: $el.text(),
                number: index + 1,
                isTopLevel: $el.prop('tagName') === 'H2',
                isParentSection: $el.next().is('h3'),
                arraySections: []
            });
        });
        return sections;
    }


     // Iniciar o TOC
     headingThreshold = $window.height() / 5.0;
    const sections = getSectionsData();
    if (!sections.length) return;


    const tocHTML = generateTOCHTML(sections);
     $floatTOC = $toc
     $('#toc').html(tocHTML);
      .clone()
 
      .removeAttr("id")
    // Função original para cópia e manipulação do TOC
      .attr("id", "floatTOC")
    var $window = $(window),
      .addClass("floatTOC")
        $mwPanel = $("#mw-panel"),
      .appendTo("body");
        $floatTOC = $('#toc').clone().removeAttr("id").attr("id", "floatTOC").addClass("floatTOC").appendTo("body");


     $floatTOC.find("ul").show();
     $floatTOC.find("ul").show();
Linha 153: Linha 100:


     var tocToggleButtonIconNodeContent;
     var tocToggleButtonIconNodeContent;
     if (getCookie("showTOC") == "false") {
     if (getCookie("showTOC") == "false") {
         tocToggleButtonIconNodeContent = document.createTextNode("chevron_left");
         tocToggleButtonIconNodeContent = document.createTextNode("chevron_left");
         $floatTOC.addClass("hiddenFloatTOC");
         $floatTOC.addClass("hiddenFloatTOC");
     } else {
     } else {
Linha 162: Linha 111:
     tocToggleButtonIconNode.appendChild(tocToggleButtonIconNodeContent);
     tocToggleButtonIconNode.appendChild(tocToggleButtonIconNodeContent);
     tocToggleButton.appendChild(tocToggleButtonIconNode);
     tocToggleButton.appendChild(tocToggleButtonIconNode);
     $floatTOC.prepend(tocToggleButton);
     $floatTOC.prepend(tocToggleButton);


     $floatTOC.find("a").click(function (e) {
     $floatTOC.find("a").click(function (e) {
        $("html, body").animate({
      $("html, body").animate({
            scrollTop: $(this.hash.replace(/\./g, "\\.")).offset().top - ($window.height() / 5.0),
        scrollTop:
        });
          $(this.hash.replace(/\./g, "\\.")).offset().top - headingThreshold,
        return false;
      });
 
      return false;
     });
     });


     var tocLimit = $('#toc').offset().top + $('#toc').height(),
     tocLimit = $toc.offset().top + $toc.height();
        headingOffsets = [];
    headingOffsets = [];
   
 
     $(".mw-headline").each(function () {
     $(".mw-headline").each(function () {
        headingOffsets.push([$(this).attr("id"), $(this).offset().top]);
      headingOffsets.push([$(this).attr("id"), $(this).offset().top]);
     });
     });


     function scrollHandler() {
     scrollHandler = function () {
        var $current, scrollTop = $window.scrollTop();
      var $current,
        if (scrollTop > tocLimit) {
        scrollTop = $window.scrollTop();
            $mwPanel.hide();
 
            var highlight = false;
      if (scrollTop > tocLimit) {
            $.each(headingOffsets, function (i, v) {
        $mwPanel.hide();
                if (i !== 0 && scrollTop + ($window.height() / 5.0) < v[1]) {
 
                    highlight = headingOffsets[i - 1][0];
        var highlight = false;
                    return false;
 
                }
        $.each(headingOffsets, function (i, v) {
            });
          if (i !== 0 && scrollTop + headingThreshold < v[1]) {
            if (highlight) {
            highlight = headingOffsets[i - 1][0];
                $current = $floatTOC.find('a[href="#' + highlight + '"]');
            return false;
                $floatTOC.find("a").not($current).css("font-weight", "");
          }
                $current.css("font-weight", "bold");
        });
            }
 
        } else {
        if (highlight) {
            $mwPanel.show();
          $current = $floatTOC.find('a[href="#' + highlight + '"]');
          $floatTOC.find("a").not($current).css("font-weight", "");
          $current.css("font-weight", "bold");
         }
         }
     }
      } else {
        $mwPanel.show();
      }
     };


     $window.on("scroll", OO.ui.throttle(250, scrollHandler));
     $window.on("scroll", OO.ui.throttle(250, scrollHandler));
  });
});
});


// Alternância de visibilidade do TOC
function toggleTOCVisibility() {
function toggleTOCVisibility() {
    var $floatTOC = $("#floatTOC");
  var $floatTOC = $("#floatTOC");
    var $tocToggleButton = $("#toctogglebutton");
  var $tocToggleButton = $("#toctogglebutton");
 
  if ($floatTOC.hasClass("hiddenFloatTOC")) {
    $floatTOC.removeClass("hiddenFloatTOC");
 
    const tocToggleButtonIconNode = document.createElement("i");
    tocToggleButtonIconNode.setAttribute("class", "material-icons");
 
    const tocToggleButtonIconNodeContent =
      document.createTextNode("chevron_right");
    tocToggleButtonIconNode.appendChild(tocToggleButtonIconNodeContent);
 
    $tocToggleButton.html("");
    $tocToggleButton.append(tocToggleButtonIconNode);
 
    setCookie("showTOC", "true");
 
  } else {
    $floatTOC.addClass("hiddenFloatTOC");
 
    const tocToggleButtonIconNode = document.createElement("i");
    tocToggleButtonIconNode.setAttribute("class", "material-icons");


     if ($floatTOC.hasClass("hiddenFloatTOC")) {
     const tocToggleButtonIconNodeContent =
        $floatTOC.removeClass("hiddenFloatTOC");
      document.createTextNode("chevron_left");
        $tocToggleButton.html("<i class='material-icons'>chevron_right</i>");
    tocToggleButtonIconNode.appendChild(tocToggleButtonIconNodeContent);
        setCookie("showTOC", "true");
 
     } else {
     $tocToggleButton.html("");
        $floatTOC.addClass("hiddenFloatTOC");
    $tocToggleButton.append(tocToggleButtonIconNode);
        $tocToggleButton.html("<i class='material-icons'>chevron_left</i>");
 
        setCookie("showTOC", "false");
    setCookie("showTOC", "false");
    }
 
  }
}
}


function setCookie(cname, cvalue, exdays) {
function setCookie(cname, cvalue, exdays) {
    const d = new Date();
  const d = new Date();
    d.setTime(d.getTime() + (exdays || 365) * 24 * 60 * 60 * 1000);
  d.setTime(d.getTime() + (exdays || 365) * 24 * 60 * 60 * 1000);
    document.cookie = cname + "=" + cvalue + ";expires=" + d.toUTCString() + ";path=/";
  const expires = "expires=" + d.toUTCString();
  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
}


function getCookie(cname) {
function getCookie(cname) {
    const name = cname + "=";
  var name = cname + "=";
    const ca = document.cookie.split(";");
  var ca = document.cookie.split(";");
    for (let i = 0; i < ca.length; i++) {
  for (var i = 0; i < ca.length; i++) {
        let c = ca[i].trim();
    var c = ca[i];
        if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
    while (c.charAt(0) == " ") {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
     }
     }
    return "";
  }
  return "";
}
}

Edição das 13h18min de 4 de novembro de 2024

/* Códigos JavaScript aqui colocados serão carregados por todos aqueles que acessarem alguma página deste wiki */

/* Organize */
$(document).ready(function () {
  var tables = document.getElementsByClassName("organize");
  Array.prototype.forEach.call(tables, function (table) {
    var rows, switching, i, x, y, shouldSwitch;
    switching = true;
    /* Make a loop that will continue until
        no switching has been done: */
    while (switching) {
      // start by saying: no switching is done:
      switching = false;
      rows = table.rows;
      /* Loop through all table rows (except the
            first, which contains table headers): */
      for (i = 1; i < rows.length - 1; i++) {
        // start by saying there should be no switching:
        shouldSwitch = false;
        /* Get the two elements you want to compare,
                one from current row and one from the next: */
        x = rows[i].querySelector("h3>span.mw-headline");
        y = rows[i + 1].querySelector("h3>span.mw-headline");
        // check if the two rows should switch place:
        if (
          x.getAttribute("id").toLowerCase() >
          y.getAttribute("id").toLowerCase()
        ) {
          // if so, mark as a switch and break the loop:
          shouldSwitch = true;
          break;
        }
      }
      if (shouldSwitch) {
        /* If a switch has been marked, make the switch
                and mark that a switch has been done: */
        rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);

        var rowIdA = rows[i].querySelector(".mw-headline").getAttribute("id");
        var rowIdB = rows[i + 1]
          .querySelector(".mw-headline")
          .getAttribute("id");
        var floatTOCLinkA = document.querySelector(
          'a[href$="' + rowIdA + '"]'
        ).parentNode;
        var floatTOCLinkB = document.querySelector(
          'a[href$="' + rowIdB + '"]'
        ).parentNode;

        floatTOCLinkB.parentNode.insertBefore(floatTOCLinkA, floatTOCLinkB);

        rowIdA = null;
        rowIdB = null;
        floatTOCLinkA = null;
        floatTOCLinkB = null;

        switching = true;
      }
    }
  });
});

/* Runa TOC */
/* TOC */
$(document).ready(function () {
  $(function () {
    var $window,
      $mwPanel,
      $floatTOC,
      scrollHandler,
      tocLimit,
      headingOffsets,
      headingThreshold,
      $toc = $("#toc");

    if (!$toc.length) {
      return;
    }

    $window = $(window);
    $mwPanel = $("#mw-panel");

    headingThreshold = $window.height() / 5.0;

    $floatTOC = $toc
      .clone()
      .removeAttr("id")
      .attr("id", "floatTOC")
      .addClass("floatTOC")
      .appendTo("body");

    $floatTOC.find("ul").show();

    const tocToggleButton = document.createElement("button");
    tocToggleButton.setAttribute("id", "toctogglebutton");
    tocToggleButton.setAttribute("onclick", "toggleTOCVisibility()");

    const tocToggleButtonIconNode = document.createElement("i");
    tocToggleButtonIconNode.setAttribute("class", "material-icons");

    var tocToggleButtonIconNodeContent;

    if (getCookie("showTOC") == "false") {
        tocToggleButtonIconNodeContent = document.createTextNode("chevron_left");

        $floatTOC.addClass("hiddenFloatTOC");
    } else {
        tocToggleButtonIconNodeContent = document.createTextNode("chevron_right");
    }

    tocToggleButtonIconNode.appendChild(tocToggleButtonIconNodeContent);
    tocToggleButton.appendChild(tocToggleButtonIconNode);

    $floatTOC.prepend(tocToggleButton);

    $floatTOC.find("a").click(function (e) {
      $("html, body").animate({
        scrollTop:
          $(this.hash.replace(/\./g, "\\.")).offset().top - headingThreshold,
      });

      return false;
    });

    tocLimit = $toc.offset().top + $toc.height();
    headingOffsets = [];

    $(".mw-headline").each(function () {
      headingOffsets.push([$(this).attr("id"), $(this).offset().top]);
    });

    scrollHandler = function () {
      var $current,
        scrollTop = $window.scrollTop();

      if (scrollTop > tocLimit) {
        $mwPanel.hide();

        var highlight = false;

        $.each(headingOffsets, function (i, v) {
          if (i !== 0 && scrollTop + headingThreshold < v[1]) {
            highlight = headingOffsets[i - 1][0];
            return false;
          }
        });

        if (highlight) {
          $current = $floatTOC.find('a[href="#' + highlight + '"]');
          $floatTOC.find("a").not($current).css("font-weight", "");
          $current.css("font-weight", "bold");
        }
      } else {
        $mwPanel.show();
      }
    };

    $window.on("scroll", OO.ui.throttle(250, scrollHandler));
  });
});

function toggleTOCVisibility() {
  var $floatTOC = $("#floatTOC");
  var $tocToggleButton = $("#toctogglebutton");

  if ($floatTOC.hasClass("hiddenFloatTOC")) {
    $floatTOC.removeClass("hiddenFloatTOC");

    const tocToggleButtonIconNode = document.createElement("i");
    tocToggleButtonIconNode.setAttribute("class", "material-icons");

    const tocToggleButtonIconNodeContent =
      document.createTextNode("chevron_right");
    tocToggleButtonIconNode.appendChild(tocToggleButtonIconNodeContent);

    $tocToggleButton.html("");
    $tocToggleButton.append(tocToggleButtonIconNode);

    setCookie("showTOC", "true");

  } else {
    $floatTOC.addClass("hiddenFloatTOC");

    const tocToggleButtonIconNode = document.createElement("i");
    tocToggleButtonIconNode.setAttribute("class", "material-icons");

    const tocToggleButtonIconNodeContent =
      document.createTextNode("chevron_left");
    tocToggleButtonIconNode.appendChild(tocToggleButtonIconNodeContent);

    $tocToggleButton.html("");
    $tocToggleButton.append(tocToggleButtonIconNode);

    setCookie("showTOC", "false");

  }
}

function setCookie(cname, cvalue, exdays) {
  const d = new Date();
  d.setTime(d.getTime() + (exdays || 365) * 24 * 60 * 60 * 1000);
  const expires = "expires=" + d.toUTCString();
  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

function getCookie(cname) {
  var name = cname + "=";
  var ca = document.cookie.split(";");
  for (var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == " ") {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}