WoltLab Cloud Twemoji Wähler 1.1.2

Einfacher Auswähler für Twemojis.

Twemoji selector für WoltLab Suite Core (3.0+) ist eine Erweiterung für Entwickler. Entwickler können dieses Plugin einfach hinzufügen und den Selector antriggern.

Inhalt

Dieses Paket enthält einen Twemoji Auswähler und einen simplen Twemoji parser. Der Parser konvertiert native Emojis zu Twemojis.

Implementation

Es ist sehr einfach das zu deinem Plugin hinzuzufügen. Zu erst füge folgende requiredpackage-Zeile zu deiner package.xml hinzu.


Code
<requiredpackage minversion="1.0.0">dev.hanashi.wsc.twemoji-selector</requiredpackage>

Twemoji Selector


Füge folgenden JavaScript-Code in deine Template oder deine JavaScript-Datei ein:

JavaScript
require(["Hanashi/Twemoji/Selector"], function(TwemojiSelector) {
var options = {
callback: function(emoji) {
console.log(emoji);
}
};
new TwemojiSelector(options);
});

Nun füge folgendes in dein Template hinzu:

Code
<twemoji-selector></twemoji-selector>

Das ist der Standard Selector, wo der Twemoji Selector hinzugefügt werden soll. Du kannst dies mit der Option selector überschreiben.


Folgende Optionen stehen zur Auswahl.:

Option nameTypeRequireDefaultDescription
callbackfunctiontruenullSpezifiziert die Callback-Funktion, welche getriggert wird, wenn eine Benutzer ein Emoji anklickt. Du erhältst ein Emoji-Objekt als Parameter zurück.
selectstringfalsetwemoji-selectorDas ist der CSS-Selector, welcher angibt, wo der Selector generiert werden soll.
dataPathstringfalseWCF_PATH + 'js/Hanashi/Twemoji/twemoji.json'Das ist der Datenpfad zu der Twemoji JSON Data-Datei.
themestringfalseautoDu kannst ein Theme für den Selector wählen.

auto: der Selector wird dunkel oder hell angezeigt, abhängig von den Systemeinstellungen des Benutzer.
light: ein simples helles Theme
dark: ein simples dunkles Theme

Twemoji Parser

Der Twemoji Parser sucht in einem Element nach nativen Emojis und ersetzt diese mit Twemojis.


Füge folgenden JavaScript-Code in dein Template oder dein JavaScript ein:

JavaScript
require(["Hanashi/Twemoji/Parser"], function(TwemojiParser) {
var options = {
selector: '#myDiv'
};
new TwemojiParser(options);
});


Du hast folgende Optionen zur Verfügung:

Option NameTypeRequiredDefaultDescription
selectorstringtruenullDiese Option gibt den Selector an. Benutzer keine Elemente, welche JavaScript-Events nutzen. Diese werden danach nicht mehr funktionieren.
dataPathstringfalseWCF_PATH + 'js/Hanashi/Twemoji/twemoji.json'Das ist der Datenpfad zu der Twemoji JSON Data-Datei.
sizeintegerfalse24Dies gibt die Größe der Twemojis an. Erlaubte Größen: 18, 22, 24, 34 und 66.
  • Version 1.1.2

    Pfad fix

  • Version 1.1.1

    • FIX: parsen von mehreren Emojis in einem HTML-Element
    • FIX: es wurde der komplette Browser gescrollt wenn eine Kategorie angeklickt wurde
    • FIX: Border-hover
  • Version 1.1.0

    • FIX: Bildauflösung auf Retina Displays
    • FIX: CORS
    • CHANGE: Reparse im Parser ist möglich via parse
  • Version 1.0.0

  • Wird es von dir auch ein Plugin geben was die Smileys durch diese dann ersetzt oder wolltest du einfach anderen Entwicklern die Möglichkeit dazu geben?

    Wäre ja irgendwie schade eine Basis für Entwickler zu schaffen, die vielleicht kein Entwickler nutzt.

    • Das Ersetzen der Smileys durch den Twemoji-Wähler ist von meiner Seite her nicht geplant. Gerne überlasse ich das anderen Entwicklern :)


      Allerdings habe ich das Plugin nicht ganz uneigennützig entwickelt. Ich werde es demnächst als Basis für ein anderes Plugin benötigen ;)

      Thanks 1
    • & letztendlich wurde es doch getan :D


      Haha 1
  • Wieso werden mir die Smileys gar nicht angezeigt nach der Installation?

    Haha 1