Avatar Animato

||||\n-|-|-|\n:information_source: | Riepilogo | Discourse Animated Avatars aggiunge la possibilità per gli utenti di caricare avatar gif che si animeranno al passaggio del mouse o alla selezione nei post, nelle schede utente e nelle pagine del profilo.\n:hammer_and_wrench: | Link al Repository | \u003chttps://github.com/discourse/discourse-animated-avatars\u003e\n:open_book: | Guida all’Installazione | Come installare plugin in Discourse\n\n### Funzionalità\n\nPer impostazione predefinita, l’animazione si interrompe quando non è a fuoco. All’interno degli argomenti, l’animazione si interromperà quando il post non è passato con il mouse o selezionato.\n\nanimated_avatars_always_animate: sovrascrive l’interruzione sopra, forza gli avatar ad animarsi sempre.\nanimated_avatars_min_trust_level_to_display limita l’animazione degli avatar per livello di fiducia.\n\nRispettare prefers-reduced-motion nelle opzioni di accessibilità del browser: le animazioni verranno disabilitate del tutto.\n \n### Configurazione\n \nQuesto plugin ha una dipendenza opzionale da gifsicle. Viene utilizzato per ridimensionare le immagini gif caricate per adattarle a un avatar quadrato, il che aiuta a gestire i rapporti d’aspetto e a normalizzare eventuali differenze tra le dimensioni delle immagini statiche e animate per uno scambio più fluido. Il plugin funzionerà comunque senza di esso, ma gli avatar non quadrati potrebbero apparire allungati quando mostrati.\n\nPer abilitare, aggiungerai una chiamata allo script di installazione nel tuo app.yml. Un esempio di come apparirà l’hook after_code è il seguente:\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### Impostazioni \n\n| Nome | Descrizione\n|-|-|\n| animated avatars min trust level to display | Livello di fiducia minimo per visualizzare un avatar animato\n| animated avatars always animate | Anima sempre gli avatar

22 Mi Piace

sei fantastico per questo, c’è un modo per far sì che l’animazione venga sempre riprodotta, indipendentemente dal focus?

3 Mi Piace

Solo un altro dubbio, per favore, come imposto il livello di fiducia di chi utilizzare il plugin?

1 Mi Piace

Non è stato implementato un limite per livello di fiducia, ma è utile sapere che è una funzionalità desiderata. Cercherò di trovare del tempo per lavorare presto su questa parte.

2 Mi Piace

Ho appena caricato due impostazioni del sito per le funzionalità richieste:

animated_avatars_always_animate
e il limite dell’animazione per livello di fiducia: animated_avatars_min_trust_level_to_display

4 Mi Piace

Grazie per l’opzione sempre animata. Avevo un paio di utenti che desideravano questa funzionalità

2 Mi Piace

Grazie mille per aver rilasciato questa opzione, ti sono molto grato e ne sono molto felice, sono persone come te che rendono il mondo migliore!

Quindi ho un dubbio, qual è la dimensione predefinita della GIF per non farla allungare? 50x50?

Qualsiasi dimensione quadrata tra 50px e 200px non dovrebbe essere allungata. Se si utilizza la dipendenza opzionale gifsicle, questa può ridimensionare le gif caricate per l’utente.

Mi scusi per la mia ignoranza, ma cos’è gifsicle?

gifsicle è un software per la manipolazione di immagini gif.

È dettagliato nella sezione di configurazione.

2 Mi Piace

Alcuni utenti segnalano che l’avatar viene restituito come .png nonostante il tipo di media sia gif.

Al momento sto solo cercando di capire se possa essere correlato al plugin/discourse/nginx o all’utente.

Ho già un caso d’uso in cui il problema era l’utente che accedeva alla propria macchina Windows tramite RDP, ma in un report specifico ho un utente con Windows 10 Versione 22H2 OS Build 19045.2728 e Chrome 111.0.5563.65 (64 bit), ma questo è ciò che viene restituito al browser:

Il file 108_2.png è un avatar.

Se controllo lo stesso argomento, posso vedere che ricevo la stessa immagine ma con estensione .gif e infatti per me si carica animata.

Tuttavia, cercando di raggiungere direttamente il file, vedo che esistono due versioni, sia una versione .png che una versione .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

Per qualche motivo, quell’utente non riceve la versione gif, ma corrisponde a tutte le impostazioni che ho configurato per il plugin:

1 Mi Piace

Ci sono due asset statici che vengono restituiti: png e gif. In modalità “anima sempre”, il PNG viene sostituito al caricamento del post tramite uno script con la versione gif.

Se l’utente sta visualizzando con JS bloccato, ciò potrebbe impedire l’animazione.

(Sono anche in grado di vedere l’animazione dalla mia parte)

2 Mi Piace

Ottima osservazione, gli chiederò se ha qualche ad blocker o qualcosa che potrebbe interferire con il JS del sito web.

1 Mi Piace

Sembra che le pagine utente siano ora interrotte con questo installato, una rapida occhiata restituisce il seguente stack trace:

Uncaught TypeError: r.default.compute non è una funzione
    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

Sfortunatamente non so quando ha iniziato a succedere.

Non ho ancora fatto alcun debug da solo, ma si sarebbe dovuto rompere tra questi due commit, dato che ho controllato il diff di Discourse prima di aggiornare ieri sera, e non era rotto prima di allora.

Ho anche problemi con il plugin Avatar Animato, dall’ultimo aggiornamento di ieri. Se il plugin è attivato, la pagina dei messaggi (/u/username/messages) non viene più caricata.

Failed to load resource: the server responded with a status of 429 (Too Many Requests)

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 o 3.1.0.beta7 l’ha risolto per me, grazie. :slight_smile:

Questo non sembra funzionare in Brave o Opera, anche se funziona in Firefox.

Sia Brave che Opera segnalano un’immagine .png e non cambiano in .gif.

Collegamento incrociato di un bug segnalato:

6 Mi Piace

Le pagine del profilo sono anche completamente rotte per me

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)

Potrebbe essere una soluzione?

2 Mi Piace