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

De Wiki Gla
Ir para navegação Ir para pesquisar
m
Etiqueta: Revertido
m (Limpou toda a página)
Etiquetas: Reversão manual anulando
 
(162 revisões intermediárias por 3 usuários não estão sendo mostradas)
Linha 1: Linha 1:
<!-- Widget:Teste — Thumb “fake” que mantém GIF animado
    Parâmetros esperados na inclusão:
      file  (obrigatório) ex: download.gif
      cap  (opcional)    legenda
      side  (opcional)    right | left | center (padrão: right)
      width (opcional)    largura em px; se omitido, usa o tamanho natural
      alt  (opcional)    texto alternativo
      link  (opcional)    page | media | none (padrão: page)
-->


<div class="widget-gifthumb thumb"
    data-file="{{file}}"
    data-cap="{{cap}}"
    data-side="{{side}}"
    data-width="{{width}}"
    data-alt="{{alt}}"
    data-link="{{link}}">
  <div class="thumbinner">
    <a class="thumblink"><img class="thumbimage" alt=""></a>
    <div class="thumbcaption"></div>
  </div>
</div>
<style>
/* —— estilos isolados do widget —— */
.widget-gifthumb { margin: .5em 0; }
.widget-gifthumb.tright { float: right; clear: right; margin-left: 1.4em; }
.widget-gifthumb.tleft  { float: left;  clear: left;  margin-right: 1.4em; }
.widget-gifthumb.tcenter{ float: none; display: table; margin: .5em auto; }
.widget-gifthumb .thumbinner {
  border: 1px solid #a2a9b1;
  background-color: #f8f9fa;
  padding: 3px;
  text-align: center;
  display: inline-block;
  max-width: 100%;
  box-sizing: content-box; /* largura = img + 2px de borda */
}
.widget-gifthumb .thumbimage {
  display: block;
  max-width: 100%;
  height: auto;
}
.widget-gifthumb .thumbcaption {
  margin-top: 3px;
  font-size: 88%;
  color: #202122;
  line-height: 1.3;
}
</style>
<script>
(function () {
  try {
    // pega o bloco do widget mesmo se houver <style> antes
    var prev = document.currentScript.previousElementSibling;
    if (prev && prev.tagName === 'STYLE') prev = prev.previousElementSibling;
    var root = prev && prev.classList.contains('widget-gifthumb') ? prev : null;
    if (!root) return;
    var inner = root.querySelector('.thumbinner');
    var a = root.querySelector('.thumblink');
    var img = root.querySelector('img.thumbimage');
    var capEl = root.querySelector('.thumbcaption');
    var file = (root.dataset.file || '').trim();
    var cap  = root.dataset.cap || '';
    var side = (root.dataset.side || 'right').toLowerCase();
    var width = parseInt(root.dataset.width, 10);
    var alt  = root.dataset.alt || '';
    var link = (root.dataset.link || 'page').toLowerCase();
    if (!file) return;
    var norm = file.replace(/ /g, '_');
    function urlFor(title) {
      if (window.mw && mw.util && mw.util.getUrl) return mw.util.getUrl(title);
      var path = (window.mw && mw.config) ? (mw.config.get('wgArticlePath') || '/wiki/$1') : '/wiki/$1';
      return path.replace('$1', encodeURIComponent(title));
    }
    // src do ARQUIVO ORIGINAL (mantém a animação!)
    var src = urlFor('Special:FilePath/' + norm);
    img.setAttribute('src', src);
    if (alt) img.setAttribute('alt', alt);
    // link (página do arquivo, media direto, ou nenhum)
    if (link === 'none' || link === 'no') {
      a.replaceWith(img);
    } else {
      var href = link === 'media' ? urlFor('Media:' + norm) : urlFor('File:' + norm);
      a.setAttribute('href', href);
    }
    // legenda
    if (cap) capEl.textContent = cap; else capEl.style.display = 'none';
    // alinhamento
    root.classList.remove('tleft','tright','tcenter');
    if (side === 'left') root.classList.add('tleft');
    else if (side === 'center') root.classList.add('tcenter');
    else root.classList.add('tright');
    // largura (somamos 2px da borda pra imitar o thumb)
    function fit() {
      if (!isNaN(width) && width > 0) {
        img.setAttribute('width', width);
        inner.style.width = (width + 2) + 'px';
      } else {
        var iw = img.getBoundingClientRect().width;
        if (iw > 0) inner.style.width = (Math.round(iw) + 2) + 'px';
      }
    }
    if (img.complete) fit(); else img.addEventListener('load', fit, { once: true });
    window.addEventListener('resize', fit);
  } catch (e) {}
})();
</script>

Edição atual tal como às 19h10min de 12 de setembro de 2025