From ae38369333a1047e48f551befe8ded60ec75ce14 Mon Sep 17 00:00:00 2001
From: Josua Krause <josua.krause@gmail.com>
Date: Sun, 15 Mar 2015 22:14:15 -0400
Subject: [PATCH] mention #34 and input granularity issues and fix grid drawing
 bug - the zoom range does not get updated depending on the input. This causes
 issues with datasets that require a wider range. Increased the range for now.
 Filed as #34.

- Datasets that have an event granularity (minTimeDiff) that is too small become flat/invisible lines (aspect ratio). Mentioned this behaviour, which can be avoided by binning timestamps, in `spec.md`. If this level of granularity is needed a way to manually set minTimeDiff could possibly be created but might break all assumptions about co-occurring events in the code base.

- the grid drawing routine previously used the svgport for determining the sizes of the lines which is wrong (lines would normally extend beyond the viewport due to this so it wasn't noticeable)
---
 index.html     |  2 +-
 js/typepool.js | 20 +++++++++++++-------
 spec.md        |  4 ++++
 3 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index b286589..e9d6977 100644
--- a/index.html
+++ b/index.html
@@ -181,7 +181,7 @@
     var visRect = jkjs.zui.computeVisibleRect(translate, scale, w, h);
     overview.updateCameraRect(canvasRect, visRect, isSmooth);
     pool.onViewportChange(box, visRect, scale, isSmooth);
-  }, [ 1e-2, 3 ]);
+  }, [ 1e-6, 12 ]); // be generous with zooming! FIXME: adapt zoom extent depending on minTimeDiff #34
 
   function updateViewport() {
     zui.move(0, 0, false);
diff --git a/js/typepool.js b/js/typepool.js
index e07c9cc..556776a 100644
--- a/js/typepool.js
+++ b/js/typepool.js
@@ -707,7 +707,13 @@ function TypePool(busy, overview, setBox, onVC, cw, rh) {
   var hGrids = [];
   var newHGrids = [];
   var gridSize = 100;
-  function updateGrid(svgport, viewport, scale, smooth) {
+  function updateGrid(_ /*svgport*/, viewport, scale, smooth) {
+    var vrect = {
+      x: 0,
+      y: 0,
+      width: viewport.width * scale,
+      height: viewport.height * scale
+    };
     if(smooth || inTransition) {
       vGrids.forEach(function(s) {
         s.remove();
@@ -746,8 +752,8 @@ function TypePool(busy, overview, setBox, onVC, cw, rh) {
       s.attr({
         "x1": x,
         "x2": x,
-        "y1": svgport.y - gridSize - (viewport.y * scale - gridSize) % gridSize,
-        "y2": svgport.height + gridSize
+        "y1": vrect.y - gridSize - (viewport.y * scale - gridSize) % gridSize,
+        "y2": vrect.y + vrect.height + gridSize
       });
     });
     newVGrids = [];
@@ -760,8 +766,8 @@ function TypePool(busy, overview, setBox, onVC, cw, rh) {
     while(dist > gridSize * 1.5) {
       dist /= 2;
     }
-    var yStart = svgport.y - dist - (viewport.y * scale - dist) % dist;
-    for(var yPos = yStart;yPos < svgport.y + svgport.height;yPos += dist) {
+    var yStart = vrect.y - dist - (viewport.y * scale - dist) % dist;
+    for(var yPos = yStart;yPos <= vrect.y + vrect.height;yPos += dist) {
       newHGrids.push(yPos);
     }
     adjust(hGrids, newHGrids, "line", {
@@ -773,8 +779,8 @@ function TypePool(busy, overview, setBox, onVC, cw, rh) {
     hGrids.forEach(function(s, ix) {
       var y = newHGrids[ix];
       s.attr({
-        "x1": svgport.x - gridSize - (viewport.x * scale - gridSize) % gridSize,
-        "x2": svgport.width + gridSize,
+        "x1": vrect.x - gridSize - (viewport.x * scale - gridSize) % gridSize,
+        "x2": vrect.width + gridSize,
         "y1": y,
         "y2": y
       });
diff --git a/spec.md b/spec.md
index 60fa256..476b3df 100644
--- a/spec.md
+++ b/spec.md
@@ -12,6 +12,10 @@ apply and they must be globally unique).
 Colors are all valid CSS colors (named, hexadecimal, rgb, …)
 A set of good colors is `["#80b1d3", "#4daf4a", "#fb8072", "#ff7f00", "#eb9adb"]`.
 Timestamps are UNIX timestamps in seconds since standard epoch.
+Keep in mind that the unit for positions is determined by the smallest difference
+between events. It might be better to bin timestamps into coarser steps when
+the input times are too granular (the visualization might become flat or invisible).
+Binning also helps to make co-occurring events behave more intuitive.
 
 ## Patient file creation format