MediaWiki:Common.js: Difference between revisions
From AnarchyMU Wiki
No edit summary |
No edit summary |
||
| Line 20: | Line 20: | ||
})(); | })(); | ||
/* Update | /* Update 046: robust nested Stage dropdown - v6 with aggressive CSS and inline toggle */ | ||
(function () { | (function () { | ||
function textOf(el) { | function textOf(el) { | ||
| Line 56: | Line 56: | ||
if (stageNum === '1') { | if (stageNum === '1') { | ||
return !/^Stage_\d+_Mini_Stage/.test(url); | return !/^Stage_\d+_Mini_Stage/.test(url); | ||
} else { | } else { | ||
var pattern = new RegExp('^Stage_' + stageNum + '_Mini_Stage'); | var pattern = new RegExp('^Stage_' + stageNum + '_Mini_Stage'); | ||
return pattern.test(url); | return pattern.test(url); | ||
| Line 129: | Line 127: | ||
} | } | ||
function makeToggle(stageLi, | function makeToggle(stageLi, toggleSpan) { | ||
return function (ev) { | return function (ev) { | ||
ev.preventDefault(); | ev.preventDefault(); | ||
ev.stopPropagation(); | ev.stopPropagation(); | ||
var open = stageLi.classList.toggle(' | var open = stageLi.classList.toggle('stages-open'); | ||
toggleSpan.textContent = open ? '▾' : '▸'; | |||
console.warn('[UPDATE-046] TOGGLE CLICKED: Stage now ' + (open ? 'OPEN' : 'CLOSED')); | |||
console. | |||
return false; | return false; | ||
}; | }; | ||
| Line 143: | Line 140: | ||
function applyNestedStages() { | function applyNestedStages() { | ||
var list = findStagesListContainer(); | var list = findStagesListContainer(); | ||
if (!list || list.dataset. | if (!list || list.dataset.stagesNestedV6Applied === '1') { | ||
return; | return; | ||
} | } | ||
var items = childLis(list); | var items = childLis(list); | ||
if (!items.length) return; | if (!items.length) return; | ||
| Line 157: | Line 151: | ||
var currentMiniUl = null; | var currentMiniUl = null; | ||
var currentStageNum = null; | var currentStageNum = null; | ||
var i; | var i; | ||
| Line 164: | Line 157: | ||
var link = directLink(li); | var link = directLink(li); | ||
if (!link) { | if (!link) { | ||
rebuilt.push(li.cloneNode(true)); | rebuilt.push(li.cloneNode(true)); | ||
continue; | continue; | ||
| Line 172: | Line 164: | ||
var labelNorm = norm(label); | var labelNorm = norm(label); | ||
var url = urlOf(link); | var url = urlOf(link); | ||
if (isStageLabel(labelNorm)) { | if (isStageLabel(labelNorm)) { | ||
var stageNum = getStageNumber(labelNorm); | var stageNum = getStageNumber(labelNorm); | ||
currentStageNum = stageNum; | currentStageNum = stageNum; | ||
currentStageLi = li.cloneNode(true); | currentStageLi = li.cloneNode(true); | ||
currentStageLi.className = (currentStageLi.className ? currentStageLi.className + ' ' : '') + 'stages-inner-parent'; | currentStageLi.className = (currentStageLi.className ? currentStageLi.className + ' ' : '') + 'stages-inner-parent'; | ||
var stageLink = directLink(currentStageLi); | var stageLink = directLink(currentStageLi); | ||
if (stageLink) { | if (stageLink) { | ||
stageLink.style.fontWeight = 'bold'; | stageLink.style.fontWeight = 'bold'; | ||
stageLink.href = '#'; | stageLink.href = '#'; | ||
// Create toggle span and insert before link | |||
var toggleSpan = document.createElement('span'); | |||
toggleSpan.className = 'stages-inner-toggle-icon'; | |||
toggleSpan.textContent = '▸'; | |||
toggleSpan.style.marginRight = '6px'; | |||
toggleSpan.style.color = '#f3b549'; | |||
toggleSpan.style.cursor = 'pointer'; | |||
toggleSpan.style.fontWeight = 'bold'; | |||
var toggleHandler = makeToggle(currentStageLi, toggleSpan); | |||
toggleSpan.addEventListener('click', toggleHandler); | |||
stageLink.addEventListener('click', toggleHandler); | |||
stageLink.parentNode.insertBefore(toggleSpan, stageLink); | |||
} | } | ||
| Line 195: | Line 196: | ||
currentMiniUl.className = 'stages-inner-submenu'; | currentMiniUl.className = 'stages-inner-submenu'; | ||
currentStageLi.appendChild(currentMiniUl); | currentStageLi.appendChild(currentMiniUl); | ||
rebuilt.push(currentStageLi); | rebuilt.push(currentStageLi); | ||
| Line 221: | Line 201: | ||
} | } | ||
if (isMiniLabel(labelNorm)) { | if (isMiniLabel(labelNorm)) { | ||
if (currentMiniUl && currentStageNum) { | if (currentMiniUl && currentStageNum) { | ||
var matches = isMiniLabelForStage(url, label, currentStageNum); | var matches = isMiniLabelForStage(url, label, currentStageNum); | ||
if (matches) { | if (matches) { | ||
currentMiniUl.appendChild(li.cloneNode(true)); | currentMiniUl.appendChild(li.cloneNode(true)); | ||
continue; | continue; | ||
} | } | ||
} | } | ||
} | } | ||
currentStageLi = null; | currentStageLi = null; | ||
currentMiniUl = null; | currentMiniUl = null; | ||
currentStageNum = null; | currentStageNum = null; | ||
rebuilt.push(li.cloneNode(true)); | rebuilt.push(li.cloneNode(true)); | ||
} | } | ||
while (list.firstChild) { | while (list.firstChild) { | ||
| Line 257: | Line 225: | ||
} | } | ||
list.dataset. | list.dataset.stagesNestedV6Applied = '1'; | ||
console. | console.warn('[UPDATE-046] Successfully applied nested stages v6. Rebuilt ' + rebuilt.length + ' items.'); | ||
} | } | ||
function boot() { | function boot() { | ||
console. | console.warn('[UPDATE-046] Boot sequence starting v6...'); | ||
applyNestedStages(); | applyNestedStages(); | ||
window.setTimeout(function () { | window.setTimeout(function () { | ||
applyNestedStages(); | applyNestedStages(); | ||
}, 350); | }, 350); | ||
window.setTimeout(function () { | window.setTimeout(function () { | ||
applyNestedStages(); | applyNestedStages(); | ||
}, 900); | }, 900); | ||
window.setTimeout(function () { | window.setTimeout(function () { | ||
applyNestedStages(); | applyNestedStages(); | ||
}, 1800); | }, 1800); | ||
Revision as of 10:54, 20 March 2026
/* Any JavaScript here will be loaded for all users on every page load. */
// Ensures class card images use the intended foreground image if data-src is present.
(function () {
function applyDataSrc() {
var images = document.querySelectorAll('.mw-card-image img[data-src]');
for (var i = 0; i < images.length; i++) {
var img = images[i];
var dataSrc = img.getAttribute('data-src');
if (dataSrc && img.getAttribute('src') !== dataSrc) {
img.setAttribute('src', dataSrc);
}
}
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', applyDataSrc);
} else {
applyDataSrc();
}
})();
/* Update 046: robust nested Stage dropdown - v6 with aggressive CSS and inline toggle */
(function () {
function textOf(el) {
return (el && el.textContent ? el.textContent : '').replace(/\s+/g, ' ').trim();
}
function norm(s) {
return (s || '').replace(/\s+/g, ' ').trim().toLowerCase();
}
function urlOf(link) {
if (!link) return '';
var href = link.getAttribute('href') || '';
var title = link.getAttribute('title') || '';
var parts = href.split('/');
var page = parts[parts.length - 1] || '';
return page || title;
}
function isStageLabel(label) {
return /^stage\s+[1-4]$/i.test(label);
}
function getStageNumber(label) {
var m = label.match(/^stage\s+([1-4])$/i);
return m ? m[1] : null;
}
function isMiniLabel(label) {
return /^mini\s+stage\s+\d+$/i.test(label);
}
function isMiniLabelForStage(url, label, stageNum) {
if (!isMiniLabel(label)) return false;
if (stageNum === '1') {
return !/^Stage_\d+_Mini_Stage/.test(url);
} else {
var pattern = new RegExp('^Stage_' + stageNum + '_Mini_Stage');
return pattern.test(url);
}
}
function directLink(li) {
if (!li || !li.childNodes) return null;
var i;
for (i = 0; i < li.childNodes.length; i++) {
var n = li.childNodes[i];
if (n && n.nodeType === 1 && n.tagName && n.tagName.toLowerCase() === 'a') {
return n;
}
}
return null;
}
function childLis(container) {
if (!container || !container.children) return [];
var out = [];
var i;
for (i = 0; i < container.children.length; i++) {
var c = container.children[i];
if (c && c.tagName && c.tagName.toLowerCase() === 'li') {
out.push(c);
}
}
return out;
}
function scoreContainer(container) {
var lis = childLis(container);
if (!lis.length) return 0;
var stageCount = 0;
var miniCount = 0;
var overviewCount = 0;
var i;
for (i = 0; i < lis.length; i++) {
var label = norm(textOf(directLink(lis[i])));
if (/^stage\s+[1-4]$/i.test(label)) stageCount++;
if (/^mini\s+stage\s+\d+$/i.test(label)) miniCount++;
if (label === 'overview') overviewCount++;
}
if (stageCount >= 4 && miniCount >= 8) {
return (stageCount * 100) + miniCount + (overviewCount ? 10 : 0);
}
return 0;
}
function findStagesListContainer() {
var candidates = document.querySelectorAll('ul, ol');
var best = null;
var bestScore = 0;
var i;
for (i = 0; i < candidates.length; i++) {
var score = scoreContainer(candidates[i]);
if (score > bestScore) {
bestScore = score;
best = candidates[i];
}
}
return best;
}
function makeToggle(stageLi, toggleSpan) {
return function (ev) {
ev.preventDefault();
ev.stopPropagation();
var open = stageLi.classList.toggle('stages-open');
toggleSpan.textContent = open ? '▾' : '▸';
console.warn('[UPDATE-046] TOGGLE CLICKED: Stage now ' + (open ? 'OPEN' : 'CLOSED'));
return false;
};
}
function applyNestedStages() {
var list = findStagesListContainer();
if (!list || list.dataset.stagesNestedV6Applied === '1') {
return;
}
var items = childLis(list);
if (!items.length) return;
var rebuilt = [];
var currentStageLi = null;
var currentMiniUl = null;
var currentStageNum = null;
var i;
for (i = 0; i < items.length; i++) {
var li = items[i];
var link = directLink(li);
if (!link) {
rebuilt.push(li.cloneNode(true));
continue;
}
var label = textOf(link);
var labelNorm = norm(label);
var url = urlOf(link);
if (isStageLabel(labelNorm)) {
var stageNum = getStageNumber(labelNorm);
currentStageNum = stageNum;
currentStageLi = li.cloneNode(true);
currentStageLi.className = (currentStageLi.className ? currentStageLi.className + ' ' : '') + 'stages-inner-parent';
var stageLink = directLink(currentStageLi);
if (stageLink) {
stageLink.style.fontWeight = 'bold';
stageLink.href = '#';
// Create toggle span and insert before link
var toggleSpan = document.createElement('span');
toggleSpan.className = 'stages-inner-toggle-icon';
toggleSpan.textContent = '▸';
toggleSpan.style.marginRight = '6px';
toggleSpan.style.color = '#f3b549';
toggleSpan.style.cursor = 'pointer';
toggleSpan.style.fontWeight = 'bold';
var toggleHandler = makeToggle(currentStageLi, toggleSpan);
toggleSpan.addEventListener('click', toggleHandler);
stageLink.addEventListener('click', toggleHandler);
stageLink.parentNode.insertBefore(toggleSpan, stageLink);
}
currentMiniUl = document.createElement('ul');
currentMiniUl.className = 'stages-inner-submenu';
currentStageLi.appendChild(currentMiniUl);
rebuilt.push(currentStageLi);
continue;
}
if (isMiniLabel(labelNorm)) {
if (currentMiniUl && currentStageNum) {
var matches = isMiniLabelForStage(url, label, currentStageNum);
if (matches) {
currentMiniUl.appendChild(li.cloneNode(true));
continue;
}
}
}
currentStageLi = null;
currentMiniUl = null;
currentStageNum = null;
rebuilt.push(li.cloneNode(true));
}
while (list.firstChild) {
list.removeChild(list.firstChild);
}
for (i = 0; i < rebuilt.length; i++) {
list.appendChild(rebuilt[i]);
}
list.dataset.stagesNestedV6Applied = '1';
console.warn('[UPDATE-046] Successfully applied nested stages v6. Rebuilt ' + rebuilt.length + ' items.');
}
function boot() {
console.warn('[UPDATE-046] Boot sequence starting v6...');
applyNestedStages();
window.setTimeout(function () {
applyNestedStages();
}, 350);
window.setTimeout(function () {
applyNestedStages();
}, 900);
window.setTimeout(function () {
applyNestedStages();
}, 1800);
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', boot);
} else {
boot();
}
})();