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

Rework config sidebar and deploy warning

This commit is contained in:
Nick O'Leary 2016-01-12 17:54:53 +00:00
parent de48c1be44
commit 50399c6bfa
9 changed files with 177 additions and 45 deletions

View File

@ -271,6 +271,7 @@ RED.history = (function() {
RED.view.redraw(true);
RED.palette.refresh();
RED.workspaces.refresh();
RED.sidebar.config.refresh();
}
}
}

View File

@ -208,13 +208,13 @@ RED.deploy = (function() {
.html("<li>"+invalidNodes.map(function(A) { return (A.tab?"["+A.tab+"] ":"")+A.label+" ("+A.type+")"}).join("</li><li>")+"</li>");
} else if (hasUnusedConfig && !ignoreDeployWarnings.unusedConfig) {
showWarning = true;
$( "#node-dialog-confirm-deploy-type" ).val("unusedConfig");
$( "#node-dialog-confirm-deploy-unused" ).show();
unusedConfigNodes.sort(sortNodeInfo);
$( "#node-dialog-confirm-deploy-unused-list" )
.html("<li>"+unusedConfigNodes.map(function(A) { return (A.tab?"["+A.tab+"] ":"")+A.label+" ("+A.type+")"}).join("</li><li>")+"</li>");
// showWarning = true;
// $( "#node-dialog-confirm-deploy-type" ).val("unusedConfig");
// $( "#node-dialog-confirm-deploy-unused" ).show();
//
// unusedConfigNodes.sort(sortNodeInfo);
// $( "#node-dialog-confirm-deploy-unused-list" )
// .html("<li>"+unusedConfigNodes.map(function(A) { return (A.tab?"["+A.tab+"] ":"")+A.label+" ("+A.type+")"}).join("</li><li>")+"</li>");
}
if (showWarning) {
$( "#node-dialog-confirm-deploy-hide" ).prop("checked",false);
@ -241,7 +241,12 @@ RED.deploy = (function() {
"Node-RED-Deployment-Type":deploymentType
}
}).done(function(data,textStatus,xhr) {
RED.notify(RED._("deploy.successfulDeploy"),"success");
if (hasUnusedConfig) {
RED.notify(RED._("deploy.successfulDeploy")+
'<p><br>You have some unused configuration nodes. <a href="#" onclick="RED.sidebar.config.show(); return false;" >Click here</a> to see them</p>',"success",false,6000);
} else {
RED.notify(RED._("deploy.successfulDeploy"),"success");
}
RED.nodes.eachNode(function(node) {
if (node.changed) {
node.dirty = true;

View File

@ -363,7 +363,7 @@ RED.palette = (function() {
}
var re = new RegExp(val,'i');
$(".palette_node").each(function(i,el) {
$("#palette-container .palette_node").each(function(i,el) {
var currentLabel = $(el).find(".palette_label").text();
if (val === "" || re.test(el.id) || re.test(currentLabel)) {
$(this).show();

View File

@ -20,10 +20,14 @@ RED.sidebar = (function() {
id:"sidebar-tabs",
onchange:function(tab) {
$("#sidebar-content").children().hide();
$("#sidebar-footer").children().hide();
if (tab.onchange) {
tab.onchange.call(tab);
}
$(tab.content).show();
if (tab.toolbar) {
$(tab.toolbar).show();
}
},
onremove: function(tab) {
$(tab.content).hide();
@ -58,6 +62,11 @@ RED.sidebar = (function() {
$("#sidebar-content").append(options.content);
$(options.content).hide();
if (options.toolbar) {
$("#sidebar-footer").append(options.toolbar);
$(options.toolbar).hide();
}
$(options.content).hide();
var id = options.id;
RED.menu.addItem("menu-item-view-menu",{

View File

@ -19,24 +19,101 @@ RED.sidebar.config = (function() {
var content = document.createElement("div");
content.className = "sidebar-node-config"
$('<div class="palette-category">'+
'<div class="workspace-config-node-tray-header palette-header"><i class="fa fa-angle-down expanded"></i><span data-i18n="sidebar.config.local"></span></div>'+
'<ul id="workspace-config-node-tray-locals" class="palette-content config-node-list"></ul>'+
'</div>'+
'<div class="palette-category">'+
'<div class="workspace-config-node-tray-header palette-header"><i class="fa fa-angle-down expanded"></i><span data-i18n="sidebar.config.global"></span></div>'+
'<ul id="workspace-config-node-tray-globals" class="palette-content config-node-list"></ul>'+
'</div>').appendTo(content);
var toolbar = $('<div id="palette-footer">'+
//'<a class="sidebar-button text-button" id="workspace-config-node-filter-unused" href="#"><i class="fa fa-square-o"></i> <span data-i18n="sidebar.config.filterUnused"></span></a> '+
'<a class="sidebar-button" id="workspace-config-node-collapse-all" href="#"><i class="fa fa-angle-double-up"></i></a> '+
'<a class="sidebar-button" id="workspace-config-node-expand-all" href="#"><i class="fa fa-angle-double-down"></i></a>'+
'</div>');
var flowCategories = $("<div>").appendTo(content);
var subflowCategories = $("<div>").appendTo(content);
var globalCategories = $("<div>").appendTo(content);
var showUnusedOnly = false;
// $('<div class="palette-category">'+
// '<div class="workspace-config-node-tray-header palette-header"><i class="fa fa-angle-down expanded"></i><span data-i18n="sidebar.config.local"></span></div>'+
// '<ul id="workspace-config-node-tray-locals" class="palette-content config-node-list"></ul>'+
// '</div>'+
// '<div class="palette-category">'+
// '<div class="workspace-config-node-tray-header palette-header"><i class="fa fa-angle-down expanded"></i><span data-i18n="sidebar.config.global"></span></div>'+
// '<ul id="workspace-config-node-tray-globals" class="palette-content config-node-list"></ul>'+
// '</div>').appendTo(content);
var categories = {};
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);
if (label) {
$('<span/>').text(label).appendTo(header);
} else {
$('<span data-i18n="sidebar.config.'+name+'">').appendTo(header);
}
category = $('<ul class="palette-content config-node-list"></ul>').appendTo(container);
container.i18n();
var icon = header.find("i");
var result = {
list: category,
size: function() {
return result.list.find("li:not(.config_node_none)").length
},
open: function(snap) {
if (!icon.hasClass("expanded")) {
icon.addClass("expanded");
if (snap) {
result.list.show();
} else {
result.list.slideDown();
}
}
},
close: function(snap) {
if (icon.hasClass("expanded")) {
icon.removeClass("expanded");
if (snap) {
result.list.hide();
} else {
result.list.slideUp();
}
}
}
};
header.on('click', function(e) {
if (icon.hasClass("expanded")) {
result.close();
} else {
result.open();
}
});
categories[name] = result;
}
return categories[name];
}
function createConfigNodeList(id,nodes) {
var category = getOrCreateCategory(id.replace(/\./i,"-"))
var list = category.list;
function createConfigNodeList(nodes,list) {
nodes.sort(function(A,B) {
if (A.type < B.type) { return -1;}
if (A.type > B.type) { return 1;}
return 0;
});
if (showUnusedOnly) {
nodes = nodes.filter(function(n) {
return n.users.length === 0;
})
}
// console.log(list);
list.empty();
if (nodes.length === 0) {
$('<li class="config_node_none" data-i18n="sidebar.config.none">NONE</li>').i18n().appendTo(list);
category.close(true);
} else {
var currentType = "";
nodes.forEach(function(node) {
@ -86,23 +163,44 @@ RED.sidebar.config = (function() {
RED.view.redraw();
});
});
category.open(true);
}
}
function refreshConfigNodeList() {
var validList = {"global":true};
var localConfigNodes = [];
getOrCreateCategory("global",globalCategories);
RED.nodes.eachWorkspace(function(ws) {
validList[ws.id] = true;
getOrCreateCategory(ws.id,flowCategories,ws.label);
})
RED.nodes.eachSubflow(function(sf) {
validList[sf.id] = true;
getOrCreateCategory(sf.id,subflowCategories,sf.name);
})
// $(".workspace-config-node-category").each(function() {
// if (!validList[$(this).attr('id').substring("workspace-config-node-category-".length)]) {
// $(this).remove();
// }
// })
var globalConfigNodes = [];
var configList = {};
RED.nodes.eachConfig(function(cn) {
if (cn.z == RED.workspaces.active()) {
localConfigNodes.push(cn);
if (cn.z) {//} == RED.workspaces.active()) {
configList[cn.z] = configList[cn.z]||[];
configList[cn.z].push(cn);
} else if (!cn.z) {
globalConfigNodes.push(cn);
}
});
createConfigNodeList(localConfigNodes,$("#workspace-config-node-tray-locals"));
createConfigNodeList(globalConfigNodes,$("#workspace-config-node-tray-globals"));
for (var id in validList) {
if (validList.hasOwnProperty(id)) {
createConfigNodeList(id,configList[id]||[]);
}
}
createConfigNodeList('global',globalConfigNodes);
}
function init() {
@ -111,6 +209,7 @@ RED.sidebar.config = (function() {
label: RED._("sidebar.config.label"),
name: RED._("sidebar.config.name"),
content: content,
toolbar: toolbar,
closeable: true,
visible: false,
onchange: function() { refreshConfigNodeList(); }
@ -119,17 +218,36 @@ RED.sidebar.config = (function() {
RED.menu.setAction('menu-item-config-nodes',function() {
RED.sidebar.show('config');
})
$(".workspace-config-node-tray-header").on('click', function(e) {
var icon = $(this).find("i");
if (icon.hasClass("expanded")) {
icon.removeClass("expanded");
$(this).next().slideUp();
} else {
icon.addClass("expanded");
$(this).next().slideDown();
}
$("#workspace-config-node-collapse-all").on("click", function(e) {
e.preventDefault();
for (var cat in categories) {
if (categories.hasOwnProperty(cat)) {
categories[cat].close();
}
}
});
$("#workspace-config-node-expand-all").on("click", function(e) {
e.preventDefault();
for (var cat in categories) {
if (categories.hasOwnProperty(cat)) {
if (categories[cat].size() > 0) {
categories[cat].open();
}
}
}
});
$('#workspace-config-node-filter-unused').on("click",function(e) {
e.preventDefault();
if (showUnusedOnly) {
$(this).find("i").addClass('fa-square-o').removeClass('fa-check-square-o');
} else {
$(this).find("i").removeClass('fa-square-o').addClass('fa-check-square-o');
}
showUnusedOnly = !showUnusedOnly;
refreshConfigNodeList();
})
}
function show() {

View File

@ -28,7 +28,6 @@ RED.workspaces = (function() {
var tabId = RED.nodes.id();
do {
workspaceIndex += 1;
//TODO: nls of Sheet
} while($("#workspace-tabs a[title='"+RED._('workspace.defaultName',{number:workspaceIndex})+"']").size() !== 0);
ws = {type:"tab",id:tabId,label:RED._('workspace.defaultName',{number:workspaceIndex})};

View File

@ -37,7 +37,6 @@
right: 0;
bottom: 25px;
left: 0px;
padding-top: 3px;
overflow-y: auto;
}
@ -66,3 +65,7 @@
#sidebar-footer {
@include component-footer;
}
.sidebar-button {
@include component-footer-button;
}

View File

@ -104,9 +104,6 @@
<div id="node-dialog-confirm-deploy-unknown" style="text-align: left; padding-top: 10px;" data-i18n="[prepend]deploy.confirm.unknown;[append]deploy.confirm.confirm">
<ul style="font-size: 0.9em; width: 400px; margin: 10px auto; text-align: left;" id="node-dialog-confirm-deploy-unknown-list"></ul>
</div>
<div id="node-dialog-confirm-deploy-unused" style="text-align: left; padding-top: 10px;" data-i18n="[prepend]deploy.confirm.unusedConfig;[append]deploy.confirm.confirm">
<ul style="font-size: 0.9em; width: 400px; margin: 10px auto; text-align: left;" id="node-dialog-confirm-deploy-unused-list"></ul>
</div>
</form>
</div>

View File

@ -9,8 +9,8 @@
}
},
"workspace": {
"defaultName": "Sheet __number__",
"renameSheet": "Rename sheet",
"defaultName": "Flow __number__",
"renameSheet": "Rename flow",
"confirmDelete": "Confirm delete",
"delete": "Are you sure you want to delete '__label__'?",
"dropFlowHere": "Drop the flow here"
@ -82,7 +82,8 @@
"modifiedFlowsDesc": "Only deploys flows that contain changed nodes",
"modifiedNodes": "Modified Nodes",
"modifiedNodesDesc": "Only deploys nodes that have changed",
"successfulDeploy": "Successfully Deployed",
"successfulDeploy": "Successfully deployed",
"errors": {
"noResponse": "no response from server"
},
@ -94,7 +95,6 @@
"undeployedChanges": "You have undeployed changes.\n\nLeaving this page will lose these changes.",
"improperlyConfigured": "The workspace contains some nodes that are not properly configured:",
"unknown": "The workspace contains some unknown node types:",
"unusedConfig": "The workspace contains some unused configuration nodes:",
"confirm": "Are you sure you want to deploy?"
}
},
@ -201,11 +201,11 @@
"config": {
"name": "Configuration nodes",
"label": "config",
"local": "on this flow",
"global": "on all flows",
"global": "Global Nodes",
"none": "none",
"subflows": "subflows",
"flows": "flows"
"flows": "flows",
"filterUnused":"show unused only"
}
},
"typedInput": {