At work we're unfortunately using Slack for group communication. I'm mostly communicating via Jabber and refused to install another chat client software - now I am utilizing the Slack XMPP interface.
Psi+ as chat client is working fine, but what annoyed me was my inability to see the emoticons my colleagues were sending. I only got :+1: and :simple_smile: instead of the smiley itself. It was time to change that.
Icon sets
Psi+ allows you to choose one or multiple sets of emoticons to use in Options -> Appearance -> Icons -> Emoticons. None of those supported the emojis used by Slack, so I had to create the set myself.
I found multiple image sources:
The emoji-cheat-sheet.com one had a github repository, which meant that I could access it easiest - so I chose it.
Psi+ icon set format
The Psi+ Ubuntu PPA contains the psi-plus-icons-nonfree package, which installs a number of .jisp files. Those files are application/zip files with a icon set definition file icondef.xml, and a number of .png image files that are referenced from icondef.xml. All those files are contained in a top-level folder that has the same basename as the .jisp file:
$ unzip -qql /usr/share/psi-plus/iconsets/emoticons/Emojis.jisp
0 2016-04-01 15:38 Emojis/
1390 2016-04-01 15:34 Emojis/0023-20e3.png
1265 2016-04-01 15:35 Emojis/0030-20e3.png
1284 2016-04-01 15:35 Emojis/0031-20e3.png
...
1361 2016-04-01 15:36 Emojis/303d.png
1575 2016-04-01 15:37 Emojis/3297.png
1631 2016-04-01 15:37 Emojis/3299.png
90442 2016-04-01 15:39 Emojis/icondef.xml
The XML file itself is easy to understand:
<?xml version="1.0" encoding="utf-8"?> <icondef> <meta> <name>Emojis</name> <version>1.1</version> <description>Unicode Emojis</description> <creation>2016-04-01</creation> <author /> </meta> <icon> <text default="true">☺</text> <text><U+E414></text> <text>:-$</text> <text>:$</text> <object mime="image/png">263a.png</object> </icon> <icon> <text default="true"><U+1F601></text> <text><U+E404></text> <object mime="image/png">1f601.png</object> </icon> ... </icondef>
The incoming text of chat messages is scanned for the text values in the configured emoji icon sets and replaced by the image.
The icons are also shown when pressing the emoji button in the chat window, and clicking on one icon inserts the text that has the default attribute.
Icon set creation
I did not want to write that icondef.xml myself. emoji-cheat-sheet's git repository contains a index.html file listing all images and the corresponding text, and I wanted to get XML from that.
What's the tool to convert XML to XML? XSLT .
index.html was HTML5 for no reason, so I had to pipe it through tidy (5.1.14 worked) to get clean XML. After that I could write my XSL script:
<?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:html="http://www.w3.org/1999/xhtml" > <xsl:output omit-xml-declaration="no" indent="yes" method="xml"/> <xsl:template match="/"> <icondef> <meta> <name>Emoji cheat sheet</name> <version>0.1</version> <description>from http://www.emoji-cheat-sheet.com/</description> <creation>2016-02-12</creation> <author email="cweiske+emojis@cweiske.de">cweiske</author> </meta> <xsl:for-each select="//html:ul//html:div[html:img and html:span]"> <icon> <text default="true">:<xsl:value-of select="html:span"/>:</text> <object mime="image/png"> <xsl:value-of select="substring(html:img/@src, 17)"/> </object> </icon> </xsl:for-each> </icondef> </xsl:template> </xsl:stylesheet>
I had to convert the icons to 16x16, since Psi does not scale them itself; when I used the 128x128 ones I had a normal text line and huge smileys..
In the end I executed that commands:
$ git clone https://github.com/arvida/emoji-cheat-sheet.com ecs $ tidy -f /dev/null -indent -asxml -o ecs-fixed.xml ecs/public/index.html $ mkdir emoji-cs $ cd ecs/public/graphics/emojis $ for i in *.png; do convert "$i" -resize 16x16 "../../../../emoji-cs/$i"; done $ cd ../../../../ $ xsltproc icondef-from-ecs.xsl ecs-fixed.xml > emoji-cs/icondef.xml $ zip emoji-cs.jisp emoji-cs/*
Installation
Copy the generated .jisp to /usr/share/psi-plus/iconsets/emoticons/ and restart Psi+. Then open the appearance options and activate your icon set.
