mirror of https://gitee.com/bigwinds/arangodb
292 lines
9.1 KiB
JavaScript
292 lines
9.1 KiB
JavaScript
/*jslint indent: 2, nomen: true, maxlen: 100, white: true plusplus: true */
|
|
/*global document, $, _ */
|
|
|
|
////////////////////////////////////////////////////////////////////////////////
|
|
/// @brief Graph functionality
|
|
///
|
|
/// @file
|
|
///
|
|
/// DISCLAIMER
|
|
///
|
|
/// Copyright 2010-2012 triagens GmbH, Cologne, Germany
|
|
///
|
|
/// 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.
|
|
///
|
|
/// Copyright holder is triAGENS GmbH, Cologne, Germany
|
|
///
|
|
/// @author Michael Hackstein
|
|
/// @author Copyright 2011-2013, triAGENS GmbH, Cologne, Germany
|
|
////////////////////////////////////////////////////////////////////////////////
|
|
|
|
var modalDialogHelper = modalDialogHelper || {};
|
|
|
|
(function dialogHelper() {
|
|
"use strict";
|
|
|
|
var createDialogWithObject = function (title, buttonTitle, idprefix, object, callback) {
|
|
var tableToJSON,
|
|
callbackCapsule = function() {
|
|
callback(tableToJSON);
|
|
},
|
|
table = modalDialogHelper.modalDivTemplate(title, buttonTitle, idprefix, callbackCapsule),
|
|
firstRow = document.createElement("tr"),
|
|
firstCell = document.createElement("th"),
|
|
secondCell = document.createElement("th"),
|
|
thirdCell = document.createElement("th"),
|
|
addRow = document.createElement("button"),
|
|
addImg = document.createElement("img"),
|
|
newCounter = 1,
|
|
insertRow;
|
|
|
|
tableToJSON = function() {
|
|
var result = {};
|
|
_.each($("#" + idprefix + "table tr:not(#first_row)"), function(tr) {
|
|
|
|
var key = $(".keyCell input", tr).val(),
|
|
value = $(".valueCell input", tr).val();
|
|
result[key] = value;
|
|
});
|
|
return result;
|
|
};
|
|
|
|
table.appendChild(firstRow);
|
|
firstRow.id = "first_row";
|
|
firstRow.appendChild(firstCell);
|
|
firstCell.className = "keyCell";
|
|
|
|
firstRow.appendChild(secondCell);
|
|
secondCell.className = "valueCell";
|
|
|
|
firstRow.appendChild(thirdCell);
|
|
|
|
thirdCell.className = "actionCell";
|
|
thirdCell.appendChild(addRow);
|
|
|
|
|
|
addRow.id = idprefix + "new";
|
|
addRow.className = "graphViewer-icon-button";
|
|
|
|
addRow.appendChild(addImg);
|
|
addImg.className = "plusIcon";
|
|
addImg.src = "img/plus_icon.png";
|
|
addImg.width = "16";
|
|
addImg.height = "16";
|
|
|
|
insertRow = function(value, key) {
|
|
var internalRegex = /^_(id|rev|key|from|to)/,
|
|
tr = document.createElement("tr"),
|
|
actTh = document.createElement("th"),
|
|
keyTh = document.createElement("th"),
|
|
valueTh = document.createElement("th"),
|
|
deleteInput,
|
|
keyInput,
|
|
valueInput,
|
|
delImg;
|
|
if (internalRegex.test(key)) {
|
|
return;
|
|
}
|
|
table.appendChild(tr);
|
|
|
|
tr.appendChild(keyTh);
|
|
keyTh.className = "keyCell";
|
|
keyInput = document.createElement("input");
|
|
keyInput.type = "text";
|
|
keyInput.id = idprefix + key + "_key";
|
|
keyInput.value = key;
|
|
keyTh.appendChild(keyInput);
|
|
|
|
|
|
tr.appendChild(valueTh);
|
|
valueTh.className = "valueCell";
|
|
valueInput = document.createElement("input");
|
|
valueInput.type = "text";
|
|
valueInput.id = idprefix + key + "_value";
|
|
if ("object" === typeof value) {
|
|
valueInput.value = JSON.stringify(value);
|
|
} else {
|
|
valueInput.value = value;
|
|
}
|
|
|
|
valueTh.appendChild(valueInput);
|
|
|
|
|
|
tr.appendChild(actTh);
|
|
actTh.className = "actionCell";
|
|
deleteInput = document.createElement("button");
|
|
deleteInput.id = idprefix + key + "_delete";
|
|
deleteInput.className = "graphViewer-icon-button";
|
|
|
|
actTh.appendChild(deleteInput);
|
|
|
|
delImg = document.createElement("img");
|
|
delImg.src = "img/icon_delete.png";
|
|
delImg.width = "16";
|
|
delImg.height = "16";
|
|
|
|
deleteInput.appendChild(delImg);
|
|
|
|
deleteInput.onclick = function() {
|
|
table.removeChild(tr);
|
|
};
|
|
|
|
};
|
|
|
|
addRow.onclick = function() {
|
|
insertRow("", "new_" + newCounter);
|
|
newCounter++;
|
|
};
|
|
|
|
_.each(object, insertRow);
|
|
$("#" + idprefix + "modal").modal('show');
|
|
};
|
|
|
|
|
|
modalDialogHelper.modalDivTemplate = function (title, buttonTitle, idprefix, callback) {
|
|
// Create needed Elements
|
|
|
|
buttonTitle = buttonTitle || "Switch";
|
|
|
|
var div = document.createElement("div"),
|
|
headerDiv = document.createElement("div"),
|
|
buttonDismiss = document.createElement("button"),
|
|
header = document.createElement("h3"),
|
|
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() {
|
|
document.body.removeChild(div);
|
|
};
|
|
|
|
headerDiv.className = "modal-header";
|
|
buttonDismiss.id = idprefix + "modal_dismiss";
|
|
buttonDismiss.className = "close";
|
|
buttonDismiss.dataDismiss = "modal";
|
|
buttonDismiss.ariaHidden = "true";
|
|
buttonDismiss.appendChild(document.createTextNode("x"));
|
|
|
|
header.appendChild(document.createTextNode(title));
|
|
|
|
bodyDiv.className = "modal-body";
|
|
|
|
bodyTable.id = idprefix + "table";
|
|
|
|
footerDiv.className = "modal-footer";
|
|
|
|
buttonCancel.id = idprefix + "cancel";
|
|
buttonCancel.className = "btn btn-danger pull-left";
|
|
buttonCancel.appendChild(document.createTextNode("Cancel"));
|
|
|
|
buttonSubmit.id = idprefix + "submit";
|
|
buttonSubmit.className = "btn btn-success pull-right";
|
|
buttonSubmit.appendChild(document.createTextNode(buttonTitle));
|
|
|
|
// Append in correct ordering
|
|
div.appendChild(headerDiv);
|
|
div.appendChild(bodyDiv);
|
|
div.appendChild(footerDiv);
|
|
|
|
headerDiv.appendChild(buttonDismiss);
|
|
headerDiv.appendChild(header);
|
|
|
|
bodyDiv.appendChild(bodyTable);
|
|
|
|
footerDiv.appendChild(buttonCancel);
|
|
footerDiv.appendChild(buttonSubmit);
|
|
document.body.appendChild(div);
|
|
|
|
// Add click events
|
|
buttonDismiss.onclick = function() {
|
|
$("#" + idprefix + "modal").modal('hide');
|
|
};
|
|
buttonCancel.onclick = function() {
|
|
$("#" + idprefix + "modal").modal('hide');
|
|
};
|
|
buttonSubmit.onclick = function() {
|
|
callback();
|
|
$("#" + idprefix + "modal").modal('hide');
|
|
};
|
|
|
|
// Return the table which has to be filled somewhere else
|
|
return bodyTable;
|
|
};
|
|
|
|
modalDialogHelper.createModalDialog = function(title, idprefix, objects, callback) {
|
|
var table = modalDialogHelper.modalDivTemplate(title, null, idprefix, callback);
|
|
|
|
_.each(objects, function(o) {
|
|
var tr = document.createElement("tr"),
|
|
labelTh = document.createElement("th"),
|
|
contentTh = document.createElement("th"),
|
|
input;
|
|
|
|
table.appendChild(tr);
|
|
tr.appendChild(labelTh);
|
|
labelTh.className = "collectionTh capitalize";
|
|
labelTh.appendChild(document.createTextNode(o.id + ":"));
|
|
tr.appendChild(contentTh);
|
|
contentTh.className = "collectionTh";
|
|
switch(o.type) {
|
|
case "text":
|
|
input = document.createElement("input");
|
|
input.type = "text";
|
|
input.id = idprefix + o.id;
|
|
contentTh.appendChild(input);
|
|
break;
|
|
case "checkbox":
|
|
input = document.createElement("input");
|
|
input.type = "checkbox";
|
|
input.id = idprefix + o.id;
|
|
contentTh.appendChild(input);
|
|
break;
|
|
case "list":
|
|
input = document.createElement("select");
|
|
input.id = idprefix + o.id;
|
|
contentTh.appendChild(input);
|
|
_.each(o.objects, function(entry) {
|
|
var option = document.createElement("option");
|
|
option.value = entry;
|
|
option.appendChild(
|
|
document.createTextNode(entry)
|
|
);
|
|
input.appendChild(option);
|
|
});
|
|
break;
|
|
default:
|
|
//Sorry unknown
|
|
table.removeChild(tr);
|
|
break;
|
|
}
|
|
});
|
|
$("#" + idprefix + "modal").modal('show');
|
|
};
|
|
|
|
modalDialogHelper.createModalEditDialog = function(title, idprefix, object, callback) {
|
|
createDialogWithObject(title, "Edit", idprefix, object, callback);
|
|
};
|
|
|
|
modalDialogHelper.createModalCreateDialog = function(title, idprefix, object, callback) {
|
|
createDialogWithObject(title, "Create", idprefix, object, callback);
|
|
};
|
|
|
|
}()); |