import zoom from './zoom';
import pan from './pan';
const storageKey = "pan-zoom";
const zoomFactor = 0.25;
function restorePanZoomVal(el) {
const storedPanZoomVal = localStorage.getItem(storageKey);
if (storedPanZoomVal) el.style.transform = storedPanZoomVal;
}
function addEventListeners(svg, el) {
svg.addEventListener("wheel", zoom(el, zoomFactor), { passive: false });
svg.addEventListener("pointerdown", pan(el), { passive: false });
}
function storePanZoomVal(transformMatrix) {
localStorage.setItem(storageKey, transformMatrix);
}
function observePanZoomChanges(el) {
const observer = new MutationObserver(() =>
storePanZoomVal(el.style.transform),
);
observer.observe(el, { attributeFilter: ["style"] });
}
export function start(svg, selector) {
const targetEl = svg.querySelector(selector);
restorePanZoomVal(targetEl);
addEventListeners(svg, targetEl);
observePanZoomChanges(targetEl);
}