|
1 |
| -<script lang="ts"> |
2 |
| -
|
3 |
| - import Tailwind from "./Tailwind.svelte"; |
4 |
| - import { loadInterpreter } from './interpreter'; |
5 |
| - import { pyodideLoaded, loadedEnvironments, navBarOpen, componentsNavOpen, mode, scriptsQueue, initializers, postInitializers } from './stores'; |
6 |
| -
|
7 |
| - let iconSize = 2; |
8 |
| - let pyodideReadyPromise |
9 |
| -
|
10 |
| - function bumpSize(evt){ |
11 |
| - iconSize = 4; |
12 |
| - } |
13 |
| -
|
14 |
| - function downSize(evt){ |
15 |
| - iconSize = 2; |
16 |
| - } |
17 |
| -
|
18 |
| - const initializePyodide = async () =>{ |
19 |
| - // @ts-ignore |
20 |
| - pyodideReadyPromise = loadInterpreter(); |
21 |
| - // @ts-ignore |
22 |
| - let newEnv = { |
23 |
| - 'id': 'a', |
24 |
| - 'promise': pyodideReadyPromise, |
25 |
| - 'state': 'loading', |
| 1 | +<style> |
| 2 | + :global(div.buttons-box) { |
| 3 | + margin-top: -25px; |
26 | 4 | }
|
27 |
| - pyodideLoaded.set(pyodideReadyPromise); |
28 |
| - loadedEnvironments.update((value: any): any => { |
29 |
| - value[newEnv['id']] = newEnv; |
30 |
| - }); |
31 | 5 |
|
32 |
| - let showNavBar = false; |
33 |
| - let main = document.querySelector("#main"); |
34 |
| - navBarOpen.subscribe(value => { |
35 |
| - showNavBar = value; |
36 |
| - }); |
37 |
| -
|
38 |
| - // now we call all initializers before we actually executed all page scripts |
39 |
| - for (let initializer of $initializers){ |
40 |
| - await initializer(); |
| 6 | + :global(.parentBox:hover .buttons-box) { |
| 7 | + visibility: visible; |
41 | 8 | }
|
| 9 | +</style> |
42 | 10 |
|
43 |
| - // now we can actually execute the page scripts if we are in play mode |
44 |
| - if ($mode == "play"){ |
45 |
| - for (let script of $scriptsQueue) { |
46 |
| - script.evaluate(); |
47 |
| - } |
48 |
| - scriptsQueue.set([]); |
| 11 | +<script lang="ts"> |
| 12 | + import Tailwind from './Tailwind.svelte'; |
| 13 | + import { loadInterpreter } from './interpreter'; |
| 14 | + import { |
| 15 | + componentsNavOpen, |
| 16 | + initializers, |
| 17 | + loadedEnvironments, |
| 18 | + mode, |
| 19 | + navBarOpen, |
| 20 | + postInitializers, |
| 21 | + pyodideLoaded, |
| 22 | + scriptsQueue, |
| 23 | + } from './stores'; |
| 24 | +
|
| 25 | + let iconSize = 2; |
| 26 | + let pyodideReadyPromise; |
| 27 | +
|
| 28 | + function bumpSize(evt) { |
| 29 | + iconSize = 4; |
49 | 30 | }
|
50 | 31 |
|
51 |
| - // now we call all post initializers AFTER we actually executed all page scripts |
52 |
| - setTimeout(() => { |
53 |
| - for (let initializer of $postInitializers){ |
54 |
| - initializer(); |
55 |
| - } |
56 |
| - }, 3000); |
57 |
| -
|
58 |
| - } |
59 |
| -
|
60 |
| - function toggleComponentsNavBar(evt){ |
61 |
| - componentsNavOpen.set(!$componentsNavOpen); |
| 32 | + function downSize(evt) { |
| 33 | + iconSize = 2; |
62 | 34 | }
|
63 | 35 |
|
| 36 | + const initializePyodide = async () => { |
| 37 | + pyodideReadyPromise = loadInterpreter(); |
| 38 | + let newEnv = { |
| 39 | + id: 'a', |
| 40 | + promise: pyodideReadyPromise, |
| 41 | + state: 'loading', |
| 42 | + }; |
| 43 | + pyodideLoaded.set(pyodideReadyPromise); |
| 44 | + loadedEnvironments.update((value: any): any => { |
| 45 | + value[newEnv['id']] = newEnv; |
| 46 | + }); |
| 47 | +
|
| 48 | + let showNavBar = false; |
| 49 | + let main = document.querySelector('#main'); |
| 50 | + navBarOpen.subscribe(value => { |
| 51 | + showNavBar = value; |
| 52 | + }); |
| 53 | +
|
| 54 | + // now we call all initializers before we actually executed all page scripts |
| 55 | + for (let initializer of $initializers) { |
| 56 | + await initializer(); |
| 57 | + } |
| 58 | +
|
| 59 | + // now we can actually execute the page scripts if we are in play mode |
| 60 | + if ($mode == 'play') { |
| 61 | + for (let script of $scriptsQueue) { |
| 62 | + script.evaluate(); |
| 63 | + } |
| 64 | + scriptsQueue.set([]); |
| 65 | + } |
| 66 | +
|
| 67 | + // now we call all post initializers AFTER we actually executed all page scripts |
| 68 | + setTimeout(() => { |
| 69 | + for (let initializer of $postInitializers) { |
| 70 | + initializer(); |
| 71 | + } |
| 72 | + }, 3000); |
| 73 | + }; |
| 74 | +
|
| 75 | + function toggleComponentsNavBar(evt) { |
| 76 | + componentsNavOpen.set(!$componentsNavOpen); |
| 77 | + } |
64 | 78 | </script>
|
65 | 79 |
|
66 |
| -<style> |
67 |
| - :global(div.buttons-box) { |
68 |
| - margin-top: -25px; |
69 |
| - } |
70 |
| -
|
71 |
| - :global(.parentBox:hover .buttons-box) { |
72 |
| - visibility: visible; |
73 |
| - } |
74 |
| -
|
75 |
| -</style> |
76 |
| - |
77 | 80 | <svelte:head>
|
78 |
| - <script src="https://cdn.jsdelivr.net/pyodide/v0.20.0/full/pyodide.js" on:load={initializePyodide}></script> |
| 81 | + <script src="https://cdn.jsdelivr.net/pyodide/v0.20.0/full/pyodide.js" on:load={initializePyodide}></script> |
79 | 82 | </svelte:head>
|
80 | 83 |
|
81 | 84 | <Tailwind />
|
0 commit comments