Mudanças entre as edições de "Widget:VisnoTeste"

De Wiki Gla
Ir para navegação Ir para pesquisar
Linha 1 383: Linha 1 383:
   // Mapeamento de URLs completas para versões traduzidas
   // Mapeamento de URLs completas para versões traduzidas
   const pageMap = {
   const pageMap = {
     'https://www.youtube.com/watch?v=z03cgm2ydWU': {
     'https://wiki.gla.com.br/index.php/Usu%C3%A1rio:Visno#': {
       en: 'https://www.youtube.com/watch?v=bAVk7T1Xiys',
       en: 'https://www.youtube.com/watch?v=bAVk7T1Xiys',
       pt: 'https://www.youtube.com/watch?v=z03cgm2ydWU',
       pt: 'https://wiki.gla.com.br/index.php/Usu%C3%A1rio:Visno#',
       es: 'https://www.youtube.com/watch?v=fake_es',
       es: 'https://www.youtube.com/watch?v=fake_es',
       pl: 'https://www.youtube.com/watch?v=fake_pl'
       pl: 'https://www.youtube.com/watch?v=fake_pl'

Edição das 00h17min de 1 de julho de 2025

<!DOCTYPE html> <html lang="pt-BR">

<head>

 <meta charset="UTF-8">
 <title>Teste GIF Hover</title>
 <style>
   body {
     margin: 0;
     font-family: sans-serif;
     color: white;
   }
   .search-bar {
     text-align: right;
     padding: 20px;
   }
   .search-bar input {
     padding: 8px;
     width: 250px;
     border-radius: 5px;
     border: 1px solid #ccc;
   }
   .container {
     display: flex;
     gap: 10px;
     flex-wrap: wrap;
     justify-content: center;
     padding-bottom: 40px;
   }
   .personagem {
     width: 250px;
     height: 115px;
     border-radius: 10px;
     background-size: 150%;
     background-position: center -30px;
     transition: transform 0.3s;
     display: flex;
     align-items: flex-end;
     justify-content: flex-end;
     padding: 5px;
     font-weight: bold;
     color: white;
     text-shadow: 1px 1px 4px #000, 0 0 20px #000;
     position: relative;
     cursor: pointer;
     border: 2px solid #58aaff;
     overflow: hidden;
     text-decoration: none;
   }
   .personagem span {
     z-index: 2;
   }
   .gif-overlay {
     position: absolute;
     inset: 0;
     background-repeat: no-repeat;
     background-size: 150%;
     background-position: center -30px;
     opacity: 0;
     z-index: 1;
     pointer-events: none;
   }
   .personagem:hover .gif-overlay {
     opacity: 1;
   }
   .personagem.luffy .gif-overlay {
     background-position: center 0px;
   }
   .personagem.hancock {
     background-size: 115%;
   }
   .personagem.daddy {
     background-size: 100%;
     background-position: top;
   }
   .personagem.kizaru {
     background-position: center -20px;
   }
   .personagem.luffypre {
     background-position: center;
   }
   .personagem.perona {
     background-position: center -80px;
   }
   .personagem.sanjipre {
     background-position: center -50px;
   }
   .personagem.cabaji {
     background-size: 240%;
     background-position: center -80px;
   }
   .personagem.gin {
     background-position: center -120px;
   }
   .personagem.jango {
     background-position: left -40px top -20px;
     background-size: 180%;
   }
   /* --------- Tiers ----------- */
   .tier-diamante .personagem {
     background-color: #414c5c;
   }
   .tier-gold .personagem {
     background-color: #d4af37;
   }
   .tier-prata .personagem {
     background-color: #c0c0c0;
   }
   .tier-bronze .personagem {
     background-color: #7e4f20;
   }
   .filtros {
     flex-wrap: wrap;
     align-items: flex-start;
     padding: 10px 20px;
     display: flex;
     gap: 20px;
     justify-content: space-between;
     margin-bottom: 20px;
   }
   .filtros button {
     padding: 8px 14px;
     margin: 0 4px;
     border: none;
     border-radius: 5px;
     background-color: #58aaff;
     color: white;
     font-weight: bold;
     cursor: pointer;
     transition: background-color 0.3s;
   }
   .filtro-grupo {
     /*display: flex;
     flex-wrap: wrap;
     gap: 6px;*/
     display: grid;
     grid-template-columns: repeat(2, auto);
     gap: 6px 10px;
   }
   .filtro-box {
     background: #5a5a5a13;
     padding: 10px;
     border-radius: 8px;
   }
   .filtro-box legend {
     font-size: 16px;
     font-weight: bold;
     color: #000000cc;
     margin-bottom: 6px;
     text-align: center;
   }
   .filtros button:hover {
     background-color: #3388dd;
   }
   .filtros button.ativo {
     background-color: #3588f5;
     color: white;
     border-color: #2672d4;
     box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
     transform: scale(1.05);
   }
   .classe-icon-wrapper {
     position: absolute;
     top: 5px;
     left: 5px;
     display: flex;
     flex-direction: column;
     gap: 1px;
     z-index: 10;
     pointer-events: none;
     transition: transform 0.4s ease;
   }
   .classe-icon {
     width: 28px;
     height: 28px;
     user-select: none;
     pointer-events: none;
     opacity: 1;
     transition: opacity 0.3s ease-in-out;
   }
   .personagem-box {
     position: relative;
     transition: transform 0.4s ease;
     transform-origin: center center;
   }
   .personagem-box:hover {
     transform: scale(1.05);
   }
   .personagem-box:hover .classe-icon {
     opacity: 0.8;
   }
   .classe-filtro-container {
     display: flex;
     align-items: center;
     gap: 12px;
   }
   .btn-vertical {
     writing-mode: vertical-rl;
     rotate: 270deg;
   }
   .classe-grid {
     display: grid;
     grid-template-columns: repeat(5, auto);
     gap: 6px 10px;
   }
.tooltip-img {
 position: absolute;
 top: -110px;
 left: 50%;
 transform: translateX(-50%);
 width: 60px;
 height: auto;
 display: none;
 pointer-events: none;
 border-radius: 6px;
 box-shadow: 0 2px 8px rgba(0,0,0,0.3);
 z-index: 99;

}


 </style>

</head>

<body>


   <fieldset class="filtro-box classe-filtro-container">
     <legend>Classe</legend>
     <button class="btn-vertical tipo-btn ativo" data-tipo="all">ALL</button>
       <button class="tipo-btn" data-tipo="lutador" data-tooltip-img="https://wiki.gla.com.br/images/e/e6/Fighter.png">Lutador</button>
       <button class="tipo-btn" data-tipo="atirador" data-tooltip-img="https://wiki.gla.com.br/images/e/ed/Shooter.png">Atirador</button>
       <button class="tipo-btn" data-tipo="cortante" data-tooltip-img="https://wiki.gla.com.br/images/9/9a/Slasher.png">Cortante</button>
       <button class="tipo-btn" data-tipo="especialista" data-tooltip-img="https://wiki.gla.com.br/images/f/f6/Especialist.png">Especialista</button>
       <button class="tipo-btn" data-tipo="tanque" data-tooltip-img="https://wiki.gla.com.br/images/9/9d/Tank.png">Tanque</button>
       <button class="tipo-btn" data-tipo="dps" data-tooltip-img="https://wiki.gla.com.br/images/6/60/Dps.png">DPS</button>
       <button class="tipo-btn" data-tipo="suporte" data-tooltip-img="https://wiki.gla.com.br/images/a/ab/Support.png">Suporte</button>
       <button class="tipo-btn" data-tipo="bruiser" data-tooltip-img="https://wiki.gla.com.br/images/e/e4/Bruiser.png">Bruiser</button>
       <button class="tipo-btn" data-tipo="parede">Parede</button>
       <button class="tipo-btn" data-tipo="ponte">Ponte</button>
   </fieldset>
   <fieldset class="filtro-box">
     <legend>Tier</legend>
       <button class="tier-btn" data-tier="tier-diamante">💎 Diamante</button>
       <button class="tier-btn" data-tier="tier-gold">⭐ Ouro</button>
       <button class="tier-btn" data-tier="tier-prata">🥈 Prata</button>
       <button class="tier-btn" data-tier="tier-bronze">🥉 Bronze</button>
   </fieldset>
       Aokiji
       Bartholomew Kuma
       Boa Hancock
       Borsalino Kizaru
       Brook (TS)
       Chopper (TS)
       Donquixote Doflamingo
       Dracule Mihawk
       Emporio Ivankov
       Enel
       Franky (TS)
       Jinbe
       Marshall D. Teach
       Marco
       Monkey D. Luffy (TS)
       Nami (TS)
       Portgas D. Ace
       Nico Robin (TS)


       Roronoa Zoro (TS)
       Sabo


       Sakazuki (Akainu)
       Shanks
       Usopp (TS)
       Uta
       Sanji (TS)
       Baby 5
       Bartolomeo
       Basil Hawkins
       Bastille
       Bellamy
       Jewelry Bonney
       Brook
       Capone Gang Bege
       Carrot
       Chopper
       Sir Crocodile
       Dalmatian
       Franky
       Gecko Moria
       Hina
       Jesus Burgess
       Eustass Kid
       Killer
       Koala
       Leo & Mansherry
       Monkey D. Luffy
       Nami
       Perona
       Rebecca
       Robin
       Zoro
       Ryuma
       Scratchmen Apoo
       Smoker
       Trafalgar D. Water Law
       Urouge
       Usopp
       Van Augur
       Vinsmoke Ichiji
       Vinsmoke Niji
       Vinsmoke Reiju
       Vinsmoke Sanji
       Vinsmoke Yonji
       X Drake
       Satori
       Gedatsu
       Ohm
       Shura
       Arlong
       Bepo
       Bon Clay
       Buggy
       Daddy Masterson
       Daz Bonez
       Zala
       Don Krieg
       Kuro
       Galdino
       Tashigi
       Nefertari Vivi
       Wapol
       Alvida
       Buchi & Sham
       Cabaji
       Chew
       Eric
       Gin
       Miss GoldenWeek
       Hatchan
       Jango
       Kuroobi
       Mohji
       Morgan
       Babe & Drophy
       Gem & Mikita
       Pearl
 <script>
   const cards = document.querySelectorAll('.personagem');
   // Define as imagens estáticas e gifs, além do reset ao sair
   cards.forEach(card => {
     const staticImg = card.getAttribute('data-static');
     const gifImg = card.getAttribute('data-gif');
     const overlay = card.querySelector('.gif-overlay');
     card.style.backgroundImage = `url('${staticImg}')`;
     card.addEventListener('mouseenter', () => {
       const uniqueGifUrl = `${gifImg}?t=${new Date().getTime()}`; // Força reset
       overlay.style.backgroundImage = `url('${uniqueGifUrl}')`;
     });
     card.addEventListener('mouseleave', () => {
       overlay.style.backgroundImage = ;
     });
   });
   // Filtragem por nome no campo de busca
   document.getElementById('search').addEventListener('input', function () {
     const term = this.value.toLowerCase();
     cards.forEach(card => {
       const name = card.querySelector('span').textContent.toLowerCase();
       const wrapper = card.parentElement;
       const tierBox = wrapper.parentElement;
       tierBox.style.display = name.includes(term) ? 'block' : 'none';
     });
   });


   //  Links dos personagens
   const personagemLinks = {
     "Aokiji": "https://wiki.gla.com.br/index.php/Aokiji",
     "Bartholomew Kuma": "https://wiki.gla.com.br/index.php/Kuma",
     "Boa Hancock": "https://wiki.gla.com.br/index.php/Boa_Hancock",
     "Borsalino Kizaru": "https://wiki.gla.com.br/index.php/Kizaru",
     "Brook (TS)": "https://wiki.gla.com.br/index.php/Brook_(Timeskip)",
     "Chopper (TS)": "https://wiki.gla.com.br/index.php/Chopper_(Timeskip)",
     "Donquixote Doflamingo": "https://wiki.gla.com.br/index.php/Doflamingo",
     "Dracule Mihawk": "https://wiki.gla.com.br/index.php/Mihawk",
     "Emporio Ivankov": "https://wiki.gla.com.br/index.php/Ivankov",
     "Enel": "https://wiki.gla.com.br/index.php/Enel",
     "Franky (TS)": "https://wiki.gla.com.br/index.php/Franky_(Timeskip)",
     "Jinbe": "https://wiki.gla.com.br/index.php/Jinbe",
     "Marshall D. Teach": "https://wiki.gla.com.br/index.php/Marshall_D._Teach",
     "Marco": "https://wiki.gla.com.br/index.php/Marco",
     "Monkey D. Luffy (TS)": "https://wiki.gla.com.br/index.php/Luffy_(Timeskip)",
     "Nami (TS)": "https://wiki.gla.com.br/index.php/Nami_(Timeskip)",
     "Portgas D. Ace": "https://wiki.gla.com.br/index.php/Ace",
     "Nico Robin (TS)": "https://wiki.gla.com.br/index.php/Robin_(Timeskip)",
     "Roronoa Zoro (TS)": "https://wiki.gla.com.br/index.php/Zoro_(Timeskip)",
     "Sabo": "https://wiki.gla.com.br/index.php/Sabo",
     "Sakazuki (Akainu)": "https://wiki.gla.com.br/index.php/Akainu",
     "Shanks": "https://wiki.gla.com.br/index.php/Shanks",
     "Usopp (TS)": "https://wiki.gla.com.br/index.php/Usopp_(Timeskip)",
     "Uta": "https://wiki.gla.com.br/index.php/Uta",
     "Sanji (TS)": "https://wiki.gla.com.br/index.php/Sanji_(Timeskip)",
     "Baby 5": "https://wiki.gla.com.br/index.php/Baby_5",
     "Bartolomeo": "https://wiki.gla.com.br/index.php/Bartolomeo",
     "Basil Hawkins": "https://wiki.gla.com.br/index.php/Basil_Hawkins",
     "Bastille": "https://wiki.gla.com.br/index.php/Bastille",
     "Bellamy": "https://wiki.gla.com.br/index.php/Bellamy",
     "Jewelry Bonney": "https://wiki.gla.com.br/index.php/Bonney",
     "Brook": "https://wiki.gla.com.br/index.php/Brook",
     "Capone Gang Bege": "https://wiki.gla.com.br/index.php/Capone_Bege",
     "Carrot": "https://wiki.gla.com.br/index.php/Carrot",
     "Chopper": "https://wiki.gla.com.br/index.php/Chopper",
     "Sir Crocodile": "https://wiki.gla.com.br/index.php/Crocodile",
     "Dalmatian": "https://wiki.gla.com.br/index.php/Dalmatian",
     "Franky": "https://wiki.gla.com.br/index.php/Franky",
     "Gecko Moria": "https://wiki.gla.com.br/index.php/Gecko_Moria",
     "Hina": "https://wiki.gla.com.br/index.php/Hina",
     "Jesus Burgess": "https://wiki.gla.com.br/index.php/Jesus_Burgess",
     "Eustass Kid": "https://wiki.gla.com.br/index.php/Kid",
     "Killer": "https://wiki.gla.com.br/index.php/Killer",
     "Koala": "https://wiki.gla.com.br/index.php/Koala",
     "Leo & Mansherry": "https://wiki.gla.com.br/index.php/Leo",
     "Monkey D. Luffy": "https://wiki.gla.com.br/index.php/Luffy",
     "Nami": "https://wiki.gla.com.br/index.php/Nami",
     "Perona": "https://wiki.gla.com.br/index.php/Perona",
     "Rebecca": "https://wiki.gla.com.br/index.php/Rebecca",
     "Robin": "https://wiki.gla.com.br/index.php/Robin",
     "Zoro": "https://wiki.gla.com.br/index.php/Zoro",
     "Ryuma": "https://wiki.gla.com.br/index.php/Ryuma",
     "Scratchmen Apoo": "https://wiki.gla.com.br/index.php/Apoo",
     "Smoker": "https://wiki.gla.com.br/index.php/Smoker",
     "Trafalgar D. Water Law": "https://wiki.gla.com.br/index.php/Law",
     "Urouge": "https://wiki.gla.com.br/index.php/Urouge",
     "Usopp": "https://wiki.gla.com.br/index.php/Usopp",
     "Van Augur": "https://wiki.gla.com.br/index.php/Van_Augur",
     "Vinsmoke Ichiji": "https://wiki.gla.com.br/index.php/Ichiji",
     "Vinsmoke Niji": "https://wiki.gla.com.br/index.php/Niji",
     "Vinsmoke Reiju": "https://wiki.gla.com.br/index.php/Reiju",
     "Vinsmoke Sanji": "https://wiki.gla.com.br/index.php/Sanji",
     "Vinsmoke Yonji": "https://wiki.gla.com.br/index.php/Yonji",
     "X Drake": "https://wiki.gla.com.br/index.php/X_Drake",
     "Satori": "https://wiki.gla.com.br/index.php/Satori",
     "Gedatsu": "https://wiki.gla.com.br/index.php/Gedatsu",
     "Ohm": "https://wiki.gla.com.br/index.php/Ohm",
     "Shura": "https://wiki.gla.com.br/index.php/Shura",
     "Arlong": "https://wiki.gla.com.br/index.php/Arlong",
     "Bepo": "https://wiki.gla.com.br/index.php/Bepo",
     "Bon Clay": "https://wiki.gla.com.br/index.php/Mr.2",
     "Buggy": "https://wiki.gla.com.br/index.php/Buggy",
     "Daddy Masterson": "https://wiki.gla.com.br/index.php/Daddy_Masterson",
     "Daz Bonez": "https://wiki.gla.com.br/index.php/Mr.1",
     "Zala": "https://wiki.gla.com.br/index.php/Miss_Doublefinger",
     "Don Krieg": "https://wiki.gla.com.br/index.php/Don_Krieg",
     "Kuro": "https://wiki.gla.com.br/index.php/Kuro",
     "Galdino": "https://wiki.gla.com.br/index.php/Mr.3",
     "Tashigi": "https://wiki.gla.com.br/index.php/Tashigi",
     "Nefertari Vivi": "https://wiki.gla.com.br/index.php/Vivi",
     "Wapol": "https://wiki.gla.com.br/index.php/Wapol",
     "Alvida": "https://wiki.gla.com.br/index.php/Alvida",
     "Buchi & Sham": "https://wiki.gla.com.br/index.php/Buchi",
     "Cabaji": "https://wiki.gla.com.br/index.php/Cabaji",
     "Chew": "https://wiki.gla.com.br/index.php/Chew",
     "Eric": "https://wiki.gla.com.br/index.php/Eric",
     "Gin": "https://wiki.gla.com.br/index.php/Gin",
     "Miss GoldenWeek": "https://wiki.gla.com.br/index.php/Goldenweek",
     "Hatchan": "https://wiki.gla.com.br/index.php/Hatchan",
     "Jango": "https://wiki.gla.com.br/index.php/Jango",
     "Kuroobi": "https://wiki.gla.com.br/index.php/Kuroobi",
     "Mohji": "https://wiki.gla.com.br/index.php/Mohji",
     "Morgan": "https://wiki.gla.com.br/index.php/Morgan",
     "Babe & Drophy": "https://wiki.gla.com.br/index.php/Mr.4",
     "Gem & Mikita": "https://wiki.gla.com.br/index.php/Mr.5",
     "Pearl": "https://wiki.gla.com.br/index.php/Pearl"
   };
   // Envolve as boxes com <a> e aplica links clicáveis
   cards.forEach(card => {
     const span = card.querySelector('span');
     const nomePersonagem = span?.textContent.trim();
     const link = personagemLinks[nomePersonagem];
     if (link) {
       const wrapper = document.createElement('a');
       wrapper.href = link;
       wrapper.target = "_blank";
       wrapper.style.display = "flex";
       wrapper.style.textDecoration = "none";
       wrapper.style.flex = "0 1 auto";
       wrapper.style.alignItems = "stretch";
       card.parentElement.replaceChild(wrapper, card);
       wrapper.appendChild(card);
     }
   });
   const tierButtons = document.querySelectorAll('.tier-btn');
   const tipoButtons = document.querySelectorAll('.tipo-btn');
   const personagemBoxes = document.querySelectorAll('.personagem-box');
   let activeTier = 'all';
   let activeTipos = new Set();
   const iconesClasse = {
     lutador: 'https://wiki.gla.com.br/images/e/e6/Fighter.png',
     especialista: 'https://wiki.gla.com.br/images/f/f6/Especialist.png',
     tanque: 'https://wiki.gla.com.br/images/9/9d/Tank.png',
     suporte: 'https://wiki.gla.com.br/images/a/ab/Support.png',
     bruiser: 'https://wiki.gla.com.br/images/e/e4/Bruiser.png',
     atirador: 'https://wiki.gla.com.br/images/e/ed/Shooter.png',
     dps: 'https://wiki.gla.com.br/images/6/60/Dps.png',
     cortante: 'https://wiki.gla.com.br/images/9/9a/Slasher.png',
     fruta: 'https://wiki.gla.com.br/images/e/e4/Devil-fruit.png',
   };


function updateFiltros() {

 personagemBoxes.forEach(box => {
   const matchesTier = activeTier === 'all' || box.classList.contains(activeTier);
   const matchesTipo =
     activeTipos.size === 0 ||
     [...activeTipos].every(tipo => box.classList.contains(tipo));
   box.style.display = (matchesTier && matchesTipo) ? 'block' : 'none';
 });

}

tierButtons.forEach(button => {

 button.addEventListener('click', () => {
   const selectedTier = button.dataset.tier;
   if (selectedTier === activeTier || selectedTier === 'all') {
     activeTier = 'all';
     tierButtons.forEach(btn => btn.classList.remove('ativo'));
   } else {
     activeTier = selectedTier;
     tierButtons.forEach(btn => btn.classList.remove('ativo'));
     button.classList.add('ativo');
   }
   updateFiltros();
 });

});

tipoButtons.forEach(button => {

 button.addEventListener('click', () => {
   const selectedTipo = button.dataset.tipo;
   console.log(selectedTipo)
   if (selectedTipo === 'all') {
     activeTipos.clear();
     tipoButtons.forEach(btn => {if (btn.dataset.tipo === 'all') {btn.classList.add('ativo');} else {btn.classList.remove('ativo');}});
   } else {
     if (activeTipos.has(selectedTipo)) {
       activeTipos.delete(selectedTipo);
       button.classList.remove('ativo');
     } else {
       activeTipos.add(selectedTipo);
       button.classList.add('ativo');
     }
     tipoButtons.forEach(btn => {
       if (btn.dataset.tipo === 'all') btn.classList.remove('ativo');
     });
     if (activeTipos.size === 0) {
       tipoButtons.forEach(btn => {if (btn.dataset.tipo === 'all') {btn.classList.add('ativo');}});
     }
   }
   updateFiltros();
 });

});


   document.querySelectorAll('.personagem-box').forEach(box => {
     const classes = box.className.split(/\s+/);
     const icones = classes
       .filter(classe => iconesClasse.hasOwnProperty(classe))
       .map(classe => {
         const img = document.createElement('img');
         img.src = iconesClasse[classe];
         img.alt = classe;
         img.className = 'classe-icon';
         return img;
       });
     if (icones.length > 0) {
       const wrapper = document.createElement('div');
       wrapper.className = 'classe-icon-wrapper';
       icones.forEach(icon => wrapper.appendChild(icon));
       box.appendChild(wrapper);
     }
   });

document.querySelectorAll('[data-tooltip-img]').forEach(btn => {

 const imgUrl = btn.getAttribute('data-tooltip-img');
 if (imgUrl) {
   const tooltip = document.createElement('img');
   tooltip.src = imgUrl;
   tooltip.classList.add('tooltip-img');
   btn.style.position = 'relative'; // para posicionar o tooltip corretamente
   btn.appendChild(tooltip);
   btn.addEventListener('mouseenter', () => {
     tooltip.style.display = 'block';
   });
   btn.addEventListener('mouseleave', () => {
     tooltip.style.display = 'none';
   });
 }

});


 </script>

</body>

</html>


 <a href="#" onclick="goToLang('pt')" title="Português">
   <img src="https://upload.wikimedia.org/wikipedia/en/0/05/Flag_of_Brazil.svg" alt="Português" style="width: 40px; height: 28px; border-radius: 6px; border: 1px solid #ccc; transition: transform 0.2s ease; object-fit: cover;">
 </a>
 <a href="#" onclick="goToLang('en')" title="English">
   <img src="https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg" alt="English" style="width: 40px; height: 28px; border-radius: 6px; border: 1px solid #ccc; transition: transform 0.2s ease; object-fit: cover;">
 </a>
 <a href="#" onclick="goToLang('es')" title="Español">
   <img src="https://upload.wikimedia.org/wikipedia/en/9/9a/Flag_of_Spain.svg" alt="Español" style="width: 40px; height: 28px; border-radius: 6px; border: 1px solid #ccc; transition: transform 0.2s ease; object-fit: cover;">
 </a>
 <a href="#" onclick="goToLang('pl')" title="Polski">
   <img src="https://upload.wikimedia.org/wikipedia/en/1/12/Flag_of_Poland.svg" alt="Polski" style="width: 40px; height: 28px; border-radius: 6px; border: 1px solid #ccc; transition: transform 0.2s ease; object-fit: cover;">
 </a>

<script>

 // Mapeamento de URLs completas para versões traduzidas
 const pageMap = {
   'https://wiki.gla.com.br/index.php/Usu%C3%A1rio:Visno#': {
     en: 'https://www.youtube.com/watch?v=bAVk7T1Xiys',
     pt: 'https://wiki.gla.com.br/index.php/Usu%C3%A1rio:Visno#',
     es: 'https://www.youtube.com/watch?v=fake_es',
     pl: 'https://www.youtube.com/watch?v=fake_pl'
   }
   // Adicione outras URLs completas aqui
 };
 function goToLang(lang) {
   const currentUrl = window.location.href;
   const mapping = pageMap[currentUrl];
   if (mapping && mapping[lang]) {
     window.location.href = mapping[lang];
   } else {
     alert('Tradução não disponível para esta URL.');
   }
 }

</script>