MediaWiki:Common.js: Difference between revisions

From Artifacts of Capitalism
No edit summary
No edit summary
Line 1: Line 1:
// Load Chart.js globally
// ===============================
mw.loader.load("https://cdn.jsdelivr.net/npm/chart.js");
// LOAD CHART.JS (RELIABLE)
// ===============================
mw.loader.getScript("https://cdn.jsdelivr.net/npm/chart.js");


// Ensure viewport meta exists (iOS layout fix)
// ===============================
// VIEWPORT FIX (iOS)
// ===============================
(function () {
(function () {
   if (!document.querySelector('meta[name="viewport"]')) {
   if (!document.querySelector('meta[name="viewport"]')) {
Line 12: Line 16:
})();
})();


// Hide Draft namespace checkbox (except for approvers)
// ===============================
// HIDE DRAFT NAMESPACE (NON-APPROVERS)
// ===============================
mw.hook('wikipage.content').add(function ($c) {
mw.hook('wikipage.content').add(function ($c) {
   var groups = mw.config.get('wgUserGroups') || [];
   var groups = mw.config.get('wgUserGroups') || [];
Line 19: Line 25:
});
});


// Load Google CSE only on Advanced_search page
// ===============================
// GOOGLE CSE (ADVANCED SEARCH ONLY)
// ===============================
mw.loader.using('mediawiki.util').then(function () {
mw.loader.using('mediawiki.util').then(function () {
   var page = mw.config.get('wgPageName');
   var page = mw.config.get('wgPageName');
   if (page !== 'Artifacts_of_Capitalism:Advanced_search') return;
   if (page !== 'Artifacts_of_Capitalism:Advanced_search') return;
  console.log('[CSE] Loading on:', page);


   window.__gcse = {
   window.__gcse = {
Line 36: Line 42:
             if (!window.location.hash.includes('gsc.q=')) {
             if (!window.location.hash.includes('gsc.q=')) {
               window.location.hash = hash;
               window.location.hash = hash;
              console.log('[CSE] Applied query:', q);
             }
             }
           }
           }
Line 52: Line 57:
});
});


// Open external links in new tab
// ===============================
// OPEN EXTERNAL LINKS IN NEW TAB
// ===============================
$(document).ready(function() {
$(document).ready(function() {
   $('a.external').attr('target', '_blank');
   $('a.external').attr('target', '_blank');
});
});


// Add fields to CreateAccount form
// ===============================
// CREATE ACCOUNT FIELD EXTENSIONS
// ===============================
mw.loader.using('mediawiki.util').then(function () {
mw.loader.using('mediawiki.util').then(function () {
   if (mw.config.get('wgCanonicalSpecialPageName') !== 'CreateAccount') return;
   if (mw.config.get('wgCanonicalSpecialPageName') !== 'CreateAccount') return;
Line 93: Line 102:
});
});


// === Artifact Network Map Connections ===
// ===============================
// ARTIFACT MAP NETWORK LINES
// ===============================
mw.hook('wikipage.content').add(function () {
mw.hook('wikipage.content').add(function () {


Line 150: Line 161:
       if (!fromCoords) return;
       if (!fromCoords) return;


       var relatedList = item.Related_artifacts.split(",");
       item.Related_artifacts.split(",").forEach(function(rel) {
 
         var toCoords = lookup[rel.trim()];
      relatedList.forEach(function(rel) {
 
         var target = rel.trim();
        var toCoords = lookup[target];
 
         if (toCoords) {
         if (toCoords) {
           L.polyline([fromCoords, toCoords], {
           L.polyline([fromCoords, toCoords], {
Line 165: Line 171:
           }).addTo(map);
           }).addTo(map);
         }
         }
       });
       });


Line 174: Line 179:
});
});


document.addEventListener("DOMContentLoaded", function () {
// ===============================
// COMMODITY CHART (FIXED + RELIABLE)
// ===============================
mw.hook('wikipage.content').add(function () {


   const el = document.getElementById('commodityChart');
   if (mw.config.get('wgPageName') !== 'Browse_Artifacts') return;
  if (!el) return;


   const rawEl = document.getElementById('cargo-data');
   setTimeout(function () {
  if (!rawEl) {
    console.log("No cargo-data element found");
    return;
  }


  let raw = rawEl.textContent || rawEl.innerText || "";
    const el = document.getElementById('commodityChart');
    if (!el) return;


  console.log("RAW:", raw);
    const rawEl = document.getElementById('cargo-data');
    if (!rawEl) return;


  // 🔥 HARD CLEAN
    let raw = rawEl.textContent || "";
  raw = raw
    .replace(/^[^\[]*/, '')  // remove anything before [
    .replace(/[^\]]*$/, '')  // remove anything after ]
    .trim();


  console.log("CLEANED:", raw);
    // CLEAN JSON
    raw = raw
      .replace(/^[^\[]*/, '')
      .replace(/[^\]]*$/, '')
      .trim();


  let data;
    let data;
  try {
    try {
    data = JSON.parse(raw);
      data = JSON.parse(raw);
  } catch (e) {
    } catch (e) {
    console.error("JSON parse failed:", e);
      console.error("Chart JSON parse failed:", e);
    return;
      return;
  }
    }


  if (!data || !data.length) {
    if (!data || !data.length) return;
    console.error("No usable data");
    return;
  }


  console.log("PARSED:", data);
    // Ensure Chart.js is ready
    if (typeof Chart === "undefined") {
      console.error("Chart.js not loaded");
      return;
    }


  const labels = data.map(d => d.Commodity || 'Unknown');
    const labels = data.map(d => d.Commodity || 'Unknown');
  const values = data.map(d => Number(d.Count) || 0);
    const values = data.map(d => Number(d.Count) || 0);


  new Chart(el, {
    new Chart(el, {
    type: 'bar',
      type: 'bar',
    data: {
      data: {
      labels: labels,
        labels: labels,
      datasets: [{
        datasets: [{
        data: values
          data: values
      }]
        }]
    },
    options: {
      responsive: true,
      plugins: {
        legend: { display: false }
       },
       },
       scales: {
       options: {
        y: { beginAtZero: true }
        responsive: true,
        plugins: {
          legend: { display: false }
        },
        scales: {
          y: { beginAtZero: true }
        }
       }
       }
     }
     });
   });
 
   }, 500); // 👈 critical delay for MediaWiki rendering


});
});

Revision as of 13:59, 19 March 2026

// ===============================
// LOAD CHART.JS (RELIABLE)
// ===============================
mw.loader.getScript("https://cdn.jsdelivr.net/npm/chart.js");

// ===============================
// VIEWPORT FIX (iOS)
// ===============================
(function () {
  if (!document.querySelector('meta[name="viewport"]')) {
    var m = document.createElement('meta');
    m.name = 'viewport';
    m.content = 'width=device-width, initial-scale=1, shrink-to-fit=no';
    document.head.appendChild(m);
  }
})();

// ===============================
// HIDE DRAFT NAMESPACE (NON-APPROVERS)
// ===============================
mw.hook('wikipage.content').add(function ($c) {
  var groups = mw.config.get('wgUserGroups') || [];
  if (groups.indexOf('approver') !== -1) return;
  $c.find('input[name="ns' + 3000 + '"]').closest('label, .mw-advancedSearch-ns_option').hide();
});

// ===============================
// GOOGLE CSE (ADVANCED SEARCH ONLY)
// ===============================
mw.loader.using('mediawiki.util').then(function () {
  var page = mw.config.get('wgPageName');
  if (page !== 'Artifacts_of_Capitalism:Advanced_search') return;

  window.__gcse = {
    searchCallbacks: {
      ready: function () {
        try {
          var params = new URLSearchParams(window.location.search);
          var q = params.get('q');
          if (q) {
            var hash = 'gsc.tab=0&gsc.q=' + encodeURIComponent(q);
            if (!window.location.hash.includes('gsc.q=')) {
              window.location.hash = hash;
            }
          }
        } catch (err) {
          console.warn('[CSE] Query error:', err);
        }
      }
    }
  };

  var script = document.createElement('script');
  script.async = true;
  script.src = 'https://cse.google.com/cse.js?cx=b194aa5e4d64344ad';
  document.body.appendChild(script);
});

// ===============================
// OPEN EXTERNAL LINKS IN NEW TAB
// ===============================
$(document).ready(function() {
  $('a.external').attr('target', '_blank');
});

// ===============================
// CREATE ACCOUNT FIELD EXTENSIONS
// ===============================
mw.loader.using('mediawiki.util').then(function () {
  if (mw.config.get('wgCanonicalSpecialPageName') !== 'CreateAccount') return;

  const observer = new MutationObserver(() => {
    const realNameInput = document.getElementById('wpRealName');
    if (!realNameInput) return;

    if (document.getElementById('wpAffiliation')) return;

    const affDiv = document.createElement('div');
    affDiv.className = 'mw-input';
    affDiv.innerHTML = `
      <label for="wpAffiliation">Affiliation</label>
      <input type="text" id="wpAffiliation" name="wpAffiliation" required class="mw-ui-input form-control"/>
    `;

    const instDiv = document.createElement('div');
    instDiv.className = 'mw-input';
    instDiv.innerHTML = `
      <label for="wpInstitutionalEmail">Institutional Email</label>
      <input type="email" id="wpInstitutionalEmail" name="wpInstitutionalEmail" required class="mw-ui-input form-control"/>
    `;

    const realNameDiv =
      realNameInput.closest('.mw-input, .form-group, p') || realNameInput.parentNode;

    realNameDiv.insertAdjacentElement('afterend', instDiv);
    realNameDiv.insertAdjacentElement('afterend', affDiv);

    observer.disconnect();
  });

  observer.observe(document.body, { childList: true, subtree: true });
});

// ===============================
// ARTIFACT MAP NETWORK LINES
// ===============================
mw.hook('wikipage.content').add(function () {

  if (mw.config.get('wgPageName') !== 'Artifact_Map') return;

  function waitForMap(callback) {
    var attempts = 0;
    var maxAttempts = 30;

    var interval = setInterval(function () {
      attempts++;

      if (window.mw && mw.leafletMap && mw.leafletMap.map) {
        clearInterval(interval);
        callback(mw.leafletMap.map);
      }

      if (attempts > maxAttempts) {
        clearInterval(interval);
      }

    }, 300);
  }

  waitForMap(function (map) {

    var el = document.getElementById("artifact-network-data");
    if (!el) return;

    var raw = el.textContent.trim();
    if (!raw) return;

    var data;
    try {
      data = JSON.parse(raw);
    } catch (e) {
      console.error('[Artifact Map] JSON parse error:', e);
      return;
    }

    var lookup = {};
    data.forEach(function(item) {
      if (item._pageName && item.Latitude && item.Longitude) {
        lookup[item._pageName] = [
          parseFloat(item.Latitude),
          parseFloat(item.Longitude)
        ];
      }
    });

    data.forEach(function(item) {

      if (!item.Related_artifacts || !item._pageName) return;

      var fromCoords = lookup[item._pageName];
      if (!fromCoords) return;

      item.Related_artifacts.split(",").forEach(function(rel) {
        var toCoords = lookup[rel.trim()];
        if (toCoords) {
          L.polyline([fromCoords, toCoords], {
            color: "purple",
            weight: 3,
            opacity: 0.8,
            dashArray: "4,6"
          }).addTo(map);
        }
      });

    });

  });

});

// ===============================
// COMMODITY CHART (FIXED + RELIABLE)
// ===============================
mw.hook('wikipage.content').add(function () {

  if (mw.config.get('wgPageName') !== 'Browse_Artifacts') return;

  setTimeout(function () {

    const el = document.getElementById('commodityChart');
    if (!el) return;

    const rawEl = document.getElementById('cargo-data');
    if (!rawEl) return;

    let raw = rawEl.textContent || "";

    // CLEAN JSON
    raw = raw
      .replace(/^[^\[]*/, '')
      .replace(/[^\]]*$/, '')
      .trim();

    let data;
    try {
      data = JSON.parse(raw);
    } catch (e) {
      console.error("Chart JSON parse failed:", e);
      return;
    }

    if (!data || !data.length) return;

    // Ensure Chart.js is ready
    if (typeof Chart === "undefined") {
      console.error("Chart.js not loaded");
      return;
    }

    const labels = data.map(d => d.Commodity || 'Unknown');
    const values = data.map(d => Number(d.Count) || 0);

    new Chart(el, {
      type: 'bar',
      data: {
        labels: labels,
        datasets: [{
          data: values
        }]
      },
      options: {
        responsive: true,
        plugins: {
          legend: { display: false }
        },
        scales: {
          y: { beginAtZero: true }
        }
      }
    });

  }, 500); // 👈 critical delay for MediaWiki rendering

});