diff --git "a/bundle.js" "b/bundle.js" --- "a/bundle.js" +++ "b/bundle.js" @@ -98,6 +98,9 @@ var app = (function () { else if (node.getAttribute(attribute) !== value) node.setAttribute(attribute, value); } + function to_number(value) { + return value === '' ? null : +value; + } function children(element) { return Array.from(element.childNodes); } @@ -660,17 +663,17 @@ var app = (function () { /* src\VideoGradioComponentBrainstorming.svelte generated by Svelte v3.59.2 */ - const { console: console_1$5 } = globals; - const file$9 = "src\\VideoGradioComponentBrainstorming.svelte"; + const { console: console_1$6 } = globals; + const file$b = "src\\VideoGradioComponentBrainstorming.svelte"; - function get_each_context$5(ctx, list, i) { + function get_each_context$6(ctx, list, i) { const child_ctx = ctx.slice(); child_ctx[15] = list[i]; return child_ctx; } // (85:4) {#each kitchenOptions as option} - function create_each_block$5(ctx) { + function create_each_block$6(ctx) { let option; let t_value = /*option*/ ctx[15] + ""; let t; @@ -681,7 +684,7 @@ var app = (function () { t = text(t_value); option.__value = /*option*/ ctx[15]; option.value = option.__value; - add_location(option, file$9, 85, 6, 2561); + add_location(option, file$b, 85, 6, 2561); }, m: function mount(target, anchor) { insert_dev(target, option, anchor); @@ -695,7 +698,7 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_each_block$5.name, + id: create_each_block$6.name, type: "each", source: "(85:4) {#each kitchenOptions as option}", ctx @@ -704,7 +707,7 @@ var app = (function () { return block; } - function create_fragment$9(ctx) { + function create_fragment$b(ctx) { let h1; let t1; let div1; @@ -731,7 +734,7 @@ var app = (function () { let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { - each_blocks[i] = create_each_block$5(get_each_context$5(ctx, each_value, i)); + each_blocks[i] = create_each_block$6(get_each_context$6(ctx, each_value, i)); } const block = { @@ -761,34 +764,34 @@ var app = (function () { each_blocks[i].c(); } - add_location(h1, file$9, 66, 0, 1800); + add_location(h1, file$b, 66, 0, 1800); attr_dev(track, "kind", "captions"); if (!src_url_equal(track.src, track_src_value = "path/to/your/captions/file.vtt")) attr_dev(track, "src", track_src_value); attr_dev(track, "srclang", "en"); attr_dev(track, "label", "English"); - add_location(track, file$9, 72, 4, 2006); + add_location(track, file$b, 72, 4, 2006); attr_dev(video, "id", "videoCanvas"); video.autoplay = true; attr_dev(video, "class", "svelte-ufd3fo"); - add_location(video, file$9, 70, 2, 1965); + add_location(video, file$b, 70, 2, 1965); attr_dev(div0, "id", "overlayText"); attr_dev(div0, "class", "svelte-ufd3fo"); - add_location(div0, file$9, 74, 2, 2111); + add_location(div0, file$b, 74, 2, 2111); attr_dev(div1, "id", "videoContainer"); attr_dev(div1, "class", "svelte-ufd3fo"); - add_location(div1, file$9, 68, 0, 1911); + add_location(div1, file$b, 68, 0, 1911); attr_dev(canvas_1, "id", "myCanvas"); set_style(canvas_1, "border", "2px solid black"); attr_dev(canvas_1, "width", "500"); attr_dev(canvas_1, "height", "500"); - add_location(canvas_1, file$9, 77, 0, 2186); + add_location(canvas_1, file$b, 77, 0, 2186); attr_dev(input, "type", "text"); - add_location(input, file$9, 78, 0, 2294); - add_location(button, file$9, 82, 2, 2429); + add_location(input, file$b, 78, 0, 2294); + add_location(button, file$b, 82, 2, 2429); if (/*selectedOption*/ ctx[0] === void 0) add_render_callback(() => /*select_change_handler*/ ctx[9].call(select)); - add_location(select, file$9, 83, 2, 2479); + add_location(select, file$b, 83, 2, 2479); attr_dev(div2, "id", "frameForButtons"); - add_location(div2, file$9, 81, 0, 2399); + add_location(div2, file$b, 81, 0, 2399); }, l: function claim(nodes) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); @@ -847,12 +850,12 @@ var app = (function () { let i; for (i = 0; i < each_value.length; i += 1) { - const child_ctx = get_each_context$5(ctx, each_value, i); + const child_ctx = get_each_context$6(ctx, each_value, i); if (each_blocks[i]) { each_blocks[i].p(child_ctx, dirty); } else { - each_blocks[i] = create_each_block$5(child_ctx); + each_blocks[i] = create_each_block$6(child_ctx); each_blocks[i].c(); each_blocks[i].m(select, null); } @@ -890,7 +893,7 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_fragment$9.name, + id: create_fragment$b.name, type: "component", source: "", ctx @@ -903,7 +906,7 @@ var app = (function () { } // Logic for 'Test OCR' button - function instance$9($$self, $$props, $$invalidate) { + function instance$b($$self, $$props, $$invalidate) { let { $$slots: slots = {}, $$scope } = $$props; validate_slots('VideoGradioComponentBrainstorming', slots, []); let selectedOption = 'Stove - lu'; // default value @@ -965,7 +968,7 @@ var app = (function () { const writable_props = []; Object.keys($$props).forEach(key => { - if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$5.warn(` was created with unknown prop '${key}'`); + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$6.warn(` was created with unknown prop '${key}'`); }); function canvas_1_binding($$value) { @@ -1036,13 +1039,13 @@ var app = (function () { class VideoGradioComponentBrainstorming extends SvelteComponentDev { constructor(options) { super(options); - init(this, options, instance$9, create_fragment$9, safe_not_equal, {}); + init(this, options, instance$b, create_fragment$b, safe_not_equal, {}); dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "VideoGradioComponentBrainstorming", options, - id: create_fragment$9.name + id: create_fragment$b.name }); } } @@ -1096,9 +1099,9 @@ var app = (function () { } /* src\MovingDotPortfromReact.svelte generated by Svelte v3.59.2 */ - const file$8 = "src\\MovingDotPortfromReact.svelte"; + const file$a = "src\\MovingDotPortfromReact.svelte"; - function create_fragment$8(ctx) { + function create_fragment$a(ctx) { let button; const block = { @@ -1108,7 +1111,7 @@ var app = (function () { set_style(button, "left", /*position*/ ctx[0].x + "px"); set_style(button, "top", /*position*/ ctx[0].y + "px"); attr_dev(button, "tabindex", "0"); - add_location(button, file$8, 48, 0, 1573); + add_location(button, file$a, 48, 0, 1573); }, l: function claim(nodes) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); @@ -1136,7 +1139,7 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_fragment$8.name, + id: create_fragment$a.name, type: "component", source: "", ctx @@ -1147,7 +1150,7 @@ var app = (function () { const step = 10; - function instance$8($$self, $$props, $$invalidate) { + function instance$a($$self, $$props, $$invalidate) { let { $$slots: slots = {}, $$scope } = $$props; validate_slots('MovingDotPortfromReact', slots, []); let { position = { x: 0, y: 0 } } = $$props; @@ -1252,13 +1255,13 @@ var app = (function () { class MovingDotPortfromReact extends SvelteComponentDev { constructor(options) { super(options); - init(this, options, instance$8, create_fragment$8, safe_not_equal, { position: 0, boundaries: 2, focusDot: 3 }); + init(this, options, instance$a, create_fragment$a, safe_not_equal, { position: 0, boundaries: 2, focusDot: 3 }); dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "MovingDotPortfromReact", options, - id: create_fragment$8.name + id: create_fragment$a.name }); } @@ -1289,9 +1292,9 @@ var app = (function () { /* src\MovingDotTargetPortfromReact.svelte generated by Svelte v3.59.2 */ - const file$7 = "src\\MovingDotTargetPortfromReact.svelte"; + const file$9 = "src\\MovingDotTargetPortfromReact.svelte"; - function create_fragment$7(ctx) { + function create_fragment$9(ctx) { let div; const block = { @@ -1300,7 +1303,7 @@ var app = (function () { attr_dev(div, "class", "target svelte-4yc66h"); set_style(div, "left", /*position*/ ctx[0].x + "px"); set_style(div, "top", /*position*/ ctx[0].y + "px"); - add_location(div, file$7, 4, 0, 49); + add_location(div, file$9, 4, 0, 49); }, l: function claim(nodes) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); @@ -1326,7 +1329,7 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_fragment$7.name, + id: create_fragment$9.name, type: "component", source: "", ctx @@ -1335,7 +1338,7 @@ var app = (function () { return block; } - function instance$7($$self, $$props, $$invalidate) { + function instance$9($$self, $$props, $$invalidate) { let { $$slots: slots = {}, $$scope } = $$props; validate_slots('MovingDotTargetPortfromReact', slots, []); let { position } = $$props; @@ -1372,13 +1375,13 @@ var app = (function () { class MovingDotTargetPortfromReact extends SvelteComponentDev { constructor(options) { super(options); - init(this, options, instance$7, create_fragment$7, safe_not_equal, { position: 0 }); + init(this, options, instance$9, create_fragment$9, safe_not_equal, { position: 0 }); dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "MovingDotTargetPortfromReact", options, - id: create_fragment$7.name + id: create_fragment$9.name }); } @@ -1391,19 +1394,19 @@ var app = (function () { } } - /* src\SimpleModal.svelte generated by Svelte v3.59.2 */ + /* src\MovingDotSpaceSimpleModal.svelte generated by Svelte v3.59.2 */ - const { console: console_1$4 } = globals; - const file$6 = "src\\SimpleModal.svelte"; + const { console: console_1$5 } = globals; + const file$8 = "src\\MovingDotSpaceSimpleModal.svelte"; - function get_each_context$4(ctx, list, i) { + function get_each_context$5(ctx, list, i) { const child_ctx = ctx.slice(); child_ctx[8] = list[i]; return child_ctx; } - // (22:0) {#if isOpen} - function create_if_block$3(ctx) { + // (32:0) {#if isOpen} + function create_if_block$4(ctx) { let div3; let div2; let div0; @@ -1423,7 +1426,7 @@ var app = (function () { let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { - each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i)); + each_blocks[i] = create_each_block$5(get_each_context$5(ctx, each_value, i)); } const block = { @@ -1446,18 +1449,18 @@ var app = (function () { each_blocks[i].c(); } - add_location(h2, file$6, 25, 8, 651); - add_location(button, file$6, 26, 8, 677); + add_location(h2, file$8, 35, 8, 882); + add_location(button, file$8, 36, 8, 908); attr_dev(div0, "class", "modal-header svelte-m51ous"); - add_location(div0, file$6, 24, 6, 615); + add_location(div0, file$8, 34, 6, 846); attr_dev(ul, "class", "modal-items"); - add_location(ul, file$6, 30, 8, 801); + add_location(ul, file$8, 40, 8, 1032); attr_dev(div1, "class", "modal-content svelte-m51ous"); - add_location(div1, file$6, 28, 6, 745); + add_location(div1, file$8, 38, 6, 976); attr_dev(div2, "class", "modal svelte-m51ous"); - add_location(div2, file$6, 23, 4, 588); + add_location(div2, file$8, 33, 4, 819); attr_dev(div3, "class", "modal-overlay svelte-m51ous"); - add_location(div3, file$6, 22, 2, 555); + add_location(div3, file$8, 32, 2, 786); }, m: function mount(target, anchor) { insert_dev(target, div3, anchor); @@ -1494,12 +1497,12 @@ var app = (function () { let i; for (i = 0; i < each_value.length; i += 1) { - const child_ctx = get_each_context$4(ctx, each_value, i); + const child_ctx = get_each_context$5(ctx, each_value, i); if (each_blocks[i]) { each_blocks[i].p(child_ctx, dirty); } else { - each_blocks[i] = create_each_block$4(child_ctx); + each_blocks[i] = create_each_block$5(child_ctx); each_blocks[i].c(); each_blocks[i].m(ul, null); } @@ -1522,17 +1525,17 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_if_block$3.name, + id: create_if_block$4.name, type: "if", - source: "(22:0) {#if isOpen}", + source: "(32:0) {#if isOpen}", ctx }); return block; } - // (32:10) {#each items as item} - function create_each_block$4(ctx) { + // (42:10) {#each items as item} + function create_each_block$5(ctx) { let button; let t_value = /*item*/ ctx[8].label + ""; let t; @@ -1547,7 +1550,7 @@ var app = (function () { c: function create() { button = element("button"); t = text(t_value); - add_location(button, file$6, 32, 12, 872); + add_location(button, file$8, 42, 12, 1103); }, m: function mount(target, anchor) { insert_dev(target, button, anchor); @@ -1571,18 +1574,18 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_each_block$4.name, + id: create_each_block$5.name, type: "each", - source: "(32:10) {#each items as item}", + source: "(42:10) {#each items as item}", ctx }); return block; } - function create_fragment$6(ctx) { + function create_fragment$8(ctx) { let if_block_anchor; - let if_block = /*isOpen*/ ctx[0] && create_if_block$3(ctx); + let if_block = /*isOpen*/ ctx[0] && create_if_block$4(ctx); const block = { c: function create() { @@ -1601,7 +1604,7 @@ var app = (function () { if (if_block) { if_block.p(ctx, dirty); } else { - if_block = create_if_block$3(ctx); + if_block = create_if_block$4(ctx); if_block.c(); if_block.m(if_block_anchor.parentNode, if_block_anchor); } @@ -1620,7 +1623,7 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_fragment$6.name, + id: create_fragment$8.name, type: "component", source: "", ctx @@ -1629,9 +1632,9 @@ var app = (function () { return block; } - function instance$6($$self, $$props, $$invalidate) { + function instance$8($$self, $$props, $$invalidate) { let { $$slots: slots = {}, $$scope } = $$props; - validate_slots('SimpleModal', slots, []); + validate_slots('MovingDotSpaceSimpleModal', slots, []); let { isOpen = false } = $$props; let { title = '' } = $$props; let { content = '' } = $$props; @@ -1649,18 +1652,31 @@ var app = (function () { console.log("Item clicked:", item); closeModal(); + + switch (item.action) { + case "revealCaveLocation": + { + alert("The cave is revealed"); + break; + } + case "giveHistory": + { + alert("The History is revealed"); + break; + } + } } $$self.$$.on_mount.push(function () { if (onClose === undefined && !('onClose' in $$props || $$self.$$.bound[$$self.$$.props['onClose']])) { - console_1$4.warn(" was created without expected prop 'onClose'"); + console_1$5.warn(" was created without expected prop 'onClose'"); } }); const writable_props = ['isOpen', 'title', 'content', 'items', 'onClose']; Object.keys($$props).forEach(key => { - if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$4.warn(` was created with unknown prop '${key}'`); + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$5.warn(` was created with unknown prop '${key}'`); }); const click_handler = item => handleItemClick(item); @@ -1707,11 +1723,11 @@ var app = (function () { ]; } - class SimpleModal extends SvelteComponentDev { + class MovingDotSpaceSimpleModal extends SvelteComponentDev { constructor(options) { super(options); - init(this, options, instance$6, create_fragment$6, safe_not_equal, { + init(this, options, instance$8, create_fragment$8, safe_not_equal, { isOpen: 0, title: 1, content: 2, @@ -1721,385 +1737,444 @@ var app = (function () { dispatch_dev("SvelteRegisterComponent", { component: this, - tagName: "SimpleModal", + tagName: "MovingDotSpaceSimpleModal", options, - id: create_fragment$6.name + id: create_fragment$8.name }); } get isOpen() { - throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); } set isOpen(value) { - throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); } get title() { - throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); } set title(value) { - throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); } get content() { - throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); } set content(value) { - throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); } get items() { - throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); } set items(value) { - throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); } get onClose() { - throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''"); } set onClose(value) { - throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); + throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''"); } } - /* src\MovingDotSpacePortfromReact.svelte generated by Svelte v3.59.2 */ + const health = writable(100); + const mana = writable(50); + const strength = writable(10); + const agility = writable(10); + const intelligence = writable(10); + const charisma = writable(10); + const luck = writable(10); + + const inventory = writable([ + // Sample inventory items + { type: "weapon", name: "Sword", description: "A sharp blade." }, + { type: "armor", name: "Shield", description: "Protects against attacks." }, + { type: "consumable", name: "Health Potion", description: "Restores health." }, + // Add more items as needed + ]); + + const skills = writable([ + // Sample skills + { branch: "Combat", name: "Basic Attack", learned: false }, + { branch: "Magic", name: "Fireball", learned: false }, + { branch: "Stealth", name: "Sneak", learned: false }, + // Add more skills as needed + ]); + + /* src\MovingDotStatStoreandDisplay.svelte generated by Svelte v3.59.2 */ + + const file$7 = "src\\MovingDotStatStoreandDisplay.svelte"; - const { console: console_1$3 } = globals; - const file$5 = "src\\MovingDotSpacePortfromReact.svelte"; + function get_each_context$4(ctx, list, i) { + const child_ctx = ctx.slice(); + child_ctx[11] = list[i]; + return child_ctx; + } - function get_each_context$3(ctx, list, i) { + function get_each_context_1(ctx, list, i) { const child_ctx = ctx.slice(); - child_ctx[19] = list[i]; + child_ctx[14] = list[i]; return child_ctx; } - // (155:4) {#each $targets as target (target.name)} - function create_each_block$3(key_1, ctx) { - let first; - let target; + // (23:8) {#each $inventory as item} + function create_each_block_1(ctx) { + let li; + let t0_value = /*item*/ ctx[14].name + ""; let t0; - let span; - let t1_value = /*target*/ ctx[19].name + ""; let t1; - let current; - - target = new MovingDotTargetPortfromReact({ - props: { position: /*target*/ ctx[19] }, - $$inline: true - }); + let t2_value = /*item*/ ctx[14].description + ""; + let t2; const block = { - key: key_1, - first: null, c: function create() { - first = empty(); - create_component(target.$$.fragment); - t0 = space(); - span = element("span"); - t1 = text(t1_value); - set_style(span, "position", "absolute"); - set_style(span, "left", /*target*/ ctx[19].x + "px"); - set_style(span, "top", /*target*/ ctx[19].y + "px"); - add_location(span, file$5, 156, 8, 7641); - this.first = first; - }, - m: function mount(target$1, anchor) { - insert_dev(target$1, first, anchor); - mount_component(target, target$1, anchor); - insert_dev(target$1, t0, anchor); - insert_dev(target$1, span, anchor); - append_dev(span, t1); - current = true; - }, - p: function update(new_ctx, dirty) { - ctx = new_ctx; - const target_changes = {}; - if (dirty & /*$targets*/ 64) target_changes.position = /*target*/ ctx[19]; - target.$set(target_changes); - if ((!current || dirty & /*$targets*/ 64) && t1_value !== (t1_value = /*target*/ ctx[19].name + "")) set_data_dev(t1, t1_value); - - if (!current || dirty & /*$targets*/ 64) { - set_style(span, "left", /*target*/ ctx[19].x + "px"); - } - - if (!current || dirty & /*$targets*/ 64) { - set_style(span, "top", /*target*/ ctx[19].y + "px"); - } + li = element("li"); + t0 = text(t0_value); + t1 = text(": "); + t2 = text(t2_value); + add_location(li, file$7, 23, 10, 705); }, - i: function intro(local) { - if (current) return; - transition_in(target.$$.fragment, local); - current = true; + m: function mount(target, anchor) { + insert_dev(target, li, anchor); + append_dev(li, t0); + append_dev(li, t1); + append_dev(li, t2); }, - o: function outro(local) { - transition_out(target.$$.fragment, local); - current = false; + p: function update(ctx, dirty) { + if (dirty & /*$inventory*/ 128 && t0_value !== (t0_value = /*item*/ ctx[14].name + "")) set_data_dev(t0, t0_value); + if (dirty & /*$inventory*/ 128 && t2_value !== (t2_value = /*item*/ ctx[14].description + "")) set_data_dev(t2, t2_value); }, d: function destroy(detaching) { - if (detaching) detach_dev(first); - destroy_component(target, detaching); - if (detaching) detach_dev(t0); - if (detaching) detach_dev(span); + if (detaching) detach_dev(li); } }; dispatch_dev("SvelteRegisterBlock", { block, - id: create_each_block$3.name, + id: create_each_block_1.name, type: "each", - source: "(155:4) {#each $targets as target (target.name)}", + source: "(23:8) {#each $inventory as item}", ctx }); return block; } - // (161:4) {#if isModalOpen} - function create_if_block$2(ctx) { - let modal; - let current; + // (33:6) {#each $skills as skill} + function create_each_block$4(ctx) { + let button; + let t0_value = /*skill*/ ctx[11].name + ""; + let t0; + let t1; + let t2_value = /*skill*/ ctx[11].branch + ""; + let t2; + let t3; + let t4_value = (/*skill*/ ctx[11].learned ? 'Yes' : 'No') + ""; + let t4; + let t5; + let mounted; + let dispose; - modal = new SimpleModal({ - props: { - isOpen: /*isModalOpen*/ ctx[2], - onClose: /*handleModalClose*/ ctx[11], - title: "Test Collision", - content: /*currentcollisiontext*/ ctx[3], - items: /*currentcollisionitems*/ ctx[4] - }, - $$inline: true - }); + function click_handler() { + return /*click_handler*/ ctx[10](/*skill*/ ctx[11]); + } const block = { c: function create() { - create_component(modal.$$.fragment); + button = element("button"); + t0 = text(t0_value); + t1 = text(" - "); + t2 = text(t2_value); + t3 = text(" - Learned: "); + t4 = text(t4_value); + t5 = space(); + attr_dev(button, "class", "skill"); + add_location(button, file$7, 33, 8, 932); }, m: function mount(target, anchor) { - mount_component(modal, target, anchor); - current = true; - }, - p: function update(ctx, dirty) { - const modal_changes = {}; - if (dirty & /*isModalOpen*/ 4) modal_changes.isOpen = /*isModalOpen*/ ctx[2]; - if (dirty & /*currentcollisiontext*/ 8) modal_changes.content = /*currentcollisiontext*/ ctx[3]; - if (dirty & /*currentcollisionitems*/ 16) modal_changes.items = /*currentcollisionitems*/ ctx[4]; - modal.$set(modal_changes); - }, - i: function intro(local) { - if (current) return; - transition_in(modal.$$.fragment, local); - current = true; + insert_dev(target, button, anchor); + append_dev(button, t0); + append_dev(button, t1); + append_dev(button, t2); + append_dev(button, t3); + append_dev(button, t4); + append_dev(button, t5); + + if (!mounted) { + dispose = listen_dev(button, "click", click_handler, false, false, false, false); + mounted = true; + } }, - o: function outro(local) { - transition_out(modal.$$.fragment, local); - current = false; + p: function update(new_ctx, dirty) { + ctx = new_ctx; + if (dirty & /*$skills*/ 256 && t0_value !== (t0_value = /*skill*/ ctx[11].name + "")) set_data_dev(t0, t0_value); + if (dirty & /*$skills*/ 256 && t2_value !== (t2_value = /*skill*/ ctx[11].branch + "")) set_data_dev(t2, t2_value); + if (dirty & /*$skills*/ 256 && t4_value !== (t4_value = (/*skill*/ ctx[11].learned ? 'Yes' : 'No') + "")) set_data_dev(t4, t4_value); }, d: function destroy(detaching) { - destroy_component(modal, detaching); + if (detaching) detach_dev(button); + mounted = false; + dispose(); } }; dispatch_dev("SvelteRegisterBlock", { block, - id: create_if_block$2.name, - type: "if", - source: "(161:4) {#if isModalOpen}", + id: create_each_block$4.name, + type: "each", + source: "(33:6) {#each $skills as skill}", ctx }); return block; } - function create_fragment$5(ctx) { - let div1; - let canvas_1; - let t0; - let movingdot; + function create_fragment$7(ctx) { + let div8; + let div3; + let div2; + let h20; let t1; let div0; let t2; - let t3_value = /*$dotPosition*/ ctx[0].x + ""; let t3; let t4; - let t5_value = /*$dotPosition*/ ctx[0].y + ""; let t5; let t6; - let each_blocks = []; - let each_1_lookup = new Map(); let t7; - let current; - let mounted; - let dispose; + let t8; + let t9; + let t10; + let t11; + let t12; + let t13; + let t14; + let div1; + let t15; + let t16; + let t17; + let div5; + let div4; + let h21; + let t19; + let ul; + let t20; + let div7; + let div6; + let h22; + let t22; + let each_value_1 = /*$inventory*/ ctx[7]; + validate_each_argument(each_value_1); + let each_blocks_1 = []; - let movingdot_props = { - position: /*$dotPosition*/ ctx[0], - boundaries: /*boundaries*/ ctx[9] - }; + for (let i = 0; i < each_value_1.length; i += 1) { + each_blocks_1[i] = create_each_block_1(get_each_context_1(ctx, each_value_1, i)); + } - movingdot = new MovingDotPortfromReact({ props: movingdot_props, $$inline: true }); - /*movingdot_binding*/ ctx[15](movingdot); - movingdot.$on("move", /*move_handler*/ ctx[16]); - let each_value = /*$targets*/ ctx[6]; + let each_value = /*$skills*/ ctx[8]; validate_each_argument(each_value); - const get_key = ctx => /*target*/ ctx[19].name; - validate_each_keys(ctx, each_value, get_each_context$3, get_key); + let each_blocks = []; for (let i = 0; i < each_value.length; i += 1) { - let child_ctx = get_each_context$3(ctx, each_value, i); - let key = get_key(child_ctx); - each_1_lookup.set(key, each_blocks[i] = create_each_block$3(key, child_ctx)); + each_blocks[i] = create_each_block$4(get_each_context$4(ctx, each_value, i)); } - let if_block = /*isModalOpen*/ ctx[2] && create_if_block$2(ctx); - const block = { c: function create() { - div1 = element("div"); - canvas_1 = element("canvas"); - t0 = space(); - create_component(movingdot.$$.fragment); + div8 = element("div"); + div3 = element("div"); + div2 = element("div"); + h20 = element("h2"); + h20.textContent = "Player Stats"; t1 = space(); div0 = element("div"); - t2 = text("Minor Game Events Log for player ||| Position for Developer "); - t3 = text(t3_value); - t4 = space(); - t5 = text(t5_value); - t6 = space(); + t2 = text("Health: "); + t3 = text(/*$health*/ ctx[0]); + t4 = text(" Mana: "); + t5 = text(/*$mana*/ ctx[1]); + t6 = text(" Strength: "); + t7 = text(/*$strength*/ ctx[2]); + t8 = text(" Agility: "); + t9 = text(/*$agility*/ ctx[3]); + t10 = text(" Intelligence: "); + t11 = text(/*$intelligence*/ ctx[4]); + t12 = text(" Charisma: "); + t13 = text(/*$charisma*/ ctx[5]); + t14 = space(); + div1 = element("div"); + t15 = text("Luck: "); + t16 = text(/*$luck*/ ctx[6]); + t17 = space(); + div5 = element("div"); + div4 = element("div"); + h21 = element("h2"); + h21.textContent = "Inventory"; + t19 = space(); + ul = element("ul"); + + for (let i = 0; i < each_blocks_1.length; i += 1) { + each_blocks_1[i].c(); + } + + t20 = space(); + div7 = element("div"); + div6 = element("div"); + h22 = element("h2"); + h22.textContent = "Skill Tree"; + t22 = space(); for (let i = 0; i < each_blocks.length; i += 1) { each_blocks[i].c(); } - t7 = space(); - if (if_block) if_block.c(); - set_style(canvas_1, "width", "100%"); - set_style(canvas_1, "height", "100%"); - attr_dev(canvas_1, "tabindex", "0"); - add_location(canvas_1, file$5, 151, 4, 7167); - attr_dev(div0, "id", "overlayText"); - attr_dev(div0, "class", "svelte-c2nwl9"); - add_location(div0, file$5, 153, 4, 7425); - attr_dev(div1, "id", "game-container"); - attr_dev(div1, "style", /*spaceStyle*/ ctx[13]); - add_location(div1, file$5, 150, 0, 7081); + add_location(h20, file$7, 12, 6, 337); + add_location(div0, file$7, 13, 6, 366); + add_location(div1, file$7, 14, 6, 510); + attr_dev(div2, "class", "stats svelte-10basrm"); + add_location(div2, file$7, 11, 4, 310); + attr_dev(div3, "class", "grid-statsitem svelte-10basrm"); + add_location(div3, file$7, 10, 2, 276); + add_location(h21, file$7, 20, 6, 627); + add_location(ul, file$7, 21, 6, 653); + attr_dev(div4, "class", "inventory svelte-10basrm"); + add_location(div4, file$7, 19, 4, 596); + attr_dev(div5, "class", "grid-statsitem svelte-10basrm"); + add_location(div5, file$7, 18, 2, 562); + add_location(h22, file$7, 31, 6, 871); + attr_dev(div6, "class", "skill-tree svelte-10basrm"); + add_location(div6, file$7, 30, 4, 839); + attr_dev(div7, "class", "grid-statsitem svelte-10basrm"); + add_location(div7, file$7, 29, 2, 805); + attr_dev(div8, "class", "grid-statsContainer svelte-10basrm"); + add_location(div8, file$7, 9, 0, 239); }, 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, div1, anchor); - append_dev(div1, canvas_1); - /*canvas_1_binding*/ ctx[14](canvas_1); - append_dev(div1, t0); - mount_component(movingdot, div1, null); - append_dev(div1, t1); - append_dev(div1, div0); + insert_dev(target, div8, anchor); + append_dev(div8, div3); + append_dev(div3, div2); + append_dev(div2, h20); + append_dev(div2, t1); + append_dev(div2, div0); append_dev(div0, t2); append_dev(div0, t3); append_dev(div0, t4); append_dev(div0, t5); - append_dev(div1, t6); - - for (let i = 0; i < each_blocks.length; i += 1) { - if (each_blocks[i]) { - each_blocks[i].m(div1, null); + append_dev(div0, t6); + append_dev(div0, t7); + append_dev(div0, t8); + append_dev(div0, t9); + append_dev(div0, t10); + append_dev(div0, t11); + append_dev(div0, t12); + append_dev(div0, t13); + append_dev(div2, t14); + append_dev(div2, div1); + append_dev(div1, t15); + append_dev(div1, t16); + append_dev(div8, t17); + append_dev(div8, div5); + append_dev(div5, div4); + append_dev(div4, h21); + append_dev(div4, t19); + append_dev(div4, ul); + + for (let i = 0; i < each_blocks_1.length; i += 1) { + if (each_blocks_1[i]) { + each_blocks_1[i].m(ul, null); } } - append_dev(div1, t7); - if (if_block) if_block.m(div1, null); - current = true; + append_dev(div8, t20); + append_dev(div8, div7); + append_dev(div7, div6); + append_dev(div6, h22); + append_dev(div6, t22); - if (!mounted) { - dispose = listen_dev(canvas_1, "click", /*handleSpaceClick*/ ctx[10], false, false, false, false); - mounted = true; + for (let i = 0; i < each_blocks.length; i += 1) { + if (each_blocks[i]) { + each_blocks[i].m(div6, null); + } } }, p: function update(ctx, [dirty]) { - const movingdot_changes = {}; - if (dirty & /*$dotPosition*/ 1) movingdot_changes.position = /*$dotPosition*/ ctx[0]; - movingdot.$set(movingdot_changes); - if ((!current || dirty & /*$dotPosition*/ 1) && t3_value !== (t3_value = /*$dotPosition*/ ctx[0].x + "")) set_data_dev(t3, t3_value); - if ((!current || dirty & /*$dotPosition*/ 1) && t5_value !== (t5_value = /*$dotPosition*/ ctx[0].y + "")) set_data_dev(t5, t5_value); - - if (dirty & /*$targets*/ 64) { - each_value = /*$targets*/ ctx[6]; - validate_each_argument(each_value); - group_outros(); - validate_each_keys(ctx, each_value, get_each_context$3, get_key); - each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div1, outro_and_destroy_block, create_each_block$3, t7, get_each_context$3); - check_outros(); - } + if (dirty & /*$health*/ 1) set_data_dev(t3, /*$health*/ ctx[0]); + if (dirty & /*$mana*/ 2) set_data_dev(t5, /*$mana*/ ctx[1]); + if (dirty & /*$strength*/ 4) set_data_dev(t7, /*$strength*/ ctx[2]); + if (dirty & /*$agility*/ 8) set_data_dev(t9, /*$agility*/ ctx[3]); + if (dirty & /*$intelligence*/ 16) set_data_dev(t11, /*$intelligence*/ ctx[4]); + if (dirty & /*$charisma*/ 32) set_data_dev(t13, /*$charisma*/ ctx[5]); + if (dirty & /*$luck*/ 64) set_data_dev(t16, /*$luck*/ ctx[6]); + + if (dirty & /*$inventory*/ 128) { + each_value_1 = /*$inventory*/ ctx[7]; + validate_each_argument(each_value_1); + let i; - if (/*isModalOpen*/ ctx[2]) { - if (if_block) { - if_block.p(ctx, dirty); + for (i = 0; i < each_value_1.length; i += 1) { + const child_ctx = get_each_context_1(ctx, each_value_1, i); - if (dirty & /*isModalOpen*/ 4) { - transition_in(if_block, 1); + if (each_blocks_1[i]) { + each_blocks_1[i].p(child_ctx, dirty); + } else { + each_blocks_1[i] = create_each_block_1(child_ctx); + each_blocks_1[i].c(); + each_blocks_1[i].m(ul, null); } - } else { - if_block = create_if_block$2(ctx); - if_block.c(); - transition_in(if_block, 1); - if_block.m(div1, null); } - } else if (if_block) { - group_outros(); - transition_out(if_block, 1, 1, () => { - if_block = null; - }); + for (; i < each_blocks_1.length; i += 1) { + each_blocks_1[i].d(1); + } - check_outros(); + each_blocks_1.length = each_value_1.length; } - }, - i: function intro(local) { - if (current) return; - transition_in(movingdot.$$.fragment, local); - for (let i = 0; i < each_value.length; i += 1) { - transition_in(each_blocks[i]); - } + if (dirty & /*toggleSkill, $skills*/ 768) { + each_value = /*$skills*/ ctx[8]; + validate_each_argument(each_value); + let i; - transition_in(if_block); - current = true; - }, - o: function outro(local) { - transition_out(movingdot.$$.fragment, local); + for (i = 0; i < each_value.length; i += 1) { + const child_ctx = get_each_context$4(ctx, each_value, i); - for (let i = 0; i < each_blocks.length; i += 1) { - transition_out(each_blocks[i]); - } + if (each_blocks[i]) { + each_blocks[i].p(child_ctx, dirty); + } else { + each_blocks[i] = create_each_block$4(child_ctx); + each_blocks[i].c(); + each_blocks[i].m(div6, null); + } + } - transition_out(if_block); - current = false; - }, - d: function destroy(detaching) { - if (detaching) detach_dev(div1); - /*canvas_1_binding*/ ctx[14](null); - /*movingdot_binding*/ ctx[15](null); - destroy_component(movingdot); + for (; i < each_blocks.length; i += 1) { + each_blocks[i].d(1); + } - for (let i = 0; i < each_blocks.length; i += 1) { - each_blocks[i].d(); + each_blocks.length = each_value.length; } - - if (if_block) if_block.d(); - mounted = false; - dispose(); + }, + i: noop, + o: noop, + d: function destroy(detaching) { + if (detaching) detach_dev(div8); + destroy_each(each_blocks_1, detaching); + destroy_each(each_blocks, detaching); } }; dispatch_dev("SvelteRegisterBlock", { block, - id: create_fragment$5.name, + id: create_fragment$7.name, type: "component", source: "", ctx @@ -2108,688 +2183,1735 @@ var app = (function () { return block; } - function instance$5($$self, $$props, $$invalidate) { - let $dotPosition; - let $targets; + function instance$7($$self, $$props, $$invalidate) { + let $health; + let $mana; + let $strength; + let $agility; + let $intelligence; + let $charisma; + let $luck; + let $inventory; + let $skills; + validate_store(health, 'health'); + component_subscribe($$self, health, $$value => $$invalidate(0, $health = $$value)); + validate_store(mana, 'mana'); + component_subscribe($$self, mana, $$value => $$invalidate(1, $mana = $$value)); + validate_store(strength, 'strength'); + component_subscribe($$self, strength, $$value => $$invalidate(2, $strength = $$value)); + validate_store(agility, 'agility'); + component_subscribe($$self, agility, $$value => $$invalidate(3, $agility = $$value)); + validate_store(intelligence, 'intelligence'); + component_subscribe($$self, intelligence, $$value => $$invalidate(4, $intelligence = $$value)); + validate_store(charisma, 'charisma'); + component_subscribe($$self, charisma, $$value => $$invalidate(5, $charisma = $$value)); + validate_store(luck, 'luck'); + component_subscribe($$self, luck, $$value => $$invalidate(6, $luck = $$value)); + validate_store(inventory, 'inventory'); + component_subscribe($$self, inventory, $$value => $$invalidate(7, $inventory = $$value)); + validate_store(skills, 'skills'); + component_subscribe($$self, skills, $$value => $$invalidate(8, $skills = $$value)); let { $$slots: slots = {}, $$scope } = $$props; - validate_slots('MovingDotSpacePortfromReact', slots, []); - let canvas; - let dotPosition = writable({ x: 900, y: 450 }); - validate_store(dotPosition, 'dotPosition'); - component_subscribe($$self, dotPosition, value => $$invalidate(0, $dotPosition = value)); + validate_slots('MovingDotStatStoreandDisplay', slots, []); - let targets = writable([ - { - name: "Target 1", - x: 50, - y: 50, - collisionType: "alert", - collisiontext: "First Test" - }, - { - name: "Target 2", - x: 100, - y: 100, - collisionType: "", - collisiontext: "" - }, - { - name: "Entrance", - x: 995, - y: 660, - collisionType: "modal", - collisiontext: "You arrived what now?" - }, - // Add more targets as needed - { - name: "Market Stall", - x: 200, - y: 300, - collisionType: "", - collisiontext: "" - }, - { - name: "Inn Entrance", // A market stall in the bustling market area. - x: 400, - y: 450, - collisionType: "", - collisiontext: "" - }, - { - name: "Town Hall", // The entrance to the inn for rest or information. - x: 600, - y: 350, - collisionType: "", - collisiontext: "" - }, - { - name: "Fountain", // The entrance to the town hall for quests. - x: 500, - y: 500, - collisionType: "", - collisiontext: "" - }, - { - name: "Bridge", // A fountain in the town square as a meeting point. - x: 1100, - y: 700, - collisionType: "", - collisiontext: "" - }, - { - name: "Waterfall", // A bridge in the mystical forest area. - x: 1300, - y: 800, - collisionType: "", - collisiontext: "" - }, - { - name: "Mountain Peak", // A waterfall that could hide secrets or treasures. - x: 1500, - y: 100, - collisionType: "", - collisiontext: "" - } - ]); //{ name: "Mysterious Stranger", x: 350, y: 550, collisionType: "alert", collisiontext: "Beware the hidden caves in the north." }, - //{ name: "Hidden Cave", x: 1200, y: 400, collisionType: "changeBackgroundColor", color: "#0B3D91" }, - //{ name: "Ancient Tree", x: 300, y: 700, collisionType: "playSound", soundUrl: "tree_whisper.mp3" }, - //{ name: "Forgotten Monument", x: 700, y: 800, collisionType: "startAnimation", elementId: "monument", animationClass: "glow" }, + function toggleSkill(skill) { + skill.learned = !skill.learned; + skills.update(n => n); + } - validate_store(targets, 'targets'); - component_subscribe($$self, targets, value => $$invalidate(6, $targets = value)); + const writable_props = []; - //{ name: "Wizard's Tower", x: 950, y: 150, collisionType: "rotateDot" }, - //{ name: "Lakeside", x: 1400, y: 600, collisionType: "changeDotColor", color: "#00BFFF" }, - //{ name: "Dragon's Lair", x: 1600, y: 200, collisionType: "incrementScore", incrementValue: 50 }, - //{ name: "Abandoned Shipwreck", x: 1300, y: 500, collisionType: "shrinkDot" }, - let boundaries = { maxX: 1835, maxY: 890, minX: 0, minY: 0 }; + Object.keys($$props).forEach(key => { + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(` was created with unknown prop '${key}'`); + }); - let isModalOpen = false; - let currentcollisiontext; - let currentcollisionitems = []; - let movingDotElement; + const click_handler = skill => toggleSkill(skill); - function handleSpaceClick() { - //console.log('Container clicked!', event); - movingDotElement.focusDot(); - } + $$self.$capture_state = () => ({ + health, + mana, + strength, + agility, + intelligence, + charisma, + luck, + inventory, + skills, + toggleSkill, + $health, + $mana, + $strength, + $agility, + $intelligence, + $charisma, + $luck, + $inventory, + $skills + }); - function handleModalClose() { - $$invalidate(2, isModalOpen = false); - movingDotElement.focusDot(); - } + return [ + $health, + $mana, + $strength, + $agility, + $intelligence, + $charisma, + $luck, + $inventory, + $skills, + toggleSkill, + click_handler + ]; + } - function updateDotPosition(newX, newY) { - dotPosition.set({ x: newX, y: newY }); - } + class MovingDotStatStoreandDisplay extends SvelteComponentDev { + constructor(options) { + super(options); + init(this, options, instance$7, create_fragment$7, safe_not_equal, {}); - // Collision check function - const checkCollision = dotPos => { - $targets.forEach(target => { - if (dotPos.x < target.x + 10 && dotPos.x + 10 > target.x && dotPos.y < target.y + 10 && dotPos.y + 10 > target.y) { - handleCollision(target); - } + dispatch_dev("SvelteRegisterComponent", { + component: this, + tagName: "MovingDotStatStoreandDisplay", + options, + id: create_fragment$7.name }); - }; + } + } - // Handle collision based on the target object - const handleCollision = target => { - switch (target.collisionType) { - case "": - console.log("Nothing Happenedddd"); - break; - case "alert": - alert(target.collisiontext); - break; - case "modal": - $$invalidate(2, isModalOpen = true); - $$invalidate(3, currentcollisiontext = target.collisiontext); - $$invalidate(4, currentcollisionitems = [ - { - label: "Ask about the hidden cave", - action: "revealCaveLocation" - }, - { - label: "Inquire about the town's history", - action: "giveHistory" - }, - { - label: "Ignore and leave", - action: "closeModal" - } - ]); - break; - } // Handle other permanent UI elements here - }; // ... - //ChatGPT Suggested Options - // Change the background color of the canvas or a specific element. - // case "changeBackgroundColor": + /* src\MovingDotSpacePortfromReact.svelte generated by Svelte v3.59.2 */ - const spaceStyle = `position: relative; width: 100%; height: 100vh; border: 1px solid black; overflow: hidden; background-image: url('/AutoGameBackgrounds/1stGameLoc123.png'); background-size: cover; background-position: center;`; - const writable_props = []; + const { console: console_1$4 } = globals; + const file$6 = "src\\MovingDotSpacePortfromReact.svelte"; - Object.keys($$props).forEach(key => { - if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$3.warn(` was created with unknown prop '${key}'`); - }); + function get_each_context$3(ctx, list, i) { + const child_ctx = ctx.slice(); + child_ctx[19] = list[i]; + return child_ctx; + } - function canvas_1_binding($$value) { - binding_callbacks[$$value ? 'unshift' : 'push'](() => { - canvas = $$value; - $$invalidate(1, canvas); - }); - } + // (159:4) {#each $targets as target (target.name)} + function create_each_block$3(key_1, ctx) { + let first; + let target; + let t0; + let span; + let t1_value = /*target*/ ctx[19].name + ""; + let t1; + let current; - function movingdot_binding($$value) { - binding_callbacks[$$value ? 'unshift' : 'push'](() => { - movingDotElement = $$value; - $$invalidate(5, movingDotElement); + target = new MovingDotTargetPortfromReact({ + props: { position: /*target*/ ctx[19] }, + $$inline: true }); - } - - const move_handler = e => updateDotPosition(e.detail.x, e.detail.y); - - $$self.$capture_state = () => ({ - onMount, - writable, - MovingDot: MovingDotPortfromReact, - Target: MovingDotTargetPortfromReact, - Modal: SimpleModal, - canvas, - dotPosition, - targets, - boundaries, - isModalOpen, - currentcollisiontext, - currentcollisionitems, - movingDotElement, - handleSpaceClick, - handleModalClose, - updateDotPosition, - checkCollision, - handleCollision, - spaceStyle, - $dotPosition, - $targets - }); - $$self.$inject_state = $$props => { - if ('canvas' in $$props) $$invalidate(1, canvas = $$props.canvas); - if ('dotPosition' in $$props) $$invalidate(7, dotPosition = $$props.dotPosition); - if ('targets' in $$props) $$invalidate(8, targets = $$props.targets); - if ('boundaries' in $$props) $$invalidate(9, boundaries = $$props.boundaries); - if ('isModalOpen' in $$props) $$invalidate(2, isModalOpen = $$props.isModalOpen); - if ('currentcollisiontext' in $$props) $$invalidate(3, currentcollisiontext = $$props.currentcollisiontext); - if ('currentcollisionitems' in $$props) $$invalidate(4, currentcollisionitems = $$props.currentcollisionitems); - if ('movingDotElement' in $$props) $$invalidate(5, movingDotElement = $$props.movingDotElement); - }; + const block = { + key: key_1, + first: null, + c: function create() { + first = empty(); + create_component(target.$$.fragment); + t0 = space(); + span = element("span"); + t1 = text(t1_value); + set_style(span, "position", "absolute"); + set_style(span, "left", /*target*/ ctx[19].x + "px"); + set_style(span, "top", /*target*/ ctx[19].y + "px"); + add_location(span, file$6, 160, 8, 7871); + this.first = first; + }, + m: function mount(target$1, anchor) { + insert_dev(target$1, first, anchor); + mount_component(target, target$1, anchor); + insert_dev(target$1, t0, anchor); + insert_dev(target$1, span, anchor); + append_dev(span, t1); + current = true; + }, + p: function update(new_ctx, dirty) { + ctx = new_ctx; + const target_changes = {}; + if (dirty & /*$targets*/ 64) target_changes.position = /*target*/ ctx[19]; + target.$set(target_changes); + if ((!current || dirty & /*$targets*/ 64) && t1_value !== (t1_value = /*target*/ ctx[19].name + "")) set_data_dev(t1, t1_value); - if ($$props && "$$inject" in $$props) { - $$self.$inject_state($$props.$$inject); - } + if (!current || dirty & /*$targets*/ 64) { + set_style(span, "left", /*target*/ ctx[19].x + "px"); + } - $$self.$$.update = () => { - if ($$self.$$.dirty & /*$dotPosition*/ 1) { - // document.body.style.backgroundColor = target.color; - // break; - // Play a sound effect. You'll need to pre-load these sounds. - // case "playSound": - // new Audio(target.soundUrl).play(); - // break; - // Redirect the user to a different URL. - // case "redirect": - // window.location.href = target.url; - // break; - // Increase the size of the dot. - // case "enlargeDot": - // dotElement.style.transform = "scale(1.5)"; - // break; - // Decrease the size of the dot. - // case "shrinkDot": - // dotElement.style.transform = "scale(0.5)"; - // break; - // Apply a rotation to the dot. - // case "rotateDot": - // dotElement.style.transform = "rotate(45deg)"; - // break; - // Toggle the visibility of a specific element on the page. - // case "toggleVisibility": - // let elem = document.getElementById(target.elementId); - // elem.style.display = elem.style.display === 'none' ? 'block' : 'none'; - // break; - // Trigger a CSS animation on a specific element. - // case "startAnimation": - // let animElem = document.getElementById(target.elementId); - // animElem.classList.add(target.animationClass); - // break; - // Increase a score or counter displayed on the screen. - // case "incrementScore": - // score += target.incrementValue; - // updateScoreDisplay(); // Assuming you have a function to update the score display - // break; - // Change the color of the dot. - // case "changeDotColor": - // dotElement.style.backgroundColor = target.color; - // break; - // Reactive statement to check collision whenever dotPosition changes - $dotPosition && checkCollision($dotPosition); + if (!current || dirty & /*$targets*/ 64) { + set_style(span, "top", /*target*/ ctx[19].y + "px"); + } + }, + i: function intro(local) { + if (current) return; + transition_in(target.$$.fragment, local); + current = true; + }, + o: function outro(local) { + transition_out(target.$$.fragment, local); + current = false; + }, + d: function destroy(detaching) { + if (detaching) detach_dev(first); + destroy_component(target, detaching); + if (detaching) detach_dev(t0); + if (detaching) detach_dev(span); } }; - return [ - $dotPosition, - canvas, - isModalOpen, - currentcollisiontext, - currentcollisionitems, - movingDotElement, - $targets, - dotPosition, - targets, - boundaries, - handleSpaceClick, - handleModalClose, - updateDotPosition, - spaceStyle, - canvas_1_binding, - movingdot_binding, - move_handler - ]; - } - - class MovingDotSpacePortfromReact extends SvelteComponentDev { - constructor(options) { - super(options); - init(this, options, instance$5, create_fragment$5, safe_not_equal, {}); + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_each_block$3.name, + type: "each", + source: "(159:4) {#each $targets as target (target.name)}", + ctx + }); - dispatch_dev("SvelteRegisterComponent", { - component: this, - tagName: "MovingDotSpacePortfromReact", - options, - id: create_fragment$5.name - }); - } + return block; } - /* src\YoutubeIframeAPICustomInterface.svelte generated by Svelte v3.59.2 */ + // (165:4) {#if isModalOpen} + function create_if_block$3(ctx) { + let modal; + let current; - const { console: console_1$2 } = globals; - const file$4 = "src\\YoutubeIframeAPICustomInterface.svelte"; + modal = new MovingDotSpaceSimpleModal({ + props: { + isOpen: /*isModalOpen*/ ctx[2], + onClose: /*handleModalClose*/ ctx[11], + title: "Test Collision", + content: /*currentcollisiontext*/ ctx[3], + items: /*currentcollisionitems*/ ctx[4] + }, + $$inline: true + }); - function create_fragment$4(ctx) { - let h1; - let t1; - let label; - let t2; - let input0; - let t3; - let input1; - let t4; - let div3; - let div0; - let t5; - let div1; - let t6; - let t7_value = /*currentTime*/ ctx[3].toFixed(2) + ""; + const block = { + c: function create() { + create_component(modal.$$.fragment); + }, + m: function mount(target, anchor) { + mount_component(modal, target, anchor); + current = true; + }, + p: function update(ctx, dirty) { + const modal_changes = {}; + if (dirty & /*isModalOpen*/ 4) modal_changes.isOpen = /*isModalOpen*/ ctx[2]; + if (dirty & /*currentcollisiontext*/ 8) modal_changes.content = /*currentcollisiontext*/ ctx[3]; + if (dirty & /*currentcollisionitems*/ 16) modal_changes.items = /*currentcollisionitems*/ ctx[4]; + modal.$set(modal_changes); + }, + i: function intro(local) { + if (current) return; + transition_in(modal.$$.fragment, local); + current = true; + }, + o: function outro(local) { + transition_out(modal.$$.fragment, local); + current = false; + }, + d: function destroy(detaching) { + destroy_component(modal, detaching); + } + }; + + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_if_block$3.name, + type: "if", + source: "(165:4) {#if isModalOpen}", + ctx + }); + + return block; + } + + function create_fragment$6(ctx) { + let div1; + let canvas_1; + let t0; + let movingdot; + let t1; + let div0; + let t2; + let t3_value = /*$dotPosition*/ ctx[0].x + ""; + let t3; + let t4; + let t5_value = /*$dotPosition*/ ctx[0].y + ""; + let t5; + let t6; + let each_blocks = []; + let each_1_lookup = new Map(); let t7; let t8; - let t9; - let div2; - let t10; - let t11; - let br0; - let t12; - let t13; - let t14; - let button0; - let t18; - let button1; - let t22; - let t23; - let t24; - let t25_value = /*timestamps*/ ctx[8].length + ""; - let t25; - let t26; - let br1; - let t27; - let button2; - let t29; - let button3; - let t30; - let button3_class_value; - let button3_disabled_value; - let t31; - let button4; - let t32; - let button4_class_value; - let button4_disabled_value; - let t33; - let button5; - let t34; - let button5_class_value; - let button5_disabled_value; - let t35; - let t36; - let t37; - let t38_value = /*userTimestamps*/ ctx[1].length + ""; - let t38; - let t39; - let br2; - let t40; - let t41; - let t42; - let t43_value = /*r2userTimestamps*/ ctx[9].length + ""; - let t43; - let t44; - let br3; - let t45; - let br4; - let t46; - let button6; - let t48; - let button7; - let t50; - let input2; + let movingdotstats; + let current; let mounted; let dispose; + let movingdot_props = { + position: /*$dotPosition*/ ctx[0], + boundaries: /*boundaries*/ ctx[9] + }; + + movingdot = new MovingDotPortfromReact({ props: movingdot_props, $$inline: true }); + /*movingdot_binding*/ ctx[15](movingdot); + movingdot.$on("move", /*move_handler*/ ctx[16]); + let each_value = /*$targets*/ ctx[6]; + validate_each_argument(each_value); + const get_key = ctx => /*target*/ ctx[19].name; + validate_each_keys(ctx, each_value, get_each_context$3, get_key); + + for (let i = 0; i < each_value.length; i += 1) { + let child_ctx = get_each_context$3(ctx, each_value, i); + let key = get_key(child_ctx); + each_1_lookup.set(key, each_blocks[i] = create_each_block$3(key, child_ctx)); + } + + let if_block = /*isModalOpen*/ ctx[2] && create_if_block$3(ctx); + movingdotstats = new MovingDotStatStoreandDisplay({ $$inline: true }); + const block = { c: function create() { - h1 = element("h1"); - h1.textContent = "Custom Youtube Player for learning Video and music"; + div1 = element("div"); + canvas_1 = element("canvas"); + t0 = space(); + create_component(movingdot.$$.fragment); t1 = space(); - label = element("label"); - t2 = text("Current Video Id (mwO6v4BlgZQ | IVJkOHTBPn0 ) (test - qEpmiA3XkX8 hardcoded)\r\n "); - input0 = element("input"); - t3 = text("\r\n Start/Stop Word Update (Dummy Transcript for now)\r\n "); - input1 = element("input"); - t4 = space(); - div3 = element("div"); div0 = element("div"); - t5 = space(); - div1 = element("div"); - t6 = text("Current Time: "); - t7 = text(t7_value); - t8 = text(" seconds"); - t9 = space(); - div2 = element("div"); - t10 = text(/*line*/ ctx[5]); - t11 = space(); - br0 = element("br"); - t12 = space(); - t13 = text(/*currentWord*/ ctx[4]); - t14 = space(); - button0 = element("button"); - button0.textContent = `Previous Auto Timestamp - ${/*interval*/ ctx[13]}s`; - t18 = space(); - button1 = element("button"); - button1.textContent = `Next Auto Timestamp - ${/*interval*/ ctx[13]}s`; - t22 = text("\r\nAuto Timestamps: "); - t23 = text(/*currentIndex*/ ctx[7]); - t24 = text(" / "); - t25 = text(t25_value); - t26 = space(); - br1 = element("br"); - t27 = space(); - button2 = element("button"); - button2.textContent = "Add Timestamp"; - t29 = space(); - button3 = element("button"); - t30 = text("Current User Timestamp (incomplete)"); - t31 = space(); - button4 = element("button"); - t32 = text("Previous User Timestamp"); - t33 = space(); - button5 = element("button"); - t34 = text("Next User Timestamp"); - t35 = text("\r\nUser Timestamps: "); - t36 = text(/*currentuserIndex*/ ctx[0]); - t37 = text(" / "); - t38 = text(t38_value); - t39 = space(); - br2 = element("br"); - t40 = text(" Round 2 (/n) User Timestamps: "); - t41 = text(/*currentuserIndex*/ ctx[0]); - t42 = text(" / "); - t43 = text(t43_value); - t44 = space(); - br3 = element("br"); - t45 = text("A list of one messes up the logic for the counter in conjuction with the user timestamp button reactivity "); - br4 = element("br"); - t46 = space(); - button6 = element("button"); - button6.textContent = "Export Timestamps"; - t48 = space(); - button7 = element("button"); - button7.textContent = "Export Round 2 Timestamps"; - t50 = text(" Import Timestamps (Incomplete) "); - input2 = element("input"); - add_location(h1, file$4, 286, 0, 9769); - attr_dev(input0, "type", "text"); - add_location(input0, file$4, 290, 4, 9927); - attr_dev(input1, "type", "checkbox"); - add_location(input1, file$4, 292, 4, 10035); - add_location(label, file$4, 288, 0, 9832); - attr_dev(div0, "id", "youtube-player"); - set_style(div0, "height", "90vh"); - set_style(div0, "width", "90%"); - add_location(div0, file$4, 300, 4, 10405); - set_style(div1, "position", "absolute"); - set_style(div1, "top", "0%"); - set_style(div1, "left", "40%"); - set_style(div1, "color", "white"); - set_style(div1, "background-color", "rgba(0, 0, 0, 0.5)"); - add_location(div1, file$4, 301, 4, 10475); - add_location(br0, file$4, 305, 15, 10795); - set_style(div2, "position", "absolute"); - set_style(div2, "top", "50%"); - set_style(div2, "left", "20%"); - set_style(div2, "color", "white"); - set_style(div2, "background-color", "rgba(0, 0, 0, 0.5)"); - set_style(div2, "font-size", "100px"); - add_location(div2, file$4, 304, 4, 10654); - set_style(div3, "position", "relative"); - add_location(div3, file$4, 299, 0, 10366); - add_location(button0, file$4, 311, 0, 10921); - add_location(button1, file$4, 312, 0, 11014); - add_location(br1, file$4, 315, 0, 11156); - add_location(button2, file$4, 316, 0, 11162); - attr_dev(button3, "class", button3_class_value = "" + (null_to_empty(/*currentindexButtonClass*/ ctx[10]) + " svelte-cpjgti")); - button3.disabled = button3_disabled_value = /*currentuserIndex*/ ctx[0] <= 0; - add_location(button3, file$4, 317, 0, 11222); - attr_dev(button4, "class", button4_class_value = "" + (null_to_empty(/*previousindexButtonClass*/ ctx[11]) + " svelte-cpjgti")); - button4.disabled = button4_disabled_value = /*currentuserIndex*/ ctx[0] <= 0; - add_location(button4, file$4, 318, 0, 11377); - attr_dev(button5, "class", button5_class_value = "" + (null_to_empty(/*nextindexButtonClass*/ ctx[12]) + " svelte-cpjgti")); - button5.disabled = button5_disabled_value = /*currentuserIndex*/ ctx[0] >= /*userTimestamps*/ ctx[1].length - 1; - add_location(button5, file$4, 319, 0, 11522); - add_location(br2, file$4, 322, 0, 11745); - add_location(br3, file$4, 322, 82, 11827); - add_location(br4, file$4, 322, 192, 11937); - add_location(button6, file$4, 323, 0, 11943); - add_location(button7, file$4, 323, 63, 12006); - attr_dev(input2, "type", "file"); - attr_dev(input2, "accept", ".json"); - add_location(input2, file$4, 323, 167, 12110); + t2 = text("Minor Game Events Log for player ||| Position for Developer "); + t3 = text(t3_value); + t4 = space(); + t5 = text(t5_value); + t6 = space(); + + for (let i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].c(); + } + + t7 = space(); + if (if_block) if_block.c(); + t8 = space(); + create_component(movingdotstats.$$.fragment); + set_style(canvas_1, "width", "100%"); + set_style(canvas_1, "height", "100%"); + attr_dev(canvas_1, "tabindex", "0"); + add_location(canvas_1, file$6, 155, 4, 7397); + attr_dev(div0, "id", "overlayText"); + attr_dev(div0, "class", "svelte-c2nwl9"); + add_location(div0, file$6, 157, 4, 7655); + attr_dev(div1, "id", "game-container"); + attr_dev(div1, "style", /*spaceStyle*/ ctx[13]); + add_location(div1, file$6, 154, 0, 7311); }, 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, h1, anchor); - insert_dev(target, t1, anchor); - insert_dev(target, label, anchor); - append_dev(label, t2); - append_dev(label, input0); - set_input_value(input0, /*currentvideoId*/ ctx[2]); - append_dev(label, t3); - append_dev(label, input1); - input1.checked = /*isUpdating*/ ctx[6]; - insert_dev(target, t4, anchor); - insert_dev(target, div3, anchor); - append_dev(div3, div0); - append_dev(div3, t5); - append_dev(div3, div1); + insert_dev(target, div1, anchor); + append_dev(div1, canvas_1); + /*canvas_1_binding*/ ctx[14](canvas_1); + append_dev(div1, t0); + mount_component(movingdot, div1, null); + append_dev(div1, t1); + append_dev(div1, div0); + append_dev(div0, t2); + append_dev(div0, t3); + append_dev(div0, t4); + append_dev(div0, t5); append_dev(div1, t6); + + for (let i = 0; i < each_blocks.length; i += 1) { + if (each_blocks[i]) { + each_blocks[i].m(div1, null); + } + } + append_dev(div1, t7); - append_dev(div1, t8); - append_dev(div3, t9); - append_dev(div3, div2); - append_dev(div2, t10); - append_dev(div2, t11); - append_dev(div2, br0); - append_dev(div2, t12); - append_dev(div2, t13); - insert_dev(target, t14, anchor); - insert_dev(target, button0, anchor); - insert_dev(target, t18, anchor); - insert_dev(target, button1, anchor); - insert_dev(target, t22, anchor); - insert_dev(target, t23, anchor); - insert_dev(target, t24, anchor); - insert_dev(target, t25, anchor); - insert_dev(target, t26, anchor); - insert_dev(target, br1, anchor); - insert_dev(target, t27, anchor); - insert_dev(target, button2, anchor); - insert_dev(target, t29, anchor); - insert_dev(target, button3, anchor); - append_dev(button3, t30); - insert_dev(target, t31, anchor); - insert_dev(target, button4, anchor); - append_dev(button4, t32); - insert_dev(target, t33, anchor); - insert_dev(target, button5, anchor); - append_dev(button5, t34); - insert_dev(target, t35, anchor); - insert_dev(target, t36, anchor); - insert_dev(target, t37, anchor); - insert_dev(target, t38, anchor); - insert_dev(target, t39, anchor); - insert_dev(target, br2, anchor); - insert_dev(target, t40, anchor); - insert_dev(target, t41, anchor); - insert_dev(target, t42, anchor); - insert_dev(target, t43, anchor); - insert_dev(target, t44, anchor); - insert_dev(target, br3, anchor); - insert_dev(target, t45, anchor); - insert_dev(target, br4, anchor); - insert_dev(target, t46, anchor); - insert_dev(target, button6, anchor); - insert_dev(target, t48, anchor); - insert_dev(target, button7, anchor); - insert_dev(target, t50, anchor); - insert_dev(target, input2, anchor); + if (if_block) if_block.m(div1, null); + insert_dev(target, t8, anchor); + mount_component(movingdotstats, target, anchor); + current = true; if (!mounted) { - dispose = [ - listen_dev(input0, "input", /*input0_input_handler*/ ctx[24]), - listen_dev(input1, "change", /*input1_change_handler*/ ctx[25]), - listen_dev(input1, "click", /*toggleUpdate*/ ctx[14], false, false, false, false), - listen_dev(button0, "click", /*goToPreviousAutoTimestamp*/ ctx[16], false, false, false, false), - listen_dev(button1, "click", /*goToNextAutoTimestamp*/ ctx[15], false, false, false, false), - listen_dev(button2, "click", /*addUserTimestamp*/ ctx[17], false, false, false, false), - listen_dev(button3, "click", /*goToCurrentUserTimestamp*/ ctx[18], false, false, false, false), - listen_dev(button4, "click", /*goToPreviousUserTimestamp*/ ctx[20], false, false, false, false), - listen_dev(button5, "click", /*goToNextUserTimestamp*/ ctx[19], false, false, false, false), - listen_dev(button6, "click", /*exportTimestamps*/ ctx[21], false, false, false, false), - listen_dev(button7, "click", /*exportr2Timestamps*/ ctx[22], false, false, false, false), - listen_dev(input2, "change", /*importTimestamps*/ ctx[23], false, false, false, false) - ]; - + dispose = listen_dev(canvas_1, "click", /*handleSpaceClick*/ ctx[10], false, false, false, false); mounted = true; } }, - p: function update(ctx, dirty) { - if (dirty[0] & /*currentvideoId*/ 4 && input0.value !== /*currentvideoId*/ ctx[2]) { - set_input_value(input0, /*currentvideoId*/ ctx[2]); - } + p: function update(ctx, [dirty]) { + const movingdot_changes = {}; + if (dirty & /*$dotPosition*/ 1) movingdot_changes.position = /*$dotPosition*/ ctx[0]; + movingdot.$set(movingdot_changes); + if ((!current || dirty & /*$dotPosition*/ 1) && t3_value !== (t3_value = /*$dotPosition*/ ctx[0].x + "")) set_data_dev(t3, t3_value); + if ((!current || dirty & /*$dotPosition*/ 1) && t5_value !== (t5_value = /*$dotPosition*/ ctx[0].y + "")) set_data_dev(t5, t5_value); - if (dirty[0] & /*isUpdating*/ 64) { - input1.checked = /*isUpdating*/ ctx[6]; + if (dirty & /*$targets*/ 64) { + each_value = /*$targets*/ ctx[6]; + validate_each_argument(each_value); + group_outros(); + validate_each_keys(ctx, each_value, get_each_context$3, get_key); + each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div1, outro_and_destroy_block, create_each_block$3, t7, get_each_context$3); + check_outros(); } - if (dirty[0] & /*currentTime*/ 8 && t7_value !== (t7_value = /*currentTime*/ ctx[3].toFixed(2) + "")) set_data_dev(t7, t7_value); - if (dirty[0] & /*line*/ 32) set_data_dev(t10, /*line*/ ctx[5]); - if (dirty[0] & /*currentWord*/ 16) set_data_dev(t13, /*currentWord*/ ctx[4]); - if (dirty[0] & /*currentIndex*/ 128) set_data_dev(t23, /*currentIndex*/ ctx[7]); - if (dirty[0] & /*timestamps*/ 256 && t25_value !== (t25_value = /*timestamps*/ ctx[8].length + "")) set_data_dev(t25, t25_value); + if (/*isModalOpen*/ ctx[2]) { + if (if_block) { + if_block.p(ctx, dirty); - if (dirty[0] & /*currentindexButtonClass*/ 1024 && button3_class_value !== (button3_class_value = "" + (null_to_empty(/*currentindexButtonClass*/ ctx[10]) + " svelte-cpjgti"))) { - attr_dev(button3, "class", button3_class_value); - } + if (dirty & /*isModalOpen*/ 4) { + transition_in(if_block, 1); + } + } else { + if_block = create_if_block$3(ctx); + if_block.c(); + transition_in(if_block, 1); + if_block.m(div1, null); + } + } else if (if_block) { + group_outros(); - if (dirty[0] & /*currentuserIndex*/ 1 && button3_disabled_value !== (button3_disabled_value = /*currentuserIndex*/ ctx[0] <= 0)) { - prop_dev(button3, "disabled", button3_disabled_value); - } + transition_out(if_block, 1, 1, () => { + if_block = null; + }); - if (dirty[0] & /*previousindexButtonClass*/ 2048 && button4_class_value !== (button4_class_value = "" + (null_to_empty(/*previousindexButtonClass*/ ctx[11]) + " svelte-cpjgti"))) { - attr_dev(button4, "class", button4_class_value); + check_outros(); } + }, + i: function intro(local) { + if (current) return; + transition_in(movingdot.$$.fragment, local); - if (dirty[0] & /*currentuserIndex*/ 1 && button4_disabled_value !== (button4_disabled_value = /*currentuserIndex*/ ctx[0] <= 0)) { - prop_dev(button4, "disabled", button4_disabled_value); + for (let i = 0; i < each_value.length; i += 1) { + transition_in(each_blocks[i]); } - if (dirty[0] & /*nextindexButtonClass*/ 4096 && button5_class_value !== (button5_class_value = "" + (null_to_empty(/*nextindexButtonClass*/ ctx[12]) + " svelte-cpjgti"))) { - attr_dev(button5, "class", button5_class_value); - } + transition_in(if_block); + transition_in(movingdotstats.$$.fragment, local); + current = true; + }, + o: function outro(local) { + transition_out(movingdot.$$.fragment, local); - if (dirty[0] & /*currentuserIndex, userTimestamps*/ 3 && button5_disabled_value !== (button5_disabled_value = /*currentuserIndex*/ ctx[0] >= /*userTimestamps*/ ctx[1].length - 1)) { - prop_dev(button5, "disabled", button5_disabled_value); + for (let i = 0; i < each_blocks.length; i += 1) { + transition_out(each_blocks[i]); } - if (dirty[0] & /*currentuserIndex*/ 1) set_data_dev(t36, /*currentuserIndex*/ ctx[0]); - if (dirty[0] & /*userTimestamps*/ 2 && t38_value !== (t38_value = /*userTimestamps*/ ctx[1].length + "")) set_data_dev(t38, t38_value); - if (dirty[0] & /*currentuserIndex*/ 1) set_data_dev(t41, /*currentuserIndex*/ ctx[0]); - if (dirty[0] & /*r2userTimestamps*/ 512 && t43_value !== (t43_value = /*r2userTimestamps*/ ctx[9].length + "")) set_data_dev(t43, t43_value); + transition_out(if_block); + transition_out(movingdotstats.$$.fragment, local); + current = false; }, - i: noop, - o: noop, d: function destroy(detaching) { - if (detaching) detach_dev(h1); - if (detaching) detach_dev(t1); - if (detaching) detach_dev(label); - if (detaching) detach_dev(t4); - if (detaching) detach_dev(div3); - if (detaching) detach_dev(t14); - if (detaching) detach_dev(button0); - if (detaching) detach_dev(t18); - if (detaching) detach_dev(button1); - if (detaching) detach_dev(t22); - if (detaching) detach_dev(t23); - if (detaching) detach_dev(t24); - if (detaching) detach_dev(t25); - if (detaching) detach_dev(t26); - if (detaching) detach_dev(br1); - if (detaching) detach_dev(t27); - if (detaching) detach_dev(button2); - if (detaching) detach_dev(t29); - if (detaching) detach_dev(button3); - if (detaching) detach_dev(t31); - if (detaching) detach_dev(button4); - if (detaching) detach_dev(t33); - if (detaching) detach_dev(button5); - if (detaching) detach_dev(t35); - if (detaching) detach_dev(t36); - if (detaching) detach_dev(t37); - if (detaching) detach_dev(t38); - if (detaching) detach_dev(t39); - if (detaching) detach_dev(br2); - if (detaching) detach_dev(t40); - if (detaching) detach_dev(t41); - if (detaching) detach_dev(t42); - if (detaching) detach_dev(t43); - if (detaching) detach_dev(t44); - if (detaching) detach_dev(br3); - if (detaching) detach_dev(t45); - if (detaching) detach_dev(br4); - if (detaching) detach_dev(t46); - if (detaching) detach_dev(button6); - if (detaching) detach_dev(t48); - if (detaching) detach_dev(button7); - if (detaching) detach_dev(t50); - if (detaching) detach_dev(input2); + if (detaching) detach_dev(div1); + /*canvas_1_binding*/ ctx[14](null); + /*movingdot_binding*/ ctx[15](null); + destroy_component(movingdot); + + for (let i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].d(); + } + + if (if_block) if_block.d(); + if (detaching) detach_dev(t8); + destroy_component(movingdotstats, detaching); + mounted = false; + dispose(); + } + }; + + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_fragment$6.name, + type: "component", + source: "", + ctx + }); + + return block; + } + + function instance$6($$self, $$props, $$invalidate) { + let $dotPosition; + let $targets; + let { $$slots: slots = {}, $$scope } = $$props; + validate_slots('MovingDotSpacePortfromReact', slots, []); + let canvas; + let dotPosition = writable({ x: 900, y: 450 }); + validate_store(dotPosition, 'dotPosition'); + component_subscribe($$self, dotPosition, value => $$invalidate(0, $dotPosition = value)); + + let targets = writable([ + { + name: "Target 1", + x: 50, + y: 50, + collisionType: "alert", + collisiontext: "First Test" + }, + { + name: "Target 2", + x: 100, + y: 100, + collisionType: "", + collisiontext: "" + }, + { + name: "Entrance", + x: 995, + y: 660, + collisionType: "modal", + collisiontext: "You arrived what now?" + }, + // Add more targets as needed + { + name: "Market Stall", + x: 200, + y: 300, + collisionType: "", + collisiontext: "" + }, + { + name: "Inn Entrance", // A market stall in the bustling market area. + x: 400, + y: 450, + collisionType: "", + collisiontext: "" + }, + { + name: "Town Hall", // The entrance to the inn for rest or information. + x: 600, + y: 350, + collisionType: "", + collisiontext: "" + }, + { + name: "Fountain", // The entrance to the town hall for quests. + x: 500, + y: 500, + collisionType: "", + collisiontext: "" + }, + { + name: "Bridge", // A fountain in the town square as a meeting point. + x: 1100, + y: 700, + collisionType: "", + collisiontext: "" + }, + { + name: "Waterfall", // A bridge in the mystical forest area. + x: 1300, + y: 800, + collisionType: "", + collisiontext: "" + }, + { + name: "Mountain Peak", // A waterfall that could hide secrets or treasures. + x: 1500, + y: 100, + collisionType: "", + collisiontext: "" + } + ]); //{ name: "Mysterious Stranger", x: 350, y: 550, collisionType: "alert", collisiontext: "Beware the hidden caves in the north." }, + //{ name: "Hidden Cave", x: 1200, y: 400, collisionType: "changeBackgroundColor", color: "#0B3D91" }, + //{ name: "Ancient Tree", x: 300, y: 700, collisionType: "playSound", soundUrl: "tree_whisper.mp3" }, + //{ name: "Forgotten Monument", x: 700, y: 800, collisionType: "startAnimation", elementId: "monument", animationClass: "glow" }, + + validate_store(targets, 'targets'); + component_subscribe($$self, targets, value => $$invalidate(6, $targets = value)); + + //{ name: "Wizard's Tower", x: 950, y: 150, collisionType: "rotateDot" }, + //{ name: "Lakeside", x: 1400, y: 600, collisionType: "changeDotColor", color: "#00BFFF" }, + //{ name: "Dragon's Lair", x: 1600, y: 200, collisionType: "incrementScore", incrementValue: 50 }, + //{ name: "Abandoned Shipwreck", x: 1300, y: 500, collisionType: "shrinkDot" }, + let boundaries = { maxX: 1835, maxY: 890, minX: 0, minY: 0 }; + + let isModalOpen = false; + let currentcollisiontext; + let currentcollisionitems = []; + let movingDotElement; + + function handleSpaceClick() { + //console.log('Container clicked!', event); + movingDotElement.focusDot(); + } + + function handleModalClose() { + $$invalidate(2, isModalOpen = false); + movingDotElement.focusDot(); + } + + function updateDotPosition(newX, newY) { + dotPosition.set({ x: newX, y: newY }); + } + + // Collision check function + const checkCollision = dotPos => { + $targets.forEach(target => { + if (dotPos.x < target.x + 10 && dotPos.x + 10 > target.x && dotPos.y < target.y + 10 && dotPos.y + 10 > target.y) { + handleCollision(target); + } + }); + }; + + // Handle collision based on the target object + const handleCollision = target => { + switch (target.collisionType) { + case "": + console.log("Nothing Happenedddd"); + break; + case "alert": + alert(target.collisiontext); + break; + case "modal": + $$invalidate(2, isModalOpen = true); + health.update(h => h - 10 > 0 ? h - 10 : 0); + $$invalidate(3, currentcollisiontext = target.collisiontext); + $$invalidate(4, currentcollisionitems = [ + { + label: "Ask about the hidden cave", // Decreases health but never below 0 + action: "revealCaveLocation" + }, + { + label: "Inquire about the town's history", + action: "giveHistory" + }, + { + label: "Ignore and leave", + action: "closeModal" + } + ]); + break; + } // Handle other permanent UI elements here + }; // ... + //ChatGPT Suggested Options + // Change the background color of the canvas or a specific element. + // case "changeBackgroundColor": + + const spaceStyle = `position: relative; width: 100%; height: 100vh; border: 1px solid black; overflow: hidden; background-image: url('/AutoGameBackgrounds/1stGameLoc123.png'); background-size: cover; background-position: center;`; + const writable_props = []; + + Object.keys($$props).forEach(key => { + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$4.warn(` was created with unknown prop '${key}'`); + }); + + function canvas_1_binding($$value) { + binding_callbacks[$$value ? 'unshift' : 'push'](() => { + canvas = $$value; + $$invalidate(1, canvas); + }); + } + + function movingdot_binding($$value) { + binding_callbacks[$$value ? 'unshift' : 'push'](() => { + movingDotElement = $$value; + $$invalidate(5, movingDotElement); + }); + } + + const move_handler = e => updateDotPosition(e.detail.x, e.detail.y); + + $$self.$capture_state = () => ({ + onMount, + writable, + MovingDot: MovingDotPortfromReact, + Target: MovingDotTargetPortfromReact, + Modal: MovingDotSpaceSimpleModal, + MovingDotStats: MovingDotStatStoreandDisplay, + health, + canvas, + dotPosition, + targets, + boundaries, + isModalOpen, + currentcollisiontext, + currentcollisionitems, + movingDotElement, + handleSpaceClick, + handleModalClose, + updateDotPosition, + checkCollision, + handleCollision, + spaceStyle, + $dotPosition, + $targets + }); + + $$self.$inject_state = $$props => { + if ('canvas' in $$props) $$invalidate(1, canvas = $$props.canvas); + if ('dotPosition' in $$props) $$invalidate(7, dotPosition = $$props.dotPosition); + if ('targets' in $$props) $$invalidate(8, targets = $$props.targets); + if ('boundaries' in $$props) $$invalidate(9, boundaries = $$props.boundaries); + if ('isModalOpen' in $$props) $$invalidate(2, isModalOpen = $$props.isModalOpen); + if ('currentcollisiontext' in $$props) $$invalidate(3, currentcollisiontext = $$props.currentcollisiontext); + if ('currentcollisionitems' in $$props) $$invalidate(4, currentcollisionitems = $$props.currentcollisionitems); + if ('movingDotElement' in $$props) $$invalidate(5, movingDotElement = $$props.movingDotElement); + }; + + if ($$props && "$$inject" in $$props) { + $$self.$inject_state($$props.$$inject); + } + + $$self.$$.update = () => { + if ($$self.$$.dirty & /*$dotPosition*/ 1) { + // document.body.style.backgroundColor = target.color; + // break; + // Play a sound effect. You'll need to pre-load these sounds. + // case "playSound": + // new Audio(target.soundUrl).play(); + // break; + // Redirect the user to a different URL. + // case "redirect": + // window.location.href = target.url; + // break; + // Increase the size of the dot. + // case "enlargeDot": + // dotElement.style.transform = "scale(1.5)"; + // break; + // Decrease the size of the dot. + // case "shrinkDot": + // dotElement.style.transform = "scale(0.5)"; + // break; + // Apply a rotation to the dot. + // case "rotateDot": + // dotElement.style.transform = "rotate(45deg)"; + // break; + // Toggle the visibility of a specific element on the page. + // case "toggleVisibility": + // let elem = document.getElementById(target.elementId); + // elem.style.display = elem.style.display === 'none' ? 'block' : 'none'; + // break; + // Trigger a CSS animation on a specific element. + // case "startAnimation": + // let animElem = document.getElementById(target.elementId); + // animElem.classList.add(target.animationClass); + // break; + // Increase a score or counter displayed on the screen. + // case "incrementScore": + // score += target.incrementValue; + // updateScoreDisplay(); // Assuming you have a function to update the score display + // break; + // Change the color of the dot. + // case "changeDotColor": + // dotElement.style.backgroundColor = target.color; + // break; + // Reactive statement to check collision whenever dotPosition changes + $dotPosition && checkCollision($dotPosition); + } + }; + + return [ + $dotPosition, + canvas, + isModalOpen, + currentcollisiontext, + currentcollisionitems, + movingDotElement, + $targets, + dotPosition, + targets, + boundaries, + handleSpaceClick, + handleModalClose, + updateDotPosition, + spaceStyle, + canvas_1_binding, + movingdot_binding, + move_handler + ]; + } + + class MovingDotSpacePortfromReact extends SvelteComponentDev { + constructor(options) { + super(options); + init(this, options, instance$6, create_fragment$6, safe_not_equal, {}); + + dispatch_dev("SvelteRegisterComponent", { + component: this, + tagName: "MovingDotSpacePortfromReact", + options, + id: create_fragment$6.name + }); + } + } + + /* src\YoutubeIframeAPICustomInterface.svelte generated by Svelte v3.59.2 */ + + const { console: console_1$3 } = globals; + const file$5 = "src\\YoutubeIframeAPICustomInterface.svelte"; + + function create_fragment$5(ctx) { + let h1; + let t1; + let label; + let t2; + let input0; + let t3; + let input1; + let t4; + let div3; + let div0; + let t5; + let div1; + let t6; + let t7_value = /*currentTime*/ ctx[3].toFixed(2) + ""; + let t7; + let t8; + let t9; + let div2; + let t10; + let t11; + let br0; + let t12; + let t13; + let t14; + let button0; + let t18; + let button1; + let t22; + let t23; + let t24; + let t25_value = /*timestamps*/ ctx[8].length + ""; + let t25; + let t26; + let br1; + let t27; + let button2; + let t29; + let button3; + let t30; + let button3_class_value; + let button3_disabled_value; + let t31; + let button4; + let t32; + let button4_class_value; + let button4_disabled_value; + let t33; + let button5; + let t34; + let button5_class_value; + let button5_disabled_value; + let t35; + let t36; + let t37; + let t38_value = /*userTimestamps*/ ctx[1].length + ""; + let t38; + let t39; + let br2; + let t40; + let t41; + let t42; + let t43_value = /*r2userTimestamps*/ ctx[9].length + ""; + let t43; + let t44; + let br3; + let t45; + let br4; + let t46; + let button6; + let t48; + let button7; + let t50; + let input2; + let mounted; + let dispose; + + const block = { + c: function create() { + h1 = element("h1"); + h1.textContent = "Custom Youtube Player for learning Video and music"; + t1 = space(); + label = element("label"); + t2 = text("Current Video Id (mwO6v4BlgZQ | IVJkOHTBPn0 ) (test - qEpmiA3XkX8 hardcoded)\r\n "); + input0 = element("input"); + t3 = text("\r\n Start/Stop Word Update (Dummy Transcript for now)\r\n "); + input1 = element("input"); + t4 = space(); + div3 = element("div"); + div0 = element("div"); + t5 = space(); + div1 = element("div"); + t6 = text("Current Time: "); + t7 = text(t7_value); + t8 = text(" seconds"); + t9 = space(); + div2 = element("div"); + t10 = text(/*line*/ ctx[5]); + t11 = space(); + br0 = element("br"); + t12 = space(); + t13 = text(/*currentWord*/ ctx[4]); + t14 = space(); + button0 = element("button"); + button0.textContent = `Previous Auto Timestamp - ${/*interval*/ ctx[13]}s`; + t18 = space(); + button1 = element("button"); + button1.textContent = `Next Auto Timestamp - ${/*interval*/ ctx[13]}s`; + t22 = text("\r\nAuto Timestamps: "); + t23 = text(/*currentIndex*/ ctx[7]); + t24 = text(" / "); + t25 = text(t25_value); + t26 = space(); + br1 = element("br"); + t27 = space(); + button2 = element("button"); + button2.textContent = "Add Timestamp"; + t29 = space(); + button3 = element("button"); + t30 = text("Current User Timestamp (incomplete)"); + t31 = space(); + button4 = element("button"); + t32 = text("Previous User Timestamp"); + t33 = space(); + button5 = element("button"); + t34 = text("Next User Timestamp"); + t35 = text("\r\nUser Timestamps: "); + t36 = text(/*currentuserIndex*/ ctx[0]); + t37 = text(" / "); + t38 = text(t38_value); + t39 = space(); + br2 = element("br"); + t40 = text(" Round 2 (/n) User Timestamps: "); + t41 = text(/*currentuserIndex*/ ctx[0]); + t42 = text(" / "); + t43 = text(t43_value); + t44 = space(); + br3 = element("br"); + t45 = text("A list of one messes up the logic for the counter in conjuction with the user timestamp button reactivity "); + br4 = element("br"); + t46 = space(); + button6 = element("button"); + button6.textContent = "Export Timestamps"; + t48 = space(); + button7 = element("button"); + button7.textContent = "Export Round 2 Timestamps"; + t50 = text(" Import Timestamps (Incomplete) "); + input2 = element("input"); + add_location(h1, file$5, 286, 0, 9769); + attr_dev(input0, "type", "text"); + add_location(input0, file$5, 290, 4, 9927); + attr_dev(input1, "type", "checkbox"); + add_location(input1, file$5, 292, 4, 10035); + add_location(label, file$5, 288, 0, 9832); + attr_dev(div0, "id", "youtube-player"); + set_style(div0, "height", "90vh"); + set_style(div0, "width", "90%"); + add_location(div0, file$5, 300, 4, 10405); + set_style(div1, "position", "absolute"); + set_style(div1, "top", "0%"); + set_style(div1, "left", "40%"); + set_style(div1, "color", "white"); + set_style(div1, "background-color", "rgba(0, 0, 0, 0.5)"); + add_location(div1, file$5, 301, 4, 10475); + add_location(br0, file$5, 305, 15, 10795); + set_style(div2, "position", "absolute"); + set_style(div2, "top", "50%"); + set_style(div2, "left", "20%"); + set_style(div2, "color", "white"); + set_style(div2, "background-color", "rgba(0, 0, 0, 0.5)"); + set_style(div2, "font-size", "100px"); + add_location(div2, file$5, 304, 4, 10654); + set_style(div3, "position", "relative"); + add_location(div3, file$5, 299, 0, 10366); + add_location(button0, file$5, 311, 0, 10921); + add_location(button1, file$5, 312, 0, 11014); + add_location(br1, file$5, 315, 0, 11156); + add_location(button2, file$5, 316, 0, 11162); + attr_dev(button3, "class", button3_class_value = "" + (null_to_empty(/*currentindexButtonClass*/ ctx[10]) + " svelte-cpjgti")); + button3.disabled = button3_disabled_value = /*currentuserIndex*/ ctx[0] <= 0; + add_location(button3, file$5, 317, 0, 11222); + attr_dev(button4, "class", button4_class_value = "" + (null_to_empty(/*previousindexButtonClass*/ ctx[11]) + " svelte-cpjgti")); + button4.disabled = button4_disabled_value = /*currentuserIndex*/ ctx[0] <= 0; + add_location(button4, file$5, 318, 0, 11377); + attr_dev(button5, "class", button5_class_value = "" + (null_to_empty(/*nextindexButtonClass*/ ctx[12]) + " svelte-cpjgti")); + button5.disabled = button5_disabled_value = /*currentuserIndex*/ ctx[0] >= /*userTimestamps*/ ctx[1].length - 1; + add_location(button5, file$5, 319, 0, 11522); + add_location(br2, file$5, 322, 0, 11745); + add_location(br3, file$5, 322, 82, 11827); + add_location(br4, file$5, 322, 192, 11937); + add_location(button6, file$5, 323, 0, 11943); + add_location(button7, file$5, 323, 63, 12006); + attr_dev(input2, "type", "file"); + attr_dev(input2, "accept", ".json"); + add_location(input2, file$5, 323, 167, 12110); + }, + 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, h1, anchor); + insert_dev(target, t1, anchor); + insert_dev(target, label, anchor); + append_dev(label, t2); + append_dev(label, input0); + set_input_value(input0, /*currentvideoId*/ ctx[2]); + append_dev(label, t3); + append_dev(label, input1); + input1.checked = /*isUpdating*/ ctx[6]; + insert_dev(target, t4, anchor); + insert_dev(target, div3, anchor); + append_dev(div3, div0); + append_dev(div3, t5); + append_dev(div3, div1); + append_dev(div1, t6); + append_dev(div1, t7); + append_dev(div1, t8); + append_dev(div3, t9); + append_dev(div3, div2); + append_dev(div2, t10); + append_dev(div2, t11); + append_dev(div2, br0); + append_dev(div2, t12); + append_dev(div2, t13); + insert_dev(target, t14, anchor); + insert_dev(target, button0, anchor); + insert_dev(target, t18, anchor); + insert_dev(target, button1, anchor); + insert_dev(target, t22, anchor); + insert_dev(target, t23, anchor); + insert_dev(target, t24, anchor); + insert_dev(target, t25, anchor); + insert_dev(target, t26, anchor); + insert_dev(target, br1, anchor); + insert_dev(target, t27, anchor); + insert_dev(target, button2, anchor); + insert_dev(target, t29, anchor); + insert_dev(target, button3, anchor); + append_dev(button3, t30); + insert_dev(target, t31, anchor); + insert_dev(target, button4, anchor); + append_dev(button4, t32); + insert_dev(target, t33, anchor); + insert_dev(target, button5, anchor); + append_dev(button5, t34); + insert_dev(target, t35, anchor); + insert_dev(target, t36, anchor); + insert_dev(target, t37, anchor); + insert_dev(target, t38, anchor); + insert_dev(target, t39, anchor); + insert_dev(target, br2, anchor); + insert_dev(target, t40, anchor); + insert_dev(target, t41, anchor); + insert_dev(target, t42, anchor); + insert_dev(target, t43, anchor); + insert_dev(target, t44, anchor); + insert_dev(target, br3, anchor); + insert_dev(target, t45, anchor); + insert_dev(target, br4, anchor); + insert_dev(target, t46, anchor); + insert_dev(target, button6, anchor); + insert_dev(target, t48, anchor); + insert_dev(target, button7, anchor); + insert_dev(target, t50, anchor); + insert_dev(target, input2, anchor); + + if (!mounted) { + dispose = [ + listen_dev(input0, "input", /*input0_input_handler*/ ctx[24]), + listen_dev(input1, "change", /*input1_change_handler*/ ctx[25]), + listen_dev(input1, "click", /*toggleUpdate*/ ctx[14], false, false, false, false), + listen_dev(button0, "click", /*goToPreviousAutoTimestamp*/ ctx[16], false, false, false, false), + listen_dev(button1, "click", /*goToNextAutoTimestamp*/ ctx[15], false, false, false, false), + listen_dev(button2, "click", /*addUserTimestamp*/ ctx[17], false, false, false, false), + listen_dev(button3, "click", /*goToCurrentUserTimestamp*/ ctx[18], false, false, false, false), + listen_dev(button4, "click", /*goToPreviousUserTimestamp*/ ctx[20], false, false, false, false), + listen_dev(button5, "click", /*goToNextUserTimestamp*/ ctx[19], false, false, false, false), + listen_dev(button6, "click", /*exportTimestamps*/ ctx[21], false, false, false, false), + listen_dev(button7, "click", /*exportr2Timestamps*/ ctx[22], false, false, false, false), + listen_dev(input2, "change", /*importTimestamps*/ ctx[23], false, false, false, false) + ]; + + mounted = true; + } + }, + p: function update(ctx, dirty) { + if (dirty[0] & /*currentvideoId*/ 4 && input0.value !== /*currentvideoId*/ ctx[2]) { + set_input_value(input0, /*currentvideoId*/ ctx[2]); + } + + if (dirty[0] & /*isUpdating*/ 64) { + input1.checked = /*isUpdating*/ ctx[6]; + } + + if (dirty[0] & /*currentTime*/ 8 && t7_value !== (t7_value = /*currentTime*/ ctx[3].toFixed(2) + "")) set_data_dev(t7, t7_value); + if (dirty[0] & /*line*/ 32) set_data_dev(t10, /*line*/ ctx[5]); + if (dirty[0] & /*currentWord*/ 16) set_data_dev(t13, /*currentWord*/ ctx[4]); + if (dirty[0] & /*currentIndex*/ 128) set_data_dev(t23, /*currentIndex*/ ctx[7]); + if (dirty[0] & /*timestamps*/ 256 && t25_value !== (t25_value = /*timestamps*/ ctx[8].length + "")) set_data_dev(t25, t25_value); + + if (dirty[0] & /*currentindexButtonClass*/ 1024 && button3_class_value !== (button3_class_value = "" + (null_to_empty(/*currentindexButtonClass*/ ctx[10]) + " svelte-cpjgti"))) { + attr_dev(button3, "class", button3_class_value); + } + + if (dirty[0] & /*currentuserIndex*/ 1 && button3_disabled_value !== (button3_disabled_value = /*currentuserIndex*/ ctx[0] <= 0)) { + prop_dev(button3, "disabled", button3_disabled_value); + } + + if (dirty[0] & /*previousindexButtonClass*/ 2048 && button4_class_value !== (button4_class_value = "" + (null_to_empty(/*previousindexButtonClass*/ ctx[11]) + " svelte-cpjgti"))) { + attr_dev(button4, "class", button4_class_value); + } + + if (dirty[0] & /*currentuserIndex*/ 1 && button4_disabled_value !== (button4_disabled_value = /*currentuserIndex*/ ctx[0] <= 0)) { + prop_dev(button4, "disabled", button4_disabled_value); + } + + if (dirty[0] & /*nextindexButtonClass*/ 4096 && button5_class_value !== (button5_class_value = "" + (null_to_empty(/*nextindexButtonClass*/ ctx[12]) + " svelte-cpjgti"))) { + attr_dev(button5, "class", button5_class_value); + } + + if (dirty[0] & /*currentuserIndex, userTimestamps*/ 3 && button5_disabled_value !== (button5_disabled_value = /*currentuserIndex*/ ctx[0] >= /*userTimestamps*/ ctx[1].length - 1)) { + prop_dev(button5, "disabled", button5_disabled_value); + } + + if (dirty[0] & /*currentuserIndex*/ 1) set_data_dev(t36, /*currentuserIndex*/ ctx[0]); + if (dirty[0] & /*userTimestamps*/ 2 && t38_value !== (t38_value = /*userTimestamps*/ ctx[1].length + "")) set_data_dev(t38, t38_value); + if (dirty[0] & /*currentuserIndex*/ 1) set_data_dev(t41, /*currentuserIndex*/ ctx[0]); + if (dirty[0] & /*r2userTimestamps*/ 512 && t43_value !== (t43_value = /*r2userTimestamps*/ ctx[9].length + "")) set_data_dev(t43, t43_value); + }, + i: noop, + o: noop, + d: function destroy(detaching) { + if (detaching) detach_dev(h1); + if (detaching) detach_dev(t1); + if (detaching) detach_dev(label); + if (detaching) detach_dev(t4); + if (detaching) detach_dev(div3); + if (detaching) detach_dev(t14); + if (detaching) detach_dev(button0); + if (detaching) detach_dev(t18); + if (detaching) detach_dev(button1); + if (detaching) detach_dev(t22); + if (detaching) detach_dev(t23); + if (detaching) detach_dev(t24); + if (detaching) detach_dev(t25); + if (detaching) detach_dev(t26); + if (detaching) detach_dev(br1); + if (detaching) detach_dev(t27); + if (detaching) detach_dev(button2); + if (detaching) detach_dev(t29); + if (detaching) detach_dev(button3); + if (detaching) detach_dev(t31); + if (detaching) detach_dev(button4); + if (detaching) detach_dev(t33); + if (detaching) detach_dev(button5); + if (detaching) detach_dev(t35); + if (detaching) detach_dev(t36); + if (detaching) detach_dev(t37); + if (detaching) detach_dev(t38); + if (detaching) detach_dev(t39); + if (detaching) detach_dev(br2); + if (detaching) detach_dev(t40); + if (detaching) detach_dev(t41); + if (detaching) detach_dev(t42); + if (detaching) detach_dev(t43); + if (detaching) detach_dev(t44); + if (detaching) detach_dev(br3); + if (detaching) detach_dev(t45); + if (detaching) detach_dev(br4); + if (detaching) detach_dev(t46); + if (detaching) detach_dev(button6); + if (detaching) detach_dev(t48); + if (detaching) detach_dev(button7); + if (detaching) detach_dev(t50); + if (detaching) detach_dev(input2); + mounted = false; + run_all(dispose); + } + }; + + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_fragment$5.name, + type: "component", + source: "", + ctx + }); + + return block; + } + + function getRandomWord(line) { + let words = line.split(" "); + return words[Math.floor(Math.random() * words.length)]; + } + + function instance$5($$self, $$props, $$invalidate) { + let nextindexButtonClass; + let previousindexButtonClass; + let currentindexButtonClass; + let { $$slots: slots = {}, $$scope } = $$props; + validate_slots('YoutubeIframeAPICustomInterface', slots, []); + let player; + let interval = 20; // Define your interval + let currentTime = 0; + let timeUpdateInterval; + + // Assuming 'transcript' contains your video transcript + let transcript = `Line 1 of the transcript. + Line 2 of the transcript. + Line 3 food + Line 4 foodest + Line 5 foods + Line 6 fooder + Line 7 foodz + Line 8 fooding + ...`; // Replace with your actual transcript + + let lines = transcript.split("\n"); + let currentWord = ""; + let line = ""; + let isUpdating = false; + let updateInterval; + let currentIndex = 0; // Assuming this is initialized appropriately + let currentuserIndex = 0; // Assuming this is initialized appropriately + let timestamps = []; // Array of timestamps + let userTimestamps = []; // Array of user timestamps + let r2userTimestamps = []; // Array of user timestamps + let currentvideoId = 'qEpmiA3XkX8'; + let youTubeApiLoaded = false; + let currentvideoduration; + let regeneratedautotimestamps = false; + + window.onYouTubeIframeAPIReady = function () { + youTubeApiLoaded = true; + initYouTubePlayer(); + }; + + // Function to initialize the YouTube player + function initYouTubePlayer() { + if (!youTubeApiLoaded) { + console.error("YouTube API is not ready yet."); + return; + } + + regeneratedautotimestamps = false; + + // Clear existing interval + clearInterval(timeUpdateInterval); + + // Reinitialize player with new video ID + if (player) { + player.loadVideoById(currentvideoId); + } else { + player = new YT.Player('youtube-player', + { + height: '360', + width: '640', + videoId: currentvideoId, + events: { + 'onReady': onPlayerReady, + 'onStateChange': onPlayerStateChange + } + }); + } + + // Reset and start the interval to update current time + timeUpdateInterval = setInterval(updateCurrentTime, 1000); + } + + onMount(() => { + // Load the YouTube IFrame Player API + const tag = document.createElement('script'); + + tag.src = "https://www.youtube.com/iframe_api"; + const firstScriptTag = document.getElementsByTagName('script')[0]; + firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); + + // Update the current time every second + timeUpdateInterval = setInterval(updateCurrentTime, 1000); + }); + + function autogeneratedtimestamps() { + currentvideoduration = player.getDuration(); + + //console.log("Video Duration: ", currentvideoduration); + const generatedTimestamps = []; + + for (let i = interval; i < currentvideoduration; i += interval) { + generatedTimestamps.push(i); + } + + $$invalidate(8, timestamps = generatedTimestamps); + + // Do something with the timestamps + //console.log("Generated Timestamps: ", generatedTimestamps); + regeneratedautotimestamps = true; + } + + // Event handler for when the player is ready + function onPlayerReady(event) { + autogeneratedtimestamps(); + } + + function onPlayerStateChange(event) { + if (event.data === YT.PlayerState.PLAYING || event.data === YT.PlayerState.PAUSED) { + updateCurrentIndex(); + } + + // Check if the video has just started playing + if (event.data === YT.PlayerState.PLAYING && !regeneratedautotimestamps) { + autogeneratedtimestamps(); + } + } + + function updateCurrentIndex() { + const currentTime = player.getCurrentTime(); + + // Find the closest timestamp + let closest = timestamps.reduce((prev, curr) => Math.abs(curr - currentTime) < Math.abs(prev - currentTime) + ? curr + : prev); + + $$invalidate(7, currentIndex = timestamps.indexOf(closest)); + } + + function updateCurrentTime() { + if (player && player.getCurrentTime) { + $$invalidate(3, currentTime = player.getCurrentTime()); + } + } + + onDestroy(() => { + clearInterval(timeUpdateInterval); + }); + + function updateWord() { + if (isUpdating) { + $$invalidate(5, line = lines[Math.floor(Math.random() * lines.length)]); + $$invalidate(4, currentWord = getRandomWord(line)); + } + } + + function toggleUpdate() { + $$invalidate(6, isUpdating = !isUpdating); + + if (isUpdating) { + updateWord(); // Immediately update once + updateInterval = setInterval(updateWord, 3000); // Update every 3 seconds + } else { + clearInterval(updateInterval); + $$invalidate(5, line = ''); + $$invalidate(4, currentWord = ''); + } + } + + function goToNextAutoTimestamp() { + if (currentIndex < timestamps.length - 1) { + $$invalidate(7, currentIndex += 1); + player.seekTo(timestamps[currentIndex], true); + } + } + + function goToPreviousAutoTimestamp() { + if (currentIndex > 0) { + $$invalidate(7, currentIndex -= 1); + player.seekTo(timestamps[currentIndex], true); + } + } + + function addUserTimestamp() { + const currentTime = Math.floor(player.getCurrentTime()); + $$invalidate(1, userTimestamps = [...userTimestamps, currentTime].sort((a, b) => a - b)); + } + + function addr2UserTimestamp() { + const currentTime = Math.floor(player.getCurrentTime()); + $$invalidate(9, r2userTimestamps = [...r2userTimestamps, currentTime].sort((a, b) => a - b)); + } + + function goToCurrentUserTimestamp() { + if (currentuserIndex === 0 && currentIndex < 0) { + player.seekTo(userTimestamps[currentIndex], true); + } else if (currentuserIndex < 0) { + player.seekTo(userTimestamps[currentuserIndex], true); + } else { + // Handle the end of the list here + console.log("No selected user timestamp."); + } // You can also disable the "next" button or loop to the start if needed. + } + + function goToNextUserTimestamp() { + if (currentuserIndex < userTimestamps.length - 1) { + $$invalidate(0, currentuserIndex += 1); + player.seekTo(userTimestamps[currentuserIndex], true); + } else { + // Handle the end of the list here + console.log("Reached the end of user timestamps."); + } // You can also disable the "next" button or loop to the start if needed. + } + + function goToPreviousUserTimestamp() { + if (currentuserIndex > 0) { + $$invalidate(0, currentuserIndex -= 1); + player.seekTo(userTimestamps[currentuserIndex], true); + } else { + // Handle the beginning of the list here + console.log("Reached the start of user timestamps."); + } // You can also disable the "previous" button or loop to the end if needed. + } + + function exportTimestamps() { + const data = JSON.stringify({ + currentvideoId, + timestamps: userTimestamps + }); + + const blob = new Blob([data], { type: 'application/json' }); + const url = URL.createObjectURL(blob); + const a = document.createElement('a'); + a.style.display = 'none'; + const filename = `${currentvideoId}_timestamps.json`; + a.href = url; + a.download = filename; + document.body.appendChild(a); + a.click(); + window.URL.revokeObjectURL(url); + } + + function exportr2Timestamps() { + const data = JSON.stringify({ + currentvideoId, + timestamps: r2userTimestamps + }); + + const blob = new Blob([data], { type: 'application/json' }); + const url = URL.createObjectURL(blob); + const a = document.createElement('a'); + a.style.display = 'none'; + const filename = `${currentvideoId}_round2timestamps.json`; + a.href = url; + a.download = filename; + document.body.appendChild(a); + a.click(); + window.URL.revokeObjectURL(url); + } + + function importTimestamps(event) { + // Check if the file input is not empty + const file = event.target.files[0]; + + if (!event.target.files || event.target.files.length === 0) { + alert('No file selected.'); + return; + } + + // Check if the file is a Blob (File objects inherit from Blob) + if (!(file instanceof Blob)) { + alert('Selected item is not a file.'); + return; + } + + const reader = new FileReader(); + + reader.onload = e => { + try { + const data = JSON.parse(e.target.result); + + if (!Array.isArray(data.timestamps)) { + alert('Invalid file structure: timestamps should be an array.'); + return; + } + + $$invalidate(2, currentvideoId = data.currentvideoId || ''); + $$invalidate(1, userTimestamps = data.timestamps); + } catch(error) { + alert('An error occurred while importing timestamps.'); //regeneratedautotimestamps = false; = true + } + }; + + reader.readAsText(file); + } + + const writable_props = []; + + Object.keys($$props).forEach(key => { + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$3.warn(` was created with unknown prop '${key}'`); + }); + + function input0_input_handler() { + currentvideoId = this.value; + $$invalidate(2, currentvideoId); + } + + function input1_change_handler() { + isUpdating = this.checked; + $$invalidate(6, isUpdating); + } + + $$self.$capture_state = () => ({ + onMount, + onDestroy, + player, + interval, + currentTime, + timeUpdateInterval, + transcript, + lines, + currentWord, + line, + isUpdating, + updateInterval, + currentIndex, + currentuserIndex, + timestamps, + userTimestamps, + r2userTimestamps, + currentvideoId, + youTubeApiLoaded, + currentvideoduration, + regeneratedautotimestamps, + initYouTubePlayer, + autogeneratedtimestamps, + onPlayerReady, + onPlayerStateChange, + updateCurrentIndex, + updateCurrentTime, + getRandomWord, + updateWord, + toggleUpdate, + goToNextAutoTimestamp, + goToPreviousAutoTimestamp, + addUserTimestamp, + addr2UserTimestamp, + goToCurrentUserTimestamp, + goToNextUserTimestamp, + goToPreviousUserTimestamp, + exportTimestamps, + exportr2Timestamps, + importTimestamps, + currentindexButtonClass, + previousindexButtonClass, + nextindexButtonClass + }); + + $$self.$inject_state = $$props => { + if ('player' in $$props) player = $$props.player; + if ('interval' in $$props) $$invalidate(13, interval = $$props.interval); + if ('currentTime' in $$props) $$invalidate(3, currentTime = $$props.currentTime); + if ('timeUpdateInterval' in $$props) timeUpdateInterval = $$props.timeUpdateInterval; + if ('transcript' in $$props) transcript = $$props.transcript; + if ('lines' in $$props) lines = $$props.lines; + if ('currentWord' in $$props) $$invalidate(4, currentWord = $$props.currentWord); + if ('line' in $$props) $$invalidate(5, line = $$props.line); + if ('isUpdating' in $$props) $$invalidate(6, isUpdating = $$props.isUpdating); + if ('updateInterval' in $$props) updateInterval = $$props.updateInterval; + if ('currentIndex' in $$props) $$invalidate(7, currentIndex = $$props.currentIndex); + if ('currentuserIndex' in $$props) $$invalidate(0, currentuserIndex = $$props.currentuserIndex); + if ('timestamps' in $$props) $$invalidate(8, timestamps = $$props.timestamps); + if ('userTimestamps' in $$props) $$invalidate(1, userTimestamps = $$props.userTimestamps); + if ('r2userTimestamps' in $$props) $$invalidate(9, r2userTimestamps = $$props.r2userTimestamps); + if ('currentvideoId' in $$props) $$invalidate(2, currentvideoId = $$props.currentvideoId); + if ('youTubeApiLoaded' in $$props) youTubeApiLoaded = $$props.youTubeApiLoaded; + if ('currentvideoduration' in $$props) currentvideoduration = $$props.currentvideoduration; + if ('regeneratedautotimestamps' in $$props) regeneratedautotimestamps = $$props.regeneratedautotimestamps; + if ('currentindexButtonClass' in $$props) $$invalidate(10, currentindexButtonClass = $$props.currentindexButtonClass); + if ('previousindexButtonClass' in $$props) $$invalidate(11, previousindexButtonClass = $$props.previousindexButtonClass); + if ('nextindexButtonClass' in $$props) $$invalidate(12, nextindexButtonClass = $$props.nextindexButtonClass); + }; + + if ($$props && "$$inject" in $$props) { + $$self.$inject_state($$props.$$inject); + } + + $$self.$$.update = () => { + if ($$self.$$.dirty[0] & /*currentvideoId*/ 4) { + if (currentvideoId) { + initYouTubePlayer(); + } + } + + if ($$self.$$.dirty[0] & /*currentuserIndex, userTimestamps*/ 3) { + $$invalidate(12, nextindexButtonClass = currentuserIndex >= userTimestamps.length - 1 + ? 'button-at-end' + : 'button'); + } + + if ($$self.$$.dirty[0] & /*currentuserIndex*/ 1) { + $$invalidate(11, previousindexButtonClass = currentuserIndex <= 0 ? 'button-at-end' : 'button'); + } + + if ($$self.$$.dirty[0] & /*currentuserIndex*/ 1) { + $$invalidate(10, currentindexButtonClass = currentuserIndex <= 0 ? 'button-at-end' : 'button'); + } + }; + + return [ + currentuserIndex, + userTimestamps, + currentvideoId, + currentTime, + currentWord, + line, + isUpdating, + currentIndex, + timestamps, + r2userTimestamps, + currentindexButtonClass, + previousindexButtonClass, + nextindexButtonClass, + interval, + toggleUpdate, + goToNextAutoTimestamp, + goToPreviousAutoTimestamp, + addUserTimestamp, + goToCurrentUserTimestamp, + goToNextUserTimestamp, + goToPreviousUserTimestamp, + exportTimestamps, + exportr2Timestamps, + importTimestamps, + input0_input_handler, + input1_change_handler + ]; + } + + class YoutubeIframeAPICustomInterface extends SvelteComponentDev { + constructor(options) { + super(options); + init(this, options, instance$5, create_fragment$5, safe_not_equal, {}, null, [-1, -1]); + + dispatch_dev("SvelteRegisterComponent", { + component: this, + tagName: "YoutubeIframeAPICustomInterface", + options, + id: create_fragment$5.name + }); + } + } + + // Unique ID creation requires a high quality random # generator. In the browser we therefore + // require the crypto API and do not support built-in fallback to lower quality random number + // generators (like Math.random()). + let getRandomValues; + const rnds8 = new Uint8Array(16); + function rng() { + // lazy load so that environments that need to polyfill have a chance to do so + if (!getRandomValues) { + // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. + getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto); + + if (!getRandomValues) { + throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported'); + } + } + + return getRandomValues(rnds8); + } + + /** + * Convert array of 16 byte values to UUID string format of the form: + * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX + */ + + const byteToHex = []; + + for (let i = 0; i < 256; ++i) { + byteToHex.push((i + 0x100).toString(16).slice(1)); + } + + function unsafeStringify(arr, offset = 0) { + // Note: Be careful editing this code! It's been tuned for performance + // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434 + return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]; + } + + const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto); + var native = { + randomUUID + }; + + function v4(options, buf, offset) { + if (native.randomUUID && !buf && !options) { + return native.randomUUID(); + } + + options = options || {}; + const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved` + + rnds[6] = rnds[6] & 0x0f | 0x40; + rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided + + if (buf) { + offset = offset || 0; + + for (let i = 0; i < 16; ++i) { + buf[offset + i] = rnds[i]; + } + + return buf; + } + + return unsafeStringify(rnds); + } + + /* src\RecursiveNestedCommentsElement.svelte generated by Svelte v3.59.2 */ + + const { console: console_1$2 } = globals; + const file$4 = "src\\RecursiveNestedCommentsElement.svelte"; + + function get_each_context$2(ctx, list, i) { + const child_ctx = ctx.slice(); + child_ctx[14] = list[i]; + child_ctx[15] = list; + child_ctx[16] = i; + return child_ctx; + } + + // (123:16) {#if showReplyInput[comment.id]} + function create_if_block$2(ctx) { + let div; + let input; + let t0; + let button; + let mounted; + let dispose; + + function input_input_handler() { + /*input_input_handler*/ ctx[11].call(input, /*comment*/ ctx[14]); + } + + function click_handler_1() { + return /*click_handler_1*/ ctx[12](/*comment*/ ctx[14]); + } + + const block = { + c: function create() { + div = element("div"); + input = element("input"); + t0 = space(); + button = element("button"); + button.textContent = "Post Reply"; + attr_dev(input, "placeholder", "Write a reply..."); + add_location(input, file$4, 124, 24, 4690); + add_location(button, file$4, 125, 24, 4791); + attr_dev(div, "class", "reply-input"); + add_location(div, file$4, 123, 20, 4639); + }, + m: function mount(target, anchor) { + insert_dev(target, div, anchor); + append_dev(div, input); + set_input_value(input, /*replyText*/ ctx[2][/*comment*/ ctx[14].id]); + append_dev(div, t0); + append_dev(div, button); + + if (!mounted) { + dispose = [ + listen_dev(input, "input", input_input_handler), + listen_dev(button, "click", click_handler_1, false, false, false, false) + ]; + + mounted = true; + } + }, + p: function update(new_ctx, dirty) { + ctx = new_ctx; + + if (dirty & /*replyText, flattenedComments*/ 6 && input.value !== /*replyText*/ ctx[2][/*comment*/ ctx[14].id]) { + set_input_value(input, /*replyText*/ ctx[2][/*comment*/ ctx[14].id]); + } + }, + d: function destroy(detaching) { + if (detaching) detach_dev(div); mounted = false; run_all(dispose); } @@ -2797,301 +3919,377 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_fragment$4.name, - type: "component", - source: "", + id: create_if_block$2.name, + type: "if", + source: "(123:16) {#if showReplyInput[comment.id]}", ctx }); return block; } - function getRandomWord(line) { - let words = line.split(" "); - return words[Math.floor(Math.random() * words.length)]; - } + // (119:8) {#each flattenedComments as comment} + function create_each_block$2(ctx) { + let div; + let span; + let t0_value = /*comment*/ ctx[14].title + ""; + let t0; + let t1; + let button; + let t3; + let t4; + let div_class_value; + let mounted; + let dispose; - function instance$4($$self, $$props, $$invalidate) { - let nextindexButtonClass; - let previousindexButtonClass; - let currentindexButtonClass; - let { $$slots: slots = {}, $$scope } = $$props; - validate_slots('YoutubeIframeAPICustomInterface', slots, []); - let player; - let interval = 20; // Define your interval - let currentTime = 0; - let timeUpdateInterval; + function click_handler() { + return /*click_handler*/ ctx[10](/*comment*/ ctx[14]); + } - // Assuming 'transcript' contains your video transcript - let transcript = `Line 1 of the transcript. - Line 2 of the transcript. - Line 3 food - Line 4 foodest - Line 5 foods - Line 6 fooder - Line 7 foodz - Line 8 fooding - ...`; // Replace with your actual transcript + let if_block = /*showReplyInput*/ ctx[3][/*comment*/ ctx[14].id] && create_if_block$2(ctx); - let lines = transcript.split("\n"); - let currentWord = ""; - let line = ""; - let isUpdating = false; - let updateInterval; - let currentIndex = 0; // Assuming this is initialized appropriately - let currentuserIndex = 0; // Assuming this is initialized appropriately - let timestamps = []; // Array of timestamps - let userTimestamps = []; // Array of user timestamps - let r2userTimestamps = []; // Array of user timestamps - let currentvideoId = 'qEpmiA3XkX8'; - let youTubeApiLoaded = false; - let currentvideoduration; - let regeneratedautotimestamps = false; + const block = { + c: function create() { + div = element("div"); + span = element("span"); + t0 = text(t0_value); + t1 = space(); + button = element("button"); + button.textContent = "Reply"; + t3 = space(); + if (if_block) if_block.c(); + t4 = space(); + add_location(span, file$4, 120, 16, 4453); + add_location(button, file$4, 121, 16, 4499); - window.onYouTubeIframeAPIReady = function () { - youTubeApiLoaded = true; - initYouTubePlayer(); - }; + attr_dev(div, "class", div_class_value = "" + (null_to_empty(/*comment*/ ctx[14].level === 0 + ? 'top-level-comment' + : 'comment') + " svelte-bsj1sx")); - // Function to initialize the YouTube player - function initYouTubePlayer() { - if (!youTubeApiLoaded) { - console.error("YouTube API is not ready yet."); - return; - } + set_style(div, "margin-left", /*comment*/ ctx[14].level * 20 + "px"); + add_location(div, file$4, 119, 12, 4323); + }, + m: function mount(target, anchor) { + insert_dev(target, div, anchor); + append_dev(div, span); + append_dev(span, t0); + append_dev(div, t1); + append_dev(div, button); + append_dev(div, t3); + if (if_block) if_block.m(div, null); + append_dev(div, t4); - regeneratedautotimestamps = false; + if (!mounted) { + dispose = listen_dev(button, "click", click_handler, false, false, false, false); + mounted = true; + } + }, + p: function update(new_ctx, dirty) { + ctx = new_ctx; + if (dirty & /*flattenedComments*/ 2 && t0_value !== (t0_value = /*comment*/ ctx[14].title + "")) set_data_dev(t0, t0_value); - // Clear existing interval - clearInterval(timeUpdateInterval); + if (/*showReplyInput*/ ctx[3][/*comment*/ ctx[14].id]) { + if (if_block) { + if_block.p(ctx, dirty); + } else { + if_block = create_if_block$2(ctx); + if_block.c(); + if_block.m(div, t4); + } + } else if (if_block) { + if_block.d(1); + if_block = null; + } - // Reinitialize player with new video ID - if (player) { - player.loadVideoById(currentvideoId); - } else { - player = new YT.Player('youtube-player', - { - height: '360', - width: '640', - videoId: currentvideoId, - events: { - 'onReady': onPlayerReady, - 'onStateChange': onPlayerStateChange - } - }); - } + if (dirty & /*flattenedComments*/ 2 && div_class_value !== (div_class_value = "" + (null_to_empty(/*comment*/ ctx[14].level === 0 + ? 'top-level-comment' + : 'comment') + " svelte-bsj1sx"))) { + attr_dev(div, "class", div_class_value); + } - // Reset and start the interval to update current time - timeUpdateInterval = setInterval(updateCurrentTime, 1000); - } + if (dirty & /*flattenedComments*/ 2) { + set_style(div, "margin-left", /*comment*/ ctx[14].level * 20 + "px"); + } + }, + d: function destroy(detaching) { + if (detaching) detach_dev(div); + if (if_block) if_block.d(); + mounted = false; + dispose(); + } + }; - onMount(() => { - // Load the YouTube IFrame Player API - const tag = document.createElement('script'); + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_each_block$2.name, + type: "each", + source: "(119:8) {#each flattenedComments as comment}", + ctx + }); - tag.src = "https://www.youtube.com/iframe_api"; - const firstScriptTag = document.getElementsByTagName('script')[0]; - firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); + return block; + } - // Update the current time every second - timeUpdateInterval = setInterval(updateCurrentTime, 1000); - }); + function create_fragment$4(ctx) { + let h1; + let t1; + let h4; + let t3; + let div2; + let div0; + let button0; + let t5; + let input0; + let t6; + let input1; + let t7; + let button1; + let t9; + let br; + let t10; + let div1; + let mounted; + let dispose; + let each_value = /*flattenedComments*/ ctx[1]; + validate_each_argument(each_value); + let each_blocks = []; - function autogeneratedtimestamps() { - currentvideoduration = player.getDuration(); + for (let i = 0; i < each_value.length; i += 1) { + each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i)); + } - //console.log("Video Duration: ", currentvideoduration); - const generatedTimestamps = []; + const block = { + c: function create() { + h1 = element("h1"); + h1.textContent = "Reddit based Nested Comments Idea for LMM responses that need further branching responses"; + t1 = space(); + h4 = element("h4"); + h4.textContent = "Inspired by Vijay Bhati - https://github.com/vj98/Frontend-Machine-Coding/tree/main/nested-comments https://youtu.be/a4OA7QbHEho?list=PLBygUld3s6x8sI_H8UYROVMIVcuxUre1e"; + t3 = space(); + div2 = element("div"); + div0 = element("div"); + button0 = element("button"); + button0.textContent = "Export Comments"; + t5 = text("\r\n | Import Exported Comments \r\n "); + input0 = element("input"); + t6 = text("\r\n | \r\n "); + input1 = element("input"); + t7 = space(); + button1 = element("button"); + button1.textContent = "Post Comment"; + t9 = space(); + br = element("br"); + t10 = space(); + div1 = element("div"); - for (let i = interval; i < currentvideoduration; i += interval) { - generatedTimestamps.push(i); - } + for (let i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].c(); + } - $$invalidate(8, timestamps = generatedTimestamps); + add_location(h1, file$4, 104, 0, 3512); + add_location(h4, file$4, 105, 0, 3614); + add_location(button0, file$4, 108, 8, 3897); + attr_dev(input0, "type", "file"); + add_location(input0, file$4, 110, 8, 4000); + attr_dev(input1, "placeholder", "Add a comment..."); + add_location(input1, file$4, 112, 8, 4072); + add_location(button1, file$4, 113, 8, 4146); + add_location(div0, file$4, 107, 4, 3882); + add_location(br, file$4, 116, 4, 4225); + attr_dev(div1, "id", "comment-container"); + add_location(div1, file$4, 117, 4, 4235); + attr_dev(div2, "class", "component-containter svelte-bsj1sx"); + set_style(div2, "border", "1px solid black"); + set_style(div2, "padding", "4px"); + add_location(div2, file$4, 106, 0, 3795); + }, + 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, h1, anchor); + insert_dev(target, t1, anchor); + insert_dev(target, h4, anchor); + insert_dev(target, t3, anchor); + insert_dev(target, div2, anchor); + append_dev(div2, div0); + append_dev(div0, button0); + append_dev(div0, t5); + append_dev(div0, input0); + append_dev(div0, t6); + append_dev(div0, input1); + set_input_value(input1, /*newComment*/ ctx[0]); + append_dev(div0, t7); + append_dev(div0, button1); + append_dev(div2, t9); + append_dev(div2, br); + append_dev(div2, t10); + append_dev(div2, div1); - // Do something with the timestamps - //console.log("Generated Timestamps: ", generatedTimestamps); - regeneratedautotimestamps = true; - } + for (let i = 0; i < each_blocks.length; i += 1) { + if (each_blocks[i]) { + each_blocks[i].m(div1, null); + } + } - // Event handler for when the player is ready - function onPlayerReady(event) { - autogeneratedtimestamps(); - } + if (!mounted) { + dispose = [ + listen_dev(button0, "click", /*exportToJson*/ ctx[7], false, false, false, false), + listen_dev(input0, "change", /*handleFileUpload*/ ctx[8], false, false, false, false), + listen_dev(input1, "input", /*input1_input_handler*/ ctx[9]), + listen_dev(button1, "click", /*addComment*/ ctx[4], false, false, false, false) + ]; - function onPlayerStateChange(event) { - if (event.data === YT.PlayerState.PLAYING || event.data === YT.PlayerState.PAUSED) { - updateCurrentIndex(); - } + mounted = true; + } + }, + p: function update(ctx, [dirty]) { + if (dirty & /*newComment*/ 1 && input1.value !== /*newComment*/ ctx[0]) { + set_input_value(input1, /*newComment*/ ctx[0]); + } - // Check if the video has just started playing - if (event.data === YT.PlayerState.PLAYING && !regeneratedautotimestamps) { - autogeneratedtimestamps(); - } - } + if (dirty & /*flattenedComments, addReply, replyText, toggleReplyInput, showReplyInput*/ 110) { + each_value = /*flattenedComments*/ ctx[1]; + validate_each_argument(each_value); + let i; - function updateCurrentIndex() { - const currentTime = player.getCurrentTime(); + for (i = 0; i < each_value.length; i += 1) { + const child_ctx = get_each_context$2(ctx, each_value, i); - // Find the closest timestamp - let closest = timestamps.reduce((prev, curr) => Math.abs(curr - currentTime) < Math.abs(prev - currentTime) - ? curr - : prev); + if (each_blocks[i]) { + each_blocks[i].p(child_ctx, dirty); + } else { + each_blocks[i] = create_each_block$2(child_ctx); + each_blocks[i].c(); + each_blocks[i].m(div1, null); + } + } - $$invalidate(7, currentIndex = timestamps.indexOf(closest)); - } + for (; i < each_blocks.length; i += 1) { + each_blocks[i].d(1); + } - function updateCurrentTime() { - if (player && player.getCurrentTime) { - $$invalidate(3, currentTime = player.getCurrentTime()); + each_blocks.length = each_value.length; + } + }, + i: noop, + o: noop, + d: function destroy(detaching) { + if (detaching) detach_dev(h1); + if (detaching) detach_dev(t1); + if (detaching) detach_dev(h4); + if (detaching) detach_dev(t3); + if (detaching) detach_dev(div2); + destroy_each(each_blocks, detaching); + mounted = false; + run_all(dispose); } - } + }; - onDestroy(() => { - clearInterval(timeUpdateInterval); + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_fragment$4.name, + type: "component", + source: "", + ctx }); - function updateWord() { - if (isUpdating) { - $$invalidate(5, line = lines[Math.floor(Math.random() * lines.length)]); - $$invalidate(4, currentWord = getRandomWord(line)); - } - } - - function toggleUpdate() { - $$invalidate(6, isUpdating = !isUpdating); + return block; + } - if (isUpdating) { - updateWord(); // Immediately update once - updateInterval = setInterval(updateWord, 3000); // Update every 3 seconds - } else { - clearInterval(updateInterval); - $$invalidate(5, line = ''); - $$invalidate(4, currentWord = ''); - } - } + function flattenStructure(items, level = 0, parentId = null, processedIds = new Set()) { + let result = []; - function goToNextAutoTimestamp() { - if (currentIndex < timestamps.length - 1) { - $$invalidate(7, currentIndex += 1); - player.seekTo(timestamps[currentIndex], true); - } - } + items.forEach(item => { + if (processedIds.has(item.id)) return; + result.push({ ...item, level, parentId }); + processedIds.add(item.id); - function goToPreviousAutoTimestamp() { - if (currentIndex > 0) { - $$invalidate(7, currentIndex -= 1); - player.seekTo(timestamps[currentIndex], true); + if (item.items && Array.isArray(item.items)) { + const childItems = flattenStructure(item.items, level + 1, item.id, processedIds); + result = result.concat(childItems); } - } - - function addUserTimestamp() { - const currentTime = Math.floor(player.getCurrentTime()); - $$invalidate(1, userTimestamps = [...userTimestamps, currentTime].sort((a, b) => a - b)); - } - - function addr2UserTimestamp() { - const currentTime = Math.floor(player.getCurrentTime()); - $$invalidate(9, r2userTimestamps = [...r2userTimestamps, currentTime].sort((a, b) => a - b)); - } + }); - function goToCurrentUserTimestamp() { - if (currentuserIndex === 0 && currentIndex < 0) { - player.seekTo(userTimestamps[currentIndex], true); - } else if (currentuserIndex < 0) { - player.seekTo(userTimestamps[currentuserIndex], true); - } else { - // Handle the end of the list here - console.log("No selected user timestamp."); - } // You can also disable the "next" button or loop to the start if needed. - } + return result; + } - function goToNextUserTimestamp() { - if (currentuserIndex < userTimestamps.length - 1) { - $$invalidate(0, currentuserIndex += 1); - player.seekTo(userTimestamps[currentuserIndex], true); - } else { - // Handle the end of the list here - console.log("Reached the end of user timestamps."); - } // You can also disable the "next" button or loop to the start if needed. - } + function instance$4($$self, $$props, $$invalidate) { + let { $$slots: slots = {}, $$scope } = $$props; + validate_slots('RecursiveNestedCommentsElement', slots, []); + let comments = []; + let newComment = ''; + let flattenedComments = []; + let replyText = {}; + let showReplyInput = {}; - function goToPreviousUserTimestamp() { - if (currentuserIndex > 0) { - $$invalidate(0, currentuserIndex -= 1); - player.seekTo(userTimestamps[currentuserIndex], true); - } else { - // Handle the beginning of the list here - console.log("Reached the start of user timestamps."); - } // You can also disable the "previous" button or loop to the end if needed. - } + const addComment = () => { + comments = [ + ...comments, + { + id: v4(), + title: newComment, + items: [] + } + ]; - function exportTimestamps() { - const data = JSON.stringify({ - currentvideoId, - timestamps: userTimestamps - }); + $$invalidate(0, newComment = ''); + $$invalidate(1, flattenedComments = flattenStructure(comments)); + }; - const blob = new Blob([data], { type: 'application/json' }); - const url = URL.createObjectURL(blob); - const a = document.createElement('a'); - a.style.display = 'none'; - const filename = `${currentvideoId}_timestamps.json`; - a.href = url; - a.download = filename; - document.body.appendChild(a); - a.click(); - window.URL.revokeObjectURL(url); - } + const addReply = (parentId, replyText) => { + const findAndAddReply = (items, id) => { + for (let item of items) { + if (item.id === id) { + item.items.push({ + id: v4(), + title: replyText, + items: [] + }); - function exportr2Timestamps() { - const data = JSON.stringify({ - currentvideoId, - timestamps: r2userTimestamps - }); + return true; + } - const blob = new Blob([data], { type: 'application/json' }); - const url = URL.createObjectURL(blob); - const a = document.createElement('a'); - a.style.display = 'none'; - const filename = `${currentvideoId}_round2timestamps.json`; - a.href = url; - a.download = filename; - document.body.appendChild(a); - a.click(); - window.URL.revokeObjectURL(url); - } + if (item.items.length && findAndAddReply(item.items, id)) { + return true; + } + } - function importTimestamps(event) { - // Check if the file input is not empty - const file = event.target.files[0]; + return false; + }; - if (!event.target.files || event.target.files.length === 0) { - alert('No file selected.'); - return; - } + findAndAddReply(comments, parentId); + $$invalidate(1, flattenedComments = flattenStructure(comments)); + }; - // Check if the file is a Blob (File objects inherit from Blob) - if (!(file instanceof Blob)) { - alert('Selected item is not a file.'); - return; - } + // Function to toggle reply input + function toggleReplyInput(commentId) { + $$invalidate(3, showReplyInput[commentId] = !showReplyInput[commentId], showReplyInput); + } + function exportToJson() { + const dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(comments)); + const downloadAnchorNode = document.createElement('a'); + downloadAnchorNode.setAttribute("href", dataStr); + downloadAnchorNode.setAttribute("download", "comments.json"); + document.body.appendChild(downloadAnchorNode); + downloadAnchorNode.click(); + downloadAnchorNode.remove(); + } + + function handleFileUpload(event) { + const file = event.target.files[0]; + if (!file) return; const reader = new FileReader(); reader.onload = e => { - try { - const data = JSON.parse(e.target.result); - - if (!Array.isArray(data.timestamps)) { - alert('Invalid file structure: timestamps should be an array.'); - return; - } + const text = e.target.result; - $$invalidate(2, currentvideoId = data.currentvideoId || ''); - $$invalidate(1, userTimestamps = data.timestamps); + try { + comments = JSON.parse(text); + $$invalidate(1, flattenedComments = flattenStructure(comments)); } catch(error) { - alert('An error occurred while importing timestamps.'); //regeneratedautotimestamps = false; = true + console.error("Error parsing JSON:", error); } }; @@ -3101,295 +4299,172 @@ var app = (function () { const writable_props = []; Object.keys($$props).forEach(key => { - if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$2.warn(` was created with unknown prop '${key}'`); + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$2.warn(` was created with unknown prop '${key}'`); }); - function input0_input_handler() { - currentvideoId = this.value; - $$invalidate(2, currentvideoId); - } - - function input1_change_handler() { - isUpdating = this.checked; - $$invalidate(6, isUpdating); + function input1_input_handler() { + newComment = this.value; + $$invalidate(0, newComment); } - $$self.$capture_state = () => ({ - onMount, - onDestroy, - player, - interval, - currentTime, - timeUpdateInterval, - transcript, - lines, - currentWord, - line, - isUpdating, - updateInterval, - currentIndex, - currentuserIndex, - timestamps, - userTimestamps, - r2userTimestamps, - currentvideoId, - youTubeApiLoaded, - currentvideoduration, - regeneratedautotimestamps, - initYouTubePlayer, - autogeneratedtimestamps, - onPlayerReady, - onPlayerStateChange, - updateCurrentIndex, - updateCurrentTime, - getRandomWord, - updateWord, - toggleUpdate, - goToNextAutoTimestamp, - goToPreviousAutoTimestamp, - addUserTimestamp, - addr2UserTimestamp, - goToCurrentUserTimestamp, - goToNextUserTimestamp, - goToPreviousUserTimestamp, - exportTimestamps, - exportr2Timestamps, - importTimestamps, - currentindexButtonClass, - previousindexButtonClass, - nextindexButtonClass - }); - - $$self.$inject_state = $$props => { - if ('player' in $$props) player = $$props.player; - if ('interval' in $$props) $$invalidate(13, interval = $$props.interval); - if ('currentTime' in $$props) $$invalidate(3, currentTime = $$props.currentTime); - if ('timeUpdateInterval' in $$props) timeUpdateInterval = $$props.timeUpdateInterval; - if ('transcript' in $$props) transcript = $$props.transcript; - if ('lines' in $$props) lines = $$props.lines; - if ('currentWord' in $$props) $$invalidate(4, currentWord = $$props.currentWord); - if ('line' in $$props) $$invalidate(5, line = $$props.line); - if ('isUpdating' in $$props) $$invalidate(6, isUpdating = $$props.isUpdating); - if ('updateInterval' in $$props) updateInterval = $$props.updateInterval; - if ('currentIndex' in $$props) $$invalidate(7, currentIndex = $$props.currentIndex); - if ('currentuserIndex' in $$props) $$invalidate(0, currentuserIndex = $$props.currentuserIndex); - if ('timestamps' in $$props) $$invalidate(8, timestamps = $$props.timestamps); - if ('userTimestamps' in $$props) $$invalidate(1, userTimestamps = $$props.userTimestamps); - if ('r2userTimestamps' in $$props) $$invalidate(9, r2userTimestamps = $$props.r2userTimestamps); - if ('currentvideoId' in $$props) $$invalidate(2, currentvideoId = $$props.currentvideoId); - if ('youTubeApiLoaded' in $$props) youTubeApiLoaded = $$props.youTubeApiLoaded; - if ('currentvideoduration' in $$props) currentvideoduration = $$props.currentvideoduration; - if ('regeneratedautotimestamps' in $$props) regeneratedautotimestamps = $$props.regeneratedautotimestamps; - if ('currentindexButtonClass' in $$props) $$invalidate(10, currentindexButtonClass = $$props.currentindexButtonClass); - if ('previousindexButtonClass' in $$props) $$invalidate(11, previousindexButtonClass = $$props.previousindexButtonClass); - if ('nextindexButtonClass' in $$props) $$invalidate(12, nextindexButtonClass = $$props.nextindexButtonClass); - }; + const click_handler = comment => toggleReplyInput(comment.id); - if ($$props && "$$inject" in $$props) { - $$self.$inject_state($$props.$$inject); + function input_input_handler(comment) { + replyText[comment.id] = this.value; + $$invalidate(2, replyText); } - $$self.$$.update = () => { - if ($$self.$$.dirty[0] & /*currentvideoId*/ 4) { - if (currentvideoId) { - initYouTubePlayer(); - } - } - - if ($$self.$$.dirty[0] & /*currentuserIndex, userTimestamps*/ 3) { - $$invalidate(12, nextindexButtonClass = currentuserIndex >= userTimestamps.length - 1 - ? 'button-at-end' - : 'button'); - } - - if ($$self.$$.dirty[0] & /*currentuserIndex*/ 1) { - $$invalidate(11, previousindexButtonClass = currentuserIndex <= 0 ? 'button-at-end' : 'button'); - } - - if ($$self.$$.dirty[0] & /*currentuserIndex*/ 1) { - $$invalidate(10, currentindexButtonClass = currentuserIndex <= 0 ? 'button-at-end' : 'button'); - } + const click_handler_1 = comment => { + addReply(comment.id, replyText[comment.id]); + toggleReplyInput(comment.id); }; - return [ - currentuserIndex, - userTimestamps, - currentvideoId, - currentTime, - currentWord, - line, - isUpdating, - currentIndex, - timestamps, - r2userTimestamps, - currentindexButtonClass, - previousindexButtonClass, - nextindexButtonClass, - interval, - toggleUpdate, - goToNextAutoTimestamp, - goToPreviousAutoTimestamp, - addUserTimestamp, - goToCurrentUserTimestamp, - goToNextUserTimestamp, - goToPreviousUserTimestamp, - exportTimestamps, - exportr2Timestamps, - importTimestamps, - input0_input_handler, - input1_change_handler - ]; - } - - class YoutubeIframeAPICustomInterface extends SvelteComponentDev { - constructor(options) { - super(options); - init(this, options, instance$4, create_fragment$4, safe_not_equal, {}, null, [-1, -1]); - - dispatch_dev("SvelteRegisterComponent", { - component: this, - tagName: "YoutubeIframeAPICustomInterface", - options, - id: create_fragment$4.name - }); - } - } - - // Unique ID creation requires a high quality random # generator. In the browser we therefore - // require the crypto API and do not support built-in fallback to lower quality random number - // generators (like Math.random()). - let getRandomValues; - const rnds8 = new Uint8Array(16); - function rng() { - // lazy load so that environments that need to polyfill have a chance to do so - if (!getRandomValues) { - // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. - getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto); - - if (!getRandomValues) { - throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported'); - } - } - - return getRandomValues(rnds8); - } - - /** - * Convert array of 16 byte values to UUID string format of the form: - * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX - */ - - const byteToHex = []; - - for (let i = 0; i < 256; ++i) { - byteToHex.push((i + 0x100).toString(16).slice(1)); - } - - function unsafeStringify(arr, offset = 0) { - // Note: Be careful editing this code! It's been tuned for performance - // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434 - return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]; - } - - const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto); - var native = { - randomUUID - }; - - function v4(options, buf, offset) { - if (native.randomUUID && !buf && !options) { - return native.randomUUID(); - } - - options = options || {}; - const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved` + $$self.$capture_state = () => ({ + uuidv4: v4, + comments, + newComment, + flattenedComments, + replyText, + showReplyInput, + flattenStructure, + addComment, + addReply, + toggleReplyInput, + exportToJson, + handleFileUpload + }); - rnds[6] = rnds[6] & 0x0f | 0x40; - rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided + $$self.$inject_state = $$props => { + if ('comments' in $$props) comments = $$props.comments; + if ('newComment' in $$props) $$invalidate(0, newComment = $$props.newComment); + if ('flattenedComments' in $$props) $$invalidate(1, flattenedComments = $$props.flattenedComments); + if ('replyText' in $$props) $$invalidate(2, replyText = $$props.replyText); + if ('showReplyInput' in $$props) $$invalidate(3, showReplyInput = $$props.showReplyInput); + }; - if (buf) { - offset = offset || 0; + if ($$props && "$$inject" in $$props) { + $$self.$inject_state($$props.$$inject); + } - for (let i = 0; i < 16; ++i) { - buf[offset + i] = rnds[i]; - } + return [ + newComment, + flattenedComments, + replyText, + showReplyInput, + addComment, + addReply, + toggleReplyInput, + exportToJson, + handleFileUpload, + input1_input_handler, + click_handler, + input_input_handler, + click_handler_1 + ]; + } - return buf; - } + class RecursiveNestedCommentsElement extends SvelteComponentDev { + constructor(options) { + super(options); + init(this, options, instance$4, create_fragment$4, safe_not_equal, {}); - return unsafeStringify(rnds); + dispatch_dev("SvelteRegisterComponent", { + component: this, + tagName: "RecursiveNestedCommentsElement", + options, + id: create_fragment$4.name + }); + } } - /* src\RecursiveNestedCommentsElement.svelte generated by Svelte v3.59.2 */ + /* src\CopyandRemoveListComponent.svelte generated by Svelte v3.59.2 */ const { console: console_1$1 } = globals; - const file$3 = "src\\RecursiveNestedCommentsElement.svelte"; + const file$3 = "src\\CopyandRemoveListComponent.svelte"; - function get_each_context$2(ctx, list, i) { + function get_each_context$1(ctx, list, i) { const child_ctx = ctx.slice(); - child_ctx[14] = list[i]; - child_ctx[15] = list; - child_ctx[16] = i; + child_ctx[6] = list[i]; return child_ctx; } - // (123:16) {#if showReplyInput[comment.id]} - function create_if_block$1(ctx) { - let div; - let input; - let t0; - let button; - let mounted; - let dispose; - - function input_input_handler() { - /*input_input_handler*/ ctx[11].call(input, /*comment*/ ctx[14]); - } + // (26:0) {:else} + function create_else_block(ctx) { + let each_blocks = []; + let each_1_lookup = new Map(); + let each_1_anchor; + let each_value = /*items*/ ctx[1]; + validate_each_argument(each_value); + const get_key = ctx => /*item*/ ctx[6].id; + validate_each_keys(ctx, each_value, get_each_context$1, get_key); - function click_handler_1() { - return /*click_handler_1*/ ctx[12](/*comment*/ ctx[14]); + for (let i = 0; i < each_value.length; i += 1) { + let child_ctx = get_each_context$1(ctx, each_value, i); + let key = get_key(child_ctx); + each_1_lookup.set(key, each_blocks[i] = create_each_block$1(key, child_ctx)); } const block = { c: function create() { - div = element("div"); - input = element("input"); - t0 = space(); - button = element("button"); - button.textContent = "Post Reply"; - attr_dev(input, "placeholder", "Write a reply..."); - add_location(input, file$3, 124, 24, 4690); - add_location(button, file$3, 125, 24, 4791); - attr_dev(div, "class", "reply-input"); - add_location(div, file$3, 123, 20, 4639); + for (let i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].c(); + } + + each_1_anchor = empty(); }, m: function mount(target, anchor) { - insert_dev(target, div, anchor); - append_dev(div, input); - set_input_value(input, /*replyText*/ ctx[2][/*comment*/ ctx[14].id]); - append_dev(div, t0); - append_dev(div, button); - - if (!mounted) { - dispose = [ - listen_dev(input, "input", input_input_handler), - listen_dev(button, "click", click_handler_1, false, false, false, false) - ]; + for (let i = 0; i < each_blocks.length; i += 1) { + if (each_blocks[i]) { + each_blocks[i].m(target, anchor); + } + } - mounted = true; + insert_dev(target, each_1_anchor, anchor); + }, + p: function update(ctx, dirty) { + if (dirty & /*copyAndRemoveItem, items*/ 10) { + each_value = /*items*/ ctx[1]; + validate_each_argument(each_value); + validate_each_keys(ctx, each_value, get_each_context$1, get_key); + each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, destroy_block, create_each_block$1, each_1_anchor, get_each_context$1); } }, - p: function update(new_ctx, dirty) { - ctx = new_ctx; - - if (dirty & /*replyText, flattenedComments*/ 6 && input.value !== /*replyText*/ ctx[2][/*comment*/ ctx[14].id]) { - set_input_value(input, /*replyText*/ ctx[2][/*comment*/ ctx[14].id]); + d: function destroy(detaching) { + for (let i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].d(detaching); } + + if (detaching) detach_dev(each_1_anchor); + } + }; + + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_else_block.name, + type: "else", + source: "(26:0) {:else}", + ctx + }); + + return block; + } + + // (24:0) {#if items.length === 0} + function create_if_block$1(ctx) { + let p; + + const block = { + c: function create() { + p = element("p"); + p.textContent = "All items have been copied! (or none entered yet)"; + add_location(p, file$3, 24, 4, 732); + }, + m: function mount(target, anchor) { + insert_dev(target, p, anchor); }, + p: noop, d: function destroy(detaching) { - if (detaching) detach_dev(div); - mounted = false; - run_all(dispose); + if (detaching) detach_dev(p); } }; @@ -3397,63 +4472,41 @@ var app = (function () { block, id: create_if_block$1.name, type: "if", - source: "(123:16) {#if showReplyInput[comment.id]}", + source: "(24:0) {#if items.length === 0}", ctx }); return block; } - // (119:8) {#each flattenedComments as comment} - function create_each_block$2(ctx) { - let div; - let span; - let t0_value = /*comment*/ ctx[14].title + ""; + // (27:4) {#each items as item (item.id)} + function create_each_block$1(key_1, ctx) { + let button; + let t0_value = /*item*/ ctx[6].text + ""; let t0; let t1; - let button; - let t3; - let t4; - let div_class_value; let mounted; let dispose; function click_handler() { - return /*click_handler*/ ctx[10](/*comment*/ ctx[14]); + return /*click_handler*/ ctx[5](/*item*/ ctx[6]); } - let if_block = /*showReplyInput*/ ctx[3][/*comment*/ ctx[14].id] && create_if_block$1(ctx); - const block = { + key: key_1, + first: null, c: function create() { - div = element("div"); - span = element("span"); + button = element("button"); t0 = text(t0_value); t1 = space(); - button = element("button"); - button.textContent = "Reply"; - t3 = space(); - if (if_block) if_block.c(); - t4 = space(); - add_location(span, file$3, 120, 16, 4453); - add_location(button, file$3, 121, 16, 4499); - - attr_dev(div, "class", div_class_value = "" + (null_to_empty(/*comment*/ ctx[14].level === 0 - ? 'top-level-comment' - : 'comment') + " svelte-bsj1sx")); - - set_style(div, "margin-left", /*comment*/ ctx[14].level * 20 + "px"); - add_location(div, file$3, 119, 12, 4323); + attr_dev(button, "class", "item svelte-bmbf24"); + add_location(button, file$3, 27, 8, 844); + this.first = button; }, m: function mount(target, anchor) { - insert_dev(target, div, anchor); - append_dev(div, span); - append_dev(span, t0); - append_dev(div, t1); - append_dev(div, button); - append_dev(div, t3); - if (if_block) if_block.m(div, null); - append_dev(div, t4); + insert_dev(target, button, anchor); + append_dev(button, t0); + append_dev(button, t1); if (!mounted) { dispose = listen_dev(button, "click", click_handler, false, false, false, false); @@ -3462,34 +4515,10 @@ var app = (function () { }, p: function update(new_ctx, dirty) { ctx = new_ctx; - if (dirty & /*flattenedComments*/ 2 && t0_value !== (t0_value = /*comment*/ ctx[14].title + "")) set_data_dev(t0, t0_value); - - if (/*showReplyInput*/ ctx[3][/*comment*/ ctx[14].id]) { - if (if_block) { - if_block.p(ctx, dirty); - } else { - if_block = create_if_block$1(ctx); - if_block.c(); - if_block.m(div, t4); - } - } else if (if_block) { - if_block.d(1); - if_block = null; - } - - if (dirty & /*flattenedComments*/ 2 && div_class_value !== (div_class_value = "" + (null_to_empty(/*comment*/ ctx[14].level === 0 - ? 'top-level-comment' - : 'comment') + " svelte-bsj1sx"))) { - attr_dev(div, "class", div_class_value); - } - - if (dirty & /*flattenedComments*/ 2) { - set_style(div, "margin-left", /*comment*/ ctx[14].level * 20 + "px"); - } + if (dirty & /*items*/ 2 && t0_value !== (t0_value = /*item*/ ctx[6].text + "")) set_data_dev(t0, t0_value); }, d: function destroy(detaching) { - if (detaching) detach_dev(div); - if (if_block) if_block.d(); + if (detaching) detach_dev(button); mounted = false; dispose(); } @@ -3497,9 +4526,9 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_each_block$2.name, + id: create_each_block$1.name, type: "each", - source: "(119:8) {#each flattenedComments as comment}", + source: "(27:4) {#each items as item (item.id)}", ctx }); @@ -3509,75 +4538,33 @@ var app = (function () { function create_fragment$3(ctx) { let h1; let t1; - let h4; - let t3; - let div2; - let div0; - let button0; - let t5; - let input0; - let t6; - let input1; - let t7; - let button1; - let t9; - let br; - let t10; - let div1; + let textarea; + let t2; + let if_block_anchor; let mounted; let dispose; - let each_value = /*flattenedComments*/ ctx[1]; - validate_each_argument(each_value); - let each_blocks = []; - for (let i = 0; i < each_value.length; i += 1) { - each_blocks[i] = create_each_block$2(get_each_context$2(ctx, each_value, i)); + function select_block_type(ctx, dirty) { + if (/*items*/ ctx[1].length === 0) return create_if_block$1; + return create_else_block; } + let current_block_type = select_block_type(ctx); + let if_block = current_block_type(ctx); + const block = { c: function create() { h1 = element("h1"); - h1.textContent = "Reddit based Nested Comments Idea for LMM responses that need further branching responses"; + h1.textContent = "Copy items for prompts by clicking buttons below"; t1 = space(); - h4 = element("h4"); - h4.textContent = "Inspired by Vijay Bhati - https://github.com/vj98/Frontend-Machine-Coding/tree/main/nested-comments https://youtu.be/a4OA7QbHEho?list=PLBygUld3s6x8sI_H8UYROVMIVcuxUre1e"; - t3 = space(); - div2 = element("div"); - div0 = element("div"); - button0 = element("button"); - button0.textContent = "Export Comments"; - t5 = text("\r\n | Import Exported Comments \r\n "); - input0 = element("input"); - t6 = text("\r\n | \r\n "); - input1 = element("input"); - t7 = space(); - button1 = element("button"); - button1.textContent = "Post Comment"; - t9 = space(); - br = element("br"); - t10 = space(); - div1 = element("div"); - - for (let i = 0; i < each_blocks.length; i += 1) { - each_blocks[i].c(); - } - - add_location(h1, file$3, 104, 0, 3512); - add_location(h4, file$3, 105, 0, 3614); - add_location(button0, file$3, 108, 8, 3897); - attr_dev(input0, "type", "file"); - add_location(input0, file$3, 110, 8, 4000); - attr_dev(input1, "placeholder", "Add a comment..."); - add_location(input1, file$3, 112, 8, 4072); - add_location(button1, file$3, 113, 8, 4146); - add_location(div0, file$3, 107, 4, 3882); - add_location(br, file$3, 116, 4, 4225); - attr_dev(div1, "id", "comment-container"); - add_location(div1, file$3, 117, 4, 4235); - attr_dev(div2, "class", "component-containter svelte-bsj1sx"); - set_style(div2, "border", "1px solid black"); - set_style(div2, "padding", "4px"); - add_location(div2, file$3, 106, 0, 3795); + textarea = element("textarea"); + t2 = space(); + if_block.c(); + if_block_anchor = empty(); + add_location(h1, file$3, 19, 0, 537); + attr_dev(textarea, "placeholder", "Enter text here..."); + attr_dev(textarea, "class", "svelte-bmbf24"); + add_location(textarea, file$3, 21, 0, 598); }, l: function claim(nodes) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); @@ -3585,67 +4572,36 @@ var app = (function () { m: function mount(target, anchor) { insert_dev(target, h1, anchor); insert_dev(target, t1, anchor); - insert_dev(target, h4, anchor); - insert_dev(target, t3, anchor); - insert_dev(target, div2, anchor); - append_dev(div2, div0); - append_dev(div0, button0); - append_dev(div0, t5); - append_dev(div0, input0); - append_dev(div0, t6); - append_dev(div0, input1); - set_input_value(input1, /*newComment*/ ctx[0]); - append_dev(div0, t7); - append_dev(div0, button1); - append_dev(div2, t9); - append_dev(div2, br); - append_dev(div2, t10); - append_dev(div2, div1); - - for (let i = 0; i < each_blocks.length; i += 1) { - if (each_blocks[i]) { - each_blocks[i].m(div1, null); - } - } + insert_dev(target, textarea, anchor); + set_input_value(textarea, /*textInput*/ ctx[0]); + insert_dev(target, t2, anchor); + if_block.m(target, anchor); + insert_dev(target, if_block_anchor, anchor); if (!mounted) { dispose = [ - listen_dev(button0, "click", /*exportToJson*/ ctx[7], false, false, false, false), - listen_dev(input0, "change", /*handleFileUpload*/ ctx[8], false, false, false, false), - listen_dev(input1, "input", /*input1_input_handler*/ ctx[9]), - listen_dev(button1, "click", /*addComment*/ ctx[4], false, false, false, false) + listen_dev(textarea, "input", /*textarea_input_handler*/ ctx[4]), + listen_dev(textarea, "input", /*updateItems*/ ctx[2], false, false, false, false) ]; mounted = true; } }, p: function update(ctx, [dirty]) { - if (dirty & /*newComment*/ 1 && input1.value !== /*newComment*/ ctx[0]) { - set_input_value(input1, /*newComment*/ ctx[0]); + if (dirty & /*textInput*/ 1) { + set_input_value(textarea, /*textInput*/ ctx[0]); } - if (dirty & /*flattenedComments, addReply, replyText, toggleReplyInput, showReplyInput*/ 110) { - each_value = /*flattenedComments*/ ctx[1]; - validate_each_argument(each_value); - let i; - - for (i = 0; i < each_value.length; i += 1) { - const child_ctx = get_each_context$2(ctx, each_value, i); - - if (each_blocks[i]) { - each_blocks[i].p(child_ctx, dirty); - } else { - each_blocks[i] = create_each_block$2(child_ctx); - each_blocks[i].c(); - each_blocks[i].m(div1, null); - } - } + if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) { + if_block.p(ctx, dirty); + } else { + if_block.d(1); + if_block = current_block_type(ctx); - for (; i < each_blocks.length; i += 1) { - each_blocks[i].d(1); + if (if_block) { + if_block.c(); + if_block.m(if_block_anchor.parentNode, if_block_anchor); } - - each_blocks.length = each_value.length; } }, i: noop, @@ -3653,10 +4609,10 @@ var app = (function () { d: function destroy(detaching) { if (detaching) detach_dev(h1); if (detaching) detach_dev(t1); - if (detaching) detach_dev(h4); - if (detaching) detach_dev(t3); - if (detaching) detach_dev(div2); - destroy_each(each_blocks, detaching); + if (detaching) detach_dev(textarea); + if (detaching) detach_dev(t2); + if_block.d(detaching); + if (detaching) detach_dev(if_block_anchor); mounted = false; run_all(dispose); } @@ -3673,149 +4629,48 @@ var app = (function () { return block; } - function flattenStructure(items, level = 0, parentId = null, processedIds = new Set()) { - let result = []; - - items.forEach(item => { - if (processedIds.has(item.id)) return; - result.push({ ...item, level, parentId }); - processedIds.add(item.id); - - if (item.items && Array.isArray(item.items)) { - const childItems = flattenStructure(item.items, level + 1, item.id, processedIds); - result = result.concat(childItems); - } - }); - - return result; - } - function instance$3($$self, $$props, $$invalidate) { let { $$slots: slots = {}, $$scope } = $$props; - validate_slots('RecursiveNestedCommentsElement', slots, []); - let comments = []; - let newComment = ''; - let flattenedComments = []; - let replyText = {}; - let showReplyInput = {}; - - const addComment = () => { - comments = [ - ...comments, - { - id: v4(), - title: newComment, - items: [] - } - ]; - - $$invalidate(0, newComment = ''); - $$invalidate(1, flattenedComments = flattenStructure(comments)); - }; - - const addReply = (parentId, replyText) => { - const findAndAddReply = (items, id) => { - for (let item of items) { - if (item.id === id) { - item.items.push({ - id: v4(), - title: replyText, - items: [] - }); - - return true; - } - - if (item.items.length && findAndAddReply(item.items, id)) { - return true; - } - } - - return false; - }; - - findAndAddReply(comments, parentId); - $$invalidate(1, flattenedComments = flattenStructure(comments)); - }; - - // Function to toggle reply input - function toggleReplyInput(commentId) { - $$invalidate(3, showReplyInput[commentId] = !showReplyInput[commentId], showReplyInput); - } + validate_slots('CopyandRemoveListComponent', slots, []); + let textInput = ''; + let items = []; - function exportToJson() { - const dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(comments)); - const downloadAnchorNode = document.createElement('a'); - downloadAnchorNode.setAttribute("href", dataStr); - downloadAnchorNode.setAttribute("download", "comments.json"); - document.body.appendChild(downloadAnchorNode); - downloadAnchorNode.click(); - downloadAnchorNode.remove(); + function updateItems() { + $$invalidate(1, items = textInput.split('\n').filter(line => line.trim() !== '').map((line, index) => ({ id: index + line, text: line }))); } - function handleFileUpload(event) { - const file = event.target.files[0]; - if (!file) return; - const reader = new FileReader(); - - reader.onload = e => { - const text = e.target.result; - - try { - comments = JSON.parse(text); - $$invalidate(1, flattenedComments = flattenStructure(comments)); - } catch(error) { - console.error("Error parsing JSON:", error); - } - }; - - reader.readAsText(file); + async function copyAndRemoveItem(item) { + try { + await navigator.clipboard.writeText(item.text); + $$invalidate(1, items = items.filter(i => i.id !== item.id)); + } catch(err) { + console.error('Failed to copy text: ', err); + } } const writable_props = []; Object.keys($$props).forEach(key => { - if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$1.warn(` was created with unknown prop '${key}'`); + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1$1.warn(` was created with unknown prop '${key}'`); }); - function input1_input_handler() { - newComment = this.value; - $$invalidate(0, newComment); - } - - const click_handler = comment => toggleReplyInput(comment.id); - - function input_input_handler(comment) { - replyText[comment.id] = this.value; - $$invalidate(2, replyText); + function textarea_input_handler() { + textInput = this.value; + $$invalidate(0, textInput); } - const click_handler_1 = comment => { - addReply(comment.id, replyText[comment.id]); - toggleReplyInput(comment.id); - }; - - $$self.$capture_state = () => ({ - uuidv4: v4, - comments, - newComment, - flattenedComments, - replyText, - showReplyInput, - flattenStructure, - addComment, - addReply, - toggleReplyInput, - exportToJson, - handleFileUpload + const click_handler = item => copyAndRemoveItem(item); + + $$self.$capture_state = () => ({ + textInput, + items, + updateItems, + copyAndRemoveItem }); $$self.$inject_state = $$props => { - if ('comments' in $$props) comments = $$props.comments; - if ('newComment' in $$props) $$invalidate(0, newComment = $$props.newComment); - if ('flattenedComments' in $$props) $$invalidate(1, flattenedComments = $$props.flattenedComments); - if ('replyText' in $$props) $$invalidate(2, replyText = $$props.replyText); - if ('showReplyInput' in $$props) $$invalidate(3, showReplyInput = $$props.showReplyInput); + if ('textInput' in $$props) $$invalidate(0, textInput = $$props.textInput); + if ('items' in $$props) $$invalidate(1, items = $$props.items); }; if ($$props && "$$inject" in $$props) { @@ -3823,149 +4678,54 @@ var app = (function () { } return [ - newComment, - flattenedComments, - replyText, - showReplyInput, - addComment, - addReply, - toggleReplyInput, - exportToJson, - handleFileUpload, - input1_input_handler, - click_handler, - input_input_handler, - click_handler_1 + textInput, + items, + updateItems, + copyAndRemoveItem, + textarea_input_handler, + click_handler ]; } - class RecursiveNestedCommentsElement extends SvelteComponentDev { + class CopyandRemoveListComponent extends SvelteComponentDev { constructor(options) { super(options); init(this, options, instance$3, create_fragment$3, safe_not_equal, {}); dispatch_dev("SvelteRegisterComponent", { component: this, - tagName: "RecursiveNestedCommentsElement", + tagName: "CopyandRemoveListComponent", options, id: create_fragment$3.name }); } } - /* src\CopyandRemoveListComponent.svelte generated by Svelte v3.59.2 */ + /* src\ReadingStateCounter.svelte generated by Svelte v3.59.2 */ - const { console: console_1 } = globals; - const file$2 = "src\\CopyandRemoveListComponent.svelte"; + const file$2 = "src\\ReadingStateCounter.svelte"; - function get_each_context$1(ctx, list, i) { + function get_each_context(ctx, list, i) { const child_ctx = ctx.slice(); - child_ctx[6] = list[i]; + child_ctx[8] = list[i]; + child_ctx[10] = i; return child_ctx; } - // (26:0) {:else} - function create_else_block(ctx) { - let each_blocks = []; - let each_1_lookup = new Map(); - let each_1_anchor; - let each_value = /*items*/ ctx[1]; - validate_each_argument(each_value); - const get_key = ctx => /*item*/ ctx[6].id; - validate_each_keys(ctx, each_value, get_each_context$1, get_key); - - for (let i = 0; i < each_value.length; i += 1) { - let child_ctx = get_each_context$1(ctx, each_value, i); - let key = get_key(child_ctx); - each_1_lookup.set(key, each_blocks[i] = create_each_block$1(key, child_ctx)); - } - - const block = { - c: function create() { - for (let i = 0; i < each_blocks.length; i += 1) { - each_blocks[i].c(); - } - - each_1_anchor = empty(); - }, - m: function mount(target, anchor) { - for (let i = 0; i < each_blocks.length; i += 1) { - if (each_blocks[i]) { - each_blocks[i].m(target, anchor); - } - } - - insert_dev(target, each_1_anchor, anchor); - }, - p: function update(ctx, dirty) { - if (dirty & /*copyAndRemoveItem, items*/ 10) { - each_value = /*items*/ ctx[1]; - validate_each_argument(each_value); - validate_each_keys(ctx, each_value, get_each_context$1, get_key); - each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, each_1_anchor.parentNode, destroy_block, create_each_block$1, each_1_anchor, get_each_context$1); - } - }, - d: function destroy(detaching) { - for (let i = 0; i < each_blocks.length; i += 1) { - each_blocks[i].d(detaching); - } - - if (detaching) detach_dev(each_1_anchor); - } - }; - - dispatch_dev("SvelteRegisterBlock", { - block, - id: create_else_block.name, - type: "else", - source: "(26:0) {:else}", - ctx - }); - - return block; - } - - // (24:0) {#if items.length === 0} - function create_if_block(ctx) { - let p; - - const block = { - c: function create() { - p = element("p"); - p.textContent = "All items have been copied! (or none entered yet)"; - add_location(p, file$2, 24, 4, 732); - }, - m: function mount(target, anchor) { - insert_dev(target, p, anchor); - }, - p: noop, - d: function destroy(detaching) { - if (detaching) detach_dev(p); - } - }; - - dispatch_dev("SvelteRegisterBlock", { - block, - id: create_if_block.name, - type: "if", - source: "(24:0) {#if items.length === 0}", - ctx - }); - - return block; - } - - // (27:4) {#each items as item (item.id)} - function create_each_block$1(key_1, ctx) { + // (66:4) {#each words as wordObj, index (wordObj.word)} + function create_each_block(key_1, ctx) { let button; - let t0_value = /*item*/ ctx[6].text + ""; + let t0_value = /*wordObj*/ ctx[8].word + ""; let t0; let t1; + let t2_value = /*wordObj*/ ctx[8].count + ""; + let t2; + let t3; let mounted; let dispose; function click_handler() { - return /*click_handler*/ ctx[5](/*item*/ ctx[6]); + return /*click_handler*/ ctx[7](/*index*/ ctx[10]); } const block = { @@ -3974,15 +4734,20 @@ var app = (function () { c: function create() { button = element("button"); t0 = text(t0_value); - t1 = space(); - attr_dev(button, "class", "item svelte-bmbf24"); - add_location(button, file$2, 27, 8, 844); + t1 = text(" ("); + t2 = text(t2_value); + t3 = text(")\r\n "); + attr_dev(button, "class", "word-button svelte-13vjncp"); + set_style(button, "background-color", getColor(/*wordObj*/ ctx[8].count)); + add_location(button, file$2, 66, 8, 1940); this.first = button; }, m: function mount(target, anchor) { insert_dev(target, button, anchor); append_dev(button, t0); append_dev(button, t1); + append_dev(button, t2); + append_dev(button, t3); if (!mounted) { dispose = listen_dev(button, "click", click_handler, false, false, false, false); @@ -3991,7 +4756,12 @@ var app = (function () { }, p: function update(new_ctx, dirty) { ctx = new_ctx; - if (dirty & /*items*/ 2 && t0_value !== (t0_value = /*item*/ ctx[6].text + "")) set_data_dev(t0, t0_value); + if (dirty & /*words*/ 2 && t0_value !== (t0_value = /*wordObj*/ ctx[8].word + "")) set_data_dev(t0, t0_value); + if (dirty & /*words*/ 2 && t2_value !== (t2_value = /*wordObj*/ ctx[8].count + "")) set_data_dev(t2, t2_value); + + if (dirty & /*words*/ 2) { + set_style(button, "background-color", getColor(/*wordObj*/ ctx[8].count)); + } }, d: function destroy(detaching) { if (detaching) detach_dev(button); @@ -4002,9 +4772,9 @@ var app = (function () { dispatch_dev("SvelteRegisterBlock", { block, - id: create_each_block$1.name, + id: create_each_block.name, type: "each", - source: "(27:4) {#each items as item (item.id)}", + source: "(66:4) {#each words as wordObj, index (wordObj.word)}", ctx }); @@ -4012,83 +4782,128 @@ var app = (function () { } function create_fragment$2(ctx) { + let div0; let h1; let t1; - let textarea; + let input0; let t2; - let if_block_anchor; + let button0; + let t4; + let button1; + let t6; + let input1; + let t7; + let div1; + let each_blocks = []; + let each_1_lookup = new Map(); let mounted; let dispose; + let each_value = /*words*/ ctx[1]; + validate_each_argument(each_value); + const get_key = ctx => /*wordObj*/ ctx[8].word; + validate_each_keys(ctx, each_value, get_each_context, get_key); - function select_block_type(ctx, dirty) { - if (/*items*/ ctx[1].length === 0) return create_if_block; - return create_else_block; + 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 current_block_type = select_block_type(ctx); - let if_block = current_block_type(ctx); - const block = { c: function create() { + div0 = element("div"); h1 = element("h1"); - h1.textContent = "Copy items for prompts by clicking buttons below"; + h1.textContent = "Stateful Reader Brainstorm"; t1 = space(); - textarea = element("textarea"); + input0 = element("input"); t2 = space(); - if_block.c(); - if_block_anchor = empty(); - add_location(h1, file$2, 19, 0, 537); - attr_dev(textarea, "placeholder", "Enter text here..."); - attr_dev(textarea, "class", "svelte-bmbf24"); - add_location(textarea, file$2, 21, 0, 598); + button0 = element("button"); + button0.textContent = "Submit Text"; + t4 = space(); + button1 = element("button"); + button1.textContent = "Export to JSON"; + t6 = space(); + input1 = element("input"); + t7 = space(); + div1 = element("div"); + + for (let i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].c(); + } + + add_location(h1, file$2, 57, 4, 1576); + attr_dev(input0, "type", "text"); + attr_dev(input0, "placeholder", "Enter text here"); + attr_dev(input0, "class", "svelte-13vjncp"); + add_location(input0, file$2, 58, 4, 1617); + attr_dev(button0, "class", "svelte-13vjncp"); + add_location(button0, file$2, 59, 4, 1696); + attr_dev(button1, "class", "svelte-13vjncp"); + add_location(button1, file$2, 60, 4, 1752); + attr_dev(input1, "type", "file"); + attr_dev(input1, "class", "svelte-13vjncp"); + add_location(input1, file$2, 61, 4, 1813); + add_location(div0, file$2, 56, 0, 1565); + add_location(div1, file$2, 64, 0, 1873); }, 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, h1, anchor); - insert_dev(target, t1, anchor); - insert_dev(target, textarea, anchor); - set_input_value(textarea, /*textInput*/ ctx[0]); - insert_dev(target, t2, anchor); - if_block.m(target, anchor); - insert_dev(target, if_block_anchor, anchor); + insert_dev(target, div0, anchor); + append_dev(div0, h1); + append_dev(div0, t1); + append_dev(div0, input0); + set_input_value(input0, /*inputText*/ ctx[0]); + append_dev(div0, t2); + append_dev(div0, button0); + append_dev(div0, t4); + append_dev(div0, button1); + append_dev(div0, t6); + append_dev(div0, input1); + insert_dev(target, t7, anchor); + insert_dev(target, div1, anchor); + + for (let i = 0; i < each_blocks.length; i += 1) { + if (each_blocks[i]) { + each_blocks[i].m(div1, null); + } + } if (!mounted) { dispose = [ - listen_dev(textarea, "input", /*textarea_input_handler*/ ctx[4]), - listen_dev(textarea, "input", /*updateItems*/ ctx[2], false, false, false, false) + listen_dev(input0, "input", /*input0_input_handler*/ ctx[6]), + listen_dev(button0, "click", /*submitText*/ ctx[2], false, false, false, false), + listen_dev(button1, "click", /*exportToJson*/ ctx[4], false, false, false, false), + listen_dev(input1, "change", /*importFromJson*/ ctx[5], false, false, false, false) ]; mounted = true; } }, - p: function update(ctx, [dirty]) { - if (dirty & /*textInput*/ 1) { - set_input_value(textarea, /*textInput*/ ctx[0]); + p: function update(ctx, [dirty]) { + if (dirty & /*inputText*/ 1 && input0.value !== /*inputText*/ ctx[0]) { + set_input_value(input0, /*inputText*/ ctx[0]); } - if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) { - if_block.p(ctx, dirty); - } else { - if_block.d(1); - if_block = current_block_type(ctx); - - if (if_block) { - if_block.c(); - if_block.m(if_block_anchor.parentNode, if_block_anchor); - } + if (dirty & /*getColor, words, handleClick*/ 10) { + each_value = /*words*/ ctx[1]; + validate_each_argument(each_value); + validate_each_keys(ctx, each_value, get_each_context, get_key); + each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div1, destroy_block, create_each_block, null, get_each_context); } }, i: noop, o: noop, d: function destroy(detaching) { - if (detaching) detach_dev(h1); - if (detaching) detach_dev(t1); - if (detaching) detach_dev(textarea); - if (detaching) detach_dev(t2); - if_block.d(detaching); - if (detaching) detach_dev(if_block_anchor); + if (detaching) detach_dev(div0); + if (detaching) detach_dev(t7); + if (detaching) detach_dev(div1); + + for (let i = 0; i < each_blocks.length; i += 1) { + each_blocks[i].d(); + } + mounted = false; run_all(dispose); } @@ -4105,48 +4920,92 @@ var app = (function () { return block; } + function getColor(count) { + const colors = [ + '#1a1a1a', + '#333333', + '#4d4d4d', + '#666666', + '#808080', + '#999999', + '#b3b3b3', + '#cccccc', + '#e6e6e6', + '#ffffff' + ]; + + return colors[Math.min(Math.floor(count / 10), 9)]; + } + function instance$2($$self, $$props, $$invalidate) { let { $$slots: slots = {}, $$scope } = $$props; - validate_slots('CopyandRemoveListComponent', slots, []); - let textInput = ''; - let items = []; + validate_slots('ReadingStateCounter', slots, []); + let inputText = ""; + let words = []; - function updateItems() { - $$invalidate(1, items = textInput.split('\n').filter(line => line.trim() !== '').map((line, index) => ({ id: index + line, text: line }))); + function submitText() { + $$invalidate(1, words = inputText.split(/\s+/).map(word => ({ word, count: 0 }))); } - async function copyAndRemoveItem(item) { - try { - await navigator.clipboard.writeText(item.text); - $$invalidate(1, items = items.filter(i => i.id !== item.id)); - } catch(err) { - console.error('Failed to copy text: ', err); + function handleClick(index) { + $$invalidate(1, words[index].count += 1, words); + $$invalidate(1, words = [...words]); // Ensures Svelte detects the change + } + + // Function to export data to JSON + function exportToJson() { + const jsonData = JSON.stringify(words); + const blob = new Blob([jsonData], { type: "application/json" }); + const url = URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = 'statefulwords.json'; + a.click(); + URL.revokeObjectURL(url); + } + + // Function to handle file import + function importFromJson(event) { + const file = event.target.files[0]; + + if (file) { + const reader = new FileReader(); + + reader.onload = e => { + const json = e.target.result; + $$invalidate(1, words = JSON.parse(json)); + }; + + reader.readAsText(file); } } const writable_props = []; Object.keys($$props).forEach(key => { - if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1.warn(` was created with unknown prop '${key}'`); + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(` was created with unknown prop '${key}'`); }); - function textarea_input_handler() { - textInput = this.value; - $$invalidate(0, textInput); + function input0_input_handler() { + inputText = this.value; + $$invalidate(0, inputText); } - const click_handler = item => copyAndRemoveItem(item); + const click_handler = index => handleClick(index); $$self.$capture_state = () => ({ - textInput, - items, - updateItems, - copyAndRemoveItem + inputText, + words, + submitText, + handleClick, + getColor, + exportToJson, + importFromJson }); $$self.$inject_state = $$props => { - if ('textInput' in $$props) $$invalidate(0, textInput = $$props.textInput); - if ('items' in $$props) $$invalidate(1, items = $$props.items); + if ('inputText' in $$props) $$invalidate(0, inputText = $$props.inputText); + if ('words' in $$props) $$invalidate(1, words = $$props.words); }; if ($$props && "$$inject" in $$props) { @@ -4154,103 +5013,119 @@ var app = (function () { } return [ - textInput, - items, - updateItems, - copyAndRemoveItem, - textarea_input_handler, + inputText, + words, + submitText, + handleClick, + exportToJson, + importFromJson, + input0_input_handler, click_handler ]; } - class CopyandRemoveListComponent extends SvelteComponentDev { + class ReadingStateCounter extends SvelteComponentDev { constructor(options) { super(options); init(this, options, instance$2, create_fragment$2, safe_not_equal, {}); dispatch_dev("SvelteRegisterComponent", { component: this, - tagName: "CopyandRemoveListComponent", + tagName: "ReadingStateCounter", options, id: create_fragment$2.name }); } } - /* src\ReadingStateCounter.svelte generated by Svelte v3.59.2 */ - - const file$1 = "src\\ReadingStateCounter.svelte"; + /* src\DeliberateSubconciousRepititionPractice.svelte generated by Svelte v3.59.2 */ - function get_each_context(ctx, list, i) { - const child_ctx = ctx.slice(); - child_ctx[8] = list[i]; - child_ctx[10] = i; - return child_ctx; - } + const { Object: Object_1, console: console_1 } = globals; + const file$1 = "src\\DeliberateSubconciousRepititionPractice.svelte"; - // (66:4) {#each words as wordObj, index (wordObj.word)} - function create_each_block(key_1, ctx) { - let button; - let t0_value = /*wordObj*/ ctx[8].word + ""; - let t0; + // (156:0) {#if selectedItem} + function create_if_block_1(ctx) { + let div; + let strong0; let t1; - let t2_value = /*wordObj*/ ctx[8].count + ""; + let t2_value = /*selectedItem*/ ctx[1].text + ""; let t2; let t3; - let mounted; - let dispose; - - function click_handler() { - return /*click_handler*/ ctx[7](/*index*/ ctx[10]); - } + let strong1; + let t5; + let t6_value = /*counts*/ ctx[2][/*selectedItem*/ ctx[1].id] + ""; + let t6; const block = { - key: key_1, - first: null, c: function create() { - button = element("button"); - t0 = text(t0_value); - t1 = text(" ("); + div = element("div"); + strong0 = element("strong"); + strong0.textContent = "Current Word:"; + t1 = space(); t2 = text(t2_value); - t3 = text(")\r\n "); - attr_dev(button, "class", "word-button svelte-13vjncp"); - set_style(button, "background-color", getColor(/*wordObj*/ ctx[8].count)); - add_location(button, file$1, 66, 8, 1940); - this.first = button; + t3 = space(); + strong1 = element("strong"); + strong1.textContent = "Count:"; + t5 = space(); + t6 = text(t6_value); + add_location(strong0, file$1, 157, 8, 5744); + add_location(strong1, file$1, 158, 8, 5805); + add_location(div, file$1, 156, 4, 5729); }, m: function mount(target, anchor) { - insert_dev(target, button, anchor); - append_dev(button, t0); - append_dev(button, t1); - append_dev(button, t2); - append_dev(button, t3); - - if (!mounted) { - dispose = listen_dev(button, "click", click_handler, false, false, false, false); - mounted = true; - } + insert_dev(target, div, anchor); + append_dev(div, strong0); + append_dev(div, t1); + append_dev(div, t2); + append_dev(div, t3); + append_dev(div, strong1); + append_dev(div, t5); + append_dev(div, t6); }, - p: function update(new_ctx, dirty) { - ctx = new_ctx; - if (dirty & /*words*/ 2 && t0_value !== (t0_value = /*wordObj*/ ctx[8].word + "")) set_data_dev(t0, t0_value); - if (dirty & /*words*/ 2 && t2_value !== (t2_value = /*wordObj*/ ctx[8].count + "")) set_data_dev(t2, t2_value); + p: function update(ctx, dirty) { + if (dirty & /*selectedItem*/ 2 && t2_value !== (t2_value = /*selectedItem*/ ctx[1].text + "")) set_data_dev(t2, t2_value); + if (dirty & /*counts, selectedItem*/ 6 && t6_value !== (t6_value = /*counts*/ ctx[2][/*selectedItem*/ ctx[1].id] + "")) set_data_dev(t6, t6_value); + }, + d: function destroy(detaching) { + if (detaching) detach_dev(div); + } + }; - if (dirty & /*words*/ 2) { - set_style(button, "background-color", getColor(/*wordObj*/ ctx[8].count)); - } + dispatch_dev("SvelteRegisterBlock", { + block, + id: create_if_block_1.name, + type: "if", + source: "(156:0) {#if selectedItem}", + ctx + }); + + return block; + } + + // (163:0) {#if allWordsLimitReached} + function create_if_block(ctx) { + let div; + + const block = { + c: function create() { + div = element("div"); + div.textContent = "All words have reached the count limit."; + attr_dev(div, "class", "alert svelte-fb2ql8"); + add_location(div, file$1, 163, 4, 5910); + }, + m: function mount(target, anchor) { + insert_dev(target, div, anchor); }, d: function destroy(detaching) { - if (detaching) detach_dev(button); - mounted = false; - dispose(); + if (detaching) detach_dev(div); } }; dispatch_dev("SvelteRegisterBlock", { block, - id: create_each_block.name, - type: "each", - source: "(66:4) {#each words as wordObj, index (wordObj.word)}", + id: create_if_block.name, + type: "if", + source: "(163:0) {#if allWordsLimitReached}", ctx }); @@ -4258,128 +5133,221 @@ var app = (function () { } function create_fragment$1(ctx) { - let div0; let h1; let t1; let input0; let t2; let button0; let t4; - let button1; + let br; + let t5; + let textarea0; let t6; - let input1; + let hr0; let t7; - let div1; - let each_blocks = []; - let each_1_lookup = new Map(); + let div; + let label; + let t9; + let input1; + let t10; + let t11; + let t12; + let button1; + let t14; + let button2; + let t16; + let hr1; + let t17; + let button3; + let t19; + let textarea1; let mounted; let dispose; - let each_value = /*words*/ ctx[1]; - validate_each_argument(each_value); - const get_key = ctx => /*wordObj*/ ctx[8].word; - validate_each_keys(ctx, each_value, get_each_context, get_key); - - 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_block0 = /*selectedItem*/ ctx[1] && create_if_block_1(ctx); + let if_block1 = /*allWordsLimitReached*/ ctx[4] && create_if_block(ctx); const block = { c: function create() { - div0 = element("div"); h1 = element("h1"); - h1.textContent = "Stateful Reader Brainstorm"; + h1.textContent = "Random Word till appearance count reached for TTS"; t1 = space(); input0 = element("input"); t2 = space(); button0 = element("button"); - button0.textContent = "Submit Text"; + button0.textContent = "Export Counts"; t4 = space(); - button1 = element("button"); - button1.textContent = "Export to JSON"; + br = element("br"); + t5 = space(); + textarea0 = element("textarea"); t6 = space(); - input1 = element("input"); + hr0 = element("hr"); t7 = space(); - div1 = element("div"); - - for (let i = 0; i < each_blocks.length; i += 1) { - each_blocks[i].c(); - } - - add_location(h1, file$1, 57, 4, 1576); - attr_dev(input0, "type", "text"); - attr_dev(input0, "placeholder", "Enter text here"); - attr_dev(input0, "class", "svelte-13vjncp"); - add_location(input0, file$1, 58, 4, 1617); - attr_dev(button0, "class", "svelte-13vjncp"); - add_location(button0, file$1, 59, 4, 1696); - attr_dev(button1, "class", "svelte-13vjncp"); - add_location(button1, file$1, 60, 4, 1752); - attr_dev(input1, "type", "file"); - attr_dev(input1, "class", "svelte-13vjncp"); - add_location(input1, file$1, 61, 4, 1813); - add_location(div0, file$1, 56, 0, 1565); - add_location(div1, file$1, 64, 0, 1873); + div = element("div"); + label = element("label"); + label.textContent = "Total Count Limit:"; + t9 = space(); + input1 = element("input"); + t10 = space(); + if (if_block0) if_block0.c(); + t11 = space(); + if (if_block1) if_block1.c(); + t12 = space(); + button1 = element("button"); + button1.textContent = "Start"; + t14 = space(); + button2 = element("button"); + button2.textContent = "Stop"; + t16 = space(); + hr1 = element("hr"); + t17 = space(); + button3 = element("button"); + button3.textContent = "Simulate one hour or limit Counts"; + t19 = space(); + textarea1 = element("textarea"); + add_location(h1, file$1, 141, 0, 5255); + attr_dev(input0, "type", "file"); + add_location(input0, file$1, 143, 0, 5317); + add_location(button0, file$1, 144, 0, 5365); + add_location(br, file$1, 145, 0, 5421); + attr_dev(textarea0, "placeholder", "Enter text here..."); + add_location(textarea0, file$1, 146, 0, 5427); + add_location(hr0, file$1, 148, 0, 5531); + attr_dev(label, "for", "totalCountLimit"); + add_location(label, file$1, 151, 4, 5550); + attr_dev(input1, "type", "number"); + attr_dev(input1, "min", "1"); + attr_dev(input1, "id", "totalCountLimit"); + add_location(input1, file$1, 152, 4, 5612); + add_location(div, file$1, 150, 0, 5539); + add_location(button1, file$1, 168, 0, 6001); + add_location(button2, file$1, 169, 0, 6042); + add_location(hr1, file$1, 171, 0, 6083); + add_location(button3, file$1, 173, 0, 6091); + textarea1.readOnly = true; + attr_dev(textarea1, "placeholder", "Simulation result will be shown here..."); + add_location(textarea1, file$1, 174, 0, 6168); }, 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, div0, anchor); - append_dev(div0, h1); - append_dev(div0, t1); - append_dev(div0, input0); - set_input_value(input0, /*inputText*/ ctx[0]); - append_dev(div0, t2); - append_dev(div0, button0); - append_dev(div0, t4); - append_dev(div0, button1); - append_dev(div0, t6); - append_dev(div0, input1); + insert_dev(target, h1, anchor); + insert_dev(target, t1, anchor); + insert_dev(target, input0, anchor); + insert_dev(target, t2, anchor); + insert_dev(target, button0, anchor); + insert_dev(target, t4, anchor); + insert_dev(target, br, anchor); + insert_dev(target, t5, anchor); + insert_dev(target, textarea0, anchor); + set_input_value(textarea0, /*textInput*/ ctx[0]); + insert_dev(target, t6, anchor); + insert_dev(target, hr0, anchor); insert_dev(target, t7, anchor); - insert_dev(target, div1, anchor); - - for (let i = 0; i < each_blocks.length; i += 1) { - if (each_blocks[i]) { - each_blocks[i].m(div1, null); - } - } + insert_dev(target, div, anchor); + append_dev(div, label); + append_dev(div, t9); + append_dev(div, input1); + set_input_value(input1, /*totalCountLimit*/ ctx[3]); + insert_dev(target, t10, anchor); + if (if_block0) if_block0.m(target, anchor); + insert_dev(target, t11, anchor); + if (if_block1) if_block1.m(target, anchor); + insert_dev(target, t12, anchor); + insert_dev(target, button1, anchor); + insert_dev(target, t14, anchor); + insert_dev(target, button2, anchor); + insert_dev(target, t16, anchor); + insert_dev(target, hr1, anchor); + insert_dev(target, t17, anchor); + insert_dev(target, button3, anchor); + insert_dev(target, t19, anchor); + insert_dev(target, textarea1, anchor); + set_input_value(textarea1, /*simulationResult*/ ctx[5]); if (!mounted) { dispose = [ - listen_dev(input0, "input", /*input0_input_handler*/ ctx[6]), - listen_dev(button0, "click", /*submitText*/ ctx[2], false, false, false, false), - listen_dev(button1, "click", /*exportToJson*/ ctx[4], false, false, false, false), - listen_dev(input1, "change", /*importFromJson*/ ctx[5], false, false, false, false) + listen_dev(input0, "change", /*importCounts*/ ctx[10], false, false, false, false), + listen_dev(button0, "click", /*exportCounts*/ ctx[9], false, false, false, false), + listen_dev(textarea0, "input", /*textarea0_input_handler*/ ctx[12]), + listen_dev(textarea0, "input", /*updateItems*/ ctx[6], false, false, false, false), + listen_dev(input1, "input", /*input1_input_handler*/ ctx[13]), + listen_dev(button1, "click", /*start*/ ctx[7], false, false, false, false), + listen_dev(button2, "click", /*stop*/ ctx[8], false, false, false, false), + listen_dev(button3, "click", /*simulateCount*/ ctx[11], false, false, false, false), + listen_dev(textarea1, "input", /*textarea1_input_handler*/ ctx[14]) ]; mounted = true; } }, p: function update(ctx, [dirty]) { - if (dirty & /*inputText*/ 1 && input0.value !== /*inputText*/ ctx[0]) { - set_input_value(input0, /*inputText*/ ctx[0]); + if (dirty & /*textInput*/ 1) { + set_input_value(textarea0, /*textInput*/ ctx[0]); } - if (dirty & /*getColor, words, handleClick*/ 10) { - each_value = /*words*/ ctx[1]; - validate_each_argument(each_value); - validate_each_keys(ctx, each_value, get_each_context, get_key); - each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx, each_value, each_1_lookup, div1, destroy_block, create_each_block, null, get_each_context); + if (dirty & /*totalCountLimit*/ 8 && to_number(input1.value) !== /*totalCountLimit*/ ctx[3]) { + set_input_value(input1, /*totalCountLimit*/ ctx[3]); + } + + if (/*selectedItem*/ ctx[1]) { + if (if_block0) { + if_block0.p(ctx, dirty); + } else { + if_block0 = create_if_block_1(ctx); + if_block0.c(); + if_block0.m(t11.parentNode, t11); + } + } else if (if_block0) { + if_block0.d(1); + if_block0 = null; + } + + if (/*allWordsLimitReached*/ ctx[4]) { + if (if_block1) ; else { + if_block1 = create_if_block(ctx); + if_block1.c(); + if_block1.m(t12.parentNode, t12); + } + } else if (if_block1) { + if_block1.d(1); + if_block1 = null; + } + + if (dirty & /*simulationResult*/ 32) { + set_input_value(textarea1, /*simulationResult*/ ctx[5]); } }, i: noop, o: noop, d: function destroy(detaching) { - if (detaching) detach_dev(div0); + if (detaching) detach_dev(h1); + if (detaching) detach_dev(t1); + if (detaching) detach_dev(input0); + if (detaching) detach_dev(t2); + if (detaching) detach_dev(button0); + if (detaching) detach_dev(t4); + if (detaching) detach_dev(br); + if (detaching) detach_dev(t5); + if (detaching) detach_dev(textarea0); + if (detaching) detach_dev(t6); + if (detaching) detach_dev(hr0); if (detaching) detach_dev(t7); - if (detaching) detach_dev(div1); - - for (let i = 0; i < each_blocks.length; i += 1) { - each_blocks[i].d(); - } - + if (detaching) detach_dev(div); + if (detaching) detach_dev(t10); + if (if_block0) if_block0.d(detaching); + if (detaching) detach_dev(t11); + if (if_block1) if_block1.d(detaching); + if (detaching) detach_dev(t12); + if (detaching) detach_dev(button1); + if (detaching) detach_dev(t14); + if (detaching) detach_dev(button2); + if (detaching) detach_dev(t16); + if (detaching) detach_dev(hr1); + if (detaching) detach_dev(t17); + if (detaching) detach_dev(button3); + if (detaching) detach_dev(t19); + if (detaching) detach_dev(textarea1); mounted = false; run_all(dispose); } @@ -4396,92 +5364,205 @@ var app = (function () { return block; } - function getColor(count) { - const colors = [ - '#1a1a1a', - '#333333', - '#4d4d4d', - '#666666', - '#808080', - '#999999', - '#b3b3b3', - '#cccccc', - '#e6e6e6', - '#ffffff' - ]; - - return colors[Math.min(Math.floor(count / 10), 9)]; - } - function instance$1($$self, $$props, $$invalidate) { let { $$slots: slots = {}, $$scope } = $$props; - validate_slots('ReadingStateCounter', slots, []); - let inputText = ""; - let words = []; + validate_slots('DeliberateSubconciousRepititionPractice', slots, []); + let textInput = ''; + let items = []; + let running = false; + let selectedItem = null; + let intervalId = null; + let counts = {}; + let totalCountLimit = 10; // Default limit, can be changed by the user + let allWordsLimitReached = false; + let simulationResult = ''; // Variable to hold the result of the simulation - function submitText() { - $$invalidate(1, words = inputText.split(/\s+/).map(word => ({ word, count: 0 }))); + function updateItems() { + items = textInput.split(/\W+/).filter(word => word.trim() !== '').map(word => ({ id: word, text: word })); // Use word itself as the ID + $$invalidate(2, counts = items.reduce((acc, item) => ({ ...acc, [item.id]: 0 }), {})); } - function handleClick(index) { - $$invalidate(1, words[index].count += 1, words); - $$invalidate(1, words = [...words]); // Ensures Svelte detects the change + function start() { + if (!running && items.length > 0) { + running = true; + + intervalId = setInterval( + () => { + // Filter out items that have reached the totalCountLimit + const eligibleItems = items.filter(item => counts[item.id] < totalCountLimit); + + // If there are no eligible items left, stop the timer + if (eligibleItems.length === 0) { + stop(); + $$invalidate(4, allWordsLimitReached = true); // Set when all words reach the limit + return; + } + + // Select a random item from the eligible items + const randomIndex = Math.floor(Math.random() * eligibleItems.length); + + $$invalidate(1, selectedItem = eligibleItems[randomIndex]); + $$invalidate(2, counts[selectedItem.id]++, counts); + }, + 1000 + ); + } } - // Function to export data to JSON - function exportToJson() { - const jsonData = JSON.stringify(words); - const blob = new Blob([jsonData], { type: "application/json" }); + function stop() { + if (running) { + clearInterval(intervalId); + running = false; + intervalId = null; + } + } + + function exportCounts() { + const dataStr = JSON.stringify(counts); + const blob = new Blob([dataStr], { type: "application/json" }); const url = URL.createObjectURL(blob); - const a = document.createElement('a'); - a.href = url; - a.download = 'statefulwords.json'; - a.click(); - URL.revokeObjectURL(url); + const link = document.createElement("a"); + link.download = "counts.json"; + link.href = url; + link.click(); } - // Function to handle file import - function importFromJson(event) { - const file = event.target.files[0]; + function importCounts(event) { + const fileReader = new FileReader(); - if (file) { - const reader = new FileReader(); + fileReader.onload = e => { + const data = JSON.parse(e.target.result); + $$invalidate(2, counts = { ...counts, ...data }); - reader.onload = e => { - const json = e.target.result; - $$invalidate(1, words = JSON.parse(json)); - }; + items = Object.keys(data).map((word, index) => ({ + id: word, // Use word itself as the ID + text: word + })); - reader.readAsText(file); + // Ensure existing items are updated if they are not in the imported data + items.forEach(item => { + if (!counts[item.id]) { + $$invalidate(2, counts[item.id] = 0, counts); + } + }); + }; + + fileReader.readAsText(event.target.files[0]); + } + + // ... (other variables and functions remain unchanged) + function simulateCount() { + let simulatedTime = 0; + let maxSimulatedSeconds = 3600; // 3600 seconds = 1 hour + let simulationOutput = ""; // Accumulate output here + + // Reset the allWordsLimitReached flag and simulationResult + $$invalidate(4, allWordsLimitReached = false); + + $$invalidate(5, simulationResult = ''); + + // Simulate until max time is reached or all words hit the limit + while (simulatedTime < maxSimulatedSeconds && !allWordsLimitReached) { + const eligibleItems = items.filter(item => counts[item.id] < totalCountLimit); + + if (eligibleItems.length === 0) { + $$invalidate(4, allWordsLimitReached = true); // Set when all words reach the limit + break; // Exit the loop if all words hit the limit + } + + // Select a random item and increment its count + const randomIndex = Math.floor(Math.random() * eligibleItems.length); + + $$invalidate(1, selectedItem = eligibleItems[randomIndex]); + $$invalidate(2, counts[selectedItem.id]++, counts); + simulationOutput += selectedItem.text + " "; // Append selected word to output + + // Increment simulated time (equivalent to the time between iterations in the real scenario) + simulatedTime++; + } + + // Update simulationResult with a message + if (allWordsLimitReached) { + $$invalidate(5, simulationResult = "All words have reached the count limit during simulation."); + } else { + $$invalidate(5, simulationResult = `Simulation finished after ${simulatedTime} seconds.`); + } + + // Export the simulation output to a text file + exportSimulationOutput(simulationOutput); + } + + function exportSimulationOutput(output) { + if (output) { + const blob = new Blob([output], { type: "text/plain" }); + const url = URL.createObjectURL(blob); + const link = document.createElement("a"); + link.download = "simulation_output.txt"; + link.href = url; + link.click(); + } else { + console.error("No simulation output to export."); + $$invalidate(5, simulationResult = "No simulation output to export."); } } + onDestroy(() => { + if (intervalId) { + clearInterval(intervalId); + } + }); + const writable_props = []; - Object.keys($$props).forEach(key => { - if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(` was created with unknown prop '${key}'`); + Object_1.keys($$props).forEach(key => { + if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1.warn(` was created with unknown prop '${key}'`); }); - function input0_input_handler() { - inputText = this.value; - $$invalidate(0, inputText); + function textarea0_input_handler() { + textInput = this.value; + $$invalidate(0, textInput); } - const click_handler = index => handleClick(index); + function input1_input_handler() { + totalCountLimit = to_number(this.value); + $$invalidate(3, totalCountLimit); + } + + function textarea1_input_handler() { + simulationResult = this.value; + $$invalidate(5, simulationResult); + } $$self.$capture_state = () => ({ - inputText, - words, - submitText, - handleClick, - getColor, - exportToJson, - importFromJson + onDestroy, + textInput, + items, + running, + selectedItem, + intervalId, + counts, + totalCountLimit, + allWordsLimitReached, + simulationResult, + updateItems, + start, + stop, + exportCounts, + importCounts, + simulateCount, + exportSimulationOutput }); $$self.$inject_state = $$props => { - if ('inputText' in $$props) $$invalidate(0, inputText = $$props.inputText); - if ('words' in $$props) $$invalidate(1, words = $$props.words); + if ('textInput' in $$props) $$invalidate(0, textInput = $$props.textInput); + if ('items' in $$props) items = $$props.items; + if ('running' in $$props) running = $$props.running; + if ('selectedItem' in $$props) $$invalidate(1, selectedItem = $$props.selectedItem); + if ('intervalId' in $$props) intervalId = $$props.intervalId; + if ('counts' in $$props) $$invalidate(2, counts = $$props.counts); + if ('totalCountLimit' in $$props) $$invalidate(3, totalCountLimit = $$props.totalCountLimit); + if ('allWordsLimitReached' in $$props) $$invalidate(4, allWordsLimitReached = $$props.allWordsLimitReached); + if ('simulationResult' in $$props) $$invalidate(5, simulationResult = $$props.simulationResult); }; if ($$props && "$$inject" in $$props) { @@ -4489,25 +5570,32 @@ var app = (function () { } return [ - inputText, - words, - submitText, - handleClick, - exportToJson, - importFromJson, - input0_input_handler, - click_handler + textInput, + selectedItem, + counts, + totalCountLimit, + allWordsLimitReached, + simulationResult, + updateItems, + start, + stop, + exportCounts, + importCounts, + simulateCount, + textarea0_input_handler, + input1_input_handler, + textarea1_input_handler ]; } - class ReadingStateCounter extends SvelteComponentDev { + class DeliberateSubconciousRepititionPractice extends SvelteComponentDev { constructor(options) { super(options); init(this, options, instance$1, create_fragment$1, safe_not_equal, {}); dispatch_dev("SvelteRegisterComponent", { component: this, - tagName: "ReadingStateCounter", + tagName: "DeliberateSubconciousRepititionPractice", options, id: create_fragment$1.name }); @@ -4535,18 +5623,24 @@ var app = (function () { let t11; let h31; let t13; - let readingstatecounter; + let div0; + let subrepprac; let t14; - let copyremove; + let div1; + let readingstatecounter; let t15; - let nestedcommentssvelte; + let div2; + let copyremove; let t16; - let myyoutube; + let nestedcommentssvelte; let t17; + let myyoutube; + let t18; let h12; - let t19; + let t20; let dotgame; let current; + subrepprac = new DeliberateSubconciousRepititionPractice({ $$inline: true }); readingstatecounter = new ReadingStateCounter({ $$inline: true }); copyremove = new CopyandRemoveListComponent({ $$inline: true }); nestedcommentssvelte = new RecursiveNestedCommentsElement({ $$inline: true }); @@ -4576,31 +5670,42 @@ var app = (function () { h31 = element("h3"); h31.textContent = "Gradio client Test in another space due to incompatabilitiess with default svelte and @gradio/client"; t13 = space(); - create_component(readingstatecounter.$$.fragment); + div0 = element("div"); + create_component(subrepprac.$$.fragment); t14 = space(); - create_component(copyremove.$$.fragment); + div1 = element("div"); + create_component(readingstatecounter.$$.fragment); t15 = space(); - create_component(nestedcommentssvelte.$$.fragment); + div2 = element("div"); + create_component(copyremove.$$.fragment); t16 = space(); - create_component(myyoutube.$$.fragment); + create_component(nestedcommentssvelte.$$.fragment); t17 = space(); + create_component(myyoutube.$$.fragment); + t18 = space(); h12 = element("h1"); h12.textContent = "Themeable Game Brainstorm - Image + Lists"; - t19 = space(); + t20 = space(); create_component(dotgame.$$.fragment); - attr_dev(h10, "class", "svelte-1tky8bj"); - add_location(h10, file, 24, 1, 651); + attr_dev(h10, "class", "svelte-1gz1mpc"); + add_location(h10, file, 24, 1, 668); attr_dev(a, "href", "https://svelte.dev/tutorial"); - add_location(a, file, 25, 14, 688); - add_location(p, file, 25, 1, 675); - attr_dev(h11, "class", "svelte-1tky8bj"); - add_location(h11, file, 27, 1, 787); - add_location(h30, file, 28, 1, 870); - add_location(h31, file, 30, 1, 922); - attr_dev(h12, "class", "svelte-1tky8bj"); - add_location(h12, file, 41, 1, 1170); - attr_dev(main, "class", "svelte-1tky8bj"); - add_location(main, file, 22, 0, 642); + add_location(a, file, 25, 14, 705); + add_location(p, file, 25, 1, 692); + attr_dev(h11, "class", "svelte-1gz1mpc"); + add_location(h11, file, 27, 1, 804); + add_location(h30, file, 28, 1, 887); + add_location(h31, file, 30, 1, 939); + attr_dev(div0, "class", "componentborder svelte-1gz1mpc"); + add_location(div0, file, 32, 1, 1052); + attr_dev(div1, "class", "componentborder svelte-1gz1mpc"); + add_location(div1, file, 34, 1, 1104); + attr_dev(div2, "class", "componentborder svelte-1gz1mpc"); + add_location(div2, file, 36, 1, 1166); + attr_dev(h12, "class", "svelte-1gz1mpc"); + add_location(h12, file, 43, 1, 1310); + attr_dev(main, "class", "svelte-1gz1mpc"); + add_location(main, file, 22, 0, 659); }, l: function claim(nodes) { throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option"); @@ -4623,16 +5728,21 @@ var app = (function () { append_dev(main, t11); append_dev(main, h31); append_dev(main, t13); - mount_component(readingstatecounter, main, null); + append_dev(main, div0); + mount_component(subrepprac, div0, null); append_dev(main, t14); - mount_component(copyremove, main, null); + append_dev(main, div1); + mount_component(readingstatecounter, div1, null); append_dev(main, t15); - mount_component(nestedcommentssvelte, main, null); + append_dev(main, div2); + mount_component(copyremove, div2, null); append_dev(main, t16); - mount_component(myyoutube, main, null); + mount_component(nestedcommentssvelte, main, null); append_dev(main, t17); + mount_component(myyoutube, main, null); + append_dev(main, t18); append_dev(main, h12); - append_dev(main, t19); + append_dev(main, t20); mount_component(dotgame, main, null); current = true; }, @@ -4641,6 +5751,7 @@ var app = (function () { }, i: function intro(local) { if (current) return; + transition_in(subrepprac.$$.fragment, local); transition_in(readingstatecounter.$$.fragment, local); transition_in(copyremove.$$.fragment, local); transition_in(nestedcommentssvelte.$$.fragment, local); @@ -4649,6 +5760,7 @@ var app = (function () { current = true; }, o: function outro(local) { + transition_out(subrepprac.$$.fragment, local); transition_out(readingstatecounter.$$.fragment, local); transition_out(copyremove.$$.fragment, local); transition_out(nestedcommentssvelte.$$.fragment, local); @@ -4658,6 +5770,7 @@ var app = (function () { }, d: function destroy(detaching) { if (detaching) detach_dev(main); + destroy_component(subrepprac); destroy_component(readingstatecounter); destroy_component(copyremove); destroy_component(nestedcommentssvelte); @@ -4714,8 +5827,8 @@ var app = (function () { MyYoutube: YoutubeIframeAPICustomInterface, NestedCommentsSvelte: RecursiveNestedCommentsElement, CopyRemove: CopyandRemoveListComponent, - ReadingState: ReadingStateCounter, ReadingStateCounter, + SubRepPrac: DeliberateSubconciousRepititionPractice, showModal, openModal, closeModal