import type { Map as LMap } from 'leaflet';
import type { View } from '$lib/map';

export function syncMaps(
	view: View,
	map1: LMap | null,
	map2: LMap | null,
	map3: LMap | null,
	map4: LMap | null
) {
	// resize the shown maps
	if (view === 'one' && map1) {
		map1.invalidateSize();
	} else if (view === 'two') {
		if (map1) map1.invalidateSize();
		if (map2) map2.invalidateSize();
	} else if (view === 'four') {
		if (map1) map1.invalidateSize();
		if (map2) map2.invalidateSize();
		if (map3) map3.invalidateSize();
		if (map4) map4.invalidateSize();
	}

	if (map1 && map2) {
		map2.setView(map1.getCenter(), map1.getZoom());
		// @ts-expect-error leaflet.sync does not provide typedefs
		map1.sync(map2);
	}
	if (map1 && map3) {
		map3.setView(map1.getCenter(), map1.getZoom());
		// @ts-expect-error leaflet.sync does not provide typedefs
		map1.sync(map3);
	}
	if (map1 && map4) {
		map4.setView(map1.getCenter(), map1.getZoom());
		// @ts-expect-error leaflet.sync does not provide typedefs
		map1.sync(map4);
	}

	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map2 && map1) map2.sync(map1);
	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map2 && map3) map2.sync(map3);
	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map2 && map4) map2.sync(map4);

	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map3 && map1) map3.sync(map1);
	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map3 && map2) map3.sync(map2);
	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map3 && map4) map3.sync(map4);

	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map4 && map1) map4.sync(map1);
	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map4 && map2) map4.sync(map2);
	// @ts-expect-error leaflet.sync does not provide typedefs
	if (map4 && map3) map4.sync(map3);
}