Skip to content

dream
dream
Commit ab2056a5 authored by Thibaut Frain's avatar Thibaut Frain Committed by Jérome Perrin
Browse files
Options

publish static version

parent 3349a0fe
Show whitespace changes
Inline Side-by-side
Showing with 389 additions and 162 deletions
dream/platform/static/dream/Input_viewProductionLine.html
View file @ ab2056a5
...@@ -7,6 +7,8 @@ ...@@ -7,6 +7,8 @@
<script src="../lib/rsvp.min.js" type="text/javascript"></script> <script src="../lib/rsvp.min.js" type="text/javascript"></script>
<script src="../lib/renderjs.min.js" type="text/javascript"></script> <script src="../lib/renderjs.min.js" type="text/javascript"></script>
<script src="mixin_promise.js" type="text/javascript"></script>
<script src="Input_viewProductionLine.js" type="text/javascript"></script> <script src="Input_viewProductionLine.js" type="text/javascript"></script>
</head> </head>
<body> <body>
...@@ -14,5 +16,9 @@ ...@@ -14,5 +16,9 @@
data-gadget-scope="productionline_toolbox"></div> data-gadget-scope="productionline_toolbox"></div>
<div data-gadget-url="../jsplumb/index.html" <div data-gadget-url="../jsplumb/index.html"
data-gadget-scope="productionline_graph"></div> data-gadget-scope="productionline_graph"></div>
<form class="save_form">
<button type="submit" class="ui-btn ui-btn-b ui-btn-inline
ui-icon-edit ui-btn-icon-right">Save</button>
</form>
</body> </body>
</html> </html>
dream/platform/static/dream/Input_viewProductionLine.js
View file @ ab2056a5
/*global window, rJS, RSVP */ /*global window, rJS, RSVP, loopEventListener*/
(function(window, rJS, RSVP) { (function(window, rJS, RSVP, loopEventListener) {
"use strict"; "use strict";
var gadget_klass = rJS(window); var gadget_klass = rJS(window);
function saveGraph(evt) {
var gadget = this, graph_data, graph_gadget;
return new RSVP.Queue().push(function() {
// Prevent double click
evt.target.getElementsByClassName("ui-btn")[0].disabled = true;
return gadget.getDeclaredGadget("productionline_graph");
}).push(function(graphgadget) {
graph_gadget = graphgadget;
return graph_gadget.getData();
}).push(function(data) {
graph_data = data;
// Always get a fresh version, to prevent deleting spreadsheet & co
return gadget.aq_getAttachment({
_id: gadget.props.jio_key,
_attachment: "body.json"
});
}).push(function(body) {
var data = JSON.parse(body);
data.nodes = JSON.parse(graph_data).nodes;
data.edges = JSON.parse(graph_data).edges;
data.preference = JSON.parse(graph_data).preference;
return gadget.aq_putAttachment({
_id: gadget.props.jio_key,
_attachment: "body.json",
_data: JSON.stringify(data, null, 2),
_mimetype: "application/json"
});
}).push(function() {
evt.target.getElementsByClassName("ui-btn")[0].disabled = false;
});
}
function waitForSave(gadget) {
return loopEventListener(gadget.props.element.getElementsByClassName("save_form")[0], "submit", false, saveGraph.bind(gadget));
}
gadget_klass.ready(function(g) { gadget_klass.ready(function(g) {
g.props = {}; g.props = {};
}).ready(function(g) { }).ready(function(g) {
return g.getElement().push(function(element) { return g.getElement().push(function(element) {
g.props.element = element; g.props.element = element;
}); });
}).declareAcquiredMethod("aq_getAttachment", "jio_getAttachment").declareMethod("render", function(options) { }).declareAcquiredMethod("aq_getAttachment", "jio_getAttachment").declareAcquiredMethod("aq_putAttachment", "jio_putAttachment").declareMethod("render", function(options) {
var jio_key = options.id, gadget = this; var jio_key = options.id, gadget = this;
gadget.props.jio_key = jio_key; gadget.props.jio_key = jio_key;
return new RSVP.Queue().push(function() { return new RSVP.Queue().push(function() {
...@@ -30,7 +64,7 @@ ...@@ -30,7 +64,7 @@
graph = graph_gadget; graph = graph_gadget;
return g.getDeclaredGadget("productionline_toolbox"); return g.getDeclaredGadget("productionline_toolbox");
}).push(function(toolbox) { }).push(function(toolbox) {
return RSVP.all([ graph.startService(), toolbox.startService() ]); return RSVP.all([ graph.startService(), toolbox.startService(), waitForSave(g) ]);
}); });
}); });
})(window, rJS, RSVP); })(window, rJS, RSVP, loopEventListener);
\ No newline at end of file \ No newline at end of file
dream/platform/static/dream/Input_viewSimulation.html
View file @ ab2056a5
...@@ -20,7 +20,9 @@ ...@@ -20,7 +20,9 @@
</head> </head>
<body> <body>
<form class="save_form"> <form class="save_form">
<fieldset class="simulation_parameters"> <fieldset>
<div data-gadget-url="../fieldset/index.html"
data-gadget-scope="fieldset"></div>
</fieldset> </fieldset>
<button type="submit" class="ui-btn ui-btn-b ui-btn-inline <button type="submit" class="ui-btn ui-btn-b ui-btn-inline
ui-icon-refresh ui-btn-icon-right">Run Simulation</button> ui-icon-refresh ui-btn-icon-right">Run Simulation</button>
......
dream/platform/static/dream/Input_viewSimulation.js
View file @ ab2056a5
/*global rJS, RSVP, jQuery, Handlebars, /*global rJS, RSVP, jQuery, promiseEventListener, initGadgetMixin */
promiseEventListener, initGadgetMixin */
/*jslint nomen: true */ /*jslint nomen: true */
(function(window, rJS, RSVP, $, Handlebars, promiseEventListener, initGadgetMixin) { (function(window, rJS, RSVP, $, promiseEventListener, initGadgetMixin) {
"use strict"; "use strict";
function saveForm(gadget) { function saveForm(gadget) {
var general = {}; var general = {}, field_gadget_list;
return new RSVP.Queue().push(function() { return gadget.getDeclaredGadget("fieldset").push(function(fieldset_gadget) {
return fieldset_gadget.getFieldGadgetList();
}).push(function(field_gadgets) {
field_gadget_list = field_gadgets;
}).push(function() {
var i, promise_list = []; var i, promise_list = [];
for (i = 0; i < gadget.props.gadget_list.length; i += 1) { for (i = 0; i < field_gadget_list.length; i += 1) {
promise_list.push(gadget.props.gadget_list[i].getContent()); promise_list.push(field_gadget_list[i].getContent());
} }
return RSVP.all(promise_list); return RSVP.all(promise_list);
}).push(function(result_list) { }).push(function(result_list) {
...@@ -98,57 +101,24 @@ ...@@ -98,57 +101,24 @@
// Handlebars // Handlebars
///////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////
// Precompile the templates while loading the first gadget instance // Precompile the templates while loading the first gadget instance
var gadget_klass = rJS(window), source = gadget_klass.__template_element.getElementById("label-template").innerHTML, label_template = Handlebars.compile(source); var gadget_klass = rJS(window);
initGadgetMixin(gadget_klass); initGadgetMixin(gadget_klass);
gadget_klass.declareAcquiredMethod("aq_getAttachment", "jio_getAttachment").declareAcquiredMethod("aq_putAttachment", "jio_putAttachment").declareAcquiredMethod("aq_ajax", "jio_ajax").declareAcquiredMethod("aq_getConfigurationDict", "getConfigurationDict").declareAcquiredMethod("pleaseRedirectMyHash", "pleaseRedirectMyHash").declareAcquiredMethod("whoWantToDisplayThisDocument", "whoWantToDisplayThisDocument").declareMethod("render", function(options) { gadget_klass.declareAcquiredMethod("aq_getAttachment", "jio_getAttachment").declareAcquiredMethod("aq_putAttachment", "jio_putAttachment").declareAcquiredMethod("aq_ajax", "jio_ajax").declareAcquiredMethod("aq_getConfigurationDict", "getConfigurationDict").declareAcquiredMethod("pleaseRedirectMyHash", "pleaseRedirectMyHash").declareAcquiredMethod("whoWantToDisplayThisDocument", "whoWantToDisplayThisDocument").declareMethod("render", function(options) {
var i, gadget = this, property, parent_element = gadget.props.element.querySelector(".simulation_parameters"), value, queue, data; var gadget = this, property_list, data;
this.props.jio_key = options.id; this.props.jio_key = options.id;
function addField(property, value) { return gadget.aq_getAttachment({
var sub_gadget;
queue.push(function() {
parent_element.insertAdjacentHTML("beforeend", label_template({
label: property.name || property.id
}));
if (property.type === "number") {
return gadget.declareGadget("../number_field/index.html");
}
return gadget.declareGadget("../string_field/index.html");
}).push(function(gg) {
sub_gadget = gg;
value = data[property.id] || value;
return sub_gadget.render({
field_json: {
title: property.description || "",
key: property.id,
value: value
}
});
}).push(function() {
return sub_gadget.getElement();
}).push(function(sub_element) {
parent_element.appendChild(sub_element);
gadget.props.gadget_list.push(sub_gadget);
});
}
queue = gadget.aq_getAttachment({
_id: gadget.props.jio_key, _id: gadget.props.jio_key,
_attachment: "body.json" _attachment: "body.json"
}).push(function(json) { }).push(function(json) {
data = JSON.parse(json).general; data = JSON.parse(json).general;
return gadget.aq_getConfigurationDict(); return gadget.aq_getConfigurationDict();
}).push(function(configuration_dict) { }).push(function(configuration_dict) {
var property_list = configuration_dict["Dream-Configuration"].property_list; property_list = configuration_dict["Dream-Configuration"].property_list;
gadget.props.gadget_list = []; return gadget.getDeclaredGadget("fieldset");
for (i = 0; i < property_list.length; i += 1) { }).push(function(fieldset_gadget) {
property = property_list[i]; return fieldset_gadget.render(property_list, data);
if (property._class === "Dream.Property") {
value = property._default || "";
addField(property, value);
}
}
}); });
return queue;
}).declareMethod("startService", function() { }).declareMethod("startService", function() {
return waitForRunSimulation(this); return waitForRunSimulation(this);
}); });
})(window, rJS, RSVP, jQuery, Handlebars, promiseEventListener, initGadgetMixin); })(window, rJS, RSVP, jQuery, promiseEventListener, initGadgetMixin);
\ No newline at end of file \ No newline at end of file
dream/platform/static/fieldset/fieldset.js 0 → 100644
View file @ ab2056a5
/*global rJS, RSVP, jQuery, Handlebars,
promiseEventListener, initGadgetMixin*/
/*jslint nomen: true */
(function(window, rJS, RSVP, Handlebars, initGadgetMixin) {
"use strict";
/////////////////////////////////////////////////////////////////
// Handlebars
/////////////////////////////////////////////////////////////////
// Precompile the templates while loading the first gadget instance
var gadget_klass = rJS(window), source = gadget_klass.__template_element.getElementById("label-template").innerHTML, label_template = Handlebars.compile(source);
initGadgetMixin(gadget_klass);
gadget_klass.declareMethod("render", function(property_list, data) {
var gadget = this, queue, value, property;
gadget.props.field_gadget_list = [];
function addField(property, value) {
var sub_gadget;
queue.push(function() {
gadget.props.element.insertAdjacentHTML("beforeend", label_template({
"for": property.id,
name: property.name || property.id
}));
if (property.type === "number") {
return gadget.declareGadget("../number_field/index.html");
}
if (property.choice) {
return gadget.declareGadget("../list_field/index.html");
}
return gadget.declareGadget("../string_field/index.html");
}).push(function(gg) {
var choice = property.choice || [], default_opt = choice[0] ? [ choice[0][1] ] : [ "" ];
sub_gadget = gg;
value = data[property.id] || value;
return sub_gadget.render({
field_json: {
title: property.description || "",
key: property.id,
value: value,
items: choice,
"default": default_opt
}
});
}).push(function() {
return sub_gadget.getElement();
}).push(function(sub_element) {
gadget.props.element.appendChild(sub_element);
gadget.props.field_gadget_list.push(sub_gadget);
});
}
queue = new RSVP.Queue().push(function() {
Object.keys(property_list).forEach(function(i) {
property = property_list[i];
if (property._class === "Dream.Property") {
value = property._default || "";
addField(property, value);
}
});
});
return queue;
}).declareMethod("getFieldGadgetList", function() {
return this.props.field_gadget_list;
});
})(window, rJS, RSVP, Handlebars, initGadgetMixin);
\ No newline at end of file
dream/platform/static/fieldset/index.html 0 → 100644
View file @ ab2056a5
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fieldset</title>
<script src="../lib/rsvp.min.js" type="text/javascript"></script>
<script src="../lib/renderjs.min.js" type="text/javascript"></script>
<script src="../lib/handlebars.min.js" type="text/javascript"></script>
<script src="../lib/jquery.js" type="text/javascript"></script>
<script src="../lib/jquerymobile.js" type="text/javascript"></script>
<script id="label-template" type="text/x-handlebars-template">
<label for="{{for}}">{{name}}</label>
</script>
<script src="../dream/mixin_gadget.js" type="text/javascript"></script>
<script src="fieldset.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
dream/platform/static/jsplumb/index.html
View file @ ab2056a5
...@@ -16,11 +16,21 @@ ...@@ -16,11 +16,21 @@
<div class="window {{class}}" <div class="window {{class}}"
id="{{element_id}}" id="{{element_id}}"
title="{{title}}"> title="{{title}}">
{{id}} {{name}}
<div class="ep"></div> <div class="ep"></div>
</div> </div>
</script> </script>
<template id="popup-edit-template">
<div id="node-edit-popup">
<form>
<fieldset></fieldset>
<input type="button" value="Delete">
<input type="submit" value="Validate">
</form>
</div>
</template>
<script src="../dream/mixin_gadget.js"></script> <script src="../dream/mixin_gadget.js"></script>
<script src="../dream/mixin_promise.js"></script> <script src="../dream/mixin_promise.js"></script>
......
dream/platform/static/jsplumb/jsplumb.js
View file @ ab2056a5
...@@ -17,12 +17,46 @@ ...@@ -17,12 +17,46 @@
* along with DREAM. If not, see <http://www.gnu.org/licenses/>. * along with DREAM. If not, see <http://www.gnu.org/licenses/>.
* ==========================================================================*/ * ==========================================================================*/
/*global RSVP, rJS, $, jsPlumb, Handlebars, initGadgetMixin, /*global RSVP, rJS, $, jsPlumb, Handlebars, initGadgetMixin,
loopEventListener, DOMParser*/ loopEventListener, promiseEventListener, DOMParser, confirm*/
/*jslint unparam: true */ /*jslint unparam: true */
(function(RSVP, rJS, $, jsPlumb, Handlebars, initGadgetMixin, loopEventListener, DOMParser) { (function(RSVP, rJS, $, jsPlumb, Handlebars, initGadgetMixin, loopEventListener, promiseEventListener, DOMParser) {
"use strict"; "use strict";
/*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), 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();
function loopJsplumbBind(gadget, type, callback) {
//////////////////////////
// Infinite event listener (promise is never resolved)
// eventListener is removed when promise is cancelled/rejected
//////////////////////////
var handle_event_callback, callback_promise, jsplumb_instance = gadget.props.jsplumb_instance;
function cancelResolver() {
if (callback_promise !== undefined && typeof callback_promise.cancel === "function") {
callback_promise.cancel();
}
}
function canceller() {
if (handle_event_callback !== undefined) {
jsplumb_instance.unbind(type);
}
cancelResolver();
}
function itsANonResolvableTrap(resolve, reject) {
handle_event_callback = function() {
var args = arguments;
cancelResolver();
callback_promise = new RSVP.Queue().push(function() {
return callback.apply(jsplumb_instance, args);
}).push(undefined, function(error) {
if (!(error instanceof RSVP.CancellationError)) {
canceller();
reject(error);
}
});
};
jsplumb_instance.bind(type, handle_event_callback);
}
return new RSVP.Promise(itsANonResolvableTrap, canceller);
}
function getNodeId(node_container, element_id) { function getNodeId(node_container, element_id) {
var node_id; var node_id;
$.each(node_container, function(k, v) { $.each(node_container, function(k, v) {
...@@ -36,15 +70,13 @@ ...@@ -36,15 +70,13 @@
function getElementId(node_container, node_id) { function getElementId(node_container, node_id) {
return node_container[node_id].element_id; return node_container[node_id].element_id;
} }
// function generateNodeId(node_container, element_type, option) { function generateNodeId(gadget, element_type, option) {
// var n = 1; var n = 1;
// while (node_container[ while (gadget.props.node_container[(option.short_id || element_type) + n] !== undefined) {
// ((option.short_id || element_type) + n) n += 1;
// ] !== undefined) { }
// n += 1; return (option.short_id || element_type) + n;
// } }
// return (option.short_id || element_type) + n;
// }
function generateElementId(gadget_element) { function generateElementId(gadget_element) {
var n = 1; var n = 1;
while ($(gadget_element).find("#DreamNode_" + n).length > 0) { while ($(gadget_element).find("#DreamNode_" + n).length > 0) {
...@@ -56,6 +88,33 @@ ...@@ -56,6 +88,33 @@
//$.publish("Dream.Gui.onDataChange", g.private.getData()); //$.publish("Dream.Gui.onDataChange", g.private.getData());
return undefined; return undefined;
} }
function updateConnectionData(gadget, connection, remove, edge_data) {
if (remove) {
delete gadget.props.edge_container[connection.id];
} else {
gadget.props.edge_container[connection.id] = [ getNodeId(gadget.props.node_container, connection.sourceId), getNodeId(gadget.props.node_container, connection.targetId), edge_data || {} ];
}
onDataChange();
}
// bind to connection/connectionDetached events,
// and update the list of connections on screen.
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) {
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.preference_container.zoom_level || 1) * 1.1111, canvas_size_x = $(gadget.props.element).find("#main").width(), 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"; var zoom_level = (gadget.props.preference_container.zoom_level || 1) * 1.1111, canvas_size_x = $(gadget.props.element).find("#main").width(), 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 ];
...@@ -128,12 +187,6 @@ ...@@ -128,12 +187,6 @@
}); });
// listen for clicks on connections, // listen for clicks on connections,
// and offer to change values on click. // and offer to change values on click.
// jsplumb_instance.bind("click", function (conn) {
// jsplumb_instance.detach(conn);
// });
// jsplumb_instance.bind("beforeDetach", function (conn) {
// return confirm("Delete connection?");
// });
// jsplumb_instance // jsplumb_instance
// .bind("connectionDrag", function (connection) { // .bind("connectionDrag", function (connection) {
// return undefined; // return undefined;
...@@ -143,24 +196,6 @@ ...@@ -143,24 +196,6 @@
// return undefined; // return undefined;
// }); // });
// split in 2 methods ? one for events one for manip // split in 2 methods ? one for events one for manip
gadget.props.updateConnectionData = function(connection, remove, edge_data) {
if (remove) {
delete gadget.props.edge_container[connection.id];
} else {
gadget.props.edge_container[connection.id] = [ getNodeId(gadget.props.node_container, connection.sourceId), getNodeId(gadget.props.node_container, connection.targetId), edge_data || {} ];
}
onDataChange();
};
// bind to connection/connectionDetached events,
// and update the list of connections on screen.
// jsplumb_instance
// .bind("connection", function (info, originalEvent) {
// gadget.props.updateConnectionData(info.connection);
// });
// jsplumb_instance
// .bind("connectionDetached", function (info, originalEvent) {
// gadget.props.updateConnectionData(info.connection, true);
// });
onDataChange(); onDataChange();
draggable(gadget); draggable(gadget);
} }
...@@ -176,6 +211,7 @@ ...@@ -176,6 +211,7 @@
/*jslint nomen: true*/ /*jslint nomen: true*/
var element_data = { var element_data = {
_class: element._class, _class: element._class,
name: element.name,
element_id: element.element_id element_id: element.element_id
}; };
node_container[element.id] = element_data; node_container[element.id] = element_data;
...@@ -245,21 +281,19 @@ ...@@ -245,21 +281,19 @@
// onDataChange(); // onDataChange();
// redraw(gadget); // redraw(gadget);
// } // }
// function removeElement(gadget, node_id) { function removeElement(gadget, node_id) {
// var element_id = gadget.props.node_container[node_id].element_id; var element_id = gadget.props.node_container[node_id].element_id;
// gadget.props.jsplumb_instance.removeAllEndpoints( gadget.props.jsplumb_instance.removeAllEndpoints($(gadget.props.element).find("#" + element_id));
// $(gadget.props.element).find("#" + element_id) $(gadget.props.element).find("#" + element_id).remove();
// ); delete gadget.props.node_container[node_id];
// $(gadget.props.element).find("#" + element_id).remove(); delete gadget.props.preference_container.coordinates[node_id];
// delete gadget.props.node_container[node_id]; $.each(gadget.props.edge_container, function(k, v) {
// delete gadget.props.preference_container.coordinates[node_id]; if (node_id === v[0] || node_id === v[1]) {
// $.each(gadget.props.edge_container, function (k, v) { delete gadget.props.edge_container[k];
// if (node_id === v[0] || node_id === v[1]) { }
// delete gadget.props.edge_container[k]; });
// } onDataChange();
// }); }
// onDataChange();
// }
function updateElementData(gadget, node_id, data) { function updateElementData(gadget, node_id, data) {
var element_id = gadget.props.node_container[node_id].element_id, new_id = data.id; var element_id = gadget.props.node_container[node_id].element_id, new_id = data.id;
if (data.name) { if (data.name) {
...@@ -271,6 +305,7 @@ ...@@ -271,6 +305,7 @@
if (new_id && new_id !== node_id) { if (new_id && new_id !== node_id) {
gadget.props.node_container[new_id] = gadget.props.node_container[node_id]; gadget.props.node_container[new_id] = gadget.props.node_container[node_id];
delete gadget.props.node_container[node_id]; delete gadget.props.node_container[node_id];
delete gadget.props.node_container[new_id].id;
$.each(gadget.props.edge_container, function(k, v) { $.each(gadget.props.edge_container, function(k, v) {
if (v[0] === node_id) { if (v[0] === node_id) {
v[0] = new_id; v[0] = new_id;
...@@ -315,7 +350,7 @@ ...@@ -315,7 +350,7 @@
}); });
// call again updateConnectionData to set the connection data that // call again updateConnectionData to set the connection data that
// was not passed to the connection hook // was not passed to the connection hook
gadget.props.updateConnectionData(connection, 0, data); updateConnectionData(gadget, connection, 0, data);
} }
// function setPreferences(gadget, preferences) { // function setPreferences(gadget, preferences) {
// gadget.props.preference_container = preferences; // gadget.props.preference_container = preferences;
...@@ -330,10 +365,76 @@ ...@@ -330,10 +365,76 @@
// $.extend(gadget.props.general_container, properties); // $.extend(gadget.props.general_container, properties);
// onDataChange(); // onDataChange();
// } // }
function newElement(gadget, element, option) { function saveNode(evt, gadget, node_id) {
var i, data = {
id: $(evt.target[1]).val(),
name: $(evt.target[2]).val()
};
data.data = {};
for (i = 3; i < evt.target.length - 1; i += 1) {
data.data[evt.target[i].name] = $(evt.target[i]).val();
}
updateElementData(gadget, node_id, data);
}
function openNodeDialog(gadget, element, config_dict) {
var node_id = getNodeId(gadget.props.node_container, element.id), node_data = gadget.props.node_container[node_id], element_type = node_data._class.replace(".", "-"), property_list = config_dict[element_type].property_list || [], node_edit_popup = $(gadget.props.element).find("#popup-edit-template"), fieldset_element, save_promise, delete_promise;
if (node_edit_popup.length !== 0) {
node_edit_popup.remove();
}
gadget.props.element.appendChild(document.importNode(popup_edit_template.content, true).children[0]);
node_edit_popup = $(gadget.props.element).find("#node-edit-popup");
fieldset_element = node_edit_popup.find("fieldset")[0];
node_edit_popup.popup();
node_data.id = node_id;
if (property_list.length === 0 || property_list[0].id !== "id") {
property_list.unshift({
_class: "Dream.Property",
id: "name",
name: "name",
type: "string"
});
property_list.unshift({
_class: "Dream.Property",
id: "id",
name: "ID",
type: "string"
});
}
save_promise = new RSVP.Queue().push(function() {
return promiseEventListener(node_edit_popup.find("form")[0], "submit", false);
}).push(function(evt) {
return saveNode(evt, gadget, node_id);
});
delete_promise = new RSVP.Queue().push(function() {
return promiseEventListener(node_edit_popup.find("form [type='button']")[0], "click", false);
}).push(function() {
return removeElement(gadget, node_id);
});
return gadget.declareGadget("../fieldset/index.html", {
element: fieldset_element,
scope: "fieldset"
}).push(function(fieldset_gadget) {
return fieldset_gadget.render(property_list, node_data);
}).push(function() {
node_edit_popup.enhanceWithin();
node_edit_popup.popup("open");
}).push(function() {
return RSVP.any([ save_promise, delete_promise ]);
}).push(function() {
node_edit_popup.popup("close");
});
}
function waitForNodeClick(gadget, node, config_dict) {
gadget.props.nodes_click_monitor.monitor(loopEventListener(node, "click", false, openNodeDialog.bind(null, gadget, node, config_dict)));
}
function newElement(gadget, element, configuration) {
var element_type = element._class.replace(".", "-"), option = configuration[element_type], render_element = $(gadget.props.element).find("#main"), coordinate = element.coordinate, box, absolute_position, domElement;
element.element_id = generateElementId(gadget.props.element);
if (!element.id) {
element.id = generateNodeId(gadget, element_type, option);
}
element.name = element.name || option.name; element.name = element.name || option.name;
addElementToContainer(gadget.props.node_container, element); addElementToContainer(gadget.props.node_container, element);
var render_element = $(gadget.props.element).find("#main"), coordinate = element.coordinate, box, absolute_position;
if (coordinate !== undefined) { if (coordinate !== undefined) {
coordinate = updateElementCoordinate(gadget, element.id, coordinate); coordinate = updateElementCoordinate(gadget, element.id, coordinate);
} }
...@@ -341,12 +442,14 @@ ...@@ -341,12 +442,14 @@
element.element_id = generateElementId(gadget.props.element); element.element_id = generateElementId(gadget.props.element);
} }
/*jslint nomen: true*/ /*jslint nomen: true*/
render_element.append(node_template({ domElement = domParser.parseFromString(node_template({
"class": element._class.replace(".", "-"), "class": element._class.replace(".", "-"),
element_id: element.element_id, element_id: element.element_id,
title: element.name || element.id, title: element.name || element.id,
id: element.id name: element.name
})); }), "text/html").querySelector(".window");
render_element.append(domElement);
waitForNodeClick(gadget, domElement, configuration);
box = $(gadget.props.element).find("#" + element.element_id); box = $(gadget.props.element).find("#" + element.element_id);
absolute_position = convertToAbsolutePosition(gadget, coordinate.left, coordinate.top); absolute_position = convertToAbsolutePosition(gadget, coordinate.left, coordinate.top);
box.css("top", absolute_position[1]); box.css("top", absolute_position[1]);
...@@ -360,31 +463,35 @@ ...@@ -360,31 +463,35 @@
return undefined; return undefined;
}); });
} }
function waitForDrop(gadget) { function waitForDrop(gadget, config) {
var target = gadget.props.element.querySelector("#main"), callback; var callback;
function canceller() { function canceller() {
if (callback !== undefined) { if (callback !== undefined) {
target.removeEventListener("drop", callback, false); gadget.props.main.removeEventListener("drop", callback, false);
} }
} }
function nonResolvableTrap(resolve, reject) { /*jslint unparam: true*/
function itsANonResolvableTrap(resolve, reject) {
callback = function(evt) { callback = function(evt) {
try {
var element = domParser.parseFromString(evt.dataTransfer.getData("text/html"), "text/html").querySelector(".tool"), offset = $(gadget.props.main).offset(), box_top = evt.clientY - offset.top + "px", box_left = evt.clientX - offset.left + "px", element_class = element.id.replace("-", "."), relative_position = convertToRelativePosition(gadget, box_left, box_top); var element = domParser.parseFromString(evt.dataTransfer.getData("text/html"), "text/html").querySelector(".tool"), offset = $(gadget.props.main).offset(), box_top = evt.clientY - offset.top + "px", box_left = evt.clientX - offset.left + "px", element_class = element.id.replace("-", "."), relative_position = convertToRelativePosition(gadget, box_left, box_top);
newElement(gadget, { newElement(gadget, {
coordinate: { coordinate: {
left: relative_position[0], left: relative_position[0],
top: relative_position[1] top: relative_position[1]
}, },
_class: element_class, _class: element_class
name: element_class }, config);
}); } catch (e) {
reject(e);
}
}; };
target.addEventListener("drop", callback, false); gadget.props.main.addEventListener("drop", callback, false);
} }
return new RSVP.Promise(nonResolvableTrap, canceller); return new RSVP.Promise(itsANonResolvableTrap, canceller);
} }
initGadgetMixin(gadget_klass); initGadgetMixin(gadget_klass);
gadget_klass.ready(function(g) { gadget_klass.declareAcquiredMethod("getConfigurationDict", "getConfigurationDict").ready(function(g) {
g.props.node_container = {}; g.props.node_container = {};
g.props.edge_container = {}; g.props.edge_container = {};
g.props.preference_container = {}; g.props.preference_container = {};
...@@ -399,9 +506,12 @@ ...@@ -399,9 +506,12 @@
preference: this.props.preference_container preference: this.props.preference_container
}); });
}).declareMethod("startService", function() { }).declareMethod("startService", function() {
var g = this, preference = g.props.data.preference !== undefined ? g.props.data.preference : {}, coordinates = preference.coordinates; var g = this, preference = g.props.data.preference !== undefined ? g.props.data.preference : {}, coordinates = preference.coordinates, config;
return g.getConfigurationDict().push(function(config_dict) {
config = config_dict;
g.props.main = g.props.element.querySelector("#main"); g.props.main = g.props.element.querySelector("#main");
initJsPlumb(g); initJsPlumb(g);
g.props.nodes_click_monitor = RSVP.Monitor();
$.each(g.props.data.nodes, function(key, value) { $.each(g.props.data.nodes, function(key, value) {
if (coordinates === undefined || coordinates[key] === undefined) { if (coordinates === undefined || coordinates[key] === undefined) {
value.coordinate = { value.coordinate = {
...@@ -412,7 +522,7 @@ ...@@ -412,7 +522,7 @@
value.coordinate = coordinates[key]; value.coordinate = coordinates[key];
} }
value.id = key; value.id = key;
newElement(g, value); newElement(g, value, config);
if (value.data) { if (value.data) {
// backward compatibility // backward compatibility
updateElementData(g, key, { updateElementData(g, key, {
...@@ -423,6 +533,8 @@ ...@@ -423,6 +533,8 @@
$.each(g.props.data.edges, function(key, value) { $.each(g.props.data.edges, function(key, value) {
addEdge(g, key, value); addEdge(g, key, value);
}); });
return RSVP.all([ waitForDragover(g), waitForDrop(g) ]); }).push(function() {
return RSVP.all([ waitForDragover(g), waitForDrop(g, config), waitForConnection(g), waitForConnectionDetached(g), waitForConnectionClick(g), g.props.nodes_click_monitor ]);
});
}); });
})(RSVP, rJS, $, jsPlumb, Handlebars, initGadgetMixin, loopEventListener, DOMParser); })(RSVP, rJS, $, jsPlumb, Handlebars, initGadgetMixin, loopEventListener, promiseEventListener, DOMParser);
\ No newline at end of file \ No newline at end of file
dream/platform/static/toolbox/toolbox.js
View file @ ab2056a5
...@@ -4,15 +4,24 @@ ...@@ -4,15 +4,24 @@
/*jslint nomen: true*/ /*jslint nomen: true*/
var gadget_klass = rJS(window), tool_template_source = gadget_klass.__template_element.getElementById("tool-template").innerHTML, tool_template = Handlebars.compile(tool_template_source); var gadget_klass = rJS(window), tool_template_source = gadget_klass.__template_element.getElementById("tool-template").innerHTML, tool_template = Handlebars.compile(tool_template_source);
function waitForDragstart(tool) { function waitForDragstart(tool) {
var callback;
function canceller() {
if (callback !== undefined) {
tool.removeEventListener("dragstart", callback, false);
}
}
/*jslint unparam: true*/ /*jslint unparam: true*/
var callback = function(evt) { function itsANonResolvableTrap(resolve, reject) {
callback = function(evt) {
try {
evt.dataTransfer.setData("text/html", tool.outerHTML); evt.dataTransfer.setData("text/html", tool.outerHTML);
} catch (e) {
reject(e);
}
}; };
return new RSVP.Promise(function(resolve, reject) {
tool.addEventListener("dragstart", callback, false); tool.addEventListener("dragstart", callback, false);
}, function() { }
tool.removeEventListener("dragstart", callback, false); return new RSVP.Promise(itsANonResolvableTrap, canceller);
});
} }
initGadgetMixin(gadget_klass); initGadgetMixin(gadget_klass);
gadget_klass.declareAcquiredMethod("getConfigurationDict", "getConfigurationDict").declareMethod("render", function() { gadget_klass.declareAcquiredMethod("getConfigurationDict", "getConfigurationDict").declareMethod("render", function() {
......
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