Changes

MediaWiki:Common.js

4,114 bytes added, 02:38, 14 December 2024
m
Changing scrollIntoView to be centered instead
/* Any JavaScript here will be loaded for all users on every page load. */
/* Allows for navigation from one tab to another within the same tabber */
function tabberGoTo(thisElement, tabName, id) {
var tabbertab = thisElement
 
while (!tabbertab.classList.contains('tabbertab')) {
tabbertab = tabbertab.parentElement
}
 
const tabber = tabbertab.parentElement
const tabberChildren = Array.from(tabber.children)
// Switch tabs
tabbertab.style.display = 'none'
tabberChildren.find(function (child) { return child.title === tabName }).style.display = 'block'
 
// Handle tabbernav CSS
const nav = tabberChildren.find(function (child) { return child.classList.contains('tabbernav') })
Array.from(nav.children).forEach(function (child) {
if (child.firstElementChild.title === tabbertab.title) { child.classList = '' }
if (child.firstElementChild.title === tabName) { child.classList = 'tabberactive' }
})
 
if (id) {
document.getElementById(id).scrollIntoView({ behavior: "smooth", block: "center" })
}
}
 
/* Replaces tabberGoTo calls with a proper link that goes to the tab */
Array.from(document.getElementsByClassName('tabberGoTo')).forEach(function (element) {
const newElement = document.createElement('a')
newElement.setAttribute('onclick', "tabberGoTo(this, '" + element.classList[1] + "', '" + element.id + "')")
newElement.textContent = element.textContent
 
element.replaceWith(newElement)
})
 
/* Replaces currency keywords (Gold, Gems, Defender Medals) with their icon in elements which include currency costs */
const currencyIcons = {
"gem": '<a href="/wiki/Gems" class="image"><img alt="Gem Icon.png" src="/images/8/8d/Gem_Icon.png" width="18"></a>',
"gold": '<a href="/wiki/Gold" class="image"><img alt="Gold Icon.png" src="/images/2/26/Gold_Icon.png" width="18"></a>',
"defender medal": '<a href="/wiki/Defender_Medals" class="image"><img alt="Defender Medal Icon.png" src="/images/a/a7/Defender_Medal_Icon.png" width="18"></a>'
}
/* Replaces currency keywords (gold, gems, defender medals) with their icon in texts which include currency costs */
Array.from(document.getElementsByClassName('currency-included')).forEach(function (element) {
if (!element.innerHTML = element.innerHTML.replacematch(/gemsGem|Gold|Defender Medal/i)) return const currencyRegex = /(Gem|Gold|Defender Medal)s?(\sd.*?)([?= |$|\d,]+n)|([\d,]+.*?) (Gem|Gold|Defender Medal)\s*?gems?/gi, '<a href const phrases = element.innerHTML.match(currencyRegex) phrases.forEach(function (phrase){ const currency ="phrase.match(/wikiGem|Gold|Defender Medal/File:Gem_Iconi).toString().png" classtoLowerCase() const replacement =phrase.replace(currencyRegex, currencyIcons[currency] + "image$2$3"><img alt) element.innerHTML ="Gem Iconelement.innerHTML.png" src="replace(phrase, replacement) })}) /images* Replaces the XP keyword with the Ascension XP icon in elements which include Ascension XP numbers */8/8d/Gem_IconArray.from(document.png" width="18"></a> $1$2getElementsByClassName('ascension-xp')).forEach(function (element) { element.innerHTML = element.innerHTML.replace(/goldXP (\sd.*?)([?= |$|\d,]+n)|([\d,]+)\s.*?gold) XP/gi, '<a href="/wiki/File:Gold_Icon.pngExperience" class="image"><img alt="Gold Ascension XP Icon.png" src="/images/2c/26cf/Gold_IconAscension_XP_Icon.png" width="18"></a> $1$2')}) /* Replaces the XP keyword with the Defender Pass XP icon in elements which include Defender Pass XP numbers */Array.from(document.getElementsByClassName('pass-xp')).forEach(function (element) { element.innerHTML = element.innerHTML.replace(/defender medals?XP (\sd.*?)([?= |$|\d,]+n)|([\d,]+)\s.*?defender medals?) XP/gi, '<a href="/wiki/File:Defender_Medal_Icon.png" class="image"><img alt="Defender Medal Pass XP Icon.png" src="/images/a2/a723/Defender_Medal_IconDefender_Pass_XP_Icon.png" width="18"></a> $1$2')
})
window/* Replaces the rarity keywords like "Worn, "Sturdy", "Powerful", "Epic", "Mythical", "Legendary", and "Godly" to have their icon on the left of the name */Array.from(document.getElementsByClassName('rarity')).forEach(function (element) { element.innerHTML = element.innerHTML.replace(/Worn/gi, '<a class="image"> <img alt="Worn Icon.tooltips_list png" src= ["/images/3/34/Worn_Icon.png" width="18"> <span style="color: #808080;">Worn</span> </a>'); {element.innerHTML = element.innerHTML.replace(/Sturdy/gi, '<a class="image"> <img alt="Sturdy Icon.png" src="/images/c/cf/Sturdy_Icon.png" width="18"> <span style="color: #808000;">Sturdy</span> </a>'); classname element.innerHTML = element.innerHTML.replace(/Powerful/gi, '<a class="image"> <img alt="Powerful Icon.png" src="/images/2/29/Powerful_Icon.png" width="18"> <span style="color: #008000;">Powerful</span> </a>'custom-tooltip-parse); element.innerHTML = element.innerHTML.replace(/Epic/gi, '<a class="image"> <img alt="Epic Icon.png" src="/images/f/fc/Epic_Icon.png" width="18"> <span style="color: #3366FF;">Epic</span> </a>'); element.innerHTML = element.innerHTML.replace(/Mythical/gi,'<a class="image"> <img alt="Mythical Icon.png" src="/images/1/18/Mythical_Icon.png" width="18"> <span style="color: #FF00FF;">Mythical</span> </a>'); parse element.innerHTML = element.innerHTML.replace(/Legendary/gi, '<a class="image"> <img alt="Legendary Icon.png" src="/images/1/11/Legendary_Icon.png" width="18"> <span style="color: #FF9900;">Legendary</span> </a>'{{); element.innerHTML = element.innerHTML.replace(/Godly/gi, '<a class="image"> <img alt="Godly Icon.png" src="/images/d/d0/Godly_Icon.png" width="18"> <span style="color:#00FFFF;">Godly</span> <#tooltip#/a>}}',); }];)
WikiDefender, bureaucrat, administrator
736
edits