We can all indisputably agree on that the three best things on ๐ŸŒŽ are warm blankets, emojis, and Slack. And when I discovered that I could add my own custom emojis into Slack, it was arguably one of the ๐ŸŽ‰ ๐Ÿ˜ moments of my short-lived life (barely exceeding a close number two, when I discovered this warm blanket). So I built emojipacks, a command line interface, to bulk upload emojis into Slack. Let's take a ๐Ÿ‘€ at the code that accomplishes this โœจ๐ŸŒŸโœจ๐ŸŒŸ feat.

๐Ÿ‘ถ The Beginning

Shortly after I discovered the ability to add custom emojis in Slack, I was hooked like a ๐ŸŸ . I ๐Ÿฉ even remember taking a break until the first ๐Ÿ’ฏ emojis were added. But ๐Ÿšข emoji after emoji inevitably ate away at my entire day at work. Though I managed to enter a rhythm of ๐Ÿ”ฆ for emojis and then uploading them all at once, it still took a long โŒš๏ธ. I had to ๐Ÿšง off โŒ› ๏ธon my ๐Ÿ“… just so I was able to have uninterrupted time dedicated to uploading emojis. Not the most glamorous of jobs, but somebody had to do it ๐Ÿ™Œ ๐Ÿ’ช .

Knowing that Slack is active on Twitter (they even have a @SlackLovesTweets account that just RT's awesome tweets), I decided to ๐Ÿš€ this tweet:

Link to tweet.

They gave me a ๐Ÿ’ฌ, but with ๐Ÿ’ฉ ๐Ÿ˜ž ๐Ÿ“ฐ:

Link to tweet.

So they have a ๐Ÿ‘”๐Ÿ’ผ to ๐Ÿƒ and maybe there are way more important things on their product road map ๐Ÿ™Š. Maybe.

Fortunately for me, the Internet is made of a series of tubes, so there is definitely a way to hack together a solution to accomplish this.

๐Ÿ’ฅ Emoji Packs

A few, long ๐ŸŒ‘ ๐ŸŒ“ ๐ŸŒ• ๐ŸŒ— ๐ŸŒš of โœ‹ uploading one-off emojis pass. Until one ๐ŸŒž, I came across this awesome project on Hacker News and was reinspired to ๐Ÿ”จ๐Ÿ”ง something to bulk upload emojis.

Slackporter allows you to transfer emojis from one Slack account to another. Super neat. Plus the developer is responsive on Twitter (super nice guy, too)!

I decided to re-use these ๐Ÿ”‘ pieces: โœŠ the user login information, logging in, and submitting the emoji form. I also re-wrote it with Koa and generators. The result is emojipacks!

๐Ÿ”ฉ How this works

The script uses Cheerio for server-side HTML parsing and manipulation and Request to submit form requests.

The first step is to get to this ๐Ÿ’ป:

Then, the script grabs some ๐Ÿ‘ป form data, such as the sign in value, redirect path, and a unique session crumb. This ๐Ÿ”ฎ is used later to log into Slack.

With the form data, we can login to Slack:

Note that this won't ever load, since it is a static HTML file.

After doing so, we can go to the emoji upload page:

Here, we grab an upload crumb from an input field. We'll use this crumb when programmatically submitting the form submit request.

๐Ÿ” Debugging

To help me understand which HTML page the script was on, I ๐Ÿ“ the Cheerio-generated HTML to `'./test/<title>.html'` files. Then I could open it up and see where I ended up in the upload emoji flow.

For example, I would get the HTML on the server, parse it with Cheerio, then ๏ธ๐Ÿ’พ it to a ๐Ÿก ๐Ÿ“:

var res = yield request(load);
var $ = cheerio.load(res[0].body);
write($('title').text(), $.html());

The function `write` is defined as:

function(title, html) {
  var test = resolve(__dirname, '../test/' + title + '.html');
  fs.writeFileSync(test, html);
};

After ๐Ÿƒ the script, I can go into the `./test` directory, use this nifty dotfile command `server`* to spin up a local server in that directory, and check it out with my browser.

  ๐Ÿ‰ ๐Ÿ‰ ๐Ÿ‰  emojipacks-cli (master): cd test
  ๐Ÿ‰ ๐Ÿ‰ ๐Ÿ‰  test (master): server
Serving HTTP on 0.0.0.0 port 4000 ...
127.0.0.1 - - [25/Jul/2015 08:26:38] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [25/Jul/2015 08:26:40] "GET /Slack.html HTTP/1.1" 200 -

Then you can browse to see where the script was able to navigate.

*The super convenient `server` command is taken from my mate Anthony's dotfiles.

๐Ÿš€ Next

So there you have it. The only thing next is to make more emoji ๐Ÿ“ฆ๐ŸŽ and try to find the upper limit in the number of custom emojis you can have in Slack.

๐ŸŒŠ you doing today? If you would like to contribute, please suggest an emoji pack!

Source. Demo.