MediaWiki:Common.js: Difference between revisions

Revision as of 22:54, 7 September 2025

/* Any JavaScript here will be loaded for all users on every page load. */// Load DataTables library

mw.hook('wikipage.content').add(function ($content) {
  $content.find('.spoiler').on('click', function () {
    $(this).toggleClass('revealed');
  });
});

// Auto-embed X/Twitter status links into live tweets (no extension required)
(function () {
  'use strict';

  // Options you can tweak
  var TW_OPTIONS = {
    // theme: 'dark',            // uncomment for dark
    // conversation: 'none',     // hide reply thread
    // dnt: true,                // "Do Not Track"
    // align: 'center'           // center the embed
  };

  function loadXWidgets (cb) {
    // If the widget API is ready, go
    if (window.twttr && twttr.widgets) { cb(); return; }

    // Already loading?
    if (document.querySelector('script[src*="platform.twitter.com/widgets.js"]')) {
      // Poll until ready
      var tries = 0, t = setInterval(function () {
        if (window.twttr && twttr.widgets) { clearInterval(t); cb(); }
        else if (++tries > 40) { clearInterval(t); }
      }, 250);
      return;
    }

    // Inject the widgets.js script
    var s = document.createElement('script');
    s.async = true;
    s.src = 'https://platform.twitter.com/widgets.js';
    s.onload = function () { cb(); };
    document.head.appendChild(s);
  }

  // Find eligible links and embed them
  function embedLinks(root) {
    var scope = root || document;
    var selector = [
      'a[href^="https://x.com/"][href*="/status/"]',
      'a[href^="http://x.com/"][href*="/status/"]',
      'a[href^="https://twitter.com/"][href*="/status/"]',
      'a[href^="http://twitter.com/"][href*="/status/"]'
    ].join(',');

    var anchors = scope.querySelectorAll(selector);
    if (!anchors.length) return;

    loadXWidgets(function () {
      anchors.forEach(function (a) {
        if (a.dataset.tweetEmbedded === '1') return; // avoid duplicates
        a.dataset.tweetEmbedded = '1';

        // Extract the numeric tweet ID
        var match = a.href.match(/\/status\/(\d+)/);
        if (!match) return;
        var id = match[1];

        // Create a container after the link
        var container = document.createElement('div');
        container.className = 'tweet-embed';
        a.insertAdjacentElement('afterend', container);

        // Ask widgets API to render
        if (window.twttr && twttr.widgets && twttr.widgets.createTweet) {
          twttr.widgets.createTweet(id, container, TW_OPTIONS).catch(function(){});
        }
      });

      // Ensure any dynamically added blockquotes also render
      if (window.twttr && twttr.widgets && twttr.widgets.load) {
        twttr.widgets.load(scope);
      }
    });
  }

  // Run on page load and whenever VE/LQT/etc. inject content
  if (window.mw && mw.hook) {
    mw.hook('wikipage.content').add(function ($content) {
      embedLinks($content && $content[0]);
    });
  } else {
    document.addEventListener('DOMContentLoaded', function () { embedLinks(document); });
  }
})();

/* Show one update panel based on dropdown */
mw.loader.using(['mediawiki.util'], function () {
  function initTvDropdown(root) {
    var select = root.querySelector('#tvdd-select');
    var panels = root.querySelectorAll('.tvdd__panel');
    if (!select || !panels.length) return;

    function show(key) {
      panels.forEach(function(p){
        if (p.getAttribute('data-key') === key) p.classList.add('is-active');
        else p.classList.remove('is-active');
      });
    }

    // Initial selection: first option
    show(select.value);

    // Update on change
    select.addEventListener('change', function(){
      show(select.value);
    });
  }

  document.querySelectorAll('#tv-updates.tvdd').forEach(initTvDropdown);
});

/* Dropdown: show only the selected update */
mw.loader.using([], function () {
  function init(root) {
    var sel = root.querySelector('#tvdd-select');
    var panels = root.querySelectorAll('.tvdd__panel');
    if (!sel || !panels.length) return;

    function show(key){
      panels.forEach(function(p){
        p.classList.toggle('is-active', p.getAttribute('data-key') === key);
      });
    }
    show(sel.value);
    sel.addEventListener('change', function(){ show(sel.value); });
  }
  document.querySelectorAll('#tv-updates.tvdd').forEach(init);
});