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

Merge pull request #2158 from node-red/statusbar

Browse Source 
⚠️ Standardise CSS class names through-out the editor
This commit is contained in:
Nick O'Leary 2019-05-17 10:43:48 +01:00 committed by GitHub
commit 5bb2bc7077
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
110 changed files with 5917 additions and 10915 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
Gruntfile.js
View File

@ -150,6 +150,7 @@ module.exports = function(grunt) {
"packages/node_modules/@node-red/editor-client/src/js/ui/diff.js",
"packages/node_modules/@node-red/editor-client/src/js/ui/keyboard.js",
"packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js",
"packages/node_modules/@node-red/editor-client/src/js/ui/statusBar.js",
"packages/node_modules/@node-red/editor-client/src/js/ui/view.js",
"packages/node_modules/@node-red/editor-client/src/js/ui/view-navigator.js",
"packages/node_modules/@node-red/editor-client/src/js/ui/view-tools.js",
@ -183,21 +184,20 @@ module.exports = function(grunt) {
"packages/node_modules/@node-red/editor-client/public/vendor/vendor.js": [
"packages/node_modules/@node-red/editor-client/src/vendor/jquery/js/jquery-3.3.1.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/jquery/js/jquery-migrate-3.0.1.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/bootstrap/js/bootstrap.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/jquery/js/jquery-ui.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/jquery/js/jquery.ui.touch-punch.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/marked/marked.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/d3/d3.v3.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/i18next/i18next.min.js"
],
"packages/node_modules/@node-red/editor-client/public/vendor/vendor.css": [
// TODO: resolve relative resource paths in
// bootstrap/FA/jquery
],
"packages/node_modules/@node-red/editor-client/public/vendor/jsonata/jsonata.min.js": [
"packages/node_modules/@node-red/editor-client/src/vendor/i18next/i18next.min.js",
"node_modules/jsonata/jsonata-es5.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/jsonata/formatter.js"
"packages/node_modules/@node-red/editor-client/src/vendor/jsonata/formatter.js",
"packages/node_modules/@node-red/editor-client/src/vendor/ace/ace.js",
"packages/node_modules/@node-red/editor-client/src/vendor/ace/ext-language_tools.js",
],
// "packages/node_modules/@node-red/editor-client/public/vendor/vendor.css": [
// // TODO: resolve relative resource paths in
// // bootstrap/FA/jquery
// ],
"packages/node_modules/@node-red/editor-client/public/vendor/ace/worker-jsonata.js": [
"node_modules/jsonata/jsonata-es5.min.js",
"packages/node_modules/@node-red/editor-client/src/vendor/jsonata/worker-jsonata.js"
@ -223,10 +223,6 @@ module.exports = function(grunt) {
files: [{
dest: 'packages/node_modules/@node-red/editor-client/public/red/style.min.css',
src: 'packages/node_modules/@node-red/editor-client/src/sass/style.scss'
},
{
dest: 'packages/node_modules/@node-red/editor-client/public/vendor/bootstrap/css/bootstrap.min.css',
src: 'packages/node_modules/@node-red/editor-client/src/vendor/bootstrap/css/bootstrap.css'
}]
}
},
@ -353,8 +349,6 @@ module.exports = function(grunt) {
cwd: 'packages/node_modules/@node-red/editor-client/src/vendor',
src: [
'ace/**',
//'bootstrap/css/**',
'bootstrap/img/**',
'jquery/css/base/**',
'font-awesome/**'
],

3
packages/node_modules/@node-red/editor-api/lib/editor/theme.js vendored
View File

@ -169,6 +169,9 @@ module.exports = {
}
}
}
themeApp.get("/", function(req,res) {
res.json(themeContext);
})
if (theme.hasOwnProperty("menu")) {
themeSettings.menu = theme.menu;

3
packages/node_modules/@node-red/editor-client/locales/en-US/editor.json vendored
View File

@ -321,7 +321,8 @@
"show": "Show",
"hide": "Hide",
"errors": {
"scopeChange": "Changing the scope will make it unavailable to nodes in other flows that use it"
"scopeChange": "Changing the scope will make it unavailable to nodes in other flows that use it",
"invalidProperties": "Invalid properties:"
}
},
"keyboard": {

4
packages/node_modules/@node-red/editor-client/src/js/keymap.json vendored
View File

@ -23,13 +23,13 @@
"ctrl-g v": "core:show-version-control-tab",
"ctrl-shift-l": "core:show-event-log"
},
"sidebar-node-config": {
"red-ui-sidebar-node-config": {
"backspace": "core:delete-config-selection",
"delete": "core:delete-config-selection",
"ctrl-a": "core:select-all-config-nodes",
"ctrl-z": "core:undo"
},
"workspace": {
"red-ui-workspace": {
"backspace": "core:delete-selection",
"delete": "core:delete-selection",
"enter": "core:edit-selected-node",

4
packages/node_modules/@node-red/editor-client/src/js/nodes.js vendored
View File

@ -368,7 +368,7 @@ RED.nodes = (function() {
outputs: sf.out.length,
color: "#da9",
label: function() { return this.name||RED.nodes.subflow(sf.id).name },
labelStyle: function() { return this.name?"node_label_italic":""; },
labelStyle: function() { return this.name?"red-ui-flow-node-label-italic":""; },
paletteLabel: function() { return RED.nodes.subflow(sf.id).name },
inputLabels: function(i) { return sf.inputLabels?sf.inputLabels[i]:null },
outputLabels: function(i) { return sf.outputLabels?sf.outputLabels[i]:null },
@ -1072,7 +1072,7 @@ RED.nodes = (function() {
color:"#fee",
defaults: {},
label: "unknown: "+n.type,
labelStyle: "node_label_italic",
labelStyle: "red-ui-flow-node-label-italic",
outputs: n.outputs||n.wires.length,
set: registry.getNodeSet("node-red/unknown")
}

86
packages/node_modules/@node-red/editor-client/src/js/red.js vendored
View File

@ -38,11 +38,11 @@ var RED = (function() {
newScript.onload = function() {
scriptCount--;
if (scriptCount === 0) {
$("body").append(nodeConfigEls);
$("#red-ui-editor-node-configs").append(nodeConfigEls);
done()
}
}
$('body').append(newScript);
$("#red-ui-editor-node-configs").append(newScript);
newScript.src = RED.settings.apiRootUrl+srcUrl;
hasDeferred = true;
} else {
@ -58,7 +58,7 @@ var RED = (function() {
}
})
if (!hasDeferred) {
$("body").append(nodeConfigEls);
$("#red-ui-editor-node-configs").append(nodeConfigEls);
done();
}
} catch(err) {
@ -114,10 +114,10 @@ var RED = (function() {
var configs = data.trim().split(/(?=<!-- --- \[red-module:\S+\] --- -->)/);
var stepConfig = function() {
if (configs.length === 0) {
$("body").i18n();
$("#palette > .palette-spinner").hide();
$(".palette-scroll").removeClass("hide");
$("#palette-search").removeClass("hide");
$("#red-ui-editor").i18n();
$("#red-ui-palette > .red-ui-palette-spinner").hide();
$(".red-ui-palette-scroll").removeClass("hide");
$("#red-ui-palette-search").removeClass("hide");
loadFlows(function() {
if (RED.settings.theme("projects.enabled",false)) {
RED.projects.refresh(function(activeProject) {
@ -353,6 +353,7 @@ var RED = (function() {
}
}
node.status = msg;
node.dirtyStatus = true;
node.dirty = true;
RED.view.redraw();
}
@ -433,7 +434,7 @@ var RED = (function() {
});
}
function loadEditor() {
function buildMainMenu() {
var menuOptions = [];
if (RED.settings.theme("projects.enabled",false)) {
menuOptions.push({id:"menu-item-projects-menu",label:RED._("menu.label.projects"),options:[
@ -442,20 +443,7 @@ var RED = (function() {
{id:"menu-item-projects-settings",label:RED._("menu.label.projects-settings"),disabled:false,onselect:"core:show-project-settings"}
]});
}
menuOptions.push({id:"menu-item-view-menu",label:RED._("menu.label.view.view"),options:[
// {id:"menu-item-view-show-grid",setting:"view-show-grid",label:RED._("menu.label.view.showGrid"),toggle:true,onselect:"core:toggle-show-grid"},
// {id:"menu-item-view-snap-grid",setting:"view-snap-grid",label:RED._("menu.label.view.snapGrid"),toggle:true,onselect:"core:toggle-snap-grid"},
// {id:"menu-item-status",setting:"node-show-status",label:RED._("menu.label.displayStatus"),toggle:true,onselect:"core:toggle-status", selected: true},
//null,
// {id:"menu-item-bidi",label:RED._("menu.label.view.textDir"),options:[
// {id:"menu-item-bidi-default",toggle:"text-direction",label:RED._("menu.label.view.defaultDir"),selected: true, onselect:function(s) { if(s){RED.text.bidi.setTextDirection("")}}},
// {id:"menu-item-bidi-ltr",toggle:"text-direction",label:RED._("menu.label.view.ltr"), onselect:function(s) { if(s){RED.text.bidi.setTextDirection("ltr")}}},
// {id:"menu-item-bidi-rtl",toggle:"text-direction",label:RED._("menu.label.view.rtl"), onselect:function(s) { if(s){RED.text.bidi.setTextDirection("rtl")}}},
// {id:"menu-item-bidi-auto",toggle:"text-direction",label:RED._("menu.label.view.auto"), onselect:function(s) { if(s){RED.text.bidi.setTextDirection("auto")}}}
// ]},
// null,
{id:"menu-item-palette",label:RED._("menu.label.palette.show"),toggle:true,onselect:"core:toggle-palette", selected: true},
{id:"menu-item-sidebar",label:RED._("menu.label.sidebar.show"),toggle:true,onselect:"core:toggle-sidebar", selected: true},
{id:"menu-item-event-log",label:RED._("eventLog.title"),onselect:"core:show-event-log"},
@ -494,13 +482,24 @@ var RED = (function() {
menuOptions.push({id:"menu-item-node-red-version", label:"v"+RED.settings.version, onselect: "core:show-about" });
$('<li><a id="red-ui-header-button-sidemenu" class="button" href="#"><i class="fa fa-bars"></i></a></li>').appendTo(".red-ui-header-toolbar")
RED.menu.init({id:"red-ui-header-button-sidemenu",options: menuOptions});
}
function loadEditor() {
RED.workspaces.init();
RED.statusBar.init();
RED.view.init();
RED.userSettings.init();
RED.user.init();
RED.notifications.init();
RED.library.init();
RED.keyboard.init();
RED.palette.init();
RED.eventLog.init();
if (RED.settings.theme('palette.editable') !== false) {
RED.palette.editor.init();
} else {
@ -516,27 +515,56 @@ var RED = (function() {
}
RED.subflow.init();
RED.workspaces.init();
RED.clipboard.init();
RED.search.init();
RED.editor.init();
RED.diff.init();
RED.menu.init({id:"btn-sidemenu",options: menuOptions});
RED.deploy.init(RED.settings.theme("deployButton",null));
RED.notifications.init();
RED.actions.add("core:show-about", showAbout);
buildMainMenu();
RED.nodes.init();
RED.comms.connect();
$("#main-container").show();
$(".header-toolbar").show();
$("#red-ui-main-container").show();
$(".red-ui-header-toolbar").show();
RED.actions.add("core:show-about", showAbout);
loadNodeList();
}
function buildEditor(options) {
var header = $('<div id="red-ui-header"></div>').appendTo(options.target);
var logo = $('<span class="red-ui-header-logo"></span>').appendTo(header);
$('<ul class="red-ui-header-toolbar hide"></ul>').appendTo(header);
$('<div id="red-ui-header-shade" class="hide"></div>').appendTo(header);
$('<div id="red-ui-main-container" class="red-ui-sidebar-closed hide">'+
'<div id="red-ui-workspace"></div>'+
'<div id="red-ui-editor-stack"></div>'+
'<div id="red-ui-palette"></div>'+
'<div id="red-ui-sidebar"></div>'+
'<div id="red-ui-sidebar-separator"></div>'+
'</div>').appendTo(options.target);
$('<div id="red-ui-editor-node-configs"></div>').appendTo(options.target);
$('<div id="red-ui-full-shade" class="hide"></div>').appendTo(options.target);
$.getJSON(options.apiRootUrl+"theme", function(theme) {
if (theme.header) {
if (theme.header.url) {
logo = $("<a>",{href:theme.header.url}).appendTo(logo);
}
if (theme.header.image) {
$('<img>',{src:theme.header.image}).appendTo(logo);
}
if (theme.header.title) {
$('<span>').html(theme.header.title).appendTo(logo);
}
}
});
}
var initialised = false;
function init(options) {
@ -550,6 +578,10 @@ var RED = (function() {
if (options.apiRootUrl && !/\/$/.test(options.apiRootUrl)) {
options.apiRootUrl = options.apiRootUrl+"/";
}
options.target = $("#red-ui-editor");
options.target.addClass("red-ui-editor");
buildEditor(options);
RED.i18n.init(options, function() {
RED.settings.init(options, loadEditor);
})

2
packages/node_modules/@node-red/editor-client/src/js/settings.js vendored
View File

@ -131,7 +131,7 @@ RED.settings = (function () {
RED.settings.remove("auth-tokens");
}
console.log("Node-RED: " + data.version);
console.group("Versions");
console.groupCollapsed("Versions");
console.log("jQuery",$().jquery)
console.log("jQuery UI",$.ui.version);
console.log("ACE",ace.version);

6
packages/node_modules/@node-red/editor-client/src/js/text/bidi.js vendored
View File

@ -97,14 +97,14 @@ RED.text.bidi = (function() {
}
/**
* Enforces the text direction for all the spans with style bidiAware under
* Enforces the text direction for all the spans with style red-ui-text-bidi-aware under
* workspace or sidebar div
*/
function enforceTextDirectionOnPage() {
$("#workspace").find('span.bidiAware').each(function() {
$("#red-ui-workspace").find('span.red-ui-text-bidi-aware').each(function() {
$(this).attr("dir", resolveBaseTextDir($(this).html()));
});
$("#sidebar").find('span.bidiAware').each(function() {
$("#red-ui-sidebar").find('span.red-ui-text-bidi-aware').each(function() {
$(this).attr("dir", resolveBaseTextDir($(this).text()));
});
}

280
packages/node_modules/@node-red/editor-client/src/js/ui/clipboard.js vendored
View File

@ -28,28 +28,33 @@ RED.clipboard = (function() {
var libraryBrowser;
function setupDialogs() {
dialog = $('<div id="clipboard-dialog" class="hide node-red-dialog"><form class="dialog-form form-horizontal"></form></div>')
.appendTo("body")
dialog = $('<div id="red-ui-clipboard-dialog" class="hide"><form class="dialog-form form-horizontal"></form></div>')
.appendTo("#red-ui-editor")
.dialog({
modal: true,
autoOpen: false,
width: 700,
resizable: false,
classes: {
"ui-dialog": "red-ui-editor-dialog",
"ui-dialog-titlebar-close": "hide",
"ui-widget-overlay": "red-ui-editor-dialog"
},
buttons: [
{
id: "clipboard-dialog-cancel",
id: "red-ui-clipboard-dialog-cancel",
text: RED._("common.label.cancel"),
click: function() {
$( this ).dialog( "close" );
}
},
{
id: "clipboard-dialog-download",
id: "red-ui-clipboard-dialog-download",
class: "primary",
text: RED._("clipboard.download"),
click: function() {
var element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent($("#clipboard-export").val()));
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent($("#red-ui-clipboard-dialog-export-text").val()));
element.setAttribute('download', "flows.json");
element.style.display = 'none';
document.body.appendChild(element);
@ -59,23 +64,23 @@ RED.clipboard = (function() {
}
},
{
id: "clipboard-dialog-export",
id: "red-ui-clipboard-dialog-export",
class: "primary",
text: RED._("clipboard.export.copy"),
click: function() {
if (activeTab === "clipboard-dialog-export-tab-clipboard") {
$("#clipboard-export").select();
if (activeTab === "red-ui-clipboard-dialog-export-tab-clipboard") {
$("#red-ui-clipboard-dialog-export-text").select();
document.execCommand("copy");
document.getSelection().removeAllRanges();
RED.notify(RED._("clipboard.nodesExported"),{id:"clipboard"});
$( this ).dialog( "close" );
} else {
var flowToExport = $("#clipboard-export").val();
var flowToExport = $("#red-ui-clipboard-dialog-export-text").val();
var selectedPath = libraryBrowser.getSelected();
if (!selectedPath.children) {
selectedPath = selectedPath.parent;
}
var filename = $("#clipboard-dialog-tab-library-name").val().trim();
var filename = $("#red-ui-clipboard-dialog-tab-library-name").val().trim();
var saveFlow = function() {
$.ajax({
url:'library/'+selectedPath.library+'/'+selectedPath.type+'/'+selectedPath.path + filename,
@ -129,13 +134,13 @@ RED.clipboard = (function() {
}
},
{
id: "clipboard-dialog-ok",
id: "red-ui-clipboard-dialog-ok",
class: "primary",
text: RED._("common.label.import"),
click: function() {
var addNewFlow = ($("#import-tab > a.selected").attr('id') === 'import-tab-new');
if (activeTab === "clipboard-dialog-import-tab-clipboard") {
RED.view.importNodes($("#clipboard-import").val(),addNewFlow);
var addNewFlow = ($("#red-ui-clipboard-dialog-import-opt > a.selected").attr('id') === 'red-ui-clipboard-dialog-import-opt-new');
if (activeTab === "red-ui-clipboard-dialog-red-ui-clipboard-dialog-import-opt-clipboard") {
RED.view.importNodes($("#red-ui-clipboard-dialog-import-text").val(),addNewFlow);
} else {
var selectedPath = libraryBrowser.getSelected();
if (selectedPath.path) {
@ -148,9 +153,6 @@ RED.clipboard = (function() {
}
}
],
open: function(e) {
$(this).parent().find(".ui-dialog-titlebar-close").hide();
},
close: function(e) {
if (popover) {
popover.close(true);
@ -164,32 +166,32 @@ RED.clipboard = (function() {
exportNodesDialog =
'<div class="form-row">'+
'<label style="width:auto;margin-right: 10px;" data-i18n="common.label.export"></label>'+
'<span id="export-range-group" class="button-group">'+
'<a id="export-range-selected" class="editor-button toggle" href="#" data-i18n="clipboard.export.selected"></a>'+
'<a id="export-range-flow" class="editor-button toggle" href="#" data-i18n="clipboard.export.current"></a>'+
'<a id="export-range-full" class="editor-button toggle" href="#" data-i18n="clipboard.export.all"></a>'+
'<span id="red-ui-clipboard-dialog-export-rng-group" class="button-group">'+
'<a id="red-ui-clipboard-dialog-export-rng-selected" class="red-ui-button toggle" href="#" data-i18n="clipboard.export.selected"></a>'+
'<a id="red-ui-clipboard-dialog-export-rng-flow" class="red-ui-button toggle" href="#" data-i18n="clipboard.export.current"></a>'+
'<a id="red-ui-clipboard-dialog-export-rng-full" class="red-ui-button toggle" href="#" data-i18n="clipboard.export.all"></a>'+
'</span>'+
'</div>'+
'<div style="height: 400px; position:relative; border:1px solid #999;">'+
'<div style="position: absolute; top:0;left:0;bottom:0;width:120px;background: #f3f3f3;">'+
'<ul id="clipboard-dialog-export-tabs"></ul>'+
'<div class="red-ui-clipboard-dialog-box">'+
'<div class="red-ui-clipboard-dialog-tabs">'+
'<ul id="red-ui-clipboard-dialog-export-tabs"></ul>'+
'</div>'+
'<div id="clipboard-dialog-export-tabs-content" class="clipboard-dialog-tabs-content">'+
'<div id="clipboard-dialog-export-tab-clipboard" class="clipboard-dialog-tab-clipboard">'+
'<div id="red-ui-clipboard-dialog-export-tabs-content" class="red-ui-clipboard-dialog-tabs-content">'+
'<div id="red-ui-clipboard-dialog-export-tab-clipboard" class="red-ui-clipboard-dialog-tab-clipboard">'+
'<div class="form-row">'+
'<textarea readonly id="clipboard-export"></textarea>'+
'<textarea readonly id="red-ui-clipboard-dialog-export-text"></textarea>'+
'</div>'+
'<div class="form-row" style="text-align: right;">'+
'<span id="export-format-group" class="button-group">'+
'<a id="export-format-mini" class="editor-button editor-button-small toggle" href="#" data-i18n="clipboard.export.compact"></a>'+
'<a id="export-format-full" class="editor-button editor-button-small toggle" href="#" data-i18n="clipboard.export.formatted"></a>'+
'<span id="red-ui-clipboard-dialog-export-fmt-group" class="button-group">'+
'<a id="red-ui-clipboard-dialog-export-fmt-mini" class="red-ui-button red-ui-button-small toggle" href="#" data-i18n="clipboard.export.compact"></a>'+
'<a id="red-ui-clipboard-dialog-export-fmt-full" class="red-ui-button red-ui-button-small toggle" href="#" data-i18n="clipboard.export.formatted"></a>'+
'</span>'+
'</div>'+
'</div>'+
'<div id="clipboard-dialog-export-tab-library" class="clipboard-dialog-tab-library">'+
'<div id="clipboard-dialog-export-tab-library-browser"></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="clipboard-dialog-tab-library-name" type="text">'+
'<label data-i18n="clipboard.export.exportAs"></label><input id="red-ui-clipboard-dialog-tab-library-name" type="text">'+
'</div>'+
'</div>'+
'</div>'+
@ -198,30 +200,30 @@ RED.clipboard = (function() {
importNodesDialog =
'<div style="height: 400px; position:relative; border:1px solid #999; margin-bottom: 12px">'+
'<div style="position: absolute; top:0;left:0;bottom:0;width:120px;background: #f3f3f3;">'+
'<ul id="clipboard-dialog-import-tabs"></ul>'+
'<div class="red-ui-clipboard-dialog-box" style="margin-bottom: 12px">'+
'<div class="red-ui-clipboard-dialog-tabs">'+
'<ul id="red-ui-clipboard-dialog-import-tabs"></ul>'+
'</div>'+
'<div id="clipboard-dialog-import-tabs-content" class="clipboard-dialog-tabs-content">'+
'<div id="clipboard-dialog-import-tab-clipboard" class="clipboard-dialog-tab-clipboard">'+
'<div id="red-ui-clipboard-dialog-import-tabs-content" class="red-ui-clipboard-dialog-tabs-content">'+
'<div id="red-ui-clipboard-dialog-import-tab-clipboard" class="red-ui-clipboard-dialog-tab-clipboard">'+
'<div class="form-row"><span data-i18n="clipboard.pasteNodes"></span>'+
' <a class="editor-button" id="import-file-upload-btn"><i class="fa fa-upload"></i> <span data-i18n="clipboard.selectFile"></span></a>'+
'<input type="file" id="import-file-upload" accept=".json" style="display:none">'+
' <a class="red-ui-button" id="red-ui-clipboard-dialog-import-file-upload-btn"><i class="fa fa-upload"></i> <span data-i18n="clipboard.selectFile"></span></a>'+
'<input type="file" id="red-ui-clipboard-dialog-import-file-upload" accept=".json" style="display:none">'+
'</div>'+
'<div class="form-row">'+
'<textarea id="clipboard-import"></textarea>'+
'<textarea id="red-ui-clipboard-dialog-import-text"></textarea>'+
'</div>'+
'</div>'+
'<div id="clipboard-dialog-import-tab-library" class="clipboard-dialog-tab-library">'+
'<div id="clipboard-dialog-import-tab-library-browser"></div>'+
'<div id="red-ui-clipboard-dialog-import-tab-library" class="red-ui-clipboard-dialog-tab-library">'+
'<div id="red-ui-clipboard-dialog-import-tab-library-browser"></div>'+
'</div>'+
'</div>'+
'</div>'+
'<div class="form-row">'+
'<label style="width:auto;margin-right: 10px;" data-i18n="clipboard.import.import"></label>'+
'<span id="import-tab" class="button-group">'+
'<a id="import-tab-current" class="editor-button toggle selected" href="#" data-i18n="clipboard.export.current"></a>'+
'<a id="import-tab-new" class="editor-button toggle" href="#" data-i18n="clipboard.import.newFlow"></a>'+
'<span id="red-ui-clipboard-dialog-import-opt" class="button-group">'+
'<a id="red-ui-clipboard-dialog-import-opt-current" class="red-ui-button toggle selected" href="#" data-i18n="clipboard.export.current"></a>'+
'<a id="red-ui-clipboard-dialog-import-opt-new" class="red-ui-button toggle" href="#" data-i18n="clipboard.import.newFlow"></a>'+
'</span>'+
'</div>';
@ -233,33 +235,33 @@ RED.clipboard = (function() {
clearTimeout(validateExportFilenameTimeout);
}
validateExportFilenameTimeout = setTimeout(function() {
var filenameInput = $("#clipboard-dialog-tab-library-name");
var filenameInput = $("#red-ui-clipboard-dialog-tab-library-name");
var filename = filenameInput.val().trim();
var valid = filename.length > 0 && !/[\/\\]/.test(filename);
if (valid) {
filenameInput.removeClass("input-error");
$("#clipboard-dialog-export").button("enable");
$("#red-ui-clipboard-dialog-export").button("enable");
} else {
filenameInput.addClass("input-error");
$("#clipboard-dialog-export").button("disable");
$("#red-ui-clipboard-dialog-export").button("disable");
}
},100);
}
var validateImportTimeout;
function validateImport() {
if (activeTab === "clipboard-dialog-import-tab-clipboard") {
if (activeTab === "red-ui-clipboard-dialog-import-tab-clipboard") {
if (validateImportTimeout) {
clearTimeout(validateImportTimeout);
}
validateImportTimeout = setTimeout(function() {
var importInput = $("#clipboard-import");
var importInput = $("#red-ui-clipboard-dialog-import-text");
var v = importInput.val().trim();
if (v === "") {
popover.close(true);
currentPopoverError = null;
importInput.removeClass("input-error");
$("#clipboard-dialog-ok").button("disable");
$("#red-ui-clipboard-dialog-ok").button("disable");
return;
}
try {
@ -282,7 +284,7 @@ RED.clipboard = (function() {
popover.close(true);
importInput.removeClass("input-error");
importInput.val(v);
$("#clipboard-dialog-ok").button("enable");
$("#red-ui-clipboard-dialog-ok").button("enable");
} catch(err) {
if (v !== "") {
importInput.addClass("input-error");
@ -296,7 +298,7 @@ RED.clipboard = (function() {
// which is the least useful, but most consistent message
// - use a custom/library parser that gives consistent messages
// which can be translated.
var message = $('<div class="clipboard-import-error"></div>').text(errString);
var message = $('<div class="red-ui-clipboard-import-error"></div>').text(errString);
var errorPos;
// Chrome error messages
var m = /at position (\d+)/i.exec(errString);
@ -335,15 +337,15 @@ RED.clipboard = (function() {
} else {
currentPopoverError = null;
}
$("#clipboard-dialog-ok").button("disable");
$("#red-ui-clipboard-dialog-ok").button("disable");
}
},100);
} else {
var file = libraryBrowser.getSelected();
if (file && file.label && !file.children) {
$("#clipboard-dialog-ok").button("enable");
$("#red-ui-clipboard-dialog-ok").button("enable");
} else {
$("#clipboard-dialog-ok").button("disable");
$("#red-ui-clipboard-dialog-ok").button("disable");
}
}
}
@ -358,18 +360,18 @@ RED.clipboard = (function() {
dialogContainer.append($(importNodesDialog));
var tabs = RED.tabs.create({
id: "clipboard-dialog-import-tabs",
id: "red-ui-clipboard-dialog-import-tabs",
vertical: true,
onchange: function(tab) {
$("#clipboard-dialog-import-tabs-content").children().hide();
$("#red-ui-clipboard-dialog-import-tabs-content").children().hide();
$("#" + tab.id).show();
activeTab = tab.id;
if (popover) {
popover.close(true);
currentPopoverError = null;
}
if (tab.id === "clipboard-dialog-import-tab-clipboard") {
$("#clipboard-import").trigger("focus");
if (tab.id === "red-ui-clipboard-dialog-import-tab-clipboard") {
$("#red-ui-clipboard-dialog-import-text").trigger("focus");
} else {
libraryBrowser.focus();
}
@ -377,33 +379,33 @@ RED.clipboard = (function() {
}
});
tabs.addTab({
id: "clipboard-dialog-import-tab-clipboard",
id: "red-ui-clipboard-dialog-import-tab-clipboard",
label: RED._("clipboard.clipboard")
});
tabs.addTab({
id: "clipboard-dialog-import-tab-library",
id: "red-ui-clipboard-dialog-import-tab-library",
label: RED._("library.library")
});
tabs.activateTab("clipboard-dialog-import-tab-"+mode);
tabs.activateTab("red-ui-clipboard-dialog-import-tab-"+mode);
if (mode === 'clipboard') {
setTimeout(function() {
$("#clipboard-import").trigger("focus");
$("#red-ui-clipboard-dialog-import-text").trigger("focus");
},100)
}
$("#clipboard-dialog-tab-library-name").on("keyup", validateExportFilename);
$("#clipboard-dialog-tab-library-name").on('paste',function() { setTimeout(validateExportFilename,10)});
$("#clipboard-dialog-export").button("enable");
$("#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: $("#clipboard-dialog-import-tab-library-browser"),
container: $("#red-ui-clipboard-dialog-import-tab-library-browser"),
onselect: function(file) {
if (file && file.label && !file.children) {
$("#clipboard-dialog-ok").button("enable");
$("#red-ui-clipboard-dialog-ok").button("enable");
} else {
$("#clipboard-dialog-ok").button("disable");
$("#red-ui-clipboard-dialog-ok").button("disable");
}
}
})
@ -411,15 +413,15 @@ RED.clipboard = (function() {
dialogContainer.i18n();
$("#clipboard-dialog-ok").show();
$("#clipboard-dialog-cancel").show();
$("#clipboard-dialog-export").hide();
$("#clipboard-dialog-download").hide();
$("#clipboard-dialog-ok").button("disable");
$("#clipboard-import").on("keyup", validateImport);
$("#clipboard-import").on('paste',function() { setTimeout(validateImport,10)});
$("#red-ui-clipboard-dialog-ok").show();
$("#red-ui-clipboard-dialog-cancel").show();
$("#red-ui-clipboard-dialog-export").hide();
$("#red-ui-clipboard-dialog-download").hide();
$("#red-ui-clipboard-dialog-ok").button("disable");
$("#red-ui-clipboard-dialog-import-text").on("keyup", validateImport);
$("#red-ui-clipboard-dialog-import-text").on('paste',function() { setTimeout(validateImport,10)});
$("#import-tab > a").on("click", function(evt) {
$("#red-ui-clipboard-dialog-import-opt > a").on("click", function(evt) {
evt.preventDefault();
if ($(this).hasClass('disabled') || $(this).hasClass('selected')) {
return;
@ -428,22 +430,22 @@ RED.clipboard = (function() {
$(this).addClass('selected');
});
$("#import-file-upload").on("change", function() {
$("#red-ui-clipboard-dialog-import-file-upload").on("change", function() {
var fileReader = new FileReader();
fileReader.onload = function () {
$("#clipboard-import").val(fileReader.result);
$("#red-ui-clipboard-dialog-import-text").val(fileReader.result);
validateImport();
};
fileReader.readAsText($(this).prop('files')[0]);
})
$("#import-file-upload-btn").on("click", function(evt) {
$("#red-ui-clipboard-dialog-import-file-upload-btn").on("click", function(evt) {
evt.preventDefault();
$("#import-file-upload").trigger("click");
$("#red-ui-clipboard-dialog-import-file-upload").trigger("click");
})
dialog.dialog("option","title",RED._("clipboard.importNodes")).dialog("open");
popover = RED.popover.create({
target: $("#clipboard-import"),
target: $("#red-ui-clipboard-dialog-import-text"),
trigger: "manual",
direction: "bottom",
content: ""
@ -461,81 +463,81 @@ RED.clipboard = (function() {
dialogContainer.append($(exportNodesDialog));
var tabs = RED.tabs.create({
id: "clipboard-dialog-export-tabs",
id: "red-ui-clipboard-dialog-export-tabs",
vertical: true,
onchange: function(tab) {
$("#clipboard-dialog-export-tabs-content").children().hide();
$("#red-ui-clipboard-dialog-export-tabs-content").children().hide();
$("#" + tab.id).show();
activeTab = tab.id;
if (tab.id === "clipboard-dialog-export-tab-clipboard") {
$("#clipboard-dialog-export").button("option","label", RED._("clipboard.export.copy"))
$("#clipboard-dialog-download").show();
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();
} else {
$("#clipboard-dialog-export").button("option","label", RED._("clipboard.export.export"))
$("#clipboard-dialog-download").hide();
$("#red-ui-clipboard-dialog-export").button("option","label", RED._("clipboard.export.export"))
$("#red-ui-clipboard-dialog-download").hide();
libraryBrowser.focus();
}
}
});
tabs.addTab({
id: "clipboard-dialog-export-tab-clipboard",
id: "red-ui-clipboard-dialog-export-tab-clipboard",
label: RED._("clipboard.clipboard")
});
tabs.addTab({
id: "clipboard-dialog-export-tab-library",
id: "red-ui-clipboard-dialog-export-tab-library",
label: RED._("library.library")
});
tabs.activateTab("clipboard-dialog-export-tab-"+mode);
tabs.activateTab("red-ui-clipboard-dialog-export-tab-"+mode);
$("#clipboard-dialog-tab-library-name").on("keyup", validateExportFilename);
$("#clipboard-dialog-tab-library-name").on('paste',function() { setTimeout(validateExportFilename,10)});
$("#clipboard-dialog-export").button("enable");
$("#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: $("#clipboard-dialog-export-tab-library-browser"),
container: $("#red-ui-clipboard-dialog-export-tab-library-browser"),
folderTools: true,
onselect: function(file) {
if (file && file.label && !file.children) {
$("#clipboard-dialog-tab-library-name").val(file.label);
$("#red-ui-clipboard-dialog-tab-library-name").val(file.label);
}
}
})
loadFlowLibrary(libraryBrowser,false);
$("#clipboard-dialog-tab-library-name").val("flows.json").select();
$("#red-ui-clipboard-dialog-tab-library-name").val("flows.json").select();
dialogContainer.i18n();
var format = RED.settings.flowFilePretty ? "export-format-full" : "export-format-mini";
var format = RED.settings.flowFilePretty ? "red-ui-clipboard-dialog-export-fmt-full" : "red-ui-clipboard-dialog-export-fmt-mini";
$("#export-format-group > a").on("click", function(evt) {
$("#red-ui-clipboard-dialog-export-fmt-group > a").on("click", function(evt) {
evt.preventDefault();
if ($(this).hasClass('disabled') || $(this).hasClass('selected')) {
$("#clipboard-export").trigger("focus");
$("#red-ui-clipboard-dialog-export-text").trigger("focus");
return;
}
$(this).parent().children().removeClass('selected');
$(this).addClass('selected');
var flow = $("#clipboard-export").val();
var flow = $("#red-ui-clipboard-dialog-export-text").val();
if (flow.length > 0) {
var nodes = JSON.parse(flow);
format = $(this).attr('id');
if (format === 'export-format-full') {
if (format === 'red-ui-clipboard-dialog-export-fmt-full') {
flow = JSON.stringify(nodes,null,4);
} else {
flow = JSON.stringify(nodes);
}
$("#clipboard-export").val(flow);
setTimeout(function() { $("#clipboard-export").scrollTop(0); },50);
$("#red-ui-clipboard-dialog-export-text").val(flow);
setTimeout(function() { $("#red-ui-clipboard-dialog-export-text").scrollTop(0); },50);
$("#clipboard-export").trigger("focus");
$("#red-ui-clipboard-dialog-export-text").trigger("focus");
}
});
$("#export-range-group > a").on("click", function(evt) {
$("#red-ui-clipboard-dialog-export-rng-group > a").on("click", function(evt) {
evt.preventDefault();
if ($(this).hasClass('disabled') || $(this).hasClass('selected')) {
return;
@ -545,7 +547,7 @@ RED.clipboard = (function() {
var type = $(this).attr('id');
var flow = "";
var nodes = null;
if (type === 'export-range-selected') {
if (type === 'red-ui-clipboard-dialog-export-rng-selected') {
var selection = RED.workspaces.selection();
if (selection.length > 0) {
nodes = [];
@ -558,58 +560,58 @@ RED.clipboard = (function() {
}
// Don't include the subflow meta-port nodes in the exported selection
nodes = RED.nodes.createExportableNodeSet(nodes.filter(function(n) { return n.type !== 'subflow'}));
} else if (type === 'export-range-flow') {
} else if (type === 'red-ui-clipboard-dialog-export-rng-flow') {
var activeWorkspace = RED.workspaces.active();
nodes = RED.nodes.filterNodes({z:activeWorkspace});
var parentNode = RED.nodes.workspace(activeWorkspace)||RED.nodes.subflow(activeWorkspace);
nodes.unshift(parentNode);
nodes = RED.nodes.createExportableNodeSet(nodes);
} else if (type === 'export-range-full') {
} else if (type === 'red-ui-clipboard-dialog-export-rng-full') {
nodes = RED.nodes.createCompleteNodeSet(false);
}
if (nodes !== null) {
if (format === "export-format-full") {
if (format === "red-ui-clipboard-dialog-export-fmt-full") {
flow = JSON.stringify(nodes,null,4);
} else {
flow = JSON.stringify(nodes);
}
}
if (flow.length > 0) {
$("#export-copy").removeClass('disabled');
$("#red-ui-clipboard-dialog-export").removeClass('disabled');
} else {
$("#export-copy").addClass('disabled');
$("#red-ui-clipboard-dialog-export").addClass('disabled');
}
$("#clipboard-export").val(flow);
setTimeout(function() { $("#clipboard-export").scrollTop(0); },50);
$("#clipboard-export").trigger("focus");
$("#red-ui-clipboard-dialog-export-text").val(flow);
setTimeout(function() { $("#red-ui-clipboard-dialog-export-text").scrollTop(0); },50);
$("#red-ui-clipboard-dialog-export-text").trigger("focus");
})
$("#clipboard-dialog-ok").hide();
$("#clipboard-dialog-cancel").hide();
$("#clipboard-dialog-export").hide();
$("#red-ui-clipboard-dialog-ok").hide();
$("#red-ui-clipboard-dialog-cancel").hide();
$("#red-ui-clipboard-dialog-export").hide();
var selection = RED.workspaces.selection();
if (selection.length > 0) {
$("#export-range-selected").trigger("click");
$("#red-ui-clipboard-dialog-export-rng-selected").trigger("click");
} else {
selection = RED.view.selection();
if (selection.nodes) {
$("#export-range-selected").trigger("click");
$("#red-ui-clipboard-dialog-export-rng-selected").trigger("click");
} else {
$("#export-range-selected").addClass('disabled').removeClass('selected');
$("#export-range-flow").trigger("click");
$("#red-ui-clipboard-dialog-export-rng-selected").addClass('disabled').removeClass('selected');
$("#red-ui-clipboard-dialog-export-rng-flow").trigger("click");
}
}
if (format === "export-format-full") {
$("#export-format-full").trigger("click");
if (format === "red-ui-clipboard-dialog-export-fmt-full") {
$("#red-ui-clipboard-dialog-export-fmt-full").trigger("click");
} else {
$("#export-format-mini").trigger("click");
$("#red-ui-clipboard-dialog-export-fmt-mini").trigger("click");
}
dialog.dialog("option","title",RED._("clipboard.exportNodes")).dialog( "open" );
$("#clipboard-export").trigger("focus");
$("#clipboard-dialog-cancel").show();
$("#clipboard-dialog-export").show();
$("#clipboard-dialog-download").show();
$("#red-ui-clipboard-dialog-export-text").trigger("focus");
$("#red-ui-clipboard-dialog-cancel").show();
$("#red-ui-clipboard-dialog-export").show();
$("#red-ui-clipboard-dialog-download").show();
}
@ -648,7 +650,7 @@ RED.clipboard = (function() {
}
function hideDropTarget() {
$("#dropTarget").hide();
$("#red-ui-drop-target").hide();
RED.keyboard.remove("escape");
}
function copyText(value,element,msg) {
@ -678,7 +680,7 @@ RED.clipboard = (function() {
if (truncated) {
msg += "_truncated";
}
$("#clipboard-hidden").val(value).select();
$("#red-ui-clipboard-hidden").val(value).select();
var result = document.execCommand("copy");
if (result && element) {
var popover = RED.popover.create({
@ -698,7 +700,7 @@ RED.clipboard = (function() {
init: function() {
setupDialogs();
$('<input type="text" id="clipboard-hidden">').appendTo("body");
$('<input type="text" id="red-ui-clipboard-hidden">').appendTo("#red-ui-editor");
RED.actions.add("core:show-export-dialog",exportNodes);
RED.actions.add("core:show-import-dialog",importNodes);
@ -712,15 +714,17 @@ RED.clipboard = (function() {
RED.events.on("type-search:open",function() { disabled = true; });
RED.events.on("type-search:close",function() { disabled = false; });
$('#chart').on("dragenter",function(event) {
$('<div id="red-ui-drop-target"><div data-i18n="[append]workspace.dropFlowHere"><i class="fa fa-download"></i><br></div></div>').appendTo('#red-ui-editor');
$('#red-ui-workspace-chart').on("dragenter",function(event) {
if ($.inArray("text/plain",event.originalEvent.dataTransfer.types) != -1 ||
$.inArray("Files",event.originalEvent.dataTransfer.types) != -1) {
$("#dropTarget").css({display:'table'});
$("#red-ui-drop-target").css({display:'table'});
RED.keyboard.add("*", "escape" ,hideDropTarget);
}
});
$('#dropTarget').on("dragover",function(event) {
$('#red-ui-drop-target').on("dragover",function(event) {
if ($.inArray("text/plain",event.originalEvent.dataTransfer.types) != -1 ||
$.inArray("Files",event.originalEvent.dataTransfer.types) != -1) {
event.preventDefault();

4
packages/node_modules/@node-red/editor-client/src/js/ui/common/editableList.js vendored
View File

@ -75,7 +75,7 @@
addLabel = 'add';
}
}
$('<a href="#" class="editor-button editor-button-small red-ui-editableList-addButton" style="margin-top: 4px;"><i class="fa fa-plus"></i> '+addLabel+'</a>')
$('<a href="#" class="red-ui-button red-ui-button-small red-ui-editableList-addButton" style="margin-top: 4px;"><i class="fa fa-plus"></i> '+addLabel+'</a>')
.appendTo(this.topContainer)
.on("click", function(evt) {
evt.preventDefault();
@ -257,7 +257,7 @@
li.addClass("red-ui-editableList-item-sortable");
}
if (this.options.removable) {
var deleteButton = $('<a/>',{href:"#",class:"red-ui-editableList-item-remove editor-button editor-button-small"}).appendTo(li);
var deleteButton = $('<a/>',{href:"#",class:"red-ui-editableList-item-remove red-ui-button red-ui-button-small"}).appendTo(li);
$('<i/>',{class:"fa fa-remove"}).appendTo(deleteButton);
li.addClass("red-ui-editableList-item-removable");
deleteButton.on("click", function(evt) {

36
packages/node_modules/@node-red/editor-client/src/js/ui/common/menu.js vendored
View File

@ -56,12 +56,12 @@ RED.menu = (function() {
}
if (opt === null) {
item = $('<li class="divider"></li>');
item = $('<li class="red-ui-menu-divider"></li>');
} else {
item = $('<li></li>');
if (opt.group) {
item.addClass("menu-group-"+opt.group);
item.addClass("red-ui-menu-group-"+opt.group);
}
var linkContent = '<a '+(opt.id?'id="'+opt.id+'" ':'')+'tabindex="-1" href="#">';
@ -79,10 +79,10 @@ RED.menu = (function() {
}
if (opt.sublabel) {
linkContent += '<span class="menu-label-container"><span class="menu-label">'+opt.label+'</span>'+
'<span class="menu-sublabel">'+opt.sublabel+'</span></span>'
linkContent += '<span class="red-ui-menu-label-container"><span class="red-ui-menu-label">'+opt.label+'</span>'+
'<span class="red-ui-menu-sublabel">'+opt.sublabel+'</span></span>'
} else {
linkContent += '<span class="menu-label">'+opt.label+'</span>'
linkContent += '<span class="red-ui-menu-label">'+opt.label+'</span>'
}
linkContent += '</a>';
@ -130,8 +130,8 @@ RED.menu = (function() {
});
}
if (opt.options) {
item.addClass("dropdown-submenu pull-left");
var submenu = $('<ul id="'+opt.id+'-submenu" class="dropdown-menu"></ul>').appendTo(item);
item.addClass("red-ui-menu-dropdown-submenu pull-left");
var submenu = $('<ul id="'+opt.id+'-submenu" class="red-ui-menu-dropdown"></ul>').appendTo(item);
for (var i=0;i<opt.options.length;i++) {
var li = createMenuItem(opt.options[i]);
@ -150,13 +150,29 @@ RED.menu = (function() {
}
function createMenu(options) {
var topMenu = $("<ul/>",{class:"dropdown-menu pull-right"});
var topMenu = $("<ul/>",{class:"red-ui-menu red-ui-menu-dropdown pull-right"});
if (options.id) {
topMenu.attr({id:options.id+"-submenu"});
var menuParent = $("#"+options.id);
if (menuParent.length === 1) {
topMenu.insertAfter(menuParent);
menuParent.on("click", function(evt) {
evt.stopPropagation();
evt.preventDefault();
if (topMenu.is(":visible")) {
$(document).off("click.red-ui-menu");
topMenu.hide();
} else {
$(document).on("click.red-ui-menu", function(evt) {
$(document).off("click.red-ui-menu");
activeMenu = null;
topMenu.hide();
});
$(".red-ui-menu").hide();
topMenu.show();
}
})
}
}
@ -223,13 +239,13 @@ RED.menu = (function() {
function addItem(id,opt) {
var item = createMenuItem(opt);
if (opt.group) {
var groupItems = $("#"+id+"-submenu").children(".menu-group-"+opt.group);
var groupItems = $("#"+id+"-submenu").children(".red-ui-menu-group-"+opt.group);
if (groupItems.length === 0) {
item.appendTo("#"+id+"-submenu");
} else {
for (var i=0;i<groupItems.length;i++) {
var groupItem = groupItems[i];
var label = $(groupItem).find(".menu-label").html();
var label = $(groupItem).find(".red-ui-menu-label").html();
if (opt.label < label) {
$(groupItem).before(item);
break;

10
packages/node_modules/@node-red/editor-client/src/js/ui/common/panels.js vendored
View File

@ -21,6 +21,7 @@ RED.panels = (function() {
var container = options.container || $("#"+options.id);
var children = container.children();
if (children.length !== 2) {
console.log(options.id);
throw new Error("Container must have exactly two children");
}
var vertical = (!options.dir || options.dir === "vertical");
@ -86,10 +87,10 @@ RED.panels = (function() {
resize: function(size) {
var panelSizes;
if (vertical) {
panelSizes = [$(children[0]).height(),$(children[1]).height()];
panelSizes = [$(children[0]).outerHeight(),$(children[1]).outerHeight()];
container.height(size);
} else {
panelSizes = [$(children[0]).width(),$(children[1]).width()];
panelSizes = [$(children[0]).outerWidth(),$(children[1]).outerWidth()];
container.width(size);
}
if (modifiedSizes) {
@ -105,6 +106,11 @@ RED.panels = (function() {
}
}
if (options.resize) {
if (vertical) {
panelSizes = [$(children[0]).height(),$(children[1]).height()];
} else {
panelSizes = [$(children[0]).width(),$(children[1]).width()];
}
options.resize(panelSizes[0],panelSizes[1]);
}
}

4
packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js vendored
View File

@ -131,7 +131,7 @@ RED.popover = (function() {
}
}
var closePopup = function(instant) {
$(document).off('mousedown.modal-popover-close');
$(document).off('mousedown.red-ui-popover');
if (!active) {
if (div) {
if (instant) {
@ -185,7 +185,7 @@ RED.popover = (function() {
}
} else if (trigger === 'modal') {
$(document).on('mousedown.modal-popover-close', function (event) {
$(document).on('mousedown.red-ui-popover', function (event) {
var target = event.target;
while (target.nodeName !== 'BODY' && target !== div[0]) {
target = target.parentElement;

3
packages/node_modules/@node-red/editor-client/src/js/ui/common/searchBox.js vendored
View File

@ -35,6 +35,7 @@
this.currentTimeout = null;
this.lastSent = "";
this.element.val("");
this.element.addClass("red-ui-searchBox-input");
this.uiContainer = this.element.wrap("<div>").parent();
this.uiContainer.addClass("red-ui-searchBox-container");
@ -60,7 +61,7 @@
});
this.element.on("focus",function() {
$("body").one("mousedown",function() {
$(document).one("mousedown",function() {
that.element.blur();
});
});

12
packages/node_modules/@node-red/editor-client/src/js/ui/common/stack.js vendored
View File

@ -45,11 +45,11 @@ RED.stack = (function() {
return {
add: function(entry) {
entries.push(entry);
entry.container = $('<div class="palette-category">').appendTo(container);
entry.container = $('<div class="red-ui-palette-category">').appendTo(container);
if (!visible) {
entry.container.hide();
}
var header = $('<div class="palette-header"></div>').appendTo(entry.container);
var header = $('<div class="red-ui-palette-header"></div>').appendTo(entry.container);
entry.header = header;
entry.contentWrap = $('<div></div>',{style:"position:relative"}).appendTo(entry.container);
if (options.fill) {
@ -82,7 +82,7 @@ RED.stack = (function() {
var icon = $('<i class="fa fa-angle-down"></i>').appendTo(header);
if (entry.expanded) {
entry.container.addClass("palette-category-expanded");
entry.container.addClass("expanded");
icon.addClass("expanded");
} else {
entry.contentWrap.hide();
@ -118,7 +118,7 @@ RED.stack = (function() {
}
icon.addClass("expanded");
entry.container.addClass("palette-category-expanded");
entry.container.addClass("expanded");
entry.contentWrap.slideDown(200);
return true;
}
@ -126,13 +126,13 @@ RED.stack = (function() {
entry.collapse = function() {
if (entry.isExpanded()) {
icon.removeClass("expanded");
entry.container.removeClass("palette-category-expanded");
entry.container.removeClass("expanded");
entry.contentWrap.slideUp(200);
return true;
}
};
entry.isExpanded = function() {
return entry.container.hasClass("palette-category-expanded");
return entry.container.hasClass("expanded");
};
if (options.fill && options.singleExpanded) {
resizeStack();

23
packages/node_modules/@node-red/editor-client/src/js/ui/common/tabs.js vendored
View File

@ -136,7 +136,7 @@ RED.tabs = (function() {
}
});
options = pinnedOptions.concat(options);
collapsibleMenu = RED.menu.init({id:"debug-message-option-menu",options: options});
collapsibleMenu = RED.menu.init({options: options});
collapsibleMenu.css({
position: "absolute"
})
@ -148,10 +148,11 @@ RED.tabs = (function() {
left: (elementPos.left - collapsibleMenu.width() + selectButton.width())+"px"
})
if (collapsibleMenu.is(":visible")) {
$(document).off("click.tabmenu");
$(document).off("click.red-ui-tabmenu");
} else {
$(document).on("click.tabmenu", function(evt) {
$(document).off("click.tabmenu");
$(".red-ui-menu").hide();
$(document).on("click.red-ui-tabmenu", function(evt) {
$(document).off("click.red-ui-tabmenu");
collapsibleMenu.hide();
});
}
@ -448,7 +449,10 @@ RED.tabs = (function() {
}
delete tabs[id];
updateTabWidths();
collapsibleMenu = null;
if (collapsibleMenu) {
collapsibleMenu.remove();
collapsibleMenu = null;
}
}
return {
@ -484,7 +488,7 @@ RED.tabs = (function() {
} else if (tab.iconClass) {
$('<i>',{class:"red-ui-tab-icon "+tab.iconClass}).appendTo(link);
}
var span = $('<span/>',{class:"bidiAware"}).text(tab.label).appendTo(link);
var span = $('<span/>',{class:"red-ui-text-bidi-aware"}).text(tab.label).appendTo(link);
span.attr('dir', RED.text.bidi.resolveBaseTextDir(tab.label));
if (options.collapsible) {
li.addClass("red-ui-tab-pinned");
@ -626,7 +630,10 @@ RED.tabs = (function() {
setTimeout(function() {
updateTabWidths();
},10);
collapsibleMenu = null;
if (collapsibleMenu) {
collapsibleMenu.remove();
collapsibleMenu = null;
}
},
removeTab: removeTab,
activateTab: activateTab,
@ -643,7 +650,7 @@ RED.tabs = (function() {
tabs[id].label = label;
var tab = ul.find("a[href='#"+id+"']");
tab.attr("title",label);
tab.find("span.bidiAware").text(label).attr('dir', RED.text.bidi.resolveBaseTextDir(label));
tab.find("span.red-ui-text-bidi-aware").text(label).attr('dir', RED.text.bidi.resolveBaseTextDir(label));
updateTabWidths();
},
selection: getSelection,

2
packages/node_modules/@node-red/editor-client/src/js/ui/common/treeList.js vendored
View File

@ -276,7 +276,7 @@
}
if (item.hasOwnProperty('selected')) {
var selectWrapper = $('<span class="red-ui-treeList-icon"></span>').appendTo(label);
var cb = $('<input type="checkbox">').prop('checked',item.selected).appendTo(selectWrapper);
var cb = $('<input class="red-ui-treeList-checkbox" type="checkbox">').prop('checked',item.selected).appendTo(selectWrapper);
cb.on('click', function(e) {
e.stopPropagation();
});

38
packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js vendored
View File

@ -124,7 +124,7 @@
}
var contextStores = RED.settings.context.stores;
var contextOptions = contextStores.map(function(store) {
return {value:store,label: store, icon:'<i class="red-ui-typedInput-icon fa fa-database" style="color: #'+(store==='memory'?'ddd':'777')+'"></i>'}
return {value:store,label: store, icon:'<i class="red-ui-typedInput-icon fa fa-database"></i>'}
})
if (contextOptions.length < 2) {
allOptions.flow.options = [];
@ -138,12 +138,12 @@
var that = this;
this.disarmClick = false;
this.input = $('<input type="text"></input>');
this.input = $('<input class="red-ui-typedInput-input" type="text"></input>');
this.input.insertAfter(this.element);
this.input.val(this.element.val());
this.element.addClass('red-ui-typedInput');
this.uiWidth = this.element.outerWidth();
this.elementDiv = this.input.wrap("<div>").parent().addClass('red-ui-typedInput-input');
this.elementDiv = this.input.wrap("<div>").parent().addClass('red-ui-typedInput-input-wrap');
this.uiSelect = this.elementDiv.wrap( "<div>" ).parent();
var attrStyle = this.element.attr('style');
var m;
@ -171,8 +171,8 @@
this.options.types = this.options.types||Object.keys(allOptions);
this.selectTrigger = $('<button tabindex="0"></button>').prependTo(this.uiSelect);
$('<i class="red-ui-typedInput-icon fa fa-sort-desc"></i>').toggle(this.options.types.length > 1).appendTo(this.selectTrigger);
this.selectTrigger = $('<button class="red-ui-typedInput-type-select" tabindex="0"></button>').prependTo(this.uiSelect);
$('<i class="red-ui-typedInput-icon fa fa-caret-down"></i>').toggle(this.options.types.length > 1).appendTo(this.selectTrigger);
this.selectLabel = $('<span class="red-ui-typedInput-type-label"></span>').appendTo(this.selectTrigger);
@ -213,7 +213,7 @@
})
// explicitly set optionSelectTrigger display to inline-block otherwise jQ sets it to 'inline'
this.optionSelectTrigger = $('<button tabindex="0" class="red-ui-typedInput-option-trigger" style="display:inline-block"><span class="red-ui-typedInput-option-caret"><i class="red-ui-typedInput-icon fa fa-sort-desc"></i></span></button>').appendTo(this.uiSelect);
this.optionSelectTrigger = $('<button tabindex="0" class="red-ui-typedInput-option-trigger" style="display:inline-block"><span class="red-ui-typedInput-option-caret"><i class="red-ui-typedInput-icon fa fa-caret-down"></i></span></button>').appendTo(this.uiSelect);
this.optionSelectLabel = $('<span class="red-ui-typedInput-option-label"></span>').prependTo(this.optionSelectTrigger);
RED.popover.tooltip(this.optionSelectLabel,function() {
return that.optionValue;
@ -241,7 +241,10 @@
_showTypeMenu: function() {
if (this.typeList.length > 1) {
this._showMenu(this.menu,this.selectTrigger);
this.menu.find("[value='"+this.propertyType+"']").trigger("focus");
var selected = this.menu.find("[value='"+this.propertyType+"']");
setTimeout(function() {
selected.trigger("focus");
},120);
} else {
this.input.trigger("focus");
}
@ -262,8 +265,11 @@
}
},
_hideMenu: function(menu) {
$(document).off("mousedown.close-property-select");
$(document).off("mousedown.red-ui-typedInput-close-property-select");
menu.hide();
menu.css({
height: "auto"
});
if (this.elementDiv.is(":visible")) {
this.input.trigger("focus");
} else if (this.optionSelectTrigger.is(":visible")){
@ -305,18 +311,21 @@
});
});
menu.css({
display: "none",
display: "none"
});
menu.appendTo(document.body);
menu.on('keydown', function(evt) {
if (evt.keyCode === 40) {
evt.preventDefault();
// DOWN
$(this).children(":focus").next().trigger("focus");
} else if (evt.keyCode === 38) {
evt.preventDefault();
// UP
$(this).children(":focus").prev().trigger("focus");
} else if (evt.keyCode === 27) {
evt.preventDefault();
that._hideMenu(menu);
}
})
@ -339,6 +348,10 @@
if (top+menuHeight > $(window).height()) {
top -= (top+menuHeight)-$(window).height()+5;
}
if (top < 0) {
menu.height(menuHeight+top)
top = 0;
}
menu.css({
top: top+"px",
left: (2+pos.left)+"px",
@ -346,7 +359,7 @@
menu.slideDown(100);
this._delay(function() {
that.uiSelect.addClass('red-ui-typedInput-focus');
$(document).on("mousedown.close-property-select", function(event) {
$(document).on("mousedown.red-ui-typedInput-close-property-select", function(event) {
if(!$(event.target).closest(menu).length) {
that._hideMenu(menu);
}
@ -362,8 +375,7 @@
if (labelWidth === 0) {
var container = $('<div class="red-ui-typedInput-container"></div>').css({
position:"absolute",
top:0,
left:-1000
top:0
}).appendTo(document.body);
var newTrigger = label.clone().appendTo(container);
labelWidth = newTrigger.outerWidth();
@ -465,7 +477,7 @@
return result;
});
this.selectTrigger.toggleClass("disabled", this.typeList.length === 1);
this.selectTrigger.find(".fa-sort-desc").toggle(this.typeList.length > 1)
this.selectTrigger.find(".fa-caret-down").toggle(this.typeList.length > 1)
if (this.menu) {
this.menu.remove();
}

130
packages/node_modules/@node-red/editor-client/src/js/ui/deploy.js vendored
View File

@ -36,7 +36,7 @@ RED.deploy = (function() {
function changeDeploymentType(type) {
deploymentType = type;
$("#btn-deploy-icon").attr("src",deploymentTypes[type].img);
$("#red-ui-header-button-deploy-icon").attr("src",deploymentTypes[type].img);
}
/**
@ -51,19 +51,19 @@ RED.deploy = (function() {
var type = options.type || "default";
if (type == "default") {
$('<li><span class="deploy-button-group button-group">'+
'<a id="btn-deploy" class="deploy-button disabled" href="#">'+
'<span class="deploy-button-content">'+
'<img id="btn-deploy-icon" src="red/images/deploy-full-o.png"> '+
$('<li><span class="red-ui-deploy-button-group button-group">'+
'<a id="red-ui-header-button-deploy" class="red-ui-deploy-button disabled" href="#">'+
'<span class="red-ui-deploy-button-content">'+
'<img id="red-ui-header-button-deploy-icon" src="red/images/deploy-full-o.png"> '+
'<span>'+RED._("deploy.deploy")+'</span>'+
'</span>'+
'<span class="deploy-button-spinner hide">'+
'<span class="red-ui-deploy-button-spinner hide">'+
'<img src="red/images/spin.svg"/>'+
'</span>'+
'</a>'+
'<a id="btn-deploy-options" data-toggle="dropdown" class="deploy-button" href="#"><i class="fa fa-caret-down"></i></a>'+
'</span></li>').prependTo(".header-toolbar");
RED.menu.init({id:"btn-deploy-options",
'<a id="red-ui-header-button-deploy-options" class="red-ui-deploy-button" href="#"><i class="fa fa-caret-down"></i></a>'+
'</span></li>').prependTo(".red-ui-header-toolbar");
RED.menu.init({id:"red-ui-header-button-deploy-options",
options: [
{id:"deploymenu-item-full",toggle:"deploy-type",icon:"red/images/deploy-full.png",label:RED._("deploy.full"),sublabel:RED._("deploy.fullDesc"),selected: true, onselect:function(s) { if(s){changeDeploymentType("full")}}},
{id:"deploymenu-item-flow",toggle:"deploy-type",icon:"red/images/deploy-flows.png",label:RED._("deploy.modifiedFlows"),sublabel:RED._("deploy.modifiedFlowsDesc"), onselect:function(s) {if(s){changeDeploymentType("flows")}}},
@ -80,20 +80,20 @@ RED.deploy = (function() {
icon = options.icon;
}
$('<li><span class="deploy-button-group button-group">'+
'<a id="btn-deploy" class="deploy-button disabled" href="#">'+
'<span class="deploy-button-content">'+
(icon?'<img id="btn-deploy-icon" src="'+icon+'"> ':'')+
$('<li><span class="red-ui-deploy-button-group button-group">'+
'<a id="red-ui-header-button-deploy" class="red-ui-deploy-button disabled" href="#">'+
'<span class="red-ui-deploy-button-content">'+
(icon?'<img id="red-ui-header-button-deploy-icon" src="'+icon+'"> ':'')+
'<span>'+label+'</span>'+
'</span>'+
'<span class="deploy-button-spinner hide">'+
'<span class="red-ui-deploy-button-spinner hide">'+
'<img src="red/images/spin.svg"/>'+
'</span>'+
'</a>'+
'</span></li>').prependTo(".header-toolbar");
'</span></li>').prependTo(".red-ui-header-toolbar");
}
$('#btn-deploy').on("click", function(event) {
$('#red-ui-header-button-deploy').on("click", function(event) {
event.preventDefault();
save();
});
@ -107,10 +107,10 @@ RED.deploy = (function() {
window.onbeforeunload = function() {
return RED._("deploy.confirm.undeployedChanges");
}
$("#btn-deploy").removeClass("disabled");
$("#red-ui-header-button-deploy").removeClass("disabled");
} else {
window.onbeforeunload = null;
$("#btn-deploy").addClass("disabled");
$("#red-ui-header-button-deploy").addClass("disabled");
}
});
@ -176,14 +176,14 @@ RED.deploy = (function() {
function resolveConflict(currentNodes, activeDeploy) {
var message = $('<div>');
$('<p data-i18n="deploy.confirm.conflict"></p>').appendTo(message);
var conflictCheck = $('<div id="node-dialog-confirm-deploy-conflict-checking" class="node-dialog-confirm-conflict-row">'+
var conflictCheck = $('<div class="red-ui-deploy-dialog-confirm-conflict-row">'+
'<img src="red/images/spin.svg"/><div data-i18n="deploy.confirm.conflictChecking"></div>'+
'</div>').appendTo(message);
var conflictAutoMerge = $('<div class="node-dialog-confirm-conflict-row">'+
'<i style="color: #3a3;" class="fa fa-check"></i><div data-i18n="deploy.confirm.conflictAutoMerge"></div>'+
var conflictAutoMerge = $('<div class="red-ui-deploy-dialog-confirm-conflict-row">'+
'<i class="fa fa-check"></i><div data-i18n="deploy.confirm.conflictAutoMerge"></div>'+
'</div>').hide().appendTo(message);
var conflictManualMerge = $('<div id="node-dialog-confirm-deploy-conflict-manual-merge" class="node-dialog-confirm-conflict-row">'+
'<i style="color: #999;" class="fa fa-exclamation"></i><div data-i18n="deploy.confirm.conflictManualMerge"></div>'+
var conflictManualMerge = $('<div class="red-ui-deploy-dialog-confirm-conflict-row">'+
'<i class="fa fa-exclamation"></i><div data-i18n="deploy.confirm.conflictManualMerge"></div>'+
'</div>').hide().appendTo(message);
message.i18n();
@ -196,22 +196,22 @@ RED.deploy = (function() {
}
},
{
id: "node-dialog-confirm-deploy-review",
id: "red-ui-deploy-dialog-confirm-deploy-review",
text: RED._("deploy.confirm.button.review"),
class: "primary disabled",
click: function() {
if (!$("#node-dialog-confirm-deploy-review").hasClass('disabled')) {
if (!$("#red-ui-deploy-dialog-confirm-deploy-review").hasClass('disabled')) {
RED.diff.showRemoteDiff();
conflictNotification.close();
}
}
},
{
id: "node-dialog-confirm-deploy-merge",
id: "red-ui-deploy-dialog-confirm-deploy-merge",
text: RED._("deploy.confirm.button.merge"),
class: "primary disabled",
click: function() {
if (!$("#node-dialog-confirm-deploy-merge").hasClass('disabled')) {
if (!$("#red-ui-deploy-dialog-confirm-deploy-merge").hasClass('disabled')) {
RED.diff.mergeDiff(currentDiff);
conflictNotification.close();
}
@ -220,7 +220,7 @@ RED.deploy = (function() {
];
if (activeDeploy) {
buttons.push({
id: "node-dialog-confirm-deploy-overwrite",
id: "red-ui-deploy-dialog-confirm-deploy-overwrite",
text: RED._("deploy.confirm.button.overwrite"),
class: "primary",
click: function() {
@ -245,11 +245,11 @@ RED.deploy = (function() {
var d = Object.keys(diff.conflicts);
if (d.length === 0) {
conflictAutoMerge.show();
$("#node-dialog-confirm-deploy-merge").removeClass('disabled')
$("#red-ui-deploy-dialog-confirm-deploy-merge").removeClass('disabled')
} else {
conflictManualMerge.show();
}
$("#node-dialog-confirm-deploy-review").removeClass('disabled')
$("#red-ui-deploy-dialog-confirm-deploy-review").removeClass('disabled')
},ellapsed);
})
}
@ -266,15 +266,15 @@ RED.deploy = (function() {
}
function restart() {
var startTime = Date.now();
$(".deploy-button-content").css('opacity',0);
$(".deploy-button-spinner").show();
var deployWasEnabled = !$("#btn-deploy").hasClass("disabled");
$("#btn-deploy").addClass("disabled");
$(".red-ui-deploy-button-content").css('opacity',0);
$(".red-ui-deploy-button-spinner").show();
var deployWasEnabled = !$("#red-ui-header-button-deploy").hasClass("disabled");
$("#red-ui-header-button-deploy").addClass("disabled");
deployInflight = true;
$("#header-shade").show();
$("#editor-shade").show();
$("#palette-shade").show();
$("#sidebar-shade").show();
$("#red-ui-header-shade").show();
$("#red-ui-editor-shade").show();
$("#red-ui-palette-shade").show();
$("#red-ui-sidebar-shade").show();
$.ajax({
url:"flows",
@ -284,12 +284,12 @@ RED.deploy = (function() {
}
}).done(function(data,textStatus,xhr) {
if (deployWasEnabled) {
$("#btn-deploy").removeClass("disabled");
$("#red-ui-header-button-deploy").removeClass("disabled");
}
RED.notify('<p>'+RED._("deploy.successfulRestart")+'</p>',"success");
}).fail(function(xhr,textStatus,err) {
if (deployWasEnabled) {
$("#btn-deploy").removeClass("disabled");
$("#red-ui-header-button-deploy").removeClass("disabled");
}
if (xhr.status === 401) {
RED.notify(RED._("deploy.deployFailed",{message:RED._("user.notAuthorized")}),"error");
@ -304,17 +304,17 @@ RED.deploy = (function() {
deployInflight = false;
var delta = Math.max(0,300-(Date.now()-startTime));
setTimeout(function() {
$(".deploy-button-content").css('opacity',1);
$(".deploy-button-spinner").hide();
$("#header-shade").hide();
$("#editor-shade").hide();
$("#palette-shade").hide();
$("#sidebar-shade").hide();
$(".red-ui-deploy-button-content").css('opacity',1);
$(".red-ui-deploy-button-spinner").hide();
$("#red-ui-header-shade").hide();
$("#red-ui-editor-shade").hide();
$("#red-ui-palette-shade").hide();
$("#red-ui-sidebar-shade").hide();
},delta);
});
}
function save(skipValidation,force) {
if (!$("#btn-deploy").hasClass("disabled")) {
if (!$("#red-ui-header-button-deploy").hasClass("disabled")) {
if (!RED.user.hasPermission("flows.write")) {
RED.notify(RED._("user.errors.deploy"),"error");
return;
@ -355,13 +355,13 @@ RED.deploy = (function() {
if (hasUnknown && !ignoreDeployWarnings.unknown) {
showWarning = true;
notificationMessage = "<p>"+RED._('deploy.confirm.unknown')+"</p>"+
'<ul class="node-dialog-configm-deploy-list"><li>'+cropList(unknownNodes).map(function(n) { return sanitize(n) }).join("</li><li>")+"</li></ul><p>"+
'<ul class="red-ui-deploy-dialog-confirm-list"><li>'+cropList(unknownNodes).map(function(n) { return sanitize(n) }).join("</li><li>")+"</li></ul><p>"+
RED._('deploy.confirm.confirm')+
"</p>";
notificationButtons= [
{
id: "node-dialog-confirm-deploy-deploy",
id: "red-ui-deploy-dialog-confirm-deploy-deploy",
text: RED._("deploy.confirm.button.confirm"),
class: "primary",
click: function() {
@ -375,12 +375,12 @@ RED.deploy = (function() {
invalidNodes.sort(sortNodeInfo);
notificationMessage = "<p>"+RED._('deploy.confirm.improperlyConfigured')+"</p>"+
'<ul class="node-dialog-configm-deploy-list"><li>'+cropList(invalidNodes.map(function(A) { return sanitize( (A.tab?"["+A.tab+"] ":"")+A.label+" ("+A.type+")")})).join("</li><li>")+"</li></ul><p>"+
'<ul class="red-ui-deploy-dialog-confirm-list"><li>'+cropList(invalidNodes.map(function(A) { return sanitize( (A.tab?"["+A.tab+"] ":"")+A.label+" ("+A.type+")")})).join("</li><li>")+"</li></ul><p>"+
RED._('deploy.confirm.confirm')+
"</p>";
notificationButtons= [
{
id: "node-dialog-confirm-deploy-deploy",
id: "red-ui-deploy-dialog-confirm-deploy-deploy",
text: RED._("deploy.confirm.button.confirm"),
class: "primary",
click: function() {
@ -411,9 +411,9 @@ RED.deploy = (function() {
var nns = RED.nodes.createCompleteNodeSet();
var startTime = Date.now();
$(".deploy-button-content").css('opacity',0);
$(".deploy-button-spinner").show();
$("#btn-deploy").addClass("disabled");
$(".red-ui-deploy-button-content").css('opacity',0);
$(".red-ui-deploy-button-spinner").show();
$("#red-ui-header-button-deploy").addClass("disabled");
var data = {flows:nns};
@ -422,10 +422,10 @@ RED.deploy = (function() {
}
deployInflight = true;
$("#header-shade").show();
$("#editor-shade").show();
$("#palette-shade").show();
$("#sidebar-shade").show();
$("#red-ui-header-shade").show();
$("#red-ui-editor-shade").show();
$("#red-ui-palette-shade").show();
$("#red-ui-sidebar-shade").show();
$.ajax({
url:"flows",
type: "POST",
@ -476,7 +476,7 @@ RED.deploy = (function() {
RED.events.emit("deploy");
}).fail(function(xhr,textStatus,err) {
RED.nodes.dirty(true);
$("#btn-deploy").removeClass("disabled");
$("#red-ui-header-button-deploy").removeClass("disabled");
if (xhr.status === 401) {
RED.notify(RED._("deploy.deployFailed",{message:RED._("user.notAuthorized")}),"error");
} else if (xhr.status === 409) {
@ -490,12 +490,12 @@ RED.deploy = (function() {
deployInflight = false;
var delta = Math.max(0,300-(Date.now()-startTime));
setTimeout(function() {
$(".deploy-button-content").css('opacity',1);
$(".deploy-button-spinner").hide();
$("#header-shade").hide();
$("#editor-shade").hide();
$("#palette-shade").hide();
$("#sidebar-shade").hide();
$(".red-ui-deploy-button-content").css('opacity',1);
$(".red-ui-deploy-button-spinner").hide();
$("#red-ui-header-shade").hide();
$("#red-ui-editor-shade").hide();
$("#red-ui-palette-shade").hide();
$("#red-ui-sidebar-shade").hide();
},delta);
});
}

467
packages/node_modules/@node-red/editor-client/src/js/ui/diff.js vendored
View File

File diff suppressed because it is too large Load Diff

158
packages/node_modules/@node-red/editor-client/src/js/ui/editor.js vendored
View File

@ -45,6 +45,7 @@ RED.editor = (function() {
node.valid = true;
var subflow;
var isValid;
var validationErrors;
var hasChanged;
if (node.type.indexOf("subflow:")===0) {
subflow = RED.nodes.subflow(node.type.substring(8));
@ -54,13 +55,17 @@ RED.editor = (function() {
isValid = validateNode(subflow);
hasChanged = subflow.changed;
}
node.valid = isValid && validateNodeProperties(node, node._def.defaults, node);
validationErrors = validateNodeProperties(node, node._def.defaults, node);
node.valid = isValid && validationErrors.length === 0;
node.changed = node.changed || hasChanged;
node.validationErrors = validationErrors;
} else if (node._def) {
node.valid = validateNodeProperties(node, node._def.defaults, node);
validationErrors = validateNodeProperties(node, node._def.defaults, node);
if (node._def._creds) {
node.valid = node.valid && validateNodeProperties(node, node._def.credentials, node._def._creds);
validationErrors = validationErrors.concat(validateNodeProperties(node, node._def.credentials, node._def._creds))
}
node.valid = (validationErrors.length === 0);
node.validationErrors = validationErrors;
} else if (node.type == "subflow") {
var subflowNodes = RED.nodes.filterNodes({z:node.id});
for (var i=0;i<subflowNodes.length;i++) {
@ -103,18 +108,18 @@ RED.editor = (function() {
* @param node - the node being validated
* @param definition - the node property definitions (either def.defaults or def.creds)
* @param properties - the node property values to validate
* @returns {boolean} whether the node's properties are valid
* @returns {array} an array of invalid properties
*/
function validateNodeProperties(node, definition, properties) {
var isValid = true;
var result = [];
for (var prop in definition) {
if (definition.hasOwnProperty(prop)) {
if (!validateNodeProperty(node, definition, prop, properties[prop])) {
isValid = false;
result.push(prop);
}
}
}
return isValid;
return result;
}
/**
@ -127,9 +132,11 @@ RED.editor = (function() {
*/
function validateNodeProperty(node,definition,property,value) {
var valid = true;
// Check for $(env-var) and consider it valid
if (/^\$\([a-zA-Z_][a-zA-Z0-9_]*\)$/.test(value)) {
return true;
}
// Check for ${env-var} and consider it valid
if (/^\$\{[a-zA-Z_][a-zA-Z0-9_]*\}$/.test(value)) {
return true;
}
@ -264,7 +271,7 @@ RED.editor = (function() {
// set the style attr directly - using width() on FF causes a value of 114%...
select.attr('style',"width:100%");
updateConfigNodeSelect(property,type,node[property],prefix);
$('<a id="'+prefix+'-lookup-'+property+'" class="editor-button"><i class="fa fa-pencil"></i></a>')
$('<a id="'+prefix+'-lookup-'+property+'" class="red-ui-button"><i class="fa fa-pencil"></i></a>')
.css({position:'absolute',right:0,top:0})
.appendTo(outerWrap);
$('#'+prefix+'-lookup-'+property).on("click", function(e) {
@ -292,7 +299,7 @@ RED.editor = (function() {
input.val(node[property]);
input.attr("type","hidden");
var button = $("<a>",{id:prefix+"-edit-"+property, class:"editor-button"});
var button = $("<a>",{id:prefix+"-edit-"+property, class:"red-ui-button"});
input.after(button);
if (node[property]) {
@ -573,7 +580,7 @@ RED.editor = (function() {
valueField.typedInput('type', opt.parent?(opt.type||opt.parent.type):opt.type);
valueField.typedInput('value', opt.parent?((opt.value !== undefined)?opt.value:opt.parent.value):opt.value);
var actionButton = $('<a/>',{href:"#",class:"red-ui-editableList-item-remove editor-button editor-button-small"}).appendTo(container);
var actionButton = $('<a/>',{href:"#",class:"red-ui-editableList-item-remove red-ui-button red-ui-button-small"}).appendTo(container);
$('<i/>',{class:"fa "+(opt.parent?"fa-reply":"fa-remove")}).appendTo(actionButton);
container.parent().addClass("red-ui-editableList-item-removable");
if (opt.parent) {
@ -720,8 +727,8 @@ RED.editor = (function() {
var inputPlaceholder = node._def.inputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
var outputPlaceholder = node._def.outputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
var inputsDiv = $("#node-label-form-inputs");
var outputsDiv = $("#node-label-form-outputs");
var inputsDiv = $("#red-ui-editor-node-label-form-inputs");
var outputsDiv = $("#red-ui-editor-node-label-form-outputs");
var inputCount;
if (node.type === 'subflow') {
@ -732,7 +739,7 @@ RED.editor = (function() {
var children = inputsDiv.children();
var childCount = children.length;
if (childCount === 1 && $(children[0]).hasClass('node-label-form-none')) {
if (childCount === 1 && $(children[0]).hasClass('red-ui-editor-node-label-form-none')) {
childCount--;
}
@ -768,14 +775,14 @@ RED.editor = (function() {
var keys = Object.keys(outputMap);
children = outputsDiv.children();
childCount = children.length;
if (childCount === 1 && $(children[0]).hasClass('node-label-form-none')) {
if (childCount === 1 && $(children[0]).hasClass('red-ui-editor-node-label-form-none')) {
childCount--;
}
outputCount = 0;
var rows = [];
keys.forEach(function(p) {
var row = $("#node-label-form-output-"+p).parent();
var row = $("#red-ui-editor-node-label-form-output-"+p).parent();
if (row.length === 0 && outputMap[p] !== -1) {
if (childCount === 0) {
$(children[0]).remove();
@ -807,7 +814,7 @@ RED.editor = (function() {
}
children = outputsDiv.children();
childCount = children.length;
if (childCount === 1 && $(children[0]).hasClass('node-label-form-none')) {
if (childCount === 1 && $(children[0]).hasClass('red-ui-editor-node-label-form-none')) {
childCount--;
}
if (childCount < outputCount) {
@ -828,16 +835,16 @@ RED.editor = (function() {
}
}
function buildLabelRow(type, index, value, placeHolder) {
var result = $('<div>',{class:"node-label-form-row"});
var result = $('<div>',{class:"red-ui-editor-node-label-form-row"});
if (type === undefined) {
$('<span>').text(RED._("editor.noDefaultLabel")).appendTo(result);
result.addClass("node-label-form-none");
result.addClass("red-ui-editor-node-label-form-none");
} else {
result.addClass("");
var id = "node-label-form-"+type+"-"+index;
var id = "red-ui-editor-node-label-form-"+type+"-"+index;
$('<label>',{for:id}).text((index+1)+".").appendTo(result);
var input = $('<input>',{type:"text",id:id, placeholder: placeHolder}).val(value).appendTo(result);
var clear = $('<button type="button" class="editor-button editor-button-small"><i class="fa fa-times"></i></button>').appendTo(result);
var clear = $('<button type="button" class="red-ui-button red-ui-button-small"><i class="fa fa-times"></i></button>').appendTo(result);
clear.on("click", function(evt) {
evt.preventDefault();
input.val("");
@ -859,7 +866,7 @@ RED.editor = (function() {
var picker = $('<div class="red-ui-icon-picker">').css({
top: top+"px",
left: containerPos.left+"px",
}).appendTo("body");
}).appendTo("#red-ui-editor");
var hide = function() {
pickerBackground.remove();
@ -894,7 +901,7 @@ RED.editor = (function() {
var iconList = $('<div class="red-ui-icon-list">').appendTo(picker);
var metaRow = $('<div class="red-ui-icon-meta"></div>').appendTo(picker);
var summary = $('<span>').appendTo(metaRow);
var resetButton = $('<button type="button" class="editor-button editor-button-small">'+RED._("editor.useDefault")+'</button>').appendTo(metaRow).on("click", function(e) {
var resetButton = $('<button type="button" class="red-ui-button red-ui-button-small">'+RED._("editor.useDefault")+'</button>').appendTo(metaRow).on("click", function(e) {
e.preventDefault();
hide();
done(null);
@ -913,7 +920,7 @@ RED.editor = (function() {
var icon_url = RED.settings.apiRootUrl+"icons/"+moduleName+"/"+icon;
iconDiv.data('icon',icon_url);
nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, true);
if (iconPath.module === moduleName && iconPath.file === icon) {
@ -943,7 +950,7 @@ RED.editor = (function() {
$('<div class="form-row">'+
'<label for="node-input-show-label-btn" data-i18n="editor.label"></label>'+
'<button type="button" id="node-input-show-label-btn" class="editor-button" style="min-width: 80px; text-align: left;" type="button"><i id="node-input-show-label-btn-i" class="fa fa-toggle-on"></i> <span id="node-input-show-label-label"></span></button> '+
'<button type="button" id="node-input-show-label-btn" class="red-ui-button" style="min-width: 80px; text-align: left;" type="button"><i id="node-input-show-label-btn-i" class="fa fa-toggle-on"></i> <span id="node-input-show-label-label"></span></button> '+
'<input type="checkbox" id="node-input-show-label" style="display: none;"/>'+
'</div>').appendTo(dialogForm);
@ -977,31 +984,31 @@ RED.editor = (function() {
var iconRow = $('<div class="form-row"></div>').appendTo(dialogForm);
$('<label data-i18n="editor.settingIcon">').appendTo(iconRow);
var iconButton = $('<button type="button" class="editor-button" id="node-settings-icon-button">').appendTo(iconRow);
var iconButton = $('<button type="button" class="red-ui-button" id="red-ui-editor-node-icon-button">').appendTo(iconRow);
var nodeDiv = $('<div>',{class:"red-ui-search-result-node"}).appendTo(iconButton);
var colour = RED.utils.getNodeColor(node.type, node._def);
var icon_url = RED.utils.getNodeIcon(node._def,node);
nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, true);
iconButton.on("click", function(e) {
e.preventDefault();
var iconPath;
var icon = $("#node-settings-icon").text()||"";
var icon = $("#red-ui-editor-node-icon").text()||"";
if (icon) {
iconPath = RED.utils.separateIconPath(icon);
} else {
iconPath = RED.utils.getDefaultNodeIcon(node._def, node);
}
showIconPicker(iconRow,node,iconPath,function(newIcon) {
$("#node-settings-icon").text(newIcon||"");
$("#red-ui-editor-node-icon").text(newIcon||"");
var icon_url = RED.utils.getNodeIcon(node._def,{type:node.type,icon:newIcon});
RED.utils.createIconElement(icon_url, iconContainer, true);
});
});
$('<div id="node-settings-icon">').text(node.icon).appendTo(iconButton);
$('<div id="red-ui-editor-node-icon">').text(node.icon).appendTo(iconButton);
}
$('<div class="form-row"><span data-i18n="editor.portLabels"></span></div>').appendTo(dialogForm);
@ -1019,8 +1026,8 @@ RED.editor = (function() {
var inputPlaceholder = node._def.inputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
var outputPlaceholder = node._def.outputLabels?RED._("editor.defaultLabel"):RED._("editor.noDefaultLabel");
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelInputs"></span><div id="node-label-form-inputs"></div></div>').appendTo(dialogForm);
var inputsDiv = $("#node-label-form-inputs");
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelInputs"></span><div id="red-ui-editor-node-label-form-inputs"></div></div>').appendTo(dialogForm);
var inputsDiv = $("#red-ui-editor-node-label-form-inputs");
if (inputCount > 0) {
for (i=0;i<inputCount;i++) {
buildLabelRow("input",i,inputLabels[i],inputPlaceholder).appendTo(inputsDiv);
@ -1028,8 +1035,8 @@ RED.editor = (function() {
} else {
buildLabelRow().appendTo(inputsDiv);
}
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelOutputs"></span><div id="node-label-form-outputs"></div></div>').appendTo(dialogForm);
var outputsDiv = $("#node-label-form-outputs");
$('<div class="form-row"><span style="margin-left: 50px;" data-i18n="editor.labelOutputs"></span><div id="red-ui-editor-node-label-form-outputs"></div></div>').appendTo(dialogForm);
var outputsDiv = $("#red-ui-editor-node-label-form-outputs");
if (outputCount > 0) {
for (i=0;i<outputCount;i++) {
buildLabelRow("output",i,outputLabels[i],outputPlaceholder).appendTo(outputsDiv);
@ -1040,8 +1047,8 @@ RED.editor = (function() {
}
function updateLabels(editing_node, changes, outputMap) {
var inputLabels = $("#node-label-form-inputs").children().find("input");
var outputLabels = $("#node-label-form-outputs").children().find("input");
var inputLabels = $("#red-ui-editor-node-label-form-inputs").children().find("input");
var outputLabels = $("#red-ui-editor-node-label-form-outputs").children().find("input");
var hasNonBlankLabel = false;
var changed = false;
@ -1059,7 +1066,7 @@ RED.editor = (function() {
hasNonBlankLabel = false;
newValue = new Array(editing_node.outputs);
outputLabels.each(function() {
var index = $(this).attr('id').substring(23); // node-label-form-output-<index>
var index = $(this).attr('id').substring(23); // red-ui-editor-node-label-form-output-<index>
if (outputMap && outputMap.hasOwnProperty(index)) {
index = parseInt(outputMap[index]);
if (index === -1) {
@ -1326,7 +1333,7 @@ RED.editor = (function() {
}
if (!editing_node._def.defaults || !editing_node._def.defaults.hasOwnProperty("icon")) {
var icon = $("#node-settings-icon").text()||""
var icon = $("#red-ui-editor-node-icon").text()||""
if (!isDefaultIcon) {
if (icon !== editing_node.icon) {
changes.icon = editing_node.icon;
@ -1471,8 +1478,8 @@ RED.editor = (function() {
],
resize: function(dimensions) {
editTrayWidthCache[type] = dimensions.width;
$(".editor-tray-content").height(dimensions.height - 50);
var form = $(".editor-tray-content form").height(dimensions.height - 50 - 40);
$(".red-ui-tray-content").height(dimensions.height - 50);
var form = $(".red-ui-tray-content form").height(dimensions.height - 50 - 40);
if (editing_node && editing_node._def.oneditresize) {
try {
editing_node._def.oneditresize.call(editing_node,{width:form.width(),height:form.height()});
@ -1482,8 +1489,8 @@ RED.editor = (function() {
}
},
open: function(tray, done) {
var trayFooter = tray.find(".editor-tray-footer");
var trayBody = tray.find('.editor-tray-body');
var trayFooter = tray.find(".red-ui-tray-footer");
var trayBody = tray.find('.red-ui-tray-body');
trayBody.parent().css('overflow','hidden');
var editorTabEl = $('<ul></ul>').appendTo(trayBody);
@ -1525,7 +1532,7 @@ RED.editor = (function() {
id: "editor-tab-properties",
label: RED._("editor-tab.properties"),
name: RED._("editor-tab.properties"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-cog"
};
buildEditForm(nodePropertiesTab.content,"dialog-form",type,ns,node);
@ -1536,7 +1543,7 @@ RED.editor = (function() {
id: "editor-tab-description",
label: RED._("editor-tab.description"),
name: RED._("editor-tab.description"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-file-text-o",
onchange: function() {
nodeInfoEditor.focus();
@ -1550,7 +1557,7 @@ RED.editor = (function() {
id: "editor-tab-appearance",
label: RED._("editor-tab.appearance"),
name: RED._("editor-tab.appearance"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-object-group",
onchange: function() {
refreshLabelForm(this.content,node);
@ -1649,7 +1656,7 @@ RED.editor = (function() {
var trayOptions = {
title: getEditStackTitle(), //(adding?RED._("editor.addNewConfig", {type:type}):RED._("editor.editConfig", {type:type})),
resize: function(dimensions) {
$(".editor-tray-content").height(dimensions.height - 50);
$(".red-ui-tray-content").height(dimensions.height - 50);
if (editing_config_node && editing_config_node._def.oneditresize) {
var form = $("#node-config-dialog-edit-form");
try {
@ -1660,14 +1667,14 @@ RED.editor = (function() {
}
},
open: function(tray, done) {
var trayHeader = tray.find(".editor-tray-header");
var trayBody = tray.find('.editor-tray-body');
var trayFooter = tray.find(".editor-tray-footer");
var trayHeader = tray.find(".red-ui-tray-header");
var trayBody = tray.find('.red-ui-tray-body');
var trayFooter = tray.find(".red-ui-tray-footer");
var userCountDiv;
if (node_def.hasUsers !== false) {
trayFooter.prepend('<div id="node-config-dialog-user-count"><i class="fa fa-info-circle"></i> <span></span></div>');
userCountDiv = $('<div class="red-ui-tray-footer-left"><i class="fa fa-info-circle"></i> <span></span></div>').prependTo(trayFooter);
}
trayFooter.append('<span id="node-config-dialog-scope-container"><span id="node-config-dialog-scope-warning" data-i18n="[title]editor.errors.scopeChange"><i class="fa fa-warning"></i></span><select id="node-config-dialog-scope"></select></span>');
trayFooter.append('<span class="red-ui-tray-footer-right"><span id="red-ui-editor-config-scope-warning" data-i18n="[title]editor.errors.scopeChange"><i class="fa fa-warning"></i></span><select id="red-ui-editor-config-scope"></select></span>');
var editorTabEl = $('<ul></ul>').appendTo(trayBody);
var editorContent = $('<div></div>').appendTo(trayBody);
@ -1691,7 +1698,7 @@ RED.editor = (function() {
id: "editor-tab-cproperties",
label: RED._("editor-tab.properties"),
name: RED._("editor-tab.properties"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-cog"
};
editorTabs.addTab(nodePropertiesTab);
@ -1702,7 +1709,7 @@ RED.editor = (function() {
id: "editor-tab-description",
label: RED._("editor-tab.description"),
name: RED._("editor-tab.description"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-file-text-o",
onchange: function() {
nodeInfoEditor.focus();
@ -1715,18 +1722,18 @@ RED.editor = (function() {
prepareEditDialog(editing_config_node,node_def,"node-config-input", function() {
if (editing_config_node._def.exclusive) {
$("#node-config-dialog-scope").hide();
$("#red-ui-editor-config-scope").hide();
} else {
$("#node-config-dialog-scope").show();
$("#red-ui-editor-config-scope").show();
}
$("#node-config-dialog-scope-warning").hide();
$("#red-ui-editor-config-scope-warning").hide();
var nodeUserFlows = {};
editing_config_node.users.forEach(function(n) {
nodeUserFlows[n.z] = true;
});
var flowCount = Object.keys(nodeUserFlows).length;
var tabSelect = $("#node-config-dialog-scope").empty();
var tabSelect = $("#red-ui-editor-config-scope").empty();
tabSelect.off("change");
tabSelect.append('<option value=""'+(!editing_config_node.z?" selected":"")+' data-i18n="sidebar.config.global"></option>');
tabSelect.append('<option disabled data-i18n="sidebar.config.flows"></option>');
@ -1750,17 +1757,17 @@ RED.editor = (function() {
var newScope = $(this).val();
if (newScope === '') {
// global scope - everyone can use it
$("#node-config-dialog-scope-warning").hide();
$("#red-ui-editor-config-scope-warning").hide();
} else if (!nodeUserFlows[newScope] || flowCount > 1) {
// a user will loose access to it
$("#node-config-dialog-scope-warning").show();
$("#red-ui-editor-config-scope-warning").show();
} else {
$("#node-config-dialog-scope-warning").hide();
$("#red-ui-editor-config-scope-warning").hide();
}
});
}
if (node_def.hasUsers !== false) {
$("#node-config-dialog-user-count").find("span").text(RED._("editor.nodesUse", {count:editing_config_node.users.length})).parent().show();
if (node_def.hasUsers !== false && userCountDiv) {
userCountDiv.find("span").text(RED._("editor.nodesUse", {count:editing_config_node.users.length})).parent().show();
}
trayBody.i18n();
trayFooter.i18n();
@ -1826,7 +1833,7 @@ RED.editor = (function() {
var configTypeDef = RED.nodes.getType(configType);
var d;
var input;
var scope = $("#node-config-dialog-scope").val();
var scope = $("#red-ui-editor-config-scope").val();
if (configTypeDef.oneditsave) {
try {
@ -2118,7 +2125,7 @@ RED.editor = (function() {
if (updateLabels(editing_node, changes, null)) {
changed = true;
}
var icon = $("#node-settings-icon").text()||"";
var icon = $("#red-ui-editor-node-icon").text()||"";
if ((editing_node.icon === undefined && icon !== "node-red/subflow.png") ||
(editing_node.icon !== undefined && editing_node.icon !== icon)) {
changes.icon = editing_node.icon;
@ -2188,8 +2195,8 @@ RED.editor = (function() {
}
],
resize: function(size) {
$(".editor-tray-content").height(size.height - 50);
// var form = $(".editor-tray-content form").height(size.height - 50 - 40);
$(".red-ui-tray-content").height(size.height - 50);
// var form = $(".red-ui-tray-content form").height(size.height - 50 - 40);
var rows = $("#dialog-form>div:not(.node-input-env-container-row)");
var height = size.height;
for (var i=0; i<rows.size(); i++) {
@ -2200,8 +2207,8 @@ RED.editor = (function() {
$("#node-input-env-container").editableList('height',height-80);
},
open: function(tray) {
var trayFooter = tray.find(".editor-tray-footer");
var trayBody = tray.find('.editor-tray-body');
var trayFooter = tray.find(".red-ui-tray-footer");
var trayBody = tray.find('.red-ui-tray-body');
trayBody.parent().css('overflow','hidden');
@ -2231,7 +2238,7 @@ RED.editor = (function() {
id: "editor-tab-properties",
label: RED._("editor-tab.properties"),
name: RED._("editor-tab.properties"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-cog"
};
buildEditForm(nodePropertiesTab.content,"dialog-form","subflow-template", undefined, editing_node);
@ -2241,7 +2248,7 @@ RED.editor = (function() {
id: "editor-tab-description",
label: RED._("editor-tab.description"),
name: RED._("editor-tab.description"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-file-text-o",
onchange: function() {
subflowEditor.focus();
@ -2254,7 +2261,7 @@ RED.editor = (function() {
id: "editor-tab-appearance",
label: RED._("editor-tab.appearance"),
name: RED._("editor-tab.appearance"),
content: $('<div>', {class:"editor-tray-content"}).appendTo(editorContent).hide(),
content: $('<div>', {class:"red-ui-tray-content"}).appendTo(editorContent).hide(),
iconClass: "fa fa-object-group",
onchange: function() {
refreshLabelForm(this.content,editing_node);
@ -2342,7 +2349,7 @@ RED.editor = (function() {
function createEditor(options) {
var el = options.element || $("#"+options.id)[0];
var toolbarRow = $("<div>").appendTo(el);
el = $("<div>").appendTo(el).addClass("node-text-editor-container")[0];
el = $("<div>").appendTo(el).addClass("red-ui-editor-text-container")[0];
var editor = ace.edit(el);
editor.setTheme("ace/theme/tomorrow");
var session = editor.getSession();
@ -2392,10 +2399,10 @@ RED.editor = (function() {
},100);
}
if (options.mode === 'ace/mode/markdown') {
$(el).addClass("node-text-editor-container-toolbar");
$(el).addClass("red-ui-editor-text-container-toolbar");
editor.toolbar = customEditTypes['_markdown'].buildToolbar(toolbarRow,editor);
if (options.expandable !== false) {
var expandButton = $('<button type="button" class="editor-button" style="float: right;"><i class="fa fa-expand"></i></button>').appendTo(editor.toolbar);
var expandButton = $('<button type="button" class="red-ui-button" style="float: right;"><i class="fa fa-expand"></i></button>').appendTo(editor.toolbar);
expandButton.on("click", function(e) {
e.preventDefault();
@ -2414,7 +2421,7 @@ RED.editor = (function() {
})
});
}
var helpButton = $('<button type="button" class="node-text-editor-help editor-button editor-button-small"><i class="fa fa-question"></i></button>').appendTo($(el).parent());
var helpButton = $('<button type="button" class="red-ui-editor-text-help red-ui-button red-ui-button-small"><i class="fa fa-question"></i></button>').appendTo($(el).parent());
RED.popover.create({
target: helpButton,
trigger: 'click',
@ -2429,6 +2436,7 @@ RED.editor = (function() {
return {
init: function() {
ace.config.set('basePath', 'vendor/ace');
RED.tray.init();
RED.actions.add("core:confirm-edit-tray", function() {
$(document.activeElement).blur();

30
packages/node_modules/@node-red/editor-client/src/js/ui/editors/buffer.js vendored
View File

@ -15,7 +15,7 @@
**/
(function() {
var template = '<script type="text/x-red" data-template-name="_buffer"><div id="node-input-buffer-panels"><div id="node-input-buffer-panel-str" class="red-ui-panel"><div class="form-row" style="margin-bottom: 3px; text-align: right;"><span class="node-input-buffer-type"><i class="fa fa-exclamation-circle"></i> <span id="node-input-buffer-type-string" data-i18n="bufferEditor.modeString"></span><span id="node-input-buffer-type-array" data-i18n="bufferEditor.modeArray"></span></span></div><div class="form-row node-text-editor-row"><div class="node-text-editor" id="node-input-buffer-str"></div></div></div><div id="node-input-buffer-panel-bin" class="red-ui-panel"><div class="form-row node-text-editor-row" style="margin-top: 10px"><div class="node-text-editor" id="node-input-buffer-bin"></div></div></div></div></script>';
var template = '<script type="text/x-red" data-template-name="_buffer"><div id="red-ui-editor-type-buffer-panels"><div id="red-ui-editor-type-buffer-panel-str" class="red-ui-panel"><div class="form-row" style="margin-bottom: 3px; text-align: right;"><button class="red-ui-editor-type-buffer-type red-ui-button red-ui-button-small"><i class="fa fa-exclamation-circle"></i> <span id="red-ui-editor-type-buffer-type-string" data-i18n="bufferEditor.modeString"></span><span id="red-ui-editor-type-buffer-type-array" data-i18n="bufferEditor.modeArray"></span></button></div><div class="form-row node-text-editor-row"><div class="node-text-editor" id="red-ui-editor-type-buffer-str"></div></div></div><div id="red-ui-editor-type-buffer-panel-bin" class="red-ui-panel"><div class="form-row node-text-editor-row" style="margin-top: 10px"><div class="node-text-editor" id="red-ui-editor-type-buffer-bin"></div></div></div></div></script>';
function stringToUTF8Array(str) {
var data = [];
@ -49,6 +49,9 @@
var value = options.value;
var onComplete = options.complete;
var type = "_buffer"
if ($("script[data-template-name='"+type+"']").length === 0) {
$(template).appendTo("#red-ui-editor-node-configs");
}
RED.view.state(RED.state.EDITING);
var bufferStringEditor = [];
var bufferBinValue;
@ -83,18 +86,18 @@
}
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.editor-tray-body'),'dialog-form',type,'editor');
var trayBody = tray.find('.red-ui-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
bufferStringEditor = RED.editor.createEditor({
id: 'node-input-buffer-str',
id: 'red-ui-editor-type-buffer-str',
value: "",
mode:"ace/mode/text"
});
bufferStringEditor.getSession().setValue(value||"",-1);
bufferBinEditor = RED.editor.createEditor({
id: 'node-input-buffer-bin',
id: 'red-ui-editor-type-buffer-bin',
value: "",
mode:"ace/mode/text",
readOnly: true
@ -132,8 +135,8 @@
binBuffer.push((d<16?"0":"")+d.toString(16).toUpperCase());
}
if (valid) {
$("#node-input-buffer-type-string").toggle(isString);
$("#node-input-buffer-type-array").toggle(!isString);
$("#red-ui-editor-type-buffer-type-string").toggle(isString);
$("#red-ui-editor-type-buffer-type-array").toggle(!isString);
bufferBinEditor.setValue(binBuffer.join(""),1);
}
return valid;
@ -165,24 +168,24 @@
dialogForm.i18n();
panels = RED.panels.create({
id:"node-input-buffer-panels",
id:"red-ui-editor-type-buffer-panels",
resize: function(p1Height,p2Height) {
var p1 = $("#node-input-buffer-panel-str");
var p1 = $("#red-ui-editor-type-buffer-panel-str");
p1Height -= $(p1.children()[0]).outerHeight(true);
var editorRow = $(p1.children()[1]);
p1Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$("#node-input-buffer-str").css("height",(p1Height-5)+"px");
$("#red-ui-editor-type-buffer-str").css("height",(p1Height-5)+"px");
bufferStringEditor.resize();
var p2 = $("#node-input-buffer-panel-bin");
var p2 = $("#red-ui-editor-type-buffer-panel-bin");
editorRow = $(p2.children()[0]);
p2Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$("#node-input-buffer-bin").css("height",(p2Height-5)+"px");
$("#red-ui-editor-type-buffer-bin").css("height",(p2Height-5)+"px");
bufferBinEditor.resize();
}
});
$(".node-input-buffer-type").on("click", function(e) {
$(".red-ui-editor-type-buffer-type").on("click", function(e) {
e.preventDefault();
RED.sidebar.info.set(RED._("bufferEditor.modeDesc"));
RED.sidebar.info.show();
@ -202,7 +205,6 @@
RED.tray.show(trayOptions);
}
}
$(template).appendTo(document.body);
RED.editor.registerTypeEditor("_buffer", definition);
})();

82
packages/node_modules/@node-red/editor-client/src/js/ui/editors/expression.js vendored
View File

@ -17,28 +17,28 @@
var template = '<script type="text/x-red" data-template-name="_expression">'+
'<div id="node-input-expression-panels">'+
'<div id="node-input-expression-panel-expr" class="red-ui-panel">'+
'<div class="form-row" style="margin-bottom: 3px; text-align: right;"><span class="node-input-expression-legacy"><i class="fa fa-exclamation-circle"></i> <span data-i18n="expressionEditor.compatMode"></span></span><button id="node-input-expression-reformat" class="editor-button editor-button-small"><span data-i18n="expressionEditor.format"></span></button></div>'+
'<div class="form-row node-text-editor-row"><div class="node-text-editor" id="node-input-expression"></div></div>'+
'<div id="red-ui-editor-type-expression-panels">'+
'<div id="red-ui-editor-type-expression-panel-expr" class="red-ui-panel">'+
'<div class="form-row" style="margin-bottom: 3px; text-align: right;"><button class="red-ui-editor-type-expression-legacy red-ui-button red-ui-button-small"><i class="fa fa-exclamation-circle"></i> <span data-i18n="expressionEditor.compatMode"></span></button><button id="red-ui-editor-type-expression-reformat" class="red-ui-button red-ui-button-small"><span data-i18n="expressionEditor.format"></span></button></div>'+
'<div class="form-row node-text-editor-row"><div class="node-text-editor" id="red-ui-editor-type-expression"></div></div>'+
'</div>'+
'<div id="node-input-expression-panel-info" class="red-ui-panel">'+
'<div id="red-ui-editor-type-expression-panel-info" class="red-ui-panel">'+
'<div class="form-row">'+
'<ul id="node-input-expression-tabs"></ul>'+
'<div id="node-input-expression-tab-help" class="node-input-expression-tab-content hide">'+
'<ul id="red-ui-editor-type-expression-tabs"></ul>'+
'<div id="red-ui-editor-type-expression-tab-help" class="red-ui-editor-type-expression-tab-content hide">'+
'<div>'+
'<select id="node-input-expression-func"></select>'+
'<button id="node-input-expression-func-insert" class="editor-button" data-i18n="expressionEditor.insert"></button>'+
'<select id="red-ui-editor-type-expression-func"></select>'+
'<button id="red-ui-editor-type-expression-func-insert" class="red-ui-button" data-i18n="expressionEditor.insert"></button>'+
'</div>'+
'<div id="node-input-expression-help"></div>'+
'<div id="red-ui-editor-type-expression-help"></div>'+
'</div>'+
'<div id="node-input-expression-tab-test" class="node-input-expression-tab-content hide">'+
'<div id="red-ui-editor-type-expression-tab-test" class="red-ui-editor-type-expression-tab-content hide">'+
'<div>'+
'<span style="display: inline-block; width: calc(50% - 5px);"><span data-i18n="expressionEditor.data"></span><button style="float: right; margin-right: 5px;" id="node-input-example-reformat" class="editor-button editor-button-small"><span data-i18n="jsonEditor.format"></span></button></span>'+
'<span style="display: inline-block; width: calc(50% - 5px);" data-i18n="expressionEditor.result"></span>'+
'<span style="display: inline-block; width: calc(50% - 5px);"><span data-i18n="expressionEditor.data"></span><button style="float: right; margin-right: 5px;" id="node-input-example-reformat" class="red-ui-button red-ui-button-small"><span data-i18n="jsonEditor.format"></span></button></span>'+
'<span style="display: inline-block; margin-left: 10px; width: calc(50% - 5px);" data-i18n="expressionEditor.result"></span>'+
'</div>'+
'<div style="display: inline-block; width: calc(50% - 5px);" class="node-text-editor" id="node-input-expression-test-data"></div>'+
'<div style="display: inline-block; width: calc(50% - 5px);" class="node-text-editor" id="node-input-expression-test-result"></div>'+
'<div style="display: inline-block; width: calc(50% - 5px);" class="node-text-editor" id="red-ui-editor-type-expression-test-data"></div>'+
'<div style="display: inline-block; margin-left: 10px; width:calc(50% - 5px);" class="node-text-editor" id="red-ui-editor-type-expression-test-result"></div>'+
'</div>'+
'</div>'+
'</div>'+
@ -52,6 +52,9 @@
var value = options.value;
var onComplete = options.complete;
var type = "_expression"
if ($("script[data-template-name='"+type+"']").length === 0) {
$(template).appendTo("#red-ui-editor-node-configs");
}
RED.view.state(RED.state.EDITING);
var expressionEditor;
var testDataEditor;
@ -74,7 +77,7 @@
text: RED._("common.label.done"),
class: "primary",
click: function() {
$("#node-input-expression-help").text("");
$("#red-ui-editor-type-expression-help").text("");
onComplete(expressionEditor.getValue());
RED.tray.close();
}
@ -88,10 +91,10 @@
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
trayBody.addClass("node-input-expression-editor")
var dialogForm = RED.editor.buildEditForm(tray.find('.editor-tray-body'),'dialog-form','_expression','editor');
var funcSelect = $("#node-input-expression-func");
var trayBody = tray.find('.red-ui-tray-body');
trayBody.addClass("red-ui-editor-type-expression")
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form','_expression','editor');
var funcSelect = $("#red-ui-editor-type-expression-func");
Object.keys(jsonata.functions).forEach(function(f) {
funcSelect.append($("<option></option>").val(f).text(f));
})
@ -100,11 +103,11 @@
var args = RED._('jsonata:'+f+".args",{defaultValue:''});
var title = "<h5>"+f+"("+args+")</h5>";
var body = marked(RED._('jsonata:'+f+'.desc',{defaultValue:''}));
$("#node-input-expression-help").html(title+"<p>"+body+"</p>");
$("#red-ui-editor-type-expression-help").html(title+"<p>"+body+"</p>");
})
expressionEditor = RED.editor.createEditor({
id: 'node-input-expression',
id: 'red-ui-editor-type-expression',
value: "",
mode:"ace/mode/jsonata",
options: {
@ -186,7 +189,7 @@
});
dialogForm.i18n();
$("#node-input-expression-func-insert").on("click", function(e) {
$("#red-ui-editor-type-expression-func-insert").on("click", function(e) {
e.preventDefault();
var pos = expressionEditor.getCursorPosition();
var f = funcSelect.val();
@ -194,7 +197,7 @@
expressionEditor.insertSnippet(snippet);
expressionEditor.focus();
});
$("#node-input-expression-reformat").on("click", function(evt) {
$("#red-ui-editor-type-expression-reformat").on("click", function(evt) {
evt.preventDefault();
var v = expressionEditor.getValue()||"";
try {
@ -206,9 +209,9 @@
});
var tabs = RED.tabs.create({
element: $("#node-input-expression-tabs"),
element: $("#red-ui-editor-type-expression-tabs"),
onchange:function(tab) {
$(".node-input-expression-tab-content").hide();
$(".red-ui-editor-type-expression-tab-content").hide();
tab.content.show();
trayOptions.resize();
}
@ -217,21 +220,21 @@
tabs.addTab({
id: 'expression-help',
label: RED._('expressionEditor.functionReference'),
content: $("#node-input-expression-tab-help")
content: $("#red-ui-editor-type-expression-tab-help")
});
tabs.addTab({
id: 'expression-tests',
label: RED._('expressionEditor.test'),
content: $("#node-input-expression-tab-test")
content: $("#red-ui-editor-type-expression-tab-test")
});
testDataEditor = RED.editor.createEditor({
id: 'node-input-expression-test-data',
id: 'red-ui-editor-type-expression-test-data',
value: expressionTestCache[expressionTestCacheId] || '{\n "payload": "hello world"\n}',
mode:"ace/mode/json",
lineNumbers: false
});
var changeTimer;
$(".node-input-expression-legacy").on("click", function(e) {
$(".red-ui-editor-type-expression-legacy").on("click", function(e) {
e.preventDefault();
RED.sidebar.info.set(RED._("expressionEditor.compatModeDesc"));
RED.sidebar.info.show();
@ -243,7 +246,7 @@
var expr;
var usesContext = false;
var legacyMode = /(^|[^a-zA-Z0-9_'"])msg([^a-zA-Z0-9_'"]|$)/.test(currentExpression);
$(".node-input-expression-legacy").toggle(legacyMode);
$(".red-ui-editor-type-expression-legacy").toggle(legacyMode);
try {
expr = jsonata(currentExpression);
expr.assign('flowContext',function(val) {
@ -295,28 +298,28 @@
});
testResultEditor = RED.editor.createEditor({
id: 'node-input-expression-test-result',
id: 'red-ui-editor-type-expression-test-result',
value: "",
mode:"ace/mode/json",
lineNumbers: false,
readOnly: true
});
panels = RED.panels.create({
id:"node-input-expression-panels",
id:"red-ui-editor-type-expression-panels",
resize: function(p1Height,p2Height) {
var p1 = $("#node-input-expression-panel-expr");
var p1 = $("#red-ui-editor-type-expression-panel-expr");
p1Height -= $(p1.children()[0]).outerHeight(true);
var editorRow = $(p1.children()[1]);
p1Height -= (parseInt(editorRow.css("marginTop"))+parseInt(editorRow.css("marginBottom")));
$("#node-input-expression").css("height",(p1Height-5)+"px");
$("#red-ui-editor-type-expression").css("height",(p1Height-5)+"px");
expressionEditor.resize();
var p2 = $("#node-input-expression-panel-info > .form-row > div:first-child");
var p2 = $("#red-ui-editor-type-expression-panel-info > .form-row > div:first-child");
p2Height -= p2.outerHeight(true) + 20;
$(".node-input-expression-tab-content").height(p2Height);
$("#node-input-expression-test-data").css("height",(p2Height-5)+"px");
$(".red-ui-editor-type-expression-tab-content").height(p2Height);
$("#red-ui-editor-type-expression-test-data").css("height",(p2Height-5)+"px");
testDataEditor.resize();
$("#node-input-expression-test-result").css("height",(p2Height-5)+"px");
$("#red-ui-editor-type-expression-test-result").css("height",(p2Height-5)+"px");
testResultEditor.resize();
}
});
@ -346,6 +349,5 @@
RED.tray.show(trayOptions);
}
}
$(template).appendTo(document.body);
RED.editor.registerTypeEditor("_expression", definition);
})();

8
packages/node_modules/@node-red/editor-client/src/js/ui/editors/js.js vendored
View File

@ -23,6 +23,9 @@
var value = options.value;
var onComplete = options.complete;
var type = "_js"
if ($("script[data-template-name='"+type+"']").length === 0) {
$(template).appendTo("#red-ui-editor-node-configs");
}
RED.view.state(RED.state.EDITING);
var expressionEditor;
var changeTimer;
@ -59,8 +62,8 @@
expressionEditor.resize();
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.editor-tray-body'),'dialog-form',type,'editor');
var trayBody = tray.find('.red-ui-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
expressionEditor = RED.editor.createEditor({
id: 'node-input-js',
mode: options.mode || 'ace/mode/javascript',
@ -96,7 +99,6 @@
RED.tray.show(trayOptions);
}
}
$(template).appendTo(document.body);
RED.editor.registerTypeEditor("_js", definition);
})();

10
packages/node_modules/@node-red/editor-client/src/js/ui/editors/json.js vendored
View File

@ -16,13 +16,16 @@
(function() {
var template = '<script type="text/x-red" data-template-name="_json"><div class="form-row" style="margin-bottom: 3px; text-align: right;"><button id="node-input-json-reformat" class="editor-button editor-button-small"><span data-i18n="jsonEditor.format"></span></button></div><div class="form-row node-text-editor-row"><div style="height: 200px;min-height: 150px;" class="node-text-editor" id="node-input-json"></div></div></script>';
var template = '<script type="text/x-red" data-template-name="_json"><div class="form-row" style="margin-bottom: 3px; text-align: right;"><button id="node-input-json-reformat" class="red-ui-button red-ui-button-small"><span data-i18n="jsonEditor.format"></span></button></div><div class="form-row node-text-editor-row"><div style="height: 200px;min-height: 150px;" class="node-text-editor" id="node-input-json"></div></div></script>';
var definition = {
show: function(options) {
var value = options.value;
var onComplete = options.complete;
var type = "_json"
if ($("script[data-template-name='"+type+"']").length === 0) {
$(template).appendTo("#red-ui-editor-node-configs");
}
RED.view.state(RED.state.EDITING);
var expressionEditor;
var changeTimer;
@ -74,8 +77,8 @@
expressionEditor.resize();
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.editor-tray-body'),'dialog-form',type,'editor');
var trayBody = tray.find('.red-ui-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
expressionEditor = RED.editor.createEditor({
id: 'node-input-json',
value: "",
@ -112,6 +115,5 @@
RED.tray.show(trayOptions);
}
}
$(template).appendTo(document.body);
RED.editor.registerTypeEditor("_json", definition);
})();

60
packages/node_modules/@node-red/editor-client/src/js/ui/editors/markdown.js vendored
View File

@ -17,34 +17,34 @@
var toolbarTemplate = '<div style="margin-bottom: 5px">'+
'<span class="button-group">'+
'<button type="button" class="editor-button" data-style="h1" style="font-size:1.1em; font-weight: bold">h1</button>'+
'<button type="button" class="editor-button" data-style="h2" style="font-size:1.0em; font-weight: bold">h2</button>'+
'<button type="button" class="editor-button" data-style="h3" style="font-size:0.9em; font-weight: bold">h3</button>'+
'<button type="button" class="red-ui-button" data-style="h1" style="font-size:1.1em; font-weight: bold">h1</button>'+
'<button type="button" class="red-ui-button" data-style="h2" style="font-size:1.0em; font-weight: bold">h2</button>'+
'<button type="button" class="red-ui-button" data-style="h3" style="font-size:0.9em; font-weight: bold">h3</button>'+
'</span>'+
'<span class="button-group">'+
'<button type="button" class="editor-button" data-style="b"><i class="fa fa-bold"></i></button>'+
'<button type="button" class="editor-button" data-style="i"><i class="fa fa-italic"></i></button>'+
'<button type="button" class="editor-button" data-style="code"><i class="fa fa-code"></i></button>'+
'<button type="button" class="red-ui-button" data-style="b"><i class="fa fa-bold"></i></button>'+
'<button type="button" class="red-ui-button" data-style="i"><i class="fa fa-italic"></i></button>'+
'<button type="button" class="red-ui-button" data-style="code"><i class="fa fa-code"></i></button>'+
'</span>'+
'<span class="button-group">'+
'<button type="button" class="editor-button" data-style="ol"><i class="fa fa-list-ol"></i></button>'+
'<button type="button" class="editor-button" data-style="ul"><i class="fa fa-list-ul"></i></button>'+
'<button type="button" class="editor-button" data-style="bq"><i class="fa fa-quote-left"></i></button>'+
'<button type="button" class="editor-button" data-style="hr"><i class="fa fa-minus"></i></button>'+
'<button type="button" class="editor-button" data-style="link"><i class="fa fa-link"></i></button>'+
'<button type="button" class="red-ui-button" data-style="ol"><i class="fa fa-list-ol"></i></button>'+
'<button type="button" class="red-ui-button" data-style="ul"><i class="fa fa-list-ul"></i></button>'+
'<button type="button" class="red-ui-button" data-style="bq"><i class="fa fa-quote-left"></i></button>'+
'<button type="button" class="red-ui-button" data-style="hr"><i class="fa fa-minus"></i></button>'+
'<button type="button" class="red-ui-button" data-style="link"><i class="fa fa-link"></i></button>'+
'</span>'
'</div>';
var template = '<script type="text/x-red" data-template-name="_markdown">'+
'<div id="node-input-markdown-panels">'+
'<div id="node-input-markdown-panel-editor" class="red-ui-panel">'+
'<div id="red-ui-editor-type-markdown-panels">'+
'<div id="red-ui-editor-type-markdown-panel-editor" class="red-ui-panel">'+
'<div style="height: 100%; margin: auto; max-width: 1000px;">'+
'<div id="node-input-markdown-toolbar"></div>'+
'<div class="node-text-editor" style="height: 100%" id="node-input-markdown"></div>'+
'<div id="red-ui-editor-type-markdown-toolbar"></div>'+
'<div class="node-text-editor" style="height: 100%" id="red-ui-editor-type-markdown"></div>'+
'</div>'+
'</div>'+
'<div class="red-ui-panel">'+
'<div class="node-input-markdown-panel-preview node-help"></div>'+
'<div class="red-ui-editor-type-markdown-panel-preview red-ui-help"></div>'+
'</div>'+
'</script>';
@ -56,6 +56,11 @@
var value = options.value;
var onComplete = options.complete;
var type = "_markdown"
if ($("script[data-template-name='"+type+"']").length === 0) {
$(template).appendTo("#red-ui-editor-node-configs");
}
RED.view.state(RED.state.EDITING);
var expressionEditor;
@ -88,11 +93,11 @@
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
trayBody.addClass("node-input-markdown-editor")
var dialogForm = RED.editor.buildEditForm(tray.find('.editor-tray-body'),'dialog-form',type,'editor');
var trayBody = tray.find('.red-ui-tray-body');
trayBody.addClass("red-ui-editor-type-markdown-editor")
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
expressionEditor = RED.editor.createEditor({
id: 'node-input-markdown',
id: 'red-ui-editor-type-markdown',
value: value,
mode:"ace/mode/markdown",
expandable: false
@ -101,20 +106,20 @@
expressionEditor.getSession().on("change", function() {
clearTimeout(changeTimer);
changeTimer = setTimeout(function() {
var currentScrollTop = $(".node-input-markdown-panel-preview").scrollTop();
$(".node-input-markdown-panel-preview").html(marked(expressionEditor.getValue()));
$(".node-input-markdown-panel-preview").scrollTop(currentScrollTop);
var currentScrollTop = $(".red-ui-editor-type-markdown-panel-preview").scrollTop();
$(".red-ui-editor-type-markdown-panel-preview").html(marked(expressionEditor.getValue()));
$(".red-ui-editor-type-markdown-panel-preview").scrollTop(currentScrollTop);
},200);
})
if (options.header) {
options.header.appendTo(tray.find('#node-input-markdown-title'));
options.header.appendTo(tray.find('#red-ui-editor-type-markdown-title'));
}
if (value) {
$(".node-input-markdown-panel-preview").html(marked(expressionEditor.getValue()));
$(".red-ui-editor-type-markdown-panel-preview").html(marked(expressionEditor.getValue()));
}
panels = RED.panels.create({
id:"node-input-markdown-panels",
id:"red-ui-editor-type-markdown-panels",
dir: "horizontal",
resize: function(p1Width,p2Width) {
expressionEditor.resize();
@ -123,7 +128,7 @@
panels.ratio(1);
$('<span class="button-group" style="float:right">'+
'<button type="button" id="node-btn-markdown-preview" class="editor-button toggle single"><i class="fa fa-eye"></i></button>'+
'<button type="button" id="node-btn-markdown-preview" class="red-ui-button toggle single"><i class="fa fa-eye"></i></button>'+
'</span>').appendTo(expressionEditor.toolbar);
$("#node-btn-markdown-preview").on("click", function(e) {
@ -207,6 +212,5 @@
return toolbar;
}
}
$(template).appendTo(document.body);
RED.editor.registerTypeEditor("_markdown", definition);
})();

10
packages/node_modules/@node-red/editor-client/src/js/ui/event-log.js vendored
View File

@ -15,7 +15,7 @@
**/
RED.eventLog = (function() {
var template = '<script type="text/x-red" data-template-name="_eventLog"><div class="form-row node-text-editor-row"><div style="height: 100%;min-height: 150px;" class="node-text-editor" id="event-log-editor"></div></div></script>';
var template = '<script type="text/x-red" data-template-name="_eventLog"><div class="form-row node-text-editor-row"><div style="height: 100%;min-height: 150px;" class="node-text-editor" id="red-ui-event-log-editor"></div></div></script>';
var eventLogEditor;
var backlog = [];
@ -36,7 +36,7 @@ RED.eventLog = (function() {
}
return {
init: function() {
$(template).appendTo(document.body);
$(template).appendTo("#red-ui-editor-node-configs");
RED.actions.add("core:show-event-log",RED.eventLog.show);
},
show: function() {
@ -70,10 +70,10 @@ RED.eventLog = (function() {
eventLogEditor.resize();
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.editor-tray-body'),'dialog-form',type,'editor');
var trayBody = tray.find('.red-ui-tray-body');
var dialogForm = RED.editor.buildEditForm(tray.find('.red-ui-tray-body'),'dialog-form',type,'editor');
eventLogEditor = RED.editor.createEditor({
id: 'event-log-editor',
id: 'red-ui-event-log-editor',
value: backlog.join("\n"),
lineNumbers: false,
readOnly: true,

23
packages/node_modules/@node-red/editor-client/src/js/ui/keyboard.js vendored
View File

@ -94,10 +94,14 @@ RED.h = handlers;
}
}
for (var action in userKeymap) {
if (userKeymap.hasOwnProperty(action)) {
if (userKeymap.hasOwnProperty(action) && userKeymap[action]) {
var obj = userKeymap[action];
if (obj.hasOwnProperty('key')) {
addHandler(obj.scope, obj.key, action, true);
var scope = obj.scope;
if (scope === "workspace") {
scope = "red-ui-workspace";
}
addHandler(scope, obj.key, action, true);
}
}
}
@ -109,7 +113,7 @@ RED.h = handlers;
get: getSettingsPane,
focus: function() {
setTimeout(function() {
$("#user-settings-tab-keyboard-filter").trigger("focus");
$("#red-ui-settings-tab-keyboard-filter").trigger("focus");
},200);
}
})
@ -391,13 +395,16 @@ RED.h = handlers;
$(this).toggleClass("input-error",!valid);
})
var scopeSelect = $('<select><option value="*" data-i18n="keyboard.global"></option><option value="workspace" data-i18n="keyboard.workspace"></option></select>').appendTo(scope);
var scopeSelect = $('<select><option value="*" data-i18n="keyboard.global"></option><option value="red-ui-workspace" data-i18n="keyboard.workspace"></option></select>').appendTo(scope);
scopeSelect.i18n();
if (object.scope === "workspace") {
object.scope = "red-ui-workspace";
}
scopeSelect.val(object.scope||'*');
var div = $('<div class="keyboard-shortcut-edit button-group-vertical"></div>').appendTo(scope);
var okButton = $('<button class="editor-button editor-button-small"><i class="fa fa-check"></i></button>').appendTo(div);
var revertButton = $('<button class="editor-button editor-button-small"><i class="fa fa-reply"></i></button>').appendTo(div);
var okButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-check"></i></button>').appendTo(div);
var revertButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-reply"></i></button>').appendTo(div);
okButton.on("click", function(e) {
e.stopPropagation();
@ -514,10 +521,10 @@ RED.h = handlers;
}
function getSettingsPane() {
var pane = $('<div id="user-settings-tab-keyboard"></div>');
var pane = $('<div id="red-ui-settings-tab-keyboard"></div>');
$('<div class="keyboard-shortcut-entry keyboard-shortcut-list-header">'+
'<div class="keyboard-shortcut-entry-key keyboard-shortcut-entry-text"><input id="user-settings-tab-keyboard-filter" type="text" data-i18n="[placeholder]keyboard.filterActions"></div>'+
'<div class="keyboard-shortcut-entry-key keyboard-shortcut-entry-text"><input id="red-ui-settings-tab-keyboard-filter" type="text" data-i18n="[placeholder]keyboard.filterActions"></div>'+
'<div class="keyboard-shortcut-entry-key" data-i18n="keyboard.shortcut"></div>'+
'<div class="keyboard-shortcut-entry-scope" data-i18n="keyboard.scope"></div>'+
'</div>').appendTo(pane);

237
packages/node_modules/@node-red/editor-client/src/js/ui/library.js vendored
View File

@ -20,16 +20,16 @@ RED.library = (function() {
var libraryEditor;
var activeLibrary;
var _libraryLookup = '<div id="node-dialog-library-load" class="hide">'+
var _libraryLookup = '<div id="red-ui-library-dialog-load" class="hide">'+
'<form class="form-horizontal">'+
'<div style="height: 400px; position:relative; ">'+
'<div id="node-dialog-library-load-panes">'+
'<div class="red-ui-panel" id="node-dialog-library-load-browser"></div>'+
'<div id="red-ui-library-dialog-load-panes">'+
'<div class="red-ui-panel" id="red-ui-library-dialog-load-browser"></div>'+
'<div class="red-ui-panel">'+
'<div id="node-dialog-library-load-preview">'+
'<div class="red-ui-panel" id="node-dialog-library-load-preview-text"></div>'+
'<div class="red-ui-panel" id="node-dialog-library-load-preview-details">'+
'<table id="node-dialog-library-load-preview-details-table" class="node-info"></table>'+
'<div id="red-ui-library-dialog-load-preview">'+
'<div class="red-ui-panel" id="red-ui-library-dialog-load-preview-text"></div>'+
'<div class="red-ui-panel" id="red-ui-library-dialog-load-preview-details">'+
'<table id="red-ui-library-dialog-load-preview-details-table" class="red-ui-info-table"></table>'+
'</div>'+
'</div>'+
'</div>'+
@ -39,12 +39,12 @@ RED.library = (function() {
'</div>'
var _librarySave = '<div id="node-dialog-library-save" class="hide">'+
var _librarySave = '<div id="red-ui-library-dialog-save" class="hide">'+
'<form class="form-horizontal">'+
'<div style="height: 400px; position:relative; ">'+
'<div id="node-dialog-library-save-browser"></div>'+
'<div id="red-ui-library-dialog-save-browser"></div>'+
'<div class="form-row">'+
'<label data-i18n="clipboard.export.exportAs"></label><input id="node-dialog-library-save-filename" type="text">'+
'<label data-i18n="clipboard.export.exportAs"></label><input id="red-ui-library-dialog-save-filename" type="text">'+
'</div>'+
'</div>'+
'</form>'+
@ -56,7 +56,7 @@ RED.library = (function() {
if (name === "") {
name = RED._("library.unnamedType",{type:activeLibrary.type});
}
var filename = $("#node-dialog-library-save-filename").val().trim()
var filename = $("#red-ui-library-dialog-save-filename").val().trim()
var selectedPath = saveLibraryBrowser.getSelected();
if (!selectedPath.children) {
selectedPath = selectedPath.parent;
@ -97,7 +97,7 @@ RED.library = (function() {
}
});
if (exists) {
$( "#node-dialog-library-save" ).dialog("close");
$( "#red-ui-library-dialog-save" ).dialog("close");
var notification = RED.notify(RED._("clipboard.export.exists",{file:RED.utils.sanitize(filename)}),{
type: "warning",
fixed: true,
@ -105,7 +105,7 @@ RED.library = (function() {
text: RED._("common.label.cancel"),
click: function() {
notification.hideNotification()
$( "#node-dialog-library-save" ).dialog( "open" );
$( "#red-ui-library-dialog-save" ).dialog( "open" );
}
},{
text: RED._("clipboard.export.overwrite"),
@ -174,10 +174,10 @@ RED.library = (function() {
var valid = filename.length > 0 && !/[\/\\]/.test(filename);
if (valid) {
filenameInput.removeClass("input-error");
$("#node-dialog-library-save-button").button("enable");
$("#red-ui-library-dialog-save-button").button("enable");
} else {
filenameInput.addClass("input-error");
$("#node-dialog-library-save-button").button("disable");
$("#red-ui-library-dialog-save-button").button("disable");
}
},100);
}
@ -201,87 +201,90 @@ RED.library = (function() {
// Add the library button to the name <input> in the edit dialog
$('#'+elementPrefix+"name").css("width","calc(100% - 52px)").after(
'<div class="btn-group" style="margin-left:5px;">'+
'<a id="node-input-'+options.type+'-lookup" class="editor-button" data-toggle="dropdown"><i class="fa fa-book"></i> <i class="fa fa-caret-down"></i></a>'+
'<ul class="dropdown-menu pull-right" role="menu">'+
'<li><a id="node-input-'+options.type+'-menu-open-library" tabindex="-1" href="#">'+RED._("library.openLibrary")+'</a></li>'+
'<li><a id="node-input-'+options.type+'-menu-save-library" tabindex="-1" href="#">'+RED._("library.saveToLibrary")+'</a></li>'+
'</ul></div>'
'<div style="margin-left:5px; display: inline-block;position: relative;">'+
'<a id="node-input-'+options.type+'-lookup" class="red-ui-button"><i class="fa fa-book"></i> <i class="fa fa-caret-down"></i></a>'+
'</div>'
// '<ul class="red-ui-menu-dropdown pull-right" role="menu">'+
// '<li><a id="node-input-'+options.type+'-menu-open-library" tabindex="-1" href="#">'+RED._("library.openLibrary")+'</a></li>'+
// '<li><a id="node-input-'+options.type+'-menu-save-library" tabindex="-1" href="#">'+RED._("library.saveToLibrary")+'</a></li>'+
// '</ul></div>'
);
RED.menu.init({id:'node-input-'+options.type+'-lookup', options: [
{ 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: [{
icon: 'fa fa-cube',
label: options.type,
path: options.type+"/",
expanded: true,
children: items
}]
}]
loadLibraryBrowser.data(listing);
});
libraryEditor = ace.edit('red-ui-library-dialog-load-preview-text',{
useWorker: false
});
libraryEditor.setTheme("ace/theme/tomorrow");
if (options.mode) {
libraryEditor.getSession().setMode(options.mode);
}
libraryEditor.setOptions({
readOnly: true,
highlightActiveLine: false,
highlightGutterLine: false
});
libraryEditor.renderer.$cursorLayer.element.style.opacity=0;
libraryEditor.$blockScrolling = Infinity;
$('#node-input-'+options.type+'-menu-open-library').on("click", function(e) {
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: [{
icon: 'fa fa-cube',
label: options.type,
path: options.type+"/",
expanded: true,
children: items
}]
}]
loadLibraryBrowser.data(listing);
});
libraryEditor = ace.edit('node-dialog-library-load-preview-text',{
useWorker: false
});
libraryEditor.setTheme("ace/theme/tomorrow");
if (options.mode) {
libraryEditor.getSession().setMode(options.mode);
$( "#red-ui-library-dialog-load" ).dialog("option","title",RED._("library.typeLibrary", {type:options.type})).dialog( "open" );
}
},
{ id:'node-input-'+options.type+'-menu-save-library',
label: RED._("library.saveToLibrary"),
onselect: function() {
activeLibrary = options;
//var found = false;
var name = $("#"+elementPrefix+"name").val().replace(/(^\s*)|(\s*$)/g,"");
var filename = name.replace(/[^\w-]/g,"-");
if (filename === "") {
filename = "unnamed-"+options.type;
}
$("#red-ui-library-dialog-save-filename").attr("value",filename+".js");
loadLibraryFolder("local",options.url, "", function(items) {
var listing = [{
icon: 'fa fa-archive',
label: RED._("library.types.local"),
path: "",
expanded: true,
writable: false,
children: [{
icon: 'fa fa-cube',
label: options.type,
path: options.type+"/",
expanded: true,
children: items
}]
}]
saveLibraryBrowser.data(listing);
});
$( "#red-ui-library-dialog-save" ).dialog( "open" );
}
}
libraryEditor.setOptions({
readOnly: true,
highlightActiveLine: false,
highlightGutterLine: false
});
libraryEditor.renderer.$cursorLayer.element.style.opacity=0;
libraryEditor.$blockScrolling = Infinity;
$( "#node-dialog-library-load" ).dialog("option","title",RED._("library.typeLibrary", {type:options.type})).dialog( "open" );
e.preventDefault();
});
$('#node-input-'+options.type+'-menu-save-library').on("click", function(e) {
activeLibrary = options;
//var found = false;
var name = $("#"+elementPrefix+"name").val().replace(/(^\s*)|(\s*$)/g,"");
var filename = name.replace(/[^\w-]/g,"-");
if (filename === "") {
filename = "unnamed-"+options.type;
}
$("#node-dialog-library-save-filename").attr("value",filename+".js");
loadLibraryFolder("local",options.url, "", function(items) {
var listing = [{
icon: 'fa fa-archive',
label: RED._("library.types.local"),
path: "",
expanded: true,
writable: false,
children: [{
icon: 'fa fa-cube',
label: options.type,
path: options.type+"/",
expanded: true,
children: items
}]
}]
saveLibraryBrowser.data(listing);
});
$( "#node-dialog-library-save" ).dialog( "open" );
e.preventDefault();
});
]})
}
function exportFlow() {
@ -298,7 +301,7 @@ RED.library = (function() {
}
});
var itemTools = $("<div>").css({position: "absolute",bottom:"6px",right:"8px"});
var menuButton = $('<button class="editor-button editor-button-small" type="button"><i class="fa fa-ellipsis-h"></i></button>')
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();
@ -421,15 +424,20 @@ RED.library = (function() {
return {
init: function() {
$(_librarySave).appendTo(document.body);
$(_libraryLookup).appendTo(document.body);
$(_librarySave).appendTo("#red-ui-editor");
$(_libraryLookup).appendTo("#red-ui-editor");
$( "#node-dialog-library-save" ).dialog({
$( "#red-ui-library-dialog-save" ).dialog({
title: RED._("library.saveToLibrary"),
modal: true,
autoOpen: false,
width: 800,
resizable: false,
classes: {
"ui-dialog": "red-ui-editor-dialog",
"ui-dialog-titlebar-close": "hide",
"ui-widget-overlay": "red-ui-editor-dialog"
},
buttons: [
{
text: RED._("common.label.cancel"),
@ -438,7 +446,7 @@ RED.library = (function() {
}
},
{
id: "node-dialog-library-save-button",
id: "red-ui-library-dialog-save-button",
text: RED._("common.label.save"),
class: "primary",
click: function() {
@ -446,33 +454,30 @@ RED.library = (function() {
$( this ).dialog( "close" );
}
}
],
open: function(e) {
$(this).parent().find(".ui-dialog-titlebar-close").hide();
}
]
});
saveLibraryBrowser = RED.library.createBrowser({
container: $("#node-dialog-library-save-browser"),
container: $("#red-ui-library-dialog-save-browser"),
addFolderButton: true,
onselect: function(item) {
if (item.label) {
if (!item.children) {
$("#node-dialog-library-save-filename").val(item.label);
$("#red-ui-library-dialog-save-filename").val(item.label);
item = item.parent;
}
if (item.writable === false) {
$("#node-dialog-library-save-button").button("disable");
$("#red-ui-library-dialog-save-button").button("disable");
} else {
$("#node-dialog-library-save-button").button("enable");
$("#red-ui-library-dialog-save-button").button("enable");
}
}
}
});
$("#node-dialog-library-save-filename").on("keyup", function() { validateExportFilename($(this))});
$("#node-dialog-library-save-filename").on('paste',function() { var input = $(this); setTimeout(function() { validateExportFilename(input)},10)});
$("#red-ui-library-dialog-save-filename").on("keyup", function() { validateExportFilename($(this))});
$("#red-ui-library-dialog-save-filename").on('paste',function() { var input = $(this); setTimeout(function() { validateExportFilename(input)},10)});
$( "#node-dialog-library-load" ).dialog({
$( "#red-ui-library-dialog-load" ).dialog({
modal: true,
autoOpen: false,
width: 800,
@ -511,22 +516,22 @@ RED.library = (function() {
}
});
loadLibraryBrowser = RED.library.createBrowser({
container: $("#node-dialog-library-load-browser"),
container: $("#red-ui-library-dialog-load-browser"),
onselect: function(file) {
var table = $("#node-dialog-library-load-preview-details-table").empty();
var table = $("#red-ui-library-dialog-load-preview-details-table").empty();
selectedLibraryItem = file.props;
if (file && file.label && !file.children) {
$.get("library/"+file.library+"/"+file.type+"/"+file.path, function(data) {
//TODO: nls + sanitize
var propRow = $('<tr class="node-info-node-row"><td>Type</td><td></td></tr>').appendTo(table);
var propRow = $('<tr class="red-ui-help-info-row"><td>Type</td><td></td></tr>').appendTo(table);
$(propRow.children()[1]).text(activeLibrary.type);
if (file.props.hasOwnProperty('name')) {
propRow = $('<tr class="node-info-node-row"><td>Name</td><td>'+file.props.name+'</td></tr>').appendTo(table);
propRow = $('<tr class="red-ui-help-info-row"><td>Name</td><td>'+file.props.name+'</td></tr>').appendTo(table);
$(propRow.children()[1]).text(file.props.name);
}
for (var p in file.props) {
if (file.props.hasOwnProperty(p) && p !== 'name' && p !== 'fn') {
propRow = $('<tr class="node-info-node-row"><td></td><td></td></tr>').appendTo(table);
propRow = $('<tr class="red-ui-help-info-row"><td></td><td></td></tr>').appendTo(table);
$(propRow.children()[0]).text(p);
RED.utils.createObjectElement(file.props[p]).appendTo(propRow.children()[1]);
}
@ -539,11 +544,11 @@ RED.library = (function() {
}
});
RED.panels.create({
container:$("#node-dialog-library-load-panes"),
container:$("#red-ui-library-dialog-load-panes"),
dir: "horizontal"
});
RED.panels.create({
container:$("#node-dialog-library-load-preview"),
container:$("#red-ui-library-dialog-load-preview"),
dir: "vertical"
});
},

34
packages/node_modules/@node-red/editor-client/src/js/ui/notifications.js vendored
View File

@ -62,7 +62,7 @@ RED.notifications = (function() {
}
if (options.modal) {
$("#full-shade").show();
$("#red-ui-full-shade").show();
}
if (currentNotifications.length > 4) {
@ -77,14 +77,14 @@ RED.notifications = (function() {
}
}
var n = document.createElement("div");
n.id="red-notification-"+c;
n.className = "notification";
n.id="red-ui-notification-"+c;
n.className = "red-ui-notification";
n.fixed = fixed;
if (type) {
n.className = "notification notification-"+type;
n.className = "red-ui-notification red-ui-notification-"+type;
}
if (options.width) {
var parentWidth = $("#notifications").width();
var parentWidth = $("#red-ui-notifications").width();
if (options.width > parentWidth) {
var margin = -(options.width-parentWidth)/2;
$(n).css({
@ -116,7 +116,7 @@ RED.notifications = (function() {
}
$("#notifications").append(n);
$("#red-ui-notifications").append(n);
if (!RED.notifications.hide) {
$(n).slideDown(300);
}
@ -142,7 +142,7 @@ RED.notifications = (function() {
nn.parentNode.removeChild(nn);
}
if (options.modal) {
$("#full-shade").hide();
$("#red-ui-full-shade").hide();
}
};
})();
@ -211,9 +211,9 @@ RED.notifications = (function() {
if (nn.hidden) {
nn.showNotification();
} else if (!options || !options.silent){
$(nn).addClass("notification-shake-horizontal");
$(nn).addClass("red-ui-notification-shake-horizontal");
setTimeout(function() {
$(nn).removeClass("notification-shake-horizontal");
$(nn).removeClass("red-ui-notification-shake-horizontal");
},300);
}
@ -263,14 +263,14 @@ RED.notifications = (function() {
return {
init: function() {
notificationButtonWrapper = $('<li>'+
'<a id="btn-notifications" class="button" href="#">'+
'<i class="fa fa-warning"></i>'+
'</a>'+
'</li>').prependTo(".header-toolbar").hide();
$('#btn-notifications').on("click", function() {
showPersistent();
})
$('<div id="red-ui-notifications"></div>').appendTo("#red-ui-editor");
notificationButtonWrapper = $('<li></li>').prependTo(".red-ui-header-toolbar").hide();
$('<a class="button" href="#"><i class="fa fa-warning"></i></a>')
.appendTo(notificationButtonWrapper)
.on("click", function() {
showPersistent();
})
},
notify: notify
}

133
packages/node_modules/@node-red/editor-client/src/js/ui/palette-editor.js vendored
View File

@ -235,12 +235,7 @@ RED.palette.editor = (function() {
if (def && def.color) {
swatch.css({background:RED.utils.getNodeColor(t,def)});
swatch.css({border: "1px solid "+getContrastingBorder(swatch.css('backgroundColor'))})
} else {
swatch.css({background:"#eee",border:"1px dashed #999"})
}
} else {
swatch.css({background:"#eee",border:"1px dashed #999"})
}
}
nodeEntries[module].setUseCount[setName] = inUseCount;
@ -257,7 +252,7 @@ RED.palette.editor = (function() {
setElements.enableButton.text(RED._('palette.editor.enable'));
}
}
setElements.setRow.toggleClass("palette-module-set-disabled",!set.enabled);
setElements.setRow.toggleClass("red-ui-palette-module-set-disabled",!set.enabled);
}
}
@ -350,7 +345,7 @@ RED.palette.editor = (function() {
catalogueLoadErrors = true;
}
if (catalogueCount > 1) {
$(".palette-module-shade-status").html(RED._('palette.editor.loading')+"<br>"+catalogueLoadStatus.length+"/"+catalogueCount);
$(".red-ui-palette-module-shade-status").html(RED._('palette.editor.loading')+"<br>"+catalogueLoadStatus.length+"/"+catalogueCount);
}
if (catalogueLoadStatus.length === catalogueCount) {
if (catalogueLoadErrors) {
@ -358,7 +353,7 @@ RED.palette.editor = (function() {
}
var delta = 250-(Date.now() - catalogueLoadStart);
setTimeout(function() {
$("#palette-module-install-shade").hide();
$("#red-ui-palette-module-install-shade").hide();
},Math.max(delta,0));
}
@ -370,15 +365,15 @@ RED.palette.editor = (function() {
loadedIndex = {};
packageList.editableList('empty');
$(".palette-module-shade-status").text(RED._('palette.editor.loading'));
$(".red-ui-palette-module-shade-status").text(RED._('palette.editor.loading'));
var catalogues = RED.settings.theme('palette.catalogues')||['https://catalogue.nodered.org/catalogue.json'];
catalogueLoadStatus = [];
catalogueLoadErrors = false;
catalogueCount = catalogues.length;
if (catalogues.length > 1) {
$(".palette-module-shade-status").html(RED._('palette.editor.loading')+"<br>0/"+catalogues.length);
$(".red-ui-palette-module-shade-status").html(RED._('palette.editor.loading')+"<br>0/"+catalogues.length);
}
$("#palette-module-install-shade").show();
$("#red-ui-palette-module-install-shade").show();
catalogueLoadStart = Date.now();
var handled = 0;
catalogues.forEach(function(catalog,index) {
@ -542,15 +537,15 @@ RED.palette.editor = (function() {
function createSettingsPane() {
settingsPane = $('<div id="user-settings-tab-palette"></div>');
var content = $('<div id="palette-editor">'+
'<ul id="palette-editor-tabs"></ul>'+
settingsPane = $('<div id="red-ui-settings-tab-palette"></div>');
var content = $('<div id="red-ui-palette-editor">'+
'<ul id="red-ui-palette-editor-tabs"></ul>'+
'</div>').appendTo(settingsPane);
editorTabs = RED.tabs.create({
element: settingsPane.find('#palette-editor-tabs'),
element: settingsPane.find('#red-ui-palette-editor-tabs'),
onchange:function(tab) {
content.find(".palette-editor-tab").hide();
content.find(".red-ui-palette-editor-tab").hide();
tab.content.show();
if (filterInput) {
filterInput.searchBox('value',"");
@ -572,7 +567,7 @@ RED.palette.editor = (function() {
});
var modulesTab = $('<div>',{class:"palette-editor-tab"}).appendTo(content);
var modulesTab = $('<div>',{class:"red-ui-palette-editor-tab"}).appendTo(content);
editorTabs.addTab({
id: 'nodes',
@ -580,7 +575,7 @@ RED.palette.editor = (function() {
content: modulesTab
})
var filterDiv = $('<div>',{class:"palette-search"}).appendTo(modulesTab);
var filterDiv = $('<div>',{class:"red-ui-palette-search"}).appendTo(modulesTab);
filterInput = $('<input type="text" data-i18n="[placeholder]palette.filter"></input>')
.appendTo(filterDiv)
.searchBox({
@ -591,7 +586,7 @@ RED.palette.editor = (function() {
});
nodeList = $('<ol>',{id:"palette-module-list", style:"position: absolute;top: 35px;bottom: 0;left: 0;right: 0px;"}).appendTo(modulesTab).editableList({
nodeList = $('<ol>',{id:"red-ui-palette-module-list", style:"position: absolute;top: 35px;bottom: 0;left: 0;right: 0px;"}).appendTo(modulesTab).editableList({
addButton: false,
scrollOnAdd: false,
sort: function(A,B) {
@ -607,20 +602,20 @@ RED.palette.editor = (function() {
addItem: function(container,i,object) {
var entry = object.info;
if (entry) {
var headerRow = $('<div>',{class:"palette-module-header"}).appendTo(container);
var titleRow = $('<div class="palette-module-meta palette-module-name"><i class="fa fa-cube"></i></div>').appendTo(headerRow);
var headerRow = $('<div>',{class:"red-ui-palette-module-header"}).appendTo(container);
var titleRow = $('<div class="red-ui-palette-module-meta red-ui-palette-module-name"><i class="fa fa-cube"></i></div>').appendTo(headerRow);
$('<span>').text(entry.name).appendTo(titleRow);
var metaRow = $('<div class="palette-module-meta palette-module-version"><i class="fa fa-tag"></i></div>').appendTo(headerRow);
var metaRow = $('<div class="red-ui-palette-module-meta red-ui-palette-module-version"><i class="fa fa-tag"></i></div>').appendTo(headerRow);
var versionSpan = $('<span>').text(entry.version).appendTo(metaRow);
var errorRow = $('<div class="palette-module-meta palette-module-errors"><i class="fa fa-warning"></i></div>').hide().appendTo(headerRow);
var errorList = $('<ul class="palette-module-error-list"></ul>').appendTo(errorRow);
var buttonRow = $('<div>',{class:"palette-module-meta"}).appendTo(headerRow);
var setButton = $('<a href="#" class="editor-button editor-button-small palette-module-set-button"><i class="fa fa-angle-right palette-module-node-chevron"></i> </a>').appendTo(buttonRow);
var errorRow = $('<div class="red-ui-palette-module-meta red-ui-palette-module-errors"><i class="fa fa-warning"></i></div>').hide().appendTo(headerRow);
var errorList = $('<ul class="red-ui-palette-module-error-list"></ul>').appendTo(errorRow);
var buttonRow = $('<div>',{class:"red-ui-palette-module-meta"}).appendTo(headerRow);
var setButton = $('<a href="#" class="red-ui-button red-ui-button-small red-ui-palette-module-set-button"><i class="fa fa-angle-right red-ui-palette-module-node-chevron"></i> </a>').appendTo(buttonRow);
var setCount = $('<span>').appendTo(setButton);
var buttonGroup = $('<div>',{class:"palette-module-button-group"}).appendTo(buttonRow);
var buttonGroup = $('<div>',{class:"red-ui-palette-module-button-group"}).appendTo(buttonRow);
var updateButton = $('<a href="#" class="editor-button editor-button-small"></a>').text(RED._('palette.editor.update')).appendTo(buttonGroup);
var updateButton = $('<a href="#" class="red-ui-button red-ui-button-small"></a>').text(RED._('palette.editor.update')).appendTo(buttonGroup);
updateButton.attr('id','up_'+Math.floor(Math.random()*1000000000));
updateButton.on("click", function(evt) {
evt.preventDefault();
@ -631,7 +626,7 @@ RED.palette.editor = (function() {
})
var removeButton = $('<a href="#" class="editor-button editor-button-small"></a>').text(RED._('palette.editor.remove')).appendTo(buttonGroup);
var removeButton = $('<a href="#" class="red-ui-button red-ui-button-small"></a>').text(RED._('palette.editor.remove')).appendTo(buttonGroup);
removeButton.attr('id','up_'+Math.floor(Math.random()*1000000000));
removeButton.on("click", function(evt) {
evt.preventDefault();
@ -640,10 +635,10 @@ RED.palette.editor = (function() {
if (!entry.local) {
removeButton.hide();
}
var enableButton = $('<a href="#" class="editor-button editor-button-small"></a>').text(RED._('palette.editor.disableall')).appendTo(buttonGroup);
var enableButton = $('<a href="#" class="red-ui-button red-ui-button-small"></a>').text(RED._('palette.editor.disableall')).appendTo(buttonGroup);
var contentRow = $('<div>',{class:"palette-module-content"}).appendTo(container);
var shade = $('<div class="palette-module-shade hide"><img src="red/images/spin.svg" class="palette-spinner"/></div>').appendTo(container);
var contentRow = $('<div>',{class:"red-ui-palette-module-content"}).appendTo(container);
var shade = $('<div class="red-ui-palette-module-shade hide"><img src="red/images/spin.svg" class="red-ui-palette-spinner"/></div>').appendTo(container);
object.elements = {
updateButton: updateButton,
@ -674,15 +669,15 @@ RED.palette.editor = (function() {
});
setList.forEach(function(setName) {
var set = entry.sets[setName];
var setRow = $('<div>',{class:"palette-module-set"}).appendTo(contentRow);
var buttonGroup = $('<div>',{class:"palette-module-set-button-group"}).appendTo(setRow);
var setRow = $('<div>',{class:"red-ui-palette-module-set"}).appendTo(contentRow);
var buttonGroup = $('<div>',{class:"red-ui-palette-module-set-button-group"}).appendTo(setRow);
var typeSwatches = {};
set.types.forEach(function(t) {
var typeDiv = $('<div>',{class:"palette-module-type"}).appendTo(setRow);
typeSwatches[t] = $('<span>',{class:"palette-module-type-swatch"}).appendTo(typeDiv);
$('<span>',{class:"palette-module-type-node"}).text(t).appendTo(typeDiv);
var typeDiv = $('<div>',{class:"red-ui-palette-module-type"}).appendTo(setRow);
typeSwatches[t] = $('<span>',{class:"red-ui-palette-module-type-swatch"}).appendTo(typeDiv);
$('<span>',{class:"red-ui-palette-module-type-node"}).text(t).appendTo(typeDiv);
})
var enableButton = $('<a href="#" class="editor-button editor-button-small"></a>').appendTo(buttonGroup);
var enableButton = $('<a href="#" class="red-ui-button red-ui-button-small"></a>').appendTo(buttonGroup);
enableButton.on("click", function(evt) {
evt.preventDefault();
if (object.setUseCount[setName] === 0) {
@ -726,7 +721,7 @@ RED.palette.editor = (function() {
var installTab = $('<div>',{class:"palette-editor-tab hide"}).appendTo(content);
var installTab = $('<div>',{class:"red-ui-palette-editor-tab hide"}).appendTo(content);
editorTabs.addTab({
id: 'install',
@ -734,9 +729,9 @@ RED.palette.editor = (function() {
content: installTab
})
var toolBar = $('<div>',{class:"palette-editor-toolbar"}).appendTo(installTab);
var toolBar = $('<div>',{class:"red-ui-palette-editor-toolbar"}).appendTo(installTab);
var searchDiv = $('<div>',{class:"palette-search"}).appendTo(installTab);
var searchDiv = $('<div>',{class:"red-ui-palette-search"}).appendTo(installTab);
searchInput = $('<input type="text" data-i18n="[placeholder]palette.search"></input>')
.appendTo(searchDiv)
.searchBox({
@ -761,9 +756,9 @@ RED.palette.editor = (function() {
$('<span>').text(RED._("palette.editor.sort")+' ').appendTo(toolBar);
var sortGroup = $('<span class="button-group"></span>').appendTo(toolBar);
var sortRelevance = $('<a href="#" class="palette-editor-install-sort-option sidebar-header-button-toggle selected"><i class="fa fa-sort-amount-desc"></i></a>').appendTo(sortGroup);
var sortAZ = $('<a href="#" class="palette-editor-install-sort-option sidebar-header-button-toggle" data-i18n="palette.editor.sortAZ"></a>').appendTo(sortGroup);
var sortRecent = $('<a href="#" class="palette-editor-install-sort-option sidebar-header-button-toggle" data-i18n="palette.editor.sortRecent"></a>').appendTo(sortGroup);
var sortRelevance = $('<a href="#" class="red-ui-palette-editor-install-sort-option red-ui-sidebar-header-button-toggle selected"><i class="fa fa-sort-amount-desc"></i></a>').appendTo(sortGroup);
var sortAZ = $('<a href="#" class="red-ui-palette-editor-install-sort-option red-ui-sidebar-header-button-toggle" data-i18n="palette.editor.sortAZ"></a>').appendTo(sortGroup);
var sortRecent = $('<a href="#" class="red-ui-palette-editor-install-sort-option red-ui-sidebar-header-button-toggle" data-i18n="palette.editor.sortRecent"></a>').appendTo(sortGroup);
var sortOpts = [
@ -777,7 +772,7 @@ RED.palette.editor = (function() {
if ($(this).hasClass("selected")) {
return;
}
$(".palette-editor-install-sort-option").removeClass("selected");
$(".red-ui-palette-editor-install-sort-option").removeClass("selected");
$(this).addClass("selected");
activeSort = opt.func;
refreshFilteredItems();
@ -785,7 +780,7 @@ RED.palette.editor = (function() {
});
var refreshSpan = $('<span>').appendTo(toolBar);
var refreshButton = $('<a href="#" class="sidebar-header-button"><i class="fa fa-refresh"></i></a>').appendTo(refreshSpan);
var refreshButton = $('<a href="#" class="red-ui-sidebar-header-button"><i class="fa fa-refresh"></i></a>').appendTo(refreshSpan);
refreshButton.on("click", function(e) {
e.preventDefault();
loadedList = [];
@ -802,8 +797,8 @@ RED.palette.editor = (function() {
return
}
if (object.more) {
container.addClass('palette-module-more');
var moreRow = $('<div>',{class:"palette-module-header palette-module"}).appendTo(container);
container.addClass('red-ui-palette-module-more');
var moreRow = $('<div>',{class:"red-ui-palette-module-header palette-module"}).appendTo(container);
var moreLink = $('<a href="#"></a>').text(RED._('palette.editor.more',{count:object.more})).appendTo(moreRow);
moreLink.on("click", function(e) {
e.preventDefault();
@ -819,15 +814,15 @@ RED.palette.editor = (function() {
}
if (object.info) {
var entry = object.info;
var headerRow = $('<div>',{class:"palette-module-header"}).appendTo(container);
var titleRow = $('<div class="palette-module-meta"><i class="fa fa-cube"></i></div>').appendTo(headerRow);
$('<span>',{class:"palette-module-name"}).text(entry.name||entry.id).appendTo(titleRow);
$('<a target="_blank" class="palette-module-link"><i class="fa fa-external-link"></i></a>').attr('href',entry.url).appendTo(titleRow);
var descRow = $('<div class="palette-module-meta"></div>').appendTo(headerRow);
$('<div>',{class:"palette-module-description"}).text(entry.description).appendTo(descRow);
var metaRow = $('<div class="palette-module-meta"></div>').appendTo(headerRow);
$('<span class="palette-module-version"><i class="fa fa-tag"></i> '+entry.version+'</span>').appendTo(metaRow);
$('<span class="palette-module-updated"><i class="fa fa-calendar"></i> '+formatUpdatedAt(entry.updated_at)+'</span>').appendTo(metaRow);
var headerRow = $('<div>',{class:"red-ui-palette-module-header"}).appendTo(container);
var titleRow = $('<div class="red-ui-palette-module-meta red-ui-palette-module-name"><i class="fa fa-cube"></i></div>').appendTo(headerRow);
$('<span>').text(entry.name||entry.id).appendTo(titleRow);
$('<a target="_blank" class="red-ui-palette-module-link"><i class="fa fa-external-link"></i></a>').attr('href',entry.url).appendTo(titleRow);
var descRow = $('<div class="red-ui-palette-module-meta"></div>').appendTo(headerRow);
$('<div>',{class:"red-ui-palette-module-description"}).text(entry.description).appendTo(descRow);
var metaRow = $('<div class="red-ui-palette-module-meta"></div>').appendTo(headerRow);
$('<span class="red-ui-palette-module-version"><i class="fa fa-tag"></i> '+entry.version+'</span>').appendTo(metaRow);
$('<span class="red-ui-palette-module-updated"><i class="fa fa-calendar"></i> '+formatUpdatedAt(entry.updated_at)+'</span>').appendTo(metaRow);
var duplicateType = false;
if (entry.types && entry.types.length > 0) {
@ -839,12 +834,12 @@ RED.palette.editor = (function() {
break;
}
}
// $('<div>',{class:"palette-module-meta"}).text(entry.types.join(",")).appendTo(headerRow);
// $('<div>',{class:"red-ui-palette-module-meta"}).text(entry.types.join(",")).appendTo(headerRow);
}
var buttonRow = $('<div>',{class:"palette-module-meta"}).appendTo(headerRow);
var buttonGroup = $('<div>',{class:"palette-module-button-group"}).appendTo(buttonRow);
var installButton = $('<a href="#" class="editor-button editor-button-small"></a>').text(RED._('palette.editor.install')).appendTo(buttonGroup);
var buttonRow = $('<div>',{class:"red-ui-palette-module-meta"}).appendTo(headerRow);
var buttonGroup = $('<div>',{class:"red-ui-palette-module-button-group"}).appendTo(buttonRow);
var installButton = $('<a href="#" class="red-ui-button red-ui-button-small"></a>').text(RED._('palette.editor.install')).appendTo(buttonGroup);
installButton.on("click", function(e) {
e.preventDefault();
if (!$(this).hasClass('disabled')) {
@ -875,7 +870,7 @@ RED.palette.editor = (function() {
}
});
$('<div id="palette-module-install-shade" class="palette-module-shade hide"><div class="palette-module-shade-status"></div><img src="red/images/spin.svg" class="palette-spinner"/></div>').appendTo(installTab);
$('<div id="red-ui-palette-module-install-shade" class="red-ui-palette-module-shade hide"><div class="red-ui-palette-module-shade-status"></div><img src="red/images/spin.svg" class="red-ui-palette-spinner"/></div>').appendTo(installTab);
}
function update(entry,version,container,done) {
if (RED.settings.theme('palette.editable') === false) {
@ -894,11 +889,11 @@ RED.palette.editor = (function() {
},
{
text: RED._("palette.editor.confirm.button.update"),
class: "primary palette-module-install-confirm-button-update",
class: "primary red-ui-palette-module-install-confirm-button-update",
click: function() {
var spinner = RED.utils.addSpinnerOverlay(container, true);
var buttonRow = $('<div style="position: relative;bottom: calc(50% + 17px); padding-right: 10px;text-align: right;"></div>').appendTo(spinner);
$('<button class="editor-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
$('<button class="red-ui-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
evt.preventDefault();
RED.actions.invoke("core:show-event-log");
});
@ -953,11 +948,11 @@ RED.palette.editor = (function() {
},
{
text: RED._("palette.editor.confirm.button.remove"),
class: "primary palette-module-install-confirm-button-remove",
class: "primary red-ui-palette-module-install-confirm-button-remove",
click: function() {
var spinner = RED.utils.addSpinnerOverlay(container, true);
var buttonRow = $('<div style="position: relative;bottom: calc(50% + 17px); padding-right: 10px;text-align: right;"></div>').appendTo(spinner);
$('<button class="editor-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
$('<button class="red-ui-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
evt.preventDefault();
RED.actions.invoke("core:show-event-log");
});
@ -1009,7 +1004,7 @@ RED.palette.editor = (function() {
if (entry.url) {
buttons.push({
text: RED._("palette.editor.confirm.button.review"),
class: "primary palette-module-install-confirm-button-install",
class: "primary red-ui-palette-module-install-confirm-button-install",
click: function() {
var url = entry.url||"";
window.open(url);
@ -1018,12 +1013,12 @@ RED.palette.editor = (function() {
}
buttons.push({
text: RED._("palette.editor.confirm.button.install"),
class: "primary palette-module-install-confirm-button-install",
class: "primary red-ui-palette-module-install-confirm-button-install",
click: function() {
var spinner = RED.utils.addSpinnerOverlay(container, true);
var buttonRow = $('<div style="position: relative;bottom: calc(50% + 17px); padding-right: 10px;text-align: right;"></div>').appendTo(spinner);
$('<button class="editor-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
$('<button class="red-ui-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
evt.preventDefault();
RED.actions.invoke("core:show-event-log");
});

197
packages/node_modules/@node-red/editor-client/src/js/ui/palette.js vendored
View File

@ -23,43 +23,43 @@ RED.palette = (function() {
var sidebarControls;
function createCategory(originalCategory,rootCategory,category,ns) {
if ($("#palette-base-category-"+rootCategory).length === 0) {
if ($("#red-ui-palette-base-category-"+rootCategory).length === 0) {
createCategoryContainer(originalCategory,rootCategory, ns+":palette.label."+rootCategory);
}
$("#palette-container-"+rootCategory).show();
if ($("#palette-"+category).length === 0) {
$("#palette-base-category-"+rootCategory).append('<div id="palette-'+category+'"></div>');
$("#red-ui-palette-container-"+rootCategory).show();
if ($("#red-ui-palette-"+category).length === 0) {
$("#red-ui-palette-base-category-"+rootCategory).append('<div id="red-ui-palette-'+category+'"></div>');
}
}
function createCategoryContainer(originalCategory,category, labelId) {
var label = RED._(labelId, {defaultValue:category});
label = (label || category).replace(/_/g, " ");
var catDiv = $('<div id="palette-container-'+category+'" class="palette-category palette-close hide">'+
'<div id="palette-header-'+category+'" class="palette-header"><i class="expanded fa fa-angle-down"></i><span>'+label+'</span></div>'+
'<div class="palette-content" id="palette-base-category-'+category+'">'+
'<div id="palette-'+category+'-input"></div>'+
'<div id="palette-'+category+'-output"></div>'+
'<div id="palette-'+category+'-function"></div>'+
var catDiv = $('<div id="red-ui-palette-container-'+category+'" class="red-ui-palette-category hide">'+
'<div id="red-ui-palette-header-'+category+'" class="red-ui-palette-header"><i class="expanded fa fa-angle-down"></i><span>'+label+'</span></div>'+
'<div class="red-ui-palette-content" id="red-ui-palette-base-category-'+category+'">'+
'<div id="red-ui-palette-'+category+'-input"></div>'+
'<div id="red-ui-palette-'+category+'-output"></div>'+
'<div id="red-ui-palette-'+category+'-function"></div>'+
'</div>'+
'</div>').appendTo("#palette-container");
'</div>').appendTo("#red-ui-palette-container");
catDiv.data('category',originalCategory);
catDiv.data('label',label);
categoryContainers[category] = {
container: catDiv,
close: function() {
catDiv.removeClass("palette-open");
catDiv.addClass("palette-closed");
$("#palette-base-category-"+category).slideUp();
$("#palette-header-"+category+" i").removeClass("expanded");
catDiv.removeClass("red-ui-palette-open");
catDiv.addClass("red-ui-palette-closed");
$("#red-ui-palette-base-category-"+category).slideUp();
$("#red-ui-palette-header-"+category+" i").removeClass("expanded");
},
open: function() {
catDiv.addClass("palette-open");
catDiv.removeClass("palette-closed");
$("#palette-base-category-"+category).slideDown();
$("#palette-header-"+category+" i").addClass("expanded");
catDiv.addClass("red-ui-palette-open");
catDiv.removeClass("red-ui-palette-closed");
$("#red-ui-palette-base-category-"+category).slideDown();
$("#red-ui-palette-header-"+category+" i").addClass("expanded");
},
toggle: function() {
if (catDiv.hasClass("palette-open")) {
if (catDiv.hasClass("red-ui-palette-open")) {
categoryContainers[category].close();
} else {
categoryContainers[category].open();
@ -67,7 +67,7 @@ RED.palette = (function() {
}
};
$("#palette-header-"+category).on('click', function(e) {
$("#red-ui-palette-header-"+category).on('click', function(e) {
categoryContainers[category].toggle();
});
}
@ -85,17 +85,17 @@ RED.palette = (function() {
var displayLines = [];
var currentLine = words[0];
var currentLineWidth = RED.view.calculateTextWidth(currentLine, "palette_label", 0);
var currentLineWidth = RED.view.calculateTextWidth(currentLine, "red-ui-palette-label", 0);
for (var i=1;i<words.length;i++) {
var newWidth = RED.view.calculateTextWidth(currentLine+" "+words[i], "palette_label", 0);
var newWidth = RED.view.calculateTextWidth(currentLine+" "+words[i], "red-ui-palette-label", 0);
if (newWidth < nodeWidth) {
currentLine += " "+words[i];
currentLineWidth = newWidth;
} else {
displayLines.push(currentLine);
currentLine = words[i];
currentLineWidth = RED.view.calculateTextWidth(currentLine, "palette_label", 0);
currentLineWidth = RED.view.calculateTextWidth(currentLine, "red-ui-palette-label", 0);
}
}
displayLines.push(currentLine);
@ -104,10 +104,10 @@ RED.palette = (function() {
var multiLineNodeHeight = 8+(lineHeight*displayLines.length);
el.css({height:multiLineNodeHeight+"px"});
var labelElement = el.find(".palette_label");
var labelElement = el.find(".red-ui-palette-label");
labelElement.html(lines).attr('dir', RED.text.bidi.resolveBaseTextDir(lines));
el.find(".palette_port").css({top:(multiLineNodeHeight/2-5)+"px"});
el.find(".red-ui-palette-port").css({top:(multiLineNodeHeight/2-5)+"px"});
var popOverContent;
try {
@ -145,7 +145,7 @@ RED.palette = (function() {
function setIcon(element,sf) {
var icon_url = RED.utils.getNodeIcon(sf._def);
var iconContainer = element.find(".palette_icon_container");
var iconContainer = element.find(".red-ui-palette-icon-container");
RED.utils.createIconElement(icon_url, iconContainer, true);
}
@ -155,7 +155,7 @@ RED.palette = (function() {
function addNodeType(nt,def) {
var nodeTypeId = escapeNodeType(nt);
if ($("#palette_node_"+nodeTypeId).length) {
if ($("#red-ui-palette-node_"+nodeTypeId).length) {
return;
}
if (exclusion.indexOf(def.category)===-1) {
@ -165,7 +165,7 @@ RED.palette = (function() {
var rootCategory = category.split("-")[0];
var d = document.createElement("div");
d.id = "palette_node_"+nodeTypeId;
d.id = "red-ui-palette-node_"+nodeTypeId;
d.type = nt;
var label = /^(.*?)([ -]in|[ -]out)?$/.exec(nt)[1];
@ -178,17 +178,17 @@ RED.palette = (function() {
}
$('<div/>', {
class: "palette_label"
+ (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " palette_label_right" : "")
class: "red-ui-palette-label"
+ (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " red-ui-palette-label-right" : "")
}).appendTo(d);
d.className="palette_node";
d.className="red-ui-palette-node";
if (def.icon) {
var icon_url = RED.utils.getNodeIcon(def);
var iconContainer = $('<div/>', {
class: "palette_icon_container"
+ (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " palette_icon_container_right" : "")
class: "red-ui-palette-icon-container"
+ (((!def.align && def.inputs !== 0 && def.outputs === 0) || "right" === def.align) ? " red-ui-palette-icon-container-right" : "")
}).appendTo(d);
RED.utils.createIconElement(icon_url, iconContainer, true);
}
@ -197,19 +197,19 @@ RED.palette = (function() {
if (def.outputs > 0) {
var portOut = document.createElement("div");
portOut.className = "palette_port palette_port_output";
portOut.className = "red-ui-palette-port red-ui-palette-port-output";
d.appendChild(portOut);
}
if (def.inputs > 0) {
var portIn = document.createElement("div");
portIn.className = "palette_port palette_port_input";
portIn.className = "red-ui-palette-port red-ui-palette-port-input";
d.appendChild(portIn);
}
createCategory(def.category,rootCategory,category,(coreCategories.indexOf(rootCategory) !== -1)?"node-red":def.set.id);
$("#palette-"+category).append(d);
$("#red-ui-palette-"+category).append(d);
$(d).data('category',rootCategory);
@ -236,15 +236,15 @@ RED.palette = (function() {
RED.view.focus();
var helpText;
if (nt.indexOf("subflow:") === 0) {
helpText = marked(RED.nodes.subflow(nt.substring(8)).info||"")||('<span class="node-info-none">'+RED._("sidebar.info.none")+'</span>');
helpText = marked(RED.nodes.subflow(nt.substring(8)).info||"")||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>');
} else {
helpText = $("script[data-help-name='"+d.type+"']").html()||('<span class="node-info-none">'+RED._("sidebar.info.none")+'</span>');
helpText = $("script[data-help-name='"+d.type+"']").html()||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>');
}
RED.sidebar.info.set(helpText,RED._("sidebar.info.nodeHelp"));
});
var chart = $("#chart");
var chart = $("#red-ui-workspace-chart");
var chartOffset = chart.offset();
var chartSVG = $("#chart>svg").get(0);
var chartSVG = $("#red-ui-workspace-chart>svg").get(0);
var activeSpliceLink;
var mouseX;
var mouseY;
@ -253,16 +253,16 @@ RED.palette = (function() {
var paletteTop;
$(d).draggable({
helper: 'clone',
appendTo: 'body',
appendTo: '#red-ui-editor',
revert: 'invalid',
revertDuration: 300,
containment:'#main-container',
revertDuration: 200,
containment:'#red-ui-main-container',
start: function() {
paletteWidth = $("#palette").width();
paletteTop = $("#palette").parent().position().top + $("#palette-container").position().top;
paletteWidth = $("#red-ui-palette").width();
paletteTop = $("#red-ui-palette").parent().position().top + $("#red-ui-palette-container").position().top;
RED.view.focus();
},
stop: function() { d3.select('.link_splice').classed('link_splice',false); if (spliceTimer) { clearTimeout(spliceTimer); spliceTimer = null;}},
stop: function() { d3.select('.red-ui-flow-link-splice').classed('red-ui-flow-link-splice',false); if (spliceTimer) { clearTimeout(spliceTimer); spliceTimer = null;}},
drag: function(e,ui) {
ui.originalPosition.left = $('#' + e.target.id).offset().left;
@ -293,7 +293,7 @@ RED.palette = (function() {
for (var i=0;i<nodes.length;i++) {
var node = d3.select(nodes[i]);
if (node.classed('link_background') && !node.classed('link_link')) {
if (node.classed('red-ui-flow-link-background') && !node.classed('red-ui-flow-link-link')) {
var length = nodes[i].getTotalLength();
for (var j=0;j<length;j+=10) {
var p = nodes[i].getPointAtLength(j);
@ -306,12 +306,12 @@ RED.palette = (function() {
}
}
if (activeSpliceLink && activeSpliceLink !== bestLink) {
d3.select(activeSpliceLink.parentNode).classed('link_splice',false);
d3.select(activeSpliceLink.parentNode).classed('red-ui-flow-link-splice',false);
}
if (bestLink) {
d3.select(bestLink.parentNode).classed('link_splice',true)
d3.select(bestLink.parentNode).classed('red-ui-flow-link-splice',true)
} else {
d3.select('.link_splice').classed('link_splice',false);
d3.select('.red-ui-flow-link-splice').classed('red-ui-flow-link-splice',false);
}
if (activeSpliceLink !== bestLink) {
if (bestLink) {
@ -338,8 +338,8 @@ RED.palette = (function() {
}
setLabel(nt,$(d),label,nodeInfo);
var categoryNode = $("#palette-container-"+rootCategory);
if (categoryNode.find(".palette_node").length === 1) {
var categoryNode = $("#red-ui-palette-container-"+rootCategory);
if (categoryNode.find(".red-ui-palette-node").length === 1) {
categoryContainers[rootCategory].open();
}
@ -348,12 +348,12 @@ RED.palette = (function() {
function removeNodeType(nt) {
var nodeTypeId = escapeNodeType(nt);
var paletteNode = $("#palette_node_"+nodeTypeId);
var categoryNode = paletteNode.closest(".palette-category");
var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
var categoryNode = paletteNode.closest(".red-ui-palette-category");
paletteNode.remove();
if (categoryNode.find(".palette_node").length === 0) {
if (categoryNode.find(".red-ui-palette-node").length === 0) {
if (categoryNode.find("i").hasClass("expanded")) {
categoryNode.find(".palette-content").slideToggle();
categoryNode.find(".red-ui-palette-content").slideToggle();
categoryNode.find("i").toggleClass("expanded");
}
}
@ -361,10 +361,10 @@ RED.palette = (function() {
function hideNodeType(nt) {
var nodeTypeId = escapeNodeType(nt);
var paletteNode = $("#palette_node_"+nodeTypeId);
var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
paletteNode.hide();
var categoryNode = paletteNode.closest(".palette-category");
var cl = categoryNode.find(".palette_node");
var categoryNode = paletteNode.closest(".red-ui-palette-category");
var cl = categoryNode.find(".red-ui-palette-node");
var c = 0;
for (var i = 0; i < cl.length; i++) {
if ($(cl[i]).css('display') === 'none') { c += 1; }
@ -374,32 +374,32 @@ RED.palette = (function() {
function showNodeType(nt) {
var nodeTypeId = escapeNodeType(nt);
var paletteNode = $("#palette_node_"+nodeTypeId);
var categoryNode = paletteNode.closest(".palette-category");
var paletteNode = $("#red-ui-palette-node_"+nodeTypeId);
var categoryNode = paletteNode.closest(".red-ui-palette-category");
categoryNode.show();
paletteNode.show();
}
function refreshNodeTypes() {
RED.nodes.eachSubflow(function(sf) {
var paletteNode = $("#palette_node_subflow_"+sf.id.replace(".","_"));
var portInput = paletteNode.find(".palette_port_input");
var portOutput = paletteNode.find(".palette_port_output");
var paletteNode = $("#red-ui-palette-node_subflow_"+sf.id.replace(".","_"));
var portInput = paletteNode.find(".red-ui-palette-port-input");
var portOutput = paletteNode.find(".red-ui-palette-port-output");
var paletteLabel = paletteNode.find(".palette_label");
paletteLabel.attr("class","palette_label"
+ (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " palette_label_right" : "")
var paletteLabel = paletteNode.find(".red-ui-palette-label");
paletteLabel.attr("class","red-ui-palette-label"
+ (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " red-ui-palette-label-right" : "")
);
var paletteIconContainer = paletteNode.find(".palette_icon_container");
paletteIconContainer.attr("class","palette_icon_container"
+ (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " palette_icon_container_right" : "")
var paletteIconContainer = paletteNode.find(".red-ui-palette-icon-container");
paletteIconContainer.attr("class","red-ui-palette-icon-container"
+ (((!sf._def.align && sf.in.length !== 0 && sf.out.length === 0) || "right" === sf._def.align) ? " red-ui-palette-icon-container-right" : "")
);
if (portInput.length === 0 && sf.in.length > 0) {
var portIn = document.createElement("div");
portIn.className = "palette_port palette_port_input";
portIn.className = "red-ui-palette-port red-ui-palette-port-input";
paletteNode.append(portIn);
} else if (portInput.length !== 0 && sf.in.length === 0) {
portInput.remove();
@ -407,7 +407,7 @@ RED.palette = (function() {
if (portOutput.length === 0 && sf.out.length > 0) {
var portOut = document.createElement("div");
portOut.className = "palette_port palette_port_output";
portOut.className = "red-ui-palette-port red-ui-palette-port-output";
paletteNode.append(portOut);
} else if (portOutput.length !== 0 && sf.out.length === 0) {
portOutput.remove();
@ -421,17 +421,17 @@ RED.palette = (function() {
var category = newCategory.replace(/ /g,"_");
createCategory(newCategory,category,category,"node-red");
var currentCategoryNode = paletteNode.closest(".palette-category");
var currentCategoryNode = paletteNode.closest(".red-ui-palette-category");
var newCategoryNode = $("#palette-"+category);
newCategoryNode.append(paletteNode);
if (newCategoryNode.find(".palette_node").length === 1) {
if (newCategoryNode.find(".red-ui-palette-node").length === 1) {
categoryContainers[category].open();
}
paletteNode.data('category',newCategory);
if (currentCategoryNode.find(".palette_node").length === 0) {
if (currentCategoryNode.find(".red-ui-palette-node").length === 0) {
if (currentCategoryNode.find("i").hasClass("expanded")) {
currentCategoryNode.find(".palette-content").slideToggle();
currentCategoryNode.find(".red-ui-palette-content").slideToggle();
currentCategoryNode.find("i").toggleClass("expanded");
}
}
@ -444,8 +444,8 @@ RED.palette = (function() {
function filterChange(val) {
var re = new RegExp(val.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'),'i');
$("#palette-container .palette_node").each(function(i,el) {
var currentLabel = $(el).find(".palette_label").text();
$("#red-ui-palette-container .red-ui-palette-node").each(function(i,el) {
var currentLabel = $(el).find(".red-ui-palette-label").text();
if (val === "" || re.test(el.id) || re.test(currentLabel)) {
$(this).show();
} else {
@ -456,7 +456,7 @@ RED.palette = (function() {
for (var category in categoryContainers) {
if (categoryContainers.hasOwnProperty(category)) {
if (categoryContainers[category].container
.find(".palette_node")
.find(".red-ui-palette-node")
.filter(function() { return $(this).css('display') !== 'none'}).length === 0) {
categoryContainers[category].close();
} else {
@ -468,6 +468,13 @@ RED.palette = (function() {
function init() {
$('<img src="red/images/spin.svg" class="red-ui-palette-spinner hide"/>').appendTo("#red-ui-palette");
$('<div id="red-ui-palette-search" class="red-ui-palette-search hide"><input type="text" data-i18n="[placeholder]palette.filter"></input></div>').appendTo("#red-ui-palette");
$('<div id="red-ui-palette-container" class="red-ui-palette-scroll hide"></div>').appendTo("#red-ui-palette");
$('<div class="red-ui-component-footer"></div>').appendTo("#red-ui-palette");
$('<div id="red-ui-palette-shade" class="hide"></div>').appendTo("#red-ui-palette");
RED.events.on('registry:node-type-added', function(nodeType) {
var def = RED.nodes.getType(nodeType);
addNodeType(nodeType,def);
@ -508,25 +515,27 @@ RED.palette = (function() {
}
});
$("#palette > .palette-spinner").show();
$("#red-ui-palette > .red-ui-palette-spinner").show();
$("#palette-search input").searchBox({
$("#red-ui-palette-search input").searchBox({
delay: 100,
change: function() {
filterChange($(this).val());
}
})
sidebarControls = $('<div class="sidebar-control-left"><i class="fa fa-chevron-left"</div>').appendTo($("#palette"));
sidebarControls = $('<div class="red-ui-sidebar-control-left"><i class="fa fa-chevron-left"></i></div>').appendTo($("#red-ui-palette"));
RED.popover.tooltip(sidebarControls,RED._("keyboard.togglePalette"),"core:toggle-palette");
sidebarControls.on("click", function() {
RED.menu.toggleSelected("menu-item-palette");
})
$("#palette").on("mouseenter", function() {
$("#red-ui-palette").on("mouseenter", function() {
sidebarControls.toggle("slide", { direction: "left" }, 200);
})
$("#palette").on("mouseleave", function() {
$("#red-ui-palette").on("mouseleave", function() {
sidebarControls.stop(false,true);
sidebarControls.hide();
})
@ -546,7 +555,10 @@ RED.palette = (function() {
createCategoryContainer(category, category, "palette.label."+category);
});
$("#palette-collapse-all").on("click", function(e) {
var paletteFooterButtons = $('<span class="button-group"></span>').appendTo("#red-ui-palette .red-ui-component-footer");
var paletteCollapseAll = $('<button type="button" class="red-ui-footer-button"><i class="fa fa-angle-double-up"></i></button>').appendTo(paletteFooterButtons);
paletteCollapseAll.on("click", function(e) {
e.preventDefault();
for (var cat in categoryContainers) {
if (categoryContainers.hasOwnProperty(cat)) {
@ -554,9 +566,10 @@ RED.palette = (function() {
}
}
});
RED.popover.tooltip($("#palette-collapse-all"),RED._('palette.actions.collapse-all'));
RED.popover.tooltip(paletteCollapseAll,RED._('palette.actions.collapse-all'));
$("#palette-expand-all").on("click", function(e) {
var paletteExpandAll = $('<button type="button" class="red-ui-footer-button"><i class="fa fa-angle-double-down"></i></button>').appendTo(paletteFooterButtons);
paletteExpandAll.on("click", function(e) {
e.preventDefault();
for (var cat in categoryContainers) {
if (categoryContainers.hasOwnProperty(cat)) {
@ -564,7 +577,7 @@ RED.palette = (function() {
}
}
});
RED.popover.tooltip($("#palette-expand-all"),RED._('palette.actions.expand-all'));
RED.popover.tooltip(paletteExpandAll,RED._('palette.actions.expand-all'));
RED.actions.add("core:toggle-palette", function(state) {
if (state === undefined) {
@ -576,11 +589,11 @@ RED.palette = (function() {
}
function togglePalette(state) {
if (!state) {
$("#main-container").addClass("palette-closed");
$("#red-ui-main-container").addClass("red-ui-palette-closed");
sidebarControls.hide();
sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left");
} else {
$("#main-container").removeClass("palette-closed");
$("#red-ui-main-container").removeClass("red-ui-palette-closed");
sidebarControls.find("i").removeClass("fa-chevron-right").addClass("fa-chevron-left");
}
setTimeout(function() { $(window).trigger("resize"); } ,200);
@ -589,7 +602,7 @@ RED.palette = (function() {
function getCategories() {
var categories = [];
$("#palette-container .palette-category").each(function(i,d) {
$("#red-ui-palette-container .red-ui-palette-category").each(function(i,d) {
categories.push({id:$(d).data('category'),label:$(d).data('label')});
})
return categories;

191
packages/node_modules/@node-red/editor-client/src/js/ui/projects/projectSettings.js vendored
View File

@ -46,7 +46,6 @@ RED.projects.settings = (function() {
}
settingsVisible = true;
var tabContainer;
var trayOptions = {
title: RED._("sidebar.project.projectSettings.title"),
@ -66,9 +65,9 @@ RED.projects.settings = (function() {
open: function(tray) {
var project = RED.projects.getActiveProject();
var trayBody = tray.find('.editor-tray-body');
var trayBody = tray.find('.red-ui-tray-body');
var settingsContent = $('<div></div>').appendTo(trayBody);
var tabContainer = $('<div></div>',{id:"user-settings-tabs-container"}).appendTo(settingsContent);
var tabContainer = $('<div></div>',{class:"red-ui-settings-tabs-container"}).appendTo(settingsContent);
$('<ul></ul>',{id:"user-settings-tabs"}).appendTo(tabContainer);
var settingsTabs = RED.tabs.create({
@ -76,7 +75,7 @@ RED.projects.settings = (function() {
vertical: true,
onchange: function(tab) {
setTimeout(function() {
$("#user-settings-tabs-content").children().hide();
tabContents.children().hide();
$("#" + tab.id).show();
if (tab.pane.focus) {
tab.pane.focus();
@ -84,19 +83,19 @@ RED.projects.settings = (function() {
},50);
}
});
var tabContents = $('<div></div>',{id:"user-settings-tabs-content"}).appendTo(settingsContent);
var tabContents = $('<div></div>',{class:"red-ui-settings-tabs-content"}).appendTo(settingsContent);
panes.forEach(function(pane) {
settingsTabs.addTab({
id: "project-settings-tab-"+pane.id,
id: "red-ui-project-settings-tab-"+pane.id,
label: pane.title,
pane: pane
});
pane.get(project).hide().appendTo(tabContents);
});
settingsContent.i18n();
settingsTabs.activateTab("project-settings-tab-"+(initialTab||'main'))
$("#sidebar-shade").show();
settingsTabs.activateTab("red-ui-project-settings-tab-"+(initialTab||'main'))
$("#red-ui-sidebar-shade").show();
},
close: function() {
settingsVisible = false;
@ -105,7 +104,7 @@ RED.projects.settings = (function() {
pane.close();
}
});
$("#sidebar-shade").hide();
$("#red-ui-sidebar-shade").hide();
},
show: function() {}
@ -161,10 +160,10 @@ RED.projects.settings = (function() {
if (activeProject.description) {
desc = marked(activeProject.description);
} else {
desc = '<span class="node-info-none">'+'No description available'+'</span>';
desc = '<span class="red-ui-help-info-none">'+'No description available'+'</span>';
}
var description = addTargetToExternalLinks($('<span class="bidiAware" dir=\"'+RED.text.bidi.resolveBaseTextDir(desc)+'">'+desc+'</span>')).appendTo(container);
description.find(".bidiAware").contents().filter(function() { return this.nodeType === 3 && this.textContent.trim() !== "" }).wrap( "<span></span>" );
var description = addTargetToExternalLinks($('<span class="red-ui-text-bidi-aware" dir=\"'+RED.text.bidi.resolveBaseTextDir(desc)+'">'+desc+'</span>')).appendTo(container);
description.find(".red-ui-text-bidi-aware").contents().filter(function() { return this.nodeType === 3 && this.textContent.trim() !== "" }).wrap( "<span></span>" );
}
function editSummary(activeProject, summary, container) {
@ -173,14 +172,14 @@ RED.projects.settings = (function() {
container.empty();
var bg = $('<span class="button-row" style="position: relative; float: right; margin-right:0;"></span>').appendTo(container);
var input = $('<input type="text" style="width: calc(100% - 150px); margin-right: 10px;">').val(summary||"").appendTo(container);
$('<button class="editor-button">' + RED._("common.label.cancel") + '</button>')
$('<button class="red-ui-button">' + RED._("common.label.cancel") + '</button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
updateProjectSummary(activeProject.summary, container);
editButton.show();
});
$('<button class="editor-button">' + RED._("common.label.save") + '</button>')
$('<button class="red-ui-button">' + RED._("common.label.save") + '</button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
@ -223,19 +222,19 @@ RED.projects.settings = (function() {
if (summary) {
container.text(summary).removeClass('node-info-node');
} else {
container.text(RED._("sidebar.project.projectSettings.noSummaryAvailable")).addClass('node-info-none');
container.text(RED._("sidebar.project.projectSettings.noSummaryAvailable")).addClass('red-ui-help-info-none');
}
}
function createMainPane(activeProject) {
var pane = $('<div id="project-settings-tab-main" class="project-settings-tab-pane node-help"></div>');
var pane = $('<div id="red-ui-project-settings-tab-main" class="red-ui-project-settings-tab-pane red-ui-help"></div>');
$('<h1>').text(activeProject.name).appendTo(pane);
var summary = $('<div style="position: relative">').appendTo(pane);
var summaryContent = $('<div></div>',{style:"color: #999"}).appendTo(summary);
var summaryContent = $('<div></div>').appendTo(summary);
updateProjectSummary(activeProject.summary, summaryContent);
if (RED.user.hasPermission("projects.write")) {
$('<button class="editor-button editor-button-small" style="float: right;">' + RED._('sidebar.project.editDescription') + '</button>')
$('<button class="red-ui-button red-ui-button-small" style="float: right;">' + RED._('sidebar.project.editDescription') + '</button>')
.prependTo(summary)
.on("click", function(evt) {
evt.preventDefault();
@ -244,13 +243,13 @@ RED.projects.settings = (function() {
}
$('<hr>').appendTo(pane);
var description = $('<div class="node-help" style="position: relative"></div>').appendTo(pane);
var description = $('<div class="red-ui-help" style="position: relative"></div>').appendTo(pane);
var descriptionContent = $('<div>',{style:"min-height: 200px"}).appendTo(description);
updateProjectDescription(activeProject, descriptionContent);
if (RED.user.hasPermission("projects.write")) {
$('<button class="editor-button editor-button-small" style="float: right;">' + RED._('sidebar.project.editReadme') + '</button>')
$('<button class="red-ui-button red-ui-button-small" style="float: right;">' + RED._('sidebar.project.editReadme') + '</button>')
.prependTo(description)
.on("click", function(evt) {
evt.preventDefault();
@ -323,7 +322,7 @@ RED.projects.settings = (function() {
function saveDependencies(depsList,container,dependencies,complete) {
var activeProject = RED.projects.getActiveProject();
var spinner = utils.addSpinnerOverlay(container).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(container).addClass('red-ui-component-spinner-contain');
var done = function(err,res) {
spinner.remove();
if (err) {
@ -379,9 +378,9 @@ RED.projects.settings = (function() {
}
function createDependenciesPane(activeProject) {
var pane = $('<div id="project-settings-tab-deps" class="project-settings-tab-pane node-help"></div>');
var pane = $('<div id="red-ui-project-settings-tab-deps" class="red-ui-project-settings-tab-pane red-ui-help"></div>');
if (RED.user.hasPermission("projects.write")) {
$('<button class="editor-button editor-button-small" style="margin-top:10px;float: right;">' + RED._("sidebar.project.projectSettings.edit") + '</button>')
$('<button class="red-ui-button red-ui-button-small" style="margin-top:10px;float: right;">' + RED._("sidebar.project.projectSettings.edit") + '</button>')
.appendTo(pane)
.on("click", function(evt) {
evt.preventDefault();
@ -393,17 +392,17 @@ RED.projects.settings = (function() {
addButton: false,
addItem: function(row,index,entry) {
// console.log(entry);
var headerRow = $('<div>',{class:"palette-module-header"}).appendTo(row);
var headerRow = $('<div>',{class:"red-ui-palette-module-header"}).appendTo(row);
if (entry.label) {
if (entry.index === 0) {
headerRow.addClass("red-ui-search-empty")
} else {
row.parent().addClass("palette-module-section");
row.parent().addClass("red-ui-palette-module-section");
}
headerRow.text(entry.label);
// if (RED.user.hasPermission("projects.write")) {
// if (entry.index === 1) {
// var addButton = $('<button class="editor-button editor-button-small palette-module-button">add to project</button>').appendTo(headerRow).on("click", function(evt) {
// var addButton = $('<button class="red-ui-button red-ui-button-small red-ui-palette-module-button">add to project</button>').appendTo(headerRow).on("click", function(evt) {
// evt.preventDefault();
// var deps = $.extend(true, {}, activeProject.dependencies);
// for (var m in modulesInUse) {
@ -414,7 +413,7 @@ RED.projects.settings = (function() {
// editDependencies(activeProject,JSON.stringify(deps,"",4),pane,depsList);
// });
// } else if (entry.index === 3) {
// var removeButton = $('<button class="editor-button editor-button-small palette-module-button">remove from project</button>').appendTo(headerRow).on("click", function(evt) {
// var removeButton = $('<button class="red-ui-button red-ui-button-small red-ui-palette-module-button">remove from project</button>').appendTo(headerRow).on("click", function(evt) {
// evt.preventDefault();
// var deps = $.extend(true, {}, activeProject.dependencies);
// for (var m in activeProject.dependencies) {
@ -427,17 +426,17 @@ RED.projects.settings = (function() {
// }
// }
} else {
headerRow.addClass("palette-module-header");
headerRow.addClass("red-ui-palette-module-header");
if (!entry.installed) {
headerRow.addClass("palette-module-not-installed");
headerRow.addClass("red-ui-palette-module-not-installed");
} else if (entry.count === 0) {
headerRow.addClass("palette-module-unused");
headerRow.addClass("red-ui-palette-module-unused");
} else if (!entry.known) {
headerRow.addClass("palette-module-unknown");
headerRow.addClass("red-ui-palette-module-unknown");
}
entry.element = headerRow;
var titleRow = $('<div class="palette-module-meta palette-module-name"></div>').appendTo(headerRow);
var titleRow = $('<div class="red-ui-palette-module-meta red-ui-palette-module-name"></div>').appendTo(headerRow);
var iconClass = "fa-cube";
if (!entry.installed) {
iconClass = "fa-warning";
@ -445,13 +444,13 @@ RED.projects.settings = (function() {
var icon = $('<i class="fa '+iconClass+'"></i>').appendTo(titleRow);
entry.icon = icon;
$('<span>').text(entry.id).appendTo(titleRow);
var metaRow = $('<div class="palette-module-meta palette-module-version"><i class="fa fa-tag"></i></div>').appendTo(headerRow);
var metaRow = $('<div class="red-ui-palette-module-meta red-ui-palette-module-version"><i class="fa fa-tag"></i></div>').appendTo(headerRow);
var versionSpan = $('<span>').text(entry.version).appendTo(metaRow);
metaRow = $('<div class="palette-module-meta"></div>').appendTo(headerRow);
var buttons = $('<div class="palette-module-button-group"></div>').appendTo(metaRow);
metaRow = $('<div class="red-ui-palette-module-meta"></div>').appendTo(headerRow);
var buttons = $('<div class="red-ui-palette-module-button-group"></div>').appendTo(metaRow);
if (RED.user.hasPermission("projects.write")) {
if (!entry.installed && RED.settings.theme('palette.editable') !== false) {
$('<a href="#" class="editor-button editor-button-small">' + RED._("sidebar.project.projectSettings.install") + '</a>').appendTo(buttons)
$('<a href="#" class="red-ui-button red-ui-button-small">' + RED._("sidebar.project.projectSettings.install") + '</a>').appendTo(buttons)
.on("click", function(evt) {
evt.preventDefault();
RED.palette.editor.install(entry,row,function(err) {
@ -472,7 +471,7 @@ RED.projects.settings = (function() {
});
})
} else if (entry.known && entry.count === 0) {
$('<a href="#" class="editor-button editor-button-small">' + RED._("sidebar.project.projectSettings.removeFromProject") + '</a>').appendTo(buttons)
$('<a href="#" class="red-ui-button red-ui-button-small">' + RED._("sidebar.project.projectSettings.removeFromProject") + '</a>').appendTo(buttons)
.on("click", function(evt) {
evt.preventDefault();
var deps = $.extend(true, {}, activeProject.dependencies);
@ -488,7 +487,7 @@ RED.projects.settings = (function() {
});
});
} else if (!entry.known) {
$('<a href="#" class="editor-button editor-button-small">' + RED._("sidebar.project.projectSettings.addToProject") + '</a>').appendTo(buttons)
$('<a href="#" class="red-ui-button red-ui-button-small">' + RED._("sidebar.project.projectSettings.addToProject") + '</a>').appendTo(buttons)
.on("click", function(evt) {
evt.preventDefault();
var deps = $.extend(true, {}, activeProject.dependencies);
@ -496,7 +495,7 @@ RED.projects.settings = (function() {
saveDependencies(depsList,row,deps,function(err) {
if (!err) {
buttons.remove();
headerRow.removeClass("palette-module-unknown");
headerRow.removeClass("red-ui-palette-module-unknown");
} else {
console.log(err);
}
@ -531,7 +530,7 @@ RED.projects.settings = (function() {
var dialogBody;
var filesList;
var selected;
var container = $('<div class="project-file-listing-container"></div>',{style:"position: relative; min-height: 175px; height: 175px;"}).hide().appendTo(row);
var container = $('<div class="red-ui-projects-file-listing-container"></div>',{style:"position: relative; min-height: 175px; height: 175px;"}).hide().appendTo(row);
var spinner = utils.addSpinnerOverlay(container);
$.getJSON("projects/"+activeProject.name+"/files",function(result) {
var fileNames = Object.keys(result);
@ -579,13 +578,13 @@ RED.projects.settings = (function() {
function createFileSubList(container, files, current, selectFilter, onselect, style) {
style = style || "";
var list = $('<ol>',{class:"projects-dialog-file-list", style:style}).appendTo(container).editableList({
var list = $('<ol>',{class:"red-ui-projects-dialog-file-list", style:style}).appendTo(container).editableList({
addButton: false,
scrollOnAdd: false,
addItem: function(row,index,entry) {
var header = $('<div></div>',{class:"projects-dialog-file-list-entry"}).appendTo(row);
var header = $('<div></div>',{class:"red-ui-projects-dialog-file-list-entry"}).appendTo(row);
if (entry.children) {
$('<span class="projects-dialog-file-list-entry-folder"><i class="fa fa-angle-right"></i> <i class="fa fa-folder-o"></i></span>').appendTo(header);
$('<span class="red-ui-projects-dialog-file-list-entry-folder"><i class="fa fa-angle-right"></i> <i class="fa fa-folder-o"></i></span>').appendTo(header);
if (entry.children.length > 0) {
var children = $('<div></div>',{style:"padding-left: 20px;"}).appendTo(row);
if (current.indexOf(entry.path+"/") === 0) {
@ -616,16 +615,16 @@ RED.projects.settings = (function() {
fileIcon = "fa-book";
} else if (/^\.git/i.test(entry.name)) {
fileIcon = "fa-code-fork";
header.addClass("projects-dialog-file-list-entry-file-type-git");
header.addClass("red-ui-projects-dialog-file-list-entry-file-type-git");
}
$('<span class="projects-dialog-file-list-entry-file"> <i class="fa '+fileIcon+'"></i></span>').appendTo(header);
$('<span class="red-ui-projects-dialog-file-list-entry-file"> <i class="fa '+fileIcon+'"></i></span>').appendTo(header);
if (selectFilter(entry)) {
header.addClass("selectable");
if (entry.path === current) {
header.addClass("selected");
}
header.on("click", function(e) {
$(".projects-dialog-file-list-entry.selected").removeClass("selected");
$(".red-ui-projects-dialog-file-list-entry.selected").removeClass("selected");
$(this).addClass("selected");
onselect(entry.path,true);
})
@ -637,7 +636,7 @@ RED.projects.settings = (function() {
header.addClass("unselectable");
}
}
$('<span class="projects-dialog-file-list-entry-name" style=""></span>').text(entry.name).appendTo(header);
$('<span class="red-ui-projects-dialog-file-list-entry-name" style=""></span>').text(entry.name).appendTo(header);
}
});
if (!style) {
@ -654,7 +653,7 @@ RED.projects.settings = (function() {
//
// var flowFileInput = $('<input id="" type="text" style="width: calc(100% - 300px);">').val(flowFile).insertAfter(flowFileLabel);
//
// var flowFileInputSearch = $('<button class="editor-button" style="margin-left: 10px"><i class="fa fa-folder-open-o"></i></button>')
// var flowFileInputSearch = $('<button class="red-ui-button" style="margin-left: 10px"><i class="fa fa-folder-open-o"></i></button>')
// .insertAfter(flowFileInput)
// .on("click", function(e) {
// showProjectFileListing(activeProject,'Select flow file',flowFileInput.val(),function(result) {
@ -671,7 +670,7 @@ RED.projects.settings = (function() {
// flowFileLabel.hide();
//
// var bg = $('<span class="button-group" style="position: relative; float: right; margin-right:0;"></span>').prependTo(container);
// $('<button class="editor-button">Cancel</button>')
// $('<button class="red-ui-button">Cancel</button>')
// .appendTo(bg)
// .on("click", function(evt) {
// evt.preventDefault();
@ -682,7 +681,7 @@ RED.projects.settings = (function() {
// bg.remove();
// editButton.show();
// });
// var saveButton = $('<button class="editor-button">Save</button>')
// var saveButton = $('<button class="red-ui-button">Save</button>')
// .appendTo(bg)
// .on("click", function(evt) {
// evt.preventDefault();
@ -729,9 +728,9 @@ RED.projects.settings = (function() {
function createFilesSection(activeProject,pane) {
var title = $('<h3></h3>').text(RED._("sidebar.project.projectSettings.files")).appendTo(pane);
var filesContainer = $('<div class="user-settings-section"></div>').appendTo(pane);
var filesContainer = $('<div class="red-ui-settings-section"></div>').appendTo(pane);
if (RED.user.hasPermission("projects.write")) {
var editFilesButton = $('<button type="button" id="project-settings-tab-settings-file-edit" class="editor-button editor-button-small" style="float: right;">' + RED._('sidebar.project.projectSettings.edit') + '</button>')
var editFilesButton = $('<button type="button" id="red-ui-project-settings-tab-settings-file-edit" class="red-ui-button red-ui-button-small" style="float: right;">' + RED._('sidebar.project.projectSettings.edit') + '</button>')
.appendTo(title)
.on("click", function(evt) {
evt.preventDefault();
@ -740,7 +739,7 @@ RED.projects.settings = (function() {
// packageFileLabelText.hide();
if (!activeProject.files.package) {
packageFileSubLabel.find(".projects-edit-form-sublabel-text").text(RED._("sidebar.project.projectSettings.packageCreate"));
packageFileSubLabel.find(".red-ui-projects-edit-form-sublabel-text").text(RED._("sidebar.project.projectSettings.packageCreate"));
packageFileSubLabel.show();
}
@ -754,7 +753,7 @@ RED.projects.settings = (function() {
// credentialStateLabel.parent().hide();
credentialStateLabel.addClass("uneditable-input");
$(".user-settings-row-credentials").show();
$(".red-ui-settings-row-credentials").show();
credentialStateLabel.css('height','auto');
credentialFormRows.hide();
credentialSecretButtons.show();
@ -763,19 +762,19 @@ RED.projects.settings = (function() {
var row;
// Flow files
row = $('<div class="user-settings-row"></div>').appendTo(filesContainer);
row = $('<div class="red-ui-settings-row"></div>').appendTo(filesContainer);
$('<label for=""></label>').text(RED._("sidebar.project.projectSettings.package")).appendTo(row);
var packageFileLabel = $('<div class="uneditable-input" style="padding:0">').appendTo(row);
var packageFileLabelText = $('<span style="display:inline-block; padding: 6px">').text(activeProject.files.package||"package.json").appendTo(packageFileLabel);
var packageFileInput = $('<input type="hidden">').val(activeProject.files.package||"package.json").appendTo(packageFileLabel);
var packageFileInputSearch = $('<button type="button" class="editor-button toggle single" style="border-top-right-radius: 4px; border-bottom-right-radius: 4px; width: 36px; height: 34px; position: absolute; top: -1px; right: -1px;"><i class="fa fa-folder-open-o"></i></button>')
var packageFileInputSearch = $('<button type="button" class="red-ui-button toggle single" style="border-top-right-radius: 4px; border-bottom-right-radius: 4px; width: 36px; height: 34px; position: absolute; top: -1px; right: -1px;"><i class="fa fa-folder-open-o"></i></button>')
.hide()
.appendTo(packageFileLabel)
.on("click", function(e) {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
packageFileLabel.find('.project-file-listing-container').slideUp(200,function() {
packageFileLabel.find('.red-ui-projects-file-listing-container').slideUp(200,function() {
$(this).remove();
packageFileLabel.css('height','');
});
@ -808,9 +807,9 @@ RED.projects.settings = (function() {
}
})
RED.popover.tooltip(packageFileInputSearch,RED._("sidebar.project.projectSettings.selectFile"));
var packageFileSubLabel = $('<label style="margin-left: 110px" class="projects-edit-form-sublabel"><small><span class="form-warning"><i class="fa fa-warning"></i> <span class="projects-edit-form-sublabel-text"></span></small></label>').appendTo(row).hide();
var packageFileSubLabel = $('<label style="margin-left: 110px" class="red-ui-projects-edit-form-sublabel"><small><span class="form-warning"><i class="fa fa-warning"></i> <span class="red-ui-projects-edit-form-sublabel-text"></span></small></label>').appendTo(row).hide();
if (!activeProject.files.package) {
packageFileSubLabel.find(".projects-edit-form-sublabel-text").text(RED._("sidebar.project.projectSettings.fileNotExist"));
packageFileSubLabel.find(".red-ui-projects-edit-form-sublabel-text").text(RED._("sidebar.project.projectSettings.fileNotExist"));
packageFileSubLabel.show();
}
@ -819,7 +818,7 @@ RED.projects.settings = (function() {
var projectRoot = projectPackage.substring(0,projectPackage.length - 12);
// Flow files
row = $('<div class="user-settings-row"></div>').appendTo(filesContainer);
row = $('<div class="red-ui-settings-row"></div>').appendTo(filesContainer);
$('<label for=""></label>').text(RED._("sidebar.project.projectSettings.flow")).appendTo(row);
var flowFileLabel = $('<div class="uneditable-input" style="padding:0">').appendTo(row);
var flowFileLabelPrefixText = $('<span style="display:inline-block; padding: 6px 0 6px 6px">').text(projectRoot).appendTo(flowFileLabel);
@ -838,13 +837,13 @@ RED.projects.settings = (function() {
});
}
var flowFileInput = $('<input type="text" style="padding-left:1px; margin-top: -2px; margin-bottom: 0;border: none;">').val(flowFileName).hide().appendTo(flowFileLabel);
var flowFileInputSearch = $('<button type="button" class="editor-button toggle single" style="border-top-right-radius: 4px; border-bottom-right-radius: 4px; width: 36px; height: 34px; position: absolute; top: -1px; right: -1px;"><i class="fa fa-folder-open-o"></i></button>')
var flowFileInputSearch = $('<button type="button" class="red-ui-button toggle single" style="border-top-right-radius: 4px; border-bottom-right-radius: 4px; width: 36px; height: 34px; position: absolute; top: -1px; right: -1px;"><i class="fa fa-folder-open-o"></i></button>')
.hide()
.appendTo(flowFileLabel)
.on("click", function(e) {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
flowFileLabel.find('.project-file-listing-container').slideUp(200,function() {
flowFileLabel.find('.red-ui-projects-file-listing-container').slideUp(200,function() {
$(this).remove();
flowFileLabel.css('height','');
});
@ -879,7 +878,7 @@ RED.projects.settings = (function() {
})
RED.popover.tooltip(flowFileInputSearch,RED._("sidebar.project.projectSettings.selectFile"));
row = $('<div class="user-settings-row"></div>').appendTo(filesContainer);
row = $('<div class="red-ui-settings-row"></div>').appendTo(filesContainer);
$('<label for=""></label>').text(RED._("sidebar.project.projectSettings.credentials")).appendTo(row);
var credFileName = "flows_cred.json";
@ -942,7 +941,7 @@ RED.projects.settings = (function() {
// }
row = $('<div class="user-settings-row"></div>').appendTo(filesContainer);
row = $('<div class="red-ui-settings-row"></div>').appendTo(filesContainer);
$('<label></label>').appendTo(row);
var credentialStateLabel = $('<span><i class="user-settings-credentials-state-icon fa"></i> <span class="user-settings-credentials-state"></span></span>').appendTo(row);
@ -950,7 +949,7 @@ RED.projects.settings = (function() {
credentialStateLabel.css('color','#666');
credentialSecretButtons.css('vertical-align','top');
var credentialSecretResetButton = $('<button type="button" class="editor-button" style="vertical-align: top; width: 36px; margin-bottom: 10px"><i class="fa fa-trash-o"></i></button>')
var credentialSecretResetButton = $('<button type="button" class="red-ui-button" style="vertical-align: top; width: 36px; margin-bottom: 10px"><i class="fa fa-trash-o"></i></button>')
.appendTo(credentialSecretButtons)
.on("click", function(e) {
e.preventDefault();
@ -974,7 +973,7 @@ RED.projects.settings = (function() {
});
RED.popover.tooltip(credentialSecretResetButton,RED._("sidebar.project.projectSettings.resetTheEncryptionKey"));
var credentialSecretEditButton = $('<button type="button" class="editor-button" style="border-top-right-radius: 4px; border-bottom-right-radius: 4px; vertical-align: top; width: 36px; margin-bottom: 10px"><i class="fa fa-pencil"></i></button>')
var credentialSecretEditButton = $('<button type="button" class="red-ui-button" style="border-top-right-radius: 4px; border-bottom-right-radius: 4px; vertical-align: top; width: 36px; margin-bottom: 10px"><i class="fa fa-pencil"></i></button>')
.appendTo(credentialSecretButtons)
.on("click", function(e) {
e.preventDefault();
@ -1006,7 +1005,7 @@ RED.projects.settings = (function() {
RED.popover.tooltip(credentialSecretEditButton,RED._("sidebar.project.projectSettings.changeTheEncryptionKey"));
row = $('<div class="user-settings-row user-settings-row-credentials"></div>').hide().appendTo(filesContainer);
row = $('<div class="red-ui-settings-row red-ui-settings-row-credentials"></div>').hide().appendTo(filesContainer);
@ -1016,7 +1015,7 @@ RED.projects.settings = (function() {
var credentialChangeLabel = $('<div style="margin: 20px 0 10px 5px;">' + RED._("sidebar.project.projectSettings.changeTheEncryptionKey") + '</div>').hide().appendTo(credentialFormRows);
var credentialResetLabel = $('<div style="margin: 20px 0 10px 5px;">' + RED._("sidebar.project.projectSettings.resetTheEncryptionKey") + '</div>').hide().appendTo(credentialFormRows);
var credentialSecretExistingRow = $('<div class="user-settings-row user-settings-row-credentials"></div>').appendTo(credentialFormRows);
var credentialSecretExistingRow = $('<div class="red-ui-settings-row red-ui-settings-row-credentials"></div>').appendTo(credentialFormRows);
$('<label for=""></label>').text(RED._("sidebar.project.projectSettings.currentKey")).appendTo(credentialSecretExistingRow);
var credentialSecretExistingInput = $('<input type="password">').appendTo(credentialSecretExistingRow)
.on("change keyup paste",function() {
@ -1027,7 +1026,7 @@ RED.projects.settings = (function() {
checkFiles();
});
var credentialSecretNewRow = $('<div class="user-settings-row user-settings-row-credentials"></div>').appendTo(credentialFormRows);
var credentialSecretNewRow = $('<div class="red-ui-settings-row red-ui-settings-row-credentials"></div>').appendTo(credentialFormRows);
$('<label for=""></label>').text(RED._("sidebar.project.projectSettings.newKey")).appendTo(credentialSecretNewRow);
@ -1051,11 +1050,11 @@ RED.projects.settings = (function() {
credentialStateLabel.css('height','');
flowFileInputSearch.removeClass('selected');
flowFileLabel.find('.project-file-listing-container').remove();
flowFileLabel.find('.red-ui-projects-file-listing-container').remove();
flowFileLabel.css('height','');
flowFileLabel.css('color','');
$(".user-settings-row-credentials").hide();
$(".red-ui-settings-row-credentials").hide();
credentialFormRows.hide();
credentialSecretButtons.hide();
credentialSecretResetButton.removeClass("selected");
@ -1065,7 +1064,7 @@ RED.projects.settings = (function() {
}
var formButtons = $('<span class="button-row" style="position: relative; float: right; margin-right:0;"></span>').hide().appendTo(filesContainer);
$('<button type="button" class="editor-button">' + RED._("common.label.cancel") + '</button>')
$('<button type="button" class="red-ui-button">' + RED._("common.label.cancel") + '</button>')
.appendTo(formButtons)
.on("click", function(evt) {
evt.preventDefault();
@ -1075,7 +1074,7 @@ RED.projects.settings = (function() {
credFileLabelPrefixText.text(projectRoot);
packageFileLabelText.text(activeProject.files.package||"package.json");
if (!activeProject.files.package) {
packageFileSubLabel.find(".projects-edit-form-sublabel-text").text(RED._("sidebar.project.projectSettings.fileNotExist"));
packageFileSubLabel.find(".red-ui-projects-edit-form-sublabel-text").text(RED._("sidebar.project.projectSettings.fileNotExist"));
packageFileSubLabel.show();
} else {
packageFileSubLabel.hide();
@ -1084,7 +1083,7 @@ RED.projects.settings = (function() {
credFileLabelText.text(credFileName);
hideEditForm();
});
var saveButton = $('<button type="button" class="editor-button">' + RED._("common.label.save") + '</button>')
var saveButton = $('<button type="button" class="red-ui-button">' + RED._("common.label.save") + '</button>')
.appendTo(formButtons)
.on("click", function(evt) {
evt.preventDefault();
@ -1179,10 +1178,10 @@ RED.projects.settings = (function() {
}
function createLocalBranchListSection(activeProject,pane) {
var localBranchContainer = $('<div class="user-settings-section"></div>').appendTo(pane);
var localBranchContainer = $('<div class="red-ui-settings-section"></div>').appendTo(pane);
$('<h4></h4>').text(RED._("sidebar.project.projectSettings.branches")).appendTo(localBranchContainer);
var row = $('<div class="user-settings-row projects-dialog-list"></div>').appendTo(localBranchContainer);
var row = $('<div class="red-ui-settings-row red-ui-projects-dialog-list"></div>').appendTo(localBranchContainer);
var branchList = $('<ol>').appendTo(row).editableList({
@ -1190,7 +1189,7 @@ RED.projects.settings = (function() {
addButton: false,
scrollOnAdd: false,
addItem: function(row,index,entry) {
var container = $('<div class="projects-dialog-list-entry">').appendTo(row);
var container = $('<div class="red-ui-projects-dialog-list-entry">').appendTo(row);
if (entry.empty) {
container.addClass('red-ui-search-empty');
container.text(RED._("sidebar.project.projectSettings.noBranches"));
@ -1220,11 +1219,11 @@ RED.projects.settings = (function() {
if (!entry.current) {
var tools = $('<span class="entry-tools">').appendTo(container);
$('<button class="editor-button editor-button-small"><i class="fa fa-trash"></i></button>')
$('<button class="red-ui-button red-ui-button-small"><i class="fa fa-trash"></i></button>')
.appendTo(tools)
.on("click", function(e) {
e.preventDefault();
var spinner = utils.addSpinnerOverlay(row).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(row).addClass('red-ui-component-spinner-contain');
var notification = RED.notify(RED._("sidebar.project.projectSettings.deleteConfirm", { name: entry.name }), {
type: "warning",
modal: true,
@ -1317,10 +1316,10 @@ RED.projects.settings = (function() {
createLocalBranchListSection(activeProject,pane);
var repoContainer = $('<div class="user-settings-section"></div>').appendTo(pane);
var repoContainer = $('<div class="red-ui-settings-section"></div>').appendTo(pane);
var title = $('<h4></h4>').text(RED._("sidebar.project.projectSettings.gitRemotes")).appendTo(repoContainer);
var editRepoButton = $('<button class="editor-button editor-button-small" style="float: right; margin-right: 10px;">' + RED._("sidebar.project.projectSettings.addRemote") + '</button>')
var editRepoButton = $('<button class="red-ui-button red-ui-button-small" style="float: right; margin-right: 10px;">' + RED._("sidebar.project.projectSettings.addRemote") + '</button>')
.appendTo(title)
.on("click", function(evt) {
editRepoButton.attr('disabled',true);
@ -1339,16 +1338,16 @@ RED.projects.settings = (function() {
var emptyItem = { empty: true };
var isEmpty = true;
var row = $('<div class="user-settings-row"></div>').appendTo(repoContainer);
var addRemoteDialog = $('<div class="projects-dialog-list-dialog"></div>').hide().appendTo(row);
row = $('<div class="user-settings-row projects-dialog-list"></div>').appendTo(repoContainer);
var row = $('<div class="red-ui-settings-row"></div>').appendTo(repoContainer);
var addRemoteDialog = $('<div class="red-ui-projects-dialog-list-dialog"></div>').hide().appendTo(row);
row = $('<div class="red-ui-settings-row red-ui-projects-dialog-list"></div>').appendTo(repoContainer);
var remotesList = $('<ol>').appendTo(row);
remotesList.editableList({
addButton: false,
height: 'auto',
addItem: function(row,index,entry) {
var container = $('<div class="projects-dialog-list-entry">').appendTo(row);
var container = $('<div class="red-ui-projects-dialog-list-entry">').appendTo(row);
if (entry.empty) {
container.addClass('red-ui-search-empty');
container.text(RED._("sidebar.project.projectSettings.noRemotes"));
@ -1365,11 +1364,11 @@ RED.projects.settings = (function() {
}
var tools = $('<span class="entry-tools">').appendTo(container);
$('<button class="editor-button editor-button-small"><i class="fa fa-trash"></i></button>')
$('<button class="red-ui-button red-ui-button-small"><i class="fa fa-trash"></i></button>')
.appendTo(tools)
.on("click", function(e) {
e.preventDefault();
var spinner = utils.addSpinnerOverlay(row).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(row).addClass('red-ui-component-spinner-contain');
var notification = RED.notify(RED._("sidebar.project.projectSettings.deleteRemoteConfrim", { name: entry.name }), {
type: "warning",
modal: true,
@ -1462,22 +1461,22 @@ RED.projects.settings = (function() {
var remoteNameInputChanged = false;
var remoteURLInputChanged = false;
$('<div class="projects-dialog-list-dialog-header">').text(RED._('sidebar.project.projectSettings.addRemote2')).appendTo(addRemoteDialog);
$('<div class="red-ui-projects-dialog-list-dialog-header">').text(RED._('sidebar.project.projectSettings.addRemote2')).appendTo(addRemoteDialog);
row = $('<div class="user-settings-row"></div>').appendTo(addRemoteDialog);
row = $('<div class="red-ui-settings-row"></div>').appendTo(addRemoteDialog);
$('<label for=""></label>').text(RED._("sidebar.project.projectSettings.remoteName")).appendTo(row);
var remoteNameInput = $('<input type="text">').appendTo(row).on("change keyup paste",function() {
remoteNameInputChanged = true;
validateForm();
});
$('<label class="projects-edit-form-sublabel"><small>' + RED._("sidebar.project.projectSettings.nameRule") + '</small></label>').appendTo(row).find("small");
row = $('<div class="user-settings-row"></div>').appendTo(addRemoteDialog);
$('<label class="red-ui-projects-edit-form-sublabel"><small>' + RED._("sidebar.project.projectSettings.nameRule") + '</small></label>').appendTo(row).find("small");
row = $('<div class="red-ui-settings-row"></div>').appendTo(addRemoteDialog);
$('<label for=""></label>').text(RED._("sidebar.project.projectSettings.url")).appendTo(row);
var remoteURLInput = $('<input type="text">').appendTo(row).on("change keyup paste",function() {
remoteURLInputChanged = true;
validateForm()
});
var remoteURLLabel = $('<label class="projects-edit-form-sublabel"><small>' + RED._("sidebar.project.projectSettings.urlRule") +'</small></label>').appendTo(row).find("small");
var remoteURLLabel = $('<label class="red-ui-projects-edit-form-sublabel"><small>' + RED._("sidebar.project.projectSettings.urlRule") +'</small></label>').appendTo(row).find("small");
var hideEditForm = function() {
editRepoButton.attr('disabled',false);
@ -1491,17 +1490,17 @@ RED.projects.settings = (function() {
}
var formButtons = $('<span class="button-row" style="position: relative; float: right; margin: 10px;"></span>')
.appendTo(addRemoteDialog);
$('<button class="editor-button">' + RED._("common.label.cancel") + '</button>')
$('<button class="red-ui-button">' + RED._("common.label.cancel") + '</button>')
.appendTo(formButtons)
.on("click", function(evt) {
evt.preventDefault();
hideEditForm();
});
var saveButton = $('<button class="editor-button">' + RED._("sidebar.project.projectSettings.addRemote2") + '</button>')
var saveButton = $('<button class="red-ui-button">' + RED._("sidebar.project.projectSettings.addRemote2") + '</button>')
.appendTo(formButtons)
.on("click", function(evt) {
evt.preventDefault();
var spinner = utils.addSpinnerOverlay(addRemoteDialog).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(addRemoteDialog).addClass('red-ui-component-spinner-contain');
var payload = {
name: remoteNameInput.val(),
@ -1577,7 +1576,7 @@ RED.projects.settings = (function() {
function createSettingsPane(activeProject) {
var pane = $('<div id="project-settings-tab-settings" class="project-settings-tab-pane node-help"></div>');
var pane = $('<div id="red-ui-project-settings-tab-settings" class="red-ui-project-settings-tab-pane red-ui-help"></div>');
createFilesSection(activeProject,pane);
// createLocalRepositorySection(activeProject,pane);
createRemoteRepositorySection(activeProject,pane);

80
packages/node_modules/@node-red/editor-client/src/js/ui/projects/projectUserSettings.js vendored
View File

@ -26,15 +26,15 @@ RED.projects.userSettings = (function() {
var title = $('<h3></h3>').text(RED._("editor:sidebar.project.userSettings.committerDetail")).appendTo(pane);
var gitconfigContainer = $('<div class="user-settings-section"></div>').appendTo(pane);
$('<div style="color:#aaa;"></div>').appendTo(gitconfigContainer).text(RED._("editor:sidebar.project.userSettings.committerTip"));
var gitconfigContainer = $('<div class="red-ui-settings-section"></div>').appendTo(pane);
$('<div class="red-ui-settings-section-description"></div>').appendTo(gitconfigContainer).text(RED._("editor:sidebar.project.userSettings.committerTip"));
var row = $('<div class="user-settings-row"></div>').appendTo(gitconfigContainer);
var row = $('<div class="red-ui-settings-row"></div>').appendTo(gitconfigContainer);
$('<label for=""></label>').text(RED._("editor:sidebar.project.userSettings.userName")).appendTo(row);
gitUsernameInput = $('<input type="text">').appendTo(row);
gitUsernameInput.val(currentGitSettings.user.name||"");
row = $('<div class="user-settings-row"></div>').appendTo(gitconfigContainer);
row = $('<div class="red-ui-settings-row"></div>').appendTo(gitconfigContainer);
$('<label for=""></label>').text(RED._("editor:sidebar.project.userSettings.email")).appendTo(row);
gitEmailInput = $('<input type="text">').appendTo(row);
gitEmailInput.val(currentGitSettings.user.email||"");
@ -42,12 +42,12 @@ RED.projects.userSettings = (function() {
function createSSHKeySection(pane) {
var container = $('<div class="user-settings-section"></div>').appendTo(pane);
var container = $('<div class="red-ui-settings-section"></div>').appendTo(pane);
var popover;
var title = $('<h3></h3>').text(RED._("editor:sidebar.project.userSettings.sshKeys")).appendTo(container);
var subtitle = $('<div style="color:#aaa;"></div>').appendTo(container).text(RED._("editor:sidebar.project.userSettings.sshKeysTip"));
var subtitle = $('<div class="red-ui-settings-section-description"></div>').appendTo(container).text(RED._("editor:sidebar.project.userSettings.sshKeysTip"));
var addKeyButton = $('<button id="user-settings-gitconfig-add-key" class="editor-button editor-button-small" style="float: right; margin-right: 10px;">'+RED._("editor:sidebar.project.userSettings.add")+'</button>')
var addKeyButton = $('<button id="user-settings-gitconfig-add-key" class="red-ui-button red-ui-button-small" style="float: right; margin-right: 10px;">'+RED._("editor:sidebar.project.userSettings.add")+'</button>')
.appendTo(subtitle)
.on("click", function(evt) {
addKeyButton.attr('disabled',true);
@ -89,17 +89,17 @@ RED.projects.userSettings = (function() {
}
};
var row = $('<div class="user-settings-row"></div>').appendTo(container);
var addKeyDialog = $('<div class="projects-dialog-list-dialog"></div>').hide().appendTo(row);
$('<div class="projects-dialog-list-dialog-header">').text(RED._("editor:sidebar.project.userSettings.addSshKey")).appendTo(addKeyDialog);
var row = $('<div class="red-ui-settings-row"></div>').appendTo(container);
var addKeyDialog = $('<div class="red-ui-projects-dialog-list-dialog"></div>').hide().appendTo(row);
$('<div class="red-ui-projects-dialog-list-dialog-header">').text(RED._("editor:sidebar.project.userSettings.addSshKey")).appendTo(addKeyDialog);
var addKeyDialogBody = $('<div>').appendTo(addKeyDialog);
row = $('<div class="user-settings-row"></div>').appendTo(addKeyDialogBody);
$('<div style="color:#aaa;"></div>').appendTo(row).text(RED._("editor:sidebar.project.userSettings.addSshKeyTip"));
row = $('<div class="red-ui-settings-row"></div>').appendTo(addKeyDialogBody);
$('<div class="red-ui-settings-section-description"></div>').appendTo(row).text(RED._("editor:sidebar.project.userSettings.addSshKeyTip"));
// var bg = $('<div></div>',{class:"button-group", style:"text-align: center"}).appendTo(row);
// var addLocalButton = $('<button class="editor-button toggle selected">use local key</button>').appendTo(bg);
// var uploadButton = $('<button class="editor-button toggle">upload key</button>').appendTo(bg);
// var generateButton = $('<button class="editor-button toggle">generate key</button>').appendTo(bg);
// var addLocalButton = $('<button class="red-ui-button toggle selected">use local key</button>').appendTo(bg);
// var uploadButton = $('<button class="red-ui-button toggle">upload key</button>').appendTo(bg);
// var generateButton = $('<button class="red-ui-button toggle">generate key</button>').appendTo(bg);
// bg.children().on("click", function(e) {
// e.preventDefault();
// if ($(this).hasClass("selected")) {
@ -124,40 +124,40 @@ RED.projects.userSettings = (function() {
// })
row = $('<div class="user-settings-row"></div>').appendTo(addKeyDialogBody);
row = $('<div class="red-ui-settings-row"></div>').appendTo(addKeyDialogBody);
$('<label for=""></label>').text(RED._("editor:sidebar.project.userSettings.name")).appendTo(row);
var keyNameInputChanged = false;
var keyNameInput = $('<input type="text">').appendTo(row).on("change keyup paste",function() {
keyNameInputChanged = true;
validateForm();
});
$('<label class="projects-edit-form-sublabel"><small>'+RED._("editor:sidebar.project.userSettings.nameRule")+'</small></label>').appendTo(row).find("small");
$('<label class="red-ui-projects-edit-form-sublabel"><small>'+RED._("editor:sidebar.project.userSettings.nameRule")+'</small></label>').appendTo(row).find("small");
var generateKeyPane = $('<div>').appendTo(addKeyDialogBody);
row = $('<div class="user-settings-row"></div>').appendTo(generateKeyPane);
row = $('<div class="red-ui-settings-row"></div>').appendTo(generateKeyPane);
$('<label for=""></label>').text(RED._("editor:sidebar.project.userSettings.passphrase")).appendTo(row);
var passphraseInput = $('<input type="password">').appendTo(row).on("change keyup paste",validateForm);
var passphraseInputSubLabel = $('<label class="projects-edit-form-sublabel"><small>'+RED._("editor:sidebar.project.userSettings.optional")+'</small></label>').appendTo(row).find("small");
var passphraseInputSubLabel = $('<label class="red-ui-projects-edit-form-sublabel"><small>'+RED._("editor:sidebar.project.userSettings.optional")+'</small></label>').appendTo(row).find("small");
// var addLocalKeyPane = $('<div>').hide().appendTo(addKeyDialogBody);
// row = $('<div class="user-settings-row"></div>').appendTo(addLocalKeyPane);
// row = $('<div class="red-ui-settings-row"></div>').appendTo(addLocalKeyPane);
// $('<label for=""></label>').text('Public key').appendTo(row);
// var localPublicKeyPathInput = $('<input type="text">').appendTo(row).on("change keyup paste",validateForm);
// $('<label class="projects-edit-form-sublabel"><small>Public key file path, for example: ~/.ssh/id_rsa.pub</small></label>').appendTo(row).find("small");
// row = $('<div class="user-settings-row"></div>').appendTo(addLocalKeyPane);
// $('<label class="red-ui-projects-edit-form-sublabel"><small>Public key file path, for example: ~/.ssh/id_rsa.pub</small></label>').appendTo(row).find("small");
// row = $('<div class="red-ui-settings-row"></div>').appendTo(addLocalKeyPane);
// $('<label for=""></label>').text('Private key').appendTo(row);
// var localPrivateKeyPathInput = $('<input type="text">').appendTo(row).on("change keyup paste",validateForm);
// $('<label class="projects-edit-form-sublabel"><small>Private key file path, for example: ~/.ssh/id_rsa</small></label>').appendTo(row).find("small");
// $('<label class="red-ui-projects-edit-form-sublabel"><small>Private key file path, for example: ~/.ssh/id_rsa</small></label>').appendTo(row).find("small");
//
// var uploadKeyPane = $('<div>').hide().appendTo(addKeyDialogBody);
// row = $('<div class="user-settings-row"></div>').appendTo(uploadKeyPane);
// row = $('<div class="red-ui-settings-row"></div>').appendTo(uploadKeyPane);
// $('<label for=""></label>').text('Public key').appendTo(row);
// var publicKeyInput = $('<textarea>').appendTo(row).on("change keyup paste",validateForm);
// $('<label class="projects-edit-form-sublabel"><small>Paste in public key contents, for example: ~/.ssh/id_rsa.pub</small></label>').appendTo(row).find("small");
// row = $('<div class="user-settings-row"></div>').appendTo(uploadKeyPane);
// $('<label class="red-ui-projects-edit-form-sublabel"><small>Paste in public key contents, for example: ~/.ssh/id_rsa.pub</small></label>').appendTo(row).find("small");
// row = $('<div class="red-ui-settings-row"></div>').appendTo(uploadKeyPane);
// $('<label for=""></label>').text('Private key').appendTo(row);
// var privateKeyInput = $('<textarea>').appendTo(row).on("change keyup paste",validateForm);
// $('<label class="projects-edit-form-sublabel"><small>Paste in private key contents, for example: ~/.ssh/id_rsa</small></label>').appendTo(row).find("small");
// $('<label class="red-ui-projects-edit-form-sublabel"><small>Paste in private key contents, for example: ~/.ssh/id_rsa</small></label>').appendTo(row).find("small");
@ -179,17 +179,17 @@ RED.projects.userSettings = (function() {
}
}
var formButtons = $('<span class="button-row" style="position: relative; float: right; margin: 10px;"></span>').appendTo(addKeyDialog);
$('<button class="editor-button">'+RED._("editor:sidebar.project.userSettings.cancel")+'</button>')
$('<button class="red-ui-button">'+RED._("editor:sidebar.project.userSettings.cancel")+'</button>')
.appendTo(formButtons)
.on("click", function(evt) {
evt.preventDefault();
hideEditForm();
});
var saveButton = $('<button class="editor-button">'+RED._("editor:sidebar.project.userSettings.generate")+'</button>')
var saveButton = $('<button class="red-ui-button">'+RED._("editor:sidebar.project.userSettings.generate")+'</button>')
.appendTo(formButtons)
.on("click", function(evt) {
evt.preventDefault();
var spinner = utils.addSpinnerOverlay(addKeyDialog).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(addKeyDialog).addClass('red-ui-component-spinner-contain');
var payload = {
name: keyNameInput.val()
};
@ -239,12 +239,12 @@ RED.projects.userSettings = (function() {
},payload);
});
row = $('<div class="user-settings-row projects-dialog-list"></div>').appendTo(container);
row = $('<div class="red-ui-settings-row red-ui-projects-dialog-list"></div>').appendTo(container);
var emptyItem = { empty: true };
var expandKey = function(container,entry) {
var row = $('<div class="projects-dialog-ssh-public-key">',{style:"position:relative"}).appendTo(container);
var row = $('<div class="red-ui-projects-dialog-ssh-public-key">',{style:"position:relative"}).appendTo(container);
var keyBox = $('<pre>',{style:"min-height: 80px"}).appendTo(row);
var spinner = utils.addSpinnerOverlay(keyBox).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(keyBox).addClass('red-ui-component-spinner-contain');
var options = {
url: 'settings/user/keys/'+entry.name,
type: "GET",
@ -264,7 +264,7 @@ RED.projects.userSettings = (function() {
utils.sendRequest(options);
var formButtons = $('<span class="button-row" style="position: relative; float: right; margin: 10px;"></span>').appendTo(row);
$('<button class="editor-button editor-button-small">'+RED._("editor:sidebar.project.userSettings.copyPublicKey")+'</button>')
$('<button class="red-ui-button red-ui-button-small">'+RED._("editor:sidebar.project.userSettings.copyPublicKey")+'</button>')
.appendTo(formButtons)
.on("click", function(evt) {
try {
@ -281,18 +281,18 @@ RED.projects.userSettings = (function() {
return row;
}
var keyList = $('<ol class="projects-dialog-ssh-key-list">').appendTo(row).editableList({
var keyList = $('<ol class="red-ui-projects-dialog-ssh-key-list">').appendTo(row).editableList({
height: 'auto',
addButton: false,
scrollOnAdd: false,
addItem: function(row,index,entry) {
var container = $('<div class="projects-dialog-list-entry">').appendTo(row);
var container = $('<div class="red-ui-projects-dialog-list-entry">').appendTo(row);
if (entry.empty) {
container.addClass('red-ui-search-empty');
container.text(RED._("editor:sidebar.project.userSettings.noSshKeys"));
return;
}
var topRow = $('<div class="projects-dialog-ssh-key-header">').appendTo(container);
var topRow = $('<div class="red-ui-projects-dialog-ssh-key-header">').appendTo(container);
$('<span class="entry-icon"><i class="fa fa-key"></i></span>').appendTo(topRow);
$('<span class="entry-name">').text(entry.name).appendTo(topRow);
var tools = $('<span class="button-row entry-tools">').appendTo(topRow);
@ -308,11 +308,11 @@ RED.projects.userSettings = (function() {
}
})
if (!entry.system) {
$('<button class="editor-button editor-button-small"><i class="fa fa-trash"></i></button>')
$('<button class="red-ui-button red-ui-button-small"><i class="fa fa-trash"></i></button>')
.appendTo(tools)
.on("click", function(e) {
e.stopPropagation();
var spinner = utils.addSpinnerOverlay(row).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(row).addClass('red-ui-component-spinner-contain');
var notification = RED.notify(RED._("editor:sidebar.project.userSettings.deleteConfirm", {name:entry.name}), {
type: 'warning',
modal: true,
@ -389,7 +389,7 @@ RED.projects.userSettings = (function() {
}
function createSettingsPane(activeProject) {
var pane = $('<div id="user-settings-tab-gitconfig" class="project-settings-tab-pane node-help"></div>');
var pane = $('<div id="red-ui-settings-tab-gitconfig" class="project-settings-tab-pane red-ui-help"></div>');
createGitUserSection(pane);
createSSHKeySection(pane);
return pane;

442
packages/node_modules/@node-red/editor-client/src/js/ui/projects/projects.js vendored
View File

File diff suppressed because it is too large Load Diff

250
packages/node_modules/@node-red/editor-client/src/js/ui/projects/tab-versionControl.js vendored
View File

@ -115,10 +115,10 @@ RED.sidebar.versionControl = (function() {
}
function createChangeEntry(row, entry, status, state) {
row.addClass("sidebar-version-control-change-entry");
row.addClass("red-ui-sidebar-vc-change-entry");
var container = $('<div>').appendTo(row);
if (entry.label) {
row.addClass('node-info-none');
row.addClass('red-ui-help-info-none');
container.text(entry.label);
if (entry.button) {
container.css({
@ -128,7 +128,7 @@ RED.sidebar.versionControl = (function() {
})
var toolbar = $('<div style="float: right; margin: 5px; height: 50px;"></div>').appendTo(container);
$('<button class="editor-button editor-button-small"></button>').text(entry.button.label)
$('<button class="red-ui-button red-ui-button-small"></button>').text(entry.button.label)
.appendTo(toolbar)
.on("click", entry.button.click);
}
@ -145,17 +145,17 @@ RED.sidebar.versionControl = (function() {
});
var label = $('<span>').appendTo(entryLink);
var entryTools = $('<div class="sidebar-version-control-change-entry-tools">').appendTo(row);
var entryTools = $('<div class="red-ui-sidebar-vc-change-entry-tools">').appendTo(row);
var bg;
var revertButton;
if (state === 'unstaged') {
bg = $('<span class="button-group" style="margin-right: 5px;"></span>').appendTo(entryTools);
revertButton = $('<button class="editor-button editor-button-small"><i class="fa fa-reply"></i></button>')
revertButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-reply"></i></button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
var spinner = utils.addSpinnerOverlay(container).addClass('projects-dialog-spinner-contain');
var spinner = utils.addSpinnerOverlay(container).addClass('red-ui-component-spinner-contain');
var notification = RED.notify(RED._("sidebar.project.versionControl.revert",{file:entry.file}), {
type: "warning",
modal: true,
@ -205,7 +205,7 @@ RED.sidebar.versionControl = (function() {
}
bg = $('<span class="button-group"></span>').appendTo(entryTools);
if (state !== 'unmerged') {
var stageButton = $('<button class="editor-button editor-button-small"><i class="fa fa-'+((state==='unstaged')?"plus":"minus")+'"></i></button>')
var stageButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-'+((state==='unstaged')?"plus":"minus")+'"></i></button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
@ -237,22 +237,22 @@ RED.sidebar.versionControl = (function() {
container.removeClass();
var iconClass = "";
if (status === 'A') {
container.addClass("node-diff-added");
container.addClass("red-ui-diff-state-added");
iconClass = "fa-plus-square";
} else if (status === '?') {
container.addClass("node-diff-unchanged");
container.addClass("red-ui-diff-state-unchanged");
iconClass = "fa-question-circle-o";
} else if (status === 'D') {
container.addClass("node-diff-deleted");
container.addClass("red-ui-diff-state-deleted");
iconClass = "fa-minus-square";
} else if (status === 'M') {
container.addClass("node-diff-changed");
container.addClass("red-ui-diff-state-changed");
iconClass = "fa-square";
} else if (status === 'R') {
container.addClass("node-diff-changed");
container.addClass("red-ui-diff-state-changed");
iconClass = "fa-toggle-right";
} else if (status === 'U') {
container.addClass("node-diff-conflicted");
container.addClass("red-ui-diff-state-conflicted");
iconClass = "fa-exclamation-triangle";
} else {
iconClass = "fa-exclamation-triangle"
@ -306,8 +306,8 @@ RED.sidebar.versionControl = (function() {
RED.events.on("login",function() {
refresh(true);
});
sidebarContent = $('<div>', {class:"sidebar-version-control"});
var stackContainer = $("<div>",{class:"sidebar-version-control-stack"}).appendTo(sidebarContent);
sidebarContent = $('<div>', {class:"red-ui-sidebar-vc"});
var stackContainer = $("<div>",{class:"red-ui-sidebar-vc-stack"}).appendTo(sidebarContent);
sections = RED.stack.create({
container: stackContainer,
fill: true,
@ -322,7 +322,7 @@ RED.sidebar.versionControl = (function() {
localChanges.content.css({height:"100%"});
var bg = $('<div style="float: right"></div>').appendTo(localChanges.header);
var refreshButton = $('<button class="editor-button editor-button-small"><i class="fa fa-refresh"></i></button>')
var refreshButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-refresh"></i></button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
@ -334,9 +334,9 @@ RED.sidebar.versionControl = (function() {
emptyStagedItem = { label: RED._("sidebar.project.versionControl.none") };
emptyMergedItem = { label: RED._("sidebar.project.versionControl.conflictResolve") };
var unstagedContent = $('<div class="sidebar-version-control-change-container"></div>').appendTo(localChanges.content);
var header = $('<div class="sidebar-version-control-change-header">'+RED._("sidebar.project.versionControl.localFiles")+'</div>').appendTo(unstagedContent);
stageAllButton = $('<button class="editor-button editor-button-small" style="float: right"><i class="fa fa-plus"></i> '+RED._("sidebar.project.versionControl.all")+'</button>')
var unstagedContent = $('<div class="red-ui-sidebar-vc-change-container"></div>').appendTo(localChanges.content);
var header = $('<div class="red-ui-sidebar-vc-change-header">'+RED._("sidebar.project.versionControl.localFiles")+'</div>').appendTo(unstagedContent);
stageAllButton = $('<button class="red-ui-button red-ui-button-small" style="float: right"><i class="fa fa-plus"></i> '+RED._("sidebar.project.versionControl.all")+'</button>')
.appendTo(header)
.on("click", function(evt) {
evt.preventDefault();
@ -365,11 +365,11 @@ RED.sidebar.versionControl = (function() {
})
unmergedContent = $('<div class="sidebar-version-control-change-container"></div>').appendTo(localChanges.content);
unmergedContent = $('<div class="red-ui-sidebar-vc-change-container"></div>').appendTo(localChanges.content);
header = $('<div class="sidebar-version-control-change-header">'+RED._("sidebar.project.versionControl.unmergedChanges")+'</div>').appendTo(unmergedContent);
header = $('<div class="red-ui-sidebar-vc-change-header">'+RED._("sidebar.project.versionControl.unmergedChanges")+'</div>').appendTo(unmergedContent);
bg = $('<div style="float: right"></div>').appendTo(header);
var abortMergeButton = $('<button class="editor-button editor-button-small" style="margin-right: 5px;">'+RED._("sidebar.project.versionControl.abortMerge")+'</button>')
var abortMergeButton = $('<button class="red-ui-button red-ui-button-small" style="margin-right: 5px;">'+RED._("sidebar.project.versionControl.abortMerge")+'</button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
@ -429,9 +429,9 @@ RED.sidebar.versionControl = (function() {
})
var stagedContent = $('<div class="sidebar-version-control-change-container"></div>').appendTo(localChanges.content);
var stagedContent = $('<div class="red-ui-sidebar-vc-change-container"></div>').appendTo(localChanges.content);
header = $('<div class="sidebar-version-control-change-header">'+RED._("sidebar.project.versionControl.changeToCommit")+'</div>').appendTo(stagedContent);
header = $('<div class="red-ui-sidebar-vc-change-header">'+RED._("sidebar.project.versionControl.changeToCommit")+'</div>').appendTo(stagedContent);
bg = $('<div style="float: right"></div>').appendTo(header);
var showCommitBox = function() {
@ -454,7 +454,7 @@ RED.sidebar.versionControl = (function() {
abortMergeButton.prop("disabled",true);
commitMessage.trigger("focus");
}
commitButton = $('<button class="editor-button editor-button-small" style="margin-right: 5px;">'+RED._("sidebar.project.versionControl.commit")+'</button>')
commitButton = $('<button class="red-ui-button red-ui-button-small" style="margin-right: 5px;">'+RED._("sidebar.project.versionControl.commit")+'</button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
@ -462,7 +462,7 @@ RED.sidebar.versionControl = (function() {
showCommitBox();
});
RED.popover.tooltip(commitButton,RED._("sidebar.project.versionControl.commitChanges"));
unstageAllButton = $('<button class="editor-button editor-button-small"><i class="fa fa-minus"></i> '+RED._("sidebar.project.versionControl.all")+'</button>')
unstageAllButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-minus"></i> '+RED._("sidebar.project.versionControl.all")+'</button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
@ -488,16 +488,16 @@ RED.sidebar.versionControl = (function() {
}
})
commitBox = $('<div class="sidebar-version-control-slide-box sidebar-version-control-slide-box-bottom"></div>').hide().appendTo(localChanges.content);
commitBox = $('<div class="red-ui-sidebar-vc-slide-box red-ui-sidebar-vc-slide-box-bottom"></div>').hide().appendTo(localChanges.content);
var commitMessage = $('<textarea placeholder='+RED._("sidebar.project.versionControl.commitPlaceholder")+'></textarea>')
var commitMessage = $('<textarea></textarea>').attr("placeholder",RED._("sidebar.project.versionControl.commitPlaceholder"))
.appendTo(commitBox)
.on("change keyup paste",function() {
submitCommitButton.prop('disabled',$(this).val().trim()==="");
});
var commitToolbar = $('<div class="sidebar-version-control-slide-box-toolbar button-group">').appendTo(commitBox);
var commitToolbar = $('<div class="red-ui-sidebar-vc-slide-box-toolbar button-group">').appendTo(commitBox);
var cancelCommitButton = $('<button class="editor-button">'+RED._("sidebar.project.versionControl.cancelCapital")+'</button>')
var cancelCommitButton = $('<button class="red-ui-button">'+RED._("sidebar.project.versionControl.cancelCapital")+'</button>')
.appendTo(commitToolbar)
.on("click", function(evt) {
evt.preventDefault();
@ -515,11 +515,11 @@ RED.sidebar.versionControl = (function() {
abortMergeButton.prop("disabled",false);
})
var submitCommitButton = $('<button class="editor-button">'+RED._("sidebar.project.versionControl.commitCapital")+'</button>')
var submitCommitButton = $('<button class="red-ui-button">'+RED._("sidebar.project.versionControl.commitCapital")+'</button>')
.appendTo(commitToolbar)
.on("click", function(evt) {
evt.preventDefault();
var spinner = utils.addSpinnerOverlay(submitCommitButton).addClass('projects-dialog-spinner-sidebar');
var spinner = utils.addSpinnerOverlay(submitCommitButton).addClass('red-ui-component-spinner-sidebar');
var activeProject = RED.projects.getActiveProject();
RED.deploy.setDeployInflight(true);
utils.sendRequest({
@ -556,7 +556,7 @@ RED.sidebar.versionControl = (function() {
});
bg = $('<div style="float: right"></div>').appendTo(localHistory.header);
refreshButton = $('<button class="editor-button editor-button-small"><i class="fa fa-refresh"></i></button>')
refreshButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-refresh"></i></button>')
.appendTo(bg)
.on("click", function(evt) {
evt.preventDefault();
@ -565,9 +565,9 @@ RED.sidebar.versionControl = (function() {
})
RED.popover.tooltip(refreshButton,RED._("sidebar.project.versionControl.refreshCommitHistory"))
var localBranchToolbar = $('<div class="sidebar-version-control-change-header" style="text-align: right;"></div>').appendTo(localHistory.content);
var localBranchToolbar = $('<div class="red-ui-sidebar-vc-change-header" style="text-align: right;"></div>').appendTo(localHistory.content);
var localBranchButton = $('<button class="editor-button editor-button-small"><i class="fa fa-code-fork"></i> '+RED._("sidebar.project.versionControl.branch")+' <span id="sidebar-version-control-local-branch"></span></button>')
var localBranchButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-code-fork"></i> '+RED._("sidebar.project.versionControl.branch")+' <span id="red-ui-sidebar-vc-local-branch"></span></button>')
.appendTo(localBranchToolbar)
.on("click", function(evt) {
evt.preventDefault();
@ -587,12 +587,12 @@ RED.sidebar.versionControl = (function() {
}
})
RED.popover.tooltip(localBranchButton,RED._("sidebar.project.versionControl.changeLocalBranch"))
var repoStatusButton = $('<button class="editor-button editor-button-small" style="margin-left: 10px;" id="sidebar-version-control-repo-status-button">'+
'<span id="sidebar-version-control-repo-status-stats">'+
'<i class="fa fa-long-arrow-up"></i> <span id="sidebar-version-control-commits-ahead"></span> '+
'<i class="fa fa-long-arrow-down"></i> <span id="sidebar-version-control-commits-behind"></span>'+
var repoStatusButton = $('<button class="red-ui-button red-ui-button-small" style="margin-left: 10px;" id="red-ui-sidebar-vc-repo-status-button">'+
'<span id="red-ui-sidebar-vc-repo-status-stats">'+
'<i class="fa fa-long-arrow-up"></i> <span id="red-ui-sidebar-vc-commits-ahead"></span> '+
'<i class="fa fa-long-arrow-down"></i> <span id="red-ui-sidebar-vc-commits-behind"></span>'+
'</span>'+
'<span id="sidebar-version-control-repo-status-auth-issue">'+
'<span id="red-ui-sidebar-vc-repo-status-auth-issue">'+
'<i class="fa fa-warning"></i>'+
'</span>'+
'</button>')
@ -606,7 +606,7 @@ RED.sidebar.versionControl = (function() {
localCommitListShade.show();
$(this).addClass('selected');
var activeProject = RED.projects.getActiveProject();
$("#sidebar-version-control-repo-toolbar-set-upstream-row").toggle(!!activeProject.git.branches.remoteAlt);
$("#red-ui-sidebar-vc-repo-toolbar-set-upstream-row").toggle(!!activeProject.git.branches.remoteAlt);
remoteBox.show();
setTimeout(function() {
@ -618,14 +618,14 @@ RED.sidebar.versionControl = (function() {
RED.popover.tooltip(repoStatusButton,RED._("sidebar.project.versionControl.manageRemoteBranch"))
localCommitList = $("<ol>",{style:"position: absolute; top: 30px; bottom: 0px; right:0; left:0;"}).appendTo(localHistory.content);
localCommitListShade = $('<div class="component-shade" style="z-Index: 3"></div>').css('top',"30px").hide().appendTo(localHistory.content);
localCommitListShade = $('<div class="red-ui-shade" style="z-Index: 3"></div>').css('top',"30px").hide().appendTo(localHistory.content);
localCommitList.editableList({
addButton: false,
scrollOnAdd: false,
addItem: function(row,index,entry) {
row.addClass('sidebar-version-control-commit-entry');
row.addClass('red-ui-sidebar-vc-commit-entry');
if (entry.url) {
row.addClass('sidebar-version-control-commit-more');
row.addClass('red-ui-sidebar-vc-commit-more');
row.text("+ "+(entry.total-entry.totalKnown)+RED._("sidebar.project.versionControl.moreCommits"));
row.on("click", function(e) {
e.preventDefault();
@ -648,21 +648,21 @@ RED.sidebar.versionControl = (function() {
}
});
var container = $('<div>').appendTo(row);
$('<div class="sidebar-version-control-commit-subject">').text(entry.subject).appendTo(container);
$('<div class="red-ui-sidebar-vc-commit-subject">').text(entry.subject).appendTo(container);
if (entry.refs) {
var refDiv = $('<div class="sidebar-version-control-commit-refs">').appendTo(container);
var refDiv = $('<div class="red-ui-sidebar-vc-commit-refs">').appendTo(container);
entry.refs.forEach(function(ref) {
var label = ref;
if (/HEAD -> /.test(ref)) {
label = ref.substring(8);
}
$('<span class="sidebar-version-control-commit-ref">').text(label).appendTo(refDiv);
$('<span class="red-ui-sidebar-vc-commit-ref">').text(label).appendTo(refDiv);
});
row.addClass('sidebar-version-control-commit-head');
row.addClass('red-ui-sidebar-vc-commit-head');
}
$('<div class="sidebar-version-control-commit-sha">').text(entry.sha.substring(0,7)).appendTo(container);
// $('<div class="sidebar-version-control-commit-user">').text(entry.author).appendTo(container);
$('<div class="sidebar-version-control-commit-date">').text(humanizeSinceDate(parseInt(entry.date))).appendTo(container);
$('<div class="red-ui-sidebar-vc-commit-sha">').text(entry.sha.substring(0,7)).appendTo(container);
// $('<div class="red-ui-sidebar-vc-commit-user">').text(entry.author).appendTo(container);
$('<div class="red-ui-sidebar-vc-commit-date">').text(humanizeSinceDate(parseInt(entry.date))).appendTo(container);
}
}
});
@ -678,9 +678,9 @@ RED.sidebar.versionControl = (function() {
if (done) { done() }
},200);
}
var localBranchBox = $('<div class="sidebar-version-control-slide-box sidebar-version-control-slide-box-top" style="top:30px;"></div>').hide().appendTo(localHistory.content);
var localBranchBox = $('<div class="red-ui-sidebar-vc-slide-box red-ui-sidebar-vc-slide-box-top" style="top:30px;"></div>').hide().appendTo(localHistory.content);
$('<div class="sidebar-version-control-slide-box-header"></div>').text(RED._("sidebar.project.versionControl.changeLocalBranch")).appendTo(localBranchBox);
$('<div class="red-ui-sidebar-vc-slide-box-header"></div>').text(RED._("sidebar.project.versionControl.changeLocalBranch")).appendTo(localBranchBox);
var localBranchList = utils.createBranchList({
placeholder: RED._("sidebar.project.versionControl.createBranchPlaceholder"),
@ -735,9 +735,9 @@ RED.sidebar.versionControl = (function() {
}
});
var remoteBox = $('<div class="sidebar-version-control-slide-box sidebar-version-control-slide-box-top" style="top:30px"></div>').hide().appendTo(localHistory.content);
var remoteBox = $('<div class="red-ui-sidebar-vc-slide-box red-ui-sidebar-vc-slide-box-top" style="top:30px"></div>').hide().appendTo(localHistory.content);
var closeRemoteBox = function() {
$("#sidebar-version-control-repo-toolbar-set-upstream").prop('checked',false);
$("#red-ui-sidebar-vc-repo-toolbar-set-upstream").prop('checked',false);
repoStatusButton.removeClass('selected')
remoteBox.css("height","0");
localCommitListShade.hide();
@ -758,10 +758,10 @@ RED.sidebar.versionControl = (function() {
},200);
}
}
$('<div class="sidebar-version-control-slide-box-header"></div>').text(RED._("sidebar.project.versionControl.manageRemoteBranch")).appendTo(remoteBox);
$('<div class="red-ui-sidebar-vc-slide-box-header"></div>').text(RED._("sidebar.project.versionControl.manageRemoteBranch")).appendTo(remoteBox);
var remoteBranchRow = $('<div style="margin-bottom: 5px;"></div>').appendTo(remoteBox);
var remoteBranchButton = $('<button id="sidebar-version-control-repo-branch" class="sidebar-version-control-repo-action editor-button"><i class="fa fa-code-fork"></i> '+RED._("sidebar.project.versionControl.remote")+': <span id="sidebar-version-control-remote-branch"></span></button>')
var remoteBranchButton = $('<button id="red-ui-sidebar-vc-repo-branch" class="red-ui-sidebar-vc-repo-action red-ui-button"><i class="fa fa-code-fork"></i> '+RED._("sidebar.project.versionControl.remote")+': <span id="red-ui-sidebar-vc-remote-branch"></span></button>')
.appendTo(remoteBranchRow)
.on("click", function(evt) {
evt.preventDefault();
@ -780,18 +780,18 @@ RED.sidebar.versionControl = (function() {
}
});
$('<div id="sidebar-version-control-repo-toolbar-message" class="sidebar-version-control-slide-box-header" style="min-height: 100px;"></div>').appendTo(remoteBox);
$('<div id="red-ui-sidebar-vc-repo-toolbar-message" class="red-ui-sidebar-vc-slide-box-header" style="min-height: 100px;"></div>').appendTo(remoteBox);
var errorMessage = $('<div id="sidebar-version-control-repo-toolbar-error-message" class="sidebar-version-control-slide-box-header" style="min-height: 100px;"></div>').hide().appendTo(remoteBox);
var errorMessage = $('<div id="red-ui-sidebar-vc-repo-toolbar-error-message" class="red-ui-sidebar-vc-slide-box-header" style="min-height: 100px;"></div>').hide().appendTo(remoteBox);
$('<div style="margin-top: 10px;"><i class="fa fa-warning"></i> '+RED._("sidebar.project.versionControl.unableToAccess")+'</div>').appendTo(errorMessage)
var buttonRow = $('<div style="margin: 10px 30px; text-align: center"></div>').appendTo(errorMessage);
$('<button class="editor-button" style="width: 80%;"><i class="fa fa-refresh"></i> '+RED._("sidebar.project.versionControl.retry")+'</button>')
$('<button class="red-ui-button" style="width: 80%;"><i class="fa fa-refresh"></i> '+RED._("sidebar.project.versionControl.retry")+'</button>')
.appendTo(buttonRow)
.on("click", function(e) {
e.preventDefault();
var activeProject = RED.projects.getActiveProject();
var spinner = utils.addSpinnerOverlay(remoteBox).addClass("projects-dialog-spinner-contain");
var spinner = utils.addSpinnerOverlay(remoteBox).addClass("red-ui-component-spinner-contain");
utils.sendRequest({
url: "projects/"+activeProject.name+"/branches/remote",
type: "GET",
@ -824,7 +824,7 @@ RED.sidebar.versionControl = (function() {
});
})
$('<div class="sidebar-version-control-slide-box-header" style="height: 20px;"><label id="sidebar-version-control-repo-toolbar-set-upstream-row" for="sidebar-version-control-repo-toolbar-set-upstream" class="hide"><input type="checkbox" id="sidebar-version-control-repo-toolbar-set-upstream"> '+RED._("sidebar.project.versionControl.setUpstreamBranch")+'</label></div>').appendTo(remoteBox);
$('<div class="red-ui-sidebar-vc-slide-box-header" style="height: 20px;"><label id="red-ui-sidebar-vc-repo-toolbar-set-upstream-row" for="red-ui-sidebar-vc-repo-toolbar-set-upstream" class="hide"><input type="checkbox" id="red-ui-sidebar-vc-repo-toolbar-set-upstream"> '+RED._("sidebar.project.versionControl.setUpstreamBranch")+'</label></div>').appendTo(remoteBox);
var remoteBranchSubRow = $('<div style="height: 0;overflow:hidden; transition: height 0.2s ease-in-out;"></div>').hide().appendTo(remoteBranchRow);
var remoteBranchList = utils.createBranchList({
@ -837,20 +837,20 @@ RED.sidebar.versionControl = (function() {
},
container: remoteBranchSubRow,
onselect: function(body) {
$("#sidebar-version-control-repo-toolbar-set-upstream").prop('checked',false);
$("#sidebar-version-control-repo-toolbar-set-upstream").prop('disabled',false);
$("#sidebar-version-control-remote-branch").text(body.name+(body.create?" *":""));
$("#red-ui-sidebar-vc-repo-toolbar-set-upstream").prop('checked',false);
$("#red-ui-sidebar-vc-repo-toolbar-set-upstream").prop('disabled',false);
$("#red-ui-sidebar-vc-remote-branch").text(body.name+(body.create?" *":""));
var activeProject = RED.projects.getActiveProject();
if (activeProject.git.branches.remote === body.name) {
delete activeProject.git.branches.remoteAlt;
} else {
activeProject.git.branches.remoteAlt = body.name;
}
$("#sidebar-version-control-repo-toolbar-set-upstream-row").toggle(!!activeProject.git.branches.remoteAlt);
$("#red-ui-sidebar-vc-repo-toolbar-set-upstream-row").toggle(!!activeProject.git.branches.remoteAlt);
closeRemoteBranchBox(function() {
if (!body.create) {
var start = Date.now();
var spinner = utils.addSpinnerOverlay($('#sidebar-version-control-repo-toolbar-message')).addClass("projects-dialog-spinner-contain");
var spinner = utils.addSpinnerOverlay($('#red-ui-sidebar-vc-repo-toolbar-message')).addClass("red-ui-component-spinner-contain");
$.getJSON("projects/"+activeProject.name+"/branches/remote/"+body.name+"/status", function(result) {
setTimeout(function() {
updateRemoteStatus(result.commits.ahead, result.commits.behind);
@ -859,14 +859,14 @@ RED.sidebar.versionControl = (function() {
})
} else {
if (!activeProject.git.branches.remote) {
$('#sidebar-version-control-repo-toolbar-message').text(RED._("sidebar.project.versionControl.trackedUpstreamBranch"));
$("#sidebar-version-control-repo-toolbar-set-upstream").prop('checked',true);
$("#sidebar-version-control-repo-toolbar-set-upstream").prop('disabled',true);
$('#red-ui-sidebar-vc-repo-toolbar-message').text(RED._("sidebar.project.versionControl.trackedUpstreamBranch"));
$("#red-ui-sidebar-vc-repo-toolbar-set-upstream").prop('checked',true);
$("#red-ui-sidebar-vc-repo-toolbar-set-upstream").prop('disabled',true);
} else {
$('#sidebar-version-control-repo-toolbar-message').text(RED._("sidebar.project.versionControl.selectUpstreamBranch"));
$('#red-ui-sidebar-vc-repo-toolbar-message').text(RED._("sidebar.project.versionControl.selectUpstreamBranch"));
}
$("#sidebar-version-control-repo-pull").prop('disabled',true);
$("#sidebar-version-control-repo-push").prop('disabled',false);
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',true);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',false);
}
});
}
@ -875,13 +875,13 @@ RED.sidebar.versionControl = (function() {
var row = $('<div style="margin-bottom: 5px;"></div>').appendTo(remoteBox);
$('<button id="sidebar-version-control-repo-push" class="sidebar-version-control-repo-sub-action editor-button"><i class="fa fa-long-arrow-up"></i> <span data-i18n="sidebar.project.versionControl.push"></span></button>')
$('<button id="red-ui-sidebar-vc-repo-push" class="red-ui-sidebar-vc-repo-sub-action red-ui-button"><i class="fa fa-long-arrow-up"></i> <span data-i18n="sidebar.project.versionControl.push"></span></button>')
.appendTo(row)
.on("click", function(e) {
e.preventDefault();
var spinner = utils.addSpinnerOverlay(remoteBox).addClass("projects-dialog-spinner-contain");
var spinner = utils.addSpinnerOverlay(remoteBox).addClass("red-ui-component-spinner-contain");
var buttonRow = $('<div style="position: relative; bottom: 60px;"></div>').appendTo(spinner);
$('<button class="editor-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
$('<button class="red-ui-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
evt.preventDefault();
RED.actions.invoke("core:show-event-log");
});
@ -891,7 +891,7 @@ RED.sidebar.versionControl = (function() {
if (activeProject.git.branches.remoteAlt) {
url+="/"+activeProject.git.branches.remoteAlt;
}
var setUpstream = $("#sidebar-version-control-repo-toolbar-set-upstream").prop('checked');
var setUpstream = $("#red-ui-sidebar-vc-repo-toolbar-set-upstream").prop('checked');
if (setUpstream) {
url+="?u=true"
}
@ -929,9 +929,9 @@ RED.sidebar.versionControl = (function() {
var pullRemote = function(options) {
options = options || {};
var spinner = utils.addSpinnerOverlay(remoteBox).addClass("projects-dialog-spinner-contain");
var spinner = utils.addSpinnerOverlay(remoteBox).addClass("red-ui-component-spinner-contain");
var buttonRow = $('<div style="position: relative; bottom: 60px;"></div>').appendTo(spinner);
$('<button class="editor-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
$('<button class="red-ui-button"></button>').text(RED._("eventLog.view")).appendTo(buttonRow).on("click", function(evt) {
evt.preventDefault();
RED.actions.invoke("core:show-event-log");
});
@ -1012,16 +1012,16 @@ RED.sidebar.versionControl = (function() {
spinner.remove();
});
}
$('<button id="sidebar-version-control-repo-pull" class="sidebar-version-control-repo-sub-action editor-button"><i class="fa fa-long-arrow-down"></i> <span data-i18n="sidebar.project.versionControl.pull"></span></button>')
$('<button id="red-ui-sidebar-vc-repo-pull" class="red-ui-sidebar-vc-repo-sub-action red-ui-button"><i class="fa fa-long-arrow-down"></i> <span data-i18n="sidebar.project.versionControl.pull"></span></button>')
.appendTo(row)
.on("click", function(e) {
e.preventDefault();
pullRemote({
setUpstream: $("#sidebar-version-control-repo-toolbar-set-upstream").prop('checked')
setUpstream: $("#red-ui-sidebar-vc-repo-toolbar-set-upstream").prop('checked')
});
});
$('<div class="component-shade sidebar-version-control-shade">').appendTo(sidebarContent);
$('<div class="red-ui-shade red-ui-sidebar-vc-shade">').appendTo(sidebarContent);
RED.sidebar.addTab({
id: "version-control",
@ -1068,7 +1068,7 @@ RED.sidebar.versionControl = (function() {
} else {
bulkChangeSpinner = utils.addSpinnerOverlay(stagedChangesList.parent());
}
bulkChangeSpinner.addClass('projects-dialog-spinner-sidebar');
bulkChangeSpinner.addClass('red-ui-component-spinner-sidebar');
var body = unstaged?{files:files}:undefined;
utils.sendRequest({
url: "projects/"+activeProject.name+"/stage",
@ -1163,10 +1163,10 @@ RED.sidebar.versionControl = (function() {
}
isMerging = !!result.merging;
if (isMerging) {
sidebarContent.addClass("sidebar-version-control-merging");
sidebarContent.addClass("red-ui-sidebar-vc-merging");
unmergedContent.show();
} else {
sidebarContent.removeClass("sidebar-version-control-merging");
sidebarContent.removeClass("red-ui-sidebar-vc-merging");
unmergedContent.hide();
}
unstagedChangesList.editableList('removeItem',emptyStagedItem);
@ -1299,52 +1299,52 @@ RED.sidebar.versionControl = (function() {
$.getJSON(url,function(result) {
refreshFiles(result);
$('#sidebar-version-control-local-branch').text(result.branches.local);
$('#sidebar-version-control-remote-branch').text(result.branches.remote||RED._("sidebar.project.versionControl.none"));
$('#red-ui-sidebar-vc-local-branch').text(result.branches.local);
$('#red-ui-sidebar-vc-remote-branch').text(result.branches.remote||RED._("sidebar.project.versionControl.none"));
var commitsAhead = result.commits.ahead || 0;
var commitsBehind = result.commits.behind || 0;
if (activeProject.git.hasOwnProperty('remotes')) {
if (result.branches.hasOwnProperty("remoteError") && result.branches.remoteError.code !== 'git_remote_gone') {
$("#sidebar-version-control-repo-status-auth-issue").show();
$("#sidebar-version-control-repo-status-stats").hide();
$('#sidebar-version-control-repo-branch').prop('disabled',true);
$("#sidebar-version-control-repo-pull").prop('disabled',true);
$("#sidebar-version-control-repo-push").prop('disabled',true);
$('#sidebar-version-control-repo-toolbar-message').hide();
$('#sidebar-version-control-repo-toolbar-error-message').show();
$("#red-ui-sidebar-vc-repo-status-auth-issue").show();
$("#red-ui-sidebar-vc-repo-status-stats").hide();
$('#red-ui-sidebar-vc-repo-branch').prop('disabled',true);
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',true);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',true);
$('#red-ui-sidebar-vc-repo-toolbar-message').hide();
$('#red-ui-sidebar-vc-repo-toolbar-error-message').show();
} else {
$('#sidebar-version-control-repo-toolbar-message').show();
$('#sidebar-version-control-repo-toolbar-error-message').hide();
$('#red-ui-sidebar-vc-repo-toolbar-message').show();
$('#red-ui-sidebar-vc-repo-toolbar-error-message').hide();
$("#sidebar-version-control-repo-status-auth-issue").hide();
$("#sidebar-version-control-repo-status-stats").show();
$("#red-ui-sidebar-vc-repo-status-auth-issue").hide();
$("#red-ui-sidebar-vc-repo-status-stats").show();
$('#sidebar-version-control-repo-branch').prop('disabled',false);
$('#red-ui-sidebar-vc-repo-branch').prop('disabled',false);
$("#sidebar-version-control-repo-status-button").show();
$("#red-ui-sidebar-vc-repo-status-button").show();
if (result.branches.hasOwnProperty('remote')) {
updateRemoteStatus(commitsAhead, commitsBehind);
} else {
$('#sidebar-version-control-commits-ahead').text("");
$('#sidebar-version-control-commits-behind').text("");
$('#red-ui-sidebar-vc-commits-ahead').text("");
$('#red-ui-sidebar-vc-commits-behind').text("");
$('#sidebar-version-control-repo-toolbar-message').text(RED._("sidebar.project.versionControl.notTracking"));
$("#sidebar-version-control-repo-pull").prop('disabled',true);
$("#sidebar-version-control-repo-push").prop('disabled',true);
$('#red-ui-sidebar-vc-repo-toolbar-message').text(RED._("sidebar.project.versionControl.notTracking"));
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',true);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',true);
}
}
} else {
$("#sidebar-version-control-repo-status-button").hide();
$("#red-ui-sidebar-vc-repo-status-button").hide();
}
refreshInProgress = false;
$('.sidebar-version-control-shade').hide();
$('.red-ui-sidebar-vc-shade').hide();
}).fail(function() {
refreshInProgress = false;
});
} else {
$('.sidebar-version-control-shade').show();
$('.red-ui-sidebar-vc-shade').show();
unstagedChangesList.editableList('empty');
stagedChangesList.editableList('empty');
unmergedChangesList.editableList('empty');
@ -1353,31 +1353,31 @@ RED.sidebar.versionControl = (function() {
function updateRemoteStatus(commitsAhead, commitsBehind) {
$('#sidebar-version-control-commits-ahead').text(commitsAhead);
$('#sidebar-version-control-commits-behind').text(commitsBehind);
$('#red-ui-sidebar-vc-commits-ahead').text(commitsAhead);
$('#red-ui-sidebar-vc-commits-behind').text(commitsBehind);
if (isMerging) {
$('#sidebar-version-control-repo-toolbar-message').text(RED._("sidebar.project.versionControl.statusUnmergedChanged"));
$("#sidebar-version-control-repo-pull").prop('disabled',true);
$("#sidebar-version-control-repo-push").prop('disabled',true);
$('#red-ui-sidebar-vc-repo-toolbar-message').text(RED._("sidebar.project.versionControl.statusUnmergedChanged"));
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',true);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',true);
} else if (commitsAhead > 0 && commitsBehind === 0) {
$('#sidebar-version-control-repo-toolbar-message').text(RED._("sidebar.project.versionControl.commitsAhead", {count:commitsAhead}));
$("#sidebar-version-control-repo-pull").prop('disabled',true);
$("#sidebar-version-control-repo-push").prop('disabled',false);
$('#red-ui-sidebar-vc-repo-toolbar-message').text(RED._("sidebar.project.versionControl.commitsAhead", {count:commitsAhead}));
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',true);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',false);
} else if (commitsAhead === 0 && commitsBehind > 0) {
$('#sidebar-version-control-repo-toolbar-message').text(RED._("sidebar.project.versionControl.commitsBehind",{ count: commitsBehind }));
$("#sidebar-version-control-repo-pull").prop('disabled',false);
$("#sidebar-version-control-repo-push").prop('disabled',true);
$('#red-ui-sidebar-vc-repo-toolbar-message').text(RED._("sidebar.project.versionControl.commitsBehind",{ count: commitsBehind }));
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',false);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',true);
} else if (commitsAhead > 0 && commitsBehind > 0) {
$('#sidebar-version-control-repo-toolbar-message').text(
$('#red-ui-sidebar-vc-repo-toolbar-message').text(
RED._("sidebar.project.versionControl.commitsAheadAndBehind1",{ count:commitsBehind })+
RED._("sidebar.project.versionControl.commitsAheadAndBehind2",{ count:commitsAhead })+
RED._("sidebar.project.versionControl.commitsAheadAndBehind3",{ count:commitsBehind }));
$("#sidebar-version-control-repo-pull").prop('disabled',false);
$("#sidebar-version-control-repo-push").prop('disabled',true);
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',false);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',true);
} else if (commitsAhead === 0 && commitsBehind === 0) {
$('#sidebar-version-control-repo-toolbar-message').text(RED._("sidebar.project.versionControl.repositoryUpToDate"));
$("#sidebar-version-control-repo-pull").prop('disabled',true);
$("#sidebar-version-control-repo-push").prop('disabled',true);
$('#red-ui-sidebar-vc-repo-toolbar-message').text(RED._("sidebar.project.versionControl.repositoryUpToDate"));
$("#red-ui-sidebar-vc-repo-pull").prop('disabled',true);
$("#red-ui-sidebar-vc-repo-push").prop('disabled',true);
}
}
function show() {

34
packages/node_modules/@node-red/editor-client/src/js/ui/search.js vendored
View File

@ -147,7 +147,7 @@ RED.search = (function() {
}
function createDialog() {
dialog = $("<div>",{id:"red-ui-search",class:"red-ui-search"}).appendTo("#main-container");
dialog = $("<div>",{id:"red-ui-search",class:"red-ui-search"}).appendTo("#red-ui-main-container");
var searchDiv = $("<div>",{class:"red-ui-search-container"}).appendTo(dialog);
searchInput = $('<input type="text" data-i18n="[placeholder]menu.label.searchInput">').appendTo(searchDiv).searchBox({
delay: 200,
@ -194,7 +194,7 @@ RED.search = (function() {
searchInput.i18n();
var searchResultsDiv = $("<div>",{class:"red-ui-search-results-container"}).appendTo(dialog);
searchResults = $('<ol>',{id:"search-result-list", style:"position: absolute;top: 5px;bottom: 5px;left: 5px;right: 5px;"}).appendTo(searchResultsDiv).editableList({
searchResults = $('<ol>',{style:"position: absolute;top: 5px;bottom: 5px;left: 5px;right: 5px;"}).appendTo(searchResultsDiv).editableList({
addButton: false,
addItem: function(container,i,object) {
var node = object.node;
@ -213,7 +213,7 @@ RED.search = (function() {
}
nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, true);
var contentDiv = $('<div>',{class:"red-ui-search-result-description"}).appendTo(div);
@ -254,11 +254,11 @@ RED.search = (function() {
}
if (!visible) {
RED.keyboard.add("*","escape",function(){hide()});
$("#header-shade").show();
$("#editor-shade").show();
$("#palette-shade").show();
$("#sidebar-shade").show();
$("#sidebar-separator").hide();
$("#red-ui-header-shade").show();
$("#red-ui-editor-shade").show();
$("#red-ui-palette-shade").show();
$("#red-ui-sidebar-shade").show();
$("#red-ui-sidebar-separator").hide();
indexWorkspace();
if (dialog === null) {
createDialog();
@ -275,11 +275,11 @@ RED.search = (function() {
if (visible) {
RED.keyboard.remove("escape");
visible = false;
$("#header-shade").hide();
$("#editor-shade").hide();
$("#palette-shade").hide();
$("#sidebar-shade").hide();
$("#sidebar-separator").show();
$("#red-ui-header-shade").hide();
$("#red-ui-editor-shade").hide();
$("#red-ui-palette-shade").hide();
$("#red-ui-sidebar-shade").hide();
$("#red-ui-sidebar-separator").show();
if (dialog !== null) {
dialog.slideUp(200,function() {
searchInput.searchBox('value','');
@ -299,10 +299,10 @@ RED.search = (function() {
$("#header-shade").on('mousedown',hide);
$("#editor-shade").on('mousedown',hide);
$("#palette-shade").on('mousedown',hide);
$("#sidebar-shade").on('mousedown',hide);
$("#red-ui-header-shade").on('mousedown',hide);
$("#red-ui-editor-shade").on('mousedown',hide);
$("#red-ui-palette-shade").on('mousedown',hide);
$("#red-ui-sidebar-shade").on('mousedown',hide);
}
return {

261
packages/node_modules/@node-red/editor-client/src/js/ui/sidebar.js vendored
View File

@ -16,33 +16,8 @@
RED.sidebar = (function() {
//$('#sidebar').tabs();
var sidebar_tabs = RED.tabs.create({
id:"sidebar-tabs",
onchange:function(tab) {
$("#sidebar-content").children().hide();
$("#sidebar-footer").children().hide();
if (tab.onchange) {
tab.onchange.call(tab);
}
$(tab.wrapper).show();
if (tab.toolbar) {
$(tab.toolbar).show();
}
},
onremove: function(tab) {
$(tab.wrapper).hide();
if (tab.onremove) {
tab.onremove.call(tab);
}
},
// minimumActiveTabWidth: 70,
collapsible: true
// scrollable: true
});
var knownTabs = {
};
var sidebar_tabs;
var knownTabs = {};
function addTab(title,content,closeable,visible) {
var options;
@ -62,16 +37,16 @@ RED.sidebar = (function() {
delete options.closeable;
options.wrapper = $('<div>',{style:"height:100%"}).appendTo("#sidebar-content")
options.wrapper = $('<div>',{style:"height:100%"}).appendTo("#red-ui-sidebar-content")
options.wrapper.append(options.content);
options.wrapper.hide();
if (!options.enableOnEdit) {
options.shade = $('<div>',{class:"sidebar-shade hide"}).appendTo(options.wrapper);
options.shade = $('<div>',{class:"red-ui-sidebar-shade hide"}).appendTo(options.wrapper);
}
if (options.toolbar) {
$("#sidebar-footer").append(options.toolbar);
$("#red-ui-sidebar-footer").append(options.toolbar);
$(options.toolbar).hide();
}
var id = options.id;
@ -107,110 +82,113 @@ RED.sidebar = (function() {
var sidebarSeparator = {};
sidebarSeparator.dragging = false;
$("#sidebar-separator").draggable({
axis: "x",
start:function(event,ui) {
sidebarSeparator.closing = false;
sidebarSeparator.opening = false;
var winWidth = $(window).width();
sidebarSeparator.start = ui.position.left;
sidebarSeparator.chartWidth = $("#workspace").width();
sidebarSeparator.chartRight = winWidth-$("#workspace").width()-$("#workspace").offset().left-2;
sidebarSeparator.dragging = true;
function setupSidebarSeparator() {
$("#red-ui-sidebar-separator").draggable({
axis: "x",
start:function(event,ui) {
sidebarSeparator.closing = false;
sidebarSeparator.opening = false;
var winWidth = $("#red-ui-editor").width();
sidebarSeparator.start = ui.position.left;
sidebarSeparator.chartWidth = $("#red-ui-workspace").width();
sidebarSeparator.chartRight = winWidth-$("#red-ui-workspace").width()-$("#red-ui-workspace").offset().left-2;
sidebarSeparator.dragging = true;
if (!RED.menu.isSelected("menu-item-sidebar")) {
sidebarSeparator.opening = true;
var newChartRight = 7;
$("#sidebar").addClass("closing");
$("#workspace").css("right",newChartRight);
$("#editor-stack").css("right",newChartRight+1);
$("#sidebar").width(0);
RED.menu.setSelected("menu-item-sidebar",true);
if (!RED.menu.isSelected("menu-item-sidebar")) {
sidebarSeparator.opening = true;
var newChartRight = 7;
$("#red-ui-sidebar").addClass("closing");
$("#red-ui-workspace").css("right",newChartRight);
$("#red-ui-editor-stack").css("right",newChartRight+1);
$("#red-ui-sidebar").width(0);
RED.menu.setSelected("menu-item-sidebar",true);
RED.events.emit("sidebar:resize");
}
sidebarSeparator.width = $("#red-ui-sidebar").width();
},
drag: function(event,ui) {
var d = ui.position.left-sidebarSeparator.start;
var newSidebarWidth = sidebarSeparator.width-d;
if (sidebarSeparator.opening) {
newSidebarWidth -= 3;
}
if (newSidebarWidth > 150) {
if (sidebarSeparator.chartWidth+d < 200) {
ui.position.left = 200+sidebarSeparator.start-sidebarSeparator.chartWidth;
d = ui.position.left-sidebarSeparator.start;
newSidebarWidth = sidebarSeparator.width-d;
}
}
if (newSidebarWidth < 150) {
if (!sidebarSeparator.closing) {
$("#red-ui-sidebar").addClass("closing");
sidebarSeparator.closing = true;
}
if (!sidebarSeparator.opening) {
newSidebarWidth = 150;
ui.position.left = sidebarSeparator.width-(150 - sidebarSeparator.start);
d = ui.position.left-sidebarSeparator.start;
}
} else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) {
sidebarSeparator.closing = false;
$("#red-ui-sidebar").removeClass("closing");
}
var newChartRight = sidebarSeparator.chartRight-d;
$("#red-ui-workspace").css("right",newChartRight);
$("#red-ui-editor-stack").css("right",newChartRight+1);
$("#red-ui-sidebar").width(newSidebarWidth);
sidebar_tabs.resize();
RED.events.emit("sidebar:resize");
},
stop:function(event,ui) {
sidebarSeparator.dragging = false;
if (sidebarSeparator.closing) {
$("#red-ui-sidebar").removeClass("closing");
RED.menu.setSelected("menu-item-sidebar",false);
if ($("#red-ui-sidebar").width() < 180) {
$("#red-ui-sidebar").width(180);
$("#red-ui-workspace").css("right",187);
$("#red-ui-editor-stack").css("right",188);
}
}
$("#red-ui-sidebar-separator").css("left","auto");
$("#red-ui-sidebar-separator").css("right",($("#red-ui-sidebar").width()+2)+"px");
RED.events.emit("sidebar:resize");
}
sidebarSeparator.width = $("#sidebar").width();
},
drag: function(event,ui) {
var d = ui.position.left-sidebarSeparator.start;
var newSidebarWidth = sidebarSeparator.width-d;
if (sidebarSeparator.opening) {
newSidebarWidth -= 3;
}
});
if (newSidebarWidth > 150) {
if (sidebarSeparator.chartWidth+d < 200) {
ui.position.left = 200+sidebarSeparator.start-sidebarSeparator.chartWidth;
d = ui.position.left-sidebarSeparator.start;
newSidebarWidth = sidebarSeparator.width-d;
}
}
if (newSidebarWidth < 150) {
if (!sidebarSeparator.closing) {
$("#sidebar").addClass("closing");
sidebarSeparator.closing = true;
}
if (!sidebarSeparator.opening) {
newSidebarWidth = 150;
ui.position.left = sidebarSeparator.width-(150 - sidebarSeparator.start);
d = ui.position.left-sidebarSeparator.start;
}
} else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) {
sidebarSeparator.closing = false;
$("#sidebar").removeClass("closing");
}
var newChartRight = sidebarSeparator.chartRight-d;
$("#workspace").css("right",newChartRight);
$("#editor-stack").css("right",newChartRight+1);
$("#sidebar").width(newSidebarWidth);
sidebar_tabs.resize();
RED.events.emit("sidebar:resize");
},
stop:function(event,ui) {
sidebarSeparator.dragging = false;
if (sidebarSeparator.closing) {
$("#sidebar").removeClass("closing");
RED.menu.setSelected("menu-item-sidebar",false);
if ($("#sidebar").width() < 180) {
$("#sidebar").width(180);
$("#workspace").css("right",187);
$("#editor-stack").css("right",188);
}
}
$("#sidebar-separator").css("left","auto");
$("#sidebar-separator").css("right",($("#sidebar").width()+2)+"px");
RED.events.emit("sidebar:resize");
}
});
var sidebarControls = $('<div class="sidebar-control-right"><i class="fa fa-chevron-right"</div>').appendTo($("#sidebar-separator"));
sidebarControls.on("click", function() {
sidebarControls.hide();
RED.menu.toggleSelected("menu-item-sidebar");
})
$("#sidebar-separator").on("mouseenter", function() {
if (!sidebarSeparator.dragging) {
if (RED.menu.isSelected("menu-item-sidebar")) {
sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left");
} else {
sidebarControls.find("i").removeClass("fa-chevron-right").addClass("fa-chevron-left");
}
sidebarControls.toggle("slide", { direction: "right" }, 200);
}
})
$("#sidebar-separator").on("mouseleave", function() {
if (!sidebarSeparator.dragging) {
var sidebarControls = $('<div class="red-ui-sidebar-control-right"><i class="fa fa-chevron-right"</div>').appendTo($("#red-ui-sidebar-separator"));
sidebarControls.on("click", function() {
sidebarControls.hide();
}
});
RED.menu.toggleSelected("menu-item-sidebar");
})
$("#red-ui-sidebar-separator").on("mouseenter", function() {
if (!sidebarSeparator.dragging) {
if (RED.menu.isSelected("menu-item-sidebar")) {
sidebarControls.find("i").addClass("fa-chevron-right").removeClass("fa-chevron-left");
} else {
sidebarControls.find("i").removeClass("fa-chevron-right").addClass("fa-chevron-left");
}
sidebarControls.toggle("slide", { direction: "right" }, 200);
}
})
$("#red-ui-sidebar-separator").on("mouseleave", function() {
if (!sidebarSeparator.dragging) {
sidebarControls.stop(false,true);
sidebarControls.hide();
}
});
}
function toggleSidebar(state) {
if (!state) {
$("#main-container").addClass("sidebar-closed");
$("#red-ui-main-container").addClass("red-ui-sidebar-closed");
} else {
$("#main-container").removeClass("sidebar-closed");
$("#red-ui-main-container").removeClass("red-ui-sidebar-closed");
sidebar_tabs.resize();
}
RED.events.emit("sidebar:resize");
@ -233,6 +211,35 @@ RED.sidebar = (function() {
}
function init () {
setupSidebarSeparator();
sidebar_tabs = RED.tabs.create({
element: $('<ul id="red-ui-sidebar-tabs"></ul>').appendTo("#red-ui-sidebar"),
onchange:function(tab) {
$("#red-ui-sidebar-content").children().hide();
$("#red-ui-sidebar-footer").children().hide();
if (tab.onchange) {
tab.onchange.call(tab);
}
$(tab.wrapper).show();
if (tab.toolbar) {
$(tab.toolbar).show();
}
},
onremove: function(tab) {
$(tab.wrapper).hide();
if (tab.onremove) {
tab.onremove.call(tab);
}
},
// minimumActiveTabWidth: 70,
collapsible: true
// scrollable: true
});
$('<div id="red-ui-sidebar-content"></div>').appendTo("#red-ui-sidebar");
$('<div id="red-ui-sidebar-footer" class="red-ui-component-footer"></div>').appendTo("#red-ui-sidebar");
$('<div id="red-ui-sidebar-shade" class="hide"></div>').appendTo("#red-ui-sidebar");
RED.actions.add("core:toggle-sidebar",function(state){
if (state === undefined) {
RED.menu.toggleSelected("menu-item-sidebar");
@ -240,13 +247,13 @@ RED.sidebar = (function() {
toggleSidebar(state);
}
});
RED.popover.tooltip($("#sidebar-separator").find(".sidebar-control-right"),RED._("keyboard.toggleSidebar"),"core:toggle-sidebar");
RED.popover.tooltip($("#red-ui-sidebar-separator").find(".red-ui-sidebar-control-right"),RED._("keyboard.toggleSidebar"),"core:toggle-sidebar");
showSidebar();
RED.sidebar.info.init();
RED.sidebar.config.init();
RED.sidebar.context.init();
// hide info bar at start if screen rather narrow...
if ($(window).width() < 600) { RED.menu.setSelected("menu-item-sidebar",false); }
if ($("#red-ui-editor").width() < 600) { RED.menu.setSelected("menu-item-sidebar",false); }
}
return {

50
packages/node_modules/@node-red/editor-client/src/js/ui/statusBar.js vendored Normal file
View File

@ -0,0 +1,50 @@
/**
* Copyright JS Foundation and other contributors, http://js.foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
**/
/*!
RED.statusBar.add({
id: "widget-identifier",
align: "left|right",
element: widgetElement
})
*/
RED.statusBar = (function() {
var widgets = {};
var leftBucket;
var rightBucket;
function addWidget(options) {
widgets[options.id] = options;
var el = $('<span class="red-ui-statusbar-widget"></span>');
options.element.appendTo(el);
if (options.align === 'left') {
leftBucket.append(el);
} else if (options.align === 'right') {
rightBucket.prepend(el);
}
}
return {
init: function() {
leftBucket = $('<span class="red-ui-statusbar-bucket red-ui-statusbar-bucket-left">').appendTo("#red-ui-workspace-footer");
rightBucket = $('<span class="red-ui-statusbar-bucket red-ui-statusbar-bucket-right">').appendTo("#red-ui-workspace-footer");
},
add: addWidget
}
})();

76
packages/node_modules/@node-red/editor-client/src/js/ui/subflow.js vendored
View File

@ -87,8 +87,8 @@ RED.subflow = (function() {
RED.view.select();
RED.nodes.dirty(true);
RED.view.redraw();
$("#workspace-subflow-input-add").addClass("active");
$("#workspace-subflow-input-remove").removeClass("active");
$("#red-ui-subflow-input-add").addClass("active");
$("#red-ui-subflow-input-remove").removeClass("active");
RED.palette.refresh();
}
@ -108,8 +108,8 @@ RED.subflow = (function() {
});
removedInputLinks.forEach(function(l) { RED.nodes.removeLink(l)});
activeSubflow.in = [];
$("#workspace-subflow-input-add").removeClass("active");
$("#workspace-subflow-input-remove").addClass("active");
$("#red-ui-subflow-input-add").removeClass("active");
$("#red-ui-subflow-input-remove").addClass("active");
activeSubflow.changed = true;
RED.palette.refresh();
return {subflowInputs: [ removedInput ], links:removedInputLinks};
@ -151,7 +151,7 @@ RED.subflow = (function() {
RED.view.select();
RED.nodes.dirty(true);
RED.view.redraw();
$("#workspace-subflow-output .spinner-value").text(subflow.out.length);
$("#red-ui-subflow-output .spinner-value").text(subflow.out.length);
RED.palette.refresh();
}
@ -227,8 +227,8 @@ RED.subflow = (function() {
RED.view.select();
RED.nodes.dirty(true);
RED.view.redraw();
$("#workspace-subflow-status").prop("checked",!!subflow.status);
$("#workspace-subflow-status").parent().parent().toggleClass("active",!!subflow.status);
$("#red-ui-subflow-status").prop("checked",!!subflow.status);
$("#red-ui-subflow-status").parent().parent().toggleClass("active",!!subflow.status);
}
function removeSubflowStatus() {
@ -245,8 +245,8 @@ RED.subflow = (function() {
subflowRemovedLinks.forEach(function(l) { RED.nodes.removeLink(l)});
delete subflow.status;
$("#workspace-subflow-status").prop("checked",!!subflow.status);
$("#workspace-subflow-status").parent().parent().toggleClass("active",!!subflow.status);
$("#red-ui-subflow-status").prop("checked",!!subflow.status);
$("#red-ui-subflow-status").parent().parent().toggleClass("active",!!subflow.status);
return { links: subflowRemovedLinks }
}
@ -282,51 +282,51 @@ RED.subflow = (function() {
function refreshToolbar(activeSubflow) {
if (activeSubflow) {
$("#workspace-subflow-input-add").toggleClass("active", activeSubflow.in.length !== 0);
$("#workspace-subflow-input-remove").toggleClass("active",activeSubflow.in.length === 0);
$("#red-ui-subflow-input-add").toggleClass("active", activeSubflow.in.length !== 0);
$("#red-ui-subflow-input-remove").toggleClass("active",activeSubflow.in.length === 0);
$("#workspace-subflow-output .spinner-value").text(activeSubflow.out.length);
$("#red-ui-subflow-output .spinner-value").text(activeSubflow.out.length);
$("#workspace-subflow-status").prop("checked",!!activeSubflow.status);
$("#workspace-subflow-status").parent().parent().toggleClass("active",!!activeSubflow.status);
$("#red-ui-subflow-status").prop("checked",!!activeSubflow.status);
$("#red-ui-subflow-status").parent().parent().toggleClass("active",!!activeSubflow.status);
}
}
function showWorkspaceToolbar(activeSubflow) {
var toolbar = $("#workspace-toolbar");
var toolbar = $("#red-ui-workspace-toolbar");
toolbar.empty();
// Edit properties
$('<a class="button" id="workspace-subflow-edit" href="#" data-i18n="[append]subflow.editSubflowProperties"><i class="fa fa-pencil"></i> </a>').appendTo(toolbar);
$('<a class="button" id="red-ui-subflow-edit" href="#" data-i18n="[append]subflow.editSubflowProperties"><i class="fa fa-pencil"></i> </a>').appendTo(toolbar);
// Inputs
$('<span style="margin-left: 5px;" data-i18n="subflow.input"></span> '+
'<div style="display: inline-block;" class="button-group">'+
'<a id="workspace-subflow-input-remove" class="button active" href="#">0</a>'+
'<a id="workspace-subflow-input-add" class="button" href="#">1</a>'+
'<a id="red-ui-subflow-input-remove" class="button active" href="#">0</a>'+
'<a id="red-ui-subflow-input-add" class="button" href="#">1</a>'+
'</div>').appendTo(toolbar);
// Outputs
$('<span style="margin-left: 5px;" data-i18n="subflow.output"></span> <div id="workspace-subflow-output" style="display: inline-block;" class="button-group spinner-group">'+
'<a id="workspace-subflow-output-remove" class="button" href="#"><i class="fa fa-minus"></i></a>'+
$('<span style="margin-left: 5px;" data-i18n="subflow.output"></span> <div id="red-ui-subflow-output" style="display: inline-block;" class="button-group spinner-group">'+
'<a id="red-ui-subflow-output-remove" class="button" href="#"><i class="fa fa-minus"></i></a>'+
'<div class="spinner-value">3</div>'+
'<a id="workspace-subflow-output-add" class="button" href="#"><i class="fa fa-plus"></i></a>'+
'<a id="red-ui-subflow-output-add" class="button" href="#"><i class="fa fa-plus"></i></a>'+
'</div>').appendTo(toolbar);
// Status
$('<span class="button-group"><span class="button" style="padding:0"><label for="workspace-subflow-status"><input id="workspace-subflow-status" type="checkbox"> <span data-i18n="subflow.status"></span></label></span></span>').appendTo(toolbar);
$('<span class="button-group"><span class="button" style="padding:0"><label for="red-ui-subflow-status"><input id="red-ui-subflow-status" type="checkbox"> <span data-i18n="subflow.status"></span></label></span></span>').appendTo(toolbar);
// $('<a class="button disabled" id="workspace-subflow-add-input" href="#" data-i18n="[append]subflow.input"><i class="fa fa-plus"></i> </a>').appendTo(toolbar);
// $('<a class="button" id="workspace-subflow-add-output" href="#" data-i18n="[append]subflow.output"><i class="fa fa-plus"></i> </a>').appendTo(toolbar);
// $('<a class="button disabled" id="red-ui-subflow-add-input" href="#" data-i18n="[append]subflow.input"><i class="fa fa-plus"></i> </a>').appendTo(toolbar);
// $('<a class="button" id="red-ui-subflow-add-output" href="#" data-i18n="[append]subflow.output"><i class="fa fa-plus"></i> </a>').appendTo(toolbar);
// Delete
$('<a class="button" id="workspace-subflow-delete" href="#" data-i18n="[append]subflow.deleteSubflow"><i class="fa fa-trash"></i> </a>').appendTo(toolbar);
$('<a class="button" id="red-ui-subflow-delete" href="#" data-i18n="[append]subflow.deleteSubflow"><i class="fa fa-trash"></i> </a>').appendTo(toolbar);
toolbar.i18n();
$("#workspace-subflow-output-remove").on("click", function(event) {
$("#red-ui-subflow-output-remove").on("click", function(event) {
event.preventDefault();
var wasDirty = RED.nodes.dirty();
var wasChanged = activeSubflow.changed;
@ -350,17 +350,17 @@ RED.subflow = (function() {
}
});
$("#workspace-subflow-output-add").on("click", function(event) {
$("#red-ui-subflow-output-add").on("click", function(event) {
event.preventDefault();
addSubflowOutput();
});
$("#workspace-subflow-input-add").on("click", function(event) {
$("#red-ui-subflow-input-add").on("click", function(event) {
event.preventDefault();
addSubflowInput();
});
$("#workspace-subflow-input-remove").on("click", function(event) {
$("#red-ui-subflow-input-remove").on("click", function(event) {
event.preventDefault();
var wasDirty = RED.nodes.dirty();
var wasChanged = activeSubflow.changed;
@ -384,7 +384,7 @@ RED.subflow = (function() {
}
});
$("#workspace-subflow-status").on("change", function(evt) {
$("#red-ui-subflow-status").on("change", function(evt) {
if (this.checked) {
addSubflowStatus();
} else {
@ -411,12 +411,12 @@ RED.subflow = (function() {
}
})
$("#workspace-subflow-edit").on("click", function(event) {
$("#red-ui-subflow-edit").on("click", function(event) {
RED.editor.editSubflow(RED.nodes.subflow(RED.workspaces.active()));
event.preventDefault();
});
$("#workspace-subflow-delete").on("click", function(event) {
$("#red-ui-subflow-delete").on("click", function(event) {
event.preventDefault();
var startDirty = RED.nodes.dirty();
var historyEvent = removeSubflow(RED.workspaces.active());
@ -429,13 +429,13 @@ RED.subflow = (function() {
refreshToolbar(activeSubflow);
$("#chart").css({"margin-top": "40px"});
$("#workspace-toolbar").show();
$("#red-ui-workspace-chart").css({"margin-top": "40px"});
$("#red-ui-workspace-toolbar").show();
}
function hideWorkspaceToolbar() {
$("#workspace-toolbar").hide().empty();
$("#chart").css({"margin-top": "0"});
$("#red-ui-workspace-toolbar").hide().empty();
$("#red-ui-workspace-chart").css({"margin-top": "0"});
}
function removeSubflow(id) {
@ -499,8 +499,8 @@ RED.subflow = (function() {
RED.actions.add("core:create-subflow",createSubflow);
RED.actions.add("core:convert-to-subflow",convertToSubflow);
$(_subflowEditTemplate).appendTo(document.body);
$(_subflowTemplateEditTemplate).appendTo(document.body);
$(_subflowEditTemplate).appendTo("#red-ui-editor-node-configs");
$(_subflowTemplateEditTemplate).appendTo("#red-ui-editor-node-configs");
}

86
packages/node_modules/@node-red/editor-client/src/js/ui/tab-config.js vendored
View File

@ -17,20 +17,20 @@ RED.sidebar.config = (function() {
var content = document.createElement("div");
content.className = "sidebar-node-config";
content.id = "sidebar-node-config";
content.className = "red-ui-sidebar-node-config";
content.id = "red-ui-sidebar-node-config";
content.tabIndex = 0;
$('<div class="sidebar-header"><span class="button-group">'+
'<a class="sidebar-header-button-toggle selected" id="workspace-config-node-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+
'<a class="sidebar-header-button-toggle" id="workspace-config-node-filter-unused" href="#"><span data-i18n="sidebar.config.filterUnused"></span></a> '+
$('<div class="red-ui-sidebar-header"><span class="button-group">'+
'<a class="red-ui-sidebar-header-button-toggle selected" id="red-ui-sidebar-config-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+
'<a class="red-ui-sidebar-header-button-toggle" id="red-ui-sidebar-config-filter-unused" href="#"><span data-i18n="sidebar.config.filterUnused"></span></a> '+
'</span></div>'
).appendTo(content);
var toolbar = $('<div>'+
'<a class="sidebar-footer-button" id="workspace-config-node-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a> '+
'<a class="sidebar-footer-button" id="workspace-config-node-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>'+
'<a class="red-ui-footer-button" id="red-ui-sidebar-config-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a> '+
'<a class="red-ui-footer-button" id="red-ui-sidebar-config-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>'+
'</div>');
var globalCategories = $("<div>").appendTo(content);
@ -44,22 +44,22 @@ RED.sidebar.config = (function() {
function getOrCreateCategory(name,parent,label) {
name = name.replace(/\./i,"-");
if (!categories[name]) {
var container = $('<div class="palette-category workspace-config-node-category" id="workspace-config-node-category-'+name+'"></div>').appendTo(parent);
var header = $('<div class="workspace-config-node-tray-header palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container);
var container = $('<div class="red-ui-palette-category red-ui-sidebar-config-category" id="red-ui-sidebar-config-category-'+name+'"></div>').appendTo(parent);
var header = $('<div class="red-ui-sidebar-config-tray-header red-ui-palette-header"><i class="fa fa-angle-down expanded"></i></div>').appendTo(container);
if (label) {
$('<span class="config-node-label"/>').text(label).appendTo(header);
$('<span class="red-ui-palette-node-config-label"/>').text(label).appendTo(header);
} else {
$('<span class="config-node-label" data-i18n="sidebar.config.'+name+'">').appendTo(header);
$('<span class="red-ui-palette-node-config-label" data-i18n="sidebar.config.'+name+'">').appendTo(header);
}
$('<span class="config-node-filter-info"></span>').appendTo(header);
category = $('<ul class="palette-content config-node-list"></ul>').appendTo(container);
$('<span class="red-ui-sidebar-node-config-filter-info"></span>').appendTo(header);
category = $('<ul class="red-ui-palette-content red-ui-sidebar-node-config-list"></ul>').appendTo(container);
container.i18n();
var icon = header.find("i");
var result = {
label: label,
list: category,
size: function() {
return result.list.find("li:not(.config_node_none)").length
return result.list.find("li:not(.red-ui-palette-node-config-none)").length
},
open: function(snap) {
if (!icon.hasClass("expanded")) {
@ -96,7 +96,7 @@ RED.sidebar.config = (function() {
categories[name] = result;
} else {
if (categories[name].label !== label) {
categories[name].list.parent().find('.config-node-label').text(label);
categories[name].list.parent().find('.red-ui-palette-node-config-label').text(label);
categories[name].label = label;
}
}
@ -119,31 +119,31 @@ RED.sidebar.config = (function() {
})
hiddenCount = hiddenCount - nodes.length;
if (hiddenCount > 0) {
list.parent().find('.config-node-filter-info').text(RED._('sidebar.config.filtered',{count:hiddenCount})).show();
list.parent().find('.red-ui-sidebar-node-config-filter-info').text(RED._('sidebar.config.filtered',{count:hiddenCount})).show();
} else {
list.parent().find('.config-node-filter-info').hide();
list.parent().find('.red-ui-sidebar-node-config-filter-info').hide();
}
} else {
list.parent().find('.config-node-filter-info').hide();
list.parent().find('.red-ui-sidebar-node-config-filter-info').hide();
}
list.empty();
if (nodes.length === 0) {
$('<li class="config_node_none" data-i18n="sidebar.config.none">NONE</li>').i18n().appendTo(list);
$('<li class="red-ui-palette-node-config-none" data-i18n="sidebar.config.none">NONE</li>').i18n().appendTo(list);
category.close(true);
} else {
var currentType = "";
nodes.forEach(function(node) {
var label = RED.utils.getNodeLabel(node,node.id);
if (node.type != currentType) {
$('<li class="config_node_type">'+node.type+'</li>').appendTo(list);
$('<li class="red-ui-palette-node-config-type">'+node.type+'</li>').appendTo(list);
currentType = node.type;
}
var entry = $('<li class="palette_node config_node palette_node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
var entry = $('<li class="red-ui-palette-node red-ui-palette-node-config red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
entry.data('node',node.id);
$('<div class="palette_label"></div>').text(label).appendTo(entry);
$('<div class="red-ui-palette-label"></div>').text(label).appendTo(entry);
if (node._def.hasUsers !== false) {
var iconContainer = $('<div/>',{class:"palette_icon_container palette_icon_container_right"}).appendTo(entry);
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container red-ui-palette-icon-container-right"}).appendTo(entry);
if (node.users.length === 0) {
iconContainer.text(0);
} else {
@ -155,7 +155,7 @@ RED.sidebar.config = (function() {
}
RED.popover.tooltip(iconContainer,RED._('editor.nodesUse',{count:node.users.length}));
if (node.users.length === 0) {
entry.addClass("config_node_unused");
entry.addClass("red-ui-palette-node-config-unused");
}
}
entry.on('click',function(e) {
@ -163,7 +163,7 @@ RED.sidebar.config = (function() {
if (e.metaKey) {
$(this).toggleClass("selected");
} else {
$(content).find(".palette_node").removeClass("selected");
$(content).find(".red-ui-palette-node").removeClass("selected");
$(this).addClass("selected");
}
RED.sidebar.info.refresh(node);
@ -208,8 +208,8 @@ RED.sidebar.config = (function() {
validList[sf.id.replace(/\./g,"-")] = true;
getOrCreateCategory(sf.id,subflowCategories,sf.name);
})
$(".workspace-config-node-category").each(function() {
var id = $(this).attr('id').substring("workspace-config-node-category-".length);
$(".red-ui-sidebar-config-category").each(function() {
var id = $(this).attr('id').substring("red-ui-sidebar-config-category-".length);
if (!validList[id]) {
$(this).remove();
delete categories[id];
@ -246,11 +246,11 @@ RED.sidebar.config = (function() {
});
RED.actions.add("core:show-config-tab", function() {RED.sidebar.show('config')});
RED.actions.add("core:select-all-config-nodes", function() {
$(content).find(".palette_node").addClass("selected");
$(content).find(".red-ui-palette-node").addClass("selected");
})
RED.actions.add("core:delete-config-selection", function() {
var selectedNodes = [];
$(content).find(".palette_node.selected").each(function() {
$(content).find(".red-ui-palette-node.selected").each(function() {
selectedNodes.push($(this).data('node'));
});
if (selectedNodes.length > 0) {
@ -296,10 +296,10 @@ RED.sidebar.config = (function() {
RED.events.on("view:selection-changed",function() {
$(content).find(".palette_node").removeClass("selected");
$(content).find(".red-ui-palette-node").removeClass("selected");
});
$("#workspace-config-node-collapse-all").on("click", function(e) {
$("#red-ui-sidebar-config-collapse-all").on("click", function(e) {
e.preventDefault();
for (var cat in categories) {
if (categories.hasOwnProperty(cat)) {
@ -307,7 +307,7 @@ RED.sidebar.config = (function() {
}
}
});
$("#workspace-config-node-expand-all").on("click", function(e) {
$("#red-ui-sidebar-config-expand-all").on("click", function(e) {
e.preventDefault();
for (var cat in categories) {
if (categories.hasOwnProperty(cat)) {
@ -317,45 +317,45 @@ RED.sidebar.config = (function() {
}
}
});
$('#workspace-config-node-filter-all').on("click",function(e) {
$('#red-ui-sidebar-config-filter-all').on("click",function(e) {
e.preventDefault();
if (showUnusedOnly) {
$(this).addClass('selected');
$('#workspace-config-node-filter-unused').removeClass('selected');
$('#red-ui-sidebar-config-filter-unused').removeClass('selected');
showUnusedOnly = !showUnusedOnly;
refreshConfigNodeList();
}
});
$('#workspace-config-node-filter-unused').on("click",function(e) {
$('#red-ui-sidebar-config-filter-unused').on("click",function(e) {
e.preventDefault();
if (!showUnusedOnly) {
$(this).addClass('selected');
$('#workspace-config-node-filter-all').removeClass('selected');
$('#red-ui-sidebar-config-filter-all').removeClass('selected');
showUnusedOnly = !showUnusedOnly;
refreshConfigNodeList();
}
});
RED.popover.tooltip($('#workspace-config-node-filter-all'),"Show all config nodes");
RED.popover.tooltip($('#workspace-config-node-filter-unused'),"Show all unused config nodes");
RED.popover.tooltip($('#red-ui-sidebar-config-filter-all'),"Show all config nodes");
RED.popover.tooltip($('#red-ui-sidebar-config-filter-unused'),"Show all unused config nodes");
}
function show(id) {
if (typeof id === 'boolean') {
if (id) {
$('#workspace-config-node-filter-unused').trigger("click");
$('#red-ui-sidebar-config-filter-unused').trigger("click");
} else {
$('#workspace-config-node-filter-all').trigger("click");
$('#red-ui-sidebar-config-filter-all').trigger("click");
}
}
refreshConfigNodeList();
if (typeof id === "string") {
$('#workspace-config-node-filter-all').trigger("click");
$('#red-ui-sidebar-config-filter-all').trigger("click");
id = id.replace(/\./g,"-");
setTimeout(function() {
var node = $(".palette_node_id_"+id);
var node = $(".red-ui-palette-node_id_"+id);
var y = node.position().top;
var h = node.height();
var scrollWindow = $(".sidebar-node-config");
var scrollWindow = $(".red-ui-sidebar-node-config");
var scrollHeight = scrollWindow.height();
if (y+h > scrollHeight) {

52
packages/node_modules/@node-red/editor-client/src/js/ui/tab-context.js vendored
View File

@ -32,17 +32,13 @@ RED.sidebar.context = (function() {
function init() {
content = $("<div>").css({"position":"relative","height":"100%"});
content.className = "sidebar-context"
// var toolbar = $('<div class="sidebar-header">'+
// '</div>').appendTo(content);
content.className = "red-ui-sidebar-context"
var footerToolbar = $('<div>'+
// '<span class="button-group"><a class="sidebar-footer-button" href="#" data-i18n="[title]node-red:debug.sidebar.openWindow"><i class="fa fa-desktop"></i></a></span> ' +
'</div>');
var footerToolbar = $('<div></div>');
var stackContainer = $("<div>",{class:"sidebar-context-stack"}).appendTo(content);
var stackContainer = $("<div>",{class:"red-ui-sidebar-context-stack"}).appendTo(content);
sections = RED.stack.create({
container: stackContainer
});
@ -56,11 +52,11 @@ RED.sidebar.context = (function() {
});
nodeSection.expand();
nodeSection.content.css({height:"100%"});
nodeSection.timestamp = $('<div class="sidebar-context-updated">&nbsp;</div>').appendTo(nodeSection.content);
var table = $('<table class="node-info"></table>').appendTo(nodeSection.content);
nodeSection.timestamp = $('<div class="red-ui-sidebar-context-updated">&nbsp;</div>').appendTo(nodeSection.content);
var table = $('<table class="red-ui-info-table"></table>').appendTo(nodeSection.content);
nodeSection.table = $('<tbody>').appendTo(table);
var bg = $('<div style="float: right"></div>').appendTo(nodeSection.header);
$('<button class="editor-button editor-button-small"><i class="fa fa-refresh"></i></button>')
$('<button class="red-ui-button red-ui-button-small"><i class="fa fa-refresh"></i></button>')
.appendTo(bg)
.on("click", function(evt) {
evt.stopPropagation();
@ -75,7 +71,7 @@ RED.sidebar.context = (function() {
// subflowSection.expand();
// subflowSection.content.css({height:"100%"});
// bg = $('<div style="float: right"></div>').appendTo(subflowSection.header);
// $('<button class="editor-button editor-button-small"><i class="fa fa-refresh"></i></button>')
// $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-refresh"></i></button>')
// .appendTo(bg)
// .on("click", function(evt) {
// evt.stopPropagation();
@ -90,11 +86,11 @@ RED.sidebar.context = (function() {
});
flowSection.expand();
flowSection.content.css({height:"100%"});
flowSection.timestamp = $('<div class="sidebar-context-updated">&nbsp;</div>').appendTo(flowSection.content);
var table = $('<table class="node-info"></table>').appendTo(flowSection.content);
flowSection.timestamp = $('<div class="red-ui-sidebar-context-updated">&nbsp;</div>').appendTo(flowSection.content);
var table = $('<table class="red-ui-info-table"></table>').appendTo(flowSection.content);
flowSection.table = $('<tbody>').appendTo(table);
bg = $('<div style="float: right"></div>').appendTo(flowSection.header);
$('<button class="editor-button editor-button-small"><i class="fa fa-refresh"></i></button>')
$('<button class="red-ui-button red-ui-button-small"><i class="fa fa-refresh"></i></button>')
.appendTo(bg)
.on("click", function(evt) {
evt.stopPropagation();
@ -108,12 +104,12 @@ RED.sidebar.context = (function() {
});
globalSection.expand();
globalSection.content.css({height:"100%"});
globalSection.timestamp = $('<div class="sidebar-context-updated">&nbsp;</div>').appendTo(globalSection.content);
var table = $('<table class="node-info"></table>').appendTo(globalSection.content);
globalSection.timestamp = $('<div class="red-ui-sidebar-context-updated">&nbsp;</div>').appendTo(globalSection.content);
var table = $('<table class="red-ui-info-table"></table>').appendTo(globalSection.content);
globalSection.table = $('<tbody>').appendTo(table);
bg = $('<div style="float: right"></div>').appendTo(globalSection.header);
$('<button class="editor-button editor-button-small"><i class="fa fa-refresh"></i></button>')
$('<button class="red-ui-button red-ui-button-small"><i class="fa fa-refresh"></i></button>')
.appendTo(bg)
.on("click", function(evt) {
evt.stopPropagation();
@ -189,9 +185,9 @@ RED.sidebar.context = (function() {
} else {
$(nodeSection.table).empty();
if (node) {
$('<tr class="node-info-node-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.refresh"></td></tr>').appendTo(nodeSection.table).i18n();
$('<tr class="red-ui-help-info-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.refresh"></td></tr>').appendTo(nodeSection.table).i18n();
} else {
$('<tr class="node-info-node-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.none"></td></tr>').appendTo(nodeSection.table).i18n();
$('<tr class="red-ui-help-info-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.none"></td></tr>').appendTo(nodeSection.table).i18n();
}
nodeSection.timestamp.html("&nbsp;");
@ -234,12 +230,12 @@ RED.sidebar.context = (function() {
sortedData[keys[i]].forEach(function(v) {
var k = keys[i];
var l2 = sortedData[k].length;
var propRow = $('<tr class="node-info-node-row"><td class="sidebar-context-property"></td><td></td></tr>').appendTo(container);
var propRow = $('<tr class="red-ui-help-info-row"><td class="red-ui-sidebar-context-property"></td><td></td></tr>').appendTo(container);
var obj = $(propRow.children()[0]);
obj.text(k);
var tools = $('<span class="button-group"></span>');
var refreshItem = $('<button class="editor-button editor-button-small"><i class="fa fa-refresh"></i></button>').appendTo(tools).on("click", function(e) {
var refreshItem = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-refresh"></i></button>').appendTo(tools).on("click", function(e) {
e.preventDefault();
e.stopPropagation();
$.getJSON(baseUrl+"/"+k+"?store="+v.store, function(data) {
@ -256,7 +252,7 @@ RED.sidebar.context = (function() {
}
})
});
var deleteItem = $('<button class="editor-button editor-button-small"><i class="fa fa-trash"></i></button>').appendTo(tools).on("click", function(e) {
var deleteItem = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-trash"></i></button>').appendTo(tools).on("click", function(e) {
e.preventDefault();
e.stopPropagation();
var popover = RED.popover.create({
@ -268,12 +264,12 @@ RED.sidebar.context = (function() {
$('<p data-i18n="sidebar.context.deleteConfirm"></p>').appendTo(content);
var row = $('<p>').appendTo(content);
var bg = $('<span class="button-group"></span>').appendTo(row);
$('<button class="editor-button" data-i18n="common.label.cancel"></button>').appendTo(bg).on("click", function(e) {
$('<button class="red-ui-button" data-i18n="common.label.cancel"></button>').appendTo(bg).on("click", function(e) {
e.preventDefault();
popover.close();
});
bg = $('<span class="button-group"></span>').appendTo(row);
$('<button class="editor-button primary" data-i18n="common.label.delete"></button>').appendTo(bg).on("click", function(e) {
$('<button class="red-ui-button primary" data-i18n="common.label.delete"></button>').appendTo(bg).on("click", function(e) {
e.preventDefault();
popover.close();
$.ajax({
@ -284,7 +280,7 @@ RED.sidebar.context = (function() {
if (data.format === 'undefined') {
propRow.remove();
if (container.children().length === 0) {
$('<tr class="node-info-node-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.empty"></td></tr>').appendTo(container).i18n();
$('<tr class="red-ui-help-info-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.empty"></td></tr>').appendTo(container).i18n();
}
} else {
payload = data.msg;
@ -316,12 +312,12 @@ RED.sidebar.context = (function() {
tools: tools
}).appendTo(propRow.children()[1]);
if (contextStores.length > 1) {
$("<span>",{class:"sidebar-context-property-storename"}).text(v.store).appendTo($(propRow.children()[0]))
$("<span>",{class:"red-ui-sidebar-context-property-storename"}).text(v.store).appendTo($(propRow.children()[0]))
}
});
}
if (l === 0) {
$('<tr class="node-info-node-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.empty"></td></tr>').appendTo(container).i18n();
$('<tr class="red-ui-help-info-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.empty"></td></tr>').appendTo(container).i18n();
}
$(section.timestamp).text(new Date().toLocaleString());
});
@ -332,7 +328,7 @@ RED.sidebar.context = (function() {
refreshEntry(section,baseUrl,id);
} else {
$(container).empty();
$('<tr class="node-info-node-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.none"></td></tr>').appendTo(container).i18n();
$('<tr class="red-ui-help-info-row red-ui-search-empty blank" colspan="2"><td data-i18n="sidebar.context.none"></td></tr>').appendTo(container).i18n();
}
}

86
packages/node_modules/@node-red/editor-client/src/js/ui/tab-info.js vendored
View File

@ -40,11 +40,11 @@ RED.sidebar.info = (function() {
function init() {
content = document.createElement("div");
content.className = "sidebar-node-info"
content.className = "red-ui-sidebar-info"
RED.actions.add("core:show-info-tab",show);
var stackContainer = $("<div>",{class:"sidebar-node-info-stack"}).appendTo(content);
var stackContainer = $("<div>",{class:"red-ui-sidebar-info-stack"}).appendTo(content);
sections = RED.stack.create({
container: stackContainer
@ -70,17 +70,17 @@ RED.sidebar.info = (function() {
helpSection.expand();
helpSection.content.css("padding","6px");
var tipContainer = $('<div class="node-info-tips"></div>').appendTo(content);
tipBox = $('<div class="node-info-tip"></div>').appendTo(tipContainer);
var tipButtons = $('<div class="node-info-tips-buttons"></div>').appendTo(tipContainer);
var tipContainer = $('<div class="red-ui-help-tips"></div>').appendTo(content);
tipBox = $('<div class="red-ui-help-tip"></div>').appendTo(tipContainer);
var tipButtons = $('<div class="red-ui-help-tips-buttons"></div>').appendTo(tipContainer);
var tipRefresh = $('<a href="#" class="workspace-footer-button"><i class="fa fa-refresh"></a>').appendTo(tipButtons);
var tipRefresh = $('<a href="#" class="red-ui-footer-button"><i class="fa fa-refresh"></a>').appendTo(tipButtons);
tipRefresh.on("click", function(e) {
e.preventDefault();
tips.next();
})
var tipClose = $('<a href="#" class="workspace-footer-button"><i class="fa fa-times"></a>').appendTo(tipButtons);
var tipClose = $('<a href="#" class="red-ui-footer-button"><i class="fa fa-times"></a>').appendTo(tipButtons);
tipClose.on("click", function(e) {
e.preventDefault();
RED.actions.invoke("core:toggle-show-tips");
@ -131,7 +131,7 @@ RED.sidebar.info = (function() {
var propRow;
var table = $('<table class="node-info"></table>').appendTo(propertiesSection.content);
var table = $('<table class="red-ui-info-table"></table>').appendTo(propertiesSection.content);
var tableBody = $('<tbody>').appendTo(table);
var subflowNode;
@ -139,10 +139,10 @@ RED.sidebar.info = (function() {
var activeProject = RED.projects.getActiveProject();
if (activeProject) {
propRow = $('<tr class="node-info-node-row"><td>Project</td><td></td></tr>').appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>Project</td><td></td></tr>').appendTo(tableBody);
$(propRow.children()[1]).text(activeProject.name||"");
$('<tr class="node-info-property-expand blank"><td colspan="2"></td></tr>').appendTo(tableBody);
var editProjectButton = $('<button class="editor-button editor-button-small" style="position:absolute;right:2px;"><i class="fa fa-ellipsis-h"></i></button>')
$('<tr class="red-ui-help-property-expand blank"><td colspan="2"></td></tr>').appendTo(tableBody);
var editProjectButton = $('<button class="red-ui-button red-ui-button-small" style="position:absolute;right:2px;"><i class="fa fa-ellipsis-h"></i></button>')
.appendTo(propRow.children()[1])
.on("click", function(evt) {
evt.preventDefault();
@ -177,7 +177,7 @@ RED.sidebar.info = (function() {
helpSection.container.hide();
infoSection.container.hide();
// - show the count of selected nodes
propRow = $('<tr class="node-info-node-row"><td>'+RED._("sidebar.info.selection")+"</td><td></td></tr>").appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info.selection")+"</td><td></td></tr>").appendTo(tableBody);
var counts = $('<div>').appendTo($(propRow.children()[1]));
if (types.flows > 0) {
@ -211,24 +211,24 @@ RED.sidebar.info = (function() {
}
if (node.type === "tab" || node.type === "subflow") {
// If nothing is selected, but we're on a flow or subflow tab.
propRow = $('<tr class="node-info-node-row"><td>'+RED._("sidebar.info."+(node.type==='tab'?'flow':'subflow'))+'</td><td></td></tr>').appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info."+(node.type==='tab'?'flow':'subflow'))+'</td><td></td></tr>').appendTo(tableBody);
RED.utils.createObjectElement(node.id).appendTo(propRow.children()[1]);
propRow = $('<tr class="node-info-node-row"><td>'+RED._("sidebar.info.tabName")+"</td><td></td></tr>").appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info.tabName")+"</td><td></td></tr>").appendTo(tableBody);
$(propRow.children()[1]).text(node.label||node.name||"");
if (node.type === "tab") {
propRow = $('<tr class="node-info-node-row"><td>'+RED._("sidebar.info.status")+'</td><td></td></tr>').appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info.status")+'</td><td></td></tr>').appendTo(tableBody);
$(propRow.children()[1]).text((!!!node.disabled)?RED._("sidebar.info.enabled"):RED._("sidebar.info.disabled"))
}
} else {
// An actual node is selected in the editor - build up its properties table
propRow = $('<tr class="node-info-node-row"><td>'+RED._("sidebar.info.node")+"</td><td></td></tr>").appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info.node")+"</td><td></td></tr>").appendTo(tableBody);
RED.utils.createObjectElement(node.id).appendTo(propRow.children()[1]);
if (node.type !== "subflow" && node.type !== "unknown" && node.name) {
propRow = $('<tr class="node-info-node-row"><td>'+RED._("common.label.name")+'</td><td></td></tr>').appendTo(tableBody);
$('<span class="bidiAware" dir="'+RED.text.bidi.resolveBaseTextDir(node.name)+'"></span>').text(node.name).appendTo(propRow.children()[1]);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("common.label.name")+'</td><td></td></tr>').appendTo(tableBody);
$('<span class="red-ui-text-bidi-aware" dir="'+RED.text.bidi.resolveBaseTextDir(node.name)+'"></span>').text(node.name).appendTo(propRow.children()[1]);
}
if (!m) {
propRow = $('<tr class="node-info-node-row"><td>'+RED._("sidebar.info.type")+"</td><td></td></tr>").appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("sidebar.info.type")+"</td><td></td></tr>").appendTo(tableBody);
$(propRow.children()[1]).text((node.type === "unknown")?node._orig.type:node.type);
if (node.type === "unknown") {
$('<span style="float: right; font-size: 0.8em"><i class="fa fa-warning"></i></span>').prependTo($(propRow.children()[1]))
@ -246,11 +246,11 @@ RED.sidebar.info = (function() {
})
} else if (node._def) {
defaults = node._def.defaults;
propRow = $('<tr class="node-info-property-row'+(expandedSections.property?"":" hide")+'"><td>'+RED._("sidebar.info.module")+"</td><td></td></tr>").appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-property-row'+(expandedSections.property?"":" hide")+'"><td>'+RED._("sidebar.info.module")+"</td><td></td></tr>").appendTo(tableBody);
$(propRow.children()[1]).text(RED.nodes.getType(node.type).set.module);
count++;
}
$('<tr class="node-info-property-expand node-info-property-row blank'+(expandedSections.property?"":" hide")+'"><td colspan="2"></td></tr>').appendTo(tableBody);
$('<tr class="red-ui-help-property-expand red-ui-help-info-property-row blank'+(expandedSections.property?"":" hide")+'"><td colspan="2"></td></tr>').appendTo(tableBody);
if (defaults) {
for (var n in defaults) {
@ -258,7 +258,7 @@ RED.sidebar.info = (function() {
var val = node[n];
var type = typeof val;
count++;
propRow = $('<tr class="node-info-property-row'+(expandedSections.property?"":" hide")+'"><td>'+n+"</td><td></td></tr>").appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-property-row'+(expandedSections.property?"":" hide")+'"><td>'+n+"</td><td></td></tr>").appendTo(tableBody);
if (defaults[n].type) {
var configNode = RED.nodes.node(val);
if (!configNode) {
@ -268,12 +268,12 @@ RED.sidebar.info = (function() {
var container = propRow.children()[1];
var div = $('<span>',{class:""}).appendTo(container);
var nodeDiv = $('<div>',{class:"palette_node palette_node_small"}).appendTo(div);
var nodeDiv = $('<div>',{class:"red-ui-palette-node red-ui-palette-node-small"}).appendTo(div);
var colour = RED.utils.getNodeColor(configNode.type,configNode._def);
var icon_url = RED.utils.getNodeIcon(configNode._def);
nodeDiv.css({'backgroundColor':colour, "cursor":"pointer"});
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
$('<div/>',{class:"palette_icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
$('<div/>',{class:"red-ui-palette-icon",style:"background-image: url("+icon_url+")"}).appendTo(iconContainer);
var nodeContainer = $('<span></span>').css({"verticalAlign":"top","marginLeft":"6px"}).text(configLabel).appendTo(container);
nodeDiv.on('dblclick',function() {
@ -288,18 +288,18 @@ RED.sidebar.info = (function() {
}
}
if (count > 0) {
$('<tr class="node-info-property-expand blank"><td colspan="2"><a href="#" class=" node-info-property-header'+(expandedSections.property?" expanded":"")+'"><span class="node-info-property-show-more">'+RED._("sidebar.info.showMore")+'</span><span class="node-info-property-show-less">'+RED._("sidebar.info.showLess")+'</span> <i class="fa fa-caret-down"></i></a></td></tr>').appendTo(tableBody);
$('<tr class="red-ui-help-property-expand blank"><td colspan="2"><a href="#" class="node-info-property-header'+(expandedSections.property?" expanded":"")+'"><span class="red-ui-help-property-more">'+RED._("sidebar.info.showMore")+'</span><span class="red-ui-help-property-less">'+RED._("sidebar.info.showLess")+'</span> <i class="fa fa-caret-down"></i></a></td></tr>').appendTo(tableBody);
}
}
if (node.type !== 'tab') {
if (m) {
$('<tr class="blank"><th colspan="2">'+RED._("sidebar.info.subflow")+'</th></tr>').appendTo(tableBody);
$('<tr class="node-info-subflow-row"><td>'+RED._("common.label.name")+'</td><td><span class="bidiAware" dir=\"'+RED.text.bidi.resolveBaseTextDir(subflowNode.name)+'">'+RED.utils.sanitize(subflowNode.name)+'</span></td></tr>').appendTo(tableBody);
$('<tr class="node-info-subflow-row"><td>'+RED._("common.label.name")+'</td><td><span class="red-ui-text-bidi-aware" dir=\"'+RED.text.bidi.resolveBaseTextDir(subflowNode.name)+'">'+RED.utils.sanitize(subflowNode.name)+'</span></td></tr>').appendTo(tableBody);
}
}
}
if (m) {
propRow = $('<tr class="node-info-node-row"><td>'+RED._("subflow.category")+'</td><td></td></tr>').appendTo(tableBody);
propRow = $('<tr class="red-ui-help-info-row"><td>'+RED._("subflow.category")+'</td><td></td></tr>').appendTo(tableBody);
var category = subflowNode.category||"subflows";
$(propRow.children()[1]).text(RED._("palette.label."+category,{defaultValue:category}))
$('<tr class="node-info-subflow-row"><td>'+RED._("sidebar.info.instances")+"</td><td>"+subflowUserCount+'</td></tr>').appendTo(tableBody);
@ -313,9 +313,9 @@ RED.sidebar.info = (function() {
if (subflowNode && node.type !== "subflow") {
// Selected a subflow instance node.
// - The subflow template info goes into help
helpText = (marked(subflowNode.info||"")||('<span class="node-info-none">'+RED._("sidebar.info.none")+'</span>'));
helpText = (marked(subflowNode.info||"")||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>'));
} else {
helpText = $("script[data-help-name='"+node.type+"']").html()||('<span class="node-info-none">'+RED._("sidebar.info.none")+'</span>');
helpText = $("script[data-help-name='"+node.type+"']").html()||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>');
}
setInfoText(helpText, helpSection.content);
}
@ -332,34 +332,34 @@ RED.sidebar.info = (function() {
}
setInfoText(infoText, infoSection.content);
$(".sidebar-node-info-stack").scrollTop(0);
$(".red-ui-sidebar-info-stack").scrollTop(0);
$(".node-info-property-header").on("click", function(e) {
e.preventDefault();
expandedSections["property"] = !expandedSections["property"];
$(this).toggleClass("expanded",expandedSections["property"]);
$(".node-info-property-row").toggle(expandedSections["property"]);
$(".red-ui-help-info-property-row").toggle(expandedSections["property"]);
});
}
// $('<tr class="blank"><th colspan="2"></th></tr>').appendTo(tableBody);
// propRow = $('<tr class="node-info-node-row"><td>Actions</td><td></td></tr>').appendTo(tableBody);
// propRow = $('<tr class="red-ui-help-info-row"><td>Actions</td><td></td></tr>').appendTo(tableBody);
// var actionBar = $(propRow.children()[1]);
//
// // var actionBar = $('<div>',{style:"background: #fefefe; padding: 3px;"}).appendTo(propertiesSection.content);
// $('<button type="button" class="editor-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
// $('<button type="button" class="editor-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
// $('<button type="button" class="editor-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
// $('<button type="button" class="editor-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
// $('<button type="button" class="red-ui-button"><i class="fa fa-code"></i></button>').appendTo(actionBar);
}
function setInfoText(infoText,target) {
var info = addTargetToExternalLinks($('<div class="node-help"><span class="bidiAware" dir=\"'+RED.text.bidi.resolveBaseTextDir(infoText)+'">'+infoText+'</span></div>')).appendTo(target);
info.find(".bidiAware").contents().filter(function() { return this.nodeType === 3 && this.textContent.trim() !== "" }).wrap( "<span></span>" );
var info = addTargetToExternalLinks($('<div class="red-ui-help"><span class="red-ui-text-bidi-aware" dir=\"'+RED.text.bidi.resolveBaseTextDir(infoText)+'">'+infoText+'</span></div>')).appendTo(target);
info.find(".red-ui-text-bidi-aware").contents().filter(function() { return this.nodeType === 3 && this.textContent.trim() !== "" }).wrap( "<span></span>" );
var foldingHeader = "H3";
info.find(foldingHeader).wrapInner('<a class="node-info-header expanded" href="#"></a>')
info.find(foldingHeader).wrapInner('<a class="red-ui-help-info-header expanded" href="#"></a>')
.find("a").prepend('<i class="fa fa-angle-right">').on("click", function(e) {
e.preventDefault();
var isExpanded = $(this).hasClass('expanded');
@ -420,7 +420,7 @@ RED.sidebar.info = (function() {
})
}
function startTips() {
$(".sidebar-node-info").addClass('show-tips');
$(".red-ui-sidebar-info").addClass('show-tips');
if (enabled) {
if (!startTimeout && !refreshTimeout) {
if (tipCount === -1) {
@ -433,7 +433,7 @@ RED.sidebar.info = (function() {
}
}
function stopTips() {
$(".sidebar-node-info").removeClass('show-tips');
$(".red-ui-sidebar-info").removeClass('show-tips');
clearInterval(refreshTimeout);
clearTimeout(startTimeout);
refreshTimeout = null;
@ -466,7 +466,7 @@ RED.sidebar.info = (function() {
infoSection.container.show();
//helpSection.title.text(title||RED._("sidebar.info.info"));
setInfoText(html,infoSection.content);
$(".sidebar-node-info-stack").scrollTop(0);
$(".red-ui-sidebar-info-stack").scrollTop(0);
}
function refreshSelection(selection) {

41
packages/node_modules/@node-red/editor-client/src/js/ui/touch/radialMenu.js vendored
View File

@ -16,20 +16,17 @@
RED.touch = RED.touch||{};
RED.touch.radialMenu = (function() {
var touchMenu = null;
var isActive = false;
var isOutside = false;
var activeOption = null;
function createRadial(obj,pos,options) {
isActive = true;
try {
var w = $("body").width();
var h = $("body").height();
touchMenu = d3.select("body").append("div")
.style({
position:"absolute",
@ -43,10 +40,7 @@ RED.touch.radialMenu = (function() {
hide();
d3.event.preventDefault();
});
var menu = touchMenu.append("div")
.style({
position: "absolute",
@ -58,7 +52,7 @@ RED.touch.radialMenu = (function() {
background: "rgba(255,255,255,0.6)",
border: "1px solid #666"
});
var menuOpts = [];
var createMenuOpt = function(x,y,opt) {
opt.el = menu.append("div")
@ -74,16 +68,16 @@ RED.touch.radialMenu = (function() {
"text-align": "center",
"line-height":"50px"
});
opt.el.html(opt.name);
if (opt.disabled) {
opt.el.style({"border-color":"#ccc",color:"#ccc"});
}
opt.x = x;
opt.y = y;
menuOpts.push(opt);
opt.el.on('touchstart',function() {
opt.el.style("background","#999");
d3.event.preventDefault();
@ -96,7 +90,7 @@ RED.touch.radialMenu = (function() {
d3.event.stopPropagation();
});
}
var n = options.length;
var dang = Math.max(Math.PI/(n-1),Math.PI/4);
var ang = Math.PI;
@ -108,7 +102,7 @@ RED.touch.radialMenu = (function() {
}
ang += dang;
}
var hide = function() {
isActive = false;
@ -116,11 +110,11 @@ RED.touch.radialMenu = (function() {
touchMenu.remove();
touchMenu = null;
}
obj.on('touchend.radial',function() {
obj.on('touchend.radial',null);
obj.on('touchmenu.radial',null);
if (activeOption) {
try {
activeOption.onselect();
@ -133,8 +127,6 @@ RED.touch.radialMenu = (function() {
}
});
obj.on('touchmove.radial',function() {
try {
var touch0 = d3.event.touches.item(0);
@ -159,20 +151,20 @@ RED.touch.radialMenu = (function() {
var d = Math.abs((p[0]*p[0])+(p[1]*p[1]));
isOutside = (d > 80*80);
}
} catch(err) {
RED._debug(err);
}
});
} catch(err) {
RED._debug(err);
}
}
}
return {
show: createRadial,
active: function() {
@ -181,4 +173,3 @@ RED.touch.radialMenu = (function() {
}
})();

74
packages/node_modules/@node-red/editor-client/src/js/ui/tray.js vendored
View File

@ -16,33 +16,33 @@
RED.tray = (function() {
var stack = [];
var editorStack = $("#editor-stack");
var editorStack;
var openingTray = false;
function resize() {
}
function showTray(options) {
var el = $('<div class="editor-tray"></div>');
var header = $('<div class="editor-tray-header"></div>').appendTo(el);
var bodyWrapper = $('<div class="editor-tray-body-wrapper"></div>').appendTo(el);
var body = $('<div class="editor-tray-body"></div>').appendTo(bodyWrapper);
var footer = $('<div class="editor-tray-footer"></div>').appendTo(el);
var resizer = $('<div class="editor-tray-resize-handle"></div>').appendTo(el);
// var growButton = $('<a class="editor-tray-resize-button" style="cursor: w-resize;"><i class="fa fa-angle-left"></i></a>').appendTo(resizer);
// var shrinkButton = $('<a class="editor-tray-resize-button" style="cursor: e-resize;"><i style="margin-left: 1px;" class="fa fa-angle-right"></i></a>').appendTo(resizer);
var el = $('<div class="red-ui-tray"></div>');
var header = $('<div class="red-ui-tray-header"></div>').appendTo(el);
var bodyWrapper = $('<div class="red-ui-tray-body-wrapper"></div>').appendTo(el);
var body = $('<div class="red-ui-tray-body"></div>').appendTo(bodyWrapper);
var footer = $('<div class="red-ui-tray-footer"></div>').appendTo(el);
var resizer = $('<div class="red-ui-tray-resize-handle"></div>').appendTo(el);
// var growButton = $('<a class="red-ui-tray-resize-button" style="cursor: w-resize;"><i class="fa fa-angle-left"></i></a>').appendTo(resizer);
// var shrinkButton = $('<a class="red-ui-tray-resize-button" style="cursor: e-resize;"><i style="margin-left: 1px;" class="fa fa-angle-right"></i></a>').appendTo(resizer);
if (options.title) {
var titles = stack.map(function(e) { return e.options.title });
titles.push(options.title);
var title = '<ul class="editor-tray-breadcrumbs"><li>'+titles.join("</li><li>")+'</li></ul>';
var title = '<ul class="red-ui-tray-breadcrumbs"><li>'+titles.join("</li><li>")+'</li></ul>';
$('<div class="editor-tray-titlebar">'+title+'</div>').appendTo(header);
$('<div class="red-ui-tray-titlebar">'+title+'</div>').appendTo(header);
}
if (options.width === Infinity) {
options.maximized = true;
resizer.addClass('editor-tray-resize-maximised');
resizer.addClass('red-ui-tray-resize-maximised');
}
var buttonBar = $('<div class="editor-tray-toolbar"></div>').appendTo(header);
var buttonBar = $('<div class="red-ui-tray-toolbar"></div>').appendTo(header);
var primaryButton;
if (options.buttons) {
for (var i=0;i<options.buttons.length;i++) {
@ -115,17 +115,17 @@ RED.tray = (function() {
}
function finishBuild() {
$("#header-shade").show();
$("#editor-shade").show();
$("#palette-shade").show();
$(".sidebar-shade").show();
$("#red-ui-header-shade").show();
$("#red-ui-editor-shade").show();
$("#red-ui-palette-shade").show();
$(".red-ui-sidebar-shade").show();
tray.preferredWidth = Math.max(el.width(),500);
if (!options.maximized) {
body.css({"minWidth":tray.preferredWidth-40});
}
if (options.width) {
if (options.width > $("#editor-stack").position().left-8) {
options.width = $("#editor-stack").position().left-8;
if (options.width > $("#red-ui-editor-stack").position().left-8) {
options.width = $("#red-ui-editor-stack").position().left-8;
}
el.width(options.width);
} else {
@ -133,15 +133,15 @@ RED.tray = (function() {
}
tray.width = el.width();
if (tray.width > $("#editor-stack").position().left-8) {
tray.width = Math.max(0/*tray.preferredWidth*/,$("#editor-stack").position().left-8);
if (tray.width > $("#red-ui-editor-stack").position().left-8) {
tray.width = Math.max(0/*tray.preferredWidth*/,$("#red-ui-editor-stack").position().left-8);
el.width(tray.width);
}
// tray.body.parent().width(Math.min($("#editor-stack").position().left-8,tray.width));
// tray.body.parent().width(Math.min($("#red-ui-editor-stack").position().left-8,tray.width));
$("#main-container").scrollLeft(0);
$("#red-ui-main-container").scrollLeft(0);
el.css({
right: -(el.width()+10)+"px",
transition: "right 0.25s ease"
@ -151,7 +151,7 @@ RED.tray = (function() {
setTimeout(function() {
setTimeout(function() {
if (!options.width) {
el.width(Math.min(tray.preferredWidth,$("#editor-stack").position().left-8));
el.width(Math.min(tray.preferredWidth,$("#red-ui-editor-stack").position().left-8));
}
if (options.resize) {
options.resize({width:el.width()});
@ -184,32 +184,34 @@ RED.tray = (function() {
function handleWindowResize() {
if (stack.length > 0) {
var tray = stack[stack.length-1];
var trayHeight = tray.tray.height()-tray.header.outerHeight()-tray.footer.outerHeight();
tray.body.height(trayHeight);
if (tray.options.maximized || tray.width > $("#editor-stack").position().left-8) {
tray.width = $("#editor-stack").position().left-8;
if (tray.options.maximized || tray.width > $("#red-ui-editor-stack").position().left-8) {
tray.width = $("#red-ui-editor-stack").position().left-8;
tray.tray.width(tray.width);
// tray.body.parent().width(tray.width);
} else if (tray.width < tray.preferredWidth) {
tray.width = Math.min($("#editor-stack").position().left-8,tray.preferredWidth);
tray.width = Math.min($("#red-ui-editor-stack").position().left-8,tray.preferredWidth);
tray.tray.width(tray.width);
// tray.body.parent().width(tray.width);
}
var trayHeight = tray.tray.height()-tray.header.outerHeight()-tray.footer.outerHeight();
tray.body.height(trayHeight);
if (tray.options.resize) {
tray.options.resize({width:tray.width, height:trayHeight});
}
}
}
return {
init: function init() {
editorStack = $("#red-ui-editor-stack");
$(window).on("resize", handleWindowResize);
RED.events.on("sidebar:resize",handleWindowResize);
$("#editor-shade").on("click", function() {
$("#red-ui-editor-shade").on("click", function() {
if (!openingTray) {
var tray = stack[stack.length-1];
if (tray && tray.primaryButton) {
tray.primaryButton.trigger("click");
tray.primaryButton.click();
}
}
});
@ -248,7 +250,7 @@ RED.tray = (function() {
if (stack.length > 0) {
var oldTray = stack[stack.length-1];
if (!oldTray.options.overlay) {
oldTray.tray.appendTo("#editor-stack");
oldTray.tray.appendTo("#red-ui-editor-stack");
setTimeout(function() {
handleWindowResize();
oldTray.tray.css({right:0});
@ -267,10 +269,10 @@ RED.tray = (function() {
done();
}
if (stack.length === 0) {
$("#header-shade").hide();
$("#editor-shade").hide();
$("#palette-shade").hide();
$(".sidebar-shade").hide();
$("#red-ui-header-shade").hide();
$("#red-ui-editor-shade").hide();
$("#red-ui-palette-shade").hide();
$(".red-ui-sidebar-shade").hide();
RED.events.emit("editor:close");
RED.view.focus();
}

27
packages/node_modules/@node-red/editor-client/src/js/ui/typeSearch.js vendored
View File

@ -45,8 +45,7 @@ RED.typeSearch = (function() {
}
function createDialog() {
//shade = $('<div>',{class:"red-ui-type-search-shade"}).appendTo("#main-container");
dialog = $("<div>",{id:"red-ui-type-search",class:"red-ui-search red-ui-type-search"}).appendTo("#main-container");
dialog = $("<div>",{id:"red-ui-type-search",class:"red-ui-search red-ui-type-search"}).appendTo("#red-ui-main-container");
var searchDiv = $("<div>",{class:"red-ui-search-container"}).appendTo(dialog);
searchInput = $('<input type="text" id="red-ui-type-search-input">').attr("placeholder",RED._("search.addNode")).appendTo(searchDiv).searchBox({
delay: 50,
@ -104,7 +103,7 @@ RED.typeSearch = (function() {
});
searchResultsDiv = $("<div>",{class:"red-ui-search-results-container"}).appendTo(dialog);
searchResults = $('<ol>',{id:"search-result-list", style:"position: absolute;top: 0;bottom: 0;left: 0;right: 0;"}).appendTo(searchResultsDiv).editableList({
searchResults = $('<ol>',{style:"position: absolute;top: 0;bottom: 0;left: 0;right: 0;"}).appendTo(searchResultsDiv).editableList({
addButton: false,
filter: function(data) {
if (activeFilter === "" ) {
@ -145,7 +144,7 @@ RED.typeSearch = (function() {
var icon_url = RED.utils.getNodeIcon(def);
nodeDiv.css('backgroundColor',colour);
var iconContainer = $('<div/>',{class:"palette_icon_container"}).appendTo(nodeDiv);
var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
RED.utils.createIconElement(icon_url, iconContainer, false);
if (def.inputs > 0) {
@ -208,13 +207,13 @@ RED.typeSearch = (function() {
dialog.hide();
searchResultsDiv.hide();
}
$(document).off('mousedown.type-search');
$(document).off('mouseup.type-search');
$(document).off('click.type-search');
$(document).off('mousedown.red-ui-type-search');
$(document).off('mouseup.red-ui-type-search');
$(document).off('click.red-ui-type-search');
setTimeout(function() {
$(document).on('mousedown.type-search',handleMouseActivity);
$(document).on('mouseup.type-search',handleMouseActivity);
$(document).on('click.type-search',handleMouseActivity);
$(document).on('mousedown.red-ui-type-search',handleMouseActivity);
$(document).on('mouseup.red-ui-type-search',handleMouseActivity);
$(document).on('click.red-ui-type-search',handleMouseActivity);
},200);
refreshTypeList(opts);
@ -222,7 +221,7 @@ RED.typeSearch = (function() {
cancelCallback = opts.cancel;
RED.events.emit("type-search:open");
//shade.show();
if ($("#main-container").height() - opts.y - 150 < 0) {
if ($("#red-ui-main-container").height() - opts.y - 150 < 0) {
opts.y = opts.y - 235;
}
dialog.css({left:opts.x+"px",top:opts.y+"px"}).show();
@ -245,9 +244,9 @@ RED.typeSearch = (function() {
}
RED.events.emit("type-search:close");
RED.view.focus();
$(document).off('mousedown.type-search');
$(document).off('mouseup.type-search');
$(document).off('click.type-search');
$(document).off('mousedown.red-ui-type-search');
$(document).off('mouseup.red-ui-type-search');
$(document).off('click.red-ui-type-search');
}
}
function getTypeLabel(type, def) {

21
packages/node_modules/@node-red/editor-client/src/js/ui/userSettings.js vendored
View File

@ -34,7 +34,6 @@ RED.userSettings = (function() {
return;
}
settingsVisible = true;
var tabContainer;
var trayOptions = {
title: RED._("menu.label.userSettings"),
@ -52,9 +51,9 @@ RED.userSettings = (function() {
trayWidth = dimensions.width;
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
var trayBody = tray.find('.red-ui-tray-body');
var settingsContent = $('<div></div>').appendTo(trayBody);
var tabContainer = $('<div></div>',{id:"user-settings-tabs-container"}).appendTo(settingsContent);
var tabContainer = $('<div></div>',{class:"red-ui-settings-tabs-container"}).appendTo(settingsContent);
$('<ul></ul>',{id:"user-settings-tabs"}).appendTo(tabContainer);
var settingsTabs = RED.tabs.create({
@ -62,7 +61,7 @@ RED.userSettings = (function() {
vertical: true,
onchange: function(tab) {
setTimeout(function() {
$("#user-settings-tabs-content").children().hide();
tabContents.children().hide();
$("#" + tab.id).show();
if (tab.pane.focus) {
tab.pane.focus();
@ -70,19 +69,19 @@ RED.userSettings = (function() {
},50);
}
});
var tabContents = $('<div></div>',{id:"user-settings-tabs-content"}).appendTo(settingsContent);
var tabContents = $('<div></div>',{class:"red-ui-settings-tabs-content"}).appendTo(settingsContent);
panes.forEach(function(pane) {
settingsTabs.addTab({
id: "user-settings-tab-"+pane.id,
id: "red-ui-settings-tab-"+pane.id,
label: pane.title,
pane: pane
});
pane.get().hide().appendTo(tabContents);
});
settingsContent.i18n();
settingsTabs.activateTab("user-settings-tab-"+(initialTab||'view'))
$("#sidebar-shade").show();
settingsTabs.activateTab("red-ui-settings-tab-"+(initialTab||'view'))
$("#red-ui-sidebar-shade").show();
},
close: function() {
settingsVisible = false;
@ -91,7 +90,7 @@ RED.userSettings = (function() {
pane.close();
}
});
$("#sidebar-shade").hide();
$("#red-ui-sidebar-shade").hide();
},
show: function() {}
@ -134,7 +133,7 @@ RED.userSettings = (function() {
function createViewPane() {
var pane = $('<div id="user-settings-tab-view" class="node-help"></div>');
var pane = $('<div id="red-ui-settings-tab-view" class="red-ui-help"></div>');
var currentEditorSettings = RED.settings.get('editor') || {};
currentEditorSettings.view = currentEditorSettings.view || {};
@ -150,7 +149,7 @@ RED.userSettings = (function() {
} else {
initialState = currentEditorSettings.view[opt.setting];
}
var row = $('<div class="user-settings-row"></div>').appendTo(pane);
var row = $('<div class="red-ui-settings-row"></div>').appendTo(pane);
var input;
if (opt.toggle) {
input = $('<label for="user-settings-'+opt.setting+'"><input id="user-settings-'+opt.setting+'" type="checkbox"> '+RED._(opt.label)+'</label>').appendTo(row).find("input");

148
packages/node_modules/@node-red/editor-client/src/js/ui/utils.js vendored
View File

@ -26,20 +26,20 @@ RED.utils = (function() {
function buildMessageSummaryValue(value) {
var result;
if (Array.isArray(value)) {
result = $('<span class="debug-message-object-value debug-message-type-meta"></span>').text('array['+value.length+']');
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-meta"></span>').text('array['+value.length+']');
} else if (value === null) {
result = $('<span class="debug-message-object-value debug-message-type-null">null</span>');
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-null">null</span>');
} else if (typeof value === 'object') {
if (value.hasOwnProperty('type') && value.type === 'Buffer' && value.hasOwnProperty('data')) {
result = $('<span class="debug-message-object-value debug-message-type-meta"></span>').text('buffer['+value.length+']');
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-meta"></span>').text('buffer['+value.length+']');
} else if (value.hasOwnProperty('type') && value.type === 'array' && value.hasOwnProperty('data')) {
result = $('<span class="debug-message-object-value debug-message-type-meta"></span>').text('array['+value.length+']');
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-meta"></span>').text('array['+value.length+']');
} else if (value.hasOwnProperty('type') && value.type === 'function') {
result = $('<span class="debug-message-object-value debug-message-type-meta"></span>').text('function');
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-meta"></span>').text('function');
} else if (value.hasOwnProperty('type') && value.type === 'number') {
result = $('<span class="debug-message-object-value debug-message-type-number"></span>').text(value.data);
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-number"></span>').text(value.data);
} else {
result = $('<span class="debug-message-object-value debug-message-type-meta">object</span>');
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-meta">object</span>');
}
} else if (typeof value === 'string') {
var subvalue;
@ -48,16 +48,16 @@ RED.utils = (function() {
} else {
subvalue = sanitize(value);
}
result = $('<span class="debug-message-object-value debug-message-type-string"></span>').html('"'+formatString(subvalue)+'"');
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-string"></span>').html('"'+formatString(subvalue)+'"');
} else if (typeof value === 'number') {
result = $('<span class="debug-message-object-value debug-message-type-number"></span>').text(""+value);
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-number"></span>').text(""+value);
} else {
result = $('<span class="debug-message-object-value debug-message-type-other"></span>').text(""+value);
result = $('<span class="red-ui-debug-msg-object-value red-ui-debug-msg-type-other"></span>').text(""+value);
}
return result;
}
function makeExpandable(el,onbuild,ontoggle,expand) {
el.addClass("debug-message-expandable");
el.addClass("red-ui-debug-msg-expandable");
el.prop('toggle',function() {
return function(state) {
var parent = el.parent();
@ -117,16 +117,16 @@ RED.utils = (function() {
if (!pinnedPaths.hasOwnProperty(sourceId)) {
pinnedPaths[sourceId] = {}
}
var tools = $('<span class="debug-message-tools"></span>').appendTo(obj);
var copyTools = $('<span class="debug-message-tools-copy button-group"></span>').appendTo(tools);
var tools = $('<span class="red-ui-debug-msg-tools"></span>').appendTo(obj);
var copyTools = $('<span class="red-ui-debug-msg-tools-copy button-group"></span>').appendTo(tools);
if (!!key) {
var copyPath = $('<button class="editor-button editor-button-small"><i class="fa fa-terminal"></i></button>').appendTo(copyTools).on("click", function(e) {
var copyPath = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-terminal"></i></button>').appendTo(copyTools).on("click", function(e) {
e.preventDefault();
e.stopPropagation();
RED.clipboard.copyText(key,copyPath,"clipboard.copyMessagePath");
})
}
var copyPayload = $('<button class="editor-button editor-button-small"><i class="fa fa-clipboard"></i></button>').appendTo(copyTools).on("click", function(e) {
var copyPayload = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-clipboard"></i></button>').appendTo(copyTools).on("click", function(e) {
e.preventDefault();
e.stopPropagation();
RED.clipboard.copyText(msg,copyPayload,"clipboard.copyMessageValue");
@ -134,24 +134,24 @@ RED.utils = (function() {
if (strippedKey !== undefined && strippedKey !== '') {
var isPinned = pinnedPaths[sourceId].hasOwnProperty(strippedKey);
var pinPath = $('<button class="editor-button editor-button-small debug-message-tools-pin"><i class="fa fa-map-pin"></i></button>').appendTo(tools).on("click", function(e) {
var pinPath = $('<button class="red-ui-button red-ui-button-small red-ui-debug-msg-tools-pin"><i class="fa fa-map-pin"></i></button>').appendTo(tools).on("click", function(e) {
e.preventDefault();
e.stopPropagation();
if (pinnedPaths[sourceId].hasOwnProperty(strippedKey)) {
delete pinnedPaths[sourceId][strippedKey];
$(this).removeClass("selected");
obj.removeClass("debug-message-row-pinned");
obj.removeClass("red-ui-debug-msg-row-pinned");
} else {
var rootedPath = "$"+(strippedKey[0] === '['?"":".")+strippedKey;
pinnedPaths[sourceId][strippedKey] = normalisePropertyExpression(rootedPath);
$(this).addClass("selected");
obj.addClass("debug-message-row-pinned");
obj.addClass("red-ui-debug-msg-row-pinned");
}
}).toggleClass("selected",isPinned);
obj.toggleClass("debug-message-row-pinned",isPinned);
obj.toggleClass("red-ui-debug-msg-row-pinned",isPinned);
}
if (extraTools) {
extraTools.addClass("debug-message-tools-other");
extraTools.addClass("red-ui-debug-msg-tools-other");
extraTools.appendTo(tools);
}
}
@ -243,10 +243,10 @@ RED.utils = (function() {
}
if (format === 'raw') {
button.text('raw');
element.removeClass('debug-message-buffer-string').addClass('debug-message-buffer-raw');
element.removeClass('red-ui-debug-msg-buffer-string').addClass('red-ui-debug-msg-buffer-raw');
} else if (format === 'string') {
button.text('string');
element.addClass('debug-message-buffer-string').removeClass('debug-message-buffer-raw');
element.addClass('red-ui-debug-msg-buffer-string').removeClass('red-ui-debug-msg-buffer-raw');
}
}
@ -275,16 +275,16 @@ RED.utils = (function() {
if (path !== undefined && rootPath !== undefined) {
strippedKey = path.substring(rootPath.length+(path[rootPath.length]==="."?1:0));
}
var element = $('<span class="debug-message-element"></span>');
var element = $('<span class="red-ui-debug-msg-element"></span>');
element.collapse = function() {
element.find(".debug-message-expandable").parent().addClass("collapsed");
element.find(".red-ui-debug-msg-expandable").parent().addClass("collapsed");
}
header = $('<span class="debug-message-row"></span>').appendTo(element);
header = $('<span class="red-ui-debug-msg-row"></span>').appendTo(element);
if (sourceId) {
addMessageControls(header,sourceId,path,obj,rootPath,strippedKey,tools);
}
if (!key) {
element.addClass("debug-message-top-level");
element.addClass("red-ui-debug-msg-top-level");
if (sourceId) {
var pinned = pinnedPaths[sourceId];
expandPaths = [];
@ -303,17 +303,17 @@ RED.utils = (function() {
expandPaths.sort();
}
element.clearPinned = function() {
element.find(".debug-message-row-pinned").removeClass("debug-message-row-pinned");
element.find(".red-ui-debug-msg-row-pinned").removeClass("red-ui-debug-msg-row-pinned");
pinnedPaths[sourceId] = {};
}
}
} else {
if (!hideKey) {
$('<span class="debug-message-object-key"></span>').text(key).appendTo(header);
$('<span class="red-ui-debug-msg-object-key"></span>').text(key).appendTo(header);
$('<span>: </span>').appendTo(header);
}
}
entryObj = $('<span class="debug-message-object-value"></span>').appendTo(header);
entryObj = $('<span class="red-ui-debug-msg-object-value"></span>').appendTo(header);
var isArray = Array.isArray(obj);
var isArrayObject = false;
@ -322,33 +322,33 @@ RED.utils = (function() {
isArrayObject = true;
}
if (obj === null || obj === undefined) {
$('<span class="debug-message-type-null">'+obj+'</span>').appendTo(entryObj);
$('<span class="red-ui-debug-msg-type-null">'+obj+'</span>').appendTo(entryObj);
} else if (obj.__enc__ && obj.type === 'number') {
e = $('<span class="debug-message-type-number debug-message-object-header"></span>').text(obj.data).appendTo(entryObj);
e = $('<span class="red-ui-debug-msg-type-number red-ui-debug-msg-object-header"></span>').text(obj.data).appendTo(entryObj);
} else if (typeHint === "function" || (obj.__enc__ && obj.type === 'function')) {
e = $('<span class="debug-message-type-meta debug-message-object-header"></span>').text("function").appendTo(entryObj);
e = $('<span class="red-ui-debug-msg-type-meta red-ui-debug-msg-object-header"></span>').text("function").appendTo(entryObj);
} else if (typeHint === "internal" || (obj.__enc__ && obj.type === 'internal')) {
e = $('<span class="debug-message-type-meta debug-message-object-header"></span>').text("[internal]").appendTo(entryObj);
e = $('<span class="red-ui-debug-msg-type-meta red-ui-debug-msg-object-header"></span>').text("[internal]").appendTo(entryObj);
} else if (typeof obj === 'string') {
if (/[\t\n\r]/.test(obj)) {
element.addClass('collapsed');
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
$('<i class="fa fa-caret-right red-ui-debug-msg-object-handle"></i> ').prependTo(header);
makeExpandable(header, function() {
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').text(typeHint||'string').appendTo(header);
var row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
$('<pre class="debug-message-type-string"></pre>').text(obj).appendTo(row);
$('<span class="red-ui-debug-msg-type-meta red-ui-debug-msg-object-type-header"></span>').text(typeHint||'string').appendTo(header);
var row = $('<div class="red-ui-debug-msg-object-entry collapsed"></div>').appendTo(element);
$('<pre class="red-ui-debug-msg-type-string"></pre>').text(obj).appendTo(row);
},function(state) {if (ontoggle) { ontoggle(path,state);}}, checkExpanded(strippedKey,expandPaths));
}
e = $('<span class="debug-message-type-string debug-message-object-header"></span>').html('"'+formatString(sanitize(obj))+'"').appendTo(entryObj);
e = $('<span class="red-ui-debug-msg-type-string red-ui-debug-msg-object-header"></span>').html('"'+formatString(sanitize(obj))+'"').appendTo(entryObj);
if (/^#[0-9a-f]{6}$/i.test(obj)) {
$('<span class="debug-message-type-string-swatch"></span>').css('backgroundColor',obj).appendTo(e);
$('<span class="red-ui-debug-msg-type-string-swatch"></span>').css('backgroundColor',obj).appendTo(e);
}
} else if (typeof obj === 'number') {
e = $('<span class="debug-message-type-number"></span>').appendTo(entryObj);
e = $('<span class="red-ui-debug-msg-type-number"></span>').appendTo(entryObj);
if (Number.isInteger(obj) && (obj >= 0)) { // if it's a +ve integer
e.addClass("debug-message-type-number-toggle");
e.addClass("red-ui-debug-msg-type-number-toggle");
e.on("click", function(evt) {
evt.preventDefault();
formatNumber($(this), obj, sourceId, path, true);
@ -383,14 +383,14 @@ RED.utils = (function() {
var fullLength = data.length;
if (originalLength > 0) {
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
var arrayRows = $('<div class="debug-message-array-rows"></div>').appendTo(element);
element.addClass('debug-message-buffer-raw');
$('<i class="fa fa-caret-right red-ui-debug-msg-object-handle"></i> ').prependTo(header);
var arrayRows = $('<div class="red-ui-debug-msg-array-rows"></div>').appendTo(element);
element.addClass('red-ui-debug-msg-buffer-raw');
}
if (key) {
headerHead = $('<span class="debug-message-type-meta"></span>').text(typeHint||(type+'['+originalLength+']')).appendTo(entryObj);
headerHead = $('<span class="red-ui-debug-msg-type-meta"></span>').text(typeHint||(type+'['+originalLength+']')).appendTo(entryObj);
} else {
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(entryObj);
headerHead = $('<span class="red-ui-debug-msg-object-header"></span>').appendTo(entryObj);
$('<span>[ </span>').appendTo(headerHead);
var arrayLength = Math.min(originalLength,10);
for (i=0;i<arrayLength;i++) {
@ -403,7 +403,7 @@ RED.utils = (function() {
$('<span> &hellip;</span>').appendTo(headerHead);
}
if (arrayLength === 0) {
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
$('<span class="red-ui-debug-msg-type-meta">empty</span>').appendTo(headerHead);
}
$('<span> ]</span>').appendTo(headerHead);
}
@ -411,20 +411,20 @@ RED.utils = (function() {
makeExpandable(header,function() {
if (!key) {
headerHead = $('<span class="debug-message-type-meta debug-message-object-type-header"></span>').text(typeHint||(type+'['+originalLength+']')).appendTo(header);
headerHead = $('<span class="red-ui-debug-msg-type-meta red-ui-debug-msg-object-type-header"></span>').text(typeHint||(type+'['+originalLength+']')).appendTo(header);
}
if (type === 'buffer') {
var stringRow = $('<div class="debug-message-string-rows"></div>').appendTo(element);
var sr = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(stringRow);
var stringRow = $('<div class="red-ui-debug-msg-string-rows"></div>').appendTo(element);
var sr = $('<div class="red-ui-debug-msg-object-entry collapsed"></div>').appendTo(stringRow);
var stringEncoding = "";
try {
stringEncoding = String.fromCharCode.apply(null, new Uint16Array(data))
} catch(err) {
console.log(err);
}
$('<pre class="debug-message-type-string"></pre>').text(stringEncoding).appendTo(sr);
var bufferOpts = $('<span class="debug-message-buffer-opts"></span>').appendTo(headerHead);
var switchFormat = $('<a href="#"></a>').addClass('selected').text('raw').appendTo(bufferOpts).on("click", function(e) {
$('<pre class="red-ui-debug-msg-type-string"></pre>').text(stringEncoding).appendTo(sr);
var bufferOpts = $('<span class="red-ui-debug-msg-buffer-opts"></span>').appendTo(headerHead);
var switchFormat = $('<a class="red-ui-button red-ui-button-small" href="#"></a>').text('raw').appendTo(bufferOpts).on("click", function(e) {
e.preventDefault();
e.stopPropagation();
formatBuffer(element,$(this),sourceId,path,true);
@ -435,7 +435,7 @@ RED.utils = (function() {
var row;
if (fullLength <= 10) {
for (i=0;i<fullLength;i++) {
row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(arrayRows);
row = $('<div class="red-ui-debug-msg-object-entry collapsed"></div>').appendTo(arrayRows);
subElements[path+"["+i+"]"] = buildMessageElement(
data[i],
{
@ -454,16 +454,16 @@ RED.utils = (function() {
} else {
for (i=0;i<fullLength;i+=10) {
var minRange = i;
row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(arrayRows);
row = $('<div class="red-ui-debug-msg-object-entry collapsed"></div>').appendTo(arrayRows);
header = $('<span></span>').appendTo(row);
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').appendTo(header);
$('<i class="fa fa-caret-right red-ui-debug-msg-object-handle"></i> ').appendTo(header);
makeExpandable(header, (function() {
var min = minRange;
var max = Math.min(fullLength-1,(minRange+9));
var parent = row;
return function() {
for (var i=min;i<=max;i++) {
var row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(parent);
var row = $('<div class="red-ui-debug-msg-object-entry collapsed"></div>').appendTo(parent);
subElements[path+"["+i+"]"] = buildMessageElement(
data[i],
{
@ -484,10 +484,10 @@ RED.utils = (function() {
})(),
(function() { var path = path+"["+i+"]"; return function(state) {if (ontoggle) { ontoggle(path,state);}}})(),
checkExpanded(strippedKey,expandPaths,minRange,Math.min(fullLength-1,(minRange+9))));
$('<span class="debug-message-object-key"></span>').html("["+minRange+" &hellip; "+Math.min(fullLength-1,(minRange+9))+"]").appendTo(header);
$('<span class="red-ui-debug-msg-object-key"></span>').html("["+minRange+" &hellip; "+Math.min(fullLength-1,(minRange+9))+"]").appendTo(header);
}
if (fullLength < originalLength) {
$('<div class="debug-message-object-entry collapsed"><span class="debug-message-object-key">['+fullLength+' &hellip; '+originalLength+']</span></div>').appendTo(arrayRows);
$('<div class="red-ui-debug-msg-object-entry collapsed"><span class="red-ui-debug-msg-object-key">['+fullLength+' &hellip; '+originalLength+']</span></div>').appendTo(arrayRows);
}
}
},
@ -498,13 +498,13 @@ RED.utils = (function() {
element.addClass('collapsed');
var keys = Object.keys(obj);
if (key || keys.length > 0) {
$('<i class="fa fa-caret-right debug-message-object-handle"></i> ').prependTo(header);
$('<i class="fa fa-caret-right red-ui-debug-msg-object-handle"></i> ').prependTo(header);
makeExpandable(header, function() {
if (!key) {
$('<span class="debug-message-type-meta debug-message-object-type-header"></span>').text('object').appendTo(header);
$('<span class="red-ui-debug-msg-type-meta red-ui-debug-msg-object-type-header"></span>').text('object').appendTo(header);
}
for (i=0;i<keys.length;i++) {
var row = $('<div class="debug-message-object-entry collapsed"></div>').appendTo(element);
var row = $('<div class="red-ui-debug-msg-object-entry collapsed"></div>').appendTo(element);
var newPath = path;
if (newPath !== undefined) {
if (/^[a-zA-Z_$][0-9a-zA-Z_$]*$/.test(keys[i])) {
@ -530,20 +530,20 @@ RED.utils = (function() {
).appendTo(row);
}
if (keys.length === 0) {
$('<div class="debug-message-object-entry debug-message-type-meta collapsed"></div>').text("empty").appendTo(element);
$('<div class="red-ui-debug-msg-object-entry red-ui-debug-msg-type-meta collapsed"></div>').text("empty").appendTo(element);
}
},
function(state) {if (ontoggle) { ontoggle(path,state);}},
checkExpanded(strippedKey,expandPaths));
}
if (key) {
$('<span class="debug-message-type-meta"></span>').text('object').appendTo(entryObj);
$('<span class="red-ui-debug-msg-type-meta"></span>').text('object').appendTo(entryObj);
} else {
headerHead = $('<span class="debug-message-object-header"></span>').appendTo(entryObj);
headerHead = $('<span class="red-ui-debug-msg-object-header"></span>').appendTo(entryObj);
$('<span>{ </span>').appendTo(headerHead);
var keysLength = Math.min(keys.length,5);
for (i=0;i<keysLength;i++) {
$('<span class="debug-message-object-key"></span>').text(keys[i]).appendTo(headerHead);
$('<span class="red-ui-debug-msg-object-key"></span>').text(keys[i]).appendTo(headerHead);
$('<span>: </span>').appendTo(headerHead);
buildMessageSummaryValue(obj[keys[i]]).appendTo(headerHead);
if (i < keysLength-1) {
@ -554,12 +554,12 @@ RED.utils = (function() {
$('<span> &hellip;</span>').appendTo(headerHead);
}
if (keysLength === 0) {
$('<span class="debug-message-type-meta">empty</span>').appendTo(headerHead);
$('<span class="red-ui-debug-msg-type-meta">empty</span>').appendTo(headerHead);
}
$('<span> }</span>').appendTo(headerHead);
}
} else {
$('<span class="debug-message-type-other"></span>').text(""+obj).appendTo(entryObj);
$('<span class="red-ui-debug-msg-type-other"></span>').text(""+obj).appendTo(entryObj);
}
if (exposeApi) {
element.prop('expand', function() { return function(targetPath, state) {
@ -872,9 +872,9 @@ RED.utils = (function() {
}
function addSpinnerOverlay(container,contain) {
var spinner = $('<div class="projects-dialog-spinner "><img src="red/images/spin.svg"/></div>').appendTo(container);
var spinner = $('<div class="red-ui-component-spinner "><img src="red/images/spin.svg"/></div>').appendTo(container);
if (contain) {
spinner.addClass('projects-dialog-spinner-contain');
spinner.addClass('red-ui-component-spinner-contain');
}
return spinner;
}
@ -923,12 +923,12 @@ RED.utils = (function() {
/**
* Create or update an icon element and append it to iconContainer.
* @param iconUrl - Url of icon.
* @param iconContainer - Icon container element with palette_icon_container class.
* @param iconContainer - Icon container element with red-ui-palette-icon-container class.
* @param isLarge - Whether the icon size is large.
*/
function createIconElement(iconUrl, iconContainer, isLarge) {
// Removes the previous icon when icon was changed.
var iconElement = iconContainer.find(".palette_icon");
var iconElement = iconContainer.find(".red-ui-palette-icon");
if (iconElement.length !== 0) {
iconElement.remove();
}
@ -944,13 +944,13 @@ RED.utils = (function() {
if (fontAwesomeUnicode) {
var faIconElement = $('<i/>').appendTo(iconContainer);
var faLarge = isLarge ? "fa-lg " : "";
faIconElement.addClass("palette_icon_fa fa fa-fw " + faLarge + iconPath.file);
faIconElement.addClass("red-ui-palette-icon-fa fa fa-fw " + faLarge + iconPath.file);
return;
}
// If the specified name is not defined in font-awesome, show arrow-in icon.
iconUrl = RED.settings.apiRootUrl+"icons/node-red/arrow-in.png"
}
var imageIconElement = $('<div/>',{class:"palette_icon"}).appendTo(iconContainer);
var imageIconElement = $('<div/>',{class:"red-ui-palette-icon"}).appendTo(iconContainer);
imageIconElement.css("backgroundImage", "url("+iconUrl+")");
}

59
packages/node_modules/@node-red/editor-client/src/js/ui/view-navigator.js vendored
View File

@ -36,10 +36,10 @@
if (!isShowing) {
return;
}
var navNode = navVis.selectAll(".navnode").data(RED.view.getActiveNodes(),function(d){return d.id});
var navNode = navVis.selectAll(".red-ui-navigator-node").data(RED.view.getActiveNodes(),function(d){return d.id});
navNode.exit().remove();
navNode.enter().insert("rect")
.attr('class','navnode')
.attr('class','red-ui-navigator-node')
.attr("pointer-events", "none");
navNode.each(function(d) {
d3.select(this).attr("x",function(d) { return (d.x-d.w/2)/nav_scale })
@ -57,8 +57,8 @@
function resizeNavBorder() {
if (navBorder) {
scaleFactor = RED.view.scale();
chartSize = [ $("#chart").width(), $("#chart").height()];
scrollPos = [$("#chart").scrollLeft(),$("#chart").scrollTop()];
chartSize = [ $("#red-ui-workspace-chart").width(), $("#red-ui-workspace-chart").height()];
scrollPos = [$("#red-ui-workspace-chart").scrollLeft(),$("#red-ui-workspace-chart").scrollTop()];
navBorder.attr('x',scrollPos[0]/nav_scale)
.attr('y',scrollPos[1]/nav_scale)
.attr('width',chartSize[0]/nav_scale/scaleFactor)
@ -68,16 +68,16 @@
function toggle() {
if (!isShowing) {
isShowing = true;
$("#btn-navigate").addClass("selected");
$("#red-ui-view-navigate").addClass("selected");
resizeNavBorder();
refreshNodes();
$("#chart").on("scroll",onScroll);
$("#red-ui-workspace-chart").on("scroll",onScroll);
navContainer.fadeIn(200);
} else {
isShowing = false;
navContainer.fadeOut(100);
$("#chart").off("scroll",onScroll);
$("#btn-navigate").removeClass("selected");
$("#red-ui-workspace-chart").off("scroll",onScroll);
$("#red-ui-view-navigate").removeClass("selected");
}
}
@ -91,26 +91,17 @@
navContainer = $('<div>').css({
"position":"absolute",
"bottom":$("#workspace-footer").height(),
"bottom":$("#red-ui-workspace-footer").height(),
"right":0,
zIndex: 1
}).appendTo("#workspace").hide();
}).appendTo("#red-ui-workspace").hide();
navBox = d3.select(navContainer[0])
.append("svg:svg")
.attr("width", nav_width)
.attr("height", nav_height)
.attr("pointer-events", "all")
.style({
position: "absolute",
bottom: 0,
right:0,
zIndex: 101,
"border-left": "1px solid #ccc",
"border-top": "1px solid #ccc",
background: "rgba(245,245,245,0.8)",
"box-shadow": "-1px 0 3px rgba(0,0,0,0.1)"
});
.attr("id","red-ui-navigator-canvas")
navBox.append("rect").attr("x",0).attr("y",0).attr("width",nav_width).attr("height",nav_height).style({
fill:"none",
@ -119,14 +110,14 @@
}).on("mousedown", function() {
// Update these in case they have changed
scaleFactor = RED.view.scale();
chartSize = [ $("#chart").width(), $("#chart").height()];
chartSize = [ $("#red-ui-workspace-chart").width(), $("#red-ui-workspace-chart").height()];
dimensions = [chartSize[0]/nav_scale/scaleFactor, chartSize[1]/nav_scale/scaleFactor];
var newX = Math.max(0,Math.min(d3.event.offsetX+dimensions[0]/2,nav_width)-dimensions[0]);
var newY = Math.max(0,Math.min(d3.event.offsetY+dimensions[1]/2,nav_height)-dimensions[1]);
navBorder.attr('x',newX).attr('y',newY);
isDragging = true;
$("#chart").scrollLeft(newX*nav_scale*scaleFactor);
$("#chart").scrollTop(newY*nav_scale*scaleFactor);
$("#red-ui-workspace-chart").scrollLeft(newX*nav_scale*scaleFactor);
$("#red-ui-workspace-chart").scrollTop(newY*nav_scale*scaleFactor);
}).on("mousemove", function() {
if (!isDragging) { return }
if (d3.event.buttons === 0) {
@ -136,29 +127,27 @@
var newX = Math.max(0,Math.min(d3.event.offsetX+dimensions[0]/2,nav_width)-dimensions[0]);
var newY = Math.max(0,Math.min(d3.event.offsetY+dimensions[1]/2,nav_height)-dimensions[1]);
navBorder.attr('x',newX).attr('y',newY);
$("#chart").scrollLeft(newX*nav_scale*scaleFactor);
$("#chart").scrollTop(newY*nav_scale*scaleFactor);
$("#red-ui-workspace-chart").scrollLeft(newX*nav_scale*scaleFactor);
$("#red-ui-workspace-chart").scrollTop(newY*nav_scale*scaleFactor);
}).on("mouseup", function() {
isDragging = false;
})
navBorder = navBox.append("rect")
.attr("stroke-dasharray","5,5")
.attr("pointer-events", "none")
.style({
stroke: "#999",
strokeWidth: 1,
fill: "white",
});
navBorder = navBox.append("rect").attr("class","red-ui-navigator-border")
navVis = navBox.append("svg:g")
RED.statusBar.add({
id: "view-navigator",
align: "right",
element: $('<button class="red-ui-footer-button-toggle single" id="red-ui-view-navigate"><i class="fa fa-map-o"></i></button>')
})
$("#btn-navigate").on("click", function(evt) {
$("#red-ui-view-navigate").on("click", function(evt) {
evt.preventDefault();
toggle();
})
RED.popover.tooltip($("#btn-navigate"),RED._('actions.toggle-navigator'),'core:toggle-navigator');
RED.popover.tooltip($("#red-ui-view-navigate"),RED._('actions.toggle-navigator'),'core:toggle-navigator');
},
refresh: refreshNodes,
resize: resizeNavBorder,

996
packages/node_modules/@node-red/editor-client/src/js/ui/view.js vendored
View File

File diff suppressed because it is too large Load Diff

53
packages/node_modules/@node-red/editor-client/src/js/ui/workspaces.js vendored
View File

@ -28,7 +28,7 @@ RED.workspaces = (function() {
var tabId = RED.nodes.id();
do {
workspaceIndex += 1;
} while ($("#workspace-tabs a[title='"+RED._('workspace.defaultName',{number:workspaceIndex})+"']").size() !== 0);
} while ($("#red-ui-workspace-tabs a[title='"+RED._('workspace.defaultName',{number:workspaceIndex})+"']").size() !== 0);
ws = {type:"tab",id:tabId,disabled: false,info:"",label:RED._('workspace.defaultName',{number:workspaceIndex})};
RED.nodes.addWorkspace(ws,targetIndex);
@ -107,8 +107,8 @@ RED.workspaces = (function() {
changed = true;
workspace.info = info;
}
$("#red-ui-tab-"+(workspace.id.replace(".","-"))).toggleClass('workspace-disabled',!!workspace.disabled);
$("#workspace").toggleClass("workspace-disabled",!!workspace.disabled);
$("#red-ui-tab-"+(workspace.id.replace(".","-"))).toggleClass('red-ui-workspace-disabled',!!workspace.disabled);
$("#red-ui-workspace").toggleClass("red-ui-workspace-disabled",!!workspace.disabled);
if (changed) {
var historyEvent = {
@ -150,7 +150,7 @@ RED.workspaces = (function() {
tabflowEditor.resize();
},
open: function(tray) {
var trayBody = tray.find('.editor-tray-body');
var trayBody = tray.find('.red-ui-tray-body');
var dialogForm = $('<form id="dialog-form" class="form-horizontal"></form>').appendTo(trayBody);
$('<div class="form-row">'+
'<label for="node-input-name" data-i18n="[append]editor:common.label.name"><i class="fa fa-tag"></i> </label>'+
@ -159,7 +159,7 @@ RED.workspaces = (function() {
$('<div class="form-row">'+
'<label for="node-input-disabled-btn" data-i18n="editor:workspace.status"></label>'+
'<button type="button" id="node-input-disabled-btn" class="editor-button"><i class="fa fa-toggle-on"></i> <span id="node-input-disabled-label"></span></button> '+
'<button type="button" id="node-input-disabled-btn" class="red-ui-button"><i class="fa fa-toggle-on"></i> <span id="node-input-disabled-label"></span></button> '+
'<input type="checkbox" id="node-input-disabled" style="display: none;"/>'+
'</div>').appendTo(dialogForm);
@ -241,7 +241,7 @@ RED.workspaces = (function() {
var workspaceTabCount = 0;
function createWorkspaceTabs() {
workspace_tabs = RED.tabs.create({
id: "workspace-tabs",
id: "red-ui-workspace-tabs",
onchange: function(tab) {
var event = {
old: activeWorkspace
@ -250,7 +250,7 @@ RED.workspaces = (function() {
event.workspace = activeWorkspace;
RED.events.emit("workspace:change",event);
window.location.hash = 'flow/'+tab.id;
$("#workspace").toggleClass("workspace-disabled",!!tab.disabled);
$("#red-ui-workspace").toggleClass("red-ui-workspace-disabled",!!tab.disabled);
RED.sidebar.config.refresh();
RED.view.focus();
},
@ -268,9 +268,9 @@ RED.workspaces = (function() {
if (tab.type === "tab") {
workspaceTabCount++;
}
$('<span class="workspace-disabled-icon"><i class="fa fa-ban"></i> </span>').prependTo("#red-ui-tab-"+(tab.id.replace(".","-"))+" .red-ui-tab-label");
$('<span class="red-ui-workspace-disabled-icon"><i class="fa fa-ban"></i> </span>').prependTo("#red-ui-tab-"+(tab.id.replace(".","-"))+" .red-ui-tab-label");
if (tab.disabled) {
$("#red-ui-tab-"+(tab.id.replace(".","-"))).addClass('workspace-disabled');
$("#red-ui-tab-"+(tab.id.replace(".","-"))).addClass('red-ui-workspace-disabled');
}
RED.menu.setDisabled("menu-item-workspace-delete",workspaceTabCount <= 1);
if (workspaceTabCount === 1) {
@ -294,16 +294,16 @@ RED.workspaces = (function() {
onselect: function(selectedTabs) {
RED.view.select(false)
if (selectedTabs.length === 0) {
$("#chart svg").css({"pointer-events":"auto",filter:"none"})
$("#workspace-toolbar").css({"pointer-events":"auto",filter:"none"})
$("#palette-container").css({"pointer-events":"auto",filter:"none"})
$(".sidebar-shade").hide();
$("#red-ui-workspace-chart svg").css({"pointer-events":"auto",filter:"none"})
$("#red-ui-workspace-toolbar").css({"pointer-events":"auto",filter:"none"})
$("#red-ui-palette-container").css({"pointer-events":"auto",filter:"none"})
$(".red-ui-sidebar-shade").hide();
} else {
RED.view.select(false)
$("#chart svg").css({"pointer-events":"none",filter:"opacity(60%)"})
$("#workspace-toolbar").css({"pointer-events":"none",filter:"opacity(60%)"})
$("#palette-container").css({"pointer-events":"none",filter:"opacity(60%)"})
$(".sidebar-shade").show();
$("#red-ui-workspace-chart svg").css({"pointer-events":"none",filter:"opacity(60%)"})
$("#red-ui-workspace-toolbar").css({"pointer-events":"none",filter:"opacity(60%)"})
$("#red-ui-palette-container").css({"pointer-events":"none",filter:"opacity(60%)"})
$(".red-ui-sidebar-shade").show();
}
},
minimumActiveTabWidth: 150,
@ -316,17 +316,24 @@ RED.workspaces = (function() {
workspaceTabCount = 0;
}
function showWorkspace() {
$("#workspace .red-ui-tabs").show()
$("#chart").show()
$("#workspace-footer").children().show()
$("#red-ui-workspace .red-ui-tabs").show()
$("#red-ui-workspace-chart").show()
$("#red-ui-workspace-footer").children().show()
}
function hideWorkspace() {
$("#workspace .red-ui-tabs").hide()
$("#chart").hide()
$("#workspace-footer").children().hide()
$("#red-ui-workspace .red-ui-tabs").hide()
$("#red-ui-workspace-chart").hide()
$("#red-ui-workspace-footer").children().hide()
}
function init() {
$('<ul id="red-ui-workspace-tabs"></ul>').appendTo("#red-ui-workspace");
$('<div id="red-ui-workspace-chart" tabindex="1"></div>').appendTo("#red-ui-workspace");
$('<div id="red-ui-workspace-toolbar"></div>').appendTo("#red-ui-workspace");
$('<div id="red-ui-workspace-footer" class="red-ui-component-footer"></div>').appendTo("#red-ui-workspace");
$('<div id="red-ui-editor-shade" class="hide"></div>').appendTo("#red-ui-workspace");
createWorkspaceTabs();
RED.events.on("sidebar:resize",workspace_tabs.resize);

20
packages/node_modules/@node-red/editor-client/src/js/user.js vendored
View File

@ -30,7 +30,11 @@ RED.user = (function() {
dialog.dialog({
autoOpen: false,
dialogClass: "ui-dialog-no-close",
classes: {
"ui-dialog": "red-ui-editor-dialog",
"ui-dialog-titlebar-close": "hide",
"ui-widget-overlay": "red-ui-editor-dialog"
},
modal: true,
closeOnEscape: !!opts.cancelable,
width: 600,
@ -178,9 +182,9 @@ RED.user = (function() {
}
function updateUserMenu() {
$("#btn-usermenu-submenu li").remove();
$("#red-ui-header-button-user-submenu li").remove();
if (RED.settings.user.anonymous) {
RED.menu.addItem("btn-usermenu",{
RED.menu.addItem("red-ui-header-button-user",{
id:"usermenu-item-login",
label:RED._("menu.label.login"),
onselect: function() {
@ -194,11 +198,11 @@ RED.user = (function() {
}
});
} else {
RED.menu.addItem("btn-usermenu",{
RED.menu.addItem("red-ui-header-button-user",{
id:"usermenu-item-username",
label:"<b>"+RED.settings.user.username+"</b>"
});
RED.menu.addItem("btn-usermenu",{
RED.menu.addItem("red-ui-header-button-user",{
id:"usermenu-item-logout",
label:RED._("menu.label.logout"),
onselect: function() {
@ -213,8 +217,8 @@ RED.user = (function() {
if (RED.settings.user) {
if (!RED.settings.editorTheme || !RED.settings.editorTheme.hasOwnProperty("userMenu")) {
var userMenu = $('<li><a id="btn-usermenu" class="button hide" data-toggle="dropdown" href="#"></a></li>')
.prependTo(".header-toolbar");
var userMenu = $('<li><a id="red-ui-header-button-user" class="button hide" href="#"></a></li>')
.prependTo(".red-ui-header-toolbar");
if (RED.settings.user.image) {
$('<span class="user-profile"></span>').css({
backgroundImage: "url("+RED.settings.user.image+")",
@ -223,7 +227,7 @@ RED.user = (function() {
$('<i class="fa fa-user"></i>').appendTo(userMenu.find("a"));
}
RED.menu.init({id:"btn-usermenu",
RED.menu.init({id:"red-ui-header-button-user",
options: []
});
updateUserMenu();

87
packages/node_modules/@node-red/editor-client/src/sass/ace.scss vendored
View File

@ -1,29 +1,68 @@
.ace_gutter {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.ace_scroller {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.red-ui-editor, .red-ui-editor-dialog {
#event-log-editor {
.ace_read-only {
.ace_scroller {
background: $text-editor-background-disabled;
color: $text-editor-color-disabled;
}
.ace_cursor {
color: transparent !important;
}
}
.ace_gutter {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.ace_scroller {
background: #444;
color: #dd9;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.ace_active-line {
background: #666 !important;
}
.ace_selection {
background: #999 !important;
}
}
.ace_tooltip {
background-image: none;
background: #fcffdc;
border-radius: 4px;
@include component-shadow;
border-color: $primary-border-color;
.ace_scroller {
background: $text-editor-background;
color: $text-editor-color;
}
.ace_marker-layer .ace_active-line {
background: $text-editor-active-line-background;
}
.ace_marker-layer .ace_selection {
background: $text-editor-selection-background;
border-radius: 1px;
}
.ace_gutter-cell {
color: $text-editor-color;
}
.ace_gutter-active-line {
background: $text-editor-gutter-active-line-background;
}
.ace_gutter {
background: $text-editor-gutter-background;
}
.ace_tooltip {
font-family: $primary-font;
line-height: 1.4em;
max-width: 400px;
white-space: normal;
background-image: none;
background: $popover-background;
color: $popover-color;
border-radius: 4px;
@include component-shadow;
border-color: $popover-background;
}
#red-ui-event-log-editor {
.ace_scroller {
background: $event-log-background;
color: $event-log-color;
}
.ace_marker-layer .ace_active-line {
background: $event-log-active-line-background;
}
.ace_marker-layer .ace_selection {
background: $event-log-selection-background;
}
}
}

261
packages/node_modules/@node-red/editor-client/src/sass/base.scss vendored Normal file
View File

@ -0,0 +1,261 @@
/**
* Copyright JS Foundation and other contributors, http://js.foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
**/
.red-ui-editor {
font-size: $primary-font-size;
font-family: $primary-font;
padding: 0;
margin: 0;
background: $primary-background;
color: $primary-text-color;
line-height: 20px;
}
#red-ui-editor {
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
}
#red-ui-editor-node-configs {
display: none;
}
#red-ui-main-container {
position: absolute;
top:40px; left:0; bottom: 0; right:0;
overflow:hidden;
}
#red-ui-palette-shade, #red-ui-editor-shade, #red-ui-header-shade, #red-ui-sidebar-shade {
@include shade;
z-index: 2;
}
#red-ui-sidebar-shade {
left: -8px;
top: -1px;
bottom: -1px;
}
#red-ui-full-shade {
@include shade;
z-index: 15;
}
.red-ui-editor,
.red-ui-editor-dialog,
.red-ui-menu,
.red-ui-popover,
.red-ui-typedInput-options,
.red-ui-icon-picker {
a {
text-decoration: none;
}
a:hover,
a:focus {
text-decoration: none;
}
p {
margin: 0 0 10px;
}
small {
font-size: 85%;
}
strong {
font-weight: bold;
}
em {
font-style: italic;
}
cite {
font-style: normal;
}
ul,
ol {
padding: 0;
margin: 0 0 10px 25px;
}
ul ul,
ul ol,
ol ol,
ol ul {
margin-bottom: 0;
}
li {
line-height: 20px;
}
dl {
margin-bottom: 20px;
}
dt,
dd {
line-height: 20px;
}
dt {
font-weight: bold;
}
dd {
margin-left: 10px;
}
hr {
margin: 20px 0;
border: 0;
border-top: 1px solid $tertiary-border-color;
}
i.spinner {
display: inline-block;
width: 14px;
height: 14px;
line-height: 14px;
vertical-align: text-top;
margin-top: 0px;
background: url(images/spin.svg) no-repeat 50% 50%;
background-size: contain
}
code {
font-family: $monospace-font;
font-size: $primary-font-size;
padding: 0px;
margin: 1px;
color: $info-text-code-color;
white-space: nowrap;
}
pre {
display: block;
padding: 9.5px;
margin: 0 0 10px;
line-height: 20px;
word-break: break-all;
word-wrap: break-word;
white-space: pre-wrap;
background-color:$tertiary-background;
border: 1px solid $tertiary-border-color;
border-radius: 2px;
}
pre code {
padding: 0;
color: inherit;
white-space: pre;
white-space: pre-wrap;
background-color: transparent;
border: 0;
}
.pull-right {
float: right;
}
.pull-left {
float: left;
}
.hide {
display: none;
}
.show {
display: block;
}
img {
width: auto\9;
height: auto;
max-width: 100%;
vertical-align: middle;
border: 0;
-ms-interpolation-mode: bicubic;
}
blockquote {
padding: 0 0 0 15px;
margin: 0 0 20px;
border-left: 4px solid $secondary-border-color;
color: $secondary-text-color;
p {
font-size: 14px;
font-weight: inherit;
line-height: 1.25;
margin-bottom: 0;
}
}
table {
max-width: 100%;
background-color: transparent;
border-collapse: collapse;
border-spacing: 0;
}
}
.red-ui-component-spinner {
position: absolute;
top: 1px;
bottom: 1px;
left: 1px;
right: 1px;
text-align: center;
padding: 40px;
background: $secondary-background;
&:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -0.25em;
}
img {
display: inline-block;
vertical-align: middle;
width: 80px;
}
&.red-ui-component-spinner-sidebar {
background: $secondary-background;
padding:0;
img {
width: 40px;
}
}
&.projects-version-control-spinner-sidebar {
background: $secondary-background;
padding:0;
img {
width: 20px;
}
}
&.red-ui-component-spinner-contain {
padding: 0;
img {
width: auto;
height: 100%;
max-height: 50px;
}
}
}

21
packages/node_modules/@node-red/editor-client/src/sass/bootstrap.scss vendored
View File

@ -1,21 +0,0 @@
/**
* Copyright JS Foundation and other contributors, http://js.foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
**/
.popover-title { display: none; }
div.btn-group, a.btn {
@include disable-selection;
}

287
packages/node_modules/@node-red/editor-client/src/sass/colors.scss vendored
View File

@ -14,64 +14,271 @@
* limitations under the License.
**/
$background-color: #f3f3f3;
$primary-font: 'Helvetica Neue', Arial, Helvetica, sans-serif;
$primary-font-size: 14px;
$monospace-font: Menlo, Consolas, 'DejaVu Sans Mono', Courier, monospace;
$form-placeholder-color: #bbbbbb;
$form-text-color: #444;
$primary-background: #f3f3f3;//#0ff;
$secondary-background: #fff;//#ff0;
$secondary-background-selected: #efefef;//#e9e900;
$secondary-background-inactive: #f0f0f0;//#f0f000;
$secondary-background-hover: #ddd;//#dd0;
$secondary-background-disabled: #f9f9f9;//#fafa0;
$tertiary-background: #f7f7f7;//#f0f;
$shadow: rgba(0, 0, 0, 0.2);
// Main body text
$primary-text-color: #555;//#0f0;
// UI control label text
$secondary-text-color: #888;//#00f;
$secondary-text-color-focus: #999;//#009;
$secondary-text-color-hover: #666;//#006;
$secondary-text-color-active: #666;//#006;
$secondary-text-color-selected: #AAA;//#00A;
$secondary-text-color-inactive: #666;//#006;
$secondary-text-color-disabled: #bbb;//#00C;
$secondary-text-color-disabled-active: #999;//#009;
$secondary-text-color-disabled-inactive: #aaa;//#00A;
// Sub label text
$tertiary-text-color: #aaa;//#90f;
// Heading text
$header-text-color: #444;//#f00;
$text-color-warning: #AD1625;
$text-color-green: #3a3;
$primary-border-color: #bbbbbb;//#f00;
$secondary-border-color: #dddddd;//#0f0;
$tertiary-border-color: #ccc;//#00f;
$form-background: $secondary-background;
$form-placeholder-color: $tertiary-text-color;
$form-text-color: $primary-text-color;
$form-text-color-disabled: $secondary-text-color-disabled;
$form-input-focus-color: rgba(85,150,230,0.8);
$form-input-border-color: #ccc;
$form-input-border-selected-color: #aaa;
$form-input-border-color: $tertiary-border-color;
$form-input-border-selected-color: #aaa;//#f0f;
$form-input-border-error-color: rgb(214, 97, 95);
$form-input-background: $secondary-background;
$form-input-background-disabled: $secondary-background-disabled;
$form-button-background: $secondary-background-selected;
$form-tips-background: #ffe;
$text-editor-color: #4D4D4C;//#00f;
$text-editor-background: $secondary-background;
$text-editor-color-disabled: $secondary-text-color-inactive;
$text-editor-background-disabled: $secondary-background-disabled;
$text-editor-gutter-background: #f6f6f6;//#ee0;
$text-editor-gutter-color: #777;//#00e;
$text-editor-gutter-active-line-background: #dcdcdc;//#dd0;
$text-editor-active-line-background: #efefef;//#ee0;
$text-editor-selection-background: #D6D6D6;//#e0e;
$event-log-background: #444;
$event-log-color: #dd9;
$event-log-active-line-background: #333;
$event-log-selection-background: #999;
$list-item-color: $primary-text-color;
$list-item-background: $secondary-background;
$list-item-background-disabled: $secondary-background-inactive;
$list-item-background-hover: $secondary-background-hover;
$list-item-background-selected: $secondary-background-selected;
$list-item-border-selected: $secondary-text-color-selected;
$tab-text-color-active: $header-text-color;
$tab-text-color-inactive: $secondary-text-color-inactive;
$tab-text-color-disabled-active: $secondary-text-color-disabled-active;
$tab-text-color-disabled-inactive: $secondary-text-color-disabled-inactive;
$tab-badge-color: $tertiary-text-color;
$tab-background: $secondary-background;
$tab-background-active: $secondary-background;
$tab-background-selected: $secondary-background-selected;
$tab-background-inactive: $secondary-background-inactive;
$tab-background-hover: $secondary-background-hover;
$palette-header-background: $primary-background;
$palette-header-color: $header-text-color;
$palette-content-background: $secondary-background;
$workspace-button-background: $secondary-background;
$workspace-button-background-hover: $secondary-background-hover;
$workspace-button-background-active: $secondary-background-selected;
$workspace-button-color: $secondary-text-color;
$workspace-button-color-disabled: $secondary-text-color-disabled;
$workspace-button-color-focus: $secondary-text-color-focus;
$workspace-button-color-hover: $secondary-text-color-hover;
$workspace-button-color-active: $secondary-text-color-active;
$workspace-button-color-selected: $secondary-text-color-selected;
$workspace-button-color-primary: #eee;
$workspace-button-background-primary: #AD1625;
$workspace-button-background-primary-hover: #6E0A1E;
$workspace-button-color-focus-outline: $form-input-border-color;
$shade-color: rgba(160,160,160,0.5);
$popover-background: #333;
$popover-color: #eee;
$popover-button-border-color: #bbb;
$popover-button-border-color-hover: #666;
$diff-text-header-color: $secondary-text-color;
$diff-text-header-background: #ffd;
$diff-text-header-background-hover: #ffc;
$diff-state-added: #009900;
$diff-state-deleted: #f80000;
$diff-state-changed: #f89406;
$diff-state-changed-background: #fff2e1;
$diff-state-unchanged: #bbb;
$diff-state-unchanged-background: #fff;
$diff-state-conflicted: purple;
$diff-state-moved: #3f81b3;
$diff-state-conflict: #9b45ce;
$diff-state-conflict-background: #ffdad4;
$diff-state-added-background: #e7ffe3;
$diff-state-added-border: #b8daad;
$diff-state-added-header-background: #c0f6c0;
$diff-state-added-header-border: #aaeeaa;
$diff-state-deleted-background: #ffe1e1;
$diff-state-deleted-border: #e4bcbc;
$diff-state-deleted-header-background: #ffcccc;
$diff-state-deleted-header-border: #eebbbb;
$diff-merge-header-color: #800080;
$diff-merge-header-background: #e5f9ff;
$diff-merge-header-border-color: #b2edff;
$menuBackground: $primary-background;
$menuDivider: $secondary-border-color;
$menuColor: $primary-text-color;
$menuActiveColor: $secondary-text-color-active;
$menuActiveBackground: $secondary-background-hover;
$menuDisabledColor: $secondary-text-color-disabled;
$menuHoverColor: $secondary-text-color-hover;
$menuHoverBackground: $secondary-background-hover;
$menuCaret: $tertiary-text-color;
$view-navigator-background: rgba(245,245,245,0.8);
$view-lasso-stroke: #ff7f0e;
$view-lasso-fill: rgba(20,125,255,0.1);
$view-background: $secondary-background;
$view-grid-color: #eee;
$node-label-color: #333;
$node-border: #999;
$node-border-unknown: #f33;
$node-border-placeholder: #aaa;
$node-background-placeholder: #eee;
$node-port-background: #d9d9d9;
$node-port-background-hover: #eee;
$node-icon-color: #fff;
$node-icon-background-color: rgba(0,0,0,0.05);
$node-icon-background-color-fill: #000;
$node-icon-background-color-opacity: 0.05;
$node-icon-border-color: #000;
$node-icon-border-color-opacity: 0.1;
$node-link-port-background: #eee;
$node-status-error-border: rgb(145, 16, 2);
$node-status-error-background: rgb(255, 102, 0);
$node-status-changed-border: rgb(28, 102, 140);
$node-status-changed-background: rgb(0, 188, 255);
$node-status-colors: (
red: #c00,
green: #5a8,
yellow: #F9DF31,
blue: #53A3F3,
grey: #d3d3d3
);
$list-item-color: #666;
$list-item-background-hover: #f3f3f3;
$list-item-background-active: #efefef;
$list-item-background-selected: #eee;
$node-selected-color: #ff7f0e;
$port-selected-color: #ff7f0e;
$link-color: #888;
$link-link-color: #ccc;
$link-link-active-color: #ff7f0e;
$link-subflow-color: #bbb;
$link-unknown-color: #f00;
$primary-border-color: #bbbbbb;
$secondary-border-color: #dddddd;
$clipboard-textarea-background: #F3E7E7;
$tab-background-active: #fff;
$tab-background-selected: #f9f9f9;
$tab-background-inactive: #f0f0f0;
$tab-background-hover: #ddd;
$palette-header-background: #f3f3f3;
$deploy-button-color: #eee;
$deploy-button-color-active: #ccc;
$deploy-button-color-disabled: #999;
$deploy-button-background: #8C101C;
$deploy-button-background-hover: #6E0A1E;
$deploy-button-background-active: #4C0A17;
$deploy-button-background-disabled: #444;
$deploy-button-background-disabled-hover: #555;
$workspace-button-background: #fff;
$workspace-button-background-hover: #ddd;
$workspace-button-background-active: #efefef;
$workspace-button-color: #888;
$workspace-button-color-disabled: #ccc;
$workspace-button-color-focus: #999;
$workspace-button-color-hover: #666;
$workspace-button-color-active: #666;
$workspace-button-color-selected: #AAA;
$workspace-button-toggle-color: #999;
$workspace-button-toggle-color-selected: #888;
$workspace-button-toggle-color-disabled: #ddd;
$header-background: #000;
$header-button-background-active: #121212;
$header-menu-color: #C7C7C7;
$header-menu-color-disabled: #666;
$header-menu-heading-color: #fff;
$header-menu-sublabel-color: #aeaeae;
$header-menu-background: #121212;
$header-menu-item-hover: #323232;
$header-menu-item-border-active: #777677;
$headerMenuItemDivider: #464646;
$headerMenuCaret: #C7C7C7;
$workspace-button-color-focus-outline: rgba(85,150,230,0.2);
$vcCommitShaColor: #c38888;
$typedInput-button-background: #efefef;
$typedInput-button-background-hover: #ddd;
$typedInput-button-background-active: #ddd;
$info-text-code-color: #AD1625;
$info-text-link-color: #0088cc;
$editor-button-color-primary: #eee;
$editor-button-background-primary: #AD1625;
$editor-button-background-primary-hover: #6E0A1E;
$editor-button-color: #999;
$editor-button-background: #fff;
$dnd-background: rgba(0,0,0,0.3);
$dnd-color: #fff;
$shade-color: rgba(160,160,160,0.5);
$notification-border-default: #325C80;
$notification-border-success: #4B8400;
$notification-border-warning: #D74108;
$notification-border-error: $text-color-warning;
$popover-background: #333;
$popover-color: #eee;
$debug-message-background: $secondary-background;
$debug-message-background-hover: $secondary-background-selected;
$debug-message-text-color: #333;
$debug-message-text-color-meta: #a66;
$debug-message-text-color-object-key: #792e90;
$debug-message-text-color-msg-type-other: #2033d6;
$debug-message-text-color-msg-type-string: #b72828;
$debug-message-text-color-msg-type-null: #666;
$debug-message-text-color-msg-type-meta: #666;
$debug-message-text-color-msg-type-number: #2033d6;
$debug-message-border: #eee;
$debug-message-border-hover: #999;
$debug-message-border-warning: #ffdf9d;
$debug-message-border-error: #f99;

201
packages/node_modules/@node-red/editor-client/src/sass/debug.scss vendored
View File

@ -14,16 +14,17 @@
* limitations under the License.
**/
.debug-window {
.red-ui-debug-window {
padding:0;
margin:0;
background: #fff;
background: $secondary-background;
line-height: 20px;
.red-ui-debug-msg-payload {
font-size: 14px;
}
}
.debug-window .debug-message-payload {
font-size: 14px;
}
.debug-content {
.red-ui-debug-content {
position: absolute;
top: 43px;
bottom: 0px;
@ -31,234 +32,216 @@
right: 0px;
overflow-y: scroll;
}
.debug-filter-box {
.red-ui-debug-filter-box {
position:absolute;
top: 42px;
left: 0px;
right: 0px;
z-index: 20;
background: #f9f9f9;
background: $tertiary-background;
padding: 10px;
border-bottom: 1px solid #ddd;
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
border-bottom: 1px solid $secondary-border-color;
box-shadow: 0 2px 6px $shadow;
}
.debug-filter-row {
.red-ui-debug-filter-row {
.red-ui-nodeList {
margin: 10px 0;
}
}
.debug-message {
.red-ui-debug-msg {
position: relative;
border-bottom: 1px solid #eee;
border-left: 8px solid #eee;
border-right: 8px solid #eee;
border-bottom: 1px solid $debug-message-border;
border-left: 8px solid $debug-message-border;
border-right: 8px solid $debug-message-border;
padding: 2px;
&>.debug-message-meta .debug-message-tools {
&>.red-ui-debug-msg-meta .red-ui-debug-msg-tools {
display: none;
}
&.debug-message-hover {
border-right-color: #999;
&>.debug-message-meta .debug-message-tools {
&.red-ui-debug-msg-hover {
border-right-color: $debug-message-border-hover;
&>.red-ui-debug-msg-meta .red-ui-debug-msg-tools {
display: inline-block;
}
}
}
.debug-message-row {
.debug-message-tools-pin {
.red-ui-debug-msg-row {
.red-ui-debug-msg-tools-pin {
display: none;
}
&.debug-message-row-pinned .debug-message-tools-pin {
&.red-ui-debug-msg-row-pinned .red-ui-debug-msg-tools-pin {
display: inline-block;
}
&:hover {
background: #f3f3f3;
&>.debug-message-tools {
.debug-message-tools-copy {
background: $debug-message-background-hover;
&>.red-ui-debug-msg-tools {
.red-ui-debug-msg-tools-copy {
display: inline-block;
}
.debug-message-tools-pin {
.red-ui-debug-msg-tools-pin {
display: inline-block;
}
.debug-message-tools-other {
.red-ui-debug-msg-tools-other {
display: inline-block;
}
}
}
}
.debug-message-meta .debug-message-tools {
.editor-button-small {
.red-ui-debug-msg-meta .red-ui-debug-msg-tools {
.red-ui-button-small {
font-size: 11px;
}
}
.debug-message-tools {
.red-ui-debug-msg-tools {
.button-group:not(:last-child) {
margin-right: 3px;
}
.editor-button-small {
.red-ui-button-small {
height: 16px;
line-height: 14px;
font-size: 8px;
border-radius: 1px;
padding: 0 3px;
min-width: 18px;
i.fa-terminal {
// terminal icon is a bit thin, so darken its color for better contrast
color: darken($editor-button-color, 30%) !important;
}
&.selected {
color: darken($workspace-button-color-selected, 10%) !important;
background: darken($workspace-button-background-active,10%);
}
}
}
.debug-message-meta {
background: #fff;
.red-ui-debug-msg-meta {
background: $debug-message-background;
font-size: 11px;
color: #707070;
color: $secondary-text-color-inactive;
}
.debug-message-date {
.red-ui-debug-msg-date {
padding: 1px 5px 1px 1px;
}
.debug-message-topic {
.red-ui-debug-msg-topic {
display: block;
color: #a66;
color: $debug-message-text-color-meta;
}
.debug-message-name {
.red-ui-debug-msg-name {
padding: 1px 5px;
color: #707070;
color: $secondary-text-color-inactive;
}
.debug-message-tools {
.red-ui-debug-msg-tools {
position: absolute;
top: 3px;
right: 1px;
.debug-message-tools-copy {
.red-ui-debug-msg-tools-copy {
display: none;
}
.debug-message-tools-other {
.red-ui-debug-msg-tools-other {
display: none;
}
}
.debug-message-payload {
.red-ui-debug-msg-payload {
display: block;
padding: 2px;
background: #fff;
background: $debug-message-background;
font-family: $monospace-font;
font-size: 13px !important;
}
.debug-message-level-log {
border-left-color: #eee;
border-right-color: #eee;
.red-ui-debug-msg-level-log {
border-left-color: $debug-message-border;
border-right-color: $debug-message-border;
}
.debug-message-level-30 {
border-left-color: #ffdf9d;
border-right-color: #ffdf9d;
.red-ui-debug-msg-level-30 {
border-left-color: $debug-message-border-warning;
border-right-color: $debug-message-border-warning;
}
.debug-message-level-20 {
border-left-color: #f99;
border-right-color: #f99;
.red-ui-debug-msg-level-20 {
border-left-color: $debug-message-border-error;
border-right-color: $debug-message-border-error;
}
.debug-message-object-entry {
.red-ui-debug-msg-object-entry {
position: relative;
padding-left: 15px;
}
.debug-message-element {
color: #333;
font-family: Menlo, monospace;
font-size: 13px !important;
.red-ui-debug-msg-element {
color: $debug-message-text-color;
line-height: 1.3em;
}
.debug-message-object-key {
color: #792e90;
.red-ui-debug-msg-object-key {
color: $debug-message-text-color-object-key;
}
.debug-message-object-value {
.red-ui-debug-msg-object-value {
}
.debug-message-object-handle {
color: #666;
.red-ui-debug-msg-object-handle {
color: $secondary-text-color;
font-size: 1em;
width: 1em;
text-align: center;
transition: transform 0.1s ease-in-out;
transform: rotate(90deg);
}
.debug-message-element:not(.debug-message-top-level)>.debug-message-expandable>.debug-message-object-handle {
.red-ui-debug-msg-element:not(.red-ui-debug-msg-top-level)>.red-ui-debug-msg-expandable>.red-ui-debug-msg-object-handle {
margin-left: -1em;
}
.debug-message-object-entry>.debug-message-expandable>.debug-message-object-handle {
.red-ui-debug-msg-object-entry>.red-ui-debug-msg-expandable>.red-ui-debug-msg-object-handle {
margin-left: -1em;
}
.debug-message-object-entry.collapsed>span>.debug-message-object-handle {
.red-ui-debug-msg-object-entry.collapsed>span>.red-ui-debug-msg-object-handle {
transform: rotate(0deg);
}
.debug-message-element.collapsed>span>.debug-message-object-handle {
.red-ui-debug-msg-element.collapsed>span>.red-ui-debug-msg-object-handle {
transform: rotate(0deg);
}
.debug-message-object-entry.collapsed > .debug-message-object-entry {
.red-ui-debug-msg-object-entry.collapsed > .red-ui-debug-msg-object-entry {
display:none;
}
.debug-message-element.collapsed .debug-message-object-entry {
.red-ui-debug-msg-element.collapsed .red-ui-debug-msg-object-entry {
display:none;
}
.debug-message-element:not(.collapsed)>.debug-message-expandable>.debug-message-object-value>.debug-message-object-header {
.red-ui-debug-msg-element:not(.collapsed)>.red-ui-debug-msg-expandable>.red-ui-debug-msg-object-value>.red-ui-debug-msg-object-header {
display:none;
}
.debug-message-element.collapsed .debug-message-buffer-opts {
.red-ui-debug-msg-element.collapsed .red-ui-debug-msg-buffer-opts {
display: none;
}
.debug-message-element.collapsed .debug-message-object-type-header {
.red-ui-debug-msg-element.collapsed .red-ui-debug-msg-object-type-header {
display:none;
}
.debug-message-object-entry pre {
font-family: Menlo, monospace;
.red-ui-debug-msg-object-entry pre {
font-family: $monospace-font;
font-size: 13px;
line-height: 1.2em;
margin: 0 0 0 -1em;
}
.debug-message-type-other { color: #2033d6; }
.debug-message-type-string { color: #b72828; }
.debug-message-type-null { color: #666; font-style: italic;}
.debug-message-type-meta { color: #666; font-style: italic;}
.debug-message-type-number { color: #2033d6; };
.debug-message-type-number-toggle { cursor: pointer;}
.red-ui-debug-msg-type-other { color: $debug-message-text-color-msg-type-other; }
.red-ui-debug-msg-type-string { color: $debug-message-text-color-msg-type-string; }
.red-ui-debug-msg-type-null { color: $debug-message-text-color-msg-type-null; font-style: italic;}
.red-ui-debug-msg-type-meta { color: $debug-message-text-color-msg-type-meta; font-style: italic;}
.red-ui-debug-msg-type-number { color: $debug-message-text-color-msg-type-number; };
.red-ui-debug-msg-type-number-toggle { cursor: pointer;}
.debug-message-row {
.red-ui-debug-msg-row {
display: block;
padding: 4px 2px 2px;
position: relative;
&.debug-message-row-pinned {
background: #f6f6f6;
&.red-ui-debug-msg-row-pinned {
background: $list-item-border-selected;
}
}
.debug-message-expandable {
.red-ui-debug-msg-expandable {
cursor: pointer;
}
.debug-message-expandable:hover .debug-message-object-handle {
color: #b72828 !important;
.red-ui-debug-msg-expandable:hover .red-ui-debug-msg-object-handle {
color:$secondary-text-color-hover;
}
.debug-message-buffer-opts a {
font-size: 9px;
color: #bbb;
border: 1px solid #bbb;
border-radius: 2px;
padding: 2px 5px;
.red-ui-debug-msg-buffer-opts {
margin-left: 5px;
}
.debug-message-buffer-opts a:hover {
text-decoration: none;
color: #999;
border: 1px solid #999;
background: #f3f3f3;
}
.debug-message-buffer-raw > .debug-message-string-rows {
.red-ui-debug-msg-buffer-raw > .red-ui-debug-msg-string-rows {
display: none;
}
.debug-message-buffer-string > .debug-message-array-rows {
.red-ui-debug-msg-buffer-string > .red-ui-debug-msg-array-rows {
display: none;
}
.debug-message-type-string-swatch {
.red-ui-debug-msg-type-string-swatch {
display: inline-block;
width: 1.1em;
height: 0.9em;

374
packages/node_modules/@node-red/editor-client/src/sass/diff.scss vendored
View File

@ -15,7 +15,7 @@
**/
.node-dialog-view-diff-panel {
.red-ui-diff-panel {
padding: 5px;
padding-top: 30px;
position: relative;
@ -23,11 +23,11 @@
.red-ui-editableList-container {
border-radius:1px;
padding:0;
background: #f9f9f9;
background: $tertiary-background;
}
.node-dialog-view-diff-diff {
.red-ui-diff-list {
li {
background: #f9f9f9;
background: $tertiary-background;
padding: 0px;
border: none;
min-height: 0;
@ -38,7 +38,7 @@
// padding-bottom: 5px;
}
}
.node-diff-container {
.red-ui-diff-container {
position: absolute;
top: 40px;
right:0;
@ -47,7 +47,7 @@
overflow-y: scroll;
}
.node-dialog-view-diff-headers {
.red-ui-diff-panel-headers {
position: absolute;
left:232px;
right:12px;
@ -62,7 +62,7 @@
white-space: nowrap;
text-overflow: ellipsis;
width: 50%;
background: #f9f9f9;
background: $tertiary-background;
text-align: center;
border-top: 1px solid $secondary-border-color;
border-color:$secondary-border-color;
@ -73,35 +73,35 @@
}
}
.node-diff-toolbar {
.red-ui-diff-dialog-toolbar {
box-sizing: border-box;
color: #666;
color: $secondary-text-color;
text-align: right;
padding: 8px 10px;
background: #f3f3f3;
background: $primary-background;
border-bottom: 1px solid $secondary-border-color;
white-space: nowrap;
}
.node-diff-tab {
background: #fff;
border: 1px solid #ddd;
.red-ui-diff-list-flow {
background: $secondary-background;
border: 1px solid $secondary-border-color;
border-radius: 1px;
overflow: hidden;
&.collapsed {
.node-diff-tab-title .node-diff-chevron {
.red-ui-diff-list-flow-title .red-ui-diff-list-chevron {
transform: rotate(-90deg);
}
.node-diff-node-entry {
.red-ui-diff-list-node {
display: none;
}
}
}
.node-diff-tab-stats {
.red-ui-diff-list-flow-stats {
font-size: 0.9em;
}
.node-diff-chevron {
.red-ui-diff-list-chevron {
display: inline-block;
width: 15px;
text-align: center;
@ -109,30 +109,30 @@
transition: transform 0.1s ease-in-out;
}
.node-diff-node-entry {
.red-ui-diff-list-node {
margin-left: 20px;
font-size: 0.9em;
&:first-child {
border-top: 1px solid $secondary-border-color;
border-top: 1px solid $tertiary-border-color;
}
&:not(:last-child) {
border-bottom: 1px solid $secondary-border-color;
border-bottom: 1px solid $tertiary-border-color;
}
&.collapsed {
.node-diff-chevron {
.red-ui-diff-list-chevron {
transform: rotate(-90deg);
}
.node-diff-node-entry-properties {
.red-ui-diff-list-node-properties {
display: none;
}
}
&:not(.collapsed) {
.node-diff-node-entry-cell:not(:first-child) {
.red-ui-diff-list-node-cell:not(:first-child) {
//display: none;
}
.node-diff-node-entry-cell:first-child {
.red-ui-diff-list-node-cell:first-child {
//width: 100%
}
}
@ -150,7 +150,7 @@
width: 100%;
}
td, th {
border-top: 1px solid #f3f3f3;
border-top: 1px solid $secondary-border-color;
border-left: 1px solid $secondary-border-color;
&:first-child {
border-left: none;
@ -166,18 +166,18 @@
overflow:hidden;
}
&:hover {
background: #f9f9f9;
background: $secondary-background-selected;
}
}
td {
.node-diff-status {
.red-ui-diff-status {
margin-left: 0;
}
}
tr:not(.node-diff-property-header) {
.node-diff-status {
tr:not(.red-ui-diff-list-header) {
.red-ui-diff-status {
width: 12px;
margin-left: 0;
margin-top: 0;
@ -186,8 +186,8 @@
}
}
}
.node-diff-three-way {
.node-diff-node-entry-cell {
.red-ui-diff-three-way {
.red-ui-diff-list-node-cell {
width: calc((100% - 220px) / 2);
&:first-child {
width: 220px;
@ -197,8 +197,8 @@
width:50%;
}
.node-diff-node-entry {
.node-diff-node-entry-cell {
.red-ui-diff-list-node {
.red-ui-diff-list-node-cell {
width: calc((100% + 20px - 220px) / 2);
&:first-child {
width: 200px;
@ -208,131 +208,113 @@
}
}
.node-diff-column {
display:inline-block;
height:100%;
width:50%;
box-sizing: border-box;
white-space:nowrap;
overflow: hidden;
&:first-child {
border-right: 1px solid $secondary-border-color
}
}
.node-diff-tab-title {
.red-ui-diff-list-flow-title {
cursor: pointer;
padding: 0;
// background: #f6f6f6;
&:hover {
background: #f9f9f9;
background: $secondary-background-selected;
}
}
.node-diff-tab-title-meta {
.red-ui-diff-list-flow-title-meta {
vertical-align: middle;
display: inline-block;
padding-top: 2px;
}
.node-diff-node-entry-header {
.red-ui-diff-list-node-header {
cursor: pointer;
&:hover {
background: #f9f9f9;
background: $secondary-background-selected;
}
}
.node-diff-node-entry-node {
.red-ui-diff-list-node-icon {
vertical-align: middle;
display: inline-block;
margin: 5px;
width: 18px;
height: 15px;
background: #ddd;
background: $form-input-background;
border-radius: 2px;
border: 1px solid #999;
border: 1px solid $node-border;
background-position: 5% 50%;
background-repeat: no-repeat;
background-size: contain;
position: relative;
.palette_icon {
.red-ui-palette-icon {
background-position: 49% 50%;
width: 15px;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
position: relative;
top: -2.5px;
left: 0px;
}
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
}
}
.node-diff-tab-empty {
.node-diff-chevron i {
.red-ui-diff-list-flow-empty {
.red-ui-diff-list-chevron i {
display: none;
}
.node-diff-tab-title {
.red-ui-diff-list-flow-title {
cursor: default;
&:hover {
background: none;
}
}
}
.node-diff-node-deleted {
//background: #fadddd;
.red-ui-diff-status-deleted {
cursor: default !important;
.node-diff-status {
color: #f80000;
.red-ui-diff-status {
color: $diff-state-deleted;
}
.node-diff-node-entry-node {
.red-ui-diff-list-node-node {
opacity: 0.5;
}
.node-diff-node-description {
.red-ui-diff-list-node-description {
opacity: 0.5;
text-decoration: line-through;
}
}
.node-diff-node-added {
//background: #eefaee;
.red-ui-diff-status-added {
cursor: default !important;
.node-diff-status {
color: #009900;
.red-ui-diff-status {
color: $diff-state-added;
}
}
.node-diff-node-moved {
//background: #eefaee;
.node-diff-status {
color: #3f81b3;
.red-ui-diff-status-moved {
.red-ui-diff-status {
color: $diff-state-moved;
}
}
.node-diff-node-changed {
//background: #fff2ca;
.node-diff-status {
color: #f89406;
.red-ui-diff-status-changed {
.red-ui-diff-status {
color: $diff-state-changed;
}
}
.node-diff-node-unchanged {
//background: #fff2ca;
.node-diff-status {
color: #bbb;
.red-ui-diff-status-unchanged {
.red-ui-diff-status {
color: $diff-state-unchanged;
}
}
.node-diff-node-conflict {
.node-diff-status {
color: #9b45ce;
.red-ui-diff-status-conflict {
.red-ui-diff-status {
color: $diff-state-conflict;
}
}
.node-diff-node-entry-title {
.red-ui-diff-list-node-title {
display: inline-block;
.node-diff-status {
.red-ui-diff-status {
margin-left: 15px;
}
}
.node-diff-node-entry-properties {
.red-ui-diff-list-node-properties {
margin: 0;
color: #666;
color: $primary-text-color;
}
.node-diff-status {
.red-ui-diff-status {
display: inline-block;
height: 20px;
margin-left: 5px;
@ -341,12 +323,12 @@
margin-bottom: 6px;
text-align: center;
}
.node-diff-element {
.red-ui-diff-list-element {
display: inline-block;
width: calc(100% - 20px);
}
.node-diff-node-description {
.red-ui-diff-list-node-description {
color: $form-text-color;
margin-right: 5px;
padding-top: 5px;
@ -357,23 +339,15 @@
clear: both;
}
}
.node-diff-node-meta {
float: right;
//font-size: 0.9em;
color: #999;
margin-top: 7px;
margin-right: 10px;
}
.node-diff-count { color: #999}
.node-diff-added { color: #009900}
.node-diff-deleted { color: #f80000}
.node-diff-changed { color: #f89406}
.node-diff-unchanged { color: #bbb}
.node-diff-conflicted { color: purple}
.red-ui-diff-state-added { color: $diff-state-added; }
.red-ui-diff-state-deleted { color: $diff-state-deleted; }
.red-ui-diff-state-changed { color: $diff-state-changed; }
.red-ui-diff-state-unchanged { color: $diff-state-unchanged; }
.red-ui-diff-state-conflicted { color: $diff-state-conflicted; }
.node-diff-node-entry-cell {
.red-ui-diff-list-node-cell {
display: inline-block;
vertical-align: top;
box-sizing: border-box;
@ -385,35 +359,35 @@
overflow: hidden;
position: relative;
}
.node-diff-empty {
background: #f3f3f3;
.red-ui-diff-empty {
background: $secondary-background-disabled;
background: repeating-linear-gradient(
20deg,
#fff, #fff 5px,
#f6f6f6 5px,
#f6f6f6 10px
$secondary-background, $secondary-background 5px,
$secondary-background-disabled 5px,
$secondary-background-disabled 10px
);
}
.node-diff-node-entry-cell:first-child {
.red-ui-diff-list-node-cell:first-child {
border-left: none;
}
.node-diff-property-cell-label {
.red-ui-diff-list-cell-label {
margin-left: 20px;
vertical-align: top;
box-sizing: border-box;
padding-left: 8px;
width: 120px;
}
.node-diff-property-wires {
.red-ui-diff-list-wires {
display: inline-block;
.node-diff-node-entry-node {
.red-ui-diff-list-node-node {
width: 18px;
height: 15px;
}
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
}
.palette_icon {
.red-ui-palette-icon {
width: 15px;
}
ul,li,ol {
@ -436,91 +410,84 @@
width: 30px;
text-align: center;
}
& > li:not(:last-child) {
border-bottom: 1px solid #999;
}
}
}
.node-diff-node-props .node-diff-node-entry-cell:first-child {
.red-ui-diff-list-node-props .red-ui-diff-list-node-cell:first-child {
padding: 6px 0px;
span:not(.node-diff-chevron) {
span:not(.red-ui-diff-list-chevron) {
margin-left: 5px;
}
}
.node-diff-property-cell {
// vertical-align: top;
// display:inline-block;
//
// box-sizing: border-box;
// padding: 1px 5px;
//min-height: 30px;
&.node-diff-node-changed {
background: #fff2e1 !important;
.red-ui-diff-list-cell {
.red-ui-debug-msg-row:hover {
background: none;
}
&.node-diff-node-conflict {
background: #ffdad4 !important;
&.red-ui-diff-status-changed {
background: $diff-state-changed-background;
}
&.red-ui-diff-status-conflict {
background: $diff-state-conflict-background;
}
}
.node-diff-selectbox {
label.red-ui-diff-selectbox {
position: absolute;
top:0;
right:0;
bottom:0;
width: 35px;
text-align: center;
border-left: 1px solid #eee;
border-left: 1px solid $secondary-border-color;
margin:0;
input {
input[type="radio"] {
margin-top: 8px;
}
&:hover {
background: #f3f3f3;
background: $secondary-background-hover;
}
}
.node-diff-node-entry-conflict.node-diff-select-remote {
.node-diff-node-remote {
background: #e7ffe3;
.red-ui-diff-list-node-conflict.red-ui-diff-select-remote {
.red-ui-diff-list-node-remote {
background: $diff-state-added-background;
label {
border-left-color: #b8daad;
border-left-color: $diff-state-added-border;
}
}
.node-diff-node-local {
background: #ffe1e1;
.red-ui-diff-list-node-local {
background: $diff-state-deleted-background;
label {
border-left-color: #e4bcbc;
border-left-color: $diff-state-deleted-border;
}
}
}
.node-diff-node-entry-conflict.node-diff-select-local {
.node-diff-node-local {
background: #e7ffe3;
.red-ui-diff-list-node-conflict.red-ui-diff-select-local {
.red-ui-diff-list-node-local {
background: $diff-state-added-background;
label {
border-left-color: #b8daad;
border-left-color: $diff-state-added-border;
}
}
.node-diff-node-remote {
background: #ffe1e1;
.red-ui-diff-list-node-remote {
background: $diff-state-deleted-background;
label {
border-left-color: #e4bcbc;
border-left-color: $diff-state-deleted-border;
}
}
}
ul.node-dialog-configm-deploy-list {
ul.red-ui-deploy-dialog-confirm-list {
font-size: 0.9em;
width: 400px;
margin: 10px auto;
text-align: left;
}
.node-dialog-confirm-conflict-row {
.red-ui-deploy-dialog-confirm-conflict-row {
img {
vertical-align:middle;
height: 30px;
@ -532,6 +499,12 @@ ul.node-dialog-configm-deploy-list {
font-size: 30px;
width: 30px;
margin-right: 10px;
&.fa-check {
color: $text-color-green;
}
&.fa-exclamation {
color: $secondary-text-color;
}
}
div {
vertical-align: middle;
@ -540,21 +513,21 @@ ul.node-dialog-configm-deploy-list {
}
}
#node-diff-toolbar-resolved-conflicts .node-diff-status {
#red-ui-diff-dialog-toolbar-resolved-conflicts .red-ui-diff-status {
margin:0;
}
.node-diff-text-diff-button {
.red-ui-diff-text-diff-button {
float: right;
margin: 2px 3px;
line-height: 14px;
height: 16px;
}
.node-text-diff {
.red-ui-diff-text {
height: 100%;
overflow-y:auto;
table.node-text-diff-content {
table.red-ui-diff-text-content {
margin: 10px;
border: 1px solid $secondary-border-color;
border-radius: 3px;
@ -565,99 +538,100 @@ ul.node-dialog-configm-deploy-list {
word-wrap: break-word;
}
td.lineno {
font-family: monospace;
font-family: $monospace-font;
text-align: right;
color: #999;
background: #f6f6f6;
color: $tertiary-text-color;
background: $tertiary-background;
padding: 1px 5px;
&.added {
background: #c0f6c0;
background: $diff-state-added-header-background;
}
&.removed {
background: #ffcccc;
background: $diff-state-deleted-header-background;
}
}
td.lineno:nth-child(3) {
border-left: 1px solid $secondary-border-color;
}
td.linetext {
font-family: monospace;
font-family: $monospace-font;
white-space: pre-wrap;
padding: 1px 5px;
border-left: 1px solid #ccc;
border-left: 1px solid $tertiary-border-color;
span.prefix {
width: 30px;
display: inline-block;
text-align: center;
color: #999;
color: $secondary-text-color;
}
&.added {
border-left-color: #aaeeaa
border-left-color: $diff-state-added-header-border;
}
&.removed {
border-left-color: #eebbbb
border-left-color: $diff-state-deleted-header-border;
}
}
td.blank {
background: #f6f6f6;
background: $tertiary-background;
}
td.added {
background: #eefaee;
background: $diff-state-added-background;
}
td.removed {
background: #ffecec;
background: $diff-state-deleted-background;
}
tr.mergeHeader td {
color: #800080;
background: #e5f9ff;
color: $diff-merge-header-color;
background: $diff-merge-header-background;
height: 26px;
vertical-align: middle;
}
tr.mergeHeader-separator td {
color: #800080;
background: darken(#e5f9ff, 10%);
color: $diff-merge-header-color;
background: $diff-merge-header-border-color;
height: 0px;
}
tr.mergeHeader-ours td {
border-top: 2px solid darken(#e5f9ff, 10%);
border-top: 2px solid $diff-merge-header-border-color;
}
tr.mergeHeader-theirs td {
border-bottom: 2px solid darken(#e5f9ff, 10%);
border-bottom: 2px solid $diff-merge-header-border-color;
}
td.unchanged {
color: #999;
background: $diff-state-unchanged-background;
color: $diff-state-unchanged;
}
tr.unchanged {
background: #fefefe;
background: $diff-state-unchanged-background;
}
tr.start-block {
border-top: 1px solid #f0f0f0;
border-top: 1px solid $secondary-border-color;
}
tr.end-block {
border-bottom: 1px solid #f0f0f0;
border-bottom: 1px solid $secondary-border-color;
}
tr.node-text-diff-file-header td {
tr.red-ui-diff-text-file-header td {
.filename {
font-family: monospace;
font-family: $monospace-font;
}
background: #f3f3f3;
background: $primary-background;
padding: 5px 10px 5px 0;
color: #333;
color: $primary-text-color;
cursor: pointer;
i.node-diff-chevron {
i.red-ui-diff-list-chevron {
width: 30px;
}
}
tr.node-text-diff-file-header.collapsed {
td i.node-diff-chevron {
tr.red-ui-diff-text-file-header.collapsed {
td i.red-ui-diff-list-chevron {
transform: rotate(-90deg);
}
}
tr.node-text-diff-commit-header td {
background: #f3f3f3;
tr.red-ui-diff-text-commit-header td {
background: $primary-background;
padding: 5px 10px;
color: #333;
color: $primary-text-color;
h3 {
font-size: 1.4em;
margin: 0;
@ -665,7 +639,7 @@ ul.node-dialog-configm-deploy-list {
.commit-summary {
border-top: 1px solid $secondary-border-color;
padding-top: 5px;
color: #999;
color: $secondary-text-color;
}
.commit-body {
margin-bottom:15px;
@ -674,21 +648,21 @@ ul.node-dialog-configm-deploy-list {
}
}
tr.node-text-diff-header > td:not(.flow-diff) {
font-family: monospace;
tr.red-ui-diff-text-header > td:not(.red-ui-diff-flow-diff) {
font-family: $monospace-font;
padding: 5px 10px;
text-align: left;
color: #666;
background: #ffd;
color: $secondary-text-color;
background: $diff-text-header-background;
height: 30px;
vertical-align: middle;
border-top: 1px solid #f0f0f0;
border-bottom: 1px solid #f0f0f0;
border-top: 1px solid $secondary-border-color;
border-bottom: 1px solid $secondary-border-color;
}
tr.node-text-diff-expand td {
tr.red-ui-diff-text-expand td {
cursor: pointer;
&:hover {
background: #ffc;
background: $diff-text-header-background;
}
}
}

26
packages/node_modules/@node-red/editor-client/src/sass/dragdrop.scss vendored
View File

@ -14,24 +14,26 @@
* limitations under the License.
**/
#dropTarget {
#red-ui-drop-target {
position: absolute;
top: 0; bottom: 0;
left: 0; right: 0;
background: rgba(0,0,0,0.1);
background: $dnd-background;
display:table;
width: 100%;
height: 100%;
display: none;
z-index:100;
}
#dropTarget div {
display: table-cell;
vertical-align: middle;
text-align: center;
font-size: 40px;
color: #fff;
}
#dropTarget div i {
font-size: 80px;
div {
pointer-events: none;
display: table-cell;
vertical-align: middle;
text-align: center;
font-size: 40px;
color: $dnd-color;
i {
pointer-events: none;
font-size: 80px;
}
}
}

191
packages/node_modules/@node-red/editor-client/src/sass/dropdownMenu.scss vendored
View File

@ -14,80 +14,159 @@
* limitations under the License.
**/
.red-ui-menu-dropdown {
font-family: $primary-font;
font-size: $primary-font-size;
position: absolute;
top: 100%;
width: 200px;
left: 0;
z-index: 1000;
display: none;
float: left;
margin: 2px 0 0;
margin-left: 0px !important;
padding: 5px 0;
list-style: none;
background: $menuBackground;
border: 1px solid $secondary-border-color;
box-shadow: 0 5px 10px $shadow;
&.pull-right {
right: 0;
left: auto;
}
.red-ui-menu-divider {
height: 1px;
margin: 9px 1px;
overflow: hidden;
background-color: $menuDivider;
}
& > li > a {
display: block;
padding: 4px 0 4px 32px;
clear: both;
font-weight: normal;
line-height: 20px;
color: $menuColor;
white-space: normal !important;
}
& > .active > a,
& > .active > a:hover,
& > .active > a:focus {
color: $menuActiveColor;
text-decoration: none;
background-color: $menuActiveBackground;
outline: 0;
}
& > .disabled > a,
& > .disabled > a:hover,
& > .disabled > a:focus {
color: $menuDisabledColor;
}
& > .disabled > a:hover,
& > .disabled > a:focus {
text-decoration: none;
cursor: default;
background-color: transparent;
background-image: none;
}
a {
.fa {
width: 20px;
margin-left: -25px;
margin-top: 3px;
text-align: center;
}
.fa-check-square {
display: none;
}
.fa-square {
display: inline-block;
}
&.active {
.fa-check-square {
display: inline-block;
}
.fa-square {
display: none;
}
}
}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-submenu:hover>a, .dropdown-submenu:focus>a {
background: #999;
}
.dropdown-menu {
background: #f3f3f3;
border-color: $secondary-border-color;
&>li>a {
color: #444;
.pull-right > .red-ui-menu-dropdown {
right: 0;
left: auto;
}
.red-ui-menu-dropdown > li > a:hover,
.red-ui-menu-dropdown > li > a:focus,
.red-ui-menu-dropdown-submenu:hover > a,
.red-ui-menu-dropdown-submenu:focus > a {
color: $menuHoverColor;
text-decoration: none;
background-color: $menuHoverBackground;
}
.red-ui-menu-dropdown-submenu {
position: relative;
& > .red-ui-menu-dropdown {
top: 0;
left: 100%;
margin-top: -6px;
margin-left: -1px;
}
&:hover > .red-ui-menu-dropdown {
display: block;
}
& > a:after {
display: block;
float: right;
width: 0;
height: 0;
margin-top: 5px;
margin-right: -10px;
border-color: transparent;
border-left-color: $menuCaret;
border-style: solid;
border-width: 5px 0 5px 5px;
content: " ";
}
&.pull-left {
float: none;
& > .red-ui-menu-dropdown {
left: -100%;
margin-left: 10px;
}
}
}
.dropdown-menu * .fa-check-square {
display: none;
color: #e0e0e0;
margin-left: -25px;
margin-top: 3px;
}
.dropdown-menu * a.active > .fa-check-square {
display: inline-block;
}
.dropdown-menu * .fa-square {
display: inline-block;
color: #e0e0e0;
margin-left: -25px;
margin-top: 3px;
}
.dropdown-menu * a.active > .fa-square {
.red-ui-menu-dropdown-submenu>a:after {
display: none;
}
.dropdown-menu>li.disabled>a:hover>[class^="icon-"] {
background-image: url("vendor/bootstrap/img/glyphicons-halflings.png") !important;
}
/** Fix for unreachable dropdown menu **/
.dropdown-menu {
border-radius: 0;
width: 200px !important;
margin-left: 0px !important;
}
.dropdown-menu > li > a > i {
width: 10px;
text-align: center;
margin-left: -8px;
}
.dropdown-menu > li > a {
padding-left: 38px ;
text-indent: -8px ;
white-space: normal !important;
}
.dropdown-submenu>a:after {
display: none;
}
.dropdown-submenu>a:before {
.red-ui-menu-dropdown-submenu>a:before {
display: block;
float: left;
width: 0;
height: 0;
margin-top: 5px;
margin-left: -30px;
/* Caret Arrow */
border-color: transparent;
border-right-color: #e0e0e0;
border-right-color: $menuCaret;
border-style: solid;
border-width: 5px 5px 5px 0;
content: " ";
}
.dropdown-submenu.disabled > a:before {
border-right-color: #444;
}
.dropdown-submenu.pull-left>.dropdown-menu {
border-radius: 0;
.red-ui-menu-dropdown-submenu.disabled > a:before {
border-right-color: $menuCaret;
}

267
packages/node_modules/@node-red/editor-client/src/sass/editor.scss vendored
View File

@ -15,7 +15,7 @@
**/
#editor-stack {
#red-ui-editor-stack {
position: absolute;
margin: 0;
top: 0;
@ -24,7 +24,7 @@
width: 0;
z-index: 5;
}
.editor-tray {
.red-ui-tray {
position:absolute;
margin: 0;
top: 0;
@ -32,37 +32,37 @@
width: auto;
right: -1000px;
bottom: 0;
background: #fff;
background: $secondary-background;
border-left: 1px solid $secondary-border-color;
border-bottom: 1px solid $primary-border-color;
box-sizing: content-box;
}
.editor-tray.open {
.red-ui-tray.open {
right: 0;
}
.editor-tray-body-wrapper {
.red-ui-tray-body-wrapper {
width: 100%;
box-sizing: border-box;
overflow: auto;
}
.editor-tray-body {
.red-ui-tray-body {
position: relative;
box-sizing: border-box;
padding: 0.1px; // prevent margin collapsing
.dialog-form,#dialog-form, #node-config-dialog-edit-form {
margin: 20px;
height: calc(100% - 40px);
}
// .dialog-form,#dialog-form, #node-config-dialog-edit-form {
// margin: 20px;
// height: calc(100% - 40px);
// }
}
.editor-tray-content {
.red-ui-tray-content {
overflow: auto;
position: relative;
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 6px;
left: 4px;
}
}
.editor-tray-header {
.red-ui-tray-header {
@include disable-selection;
position: relative;
box-sizing: border-box;
@ -76,19 +76,29 @@
}
}
.editor-tray-footer {
.red-ui-tray-footer {
@include component-footer;
height: 35px;
font-size: 12px !important;
line-height: 35px;
vertical-align: middle;
button {
@include editor-button;
padding: 3px 7px;
font-size: 11px;
}
.red-ui-tray-footer-left {
display:inline-block;
margin-right: 20px;
float:left;
}
.red-ui-tray-footer-right {
float: right;
}
}
.editor-tray-toolbar {
.red-ui-tray-toolbar {
text-align: right;
padding: 6px;
@ -100,11 +110,12 @@
}
}
.editor-tray-titlebar {
.red-ui-tray-titlebar {
color: $header-text-color;
border-bottom: 1px solid $secondary-border-color;
padding: 8px;
}
.editor-tray-breadcrumbs {
.red-ui-editor ul.red-ui-tray-breadcrumbs {
list-style-type: none;
margin: 0;
padding:0;
@ -115,7 +126,7 @@
margin:0;
&:not(:last-child) {
color: $editor-button-color;
color: $workspace-button-color;
font-weight: normal;
&:after {
@ -127,23 +138,24 @@
}
}
}
.editor-tray-resize-handle {
.red-ui-tray-resize-handle {
position: absolute;
top: 0px;
bottom: 0px;
width: 7px;
left: -9px;
background: $background-color url(images/grip.png) no-repeat 50% 50%;
background: $primary-background url(images/grip.png) no-repeat 50% 50%;
cursor: col-resize;
border-left: 1px solid $primary-border-color;
box-shadow: -1px 0 6px rgba(0,0,0,0.1);
box-shadow: -1px 0 6px $shadow;
&.editor-tray-resize-maximised {
background: $background-color;
&.red-ui-tray-resize-maximised {
background: $primary-background;
cursor: default;
}
}
.editor-tray-resize-button {
a.red-ui-tray-resize-button,
button.red-ui-tray-resize-button {
@include workspace-button;
display: block;
height: 37px;
@ -151,66 +163,63 @@
border: none;
border-bottom: 1px solid $secondary-border-color;
margin: 0;
background: $background-color;
background: $primary-background;
color: $workspace-button-color;
}
#palette-shade, #editor-shade, #header-shade, #sidebar-shade {
@include shade;
z-index: 2;
}
#sidebar-shade {
left: -8px;
top: -1px;
bottom: -1px;
}
#full-shade {
@include shade;
z-index: 15;
.red-ui-editor .red-ui-tray {
.dialog-form, #dialog-form, #node-config-dialog-edit-form {
margin: 20px;
height: calc(100% - 40px);
}
}
.dialog-form,#dialog-form, #node-config-dialog-edit-form {
height: 100%;
}
.red-ui-editor,.red-ui-editor-dialog {
.input-error {
border-color: rgb(214, 97, 95) !important;
}
.dialog-form, #dialog-form, #node-config-dialog-edit-form {
margin: 0;
height:100%;
}
.form-row {
clear: both;
color: $form-text-color;
margin-bottom:12px;
}
.form-row label {
display: inline-block;
width: 100px;
}
.form-row input, .form-row div[contenteditable="true"] {
width:70%;
}
.input-error {
border-color: $form-input-border-error-color !important;
}
.form-tips {
background: #ffe;
padding: 8px;
border-radius: 2px;
border: 1px solid $secondary-border-color;
max-width: 450px;
}
.form-tips code {
border: none;
padding: auto;
}
.form-tips a {
text-decoration: underline;
}
.form-row {
clear: both;
color: $form-text-color;
margin-bottom:12px;
}
.form-row label {
display: inline-block;
width: 100px;
}
.form-row input, .form-row div[contenteditable="true"] {
width:70%;
}
.form-tips {
background: $form-tips-background;
padding: 8px;
border-radius: 2px;
border: 1px solid $secondary-border-color;
max-width: 450px;
}
.form-tips code {
border: none;
padding: auto;
}
.form-tips a {
text-decoration: underline;
}
.form-warning {
border-color: #d6615f;
.form-warning {
border-color: $text-color-warning;
}
}
.node-text-editor {
position: relative;
.node-text-editor-help {
.red-ui-editor-text-help {
position: absolute;
bottom: 0px;
right: 1px;
@ -220,20 +229,24 @@
border-right: none;
}
}
.node-text-editor-container {
border:1px solid #ccc;
.red-ui-editor-text-container {
border:1px solid $tertiary-border-color;
border-radius:5px;
overflow: hidden;
font-size: 14px !important;
font-family: Menlo, Consolas, 'DejaVu Sans Mono', Courier, monospace !important;
font-size: $primary-font-size !important;
font-family: $monospace-font !important;
height: 100%;
&.node-text-editor-container-toolbar {
&.red-ui-editor-text-container-toolbar {
height: calc(100% - 40px);
}
}
.editor-button {
a.editor-button, // Deprecated: use .red-ui-button
button.editor-button, // Deprecated: use .red-ui-button
a.red-ui-button,
button.red-ui-button
{
@include workspace-button;
height: 34px;
line-height: 32px;
@ -248,7 +261,11 @@
}
.editor-button-small {
a.editor-button-small, // Deprecated: use .red-ui-button-small
button.editor-button-small, // Deprecated: use .red-ui-button-small
a.red-ui-button-small,
button.red-ui-button-small
{
height: 20px;
min-width: 20px;
line-height: 18px;
@ -257,34 +274,21 @@
padding: 0 5px;
}
#node-config-dialog-scope-container {
cursor: auto;
float: right;
font-size: 12px !important;
line-height: 35px;
}
#node-config-dialog-scope-warning {
#red-ui-editor-config-scope-warning {
display: inline-block;
margin-right: 5px;
color: #AD1625;
color: $text-color-warning;
vertical-align: middle;
}
#node-config-dialog-scope {
#red-ui-editor-config-scope {
margin: 1px 0 0 0;
padding: 0;
height: 22px;
width: 200px;
}
#node-config-dialog-user-count {
vertical-align: middle;
display:inline-block;
margin-right: 20px;
float:left;
font-size: 12px;
line-height: 35px;
}
.node-input-expression-editor #dialog-form {
.red-ui-editor .red-ui-tray .red-ui-editor-type-expression #dialog-form {
margin: 0;
height: 100%;
.red-ui-panel {
@ -296,12 +300,12 @@
}
}
}
.node-input-expression-tab-content {
.red-ui-editor-type-expression-tab-content {
position: relative;
padding: 0 20px;
}
#node-input-expression-help {
#red-ui-editor-type-expression-help {
position: absolute;
top: 35px;
left:0;
@ -311,7 +315,7 @@
overflow: auto;
box-sizing: border-box;
}
#node-input-expression-panel-info {
#red-ui-editor-type-expression-panel-info {
& > .form-row {
margin: 0;
& > div:first-child {
@ -319,47 +323,38 @@
}
}
}
.node-input-expression-legacy, .node-input-buffer-type {
font-size: 0.8em;
.red-ui-editor-type-expression-legacy {
float: left;
cursor: pointer;
border: 1px solid white;
padding: 2px 5px;
border-radius: 2px;
&:hover {
border-color: $form-input-border-color;
}
}
.node-input-buffer-type {
float: none;
.red-ui-editor-type-buffer-type {
text-align: right;
}
.node-input-markdown-editor #dialog-form {
.red-ui-editor .red-ui-tray .red-ui-editor-type-markdown-editor #dialog-form {
margin: 0;
height: 100%;
.red-ui-panel {
padding: 20px 20px 10px;
&:last-child {
padding-top: 60px;
background: #f9f9f9;
background: $primary-background;
}
}
}
.node-input-markdown-panel-preview {
.red-ui-editor-type-markdown-panel-preview {
padding: 10px;
border:1px solid #ccc;
border:1px solid $secondary-border-color;
border-radius:5px;
height: calc(100% - 21px);
overflow-y: scroll;
background: #fff;
background: $secondary-background;
}
#clipboard-hidden {
#red-ui-clipboard-hidden {
position: absolute;
top: -3000px;
}
.node-label-form-row {
.form-row .red-ui-editor-node-label-form-row {
margin: 5px 0 0 50px;
label {
margin-right: 20px;
@ -372,30 +367,24 @@
input {
width: calc(100% - 100px);
}
#node-settings-icon-module {
#red-ui-editor-node-icon-module {
width: calc(55% - 50px);
}
#node-settings-icon-file {
#red-ui-editor-node-icon-file {
width: calc(45% - 55px);
margin-left: 5px;
}
}
.node-label-form-none {
.red-ui-editor-node-label-form-none {
span {
padding-left: 50px;
width: 100px;
color: #999;
color: $secondary-text-color;
}
}
.ace_read-only {
background: #eee !important;
.ace_cursor {
color: transparent !important;
}
}
#node-settings-icon-button {
#red-ui-editor-node-icon-button {
position: relative;
padding-left: 30px;
width: calc(100% - 150px);
@ -405,7 +394,7 @@
left: 2px;
}
}
#node-settings-icon {
#red-ui-editor-node-icon {
margin-left: 10px;
width: calc(100% - 163px);
}
@ -413,7 +402,7 @@
position: absolute;
border: 1px solid $primary-border-color;
box-shadow: 0 1px 6px -3px black;
background: white;
background: $secondary-background;
z-Index: 21;
display: none;
select {
@ -435,15 +424,15 @@
cursor: pointer;
border-radius: 4px;
&:hover {
background: lighten($node-selected-color,20%);
background: $list-item-background-hover;
}
&.selected {
background: lighten($node-selected-color,20%);
background: $list-item-background-selected;
.red-ui-search-result-node {
border-color: white;
// border-color: white;
}
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 6px;
left: 3px;
}
@ -452,7 +441,7 @@
background: $palette-header-background;
font-size: 0.9em;
padding: 3px;
color: #666;
color: $secondary-text-color;
clear: both;
i {
margin-right: 5px;
@ -460,9 +449,11 @@
}
.red-ui-icon-meta {
border-top: 1px solid $secondary-border-color;
background: $tertiary-background;
height: 24px;
span {
padding: 4px;
color: #666;
color: $secondary-text-color;
font-size: 0.9em;
}
button {

254
packages/node_modules/@node-red/editor-client/src/sass/flow.scss vendored
View File

@ -14,63 +14,32 @@
* limitations under the License.
**/
.hidden {
display: none;
}
.lasso {
.nr-ui-view-lasso {
stroke-width: 1px;
stroke: #ff7f0e;
fill: rgba(20,125,255,0.1);
stroke: $view-lasso-stroke;
fill: $view-lasso-fill;
stroke-dasharray: 10 5;
}
.group-box {
stroke-width: 1px;
stroke: #aaaaaa;
fill: rgba(208, 211, 238, 0.1);
stroke-dasharray: 3 3;
}
.group-box-active {
fill: #fff;
stroke: #ff7f0e;
}
.group_label {
stroke-width: 0;
fill: #999;
font-size: 11px;
pointer-events: none;
-webkit-touch-callout: none;
@include disable-selection;
}
.pull-right {
margin-left: 20px;
}
.node_label_italic {
.node_label_italic, // deprecated: use red-ui-flow-node-label-italic
.red-ui-flow-node-label-italic {
font-style: italic;
}
.node_label_unknown {
font-style: italic;
fill: #e00 !important;
.red-ui-flow-node-label-white {
fill: $view-background !important;
}
.node_label_white {
fill: #eee !important;
}
.node_label {
.red-ui-flow-node-label {
stroke-width: 0;
fill: #333;
fill: $node-label-color;
font-size: 14px;
pointer-events: none;
-webkit-touch-callout: none;
@include disable-selection;
}
.port_label {
.red-ui-flow-port-label {
stroke-width: 0;
fill: #888;
fill: $secondary-text-color;
font-size: 16px;
alignment-baseline: middle;
text-anchor: middle;
@ -80,165 +49,142 @@
}
.function_label {
font-size: 12px;
}
.node {
stroke: #999;
.red-ui-flow-node {
stroke: $node-border;
cursor: move;
stroke-width: 1;
}
.node_unknown {
.red-ui-flow-node-unknown {
stroke-dasharray:10,4;
stroke: #f33;
stroke: $node-border-unknown;
}
.node_placeholder {
.red-ui-flow-node-placeholder {
stroke-dasharray:10,4;
stroke: #aaa;
fill: #eee;
stroke: $node-border-placeholder;
fill: $node-background-placeholder;
opacity: 0.5;
stroke-width: 2;
}
.tool_arrow {
stroke-width: 1;
stroke: #999;
fill: #999;
cursor: pointer;
.red-ui-flow-node-icon-group {
.fa-lg {
stroke: none;
fill: $node-icon-color;
text-anchor: middle;
font-family: FontAwesome;
}
}
.node_tools {
fill: #ddd;
stroke: #999;
cursor: move;
stroke-width: 1;
cursor: pointer;
.red-ui-flow-node-icon-shade {
stroke: none;
fill: $node-icon-background-color-fill;
fill-opacity: $node-icon-background-color-opacity;
}
.node_tools_hovered {
stroke: #ff7f0e;
fill: #eee;
.red-ui-flow-node-icon-shade-border {
stroke-opacity: $node-icon-border-color-opacity;
stroke: $node-icon-border-color;
stroke-width: 1;
}
.node_button {
.red-ui-flow-node-button {
fill: inherit;
}
.port {
stroke: #999;
.red-ui-flow-node-button-background {
fill: $node-background-placeholder;
}
.red-ui-flow-port {
stroke: $node-border;
stroke-width: 1;
fill: #ddd;
fill: $node-port-background;
cursor: crosshair;
}
.port_highlight {
stroke: #6DA332;
stroke-width: 3;
fill: #fff;
pointer-events:none;
fill-opacity: 0.5;
.red-ui-flow-node-error {
fill: $node-status-error-background;
stroke: $node-status-error-border;
stroke-width:1px;
cursor: default;
stroke-linejoin: round;
stroke-linecap: round;
}
.red-ui-flow-node-changed {
fill: $node-status-changed-background;
stroke: $node-status-changed-border;
cursor: default;
stroke-width:1px;
stroke-linejoin: round;
stroke-linecap: round;
}
.node_error {
stroke: #ff0000;
stroke-width: 2;
fill: #ff7f0e;
}
.node_badge {
stroke: rgb(93, 114, 145);
stroke-width: 1;
fill: rgb(190, 209, 255);
}
.node_badge_label {
stroke-width:0;
fill: #fff;
font-size: 11px;
pointer-events: none;
-webkit-touch-callout: none;
@include disable-selection;
}
.node_invalid {
stroke: #ff0000;
}
.node_selected {
.red-ui-flow-node-selected {
stroke-width: 2;
stroke: $node-selected-color !important;
}
.node_highlighted {
border-color: #dd1616 !important;
.red-ui-flow-node-highlighted {
border-color: $node-selected-color !important;
border-style: dashed !important;
stroke: #dd1616;
stroke: $node-selected-color;
stroke-width: 2;
stroke-dasharray: 10, 4;
}
.node_hovered {
}
.node_subflow .node {
.red-ui-flow-subflow .red-ui-flow-node {
stroke-dasharray:8, 3;
}
.workspace-disabled {
.link_line {
.red-ui-workspace-disabled {
.red-ui-flow-link-line {
stroke-dasharray: 10,5 !important;
stroke-width: 2 !important;
stroke: $link-subflow-color;
}
.node {
.red-ui-flow-node {
stroke-dasharray: 10,4;
}
}
.node_quickadd * {
stroke-dasharray: 12,3;
@each $current-color in red green yellow blue grey {
.red-ui-flow-node-status-dot-#{$current-color} {
fill: map-get($node-status-colors,$current-color);
stroke: map-get($node-status-colors,$current-color);
}
.red-ui-flow-node-status-ring-#{$current-color} {
fill: $view-background;
stroke: map-get($node-status-colors,$current-color);
}
}
.node_status_label {
.red-ui-flow-node-status-label {
@include disable-selection;
stroke-width: 0;
fill: #888;
fill: $secondary-text-color;
font-size:9pt;
stroke:#000;
text-anchor:start;
}
.port_hovered {
stroke: $port-selected-color !important;
fill: $port-selected-color !important;
}
.port_quick_link {
.red-ui-flow-port-hovered {
stroke: $port-selected-color;
fill: $port-selected-color;
}
.subflowport {
.red-ui-flow-subflow-port {
stroke-dasharray: 5,5;
fill: #eee;
stroke: #999;
fill: $node-background-placeholder;
stroke: $node-border;
}
.drag_line {
.red-ui-flow-drag-line {
stroke: $node-selected-color !important;
stroke-width: 3;
fill: none;
pointer-events: none;
}
.drag_line_hidden {
stroke: $node-selected-color;
stroke-width: 0;
pointer-events: none;
fill: none;
}
.link_line {
.red-ui-flow-link-line {
stroke: $link-color;
stroke-width: 3;
fill: none;
pointer-events: none;
}
.link_link {
.red-ui-flow-link-link {
stroke-width: 2;
stroke-dasharray: 10,5;
stroke: $link-link-color;
@ -246,68 +192,70 @@
stroke-dasharray: 15,2;
// pointer-events: none;
}
.link_port {
fill: #eee;
.red-ui-flow-link-port {
fill: $node-link-port-background;
stroke: $link-link-color;
stroke-width: 1;
}
.link_group_active .link_port {
.red-ui-flow-link-group-active .red-ui-flow-link-port {
stroke: $link-link-active-color;
}
.link_group:hover {
.red-ui-flow-link-group:hover {
cursor: pointer;
}
.link_subflow {
.red-ui-flow-subflow-link {
stroke: $link-subflow-color;
stroke-dasharray: 10,5;
stroke-width: 2;
}
.link_outline {
stroke: #fff;
.red-ui-flow-link-outline {
stroke: $view-background;
stroke-width: 5;
cursor: crosshair;
fill: none;
pointer-events: none;
}
.link_background {
stroke: #fff;
.red-ui-flow-link-background {
stroke: $view-background;
opacity: 0;
stroke-width: 20;
cursor: crosshair;
fill: none;
}
.link_splice > .link_line {
.red-ui-flow-link-splice > .red-ui-flow-link-line {
stroke-dasharray: 15,8;
}
g.link_selected path.link_line {
g.red-ui-flow-link-selected path.red-ui-flow-link-line {
stroke: $node-selected-color;
}
g.link_unknown path.link_line {
g.red-ui-flow-link-unknown path.red-ui-flow-link-line {
stroke: $link-unknown-color;
stroke-width: 2;
stroke-dasharray: 10, 4;
}
@keyframes port_tooltip_fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes red-ui-flow-port-tooltip-fadeIn { from { opacity:0; } to { opacity:1; } }
.port_tooltip {
.red-ui-flow-port-tooltip {
opacity:0;
animation: 0.1s ease-in 0s 1 normal forwards port_tooltip_fadeIn;
animation: 0.1s ease-in 0s 1 normal forwards red-ui-flow-port-tooltip-fadeIn;
pointer-events: none;
path {
path:first-child {
fill: $popover-background;
stroke: $popover-background;
stroke-width: 1;
}
}
.port_tooltip_label {
.red-ui-flow-port-tooltip-label {
stroke-width: 0;
fill: $popover-color;
font-family: $primary-font;
font-size: 12px;
pointer-events: none;
-webkit-touch-callout: none;
white-space: pre;
@include disable-selection;
}

1821
packages/node_modules/@node-red/editor-client/src/sass/forms.scss vendored
View File

File diff suppressed because it is too large Load Diff

486
packages/node_modules/@node-red/editor-client/src/sass/header.scss vendored
View File

@ -14,279 +14,259 @@
* limitations under the License.
**/
$activeButton: #121212;
.button {
@include disable-selection;
}
$deployButton: #8C101C;
$deployButtonHover: #6E0A1E;
$deployButtonActive: #4C0A17;
$deployDisabledButton: #444;
$deployDisabledButtonHover: #555;
$deployDisabledButtonActive: #444;
$headerMenuBackground: #121212;
$headerMenuItemHover: #323232;
$headerMenuItemDivider: #464646;
#header {
#red-ui-header {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 40px;
background: #000;
background: $header-background;
box-sizing: border-box;
padding: 0px 0px 0px 20px;
color: #C7C7C7;
color: $header-menu-color;
font-size: 14px;
}
span.logo {
float: left;
margin-top: 5px;
font-size: 30px;
line-height: 30px;
text-decoration: none;
span.red-ui-header-logo {
float: left;
margin-top: 5px;
font-size: 30px;
line-height: 30px;
text-decoration: none;
span {
vertical-align: middle;
font-size: 16px !important;
}
img {
height: 18px;
}
a {
color: inherit;
&:hover {
text-decoration: none;
span {
vertical-align: middle;
font-size: 16px !important;
&:not(:first-child) {
margin-left: 5px;
}
}
img {
height: 18px;
}
a {
color: inherit;
&:hover {
text-decoration: none;
}
}
}
}
.header-toolbar {
padding: 0;
margin: 0;
list-style: none;
float: right;
> li {
display: inline-block;
.red-ui-header-toolbar {
padding: 0;
margin: 0;
position: relative;
list-style: none;
float: right;
}
}
> li {
display: inline-block;
padding: 0;
margin: 0;
position: relative;
.button {
@include disable-selection;
}
#header .button {
min-width: 20px;
text-align: center;
line-height: 40px;
display: inline-block;
font-size: 20px;
padding: 0px 12px;
text-decoration: none;
color: #C7C7C7;
margin: auto 5px;
vertical-align: middle;
border-left: 2px solid #000;
border-right: 2px solid #000;
&:hover {
border-color: $headerMenuItemHover;
}
}
#header .button-group {
display: inline-block;
margin: auto 15px;
vertical-align: middle;
clear: both;
}
#header .button-group > a {
display: inline-block;
position: relative;
float: left;
line-height: 22px;
font-size: 14px;
text-decoration: none;
padding: 4px 8px;
margin: 0;
}
.deploy-button {
background: $deployButton;
color: #eee !important;
&:hover {
background: $deployButtonHover;
}
&:active {
background: $deployButtonActive;
color: #ccc !important;
}
}
.deploy-button-spinner {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
text-align: center;
img {
opacity: 0.8;
height: 100%;
}
}
#btn-deploy {
padding: 4px 12px;
&.disabled {
cursor: default;
background: $deployDisabledButton;
color: #999 !important;
.deploy-button-content>img {
opacity: 0.3;
}
&+ #btn-deploy-options {
background: $deployDisabledButton;
color: #ddd;
}
&+ #btn-deploy-options:hover {
background: $deployDisabledButtonHover;
}
&+ #btn-deploy-options:active {
background: $deployDisabledButton;
}
}
.deploy-button-content>img {
margin-right: 8px;
.button {
min-width: 20px;
text-align: center;
line-height: 40px;
display: inline-block;
font-size: 20px;
padding: 0px 12px;
text-decoration: none;
color: $header-menu-color;
margin: auto 5px;
vertical-align: middle;
border-left: 2px solid $header-background;
border-right: 2px solid $header-background;
&:hover {
border-color: $header-menu-item-hover;
}
&:active, &.active {
background: $header-button-background-active;
}
&:focus {
outline: none;
}
}
.button-group {
display: inline-block;
margin: auto 15px;
vertical-align: middle;
clear: both;
& > a {
display: inline-block;
position: relative;
float: left;
line-height: 22px;
font-size: 14px;
text-decoration: none;
padding: 4px 8px;
margin: 0;
}
}
.red-ui-deploy-button {
background: $deploy-button-background;
color: $deploy-button-color;
&:hover {
background: $deploy-button-background-hover;
}
&:focus {
outline: none;
}
&:active {
background: $deploy-button-background-active;
color: $deploy-button-color-active;
}
}
.red-ui-deploy-button-spinner {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
text-align: center;
img {
opacity: 0.8;
height: 100%;
}
}
#red-ui-header-button-deploy {
padding: 4px 12px;
&.disabled {
cursor: default;
background: $deploy-button-background-disabled;
color: $deploy-button-color-disabled;
.red-ui-deploy-button-content>img {
opacity: 0.3;
}
&+ #red-ui-header-button-deploy-options {
background: $deploy-button-background-disabled;
color: $deploy-button-color-active;
}
&+ #red-ui-header-button-deploy-options:hover {
background: $deploy-button-background-disabled-hover;
}
&+ #red-ui-header-button-deploy-options:active {
background: $deploy-button-background-disabled;
}
}
.red-ui-deploy-button-content>img {
margin-right: 8px;
}
}
.red-ui-deploy-button-group.open {
#red-ui-header-button-deploy-options {
background: $header-button-background-active !important;
}
}
li.open .button {
background: $header-button-background-active;
border-color: $header-button-background-active;
}
ul.red-ui-menu-dropdown {
background: $header-menu-background;
border: 1px solid $header-menu-background;
width: 250px !important;
margin-top: 0;
li a {
color: $header-menu-color;
padding: 3px 40px;
img {
margin-right: 10px;
padding: 4px;
border: 3px solid transparent;
}
&.active img {
border: 3px solid $header-menu-item-border-active;
}
span.red-ui-menu-label-container {
width: 180px;
vertical-align: top;
display: inline-block;
text-indent: 0px;
}
span.red-ui-menu-label {
font-size: 14px;
display: inline-block;
text-indent: 0px;
}
span.red-ui-menu-sublabel {
color: $header-menu-sublabel-color;
font-size: 13px;
display: inline-block;
text-indent: 0px;
}
}
> li:hover > a,
> li:focus > a {
background: $header-menu-item-hover !important;
}
li.divider {
background: $headerMenuItemDivider;
border-bottom-color: $header-menu-item-hover;
}
li.disabled a {
color: $header-menu-color-disabled;
}
> li.disabled:hover > a,
> li.disabled:focus > a {
background: none !important;
}
}
.red-ui-menu-dropdown-submenu>a:before {
border-right-color: $headerMenuCaret;
}
/* Deploy menu customisations */
ul#red-ui-header-button-deploy-options-submenu {
width: 300px !important;
li a {
padding: 10px 30px;
color: $header-menu-heading-color;
span.red-ui-menu-label {
font-size: 16px;
display: inline-block;
text-indent: 0px;
}
> i.fa {
display: none;
}
}
}
/* User menu customisations */
#usermenu-item-username > .red-ui-menu-label {
color: $header-menu-heading-color;
}
#red-ui-header-button-user .user-profile {
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
display: inline-block;
width: 40px;
height: 35px;
vertical-align: middle;
}
}
.deploy-button-group.open {
#btn-deploy-options {
background: $activeButton !important;
}
}
#header .button {
&:active, &.active {
background: $activeButton;
}
&:focus {
outline: none;
}
}
#header li.open .button {
background: $activeButton;
border-color: $activeButton;
}
#header ul.dropdown-menu {
background: $headerMenuBackground;
border: 1px solid rgba(0,0,0,0.2);
width: 250px !important;
margin-top: 0;
}
#header ul.dropdown-menu li a {
color: #C7C7C7;
padding: 3px 40px;
}
#header ul.dropdown-menu li a img {
margin-right: 10px;
padding: 4px;
border: 3px solid rgba(0,0,0,0);
}
#header ul.dropdown-menu li a.active img {
border: 3px solid #777677;
}
#header ul.dropdown-menu li a span.menu-label-container {
width: 180px;
vertical-align: top;
display: inline-block;
text-indent: 0px;
}
#header ul.dropdown-menu li a span.menu-label {
font-size: 14px;
display: inline-block;
text-indent: 0px;
}
#header ul.dropdown-menu li a span.menu-sublabel {
color: #aeaeae;
font-size: 13px;
display: inline-block;
text-indent: 0px;
}
#header ul.dropdown-menu > li:hover > a,
#header ul.dropdown-menu > li:focus > a {
background: $headerMenuItemHover !important;
}
#header ul.dropdown-menu li.divider {
background: $headerMenuItemDivider;
border-bottom-color: $headerMenuItemHover;
}
#header ul.dropdown-menu li.disabled a {
color: #666;
}
#header ul.dropdown-menu > li.disabled:hover > a,
#header ul.dropdown-menu > li.disabled:focus > a {
background: none !important;
}
/* Deploy menu customisations */
#header ul#btn-deploy-options-submenu {
width: 300px !important;
}
#header ul#btn-deploy-options-submenu li a span.menu-label {
font-size: 16px;
display: inline-block;
text-indent: 0px;
}
#header ul#btn-deploy-options-submenu li a {
padding: 10px 30px;
color: #fff;
}
#header ul#btn-deploy-options-submenu li a > i.fa {
display: none !important;
}
/* User menu customisations */
#header ul#btn-usermenu-submenu li a#btn-username > .menu-label {
font-size: 16px;
color: #fff;
}
#btn-usermenu .user-profile {
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
display: inline-block;
width: 40px;
height: 35px;
vertical-align: middle;
}

77
packages/node_modules/@node-red/editor-client/src/sass/jquery.scss vendored
View File

@ -16,11 +16,11 @@
.ui-widget {
font-size: 14px !important;
font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
font-family: $primary-font;
}
.ui-widget input, .ui-widget div[contenteditable="true"], .ui-widget select, .ui-widget textarea, .ui-widget button {
font-size: 14px !important;
font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
font-family: $primary-font;
}
.ui-widget input, .ui-widget div[contenteditable="true"] {
box-shadow: none;
@ -39,7 +39,7 @@
.ui-dialog {
border-radius: 1px;
background: #fff;
background: $secondary-background;
padding: 0;
@include component-shadow;
}
@ -51,16 +51,20 @@
}
.ui-dialog .ui-dialog-titlebar {
padding: 10px;
background: #f3f3f3;
background: $primary-background;
border: none;
border-bottom: 1px solid #999;
border-bottom: 1px solid $primary-border-color;
border-radius: 0;
}
.ui-dialog .ui-dialog-buttonpane.ui-widget-content {
background: $tertiary-background;
}
.ui-corner-all {
border-radius: 1px;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
background: #f3f3f3;
background: $primary-background;
}
.ui-dialog-no-close .ui-dialog-titlebar-close {
display: none;
@ -80,8 +84,8 @@
padding: 6px 14px;
margin-right: 8px;
border-radius: 2px;
color: $editor-button-color;
background: $editor-button-background;
color: $workspace-button-color;
background: $workspace-button-background;
&.leftButton {
float: left;
@ -92,18 +96,18 @@
}
&.primary {
border-color: $editor-button-background-primary;
color: $editor-button-color-primary !important;
background: $editor-button-background-primary;
border-color: $workspace-button-background-primary;
color: $workspace-button-color-primary !important;
background: $workspace-button-background-primary;
&:not(.disabled):hover {
border-color: $editor-button-background-primary-hover;
background: $editor-button-background-primary-hover;
color: $editor-button-color-primary !important;
border-color: $workspace-button-background-primary-hover;
background: $workspace-button-background-primary-hover;
color: $workspace-button-color-primary !important;
}
&.disabled {
border-color: $form-input-border-color;
color: $workspace-button-color-disabled !important;
background: $editor-button-background;
background: $workspace-button-background;
}
}
&.disabled {
@ -130,15 +134,12 @@
border: 1px solid $form-input-border-color;
}
.ui-spinner input {
background: $form-input-background;
margin: 0 17px 0 0;
padding: 6px;
border: none;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
&:focus {
outline: none;
}
@ -150,3 +151,41 @@
z-index: 100;
opacity: 1;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
border: 1px solid $secondary-border-color;
background: $form-button-background;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover, .ui-button:focus {
border: 1px solid $secondary-border-color;
background: $workspace-button-background-hover;
color: $workspace-button-color-hover;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
border: 1px solid $secondary-border-color;
background: $workspace-button-background-active;
font-weight: normal;
color: $workspace-button-color-active;
}
.ui-state-active .ui-icon, .ui-button:active .ui-icon {
background-image: url(../vendor/jquery/css/base/images/ui-icons_777777_256x240.png);
}

189
packages/node_modules/@node-red/editor-client/src/sass/keyboard.scss vendored
View File

@ -14,122 +14,113 @@
* limitations under the License.
**/
#keyboard-help-dialog {
font-size: 0.9em;
padding-top: 10px;
}
#user-settings-tab-keyboard .red-ui-editableList-container {
border-radius: 0;
border: none;
padding: 0;
}
.keyboard-shortcut-entry.keyboard-shortcut-list-header {
padding:0 5px 0 5px;
div {
color: #666 !important;
}
.red-ui-searchBox-container {
width: calc(100% - 20px);
}
.keyboard-shortcut-entry-scope {
text-align: center;
}
}
.keyboard-shortcut-list-header {
border-bottom: 1px solid $primary-border-color;
}
.keyboard-shortcut-list {
position: absolute;
top:30px;
left:10px;
right:10px;
bottom:10px;
li {
#red-ui-settings-tab-keyboard {
.red-ui-editableList-container {
border-radius: 0;
border: none;
padding: 0;
.red-ui-editableList-item-content {
padding: 8px;
cursor: pointer;
}
.keyboard-shortcut-list-header {
padding:0 5px 0 5px;
border-bottom: 1px solid $primary-border-color;
div {
color: $header-text-color !important;
}
.red-ui-searchBox-container {
width: calc(100% - 20px);
}
.keyboard-shortcut-entry-scope {
text-align: center;
}
}
.keyboard-shortcut-list {
position: absolute;
top:30px;
left:10px;
right:10px;
bottom:10px;
li {
padding: 0;
.red-ui-editableList-item-content {
padding: 8px;
cursor: pointer;
}
}
li:hover {
background: $list-item-background-hover;
}
}
li:hover {
background: #f6f6f6;
}
}
.keyboard-shortcut-entry {
div {
display: inline-block;
}
// white-space: nowrap;
.keyboard-shortcut-entry {
div {
display: inline-block;
}
// white-space: nowrap;
select {
margin: 0;
width: calc(100% - 30px);
font-size: 0.9em;
margin-right: 5px;
select {
margin: 0;
width: calc(100% - 30px);
font-size: 0.9em;
margin-right: 5px;
}
}
}
.keyboard-shortcut-entry-key {
width:160px;
vertical-align: middle;
input {
margin:0;
width: calc(100% - 5px);
}
}
.keyboard-shortcut-entry-text {
vertical-align: middle;
width: calc(100% - 160px - 100px - 10px);
overflow: hidden;
i {
color: #ccc;
margin-right: 5px;
}
}
.keyboard-shortcut-entry-scope {
width:100px;
color: #999;
vertical-align: middle;
text-align: right;
}
.keyboard-shortcut-entry:not(.keyboard-shortcut-list-header) {
.keyboard-shortcut-entry-scope {
font-size: 0.8em;
}
}
.keyboard-shortcut-entry-unassigned {
color: #999;
.keyboard-shortcut-entry-key {
font-style: italic;
}
}
.keyboard-shortcut-entry-expanded {
.keyboard-shortcut-entry-key {
width: 150px;
width:160px;
vertical-align: middle;
input {
margin:0;
width: calc(100% - 5px);
}
}
.keyboard-shortcut-entry-text {
vertical-align: middle;
width: calc(100% - 160px - 100px - 10px);
overflow: hidden;
i {
color: $tertiary-text-color;
margin-right: 5px;
}
}
.keyboard-shortcut-entry-scope {
width: 110px;
width:100px;
color: $tertiary-text-color;
vertical-align: middle;
text-align: right;
}
span {
display: none;
.keyboard-shortcut-entry:not(.keyboard-shortcut-list-header) {
.keyboard-shortcut-entry-scope {
font-size: 0.8em;
}
}
.keyboard-shortcut-entry-unassigned {
color: $tertiary-text-color;
.keyboard-shortcut-entry-key {
font-style: italic;
}
}
.keyboard-shortcut-entry-expanded {
background: $list-item-background-selected;
.keyboard-shortcut-entry-key {
width: 150px;
}
.keyboard-shortcut-entry-text {
}
.keyboard-shortcut-entry-scope {
width: 110px;
}
span {
display: none;
}
}
}
.keyboard-shortcut-edit {
}
.help-key {
border: 1px solid #ddd;
border: 1px solid $tertiary-border-color;
padding: 4px;
border-radius: 3px;
background: #f6f6f6;
font-family: Courier, monospace;
box-shadow: #999 1px 1px 1px;
background: $tertiary-background;
font-family: $monospace-font;
box-shadow: $shade-color 1px 1px 1px;
}
.help-key-block {
white-space: nowrap;

77
packages/node_modules/@node-red/editor-client/src/sass/library.scss vendored
View File

@ -14,76 +14,69 @@
* limitations under the License.
**/
#node-select-library {
overflow: hidden;
}
#node-select-library ul {
list-style: none;
padding: 0px;
margin: 2px;
}
#node-select-library li {
cursor: pointer;
}
#node-select-library li.list-selected {
background: #eee;
}
#node-select-library li.list-hover {
background: #ffffd0;
}
.clipboard-import-error {
.red-ui-clipboard-import-error {
pre {
margin: 10px 0;
border: none;
color: #666;
color: $primary-text-color;
span {
padding: 5px 0;
}
span.error {
padding: 5px;
background: #e25151;
color: white;
border: 1px solid $form-input-border-error-color;
margin: 0 1px;
}
}
}
.clipboard-dialog-tab-clipboard {
.red-ui-clipboard-dialog-tab-clipboard {
padding: 10px;
textarea {
resize: none;
width: 100%;
border-radius: 4px;
font-family: monospace !important;
font-family: $monospace-font !important;
font-size: 13px !important;
height: 300px;
line-height: 1.3em;
padding: 6px 10px;
background: #F3E7E7;
color: #533;
background: $clipboard-textarea-background;
}
}
.clipboard-dialog-tabs-content {
.red-ui-clipboard-dialog-tabs {
position: absolute;
top:0;
left:0;
bottom:0;
width:120px;
}
.red-ui-clipboard-dialog-tabs-content {
position: absolute;
top: 0;
left: 120px;
right: 0;
bottom: 0;
padding: 0;
background: white;
background: $form-input-background;
&>div {
height: calc(100% - 20px)
}
}
.red-ui-clipboard-dialog-box {
height: 400px;
position:relative;
border:1px solid $primary-border-color;
}
.clipboard-dialog-tab-library {
.red-ui-clipboard-dialog-tab-library {
.form-row {
margin-left: 10px;
}
}
#clipboard-dialog {
#red-ui-clipboard-dialog {
form {
margin-bottom: 0;
}
@ -91,19 +84,19 @@
margin-bottom: 0;
}
}
#clipboard-dialog-tab-library-name {
#red-ui-clipboard-dialog-tab-library-name {
width: calc(100% - 120px);
}
#clipboard-dialog-export-tab-library-browser {
#red-ui-clipboard-dialog-export-tab-library-browser {
height: calc(100% - 40px);
margin-bottom: 10px;
border-bottom: 1px solid $primary-border-color;
box-sizing: border-box;
}
#clipboard-dialog-import-tab-library {
#red-ui-clipboard-dialog-import-tab-library {
height: 100%;
}
#clipboard-dialog-import-tab-library-browser {
#red-ui-clipboard-dialog-import-tab-library-browser {
height: 100%;
box-sizing: border-box;
}
@ -113,7 +106,7 @@
position: relative;
height: 100%;
.red-ui-treeList-container {
background: white;
background: $secondary-background;
border: none;
border-radius: 0;
li {
@ -136,29 +129,29 @@
}
}
#node-dialog-library-save-browser {
#red-ui-library-dialog-save-browser {
height: calc(100% - 60px);
border: 1px solid $primary-border-color;
margin-bottom: 10px;
}
#node-dialog-library-load-browser {
#red-ui-library-dialog-load-browser {
// border: 1px solid $primary-border-color;
}
#node-dialog-library-load-panes {
#red-ui-library-dialog-load-panes {
border: 1px solid $primary-border-color;
}
#node-dialog-library-load-preview {
#red-ui-library-dialog-load-preview {
height: 100%;
}
#node-dialog-library-load-preview-text {
#red-ui-library-dialog-load-preview-text {
box-sizing: border-box;
}
#node-dialog-library-load-preview-details {
#red-ui-library-dialog-load-preview-details {
box-sizing: border-box;
.node-info-node-row:first-child {
.red-ui-help-info-row:first-child {
border-top: none;
}
}

92
packages/node_modules/@node-red/editor-client/src/sass/mixins.scss vendored
View File

@ -73,11 +73,10 @@
margin:0;
cursor:pointer;
// &.selected:not(.disabled):not(:disabled) {
// color: $workspace-button-color-selected !important;
// background: $workspace-button-background-active;
// background: #9f9;
// }
&.selected:not(.disabled):not(:disabled) {
color: $workspace-button-color-selected !important;
background: $workspace-button-background-active;
}
.button-group &:not(:first-child) {
border-left: none;
border-top-left-radius: 0;
@ -110,24 +109,24 @@
}
&.primary {
border-color: $editor-button-background-primary;
color: $editor-button-color-primary !important;
background: $editor-button-background-primary;
border-color: $workspace-button-background-primary;
color: $workspace-button-color-primary !important;
background: $workspace-button-background-primary;
&.disabled, &.ui-state-disabled {
background: none;
color: $editor-button-color !important;
color: $workspace-button-color !important;
border-color: $form-input-border-color;
}
&:not(.disabled):not(.ui-button-disabled):hover {
border-color: $editor-button-background-primary-hover;
background: $editor-button-background-primary-hover;
color: $editor-button-color-primary !important;
border-color: $workspace-button-background-primary-hover;
background: $workspace-button-background-primary-hover;
color: $workspace-button-color-primary !important;
}
}
&.secondary {
background: none;
&:not(:hover) {
border-color: rgba(0,0,0,0);
border-color: transparent;
}
}
@ -144,59 +143,23 @@
@mixin workspace-button-toggle {
@include workspace-button;
&.single {
color: $workspace-button-color !important;
background: $workspace-button-background;
&.selected:not(.disabled):not(:disabled) {
color: $workspace-button-toggle-color !important;
background: $workspace-button-background-active;
}
}
&:not(.single) {
color: $workspace-button-toggle-color !important;
background:$workspace-button-background;
margin-bottom: 1px;
&.selected:not(.disabled):not(:disabled) {
color: $workspace-button-toggle-color-selected !important;
background: $workspace-button-background-active;
border-bottom-width: 2px;
border-bottom-color: $form-input-border-selected-color;
margin-bottom: 0;
cursor: default;
}
}
&.disabled,&:disabled {
color: $workspace-button-toggle-color-disabled !important;
}
}
@mixin editor-button {
@include workspace-button;
font-size: 14px;
padding: 6px 14px;
margin-right: 8px;
color: $editor-button-color !important;
background: $editor-button-background;
// &.primary {
// border-color: $editor-button-background-primary;
// color: $editor-button-color-primary !important;
// background: $editor-button-background-primary;
// &.disabled, &.ui-state-disabled {
// background: none;
// color: $editor-button-color !important;
// border-color: $form-input-border-color;
// }
// &:not(.disabled):not(.ui-button-disabled):hover {
// border-color: $editor-button-background-primary-hover;
// background: $editor-button-background-primary-hover;
// color: $editor-button-color-primary !important;
// }
// }
&:not(.disabled):hover {
//color: $editor-button-color;
//color: $workspace-button-color;
}
&.disabled {
background: none;
@ -204,8 +167,6 @@
&.disabled:focus {
outline: none;
}
&.leftButton {
float: left;
margin-top: 1px;
@ -220,14 +181,14 @@
@mixin component-footer {
border-top: 1px solid $primary-border-color;
background: #f3f3f3;
background: $primary-background;
text-align: right;
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 25px;
line-height: 23px;
line-height: 25px;
padding: 0 10px;
user-select: none;
@ -239,10 +200,11 @@
@mixin component-footer-button {
@include workspace-button;
font-size: 11px;
line-height: 17px;
width: 18px;
height: 18px;
font-size: 12px;
line-height: 18px;
width: 19px;
height: 19px;
padding: 0;
&.text-button {
width: auto;
padding: 0 5px;
@ -250,10 +212,11 @@
}
@mixin component-footer-button-toggle {
@include workspace-button-toggle;
font-size: 11px;
line-height: 17px;
height: 18px;
width: 18px;
font-size: 12px;
line-height: 18px;
height: 19px;
width: 19px;
padding: 0;
&.text-button {
width: auto;
padding: 0 5px;
@ -261,8 +224,7 @@
}
@mixin component-shadow {
border: 1px solid $secondary-border-color;
box-shadow: 1px 1px 4px rgba(0,0,0,0.2);
box-shadow: 1px 1px 4px $shadow;
}
@ -275,6 +237,6 @@
background: $shade-color;
z-index: 5;
}
.component-shade {
.red-ui-shade {
@include shade
}

38
packages/node_modules/@node-red/editor-client/src/sass/notifications.scss vendored
View File

@ -14,7 +14,7 @@
* limitations under the License.
**/
#notifications {
#red-ui-notifications {
z-index: 100;
width: 500px;
margin-left: -250px;
@ -22,45 +22,45 @@
position: absolute;
top: 1px;
}
.notification {
.red-ui-notification {
box-sizing: border-box;
position: relative;
padding: 14px 18px;
margin-bottom: 4px;
box-shadow: 0 1px 1px 1px rgba(0,0,0, 0.15);
background-color: #fff;
color: #666;
border: 1px solid #325C80;
box-shadow: 0 1px 1px 1px $shadow;
background-color: $secondary-background;
color: $primary-text-color;
border: 1px solid $notification-border-default;
border-left-width: 16px;
overflow: hidden;
}
.notification p:first-child {
.red-ui-notification p:first-child {
font-size: 1.1em;
font-weight: 400;
}
.notification a {
.red-ui-notification a {
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
.notification-success {
border-color: #4B8400;
.red-ui-notification-success {
border-color: $notification-border-success;
}
.notification-warning {
border-color: #D74108;
.red-ui-notification-warning {
border-color: $notification-border-warning;
}
.notification-error {
border-color: #AD1625;
.red-ui-notification-error {
border-color: $notification-border-error;
}
.notification-shake-horizontal {
-webkit-animation: notification-shake-horizontal 0.3s steps(2, end) both;
animation: notification-shake-horizontal 0.3s steps(2, end) both;
.red-ui-notification-shake-horizontal {
-webkit-animation: red-ui-notification-shake-horizontal 0.3s steps(2, end) both;
animation: red-ui-notification-shake-horizontal 0.3s steps(2, end) both;
}
@-webkit-keyframes notification-shake-horizontal {
@-webkit-keyframes red-ui-notification-shake-horizontal {
0%,
100% {
-webkit-transform: translateX(0);
@ -88,7 +88,7 @@
// transform: translateX(-1px);
// }
}
@keyframes notification-shake-horizontal {
@keyframes red-ui-notification-shake-horizontal {
0%,
100% {
-webkit-transform: translateX(0);

122
packages/node_modules/@node-red/editor-client/src/sass/palette-editor.scss vendored
View File

@ -14,11 +14,11 @@
* limitations under the License.
**/
#user-settings-tab-palette {
#red-ui-settings-tab-palette {
height: 100%;
}
#palette-editor {
#red-ui-palette-editor {
text-align: left;
position: absolute;
top: 0px;
@ -27,7 +27,7 @@
left:0;
padding: 0;
box-sizing:border-box;
background: #fff;
background: $secondary-background;
.red-ui-editableList-container {
border: none;
@ -39,21 +39,25 @@
// border: none;
// border-top: 1px solid $primary-border-color;
padding: 0px;
.disabled {
background: #f3f3f3;
.red-ui-button {
min-width: 60px;
}
.palette-module-name {
.disabled {
// background: $secondary-background-inactive;//f3f3f3;
.red-ui-palette-module-name {
font-style: italic;
color: #aaa;
color: $tertiary-text-color;
}
.palette-module-version {
color: #aaa;
.red-ui-palette-module-version {
color: $tertiary-text-color;
}
.palette-module-errors .fa-warning {
.red-ui-palette-module-errors .fa-warning {
opacity: 0.5;
}
ul.palette-module-error-list li {
color: #aaa;
ul.red-ui-palette-module-error-list li {
color: $tertiary-text-color;
}
@ -67,65 +71,55 @@
}
}
.palette-editor-tab {
.red-ui-palette-editor-tab {
position:absolute;
top:35px;
left:0;
right:0;
bottom:0
}
.palette-editor-toolbar {
background: #f3f3f3;
.red-ui-palette-editor-toolbar {
background: $primary-background;
box-sizing: border-box;
padding: 8px 10px;
border-bottom: 1px solid $primary-border-color;
text-align: right;
}
.palette-module-shade-status {
color: #666;
.red-ui-palette-module-shade-status {
color: $secondary-text-color;
}
.palette-module-updated {
.red-ui-palette-module-updated {
margin-left: 10px;
}
.palette-module-link {
.red-ui-palette-module-link {
margin-left: 5px;
}
.palette-module-description {
.red-ui-palette-module-description {
margin-left: 20px;
font-size: 0.9em;
color: #999;
color: $secondary-text-color;
}
.palette-module-link {
.red-ui-palette-module-link {
}
.palette-module-set-button-group {
.red-ui-palette-module-set-button-group {
}
.palette-module-count {
border-radius: 4px;
background: #eee;
padding: 2px 8px;
font-size: 12px;
}
.palette-module-content {
.red-ui-palette-module-content {
display: none;
padding: 10px 3px;
}
i.fa.palette-module-node-chevron {
i.fa.red-ui-palette-module-node-chevron {
width: 8px;
margin-right: 0;
transform: rotate(0deg);
transition: transform 0.2s ease-in-out;
}
.expanded {
i.fa.palette-module-node-chevron {
i.fa.red-ui-palette-module-node-chevron {
transform: rotate(90deg);
}
.palette-module-set-button {
background:#f3f3f3 !important;
}
}
.palette-module-set {
.red-ui-palette-module-set {
border:1px solid $secondary-border-color;
border-radius: 0;
padding: 5px;
@ -143,35 +137,35 @@
}
}
.palette-module-type {
color: #666;
.red-ui-palette-module-type {
color: $secondary-text-color;
padding-left: 5px;
font-size: 0.9em;
@include enable-selection;
}
.palette-module-type-swatch {
.red-ui-palette-module-type-swatch {
display: inline-block;
width: 12px;
height: 12px;
border-radius: 3px;
vertical-align: middle;
margin-right: 5px;
background: #fff;
border: 1px solid #fff;
background: $primary-background;
border: 1px dashed $secondary-border-color;
}
.palette-module-set-button-group {
.red-ui-palette-module-set-button-group {
position: absolute;
right: 4px;
top: 4px;
}
.palette-module-set-disabled {
background: #eee;
.palette-module-type {
color: #999;
.red-ui-palette-module-set-disabled {
background: $list-item-background-disabled;
.red-ui-palette-module-type {
color: $secondary-text-color-disabled-active;
}
}
.palette-module-more {
.red-ui-palette-module-more {
padding: 0 !important;
margin-top: 10px;
margin-bottom: 10px;
@ -180,7 +174,7 @@
display: block;
text-align: center;
padding: 12px 8px;
color: #AD1625;
color: $text-color-warning;
&:hover {
text-decoration: none;
@ -190,11 +184,11 @@
}
}
.palette-module-meta {
color: #666;
.red-ui-palette-module-meta {
color: $secondary-text-color;
position: relative;
&.disabled {
color: #ccc;
color: $secondary-text-color-disabled;
}
.fa {
@ -203,23 +197,17 @@
margin-right: 5px;
}
}
.palette-module-name {
.red-ui-palette-module-name {
color: $primary-text-color;
white-space: nowrap;
@include enable-selection;
}
.palette-module-version, .palette-module-updated, .palette-module-link {
.red-ui-palette-module-version, .red-ui-palette-module-updated, .red-ui-palette-module-link {
font-style:italic;
font-size: 0.8em;
@include enable-selection;
}
.palette-module-section {
padding:0 !important;
background: #f9f9f9 !important;
font-size: 0.9em;
color: #666;
}
.palette-module-button-group {
.red-ui-palette-module-button-group {
position: absolute;
right: 0;
bottom: 0;
@ -227,10 +215,10 @@
margin-left: 5px;
}
}
.palette-module-meta .fa-warning {
color: #AD1625;
.red-ui-palette-module-meta .fa-warning {
color: $text-color-warning;
}
ul.palette-module-error-list {
ul.red-ui-palette-module-error-list {
display: inline-block;
list-style-type: none;
margin: 0;
@ -241,11 +229,11 @@ ul.palette-module-error-list {
}
}
.palette-module-shade {
.red-ui-palette-module-shade {
@include shade;
text-align: center;
padding-top: 20px;
}
#palette-module-install-shade {
#red-ui-palette-module-install-shade {
padding-top: 80px;
}

133
packages/node_modules/@node-red/editor-client/src/sass/palette.scss vendored
View File

@ -15,12 +15,12 @@
**/
#palette {
#red-ui-palette{
position: absolute;
top: 0px;
bottom: 0px;
left:0px;
background: #f3f3f3;
background: $primary-background;
width: 180px;
text-align: center;
@include disable-selection;
@ -28,30 +28,18 @@
transition: width 0.2s ease-in-out;
}
.palette-closed {
#palette { width: 8px; }
#palette-search { display: none; }
#palette-container { display: none; }
#palette-collapse-all { display: none; }
#palette-expand-all { display: none; }
}
.palette-expanded {
& #palette {
width: 380px;
box-shadow: 1px 0 6px rgba(0,0,0,0.1);
.red-ui-palette-closed {
#red-ui-palette {
width: 8px;
.red-ui-component-footer {
display: none;
}
}
& #workspace { left: 379px !important; }
& #palette-collapse-all { display: none; }
& #palette-expand-all { display: none; }
& #palette-container { display: none !important; }
& #palette-search { display: none !important; }
& #palette-edit { background: $workspace-button-background-active }
& #palette-editor { display: block !important }
#red-ui-palette-search { display: none; }
#red-ui-palette-container { display: none; }
}
.palette-scroll {
.red-ui-palette-scroll {
position: absolute;
top: 35px;
right: 0;
@ -61,13 +49,13 @@
overflow-y: auto;
box-sizing:border-box;
}
#palette > .palette-spinner {
#red-ui-palette> .red-ui-palette-spinner {
padding-top: 80px;
}
.palette-search {
.red-ui-palette-search {
position: relative;
overflow: hidden;
background: #ffffff;
background: $secondary-background;
text-align: center;
height: 35px;
padding: 3px;
@ -75,24 +63,18 @@
box-sizing:border-box;
}
#palette-footer {
@include component-footer;
.red-ui-palette-category {
border-bottom: 1px solid $secondary-border-color;
}
.palette-button {
@include component-footer-button;
}
.palette-category {
border-bottom: 1px solid #ccc;
}
.palette-content {
background: #fff;
.red-ui-palette-content {
background: $palette-content-background;
padding: 3px;
}
.palette-header {
.red-ui-palette-header {
position: relative;
background: $palette-header-background;
color: $palette-header-color;
cursor: pointer;
text-align: left;
padding: 9px;
@ -104,7 +86,7 @@
background: $palette-header-background !important;
}
}
.palette-header > i {
.red-ui-palette-header > i {
position: absolute;
left: 11px;
top: 12px;
@ -115,15 +97,16 @@
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
}
.palette-header i.expanded {
.red-ui-palette-header i.expanded {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
}
.palette-header span {
.red-ui-palette-header span {
clear: both;
}
.palette_label {
.red-ui-palette-label {
color: $node-label-color;
font-size: 13px;
margin: 4px 0 4px 32px;
line-height: 20px;
@ -131,66 +114,78 @@
text-align: center;
@include disable-selection;
}
.palette_label_right {
.red-ui-palette-label-right {
margin: 4px 32px 4px 0;
}
.palette_node {
display: block;
cursor:move;
background: #ddd;
margin: 10px auto;
.red-ui-palette-node {
display: inline-block;
cursor: move;
background: $secondary-background;
margin: 5px auto;
height: 25px;
border-radius: 5px;
border: 1px solid #999;
border: 1px solid $node-border;
background-position: 5% 50%;
background-repeat: no-repeat;
width: 120px;
background-size: contain;
position: relative;
&:first-child {
margin-top: 10px;
}
&:last-child {
margin-bottom: 10px;
}
}
.palette_node:hover {
.red-ui-palette-node:hover {
margin: 4px auto;
border-color: $node-selected-color;
background-color: #eee;
border-width: 2px;
&:first-child {
margin-top: 9px;
}
&:last-child {
margin-bottom: 9px;
}
}
.palette_port {
.red-ui-palette-port {
position: absolute;
top:8px;
left: -5px;
box-sizing: border-box;
-moz-box-sizing: border-box;
background:#d9d9d9;
background: $node-port-background;
border-radius: 3px;
width: 10px;
height: 10px;
border: 1px solid #999;
border: 1px solid $node-border;
}
.palette_port_output {
.red-ui-palette-port-output {
left:auto;
right: -6px;
}
.palette_node:hover .palette_port {
border-color: #999;
background-color: #eee;
.red-ui-palette-node:hover .red-ui-palette-port {
background-color: $node-port-background-hover;
}
.palette_icon_container {
.red-ui-palette-icon-container {
position: absolute;
text-align: center;
top:0;
bottom:0;
left:0;
width: 30px;
border-right: 1px solid rgba(0,0,0,0.1);
background-color: rgba(0,0,0,0.05);
border-right: 1px solid $node-icon-background-color;
background-color: $node-icon-background-color;
}
.palette_icon_container_right {
.red-ui-palette-icon-container-right {
left: auto;
right: 0;
border-right: none;
border-left: 1px solid rgba(0,0,0,0.1);
border-left: 1px solid $node-icon-background-color;
}
.palette_icon {
.red-ui-palette-icon {
display: inline-block;
width: 20px;
height: 100%;
@ -198,13 +193,13 @@
background-size: contain;
background-repeat: no-repeat;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
color: white;
position: absolute;
top: 7px;
left: 3px;
}
.palette_node_small {
.red-ui-palette-node-small {
display: inline-block;
position: relative;
width: 18px;
@ -213,15 +208,15 @@
vertical-align: middle;
cursor: default;
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
border-right: none;
}
.palette_icon {
.red-ui-palette-icon {
margin-left: -1px;
width: 15px;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 2px;
left: 1px;
}

2
packages/node_modules/@node-red/editor-client/src/sass/panels.scss vendored
View File

@ -30,7 +30,7 @@
height: 7px;
box-sizing: border-box;
cursor: ns-resize;
background: $background-color url(images/grip.png) no-repeat 50% 50%;
background: $primary-background url(images/grip.png) no-repeat 50% 50%;
}

36
packages/node_modules/@node-red/editor-client/src/sass/popover.scss vendored
View File

@ -25,6 +25,7 @@
color: $popover-color;
border-radius: 4px;
z-index: 1000;
font-family: $primary-font;
font-size: 14px;
line-height: 1.4em;
@include component-shadow;
@ -59,26 +60,26 @@
}
.red-ui-popover.red-ui-popover-right:after {
border-color: rgba(136, 183, 213, 0);
border-color: transparent;
border-right-color: $popover-background;
border-width: 10px;
margin-top: -10px;
}
.red-ui-popover.red-ui-popover-right:before {
border-color: rgba(194, 225, 245, 0);
border-color: transparent;
border-right-color: $popover-background;
border-width: 11px;
margin-top: -11px;
}
.red-ui-popover.red-ui-popover-left:after {
border-color: rgba(136, 183, 213, 0);
border-color: transparent;
border-left-color: $popover-background;
border-width: 10px;
margin-top: -10px;
}
.red-ui-popover.red-ui-popover-left:before {
border-color: rgba(194, 225, 245, 0);
border-color: transparent;
border-left-color: $popover-background;
border-width: 11px;
margin-top: -11px;
@ -86,26 +87,26 @@
.red-ui-popover.red-ui-popover-bottom:after {
border-color: rgba(136, 183, 213, 0);
border-color: transparent;
border-bottom-color: $popover-background;
border-width: 10px;
margin-left: -10px;
}
.red-ui-popover.red-ui-popover-bottom:before {
border-color: rgba(194, 225, 245, 0);
border-color: transparent;
border-bottom-color: $popover-background;
border-width: 11px;
margin-left: -11px;
}
.red-ui-popover.red-ui-popover-top:after {
border-color: rgba(136, 183, 213, 0);
border-color: transparent;
border-top-color: $popover-background;
border-width: 10px;
margin-left: -10px;
}
.red-ui-popover.red-ui-popover-top:before {
border-color: rgba(194, 225, 245, 0);
border-color: transparent;
border-top-color: $popover-background;
border-width: 11px;
margin-left: -11px;
@ -140,27 +141,24 @@
.red-ui-popover-key {
font-size: 11px;
font-family: monospace;
font-family: $monospace-font;
margin-left: 3px;
border: 1px solid #999;
border: 1px solid $popover-color;
border-radius:3px;
padding: 1px 2px;
}
.red-ui-popover .editor-button {
&:not(.primary) {
color: #444 !important;
border-color: rgba(0,0,0,0);
}
.red-ui-popover a.red-ui-button,
.red-ui-popover button.red-ui-button {
&.primary {
border-color: #bbb;
border-color: $popover-button-border-color;
}
&.primary:hover {
border-color: #666 !important;
&.primary:not(.disabled):not(.ui-button-disabled):hover {
border-color: $popover-button-border-color-hover;
}
}
.red-ui-popover code {
border: none;
background: none;
color: #ccc;
color: $tertiary-text-color;
}

548
packages/node_modules/@node-red/editor-client/src/sass/projects.scss vendored
View File

@ -14,28 +14,28 @@
* limitations under the License.
**/
#projects-dialog {
#red-ui-projects-dialog {
.red-ui-editableList-container {
padding: 0px;
}
}
#project-settings-tab-settings {
#red-ui-project-settings-tab-settings {
overflow-y: scroll;
}
.sidebar-version-control-shade {
background: #f3f3f3;
.red-ui-sidebar-vc-shade {
background: $primary-background;
}
.projects-edit-form form {
.red-ui-projects-edit-form form {
margin: 0;
.form-row {
margin-bottom: 15px;
label {
color: #555;
color: $primary-text-color;
width: 100%;
display: block;
&.projects-edit-form-inline-label {
&.red-ui-projects-edit-form-inline-label {
font-weight: normal;
color: inherit;
width: auto;
@ -46,87 +46,34 @@
}
input[type=checkbox], input[type=radio] {
width: auto;
vertical-align: top;
vertical-align: middle;
}
}
}
.projects-edit-form-sublabel {
color: #999;
.red-ui-projects-edit-form-sublabel {
color: $tertiary-text-color;
text-align: right;
margin-bottom: -15px;
font-weight: normal;
}
.project-settings-tab-pane {
& * .projects-edit-form-sublabel {
.red-ui-project-settings-tab-pane {
& * .red-ui-projects-edit-form-sublabel {
margin-right: 50px;
margin-top: -10px !important;
margin-bottom: 5px;
}
}
.projects-dialog-spinner {
position: absolute;
top: 1px;
bottom: 1px;
left: 1px;
right: 1px;
text-align: center;
padding: 40px;
background: white;
&:before {
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -0.25em;
}
img {
display: inline-block;
vertical-align: middle;
width: 80px;
}
&.projects-dialog-spinner-sidebar {
background: white;
padding:0;
img {
width: 40px;
}
}
&.projects-version-control-spinner-sidebar {
background: white;
padding:0;
img {
width: 20px;
}
}
&.projects-dialog-spinner-contain {
padding: 0;
img {
width: auto;
height: 100%;
max-height: 50px;
}
}
}
.projects-dialog-screen-start {
.projects-dialog-screen-start-hero {
// background: url(https://nodered.org/images/title-wave.png) no-repeat 0% 100% #8f0000;
// background-size: contain;
.red-ui-projects-dialog-screen-start {
.red-ui-projects-dialog-screen-start-hero {
text-align: center;
font-size: 2em;
padding: 10px;
min-height: 60px;
color: #555;
h1 {
text-align: center;
color: #f0f0f0;
font-size: 2em;
font-weight: normal;
}
color: $primary-text-color;
}
.projects-dialog-screen-start-body {
.red-ui-projects-dialog-screen-start-body {
min-height: 400px;
line-height: 1.6em;
p {
@ -138,27 +85,20 @@
font-size: 1.2em;
}
}
button.editor-button {
button.red-ui-button {
width: calc(50% - 80px);
margin: 20px;
height: auto;
line-height: 2em;
padding: 10px;
border-color: #aaa;
i {
color: #aaa;
}
&:hover i {
color: #999;
}
}
.button-group {
text-align: center;
}
}
.projects-dialog-screen-create {
.red-ui-projects-dialog-screen-create {
min-height: 500px;
button.projects-dialog-screen-create-type {
button.red-ui-projects-dialog-screen-create-type {
height: auto;
padding: 10px;
}
@ -167,14 +107,70 @@
}
}
.projects-dialog-screen-secret {
.red-ui-projects-dialog-screen-secret {
min-height: auto;
}
.projects-dialog-project-list-container {
.red-ui-projects-dialog-credentials-box {
width: 550px;
> div {
vertical-align: top;
display: inline-block;
}
}
.red-ui-projects-dialog-credentials-box-right {
min-height:150px;
box-sizing: border-box;
float: right;
width: 331px;
margin-left: -1px;
padding: 15px;
margin-top: -15px;
border: 1px solid $secondary-border-color;
border-radius: 3px;
}
.red-ui-projects-dialog-credentials-box-left {
width: 220px;
> div {
padding: 7px 8px 3px 8px;
border: 1px solid $secondary-border-color;
border-radius: 4px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right-color: $form-background;
&.disabled {
border-color: $form-background;
border-right-color:$secondary-border-color;
}
i {
font-size: 1.4em;
margin-right: 8px;
vertical-align: middle;
}
label.red-ui-projects-edit-form-inline-label {
margin-left: 5px;
span {
vertical-align: middle;
}
}
input[type="radio"] {
vertical-align: middle;
margin-top:0;
margin-right: 10px;
}
}
}
.red-ui-projects-dialog-credentials-box-enabled {
}
.red-ui-projects-dialog-credentials-box-disabled {
}
.red-ui-projects-dialog-project-list-container {
border: 1px solid $secondary-border-color;
border-radius: 2px;
}
.projects-dialog-project-list-inner-container {
.red-ui-projects-dialog-project-list-inner-container {
height: 300px;
overflow-y: scroll;
position:relative;
@ -182,100 +178,100 @@
border: none;
}
}
.projects-dialog-project-list {
.red-ui-projects-dialog-project-list {
li {
padding: 0 !important;
}
}
.projects-dialog-project-list-entry {
.red-ui-projects-dialog-project-list-entry {
padding: 12px 0;
border-left: 3px solid #fff;
border-right: 3px solid #fff;
color: $list-item-color;
background: $list-item-background;
border-left: 3px solid $list-item-background;
border-right: 3px solid $list-item-background;
&.projects-list-entry-current {
&:not(.selectable) {
background: #f9f9f9;
color: $form-text-color;
background: $list-item-background-selected;
border-left-color:$list-item-border-selected;
border-right-color:$list-item-border-selected;
}
i {
color: #999;
color: $secondary-text-color;
}
}
&.selectable {
cursor: pointer;
&:hover {
background: #f3f3f3;
// border-left-color: #aaa;
// border-right-color: #aaa;
&:hover:not(.selected) {
color: $form-text-color;
background: $list-item-background-hover;
border-left-color:$list-item-background-hover;
border-right-color:$list-item-background-hover;
}
}
.projects-dialog-project-list-entry-icon {
.red-ui-projects-dialog-project-list-entry-icon {
i {
color: #ccc;
color: $tertiary-text-color;
font-size: 2em;
}
}
&.selected {
background: #efefef;
border-left-color:#999;
border-right-color:#999;
color: $form-text-color;
background: $list-item-background-selected;
border-left-color:$list-item-border-selected;
border-right-color:$list-item-border-selected;
}
span {
display: inline-block;
vertical-align:middle;
}
.projects-dialog-project-list-entry-icon {
.red-ui-projects-dialog-project-list-entry-icon {
margin: 0 10px 0 5px;
}
.projects-dialog-project-list-entry-name {
.red-ui-projects-dialog-project-list-entry-name {
font-size: 1.2em;
}
.projects-dialog-project-list-entry-current {
.red-ui-projects-dialog-project-list-entry-current {
float: right;
margin-right: 20px;
font-size: 0.9em;
color: #999;
color: $secondary-text-color;
padding-top: 4px;
}
.projects-dialog-project-list-entry-tools {
.red-ui-projects-dialog-project-list-entry-tools {
position: absolute;
top: 16px;
right: 30px;
display: none;
color: #999;
color: $secondary-text-color;
}
&:hover {
.projects-dialog-project-list-entry-tools {
.red-ui-projects-dialog-project-list-entry-tools {
display: block;
}
}
}
.projects-dialog-screen-create-type.editor-button.toggle.selected:not(.disabled):not(:disabled) {
background: #fff !important;
color: #666 !important;
.red-ui-projects-dialog-screen-create-type.red-ui-button.toggle.selected:not(.disabled):not(:disabled) {
color: $secondary-text-color-active !important;
}
.projects-dialog-screen-input-status {
.red-ui-projects-dialog-screen-input-status {
text-align: right;
position: absolute;
top: 2px;
right: 8px;
width: 70px;
height: 30px;
color: #999;
color: $secondary-text-color;
}
.sidebar-version-control {
.red-ui-sidebar-vc {
height: 100%;
}
.sidebar-version-control-stack-info {
height: 100px;
box-sizing: border-box;
border-bottom: 1px solid $secondary-border-color;
color: #333;
i {
color: #999;
}
}
.sidebar-version-control-stack {
.red-ui-sidebar-vc-stack {
position: absolute;
top: 0px;
bottom: 0;
@ -283,14 +279,14 @@
right: 0;
overflow: hidden;
.palette-category {
&:not(.palette-category-expanded) button {
.red-ui-palette-category {
&:not(.expanded) button {
display: none;
}
}
}
#project-settings-tab-deps {
#red-ui-project-settings-tab-deps {
.red-ui-editableList-container {
padding: 0;
}
@ -300,33 +296,31 @@
.red-ui-editableList-item-content {
padding: 0px 6px;
}
.palette-module-header {
.red-ui-palette-module-header {
padding: 6px 4px;
}
.palette-module-button {
.red-ui-palette-module-button {
float: right;
}
.palette-module-unused {
.red-ui-palette-module-unused {
& > * {
color: #bbb;
color: $secondary-text-color;
}
// border: 1px dashed #bbb;
}
.palette-module-unknown {
border: 1px dashed #aaa;
background: #fafafa;
.red-ui-palette-module-unknown {
border: 1px dashed $secondary-border-color;
background: $secondary-background-inactive;
}
.palette-module-not-installed {
border: 1px dashed #b07575;
background: #fee;
.red-ui-palette-module-not-installed {
border: 1px dashed $text-color-warning;
i.fa-warning {
color: #b07575; //#b72828;
color: $text-color-warning;
}
}
}
.project-settings-tab-pane {
.red-ui-project-settings-tab-pane {
position: absolute;
top:0;
left:0;
@ -335,13 +329,13 @@
overflow-y: auto;
padding: 8px 20px 20px;
}
.sidebar-version-control {
.red-ui-sidebar-vc {
.red-ui-editableList-container {
background: #f9f9f9;
background: $tertiary-background;
padding: 0;
li {
padding:0;
background: #fff;
background: $secondary-background;
}
}
.red-ui-editableList-border {
@ -350,7 +344,7 @@
}
}
.sidebar-version-control-change-container {
.red-ui-sidebar-vc-change-container {
position: relative;
height: 50%;
box-sizing: border-box;
@ -359,22 +353,22 @@
// border-bottom: 1px solid $primary-border-color;
}
}
.sidebar-version-control-merging {
.sidebar-version-control-change-container {
.red-ui-sidebar-vc-merging {
.red-ui-sidebar-vc-change-container {
height: 33%;
}
}
.sidebar-version-control-slide-box {
.red-ui-sidebar-vc-slide-box {
position:absolute;
bottom: 0;
left:0;
right:0;
height:0;
transition: height 0.2s ease-in-out;
background: #f6f6f6;
background: $tertiary-background;
box-sizing: border-box;
overflow: hidden;
&.sidebar-version-control-slide-box-top {
&.red-ui-sidebar-vc-slide-box-top {
z-index: 4;
top: 0px;
left: auto;
@ -383,15 +377,15 @@
border-left: 1px solid $primary-border-color;
border-right: 1px solid $primary-border-color;
border-bottom: 1px solid $primary-border-color;
box-shadow: 1px 1px 4px rgba(0,0,0,0.2);
box-shadow: 1px 1px 4px $shadow;
color: #666;
background: #f6f6f6;
color: $primary-text-color;
background: $tertiary-background;
padding: 10px;
box-sizing: border-box;
}
&.sidebar-version-control-slide-box-bottom {
&.red-ui-sidebar-vc-slide-box-bottom {
bottom: 0px;
border-top: 1px solid $secondary-border-color;
}
@ -406,7 +400,7 @@
}
}
.projects-branch-list {
.red-ui-projects-branch-list {
position: relative;
.red-ui-searchBox-container {
border-top: 1px solid $secondary-border-color;
@ -428,12 +422,12 @@
padding: 0;
li {
padding: 0;
background: #fff;
background: $secondary-background;
}
}
}
}
.uneditable-input .projects-branch-list {
.uneditable-input .red-ui-projects-branch-list {
.red-ui-editableList {
border-left: none;
border-bottom: none;
@ -444,33 +438,34 @@
border-right: none;
}
}
.sidebar-version-control-slide-box-header {
.red-ui-sidebar-vc-slide-box-header {
margin-bottom: 10px;
}
.sidebar-version-control-slide-box-toolbar {
.red-ui-sidebar-vc-slide-box-toolbar {
padding: 0 20px;
text-align: right;
}
.sidebar-version-control-branch-list-entry {
.red-ui-sidebar-vc-branch-list-entry {
padding: 5px 8px;
color: #666;
margin: 0 1px;
color: $list-item-color;
background: $list-item-background;
border-left: 2px solid $list-item-background;
border-right: 2px solid $list-item-background;
cursor: pointer;
&.selected {
border-left-color:#999;
border-right-color:#999;
border-left-color:$list-item-border-selected;
border-right-color:$list-item-border-selected;
}
border-left: 2px solid #fff;
border-right: 2px solid #fff;
margin: 0 1px;
i { width: 16px; text-align: center}
&.input-error {
cursor: default;
}
&:not(.input-error):hover {
background: #f3f3f3;
border-left-color:#999;
border-right-color:#999;
background: $list-item-background-hover;
border-left-color:$list-item-border-selected;
border-right-color:$list-item-border-selected;
}
span {
margin-left: 5px;
@ -478,11 +473,11 @@
span.current {
float: right;
font-size: 0.8em;
color: #999;
color: $tertiary-text-color;
}
}
.sidebar-version-control-change-entry {
.red-ui-sidebar-vc-change-entry {
height: 20px;
padding: 5px 10px;
position: relative;
@ -496,7 +491,7 @@
pointer-events: none;
}
}
.sidebar-version-control-change-entry-tools {
.red-ui-sidebar-vc-change-entry-tools {
position: absolute;
top: 4px;
right: 4px;
@ -507,19 +502,19 @@
}
&:hover {
.sidebar-version-control-change-entry-tools {
.red-ui-sidebar-vc-change-entry-tools {
display: block;
}
}
&.node-info-none {
&.red-ui-help-info-node {
text-align: center;
background: #fefefe;
background: $list-item-background;
white-space: normal;
height: auto;
}
}
.sidebar-version-control-commit-entry {
.red-ui-sidebar-vc-commit-entry {
min-height: 20px;
padding: 5px 10px;
position: relative;
@ -527,51 +522,51 @@
overflow: hidden;
cursor: pointer;
&:hover {
background: #eee;
background: $secondary-background-hover;
}
}
.sidebar-version-control-commit-more {
color: #999;
.red-ui-sidebar-vc-commit-more {
color: $secondary-text-color;
text-align: center;
padding: 10px;
font-style: italic;
}
.sidebar-version-control-commit-sha {
.red-ui-sidebar-vc-commit-sha {
float: right;
font-family: monospace;
color: #c38888;
font-family: $monospace-font;
color: $vcCommitShaColor;
display: inline-block;
font-size: 0.85em;
margin-left: 5px;
}
.sidebar-version-control-commit-subject {
color: #666;
.red-ui-sidebar-vc-commit-subject {
color: $primary-text-color;
}
.sidebar-version-control-commit-refs {
.red-ui-sidebar-vc-commit-refs {
min-height: 22px;
}
.sidebar-version-control-commit-ref {
color: #aaa;
.red-ui-sidebar-vc-commit-ref {
color: $tertiary-text-color;
font-size: 0.7em;
border: 1px solid #ccc;
border: 1px solid $tertiary-border-color;
border-radius: 10px;
padding: 2px 5px;
margin-right: 5px;
}
.sidebar-version-control-commit-date {
color: #999;
.red-ui-sidebar-vc-commit-date {
color: $secondary-text-color;
font-size: 0.85em;
}
.sidebar-version-control-commit-user {
.red-ui-sidebar-vc-commit-user {
float: right;
color: #999;
color: $secondary-text-color;
font-size: 0.85em;
}
.sidebar-version-control-commit-head {
.red-ui-sidebar-vc-commit-head {
}
.sidebar-version-control-change-header {
color: #666;
background: #f6f6f6;
.red-ui-sidebar-vc-change-header {
color: $primary-text-color;
background: $tertiary-background;
padding: 4px 10px;
height: 30px;
box-sizing: border-box;
@ -581,22 +576,22 @@
transition: all 0.2s ease-in-out;
}
}
.sidebar-version-control-repo-toolbar {
color: #666;
background: #f6f6f6;
.red-ui-sidebar-vc-repo-toolbar {
color: $primary-text-color;
background: $tertiary-background;
padding: 10px;
box-sizing: border-box;
}
.sidebar-version-control-repo-count {
.red-ui-sidebar-vc-repo-count {
margin-right: 8px;
display: none;
}
.sidebar-version-control-repo-action {
.red-ui-sidebar-vc-repo-action {
text-align: left;
width: 100%;
}
.sidebar-version-control-repo-sub-action {
.red-ui-sidebar-vc-repo-sub-action {
width: calc(50% - 5px);
margin-right: 5px;
&:not(:first-child) {
@ -605,13 +600,13 @@
}
}
.project-file-listing-container > .red-ui-editableList > .red-ui-editableList-border {
.red-ui-projects-file-listing-container > .red-ui-editableList > .red-ui-editableList-border {
border-radius: 0;
border: none;
border-top: 1px solid $secondary-border-color;
}
.red-ui-editableList-container .projects-dialog-file-list {
.red-ui-editableList-container .red-ui-projects-dialog-file-list {
.red-ui-editableList-border {
border: none;
}
@ -623,66 +618,68 @@
padding: 0;
}
}
.projects-dialog-file-list-entry {
.red-ui-projects-dialog-file-list-entry {
padding: 3px 0;
border-left: 2px solid #fff;
border-right: 2px solid #fff;
border-left: 2px solid $list-item-background;
border-right: 2px solid $list-item-background;
background: $list-item-background;
&.projects-list-entry-current {
&:not(.selectable) {
background: #f9f9f9;
background: $list-item-background-selected;
}
i {
color: #999;
color: $secondary-text-color-selected;
}
}
&.selectable {
cursor: pointer;
&:hover {
background: #f3f3f3;
border-left-color:#999;
border-right-color:#999;
background: $list-item-background-hover;
border-left-color:$list-item-border-selected;
border-right-color:$list-item-border-selected;
}
}
&.unselectable {
color: #ccc;
color: $secondary-text-color-disabled;
}
i {
color: #999;
color: $secondary-text-color;
width: 16px;
text-align: center;
}
&.selected {
background: #efefef;
border-left-color:#999;
border-right-color:#999;
background: $list-item-background-selected;
border-left-color:$list-item-border-selected;
border-right-color:$list-item-border-selected;
}
span {
display: inline-block;
vertical-align:middle;
}
.projects-dialog-file-list-entry-folder {
.red-ui-projects-dialog-file-list-entry-folder {
margin: 0 10px 0 0px;
.fa-angle-right {
color: #333;
color: $primary-text-color;
transition: all 0.2s ease-in-out;
}
}
.projects-dialog-file-list-entry-file {
.red-ui-projects-dialog-file-list-entry-file {
margin: 0 10px 0 20px;
}
.projects-dialog-file-list-entry-name {
.red-ui-projects-dialog-file-list-entry-name {
font-size: 1em;
}
&.expanded .fa-angle-right {
transform: rotate(90deg);
}
}
.projects-dialog-file-list-entry-file-type-git { color: #999 }
.red-ui-projects-dialog-file-list-entry-file-type-git { color: $tertiary-text-color }
.projects-dialog-remote-list {
.red-ui-projects-dialog-remote-list {
.red-ui-editableList-container {
padding: 0;
li {
@ -694,87 +691,7 @@
}
}
.projects-dialog-sshkey-list {
li {
padding: 0 !important;
}
&.projects-dialog-sshkey-list-small {
.projects-dialog-sshkey-list-entry {
padding: 6px 0;
i {
font-size: 1em;
}
}
.projects-dialog-sshkey-list-entry-name {
font-size: 1em;
}
.projects-dialog-sshkey-list-entry-current {
margin-right: 10px;
padding-top: 2px;
}
}
}
.red-ui-editableList-container {
.projects-dialog-sshkey-list {
li:last-child {
border-bottom: 0px none;
}
}
}
.projects-dialog-sshkey-list-entry {
padding: 12px 0;
border-left: 3px solid #fff;
border-right: 3px solid #fff;
&.sshkey-list-entry-current {
&:not(.selectable) {
background: #f9f9f9;
}
i {
color: #999;
}
}
&.selectable {
cursor: pointer;
&:hover {
background: #f3f3f3;
border-left-color: #aaa;
border-right-color: #aaa;
}
}
i {
color: #ccc;
font-size: 2em;
}
&.selected {
background: #efefef;
border-left-color:#999;
border-right-color:#999;
}
span {
display: inline-block;
vertical-align:middle;
}
.projects-dialog-sshkey-list-entry-icon {
margin: 0 10px 0 5px;
}
.projects-dialog-sshkey-list-entry-name {
font-size: 1.2em;
}
.projects-dialog-sshkey-list-entry-current {
float: right;
margin-right: 20px;
font-size: 0.9em;
color: #999;
padding-top: 4px;
}
.projects-dialog-sshkey-list-button-remove {
position: absolute;
right: 4px;
}
}
div.projects-dialog-ssh-public-key {
div.red-ui-projects-dialog-ssh-public-key {
position: relative;
padding: 15px 20px 0;
pre {
@ -788,31 +705,31 @@ div.projects-dialog-ssh-public-key {
}
}
.projects-dialog-ssh-key-list {
.red-ui-projects-dialog-ssh-key-list {
li {
padding: 0 !important;
}
.projects-dialog-ssh-key-header {
.red-ui-projects-dialog-ssh-key-header {
padding: 10px 5px;
cursor: pointer;
&:hover {
background: #f3f3f3;
background: $list-item-background-hover;
}
}
}
.projects-dialog-list {
.red-ui-projects-dialog-list {
position: relative;
.red-ui-editableList-container {
padding: 1px;
background: #f6f6f6;
background: $tertiary-background;
li:last-child {
border-bottom: none;
}
}
}
.projects-dialog-list-entry {
.red-ui-projects-dialog-list-entry {
&.red-ui-search-empty {
padding: 0;
}
@ -824,7 +741,7 @@ div.projects-dialog-ssh-public-key {
text-align: center;
min-width: 30px;
vertical-align: top;
color: #999;
color: $secondary-text-color;
}
.entry-name {
min-width: 250px;
@ -833,7 +750,7 @@ div.projects-dialog-ssh-public-key {
font-weight: bold;
}
.entry-detail {
color: #aaa;
color: $tertiary-text-color;
font-size: 0.9em;
}
@ -847,14 +764,14 @@ div.projects-dialog-ssh-public-key {
margin-right: 10px;
}
}
.projects-dialog-list-dialog {
.red-ui-projects-dialog-list-dialog {
position: relative;
margin-top: 10px;
margin-bottom: 20px;
background: white;
background: $secondary-background;
border-radius: 4px;
border: 1px solid $secondary-border-color;
.projects-edit-form-sublabel {
.red-ui-projects-edit-form-sublabel {
margin-top: -8px !important;
display: block !important;
width: auto !important;
@ -865,11 +782,18 @@ div.projects-dialog-ssh-public-key {
clear: both;
}
.projects-dialog-list-dialog-header {
.red-ui-projects-dialog-list-dialog-header {
font-weight: bold;
background: #f3f3f3;
background: $primary-background;
margin-top: 0 !important;
padding: 5px 10px;
margin-bottom: 10px;
}
}
#red-ui-settings-tab-gitconfig {
padding: 8px 20px 20px;
}
.red-ui-settings-section-description {
color: $secondary-text-color;
}

78
packages/node_modules/@node-red/editor-client/src/sass/search.scss vendored
View File

@ -19,22 +19,13 @@
display: none;
position: absolute;
width: 500px;
background: white;
left: 50%;
margin-left: -250px;
top: 0px;
border: 1px solid $primary-border-color;
box-shadow: 0 0 10px rgba(0,0,0,0.4);
box-shadow: 0 0 10px $shadow;
}
ol {
}
}
.red-ui-type-search-shade {
@include shade;
z-index: 20;
position: fixed;
background: rgba(255,255,255,0.05);
}
.red-ui-type-search {
box-shadow: 0 1px 6px -3px black;
background: none;
@ -45,7 +36,7 @@
.red-ui-search-container {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border: 1px dashed #aaa;
border: 1px dashed $primary-border-color;
border-bottom: none;
padding: 0;
}
@ -53,8 +44,8 @@
display: none;
height: 150px;
.red-ui-editableList-container {
border: 1px dashed #aaa;
border-top: 1px solid #ccc;
border: 1px dashed $primary-border-color;
border-top: 1px solid $secondary-border-color;
}
}
.red-ui-search-result {
@ -62,14 +53,14 @@
font-size: 13px;
border-left-width: 3px;
border-right-width: 3px;
.palette_icon_fa {
.red-ui-palette-icon-fa {
position: relative;
top: -2.5px;
left: 0px;
}
}
.red-ui-search-result-separator {
border-bottom: 3px solid #ddd;
border-bottom: 3px solid $secondary-border-color;
}
.red-ui-search-result-node {
position: relative;
@ -80,54 +71,49 @@
.red-ui-search-result-node-port {
position: absolute;
border-radius: 2px;
border: 1px solid #999;
border: 1px solid $node-border;;
width: 6px;
height: 7px;
top:4px;
left:-4px;
background: #eee;
background: $node-port-background;
box-sizing: border-box;
}
.red-ui-search-result-node-output{
left: 16px;
}
.palette_icon_container {
.red-ui-palette-icon-container {
width: 18px;
}
.palette_icon {
.red-ui-palette-icon {
width: 15px;
}
.red-ui-search-result-description {
margin-left:28px;
}
.red-ui-search-result-node-label {
color: #999;
color: $secondary-text-color;
}
}
.red-ui-search-container {
padding: 3px;
background: $form-input-background;
border-bottom: 1px solid $secondary-border-color;
}
.red-ui-search-results-container {
position:relative;
height: 300px;
padding: 5px;
background: #f9f9f9;
background: $primary-background;
.red-ui-search-results-list {
}
.red-ui-editableList-container {
background: white;
padding: 0;
background: #f9f9f9;
background: $primary-background;
li {
padding: 0;
&.selected {
background: #efefef;
.red-ui-search-result {
border-left-color:#999;
border-right-color:#999;
}
}
}
}
}
@ -135,22 +121,28 @@
padding: 8px 2px 8px 5px;
display: block;
cursor: pointer;
color: $form-text-color;
border-left: 3px solid #fff;
border-right: 3px solid #fff;
color: $list-item-color;
background: $list-item-background;
border-left: 3px solid $list-item-background;
border-right: 3px solid $list-item-background;
li.selected & {
background: $list-item-background-selected;
border-left-color: $list-item-border-selected;
border-right-color: $list-item-border-selected;
}
&:hover {
text-decoration: none;
color: $form-text-color;
background: #efefef;
border-left-color:#efefef;
border-right-color:#efefef;
background: $list-item-background-hover;
border-left-color:$list-item-background-hover;
border-right-color:$list-item-background-hover;
}
&:after {
content: "";
display: table;
clear: both;
}
.palette_icon_fa {
.red-ui-palette-icon-fa {
top: 6px;
left: 3px;
}
@ -161,15 +153,14 @@
width: 30px;
float:left;
height: 25px;
background: #ddd;
border-radius: 5px;
border: 1px solid #999;
border: 1px solid $node-border;
background-position: 5% 50%;
background-repeat: no-repeat;
background-size: contain;
position: relative;
.palette_icon_container {
.red-ui-palette-icon-container {
border-right: none;
}
@ -179,19 +170,22 @@
margin-right: 5px;
}
.red-ui-search-result-node-label {
color: #222;
color: $primary-text-color;
}
.red-ui-search-result-node-type {
font-style: italic;
font-size: 0.9em;
color: $tertiary-text-color;
}
.red-ui-search-result-node-flow {
float:right;
font-size: 0.8em;
color: $tertiary-text-color;
}
.red-ui-search-result-node-id {
display:none;
font-size: 0.8em;
color: $tertiary-text-color;
}
.red-ui-search-empty {
padding: 10px;

72
packages/node_modules/@node-red/editor-client/src/sass/sidebar.scss vendored
View File

@ -14,26 +14,25 @@
* limitations under the License.
**/
#sidebar {
#red-ui-sidebar {
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
width: 315px;
background: #fff;
background: $primary-background;
box-sizing: border-box;
z-index: 10;
@include component-border;
}
#sidebar.closing {
background: #eee;
border-color: #900;
#red-ui-sidebar.closing {
border-style: dashed;
}
#sidebar-content {
#red-ui-sidebar-content {
position: absolute;
background: $secondary-background;
top: 35px;
right: 0;
bottom: 25px;
@ -41,23 +40,23 @@
overflow-y: auto;
}
#sidebar-separator {
#red-ui-sidebar-separator {
position: absolute;
top: 5px;
right: 315px;
bottom:10px;
width: 7px;
z-index: 11;
background: $background-color url(images/grip.png) no-repeat 50% 50%;
background: $primary-background url(images/grip.png) no-repeat 50% 50%;
cursor: col-resize;
}
.sidebar-closed > #sidebar { display: none; }
.sidebar-closed > #sidebar-separator { right: 0px !important; }
.sidebar-closed > #workspace { right: 7px !important; }
.sidebar-closed > #editor-stack { right: 8px !important; }
.red-ui-sidebar-closed > #red-ui-sidebar { display: none; }
.red-ui-sidebar-closed > #red-ui-sidebar-separator { right: 0px !important; }
.red-ui-sidebar-closed > #red-ui-workspace { right: 7px !important; }
.red-ui-sidebar-closed > #red-ui-editor-stack { right: 8px !important; }
#sidebar .button {
#red-ui-sidebar .button {
@include workspace-button;
line-height: 18px;
font-size: 12px;
@ -65,67 +64,76 @@
padding: 2px 8px;
}
.sidebar-header {
color: #666;
.sidebar-header, /* Deprecated -> red-ui-sidebar-header */
.red-ui-sidebar-header {
color: $primary-text-color;
text-align: right;
padding: 8px 10px;
background: #f3f3f3;
background: $primary-background;
border-bottom: 1px solid $secondary-border-color;
white-space: nowrap;
}
#sidebar-footer {
@include component-footer;
}
/* Deprecated -> red-ui-footer-button */
.sidebar-footer-button {
@include component-footer-button;
}
/* Deprecated -> red-ui-footer-button-toggle */
.sidebar-footer-button-toggle {
@include component-footer-button-toggle;
}
.sidebar-header-button {
a.sidebar-header-button,
button.sidebar-header-button, /* Deprecated -> red-ui-sidebar-header-button */
a.red-ui-sidebar-header-button,
button.red-ui-sidebar-header-button {
@include workspace-button;
font-size: 13px;
line-height: 13px;
padding: 5px 8px;
}
.sidebar-header-button-toggle {
a.sidebar-header-button-toggle, /* Deprecated -> red-ui-sidebar-header-button-toggle */
button.sidebar-header-button-toggle, /* Deprecated -> red-ui-sidebar-header-button-toggle */
a.red-ui-sidebar-header-button-toggle,
button.red-ui-sidebar-header-button-toggle {
@include workspace-button-toggle;
font-size: 13px;
line-height: 13px;
padding: 5px 8px;
}
.sidebar-header-button:not(:first-child) {
.sidebar-header-button:not(:first-child), /* Deprecated -> red-ui-sidebar-header-button */
.red-ui-sidebar-header-button:not(:first-child) {
border-left: none;
}
.sidebar-shade {
.red-ui-sidebar-shade {
@include shade;
}
@mixin sidebar-control {
@mixin red-ui-sidebar-control {
display: none;
position: absolute;
top: calc(50% - 26px);
padding:15px 8px;
border:1px solid #ccc;
background:#f9f9f9;
color: #999;
border:1px solid $primary-border-color;
background:$primary-background;
color: $secondary-text-color;
text-align: center;
cursor: pointer;
}
.sidebar-control-right {
@include sidebar-control;
.red-ui-sidebar-control-right {
@include red-ui-sidebar-control;
right: calc(100%);
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.sidebar-control-left {
@include sidebar-control;
.red-ui-sidebar-control-left {
@include red-ui-sidebar-control;
left: calc(100%);
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;

114
packages/node_modules/@node-red/editor-client/src/sass/style.scss vendored
View File

@ -1,26 +1,26 @@
/**
* Copyright JS Foundation and other contributors, http://js.foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
**/
* Copyright JS Foundation and other contributors, http://js.foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
**/
@import "colors";
@import "mixins";
@import "base";
@import "forms";
@import "jquery";
@import "bootstrap";
@import "ace";
@import "dropdownMenu";
@ -65,87 +65,3 @@
@import "keyboard";
@import "debug";
body {
font-size: 14px;
font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
padding-top: 100px;
background: $background-color;
color: #333333;
}
#main-container {
position: absolute;
top:40px; left:0; bottom: 0; right:0;
overflow:hidden;
}
i.spinner {
display: inline-block;
width: 14px;
height: 14px;
line-height: 14px;
vertical-align: text-top;
margin-top: 0px;
background: url(images/spin.svg) no-repeat 50% 50%;
background-size: contain
}
code, pre {
padding: 0 3px 2px;
font-family: monospace;
font-size: 14px;
color: #333333;
border-radius: 1px;
}
code {
padding: 0px 3px 2px 3px;
margin: 1px;
color: #AD1625;
white-space: nowrap;
background-color: #f7f7f9;
border: 1px solid #e1e1e8;
border-radius: 2px;
}
pre {
display: block;
padding: 9.5px;
margin: 0 0 10px;
line-height: 20px;
word-break: break-all;
word-wrap: break-word;
white-space: pre;
white-space: pre-wrap;
background-color: #f5f5f5;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 2px;
}
pre code {
padding: 0;
color: inherit;
white-space: pre;
white-space: pre-wrap;
background-color: transparent;
border: 0;
}
.hide {
display: none;
}
blockquote {
padding: 0 0 0 15px;
margin: 0 0 20px;
border-left: 4px solid #ddd;
p {
font-size: 14px;
font-weight: inherit;
line-height: 1.25;
color: #777;
}
}

47
packages/node_modules/@node-red/editor-client/src/sass/tab-config.scss vendored
View File

@ -14,25 +14,26 @@
* limitations under the License.
**/
.sidebar-node-config {
.red-ui-sidebar-node-config {
position: relative;
background: #f3f3f3;
background: $secondary-background;
height: 100%;
overflow-y:auto;
@include disable-selection;
}
.config-node-list {
.red-ui-sidebar-node-config-list {
margin: 0;
list-style-type: none;
.palette_node {
.red-ui-palette-node {
overflow: hidden;
&.selected {
margin: 10px auto;
border-color: $node-selected-color;
background-color: #eee;
border-width: 2px;
}
}
.palette_label {
.red-ui-palette-label {
margin-left: 8px;
line-height: 24px;
text-align: left;
@ -40,10 +41,10 @@
overflow: hidden;
text-overflow: ellipsis;
}
.palette_icon_container {
.red-ui-palette-icon-container {
font-size: 12px;
line-height: 30px;
background-color: #e8e8e8;
background-color: $secondary-background-selected;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
a {
@ -52,41 +53,41 @@
bottom: 0;
left: 0;
right: 0;
color: #666;
color: $secondary-text-color;
&:hover {
text-decoration: none;
background: #ccc;
background: $secondary-background-hover;
}
}
}
}
.config_node {
.red-ui-palette-node-config {
width: 160px;
height: 30px;
background: #f3f3f3;
color: #666;
background: $primary-background;
color: $primary-text-color;
cursor: pointer;
}
.config_node_type {
color: #999;
.red-ui-palette-node-config-type {
color: $secondary-text-color;
text-align: right;
padding-right: 3px;
&:not(:first-child) {
margin-top: 20px;
}
}
.config_node_none {
color: #ddd;
.red-ui-palette-node-config-none {
color: $tertiary-text-color;
text-align:right;
padding-right: 3px;
}
.config_node_unused {
border-color: #aaa;
background: #f9f9f9;
.red-ui-palette-node-config-unused {
border-color: $primary-border-color;
background: $secondary-background-inactive;
border-style: dashed;
color: #aaa;
color: $tertiary-text-color;
}
.config-node-filter-info {
.red-ui-sidebar-node-config-filter-info {
position: absolute;
top: 0;
right:0;
@ -95,6 +96,6 @@
padding: 0 8px;
background: $palette-header-background;
font-size: 0.8em;
color: #999;
color: $secondary-text-color;
font-weight: normal;
}

20
packages/node_modules/@node-red/editor-client/src/sass/tab-context.scss vendored
View File

@ -14,7 +14,7 @@
* limitations under the License.
**/
.sidebar-context-stack {
.red-ui-sidebar-context-stack {
position: absolute;
top: 0;
bottom: 0;
@ -22,33 +22,33 @@
right: 0;
overflow-y: scroll;
.palette-category {
&:not(.palette-category-expanded) button {
.red-ui-palette-category {
&:not(.expanded) button {
display: none;
}
}
}
.sidebar-context-property {
.red-ui-sidebar-context-property {
position: relative;
.debug-message-tools {
.red-ui-debug-msg-tools {
right: 0px;
margin-right: 5px;
display: none;
}
&:hover .debug-message-tools {
&:hover .red-ui-debug-msg-tools {
display: inline-block;
}
}
.sidebar-context-updated {
.red-ui-sidebar-context-updated {
text-align: right;
font-size: 11px;
color: #bbb;
color: $tertiary-text-color;
padding: 1px 3px;
}
.sidebar-context-property-storename {
.red-ui-sidebar-context-property-storename {
display: block;
font-size: 0.8em;
font-style: italic;
color: #aaa;
color: $tertiary-text-color;
}

110
packages/node_modules/@node-red/editor-client/src/sass/tab-info.scss vendored
View File

@ -14,19 +14,19 @@
* limitations under the License.
**/
.sidebar-node-info hr {
.red-ui-sidebar-info hr {
margin: 10px 0;
}
table.node-info {
table.red-ui-info-table {
font-size: 14px;
margin: 0 0 10px;
width: 100%;
}
table.node-info tr:not(.blank) {
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
table.red-ui-info-table tr:not(.blank) {
border-top: 1px solid $secondary-border-color;
border-bottom: 1px solid $secondary-border-color;
}
.node-info-property-expand {
.red-ui-help-property-expand {
font-size: 0.8em;
text-align: right;
line-height: 0.9em;
@ -35,12 +35,12 @@ table.node-info tr:not(.blank) {
}
}
table.node-info tr.blank {
table.red-ui-info-table tr.blank {
border: none;
th {
text-align: left;
font-weight: 500;
color: #444;
color: $primary-text-color;
padding: 6px 3px 3px;
}
>* {
@ -52,16 +52,16 @@ table.node-info tr.blank {
a {
display: block;
color: #666;
color: $primary-text-color;
&:hover,&:focus {
color: #666;
color: $primary-text-color;
text-decoration: none;
}
&:not(.expanded) {
.node-info-property-show-more {
.red-ui-help-property-more {
display: inline;
}
.node-info-property-show-less {
.red-ui-help-property-less {
display: none;
}
}
@ -72,10 +72,10 @@ table.node-info tr.blank {
}
&.expanded {
.node-info-property-show-more {
.red-ui-help-property-more {
display: none;
}
.node-info-property-show-less {
.red-ui-help-property-less {
display: inline;
}
i {
@ -83,33 +83,43 @@ table.node-info tr.blank {
}
}
}
&.node-info-info-row > td {
padding-left: 5px;
}
}
.node-info-none {
.red-ui-help-info-none {
font-style: italic;
color: #aaa;
color: $tertiary-text-color;
}
table.node-info tr:not(.blank) td:first-child{
color: #444;
table.red-ui-info-table tr:not(.blank) td:first-child{
color: $header-text-color;
vertical-align: top;
width: 90px;
padding: 3px 3px 3px 6px;
background:#f9f9f9;
border-right: 1px solid #ddd;
background:$tertiary-background;
border-right: 1px solid $secondary-border-color;
}
table.node-info tr:not(.blank) td:last-child{
table.red-ui-info-table tr:not(.blank) td:last-child{
padding: 3px 3px 3px 6px;
color: #666;
color: $primary-text-color;
overflow-y: hidden;
}
div.node-info {
div.red-ui-info-table {
margin: 5px;
}
.node-help {
font-size: 14px;
.red-ui-help {
font-size: $primary-font-size;
line-height: 1.5em;
a {
color: $info-text-link-color;
text-decoration: none;
}
a:hover,
a:focus {
color: $info-text-link-color;
text-decoration: underline;
}
h1 {
font-weight: 500;
font-size: 1.296em;
@ -138,24 +148,24 @@ div.node-info {
& > span > p:first-child {
}
dl.message-properties {
border: 1px solid #ddd;
border: 1px solid $secondary-border-color;
border-radius: 2px;
margin: 5px auto 10px;
&>dt {
padding: 0px 3px 2px 3px;
font-family: monospace;
font-family: $monospace-font;
font-weight: normal;
margin: 5px 3px 1px;
color: #AD1625;
color: $text-color-warning;
white-space: nowrap;
&.optional {
font-style: italic;
}
.property-type {
font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
color: #666;
font-family: $primary-font;
color: $primary-text-color;
font-style: italic;
font-size: 11px;
float: right;
@ -174,7 +184,7 @@ div.node-info {
ol.node-ports {
margin: 0;
li {
border: 1px solid #ddd;
border: 1px solid $secondary-border-color;
border-radius: 2px;
list-style-position: inside;
padding: 3px;
@ -184,14 +194,14 @@ div.node-info {
}
}
}
.node-info-header {
.red-ui-help-info-header {
i {
width: 10px;
text-align: center;
transition: transform 0.2s ease-in-out;
margin-right: 4px;
}
color: #333;
color: $header-text-color;
&:hover, &:focus {
text-decoration: none;
}
@ -203,7 +213,7 @@ div.node-info {
}
}
.sidebar-node-info-stack {
.red-ui-sidebar-info-stack {
position: absolute;
top: 0;
bottom: 0;
@ -211,7 +221,7 @@ div.node-info {
right: 0;
overflow-y: scroll;
}
.node-info-tips {
.red-ui-help-tips {
display: none;
position: absolute;
left:0;
@ -220,21 +230,21 @@ div.node-info {
height: 150px;
box-sizing: border-box;
border-top: 1px solid $secondary-border-color;
background-color: #fff;
background-color: $secondary-background;
padding: 20px;
box-shadow: 0 5px 20px 0px rgba(0, 0, 0, 0.3);
box-shadow: 0 5px 20px 0px $shadow;
overflow-y: auto;
}
.sidebar-node-info.show-tips {
.sidebar-node-info-stack {
.red-ui-sidebar-info.show-tips {
.red-ui-sidebar-info-stack {
bottom: 150px;
}
.node-info-tips {
.red-ui-help-tips {
display: block;
}
}
.node-info-tips:before {
.red-ui-help-tips:before {
content: '';
display: inline-block;
height: 100%;
@ -242,30 +252,30 @@ div.node-info {
margin-right: -0.25em; /* Adjusts for spacing */
}
.node-info-tip {
.red-ui-help-tip {
display: inline-block;
vertical-align: middle;
width: 100%;
font-size: 16px;
text-align: center;
line-height: 1.9em;
color : #bbb;
color : $tertiary-text-color;
@include disable-selection;
cursor: default;
}
.node-info-tips-buttons {
.red-ui-help-tips-buttons {
position: absolute;
top: 4px;
right: 6px;
a {
color: #ddd !important;
border-color: #d9d9d9 !important;
color: $secondary-text-color;
border-color: $secondary-border-color !important;
margin-left: 4px;
}
}
.node-info-property-config-node {
border: 1px solid #eee;
border: 1px solid $secondary-border-color;
border-radius: 4px;
padding: 2px 4px 2px;
}

41
packages/node_modules/@node-red/editor-client/src/sass/tabs.scss vendored
View File

@ -16,7 +16,7 @@
.red-ui-tabs {
position: relative;
background: #fff;
background: $tab-background;
overflow: hidden;
height: 35px;
box-sizing: border-box;
@ -30,7 +30,6 @@
}
}
& ul {
//background: #9999ff;
list-style-type: none;
padding:0;
margin: 0;
@ -71,7 +70,7 @@
padding-left: 12px;
width: 100%;
height: 100%;
color: #666;
color: $tab-text-color-inactive;
}
a:hover {
text-decoration: none;
@ -86,14 +85,14 @@
&.active {
background: $tab-background-active;
font-weight: bold;
border-bottom: 1px solid #fff;
border-bottom: 1px solid $tab-background-active;
z-index: 2;
a {
color: #333;
color: $tab-text-color-active;
}
a.red-ui-tab-close {
color: #aaa;
color: $workspace-button-color;
background: $tab-background-active;
&:hover {
background: $workspace-button-background-hover !important;
@ -111,7 +110,7 @@
font-weight: bold;
.red-ui-tabs-badge-selected {
display: inline;
background: white;
background: $tab-background;
}
.red-ui-tabs-badge-changed {
display: none;
@ -159,7 +158,7 @@
height: 100%;
border-right: 1px solid $primary-border-color;
margin: 0;
background: #f3f3f3;
background: $tertiary-background;
overflow: visible;
.red-ui-tabs-scroll-container {
@ -181,10 +180,10 @@
border-right: 1px solid $primary-border-color;
height: auto;
&:not(:first-child) {
border-top: 1px solid $secondary-border-color;
border-top: 1px solid $secondary-border-color;
}
&:last-child {
border-bottom: 1px solid $secondary-border-color;
border-bottom: 1px solid $secondary-border-color;
}
a.red-ui-tab-label {
@ -192,7 +191,7 @@
}
&.active {
border-right: 1px solid #fff;
border-right: 1px solid $tab-background-active;
}
}
}
@ -213,7 +212,7 @@
top: 0;
right: 0;
height: 35px;
background: #fff;
background: $tab-background;
border-bottom: 1px solid $primary-border-color;
z-index: 2;
@ -235,7 +234,7 @@
top: 0;
right: 0;
height: 35px;
background: #fff;
background: $tab-background;
border-bottom: 1px solid $primary-border-color;
z-index: 2;
a {
@ -245,13 +244,8 @@
width: 28px;
margin: 4px 3px 3px;
z-index: 2;
&.red-ui-tab-link-button {
&:not(.active) {
// background: #eee;
}
}
&.red-ui-tab-link-button-menu {
border-color: white;
border-color: $tab-background;
}
}
}
@ -262,7 +256,7 @@
height: 35px;
width: 21px;
display: block;
color: $link-color;
color: $workspace-button-color;
font-size: 22px;
text-align: center;
margin:0;
@ -275,14 +269,12 @@
left:0;
a {
border-right: 1px solid $primary-border-color;
// box-shadow: 8px 0px 5px -2px rgba(0,0,0,0.1);
}
}
.red-ui-tab-scroll-right {
right: 0px;
a {
border-left: 1px solid $primary-border-color;
// box-shadow: -8px 0px 5px -2px rgba(0,0,0,0.1);
}
}
@ -324,7 +316,7 @@ i.red-ui-tab-icon {
line-height: 28px;
text-align: center;
padding:0px;
color: #aaa;
color: $tab-badge-color;
}
.red-ui-tabs-badges i {
@ -358,9 +350,10 @@ i.red-ui-tab-icon {
line-height: 28px;
text-align: center;
padding: 0px;
color: #aaa;
color: $workspace-button-color;
&:hover {
background: $workspace-button-background-hover !important;
color: $workspace-button-color-hover;
opacity: 1;
}
}

4
packages/node_modules/@node-red/editor-client/src/sass/ui/common/checkboxSet.scss vendored
View File

@ -16,7 +16,7 @@
.red-ui-checkboxSet {
width: 15px;
display: inline-block;
color: #888;
color: $secondary-text-color;
cursor: pointer;
input {
display:none;
@ -24,6 +24,6 @@
&.disabled {
pointer-events: none;
color: #ddd;
color: $secondary-text-color-disabled;
}
}

6
packages/node_modules/@node-red/editor-client/src/sass/ui/common/editableList.scss vendored
View File

@ -37,7 +37,7 @@
li {
box-sizing: border-box;
position: relative;
background: #fff;
background: $secondary-background;
margin:0;
padding:8px 0px;
border-bottom: 1px solid $secondary-border-color;
@ -47,7 +47,7 @@
top: 50%;
left: 2px;
margin-top: -7px;
color: #eee;
color: $tertiary-text-color;
cursor: move;
}
.red-ui-editableList-item-remove {
@ -68,7 +68,7 @@
margin-right: 28px;
}
&.red-ui-editableList-item-deleting {
background: #fee;
background: $secondary-background-inactive;
}
}

12
packages/node_modules/@node-red/editor-client/src/sass/ui/common/nodeList.scss vendored
View File

@ -21,9 +21,9 @@
margin: 0;
white-space: nowrap;
border: none;
background: #fefefe;
background: $secondary-background;
&:hover {
background: #f0f0f0;
background: $secondary-background-hover;
}
i.fa-angle-right {
@ -39,17 +39,17 @@
}
.meta {
float: right;
input[type="checkbox"] {
input[type="checkbox"].red-ui-treeList-checkbox {
margin: 0;
}
}
.red-ui-editableList-item-content.disabled {
color: #ccc;
color: $secondary-text-color-disabled;
}
&.red-ui-editableList-section-header {
background: #f0f0f0;
background: $primary-background;
.red-ui-editableList-item-content.disabled {
color: #bbb;
color: $secondary-text-color-disabled;
}
}

8
packages/node_modules/@node-red/editor-client/src/sass/ui/common/searchBox.scss vendored
View File

@ -19,7 +19,7 @@
position: relative;
i {
font-size: 10px;
color: #666;
color: $secondary-text-color;
}
i.fa-search {
position: absolute;
@ -32,7 +32,7 @@
right: 5px;
top: 9px;
}
input {
input.red-ui-searchBox-input {
border-radius: 0;
border: none;
width: 100%;
@ -61,8 +61,8 @@
position: absolute;
right: 18px;
top: 4px;
background: #eee;
color: #666;
background: $primary-background;
color: $secondary-text-color;
padding: 1px 8px;
font-size: 9px;
border-radius: 4px;

6
packages/node_modules/@node-red/editor-client/src/sass/ui/common/stack.scss vendored
View File

@ -15,9 +15,9 @@
**/
.red-ui-stack {
background: white;
.palette-category {
background: white;
background: $secondary-background;
.red-ui-palette-category {
background: $secondary-background;
&:last-child {
border-bottom: none;

4
packages/node_modules/@node-red/editor-client/src/sass/ui/common/treeList.scss vendored
View File

@ -24,7 +24,7 @@
width: 100%;
height: 100%;
position: relative;
background: #f9f9f9;
background: $tertiary-background;
border: 1px solid $form-input-border-color;
border-radius: 4px;
@ -94,7 +94,7 @@
color: $list-item-color;
}
input {
input.red-ui-treeList-checkbox {
margin: 0;
}
}

58
packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss vendored
View File

@ -25,7 +25,7 @@
box-sizing: border-box;
overflow:visible;
position: relative;
.red-ui-typedInput-input {
.red-ui-typedInput-input-wrap {
position: absolute;
left:0;
right:0;
@ -33,7 +33,7 @@
bottom:0;
outline: red;
}
input {
input.red-ui-typedInput-input {
width: 100%;
padding: 0 0 0 3px;
margin:0;
@ -43,14 +43,16 @@
border-bottom-left-radius: 0;
box-shadow: none;
vertical-align: middle;
// backgroun/d: #f0fff0;
}
&.red-ui-typedInput-focus:not(.input-error) {
border-color: $form-input-focus-color !important;
}
button {
button.red-ui-typedInput-type-select,
button.red-ui-typedInput-option-expand,
button.red-ui-typedInput-option-trigger
{
text-align: left;
border: none;
position: absolute;
@ -59,26 +61,20 @@
border-bottom-left-radius: 4px;
padding: 0 1px 0 5px;
display:inline-block;
background: $typedInput-button-background;
background: $form-button-background;
height: 32px;
line-height: 32px;
vertical-align: middle;
color: #555;
color: $form-text-color;
i.red-ui-typedInput-icon {
position: relative;
top: -3px;
margin-left: 1px;
margin-right: 2px;
margin-top: 1px;
vertical-align: middle;
&.fa-ellipsis-h {
top: -1px;
}
}
&.disabled {
cursor: default;
i.red-ui-typedInput-icon {
color: #bbb;
color: $secondary-text-color-disabled;
}
}
.red-ui-typedInput-type-label,.red-ui-typedInput-option-label {
@ -89,7 +85,7 @@
&:not(.disabled):hover {
text-decoration: none;
background: $typedInput-button-background-hover;
background: $workspace-button-background-hover;
}
&:focus {
text-decoration: none;
@ -97,7 +93,7 @@
box-shadow: inset 0 0 0 1px $form-input-focus-color;
}
&:not(.disabled):active {
background: $typedInput-button-background-active;
background: $workspace-button-background-active;
text-decoration: none;
}
&.red-ui-typedInput-full-width {
@ -105,6 +101,12 @@
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
&:before {
content:'';
display: inline-block;
height: 100%;
vertical-align: middle;
}
}
button.red-ui-typedInput-option-expand {
@ -124,7 +126,8 @@
position:absolute;
right: 0;
.red-ui-typedInput-option-label {
background:$typedInput-button-background;
background:$form-button-background;
color: $form-text-color;
position:absolute;
left:0;
right:23px;
@ -132,15 +135,21 @@
padding: 0 5px 0 8px;
i.red-ui-typedInput-icon {
margin-right: 4px;
margin-top: 4px;
}
}
.red-ui-typedInput-option-caret {
top: 0;
position: absolute;
right: 0;
bottom: 0;
width: 17px;
padding-left: 6px;
&:before {
content:'';
display: inline-block;
height: 100%;
vertical-align: middle;
}
}
&:focus {
box-shadow: none;
@ -152,27 +161,32 @@
}
.red-ui-typedInput-options {
@include component-shadow;
font-family: $primary-font;
font-size: $primary-font-size;
position: absolute;
max-height: 350px;
overflow-y: auto;
border: 1px solid $primary-border-color;
background: #fff;
background: $secondary-background;
z-index: 2000;
a {
padding: 6px 18px 6px 6px;
display: block;
border-bottom: 1px solid $secondary-border-color;
color: #333;
color: $form-text-color;
&:hover {
text-decoration: none;
background: $typedInput-button-background-hover;
background: $workspace-button-background-hover;
}
&:focus {
text-decoration: none;
background: $typedInput-button-background-active;
background: $workspace-button-background-active;
outline: none;
}
&:active {
text-decoration: none;
background: $typedInput-button-background-active;
background: $workspace-button-background-active;
}
}
.red-ui-typedInput-icon {

12
packages/node_modules/@node-red/editor-client/src/sass/userSettings.scss vendored
View File

@ -14,15 +14,15 @@
* limitations under the License.
**/
#user-settings-tabs-container {
.red-ui-settings-tabs-container {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 120px;
background: #f3f3f3;
background: $tertiary-background;
}
#user-settings-tabs-content {
.red-ui-settings-tabs-content {
position: absolute;
top: 0;
left: 120px;
@ -60,7 +60,7 @@
}
}
#user-settings-tab-view {
#red-ui-settings-tab-view {
position: absolute;
top:0;
right: 0;
@ -69,10 +69,10 @@
padding: 8px 20px 20px;
overflow-y: scroll;
}
.user-settings-row {
.red-ui-settings-row {
padding: 5px 10px 2px;
}
.user-settings-section {
.red-ui-settings-section {
position: relative;
&:after {
content: "";

139
packages/node_modules/@node-red/editor-client/src/sass/workspace.scss vendored
View File

@ -14,24 +14,7 @@
* limitations under the License.
**/
#chart {
overflow: auto;
background: #e3e3e3;
position: absolute;
bottom:25px;
top: 35px;
left:0px;
right:0px;
box-sizing:border-box;
transition: right 0.2s ease;
}
#chart:focus {
outline: none;
}
#workspace {
#red-ui-workspace {
position: absolute;
margin: 0;
top:0px;
@ -41,33 +24,55 @@
overflow: hidden;
@include component-border;
transition: left 0.1s ease-in-out;
}
.palette-closed #workspace {
#red-ui-workspace-chart {
overflow: auto;
position: absolute;
bottom:25px;
top: 35px;
left:0px;
right:0px;
box-sizing:border-box;
transition: right 0.2s ease;
&:focus {
outline: none;
}
}
.red-ui-workspace-chart-background {
fill: $view-background;
}
.red-ui-workspace-chart-grid line {
fill: none;
shape-rendering: crispEdges;
stroke: $view-grid-color;
stroke-width: 1px;
}
.red-ui-palette-closed #red-ui-workspace {
left: 7px;
}
.workspace-footer-button {
@include component-footer-button;
}
.workspace-footer-button-toggle {
@include component-footer-button-toggle;
}
#workspace-footer {
@include component-footer;
}
// .workspace-footer-button {
// @include component-footer-button;
// margin-left: 2px;
// margin-right: 2px;
// }
//
// .workspace-footer-button-toggle {
// @include component-footer-button-toggle;
// margin-left: 2px;
// margin-right: 2px;
// }
#workspace-tabs:not(.workspace-focussed) {
#red-ui-workspace-tabs:not(.red-ui-workspace-focussed) {
opacity:0.8;
li.red-ui-tab.active a {
color:#666;
}
}
.workspace-disabled-icon {
.red-ui-workspace-disabled-icon {
display: none;
}
.workspace-disabled {
.red-ui-workspace-disabled {
&.red-ui-tab {
border-top-style: dashed;
border-left-style: dashed;
@ -75,14 +80,72 @@
a {
font-style: italic;
color: #aaa !important;
color: $tab-text-color-disabled-inactive !important;
}
&.active a {
font-weight: normal;
color: #999 !important;
color: $tab-text-color-disabled-active !important;
}
.workspace-disabled-icon {
.red-ui-workspace-disabled-icon {
display: inline;
}
}
}
#red-ui-navigator-canvas {
position: absolute;
bottom: 0;
right:0;
zIndex: 101;
border-left: 1px solid $primary-border-color;
border-top: 1px solid $primary-border-color;
background: $view-navigator-background;
box-shadow: -1px 0 3px $shadow;
}
.red-ui-navigator-border {
stroke-dasharray: 5,5;
pointer-events: none;
stroke: $secondary-border-color;
strokeWidth: 1;
fill: white;
}
.red-ui-component-footer {
@include component-footer;
}
a.red-ui-footer-button,
button.red-ui-footer-button {
@include component-footer-button;
}
a.red-ui-footer-button-toggle,
button.red-ui-footer-button-toggle {
@include component-footer-button-toggle;
}
.red-ui-statusbar-widget {
margin: 0 2px;
display: inline-block;
vertical-align: middle;
height: 100%;
line-height: 20px;
}
.red-ui-statusbar-bucket {
position: absolute;
top: 0;
bottom: 0;
}
.red-ui-statusbar-bucket-left {
left: 10px;
.red-ui-statusbar-widget:first-child {
margin-left: 0;
}
}
.red-ui-statusbar-bucket-right {
right: 10px;
.red-ui-statusbar-widget:last-child {
margin-right: 0;
}
}

6
packages/node_modules/@node-red/editor-client/src/sass/workspaceToolbar.scss vendored
View File

@ -15,7 +15,7 @@
**/
#workspace-toolbar {
#red-ui-workspace-toolbar {
display: none;
color: $workspace-button-color;
font-size: 12px;
@ -27,7 +27,7 @@
padding: 7px;
height: 40px;
box-sizing: border-box;
background: #fff;
background: $secondary-background;
border-bottom: 1px solid $secondary-border-color;
white-space: nowrap;
transition: right 0.2s ease;
@ -77,7 +77,7 @@
margin: 0;
height: 24px;
font-size: 12px;
background: #f9f9f9;
background: $form-input-background;
line-height: 22px;
box-sizing: border-box;
}

5038
packages/node_modules/@node-red/editor-client/src/vendor/bootstrap/css/bootstrap.css vendored
View File

File diff suppressed because it is too large Load Diff

9
packages/node_modules/@node-red/editor-client/src/vendor/bootstrap/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

BIN
packages/node_modules/@node-red/editor-client/src/vendor/bootstrap/img/glyphicons-halflings-white.png vendored
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 8.6 KiB

BIN
packages/node_modules/@node-red/editor-client/src/vendor/bootstrap/img/glyphicons-halflings.png vendored
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 12 KiB

6
packages/node_modules/@node-red/editor-client/src/vendor/bootstrap/js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

57
packages/node_modules/@node-red/editor-client/templates/index.mst vendored
View File

@ -24,69 +24,16 @@
<title>{{ page.title }}</title>
<link rel="icon" type="image/png" href="{{ page.favicon }}">
<link rel="mask-icon" href="{{ page.tabicon }}" color="#8f0000">
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="vendor/jquery/css/base/jquery-ui.min.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="vendor/jquery/css/base/jquery-ui.min.css">
<link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="vendor/vendor.css">
<link rel="stylesheet" href="red/style.min.css">
{{#page.css}}
<link rel="stylesheet" href="{{.}}">
{{/page.css}}
</head>
<body spellcheck="false">
<div id="header">
<span class="logo">{{#header.url}}<a href="{{.}}">{{/header.url}}{{#header.image}}<img src="{{.}}">{{/header.image}} <span>{{ header.title }}</span>{{#header.url}}</a>{{/header.url}}</span>
<ul class="header-toolbar hide">
<li><a id="btn-sidemenu" class="button" data-toggle="dropdown" href="#"><i class="fa fa-bars"></i></a></li>
</ul>
<div id="header-shade" class="hide"></div>
</div>
<div id="main-container" class="sidebar-closed hide">
<div id="workspace">
<ul id="workspace-tabs"></ul>
<div id="chart" tabindex="1"></div>
<div id="workspace-toolbar"></div>
<div id="workspace-footer">
<a class="workspace-footer-button" id="btn-zoom-out" href="#"><i class="fa fa-minus"></i></a>
<a class="workspace-footer-button" id="btn-zoom-zero" href="#"><i class="fa fa-circle-o"></i></a>
<a class="workspace-footer-button" id="btn-zoom-in" href="#"><i class="fa fa-plus"></i></a>
<a class="workspace-footer-button-toggle single" id="btn-navigate" href="#"><i class="fa fa-map-o"></i></a>
</div>
<div id="editor-shade" class="hide"></div>
</div>
<div id="editor-stack"></div>
<div id="palette">
<img src="red/images/spin.svg" class="palette-spinner hide"/>
<div id="palette-search" class="palette-search hide">
<input type="text" data-i18n="[placeholder]palette.filter"></input>
</div>
<div id="palette-container" class="palette-scroll hide"></div>
<div id="palette-footer">
<a class="palette-button" id="palette-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a>
<a class="palette-button" id="palette-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>
</div>
<div id="palette-shade" class="hide"></div>
</div><!-- /palette -->
<div id="sidebar">
<ul id="sidebar-tabs"></ul>
<div id="sidebar-content"></div>
<div id="sidebar-footer"></div>
<div id="sidebar-shade" class="hide"></div>
</div>
<div id="sidebar-separator"></div>
</div>
<div id="full-shade" class="hide"></div>
<div id="notifications"></div>
<div id="dropTarget"><div data-i18n="[append]workspace.dropFlowHere"><br/><i class="fa fa-download"></i></div></div>
<div id="red-ui-editor"></div>
<script src="vendor/vendor.js"></script>
<script src="vendor/jsonata/jsonata.min.js"></script>
<script src="vendor/ace/ace.js"></script>
<script src="vendor/ace/ext-language_tools.js"></script>
<script src="{{ asset.red }}"></script>
<script src="{{ asset.main }}"></script>
{{# page.scripts }}

4
packages/node_modules/@node-red/nodes/core/core/58-debug.html vendored
View File

@ -206,14 +206,14 @@
};
RED.events.on("project:change", this.clearMessageList);
$("#debug-tab-open").on("click", function(e) {
$("#red-ui-sidebar-debug-open").on("click", function(e) {
e.preventDefault();
subWindow = window.open(document.location.toString().replace(/[?#].*$/,"")+"debug/view/view.html"+document.location.search,"nodeREDDebugView","menubar=no,location=no,toolbar=no,chrome,height=500,width=600");
subWindow.onload = function() {
subWindow.postMessage({event:"workspaceChange",activeWorkspace:RED.workspaces.active()},"*");
};
});
RED.popover.tooltip($("#debug-tab-open"),RED._('node-red:debug.sidebar.openWindow'));
RED.popover.tooltip($("#red-ui-sidebar-debug-open"),RED._('node-red:debug.sidebar.openWindow'));

4
packages/node_modules/@node-red/nodes/core/core/60-link.html vendored
View File

@ -53,7 +53,7 @@
if (activeSubflow) {
flowMap[activeSubflow.id] = {
id: activeSubflow.id,
class: 'palette-header',
class: 'red-ui-palette-header',
label: "Subflow : "+(activeSubflow.name || activeSubflow.id),
expanded: true,
children: []
@ -63,7 +63,7 @@
RED.nodes.eachWorkspace(function(ws) {
flowMap[ws.id] = {
id: ws.id,
class: 'palette-header',
class: 'red-ui-palette-header',
label: (ws.label || ws.id)+(node.z===ws.id ? " *":""),
expanded: true,
children: []

2
packages/node_modules/@node-red/nodes/core/core/80-function.html vendored
View File

@ -10,7 +10,7 @@
<input type="hidden" id="node-input-noerr">
</div>
<div class="form-row node-text-editor-row" style="position:relative">
<div style="position: absolute; right:0; bottom:calc(100% + 3px);"><button id="node-function-expand-js" class="editor-button editor-button-small"><i class="fa fa-expand"></i></button></div>
<div style="position: absolute; right:0; bottom:calc(100% + 3px);"><button id="node-function-expand-js" class="red-ui-button red-ui-button-small"><i class="fa fa-expand"></i></button></div>
<div style="height: 250px; min-height:150px;" class="node-text-editor" id="node-input-func-editor" ></div>
</div>
<div class="form-row" style="margin-bottom: 0px">

Some files were not shown because too many files have changed in this diff Show More