@realsee/dnalogel 2.0.2-alpha → 2.1.0-alpha.2

package/libs/PanoTagPlugin/Components/Common/Media.js

@@ -0,0 +1,334 @@
+/* generated by Svelte v3.50.1 */
+import {
+	SvelteComponent,
+	add_render_callback,
+	append,
+	append_styles,
+	attr,
+	check_outros,
+	create_in_transition,
+	create_out_transition,
+	detach,
+	element,
+	empty,
+	group_outros,
+	init,
+	insert,
+	noop,
+	safe_not_equal,
+	set_style,
+	space,
+	src_url_equal,
+	toggle_class,
+	transition_in,
+	transition_out
+} from "svelte/internal";
+
+import { fly } from 'svelte/transition';
+import { Image_Play } from '../../Assets/Icon';
+import { linear } from 'svelte/easing';
+
+function add_css(target) {
+	append_styles(target, "svelte-q613rs", ".media.svelte-q613rs{width:100%;height:100%;position:relative;overflow:hidden;border-radius:2px}.media-content.svelte-q613rs{width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;-o-object-fit:cover;object-fit:cover}.video-icon.svelte-q613rs{width:1.45833rem;height:1.45833rem;background-size:100%;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}");
+}
+
+// (12:0) {#if unfolded}
+function create_if_block(ctx) {
+	let div;
+	let t;
+	let div_intro;
+	let div_outro;
+	let current;
+
+	function select_block_type(ctx, dirty) {
+		if (/*imageUrl*/ ctx[5]) return create_if_block_2;
+		return create_else_block;
+	}
+
+	let current_block_type = select_block_type(ctx, -1);
+	let if_block0 = current_block_type(ctx);
+	let if_block1 = /*mediaData*/ ctx[0].type === 'Video' && create_if_block_1(ctx);
+
+	return {
+		c() {
+			div = element("div");
+			if_block0.c();
+			t = space();
+			if (if_block1) if_block1.c();
+			attr(div, "class", "media svelte-q613rs");
+			toggle_class(div, "unfolded", /*unfolded*/ ctx[4]);
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			if_block0.m(div, null);
+			append(div, t);
+			if (if_block1) if_block1.m(div, null);
+			current = true;
+		},
+		p(new_ctx, dirty) {
+			ctx = new_ctx;
+
+			if (current_block_type === (current_block_type = select_block_type(ctx, dirty)) && if_block0) {
+				if_block0.p(ctx, dirty);
+			} else {
+				if_block0.d(1);
+				if_block0 = current_block_type(ctx);
+
+				if (if_block0) {
+					if_block0.c();
+					if_block0.m(div, t);
+				}
+			}
+
+			if (/*mediaData*/ ctx[0].type === 'Video') {
+				if (if_block1) {
+					if_block1.p(ctx, dirty);
+				} else {
+					if_block1 = create_if_block_1(ctx);
+					if_block1.c();
+					if_block1.m(div, null);
+				}
+			} else if (if_block1) {
+				if_block1.d(1);
+				if_block1 = null;
+			}
+
+			if (!current || dirty & /*unfolded*/ 16) {
+				toggle_class(div, "unfolded", /*unfolded*/ ctx[4]);
+			}
+		},
+		i(local) {
+			if (current) return;
+
+			if (local) {
+				add_render_callback(() => {
+					if (div_outro) div_outro.end(1);
+
+					div_intro = create_in_transition(div, fly, {
+						y: 4,
+						duration: /*duration*/ ctx[3],
+						delay: /*inDelay*/ ctx[1],
+						easing: linear
+					});
+
+					div_intro.start();
+				});
+			}
+
+			current = true;
+		},
+		o(local) {
+			if (div_intro) div_intro.invalidate();
+
+			if (local) {
+				div_outro = create_out_transition(div, fly, {
+					y: 4,
+					duration: /*duration*/ ctx[3],
+					delay: /*outDelay*/ ctx[2],
+					easing: linear
+				});
+			}
+
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			if_block0.d();
+			if (if_block1) if_block1.d();
+			if (detaching && div_outro) div_outro.end();
+		}
+	};
+}
+
+// (21:4) {:else}
+function create_else_block(ctx) {
+	let video;
+	let video_src_value;
+	let video_poster_value;
+	let video_loop_value;
+	let video_controls_value;
+	let video_muted_value;
+
+	return {
+		c() {
+			video = element("video");
+			attr(video, "class", "media-content svelte-q613rs");
+			if (!src_url_equal(video.src, video_src_value = /*mediaData*/ ctx[0].url)) attr(video, "src", video_src_value);
+			attr(video, "poster", video_poster_value = /*mediaData*/ ctx[0].videoCoverUrl);
+			video.playsInline = true;
+			attr(video, "paused", "");
+			video.loop = video_loop_value = false;
+			attr(video, "preload", "auto");
+			attr(video, "crossorigin", "");
+			video.controls = video_controls_value = false;
+			video.muted = video_muted_value = false;
+		},
+		m(target, anchor) {
+			insert(target, video, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*mediaData*/ 1 && !src_url_equal(video.src, video_src_value = /*mediaData*/ ctx[0].url)) {
+				attr(video, "src", video_src_value);
+			}
+
+			if (dirty & /*mediaData*/ 1 && video_poster_value !== (video_poster_value = /*mediaData*/ ctx[0].videoCoverUrl)) {
+				attr(video, "poster", video_poster_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(video);
+		}
+	};
+}
+
+// (19:4) {#if imageUrl}
+function create_if_block_2(ctx) {
+	let img;
+	let img_src_value;
+	let img_alt_value;
+
+	return {
+		c() {
+			img = element("img");
+			attr(img, "class", "media-content svelte-q613rs");
+			if (!src_url_equal(img.src, img_src_value = /*imageUrl*/ ctx[5])) attr(img, "src", img_src_value);
+			attr(img, "alt", img_alt_value = /*mediaData*/ ctx[0].name);
+		},
+		m(target, anchor) {
+			insert(target, img, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*imageUrl*/ 32 && !src_url_equal(img.src, img_src_value = /*imageUrl*/ ctx[5])) {
+				attr(img, "src", img_src_value);
+			}
+
+			if (dirty & /*mediaData*/ 1 && img_alt_value !== (img_alt_value = /*mediaData*/ ctx[0].name)) {
+				attr(img, "alt", img_alt_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(img);
+		}
+	};
+}
+
+// (35:4) {#if mediaData.type === 'Video'}
+function create_if_block_1(ctx) {
+	let div;
+
+	return {
+		c() {
+			div = element("div");
+			attr(div, "class", "video-icon svelte-q613rs");
+			set_style(div, "background-image", "url(" + Image_Play + ")");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+		},
+		p: noop,
+		d(detaching) {
+			if (detaching) detach(div);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let if_block_anchor;
+	let if_block = /*unfolded*/ ctx[4] && create_if_block(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+		},
+		p(ctx, [dirty]) {
+			if (/*unfolded*/ ctx[4]) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+
+					if (dirty & /*unfolded*/ 16) {
+						transition_in(if_block, 1);
+					}
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					transition_in(if_block, 1);
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				group_outros();
+
+				transition_out(if_block, 1, 1, () => {
+					if_block = null;
+				});
+
+				check_outros();
+			}
+		},
+		i(local) {
+			transition_in(if_block);
+		},
+		o(local) {
+			transition_out(if_block);
+		},
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let imageUrl;
+	let { mediaData } = $$props;
+	let { inDelay = 0 } = $$props;
+	let { outDelay = 0 } = $$props;
+	let { duration = 0 } = $$props;
+	let { unfolded = true } = $$props;
+
+	$$self.$$set = $$props => {
+		if ('mediaData' in $$props) $$invalidate(0, mediaData = $$props.mediaData);
+		if ('inDelay' in $$props) $$invalidate(1, inDelay = $$props.inDelay);
+		if ('outDelay' in $$props) $$invalidate(2, outDelay = $$props.outDelay);
+		if ('duration' in $$props) $$invalidate(3, duration = $$props.duration);
+		if ('unfolded' in $$props) $$invalidate(4, unfolded = $$props.unfolded);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*mediaData*/ 1) {
+			$: $$invalidate(5, imageUrl = mediaData.type === 'Image'
+			? mediaData.url
+			: mediaData.videoCoverUrl);
+		}
+	};
+
+	return [mediaData, inDelay, outDelay, duration, unfolded, imageUrl];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{
+				mediaData: 0,
+				inDelay: 1,
+				outDelay: 2,
+				duration: 3,
+				unfolded: 4
+			},
+			add_css
+		);
+	}
+}
+
+export default Component;

package/libs/PanoTagPlugin/Components/Common/MultiLineText.js

@@ -0,0 +1,334 @@
+/* generated by Svelte v3.50.1 */
+import {
+	SvelteComponent,
+	append_styles,
+	attr,
+	binding_callbacks,
+	check_outros,
+	create_component,
+	destroy_component,
+	detach,
+	element,
+	empty,
+	group_outros,
+	init,
+	insert,
+	mount_component,
+	outro_and_destroy_block,
+	safe_not_equal,
+	set_style,
+	space,
+	transition_in,
+	transition_out,
+	update_keyed_each
+} from "svelte/internal";
+
+import Text from '../Common/Text';
+import Arrow from '../Common/Arrow';
+
+function add_css(target) {
+	append_styles(target, "svelte-fdqrvu", ".text.svelte-fdqrvu{pointer-events:auto;box-sizing:border-box;display:inline-block;max-width:6.25rem;transition:transform 400ms ease-in-out;font-size:0.625rem;line-height:0.9375rem;white-space:initial;cursor:pointer}.arrow.svelte-fdqrvu{pointer-events:auto;display:inline-block;vertical-align:top;width:0.72917rem;height:0.72917rem;margin-left:2px;margin-top:2px}");
+}
+
+function get_each_context(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[11] = list[i].id;
+	child_ctx[12] = list[i].content;
+	return child_ctx;
+}
+
+// (23:0) {#each textItems as { id, content }
+function create_each_block(key_1, ctx) {
+	let div;
+	let text_1;
+	let current;
+
+	text_1 = new Text({
+			props: {
+				unfolded: /*visible*/ ctx[0],
+				content: /*content*/ ctx[12],
+				inDelay: 500,
+				outDelay: /*foldTextDelay*/ ctx[5]
+			}
+		});
+
+	return {
+		key: key_1,
+		first: null,
+		c() {
+			div = element("div");
+			create_component(text_1.$$.fragment);
+			attr(div, "class", "text svelte-fdqrvu");
+			set_style(div, "transform", /*transform*/ ctx[7], false);
+			this.first = div;
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			mount_component(text_1, div, null);
+			/*div_binding*/ ctx[10](div);
+			current = true;
+		},
+		p(new_ctx, dirty) {
+			ctx = new_ctx;
+			const text_1_changes = {};
+			if (dirty & /*visible*/ 1) text_1_changes.unfolded = /*visible*/ ctx[0];
+			if (dirty & /*textItems*/ 2) text_1_changes.content = /*content*/ ctx[12];
+			if (dirty & /*foldTextDelay*/ 32) text_1_changes.outDelay = /*foldTextDelay*/ ctx[5];
+			text_1.$set(text_1_changes);
+
+			if (dirty & /*transform*/ 128) {
+				set_style(div, "transform", /*transform*/ ctx[7], false);
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(text_1.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(text_1.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			destroy_component(text_1);
+			/*div_binding*/ ctx[10](null);
+		}
+	};
+}
+
+// (28:0) {#if lineHeight < textHeight}
+function create_if_block(ctx) {
+	let div;
+	let arrow;
+	let current;
+
+	arrow = new Arrow({
+			props: {
+				direction: /*arrowDirection*/ ctx[6],
+				visible: /*visible*/ ctx[0],
+				inDelay: 600,
+				duration: 1000
+			}
+		});
+
+	return {
+		c() {
+			div = element("div");
+			create_component(arrow.$$.fragment);
+			attr(div, "class", "arrow svelte-fdqrvu");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			mount_component(arrow, div, null);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const arrow_changes = {};
+			if (dirty & /*arrowDirection*/ 64) arrow_changes.direction = /*arrowDirection*/ ctx[6];
+			if (dirty & /*visible*/ 1) arrow_changes.visible = /*visible*/ ctx[0];
+			arrow.$set(arrow_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(arrow.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(arrow.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			destroy_component(arrow);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let each_blocks = [];
+	let each_1_lookup = new Map();
+	let t;
+	let if_block_anchor;
+	let current;
+	let each_value = /*textItems*/ ctx[1];
+	const get_key = ctx => /*id*/ ctx[11];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		let child_ctx = get_each_context(ctx, each_value, i);
+		let key = get_key(child_ctx);
+		each_1_lookup.set(key, each_blocks[i] = create_each_block(key, child_ctx));
+	}
+
+	let if_block = /*lineHeight*/ ctx[3] < /*textHeight*/ ctx[4] && create_if_block(ctx);
+
+	return {
+		c() {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			t = space();
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(target, anchor);
+			}
+
+			insert(target, t, anchor);
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			if (dirty & /*textElement, transform, visible, textItems, foldTextDelay*/ 167) {
+				each_value = /*textItems*/ ctx[1];
+				group_outros();
+				each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, t.parentNode, outro_and_destroy_block, create_each_block, t, get_each_context);
+				check_outros();
+			}
+
+			if (/*lineHeight*/ ctx[3] < /*textHeight*/ ctx[4]) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+
+					if (dirty & /*lineHeight, textHeight*/ 24) {
+						transition_in(if_block, 1);
+					}
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					transition_in(if_block, 1);
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				group_outros();
+
+				transition_out(if_block, 1, 1, () => {
+					if_block = null;
+				});
+
+				check_outros();
+			}
+		},
+		i(local) {
+			if (current) return;
+
+			for (let i = 0; i < each_value.length; i += 1) {
+				transition_in(each_blocks[i]);
+			}
+
+			transition_in(if_block);
+			current = true;
+		},
+		o(local) {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				transition_out(each_blocks[i]);
+			}
+
+			transition_out(if_block);
+			current = false;
+		},
+		d(detaching) {
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].d(detaching);
+			}
+
+			if (detaching) detach(t);
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let transform;
+	let arrowDirection;
+	let foldTextDelay;
+	let { visible = false } = $$props;
+	let { textUnfolded = false } = $$props;
+	let { textItems } = $$props;
+	let textElement;
+	let translateY = 0;
+	let lineHeight = 0;
+	let textHeight = 0;
+
+	function div_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			textElement = $$value;
+			$$invalidate(2, textElement);
+		});
+	}
+
+	$$self.$$set = $$props => {
+		if ('visible' in $$props) $$invalidate(0, visible = $$props.visible);
+		if ('textUnfolded' in $$props) $$invalidate(8, textUnfolded = $$props.textUnfolded);
+		if ('textItems' in $$props) $$invalidate(1, textItems = $$props.textItems);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*textElement*/ 4) {
+			$: {
+				if (textElement) {
+					const { height: heightString, lineHeight: lineHeightString } = getComputedStyle(textElement);
+					$$invalidate(4, textHeight = Number(heightString.replace('px', '')));
+					$$invalidate(3, lineHeight = Number(lineHeightString.replace('px', '')));
+				}
+			}
+		}
+
+		if ($$self.$$.dirty & /*textUnfolded, lineHeight, textHeight*/ 280) {
+			$: $$invalidate(9, translateY = textUnfolded ? lineHeight - textHeight : 0);
+		}
+
+		if ($$self.$$.dirty & /*translateY*/ 512) {
+			$: $$invalidate(7, transform = `translateY(${translateY}px)`);
+		}
+
+		if ($$self.$$.dirty & /*textUnfolded*/ 256) {
+			$: $$invalidate(6, arrowDirection = textUnfolded ? 'left' : 'right');
+		}
+
+		if ($$self.$$.dirty & /*textUnfolded*/ 256) {
+			$: $$invalidate(5, foldTextDelay = textUnfolded ? 450 : 0);
+		}
+	};
+
+	return [
+		visible,
+		textItems,
+		textElement,
+		lineHeight,
+		textHeight,
+		foldTextDelay,
+		arrowDirection,
+		transform,
+		textUnfolded,
+		translateY,
+		div_binding
+	];
+}
+
+class Component extends SvelteComponent {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			options,
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{
+				visible: 0,
+				textUnfolded: 8,
+				textItems: 1
+			},
+			add_css
+		);
+	}
+}
+
+export default Component;