From 0c5747e0bfc0121d667bc856063910a7d72c302e Mon Sep 17 00:00:00 2001 From: BOTAlex Date: Thu, 8 Aug 2024 02:55:25 +0200 Subject: [PATCH] Tons of changes --- README.md | 4 + package-lock.json | 19 ++++- package.json | 4 +- src/lib/OpenBirchService.ts | 14 ++- src/routes/+page.svelte | 104 +++++++++++++++++++---- src/routes/Header.svelte | 59 ++++++++++++- src/routes/console/+page.svelte | 47 ++++++---- src/routes/console/ConsoleText.svelte | 13 +++ src/routes/pricing/+page.svelte | 23 +++++ static/OpenBirchWasm/OpenBirchWrapper.js | 4 + tailwind.config.js | 34 +++++++- 11 files changed, 286 insertions(+), 39 deletions(-) create mode 100644 src/routes/console/ConsoleText.svelte create mode 100644 src/routes/pricing/+page.svelte diff --git a/README.md b/README.md index 5ce6766..4bfdf62 100644 --- a/README.md +++ b/README.md @@ -36,3 +36,7 @@ npm run build You can preview the production build with `npm run preview`. > To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment. + + + + diff --git a/package-lock.json b/package-lock.json index e7d6d75..5698b4e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,9 @@ "name": "openbirchmockupsite", "version": "0.0.1", "dependencies": { - "svelte-parallax": "^0.6.0" + "linq": "^4.0.3", + "svelte-parallax": "^0.6.0", + "theme-change": "^2.5.0" }, "devDependencies": { "@fontsource/fira-mono": "^4.5.10", @@ -1748,6 +1750,15 @@ "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==", "dev": true }, + "node_modules/linq": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/linq/-/linq-4.0.3.tgz", + "integrity": "sha512-dP0w2ERJXfVUk6VmmAK+Tz/SxFHwyY7VM6Mrq4fnJmeQf9JNEYFH6qJfV6Qn0N91mfwz2GEE/4S+RDkmDNyUJw==", + "license": "MIT", + "engines": { + "node": "*" + } + }, "node_modules/locate-character": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz", @@ -2831,6 +2842,12 @@ "node": ">=10.13.0" } }, + "node_modules/theme-change": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/theme-change/-/theme-change-2.5.0.tgz", + "integrity": "sha512-B/UdsgdHAGhSKHTAQnxg/etN0RaMDpehuJmZIjLMDVJ6DGIliRHGD6pODi1CXLQAN9GV0GSyB3G6yCuK05PkPQ==", + "license": "MIT" + }, "node_modules/thenify": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz", diff --git a/package.json b/package.json index 6dd0de3..8d5b442 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,8 @@ }, "type": "module", "dependencies": { - "svelte-parallax": "^0.6.0" + "linq": "^4.0.3", + "svelte-parallax": "^0.6.0", + "theme-change": "^2.5.0" } } diff --git a/src/lib/OpenBirchService.ts b/src/lib/OpenBirchService.ts index ecbee8b..7d60ed0 100644 --- a/src/lib/OpenBirchService.ts +++ b/src/lib/OpenBirchService.ts @@ -2,6 +2,7 @@ import { writable } from 'svelte/store'; // Adds window.runEval into typescript env declare function runEval(expression: string, stopAssignments?: boolean): any; +declare function resetOpenBirch(): any; const OpenBirchHistory: OpenBirchConsoleEntry[] = []; @@ -28,7 +29,16 @@ function createOpenBirchInstance(){ } catch (e) { return ''; } - }, // TODO: Replace with actual implimentation + }, + resetState: () => { + resetOpenBirch(); + }, + getHistory: (filter: ConsoleSender | undefined = undefined): OpenBirchConsoleEntry[] => { + if (filter == undefined) + return OpenBirchHistory; + + return OpenBirchHistory.filter(x=>x.sender == filter); + } } } @@ -44,7 +54,7 @@ class OpenBirchConsoleEntry { } } -enum ConsoleSender { +export enum ConsoleSender { User, System } \ No newline at end of file diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 212c65a..8ba1d4e 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -4,6 +4,8 @@ import welcome_fallback from '$lib/images/svelte-welcome.png'; import differencialBackgroundVideo from '$lib/videos/DifferentialEquation.gif'; import "tailwindcss/tailwind.css"; + import ConsoleText from './console/ConsoleText.svelte'; + import { OpenBirch } from "$lib/OpenBirchService"; const sleep = (ms: number) => { return new Promise((resolve) => setTimeout(resolve, ms)); @@ -12,17 +14,46 @@ let isAutoTyping = true; let textField: HTMLInputElement; async function startTyping(){ - for (let charecter of "testing..."){ - if (!isAutoTyping) break; - textField.value += charecter; - await sleep(200); + for (var example of exampleInputs) { + for (let charecter of example){ + if (!isAutoTyping) break; + textField.value += charecter; + await sleep(200); + } + try {OpenBirch.sendCommand(textField.value);} catch (_) {} + resetFeild(); } } + const exampleInputs: readonly string[] = [ + "2+2", + "69*420+50", + "sin(2+4)", + "sqrt(9)", + "nroot(27, 3)", + "f(x):=2*x", + "f(5)", + "pi", + "e", + "myvar := 5", + "15 + myvar", + "myfunctionvar := f", + "myfunctionvar(10)", + "d/dx x", + "d/dx x^2", + "d/dx 69*x^2", + "d/dx sin(x)*x^2" + ]; + async function resetFeild() { textField.value = ""; } + async function onInputClicked() { + OpenBirch.resetState(); + window.location.href = "/console"; + } + import { onMount } from 'svelte'; import { Parallax, ParallaxLayer, StickyLayer } from 'svelte-parallax'; onMount(() => { @@ -50,23 +81,50 @@
-
- +
+
+
+ +
+
+
+
+
+ + + + +
+
+
- -
-
-

- Welcome to
- OpenBirch -

+ +
+
+
+

What is it?

+

I love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love

+
+
+ Album +
-
-
+ +
+
+ Album +
+
+

What is our mission?

+

I love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love the colour of yellow and I also love

+
@@ -87,6 +145,22 @@ // border: red 1mm solid; } + .flex-container { + display: flex; + flex-direction: column; + } + + .sylvesterTest { + max-width: 64rem; + min-width: 32rem; + width: 100%; + padding: 50px; + margin: 0 auto; + + display: grid; + grid-template-columns: 1fr 1fr; + } + .backgroundVideoContainer{ filter: blur(10px); } diff --git a/src/routes/Header.svelte b/src/routes/Header.svelte index b419711..e6f0dce 100644 --- a/src/routes/Header.svelte +++ b/src/routes/Header.svelte @@ -2,6 +2,21 @@ import { page } from '$app/stores'; import goku from '$lib/images/goku.webp'; import "tailwindcss/tailwind.css"; + + import { onMount } from 'svelte' + import { themeChange } from 'theme-change' + + // NOTE: the element that is using one of the theme attributes must be in the DOM on mount + onMount(() => { + themeChange(false) + // 👆 false parameter is required for svelte + }) + + let isDarkMode = true; + function toggleTheme(){ + isDarkMode = !isDarkMode; + console.log("Darkmode: " + isDarkMode); + }
@@ -15,9 +30,49 @@
    -
  • Console
  • - + + + +
    • +
  • + Console +
    • +
  • + Pricing
diff --git a/src/routes/console/+page.svelte b/src/routes/console/+page.svelte index 0c958a7..0fe67fe 100644 --- a/src/routes/console/+page.svelte +++ b/src/routes/console/+page.svelte @@ -1,16 +1,16 @@
-
-
    - {#each $OpenBirch as consoleEntry} - {#if consoleEntry.sender == 0} -
  • > {" " + consoleEntry.message}
    • - {:else} -
  • {consoleEntry.message}
    • - {/if} - {/each} -
+
+
diff --git a/src/routes/console/ConsoleText.svelte b/src/routes/console/ConsoleText.svelte new file mode 100644 index 0000000..64ebe0a --- /dev/null +++ b/src/routes/console/ConsoleText.svelte @@ -0,0 +1,13 @@ + + +
    + {#each $OpenBirch as consoleEntry} + {#if consoleEntry.sender == 0} +
  • > {" " + consoleEntry.message}
    • + {:else} +
  • {consoleEntry.message}
    • + {/if} + {/each} +
\ No newline at end of file diff --git a/src/routes/pricing/+page.svelte b/src/routes/pricing/+page.svelte new file mode 100644 index 0000000..1b04c06 --- /dev/null +++ b/src/routes/pricing/+page.svelte @@ -0,0 +1,23 @@ + + +
+ +
+ + \ No newline at end of file diff --git a/static/OpenBirchWasm/OpenBirchWrapper.js b/static/OpenBirchWasm/OpenBirchWrapper.js index 6f02b85..a497963 100644 --- a/static/OpenBirchWasm/OpenBirchWrapper.js +++ b/static/OpenBirchWasm/OpenBirchWrapper.js @@ -31,4 +31,8 @@ window.runEval = function (inputText, stopAssignments = false) { _free(resultPointer); return resultString; +} + +window.resetOpenBirch = function () { + Module._resetState(); } \ No newline at end of file diff --git a/tailwind.config.js b/tailwind.config.js index acfbc75..8e77e87 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -6,7 +6,39 @@ export default { }, plugins: [require("@tailwindcss/typography"), require('daisyui')], daisyui: { - themes: ["coffee"], // false: only light + dark | true: all themes | array: specific themes like this ["light", "dark", "cupcake"] + themes: [ + "light", + "dark", + "cupcake", + "bumblebee", + "emerald", + "corporate", + "synthwave", + "retro", + "cyberpunk", + "valentine", + "halloween", + "garden", + "forest", + "aqua", + "lofi", + "pastel", + "fantasy", + "wireframe", + "black", + "luxury", + "dracula", + "cmyk", + "autumn", + "business", + "acid", + "lemonade", + "night", + "coffee", + "winter", + "dim", + "nord", + "sunset",], // false: only light + dark | true: all themes | array: specific themes like this ["light", "dark", "cupcake"] base: true, // applies background color and foreground color for root element by default styled: true, // include daisyUI colors and design decisions for all components utils: true, // adds responsive and modifier utility classes