Skip to content

dream
dream
Commit 82ed9470 authored by Sebastien Robin's avatar Sebastien Robin
Browse files
Options

gui prototype: simplify jsonPlumb and Dream objects, use inheritance between them

parent 70fae8cd
Hide whitespace changes
Inline Side-by-side
Showing with 152 additions and 302 deletions
dream/platform/static/src/dream.js
View file @ 82ed9470
...@@ -19,8 +19,8 @@ ...@@ -19,8 +19,8 @@
(function (scope, $, jsPlumb, console, _) { (function (scope, $, jsPlumb, console, _) {
"use strict"; "use strict";
var dream = function (configuration) { scope.Dream = function (configuration) {
var that = {}, priv = {}, general = {}; var that = jsonPlumb(), priv = {};
priv.onError = function(error) { priv.onError = function(error) {
console.log("Error", error); console.log("Error", error);
...@@ -62,17 +62,13 @@ ...@@ -62,17 +62,13 @@
render_element.append('<p/><a id="clear_all">Clear All</a>'); render_element.append('<p/><a id="clear_all">Clear All</a>');
}; };
priv.removeElement = function(element_id) {
priv.plumb.removeElement(element_id);
};
priv.initDialog = function() { priv.initDialog = function() {
$( "#dialog-form" ).dialog({autoOpen: false}); $( "#dialog-form" ).dialog({autoOpen: false});
}; };
priv.initGeneralProperties = function() { priv.initGeneralProperties = function() {
var fieldset = $("#general-fieldset"), var fieldset = $("#general-fieldset"),
previous_data = priv.plumb.getData()['general'], previous_data = that.getData()['general'],
previous_value = "", previous_value = "",
prefix = "General-"; prefix = "General-";
fieldset.children().remove() fieldset.children().remove()
...@@ -108,7 +104,7 @@ ...@@ -108,7 +104,7 @@
$("#dialog-fieldset").children().remove() $("#dialog-fieldset").children().remove()
var element_id_prefix = element_id.split("_")[0]; var element_id_prefix = element_id.split("_")[0];
var property_list = configuration[element_id_prefix].property_list || []; var property_list = configuration[element_id_prefix].property_list || [];
var previous_data = priv.plumb.getData()["element"]; var previous_data = that.getData()["element"];
previous_data = previous_data[element_id] || {}; previous_data = previous_data[element_id] || {};
previous_data = previous_data.data || {}; previous_data = previous_data.data || {};
var previous_value; var previous_value;
...@@ -153,7 +149,7 @@ ...@@ -153,7 +149,7 @@
}, },
Delete: function() { Delete: function() {
if (confirm("Are you sure you want to delete " + element_id + " ?")) { if (confirm("Are you sure you want to delete " + element_id + " ?")) {
priv.removeElement(element_id); that.removeElement(element_id);
} }
$( this ).dialog( "close" ); $( this ).dialog( "close" );
}, },
...@@ -178,7 +174,7 @@ ...@@ -178,7 +174,7 @@
}); });
}; };
updateDataPropertyList(property_list, data); updateDataPropertyList(property_list, data);
priv.plumb.updateElementData(element_id, {data: data}); that.updateElementData(element_id, {data: data});
$( this ).dialog( "close" ); $( this ).dialog( "close" );
}, },
}, },
...@@ -188,97 +184,55 @@ ...@@ -188,97 +184,55 @@
}); });
}; };
Object.defineProperty(that, "newElement", { priv.super_newElement = that.newElement;
configurable: false, that.newElement = function (element) {
enumerable: false, var element_prefix = element.id.split('_')[0]
writable: false, priv.super_newElement(element, configuration[element_prefix]);
value: function (element) { $("#" + element.id).bind('click', function() {
var element_prefix = element.id.split('_')[0] console.log("bind click on window", $(this));
priv.plumb.newElement(element, configuration[element_prefix]); $( "#dialog-form" ).dialog( "destroy" ) ;
$("#" + element.id).bind('click', function() { priv.prepareDialogForElement(element.id, element.id);
console.log("bind click on window", $(this)); $( "#dialog-form" ).dialog( "open" );
$( "#dialog-form" ).dialog( "destroy" ) ; });
priv.prepareDialogForElement(element.id, element.id); // Store default values
$( "#dialog-form" ).dialog( "open" ); var data = {}, property_list = configuration[element_prefix]["property_list"] || [];
}); var updateDefaultData = function(data, property_list) {
// Store default values _.each(property_list, function(element, key) {
var data = {}, property_list = configuration[element_prefix]["property_list"] || []; console.log("going to parse property_list, element", element);
var updateDefaultData = function(data, property_list) { if(element._class === "Dream.Property") {
_.each(property_list, function(element, key) { data[element.id] = element.default;
console.log("going to parse property_list, element", element); } else if (element._class === "Dream.PropertyList") {
if(element._class === "Dream.Property") { data[element.id] = {};
data[element.id] = element.default; var next_data = data[element.id];
} else if (element._class === "Dream.PropertyList") { var next_property_list = element.property_list || [];
data[element.id] = {}; updateDefaultData(next_data, next_property_list);
var next_data = data[element.id]; }
var next_property_list = element.property_list || [];
updateDefaultData(next_data, next_property_list);
}
});
}
updateDefaultData(data, property_list);
priv.plumb.updateElementData(element.id, {data: data});
}
});
Object.defineProperty(that, "start", {
configurable: false,
enumerable: false,
writable: false,
value: function () {
priv.plumb = jsonPlumb.newJsonPlumb();
priv.plumb.start();
priv.displayTool();
priv.initDialog();
// save general configuration default values
var general_properties = {};
_.each(configuration["Dream-Configuration"].property_list, function(element, key) {
console.log("dream.start, parsing general property", element.id);
general_properties[element.id] = element.default;
}); });
priv.plumb.setGeneralProperties(general_properties);
priv.initGeneralProperties();
} }
}); updateDefaultData(data, property_list);
that.updateElementData(element.id, {data: data});
Object.defineProperty(that, "initGeneralProperties", { };
configurable: false,
enumerable: false,
writable: false,
value: function () {
priv.initGeneralProperties();
}
});
Object.defineProperty(that, "connect", {
configurable: false,
enumerable: false,
writable: false,
value: function (source_id, target_id) {
priv.plumb.connect(source_id, target_id);
}
});
Object.defineProperty(that, "updateElementData", { priv.super_start = that.start;
configurable: false, that.start = function() {
enumerable: false, priv.super_start();
writable: false, priv.displayTool();
value: function (element_id, data) { priv.initDialog();
priv.plumb.updateElementData(element_id, data); // save general configuration default values
} var general_properties = {};
}); _.each(configuration["Dream-Configuration"].property_list, function(element, key) {
console.log("dream.start, parsing general property", element.id);
general_properties[element.id] = element.default;
});
that.setGeneralProperties(general_properties);
that.initGeneralProperties();
};
Object.defineProperty(that, "clearAll", { that.initGeneralProperties = function() {
configurable: false, priv.initGeneralProperties();
enumerable: false, };
writable: false,
value: function () {
priv.plumb.clearAll();
}
});
function formatForManpy(data) { priv.formatForManpy = function(data) {
var manpy_dict = {}, coreObject = [], core_object_dict = {}; var manpy_dict = {}, coreObject = [], core_object_dict = {};
$.each(data['element'], function(idx, element) { $.each(data['element'], function(idx, element) {
var clone_element = {}; var clone_element = {};
...@@ -313,15 +267,9 @@ ...@@ -313,15 +267,9 @@
return manpy_dict; return manpy_dict;
} }
that.setGeneralProperties = function(properties) {
priv.plumb.setGeneralProperties(properties);
}
that.getData = function() { return priv.plumb.getData() };
that.runSimulation = function(callback) { that.runSimulation = function(callback) {
// handle Dream.General properties (in another function maybe ?) // handle Dream.General properties (in another function maybe ?)
var prefix = "General-", properties = {}, prefixed_property_id; var prefix = "General-", properties = {}, prefixed_property_id;
$.each(configuration['Dream-Configuration']['property_list'], $.each(configuration['Dream-Configuration']['property_list'],
function(idx, property){ function(idx, property){
...@@ -329,51 +277,22 @@ ...@@ -329,51 +277,22 @@
prefixed_property_id = prefix + property.id; prefixed_property_id = prefix + property.id;
properties[property.id] = $("#" + prefixed_property_id).val(); properties[property.id] = $("#" + prefixed_property_id).val();
} }
}); });
priv.plumb.setGeneralProperties(properties); that.setGeneralProperties(properties);
var model = formatForManpy(priv.plumb.getData()); var model = priv.formatForManpy(that.getData());
$.ajax( $.ajax(
'/runSimulation', { '/runSimulation', {
data: JSON.stringify({json: model}), data: JSON.stringify({json: model}),
contentType: 'application/json', contentType: 'application/json',
type: 'POST', type: 'POST',
success: function(data, textStatus, jqXHR){ success: function(data, textStatus, jqXHR){
callback(data); callback(data);
} }
}); });
}; };
return that; return that;
}; };
var DreamNamespace = (function () {
var that = {};
/**
* Creates a new dream instance.
* @method newDream
* @param {object} model The model definition
* @return {object} The new Dream instance.
*/
Object.defineProperty(that, "newDream", {
configurable: false,
enumerable: false,
writable: false,
value: function (configuration) {
var instance = dream(configuration);
return instance;
}
});
return that;
})();
Object.defineProperty(scope, "DREAM", {
configurable: false,
enumerable: false,
writable: false,
value: DreamNamespace
});
}(window, jQuery, jsPlumb, console, _)); }(window, jQuery, jsPlumb, console, _));
dream/platform/static/src/dream_launcher.js
View file @ 82ed9470
...@@ -84,7 +84,7 @@ ...@@ -84,7 +84,7 @@
_class: 'Dream.Repairman', }, _class: 'Dream.Repairman', },
} }
dream_instance = DREAM.newDream(configuration) dream_instance = Dream(configuration)
dream_instance.start(); dream_instance.start();
$( ".tool" ).draggable({ opacity: 0.7, helper: "clone", $( ".tool" ).draggable({ opacity: 0.7, helper: "clone",
stop: function(tool) { stop: function(tool) {
......
dream/platform/static/src/jsonPlumb.js
View file @ 82ed9470
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
(function (scope, $, jsPlumb, console, _) { (function (scope, $, jsPlumb, console, _) {
"use strict"; "use strict";
var jsonPlumb = function (model) { scope.jsonPlumb = function (model) {
var that = {}, priv = {}; var that = {}, priv = {};
priv.onError = function(error) { priv.onError = function(error) {
...@@ -150,172 +150,103 @@ ...@@ -150,172 +150,103 @@
priv.onDataChange(); priv.onDataChange();
}; };
Object.defineProperty(that, "updateElementData", { that.updateElementData = function (element_id, data) {
configurable: false, _.extend(priv.element_container[element_id], data);
enumerable: false, priv.onDataChange();
writable: false, };
value: function (element_id, data) {
_.extend(priv.element_container[element_id], data);
priv.onDataChange();
}
});
Object.defineProperty(that, "start", {
configurable: false,
enumerable: false,
writable: false,
value: function () {
priv.element_container = {};
priv.preference_container = {};
priv.general_container = {};
priv.initJsPlumb();
}
});
Object.defineProperty(that, "removeElement", { that.start = function () {
configurable: false, priv.element_container = {};
enumerable: false, priv.preference_container = {};
writable: false, priv.general_container = {};
value: function (element_id) { priv.initJsPlumb();
console.log("going to remove element", element_id); };
priv.removeElement(element_id);
}
});
Object.defineProperty(that, "getData", { that.removeElement = function (element_id) {
configurable: false, console.log("going to remove element", element_id);
enumerable: false, priv.removeElement(element_id);
writable: false, };
value: function () {
return priv.getData();
}
});
Object.defineProperty(that, "clearAll", { that.getData = function () {
configurable: false, return priv.getData();
enumerable: false, };
writable: false,
value: function () {
$("[id=render]").children().remove()
_.each(_.pairs(priv.element_container), function(element, index) {
priv.removeElement(element[0]);
});
}
});
Object.defineProperty(that, "connect", { that.clearAll = function () {
configurable: false, $("[id=render]").children().remove()
enumerable: false, _.each(_.pairs(priv.element_container), function(element, index) {
writable: false, priv.removeElement(element[0]);
value: function (source_id, target_id) { });
jsPlumb.connect({source: source_id, target: target_id}); };
}
});
Object.defineProperty(that, "setGeneralProperties", { that.connect = function (source_id, target_id) {
configurable: false, jsPlumb.connect({source: source_id, target: target_id});
enumerable: false, };
writable: false,
value: function (properties) { // XXX or k, v ?
priv.general_container = properties;
priv.onDataChange();
},
});
Object.defineProperty(that, "newElement", { that.setGeneralProperties = function (properties) {
configurable: false, priv.general_container = properties;
enumerable: false, priv.onDataChange();
writable: false, };
value: function (element, option) {
var render_element, style_string="", coordinate = {};
render_element = $("[id=render]");
if (element.coordinate !== undefined) {
priv.updateElementCoordinate(element.id, element.coordinate.x, element.coordinate.y)
var main_div_offset = $("#main").offset();
coordinate.x = element.coordinate.x - main_div_offset.left;
coordinate.y = element.coordinate.y - main_div_offset.top;
_.each(coordinate, function(value, key, list) { that.newElement = function (element, option) {
if (key === "x") { var render_element, style_string="", coordinate = {};
key = "left"; render_element = $("[id=render]");
} else { if (element.coordinate !== undefined) {
key = "top"; priv.updateElementCoordinate(element.id, element.coordinate.x, element.coordinate.y)
} var main_div_offset = $("#main").offset();
style_string = style_string + key + ':' + value + 'px;'; coordinate.x = element.coordinate.x - main_div_offset.left;
}) coordinate.y = element.coordinate.y - main_div_offset.top;
}
if (style_string.length > 0) { _.each(coordinate, function(value, key, list) {
style_string = 'style="' + style_string + '"'; if (key === "x") {
} key = "left";
render_element.append('<div class="window" id="' + } else {
element.id + '" ' + style_string + '">' key = "top";
+ element.id + '</div>'); }
// Initial DEMO code : make all the window divs draggable style_string = style_string + key + ':' + value + 'px;';
priv.draggable();
// Add endPoint to allow drawing connections
var color = "#00f";
var gradient_color = "#09098e";
// Different endpoint color for Repairman
if (element._class === "Dream.Repairman") {
color = "rgb(189,11,11)";
gradient_color = "rgb(255,0,0)";
};
var endpoint = {
endpoint: "Rectangle",
paintStyle:{ width:25, height:21, fillStyle:color },
isSource:true,
scope:"blue rectangle",
/*connectorStyle : {
gradient:{stops:[[0, color], [0.5, gradient_color], [1, color]]},
lineWidth:5,
strokeStyle:color,
dashstyle:"2 2"
},*/
//connector: ["Bezier", { curviness:63 } ],
maxConnections:3,
isTarget:true,
//dropOptions : exampleDropOptions
};
_.each(_.pairs(option.anchor), function(value, key, list) {
var anchor = value[0],
endpoint_configuration = value[1];
jsPlumb.addEndpoint(element.id, { anchor: anchor }, endpoint);
}) })
priv.addElementToContainer(element);
} }
}); if (style_string.length > 0) {
style_string = 'style="' + style_string + '"';
return that;
};
var JsonPlumbNamespace = (function () {
var that = {};
/**
* Creates a new dream instance.
* @method newDream
* @param {object} model The model definition
* @return {object} The new Dream instance.
*/
Object.defineProperty(that, "newJsonPlumb", {
configurable: false,
enumerable: false,
writable: false,
value: function (model) {
var instance = jsonPlumb(model);
return instance;
} }
}); render_element.append('<div class="window" id="' +
element.id + '" ' + style_string + '">'
+ element.id + '</div>');
// Initial DEMO code : make all the window divs draggable
priv.draggable();
return that; // Add endPoint to allow drawing connections
})(); var color = "#00f";
var gradient_color = "#09098e";
// Different endpoint color for Repairman
if (element._class === "Dream.Repairman") {
color = "rgb(189,11,11)";
gradient_color = "rgb(255,0,0)";
};
var endpoint = {
endpoint: "Rectangle",
paintStyle:{ width:25, height:21, fillStyle:color },
isSource:true,
scope:"blue rectangle",
/*connectorStyle : {
gradient:{stops:[[0, color], [0.5, gradient_color], [1, color]]},
lineWidth:5,
strokeStyle:color,
dashstyle:"2 2"
},*/
//connector: ["Bezier", { curviness:63 } ],
maxConnections:3,
isTarget:true,
//dropOptions : exampleDropOptions
};
_.each(_.pairs(option.anchor), function(value, key, list) {
var anchor = value[0],
endpoint_configuration = value[1];
jsPlumb.addEndpoint(element.id, { anchor: anchor }, endpoint);
})
priv.addElementToContainer(element);
};
Object.defineProperty(scope, "jsonPlumb", { return that;
configurable: false, };
enumerable: false,
writable: false,
value: JsonPlumbNamespace
});
}(window, jQuery, jsPlumb, console, _)); }(window, jQuery, jsPlumb, console, _));
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