Merge remote-tracking branch 'refs/remotes/origin/master' into serve-fix

# Conflicts:
#	package-lock.json
#	packages/frontend/webpack.config.js

.github/workflows/math_frontend_docker.yml

@@ -0,0 +1,68 @@
+name: Math corner - Build and Publish Container Image
+
+on:
+  push:
+  workflow_dispatch:
+
+env:
+  REGISTRY: ghcr.io
+  IMAGE_NAME: ${{ github.repository_owner }}/xivgear-mathcorner
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+
+    steps:
+      - uses: actions/checkout@v3
+
+      - name: Use Node.js 20.x
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20.x
+
+      - name: Build
+        run: |
+          npm ci
+          npm run build
+          npm run test
+          npm run docs
+
+      - name: Inject commit info
+        run: |
+          git rev-parse HEAD > packages/math-frontend/dist/version_info.txt
+          git log -1 --pretty=%B >> packages/math-frontend/dist/version_info.txt
+
+      # Docker stuff begins here
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+#        with:
+#          buildkitd-flags: --debug
+
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v2
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Extract metadata Docker
+        id: meta
+        uses: docker/metadata-action@9ec57ed1fcdbf14dcef7dfbe97b2010124a938b7
+        with:
+          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
+
+      - name: Build and export
+        uses: docker/build-push-action@v5
+        with:
+          context: packages/math-frontend
+          push: true
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+          platforms: linux/amd64,linux/arm64
+

package.json

@@ -8,7 +8,9 @@
   "workspaces": [
     "packages/xivmath",
     "packages/core",
+    "packages/common-ui",
     "packages/frontend",
+    "packages/math-frontend",
     "packages/backend-resolver"
   ],
   "devDependencies": {

packages/common-ui/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@xivgear/common-ui",
+  "version": "1.0.0",
+  "description": "",
+  "scripts": {
+    "build": "tsc --build"
+  },
+  "devDependencies": {
+    "ts-node": "^10.9.2",
+    "ts-loader": "^9.4.4",
+    "ts-mocha": "^10.0.0",
+    "chai": "^4.4.1",
+    "@types/chai": "^4.3.16"
+  },
+  "exports": {
+    "./*": "./src/*.ts"
+  },
+  "files": [
+    "package.json",
+    "tsconfig.json",
+    "src/*.ts"
+  ]
+}

packages/common-ui/src/components/level_picker.ts

@@ -0,0 +1,20 @@
+import {DataSelect, FieldBoundDataSelect} from "./util";
+import {CURRENT_MAX_LEVEL, SupportedLevel, SupportedLevels} from "@xivgear/xivmath/xivconstants";
+import {PropertyOfType} from "@xivgear/core/util/types";
+
+export function levelLabel(item: SupportedLevel): string {
+    if (item <= CURRENT_MAX_LEVEL) {
+        return item.toString();
+    }
+    else {
+        return item.toString() + ' (Preview)';
+    }
+}
+
+export function fieldBoundLevelSelect<ObjType>(obj: ObjType, field: PropertyOfType<ObjType, SupportedLevel>): FieldBoundDataSelect<ObjType, SupportedLevel> {
+    return new FieldBoundDataSelect(obj, field, levelLabel, [...SupportedLevels]);
+}
+
+export function levelSelect(callback: (level: SupportedLevel) => void, defaultLevel: SupportedLevel = CURRENT_MAX_LEVEL): DataSelect<SupportedLevel> {
+    return new DataSelect<SupportedLevel>([...SupportedLevels], levelLabel, callback, defaultLevel);
+}

packages/common-ui/src/components/show_hide_chevron.ts

@@ -0,0 +1,36 @@
+import {makeChevronDown} from "./util";
+
+export class ShowHideButton extends HTMLElement {
+    private _hidden: boolean;
+
+    constructor(initiallyHidden: boolean = false, private setter: (newValue: boolean) => void) {
+        super();
+        this._hidden = initiallyHidden;
+        this.appendChild(makeChevronDown());
+        this.setStyles();
+    }
+
+    get isHidden(): boolean {
+        return this._hidden;
+    }
+
+    set isHidden(hide: boolean) {
+        this._hidden = hide;
+        this.setStyles();
+        this.setter(hide);
+    }
+
+    toggle(): void {
+        this.isHidden = !this.isHidden;
+    }
+
+    private setStyles() {
+        if (this.isHidden) {
+            this.classList.add('hidden');
+        }
+        else {
+            this.classList.remove('hidden');
+        }
+    }
+}
+customElements.define("show-hide-button", ShowHideButton);

packages/common-ui/src/components/top_menu.ts

@@ -0,0 +1,45 @@
+import {githubIcon, importIcon, makeCalcIcon, makeDollarIcon, mySheetsIcon, newSheetIcon, settingsIcon} from "./util";
+
+export function applyCommonTopMenuFormatting(link: HTMLAnchorElement) {
+    if (link.getAttribute('formatted') === 'true') {
+        return;
+    }
+    switch (link.textContent) {
+        case 'My Sheets':
+            link.replaceChildren(mySheetsIcon(), textSpan(link.textContent));
+            link.title = 'View your saved sheets';
+            break;
+        case 'New Sheet':
+            link.replaceChildren(newSheetIcon(), textSpan(link.textContent));
+            link.title = 'Create a new sheet from scratch';
+            break;
+        case 'Import':
+            link.replaceChildren(importIcon(), textSpan(link.textContent));
+            link.title = 'Import sheets, sets, or Etro links into a new sheet';
+            break;
+        case 'GitHub':
+            link.replaceChildren(githubIcon());
+            link.title = 'Source code on GitHub';
+            break;
+        case 'Settings':
+            link.replaceChildren(settingsIcon());
+            link.title = 'Light mode, theme, and other settings.';
+            break;
+        case 'Math':
+            link.replaceChildren(makeCalcIcon());
+            link.title = 'Math center';
+            break;
+        case 'Ko-Fi':
+            link.replaceChildren(makeDollarIcon());
+            link.title = 'Donate on Ko-Fi';
+            break;
+    }
+    link.setAttribute('formatted', 'true');
+}
+
+function textSpan(text: string) {
+    const span = document.createElement('span');
+    span.textContent = text;
+    return span;
+}
+