frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 11:36:53 +00:00
Code Issues Releases Wiki Activity

Add escape-to-clear to searchBox and other css fixes

Browse Source
This commit is contained in:
Nick O'Leary 2016-09-29 23:45:25 +01:00
parent 84457bc7b4
commit 9a49fb9450
2 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
editor/js/ui/common/searchBox.js
View File

@ -37,7 +37,12 @@
this.resultCount = $('<span>',{class:"red-ui-searchBox-resultCount hide"}).appendTo(this.uiContainer); this.resultCount = $('<span>',{class:"red-ui-searchBox-resultCount hide"}).appendTo(this.uiContainer);
this.element.val(""); 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()); that._change($(this).val());
}); });
@ -57,11 +62,14 @@
this.clearButton.show(); this.clearButton.show();
fireEvent = (val.length >= (this.options.minimumLength||0)); fireEvent = (val.length >= (this.options.minimumLength||0));
} }
var current = this.element.val();
fireEvent = fireEvent && current !== this.lastSent;
if (fireEvent) { if (fireEvent) {
if (!instant && this.options.delay > 0) { if (!instant && this.options.delay > 0) {
clearTimeout(this.currentTimeout); clearTimeout(this.currentTimeout);
var that = this; var that = this;
this.currentTimeout = setTimeout(function() { this.currentTimeout = setTimeout(function() {
that.lastSent = that.element.val();
that._trigger("change"); that._trigger("change");
},this.options.delay); },this.options.delay);
} else { } else {

13
editor/sass/ui/common/searchBox.scss
View File

@ -16,6 +16,7 @@
.red-ui-searchBox-container { .red-ui-searchBox-container {
position: relative;
i { i {
font-size: 10px; font-size: 10px;
color: #666; color: #666;
@ -23,13 +24,13 @@
i.fa-search { i.fa-search {
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
left: 12px; left: 8px;
top: 12px; top: 9px;
} }
i.fa-times { i.fa-times {
position: absolute; position: absolute;
right: 7px; right: 5px;
top: 12px; top: 9px;
} }
input { input {
border-radius: 0; border-radius: 0;
@ -58,8 +59,8 @@
} }
.red-ui-searchBox-resultCount { .red-ui-searchBox-resultCount {
position: absolute; position: absolute;
right: 22px; right: 18px;
top: 7px; top: 4px;
background: #eee; background: #eee;
color: #666; color: #666;
padding: 1px 8px; padding: 1px 8px;