MediaWiki:Common.js: Difference between revisions

Revision as of 07:48, 1 October 2025

/* Any JavaScript here will be loaded for all users on every page load. */
// JavaScript code to save checkbox state and restore it when the page loads
$(document).ready(function() {
    // Function to save the state of checkboxes to localStorage
    function saveCheckboxState() {
        $('input[type="checkbox"]').each(function() {
            localStorage.setItem($(this).attr('id'), $(this).prop('checked'));
        });
    }

    // Function to load the state of checkboxes from localStorage
    function loadCheckboxState() {
        $('input[type="checkbox"]').each(function() {
            const savedState = localStorage.getItem($(this).attr('id'));
            if (savedState !== null) {
                $(this).prop('checked', savedState === 'true');
            }
        });
    }

    // Load the saved checkbox state when the page is loaded
    loadCheckboxState();

    // Save the checkbox state whenever a checkbox is changed
    $('input[type="checkbox"]').change(function() {
        saveCheckboxState();
    });
});

// Adjust the search box width
$(document).ready(function () {
    $('#searchInput').css('width', '600px'); // Adjust width as needed
});

// Add Edit Source to user dropdown
mw.loader.using('mediawiki.util', function () {
    mw.util.addPortletLink( 'p-personal', mw.util.getUrl( mw.config.get('wgPageName'), { action: 'edit' } ), 'Edit Source', 'pt-editsource' );
    mw.util.addPortletLink( 'p-personal', mw.util.getUrl( mw.config.get('wgPageName'), { action: 'history' } ), 'View History', 'pt-history' );
    mw.util.addPortletLink( 'p-personal', mw.util.getUrl( mw.config.get('wgPageName'), { action: 'delete' } ), 'Delete', 'pt-delete' );
    var moveLink = document.getElementById('ca-move');
    if (moveLink) {
        var a = moveLink.querySelector('a');
        mw.util.addPortletLink( 'p-personal', a.href, a.textContent.trim(), 'pt-move', a.title || 'Move this page' );
        moveLink.remove();
    }
    mw.util.addPortletLink( 'p-personal', mw.util.getUrl( mw.config.get('wgPageName'), { action: 'protect' } ), 'Protect', 'pt-protect' );
    mw.util.addPortletLink( 'p-personal', mw.util.getUrl( mw.config.get('wgPageName'), { action: 'unwatch' } ), 'Unwatch', 'pt-unwatch' );
    var talkLink = document.getElementById('pt-mytalk');
    talkLink.remove();
    var whatLinksHereLink = document.getElementById('t-whatlinkshere');
    if (whatLinksHereLink) {
        var a = whatLinksHereLink.querySelector('a');
        mw.util.addPortletLink( 'p-personal', a.href, a.textContent.trim(), 'pt-whatlinkshere', a.title || 'What Links Here' );
        whatLinksHereLink.remove();
    }
    var relatedChangesLink = document.getElementById('t-recentchangeslinked');
    if (relatedChangesLink) {
        var a = relatedChangesLink.querySelector('a');
        mw.util.addPortletLink( 'p-personal', a.href, a.textContent.trim(), 'pt-recentchanges', a.title || 'Recent Changes' );
        relatedChangesLink.remove();
    }
    var uploadLink = document.getElementById('t-upload');
    if (uploadLink) {
        var a = uploadLink.querySelector('a');
        mw.util.addPortletLink( 'p-personal', a.href, a.textContent.trim(), 'pt-upload', a.title || 'Upload File' );
        uploadLink.remove();
    }
    var specialPagesLink = document.getElementById('t-specialpages');
    if (specialPagesLink) {
        var a = specialPagesLink.querySelector('a');
        mw.util.addPortletLink( 'p-personal', a.href, a.textContent.trim(), 'pt-specialpages', a.title || 'Special Pages' );
        specialPagesLink.remove();
    }
    var permanentLink = document.getElementById('t-permalink');
    if (permanentLink) {
        var a = permanentLink.querySelector('a');
        mw.util.addPortletLink( 'p-personal', a.href, a.textContent.trim(), 'pt-permalink', a.title || 'Permanent Link' );
        permanentLink.remove();
    }
    var pageInfoLink = document.getElementById('t-info');
    if (pageInfoLink) {
        var a = pageInfoLink.querySelector('a');
        mw.util.addPortletLink( 'p-personal', a.href, a.textContent.trim(), 'pt-info', a.title || 'Page Info' );
        pageInfoLink.remove();
    }
    var printLink = document.getElementById('t-print');
    if (printLink) {
        var a = printLink.querySelector('a');
        printLink.remove();
    }
});

$(document).ready(function () {

  function toggleCheckbox(id) {
    var checkbox = $('#' + id);
    var tsBox = $('#' + id + '-ts');
    var checked = checkbox.text() === '[ ]';

    if (checked) {
      checkbox.text('[x]');
      var now = new Date();
      var ts = String(now.getHours()).padStart(2,'0') + ':' +
               String(now.getMinutes()).padStart(2,'0') + ':' +
               String(now.getSeconds()).padStart(2,'0');
      tsBox.text(ts);
      localStorage.setItem('checkbox-' + id, JSON.stringify({
        checked: true,
        timestamp: ts
      }));
    } else {
      checkbox.text('[ ]');
      tsBox.text('');
      localStorage.removeItem('checkbox-' + id);
    }
  }

  // Restore saved states
  $('.clickable-checkbox').each(function() {
    var id = this.id;
    var savedData = localStorage.getItem('checkbox-' + id);
    if (savedData) {
      var data = JSON.parse(savedData);
      $(this).text(data.checked ? '[x]' : '[ ]');
      $('#' + id + '-ts').text(data.timestamp);
    }
  });

  // Click handler
  $(document).on('click', '.clickable-checkbox', function() {
    toggleCheckbox(this.id);
  });

});

/* Test code to make checkboxes and timestamps work */
(function () {
  'use strict';

  function formatTime(d) {
    return d.toLocaleTimeString('en-US', {
      hour: 'numeric',
      minute: '2-digit',
      second: '2-digit'
    });
  }

  function findTsBox(cb) {
    var tr = cb.closest('tr');
    return tr ? tr.querySelector('.mw-ts-box') : null;
  }

  function saveState(cb, tsBox) {
    if (!cb.id) return;
    var data = {
      checked: cb.checked,
      timestamp: tsBox ? tsBox.textContent : ''
    };
    localStorage.setItem('mw-checkbox-ts:' + cb.id, JSON.stringify(data));
  }

  function loadState(cb) {
    if (!cb.id) return;
    var saved = localStorage.getItem('mw-checkbox-ts:' + cb.id);
    if (saved) {
      try {
        var data = JSON.parse(saved);
        cb.checked = !!data.checked;
        var tsBox = findTsBox(cb);
        if (tsBox) {
          tsBox.textContent = data.timestamp || '';
        }
      } catch (e) {
        console.warn("Bad saved state for", cb.id, e);
      }
    }
  }

  document.addEventListener('change', function (ev) {
    var cb = ev.target;
    if (cb.matches && cb.matches('.mw-checkbox-ts')) {
      var tsBox = findTsBox(cb);
      if (tsBox) {
        tsBox.textContent = cb.checked ? formatTime(new Date()) : '';
      }
      saveState(cb, tsBox);
    }
  });

  // 🔑 Run restore not just once, but after DOM is ready and again shortly after
  function restoreAll() {
    document.querySelectorAll('.mw-checkbox-ts').forEach(loadState);
  }

  document.addEventListener('DOMContentLoaded', function () {
    restoreAll();
    setTimeout(restoreAll, 200);   // retry after 0.2s
    setTimeout(restoreAll, 1000);  // retry after 1s
  });
})();