Widget:TesteBossYawn

"bossSetDiff(this,'normal')">NORMAL</button>

 <button onclick="bossSetDiff(this,'elite')">ELITE</button>
 <button onclick="bossSetDiff(this,'hard')">HARD</button>

<script> (function() {

 async function getImageUrlFromWiki(imageName) {
   const apiUrl = `https://wiki.gla.com.br/api.php?action=query&titles=${encodeURIComponent(imageName)}&prop=imageinfo&iiprop=url&format=json&origin=*`;
   
   try {
       const response = await fetch(apiUrl);
       const data = await response.json();
       const pages = data.query.pages;
       const page = Object.values(pages)[0];
       
       if (page.imageinfo && page.imageinfo[0]) {
           return page.imageinfo[0].url;
       }
   } catch(e) {
       console.error('Erro ao buscar imagem:', e);
   }
   return null;

}

async function bossRender(root, diff) {
   const data = JSON.parse(root.dataset.json);
   const d = data[diff];
   const content = root.querySelector(".boss-content");

   let html = "";

   // Nome do boss (se existir)
   if (data.nome) {

html += `

${data.nome}

`;

   }

   // Introdução (se existir)
   if (data.introducao) {

html += `

${data.introducao}

`;

   }

   // Localização (se existir)
   if (data.localizacao && data.localizacao.caminho) {

html += `

Localização

`; html += `

${data.localizacao.descricao}

`;

   const imageName = data.localizacao.caminho;
   const imageUrl = await getImageUrlFromWiki(imageName);
   
   if (imageUrl) {

html += `

                   <img src="${imageUrl}" style="max-width: 100%;">

Caminho para o boss

`;

   }

}

   // Requisitos

html += `

Requisitos

`; d.requisitos.forEach(r => html += `
• ${r}
`); html += `

`;

   // Recompensas

html += `

Recompensas

`; d.recompensas.forEach(r => html += `
• ${r}
`); html += `

`;

   // Skills
   if (d.skills && d.skills.length > 0) {

html += `

Skills

`; d.skills.forEach(s => html += `
• ${s.nome}: ${s.desc}
`); html += `

`;

   }

   content.innerHTML = html;
 }

 function init() {
   document.querySelectorAll(".boss-component").forEach(root => {
     if (root.dataset.rendered === 'true') return;
     root.dataset.rendered = 'true';
     bossRender(root, "normal");
   });
 }

 window.bossSetDiff = function(el, diff) {
   const root = el.closest(".boss-component");
   bossRender(root, diff);
 };

 if (document.readyState === 'loading') {
   document.addEventListener('DOMContentLoaded', init);
 } else {
   init();
 }

 if (typeof mw !== 'undefined' && mw.hook) {
   mw.hook('wikipage.content').add(init);
 }

})(); </script>

<style> .boss-component .box { ... } </style>