Merge pull request #2785 from node-red/library-plugins

Library plugins
This commit is contained in:
Nick O'Leary
2021-02-25 16:05:23 +00:00
committed by GitHub
22 changed files with 833 additions and 180 deletions

View File

@@ -26,7 +26,8 @@ RED.clipboard = (function() {
var currentPopoverError;
var activeTab;
var libraryBrowser;
var examplesBrowser;
var activeLibraries = {};
var pendingImportConfig;
@@ -93,7 +94,7 @@ RED.clipboard = (function() {
$( this ).dialog( "close" );
} else {
var flowToExport = $("#red-ui-clipboard-dialog-export-text").val();
var selectedPath = libraryBrowser.getSelected();
var selectedPath = activeLibraries[activeTab].getSelected();
if (!selectedPath.children) {
selectedPath = selectedPath.parent;
}
@@ -159,12 +160,7 @@ RED.clipboard = (function() {
if (activeTab === "red-ui-clipboard-dialog-import-tab-clipboard") {
importNodes($("#red-ui-clipboard-dialog-import-text").val(),addNewFlow);
} else {
var selectedPath;
if (activeTab === "red-ui-clipboard-dialog-import-tab-library") {
selectedPath = libraryBrowser.getSelected();
} else {
selectedPath = examplesBrowser.getSelected();
}
var selectedPath = activeLibraries[activeTab].getSelected();
if (selectedPath.path) {
$.get('library/'+selectedPath.library+'/'+selectedPath.type+'/'+selectedPath.path, function(data) {
importNodes(data,addNewFlow);
@@ -254,11 +250,8 @@ RED.clipboard = (function() {
'</div>'+
'</div>'+
'</div>'+
'<div id="red-ui-clipboard-dialog-export-tab-library" class="red-ui-clipboard-dialog-tab-library">'+
'<div id="red-ui-clipboard-dialog-export-tab-library-browser"></div>'+
'<div class="form-row">'+
'<label data-i18n="clipboard.export.exportAs"></label><input id="red-ui-clipboard-dialog-tab-library-name" type="text">'+
'</div>'+
'<div class="form-row" id="red-ui-clipboard-dialog-export-tab-library-filename">'+
'<label data-i18n="clipboard.export.exportAs"></label><input id="red-ui-clipboard-dialog-tab-library-name" type="text">'+
'</div>'+
'</div>'+
'</div>'
@@ -280,8 +273,6 @@ RED.clipboard = (function() {
'<textarea id="red-ui-clipboard-dialog-import-text"></textarea>'+
'</div>'+
'</div>'+
'<div id="red-ui-clipboard-dialog-import-tab-library" class="red-ui-clipboard-dialog-tab-library"></div>'+
'<div id="red-ui-clipboard-dialog-import-tab-examples" class="red-ui-clipboard-dialog-tab-library"></div>'+
'</div>'+
'</div>'+
'<div class="form-row">'+
@@ -414,7 +405,7 @@ RED.clipboard = (function() {
}
},100);
} else {
var file = libraryBrowser.getSelected();
var file = activeLibraries[activeTab].getSelected();
if (file && file.label && !file.children) {
$("#red-ui-clipboard-dialog-ok").button("enable");
} else {
@@ -446,7 +437,7 @@ RED.clipboard = (function() {
if (tab.id === "red-ui-clipboard-dialog-import-tab-clipboard") {
$("#red-ui-clipboard-dialog-import-text").trigger("focus");
} else {
libraryBrowser.focus();
activeLibraries[tab.id].focus();
}
validateImport();
}
@@ -455,54 +446,43 @@ RED.clipboard = (function() {
id: "red-ui-clipboard-dialog-import-tab-clipboard",
label: RED._("clipboard.clipboard")
});
tabs.addTab({
id: "red-ui-clipboard-dialog-import-tab-library",
label: RED._("library.library")
});
tabs.addTab({
id: "red-ui-clipboard-dialog-import-tab-examples",
label: RED._("library.types.examples")
});
var libraries = RED.settings.libraries || [];
libraries.forEach(function(lib) {
var tabId = "red-ui-clipboard-dialog-import-tab-library-"+lib.id
tabs.addTab({
id: tabId,
label: RED._(lib.label||lib.id)
})
var content = $('<div id="red-ui-clipboard-dialog-import-tab-library" class="red-ui-clipboard-dialog-tab-library"></div>')
.attr("id",tabId)
.hide()
.appendTo("#red-ui-clipboard-dialog-import-tabs-content");
var browser = RED.library.createBrowser({
container: content,
onselect: function(file) {
if (file && file.label && !file.children) {
$("#red-ui-clipboard-dialog-ok").button("enable");
} else {
$("#red-ui-clipboard-dialog-ok").button("disable");
}
},
onconfirm: function(item) {
if (item && item.label && !item.children) {
$("#red-ui-clipboard-dialog-ok").trigger("click");
}
}
})
loadFlowLibrary(browser,lib);
activeLibraries[tabId] = browser;
})
$("#red-ui-clipboard-dialog-tab-library-name").on("keyup", validateExportFilename);
$("#red-ui-clipboard-dialog-tab-library-name").on('paste',function() { setTimeout(validateExportFilename,10)});
$("#red-ui-clipboard-dialog-export").button("enable");
libraryBrowser = RED.library.createBrowser({
container: $("#red-ui-clipboard-dialog-import-tab-library"),
onselect: function(file) {
if (file && file.label && !file.children) {
$("#red-ui-clipboard-dialog-ok").button("enable");
} else {
$("#red-ui-clipboard-dialog-ok").button("disable");
}
},
onconfirm: function(item) {
if (item && item.label && !item.children) {
$("#red-ui-clipboard-dialog-ok").trigger("click");
}
}
})
loadFlowLibrary(libraryBrowser,"local",RED._("library.types.local"));
examplesBrowser = RED.library.createBrowser({
container: $("#red-ui-clipboard-dialog-import-tab-examples"),
onselect: function(file) {
if (file && file.label && !file.children) {
$("#red-ui-clipboard-dialog-ok").button("enable");
} else {
$("#red-ui-clipboard-dialog-ok").button("disable");
}
},
onconfirm: function(item) {
if (item && item.label && !item.children) {
$("#red-ui-clipboard-dialog-ok").trigger("click");
}
}
})
loadFlowLibrary(examplesBrowser,"_examples_",RED._("library.types.examples"));
dialogContainer.i18n();
$("#red-ui-clipboard-dialog-ok").show();
@@ -582,10 +562,12 @@ RED.clipboard = (function() {
if (tab.id === "red-ui-clipboard-dialog-export-tab-clipboard") {
$("#red-ui-clipboard-dialog-export").button("option","label", RED._("clipboard.export.copy"))
$("#red-ui-clipboard-dialog-download").show();
$("#red-ui-clipboard-dialog-export-tab-library-filename").hide();
} else {
$("#red-ui-clipboard-dialog-export").button("option","label", RED._("clipboard.export.export"))
$("#red-ui-clipboard-dialog-download").hide();
libraryBrowser.focus();
$("#red-ui-clipboard-dialog-export-tab-library-filename").show();
activeLibraries[activeTab].focus();
}
}
@@ -594,26 +576,45 @@ RED.clipboard = (function() {
id: "red-ui-clipboard-dialog-export-tab-clipboard",
label: RED._("clipboard.clipboard")
});
tabs.addTab({
id: "red-ui-clipboard-dialog-export-tab-library",
label: RED._("library.library")
});
var libraries = RED.settings.libraries || [];
libraries.forEach(function(lib) {
if (lib.readOnly) {
return
}
var tabId = "red-ui-clipboard-dialog-export-tab-library-"+lib.id
tabs.addTab({
id: tabId,
label: RED._(lib.label||lib.id)
})
var content = $('<div class="red-ui-clipboard-dialog-export-tab-library-browser red-ui-clipboard-dialog-tab-library"></div>')
.attr("id",tabId)
.hide()
.insertBefore("#red-ui-clipboard-dialog-export-tab-library-filename");
var browser = RED.library.createBrowser({
container: content,
folderTools: true,
onselect: function(file) {
if (file && file.label && !file.children) {
$("#red-ui-clipboard-dialog-tab-library-name").val(file.label);
}
},
})
loadFlowLibrary(browser,lib);
activeLibraries[tabId] = browser;
})
$("#red-ui-clipboard-dialog-tab-library-name").on("keyup", validateExportFilename);
$("#red-ui-clipboard-dialog-tab-library-name").on('paste',function() { setTimeout(validateExportFilename,10)});
$("#red-ui-clipboard-dialog-export").button("enable");
libraryBrowser = RED.library.createBrowser({
container: $("#red-ui-clipboard-dialog-export-tab-library-browser"),
folderTools: true,
onselect: function(file) {
if (file && file.label && !file.children) {
$("#red-ui-clipboard-dialog-tab-library-name").val(file.label);
}
}
})
loadFlowLibrary(libraryBrowser,"local",RED._("library.types.local"));
var clipboardTabs = RED.tabs.create({
id: "red-ui-clipboard-dialog-export-tab-clipboard-tabs",
onchange: function(tab) {
@@ -852,35 +853,33 @@ RED.clipboard = (function() {
$("#red-ui-clipboard-dialog-export-tab-clipboard-preview-list").treeList('data',treeData);
}
function loadFlowLibrary(browser,library,label) {
// if (includeExamples) {
// listing.push({
// library: "_examples_",
// type: "flows",
// icon: 'fa fa-hdd-o',
// label: RED._("library.types.examples"),
// path: "",
// children: function(done,item) {
// RED.library.loadLibraryFolder("_examples_","flows","",function(children) {
// item.children = children;
// done(children);
// })
// }
// })
// }
function loadFlowLibrary(browser,library) {
var icon = 'fa fa-hdd-o';
if (library.icon) {
var fullIcon = RED.utils.separateIconPath(library.icon);
icon = (fullIcon.module==="font-awesome"?"fa ":"")+fullIcon.file;
}
browser.data([{
library: library,
library: library.id,
type: "flows",
icon: 'fa fa-hdd-o',
label: label,
icon: icon,
label: RED._(library.label||library.id),
path: "",
expanded: true,
children: function(done, item) {
RED.library.loadLibraryFolder(library,"flows","",function(children) {
item.children = children;
done(children);
})
}
children: [{
library: library.id,
type: "flows",
icon: 'fa fa-cube',
label: "flows",
path: "",
expanded: true,
children: function(done, item) {
RED.library.loadLibraryFolder(library.id,"flows","",function(children) {
item.children = children;
done(children);
})
}
}]
}], true);
}

View File

@@ -216,31 +216,7 @@ RED.library = (function() {
{ id:'node-input-'+options.type+'-menu-open-library',
label: RED._("library.openLibrary"),
onselect: function() {
activeLibrary = options;
loadLibraryFolder("local",options.url, "", function(items) {
var listing = [{
library: "local",
type: options.url,
icon: 'fa fa-hdd-o',
label: RED._("library.types.local"),
path: "",
expanded: true,
writable: false,
children: [{
library: "local",
type: options.url,
icon: 'fa fa-cube',
label: options.type,
path: "",
expanded: true,
children: items
}]
}]
loadLibraryBrowser.data(listing);
setTimeout(function() {
loadLibraryBrowser.select(listing[0].children[0]);
},200);
});
libraryEditor = ace.edit('red-ui-library-dialog-load-preview-text',{
useWorker: false
});
@@ -256,6 +232,43 @@ RED.library = (function() {
libraryEditor.renderer.$cursorLayer.element.style.opacity=0;
libraryEditor.$blockScrolling = Infinity;
activeLibrary = options;
var listing = [];
var libraries = RED.settings.libraries || [];
libraries.forEach(function(lib) {
if (lib.types && lib.types.indexOf(options.url) === -1) {
return;
}
listing.push({
library: lib.id,
type: options.url,
icon: lib.icon || 'fa fa-hdd-o',
label: RED._(lib.label||lib.id),
path: "",
expanded: true,
writable: false,
children: [{
library: lib.id,
type: options.url,
icon: 'fa fa-cube',
label: options.type,
path: "",
expanded: false,
children: function(done, item) {
loadLibraryFolder(lib.id, options.url, "", function(children) {
item.children = children;
done(children);
})
}
}]
})
});
loadLibraryBrowser.data(listing);
setTimeout(function() {
loadLibraryBrowser.select(listing[0].children[0]);
},200);
var dialogHeight = 400;
var winHeight = $(window).height();
if (winHeight < 570) {
@@ -278,30 +291,40 @@ RED.library = (function() {
}
$("#red-ui-library-dialog-save-filename").attr("value",filename+"."+(options.ext||"txt"));
loadLibraryFolder("local",options.url, "", function(items) {
var listing = [{
library: "local",
var listing = [];
var libraries = RED.settings.libraries || [];
libraries.forEach(function(lib) {
if (lib.types && lib.types.indexOf(options.url) === -1) {
return;
}
listing.push({
library: lib.id,
type: options.url,
icon: 'fa fa-hdd-o',
label: RED._("library.types.local"),
icon: lib.icon || 'fa fa-hdd-o',
label: RED._(lib.label||lib.id),
path: "",
expanded: true,
writable: false,
children: [{
library: "local",
library: lib.id,
type: options.url,
icon: 'fa fa-cube',
label: options.type,
path: "",
expanded: true,
children: items
expanded: false,
children: function(done, item) {
loadLibraryFolder(lib.id, options.url, "", function(children) {
item.children = children;
done(children);
})
}
}]
}]
saveLibraryBrowser.data(listing);
setTimeout(function() {
saveLibraryBrowser.select(listing[0].children[0]);
},200);
})
});
saveLibraryBrowser.data(listing);
setTimeout(function() {
saveLibraryBrowser.select(listing[0].children[0]);
},200);
var dialogHeight = 400;
var winHeight = $(window).height();
@@ -460,9 +483,235 @@ RED.library = (function() {
}
}
// var libraryPlugins = {};
//
// function showLibraryDetailsDialog(container, lib, done) {
// var dialog = $('<div>').addClass("red-ui-projects-dialog-list-dialog").hide().appendTo(container);
// $('<div>').addClass("red-ui-projects-dialog-list-dialog-header").text(lib?"Edit library source":"Add library source").appendTo(dialog);
// var formRow = $('<div class="red-ui-settings-row"></div>').appendTo(dialog);
// $('<label>').text("Type").appendTo(formRow);
// var typeSelect = $('<select>').appendTo(formRow);
// for (var type in libraryPlugins) {
// if (libraryPlugins.hasOwnProperty(type)) {
// $('<option>').attr('value',type).attr('selected',(lib && lib.type === type)?true:null).text(libraryPlugins[type].name).appendTo(typeSelect);
// }
// }
// var dialogBody = $("<div>").addClass("red-ui-settings-section").appendTo(dialog);
// var libraryFields = {};
// var fieldsModified = {};
// function validateFields() {
// var validForm = true;
// for (var p in libraryFields) {
// if (libraryFields.hasOwnProperty(p)) {
// var v = libraryFields[p].input.val().trim();
// if (v === "") {
// validForm = false;
// if (libraryFields[p].modified) {
// libraryFields[p].input.addClass("input-error");
// }
// } else {
// libraryFields[p].input.removeClass("input-error");
// }
// }
// }
// okayButton.attr("disabled",validForm?null:"disabled");
// }
// typeSelect.on("change", function(evt) {
// dialogBody.empty();
// libraryFields = {};
// fieldsModified = {};
// var libDef = libraryPlugins[$(this).val()];
// var defaultIcon = lib?lib.icon:(libDef.icon || "font-awesome/fa-image");
// formRow = $('<div class="red-ui-settings-row"></div>').appendTo(dialogBody);
// $('<label>').text(RED._("editor.settingIcon")).appendTo(formRow);
// libraryFields['icon'] = {input: $('<input type="hidden">').val(defaultIcon) };
// var iconButton = $('<button type="button" class="red-ui-button"></button>').appendTo(formRow);
// iconButton.on("click", function(evt) {
// evt.preventDefault();
// var icon = libraryFields['icon'].input.val() || "";
// var iconPath = (icon ? RED.utils.separateIconPath(icon) : {});
// RED.editor.showIconPicker(iconButton, null, iconPath, true, function (newIcon) {
// iconButton.empty();
// var path = newIcon || "";
// var newPath = RED.utils.separateIconPath(path);
// if (newPath) {
// $('<i class="fa"></i>').addClass(newPath.file).appendTo(iconButton);
// }
// libraryFields['icon'].input.val(path);
// });
// })
// var newPath = RED.utils.separateIconPath(defaultIcon);
// $('<i class="fa '+newPath.file+'"></i>').appendTo(iconButton);
//
// var libProps = libDef.defaults;
// var libPropKeys = Object.keys(libProps).map(function(p) { return {id: p, def: libProps[p]}});
// libPropKeys.unshift({id: "label", def: {value:""}})
//
// libPropKeys.forEach(function(prop) {
// var p = prop.id;
// var def = prop.def;
// formRow = $('<div class="red-ui-settings-row"></div>').appendTo(dialogBody);
// var label = libDef._(def.label || "label."+p,{defaultValue: p});
// if (label === p) {
// label = libDef._("editor:common.label."+p,{defaultValue:p});
// }
// $('<label>').text(label).appendTo(formRow);
// libraryFields[p] = {
// input: $('<input type="text">').val(lib?(lib[p]||lib.config[p]):def.value).appendTo(formRow),
// modified: false
// }
// if (def.type === "password") {
// libraryFields[p].input.attr("type","password").typedInput({type:"cred"})
// }
//
// libraryFields[p].input.on("change paste keyup", function(evt) {
// if (!evt.key || evt.key.length === 1) {
// libraryFields[p].modified = true;
// }
// validateFields();
// })
// var desc = libDef._("desc."+p, {defaultValue: ""});
// if (desc) {
// $('<label class="red-ui-projects-edit-form-sublabel"></label>').append($('<small>').text(desc)).appendTo(formRow);
// }
// });
// validateFields();
// })
//
// var dialogButtons = $('<span class="button-row" style="position: relative; float: right; margin: 10px;"></span>').appendTo(dialog);
// var cancelButton = $('<button class="red-ui-button"></button>').text(RED._("common.label.cancel")).appendTo(dialogButtons).on("click", function(evt) {
// evt.preventDefault();
// done(false);
// })
// var okayButton = $('<button class="red-ui-button"></button>').text(lib?"Update library":"Add library").appendTo(dialogButtons).on("click", function(evt) {
// evt.preventDefault();
// var item;
// if (!lib) {
// item = {
// id: libraryFields['label'].input.val().trim().toLowerCase().replace(/( |[^a-z0-9])/g,"-"),
// user: true,
// type: typeSelect.val(),
// config: {}
// }
// } else {
// item = lib;
// }
//
// item.label = libraryFields['label'].input.val().trim();
// item.icon = libraryFields['icon'].input.val();
//
// for (var p in libraryFields) {
// if (libraryFields.hasOwnProperty(p) && p !== 'label') {
// item.config[p] = libraryFields[p].input.val().trim();
// }
// }
// done(item);
// });
//
// typeSelect.trigger("change");
// if (lib) {
// typeSelect.attr('disabled',true);
// }
//
// dialog.slideDown(200);
// }
//
// function createSettingsPane() {
// var pane = $('<div id="red-ui-settings-tab-library-manager"></div>');
// var toolbar = $('<div>').css("text-align","right").appendTo(pane);
// var addButton = $('<button class="red-ui-button"><i class="fa fa-plus"></i> Add library</button>').appendTo(toolbar);
//
// var addingLibrary = false;
//
// var libraryList = $("<ol>").css({
// position: "absolute",
// left: "10px",
// right: "10px",
// top: "50px",
// bottom: "10px"
// }).appendTo(pane).editableList({
// addButton: false,
// addItem: function(row,index,itemData) {
// if (itemData.id) {
// row.addClass("red-ui-settings-tab-library-entry");
// var iconCell = $("<span>").appendTo(row);
// if (itemData.icon) {
// var iconPath = RED.utils.separateIconPath(itemData.icon);
// if (iconPath) {
// $("<i>").addClass("fa "+iconPath.file).appendTo(iconCell);
// }
// }
// $("<span>").text(RED._(itemData.label)).appendTo(row);
// $("<span>").text(RED._(itemData.type)).appendTo(row);
// $('<button class="red-ui-button red-ui-button-small"></button>').text(RED._("sidebar.project.projectSettings.edit")).appendTo(
// $('<span>').appendTo(row)
// ).on("click", function(evt) {
// if (addingLibrary) {
// return;
// }
// evt.preventDefault();
// addingLibrary = true;
// row.empty();
// row.removeClass("red-ui-settings-tab-library-entry");
// showLibraryDetailsDialog(row,itemData,function(newItem) {
// var itemIndex = libraryList.editableList("indexOf", itemData);
// libraryList.editableList("removeItem", itemData);
// if (newItem) {
// libraryList.editableList("insertItemAt", newItem, itemIndex);
// } else {
// libraryList.editableList("insertItemAt", itemData,itemIndex);
// }
// addingLibrary = false;
//
// })
// })
//
// } else {
// showLibraryDetailsDialog(row,null,function(newItem) {
// libraryList.editableList("removeItem", itemData);
// if (newItem) {
// libraryList.editableList("addItem", newItem);
// }
// addingLibrary = false;
// })
//
// }
// }
// });
//
// addButton.on('click', function(evt) {
// evt.preventDefault();
// if (!addingLibrary) {
// addingLibrary = true;
// libraryList.editableList("addItem",{user:true});
// }
// })
// var libraries = RED.settings.libraries || [];
// libraries.forEach(function(library) {
// if (library.user) {
// libraryList.editableList("addItem",library)
// }
// })
//
// return pane;
// }
//
//
return {
init: function() {
// RED.events.on("registry:plugin-added", function(id) {
// var plugin = RED.plugins.getPlugin(id);
// if (plugin.type === "node-red-library-source") {
// libraryPlugins[id] = plugin;
// }
// });
//
// RED.userSettings.add({
// id:'library-manager',
// title: "NLS: Libraries",
// get: createSettingsPane,
// close: function() {}
// });
$(_librarySave).appendTo("#red-ui-editor").i18n();
$(_libraryLookup).appendTo("#red-ui-editor").i18n();

View File

@@ -93,10 +93,9 @@
border:1px solid $primary-border-color;
}
.red-ui-clipboard-dialog-tab-library {
.form-row {
margin-left: 10px;
}
#red-ui-clipboard-dialog-export-tab-library-filename {
height: auto !important;
margin-left: 10px;
}
#red-ui-clipboard-dialog {
@@ -110,7 +109,7 @@
#red-ui-clipboard-dialog-tab-library-name {
width: calc(100% - 120px);
}
#red-ui-clipboard-dialog-export-tab-library-browser {
.red-ui-clipboard-dialog-tabs-content>div.red-ui-clipboard-dialog-export-tab-library-browser {
height: calc(100% - 60px);
margin-bottom: 13px;
border-bottom: 1px solid $primary-border-color;
@@ -232,4 +231,42 @@
padding: 0;
margin: 0;
}
}
#red-ui-settings-tab-library-manager {
box-sizing: border-box;
padding: 10px;
position: relative;
height: 100%;
li {
padding: 0;
}
}
.red-ui-settings-tab-library-entry {
display: flex;
flex-direction: row;
span:not(:nth-child(2)) {
@include disable-selection;
}
span {
padding: 8px 0;
}
span:first-child {
display: inline-block;
width: 20px;
padding-right: 8px;
text-align: center;
flex-grow: 0;
}
span:nth-child(2) {
flex-grow: 1;
}
span:nth-child(3), span:nth-child(4) {
flex-grow: 0;
padding-right: 5px;
color: $secondary-text-color;
font-size: 0.9em;
}
}

View File

@@ -807,6 +807,7 @@ div.red-ui-projects-dialog-ssh-public-key {
border: 1px solid $secondary-border-color;
.red-ui-projects-edit-form-sublabel {
margin-top: -8px !important;
margin-right: 50px;
display: block !important;
width: auto !important;
}