rework client drawing code

lib/forcegraph.js

@@ -288,27 +288,24 @@ define(["d3"], function (d3) {
         if (clients === 0)
           return
 
-        var distance = 16
+        var startDistance = 16
         var radius = 3
         var a = 1.2
         var startAngle = Math.PI
-        var angle = startAngle
 
-        for (var i = 0; i < clients; i++) {
-          if ((angle - startAngle) > 2 * Math.PI) {
-            angle = startAngle
-            distance += 2 * radius * a
-          }
+        for (var orbit = 0, i = 0; i < clients; orbit++) {
+          var distance = startDistance + orbit * 2 * radius * a
+          var n = Math.floor((Math.PI * distance) / (a * radius))
+          var delta = clients - i
 
-          var x = d.x + distance * Math.cos(angle)
-          var y = d.y + distance * Math.sin(angle)
+          for (var j = 0; j < Math.min(delta, n); i++, j++) {
+            var angle = 2 * Math.PI / n * j
+            var x = d.x + distance * Math.cos(angle + startAngle)
+            var y = d.y + distance * Math.sin(angle + startAngle)
 
             ctx.moveTo(x, y)
             ctx.arc(x, y, radius, 0, 2 * Math.PI)
-
-          var n = Math.floor((Math.PI * distance) / (a * radius))
-          var angleDelta = 2 * Math.PI / n
-          angle += angleDelta
+          }
         }
       })
 

lib/map/clientlayer.js

@@ -53,25 +53,19 @@ define(["leaflet", "jshashes"],
           p.x -= s.x
           p.y -= s.y
 
-          var distance = startDistance
-          var startAngle = d.startAngle
-          var angle = startAngle
-
-          for (var i = 0; i < clients; i++) {
-            if ((angle - startAngle) > 2 * Math.PI) {
-              angle = startAngle
-              distance += 2 * radius * a
-            }
+          for (var orbit = 0, i = 0; i < clients; orbit++) {
+            var distance = startDistance + orbit * 2 * radius * a
+            var n = Math.floor((Math.PI * distance) / (a * radius))
+            var delta = clients - i
 
-            var x = p.x + distance * Math.cos(angle)
-            var y = p.y + distance * Math.sin(angle)
+            for (var j = 0; j < Math.min(delta, n); i++, j++) {
+              var angle = 2 * Math.PI / n * j
+              var x = p.x + distance * Math.cos(angle + d.startAngle)
+              var y = p.y + distance * Math.sin(angle + d.startAngle)
 
               ctx.moveTo(x, y)
               ctx.arc(x, y, radius, 0, 2 * Math.PI)
-
-            var n = Math.floor((Math.PI * distance) / (a * radius))
-            var angleDelta = 2 * Math.PI / n
-            angle += angleDelta
+            }
           }
         })