WoltLab Cloud Twemoji Selector 1.1.2

Einfacher Auswähler für Twemojis.

Twemoji selector for WoltLab Suite Core (3.0+) is a developer extension. Developers can simple add this plugin to there extension and trigger the selector.

Content

This package contains a Twemoji selector and a simple Twemoji parser. The parser converts native emojis to Twemojis.

Implementation

It is very easy to implement this extension. First add the following requiredpackage line to your package.xml.

XML: package.xml
<requiredpackage minversion="1.0.0">dev.hanashi.wsc.twemoji-selector</requiredpackage>

Twemoji Selector


Implement the following JavaScript Code into your template or JavaScript file:

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

Now add following in your Template:

Smarty
<twemoji-selector></twemoji-selector>

This is the default selector, where the Twemoji selector should be displayed. You can change this with the option selector.


You have the following options:

Option nameTypeRequireDefaultDescription
callbackfunctiontruenullSpecify a callback function, that is triggered, if a user clocks on an emoji. You receive an emoji object as parameter.
selectstringfalsetwemoji-selectorThis is the css selector where the Twemoji selector box should be displayed.
dataPathstringfalseWCF_PATH + 'js/Hanashi/Twemoji/twemoji.json'The data path to the twemoji json data file.
themestringfalseautoYou can select a theme for the selector.

auto: the selector has theme dark or light, depence on system setting of the user.
light: a simple light theme
dark: a simple dark theme

Twemoji Parser

The twemoji parser search in a selector for native emojis and replace that with a twemoji.


Implement the following JavaScript Code into your template or JavaScript file:

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


You have the following options:

Option nameTypeRequiredDefaultDescription
selectorstringtruenullThis option defines the selector, where emojis should be converted. Don't use elements, where JavaScript-Events are defined. The will not work after parsing.
dataPathstringfalseWCF_PATH + 'js/Hanashi/Twemoji/twemoji.json'The data path to the twemoji json data file.
sizeintegerfalse24This specify the size of generated image. Allowed sizes are: 18, 22, 24, 34 and 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