Emoji selector and custom Emoji

Hey all, hey @zogstrip

one question here: The emoji toolbar button in the editor currently happily ignores the setting of “en-/disable emoji” in the site settings. I tried to fiddle with the emoji-toolbar.js file and would like to add something like

if (Discourse.SiteSettings.enable_emoji)
    window.PagedownCustom.appendButtons.push({
      id: 'wmd-emoji-button',
      description: I18n.t("composer.emoji"),
      execute: showSelector
    });

– but I fail since I can’t seem to access the Discourse object at this point in the code. Could you either give me a hint or even fix this? This is slightly annoying for my site which now has a smiley-implementation of its own - and even a emoji selector with exactly the same button… :wink:

2 Likes

I have a few problems with the current state of the emoji selector:

  • The emoji images don’t seem to be cached very long. I used it yesterday and it started to slowly load image after image. Today my browser started to download them again the first time I opened the selector popup. That’s annoying.
  • Why use pagination for the emojis? I thought Discourse is all about infinite scrolling and here I have to click those next/previous buttons. Why not use a simple scrollbar?

I’ve been looking at other products and how they implement such a feature. I like the way outlook.com is doing it.

What I like about it:

  • The first group (the star) shows a list of recently used emojis. That’s great!
  • After selecting a group there’s a heading that shows what I’ll find there (e.g. “People and faces”).
  • The emojis load instantly. No waiting time where I can slowly watch them loading. I guess that’s because they have only one image.
  • There’s a scrollbar!
  • It remembers the last selected group. When I open it again it shows me that group.
5 Likes

A few points here.

  • I do want to add the star tab, think it totally makes sense
  • Emoji caching is bust again @zogstrip, a few weeks ago I set expires to a year out, but it appears gone now and we no longer have any sane caching for emojis which is terrible.
  • Emoji sprites is a huge piece of work I would like to just avoid doing, long term HTTP 2.0 takes care of this anyway with SPDY so its a stop gap solution with plenty of drawbacks.
  • Totally agree with remembering last group (at least for session)
  • Don’t really like the idea of adding a heading, besides the annoyance with localizing I don’t see it as adding any value, you can tell what the grouping is about by looking at the images.
  • Pagination is there to minimize image downloads, if I put 200 pngs in a list it can quickly become a very slow process.
5 Likes

That’s now fixed :cat:

https://github.com/discourse/discourse/commit/8d03ff6f82291c459500a6ea6bab45a9e60cfed3

4 Likes

Thanks for reporting that. I just fixed it :sun_with_face:

https://github.com/discourse/discourse/commit/a115b4b7f07915cc5f18d1909b72a3184c004c9a

6 Likes

That’s now done :dragon:

https://github.com/discourse/discourse/commit/7bcecb54fd5bf2185849c870c286e0fde7de4c84

3 Likes

Inspired by iOS, it might be nice having a ‘last used’ or ‘most used’ section that is automatically created for each user as they use emoji and have that be the default category that they see when they open the selector. I also like Slack’s interface for emoji – very clean, quick.

edit: Ah, already doing that – oops – I searched ‘last’ instead of ‘recent’

The “last used” seems to be on the roadmap:

3 Likes

Any update on adding custom emoji that are larger than default emoji? Because I can think of a lot of uses for reservedword png’s…

Not even on the roadmap at the moment, custom size is a huge can of worms, especially on retina etc.

1 Like

Not sure if this a reproducible of if it is our particular instance: Two of the admins on my site have encountered a bug where after editing the custom emojis (specifically deleting them), the emoji selector button while posting no longer works. All we get is the screen fading out but the emoji selector pop up doesn’t appear. We have to clear our browser caches for it to work again. We are both on Chrome.

I’ve just updated our :discourse: instance. When i’ve added a new custom emoji and then i’ve refreshed the page, by some reason we have the same problem trying to open the emoji selector.

I’m using Firefox on Mac and the two users i manage are one admin and one mod.

Btw, this feature is very cool! Thanks.

Another question - mobile view doesn’t scale emoji like desktop view does, any pointers on bypassing it with .css for desktop view also?

Just pushed the “recently used” emoji tab :racehorse:

https://github.com/discourse/discourse/commit/69f95df2977b32a2b1ddb2ffd028d891c9a3a1af

4 Likes

Could you change the tab order and move the “recently used” tab to the first position? That would be great. I think it’s the most important one.

4 Likes