From afb956ae0095f743273212d2e5d3170e26a4698c Mon Sep 17 00:00:00 2001
From: Felix Niklas <mrflix@gmail.com>
Date: Tue, 22 Sep 2015 17:59:25 +0200
Subject: [PATCH] fix searchableSelect bugs

- bug with spaces suggestions
- pressing left and right key while typing complets the suggestion
---
 .../lib/app_post/searchable_select.js.coffee  | 29 +++++++++++++------
 app/assets/stylesheets/zammad.css.scss        |  5 ++--
 2 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/app/assets/javascripts/app/lib/app_post/searchable_select.js.coffee b/app/assets/javascripts/app/lib/app_post/searchable_select.js.coffee
index 4c0a70c47..1ac6b7bae 100644
--- a/app/assets/javascripts/app/lib/app_post/searchable_select.js.coffee
+++ b/app/assets/javascripts/app/lib/app_post/searchable_select.js.coffee
@@ -5,8 +5,8 @@ class App.SearchableSelect extends Spine.Controller
     'blur .js-input':                   'onBlur'
     'click .js-option':                 'selectItem'
     'mouseenter .js-option':            'highlightItem'
-    'shown.bs.dropdown':  'onDropdownShown'
-    'hidden.bs.dropdown': 'onDropdownHidden'
+    'shown.bs.dropdown':                'onDropdownShown'
+    'hidden.bs.dropdown':               'onDropdownHidden'
 
   elements:
     '.js-option': 'option_items'
@@ -59,7 +59,8 @@ class App.SearchableSelect extends Spine.Controller
     switch event.keyCode
       when 40 then @nudge event, 1 # down
       when 38 then @nudge event, -1 # up
-      when 39 then @pickSuggestion event # right
+      when 39 then @fillWithAutocompleteSuggestion event # right
+      when 37 then @fillWithAutocompleteSuggestion event # left
       when 13 then @onEnter event
       when 27 then @onEscape()
       when 9 then @onTab event
@@ -84,13 +85,23 @@ class App.SearchableSelect extends Spine.Controller
     visibleOptions.eq(currentPosition).addClass('is-active')
     @clearAutocomplete()
 
-  pickSuggestion: (event) ->
-    if not @suggestion
+  fillWithAutocompleteSuggestion: (event) ->
+    if !@suggestion
       return
 
+    if event.keyCode is 39 # right
+      # end position
+      caretPosition = @suggestion.length
+    else
+      # current position
+      caretPosition = @invisiblePart.text().length + 1
 
-    # check if the cursor is at the end of the text
-      # pick autocompleteSuggestion
+    @input.val @suggestion
+    @clearAutocomplete()
+    @toggle()
+
+    @input.prop('selectionStart', caretPosition)
+    @input.prop('selectionEnd', caretPosition)
 
   autocomplete: (text) ->
     @suggestion = text
@@ -135,7 +146,7 @@ class App.SearchableSelect extends Spine.Controller
     @toggle()
 
   onBlur: =>
-    @clearAutocomplete()
+    # @clearAutocomplete()
 
   onInput: (event) =>
     @toggle() if not @isOpen
@@ -157,7 +168,7 @@ class App.SearchableSelect extends Spine.Controller
   highlightFirst: ->
     first = @option_items.removeClass('is-active').not('.is-hidden').first()
     first.addClass 'is-active'
-    @autocomplete first.text()
+    @autocomplete first.text().trim()
 
   highlightItem: (event) =>
     @option_items.removeClass('is-active')
diff --git a/app/assets/stylesheets/zammad.css.scss b/app/assets/stylesheets/zammad.css.scss
index 390353969..67ede89c5 100644
--- a/app/assets/stylesheets/zammad.css.scss
+++ b/app/assets/stylesheets/zammad.css.scss
@@ -6098,12 +6098,13 @@ output {
   .searchableSelect-autocomplete {
     position: absolute;
     left: 13px;
-    top: 11px;
+    top: 10px;
     right: 37px;
     white-space: nowrap;
     overflow: hidden;
-    pointer-events: none;
     display: flex;
+    pointer-events: none;
+    white-space: pre;
   }
 
   .searchableSelect-autocomplete-invisible {