Animierter Avatar

Anpassung Plugin
1
:information_source: Zusammenfassung Discourse Animated Avatars ermöglicht es Benutzern, animierte GIF-/WebP-Avatare hochzuladen, die beim Hovern oder Auswählen in Beiträgen, Benutzerkarten und Profilseiten animiert werden.
:hammer_and_wrench: Repository-Link https://github.com/discourse/discourse-animated-avatars
:open_book: Installationsanleitung So installierst du Plugins in Discourse

Funktionen

Standardmäßig wird die Animation pausiert, wenn der Fokus nicht auf dem Element liegt. Innerhalb von Themen wird die Animation pausiert, wenn der Beitrag nicht hovered 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 anhand des Vertrauensniveaus.

Beachtet die Einstellung „reduzierte Bewegung“ in den Barrierefreiheitsoptionen des Browsers: Animationen werden dabei vollständig deaktiviert.

Animierte GIFs werden beim Hochladen automatisch in WebP konvertiert, was die Gesamtdateigröße reduziert. Dies kann mit animated_gif_avatar_to_webp eingestellt werden (Standard: true).

Konfiguration

Dieses Plugin hat eine optionale Abhängigkeit von gifsicle. Dies wird verwendet, um hochgeladene GIF-Bilder so zu verkleinern, dass sie zu einem quadratischen Avatar passen. Dies hilft, Seitenverhältnisse zu normalisieren und Größenunterschiede zwischen den statischen und animierten Bildern auszugleichen, für einen sanfteren Wechsel. Das Plugin funktioniert auch ohne gifsicle, aber nicht-quadratische Avatare können bei der Darstellung verzerrt erscheinen.

:information_source: gifsicle wird für animated_gif_avatar_to_webp nicht benötigt. Animierte GIFs werden in WebP mit beschnittenen quadratischen Avataren konvertiert.

Um dies zu aktivieren, fügst du einen Aufruf des Installationsskripts in deiner app.yml hinzu. Ein Beispiel für den after_code-Hook sieht wie folgt aus:

hooks:
  after_code:
    - exec:
        cd: $home/plugins
        cmd:
          - git clone https://github.com/discourse/discourse-animated-avatars.git
    - exec:
        cd: $home/plugins/discourse-animated-avatars
        raise_on_fail: false
        cmd:
          - $home/plugins/discourse-animated-avatars/scripts/install.sh

Einstellungen

Name Beschreibung
animated avatars min trust level to display Mindestvertrauensniveau, um einen animierten Avatar anzuzeigen
animated avatars always animate Avatare immer animieren
animated gif avatar to webp Konvertiert animierte GIF-Avatare beim Hochladen automatisch in WebP und reduziert die Dateigröße. (Standard: true)
animated gif avatar webp quality Die Qualität der Konvertierung von GIF zu WebP. Empfohlene Einstellungen zwischen 75 % und 100 % (Standard: 80 %)

Technisches

Zusätzliche CLI-Befehle sind enthalten, um bei der Bestimmung der Anzahl von GIF-/WebP-Avataren und der Konvertierung bestehender GIF-Avatare in WebP zu helfen.

bin/rake animated_avatars:count_animated zahlt die Gesamtzahl der animierten Avatare, gruppiert nach GIF/WebP

bin/rake animated_avatars:gif_to_webp konvertiert bestehende animierte GIF-Avatare in WebP. Die neuen Avatare werden automatisch angewendet, und bestehende GIF-Avatare werden vom CleanUpUploads-Job entfernt.

22 „Gefällt mir“
Animated GIF avatars no longer supported by default
Animated GIF avatars, how enable?
Incompatibility between Cakeday,Data-Explorer and Animated Avatar plugins
Set Slow Mode return a 403 error - I am administrator
2

Du bist großartig dafür, gibt es eine Möglichkeit, die Animation immer abzuspielen, unabhängig vom Fokus?

3 „Gefällt mir“
10

Nur noch eine Frage, um Ihnen einen Gefallen zu tun: Wie lege ich die Vertrauensstufe für die Nutzung des Plugins fest?

1 „Gefällt mir“
11

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.

2 „Gefällt mir“
12

Ich habe gerade zwei Website-Einstellungen für die angeforderten Funktionen hochgeladen:

animated_avatars_always_animate
und die Begrenzung der Animation nach Vertrauensstufe: animated_avatars_min_trust_level_to_display

4 „Gefällt mir“
13

Vielen Dank für die stets lebendige Option. Ich hatte ein paar Benutzer, die sich nach der Funktion gesehnt haben

2 „Gefällt mir“
14

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?

15

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.

16

Entschuldigen Sie mein mangelndes Wissen, aber was ist gifsicle?

17

gifsicle ist eine Software zur Bearbeitung von GIF-Bildern.

Es ist im Konfigurationsabschnitt detailliert beschrieben.

2 „Gefällt mir“
18

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:

image
image305×285 11.1 KB

Die 108_2.png ist ein Avatar.

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

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

Aus irgendeinem Grund erhält dieser Benutzer nicht die gif-Version, aber er entspricht allen Einstellungen, die ich für das Plugin vorgenommen habe:

image
image1376×177 6.22 KB

1 „Gefällt mir“
19

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)

2 „Gefällt mir“
20

Gut bemerkt, ich werde ihn fragen, ob er einen Adblocker oder etwas anderes hat, das die JS der Website beeinträchtigen könnte.

1 „Gefällt mir“
21

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

Leider weiß ich nicht, wann das passiert ist.

The Missing Public Profiles Mystery [Animated Avatars]
22

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.

23

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)
24

FIX: Call boundAvatar() directly (#17) · discourse/discourse-animated-avatars@f8ff4a7 · GitHub oder 3.1.0.beta7 hat es für mich behoben, danke. :slight_smile:

25

Das scheint in Brave oder Opera nicht zu funktionieren, obwohl es in Firefox funktioniert.

Brave und Opera melden beide ein .png-Bild und ändern sich nicht zu .gif.

26

Verknüpfung eines gemeldeten Fehlers:

6 „Gefällt mir“
The Missing Public Profiles Mystery [Animated Avatars]
27

Profilseiten sind bei mir auch komplett kaputt

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)

Könnte das eine Lösung sein?

2 „Gefällt mir“