|||
-|-|-| | Zusammenfassung | Discourse Animated Avatars fügt die Möglichkeit hinzu, GIF-Avatare hochzuladen, die beim Hovern oder Auswählen in Beiträgen, Benutzerkarten und Profilseiten animiert werden. | Repository-Link | \u003chttps://github.com/discourse/discourse-animated-avatars\u003e | Installationsanleitung | So installieren Sie Plugins in Discourse
Funktionen
Standardmäßig wird die Animation pausiert, wenn sie nicht fokussiert ist. Innerhalb von Themen wird die Animation pausiert, wenn der Beitrag nicht gehovert oder ausgewählt ist.
animated_avatars_always_animate: überschreibt das obige Pausieren und erzwingt, dass Avatare immer animiert werden. animated_avatars_min_trust_level_to_display beschränkt die Animation von Avataren nach Vertrauensstufe.
Berücksichtigt prefers-reduced-motion in den Barrierefreiheitsoptionen des Browsers: Animationen werden vollständig deaktiviert.
Konfiguration
Dieses Plugin hat eine optionale Abhängigkeit von gifsicle. Dies wird verwendet, um hochgeladene GIF-Bilder auf einen quadratischen Avatar zuzuschneiden, was hilft, Seitenverhältnisse zu beherrschen und Unterschiede in der Größe zwischen statischen und animierten Bildern für einen reibungsloseren Wechsel zu normalisieren. Das Plugin funktioniert auch ohne, aber nicht-quadratische Avatare können gestreckt erscheinen, wenn sie angezeigt werden.
Um dies zu aktivieren, fügen Sie einen Aufruf zum Installationsskript in Ihrer app.yml hinzu. Ein Beispiel dafür, wie der after_code-Hook aussehen wird, ist der folgende:
Die Beschränkung nach Vertrauensstufe wurde nicht implementiert, aber es ist gut zu wissen, dass dies eine gewünschte Funktion ist. Ich werde versuchen, bald etwas Zeit zu finden, um an diesem Teil zu arbeiten.
Vielen Dank, dass Sie diese Option veröffentlicht haben. Ich bin Ihnen sehr dankbar und freue mich sehr darüber. Es sind Menschen wie Sie, die die Welt besser machen!
Ich habe also einen Zweifel: Was ist die Standardgröße des GIFs, damit es nicht verzerrt wird? 50x50?
Jede Quadratgröße zwischen 50px und 200px sollte nicht verzerrt werden. Wenn Sie die optionale gifsicle-Abhängigkeit verwenden, kann diese hochgeladene GIFs für Sie in der Größe ändern.
Einige Benutzer melden, dass der Avatar als .png zurückgegeben wird, obwohl der Medientyp gif ist.
Derzeit versuche ich nur zu verstehen, ob es sich um etwas handeln könnte, das mit dem Plugin/Discourse/nginx oder dem Benutzer zusammenhängt.
Ich hatte bereits einen Anwendungsfall, bei dem das Problem darin bestand, dass der Benutzer über RDP auf seine Windows-Maschine zugegriffen hat, aber in einem bestimmten Bericht habe ich einen Benutzer mit Windows 10 Version 22H2 OS Build 19045.2728 und Chrome 111.0.5563.65 (64bit), aber dies ist es, was an den Browser zurückgegeben wird:
Wenn ich dasselbe Thema überprüfe, sehe ich, dass ich dasselbe Bild mit der Erweiterung .gif erhalte und es tatsächlich für mich animiert geladen wird.
Wenn ich jedoch versuche, direkt auf die Datei zuzugreifen, sehe ich, dass zwei Versionen existieren, sowohl eine .png-Version als auch eine .gif-Version
Es gibt zwei statische Assets, die zurückgegeben werden – PNG und GIF. Im Modus „Immer animieren“ wird die PNG-Datei beim Laden des Beitrags per Skript durch die GIF-Version ersetzt.
Wenn der Benutzer mit blockiertem JavaScript anzeigt, kann dies die Animation verhindern.
(Ich kann die Animation auch von meiner Seite aus sehen)
Es scheint, dass Benutzerseiten mit dieser Installation jetzt defekt sind. Ein kurzer Blick zeigt den folgenden Stacktrace:
Uncaught TypeError: r.default.compute ist keine Funktion
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
Ich habe noch keine eigenen Debugging-Schritte unternommen, aber es muss zwischen diesen beiden Commits kaputtgegangen sein, da ich die Discourse-Änderungen vor dem gestrigen Abend-Update überprüft habe und es vorher nicht kaputt war.
Ich habe auch Probleme mit dem Animated Avatar Plugin – seit dem letzten Upgrade gestern. Wenn das Plugin aktiviert ist, wird die Nachrichten-Seite (/u/username/messages) nicht mehr geladen.
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)
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)