@thomasfarineau/anvil 0.0.2 → 0.0.4

package/src/template/_gitignore

@@ -1,3 +1,4 @@
 node_modules/
+dist/
 src-anvil/target/
 src-anvil/gen/

package/src/template/capabilities/default.json

@@ -3,5 +3,11 @@
   "identifier": "default",
   "description": "enables the default permissions",
   "windows": ["main"],
-  "permissions": ["core:default"]
+  "permissions": [
+    "core:default",
+    "core:window:allow-close",
+    "core:window:allow-minimize",
+    "core:window:allow-toggle-maximize",
+    "core:window:allow-start-dragging"
+  ]
 }

package/src/template/config.json

@@ -1,12 +1,12 @@
 {
-  "$schema": "node_modules/anvil/src/client/config.schema.json",
+  "$schema": "node_modules/@thomasfarineau/anvil/src/client/config.schema.json",
   "identifier": "",
   "target": "",
   "app_name": "My Launcher",
   "data_folder": ".my-launcher",
   "java_version": 21,
   "update_url": "",
-  "logo": "",
+  "logo": "logo.svg",
   "session": "none",
   "window_decorations": true,
   "window_resizable": false,

package/src/template/frontends/react-js/src/App.jsx

@@ -0,0 +1,183 @@
+import { useEffect, useState } from 'react';
+import { MC } from './api.js';
+
+export default function App() {
+  const [config, setConfig] = useState(null);
+  const [status, setStatus] = useState(null);
+  const [view, setView] = useState('loading');
+  const [username, setUsername] = useState('');
+  const [dir, setDir] = useState('');
+  const [progress, setProgress] = useState({});
+  const [installing, setInstalling] = useState(false);
+  const [running, setRunning] = useState([]);
+  const [message, setMessage] = useState('');
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    (async () => {
+      const [cfg, settings, init] = await Promise.all([
+        MC.getConfig(),
+        MC.getSettings(),
+        MC.getInitStatus(),
+      ]);
+      document.title = cfg.app_name;
+      setConfig(cfg);
+      setStatus(init);
+      setUsername(settings.username ?? '');
+      setDir(init.launcher_dir);
+      setView(
+        init.java_ok && init.instances.every((i) => i.installed)
+          ? 'main'
+          : 'setup',
+      );
+
+      MC.on.setupProgress(({ step, current, total, label, error: err }) => {
+        setProgress((p) => ({
+          ...p,
+          [step]: {
+            pct: total > 0 ? Math.round((current * 100) / total) : 0,
+            label,
+            error: err,
+          },
+        }));
+      });
+      MC.on.setupDone(async () => {
+        const s = await MC.getInitStatus();
+        setStatus(s);
+        setInstalling(false);
+        if (s.java_ok && s.instances.every((i) => i.installed)) setView('main');
+      });
+      MC.on.gameStarting((id) => setRunning((r) => [...r, id]));
+      MC.on.gameExit(({ instance_id, code }) => {
+        setRunning((r) => r.filter((x) => x !== instance_id));
+        setMessage(code === 0 ? 'Session ended.' : `Exited with code ${code}.`);
+      });
+    })();
+  }, []);
+
+  async function install() {
+    if (!dir.trim()) {
+      setError('Choose an install folder.');
+      return;
+    }
+    setError('');
+    setInstalling(true);
+    try {
+      const settings = await MC.getSettings();
+      await MC.saveSettings({ ...settings, launcher_dir: dir.trim() });
+      await MC.runSetup();
+    } catch (e) {
+      setError(`Error: ${e}`);
+      setInstalling(false);
+    }
+  }
+
+  async function playOrStop(id) {
+    if (running.includes(id)) {
+      await MC.stop(id).catch(() => {});
+      return;
+    }
+    if (!username.trim()) return;
+    const settings = await MC.getSettings();
+    await MC.saveSettings({ ...settings, username: username.trim() });
+    try {
+      await MC.verify(id);
+      await MC.play(id);
+    } catch (e) {
+      setMessage(`Error: ${e}`);
+    }
+  }
+
+  if (view === 'loading') return null;
+
+  if (view === 'setup') {
+    const steps = [
+      { id: 'java', name: 'Java JRE', installed: status.java_ok },
+      ...config.instances.map((inst) => ({
+        id: inst.id,
+        name: inst.name,
+        installed:
+          status.instances.find((i) => i.id === inst.id)?.installed ?? false,
+      })),
+    ];
+    return (
+      <div id="setup-overlay">
+        <div className="card">
+          <h1>Setup — {config.app_name}</h1>
+          <label>Install folder</label>
+          <div className="dir-row">
+            <input
+              type="text"
+              value={dir}
+              onChange={(e) => setDir(e.target.value)}
+            />
+            <button onClick={async () => setDir(await MC.getDefaultDir())}>
+              Default
+            </button>
+          </div>
+          {steps.map((s) => {
+            const p = progress[s.id];
+            const pct = p ? p.pct : s.installed ? 100 : 0;
+            return (
+              <div className="step" key={s.id}>
+                <div
+                  className="step-name"
+                  style={{ color: s.installed ? '#4caf50' : '#aaa' }}>
+                  {s.installed ? '✓' : '○'} {s.name}
+                </div>
+                <div className="bar-track">
+                  <div
+                    className="bar-fill"
+                    style={{
+                      width: `${pct}%`,
+                      background: p?.error ? '#ef5350' : '#4caf50',
+                    }}
+                  />
+                </div>
+                <div className="step-label">
+                  {p?.label ?? (s.installed ? 'Installed' : '')}
+                </div>
+              </div>
+            );
+          })}
+          <button
+            className="install-btn"
+            disabled={installing}
+            onClick={install}>
+            {installing ? 'Installing…' : 'Install'}
+          </button>
+          <p className="status" style={{ color: '#ef5350' }}>
+            {error}
+          </p>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="card">
+      <div className="brand">
+        {config.logo && <img src={`./${config.logo}`} alt="" />}
+        <h1>{config.app_name}</h1>
+      </div>
+      <label>Username</label>
+      <input
+        type="text"
+        maxLength={16}
+        placeholder="Steve"
+        value={username}
+        onChange={(e) => setUsername(e.target.value)}
+      />
+      {config.instances.map((inst) => (
+        <button
+          key={inst.id}
+          className="instance-btn"
+          disabled={!running.includes(inst.id) && !username.trim()}
+          onClick={() => playOrStop(inst.id)}>
+          {running.includes(inst.id) ? '■  Stop' : `▶  ${inst.name}`}
+        </button>
+      ))}
+      <p className="status">{message}</p>
+    </div>
+  );
+}

package/src/template/frontends/react-js/src/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Launcher</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./main.jsx"></script>
+  </body>
+</html>

package/src/template/frontends/react-js/src/main.jsx

@@ -0,0 +1,5 @@
+import { createRoot } from 'react-dom/client';
+import App from './App.jsx';
+import './style.css';
+
+createRoot(document.getElementById('root')).render(<App />);

package/src/template/frontends/react-js/vite.config.js

@@ -0,0 +1,10 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  root: 'src',
+  plugins: [react()],
+  clearScreen: false,
+  server: { port: 5173, strictPort: true },
+  build: { outDir: '../dist', emptyOutDir: true, target: 'es2022' },
+});

package/src/template/frontends/react-ts/src/App.tsx

@@ -0,0 +1,190 @@
+import { useEffect, useState } from 'react';
+import { MC } from './api.js';
+import type { InitStatus, LauncherConfig } from './api.js';
+
+interface StepProgress {
+  pct: number;
+  label: string;
+  error: boolean;
+}
+
+export default function App() {
+  const [config, setConfig] = useState<LauncherConfig | null>(null);
+  const [status, setStatus] = useState<InitStatus | null>(null);
+  const [view, setView] = useState<'loading' | 'setup' | 'main'>('loading');
+  const [username, setUsername] = useState('');
+  const [dir, setDir] = useState('');
+  const [progress, setProgress] = useState<Record<string, StepProgress>>({});
+  const [installing, setInstalling] = useState(false);
+  const [running, setRunning] = useState<string[]>([]);
+  const [message, setMessage] = useState('');
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    (async () => {
+      const [cfg, settings, init] = await Promise.all([
+        MC.getConfig(),
+        MC.getSettings(),
+        MC.getInitStatus(),
+      ]);
+      document.title = cfg.app_name;
+      setConfig(cfg);
+      setStatus(init);
+      setUsername(settings.username ?? '');
+      setDir(init.launcher_dir);
+      setView(
+        init.java_ok && init.instances.every((i) => i.installed)
+          ? 'main'
+          : 'setup',
+      );
+
+      MC.on.setupProgress(({ step, current, total, label, error: err }) => {
+        setProgress((p) => ({
+          ...p,
+          [step]: {
+            pct: total > 0 ? Math.round((current * 100) / total) : 0,
+            label,
+            error: err,
+          },
+        }));
+      });
+      MC.on.setupDone(async () => {
+        const s = await MC.getInitStatus();
+        setStatus(s);
+        setInstalling(false);
+        if (s.java_ok && s.instances.every((i) => i.installed)) setView('main');
+      });
+      MC.on.gameStarting((id) => setRunning((r) => [...r, id]));
+      MC.on.gameExit(({ instance_id, code }) => {
+        setRunning((r) => r.filter((x) => x !== instance_id));
+        setMessage(code === 0 ? 'Session ended.' : `Exited with code ${code}.`);
+      });
+    })();
+  }, []);
+
+  async function install() {
+    if (!dir.trim()) {
+      setError('Choose an install folder.');
+      return;
+    }
+    setError('');
+    setInstalling(true);
+    try {
+      const settings = await MC.getSettings();
+      await MC.saveSettings({ ...settings, launcher_dir: dir.trim() });
+      await MC.runSetup();
+    } catch (e) {
+      setError(`Error: ${e}`);
+      setInstalling(false);
+    }
+  }
+
+  async function playOrStop(id: string) {
+    if (running.includes(id)) {
+      await MC.stop(id).catch(() => {});
+      return;
+    }
+    if (!username.trim()) return;
+    const settings = await MC.getSettings();
+    await MC.saveSettings({ ...settings, username: username.trim() });
+    try {
+      await MC.verify(id);
+      await MC.play(id);
+    } catch (e) {
+      setMessage(`Error: ${e}`);
+    }
+  }
+
+  if (view === 'loading' || !config || !status) return null;
+
+  if (view === 'setup') {
+    const steps = [
+      { id: 'java', name: 'Java JRE', installed: status.java_ok },
+      ...config.instances.map((inst) => ({
+        id: inst.id,
+        name: inst.name,
+        installed:
+          status.instances.find((i) => i.id === inst.id)?.installed ?? false,
+      })),
+    ];
+    return (
+      <div id="setup-overlay">
+        <div className="card">
+          <h1>Setup — {config.app_name}</h1>
+          <label>Install folder</label>
+          <div className="dir-row">
+            <input
+              type="text"
+              value={dir}
+              onChange={(e) => setDir(e.target.value)}
+            />
+            <button onClick={async () => setDir(await MC.getDefaultDir())}>
+              Default
+            </button>
+          </div>
+          {steps.map((s) => {
+            const p = progress[s.id];
+            const pct = p ? p.pct : s.installed ? 100 : 0;
+            return (
+              <div className="step" key={s.id}>
+                <div
+                  className="step-name"
+                  style={{ color: s.installed ? '#4caf50' : '#aaa' }}>
+                  {s.installed ? '✓' : '○'} {s.name}
+                </div>
+                <div className="bar-track">
+                  <div
+                    className="bar-fill"
+                    style={{
+                      width: `${pct}%`,
+                      background: p?.error ? '#ef5350' : '#4caf50',
+                    }}
+                  />
+                </div>
+                <div className="step-label">
+                  {p?.label ?? (s.installed ? 'Installed' : '')}
+                </div>
+              </div>
+            );
+          })}
+          <button
+            className="install-btn"
+            disabled={installing}
+            onClick={install}>
+            {installing ? 'Installing…' : 'Install'}
+          </button>
+          <p className="status" style={{ color: '#ef5350' }}>
+            {error}
+          </p>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="card">
+      <div className="brand">
+        {config.logo && <img src={`./${config.logo}`} alt="" />}
+        <h1>{config.app_name}</h1>
+      </div>
+      <label>Username</label>
+      <input
+        type="text"
+        maxLength={16}
+        placeholder="Steve"
+        value={username}
+        onChange={(e) => setUsername(e.target.value)}
+      />
+      {config.instances.map((inst) => (
+        <button
+          key={inst.id}
+          className="instance-btn"
+          disabled={!running.includes(inst.id) && !username.trim()}
+          onClick={() => playOrStop(inst.id)}>
+          {running.includes(inst.id) ? '■  Stop' : `▶  ${inst.name}`}
+        </button>
+      ))}
+      <p className="status">{message}</p>
+    </div>
+  );
+}

package/src/template/frontends/react-ts/src/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Launcher</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./main.tsx"></script>
+  </body>
+</html>

package/src/template/frontends/react-ts/src/main.tsx

@@ -0,0 +1,5 @@
+import { createRoot } from 'react-dom/client';
+import App from './App.tsx';
+import './style.css';
+
+createRoot(document.getElementById('root')!).render(<App />);

package/src/template/frontends/react-ts/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "jsx": "react-jsx",
+    "strict": true,
+    "noEmit": true,
+    "skipLibCheck": true,
+    "useDefineForClassFields": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable"]
+  },
+  "include": ["src"]
+}

package/src/template/frontends/react-ts/vite.config.ts

@@ -0,0 +1,10 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  root: 'src',
+  plugins: [react()],
+  clearScreen: false,
+  server: { port: 5173, strictPort: true },
+  build: { outDir: '../dist', emptyOutDir: true, target: 'es2022' },
+});

package/src/template/frontends/solid-js/src/App.jsx

@@ -0,0 +1,190 @@
+import { For, Show, createSignal, onMount } from 'solid-js';
+import { MC } from './api.js';
+
+export default function App() {
+  const [config, setConfig] = createSignal(null);
+  const [status, setStatus] = createSignal(null);
+  const [view, setView] = createSignal('loading');
+  const [username, setUsername] = createSignal('');
+  const [dir, setDir] = createSignal('');
+  const [progress, setProgress] = createSignal({});
+  const [installing, setInstalling] = createSignal(false);
+  const [running, setRunning] = createSignal([]);
+  const [message, setMessage] = createSignal('');
+  const [error, setError] = createSignal('');
+
+  onMount(async () => {
+    const [cfg, settings, init] = await Promise.all([
+      MC.getConfig(),
+      MC.getSettings(),
+      MC.getInitStatus(),
+    ]);
+    document.title = cfg.app_name;
+    setConfig(cfg);
+    setStatus(init);
+    setUsername(settings.username ?? '');
+    setDir(init.launcher_dir);
+    setView(
+      init.java_ok && init.instances.every((i) => i.installed)
+        ? 'main'
+        : 'setup',
+    );
+
+    MC.on.setupProgress(({ step, current, total, label, error: err }) => {
+      setProgress((p) => ({
+        ...p,
+        [step]: {
+          pct: total > 0 ? Math.round((current * 100) / total) : 0,
+          label,
+          error: err,
+        },
+      }));
+    });
+    MC.on.setupDone(async () => {
+      const s = await MC.getInitStatus();
+      setStatus(s);
+      setInstalling(false);
+      if (s.java_ok && s.instances.every((i) => i.installed)) setView('main');
+    });
+    MC.on.gameStarting((id) => setRunning((r) => [...r, id]));
+    MC.on.gameExit(({ instance_id, code }) => {
+      setRunning((r) => r.filter((x) => x !== instance_id));
+      setMessage(code === 0 ? 'Session ended.' : `Exited with code ${code}.`);
+    });
+  });
+
+  const steps = () => {
+    if (!config() || !status()) return [];
+    return [
+      { id: 'java', name: 'Java JRE', installed: status().java_ok },
+      ...config().instances.map((inst) => ({
+        id: inst.id,
+        name: inst.name,
+        installed:
+          status().instances.find((i) => i.id === inst.id)?.installed ?? false,
+      })),
+    ];
+  };
+
+  async function install() {
+    if (!dir().trim()) {
+      setError('Choose an install folder.');
+      return;
+    }
+    setError('');
+    setInstalling(true);
+    try {
+      const settings = await MC.getSettings();
+      await MC.saveSettings({ ...settings, launcher_dir: dir().trim() });
+      await MC.runSetup();
+    } catch (e) {
+      setError(`Error: ${e}`);
+      setInstalling(false);
+    }
+  }
+
+  async function playOrStop(id) {
+    if (running().includes(id)) {
+      await MC.stop(id).catch(() => {});
+      return;
+    }
+    if (!username().trim()) return;
+    const settings = await MC.getSettings();
+    await MC.saveSettings({ ...settings, username: username().trim() });
+    try {
+      await MC.verify(id);
+      await MC.play(id);
+    } catch (e) {
+      setMessage(`Error: ${e}`);
+    }
+  }
+
+  return (
+    <>
+      <Show when={view() === 'setup'}>
+        <div id="setup-overlay">
+          <div class="card">
+            <h1>Setup — {config().app_name}</h1>
+            <label>Install folder</label>
+            <div class="dir-row">
+              <input
+                type="text"
+                value={dir()}
+                onInput={(e) => setDir(e.currentTarget.value)}
+              />
+              <button onClick={async () => setDir(await MC.getDefaultDir())}>
+                Default
+              </button>
+            </div>
+            <For each={steps()}>
+              {(s) => {
+                const p = () => progress()[s.id];
+                const pct = () => p()?.pct ?? (s.installed ? 100 : 0);
+                return (
+                  <div class="step">
+                    <div
+                      class="step-name"
+                      style={{ color: s.installed ? '#4caf50' : '#aaa' }}>
+                      {s.installed ? '✓' : '○'} {s.name}
+                    </div>
+                    <div class="bar-track">
+                      <div
+                        class="bar-fill"
+                        style={{
+                          width: `${pct()}%`,
+                          background: p()?.error ? '#ef5350' : '#4caf50',
+                        }}
+                      />
+                    </div>
+                    <div class="step-label">
+                      {p()?.label ?? (s.installed ? 'Installed' : '')}
+                    </div>
+                  </div>
+                );
+              }}
+            </For>
+            <button
+              class="install-btn"
+              disabled={installing()}
+              onClick={install}>
+              {installing() ? 'Installing…' : 'Install'}
+            </button>
+            <p class="status" style={{ color: '#ef5350' }}>
+              {error()}
+            </p>
+          </div>
+        </div>
+      </Show>
+
+      <Show when={view() === 'main'}>
+        <div class="card">
+          <div class="brand">
+            <Show when={config().logo}>
+              <img src={`./${config().logo}`} alt="" />
+            </Show>
+            <h1>{config().app_name}</h1>
+          </div>
+          <label>Username</label>
+          <input
+            type="text"
+            maxLength={16}
+            placeholder="Steve"
+            value={username()}
+            onInput={(e) => setUsername(e.currentTarget.value)}
+          />
+          <For each={config().instances}>
+            {(inst) => (
+              <button
+                class="instance-btn"
+                disabled={!running().includes(inst.id) && !username().trim()}
+                onClick={() => playOrStop(inst.id)}>
+                {running().includes(inst.id) ? '■  Stop' : `▶  ${inst.name}`}
+              </button>
+            )}
+          </For>
+          <p class="status">{message()}</p>
+        </div>
+      </Show>
+    </>
+  );
+}

package/src/template/frontends/solid-js/src/index.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Launcher</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./main.jsx"></script>
+  </body>
+</html>