Widget:Test2: mudanças entre as edições

De PokeXGames
Ir para navegação Ir para pesquisar
Sem resumo de edição
(Página substituída por ' <script> function generateWikiImageUrl(imageName) { return `https://wiki.pokexgames.com/index.php?title=Especial:Redirecionar/file&wpvalue=${imageName}`; } const imageList = { 'Squirtle': { imageUrl: generateWikiImageUrl('007-Squirtle.png'), variations: [ { description: 'Squirtle Purple Ninja Pack', descriptionIMG: generateWikiImageUrl('Purple_Stripe.png'),...')
Etiquetas: Substituído Reversão manual
 
(48 revisões intermediárias pelo mesmo usuário não estão sendo mostradas)
Linha 1: Linha 1:
<!DOCTYPE html>
<html lang="pt-BR">
<style>
        .input-group { margin-bottom: 1em; position: relative; }
        .dropdown {
            border: 1px solid #ccc;
            display: none;
            position: absolute;
            background-color: #fff;
            z-index: 1000;
            max-height: 150px;
            overflow-y: auto;
            width: 100%;
        }
        .dropdown-item {
            padding: 8px;
            cursor: pointer;
            display: flex;
            align-items: center;
        }
        .dropdown-item img {
            margin-right: 10px;
        }
        .dropdown-item:hover {
            background-color: #f0f0f0;
        }
        .image-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
        .image-item {
            margin-bottom: 1em;
            text-align: center;
        }
        .image-item img {
            display: block;
            margin: 0 auto;
        }


         .variations-container {
<script>
             display: flex;
         function generateWikiImageUrl(imageName) {
            flex-wrap: wrap;
             return `https://wiki.pokexgames.com/index.php?title=Especial:Redirecionar/file&wpvalue=${imageName}`;
            justify-content: center;
            margin-top: 1em;
         }
         }
 
        .variation-item {
const imageList = {
            width: 35%;
    'Squirtle': {
            box-sizing: border-box;
        imageUrl: generateWikiImageUrl('007-Squirtle.png'),
            margin: 5px;
        variations: [
             text-align: center;
             {
            border: 1px solid ;
                description: 'Squirtle Purple Ninja Pack',
            padding: 10px;
                descriptionIMG: generateWikiImageUrl('Purple_Stripe.png'),
        }
                obtain: {
 
                    url: 'https://wiki.pokexgames.com/index.php/Craft_Profissões_-_Estilista#Rank_E',
        .variation-item img {
                    text: 'Estilista',
            display: block;
                },
            margin: 0 auto 10px;
                customColor: 'Sim',
        }
                additionalImages: [
 
                    { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Frente.webp') }, // Frente
        .swap-button {
                    { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Esquerda.webp') }, // Lado Esquerdo
            margin-top: 10px;
                    { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Costas.webp') }, // Costas
            cursor: pointer;
                    { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Direita.webp') }, // Lado Direito
            width: 15px;
                ],
            height: 15px;
             },
            background: url('https://wiki.pokexgames.com/images/f/fb/SwapButtonAddons.png') no-repeat center;
        ],
            background-size: contain;
    },
             display: block;
'Snorlax': {
            margin: 0 auto;
     imageUrl: generateWikiImageUrl('143-Snorlax.png'),
        }
     variations: [
</style>
        {
 
            description: 'Snorlax Bear Cap',
<head>
            descriptionIMG: '<link addon>',
     <meta charset="UTF-8">
            obtain: {
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
                url: '<url de obtenção>',
     <title>Busca de Imagens por Nome</title>
                text: '<texto da url obtenção>',
 
             },
</head>
             customColor: 'Não',
<body>
            additionalImages: [
    <form id="imageForm">
                { url: generateWikiImageUrl('Snorlax_Bear Cap_Frente.webp')},
        <div class="input-group">
                { url: generateWikiImageUrl('Snorlax_Bear Cap_Direita.webp')},
             <input type="text" id="imageSearch" placeholder="Digite o nome da imagem" autocomplete="off">
                { url: generateWikiImageUrl('Snorlax_Bear Cap_Costas.webp')},
             <div id="dropdown" class="dropdown"></div>
                { url: generateWikiImageUrl('Snorlax_Bear Cap_Esquerda.webp')},
        </div>
            ]
 
        },
        <div id="imageContainer" class="image-container hidden">
         {
            <!-- As imagens e suas informações serão exibidas aqui -->
             description: 'Snorlax Chef Costume',
        </div>
            descriptionIMG: '<link addon>',
    </form>
            obtain: {
 
                url: '<url de obtenção>',
    <script>
                text: '<texto da url obtenção>',
         const imageList = {
            },
             'Squirtle': {
            customColor: 'Não',
                imageUrl: 'https://wiki.pokexgames.com/images/7/7a/007-Squirtle.png',  
            additionalImages: [
                variations: [
                { url: generateWikiImageUrl('Snorlax_Chef Costume_Frente.webp')},
                    {  
                { url: generateWikiImageUrl('Snorlax_Chef Costume_Direita.webp')},
                        description: 'Squirtle Purple Ninja Pacnk',
                { url: generateWikiImageUrl('Snorlax_Chef Costume_Costas.webp')},
                        descriptionIMG: 'https://wiki.pokexgames.com/images/c/c1/Purple_Stripe.png',
                { url: generateWikiImageUrl('Snorlax_Chef Costume_Esquerda.webp')},
                        obtain: {
            ]
                            url: 'https://wiki.pokexgames.com/index.php/Craft_Profissões_-_Estilista#Rank_E',
        },
                            text: 'Estilista'
        {
                        },
            description: 'Snorlax Mecha SLEEPING',
                        additionalImages: [
            descriptionIMG: '<link addon>',
                            { url: 'https://wiki.pokexgames.com/images/d/dd/Squirtle_Purple_Ninja_Pack_Frente.png'}, // Frente
            obtain: {
                            { url: 'https://wiki.pokexgames.com/images/5/50/Squirtle_Purple_Ninja_Pack_Esquerda.png'}, // Lado Esquerdo
                url: '<url de obtenção>',
                            { url: 'https://wiki.pokexgames.com/images/a/af/Squirtle_Purple_Ninja_Pack_Direita.png'}, // Costas
                text: '<texto da url obtenção>',
                            { url: 'https://wiki.pokexgames.com/images/5/5d/Squirtle_Purple_Ninja_Pack_Costas.png'}  // Lado Direito
            },
                        ]
            customColor: 'Não',  
                    },
            additionalImages: [
                    { 
                { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Frente.webp')},
                        description: 'Squirtle Red Ninja Pack',
                { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Direita.webp')},
                        descriptionIMG: 'https://wiki.pokexgames.com/images/c/c1/Purple_Stripe.png',
                { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Costas.webp')},
                        obtain: {
                { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Esquerda.webp')},
                            url: 'https://wiki.pokexgames.com/index.php/Craft_Profissões_-_Estilista#Rank_E',
            ]
                            text: 'Estilista'
        },
                        },
        {
                        additionalImages: [
            description: 'Snorlax Ninja Costume',
                            { url: 'https://wiki.pokexgames.com/images/1/13/Squirtle_Red_Ninja_Pack_Frente.png'}, // Frente
            descriptionIMG: '<link addon>',
                            { url: 'https://wiki.pokexgames.com/images/1/1e/Squirtle_Red_Ninja_Pack_Esquerda.png'}, // Lado Esquerdo
            obtain: {
                            { url: 'https://wiki.pokexgames.com/images/0/01/Squirtle_Red_Ninja_Pack_Costas.png'}, // Costas
                url: '<url de obtenção>',
                            { url: 'https://wiki.pokexgames.com/images/f/fd/Squirtle_Red_Ninja_Pack_Direita.png'} // Lado Direito
                text: '<texto da url obtenção>',
                        ]
            },
                    }
            customColor: 'Não',  
                 ]
            additionalImages: [
                { url: generateWikiImageUrl('Snorlax_Ninja Costume_Frente.webp')},
                { url: generateWikiImageUrl('Snorlax_Ninja Costume_Direita.webp')},
                { url: generateWikiImageUrl('Snorlax_Ninja Costume_Costas.webp')},
                { url: generateWikiImageUrl('Snorlax_Ninja Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Snorlax Obelix Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                 url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Snorlax_Obelix Costume_Frente.webp')},
                { url: generateWikiImageUrl('Snorlax_Obelix Costume_Direita.webp')},
                { url: generateWikiImageUrl('Snorlax_Obelix Costume_Costas.webp')},
                { url: generateWikiImageUrl('Snorlax_Obelix Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Snorlax Polar Bear Cap',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Frente.webp')},
                { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Direita.webp')},
                { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Costas.webp')},
                { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Esquerda.webp')},
            ]
        },
        {
            description: 'Snorlax Pumpkin Big Belly Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Frente.webp')},
                { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Direita.webp')},
                { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Costas.webp')},
                { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Snorlax Santa Claus Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Frente.webp')},
                { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Direita.webp')},
                { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Costas.webp')},
                { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Snorlax Sushiman Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Frente.webp')},
                { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Direita.webp')},
                { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Costas.webp')},
                { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Esquerda.webp')},
            ]
        },
    ]
},
'Pikachu': {
    imageUrl: generateWikiImageUrl('025-Pikachu.png'),
    variations: [
        {
            description: 'Ash Ketchum Cap',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Esquerda.webp')},
            ]
        },
        {
            description: 'Ashs Jacket',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Esquerda.webp')},
            ]
        },
        {
            description: 'Beach Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Beach Costume_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Beach Costume_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Beach Costume_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Beach Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Blue Scarf',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Blue Scarf_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Blue Scarf_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Blue Scarf_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Blue Scarf_Esquerda.webp')},
            ]
        },
        {
            description: 'Christmas Hat',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Christmas Hat_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Christmas Hat_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Christmas Hat_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Christmas Hat_Esquerda.webp')},
            ]
        },
        {
            description: 'Detective Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Detective Costume_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Detective Costume_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Detective Costume_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Detective Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Ghost Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Ghost Costume_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Ghost Costume_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Ghost Costume_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Ghost Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Green Scarf',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Green Scarf_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Green Scarf_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Green Scarf_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Green Scarf_Esquerda.webp')},
            ]
        },
        {
            description: 'Jester Hat',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Jester Hat_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Jester Hat_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Jester Hat_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Jester Hat_Esquerda.webp')},
            ]
        },
        {
            description: 'Little Charizard Costume',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Orange Scarf',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Orange Scarf_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Orange Scarf_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Orange Scarf_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Orange Scarf_Esquerda.webp')},
            ]
        },
        {
            description: 'Sparkies Comb',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Frente.webp')},
                { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Direita.webp')},
                { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Costas.webp')},
                { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Esquerda.webp')},
            ]
        },
    ]
},
'Shiny Ariados': {
    imageUrl: generateWikiImageUrl('Sh ariados.png'),
    variations: [
        {
            description: 'Cybernetic Armor',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            additionalImages: [
                { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Frente.png')},
                { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Direita.png')},
                { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Costas.png')},
                { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Esquerda.png')},
            ]
        },
        {
            description: 'Mecha LONG LEG',
            descriptionIMG: '<link addon>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não',
            additionalImages: [
                { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Frente.webp')},
                { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Direita.webp')},
                { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Costas.webp')},
                { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Esquerda.webp')},
            ]
        },
    ]
},
'Shiny Vileplume': {
    imageUrl: generateWikiImageUrl('Shinyvil.png'),
    variations: [
        {
            description: 'Christmas Hat',
            descriptionIMG: '<url da img>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não' ,
            additionalImages: [
                { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Frente.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Direita.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Costas.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Esquerda.webp')},
            ]
        },
        {
            description: 'Rastafari',
            descriptionIMG: '<url da img>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não' ,
            additionalImages: [
                { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Frente.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Direita.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Costas.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Esquerda.webp')},
            ]
        },
        {
            description: 'Sombrero',
            descriptionIMG: '<url da img>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não' ,
            additionalImages: [
                { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Frente.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Direita.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Costas.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Esquerda.webp')},
            ]
        },
        {
            description: 'Zombie Costume',
            descriptionIMG: '<url da img>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não' ,
            additionalImages: [
                { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Frente.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Direita.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Costas.webp')},
                { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Esquerda.webp')},
            ]
        },
        {
            description: 'Summer Costume',
            descriptionIMG: '<url da img>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
            },
            customColor: 'Não' ,
            additionalImages: [
                { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Frente.webp')},
                { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Direita.webp')},
                { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Costas.webp')},
                { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Esquerda.webp')},
            ]
        },
    ]
},
'FarfetchʼD': {
    imageUrl: generateWikiImageUrl('083-Farfetch-D.png'),
    variations: [
        {
            description: 'Pimp Hat',
            descriptionIMG: '<url da img>',
            obtain: {
                url: '<url de obtenção>',
                text: '<texto da url obtenção>',
             },
             },
        };
            customColor: 'Não' ,
 
             additionalImages: [
        const imageSearch = document.getElementById('imageSearch');
                 { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Frente.webp')},
        const dropdown = document.getElementById('dropdown');
                { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Direita.webp')},
        const imageContainer = document.getElementById('imageContainer');
                { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Costas.webp')},
 
                 { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Esquerda.webp')},
        imageSearch.addEventListener('input', function() {
             ]
             const searchValue = this.value.trim().toLowerCase();
         },
            dropdown.innerHTML = '';
     ]
 
},
            if (searchValue) {
                 Object.keys(imageList).forEach(imageName => {
                    if (imageName.toLowerCase().includes(searchValue)) {
                        const dropdownItem = document.createElement('div');
                        dropdownItem.classList.add('dropdown-item');
                       
                        const imgElement = document.createElement('img');
                        imgElement.src = imageList[imageName].imageUrl;
                        imgElement.alt = imageName;
                       
                        dropdownItem.appendChild(imgElement);
                        dropdownItem.appendChild(document.createTextNode(imageName));
                       
                        dropdownItem.addEventListener('click', function() {
                            showImageInfo(imageName);
                            dropdown.style.display = 'none';
                        });
                        dropdown.appendChild(dropdownItem);
                    }
                 });
 
                dropdown.style.display = dropdown.childNodes.length ? 'block' : 'none';
            } else {
                dropdown.style.display = 'none';
            }
        });
 
        document.addEventListener('click', function(event) {
             if (!imageSearch.contains(event.target) && !dropdown.contains(event.target)) {
                dropdown.style.display = 'none';
            }
         });
 
function showImageInfo(imageName) {
     const imageInfo = imageList[imageName];
    let imagesHtml =
        <div class="image-item">
            <img src="${imageInfo.imageUrl}" alt="${imageName}">
        </div>
        <div class="variations-container">
    ;
 
    imageInfo.variations.forEach((variation, index) => {
        imagesHtml +=
            <div class="variation-item">
                <img src="${variation.additionalImages[0].url}" alt="Variation Image" class="variation-image" data-variation-index="${index}" style="width: ${variation.additionalImages[0].width}px;">
                <div class="swap-button" data-variation-index="${index}"></div><br>
                <div class="image-info">
                    <img src="${variation.descriptionIMG}" alt="Description Image" style="margin-right: 5px; display: inline-block;"> <!-- Exibe a imagem antes da descrição -->
                    <br> ${variation.description} <br> <!-- Descrição após a imagem -->
                    <b>Como Obter</b>: <a href="${variation.obtain.url}" target="_blank">${variation.obtain.text}</a>
                </div>
            </div>
        ;
    });
 
    imagesHtml += '</div>';
 
    imageContainer.innerHTML = imagesHtml;
    imageContainer.classList.remove('hidden');
 
    // Alternar imagens ao clicar no botão de troca
    const swapButtons = document.querySelectorAll('.swap-button');


    swapButtons.forEach(button => {
        const index = button.getAttribute('data-variation-index');
        const variation = imageInfo.variations[index];
        let currentImageIndex = 0;


        button.addEventListener('click', () => {
};
            currentImageIndex = (currentImageIndex + 1) % variation.additionalImages.length;
            const variationImage = button.previousElementSibling; // Atualiza a imagem da variação
            variationImage.src = variation.additionalImages[currentImageIndex].url;
            variationImage.style.width = ${variation.additionalImages[currentImageIndex].width}px;
        });
    });
}


    </script>
</script>
</body>
</html>

Edição atual tal como às 00h26min de 30 de dezembro de 2024

<script>

       function generateWikiImageUrl(imageName) {
           return `https://wiki.pokexgames.com/index.php?title=Especial:Redirecionar/file&wpvalue=${imageName}`;
       }

const imageList = {
   'Squirtle': {
       imageUrl: generateWikiImageUrl('007-Squirtle.png'),
       variations: [
           {
               description: 'Squirtle Purple Ninja Pack',
               descriptionIMG: generateWikiImageUrl('Purple_Stripe.png'),
               obtain: {
                   url: 'https://wiki.pokexgames.com/index.php/Craft_Profissões_-_Estilista#Rank_E',
                   text: 'Estilista',
               },
               customColor: 'Sim',
               additionalImages: [
                   { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Frente.webp') }, // Frente
                   { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Esquerda.webp') }, // Lado Esquerdo
                   { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Costas.webp') }, // Costas
                   { url: generateWikiImageUrl('Squirtle_Purple_Ninja_Pack_Direita.webp') }, // Lado Direito
               ],
           },
       ],
   },

'Snorlax': {

   imageUrl: generateWikiImageUrl('143-Snorlax.png'),
   variations: [
       {
           description: 'Snorlax Bear Cap',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Bear Cap_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Bear Cap_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Bear Cap_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Bear Cap_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Chef Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Chef Costume_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Chef Costume_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Chef Costume_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Chef Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Mecha SLEEPING',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Mecha SLEEPING_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Ninja Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Ninja Costume_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Ninja Costume_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Ninja Costume_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Ninja Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Obelix Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Obelix Costume_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Obelix Costume_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Obelix Costume_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Obelix Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Polar Bear Cap',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Polar Bear Cap_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Pumpkin Big Belly Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Pumpkin Big Belly Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Santa Claus Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Santa Claus Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Snorlax Sushiman Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Frente.webp')},
               { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Direita.webp')},
               { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Costas.webp')},
               { url: generateWikiImageUrl('Snorlax_Sushiman Costume_Esquerda.webp')},
           ]
       },
   ]

}, 'Pikachu': {

   imageUrl: generateWikiImageUrl('025-Pikachu.png'),
   variations: [
       {
           description: 'Ash Ketchum Cap',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Ash Ketchum Cap_Esquerda.webp')},
           ]
       },
       {
           description: 'Ashs Jacket',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Ashs Jacket_Esquerda.webp')},
           ]
       },
       {
           description: 'Beach Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Beach Costume_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Beach Costume_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Beach Costume_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Beach Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Blue Scarf',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Blue Scarf_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Blue Scarf_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Blue Scarf_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Blue Scarf_Esquerda.webp')},
           ]
       },
       {
           description: 'Christmas Hat',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Christmas Hat_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Christmas Hat_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Christmas Hat_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Christmas Hat_Esquerda.webp')},
           ]
       },
       {
           description: 'Detective Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Detective Costume_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Detective Costume_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Detective Costume_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Detective Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Ghost Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Ghost Costume_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Ghost Costume_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Ghost Costume_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Ghost Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Green Scarf',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Green Scarf_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Green Scarf_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Green Scarf_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Green Scarf_Esquerda.webp')},
           ]
       },
       {
           description: 'Jester Hat',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Jester Hat_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Jester Hat_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Jester Hat_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Jester Hat_Esquerda.webp')},
           ]
       },
       {
           description: 'Little Charizard Costume',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Little Charizard Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Orange Scarf',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Orange Scarf_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Orange Scarf_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Orange Scarf_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Orange Scarf_Esquerda.webp')},
           ]
       },
       {
           description: 'Sparkies Comb',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Frente.webp')},
               { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Direita.webp')},
               { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Costas.webp')},
               { url: generateWikiImageUrl('Pikachu_Sparkies Comb_Esquerda.webp')},
           ]
       },
   ]

}, 'Shiny Ariados': {

   imageUrl: generateWikiImageUrl('Sh ariados.png'),
   variations: [
       {
           description: 'Cybernetic Armor',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           additionalImages: [
               { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Frente.png')},
               { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Direita.png')},
               { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Costas.png')},
               { url: generateWikiImageUrl('Shiny Ariados_Cybernetic Armor_Esquerda.png')},
           ]
       },
       {
           description: 'Mecha LONG LEG',
           descriptionIMG: '<link addon>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não', 
           additionalImages: [
               { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Frente.webp')},
               { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Direita.webp')},
               { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Costas.webp')},
               { url: generateWikiImageUrl('Shiny Ariados_Mecha LONG LEG_Esquerda.webp')},
           ]
       },
   ]

}, 'Shiny Vileplume': {

   imageUrl: generateWikiImageUrl('Shinyvil.png'),
   variations: [
       {
           description: 'Christmas Hat',
           descriptionIMG: '<url da img>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não' ,
           additionalImages: [
               { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Frente.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Direita.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Costas.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Christmas Hat_Esquerda.webp')},
           ]
       },
       {
           description: 'Rastafari',
           descriptionIMG: '<url da img>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não' ,
           additionalImages: [
               { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Frente.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Direita.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Costas.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Rastafari_Esquerda.webp')},
           ]
       },
       {
           description: 'Sombrero',
           descriptionIMG: '<url da img>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não' ,
           additionalImages: [
               { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Frente.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Direita.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Costas.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Sombrero_Esquerda.webp')},
           ]
       },
       {
           description: 'Zombie Costume',
           descriptionIMG: '<url da img>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não' ,
           additionalImages: [
               { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Frente.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Direita.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Costas.webp')},
               { url: generateWikiImageUrl('Shiny Vileplume_Zombie Costume_Esquerda.webp')},
           ]
       },
       {
           description: 'Summer Costume',
           descriptionIMG: '<url da img>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não' ,
           additionalImages: [
               { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Frente.webp')},
               { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Direita.webp')},
               { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Costas.webp')},
               { url: generateWikiImageUrl('Shiny_Vileplume_Summer Costume_Esquerda.webp')},
           ]
       },
   ]

}, 'FarfetchʼD': {

   imageUrl: generateWikiImageUrl('083-Farfetch-D.png'),
   variations: [
       {
           description: 'Pimp Hat',
           descriptionIMG: '<url da img>',
           obtain: {
               url: '<url de obtenção>',
               text: '<texto da url obtenção>',
           },
           customColor: 'Não' ,
           additionalImages: [
               { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Frente.webp')},
               { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Direita.webp')},
               { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Costas.webp')},
               { url: generateWikiImageUrl('FarfetchʼD_Pimp Hat_Esquerda.webp')},
           ]
       },
   ]

},


};

</script>