From 9a49fb9450bd0fae6c42b73b67bc66358352761b Mon Sep 17 00:00:00 2001
From: Nick O'Leary <nick.oleary@gmail.com>
Date: Thu, 29 Sep 2016 23:45:25 +0100
Subject: [PATCH] Add escape-to-clear to searchBox and other css fixes

---
 editor/js/ui/common/searchBox.js     | 10 +++++++++-
 editor/sass/ui/common/searchBox.scss | 13 +++++++------
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/editor/js/ui/common/searchBox.js b/editor/js/ui/common/searchBox.js
index a15b3ba92..792759dfd 100644
--- a/editor/js/ui/common/searchBox.js
+++ b/editor/js/ui/common/searchBox.js
@@ -37,7 +37,12 @@
             this.resultCount = $('<span>',{class:"red-ui-searchBox-resultCount hide"}).appendTo(this.uiContainer);
 
             this.element.val("");
-            this.element.on("keyup",function() {
+            this.element.on("keydown",function(evt) {
+                if (evt.keyCode === 27) {
+                    that.element.val("");
+                }
+            })
+            this.element.on("keyup",function(evt) {
                 that._change($(this).val());
             });
 
@@ -57,11 +62,14 @@
                 this.clearButton.show();
                 fireEvent = (val.length >= (this.options.minimumLength||0));
             }
+            var current = this.element.val();
+            fireEvent = fireEvent && current !== this.lastSent;
             if (fireEvent) {
                 if (!instant && this.options.delay > 0) {
                     clearTimeout(this.currentTimeout);
                     var that = this;
                     this.currentTimeout = setTimeout(function() {
+                        that.lastSent = that.element.val();
                         that._trigger("change");
                     },this.options.delay);
                 } else {
diff --git a/editor/sass/ui/common/searchBox.scss b/editor/sass/ui/common/searchBox.scss
index 733eb49f3..28bf0d0da 100644
--- a/editor/sass/ui/common/searchBox.scss
+++ b/editor/sass/ui/common/searchBox.scss
@@ -16,6 +16,7 @@
 
 
 .red-ui-searchBox-container {
+    position: relative;
     i {
         font-size: 10px;
         color: #666;
@@ -23,13 +24,13 @@
     i.fa-search {
         position: absolute;
         pointer-events: none;
-        left: 12px;
-        top: 12px;
+        left: 8px;
+        top: 9px;
     }
     i.fa-times {
         position: absolute;
-        right: 7px;
-        top: 12px;
+        right: 5px;
+        top: 9px;
     }
     input {
         border-radius: 0;
@@ -58,8 +59,8 @@
     }
     .red-ui-searchBox-resultCount {
         position: absolute;
-        right: 22px;
-        top: 7px;
+        right: 18px;
+        top: 4px;
         background: #eee;
         color: #666;
         padding: 1px 8px;