Difference between revisions of "MediaWiki:Common.js"

From Dungeon Defenders 2 Wiki
Jump to: navigation, search
(Attempt to fix javascript code incompatible with ES5)
(Amending regex again)
 
(9 intermediate revisions by the same user not shown)
Line 3: Line 3:
 
/* Replaces currency keywords (Gold, Gems, Defender Medals) with their icon in elements which include currency costs */
 
/* Replaces currency keywords (Gold, Gems, Defender Medals) with their icon in elements which include currency costs */
 
const currencyIcons = {
 
const currencyIcons = {
     "Gem": "<a href=\"/wiki/Gems\" class=\"image\"><img alt=\"Gem Icon.png\" src=\"/images/8/8d/Gem_Icon.png\" width=\"18\"></a>",
+
     "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>",
+
     "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>"
+
     "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>'
 
}
 
}
  
 
Array.from(document.getElementsByClassName('currency-included')).forEach(function (element) {
 
Array.from(document.getElementsByClassName('currency-included')).forEach(function (element) {
     const currency = element.innerHTML.match(/Gem|Gold|Defender Medal/i).toString()
+
     if (!element.innerHTML.match(/Gem|Gold|Defender Medal/i)) return
     element.innerHTML = element.innerHTML.replace(/(Gem|Gold|Defender Medal)s? (\d.*?)\b|(\d.*?) (Gem|Gold|Defender Medal)s?/gi, `${currencyIcons[currency]} $2$3`)
+
     const currencyRegex = /(Gem|Gold|Defender Medal)s? (\d.*?)(?= |$|\n)|(\d.*?) (Gem|Gold|Defender Medal)s?/gi
 +
    const phrases = element.innerHTML.match(currencyRegex)
 +
    phrases.forEach(function (phrase){
 +
        const currency = phrase.match(/Gem|Gold|Defender Medal/i).toString().toLowerCase()
 +
        const replacement = phrase.replace(currencyRegex, currencyIcons[currency] + " $2$3")
 +
        element.innerHTML = element.innerHTML.replace(phrase, replacement)
 +
    })
 
})
 
})
  
 
/* Replaces the XP keyword with the Ascension XP icon in elements which include Ascension XP numbers */
 
/* Replaces the XP keyword with the Ascension XP icon in elements which include Ascension XP numbers */
 
Array.from(document.getElementsByClassName('ascension-xp')).forEach(function (element) {
 
Array.from(document.getElementsByClassName('ascension-xp')).forEach(function (element) {
     element.innerHTML = element.innerHTML.replace(/XP (\d.*?)\b|(\d.*?) XP/gi, '<a href="/wiki/Experience" class="image"><img alt="Ascension XP Icon.png" src="/images/c/cf/Ascension_XP_Icon.png" width="18"></a> $1$2')
+
     element.innerHTML = element.innerHTML.replace(/XP (\d.*?)(?= |$|\n)|(\d.*?) XP/gi, '<a href="/wiki/Experience" class="image"><img alt="Ascension XP Icon.png" src="/images/c/cf/Ascension_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 */
 
/* 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) {
 
Array.from(document.getElementsByClassName('pass-xp')).forEach(function (element) {
     element.innerHTML = element.innerHTML.replace(/XP (\d.*?)\b|(\d.*?) XP/gi, '<a class="image"><img alt="Defender Pass XP Icon.png" src="/images/2/23/Defender_Pass_XP_Icon.png" width="18"></a> $1$2')
+
     element.innerHTML = element.innerHTML.replace(/XP (\d.*?)(?= |$|\n)|(\d.*?) XP/gi, '<a class="image"><img alt="Defender Pass XP Icon.png" src="/images/2/23/Defender_Pass_XP_Icon.png" width="18"></a> $1$2')
 
})
 
})
  
/* Replaces the rarity keywords like "worn, "sturdy", "powerful", "epic", "mythical", "legendary", and "godly" to have their icon on the left of the name  */
+
/* 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) {
 
Array.from(document.getElementsByClassName('rarity')).forEach(function (element) {
 
     element.innerHTML = element.innerHTML.replace(/Worn/gi, '<a class="image"> <img alt="Worn Icon.png" src="/images/3/34/Worn_Icon.png" width="18"> <span style="color: #808080;">Worn</span> </a>');
 
     element.innerHTML = element.innerHTML.replace(/Worn/gi, '<a class="image"> <img alt="Worn Icon.png" src="/images/3/34/Worn_Icon.png" width="18"> <span style="color: #808080;">Worn</span> </a>');

Latest revision as of 02:55, 16 November 2023

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

/* 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>'
}

Array.from(document.getElementsByClassName('currency-included')).forEach(function (element) {
    if (!element.innerHTML.match(/Gem|Gold|Defender Medal/i)) return
    const currencyRegex = /(Gem|Gold|Defender Medal)s? (\d.*?)(?= |$|\n)|(\d.*?) (Gem|Gold|Defender Medal)s?/gi
    const phrases = element.innerHTML.match(currencyRegex)
    phrases.forEach(function (phrase){
        const currency = phrase.match(/Gem|Gold|Defender Medal/i).toString().toLowerCase()
        const replacement = phrase.replace(currencyRegex, currencyIcons[currency] + " $2$3")
        element.innerHTML = element.innerHTML.replace(phrase, replacement)
    })
})

/* Replaces the XP keyword with the Ascension XP icon in elements which include Ascension XP numbers */
Array.from(document.getElementsByClassName('ascension-xp')).forEach(function (element) {
    element.innerHTML = element.innerHTML.replace(/XP (\d.*?)(?= |$|\n)|(\d.*?) XP/gi, '<a href="/wiki/Experience" class="image"><img alt="Ascension XP Icon.png" src="/images/c/cf/Ascension_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(/XP (\d.*?)(?= |$|\n)|(\d.*?) XP/gi, '<a class="image"><img alt="Defender Pass XP Icon.png" src="/images/2/23/Defender_Pass_XP_Icon.png" width="18"></a> $1$2')
})

/* 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.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>');
    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>');
    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>');
    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> </a>');
})