1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Rename/Delete tab support

This commit is contained in:
Nicholas O'Leary 2013-10-26 22:29:24 +01:00
parent adc6b44840
commit c810edc10e
4 changed files with 134 additions and 9 deletions

View File

@ -52,7 +52,7 @@
<li class="dropdown-submenu pull-left"><a tabindex="-1" href="#"><i class="icon-th-large"></i> Workspaces</a>
<ul class="dropdown-menu">
<li><a id="btn-workspace-add" tabindex="-1" href="#"><i class="icon-plus"></i> Add</a></li>
<li><a id="btn-workspace-edit" tabindex="-1" href="#"><i class="icon-edit"></i> Edit</a></li>
<li><a id="btn-workspace-edit" tabindex="-1" href="#"><i class="icon-edit"></i> Rename</a></li>
<li><a id="btn-workspace-delete" tabindex="-1" href="#"><i class="icon-minus"></i> Delete</a></li>
<li class="dropdown-submenu pull-left">
<a tabindex="-1" href="#"><i class="icon-share-alt"></i> Switch to...</a>
@ -246,6 +246,21 @@
</div>
</form>
</div>
<div id="node-dialog-rename-workspace" class="hide">
<form class="form-horizontal">
<div class="form-row">
<label for="node-input-workspace-name" ><i class="icon-tag"></i> Name:</label>
<input type="text" id="node-input-workspace-name">
</div>
</form>
</div>
<div id="node-dialog-delete-workspace" class="hide">
<form class="form-horizontal">
<div style="text-align: center; padding-top: 30px;">
Are you sure you want to delete '<span id="node-dialog-delete-workspace-name"></span>'?
</div>
</form>
</div>
<script type="text/x-red" data-template-name="export-clipboard-dialog">
<div class="form-row">

View File

@ -98,7 +98,25 @@ RED.nodes = function() {
function addWorkspace(ws) {
workspaces[ws.id] = ws;
}
function getWorkspace(id) {
return workspaces[id];
}
function removeWorkspace(id) {
delete workspaces[id];
var removedNodes = [];
var removedLinks = [];
for (var n in nodes) {
var node = nodes[n];
if (node.z == id) {
removedNodes.push(node);
}
}
for (var n in removedNodes) {
var rmlinks = removeNode(removedNodes[n].id);
removedLinks = removedLinks.concat(rmlinks);
}
return {nodes:removedNodes,links:removedLinks};
}
function getAllFlowNodes(node) {
var visited = {};
visited[node.id] = true;
@ -226,7 +244,7 @@ RED.nodes = function() {
}
}
if (defaultWorkspace == null) {
defaultWorkspace = { type:"workspace", id:getID(), label:"default" };
defaultWorkspace = { type:"workspace", id:getID(), label:"Workspace 1" };
addWorkspace(defaultWorkspace);
RED.view.addWorkspace(defaultWorkspace);
}
@ -322,6 +340,8 @@ RED.nodes = function() {
remove: removeNode,
removeLink: removeLink,
addWorkspace: addWorkspace,
removeWorkspace: removeWorkspace,
workspace: getWorkspace,
eachNode: function(cb) {
for (var n in nodes) {
cb(nodes[n]);

View File

@ -32,7 +32,7 @@ RED.tabs = function() {
function onTabDblClick() {
if (options.ondblclick) {
options.ondblclick($(this).attr('href'));
options.ondblclick($(this).attr('href').slice(1));
}
}
@ -44,7 +44,7 @@ RED.tabs = function() {
ul.children().removeClass("active");
link.parent().addClass("active");
if (options.onchange) {
options.onchange(link.attr('href'));
options.onchange(link.attr('href').slice(1));
}
}
@ -77,6 +77,18 @@ RED.tabs = function() {
activateTab(link);
}
},
removeTab: function(id) {
var li = ul.find("a[href='#"+id+"']").parent();
if (li.hasClass("active")) {
var tab = li.prev();
if (tab.size() == 0) {
tab = li.next();
}
activateTab(tab.find("a"));
}
li.remove();
},
activateTab: activateTab,
resize: updateTabWidths
}

View File

@ -70,10 +70,10 @@ RED.view = function() {
var workspace_tabs = RED.tabs.create({
id: "workspace-tabs",
onchange: function(id) {
RED.view.setWorkspace(id.slice(1));
RED.view.setWorkspace(id);
},
ondblclick: function(id) {
console.log("DC:",id);
showRenameWorkspaceDialog(id);
},
onadd: function(tab) {
var menuli = $("<li/>");
@ -87,14 +87,28 @@ RED.view = function() {
}
});
var workspaceIndex = 0;
$('#btn-workspace-add').on("click",function() {
var tabId = RED.nodes.id();
var ws = {type:"workspace",id:tabId,label:"Workspace "+tabId};
do {
workspaceIndex += 1;
} while($("#workspace-tabs a[title='Workspace "+workspaceIndex+"']").size() != 0);
var ws = {type:"workspace",id:tabId,label:"Workspace "+workspaceIndex};
RED.nodes.addWorkspace(ws);
workspace_tabs.addTab(ws);
workspace_tabs.activateTab(tabId);
});
$('#btn-workspace-edit').on("click",function() {
showRenameWorkspaceDialog(activeWorkspace);
});
$('#btn-workspace-delete').on("click",function() {
var ws = RED.nodes.workspace(activeWorkspace);
$( "#node-dialog-delete-workspace" ).dialog('option','workspace',ws);
$( "#node-dialog-delete-workspace-name" ).text(ws.label);
$( "#node-dialog-delete-workspace" ).dialog('open');
});
//d3.select(window).on("keydown", keydown);
@ -451,7 +465,6 @@ RED.view = function() {
table += "<tr><td>Type</td><td>&nbsp;"+node.type+"</td></tr>";
table += "<tr><td>ID</td><td>&nbsp;"+node.id+"</td></tr>";
table += "<tr><td>WS</td><td>&nbsp;"+node.z+"</td></tr>";
table += '<tr class="blank"><td colspan="2">&nbsp;Properties</td></tr>';
for (var n in node._def.defaults) {
if ((n != "func")&&(n != "template")) {
@ -984,6 +997,71 @@ RED.view = function() {
$( "#dialog" ).dialog("option","title","Import nodes").dialog( "open" );
}
function showRenameWorkspaceDialog(id) {
var ws = RED.nodes.workspace(id);
$( "#node-dialog-rename-workspace" ).dialog("option","workspace",ws);
$( "#node-input-workspace-name" ).val(ws.label);
$( "#node-dialog-rename-workspace" ).dialog("open");
}
$("#node-dialog-rename-workspace form" ).submit(function(e) { e.preventDefault();});
$( "#node-dialog-rename-workspace" ).dialog({
modal: true,
autoOpen: false,
width: 500,
title: "Rename workspace",
buttons: [
{
text: "Ok",
click: function() {
var workspace = $(this).dialog('option','workspace');
var label = $( "#node-input-workspace-name" ).val();
if (workspace.label != label) {
workspace.label = label;
var link = $("#workspace-tabs a[href='#"+workspace.id+"']");
link.attr("title",label);
link.text(label);
RED.view.dirty(true);
}
$( this ).dialog( "close" );
}
},
{
text: "Cancel",
click: function() {
$( this ).dialog( "close" );
}
}
]
});
$( "#node-dialog-delete-workspace" ).dialog({
modal: true,
autoOpen: false,
width: 500,
title: "Confirm delete",
buttons: [
{
text: "Ok",
click: function() {
var workspace = $(this).dialog('option','workspace');
workspace_tabs.removeTab(workspace.id);
// TODO: make undoable
RED.nodes.removeWorkspace(workspace.id);
RED.view.dirty(true);
$( this ).dialog( "close" );
}
},
{
text: "Cancel",
click: function() {
$( this ).dialog( "close" );
}
}
]
});
return {
state:function(state) {
if (state == null) {