Merge pull request #7 from siefkenj/website

Website Updates
davidaustinm · Dec 12, 2024 · 62e7612 · 62e7612
2 parents bc07f4b + 6ec1b36
commit 62e7612
Show file tree

Hide file tree

Showing 10 changed files with 228 additions and 249 deletions.
diff --git a/.github/workflows/build-and-deploy.yml b/.github/workflows/build-and-deploy.yml
@@ -0,0 +1,82 @@
+# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
+# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs
+
+name: Build and deploy to github pages
+
+on:
+    push:
+        branches: ["main"]
+    pull_request:
+        branches: ["*"]
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+    contents: read
+    pages: write
+    id-token: write
+
+jobs:
+    build:
+        name: Build and Test
+        runs-on: ubuntu-latest
+        env:
+            CI: false
+
+        strategy:
+            matrix:
+                node-version: [20.x]
+                # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
+
+        steps:
+            - uses: actions/checkout@v3
+
+            - name: Use Node.js ${{ matrix.node-version }}
+              uses: actions/setup-node@v3
+              with:
+                  node-version: ${{ matrix.node-version }}
+                  cache: "npm"
+                  cache-dependency-path: ./website/package-lock.json
+
+            - name: Set up Python
+              uses: actions/setup-python@v3
+              with:
+                  python-version: "3.12"
+
+            - name: Install poetry
+              run: python -m pip install poetry
+
+            - name: Build .whl file
+              run: |
+                  python -m poetry install --all-extras
+                  python -m poetry build
+            
+            - name: Build website
+              run: |
+                  cd website/
+                  npm ci
+                  cd ./packages/playground
+                  npm run build
+            
+            - name: Prepare for Github Pages
+              run: |
+                  mkdir -p ./website_dist
+                  cp -r ./website/packages/playground/dist/* ./website_dist
+                  echo "These are the files that will be packaged"
+                  ls ./website_dist
+
+            - name: Package website deployment
+              uses: actions/upload-pages-artifact@v3
+              id: website_dist
+              with:
+                  path: ./website_dist
+
+    deploy:
+        if: ${{ github.event_name == 'push' }}
+        environment:
+            name: github-pages
+        runs-on: ubuntu-latest
+        needs: build
+        steps:
+            - name: Deploy to GitHub Pages
+              id: website_dist
+              uses: actions/deploy-pages@v4
diff --git a/website/package-lock.json b/website/package-lock.json
diff --git a/website/packages/playground/index.html b/website/packages/playground/index.html
@@ -8,6 +8,6 @@
     </head>
     <body>
         <div id="root"></div>
-        <script type="module" src="/src/main.tsx"></script>
+        <script type="module" src="./src/main.tsx"></script>
     </body>
 </html>
diff --git a/website/packages/playground/package.json b/website/packages/playground/package.json
@@ -17,6 +17,7 @@
         "@types/file-saver": "^2.0.7",
         "bootstrap": "^5.3.3",
         "codemirror": "^6.0.1",
+        "comlink": "^4.4.2",
         "easy-peasy": "^6.0.5",
         "file-saver": "^2.0.5",
         "pyodide": "^0.26.4",

diff --git a/website/packages/playground/src/state/compiler.ts b/website/packages/playground/src/state/compiler.ts
diff --git a/website/packages/playground/src/state/model.ts b/website/packages/playground/src/state/model.ts
@@ -1,9 +1,21 @@
 import { action, Action, Thunk, thunk } from "easy-peasy";
-import { PreFigureCompiler } from "./compiler";
+import { PreFigureCompiler } from "../worker/compiler";
+import * as Comlink from "comlink";
+import Worker from "../worker?worker";
+import type { api } from "../worker";
 
-const compiler = new PreFigureCompiler();
+// Make a local version of the compiler
+let compiler = new PreFigureCompiler();
 (window as any).comp = compiler;
 
+const worker = Comlink.wrap<typeof api>(new Worker());
+console.log(worker, Worker);
+//// Create a worker-based instance of the compiler
+(window as any).compWorker = worker.compiler;
+// The types seem to be wrong. We are not awaiting a promise here. Instead we have a proxy object
+// directly exposed to the main thread.
+compiler = worker.compiler as any as Awaited<typeof worker.compiler>;
+
 export interface PlaygroundModel {
     source: string;
     compiledSource: string;
@@ -56,8 +68,12 @@ export const playgroundModel: PlaygroundModel = {
     loadPyodide: thunk(async (actions) => {
         actions.setStatus("loadingPyodide");
         // Initialize Pyodide
+        const indexURL = new URL(
+            "./assets/pyodide",
+            window.location.href,
+        ).toString();
         await compiler.init({
-            indexURL: "./assets/pyodide",
+            indexURL,
         });
         // Import `prefig` once so that it is cached
         await compiler.pyodide?.runPythonAsync("import prefig");