Smiley differences between live preview and editor


(Pierre-Olivier Latour) #1

If you type :), it converts automatically to :smile: which is very neat. Could we get a few others that are common like like ;), :P, :/ and :(?

IMO this would help a number of people as the discoverability of the corresponding emojis is quite hard. E.g. I have no clue what is the emoji for :P.


(Jeff Atwood) #2

Those already work though :wink: :stuck_out_tongue: :confused: :frowning:


(Stephanie) #3

:confused: doesn’t trigger :confused: , though I’m not sure they’re really the same face.


(Pierre-Olivier Latour) #4

Doesn’t work for me: I enter :) and immediately I see a pop prompting to insert :smile: instead. Entering ;) or :/ or :-/ does nothing.


(Kane York) #5

Why are you putting the smilies in code blocks? They work if you don’t do that…


(Pierre-Olivier Latour) #6

I obviously don’t use code blocks, it’s just for illustration here :smile:

So interestingly, entering ;) from Mobile Safari does replace it with :wink: (no pop up menu shown) but that’s not the case using Chrome on OS X for me. I think that’s where the confusion is coming from.

Also when entering :) it doesn’t auto replace but shows a pop up menu instead with :wink: in it. This whole thing is confusing.


(Jeff Atwood) #7

:slight_smile: works fine for me here when I type :) – there is something odd about your Chrome. I am using Chrome stable 64-bit on Windows. Are you using any plugins?


(Jeff Atwood) #8

Anyway here’s the full list from emoji.js.erb. I just added the :/ mapping as requested, so that wasn’t there before.

// Also support default emotions
var translations = {
  ':)'   : 'smile',
  ':-)'  : 'smile',
  ':('   : 'frowning',
  ':-('  : 'frowning',
  ';)'   : 'wink',
  ';-)'  : 'wink',
  ':\'(' : 'cry',
  ':\'-(': 'cry',
  ':-\'(': 'cry',
  ':p'   : 'stuck_out_tongue',
  ':P'   : 'stuck_out_tongue',
  ':-P'  : 'stuck_out_tongue',
  ':O'   : 'open_mouth',
  ':-O'  : 'open_mouth',
  ':D'   : 'smiley',
  ':-D'  : 'smiley',
  ':|'   : 'expressionless',
  ':-|'  : 'expressionless',
  ':/'   : 'confused',  
  ";P"   : 'stuck_out_tongue_winking_eye',
  ";-P"  : 'stuck_out_tongue_winking_eye',
  ":$"   : 'blush',
  ":-$"  : 'blush'
};

(Pierre-Olivier Latour) #9

What does “work fine” mean here? In which cases is it supposed to auto replace vs showing the emoji pop up menu?


(Jeff Atwood) #10

Like I said, something is wrong with your browser – we can’t reproduce what you’re describing on Mac Chrome. Try in Firefox or another browser.


(Kane York) #11

Oh, are you trying to do it on mobile? Mobile is different - there is no live preview; you basically get just the left half of the composer without any buttons.

It’ll get replaced when you submit the post.


(Jeff Atwood) #12

:confused: now works :/

Sorry @swisspol are you on mobile? You didn’t say mobile in your first post. At all.


(Pierre-Olivier Latour) #13

I’m not on mobile, I’m on desktop, but I just replied to one post from my iPad, where I used the opportunity to also test smileys, therefore my comment above.

I also finally understood why the smiley behavior differs depending on the smiley: if you enter a smiley that starts with a : Discourse shows the emoji popup no matter what, then when you enter ), it shows only :slight_smile: in the popup. I was expecting this behavior to be the same for other emojis: if entering ;) for instance. It doesn’t happen presumably because ; doesn’t trigger the emoji popup. It’s a bit confusing.

compared to

And everything does work on my Chrome: again the confusion was coming from the fact I was entering ;) and then nothing happens in the editing area compared to :). It does do something in the preview area where :) magically becomes :slight_smile: but my eyes weren’t focused on it.

Anyway, these 2 behaviors are quite confusing IMO: entering :) becomes :smile: in the editing area while entering ;) remains as-is, but in both cases, the rendered HTML shows a smiley.


(Jeff Atwood) #14

No, it does not. When I type :) I get :) in the editing area not :smile: . You are somehow triggering tab-completion of the popup. I am pressing space to move forward in what I am typing.


(Pierre-Olivier Latour) #15

Ah you’re right! I was pressing [Return] without realizing it, just to get rid of the emoji popup. Didn’t know you could press [Space] to ignore it.