maplair/dist/esm/map/handler/KeyboardHandler.js

JavaScript library for mobile-friendly interactive maps

import { Point } from "../../geometry/Point.js";
import { off, on, stop } from "../../dom/DomEvent.js";
import { Handler } from "../../core/Handler.js";
//#region src/map/handler/KeyboardHandler.js
var KeyboardHandler = class KeyboardHandler extends Handler {
	static keyCodes = {
		left: ["ArrowLeft"],
		right: ["ArrowRight"],
		down: ["ArrowDown"],
		up: ["ArrowUp"],
		zoomIn: [
			"Equal",
			"NumpadAdd",
			"BracketRight"
		],
		zoomOut: [
			"Minus",
			"NumpadSubtract",
			"Digit6",
			"Slash"
		]
	};
	constructor(map) {
		super(map);
		this._setPanDelta(map.options.keyboardPanDelta);
		this._setZoomDelta(map.options.zoomDelta);
		this.callInitHooks(KeyboardHandler);
	}
	addHooks() {
		const container = this._map._container;
		if (container.tabIndex <= 0) container.tabIndex = "0";
		container.ariaKeyShortcuts = Object.values(KeyboardHandler.keyCodes).flat().join(" ");
		on(container, {
			focus: this._onFocus,
			blur: this._onBlur,
			pointerdown: this._onPointerDown
		}, this);
		this._map.on({
			focus: this._addHooks,
			blur: this._removeHooks
		}, this);
	}
	removeHooks() {
		this._removeHooks();
		off(this._map._container, {
			focus: this._onFocus,
			blur: this._onBlur,
			pointerdown: this._onPointerDown
		}, this);
		this._map.off({
			focus: this._addHooks,
			blur: this._removeHooks
		}, this);
	}
	_onPointerDown() {
		if (this._focused) return;
		const body = document.body, docEl = document.documentElement, top = body.scrollTop || docEl.scrollTop, left = body.scrollLeft || docEl.scrollLeft;
		this._map._container.focus();
		window.scrollTo(left, top);
	}
	_onFocus() {
		this._focused = true;
		this._map.fire("focus");
	}
	_onBlur() {
		this._focused = false;
		this._map.fire("blur");
	}
	_setPanDelta(panDelta) {
		const keys = this._panKeys = {}, codes = KeyboardHandler.keyCodes;
		for (const code of codes.left) keys[code] = [-1 * panDelta, 0];
		for (const code of codes.right) keys[code] = [panDelta, 0];
		for (const code of codes.down) keys[code] = [0, panDelta];
		for (const code of codes.up) keys[code] = [0, -1 * panDelta];
	}
	_setZoomDelta(zoomDelta) {
		const keys = this._zoomKeys = {}, codes = KeyboardHandler.keyCodes;
		for (const code of codes.zoomIn) keys[code] = zoomDelta;
		for (const code of codes.zoomOut) keys[code] = -zoomDelta;
	}
	_addHooks() {
		on(document, "keydown", this._onKeyDown, this);
	}
	_removeHooks() {
		off(document, "keydown", this._onKeyDown, this);
	}
	_onKeyDown(e) {
		if (e.altKey || e.ctrlKey || e.metaKey) return;
		const key = e.code, map = this._map;
		let offset;
		if (key in this._panKeys) {
			if (!map._panAnim || !map._panAnim._inProgress) {
				offset = this._panKeys[key];
				if (e.shiftKey) offset = new Point(offset).multiplyBy(3);
				if (map.options.maxBounds) offset = map._limitOffset(new Point(offset), map.options.maxBounds);
				if (map.options.worldCopyJump) {
					const newLatLng = map.wrapLatLng(map.unproject(map.project(map.getCenter()).add(offset)));
					map.panTo(newLatLng);
				} else map.panBy(offset);
			}
		} else if (key in this._zoomKeys) map.setZoom(map.getZoom() + (e.shiftKey ? 3 : 1) * this._zoomKeys[key]);
		else if (key === "Escape" && map._popup && map._popup.options.closeOnEscapeKey) map.closePopup();
		else return;
		stop(e);
	}
	static register(MaplairMap) {
		MaplairMap.mergeOptions({
			keyboard: true,
			keyboardPanDelta: 80
		});
		MaplairMap.addInitHook("addHandler", "keyboard", KeyboardHandler);
	}
};
//#endregion
export { KeyboardHandler };

//# sourceMappingURL=KeyboardHandler.js.map