zoomaccel/content.js

let zoomLevel = 1;
let lastGestureTime = 0;
let lastGestureScale = 1;
const minZoom = 0.1;
const maxZoom = 5;
let accelerationCurve = [1, 1, 1, 1, 1];

function interpolateAcceleration(speed) {
  const index = Math.min(
    Math.floor((speed * (accelerationCurve.length - 1)) / 2),
    accelerationCurve.length - 2,
  );
  const t = ((speed * (accelerationCurve.length - 1)) / 2) % 1;
  return accelerationCurve[index] * (1 - t) + accelerationCurve[index + 1] * t;
}

function applyZoom(delta, speed) {
  const accelerationMultiplier = interpolateAcceleration(speed);
  const zoomChange = delta * accelerationMultiplier;
  zoomLevel *= 1 + zoomChange;
  zoomLevel = Math.min(Math.max(zoomLevel, minZoom), maxZoom);

  document.body.style.transform = `scale(${zoomLevel})`;
  document.body.style.transformOrigin = "center top";

  // Update Icon via Messages
  chrome.runtime.sendMessage({
    action: "updateZoomInfo",
    zoomLevel: zoomLevel,
    accelerationMultiplier: accelerationMultiplier,
  });
}

window.addEventListener(
  "wheel",
  (event) => {
    if (event.ctrlKey || event.metaKey) {
      event.preventDefault();
      const currentTime = performance.now();
      const timeDiff = (currentTime - lastGestureTime) / 1000;
      const delta = event.deltaY * -0.001;
      const speed = Math.abs(delta / timeDiff);
      applyZoom(delta, speed);
      lastGestureTime = currentTime;
    }
  },
  { passive: false },
);

window.addEventListener(
  "gesturestart",
  (event) => {
    event.preventDefault();
    lastGestureScale = 1;
    lastGestureTime = performance.now();
  },
  { passive: false },
);

window.addEventListener(
  "gesturechange",
  (event) => {
    event.preventDefault();
    const currentTime = performance.now();
    const timeDiff = (currentTime - lastGestureTime) / 1000;
    const delta = event.scale - lastGestureScale;
    const speed = Math.abs(delta / timeDiff);
    applyZoom(delta, speed);
    lastGestureScale = event.scale;
    lastGestureTime = currentTime;
  },
  { passive: false },
);

window.addEventListener(
  "gestureend",
  (event) => {
    event.preventDefault();
  },
  { passive: false },
);

chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  if (request.action === "updateSettings") {
    accelerationCurve = request.settings;
  }
});

chrome.storage.sync.get("accelerationCurve", (data) => {
  if (data.accelerationCurve) {
    accelerationCurve = data.accelerationCurve;
  }
});