mirror of
https://github.com/node-red/node-red.git
synced 2025-03-01 10:36:34 +00:00
Merge pull request #3661 from Steve-Mcl/backport-3633
fix new folder menu of save to library dialog (backport #3633 to v2.x)
This commit is contained in:
Nick O'Leary
GitHub
@@ -363,106 +363,112 @@ RED.library = (function() {
|
||||
options.onconfirm(item);
|
||||
}
|
||||
});
|
||||
var itemTools = $("<div>").css({position: "absolute",bottom:"6px",right:"8px"});
|
||||
var menuButton = $('<button class="red-ui-button red-ui-button-small" type="button"><i class="fa fa-ellipsis-h"></i></button>')
|
||||
.on("click", function(evt) {
|
||||
evt.preventDefault();
|
||||
evt.stopPropagation();
|
||||
var elementPos = menuButton.offset();
|
||||
|
||||
var menuOptionMenu = RED.menu.init({id:"red-ui-library-browser-menu",
|
||||
options: [
|
||||
{id:"red-ui-library-browser-menu-addFolder",label:RED._("library.newFolder"), onselect: function() {
|
||||
var defaultFolderName = "new-folder";
|
||||
var defaultFolderNameMatches = {};
|
||||
|
||||
var selected = dirList.treeList('selected');
|
||||
if (!selected.children) {
|
||||
selected = selected.parent;
|
||||
}
|
||||
var complete = function() {
|
||||
selected.children.forEach(function(c) {
|
||||
if (/^new-folder/.test(c.label)) {
|
||||
defaultFolderNameMatches[c.label] = true
|
||||
}
|
||||
});
|
||||
var folderIndex = 2;
|
||||
while(defaultFolderNameMatches[defaultFolderName]) {
|
||||
defaultFolderName = "new-folder-"+(folderIndex++)
|
||||
}
|
||||
|
||||
selected.treeList.expand();
|
||||
var input = $('<input type="text" class="red-ui-treeList-input">').val(defaultFolderName);
|
||||
var newItem = {
|
||||
icon: "fa fa-folder-o",
|
||||
children:[],
|
||||
path: selected.path,
|
||||
element: input
|
||||
}
|
||||
var confirmAdd = function() {
|
||||
var val = input.val().trim();
|
||||
if (val === "") {
|
||||
cancelAdd();
|
||||
return;
|
||||
} else {
|
||||
for (var i=0;i<selected.children.length;i++) {
|
||||
if (selected.children[i].label === val) {
|
||||
cancelAdd();
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
newItem.treeList.remove();
|
||||
var finalItem = {
|
||||
library: selected.library,
|
||||
type: selected.type,
|
||||
icon: "fa fa-folder",
|
||||
children:[],
|
||||
label: val,
|
||||
path: newItem.path+val+"/"
|
||||
}
|
||||
selected.treeList.addChild(finalItem,true);
|
||||
}
|
||||
var cancelAdd = function() {
|
||||
newItem.treeList.remove();
|
||||
}
|
||||
input.on('keydown', function(evt) {
|
||||
evt.stopPropagation();
|
||||
if (evt.keyCode === 13) {
|
||||
confirmAdd();
|
||||
} else if (evt.keyCode === 27) {
|
||||
cancelAdd();
|
||||
}
|
||||
})
|
||||
input.on("blur", function() {
|
||||
confirmAdd();
|
||||
})
|
||||
selected.treeList.addChild(newItem);
|
||||
setTimeout(function() {
|
||||
input.trigger("focus");
|
||||
input.select();
|
||||
},400);
|
||||
}
|
||||
selected.treeList.expand(complete);
|
||||
|
||||
} },
|
||||
// null,
|
||||
// {id:"red-ui-library-browser-menu-rename",label:"Rename", onselect: function() {} },
|
||||
// {id:"red-ui-library-browser-menu-delete",label:"Delete", onselect: function() {} }
|
||||
]
|
||||
}).on('mouseleave', function(){ $(this).remove(); dirList.focus() })
|
||||
.on('mouseup', function() { var self = $(this);self.hide(); dirList.focus(); setTimeout(function() { self.remove() },100)})
|
||||
.appendTo("body");
|
||||
menuOptionMenu.css({
|
||||
position: "absolute",
|
||||
top: elementPos.top+"px",
|
||||
left: (elementPos.left - menuOptionMenu.width() + 20)+"px"
|
||||
}).show();
|
||||
|
||||
}).appendTo(itemTools);
|
||||
var itemTools = null;
|
||||
if (options.folderTools) {
|
||||
dirList.on('treelistselect', function(event, item) {
|
||||
if (item.writable !== false && item.treeList) {
|
||||
if (itemTools) {
|
||||
itemTools.remove();
|
||||
}
|
||||
itemTools = $("<div>").css({position: "absolute",bottom:"6px",right:"8px"});
|
||||
var menuButton = $('<button class="red-ui-button red-ui-button-small" type="button"><i class="fa fa-ellipsis-h"></i></button>')
|
||||
.on("click", function(evt) {
|
||||
evt.preventDefault();
|
||||
evt.stopPropagation();
|
||||
var elementPos = menuButton.offset();
|
||||
|
||||
var menuOptionMenu
|
||||
= RED.menu.init({id:"red-ui-library-browser-menu",
|
||||
options: [
|
||||
{id:"red-ui-library-browser-menu-addFolder",label:RED._("library.newFolder"), onselect: function() {
|
||||
var defaultFolderName = "new-folder";
|
||||
var defaultFolderNameMatches = {};
|
||||
|
||||
var selected = dirList.treeList('selected');
|
||||
if (!selected.children) {
|
||||
selected = selected.parent;
|
||||
}
|
||||
var complete = function() {
|
||||
selected.children.forEach(function(c) {
|
||||
if (/^new-folder/.test(c.label)) {
|
||||
defaultFolderNameMatches[c.label] = true
|
||||
}
|
||||
});
|
||||
var folderIndex = 2;
|
||||
while(defaultFolderNameMatches[defaultFolderName]) {
|
||||
defaultFolderName = "new-folder-"+(folderIndex++)
|
||||
}
|
||||
|
||||
selected.treeList.expand();
|
||||
var input = $('<input type="text" class="red-ui-treeList-input">').val(defaultFolderName);
|
||||
var newItem = {
|
||||
icon: "fa fa-folder-o",
|
||||
children:[],
|
||||
path: selected.path,
|
||||
element: input
|
||||
}
|
||||
var confirmAdd = function() {
|
||||
var val = input.val().trim();
|
||||
if (val === "") {
|
||||
cancelAdd();
|
||||
return;
|
||||
} else {
|
||||
for (var i=0;i<selected.children.length;i++) {
|
||||
if (selected.children[i].label === val) {
|
||||
cancelAdd();
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
newItem.treeList.remove();
|
||||
var finalItem = {
|
||||
library: selected.library,
|
||||
type: selected.type,
|
||||
icon: "fa fa-folder",
|
||||
children:[],
|
||||
label: val,
|
||||
path: newItem.path+val+"/"
|
||||
}
|
||||
selected.treeList.addChild(finalItem,true);
|
||||
}
|
||||
var cancelAdd = function() {
|
||||
newItem.treeList.remove();
|
||||
}
|
||||
input.on('keydown', function(evt) {
|
||||
evt.stopPropagation();
|
||||
if (evt.keyCode === 13) {
|
||||
confirmAdd();
|
||||
} else if (evt.keyCode === 27) {
|
||||
cancelAdd();
|
||||
}
|
||||
})
|
||||
input.on("blur", function() {
|
||||
confirmAdd();
|
||||
})
|
||||
selected.treeList.addChild(newItem);
|
||||
setTimeout(function() {
|
||||
input.trigger("focus");
|
||||
input.select();
|
||||
},400);
|
||||
}
|
||||
selected.treeList.expand(complete);
|
||||
|
||||
} },
|
||||
// null,
|
||||
// {id:"red-ui-library-browser-menu-rename",label:"Rename", onselect: function() {} },
|
||||
// {id:"red-ui-library-browser-menu-delete",label:"Delete", onselect: function() {} }
|
||||
]
|
||||
}).on('mouseleave', function(){ $(this).remove(); dirList.focus() })
|
||||
.on('mouseup', function() { var self = $(this);self.hide(); dirList.focus(); setTimeout(function() { self.remove() },100)})
|
||||
.appendTo("body");
|
||||
menuOptionMenu.css({
|
||||
position: "absolute",
|
||||
top: elementPos.top+"px",
|
||||
left: (elementPos.left - menuOptionMenu.width() + 20)+"px"
|
||||
}).show();
|
||||
|
||||
}).appendTo(itemTools);
|
||||
|
||||
itemTools.appendTo(item.treeList.label);
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user