make convertToRelativePosition public and use it when adding an element.

dream/platform/static/src/dream_launcher.js

@@ -216,16 +216,18 @@
       stop: function (tool) {
         var box_top, box_left, _class;
         var offset = $("#render").offset();
-        box_top = (tool.clientY - offset.top)  / $('#main').height();
-        box_left = (tool.clientX - offset.left)  / $('#main').width();
+        box_top = tool.clientY - offset.top + "px";
+        box_left = tool.clientX - offset.left + "px";
+        var relative_position = dream_instance.convertToRelativePosition(
+          box_left, box_top);
         id_container[tool.target.id] = (id_container[tool.target.id] || 0) +
           1;
         _class = tool.target.id.replace('-', '.'); // XXX - vs .
         dream_instance.newElement({
           id: tool.target.id + "_" + id_container[tool.target.id],
           coordinate: {
-            top: box_top,
-            left: box_left
+            top: relative_position[1],
+            left: relative_position[0]
           },
           _class: _class
         });

dream/platform/static/src/jsonPlumb.js

@@ -112,7 +112,7 @@
       if (coordinate === undefined) {
         coordinate = {};
         element = $("#" + element_id);
-        var relative_position = priv.convertToRelativePosition(
+        var relative_position = that.convertToRelativePosition(
           element.css('left'), element.css('top'));
         coordinate.top = relative_position[1];
         coordinate.left = relative_position[0];
@@ -148,7 +148,7 @@
       return [left, top];
     };
 
-    priv.convertToRelativePosition = function(x, y) {
+    that.convertToRelativePosition = function(x, y) {
       var canvas_size_x = $('#main').width();
       var canvas_size_y = $('#main').height();
       var size_x = $('.window').width();
@@ -169,9 +169,8 @@
 
     priv.draggable = function () {
       // make all the window divs draggable
-      var stop = function (el) {
-        var element_id = el.target.id;
-        priv.updateElementCoordinate(element_id);
+      var stop = function (element) {
+        priv.updateElementCoordinate(element.target.id);
       };
       jsPlumb.draggable(jsPlumb.getSelector(".window"), {
         grid: [10, 10],