maplair/dist/esm/dom/PosAnimation.js

JavaScript library for mobile-friendly interactive maps

import { getPosition, setPosition } from "./DomUtil.js";
import { Evented } from "../core/Events.js";
//#region src/dom/PosAnimation.js
var PosAnimation = class PosAnimation extends Evented {
	constructor(...args) {
		super(...args);
		this.callInitHooks(PosAnimation);
	}
	run(el, newPos, duration, easeLinearity) {
		this.stop();
		this._el = el;
		this._inProgress = true;
		this._duration = duration ?? .25;
		this._easeOutPower = 1 / Math.max(easeLinearity ?? .5, .2);
		this._startPos = getPosition(el);
		this._offset = newPos.subtract(this._startPos);
		this._startTime = Date.now();
		this.fire("start");
		this._animate();
	}
	stop() {
		if (!this._inProgress) return;
		this._step(true);
		this._complete();
	}
	_animate() {
		this._animId = requestAnimationFrame(this._animate.bind(this));
		this._step();
	}
	_step(round) {
		const elapsed = Date.now() - this._startTime, duration = this._duration * 1e3;
		if (elapsed < duration) this._runFrame(this._easeOut(elapsed / duration), round);
		else {
			this._runFrame(1);
			this._complete();
		}
	}
	_runFrame(progress, round) {
		const pos = this._startPos.add(this._offset.multiplyBy(progress));
		if (round) pos._round();
		setPosition(this._el, pos);
		this.fire("step");
	}
	_complete() {
		cancelAnimationFrame(this._animId);
		this._inProgress = false;
		this.fire("end");
	}
	_easeOut(t) {
		return 1 - (1 - t) ** this._easeOutPower;
	}
};
//#endregion
export { PosAnimation };

//# sourceMappingURL=PosAnimation.js.map