diff --git a/editor/js/ui/editableList.js b/editor/js/ui/editableList.js
index 3446c46ee..5b3c12125 100644
--- a/editor/js/ui/editableList.js
+++ b/editor/js/ui/editableList.js
@@ -85,6 +85,8 @@
this.uiHeight = this.element.height();
+ this.activeFilter = this.options.filter||null;
+
var minHeight = this.element.css("minHeight");
if (minHeight !== '0px') {
this.uiContainer.css("minHeight",minHeight);
@@ -155,6 +157,26 @@
},
_destroy: function() {
},
+ _refreshFilter: function() {
+ var that = this;
+ if (!this.activeFilter) {
+ this.element.children().show();
+ }
+ var items = this.items();
+ items.each(function (i,el) {
+ var data = el.data('data');
+ try {
+ if (that.activeFilter(data)) {
+ el.parent().show();
+ } else {
+ el.parent().hide();
+ }
+ } catch(err) {
+ console.log(err);
+ el.parent().show();
+ }
+ });
+ },
width: function(desiredWidth) {
this.uiWidth = desiredWidth;
this._resize();
@@ -207,6 +229,15 @@
var index = that.element.children().length-1;
setTimeout(function() {
that.options.addItem(row,index,data);
+ if (that.activeFilter) {
+ try {
+ if (!that.activeFilter(data)) {
+ li.hide();
+ }
+ } catch(err) {
+ }
+ }
+
if (!that.options.sort) {
setTimeout(function() {
that.uiContainer.scrollTop(that.element.height());
@@ -229,6 +260,12 @@
},
empty: function() {
this.element.empty();
+ },
+ filter: function(filter) {
+ if (filter !== undefined) {
+ this.activeFilter = filter;
+ }
+ this._refreshFilter();
}
});
})(jQuery);
diff --git a/editor/js/ui/palette-editor.js b/editor/js/ui/palette-editor.js
index fceb574c0..f2fc57a02 100644
--- a/editor/js/ui/palette-editor.js
+++ b/editor/js/ui/palette-editor.js
@@ -17,11 +17,11 @@ RED.palette.editor = (function() {
var nodeList;
var typesInUse = {};
-
var nodeEntries = {};
-
var eventTimers = {};
+ var activeFilter = "";
+
function delayCallback(start,callback) {
var delta = Date.now() - start;
if (delta < 300) {
@@ -96,6 +96,15 @@ RED.palette.editor = (function() {
function _refreshNodeModule(module) {
if (!nodeEntries.hasOwnProperty(module)) {
nodeEntries[module] = {info:RED.nodes.registry.getModule(module)};
+ var index = [module];
+ for (var s in nodeEntries[module].info.sets) {
+ if (nodeEntries[module].info.sets.hasOwnProperty(s)) {
+ index.push(s);
+ index = index.concat(nodeEntries[module].info.sets[s].types)
+ }
+ }
+ nodeEntries[module].index = index.join(",").toLowerCase();
+
nodeList.editableList('addItem', nodeEntries[module]);
//console.log(nodeList.editableList('items'));
@@ -188,6 +197,19 @@ RED.palette.editor = (function() {
$(el).find(".palette-module-content").slideUp();
$(el).removeClass('expanded');
});
+ $("#palette-editor-search input").val("");
+ filterChange("");
+ }
+
+ function filterChange(val) {
+ if (val === "") {
+ $("#palette-editor-search a").hide();
+ activeFilter = val;
+ } else {
+ $("#palette-editor-search a").show();
+ activeFilter = val.toLowerCase();
+ }
+ nodeList.editableList('filter');
}
function init() {
@@ -209,11 +231,39 @@ RED.palette.editor = (function() {
var divTabs = $('
',{style:"position:absolute;top:80px;left:0;right:0;bottom:0"}).appendTo("#palette-editor");
- nodeList = $('
',{id:"palette-module-list", style:"position: absolute;top: 0;bottom: 0;left: 0;right: 0px;"}).appendTo(divTabs).editableList({
+ var searchDiv = $('',{id:"palette-editor-search",class:"palette-search"}).appendTo(divTabs);
+ $('
').appendTo(searchDiv)
+
+ $("#palette-editor-search a").on("click",function(e) {
+ e.preventDefault();
+ $("#palette-editor-search input").val("");
+ filterChange("");
+ $("#palette-editor-search input").focus();
+ });
+
+ $("#palette-editor-search input").val("");
+ $("#palette-editor-search input").on("keyup",function() {
+ filterChange($(this).val());
+ });
+
+ $("#palette-editor-search input").on("focus",function() {
+ $("body").one("mousedown",function() {
+ $("#palette-editor-search input").blur();
+ });
+ });
+
+ nodeList = $('
',{id:"palette-module-list", style:"position: absolute;top: 35px;bottom: 0;left: 0;right: 0px;"}).appendTo(divTabs).editableList({
addButton: false,
sort: function(A,B) {
return A.info.name.localeCompare(B.info.name);
},
+ filter: function(data) {
+ if (activeFilter === "" ) {
+ return true;
+ }
+
+ return (activeFilter==="")||(data.index.indexOf(activeFilter) > -1);
+ },
addItem: function(container,i,object) {
var entry = object.info;
diff --git a/editor/js/ui/palette.js b/editor/js/ui/palette.js
index 86e9b8c45..645867fae 100644
--- a/editor/js/ui/palette.js
+++ b/editor/js/ui/palette.js
@@ -361,12 +361,11 @@ RED.palette = (function() {
});
}
- function filterChange() {
- var val = $("#palette-search-input").val();
+ function filterChange(val) {
if (val === "") {
- $("#palette-search-clear").hide();
+ $("#palette-search a").hide();
} else {
- $("#palette-search-clear").show();
+ $("#palette-search a").show();
}
var re = new RegExp(val.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'),'i');
@@ -447,21 +446,21 @@ RED.palette = (function() {
});
}
- $("#palette-search-clear").on("click",function(e) {
+ $("#palette-search a").on("click",function(e) {
e.preventDefault();
- $("#palette-search-input").val("");
- filterChange();
- $("#palette-search-input").focus();
+ $("#palette-search input").val("");
+ filterChange("");
+ $("#palette-search input").focus();
});
- $("#palette-search-input").val("");
- $("#palette-search-input").on("keyup",function() {
- filterChange();
+ $("#palette-search input").val("");
+ $("#palette-search input").on("keyup",function() {
+ filterChange($(this).val());
});
- $("#palette-search-input").on("focus",function() {
+ $("#palette-search input").on("focus",function() {
$("body").one("mousedown",function() {
- $("#palette-search-input").blur();
+ $("#palette-search input").blur();
});
});
diff --git a/editor/sass/palette.scss b/editor/sass/palette.scss
index bc4c8fde1..18ba0b59c 100644
--- a/editor/sass/palette.scss
+++ b/editor/sass/palette.scss
@@ -57,7 +57,7 @@
padding-top: 40px;
}
-#palette-search {
+.palette-search {
position: absolute;
top: 0;
left:0;
@@ -69,49 +69,49 @@
padding: 3px;
border-bottom: 1px solid $primary-border-color;
box-sizing:border-box;
-}
-#palette-search i {
- font-size: 10px;
- color: #666;
-}
-#palette-search i.fa-search {
- position: absolute;
- pointer-events: none;
- left: 12px;
- top: 12px;
-}
-#palette-search i.fa-times {
- position: absolute;
- right: 7px;
- top: 12px;
+ i {
+ font-size: 10px;
+ color: #666;
+ }
+ i.fa-search {
+ position: absolute;
+ pointer-events: none;
+ left: 12px;
+ top: 12px;
+ }
+ i.fa-times {
+ position: absolute;
+ right: 7px;
+ top: 12px;
+ }
+ input {
+ border-radius: 0;
+ border: none;
+ width: 100%;
+ box-shadow: none;
+ -webkit-box-shadow: none;
+ padding: 3px 17px 3px 22px;
+ margin: 0px;
+ height: 30px;
+ box-sizing:border-box;
+
+ &:focus {
+ border: none;
+ box-shadow: none;
+ -webkit-box-shadow: none;
+ }
+ }
+ .palette-search-clear {
+ position: absolute;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ width: 20px;
+ display: none;
+ }
}
-#palette-search-clear {
- position: absolute;
- right: 0;
- top: 0;
- bottom: 0;
- width: 20px;
- display: none;
-}
-#palette-search input {
- border-radius: 0;
- border: none;
- width: 100%;
- box-shadow: none;
- -webkit-box-shadow: none;
- padding: 3px 17px 3px 22px;
- margin: 0px;
- height: 30px;
- box-sizing:border-box;
-}
-
-#palette-search input:focus {
- border: none;
- box-shadow: none;
- -webkit-box-shadow: none;
-}
#palette-footer {
@include component-footer;
}
diff --git a/editor/templates/index.mst b/editor/templates/index.mst
index 239f68a6e..bd23b55e5 100644
--- a/editor/templates/index.mst
+++ b/editor/templates/index.mst
@@ -58,8 +58,8 @@
![](red/images/spin.svg)
-