Merge branch 'issue_13301_emoji-menu' into 'master'

Load award emoji picker with ajax request

Fixes #13301.

See merge request !2888

app/assets/javascripts/awards_handler.coffee

@@ -1,10 +1,10 @@
 class @AwardsHandler
   constructor: (@post_emoji_url, @noteable_type, @noteable_id, @aliases) ->
-    $(".add-award").click (event)->
+    $(".add-award").click (event) =>
       event.stopPropagation()
       event.preventDefault()
-      $(".emoji-menu").show()
-      $("#emoji_search").focus()
+
+      @showEmojiMenu()
 
     $("html").on 'click', (event) ->
       if !$(event.target).closest(".emoji-menu").length
@@ -14,6 +14,16 @@ class @AwardsHandler
     @renderFrequentlyUsedBlock()
     @setupSearch()
 
+  showEmojiMenu: ->
+    if $(".emoji-menu").length
+      $(".emoji-menu").show()
+      $("#emoji_search").focus()
+    else
+      $.get "/emojis", (response) ->
+        $(".add-award").after response
+        $(".emoji-menu").show()
+        $("#emoji_search").focus()
+
   addAward: (emoji) ->
     emoji = @normilizeEmojiName(emoji)
     @postEmoji emoji, =>

app/controllers/emojis_controller.rb

@@ -0,0 +1,6 @@
+class EmojisController < ApplicationController
+  layout false
+
+  def index
+  end
+end

app/views/emojis/index.html.haml

@@ -0,0 +1,9 @@
+.emoji-menu
+  .emoji-menu-content
+    = text_field_tag :emoji_search, "", class: "emoji-search search-input form-control"
+    - AwardEmoji.emoji_by_category.each do |category, emojis|
+      %h5= AwardEmoji::CATEGORIES[category]
+      %ul
+        - emojis.each do |emoji|
+          %li
+            = emoji_icon(emoji["name"], emoji["unicode"], emoji["aliases"])

app/views/votes/_votes_block.html.haml

@@ -9,15 +9,6 @@
     .awards-controls
       %a.add-award{"href" => "#"}
         = icon('smile-o')
-      .emoji-menu
-        .emoji-menu-content
-          = text_field_tag :emoji_search, "", class: "emoji-search search-input form-control"
-          - AwardEmoji.emoji_by_category.each do |category, emojis|
-            %h5= AwardEmoji::CATEGORIES[category]
-            %ul
-              - emojis.each do |emoji|
-                %li
-                  = emoji_icon(emoji["name"], emoji["unicode"], emoji["aliases"])
 
 - if current_user
   :javascript

config/routes.rb

@@ -43,6 +43,8 @@ Rails.application.routes.draw do
   get '/autocomplete/users' => 'autocomplete#users'
   get '/autocomplete/users/:id' => 'autocomplete#user'
 
+  # Emojis
+  resources :emojis, only: :index
 
   # Search
   get 'search' => 'search#show'

features/steps/project/issues/award_emoji.rb

@@ -96,6 +96,7 @@ class Spinach::Features::AwardEmoji < Spinach::FeatureSteps
   end
 
   step 'The search field is focused' do
-    page.evaluate_script("document.activeElement.id").should eq "emoji_search"
+    expect(page).to have_selector('#emoji_search')
+    expect(page.evaluate_script('document.activeElement.id')).to eq('emoji_search')
   end
 end