mirror of
https://github.com/node-red/node-red.git
synced 2025-03-01 10:36:34 +00:00
Merge branch 'config' into 0.14.0
explain why this merge is necessary,
This commit is contained in:
Nick O'Leary
@@ -273,6 +273,10 @@ RED.history = (function() {
|
||||
RED.nodes.addLink(ev.removedLinks[i]);
|
||||
}
|
||||
}
|
||||
} else if (ev.t == "reorder") {
|
||||
if (ev.order) {
|
||||
RED.workspaces.order(ev.order);
|
||||
}
|
||||
}
|
||||
Object.keys(modifiedTabs).forEach(function(id) {
|
||||
var subflow = RED.nodes.subflow(id);
|
||||
|
||||
@@ -21,6 +21,7 @@ RED.nodes = (function() {
|
||||
var links = [];
|
||||
var defaultWorkspace;
|
||||
var workspaces = {};
|
||||
var workspacesOrder =[];
|
||||
var subflows = {};
|
||||
|
||||
var dirty = false;
|
||||
@@ -173,8 +174,10 @@ RED.nodes = (function() {
|
||||
if (type && type.category == "config") {
|
||||
var configNode = configNodes[n[d]];
|
||||
if (configNode) {
|
||||
updatedConfigNode = true;
|
||||
configNode.users.push(n);
|
||||
if (configNode.users.indexOf(n) === -1) {
|
||||
updatedConfigNode = true;
|
||||
configNode.users.push(n);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -269,12 +272,15 @@ RED.nodes = (function() {
|
||||
|
||||
function addWorkspace(ws) {
|
||||
workspaces[ws.id] = ws;
|
||||
workspacesOrder.push(ws.id);
|
||||
}
|
||||
function getWorkspace(id) {
|
||||
return workspaces[id];
|
||||
}
|
||||
function removeWorkspace(id) {
|
||||
delete workspaces[id];
|
||||
workspacesOrder.splice(workspacesOrder.indexOf(id),1);
|
||||
|
||||
var removedNodes = [];
|
||||
var removedLinks = [];
|
||||
var n;
|
||||
@@ -517,7 +523,7 @@ RED.nodes = (function() {
|
||||
if ((exportable == null || exportable)) {
|
||||
if (!(node[d] in exportedConfigNodes)) {
|
||||
exportedConfigNodes[node[d]] = true;
|
||||
nns.unshift(RED.nodes.convertNode(confNode));
|
||||
set.push(confNode);
|
||||
}
|
||||
} else {
|
||||
convertedNode[d] = "";
|
||||
@@ -537,11 +543,9 @@ RED.nodes = (function() {
|
||||
function createCompleteNodeSet() {
|
||||
var nns = [];
|
||||
var i;
|
||||
for (i in workspaces) {
|
||||
if (workspaces.hasOwnProperty(i)) {
|
||||
if (workspaces[i].type == "tab") {
|
||||
nns.push(workspaces[i]);
|
||||
}
|
||||
for (i=0;i<workspacesOrder.length;i++) {
|
||||
if (workspaces[workspacesOrder[i]].type == "tab") {
|
||||
nns.push(workspaces[workspacesOrder[i]]);
|
||||
}
|
||||
}
|
||||
for (i in subflows) {
|
||||
@@ -663,6 +667,9 @@ RED.nodes = (function() {
|
||||
var new_links = [];
|
||||
var nid;
|
||||
var def;
|
||||
var configNode;
|
||||
|
||||
// Find all tabs and subflow templates
|
||||
for (i=0;i<newNodes.length;i++) {
|
||||
n = newNodes[i];
|
||||
// TODO: remove workspace in next release+1
|
||||
@@ -706,6 +713,8 @@ RED.nodes = (function() {
|
||||
addSubflow(n,createNewIds);
|
||||
}
|
||||
}
|
||||
|
||||
// Add a tab if there isn't one there already
|
||||
if (defaultWorkspace == null) {
|
||||
defaultWorkspace = { type:"tab", id:getID(), label:RED._('workspace.defaultName',{number:1})};
|
||||
addWorkspace(defaultWorkspace);
|
||||
@@ -714,6 +723,7 @@ RED.nodes = (function() {
|
||||
activeWorkspace = RED.workspaces.active();
|
||||
}
|
||||
|
||||
// Find all config nodes and add them
|
||||
for (i=0;i<newNodes.length;i++) {
|
||||
n = newNodes[i];
|
||||
def = registry.getNodeType(n.type);
|
||||
@@ -750,7 +760,7 @@ RED.nodes = (function() {
|
||||
}
|
||||
|
||||
if (!existingConfigNode) { //} || !compareNodes(existingConfigNode,n,true) || existingConfigNode._def.exclusive || existingConfigNode.z !== n.z) {
|
||||
var configNode = {id:n.id, z:n.z, type:n.type, users:[]};
|
||||
configNode = {id:n.id, z:n.z, type:n.type, users:[]};
|
||||
for (var d in def.defaults) {
|
||||
if (def.defaults.hasOwnProperty(d)) {
|
||||
configNode[d] = n[d];
|
||||
@@ -768,6 +778,7 @@ RED.nodes = (function() {
|
||||
}
|
||||
}
|
||||
|
||||
// Find regular flow nodes and subflow instances
|
||||
for (i=0;i<newNodes.length;i++) {
|
||||
n = newNodes[i];
|
||||
// TODO: remove workspace in next release+1
|
||||
@@ -838,15 +849,7 @@ RED.nodes = (function() {
|
||||
node.outputs = n.outputs||node._def.outputs;
|
||||
for (var d2 in node._def.defaults) {
|
||||
if (node._def.defaults.hasOwnProperty(d2)) {
|
||||
if (node._def.defaults[d2].type) {
|
||||
if (node_map[n[d2]]) {
|
||||
node[d2] = node_map[n[d2]].id;
|
||||
} else {
|
||||
node[d2] = n[d2];
|
||||
}
|
||||
} else {
|
||||
node[d2] = n[d2];
|
||||
}
|
||||
node[d2] = n[d2];
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -860,6 +863,7 @@ RED.nodes = (function() {
|
||||
}
|
||||
}
|
||||
}
|
||||
// Remap all wires and config node references
|
||||
for (i=0;i<new_nodes.length;i++) {
|
||||
n = new_nodes[i];
|
||||
if (n.wires) {
|
||||
@@ -875,6 +879,19 @@ RED.nodes = (function() {
|
||||
}
|
||||
delete n.wires;
|
||||
}
|
||||
for (var d3 in n._def.defaults) {
|
||||
if (n._def.defaults.hasOwnProperty(d3)) {
|
||||
if (n._def.defaults[d3].type && node_map[n[d3]]) {
|
||||
n[d3] = node_map[n[d3]].id;
|
||||
configNode = RED.nodes.node(n[d3]);
|
||||
if (configNode && configNode.users.indexOf(n) === -1) {
|
||||
configNode.users.push(n);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
for (i=0;i<new_subflows.length;i++) {
|
||||
n = new_subflows[i];
|
||||
@@ -972,6 +989,8 @@ RED.nodes = (function() {
|
||||
|
||||
addWorkspace: addWorkspace,
|
||||
removeWorkspace: removeWorkspace,
|
||||
getWorkspaceOrder: function() { return workspacesOrder },
|
||||
setWorkspaceOrder: function(order) { workspacesOrder = order; },
|
||||
workspace: getWorkspace,
|
||||
|
||||
addSubflow: addSubflow,
|
||||
@@ -1004,10 +1023,8 @@ RED.nodes = (function() {
|
||||
}
|
||||
},
|
||||
eachWorkspace: function(cb) {
|
||||
for (var id in workspaces) {
|
||||
if (workspaces.hasOwnProperty(id)) {
|
||||
cb(workspaces[id]);
|
||||
}
|
||||
for (var i=0;i<workspacesOrder.length;i++) {
|
||||
cb(workspaces[workspacesOrder[i]]);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@@ -23,7 +23,7 @@ RED.clipboard = (function() {
|
||||
var importNodesDialog;
|
||||
|
||||
function setupDialogs() {
|
||||
dialog = $('<div id="clipboard-dialog" class="hide"><form class="dialog-form form-horizontal"></form></div>')
|
||||
dialog = $('<div id="clipboard-dialog" class="hide node-red-dialog"><form class="dialog-form form-horizontal"></form></div>')
|
||||
.appendTo("body")
|
||||
.dialog({
|
||||
modal: true,
|
||||
@@ -31,14 +31,6 @@ RED.clipboard = (function() {
|
||||
width: 500,
|
||||
resizable: false,
|
||||
buttons: [
|
||||
{
|
||||
id: "clipboard-dialog-ok",
|
||||
text: RED._("common.label.ok"),
|
||||
click: function() {
|
||||
RED.view.importNodes($("#clipboard-import").val());
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
id: "clipboard-dialog-cancel",
|
||||
text: RED._("common.label.cancel"),
|
||||
@@ -48,10 +40,20 @@ RED.clipboard = (function() {
|
||||
},
|
||||
{
|
||||
id: "clipboard-dialog-close",
|
||||
class: "primary",
|
||||
text: RED._("common.label.close"),
|
||||
click: function() {
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
id: "clipboard-dialog-ok",
|
||||
class: "primary",
|
||||
text: RED._("common.label.import"),
|
||||
click: function() {
|
||||
RED.view.importNodes($("#clipboard-import").val());
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
}
|
||||
],
|
||||
open: function(e) {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -254,7 +254,14 @@ RED.library = (function() {
|
||||
height: 450,
|
||||
buttons: [
|
||||
{
|
||||
text: RED._("common.label.ok"),
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("common.label.load"),
|
||||
class: "primary",
|
||||
click: function() {
|
||||
if (selectedLibraryItem) {
|
||||
for (var i=0;i<options.fields.length;i++) {
|
||||
@@ -265,12 +272,6 @@ RED.library = (function() {
|
||||
}
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
}
|
||||
],
|
||||
open: function(e) {
|
||||
@@ -359,15 +360,16 @@ RED.library = (function() {
|
||||
height: 230,
|
||||
buttons: [
|
||||
{
|
||||
text: RED._("common.label.ok"),
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
saveToLibrary(true);
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("common.label.cancel"),
|
||||
text: RED._("common.label.save"),
|
||||
class: "primary",
|
||||
click: function() {
|
||||
saveToLibrary(true);
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
}
|
||||
@@ -381,15 +383,16 @@ RED.library = (function() {
|
||||
height: 230,
|
||||
buttons: [
|
||||
{
|
||||
text: RED._("common.label.ok"),
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
saveToLibrary(false);
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("common.label.cancel"),
|
||||
text: RED._("common.label.save"),
|
||||
class: "primary",
|
||||
click: function() {
|
||||
saveToLibrary(false);
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
}
|
||||
@@ -432,9 +435,17 @@ RED.library = (function() {
|
||||
resizable: false,
|
||||
title: RED._("library.exportToLibrary"),
|
||||
buttons: [
|
||||
{
|
||||
id: "library-dialog-cancel",
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
id: "library-dialog-ok",
|
||||
text: RED._("common.label.ok"),
|
||||
class: "primary",
|
||||
text: RED._("common.label.export"),
|
||||
click: function() {
|
||||
//TODO: move this to RED.library
|
||||
var flowName = $("#node-input-library-filename").val();
|
||||
@@ -457,13 +468,6 @@ RED.library = (function() {
|
||||
}
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
id: "library-dialog-cancel",
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
}
|
||||
],
|
||||
open: function(e) {
|
||||
|
||||
@@ -102,13 +102,13 @@ RED.sidebar = (function() {
|
||||
sidebarSeparator.start = ui.position.left;
|
||||
sidebarSeparator.chartWidth = $("#workspace").width();
|
||||
sidebarSeparator.chartRight = winWidth-$("#workspace").width()-$("#workspace").offset().left-2;
|
||||
|
||||
|
||||
|
||||
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);
|
||||
RED.events.emit("sidebar:resize");
|
||||
@@ -147,6 +147,7 @@ RED.sidebar = (function() {
|
||||
|
||||
var newChartRight = sidebarSeparator.chartRight-d;
|
||||
$("#workspace").css("right",newChartRight);
|
||||
$("#editor-stack").css("right",newChartRight+1);
|
||||
$("#sidebar").width(newSidebarWidth);
|
||||
|
||||
sidebar_tabs.resize();
|
||||
@@ -159,6 +160,7 @@ RED.sidebar = (function() {
|
||||
if ($("#sidebar").width() < 180) {
|
||||
$("#sidebar").width(180);
|
||||
$("#workspace").css("right",187);
|
||||
$("#editor-stack").css("right",188);
|
||||
}
|
||||
}
|
||||
$("#sidebar-separator").css("left","auto");
|
||||
|
||||
@@ -17,7 +17,7 @@ RED.sidebar.config = (function() {
|
||||
|
||||
|
||||
var content = document.createElement("div");
|
||||
content.className = "sidebar-node-config"
|
||||
content.className = "sidebar-node-config";
|
||||
|
||||
$('<div class="button-group sidebar-header">'+
|
||||
'<a class="sidebar-header-button-toggle selected" id="workspace-config-node-filter-all" href="#"><span data-i18n="sidebar.config.filterAll"></span></a>'+
|
||||
@@ -35,6 +35,9 @@ RED.sidebar.config = (function() {
|
||||
var flowCategories = $("<div>").appendTo(content);
|
||||
var subflowCategories = $("<div>").appendTo(content);
|
||||
|
||||
|
||||
var shade = $('<div class="sidebar-node-config-shade hide"></div>').appendTo(content);
|
||||
|
||||
var showUnusedOnly = false;
|
||||
|
||||
var categories = {};
|
||||
@@ -288,6 +291,12 @@ RED.sidebar.config = (function() {
|
||||
return {
|
||||
init:init,
|
||||
show:show,
|
||||
refresh:refreshConfigNodeList
|
||||
refresh:refreshConfigNodeList,
|
||||
disable: function() {
|
||||
shade.show();
|
||||
},
|
||||
enable: function() {
|
||||
shade.hide();
|
||||
}
|
||||
}
|
||||
})();
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* Copyright 2013, 2015 IBM Corp.
|
||||
* Copyright 2013, 2016 IBM Corp.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
@@ -24,7 +24,7 @@ RED.tabs = (function() {
|
||||
var currentTabWidth;
|
||||
var currentActiveTabWidth = 0;
|
||||
|
||||
var ul = $("#"+options.id)
|
||||
var ul = $("#"+options.id);
|
||||
ul.addClass("red-ui-tabs");
|
||||
ul.children().first().addClass("active");
|
||||
ul.children().addClass("red-ui-tab");
|
||||
@@ -118,6 +118,7 @@ RED.tabs = (function() {
|
||||
addTab: function(tab) {
|
||||
tabs[tab.id] = tab;
|
||||
var li = $("<li/>",{class:"red-ui-tab"}).appendTo(ul);
|
||||
li.data("tabId",tab.id);
|
||||
var link = $("<a/>",{href:"#"+tab.id, class:"red-ui-tab-label"}).appendTo(li);
|
||||
if (tab.icon) {
|
||||
$('<img src="'+tab.icon+'" class="red-ui-tab-icon"/>').appendTo(link);
|
||||
@@ -142,6 +143,85 @@ RED.tabs = (function() {
|
||||
if (ul.find("li.red-ui-tab").size() == 1) {
|
||||
activateTab(link);
|
||||
}
|
||||
if (options.onreorder) {
|
||||
var originalTabOrder;
|
||||
var tabDragIndex;
|
||||
var tabElements = [];
|
||||
var startDragIndex;
|
||||
|
||||
li.draggable({
|
||||
axis:"x",
|
||||
distance: 20,
|
||||
start: function(event,ui) {
|
||||
originalTabOrder = [];
|
||||
tabElements = [];
|
||||
ul.children().each(function(i) {
|
||||
tabElements[i] = {
|
||||
el:$(this),
|
||||
text: $(this).text(),
|
||||
left: $(this).position().left,
|
||||
width: $(this).width()
|
||||
};
|
||||
if ($(this).is(li)) {
|
||||
tabDragIndex = i;
|
||||
startDragIndex = i;
|
||||
}
|
||||
originalTabOrder.push($(this).data("tabId"));
|
||||
});
|
||||
ul.children().each(function(i) {
|
||||
if (i!==tabDragIndex) {
|
||||
$(this).css({
|
||||
position: 'absolute',
|
||||
left: tabElements[i].left+"px",
|
||||
width: tabElements[i].width+2,
|
||||
transition: "left 0.3s"
|
||||
});
|
||||
}
|
||||
|
||||
})
|
||||
if (!li.hasClass('active')) {
|
||||
li.css({'zIndex':1});
|
||||
}
|
||||
},
|
||||
drag: function(event,ui) {
|
||||
ui.position.left += tabElements[tabDragIndex].left;
|
||||
var tabCenter = ui.position.left + tabElements[tabDragIndex].width/2;
|
||||
for (var i=0;i<tabElements.length;i++) {
|
||||
if (i === tabDragIndex) {
|
||||
continue;
|
||||
}
|
||||
if (tabCenter > tabElements[i].left && tabCenter < tabElements[i].left+tabElements[i].width) {
|
||||
if (i < tabDragIndex) {
|
||||
tabElements[i].left += tabElements[tabDragIndex].width+8;
|
||||
tabElements[tabDragIndex].el.detach().insertBefore(tabElements[i].el);
|
||||
} else {
|
||||
tabElements[i].left -= tabElements[tabDragIndex].width+8;
|
||||
tabElements[tabDragIndex].el.detach().insertAfter(tabElements[i].el);
|
||||
}
|
||||
tabElements[i].el.css({left:tabElements[i].left+"px"});
|
||||
|
||||
tabElements.splice(i, 0, tabElements.splice(tabDragIndex, 1)[0]);
|
||||
|
||||
tabDragIndex = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// console.log(ui.position.left,ui.offset.left);
|
||||
},
|
||||
stop: function(event,ui) {
|
||||
ul.children().css({position:"relative",left:"",transition:""});
|
||||
if (!li.hasClass('active')) {
|
||||
li.css({zIndex:""});
|
||||
}
|
||||
updateTabWidths();
|
||||
if (startDragIndex !== tabDragIndex) {
|
||||
options.onreorder(originalTabOrder, $.makeArray(ul.children().map(function() { return $(this).data('tabId');})));
|
||||
}
|
||||
activateTab(tabElements[tabDragIndex].el.data('tabId'));
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
removeTab: removeTab,
|
||||
activateTab: activateTab,
|
||||
@@ -158,6 +238,30 @@ RED.tabs = (function() {
|
||||
tab.attr("title",label);
|
||||
tab.find("span").text(label);
|
||||
updateTabWidths();
|
||||
},
|
||||
order: function(order) {
|
||||
var existingTabOrder = $.makeArray(ul.children().map(function() { return $(this).data('tabId');}));
|
||||
if (existingTabOrder.length !== order.length) {
|
||||
return
|
||||
}
|
||||
var i;
|
||||
var match = true;
|
||||
for (i=0;i<order.length;i++) {
|
||||
if (order[i] !== existingTabOrder[i]) {
|
||||
match = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (match) {
|
||||
return;
|
||||
}
|
||||
var existingTabMap = {};
|
||||
var existingTabs = ul.children().detach().each(function() {
|
||||
existingTabMap[$(this).data("tabId")] = $(this);
|
||||
});
|
||||
for (i=0;i<order.length;i++) {
|
||||
existingTabMap[order[i]].appendTo(ul);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
225
editor/js/ui/tray.js
Normal file
225
editor/js/ui/tray.js
Normal file
@@ -0,0 +1,225 @@
|
||||
/**
|
||||
* Copyright 2016 IBM Corp.
|
||||
*
|
||||
* 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.tray = (function() {
|
||||
|
||||
var stack = [];
|
||||
|
||||
function resize() {
|
||||
|
||||
}
|
||||
function showTray(options) {
|
||||
var el = $('<div class="editor-tray"></div>');
|
||||
var header = $('<div class="editor-tray-header"></div>').appendTo(el);
|
||||
var body = $('<div class="editor-tray-body"></div>').appendTo(el);
|
||||
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);
|
||||
if (options.title) {
|
||||
$('<div class="editor-tray-titlebar">'+options.title+'</div>').appendTo(header);
|
||||
}
|
||||
var buttonBar = $('<div class="editor-tray-toolbar"></div>').appendTo(header);
|
||||
if (options.buttons) {
|
||||
for (var i=0;i<options.buttons.length;i++) {
|
||||
var button = options.buttons[i];
|
||||
|
||||
var b = $('<button>').appendTo(buttonBar);
|
||||
if (button.id) {
|
||||
b.attr('id',button.id);
|
||||
}
|
||||
if (button.text) {
|
||||
b.html(button.text);
|
||||
}
|
||||
if (button.click) {
|
||||
b.click(button.click);
|
||||
}
|
||||
if (button.class) {
|
||||
b.addClass(button.class);
|
||||
}
|
||||
}
|
||||
}
|
||||
el.appendTo("#editor-stack");
|
||||
var tray = {
|
||||
tray: el,
|
||||
header: header,
|
||||
body: body,
|
||||
footer: footer,
|
||||
options: options
|
||||
};
|
||||
stack.push(tray);
|
||||
|
||||
el.draggable({
|
||||
handle: resizer,
|
||||
axis: "x",
|
||||
start:function(event,ui) {
|
||||
el.width('auto');
|
||||
},
|
||||
drag: function(event,ui) {
|
||||
if (ui.position.left > -tray.preferredWidth-1) {
|
||||
ui.position.left = -tray.preferredWidth-1;
|
||||
} else if (tray.options.resize) {
|
||||
setTimeout(function() {
|
||||
tray.options.resize({width: -ui.position.left});
|
||||
},0);
|
||||
}
|
||||
tray.width = -ui.position.left;
|
||||
},
|
||||
stop:function(event,ui) {
|
||||
el.width(-ui.position.left);
|
||||
el.css({left:''});
|
||||
if (tray.options.resize) {
|
||||
tray.options.resize({width: -ui.position.left});
|
||||
}
|
||||
tray.width = -ui.position.left;
|
||||
}
|
||||
});
|
||||
|
||||
if (options.open) {
|
||||
options.open(el);
|
||||
}
|
||||
|
||||
$("#header-shade").show();
|
||||
$("#editor-shade").show();
|
||||
RED.sidebar.config.disable();
|
||||
|
||||
tray.preferredWidth = el.width();
|
||||
if (options.width) {
|
||||
if (options.width > $("#editor-stack").position().left-8) {
|
||||
options.width = $("#editor-stack").position().left-8;
|
||||
}
|
||||
el.width(options.width);
|
||||
}
|
||||
tray.width = el.width();
|
||||
el.css({
|
||||
right: -(el.width()+10)+"px",
|
||||
transition: "right 0.2s ease"
|
||||
});
|
||||
$("#workspace").scrollLeft(0);
|
||||
|
||||
var trayHeight = el.height()-header.outerHeight()-footer.outerHeight();
|
||||
body.height(trayHeight-40);
|
||||
|
||||
setTimeout(function() {
|
||||
setTimeout(function() {
|
||||
if (!options.width) {
|
||||
el.width(tray.preferredWidth);
|
||||
}
|
||||
if (options.resize) {
|
||||
options.resize({width:el.width()});
|
||||
}
|
||||
if (options.show) {
|
||||
options.show();
|
||||
}
|
||||
},150);
|
||||
el.css({right:0});
|
||||
},0);
|
||||
|
||||
// growButton.click(function(e) {
|
||||
// e.preventDefault();
|
||||
// tray.lastWidth = tray.width;
|
||||
// tray.width = $("#editor-stack").position().left-8;
|
||||
// el.width(tray.width);
|
||||
// if (options.resize) {
|
||||
// options.resize({width:tray.width});
|
||||
// }
|
||||
// });
|
||||
// shrinkButton.click(function(e) {
|
||||
// e.preventDefault();
|
||||
// if (tray.lastWidth && tray.width > tray.lastWidth) {
|
||||
// tray.width = tray.lastWidth;
|
||||
// } else if (tray.width > tray.preferredWidth) {
|
||||
// tray.width = tray.preferredWidth;
|
||||
// }
|
||||
// el.width(tray.width);
|
||||
// if (options.resize) {
|
||||
// options.resize({width:tray.width});
|
||||
// }
|
||||
// });
|
||||
|
||||
}
|
||||
|
||||
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-40);
|
||||
|
||||
if (tray.width > $("#editor-stack").position().left-8) {
|
||||
tray.width = Math.max(tray.preferredWidth,$("#editor-stack").position().left-8);
|
||||
tray.tray.width(tray.width);
|
||||
}
|
||||
if (tray.options.resize) {
|
||||
tray.options.resize({width:tray.width});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
init: function init() {
|
||||
$(window).resize(handleWindowResize);
|
||||
RED.events.on("sidebar:resize",handleWindowResize);
|
||||
},
|
||||
show: function show(options) {
|
||||
if (stack.length > 0) {
|
||||
var oldTray = stack[stack.length-1];
|
||||
oldTray.tray.css({
|
||||
right: -(oldTray.tray.width()+10)+"px"
|
||||
});
|
||||
setTimeout(function() {
|
||||
oldTray.tray.detach();
|
||||
showTray(options);
|
||||
},200)
|
||||
} else {
|
||||
showTray(options);
|
||||
}
|
||||
|
||||
},
|
||||
close: function close(done) {
|
||||
if (stack.length > 0) {
|
||||
var tray = stack.pop();
|
||||
tray.tray.css({
|
||||
right: -(tray.tray.width()+10)+"px"
|
||||
});
|
||||
setTimeout(function() {
|
||||
if (tray.options.close) {
|
||||
tray.options.close();
|
||||
}
|
||||
tray.tray.remove();
|
||||
if (stack.length > 0) {
|
||||
var oldTray = stack[stack.length-1];
|
||||
oldTray.tray.appendTo("#editor-stack");
|
||||
setTimeout(function() {
|
||||
handleWindowResize();
|
||||
oldTray.tray.css({right:0});
|
||||
if (oldTray.options.show) {
|
||||
oldTray.options.show();
|
||||
}
|
||||
},0);
|
||||
}
|
||||
if (done) {
|
||||
done();
|
||||
}
|
||||
},200)
|
||||
if (stack.length === 0) {
|
||||
$("#header-shade").hide();
|
||||
$("#editor-shade").hide();
|
||||
RED.sidebar.config.enable();
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})();
|
||||
@@ -334,7 +334,7 @@ RED.view = (function() {
|
||||
}
|
||||
}
|
||||
|
||||
var nn = { id:(1+Math.random()*4294967295).toString(16),z:RED.workspaces.active()};
|
||||
var nn = { id:RED.nodes.id(),z:RED.workspaces.active()};
|
||||
|
||||
nn.type = selected_tool;
|
||||
nn._def = RED.nodes.getType(nn.type);
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* Copyright 2015 IBM Corp.
|
||||
* Copyright 2015, 2016 IBM Corp.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
@@ -113,6 +113,11 @@ RED.workspaces = (function() {
|
||||
RED.menu.setDisabled("menu-item-workspace-delete",workspace_tabs.count() == 1);
|
||||
RED.menu.removeItem("menu-item-workspace-menu-"+tab.id.replace(".","-"));
|
||||
},
|
||||
onreorder: function(oldOrder, newOrder) {
|
||||
RED.history.push({t:'reorder',order:oldOrder,dirty:RED.nodes.dirty()});
|
||||
RED.nodes.dirty(true);
|
||||
setWorkspaceOrder(newOrder);
|
||||
},
|
||||
minimumActiveTabWidth: 150
|
||||
});
|
||||
|
||||
@@ -134,7 +139,14 @@ RED.workspaces = (function() {
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("common.label.ok"),
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("common.label.done"),
|
||||
class: "primary",
|
||||
click: function() {
|
||||
var workspace = $(this).dialog('option','workspace');
|
||||
var label = $( "#node-input-workspace-name" ).val();
|
||||
@@ -146,13 +158,8 @@ RED.workspaces = (function() {
|
||||
}
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
},
|
||||
{
|
||||
text: RED._("common.label.cancel"),
|
||||
click: function() {
|
||||
$( this ).dialog( "close" );
|
||||
}
|
||||
}
|
||||
|
||||
],
|
||||
open: function(e) {
|
||||
RED.keyboard.disable();
|
||||
@@ -216,11 +223,18 @@ RED.workspaces = (function() {
|
||||
}
|
||||
}
|
||||
|
||||
function setWorkspaceOrder(order) {
|
||||
RED.nodes.setWorkspaceOrder(order.filter(function(id) {
|
||||
return RED.nodes.workspace(id) !== undefined;
|
||||
}));
|
||||
workspace_tabs.order(order);
|
||||
}
|
||||
|
||||
return {
|
||||
init: init,
|
||||
add: addWorkspace,
|
||||
remove: removeWorkspace,
|
||||
|
||||
order: setWorkspaceOrder,
|
||||
edit: function(id) {
|
||||
showRenameWorkspaceDialog(id||activeWorkspace);
|
||||
},
|
||||
|
||||
@@ -14,6 +14,8 @@
|
||||
* limitations under the License.
|
||||
**/
|
||||
|
||||
$background-color: #f3f3f3;
|
||||
|
||||
$form-placeholder-color: #bbbbbb;
|
||||
$form-text-color: #444;
|
||||
$form-input-focus-color: rgba(85,150,230,0.8);
|
||||
@@ -45,6 +47,13 @@ $workspace-button-color-hover: #666;
|
||||
$workspace-button-color-active: #666;
|
||||
$workspace-button-color-selected: #AAA;
|
||||
|
||||
$workspace-button-color-focus-outline: rgba(85,150,230,0.2);
|
||||
|
||||
$typedInput-button-background: #efefef;
|
||||
$typedInput-button-background-hover: #ddd;
|
||||
$typedInput-button-background-active: #e3e3e3;
|
||||
|
||||
$editor-button-color-primary: #666;
|
||||
$editor-button-color-secondary: #999;
|
||||
|
||||
$shade-color: rgba(220,220,220,0.5);
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* Copyright 2015 IBM Corp.
|
||||
* Copyright 2015, 2016 IBM Corp.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
@@ -14,7 +14,144 @@
|
||||
* limitations under the License.
|
||||
**/
|
||||
|
||||
.dialog-form, #dialog-form, #dialog-config-form {
|
||||
|
||||
#editor-stack {
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
top: 0;
|
||||
bottom: 0px;
|
||||
right: 323px;
|
||||
width: 0;
|
||||
z-index: 5;
|
||||
}
|
||||
.editor-tray {
|
||||
position:absolute;
|
||||
margin: 0;
|
||||
top: 0;
|
||||
min-width: 500px;
|
||||
width: auto;
|
||||
right: -1000px;
|
||||
bottom: 0;
|
||||
background: #fff;
|
||||
border-left: 1px solid $secondary-border-color;
|
||||
border-bottom: 1px solid $primary-border-color;
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.editor-tray.open {
|
||||
right: 0;
|
||||
}
|
||||
.editor-tray-body {
|
||||
width: auto;
|
||||
padding: 20px;
|
||||
min-width: 500px;
|
||||
box-sizing: border-box;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.editor-tray-header {
|
||||
@include disable-selection;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
background: $palette-header-background;
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
.editor-tray-footer {
|
||||
@include component-footer;
|
||||
height: 35px;
|
||||
}
|
||||
|
||||
.editor-tray-toolbar {
|
||||
text-align: right;
|
||||
padding: 8px;
|
||||
|
||||
button {
|
||||
@include workspace-button;
|
||||
font-size: 14px;
|
||||
padding: 6px 14px;
|
||||
margin-right: 8px;
|
||||
color: $editor-button-color-primary;
|
||||
&.leftButton {
|
||||
float: left;
|
||||
margin-top: 1px;
|
||||
}
|
||||
&:not(.leftButton):not(:last-child) {
|
||||
margin-right: 16px;
|
||||
}
|
||||
&:not(.primary) {
|
||||
background: none;
|
||||
&:hover {
|
||||
color: $editor-button-color-primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.editor-tray-titlebar {
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
padding: 8px;
|
||||
}
|
||||
.editor-tray-breadcrumbs {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding:0;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
padding:0;
|
||||
margin:0;
|
||||
|
||||
&:not(:last-child) {
|
||||
color: $editor-button-color-secondary;
|
||||
font-weight: normal;
|
||||
|
||||
&:after {
|
||||
display: inline-block;
|
||||
content: '>';
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.editor-tray-resize-handle {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
width: 7px;
|
||||
left: -9px;
|
||||
background: $background-color 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);
|
||||
}
|
||||
.editor-tray-resize-button {
|
||||
@include workspace-button;
|
||||
display: block;
|
||||
height: 37px;
|
||||
line-height: 35px;
|
||||
border: none;
|
||||
border-bottom: 1px solid $secondary-border-color;
|
||||
margin: 0;
|
||||
background: $background-color;
|
||||
color: $workspace-button-color;
|
||||
}
|
||||
#editor-shade, #header-shade {
|
||||
position: absolute;
|
||||
top:0;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
background: $shade-color;
|
||||
}
|
||||
|
||||
|
||||
.dialog-form,#dialog-form, #dialog-config-form {
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
}
|
||||
@@ -23,10 +160,6 @@
|
||||
border-color: rgb(214, 97, 95) !important;
|
||||
}
|
||||
|
||||
.ui-dialog .ui-dialog-buttonpane button.leftButton {
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.form-row {
|
||||
clear: both;
|
||||
color: $form-text-color;
|
||||
@@ -83,6 +216,7 @@
|
||||
cursor: auto;
|
||||
float: right;
|
||||
font-size: 12px !important;
|
||||
line-height: 35px;
|
||||
}
|
||||
#node-config-dialog-scope-warning {
|
||||
display: inline-block;
|
||||
@@ -94,13 +228,14 @@
|
||||
margin: 1px 0 0 0;
|
||||
padding: 0;
|
||||
height: 22px;
|
||||
width: 110px;
|
||||
width: 150px;
|
||||
|
||||
}
|
||||
#node-config-dialog-user-count {
|
||||
vertical-align: middle;
|
||||
display:inline-block;
|
||||
margin-top: 10px;
|
||||
margin-right: 20px;
|
||||
float:left;
|
||||
font-size: 12px;
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
@@ -73,6 +73,32 @@
|
||||
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.ui-dialog-buttonset button {
|
||||
@include workspace-button;
|
||||
font-size: 14px;
|
||||
padding: 6px 14px;
|
||||
margin-right: 8px;
|
||||
color: $editor-button-color-primary;
|
||||
&.leftButton {
|
||||
float: left;
|
||||
margin-top: 7px;
|
||||
}
|
||||
&:not(.leftButton):not(:last-child) {
|
||||
margin-right: 16px;
|
||||
}
|
||||
&:not(.primary) {
|
||||
background: none;
|
||||
|
||||
&:hover {
|
||||
color: $editor-button-color-primary;
|
||||
}
|
||||
}
|
||||
.ui-button-text {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ui-dialog .ui-dialog-buttonpane {
|
||||
padding: .3em 1em .5em 1em;
|
||||
}
|
||||
|
||||
@@ -62,10 +62,13 @@
|
||||
background: $workspace-button-background-active;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.button-group &:not(:first-child) {
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: 1px solid $workspace-button-color-focus-outline;
|
||||
}
|
||||
}
|
||||
@mixin workspace-button-toggle {
|
||||
@include workspace-button;
|
||||
|
||||
@@ -22,6 +22,7 @@
|
||||
width: 315px;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
z-index: 10;
|
||||
@include component-border;
|
||||
}
|
||||
|
||||
@@ -46,13 +47,15 @@
|
||||
right: 315px;
|
||||
bottom:10px;
|
||||
width: 7px;
|
||||
background: url(images/grip.png) no-repeat 50% 50%;
|
||||
z-index: 11;
|
||||
background: $background-color 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; }
|
||||
|
||||
#sidebar .button {
|
||||
@include workspace-button;
|
||||
|
||||
@@ -52,7 +52,7 @@ body {
|
||||
font-size: 14px;
|
||||
font-family: 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
||||
padding-top: 100px;
|
||||
background: #f3f3f3;
|
||||
background: $background-color;
|
||||
}
|
||||
|
||||
#main-container {
|
||||
|
||||
@@ -15,11 +15,21 @@
|
||||
**/
|
||||
|
||||
.sidebar-node-config {
|
||||
position: relative;
|
||||
background: #f3f3f3;
|
||||
height: 100%;
|
||||
overflow-y:auto;
|
||||
@include disable-selection;
|
||||
}
|
||||
.sidebar-node-config-shade {
|
||||
position: absolute;
|
||||
top:0;
|
||||
bottom:0;
|
||||
left:0;
|
||||
right:0;
|
||||
background: $shade-color;
|
||||
}
|
||||
|
||||
|
||||
.config-node-list {
|
||||
margin: 0;
|
||||
|
||||
@@ -104,6 +104,7 @@ ul.red-ui-tabs li.active {
|
||||
background: $tab-background-active;
|
||||
font-weight: bold;
|
||||
border-bottom: 1px solid #fff;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.red-ui-tabs li.active a {
|
||||
color: #333;
|
||||
|
||||
@@ -50,6 +50,8 @@
|
||||
margin-right: 35px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#workspace-add-tab {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
|
||||
@@ -39,6 +39,7 @@
|
||||
<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="palette">
|
||||
@@ -65,6 +66,8 @@
|
||||
<a class="workspace-footer-button" id="btn-zoom-in" href="#"><i class="fa fa-plus"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="editor-shade" class="hide"></div>
|
||||
<div id="editor-stack"></div>
|
||||
<div id="sidebar">
|
||||
<ul id="sidebar-tabs"></ul>
|
||||
<div id="sidebar-content"></div>
|
||||
@@ -78,24 +81,6 @@
|
||||
<div id="notifications"></div>
|
||||
<div id="dropTarget"><div data-i18n="[append]workspace.dropFlowHere"><br/><i class="fa fa-download"></i></div></div>
|
||||
|
||||
<div id="dialog" class="hide"><form id="dialog-form" class="form-horizontal"></form></div>
|
||||
<div id="node-config-dialog" class="hide"><form id="dialog-config-form" class="form-horizontal"><div id="node-config-dialog-edit-form"></div><!--<div id="node-config-dialog-toolbar" class="form-row"><label><span>Node scope</span></label><select id="node-config-dialog-scope"></select></div>--></form></div>
|
||||
<div id="subflow-dialog" class="hide">
|
||||
<form class="form-horizontal">
|
||||
<div class="form-row">
|
||||
<label for="subflow-input-name" data-i18n="common.label.name"></label><input type="text" id="subflow-input-name">
|
||||
</div>
|
||||
<div class="form-row" style="margin-bottom: 0px;">
|
||||
<label for="subflow-input-info" data-i18n="subflow.info"></label>
|
||||
<a href="https://help.github.com/articles/markdown-basics/" style="font-size: 0.8em; float: right;" data-i18n="[html]subflow.format"></a>
|
||||
</div>
|
||||
<div class="form-row node-text-editor-row">
|
||||
<div style="height: 250px;" class="node-text-editor" id="subflow-input-info-editor"></div>
|
||||
</div>
|
||||
<div class="form-row form-tips" id="subflow-dialog-user-count"></div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div id="node-dialog-confirm-deploy" class="hide">
|
||||
<form class="form-horizontal">
|
||||
<div id="node-dialog-confirm-deploy-config" style="text-align: left; padding-top: 30px;" data-i18n="[prepend]deploy.confirm.improperlyConfigured;[append]deploy.confirm.confirm">
|
||||
@@ -166,6 +151,20 @@
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/x-red" data-template-name="subflow-template">
|
||||
<div class="form-row">
|
||||
<label for="subflow-input-name" data-i18n="common.label.name"></label><input type="text" id="subflow-input-name">
|
||||
</div>
|
||||
<div class="form-row" style="margin-bottom: 0px;">
|
||||
<label for="subflow-input-info" data-i18n="subflow.info"></label>
|
||||
<a href="https://help.github.com/articles/markdown-basics/" style="font-size: 0.8em; float: right;" data-i18n="[html]subflow.format"></a>
|
||||
</div>
|
||||
<div class="form-row node-text-editor-row">
|
||||
<div style="height: 250px;" class="node-text-editor" id="subflow-input-info-editor"></div>
|
||||
</div>
|
||||
<div class="form-row form-tips" id="subflow-dialog-user-count"></div>
|
||||
</script>
|
||||
|
||||
<script src="vendor/vendor.js"></script>
|
||||
<script src="vendor/ace/ace.js"></script>
|
||||
<script src="vendor/ace/ext-language_tools.js"></script>
|
||||
|
||||
Reference in New Issue
Block a user