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 @@
(function (scope, $, jsPlumb, console, _) {
"use strict";
var dream = function (configuration) {
var that = {}, priv = {}, general = {};
scope.Dream = function (configuration) {
var that = jsonPlumb(), priv = {};
priv.onError = function(error) {
console.log("Error", error);
......@@ -62,17 +62,13 @@
render_element.append('<p/><a id="clear_all">Clear All</a>');
};
priv.removeElement = function(element_id) {
priv.plumb.removeElement(element_id);
};
priv.initDialog = function() {
$( "#dialog-form" ).dialog({autoOpen: false});
};
priv.initGeneralProperties = function() {
var fieldset = $("#general-fieldset"),
previous_data = priv.plumb.getData()['general'],
previous_data = that.getData()['general'],
previous_value = "",
prefix = "General-";
fieldset.children().remove()
......@@ -108,7 +104,7 @@
$("#dialog-fieldset").children().remove()
var element_id_prefix = element_id.split("_")[0];
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.data || {};
var previous_value;
......@@ -153,7 +149,7 @@
},
Delete: function() {
if (confirm("Are you sure you want to delete " + element_id + " ?")) {
priv.removeElement(element_id);
that.removeElement(element_id);
}
$( this ).dialog( "close" );
},
......@@ -178,7 +174,7 @@
});
};
updateDataPropertyList(property_list, data);
priv.plumb.updateElementData(element_id, {data: data});
that.updateElementData(element_id, {data: data});
$( this ).dialog( "close" );
},
},
......@@ -188,97 +184,55 @@
});
};
Object.defineProperty(that, "newElement", {
configurable: false,
enumerable: false,
writable: false,
value: function (element) {
var element_prefix = element.id.split('_')[0]
priv.plumb.newElement(element, configuration[element_prefix]);
$("#" + element.id).bind('click', function() {
console.log("bind click on window", $(this));
$( "#dialog-form" ).dialog( "destroy" ) ;
priv.prepareDialogForElement(element.id, element.id);
$( "#dialog-form" ).dialog( "open" );
});
// Store default values
var data = {}, property_list = configuration[element_prefix]["property_list"] || [];
var updateDefaultData = function(data, property_list) {
_.each(property_list, function(element, key) {
console.log("going to parse property_list, element", element);
if(element._class === "Dream.Property") {
data[element.id] = element.default;
} else if (element._class === "Dream.PropertyList") {
data[element.id] = {};
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.super_newElement = that.newElement;
that.newElement = function (element) {
var element_prefix = element.id.split('_')[0]
priv.super_newElement(element, configuration[element_prefix]);
$("#" + element.id).bind('click', function() {
console.log("bind click on window", $(this));
$( "#dialog-form" ).dialog( "destroy" ) ;
priv.prepareDialogForElement(element.id, element.id);
$( "#dialog-form" ).dialog( "open" );
});
// Store default values
var data = {}, property_list = configuration[element_prefix]["property_list"] || [];
var updateDefaultData = function(data, property_list) {
_.each(property_list, function(element, key) {
console.log("going to parse property_list, element", element);
if(element._class === "Dream.Property") {
data[element.id] = element.default;
} else if (element._class === "Dream.PropertyList") {
data[element.id] = {};
var next_data = data[element.id];
var next_property_list = element.property_list || [];
updateDefaultData(next_data, next_property_list);
}
});
priv.plumb.setGeneralProperties(general_properties);
priv.initGeneralProperties();
}
});
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);
}
});
updateDefaultData(data, property_list);
that.updateElementData(element.id, {data: data});
};
Object.defineProperty(that, "updateElementData", {
configurable: false,
enumerable: false,
writable: false,
value: function (element_id, data) {
priv.plumb.updateElementData(element_id, data);
}
});
priv.super_start = that.start;
that.start = function() {
priv.super_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;
});
that.setGeneralProperties(general_properties);
that.initGeneralProperties();
};
Object.defineProperty(that, "clearAll", {
configurable: false,
enumerable: false,
writable: false,
value: function () {
priv.plumb.clearAll();
}
});
that.initGeneralProperties = function() {
priv.initGeneralProperties();
};
function formatForManpy(data) {
priv.formatForManpy = function(data) {
var manpy_dict = {}, coreObject = [], core_object_dict = {};
$.each(data['element'], function(idx, element) {
var clone_element = {};
......@@ -313,15 +267,9 @@
return manpy_dict;
}
that.setGeneralProperties = function(properties) {
priv.plumb.setGeneralProperties(properties);
}
that.getData = function() { return priv.plumb.getData() };
that.runSimulation = function(callback) {
// handle Dream.General properties (in another function maybe ?)
var prefix = "General-", properties = {}, prefixed_property_id;
// handle Dream.General properties (in another function maybe ?)
var prefix = "General-", properties = {}, prefixed_property_id;
$.each(configuration['Dream-Configuration']['property_list'],
function(idx, property){
......@@ -329,51 +277,22 @@
prefixed_property_id = prefix + property.id;
properties[property.id] = $("#" + prefixed_property_id).val();
}
});
priv.plumb.setGeneralProperties(properties);
var model = formatForManpy(priv.plumb.getData());
$.ajax(
'/runSimulation', {
data: JSON.stringify({json: model}),
contentType: 'application/json',
type: 'POST',
success: function(data, textStatus, jqXHR){
callback(data);
}
});
that.setGeneralProperties(properties);
var model = priv.formatForManpy(that.getData());
$.ajax(
'/runSimulation', {
data: JSON.stringify({json: model}),
contentType: 'application/json',
type: 'POST',
success: function(data, textStatus, jqXHR){
callback(data);
}
});
};
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, _));
dream/platform/static/src/dream_launcher.js
View file @ 82ed9470
......@@ -84,7 +84,7 @@
_class: 'Dream.Repairman', },
}
dream_instance = DREAM.newDream(configuration)
dream_instance = Dream(configuration)
dream_instance.start();
$( ".tool" ).draggable({ opacity: 0.7, helper: "clone",
stop: function(tool) {
......
dream/platform/static/src/jsonPlumb.js
View file @ 82ed9470
......@@ -19,7 +19,7 @@
(function (scope, $, jsPlumb, console, _) {
"use strict";
var jsonPlumb = function (model) {
scope.jsonPlumb = function (model) {
var that = {}, priv = {};
priv.onError = function(error) {
......@@ -150,172 +150,103 @@
priv.onDataChange();
};
Object.defineProperty(that, "updateElementData", {
configurable: false,
enumerable: false,
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();
}
});
that.updateElementData = function (element_id, data) {
_.extend(priv.element_container[element_id], data);
priv.onDataChange();
};
Object.defineProperty(that, "removeElement", {
configurable: false,
enumerable: false,
writable: false,
value: function (element_id) {
console.log("going to remove element", element_id);
priv.removeElement(element_id);
}
});
that.start = function () {
priv.element_container = {};
priv.preference_container = {};
priv.general_container = {};
priv.initJsPlumb();
};
Object.defineProperty(that, "getData", {
configurable: false,
enumerable: false,
writable: false,
value: function () {
return priv.getData();
}
});
that.removeElement = function (element_id) {
console.log("going to remove element", element_id);
priv.removeElement(element_id);
};
Object.defineProperty(that, "clearAll", {
configurable: false,
enumerable: false,
writable: false,
value: function () {
$("[id=render]").children().remove()
_.each(_.pairs(priv.element_container), function(element, index) {
priv.removeElement(element[0]);
});
}
});
that.getData = function () {
return priv.getData();
};
Object.defineProperty(that, "connect", {
configurable: false,
enumerable: false,
writable: false,
value: function (source_id, target_id) {
jsPlumb.connect({source: source_id, target: target_id});
}
});
that.clearAll = function () {
$("[id=render]").children().remove()
_.each(_.pairs(priv.element_container), function(element, index) {
priv.removeElement(element[0]);
});
};
Object.defineProperty(that, "setGeneralProperties", {
configurable: false,
enumerable: false,
writable: false,
value: function (properties) { // XXX or k, v ?
priv.general_container = properties;
priv.onDataChange();
},
});
that.connect = function (source_id, target_id) {
jsPlumb.connect({source: source_id, target: target_id});
};
Object.defineProperty(that, "newElement", {
configurable: false,
enumerable: false,
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;
that.setGeneralProperties = function (properties) {
priv.general_container = properties;
priv.onDataChange();
};
_.each(coordinate, function(value, key, list) {
if (key === "x") {
key = "left";
} else {
key = "top";
}
style_string = style_string + key + ':' + value + 'px;';
})
}
if (style_string.length > 0) {
style_string = 'style="' + style_string + '"';
}
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();
// 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);
that.newElement = 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) {
if (key === "x") {
key = "left";
} else {
key = "top";
}
style_string = style_string + key + ':' + value + 'px;';
})
priv.addElementToContainer(element);
}
});
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;
if (style_string.length > 0) {
style_string = 'style="' + style_string + '"';
}
});
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", {
configurable: false,
enumerable: false,
writable: false,
value: JsonPlumbNamespace
});
return that;
};
}(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