Hawkin
/
arangodb
mirror of https://gitee.com/bigwinds/arangodb
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Added a confirmation dialog before deleting nodes/edges

This commit is contained in:
Michael Hackstein 2014-01-31 13:04:55 +01:00
parent d30585ceb2
commit 46c9b0e83b
2 changed files with 141 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
js/apps/system/aardvark/frontend/js/graphViewer/ui/eventDispatcherControls.js
View File

@ -60,14 +60,6 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
appendToList = function(button) { appendToList = function(button) {
list.appendChild(button); list.appendChild(button);
}, },
createButton = function(title, callback) {
uiComponentsHelper.createButton(
list,
title,
"control_event_" + title,
callback
);
},
createIcon = function(icon, title, callback) { createIcon = function(icon, title, callback) {
var btn = uiComponentsHelper.createIconButton( var btn = uiComponentsHelper.createIconButton(
icon, icon,
@ -201,15 +193,15 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
svgUp = function() { svgUp = function() {
dispatcher.events.CANCELCREATEEDGE(); dispatcher.events.CANCELCREATEEDGE();
edgeShaper.removeCursorFollowingEdge(); edgeShaper.removeCursorFollowingEdge();
dispatcher.bind("svg", "mousemove", function(){});
}; };
callbacks.nodes.startEdge = nodesDown; callbacks.nodes.startEdge = nodesDown;
callbacks.nodes.endEdge = nodesUp; callbacks.nodes.endEdge = nodesUp;
callbacks.svg.cancelEdge = svgUp; callbacks.svg.cancelEdge = svgUp;
}, },
createEditsCBs = function() { createEditsCBs = function() {
var prefix = "control_event_edit", var nodeCallback = function(n) {
idprefix = prefix + "_",
nodeCallback = function(n) {
modalDialogHelper.createModalEditDialog( modalDialogHelper.createModalEditDialog(
"Edit Node " + n._id, "Edit Node " + n._id,
"control_event_node_edit_", "control_event_node_edit_",
@ -236,14 +228,40 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
callbacks.nodes.edit = nodeCallback; callbacks.nodes.edit = nodeCallback;
callbacks.edges.edit = edgeCallback; callbacks.edges.edit = edgeCallback;
}, },
createDeleteCBs = function() { createDeleteCBs = function() {
callbacks.nodes.del = dispatcher.events.DELETENODE( var nodeCallback = function(n) {
function() {} modalDialogHelper.createModalDeleteDialog(
); "Delete Node " + n._id,
callbacks.edges.del = dispatcher.events.DELETEEDGE( "control_event_node_delete_",
function() {} n,
); function(n) {
dispatcher.events.DELETENODE(function() {
$("#control_event_node_delete_modal").modal('hide');
nodeShaper.reshapeNodes();
edgeShaper.reshapeEdges();
})(n);
}
);
},
edgeCallback = function(e) {
modalDialogHelper.createModalDeleteDialog(
"Delete Edge " + e._id,
"control_event_edge_delete_",
e,
function(e) {
dispatcher.events.DELETEEDGE(function() {
$("#control_event_edge_delete_modal").modal('hide');
nodeShaper.reshapeNodes();
edgeShaper.reshapeEdges();
})(e);
}
);
};
callbacks.nodes.del = nodeCallback;
callbacks.edges.del = edgeCallback;
}, },
createSpotCB = function() { createSpotCB = function() {
callbacks.nodes.spot = dispatcher.events.EXPAND; callbacks.nodes.spot = dispatcher.events.EXPAND;
}; };
@ -400,13 +418,7 @@ function EventDispatcherControls(list, nodeShaper, edgeShaper, dispatcherConfig)
this.addControlDelete = function() { this.addControlDelete = function() {
var icon = icons.trash, var icon = icons.trash,
callback = function() { callback = function() {
rebindNodes({click: dispatcher.events.DELETENODE(function() { self.rebindAll(self.deleteRebinds());
})});
rebindEdges({click: dispatcher.events.DELETEEDGE(function() {
})});
rebindSVG();
}; };
createIcon(icon, "delete", callback); createIcon(icon, "delete", callback);
}; };

165
js/apps/system/aardvark/frontend/js/graphViewer/ui/modalDialogHelper.js
View File

@ -84,7 +84,6 @@ var modalDialogHelper = modalDialogHelper || {};
thirdCell.className = "actionCell"; thirdCell.className = "actionCell";
thirdCell.appendChild(addRow); thirdCell.appendChild(addRow);
addRow.id = idprefix + "new"; addRow.id = idprefix + "new";
addRow.className = "graphViewer-icon-button gv-icon-small add"; addRow.className = "graphViewer-icon-button gv-icon-small add";
@ -296,6 +295,65 @@ var modalDialogHelper = modalDialogHelper || {};
for (i = 1; i < list.length; i++) { for (i = 1; i < list.length; i++) {
addNewLine(list[i]); addNewLine(list[i]);
} }
},
modalContent = function(title, idprefix) {
// Create needed Elements
var div = document.createElement("div"),
headerDiv = document.createElement("div"),
buttonDismiss = document.createElement("button"),
header = document.createElement("a"),
bodyDiv = document.createElement("div"),
bodyTable = document.createElement("table");
// Set Classnames and attributes.
div.id = idprefix + "modal";
div.className = "modal hide fade";
div.setAttribute("tabindex", "-1");
div.setAttribute("role", "dialog");
div.setAttribute("aria-labelledby", "myModalLabel");
div.setAttribute("aria-hidden", true);
div.style.display = "none";
div.onhidden = function() {
unbindSubmit();
document.body.removeChild(div);
};
headerDiv.className = "modal-header";
header.className = "arangoHeader";
buttonDismiss.id = idprefix + "modal_dismiss";
buttonDismiss.className = "close";
buttonDismiss.dataDismiss = "modal";
buttonDismiss.ariaHidden = "true";
buttonDismiss.appendChild(document.createTextNode("×"));
header.appendChild(document.createTextNode(title));
bodyDiv.className = "modal-body";
bodyTable.id = idprefix + "table";
// Append in correct ordering
div.appendChild(headerDiv);
div.appendChild(bodyDiv);
headerDiv.appendChild(buttonDismiss);
headerDiv.appendChild(header);
bodyDiv.appendChild(bodyTable);
document.body.appendChild(div);
buttonDismiss.onclick = function() {
unbindSubmit();
$("#" + idprefix + "modal").modal('hide');
};
return {
div: div,
bodyTable: bodyTable
};
}; };
insertModalRow = function(table, idprefix, o) { insertModalRow = function(table, idprefix, o) {
@ -342,49 +400,17 @@ var modalDialogHelper = modalDialogHelper || {};
} }
return tr; return tr;
}; };
modalDialogHelper.modalDivTemplate = function (title, buttonTitle, idprefix, callback) { modalDialogHelper.modalDivTemplate = function (title, buttonTitle, idprefix, callback) {
// Create needed Elements
buttonTitle = buttonTitle || "Switch"; buttonTitle = buttonTitle || "Switch";
var div = document.createElement("div"), var footerDiv = document.createElement("div"),
headerDiv = document.createElement("div"), buttonCancel = document.createElement("button"),
buttonDismiss = document.createElement("button"), buttonSubmit = document.createElement("button"),
header = document.createElement("a"), content = modalContent(title, idprefix);
footerDiv = document.createElement("div"),
buttonCancel = document.createElement("button"),
buttonSubmit = document.createElement("button"),
bodyDiv = document.createElement("div"),
bodyTable = document.createElement("table");
// Set Classnames and attributes.
div.id = idprefix + "modal";
div.className = "modal hide fade";
div.setAttribute("tabindex", "-1");
div.setAttribute("role", "dialog");
div.setAttribute("aria-labelledby", "myModalLabel");
div.setAttribute("aria-hidden", true);
div.style.display = "none";
div.onhidden = function() {
unbindSubmit();
document.body.removeChild(div);
};
headerDiv.className = "modal-header";
header.className = "arangoHeader";
buttonDismiss.id = idprefix + "modal_dismiss";
buttonDismiss.className = "close";
buttonDismiss.dataDismiss = "modal";
buttonDismiss.ariaHidden = "true";
buttonDismiss.appendChild(document.createTextNode("×"));
header.appendChild(document.createTextNode(title));
bodyDiv.className = "modal-body";
bodyTable.id = idprefix + "table";
footerDiv.className = "modal-footer"; footerDiv.className = "modal-footer";
buttonCancel.id = idprefix + "cancel"; buttonCancel.id = idprefix + "cancel";
@ -396,26 +422,11 @@ var modalDialogHelper = modalDialogHelper || {};
buttonSubmit.style.marginRight = "8px"; buttonSubmit.style.marginRight = "8px";
buttonSubmit.appendChild(document.createTextNode(buttonTitle)); buttonSubmit.appendChild(document.createTextNode(buttonTitle));
// Append in correct ordering content.div.appendChild(footerDiv);
div.appendChild(headerDiv);
div.appendChild(bodyDiv);
div.appendChild(footerDiv);
headerDiv.appendChild(buttonDismiss);
headerDiv.appendChild(header);
bodyDiv.appendChild(bodyTable);
footerDiv.appendChild(buttonSubmit); footerDiv.appendChild(buttonSubmit);
footerDiv.appendChild(buttonCancel); footerDiv.appendChild(buttonCancel);
document.body.appendChild(div);
// Add click events // Add click events
buttonDismiss.onclick = function() {
unbindSubmit();
$("#" + idprefix + "modal").modal('hide');
};
buttonCancel.onclick = function() { buttonCancel.onclick = function() {
unbindSubmit(); unbindSubmit();
$("#" + idprefix + "modal").modal('hide'); $("#" + idprefix + "modal").modal('hide');
@ -427,7 +438,7 @@ var modalDialogHelper = modalDialogHelper || {};
}; };
bindSubmit(buttonSubmit); bindSubmit(buttonSubmit);
// Return the table which has to be filled somewhere else // Return the table which has to be filled somewhere else
return bodyTable; return content.bodyTable;
}; };
modalDialogHelper.createModalDialog = function(title, idprefix, objects, callback) { modalDialogHelper.createModalDialog = function(title, idprefix, objects, callback) {
@ -454,9 +465,43 @@ var modalDialogHelper = modalDialogHelper || {};
createDialogWithObject(title, "Create", idprefix, object, callback); createDialogWithObject(title, "Create", idprefix, object, callback);
}; };
modalDialogHelper.createModalViewDialog = function(title, idprefix, object, callback) { modalDialogHelper.createModalViewDialog = function(title, idprefix, object, callback) {
createViewWithObject(title, "Edit", idprefix, object, callback); createViewWithObject(title, "Edit", idprefix, object, callback);
}; };
modalDialogHelper.createModalDeleteDialog = function(title, idprefix, object, callback) {
var footerDiv = document.createElement("div"),
buttonCancel = document.createElement("button"),
buttonSubmit = document.createElement("button"),
content = modalContent(title, idprefix);
footerDiv.className = "modal-footer";
buttonCancel.id = idprefix + "cancel";
buttonCancel.className = "btn btn-close btn-margin";
buttonCancel.appendChild(document.createTextNode("Close"));
buttonSubmit.id = idprefix + "submit";
buttonSubmit.className = "btn btn-danger";
buttonSubmit.style.marginRight = "8px";
buttonSubmit.appendChild(document.createTextNode("Delete"));
content.div.appendChild(footerDiv);
footerDiv.appendChild(buttonSubmit);
footerDiv.appendChild(buttonCancel);
// Add click events
buttonCancel.onclick = function() {
unbindSubmit();
$("#" + idprefix + "modal").modal('hide');
};
buttonSubmit.onclick = function() {
unbindSubmit();
callback(object);
$("#" + idprefix + "modal").modal('hide');
};
bindSubmit(buttonSubmit);
$("#" + idprefix + "modal").modal('show');
};
}()); }());