Skip to content

dream
dream
Commit 6679c74b authored by Ioannis Papagiannopoulos's avatar Ioannis Papagiannopoulos
Browse files
Options

static updates to new working version

parent 7475d9a6
Hide whitespace changes
Inline Side-by-side
Showing with 470 additions and 167 deletions
dream/platform/static/dream/inputModule_viewAddInstanceDefinitionDialog.html
View file @ 6679c74b
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Choose Instance</title> <title>Choose Instance</title>
<link rel="stylesheet" href="inputModule_viewAddInstanceDefinitionDialog.css" /> <link rel="stylesheet" href="InputModule_viewAddInstanceDefinitionDialog.css" />
<script src="../lib/rsvp.min.js" type="text/javascript"></script> <script src="../lib/rsvp.min.js" type="text/javascript"></script>
<script src="../lib/handlebars.min.js" type="text/javascript"></script> <script src="../lib/handlebars.min.js" type="text/javascript"></script>
......
dream/platform/static/expandable_field/expandablefield.js
View file @ 6679c74b
...@@ -9,9 +9,8 @@ ...@@ -9,9 +9,8 @@
// Precompile the templates while loading the first gadget instance // Precompile the templates while loading the first gadget instance
var gadget_klass = rJS(window), label_source = gadget_klass.__template_element.getElementById("expand-label-template").innerHTML, label_template = Handlebars.compile(label_source), option_source = gadget_klass.__template_element.getElementById("expand-option-template").innerHTML, option_template = Handlebars.compile(option_source), selected_option_source = gadget_klass.__template_element.getElementById("selected-expand-option-template").innerHTML, selected_option_template = Handlebars.compile(selected_option_source); var gadget_klass = rJS(window), label_source = gadget_klass.__template_element.getElementById("expand-label-template").innerHTML, label_template = Handlebars.compile(label_source), option_source = gadget_klass.__template_element.getElementById("expand-option-template").innerHTML, option_template = Handlebars.compile(option_source), selected_option_source = gadget_klass.__template_element.getElementById("selected-expand-option-template").innerHTML, selected_option_template = Handlebars.compile(selected_option_source);
function syncField(gadget) { function syncField(gadget) {
console.log("SYNCFIELD EXPANDABLEFIELDSET 1"); var i, properties_dict, sub_title, sub_type, in_type, default_value, previous_value, labels = [], lbls, inps = [], inputs, j, recent_occupied = [], recent_occupied_labels = [], prop_name = gadget.props.definition.property_def.title;
var i, properties_dict, sub_title, sub_type, in_type, default_value, previous_value, labels, inps, j, recent_occupied = [], prop_name = gadget.props.definition.property_def.title; console.log("for prop_name syncField");
console.log("for prop_name");
console.log(prop_name); console.log(prop_name);
// set the title of the field // set the title of the field
gadget.props.element.children[1].innerHTML = prop_name; gadget.props.element.children[1].innerHTML = prop_name;
...@@ -26,53 +25,85 @@ ...@@ -26,53 +25,85 @@
if (gadget.props.definition.property_def.properties) { if (gadget.props.definition.property_def.properties) {
properties_dict = gadget.props.definition.property_def.properties; properties_dict = gadget.props.definition.property_def.properties;
gadget.props.element.children[2].style.display = ""; gadget.props.element.children[2].style.display = "";
// XXX assuming that the number of labels inputs = gadget.props.element.children[2].getElementsByTagName("input");
// is the same as the number of inputs for (i = 0; i <= inputs.length - 1; i += 1) {
inps = gadget.props.element.children[2].getElementsByTagName("input"); if (inputs[i].parentNode.parentNode.parentNode === gadget.props.element.children[2]) {
labels = gadget.props.element.children[2].getElementsByTagName("label"); inps.push(inputs[i]);
}
}
lbls = gadget.props.element.children[2].getElementsByTagName("label");
for (i = 0; i <= lbls.length - 1; i += 1) {
if (lbls[i].parentNode === gadget.props.element.children[2]) {
labels.push(lbls[i]);
}
}
for (i = 0; i <= Object.keys(properties_dict).length - 1; i += 1) { for (i = 0; i <= Object.keys(properties_dict).length - 1; i += 1) {
sub_title = Object.keys(properties_dict)[i]; sub_title = Object.keys(properties_dict)[i];
console.log("sub_title"); console.log("sub_title");
console.log(sub_title); console.log(sub_title);
sub_type = properties_dict[sub_title].type; sub_type = properties_dict[sub_title].type;
// if the gadget contains expandable inputs (allOf)
// find the labels of that inputs
if (properties_dict[sub_title].allOf) {
for (j = 0; j <= labels.length - 1; j += 1) {
if (labels[j].getAttribute("for").split("_")[0] === "allOf") {
if (!(recent_occupied_labels.indexOf(labels[j]) > -1)) {
labels[j].innerHTML = sub_title;
recent_occupied_labels.push(labels[j]);
break;
}
}
}
}
default_value = properties_dict[sub_title].default; default_value = properties_dict[sub_title].default;
// previous value // previous value
if (gadget.props.options.value[prop_name]) { if (gadget.props.options.value[prop_name]) {
previous_value = gadget.props.options.value[prop_name][sub_title]; previous_value = gadget.props.options.value[prop_name][sub_title];
} }
for (j = 0; j <= inps.length - 1; j += 1) { for (j = 0; j <= inps.length - 1; j += 1) {
// if the element is not already occupied // check if the input is one of a sub-gadget
if (!(recent_occupied.indexOf(inps[j]) > -1)) { // do not proceed if yes
if (inps[j].getAttribute("type")) { if (inps[j].parentNode.parentNode.parentNode === gadget.props.element.children[2]) {
// XXX hardcoded value for string input // if the element is not already occupied
// as text is used in HTML if (!(recent_occupied.indexOf(inps[j]) > -1)) {
if (sub_type === "string") { if (inps[j].getAttribute("type")) {
in_type = "text"; // XXX hardcoded value for string input
} // as text is used in HTML
if (inps[j].getAttribute("type") === sub_type || inps[j].getAttribute("type") === in_type) { if (sub_type === "string") {
inps[j].setAttribute("name", sub_title); in_type = "text";
inps[j].setAttribute("title", sub_title); }
// if the input type is text then undefined --> "" if (inps[j].getAttribute("type") === sub_type || inps[j].getAttribute("type") === in_type) {
if (inps[j].getAttribute("type") === "text" && default_value === undefined) { inps[j].setAttribute("name", sub_title);
default_value = ""; inps[j].setAttribute("title", sub_title);
// if the input type is text then undefined --> ""
if (inps[j].getAttribute("type") === "text" && default_value === undefined) {
default_value = "";
}
inps[j].setAttribute("value", previous_value === undefined ? default_value : previous_value);
recent_occupied.push(inps[j]);
// find the label for that input
inps[j].parentNode.parentNode.previousSibling.previousSibling.innerHTML = sub_title;
recent_occupied_labels.push(inps[j].parentNode.parentNode.previousSibling.previousSibling);
// present them
inps[j].parentNode.parentNode.previousSibling.previousSibling.style.display = "";
inps[j].parentNode.parentNode.style.display = "";
break;
} }
inps[j].setAttribute("value", previous_value === undefined ? default_value : previous_value);
labels[j].innerHTML = sub_title;
labels[j].setAttribute("for", sub_title);
recent_occupied.push(inps[j]);
// present them
inps[j].parentNode.parentNode.style.display = "";
labels[j].style.display = "";
break;
} }
} }
} }
} }
} }
// hiding the inps that are not occupied
for (j = 0; j <= inps.length - 1; j += 1) { for (j = 0; j <= inps.length - 1; j += 1) {
if (!(recent_occupied.indexOf(inps[j]) > -1)) { if (!(recent_occupied.indexOf(inps[j]) > -1)) {
inps[j].parentNode.parentNode.style.display = "block"; inps[j].parentNode.parentNode.style.display = "block";
inps[j].parentNode.parentNode.style.display = "none"; inps[j].parentNode.parentNode.style.display = "none";
}
}
// hiding the labels that are not occupied
for (j = 0; j <= labels.length - 1; j += 1) {
if (!(recent_occupied_labels.indexOf(labels[j]) > -1)) {
labels[j].style.display = "block"; labels[j].style.display = "block";
labels[j].style.display = "none"; labels[j].style.display = "none";
} }
...@@ -139,6 +170,13 @@ ...@@ -139,6 +170,13 @@
"for": property_id, "for": property_id,
name: property_definition.name || property_id name: property_definition.name || property_id
})); }));
if (property_definition.allOf) {
// if there is type property then remove it
if (property_definition.allOf[0].type) {
delete property_definition.allOf[0].type;
}
return gadget.declareGadget("../expandable_field/index.html");
}
if (property_definition.type === "object") { if (property_definition.type === "object") {
// Create a recursive fieldset for this key. // Create a recursive fieldset for this key.
return gadget.declareGadget("../fieldset/index.html"); return gadget.declareGadget("../fieldset/index.html");
...@@ -189,7 +227,7 @@ ...@@ -189,7 +227,7 @@
// fields of type object are assumed to be all the same // fields of type object are assumed to be all the same
//////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////
function findRequestedTypes(oneOf_list) { function findRequestedTypes(oneOf_list) {
var prop_dict, prop_list, prop_type_list, x, search_item, req_props_dlist = [], req_props_slist = [], // req_props_sdict = {}, var prop_dict, prop_list, prop_type_list, x, search_item, search_item_def, req_props_dlist = [], req_props_slist = [], // req_props_sdict = {},
counter, y, handleReduce = function(previous, current) { counter, y, handleReduce = function(previous, current) {
return previous > current ? previous : current; return previous > current ? previous : current;
}; };
...@@ -211,31 +249,39 @@ ...@@ -211,31 +249,39 @@
// the same definition // the same definition
//////////////////////////////////////////////////////// ////////////////////////////////////////////////////////
for (x = 0; x <= prop_list.length - 1; x += 1) { for (x = 0; x <= prop_list.length - 1; x += 1) {
search_item = prop_dict[prop_list[x]].type; search_item = prop_dict[prop_list[x]].allOf ? "allOf" : prop_dict[prop_list[x]].type;
prop_type_list.push(search_item); search_item_def = prop_dict[prop_list[x]] || "";
prop_type_list.push([ search_item, search_item_def ]);
if (req_props_slist.indexOf(search_item) === -1) { if (req_props_slist.indexOf(search_item) === -1) {
// list of unique requested properties // list of unique requested properties
req_props_slist.push(prop_dict[prop_list[x]].type); req_props_slist.push(search_item);
} }
} }
// array of requested type-arrays for each different item // array of requested type-arrays for each different item
req_props_dlist.push(prop_type_list); req_props_dlist.push(prop_type_list);
} }
} }
console.log("array of requested type-arrays for each item");
console.log(req_props_dlist);
///////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////
// find the maximum number of appearances // find the maximum number of appearances
// for each requested type within req_props_dlist // for each requested type within req_props_dlist
///////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////
for (x = 0; x <= req_props_slist.length - 1; x += 1) { for (x = 0; x <= req_props_slist.length - 1; x += 1) {
req_props_sdict[req_props_slist[x]] = []; req_props_sdict[req_props_slist[x]] = {
number: [],
definition: {}
};
for (ind = 0; ind <= req_props_dlist.length - 1; ind += 1) { for (ind = 0; ind <= req_props_dlist.length - 1; ind += 1) {
counter = 0; counter = 0;
for (y = 0; y <= req_props_dlist[ind].length - 1; y += 1) { for (y = 0; y <= req_props_dlist[ind].length - 1; y += 1) {
if (req_props_slist[x] === req_props_dlist[ind][y]) { if (req_props_slist[x] === req_props_dlist[ind][y][0]) {
counter += 1; counter += 1;
search_item_def = req_props_dlist[ind][y][1];
} }
} }
req_props_sdict[req_props_slist[x]].push(counter); req_props_sdict[req_props_slist[x]].number.push(counter);
req_props_sdict[req_props_slist[x]].definition = search_item_def;
} }
} }
for (ind = 0; ind <= Object.keys(req_props_sdict).length - 1; ind += 1) { for (ind = 0; ind <= Object.keys(req_props_sdict).length - 1; ind += 1) {
...@@ -246,7 +292,7 @@ ...@@ -246,7 +292,7 @@
// find the maximum number within the array // find the maximum number within the array
// and replace the array itself // and replace the array itself
//////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////
req_props_sdict[Object.keys(req_props_sdict)[ind]] = req_props_sdict[Object.keys(req_props_sdict)[ind]].reduce(handleReduce); req_props_sdict[Object.keys(req_props_sdict)[ind]].number = req_props_sdict[Object.keys(req_props_sdict)[ind]].number.reduce(handleReduce);
} }
console.log("req_props_sdict"); console.log("req_props_sdict");
console.log(req_props_sdict); console.log(req_props_sdict);
...@@ -283,14 +329,18 @@ ...@@ -283,14 +329,18 @@
}; };
for (ind = 0; ind <= Object.keys(req_props_sdict).length - 1; ind += 1) { for (ind = 0; ind <= Object.keys(req_props_sdict).length - 1; ind += 1) {
// create an abstract property definition (updated later) // create an abstract property definition (updated later)
for (w = 0; w <= req_props_sdict[Object.keys(req_props_sdict)[ind]] - 1; w += 1) { for (w = 0; w <= req_props_sdict[Object.keys(req_props_sdict)[ind]].number - 1; w += 1) {
ab_title = Object.keys(req_props_sdict)[ind] + "_" + w; ab_title = Object.keys(req_props_sdict)[ind] + "_" + w;
ab_definition.properties[ab_title] = { if (req_props_sdict[Object.keys(req_props_sdict)[ind]].definition.allOf) {
type: Object.keys(req_props_sdict)[ind], ab_definition.properties[ab_title] = req_props_sdict[Object.keys(req_props_sdict)[ind]].definition;
"default": "", } else {
description: "", ab_definition.properties[ab_title] = {
required: true type: Object.keys(req_props_sdict)[ind],
}; "default": "",
description: "",
required: true
};
}
} }
} }
console.log("abstract_definition for " + index); console.log("abstract_definition for " + index);
...@@ -404,13 +454,22 @@ ...@@ -404,13 +454,22 @@
} }
} }
for (ind = sel_ind; ind <= gadget.props.element.children.length - 1; ind += 1) { for (ind = sel_ind; ind <= gadget.props.element.children.length - 1; ind += 1) {
console.log("hiding :"); console.log("hiding all the children as the service starts:");
gadget.props.element.children[ind].style.display = "block"; gadget.props.element.children[ind].style.display = "block";
gadget.props.element.children[ind].style.display = "none"; gadget.props.element.children[ind].style.display = "none";
} }
}).push(function() { }).push(function() {
console.log("STARTSERVICE EXPANDFIELD 1"); console.log("STARTSERVICE EXPANDFIELD 1");
syncField(gadget); syncField(gadget);
}).push(function() {
var i, promise_list = [];
for (i = 0; i < gadget.props.field_gadget_list.length; i += 1) {
if (gadget.props.field_gadget_list[i].startService) {
promise_list.push(gadget.props.field_gadget_list[i].startService());
}
}
console.log("thr r " + promise_list.length + " subgadget promises");
return RSVP.all(promise_list);
}).push(function() { }).push(function() {
waitForListFieldSelection(gadget); waitForListFieldSelection(gadget);
}); });
......
dream/platform/static/fieldset/fieldset.js
View file @ 6679c74b
...@@ -41,6 +41,10 @@ ...@@ -41,6 +41,10 @@
} }
return gadget.declareGadget("../expandable_field/index.html"); return gadget.declareGadget("../expandable_field/index.html");
} }
if (property_definition.properties) {
// Create a recursive fieldset for this key.
return gadget.declareGadget("../fieldset/index.html");
}
if (property_definition.type === "object") { if (property_definition.type === "object") {
// Create a recursive fieldset for this key. // Create a recursive fieldset for this key.
return gadget.declareGadget("../fieldset/index.html"); return gadget.declareGadget("../fieldset/index.html");
...@@ -73,16 +77,19 @@ ...@@ -73,16 +77,19 @@
}, node_id); }, node_id);
} }
Object.keys(options.property_definition.properties).forEach(function(property_name) { Object.keys(options.property_definition.properties).forEach(function(property_name) {
var property_definition = options.property_definition.properties[property_name], value = property_definition.default, i = 0, property; var property_definition = options.property_definition.properties[property_name], value, i = 0, property;
if (property_definition.allOf) { if (property_definition) {
if (property_definition.allOf[0].properties) { value = property_definition.default || {};
for (property in property_definition.allOf[0].properties) { if (property_definition.allOf) {
if (property_definition.allOf[0].properties.hasOwnProperty(property)) { if (property_definition.allOf[0].properties) {
i += 1; for (property in property_definition.allOf[0].properties) {
if (i > 1) { if (property_definition.allOf[0].properties.hasOwnProperty(property)) {
console.log("something is wrong!"); i += 1;
if (i > 1) {
console.log("something is wrong!");
}
value = property_definition.allOf[0].properties[property].default;
} }
value = property_definition.allOf[0].properties[property].default;
} }
} }
} }
......
dream/platform/static/jsplumb/index.html
View file @ 6679c74b
...@@ -24,9 +24,9 @@ ...@@ -24,9 +24,9 @@
</script> </script>
<template id="popup-edit-template"> <template id="popup-edit-template">
<div id="node-edit-popup" data-position-to="origin"> <div id="edit-popup" data-position-to="origin">
<div data-role="header" data-theme="a"> <div data-role="header" data-theme="a">
<h1 class="node_class">Node edition</h1> <h1 class="node_class">Edit properties</h1>
<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a> <a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
</div> </div>
<br/> <br/>
......
dream/platform/static/jsplumb/jsplumb.js
View file @ 6679c74b
...@@ -30,9 +30,9 @@ ...@@ -30,9 +30,9 @@
* accept ERP5 format * accept ERP5 format
* auto springy layout * auto springy layout
* drop zoom level * drop zoom level
* edge edit popup on click
* rename draggable() * rename draggable()
* somehow choose edge class on connect * allow changing node and edge class
* factorize node & edge popup edition
*/ */
/*jslint nomen: true */ /*jslint nomen: true */
var gadget_klass = rJS(window), node_template_source = gadget_klass.__template_element.getElementById("node-template").innerHTML, node_template = Handlebars.compile(node_template_source), popup_edit_template = gadget_klass.__template_element.getElementById("popup-edit-template"), domParser = new DOMParser(); var gadget_klass = rJS(window), node_template_source = gadget_klass.__template_element.getElementById("node-template").innerHTML, node_template = Handlebars.compile(node_template_source), popup_edit_template = gadget_klass.__template_element.getElementById("popup-edit-template"), domParser = new DOMParser();
...@@ -99,12 +99,21 @@ ...@@ -99,12 +99,21 @@
} }
return "DreamNode_" + n; return "DreamNode_" + n;
} }
function updateConnectionData(gadget, connection, remove, edge_data) { function getDefaultEdgeClass(gadget) {
// TODO: use first edge class available in class_definition
return "Dream.Edge";
}
function updateConnectionData(gadget, connection, remove) {
if (connection.ignoreEvent) {
// this hack is for edge edition. Maybe there I missed one thing and
// there is a better way.
return;
}
if (remove) { if (remove) {
delete gadget.props.data.graph.edge[connection.id]; delete gadget.props.data.graph.edge[connection.id];
} else { } else {
edge_data = edge_data || { var edge_data = gadget.props.data.graph.edge[connection.id] || {
_class: "Dream.Edge" _class: getDefaultEdgeClass(gadget)
}; };
edge_data.source = getNodeId(gadget, connection.sourceId); edge_data.source = getNodeId(gadget, connection.sourceId);
edge_data.destination = getNodeId(gadget, connection.targetId); edge_data.destination = getNodeId(gadget, connection.targetId);
...@@ -112,34 +121,12 @@ ...@@ -112,34 +121,12 @@
} }
gadget.notifyDataChanged(); gadget.notifyDataChanged();
} }
function waitForConnection(gadget) {
loopJsplumbBind(gadget, "connection", function(info, originalEvent) {
updateConnectionData(gadget, info.connection);
});
}
function waitForConnectionDetached(gadget) {
loopJsplumbBind(gadget, "connectionDetached", function(info, originalEvent) {
updateConnectionData(gadget, info.connection, true);
});
}
function waitForConnectionClick(gadget) {
// TODO: dialog to edit connection properties
loopJsplumbBind(gadget, "click", function(connection) {
if (confirm("Delete connection ?")) {
gadget.props.jsplumb_instance.detach(connection);
}
});
}
function convertToAbsolutePosition(gadget, x, y) { function convertToAbsolutePosition(gadget, x, y) {
var zoom_level = gadget.props.zoom_level * 1.1111, canvas_size_x = $(gadget.props.main).width(), canvas_size_y = $(gadget.props.main).height(), //canvas_size_x = $(gadget.props.element).find('#main').width(), var zoom_level = gadget.props.zoom_level * 1.1111, canvas_size_x = $(gadget.props.main).width(), canvas_size_y = $(gadget.props.main).height(), size_x = $(gadget.props.element).find(".dummy_window").width() * zoom_level, size_y = $(gadget.props.element).find(".dummy_window").height() * zoom_level, top = Math.floor(y * (canvas_size_y - size_y)) + "px", left = Math.floor(x * (canvas_size_x - size_x)) + "px";
//canvas_size_y = $(gadget.props.element).find('#main').height(),
size_x = $(gadget.props.element).find(".dummy_window").width() * zoom_level, size_y = $(gadget.props.element).find(".dummy_window").height() * zoom_level, top = Math.floor(y * (canvas_size_y - size_y)) + "px", left = Math.floor(x * (canvas_size_x - size_x)) + "px";
return [ left, top ]; return [ left, top ];
} }
function convertToRelativePosition(gadget, x, y) { function convertToRelativePosition(gadget, x, y) {
var zoom_level = gadget.props.zoom_level * 1.1111, canvas_size_x = $(gadget.props.main).width(), canvas_size_y = $(gadget.props.main).height(), //canvas_size_x = $(gadget.props.element).find('#main').width(), var zoom_level = gadget.props.zoom_level * 1.1111, canvas_size_x = $(gadget.props.main).width(), canvas_size_y = $(gadget.props.main).height(), size_x = $(gadget.props.element).find(".dummy_window").width() * zoom_level, size_y = $(gadget.props.element).find(".dummy_window").height() * zoom_level, top = Math.max(Math.min(y.replace("px", "") / (canvas_size_y - size_y), 1), 0), left = Math.max(Math.min(x.replace("px", "") / (canvas_size_x - size_x), 1), 0);
//canvas_size_y = $(gadget.props.element).find('#main').height(),
size_x = $(gadget.props.element).find(".dummy_window").width() * zoom_level, size_y = $(gadget.props.element).find(".dummy_window").height() * zoom_level, top = Math.max(Math.min(y.replace("px", "") / (canvas_size_y - size_y), 1), 0), left = Math.max(Math.min(x.replace("px", "") / (canvas_size_x - size_x), 1), 0);
return [ left, top ]; return [ left, top ];
} }
function updateElementCoordinate(gadget, node_id, coordinate) { function updateElementCoordinate(gadget, node_id, coordinate) {
...@@ -153,7 +140,6 @@ ...@@ -153,7 +140,6 @@
top: relative_position[1] top: relative_position[1]
}; };
} }
//gadget.props.data.graph.main_graph.node[node_id].coordinate = coordinate;
gadget.props.data.graph.node[node_id].coordinate = coordinate; gadget.props.data.graph.node[node_id].coordinate = coordinate;
gadget.notifyDataChanged(); gadget.notifyDataChanged();
return coordinate; return coordinate;
...@@ -197,24 +183,6 @@ ...@@ -197,24 +183,6 @@
element.css(j, new_value); element.css(j, new_value);
}); });
} }
// function redraw(gadget) {
// var coordinates = gadget.props.preference_container.coordinates || {},
// absolute_position,
// element;
// $.each(coordinates, function (node_id, v) {
// absolute_position = convertToAbsolutePosition(
// gadget,
// v.left,
// v.top
// );
// element = $(gadget.props.element).find(
// '#' + gadget.props.node_id_to_dom_element_id[node_id];
// );
// element.css('top', absolute_position[1]);
// element.css('left', absolute_position[0]);
// gadget.props.jsplumb_instance.repaint(element);
// });
// }
// function positionGraph(gadget) { // function positionGraph(gadget) {
// $.ajax( // $.ajax(
// '/positionGraph', // '/positionGraph',
...@@ -245,7 +213,6 @@ ...@@ -245,7 +213,6 @@
gadget.props.jsplumb_instance.removeAllEndpoints($(gadget.props.element).find("#" + element_id)); gadget.props.jsplumb_instance.removeAllEndpoints($(gadget.props.element).find("#" + element_id));
$(gadget.props.element).find("#" + element_id).remove(); $(gadget.props.element).find("#" + element_id).remove();
delete gadget.props.data.graph.node[node_id]; delete gadget.props.data.graph.node[node_id];
//delete gadget.props.data.graph.main_graph.node[node_id];
delete gadget.props.node_id_to_dom_element_id[node_id]; delete gadget.props.node_id_to_dom_element_id[node_id];
//$.each(gadget.props.data.graph.main_graph.node, function (k, v) { //$.each(gadget.props.data.graph.main_graph.node, function (k, v) {
$.each(gadget.props.data.graph.edge, function(k, v) { $.each(gadget.props.data.graph.edge, function(k, v) {
...@@ -261,16 +228,12 @@ ...@@ -261,16 +228,12 @@
var element_id = gadget.props.node_id_to_dom_element_id[node_id], new_id = data.id; var element_id = gadget.props.node_id_to_dom_element_id[node_id], new_id = data.id;
if (data.data.name) { if (data.data.name) {
$(gadget.props.element).find("#" + element_id).text(data.data.name).attr("title", data.data.name).append('<div class="ep"></div></div>'); $(gadget.props.element).find("#" + element_id).text(data.data.name).attr("title", data.data.name).append('<div class="ep"></div></div>');
//gadget.props.data.graph.main_graph.node[node_id].name = data.data.name;
gadget.props.data.graph.node[node_id].name = data.data.name; gadget.props.data.graph.node[node_id].name = data.data.name;
} }
delete data.id; delete data.id;
//$.extend(gadget.props.data.graph.main_graph.node[node_id], data.data); //$.extend(gadget.props.data.graph.main_graph.node[node_id], data.data);
$.extend(gadget.props.data.graph.node[node_id], data.data); $.extend(gadget.props.data.graph.node[node_id], data.data);
if (new_id && new_id !== node_id) { if (new_id && new_id !== node_id) {
//gadget.props.data.graph.main_graph.node[new_id]
// = gadget.props.data.graph.main_graph.node[node_id];
//delete gadget.props.data.graph.main_graph.node[node_id];
gadget.props.data.graph.node[new_id] = gadget.props.data.graph.node[node_id]; gadget.props.data.graph.node[new_id] = gadget.props.data.graph.node[node_id];
delete gadget.props.data.graph.node[node_id]; delete gadget.props.data.graph.node[node_id];
gadget.props.node_id_to_dom_element_id[new_id] = gadget.props.node_id_to_dom_element_id[node_id]; gadget.props.node_id_to_dom_element_id[new_id] = gadget.props.node_id_to_dom_element_id[node_id];
...@@ -330,90 +293,352 @@ ...@@ -330,90 +293,352 @@
overlays: overlays overlays: overlays
}); });
} }
// set data for 'connection' event that will be called "later"
gadget.props.data.graph.edge[edge_id] = edge_data;
// jsplumb assigned an id, but we are controlling ids ourselves. // jsplumb assigned an id, but we are controlling ids ourselves.
connection.id = edge_id; connection.id = edge_id;
} }
/* function expandSchema(class_definition, full_schema) {
// minimal expanding of json schema, supports merging allOf and $ref
// references
// TODO: check for a library that would provide full support
var property, referenced, i, j, len,
expanded_class_definition = {properties:
class_definition.properties || {}},
ref_word_list, ref_word, ref_definition_list,
ref_definition_word, ref_definition_root, ref_definition,
sub_ref_def, sub_ref_def_list,
sub_ref_def_word, sub_ref_def_root, prop;
console.log("expandSCHEMA 1");
console.log(class_definition);
console.log(full_schema);
console.log(expanded_class_definition);
if (class_definition.allOf) {
for (i = 0; i < class_definition.allOf.length; i += 1) {
referenced = class_definition.allOf[i];
if (referenced.$ref) {
ref_word_list = referenced.$ref.split("/");
ref_word = ref_word_list[ref_word_list.length-1];
referenced = expandSchema(
full_schema.class_definition[ref_word],
full_schema);
}
// console.log(full_schema.class_definition.definitions);
if (referenced.properties) {
console.log("[[[[[[[[[[]]]]]]]]]]");
console.log(referenced.properties);
for (property in referenced.properties) {
if (referenced.properties.hasOwnProperty(property)) {
if (referenced.properties[property].type ||
referenced.properties[property].$ref) {
console.log("..");
console.log(property);
console.log(referenced.properties[property]);
if (referenced.properties[property].$ref) {
ref_definition_list
= referenced.properties[property].$ref.split("/");
ref_definition_word
= ref_definition_list[ref_definition_list.length-1];
ref_definition
= full_schema.class_definition
.definitions[ref_definition_word];
if (ref_definition.allOf) {
if (ref_definition.allOf[1].oneOf) {
len = ref_definition.allOf[1].oneOf.length - 1;
for (j = 0; j <= len; j += 1) {
if (ref_definition.allOf[1]
.oneOf[j].$ref) {
sub_ref_def_list = ref_definition.allOf[1]
.oneOf[j].$ref.split("/");
sub_ref_def_word
= sub_ref_def_list[sub_ref_def_list.length-1];
sub_ref_def_root
= sub_ref_def_list[sub_ref_def_list.length-2];
sub_ref_def = full_schema.class_definition
.definitions[sub_ref_def_root][sub_ref_def_word];
ref_definition.allOf[1].oneOf[j] = sub_ref_def;
}
}
}
}
expanded_class_definition.properties[property]
= ref_definition;
//console.log("for property " + property + ", definition:");
//console.log(ref_definition);
} else {
if (referenced.properties[property].properties) {
console.log("not a reference");
console.log(referenced.properties[property].properties);
for (prop in referenced.properties[property]
.properties) {
if (referenced.properties[property]
.properties.hasOwnProperty(prop)) {
console.log(7);
console.log(prop);
console.log(referenced.properties[property]
.properties[prop]);
if (referenced.properties[property]
.properties[prop].$ref) {
console.log("!!!!");
ref_definition_list
= referenced.properties[property]
.properties[prop].$ref.split("/");
console.log(ref_definition_list);
ref_definition_word
= ref_definition_list[
ref_definition_list.length-1
];
console.log(ref_definition_word);
ref_definition_root
= ref_definition_list[
ref_definition_list.length-2
];
console.log(ref_definition_root);
ref_definition = full_schema
.class_definition[
ref_definition_root
][ref_definition_word];
console.log(ref_definition);
if (ref_definition.allOf) {
if (ref_definition.allOf[1].oneOf) {
len = ref_definition.allOf[1].oneOf.length - 1;
for (j = 0; j <= len; j += 1) {
if (ref_definition.allOf[1]
.oneOf[j].$ref) {
sub_ref_def_list = ref_definition.allOf[1]
.oneOf[j].$ref.split("/");
sub_ref_def_word
= sub_ref_def_list[
sub_ref_def_list.length-1
];
sub_ref_def_root
= sub_ref_def_list[
sub_ref_def_list.length-2
];
sub_ref_def = full_schema.class_definition
.definitions[
sub_ref_def_root
][sub_ref_def_word];
ref_definition.allOf[1].oneOf[j]
= sub_ref_def;
}
}
}
}
referenced.properties[property].properties[prop]
= ref_definition;
}
}
}
}
expanded_class_definition.properties[property]
= referenced.properties[property];
}
}
}
}
}
}
}
// console.log("expandSCHEMA 2");
// console.log(expanded_class_definition);
return expanded_class_definition;
} */
function expandOneOf(definition, fullSchema) {
var j, len = definition.allOf[1].oneOf.length - 1, def_ref_list, def_ref_word, def_ref_root, referenced_def;
for (j = 0; j <= len; j += 1) {
if (definition.allOf[1].oneOf[j].$ref) {
def_ref_list = definition.allOf[1].oneOf[j].$ref.split("/");
def_ref_word = def_ref_list[def_ref_list.length - 1];
def_ref_root = def_ref_list[def_ref_list.length - 2];
referenced_def = fullSchema.class_definition.definitions[def_ref_root][def_ref_word];
definition.allOf[1].oneOf[j] = referenced_def;
}
}
return definition;
}
function expandReference(definition, fullSchema) {
var ref_definition_list = definition.$ref.split("/"), ref_definition_word = ref_definition_list[ref_definition_list.length - 1], ref_definition_root = ref_definition_list[ref_definition_list.length - 2], ref_definition = fullSchema.class_definition[ref_definition_root][ref_definition_word];
console.log("expandingReference");
if (ref_definition.allOf) {
if (ref_definition.allOf[1].oneOf) {
console.log("there is oneOf");
ref_definition = expandOneOf(ref_definition, fullSchema);
}
}
definition = ref_definition;
console.log("* * *");
console.log(definition);
return definition;
}
function expandProperties(definition, expanded_class_def, fullSchema) {
console.log("expanding properties");
console.log(definition);
var property, temp1, temp2, i, subProp, temp3;
//, coppy;
for (property in definition.properties) {
if (definition.properties.hasOwnProperty(property)) {
console.log("...");
console.log(property);
if (definition.properties[property].allOf || definition.properties[property].properties || definition.properties[property].type || definition.properties[property].$ref) {
if (definition.properties[property].$ref) {
temp1 = expandReference(definition.properties[property], fullSchema);
console.log("there is a referenced property # #");
console.log(property);
expanded_class_def.properties[property] = temp1;
if (temp1.allOf) {
if (temp1.allOf[1].oneOf) {
for (i = 0; i <= temp1.allOf[1].oneOf.length - 1; i += 1) {
if (temp1.allOf[1].oneOf[i].properties) {
for (subProp in temp1.allOf[1].oneOf[i].properties) {
if (temp1.allOf[1].oneOf[i].properties.hasOwnProperty(subProp)) {
if (temp1.allOf[1].oneOf[i].properties[subProp].$ref) {
console.log("there is referenced sub-property");
console.log(subProp);
temp3 = expandReference(temp1.allOf[1].oneOf[i].properties[subProp], fullSchema);
expanded_class_def.properties[property].allOf[1].oneOf[i].properties[subProp] = temp3;
}
}
}
}
}
}
}
} else {
if (definition.properties[property].properties) {
console.log("there is a property property --> recursive");
console.log(property);
expanded_class_def.properties[property] = {
properties: {}
};
temp2 = expandProperties(definition.properties[property], expanded_class_def.properties[property], fullSchema);
definition.properties[property] = temp2;
}
console.log("before expanding definition");
console.log(property);
expanded_class_def.properties[property] = definition.properties[property];
}
}
}
}
console.log("- * - * -");
console.log(expanded_class_def);
return expanded_class_def;
}
function expandSchema(class_definition, full_schema) { function expandSchema(class_definition, full_schema) {
// minimal expanding of json schema, supports merging allOf and $ref // minimal expanding of json schema, supports merging allOf and $ref
// references // references
// TODO: check for a library that would provide full support // TODO: check for a library that would provide full support
console.log("expandSCHEMA 1"); console.log("EXPANDING SCHEMA FOR :");
var property, referenced, i, j, len, expanded_class_definition = { console.log(class_definition);
var referenced, i, expanded_class_definition = {
properties: class_definition.properties || {} properties: class_definition.properties || {}
}, ref_word_list, ref_word, ref_definition_list, ref_definition_word, ref_definition, sub_ref_def, sub_ref_def_list, sub_ref_def_word, sub_ref_def_root; }, ref_word_list, ref_word;
if (class_definition.allOf) { if (class_definition.allOf) {
for (i = 0; i < class_definition.allOf.length; i += 1) { for (i = 0; i < class_definition.allOf.length; i += 1) {
referenced = class_definition.allOf[i]; referenced = class_definition.allOf[i];
if (referenced.$ref) { if (referenced.$ref) {
ref_word_list = referenced.$ref.split("/"); ref_word_list = referenced.$ref.split("/");
ref_word = ref_word_list[ref_word_list.length - 1]; ref_word = ref_word_list[ref_word_list.length - 1];
console.log("# there is reference");
referenced = expandSchema(full_schema.class_definition[ref_word], full_schema); referenced = expandSchema(full_schema.class_definition[ref_word], full_schema);
} }
// console.log(full_schema.class_definition.definitions);
if (referenced.properties) { if (referenced.properties) {
// console.log("[[[[[[[[[[]]]]]]]]]]"); console.log("# there are properties");
// console.log(referenced.properties); expanded_class_definition = expandProperties(referenced, expanded_class_definition, full_schema);
for (property in referenced.properties) {
if (referenced.properties.hasOwnProperty(property)) {
if (referenced.properties[property].type || referenced.properties[property].$ref) {
// console.log("..");
// console.log(property);
if (referenced.properties[property].$ref) {
ref_definition_list = referenced.properties[property].$ref.split("/");
ref_definition_word = ref_definition_list[ref_definition_list.length - 1];
ref_definition = full_schema.class_definition.definitions[ref_definition_word];
// console.log("(((((((())))))))");
// console.log(ref_definition);
if (ref_definition.allOf) {
if (ref_definition.allOf[1].oneOf) {
len = ref_definition.allOf[1].oneOf.length - 1;
for (j = 0; j <= len; j += 1) {
// console.log("--------- " + j);
// console.log(ref_definition.allOf[1].oneOf[j]);
if (ref_definition.allOf[1].oneOf[j].$ref) {
sub_ref_def_list = ref_definition.allOf[1].oneOf[j].$ref.split("/");
// console.log(">>>>>>");
sub_ref_def_word = sub_ref_def_list[sub_ref_def_list.length - 1];
sub_ref_def_root = sub_ref_def_list[sub_ref_def_list.length - 2];
sub_ref_def = full_schema.class_definition.definitions[sub_ref_def_root][sub_ref_def_word];
// console.log(sub_ref_def);
ref_definition.allOf[1].oneOf[j] = sub_ref_def;
}
}
}
}
expanded_class_definition.properties[property] = ref_definition;
} else {
expanded_class_definition.properties[property] = referenced.properties[property];
}
}
}
}
} }
} }
} }
// console.log("expandSCHEMA 2"); console.log("EXPANDED SCHEMA FOR : 2");
// console.log(expanded_class_definition); console.log(expanded_class_definition);
return expanded_class_definition; return expanded_class_definition;
} }
function openNodeDialog(gadget, element) { function openEdgeEditionDialog(gadget, connection) {
// TODO: remove class_definition from this function and callees signature var edge_id = connection.id, edge_data = gadget.props.data.graph.edge[edge_id], edit_popup = $(gadget.props.element).find("#popup-edit-template"), schema, fieldset_element, delete_promise;
//function openNodeDialog(gadget, element, class_definition) { schema = expandSchema(gadget.props.data.class_definition[edge_data._class], gadget.props.data);
// We do not edit source & destination on edge this way.
delete schema.properties.source;
delete schema.properties.destination;
gadget.props.element.appendChild(document.importNode(popup_edit_template.content, true).children[0]);
edit_popup = $(gadget.props.element).find("#edit-popup");
edit_popup.find(".node_class").text(connection._class);
fieldset_element = edit_popup.find("fieldset")[0];
edit_popup.popup();
edit_popup.show();
function save_promise(fieldset_gadget, edge_id) {
return RSVP.Queue().push(function() {
return promiseEventListener(edit_popup.find("form")[0], "submit", false);
}).push(function(evt) {
var data = {
id: $(evt.target[1]).val(),
data: {}
};
return fieldset_gadget.getContent().then(function(r) {
$.extend(data.data, gadget.props.data.graph.edge[connection.id]);
$.extend(data.data, r);
// to redraw, we remove the edge and add again.
// but we want to disable events on connection, since event
// handling promise are executed asynchronously in undefined order,
// we cannot just remove and /then/ add, because the new edge is
// added before the old is removed.
connection.ignoreEvent = true;
gadget.props.jsplumb_instance.detach(connection);
addEdge(gadget, r.id, data.data);
});
});
}
delete_promise = new RSVP.Queue().push(function() {
return promiseEventListener(edit_popup.find("form [type='button']")[0], "click", false);
}).push(function() {
// connectionDetached event will remove the edge from data
gadget.props.jsplumb_instance.detach(connection);
});
return gadget.declareGadget("../fieldset/index.html", {
element: fieldset_element,
scope: "fieldset"
}).push(function(fieldset_gadget) {
return RSVP.all([ fieldset_gadget, fieldset_gadget.render({
value: edge_data,
property_definition: schema
}, edge_id) ]);
}).push(function(fieldset_gadget) {
edit_popup.enhanceWithin();
edit_popup.popup("open");
return fieldset_gadget[0];
}).push(function(fieldset_gadget) {
// Expose the dialog handling promise so that we can wait for it in
// test.
gadget.props.dialog_promise = RSVP.any([ save_promise(fieldset_gadget, edge_id), delete_promise ]);
return gadget.props.dialog_promise;
}).push(function() {
edit_popup.popup("close");
edit_popup.remove();
delete gadget.props.dialog_promise;
});
}
function openNodeEditionDialog(gadget, element) {
console.log("openNODEDIALOG 1"); console.log("openNODEDIALOG 1");
var node_id = getNodeId(gadget, element.id), //node_data = gadget.props.data.graph.main_graph.node[node_id], var node_id = getNodeId(gadget, element.id), node_data = gadget.props.data.graph.node[node_id], node_edit_popup = $(gadget.props.element).find("#popup-edit-template"), schema, fieldset_element, delete_promise;
node_data = gadget.props.data.graph.node[node_id], node_edit_popup = $(gadget.props.element).find("#popup-edit-template"), schema, fieldset_element, delete_promise;
// If we have no definition for this, we do not allow edition. // If we have no definition for this, we do not allow edition.
//TODO: node_data._class may not exist //TODO: node_data._class may not exist
if (gadget.props.data.class_definition[node_data._class] === undefined) { if (gadget.props.data.class_definition[node_data._class] === undefined) {
return; return;
} }
console.log("OPEN DIALOG FOR NODE");
console.log(gadget.props);
console.log(gadget.props.data.class_definition);
console.log(node_data);
schema = expandSchema(gadget.props.data.class_definition[node_data._class], gadget.props.data); schema = expandSchema(gadget.props.data.class_definition[node_data._class], gadget.props.data);
console.log("----schema----");
console.log(schema);
console.log("----schema----");
if (node_edit_popup.length !== 0) { if (node_edit_popup.length !== 0) {
node_edit_popup.remove(); node_edit_popup.remove();
} }
gadget.props.element.appendChild(document.importNode(popup_edit_template.content, true).children[0]); gadget.props.element.appendChild(document.importNode(popup_edit_template.content, true).children[0]);
node_edit_popup = $(gadget.props.element).find("#node-edit-popup"); node_edit_popup = $(gadget.props.element).find("#edit-popup");
console.log("openNODEDIALOG 1.35"); console.log("openNODEDIALOG 1.3");
console.log(node_edit_popup); console.log(node_edit_popup);
console.log(node_edit_popup.find(".node_class")); console.log(node_edit_popup.find(".node_class"));
console.log(gadget.props.data.graph.node); console.log(gadget.props.data.graph.node);
...@@ -499,7 +724,22 @@ ...@@ -499,7 +724,22 @@
//function waitForNodeClick(gadget, node, config_dict) { //function waitForNodeClick(gadget, node, config_dict) {
function waitForNodeClick(gadget, node) { function waitForNodeClick(gadget, node) {
console.log("waitFORNODEclick 1"); console.log("waitFORNODEclick 1");
gadget.props.nodes_click_monitor.monitor(loopEventListener(node, "dblclick", false, openNodeDialog.bind(null, gadget, node))); gadget.props.nodes_click_monitor.monitor(loopEventListener(node, "dblclick", false, openNodeEditionDialog.bind(null, gadget, node)));
}
function waitForConnection(gadget) {
return loopJsplumbBind(gadget, "connection", function(info, originalEvent) {
updateConnectionData(gadget, info.connection, false);
});
}
function waitForConnectionDetached(gadget) {
return loopJsplumbBind(gadget, "connectionDetached", function(info, originalEvent) {
updateConnectionData(gadget, info.connection, true);
});
}
function waitForConnectionClick(gadget) {
return loopJsplumbBind(gadget, "click", function(connection) {
return openEdgeEditionDialog(gadget, connection);
});
} }
function addNode(gadget, node_id, node_data) { function addNode(gadget, node_id, node_data) {
console.log("addNODE 0"); console.log("addNODE 0");
...@@ -612,7 +852,6 @@ ...@@ -612,7 +852,6 @@
console.log("RENDEERING WORKFLOW EDITOR1"); console.log("RENDEERING WORKFLOW EDITOR1");
this.props.data = JSON.parse(data); this.props.data = JSON.parse(data);
this.props.jsplumb_instance = jsPlumb.getInstance(); this.props.jsplumb_instance = jsPlumb.getInstance();
console.log(this.props.data);
console.log("RENDEERING WORKFLOW EDITOR3"); console.log("RENDEERING WORKFLOW EDITOR3");
}).declareMethod("getContent", function() { }).declareMethod("getContent", function() {
console.log("£££££££"); console.log("£££££££");
...@@ -648,12 +887,10 @@ ...@@ -648,12 +887,10 @@
draggable(gadget); draggable(gadget);
this.props.nodes_click_monitor = RSVP.Monitor(); this.props.nodes_click_monitor = RSVP.Monitor();
// load the data // load the data
//$.each(this.props.data.graph.main_graph.node, function (key, value) {
$.each(this.props.data.graph.node, function(key, value) { $.each(this.props.data.graph.node, function(key, value) {
addNode(gadget, key, value); addNode(gadget, key, value);
}); });
console.log("startservice WORKFLOW EDITOR3"); console.log("startservice WORKFLOW EDITOR3");
//$.each(this.props.data.graph.main_graph.edge, function (key, value) {
$.each(this.props.data.graph.edge, function(key, value) { $.each(this.props.data.graph.edge, function(key, value) {
addEdge(gadget, key, value); addEdge(gadget, key, value);
}); });
......
dream/platform/static/jsplumb/test.js
View file @ 6679c74b
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
"Example.Edge": { "Example.Edge": {
_class: "edge", _class: "edge",
allOf: [ { allOf: [ {
$ref: "#edge" $ref: "#/edge"
}, { }, {
properties: { properties: {
color: { color: {
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
"Example.Node": { "Example.Node": {
_class: "node", _class: "node",
allOf: [ { allOf: [ {
$ref: "#node" $ref: "#/node"
}, { }, {
properties: { properties: {
shape: { shape: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7