Files
cnc_wams/wasm-port/runtime/ui/ini-panel/launch.html

171 lines
6.4 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>LinuxCNC INI Panel Launch</title>
<style>
:root {
color-scheme: light;
--bg: #f2f5f8;
--panel: #ffffff;
--border: #cfd8e1;
--text: #17212b;
--muted: #5a6875;
--accent: #1366a6;
}
* { box-sizing: border-box; }
body {
margin: 0;
font-family: "Segoe UI", "Noto Sans", sans-serif;
background: var(--bg);
color: var(--text);
}
main {
max-width: 960px;
margin: 0 auto;
padding: 24px;
display: grid;
gap: 16px;
}
.panel {
background: var(--panel);
border: 1px solid var(--border);
border-radius: 8px;
box-shadow: 0 10px 30px rgba(17, 34, 51, 0.06);
padding: 16px;
display: grid;
gap: 14px;
}
h1 {
margin: 0;
font-size: 18px;
font-weight: 600;
}
.links {
display: grid;
gap: 8px;
}
.handoff-status {
border-top: 1px solid var(--border);
padding-top: 12px;
display: grid;
gap: 8px;
}
.handoff-status dl {
margin: 0;
display: grid;
grid-template-columns: minmax(120px, 180px) 1fr;
gap: 6px 12px;
font: 13px/1.4 "Segoe UI", "Noto Sans", sans-serif;
}
.handoff-status dt {
color: var(--muted);
}
.handoff-status dd {
margin: 0;
color: var(--text);
overflow-wrap: anywhere;
}
a {
color: var(--accent);
text-decoration: none;
font: 14px/1.4 "Segoe UI", "Noto Sans", sans-serif;
}
a:hover {
text-decoration: underline;
}
p {
margin: 0;
color: var(--muted);
font: 13px/1.5 "Segoe UI", "Noto Sans", sans-serif;
}
</style>
</head>
<body>
<main>
<section class="panel">
<h1>LinuxCNC INI Panel</h1>
<p>Choose the editable panel or the read-only control view.</p>
<div class="links">
<a data-entry-id="edit-run" href="./index.html">Open edit and run panel</a>
<a data-entry-id="control-view" href="./control-page.html">Open read-only control view</a>
</div>
<section class="handoff-status" aria-label="Shell handoff compatibility" data-handoff-shell>
<p data-handoff-status>Checking shell handoff compatibility.</p>
<dl data-handoff-rows></dl>
</section>
</section>
</main>
<script type="module">
import {
createIniPanelLauncherLinkViewModel,
createIniPanelShellViewModel,
isSupportedIniPanelLaunchApiManifest,
} from "./ui-shell.js";
const shellViewModel = createIniPanelShellViewModel();
const links = shellViewModel.launcherLinks;
for (const linkModel of links) {
const link = document.querySelector(`a[data-entry-id="${linkModel.entryId}"]`);
if (!link) {
throw new Error(`Missing launcher entry ${linkModel.entryId}`);
}
link.textContent = linkModel.label;
link.href = linkModel.href;
}
const handoffRenderState = shellViewModel.shellSessionHandoffPackageRenderState;
const handoffShell = document.querySelector("[data-handoff-shell]");
handoffShell.dataset.handoffPhase = handoffRenderState.dataset.handoffPhase;
handoffShell.dataset.handoffReady = handoffRenderState.dataset.handoffReady;
handoffShell.dataset.handoffScope = handoffRenderState.dataset.handoffScope;
document.querySelector("[data-handoff-status]").textContent = handoffRenderState.statusLine;
const handoffRows = document.querySelector("[data-handoff-rows]");
for (const row of handoffRenderState.rows) {
const term = document.createElement("dt");
term.dataset.handoffRow = row.id;
term.textContent = row.label;
const detail = document.createElement("dd");
detail.dataset.handoffValue = row.id;
detail.textContent = row.value;
handoffRows.append(term, detail);
}
window.linuxCncIniPanelLaunchApi = {
isSupportedLaunchApiManifest: isSupportedIniPanelLaunchApiManifest,
getLaunchApiSchema: () => shellViewModel.launchApiSchema,
getLaunchApiManifest: () => shellViewModel.launchApiManifest,
getShellIntegrationSchema: () => shellViewModel.shellIntegrationSchema,
getShellIntegrationManifest: () => shellViewModel.shellIntegrationManifest,
getShellIntegrationReadiness: () => shellViewModel.shellIntegrationReadiness,
getShellSessionHandoffSummarySchema: () => shellViewModel.shellSessionHandoffSummarySchema,
getShellSessionHandoffSummary: () => shellViewModel.shellSessionHandoffSummary,
isSupportedShellSessionHandoffSummary: shellViewModel.isSupportedShellSessionHandoffSummary,
getShellSessionHandoffCompatibilityReport: () => shellViewModel.shellSessionHandoffCompatibilityReport,
getShellSessionHandoffDisplayViewModel: () => shellViewModel.shellSessionHandoffDisplayViewModel,
getShellSessionHandoffSnapshot: () => shellViewModel.shellSessionHandoffSnapshot,
getShellSessionHandoffRenderState: () => shellViewModel.shellSessionHandoffRenderState,
getShellSessionHandoffActionPlan: () => shellViewModel.shellSessionHandoffActionPlan,
getShellSessionHandoffChecklist: () => shellViewModel.shellSessionHandoffChecklist,
getShellSessionHandoffPackageSchema: () => shellViewModel.shellSessionHandoffPackageSchema,
getShellSessionHandoffPackage: () => shellViewModel.shellSessionHandoffPackage,
getShellSessionHandoffPackageReport: () => shellViewModel.shellSessionHandoffPackageReport,
getShellSessionHandoffPackageDisplayViewModel: () => shellViewModel.shellSessionHandoffPackageDisplayViewModel,
getShellSessionHandoffPackageRenderState: () => shellViewModel.shellSessionHandoffPackageRenderState,
getShellSessionHandoffPackageMountState: (sessionLoadState) => (
sessionLoadState
? shellViewModel.createShellSessionHandoffPackageMountState({
handoffPackage: shellViewModel.shellSessionHandoffPackage,
packageRenderState: shellViewModel.shellSessionHandoffPackageRenderState,
sessionLoadState,
})
: shellViewModel.shellSessionHandoffPackageMountState
),
isSupportedShellSessionHandoffPackage: shellViewModel.isSupportedShellSessionHandoffPackage,
getLauncherLinks: () => shellViewModel.launcherLinks,
getControlPageApiMethods: () => shellViewModel.controlPage.browserApiMethods,
};
</script>
</body>
</html>