site-libsoc/Server/public/js/components/pane-aligner.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, s as safe_not_equal, d as dispatch_dev, c as validate_slots, z as getContext, o as onMount, A as setContext, e as element, f as space, n as noop, h as attr_dev, g as add_location, l as append_dev, m as detach_dev, u as binding_callbacks } from './index-9ff7cb25.js';
import { debounce } from '../../../../../../../../../js/libraries/miscTools.js';

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

function create_fragment(ctx) {
	let div6;
	let div5;
	let div2;
	let div0;
	let slot0;
	let t0;
	let div1;
	let slot1;
	let t1;
	let div3;
	let slot2;
	let t2;
	let div4;
	let slot3;

	const block = {
		c: function create() {
			div6 = element("div");
			div5 = element("div");
			div2 = element("div");
			div0 = element("div");
			slot0 = element("slot");
			t0 = space();
			div1 = element("div");
			slot1 = element("slot");
			t1 = space();
			div3 = element("div");
			slot2 = element("slot");
			t2 = space();
			div4 = element("div");
			slot3 = element("slot");
			this.c = noop;
			attr_dev(slot0, "name", "sidebar-left");
			add_location(slot0, file, 74, 16, 2567);
			attr_dev(div0, "id", "sidebar-left");
			attr_dev(div0, "class", "pane");
			add_location(div0, file, 73, 12, 2489);
			attr_dev(slot1, "name", "sidebar-left2");
			add_location(slot1, file, 77, 16, 2714);
			attr_dev(div1, "id", "sidebar-left2");
			attr_dev(div1, "class", "pane");
			add_location(div1, file, 76, 12, 2634);
			attr_dev(div2, "id", "sidebars-left");
			attr_dev(div2, "class", "sidebar");
			add_location(div2, file, 72, 8, 2435);
			attr_dev(slot2, "name", "sidebar-right");
			add_location(slot2, file, 81, 12, 2879);
			attr_dev(div3, "id", "sidebar-right");
			attr_dev(div3, "class", "pane sidebar");
			add_location(div3, file, 80, 8, 2794);
			attr_dev(slot3, "name", "main");
			attr_dev(slot3, "id", "main-slot");
			add_location(slot3, file, 84, 12, 3007);
			attr_dev(div4, "id", "main-pane");
			attr_dev(div4, "class", "pane");
			add_location(div4, file, 83, 8, 2939);
			attr_dev(div5, "class", "pane-container");
			add_location(div5, file, 71, 4, 2397);
			attr_dev(div6, "id", "root");
			attr_dev(div6, "class", "pane-centering");
			add_location(div6, file, 70, 0, 2336);
		},
		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, div6, anchor);
			append_dev(div6, div5);
			append_dev(div5, div2);
			append_dev(div2, div0);
			append_dev(div0, slot0);
			/*div0_binding*/ ctx[5](div0);
			append_dev(div2, t0);
			append_dev(div2, div1);
			append_dev(div1, slot1);
			/*div1_binding*/ ctx[6](div1);
			append_dev(div5, t1);
			append_dev(div5, div3);
			append_dev(div3, slot2);
			/*div3_binding*/ ctx[7](div3);
			append_dev(div5, t2);
			append_dev(div5, div4);
			append_dev(div4, slot3);
			/*div4_binding*/ ctx[8](div4);
			/*div6_binding*/ ctx[9](div6);
		},
		p: noop,
		i: noop,
		o: noop,
		d: function destroy(detaching) {
			if (detaching) detach_dev(div6);
			/*div0_binding*/ ctx[5](null);
			/*div1_binding*/ ctx[6](null);
			/*div3_binding*/ ctx[7](null);
			/*div4_binding*/ ctx[8](null);
			/*div6_binding*/ ctx[9](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('pane-aligner', slots, []);
	let root;
	let mainPane;
	let sidebarLeft;
	let sidebarLeft2;
	let sidebarRight;
	let parentProps = getContext("alignerParent");

	let switchView = parentProps != undefined
	? getContext("alignerParent").switchView
	: undefined;

	let leftReplaced = false;
	let left2Replaced = false;
	let rightReplaced = false;
	let switchViewReplaced = false;

	function adjustSlotted() {
		if (root.parentNode != null) {
			let slotted = root.parentNode.host.childNodes;

			if (slotted.length == 0) {
				setTimeout(adjustSlotted, 50);
			} else {
				let changed = false;
				let html = root.parentNode.innerHTML;

				for (let item of slotted) {
					if (item.slot == "sidebar-left" && !leftReplaced) {
						html = html.replace("#sidebar-left{display:none}", "");
						leftReplaced = true;
						changed = true;
					} else if (item.slot == "sidebar-left2" && !left2Replaced) {
						html = html.replace("#sidebar-left2{display:none}", "");
						left2Replaced = true;
						changed = true;
					} else if (item.slot == "sidebar-right" && !rightReplaced) {
						html = html.replace("#sidebar-right{display:none;", "#sidebar-right{");
						rightReplaced = true;
						changed = true;
					}
				}

				if (switchView != undefined && !switchViewReplaced) {
					html = html.replace("1880px", switchView);
					changed = true;
				}

				if (changed) {
					$$invalidate(0, root.parentNode.innerHTML = html, root);
				}
			}
		}
	}

	window.addEventListener("resize", debounce(adjustSlotted, 100));

	onMount(() => {
		adjustSlotted();
	});

	const writable_props = [];

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

	function div0_binding($$value) {
		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
			sidebarLeft = $$value;
			$$invalidate(2, sidebarLeft);
		});
	}

	function div1_binding($$value) {
		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
			sidebarLeft2 = $$value;
			$$invalidate(3, sidebarLeft2);
		});
	}

	function div3_binding($$value) {
		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
			sidebarRight = $$value;
			$$invalidate(4, sidebarRight);
		});
	}

	function div4_binding($$value) {
		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
			mainPane = $$value;
			$$invalidate(1, mainPane);
		});
	}

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

	$$self.$capture_state = () => ({
		getContext,
		setContext,
		onMount,
		debounce,
		root,
		mainPane,
		sidebarLeft,
		sidebarLeft2,
		sidebarRight,
		parentProps,
		switchView,
		leftReplaced,
		left2Replaced,
		rightReplaced,
		switchViewReplaced,
		adjustSlotted
	});

	$$self.$inject_state = $$props => {
		if ('root' in $$props) $$invalidate(0, root = $$props.root);
		if ('mainPane' in $$props) $$invalidate(1, mainPane = $$props.mainPane);
		if ('sidebarLeft' in $$props) $$invalidate(2, sidebarLeft = $$props.sidebarLeft);
		if ('sidebarLeft2' in $$props) $$invalidate(3, sidebarLeft2 = $$props.sidebarLeft2);
		if ('sidebarRight' in $$props) $$invalidate(4, sidebarRight = $$props.sidebarRight);
		if ('parentProps' in $$props) parentProps = $$props.parentProps;
		if ('switchView' in $$props) switchView = $$props.switchView;
		if ('leftReplaced' in $$props) leftReplaced = $$props.leftReplaced;
		if ('left2Replaced' in $$props) left2Replaced = $$props.left2Replaced;
		if ('rightReplaced' in $$props) rightReplaced = $$props.rightReplaced;
		if ('switchViewReplaced' in $$props) switchViewReplaced = $$props.switchViewReplaced;
	};

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

	return [
		root,
		mainPane,
		sidebarLeft,
		sidebarLeft2,
		sidebarRight,
		div0_binding,
		div1_binding,
		div3_binding,
		div4_binding,
		div6_binding
	];
}

class Pane_aligner extends SvelteElement {
	constructor(options) {
		super();
		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';.pane-container{display:block;margin-left:var(--total-margin-left,0rem)}#root{min-height:var(--min-height,auto)}#main-pane{position:relative;padding-left:var(--padding-left,0rem);padding-right:var(--padding-right,0rem);padding-top:var(--padding-top,0rem);padding-bottom:var(--padding-bottom,0rem);text-align:justify;background:var(--background,white);box-shadow:var(--box-shadow,0 0 0.314rem rgb(187, 187, 187));margin:auto;height:min-content;max-width:var(--width-main,66rem);width:var(--width-main,66rem);z-index:1;overflow-x:var(--overflow-x,hidden)}.sidebar{position:absolute}#sidebars-left{display:flex;flex-direction:column;gap:1rem;margin-left:calc(-1*var(--width-left,22.5rem) - 1rem - 4rem);width:calc(var(--width-left,22.5rem) + 4rem)}#sidebar-left,#sidebar-left2{position:relative;background-color:white;padding:2rem 2rem}#sidebar-left{display:none}#sidebar-left2{display:none}#sidebar-right{display:none;margin-left:calc(var(--width-main,66rem) + 1rem);width:var(--width-right,auto);background-color:white;padding:2rem 2rem}@media only screen and (max-width: 1880px){#main-pane{max-width:initial;width:100%;max-width:var(--width-main,66rem);padding-left:var(--padding-left-mobile,1.8rem);padding-right:var(--padding-right-mobile,1.8rem);padding-top:var(--padding-top-mobile,1.8rem);padding-bottom:var(--padding-bottom-mobile,1.8rem)}#sidebars-left,#sidebar-right{position:relative;margin:auto;margin-top:1rem;margin-bottom:1rem;max-width:var(--width-main,66rem);width:100%}.pane-container{width:95%;justify-items:center;grid-auto-flow:row;margin-left:0}}</style>`;

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

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

customElements.define("pane-aligner", Pane_aligner);

export { Pane_aligner as default };