MediaWiki:Common.js: Difference between revisions
Automated page publish |
gave the mobile menu some actual links |
||
| (8 intermediate revisions by the same user not shown) | |||
| Line 4: | Line 4: | ||
$('#ca-view a').text('Read'); | $('#ca-view a').text('Read'); | ||
}); | }); | ||
// ========================================================================== | |||
// Minerva (mobile skin) main menu only ships Home/Random by default; it does | |||
// not pull in MediaWiki:Sidebar the way Vector's portlets do. This injects | |||
// the same section links (kept in sync with MediaWiki:Sidebar by hand) into | |||
// the native menu markup so mobile visitors actually get real navigation | |||
// instead of just Home/Random/Settings/About/Disclaimers. | |||
(function () { | |||
function initMinervaNav() { | |||
try { | |||
if (!document.body || !document.body.classList.contains('skin-minerva')) return; | |||
var nav = document.getElementById('p-navigation'); | |||
if (!nav || document.getElementById('wov-minerva-extra-nav')) return; | |||
var sections = [ | |||
{ heading: 'Guides', items: [ | |||
['Getting started', '/w/Getting_Started'], | |||
['Interactive Map (Fullscreen)', 'https://jxlife.github.io/WindsOfValenMap/'], | |||
['All skills', '/w/Skills'], | |||
['All quests', '/w/Quests'], | |||
['Combat guide', '/w/Combat'] | |||
]}, | |||
{ heading: 'Database', items: [ | |||
['Item database', '/w/Items'], | |||
['NPC database', '/w/NPCs'], | |||
['Set bonuses', '/w/Set_bonuses'] | |||
]}, | |||
{ heading: 'Skills', items: [ | |||
['Skill Calculator', '/w/Calculators'], | |||
['Mining', '/w/Mining'], | |||
['Smithing', '/w/Smithing'], | |||
['Fishing', '/w/Fishing'], | |||
['Potion Making', '/w/Potion_Making'] | |||
]}, | |||
{ heading: 'Tools', items: [ | |||
['About this wiki', '/w/Project:About'], | |||
['Random page', '/w/Special:Random'], | |||
['New files', '/w/Special:NewFiles'], | |||
['Wanted pages', '/w/Special:WantedPages'], | |||
['Wiki statistics', '/w/Special:Statistics'] | |||
]}, | |||
{ heading: 'Updates', items: [ | |||
['Recent changes', '/w/Special:RecentChanges'] | |||
]} | |||
]; | |||
var container = document.createElement('div'); | |||
container.id = 'wov-minerva-extra-nav'; | |||
sections.forEach(function (section) { | |||
var heading = document.createElement('div'); | |||
heading.className = 'wov-minerva-nav-heading'; | |||
heading.textContent = section.heading; | |||
container.appendChild(heading); | |||
var ul = document.createElement('ul'); | |||
ul.className = 'toggle-list__list'; | |||
section.items.forEach(function (item) { | |||
var li = document.createElement('li'); | |||
li.className = 'toggle-list-item'; | |||
var a = document.createElement('a'); | |||
a.className = 'toggle-list-item__anchor'; | |||
a.href = item[1]; | |||
var label = document.createElement('span'); | |||
label.className = 'toggle-list-item__label'; | |||
label.textContent = item[0]; | |||
a.appendChild(label); | |||
li.appendChild(a); | |||
ul.appendChild(li); | |||
}); | |||
container.appendChild(ul); | |||
}); | |||
nav.parentNode.insertBefore(container, nav.nextSibling); | |||
} catch (e) {} | |||
} | |||
if (document.body) { | |||
initMinervaNav(); | |||
} else { | |||
document.addEventListener('DOMContentLoaded', initMinervaNav); | |||
} | |||
})(); | |||
// ========================================================================== | // ========================================================================== | ||
// Valen Ledger — Gathering & Combat XP Calculator | // Valen Ledger — Gathering & Combat XP Calculator | ||
| Line 816: | Line 898: | ||
selectTab('fishing'); | selectTab('fishing'); | ||
}); | }); | ||
// ========================================================================== | |||
// Mobile nav toggle — the sidebar (#mw-panel) renders inline far down the | |||
// page on narrow screens, so add a fixed hamburger button that slides it in | |||
// as an overlay drawer instead. CSS in Common.css keeps this hidden/inert | |||
// on desktop widths (>=1000px). | |||
// ========================================================================== | |||
(function () { | |||
function initMobileNav() { | |||
var panel = document.getElementById('mw-panel'); | |||
if (!panel || document.getElementById('mobile-nav-toggle')) return; | |||
var toggle = document.createElement('button'); | |||
toggle.id = 'mobile-nav-toggle'; | |||
toggle.type = 'button'; | |||
toggle.setAttribute('aria-label', 'Toggle navigation menu'); | |||
toggle.textContent = '\u2630 Menu'; | |||
var backdrop = document.createElement('div'); | |||
backdrop.id = 'mobile-nav-backdrop'; | |||
document.body.insertBefore(backdrop, document.body.firstChild); | |||
document.body.insertBefore(toggle, document.body.firstChild); | |||
function closeNav() { | |||
panel.classList.remove('mobile-nav-open'); | |||
backdrop.classList.remove('mobile-nav-open'); | |||
} | |||
function toggleNav() { | |||
panel.classList.toggle('mobile-nav-open'); | |||
backdrop.classList.toggle('mobile-nav-open'); | |||
} | |||
toggle.addEventListener('click', toggleNav); | |||
backdrop.addEventListener('click', closeNav); | |||
panel.querySelectorAll('a').forEach(function (a) { | |||
a.addEventListener('click', closeNav); | |||
}); | |||
} | |||
if (document.readyState === 'loading') { | |||
document.addEventListener('DOMContentLoaded', initMobileNav); | |||
} else { | |||
initMobileNav(); | |||
} | |||
})(); | |||