Files
ha-dashboard-studio/dashboard_studio/web/index.html
T
veenm 05df0561b0 Dashboard Studio 2.2.1: sports match centre, Import JSON back, no double entities
- Sports card: crests in team colours, position and record, countdown,
  win-probability bar, live clock and last play, venue
- Import JSON back in the builder's menu
- Fixed: picking an entity with the keyboard added it twice; existing
  duplicates are removed when dashboards load

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 11:22:34 +01:00

107 lines
6.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="theme-color" content="#f2f2f7" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#0f0f11" media="(prefers-color-scheme: dark)">
<meta name="ds-version" content="__VERSION__">
<title>Dashboard Studio</title>
<link rel="icon" type="image/png" href="static/favicon.png">
<link rel="stylesheet" href="static/style.css">
<!-- Home Assistant only serves this app to a signed-in browser: the manifest has to be fetched with the cookie -->
<link rel="manifest" href="manifest.webmanifest" crossorigin="use-credentials">
<link rel="apple-touch-icon" href="static/apple-touch-icon.png">
<meta name="theme-color" content="#0f1526">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="Dashboards">
</head>
<body>
<div id="app">
<header id="topbar" role="toolbar" aria-label="Dashboard">
<div class="tb-group">
<label class="picker">
<span class="sr-only" data-i18n>Dashboard</span>
<select id="dash-select"></select>
<svg class="i" viewBox="0 0 24 24" aria-hidden="true"><path d="M6 9l6 6 6-6"/></svg>
</label>
<button id="btn-new" class="btn icon" aria-label="New dashboard" title="New dashboard"></button>
</div>
<div class="tb-group">
<span id="conn" class="conn" role="status" data-i18n>Offline</span>
<span id="save-status" class="save-status edit-only" role="status"></span>
<span class="edit-only tb-group">
<button id="btn-undo" class="btn icon" aria-label="Undo" title="Undo (⌘Z)"></button>
<button id="btn-redo" class="btn icon" aria-label="Redo" title="Redo (⇧⌘Z)"></button>
<button id="btn-menu" class="btn icon" aria-label="More actions" aria-haspopup="menu" aria-expanded="false" title="More actions"></button>
</span>
<button id="btn-guest" class="btn view-only" hidden><span data-i18n>Guest mode</span></button>
<button id="btn-app" class="btn icon view-only" aria-label="Install as an app" title="Install as an app"></button>
<button id="btn-kiosk" class="btn view-only label-wide" aria-label="Kiosk" title="Kiosk mode"><span data-i18n>Kiosk</span></button>
<div id="mode-seg" class="mode-seg" role="tablist" aria-label="Screen" hidden>
<button role="tab" data-mode="dashboard" data-icon="layout"><span data-i18n>Dashboard</span></button>
<button role="tab" data-mode="builder" data-icon="edit"><span data-i18n>Builder</span></button>
<button role="tab" data-mode="admin" data-icon="shield"><span data-i18n>Admin</span></button>
</div>
</div>
<div id="menu" class="menu" role="menu" hidden>
<button role="menuitem" data-menu="rename" data-icon="edit" data-i18n>Rename…</button>
<button role="menuitem" data-menu="suggest" data-icon="search" data-i18n>Devices not on a dashboard…</button>
<button role="menuitem" data-menu="history" data-icon="history" data-i18n>Version history…</button>
<button role="menuitem" data-menu="undo-history" data-icon="undo" data-i18n>Undo history…</button>
<button role="menuitem" data-menu="share" data-icon="share" data-i18n>Share…</button>
<button role="menuitem" data-menu="export" data-icon="exit" data-i18n>Export as JSON</button>
<button role="menuitem" data-menu="import" data-icon="plus" data-i18n>Import JSON…</button>
</div>
</header>
<div id="workspace">
<aside id="palette" class="edit-only" aria-label="Widgets">
<button class="sheet-close btn icon" aria-label="Close" title="Close">×</button>
<div class="panel-title" data-i18n>Add widget</div>
<input id="palette-search" class="input" type="search" aria-label="Search widgets" autocomplete="off" spellcheck="false">
<div id="palette-list"></div>
<p class="hint" data-i18n>Click to add. Drag to move, drag the corner to resize. Shift-click to select several. Arrow keys move the selected widget, Shift+arrows resize, ⌘D duplicates, Delete removes.</p>
</aside>
<main id="stage">
<nav id="tabnav" aria-label="Tabs" hidden></nav>
<div id="canvas"><div id="grid"></div></div>
</main>
<aside id="inspector" class="edit-only" aria-label="Inspector"></aside>
</div>
<!-- Admin: dashboards, people, devices, the Haven app, activity -->
<section id="admin" hidden aria-label="Admin">
<nav class="adm-nav" role="tablist" aria-label="Admin"></nav>
<div class="adm-body"></div>
</section>
</div>
<div id="edit-bar" class="edit-only"><button class="btn" id="eb-add"><span data-i18n>Add</span></button><button class="btn primary" id="eb-insp"></button></div>
<div id="sheet-backdrop" hidden></div>
<div id="saver" hidden aria-hidden="true"><div class="photos"><img class="ph-layer" alt=""><img class="ph-layer" alt=""><div class="ph-msg"></div></div><div class="saver-clock"><div class="time num"></div><div class="date"></div></div></div>
<div id="doorbell" hidden role="alertdialog" aria-modal="true" aria-labelledby="db-title"><div class="db-cam"></div><div class="db-bar"><div class="db-title" id="db-title"></div><button class="btn db-close">Close</button></div></div>
<div id="night-dim" aria-hidden="true"></div>
<div id="preview-bar" hidden role="status"><span class="pv-text"></span><button class="btn" id="pv-stop"><span data-i18n>Stop preview</span></button></div>
<div id="empty-note" hidden role="status"><div class="en-card"><div class="en-ico"></div><h2 data-i18n>Nothing to show yet</h2><p class="en-text"></p></div></div>
<button id="phone-menu" class="btn icon" aria-label="Menu" title="Menu"></button>
<div id="offline-note" hidden role="status"></div>
<div id="ptr" hidden aria-hidden="true"><svg viewBox="0 0 24 24"><path d="M20 11a8 8 0 1 0-2.3 5.7M20 4v7h-7"/></svg></div>
<div id="announce" hidden role="alertdialog" aria-modal="true" aria-labelledby="an-title"><div class="an-card"><div class="an-ico"></div><div class="an-title" id="an-title"></div><div class="an-msg"></div><button class="btn primary an-ok">OK</button></div></div>
<div id="modal" class="modal" hidden><div class="modal-card" role="dialog" aria-modal="true"></div></div>
<div id="toasts" aria-live="polite"></div>
<input type="file" id="import-file" accept="application/json,.json" hidden>
<script src="static/i18n.js"></script>
<script src="static/icons.js"></script>
<script src="static/qr.js"></script>
<script src="static/widgets.js"></script>
<script src="static/app.js"></script>
</body>
</html>