Difference between revisions of "MediaWiki:Common.js"
Jump to navigation
Jump to search
Line 23: | Line 23: | ||
}); | }); | ||
− | // | + | /* Versão modificada apenas da função que trata as imagens */ |
− | + | function initImageCopy() { | |
− | + | $('.tile-top.tile-image a').each(function() { | |
− | + | var $link = $(this); | |
− | + | if (!$link.hasClass('warp-copy')) { | |
− | + | var npcId = $link.attr('href').replace('#',''); | |
− | + | $link.addClass('warp-copy') | |
− | + | .attr('data-copy', '@warp ' + npcId) | |
− | + | .css('cursor', 'pointer'); | |
− | + | } | |
− | + | }); | |
+ | |||
+ | // Solução híbrida para preservar animação dos GIFs em TODOS os casos | ||
+ | $('.tile-top.tile-image img').each(function() { | ||
+ | var $img = $(this); | ||
+ | var width = $img.data('width'); | ||
+ | var height = $img.data('height'); | ||
− | + | if (width || height) { | |
− | + | $img.addClass('custom-size'); | |
− | var $img | + | |
− | var | + | // Primeiro, verificamos se o GIF é menor que o tamanho desejado |
− | var | + | var originalWidth = $img[0].naturalWidth; |
+ | var originalHeight = $img[0].naturalHeight; | ||
+ | var needsEnlarge = (width && width > originalWidth) || (height && height > originalHeight); | ||
+ | var needsShrink = (width && width < originalWidth) || (height && height < originalHeight); | ||
− | if ( | + | if (needsEnlarge) { |
− | |||
− | + | // Para aumentar o tamanho, usamos CSS direto (funciona bem para aumento) | |
$img.css({ | $img.css({ | ||
− | 'width': '', | + | 'width': width ? width + 'px' : 'auto', |
− | 'height': '', | + | 'height': height ? height + 'px' : 'auto', |
− | 'max-width': '', | + | 'max-width': width ? width + 'px' : '100%', |
− | 'max-height': '' | + | 'max-height': height ? height + 'px' : 'none' |
}); | }); | ||
− | + | } | |
− | // | + | else if (needsShrink) { |
− | if ( | + | // Para diminuir o tamanho, usamos o container para preservar animação |
− | $img. | + | if (!$img.parent().hasClass('gif-container')) { |
− | + | $img.wrap('<div class="gif-container"></div>'); | |
− | + | var $container = $img.parent('.gif-container'); | |
− | $img. | + | |
− | + | // Aplicar estilos ao container | |
− | + | $container.css({ | |
− | + | 'display': 'flex', | |
− | + | 'justify-content': 'center', | |
− | $ | + | 'align-items': 'center', |
− | + | 'overflow': 'hidden', | |
− | + | 'width': width ? width + 'px' : 'auto', | |
− | + | 'height': height ? height + 'px' : 'auto' | |
− | $img.css(' | + | }); |
− | + | ||
+ | // O GIF mantém seu tamanho original (preservando a animação) | ||
+ | // mas é posicionado dentro do container com object-fit | ||
+ | $img.css({ | ||
+ | 'object-fit': 'cover', | ||
+ | 'width': '100%', | ||
+ | 'height': '100%', | ||
+ | 'max-width': 'none', | ||
+ | 'max-height': 'none' | ||
+ | }); | ||
} | } | ||
} | } | ||
− | }); | + | } |
− | + | }); | |
+ | } | ||
// Inicializar ao carregar e em atualizações de conteúdo | // Inicializar ao carregar e em atualizações de conteúdo |
Revision as of 13:13, 8 May 2025
/* Any JavaScript here will be loaded for all users on every page load. */ $(document).ready(function() { // Função única para cópia de texto $(document).on('click', '.warp-copy', function(e) { e.preventDefault(); var textToCopy = $(this).attr('data-copy'); // Cria elemento temporário para cópia var tempInput = document.createElement('textarea'); tempInput.value = textToCopy; document.body.appendChild(tempInput); tempInput.select(); document.execCommand('copy'); document.body.removeChild(tempInput); // Adiciona classe para feedback visual var $element = $(this); $element.addClass('copied'); setTimeout(function() { $element.removeClass('copied'); }, 2000); }); /* Versão modificada apenas da função que trata as imagens */ function initImageCopy() { $('.tile-top.tile-image a').each(function() { var $link = $(this); if (!$link.hasClass('warp-copy')) { var npcId = $link.attr('href').replace('#',''); $link.addClass('warp-copy') .attr('data-copy', '@warp ' + npcId) .css('cursor', 'pointer'); } }); // Solução híbrida para preservar animação dos GIFs em TODOS os casos $('.tile-top.tile-image img').each(function() { var $img = $(this); var width = $img.data('width'); var height = $img.data('height'); if (width || height) { $img.addClass('custom-size'); // Primeiro, verificamos se o GIF é menor que o tamanho desejado var originalWidth = $img[0].naturalWidth; var originalHeight = $img[0].naturalHeight; var needsEnlarge = (width && width > originalWidth) || (height && height > originalHeight); var needsShrink = (width && width < originalWidth) || (height && height < originalHeight); if (needsEnlarge) { // Para aumentar o tamanho, usamos CSS direto (funciona bem para aumento) $img.css({ 'width': width ? width + 'px' : 'auto', 'height': height ? height + 'px' : 'auto', 'max-width': width ? width + 'px' : '100%', 'max-height': height ? height + 'px' : 'none' }); } else if (needsShrink) { // Para diminuir o tamanho, usamos o container para preservar animação if (!$img.parent().hasClass('gif-container')) { $img.wrap('<div class="gif-container"></div>'); var $container = $img.parent('.gif-container'); // Aplicar estilos ao container $container.css({ 'display': 'flex', 'justify-content': 'center', 'align-items': 'center', 'overflow': 'hidden', 'width': width ? width + 'px' : 'auto', 'height': height ? height + 'px' : 'auto' }); // O GIF mantém seu tamanho original (preservando a animação) // mas é posicionado dentro do container com object-fit $img.css({ 'object-fit': 'cover', 'width': '100%', 'height': '100%', 'max-width': 'none', 'max-height': 'none' }); } } } }); } // Inicializar ao carregar e em atualizações de conteúdo initImageCopy(); if (typeof mw !== 'undefined' && mw.hook) { mw.hook('wikipage.content').add(initImageCopy); } /* Auto-expand sections when clicking anchored links */ console.log("Inicializando script para expandir seções com links âncora"); // Handle initial page load with hash if (window.location.hash) { console.log("Página carregada com hash: " + window.location.hash); setTimeout(function() { expandSectionForAnchor(window.location.hash); }, 300); } // Handle clicks on anchor links $(document).on('click', 'a[href^="#"]', function(event) { var hash = $(this).attr('href'); console.log("Clique em link âncora: " + hash); event.preventDefault(); if (history.pushState) { history.pushState(null, null, hash); } else { location.hash = hash; } expandSectionForAnchor(hash); }); function expandSectionForAnchor(hash) { console.log("Procurando e expandindo seção para âncora: " + hash); var targetElement = $(hash); if (targetElement.length) { console.log("Elemento alvo encontrado"); var collapsibleSections = targetElement.parents('.mw-collapsible.mw-collapsed'); var directCollapsible = targetElement.closest('.mw-collapsible.mw-collapsed'); if (directCollapsible.length) { collapsibleSections = collapsibleSections.add(directCollapsible); } console.log("Seções colapsáveis encontradas: " + collapsibleSections.length); if (collapsibleSections.length > 0) { collapsibleSections.each(function() { var section = $(this); console.log("Expandindo seção colapsável"); section.removeClass('mw-collapsed'); var toggleButton = section.find('.mw-collapsible-toggle').first(); if (toggleButton.length) { console.log("Clicando no botão de expansão"); toggleButton.click(); } if (section.hasClass('wikitable')) { console.log("Expandindo tabela wikitable"); section.find('tr:not(:first-child)').show(); } section.find('.mw-collapsible-content').show(); }); setTimeout(function() { scrollToTarget(targetElement); }, 400); } else { scrollToTarget(targetElement); } } else { console.log("Elemento alvo não encontrado para hash: " + hash); } } function scrollToTarget(element) { console.log("Rolando até o elemento alvo"); $('html, body').animate({ scrollTop: element.offset().top - 100 }, 200); } if (typeof mw !== 'undefined' && mw.hook) { mw.hook('wikipage.content').add(function() { console.log("Conteúdo da wiki atualizado"); if (window.location.hash) { setTimeout(function() { expandSectionForAnchor(window.location.hash); }, 300); } }); } });