fix calc

edit/header-resizer.js

@@ -6,26 +6,26 @@
 (function HeaderResizer() {
   const PREF_ID = 'editor.headerWidth';
   const el = $('#header-resizer');
-  let lastW, lastX;
+  let curW, offset;
   prefs.subscribe(PREF_ID, (key, val) => {
-    setLastWidth();
+    rememberCurWidth();
     setWidth(val);
   });
   el.onmousedown = e => {
     if (e.button) return;
-    setLastWidth();
-    lastX = e.clientX;
+    rememberCurWidth();
+    offset = curW - e.clientX;
     document.body.classList.add('resizing-h');
     document.on('mousemove', resize);
     document.on('mouseup', resizeStop);
   };
 
+  function rememberCurWidth() {
+    curW = $('#header').offsetWidth;
+  }
+
   function resize({clientX: x}) {
-    const w = setWidth(lastW + x - lastX);
-    if (!w) return;
-    lastW = w;
-    lastX = x;
-    prefs.set(PREF_ID, w);
+    prefs.set(PREF_ID, setWidth(offset + x));
   }
 
   function resizeStop() {
@@ -34,16 +34,14 @@
     document.body.classList.remove('resizing-h');
   }
 
-  function setLastWidth() {
-    lastW = $('#header').clientWidth;
-  }
-
   /** @returns {number|void} new width in case it's different, otherwise void */
   function setWidth(w) {
-    const delta = (w = editor.updateHeaderWidth(w)) - lastW;
-    if (!delta) return;
-    for (const el of $$('.CodeMirror-linewidget[style*="width:"]')) {
-      el.style.width = parseFloat(el.style.width) - delta + 'px';
+    const delta = (w = editor.updateHeaderWidth(w)) - curW;
+    if (delta) {
+      curW = w;
+      for (const el of $$('.CodeMirror-linewidget[style*="width:"]')) {
+        el.style.width = parseFloat(el.style.width) - delta + 'px';
+      }
     }
     return w;
   }