MediaWiki:Common.js: Difference between revisions

No edit summary
No edit summary
 
(10 intermediate revisions by the same user not shown)
Line 1: Line 1:
// -------------------------
// Infobox cleanup
// -------------------------
$(document).ready(function() {
$(document).ready(function() {
     $('.infoboxTable th').each(function() {
     $('.infoboxTable th').each(function() {
         if ($(this).text().trim() === "Image") {
         if ($(this).text().trim() === "Image") {
             $(this).text(""); // Removes the text but keeps the <th> element
             $(this).text("");
         }
         }
     });
     });
});
});


// -------------------------
// Remove unwanted Introduction headers
// -------------------------
$(document).ready(function() {
$(document).ready(function() {
     $('h2').each(function() {
     $('h2').each(function() {
         if ($(this).text().trim() === "Introduction") {
         if ($(this).text().trim() === "Introduction") {
             $(this).remove(); // Removes the Introduction header
             $(this).remove();
         }
         }
     });
     });
});
});


// -------------------------
// Remove first empty paragraph
// -------------------------
$(document).ready(function() {
$(document).ready(function() {
    // Remove first empty paragraph (<p><br></p>) if it exists
     $('p').first().each(function() {
     $('p').first().each(function() {
         if ($(this).html().trim() === "<br>") {
         if ($(this).html().trim() === "<br>") {
Line 24: Line 32:
});
});


mw.loader.using(['jquery'], function() {
 
     function processPopup($popup) {
mw.loader.load('https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@main/dist/en/v7.0.0/legacy/ol.js');
         // 1. Update any <strong> title tags that are not already links.
mw.loader.load('/maps/elemara/elemara-map.js');
         $popup.find('strong').each(function() {
 
            var titleText = $(this).text().trim();
mw.loader.using([], function () {
            if (titleText.length > 0 && $(this).find('a').length === 0) {
  $(function () {
                var link = $('<a>')
     var container = document.getElementById("pixel-area-calculator");
                    .attr('href', '/' + encodeURIComponent(titleText.replace(/ /g, '_')))
 
                    .attr('target', '_blank')
    if (!container) {
                    .text(titleText);
      return;
                $(this).html(link);
    }
 
    container.innerHTML =
      '<div class="pixel-area-tool">' +
         '<h3>Pixel to Square Miles Calculator</h3>' +
 
        '<label>Width in pixels:' +
          '<input id="pixel-width" type="number" min="0" step="any" placeholder="Width">' +
        '</label>' +
 
        '<label>Height in pixels:' +
          '<input id="pixel-height" type="number" min="0" step="any" placeholder="Height">' +
        '</label>' +
 
        '<button id="pixel-area-button" type="button">Calculate</button>' +
 
         '<div id="pixel-area-result"></div>' +
      '</div>';
 
    document.getElementById("pixel-area-button").addEventListener("click", function () {
      var widthPixels = parseFloat(document.getElementById("pixel-width").value);
      var heightPixels = parseFloat(document.getElementById("pixel-height").value);
      var result = document.getElementById("pixel-area-result");
 
      if (isNaN(widthPixels) || isNaN(heightPixels)) {
        result.textContent = "Please enter both pixel values.";
        return;
      }
 
      var widthMiles = (widthPixels / 1000) * 50;
      var heightMiles = (heightPixels / 1000) * 50;
      var squareMiles = widthMiles * heightMiles;
 
      result.innerHTML =
        "<strong>" + widthMiles.toLocaleString(undefined, { maximumFractionDigits: 0 }) + " miles</strong>" +
        " × " +
        "<strong>" + heightMiles.toLocaleString(undefined, { maximumFractionDigits: 0 }) + " miles</strong>" +
        " = " +
        "<strong>" + squareMiles.toLocaleString(undefined, { maximumFractionDigits: 0 }) + " mi²</strong>";
    });
  });
});
 
(function () {
    function stripHeaderLines(text) {
        return text
            // Remove standalone short lines that look like section headers
            .replace(/(?:^|\n)\s*[A-Z][A-Za-z0-9'’\- ,()]{0,50}\s*(?=\n)/g, '\n')
            // Clean up excess blank lines
            .replace(/\n{2,}/g, '\n')
            .trim();
    }
 
    function cleanAdarisPopups() {
        document.querySelectorAll(
            '.mwe-popups-extract, .mwe-popups-extract p, .mwe-popups .extract, .mwe-popups .mwe-popups-extract'
        ).forEach(function (el) {
            if (!el || el.dataset.adarisCleaned === '1') {
                return;
             }
             }
            el.textContent = stripHeaderLines(el.textContent);
            el.dataset.adarisCleaned = '1';
         });
         });
    }


         // 2. Get the popup's HTML content.
    const observer = new MutationObserver(function () {
         var htmlContent = $popup.html();
        cleanAdarisPopups();
         setTimeout(cleanAdarisPopups, 100);
         setTimeout(cleanAdarisPopups, 300);
    });


        // 3. Replace wiki-style link markup [PageName] with clickable links,
    observer.observe(document.body, {
         //    skipping any that start with 'img:' so they can be handled separately.
         childList: true,
         var newContent = htmlContent.replace(/\[([^\]]+)\]/g, function(match, p1) {
         subtree: true,
            if (p1.trim().toLowerCase().startsWith('img:')) {
        characterData: true
                return match;
    });
            }
 
            var pageName = p1.replace(/ /g, '_');
    cleanAdarisPopups();
            return '<a href="/' + encodeURIComponent(pageName) + '" target="_blank">' + p1 + '</a>';
})();
        });


        // 4. Replace custom image markup [img:...] with an actual image element.
mw.loader.using('mediawiki.util', function () {
        newContent = newContent.replace(/\[img:([^\]]+)\]/gi, function(match, p1) {
  $(function () {
            var imageFile = p1.trim();
    var input = document.getElementById('pixelToMileInput');
            var src;
    var output = document.getElementById('pixelToMileOutput');
            // If the markup is a full URL, use it as is.
            if (/^https?:\/\//.test(imageFile)) {
                src = imageFile;
            } else {
                src = '/images/' + encodeURIComponent(imageFile);
            }
            return '<img src="' + src + '" alt="' + imageFile + '" style="max-width:100%; display:block; margin-top:5px;">';
        });


        // 5. Update the popup content.
    if (!input || !output) {
        $popup.html(newContent);
      return;
     }
     }


     // Use a MutationObserver to detect when new popup content is added.
     input.addEventListener('input', function () {
    var observer = new MutationObserver(function(mutations) {
      var pixels = parseFloat(input.value);
        mutations.forEach(function(mutation) {
 
            if (mutation.addedNodes) {
      if (isNaN(pixels)) {
                $(mutation.addedNodes).each(function() {
        output.textContent = '0 mi';
                    var $node = $(this);
        return;
                    if ($node.hasClass('leaflet-popup-content')) {
      }
                        processPopup($node);
 
                    } else {
      var miles = (pixels / 1000) * 50;
                        // Also check within any child nodes.
 
                        $node.find('.leaflet-popup-content').each(function() {
      output.textContent = Math.round(miles) + ' mi';
                            processPopup($(this));
                        });
                    }
                });
            }
        });
     });
     });
  });
});
$(function () {
  var container = document.getElementById('pixel-to-mile-calculator');
  if (!container) {
    return;
  }
  container.className = 'adaris-tool-box';
  container.innerHTML =
    '<label for="pixelToMileInput"><strong>Pixels:</strong></label><br>' +
    '<input id="pixelToMileInput" type="number" placeholder="Enter pixels">' +
    '<p><strong>Distance:</strong> <span id="pixelToMileOutput">0 mi</span></p>';
  var input = document.getElementById('pixelToMileInput');
  var output = document.getElementById('pixelToMileOutput');
  input.addEventListener('input', function () {
    var pixels = parseFloat(input.value);
    if (isNaN(pixels)) {
      output.textContent = '0 mi';
      return;
    }
    var miles = (pixels / 1000) * 50;


     // Observe the document body for new nodes (popups are added dynamically).
     output.textContent = Math.round(miles) + ' mi';
    observer.observe(document.body, { childList: true, subtree: true });
  });
});
});