Avatar Animado

||||\n-|-|-|\n:information_source: | Resumo | Discourse Animated Avatars adiciona a capacidade para usuários fazerem upload de avatares gif que animarão ao passar o mouse ou selecionar em posts, cartões de usuário e páginas de perfil.\n:hammer_and_wrench: | Link do Repositório | \u003chttps://github.com/discourse/discourse-animated-avatars\u003e\n:open_book: | Guia de Instalação | Como instalar plugins no Discourse\n\n### Funcionalidades\n\nPor padrão, isso pausa a animação quando não está em foco. Dentro de tópicos, a animação pausará quando o post não estiver com o mouse sobre ele ou selecionado.\n\nanimated_avatars_always_animate: substitui a pausa acima, força os avatares a sempre animarem.\nanimated_avatars_min_trust_level_to_display restringe a animação de avatares por nível de confiança.\n\nRespeita prefers-reduced-motion nas opções de acessibilidade do navegador: Animações serão desativadas completamente.\n \n### Configuração\n \nEste plugin tem uma dependência opcional do gifsicle. Isso é usado para redimensionar imagens gif carregadas para caber em um avatar quadrado, o que ajuda a controlar as proporções, bem como normalizar quaisquer diferenças entre os tamanhos das imagens estáticas e animadas para uma troca mais suave. O plugin ainda funcionará sem ele, mas avatares não quadrados podem parecer esticados quando exibidos.\n\nPara habilitar, você adicionará uma chamada ao script de instalação em seu app.yml. Um exemplo do que o hook after_code parecerá é o seguinte:\n\n\nhooks:\n after_code:\n - exec:\n cd: $home/plugins\n cmd:\n - git clone https://github.com/discourse/discourse-animated-avatars.git\n - exec:\n cd: $home/plugins/discourse-animated-avatars\n raise_on_fail: false\n cmd:\n - $home/plugins/discourse-animated-avatars/scripts/install.sh\n\n \n### Configurações \n\n| Nome |\n| ----- | ----- |\n| animated avatars min trust level to display | Nível mínimo de confiança para exibir um avatar animado\n| animated avatars always animate | Sempre animar avatares

22 curtidas

você é incrível por isso, existe uma maneira para a animação tocar sempre, independentemente do foco?

3 curtidas

Só mais uma dúvida, fazendo um favor, como defino o nível de confiança de quem pode usar o plugin?

1 curtida

O limite por nível de confiança ainda não foi implementado, mas é bom saber que é um recurso desejado. Tentarei encontrar um tempo para trabalhar nesta parte em breve.

2 curtidas

Acabei de enviar duas configurações de site para os recursos solicitados:

animated_avatars_always_animate
e limitando a animação por nível de confiança: animated_avatars_min_trust_level_to_display

4 curtidas

Obrigado pela opção sempre animada. Eu tinha alguns usuários ansiosos pelo recurso

2 curtidas

Muito obrigado por lançar essa opção, sou muito grato e fico muito feliz por isso, são pessoas como vocês que tornam o mundo melhor!

Então tenho uma dúvida, qual o tamanho padrão do GIF para não ficar esticado? 50x50?

Qualquer tamanho de quadrado entre 50px e 200px não deve ser esticado. Se você usar a dependência opcional gifsicle, ela poderá redimensionar GIFs enviados para você.

Com licença pela minha falta de conhecimento, mas o que é gifsicle?

gifsicle é um software para manipular imagens gif.

Ele é detalhado na seção de configuração.

2 curtidas

Alguns usuários estão relatando que o avatar está sendo retornado como .png, apesar do tipo de mídia ser gif.

No momento, estou apenas tentando entender se isso pode estar relacionado ao plugin/discourse/nginx ou ao usuário.

Já tenho um caso de uso em que o problema era o usuário acessando sua máquina Windows via RDP, mas em um relatório específico, tenho um usuário com Windows 10 Versão 22H2 Build do SO 19045.2728 e Chrome 111.0.5563.65 (64 bits), mas é isso que está sendo retornado ao navegador:

O 108_2.png é um avatar.

Se eu verificar o mesmo tópico, posso ver que estou recebendo a mesma imagem, mas com a extensão .gif e, de fato, ela carrega animada para mim.

No entanto, tentar acessar o arquivo diretamente me mostra que existem duas versões, tanto uma versão .png quanto uma versão .gif

https://netgamers.it/user_avatar/netgamers.it/borzo/100/108_2.gif
https://netgamers.it/user_avatar/netgamers.it/borzo/100/108_2.png

Por algum motivo, esse usuário não está recebendo a versão gif, mas ele corresponde a todas as configurações que configurei para o plugin:

1 curtida

Existem dois ativos estáticos que são retornados — png e gif. No modo “animar sempre”, o PNG é trocado no carregamento da postagem por meio de um script pela versão gif.

Se o usuário estiver visualizando com JS bloqueado, isso pode impedir a animação.

(Eu também consigo ver a animação do meu lado)

2 curtidas

Boa observação, vou perguntar a ele se ele tem algum bloqueador de anúncios ou algo que possa interferir no JS do site.

1 curtida

Parece que as páginas de usuário estão quebradas com isso instalado, uma rápida olhada retorna o seguinte rastreamento de pilha:

Uncaught TypeError: r.default.compute is not a function
    n animated-bound-avatar.js:10
    htmlHelper helpers.js:30
    Ember 2
    l manager.js:746
    tag reference.js:136
    track validator.js:668
animated-bound-avatar.js:10

Infelizmente, não sei quando isso começou a acontecer.

Ainda não fiz nenhuma depuração por conta própria, mas teria que ter quebrado entre esses dois commits, pois verifiquei a diferença do Discourse antes de atualizar ontem à noite, e não estava quebrado antes disso.

Também estou tendo problemas com o Plugin Animated Avatar - desde a última atualização ontem. Se o plugin estiver ativado, a página de mensagens (/u/username/messages) não carrega mais.

Falha ao carregar recurso: o servidor respondeu com um status de 429 (Muitas Solicitações)

animated-bound-avatar.js:10 Uncaught TypeError: r.default.compute is not a function
    at animated-bound-avatar.js:10:1
    at helpers.js:30:1
    at index.js:4731:1
    at Object.getValue (index.js:4734:1)
    at manager.js:746:1
    at reference.js:136:1
    at e.track (validator.js:668:1)
    at f (reference.js:135:1)
    at Object.evaluate (runtime.js:3269:1)
    at Object.evaluate (runtime.js:1052:1)
    at It.evaluateSyscall (runtime.js:4263:1)
    at It.evaluateInner (runtime.js:4234:1)
    at It.evaluateOuter (runtime.js:4227:1)
    at Wt.next (runtime.js:5058:1)
    at Wt._execute (runtime.js:5045:1)
    at Wt.execute (runtime.js:5038:1)
    at zt.handleException (runtime.js:4372:1)
    at Ut.handleException (runtime.js:4580:1)
    at Ft.throw (runtime.js:4319:1)
    at $e.evaluate (runtime.js:2091:1)
    at Ft._execute (runtime.js:4306:1)
    at Ft.execute (runtime.js:4291:1)
    at Kt.rerender (runtime.js:4606:1)
    at wr.render (index.js:6751:1)
    at index.js:7013:1
    at Mt (runtime.js:4139:1)
    at Tr._renderRoots (index.js:6996:1)
    at Tr._renderRootsTransaction (index.js:7039:1)
    at Tr._revalidate (index.js:7072:1)
    at p.invoke (queue.ts:201:14)
    at p.flush (queue.ts:98:13)
    at h.flush (deferred-action-queues.ts:75:19)
    at $._end (index.ts:616:32)
    at $.end (index.ts:298:10)
    at $._run (index.ts:667:14)
    at $.run (index.ts:339:17)
    at d (index.js:109:1)
    at u.success (ajax.js:105:1)
    at l (jquery.js:3213:1)
    at Object.fireWith [as resolveWith] (jquery.js:3343:1)
    at E (jquery.js:9617:1)
    at XMLHttpRequest.<anonymous> (jquery.js:9878:1)

FIX: Call boundAvatar() directly (#17) · discourse/discourse-animated-avatars@f8ff4a7 · GitHub ou 3.1.0.beta7 corrigiu para mim, obrigado. :slight_smile:

Isso não parece estar funcionando no Brave ou no Opera, embora funcione no Firefox.

Brave e Opera estão relatando uma imagem .png e não mudando para .gif.

Vinculando um bug relatado:

6 curtidas

As páginas de perfil também estão totalmente quebradas para mim

Uncaught TypeError: Cannot destructure property 'hasBlock' of 'e' as it is undefined.
    at b.getConnectors (plugin-outlet.js:87:19)
    at B._join (index.ts:646:21)
    at B.join (index.ts:362:17)
    at p (index.js:156:1)
    at index.js:257:1
    at o.getValue (install-function-helper-manager.js:42:12)
    at manager.js:746:1
    at reference.js:131:1
    at e.track (validator.js:657:1)
    at d (reference.js:130:1)
    at runtime.js:1648:1
    at reference.js:131:1
    at e.track (validator.js:657:1)
    at d (reference.js:130:1)
    at index.js:5579:1
    at reference.js:131:1
    at e.track (validator.js:657:1)
    at d (reference.js:130:1)
    at index.js:5579:1
    at reference.js:131:1
    at e.track (validator.js:657:1)
    at d (reference.js:130:1)
    at reference.js:306:1
    at reference.js:131:1
    at e.track (validator.js:657:1)
    at d (reference.js:130:1)
    at Object.evaluate (runtime.js:3437:1)
    at Object.evaluate (runtime.js:1052:1)
    at It.evaluateSyscall (runtime.js:4258:1)
    at It.evaluateInner (runtime.js:4229:1)
    at It.evaluateOuter (runtime.js:4222:1)
    at Wt.next (runtime.js:5053:1)
    at Wt._execute (runtime.js:5040:1)
    at Wt.execute (runtime.js:5033:1)
    at $t.handleException (runtime.js:4367:1)
    at qt.handleException (runtime.js:4575:1)
    at Dt.throw (runtime.js:4314:1)
    at Be.evaluate (runtime.js:2088:1)
    at Dt._execute (runtime.js:4301:1)
    at Dt.execute (runtime.js:4286:1)
    at Ht.rerender (runtime.js:4601:1)
    at wr.render (index.js:6742:1)
    at index.js:7004:1
    at Mt (runtime.js:4134:1)
    at Cr._renderRoots (index.js:6987:1)
    at Cr._renderRootsTransaction (index.js:7030:1)
    at Cr._revalidate (index.js:7063:1)
    at p.invoke (queue.ts:201:14)
    at p.flush (queue.ts:98:13)
    at h.flush (deferred-action-queues.ts:75:19)
    at B._end (index.ts:616:32)
    at B.end (index.ts:298:10)
    at B._run (index.ts:667:14)
    at B.run (index.ts:339:17)
    at d (index.js:108:1)
    at t.success (ajax.js:115:7)
    at l (jquery.js:3213:1)
    at Object.fireWith [as resolveWith] (jquery.js:3343:1)
    at x (jquery.js:9617:1)
    at XMLHttpRequest.<anonymous> (jquery.js:9878:1)

Isso pode ser uma correção?

2 curtidas