From 274b86532a92542a91f9e6d487d411449ae5ccdd Mon Sep 17 00:00:00 2001
From: Connor Turland <connorturland@gmail.com>
Date: Wed, 1 Feb 2017 18:08:02 +0000
Subject: [PATCH] its vorkingg....

---
 frontend/src/ConvoAlgo/index.js         |  4 ++--
 frontend/src/Metamaps/Engine.js         | 10 +++++-----
 frontend/src/Metamaps/Realtime/index.js | 10 ++++++++--
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/frontend/src/ConvoAlgo/index.js b/frontend/src/ConvoAlgo/index.js
index 428c915b..69faffa6 100644
--- a/frontend/src/ConvoAlgo/index.js
+++ b/frontend/src/ConvoAlgo/index.js
@@ -108,11 +108,11 @@ export const generateObjectCoordinates = (layoutObject, focalTopicId, focalCoord
       // set the focalCoord to be what it already was
       coords[topic.id] = focalCoords
     } else if (!parent && !child) {
-      coords[topic.id] = {x: 0, y: 150}
+      coords[topic.id] = {x: 0, y: 250}
     } else if (parent) {
       coords[topic.id] = {
         x: coords[parent.id].x + 250,
-        y: coords[parent.id].y
+        y: coords[parent.id].y - (parent.id === focalTopicId ? 250 : 0)
       }
     } else if (child) {
       coords[topic.id] = {
diff --git a/frontend/src/Metamaps/Engine.js b/frontend/src/Metamaps/Engine.js
index 5ac2d079..77c9c9a4 100644
--- a/frontend/src/Metamaps/Engine.js
+++ b/frontend/src/Metamaps/Engine.js
@@ -18,8 +18,7 @@ const Engine = {
   run: init => {
     if (init) {
       if (Active.Mapper && Object.keys(Visualize.mGraph.graph.nodes).length) {
-        Engine.setFocusNode(Engine.findFocusNode(Visualize.mGraph.graph.nodes))
-        Engine.runLayout(true)
+        Engine.setFocusNode(Engine.findFocusNode(Visualize.mGraph.graph.nodes), true)
       }
     }
   },
@@ -56,16 +55,17 @@ const Engine = {
   findFocusNode: nodes => {
     return last(sortBy(values(nodes), n => new Date(n.getData('topic').get('created_at'))))
   },
-  setFocusNode: node => {
+  setFocusNode: (node, init) => {
     if (!Active.Mapper) return
     Create.newSynapse.focusNode = node
     Mouse.focusNodeCoords = node.pos
     Mouse.newNodeCoords = {
-      x: node.x + 200,
-      y: node.y
+      x: node.pos.x + 200,
+      y: node.pos.y
     }
     Create.newSynapse.updateForm()
     Create.newTopic.position()
+    Engine.runLayout(init)
   },
   addEdge: edge => {
     Engine.runLayout()
diff --git a/frontend/src/Metamaps/Realtime/index.js b/frontend/src/Metamaps/Realtime/index.js
index b613239b..e2b2de3c 100644
--- a/frontend/src/Metamaps/Realtime/index.js
+++ b/frontend/src/Metamaps/Realtime/index.js
@@ -5,6 +5,7 @@ import SocketIoConnection from 'simplewebrtc/socketioconnection'
 
 import Active from '../Active'
 import Cable from '../Cable'
+import Create from '../Create'
 import DataModel from '../DataModel'
 import JIT from '../JIT'
 import Util from '../Util'
@@ -234,8 +235,13 @@ let Realtime = {
   setupLocalEvents: function() {
     var self = Realtime
     // local event listeners that trigger events
-    $(document).on(JIT.events.zoom + '.map', self.positionPeerIcons)
-    $(document).on(JIT.events.pan + '.map', self.positionPeerIcons)
+    const panOrZoom = () => {
+      self.positionPeerIcons()
+      Create.newSynapse.updateForm()
+      Create.newTopic.position()
+    }
+    $(document).on(JIT.events.zoom + '.map', panOrZoom)
+    $(document).on(JIT.events.pan + '.map', panOrZoom)
     $(document).on('mousemove.map', function(event) {
       var pixels = {
         x: event.pageX,