site-libsoc/Server/public/js/components/map-component.js

(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, t as flush, s as safe_not_equal, d as dispatch_dev, v as validate_slots, o as onMount, f as element, n as noop, k as attr_dev, j as add_location, p as detach_dev, q as binding_callbacks } from './index-998178c7.js';

/* src\components\map-component.svelte generated by Svelte v3.52.0 */
const file = "src\\components\\map-component.svelte";

function create_fragment(ctx) {
	let div;

	const block = {
		c: function create() {
			div = element("div");
			this.c = noop;
			attr_dev(div, "id", "map");
			add_location(div, file, 41, 0, 1151);
		},
		l: function claim(nodes) {
			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
		},
		m: function mount(target, anchor) {
			insert_dev(target, div, anchor);
			/*div_binding*/ ctx[3](div);
		},
		p: noop,
		i: noop,
		o: noop,
		d: function destroy(detaching) {
			if (detaching) detach_dev(div);
			/*div_binding*/ ctx[3](null);
		}
	};

	dispatch_dev("SvelteRegisterBlock", {
		block,
		id: create_fragment.name,
		type: "component",
		source: "",
		ctx
	});

	return block;
}

function instance($$self, $$props, $$invalidate) {
	let { $$slots: slots = {}, $$scope } = $$props;
	validate_slots('map-component', slots, []);
	let { callback = null } = $$props;
	let { colors = null } = $$props;

	// Main code
	let mapContainer;

	function createMap(center, zoom) {
		let map = L.map(mapContainer, { center, zoom });

		L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
			attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
			minNativeZoom: 2,
			minZoom: 2,
			maxNativeZoom: 14,
			maxZoom: 14
		}).addTo(map);

		return map;
	}

	onMount(() => {
		callback(createMap);

		if (colors != null) {
			let els = mapContainer.getElementsByClassName("leaflet-control-layers-overlays")[0].children;

			for (let i = 0; i < els.length; i++) {
				els[i].children[0].children[0].style.accentColor = colors[i];
			}
		}
	});

	const writable_props = ['callback', 'colors'];

	Object.keys($$props).forEach(key => {
		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<map-component> was created with unknown prop '${key}'`);
	});

	function div_binding($$value) {
		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
			mapContainer = $$value;
			$$invalidate(0, mapContainer);
		});
	}

	$$self.$$set = $$props => {
		if ('callback' in $$props) $$invalidate(1, callback = $$props.callback);
		if ('colors' in $$props) $$invalidate(2, colors = $$props.colors);
	};

	$$self.$capture_state = () => ({
		onMount,
		callback,
		colors,
		mapContainer,
		createMap
	});

	$$self.$inject_state = $$props => {
		if ('callback' in $$props) $$invalidate(1, callback = $$props.callback);
		if ('colors' in $$props) $$invalidate(2, colors = $$props.colors);
		if ('mapContainer' in $$props) $$invalidate(0, mapContainer = $$props.mapContainer);
	};

	if ($$props && "$$inject" in $$props) {
		$$self.$inject_state($$props.$$inject);
	}

	return [mapContainer, callback, colors, div_binding];
}

class Map_component extends SvelteElement {
	constructor(options) {
		super();
		this.shadowRoot.innerHTML = `<style>@import 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css';#map{height:var(--height);width:var(--width,100%);margin-top:var(--margin-top,0);margin-bottom:var(--margin-bottom,0);position:relative;z-index:0}</style>`;

		init(
			this,
			{
				target: this.shadowRoot,
				props: attribute_to_object(this.attributes),
				customElement: true
			},
			instance,
			create_fragment,
			safe_not_equal,
			{ callback: 1, colors: 2 },
			null
		);

		if (options) {
			if (options.target) {
				insert_dev(options.target, this, options.anchor);
			}

			if (options.props) {
				this.$set(options.props);
				flush();
			}
		}
	}

	static get observedAttributes() {
		return ["callback", "colors"];
	}

	get callback() {
		return this.$$.ctx[1];
	}

	set callback(callback) {
		this.$$set({ callback });
		flush();
	}

	get colors() {
		return this.$$.ctx[2];
	}

	set colors(colors) {
		this.$$set({ colors });
		flush();
	}
}

customElements.define("map-component", Map_component);

export { Map_component as default };