Use framerate-independent lerp. Very Freya-esque in that sense.

client/webgl_draw.js

@@ -630,18 +630,21 @@ async function draw(state, context, animate, ts) {
     }
 
     if (state.canvas.target_zoom != state.canvas.zoom) {
-        update_canvas_zoom(state, state.canvas.zoom, state.canvas.target_zoom, animate ? dt : context.last_frame_dt);
+        update_canvas_zoom(state, state.canvas.zoom, state.canvas.target_zoom, animate ? dt : 0);
         schedule_draw(state, context, true);
     }
+}
 
-    context.last_frame_dt = dt;
+// https://www.youtube.com/watch?v=LSNQuFEDOyQ
+function exp_decay(a, b, decay, dt) {
+    return b + (a - b) * Math.exp(-decay * dt);
 }
 
 function update_canvas_zoom(state, current, target, dt) {
-    const rate = Math.min(1.0, dt / 16.66 * 0.3);
+    const decay = 16;
 
     if (Math.abs(1.0 - current / target) > 0.01) {
-        state.canvas.zoom = current + (target - current) * rate;
+        state.canvas.zoom = exp_decay(state.canvas.zoom, target, decay, dt / 1000.0);
     } else {
         state.canvas.zoom = target;
     }

client/webgl_listeners.js

@@ -91,7 +91,7 @@ function zenmode() {
 }
 
 function enter_picker_mode(state, context) {
-    if (state.tools.active === 'pencil') { // or other drawing tools
+    if (['pencil', 'ruler'].includes(state.tools.active)) { // or other drawing tools
         document.querySelector('canvas').classList.add('picker'); 
         document.querySelector('.picker-preview-outer').classList.remove('dhide');
         document.querySelector('.brush-dom').classList.add('dhide');