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

Migrate deploy confirmations to notifications

This commit is contained in:
Nick O'Leary 2018-01-22 23:04:05 +00:00
parent 15f41a2e7c
commit dfebc4b78d
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
5 changed files with 176 additions and 192 deletions

View File

@ -97,113 +97,6 @@ RED.deploy = (function() {
RED.actions.add("core:deploy-flows",save);
$( "#node-dialog-confirm-deploy" ).dialog({
title: RED._('deploy.confirm.button.confirm'),
modal: true,
autoOpen: false,
width: 550,
height: "auto",
buttons: [
{
text: RED._("common.label.cancel"),
click: function() {
$( this ).dialog( "close" );
}
},
{
id: "node-dialog-confirm-deploy-review",
text: RED._("deploy.confirm.button.review"),
class: "primary disabled",
click: function() {
if (!$("#node-dialog-confirm-deploy-review").hasClass('disabled')) {
RED.diff.showRemoteDiff();
$( this ).dialog( "close" );
}
}
},
{
id: "node-dialog-confirm-deploy-merge",
text: RED._("deploy.confirm.button.merge"),
class: "primary disabled",
click: function() {
RED.diff.mergeDiff(currentDiff);
$( this ).dialog( "close" );
}
},
{
id: "node-dialog-confirm-deploy-deploy",
text: RED._("deploy.confirm.button.confirm"),
class: "primary",
click: function() {
var ignoreChecked = $( "#node-dialog-confirm-deploy-hide" ).prop("checked");
if (ignoreChecked) {
ignoreDeployWarnings[$( "#node-dialog-confirm-deploy-type" ).val()] = true;
}
save(true,/conflict/.test($("#node-dialog-confirm-deploy-type" ).val()));
$( this ).dialog( "close" );
}
},
{
id: "node-dialog-confirm-deploy-overwrite",
text: RED._("deploy.confirm.button.overwrite"),
class: "primary",
click: function() {
save(true,/conflict/.test($("#node-dialog-confirm-deploy-type" ).val()));
$( this ).dialog( "close" );
}
}
],
create: function() {
$("#node-dialog-confirm-deploy").parent().find("div.ui-dialog-buttonpane")
.prepend('<div style="height:0; vertical-align: middle; display:inline-block; margin-top: 13px; float:left;">'+
'<input style="vertical-align:top;" type="checkbox" id="node-dialog-confirm-deploy-hide"> '+
'<label style="display:inline;" for="node-dialog-confirm-deploy-hide" data-i18n="deploy.confirm.doNotWarn"></label>'+
'<input type="hidden" id="node-dialog-confirm-deploy-type">'+
'</div>');
},
open: function() {
var deployType = $("#node-dialog-confirm-deploy-type" ).val();
if (/conflict/.test(deployType)) {
$( "#node-dialog-confirm-deploy" ).dialog('option','title', RED._('deploy.confirm.button.review'));
$("#node-dialog-confirm-deploy-deploy").hide();
$("#node-dialog-confirm-deploy-review").addClass('disabled').show();
$("#node-dialog-confirm-deploy-merge").addClass('disabled').show();
$("#node-dialog-confirm-deploy-overwrite").toggle(deployType === "deploy-conflict");
currentDiff = null;
$("#node-dialog-confirm-deploy-conflict-checking").show();
$("#node-dialog-confirm-deploy-conflict-auto-merge").hide();
$("#node-dialog-confirm-deploy-conflict-manual-merge").hide();
var now = Date.now();
RED.diff.getRemoteDiff(function(diff) {
var ellapsed = Math.max(1000 - (Date.now()-now), 0);
currentDiff = diff;
setTimeout(function() {
$("#node-dialog-confirm-deploy-conflict-checking").hide();
var d = Object.keys(diff.conflicts);
if (d.length === 0) {
$("#node-dialog-confirm-deploy-conflict-auto-merge").show();
$("#node-dialog-confirm-deploy-merge").removeClass('disabled')
} else {
$("#node-dialog-confirm-deploy-conflict-manual-merge").show();
}
$("#node-dialog-confirm-deploy-review").removeClass('disabled')
},ellapsed);
})
$("#node-dialog-confirm-deploy-hide").parent().hide();
} else {
$( "#node-dialog-confirm-deploy" ).dialog('option','title', RED._('deploy.confirm.button.confirm'));
$("#node-dialog-confirm-deploy-deploy").show();
$("#node-dialog-confirm-deploy-overwrite").hide();
$("#node-dialog-confirm-deploy-review").hide();
$("#node-dialog-confirm-deploy-merge").hide();
$("#node-dialog-confirm-deploy-hide").parent().show();
}
}
});
RED.events.on('nodes:change',function(state) {
if (state.dirty) {
@ -224,8 +117,9 @@ RED.deploy = (function() {
if (currentRev === null || deployInflight || currentRev === msg.revision) {
return;
}
var message = $('<div>').text(RED._('deploy.confirm.backgroundUpdate'));
var message = $('<p>').text(RED._('deploy.confirm.backgroundUpdate'));
activeNotifyMessage = RED.notify(message,{
modal: true,
fixed: true,
buttons: [
{
@ -276,14 +170,93 @@ RED.deploy = (function() {
}
function resolveConflict(currentNodes, activeDeploy) {
$( "#node-dialog-confirm-deploy-config" ).hide();
$( "#node-dialog-confirm-deploy-unknown" ).hide();
$( "#node-dialog-confirm-deploy-unused" ).hide();
$( "#node-dialog-confirm-deploy-conflict" ).show();
$( "#node-dialog-confirm-deploy-type" ).val(activeDeploy?"deploy-conflict":"background-conflict");
$( "#node-dialog-confirm-deploy" ).dialog( "open" );
}
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">'+
'<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>'+
'</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>'+
'</div>').hide().appendTo(message);
message.i18n();
currentDiff = null;
var buttons = [
{
text: RED._("common.label.cancel"),
click: function() {
conflictNotification.close();
}
},
{
id: "node-dialog-confirm-deploy-review",
text: RED._("deploy.confirm.button.review"),
class: "primary disabled",
click: function() {
if (!$("#node-dialog-confirm-deploy-review").hasClass('disabled')) {
RED.diff.showRemoteDiff();
conflictNotification.close();
}
}
},
{
id: "node-dialog-confirm-deploy-merge",
text: RED._("deploy.confirm.button.merge"),
class: "primary disabled",
click: function() {
if (!$("#node-dialog-confirm-deploy-merge").hasClass('disabled')) {
RED.diff.mergeDiff(currentDiff);
conflictNotification.close();
}
}
}
];
if (activeDeploy) {
buttons.push({
id: "node-dialog-confirm-deploy-overwrite",
text: RED._("deploy.confirm.button.overwrite"),
class: "primary",
click: function() {
save(true,activeDeploy);
conflictNotification.close();
}
})
}
var conflictNotification = RED.notify(message,{
modal: true,
fixed: true,
width: 600,
buttons: buttons
});
var now = Date.now();
RED.diff.getRemoteDiff(function(diff) {
var ellapsed = Math.max(1000 - (Date.now()-now), 0);
currentDiff = diff;
setTimeout(function() {
conflictCheck.hide();
var d = Object.keys(diff.conflicts);
if (d.length === 0) {
conflictAutoMerge.show();
$("#node-dialog-confirm-deploy-merge").removeClass('disabled')
} else {
conflictManualMerge.show();
}
$("#node-dialog-confirm-deploy-review").removeClass('disabled')
},ellapsed);
})
}
function cropList(list) {
if (list.length > 5) {
var remainder = list.length - 5;
list = list.slice(0,5);
list.push(RED._("deploy.confirm.plusNMore",{count:remainder}));
}
return list;
}
function save(skipValidation,force) {
if (!$("#btn-deploy").hasClass("disabled")) {
if (!RED.user.hasPermission("flows.write")) {
@ -319,39 +292,62 @@ RED.deploy = (function() {
}
});
$( "#node-dialog-confirm-deploy-config" ).hide();
$( "#node-dialog-confirm-deploy-unknown" ).hide();
$( "#node-dialog-confirm-deploy-unused" ).hide();
$( "#node-dialog-confirm-deploy-conflict" ).hide();
var showWarning = false;
var notificationMessage;
var notificationButtons = [];
var notification;
if (hasUnknown && !ignoreDeployWarnings.unknown) {
showWarning = true;
$( "#node-dialog-confirm-deploy-type" ).val("unknown");
$( "#node-dialog-confirm-deploy-unknown" ).show();
$( "#node-dialog-confirm-deploy-unknown-list" )
.html("<li>"+unknownNodes.join("</li><li>")+"</li>");
notificationMessage = "<p>"+RED._('deploy.confirm.unknown')+"</p>"+
'<ul class="node-dialog-configm-deploy-list"><li>'+cropList(unknownNodes).join("</li><li>")+"</li></ul><p>"+
RED._('deploy.confirm.confirm')+
"</p>";
notificationButtons= [
{
id: "node-dialog-confirm-deploy-deploy",
text: RED._("deploy.confirm.button.confirm"),
class: "primary",
click: function() {
save(true);
notification.close();
}
}
];
} else if (hasInvalid && !ignoreDeployWarnings.invalid) {
showWarning = true;
$( "#node-dialog-confirm-deploy-type" ).val("invalid");
$( "#node-dialog-confirm-deploy-config" ).show();
invalidNodes.sort(sortNodeInfo);
$( "#node-dialog-confirm-deploy-invalid-list" )
.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>");
notificationMessage = "<p>"+RED._('deploy.confirm.improperlyConfigured')+"</p>"+
'<ul class="node-dialog-configm-deploy-list"><li>'+cropList(invalidNodes.map(function(A) { return (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",
text: RED._("deploy.confirm.button.confirm"),
class: "primary",
click: function() {
save(true);
notification.close();
}
}
];
}
if (showWarning) {
$( "#node-dialog-confirm-deploy-hide" ).prop("checked",false);
$( "#node-dialog-confirm-deploy" ).dialog( "open" );
notificationButtons.unshift(
{
text: RED._("common.label.cancel"),
click: function() {
notification.close();
}
}
);
notification = RED.notify(notificationMessage,{
modal: true,
fixed: true,
buttons:notificationButtons
});
return;
}
}
@ -391,7 +387,7 @@ RED.deploy = (function() {
'<p>'+RED._("deploy.successfulDeploy")+'</p>'+
'<p>'+RED._("deploy.unusedConfigNodes")+' <a href="#" onclick="RED.sidebar.config.show(true); return false;">'+RED._("deploy.unusedConfigNodesLink")+'</a></p>',"success",false,6000);
} else {
RED.notify(RED._("deploy.successfulDeploy"),"success");
RED.notify('<p>'+RED._("deploy.successfulDeploy")+'</p>',"success");
}
RED.nodes.eachNode(function(node) {
if (node.changed) {

View File

@ -74,6 +74,16 @@ RED.notifications = (function() {
if (type) {
n.className = "notification notification-"+type;
}
if (options.width) {
var parentWidth = $("#notifications").width();
if (options.width > parentWidth) {
var margin = -(options.width-parentWidth)/2;
$(n).css({
width: options.width+"px",
marginLeft: margin+"px"
})
}
}
n.style.display = "none";
if (typeof msg === "string") {
n.innerHTML = msg;
@ -84,6 +94,9 @@ RED.notifications = (function() {
var buttonSet = $('<div style="margin-top: 20px;" class="ui-dialog-buttonset"></div>').appendTo(n)
options.buttons.forEach(function(buttonDef) {
var b = $('<button>').html(buttonDef.text).click(buttonDef.click).appendTo(buttonSet);
if (buttonDef.id) {
b.attr('id',buttonDef.id);
}
if (buttonDef.class) {
b.addClass(buttonDef.class);
}
@ -153,6 +166,9 @@ RED.notifications = (function() {
var buttonSet = $('<div style="margin-top: 20px;" class="ui-dialog-buttonset"></div>').appendTo(nn)
options.buttons.forEach(function(buttonDef) {
var b = $('<button>').html(buttonDef.text).click(buttonDef.click).appendTo(buttonSet);
if (buttonDef.id) {
b.attr('id',buttonDef.id);
}
if (buttonDef.class) {
b.addClass(buttonDef.class);
}

View File

@ -515,16 +515,13 @@
}
#node-dialog-confirm-deploy {
.node-dialog-confirm-row {
text-align: left; padding-top: 10px;
}
ul {
ul.node-dialog-configm-deploy-list {
font-size: 0.9em;
width: 400px;
margin: 10px auto;
text-align: left;
}
.node-dialog-confirm-conflict-row {
img {
vertical-align:middle;
@ -544,7 +541,6 @@
display:inline-block;
}
}
}
#node-diff-toolbar-resolved-conflicts .node-diff-status {
margin:0;

View File

@ -82,31 +82,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="node-dialog-confirm-deploy" class="hide">
<form class="form-horizontal">
<div id="node-dialog-confirm-deploy-config" class="node-dialog-confirm-row" data-i18n="[prepend]deploy.confirm.improperlyConfigured;[append]deploy.confirm.confirm">
<ul id="node-dialog-confirm-deploy-invalid-list"></ul>
</div>
<div id="node-dialog-confirm-deploy-unknown" class="node-dialog-confirm-row" data-i18n="[prepend]deploy.confirm.unknown;[append]deploy.confirm.confirm">
<ul id="node-dialog-confirm-deploy-unknown-list"></ul>
</div>
<div id="node-dialog-confirm-deploy-conflict" class="node-dialog-confirm-row">
<div style="margin-left: 40px; margin-bottom: 10px;">
<span data-i18n="deploy.confirm.conflict"></span>
</div>
<div id="node-dialog-confirm-deploy-conflict-checking" class="node-dialog-confirm-conflict-row">
<img src="red/images/spin.svg"/><div data-i18n="deploy.confirm.conflictChecking"></div>
</div>
<div id="node-dialog-confirm-deploy-conflict-auto-merge" class="node-dialog-confirm-conflict-row">
<i style="color: #3a3;" class="fa fa-check"></i><div data-i18n="deploy.confirm.conflictAutoMerge"></div>
</div>
<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>
</div>
</div>
</form>
</div>
<div id="node-dialog-library-save-confirm" class="hide">
<form class="form-horizontal">
<div style="text-align: center; padding-top: 30px;" id="node-dialog-library-save-content">

View File

@ -166,7 +166,8 @@
"backgroundUpdate": "The flows on the server have been updated.",
"conflictChecking": "Checking to see if the changes can be merged automatically",
"conflictAutoMerge": "The changes include no conflicts and can be merged automatically.",
"conflictManualMerge": "The changes include conflicts that must be resolved before they can be deployed."
"conflictManualMerge": "The changes include conflicts that must be resolved before they can be deployed.",
"plusNMore": "+ __count__ more"
}
},
"diff": {