Change the meaning of view.aligned.zoom and of postwidth. Fix zoom in sequences/heatmaps.

This commit changes the meaning of view.aligned.zoom. Now it is not an
extra zoom to add to view.zoom.x, but instead it is directly the zoom
level in the aligned panel.

It also changes the meaning of "postwidth" in SeqFace, HeatmapFace,
and TextArrayFace. Now it is the width of each of the little
squares/positions for zoom=1. And if we change the zoom, everything
will contract or expand on the x axis.

Author: jordibc

ete4/smartview/draw.py

@@ -626,9 +626,9 @@ def get_col_data(rows, x_col, dx_col, nodes, pos_box, pos, bdy_dy, zoom,
 
     blocks = []  # will contain the column data to send afterwards
 
-    aligned_panel = not circular and pos in ['aligned', 'header']
+    in_aligned_panel = not circular and pos in ['aligned', 'header']
     zx, zy, za = zoom
-    zoom_xy = (zx * (za if aligned_panel else 1), zy)
+    zoom_xy = (zx if not in_aligned_panel else za, zy)
 
     # Iterate over the faces and get their graphics (none if
     # there's not enough space). We iterate reversed ([::-1]) so the

ete4/smartview/faces.py

@@ -414,7 +414,7 @@ def draw(self, nodes, size, collapsed, zoom=(1, 1), ax_ay=(0, 0), r=1):
         zx, zy = zoom
 
         if dx <= 0:  # no limit on dx? make it as big as possible
-            dx = self.poswidth * len(self.seq) / zx
+            dx = self.poswidth * len(self.seq)
 
         assert dy > 0 or self.hmax is not None, 'hmax needed'
         if dy <= 0:  # no limit on y? there better be hmax then
@@ -449,7 +449,7 @@ def draw(self, nodes, size, collapsed, zoom=(1, 1), ax_ay=(0, 0), r=1):
         zx, zy = zoom
 
         if dx <= 0:  # no limit on dx? make it as big as possible
-            dx = self.poswidth * len(self.values) / zx
+            dx = self.poswidth * len(self.values)
 
         assert dy > 0 or self.hmax is not None, 'hmax needed'
         if dy <= 0:  # no limit on y? there better be hmax then
@@ -485,7 +485,7 @@ def draw(self, nodes, size, collapsed, zoom=(1, 1), ax_ay=(0, 0), r=1):
         zx, zy = zoom
 
         if dx <= 0:  # no limit on dx? make it as big as possible
-            dx = self.poswidth * len(self.texts) / zx
+            dx = self.poswidth * len(self.texts)
 
         assert dy > 0 or self.hmax is not None, 'hmax needed'
         if dy <= 0:  # no limit on y? there better be hmax then

ete4/smartview/static/js/drag.js

@@ -116,7 +116,7 @@ function get_drag_scale() {
     if (dragging.element === div_tree)
         return [-1 / view.zoom.x, -1 / view.zoom.y];
     else if (dragging.element === div_aligned)
-        return [-1 / view.aligned.zoom / view.zoom.x, 0];
+        return [-1 / view.aligned.zoom, 0];
     else // dragging.element === div_visible_rect
         return [1 / view.minimap.zoom.x, 1 / view.minimap.zoom.y];
 }

ete4/smartview/static/js/draw.js

@@ -205,7 +205,7 @@ function get_items_per_panel(commands) {
 // Draw items in the aligned position.
 function draw_aligned(items, padding_x=15) {
     if (view.shape === "rectangular") {
-        const zoom = {x: view.zoom.x * view.aligned.zoom,
+        const zoom = {x: view.aligned.zoom,
                       y: view.zoom.y};
         const tl = {x: view.aligned.origin - padding_x / zoom.x,
                     y: view.tl.y};  // relative "top-left" point
@@ -221,7 +221,7 @@ function draw_aligned(items, padding_x=15) {
 
 // Draw a white box and a line to clean the space where the headers will go.
 function draw_header_background(xmax, padding_x=15) {
-    const zoom = {x: view.zoom.x * view.aligned.zoom,
+    const zoom = {x: view.aligned.zoom,
                   y: view.zoom.y};
     // Position where to put the header (in screen coordinates).
     const px = zoom.x * (xmax - view.aligned.origin) + padding_x,
@@ -260,7 +260,7 @@ function draw_header_background(xmax, padding_x=15) {
 // Draw items in the header position.
 function draw_header(items, padding_x=15) {
     if (view.shape === "rectangular") {
-        const zoom = {x: view.zoom.x * view.aligned.zoom,
+        const zoom = {x: view.aligned.zoom,
                       y: view.zoom.y};
         const tl = {x: view.aligned.origin - padding_x / zoom.x,
                     y: Math.min(-50 / zoom.y, view.tl.y + 10 / zoom.y)};

ete4/smartview/static/js/zoom.js

@@ -94,7 +94,7 @@ function zoom_aligned(x, zoom_in, deltaY) {
     const { origin, zoom } = view.aligned;  // shortcut
 
     const zoom_new = qz * zoom;
-    const origin_new = origin + (1 / zoom - 1 / zoom_new) / view.zoom.x * x;
+    const origin_new = origin + (1 / zoom - 1 / zoom_new) * x;
 
     view.aligned.origin = Math.max(0, origin_new);
     view.aligned.zoom = zoom_new;