99 lines
3.4 KiB
HTML
99 lines
3.4 KiB
HTML
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
|
<title>Pixibot Photo Console</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="page-shell">
|
|
<header class="topbar">
|
|
<div class="brand-block">
|
|
<div class="brand-mark">SP</div>
|
|
<div>
|
|
<div class="eyebrow">AI Photographer</div>
|
|
<div class="title">Pixibot Photo Console</div>
|
|
</div>
|
|
</div>
|
|
<div class="top-actions">
|
|
<button id="top_status" class="btn ghost">Status</button>
|
|
<button id="top_capture" class="btn primary">Capture</button>
|
|
<button id="top_test" class="btn ghost">Camera Test</button>
|
|
<button id="top_fix" class="btn ghost danger">Fix Camera</button>
|
|
</div>
|
|
</header>
|
|
|
|
<section class="meta-strip">
|
|
<div class="meta-pill">Photos folder: <code>{{PHOTOS_DIR}}</code></div>
|
|
<div class="meta-pill">Dashboard and camera controls stay live across mode switches.</div>
|
|
</section>
|
|
|
|
<main class="dashboard-layout">
|
|
<section class="dashboard-main">
|
|
<div id="controls"></div>
|
|
</section>
|
|
|
|
<aside class="dashboard-side">
|
|
<section class="panel gallery-panel">
|
|
<div class="panel-header">
|
|
<div>
|
|
<div class="panel-eyebrow">Gallery</div>
|
|
<h2>Recent Photos</h2>
|
|
</div>
|
|
</div>
|
|
<div id="list" class="cards-grid">{{PHOTO_CARDS}}</div>
|
|
</section>
|
|
|
|
<section class="panel people-panel">
|
|
<div class="panel-header">
|
|
<div>
|
|
<div class="panel-eyebrow">Recognition</div>
|
|
<h2>People Registry</h2>
|
|
</div>
|
|
</div>
|
|
<div class="action-row">
|
|
<button id="people_upload_btn" class="btn ghost">Upload Face Photo</button>
|
|
<button id="people_reset_btn" class="btn ghost danger">Reset Registry</button>
|
|
<input id="people_upload_file" type="file" accept="image/*" style="display:none;">
|
|
</div>
|
|
<div id="people_status_box" class="status-box">People registry loading...</div>
|
|
<div id="people_list" class="people-grid"></div>
|
|
</section>
|
|
</aside>
|
|
</main>
|
|
</div>
|
|
|
|
<div id="preview_modal" class="modal" style="display:none">
|
|
<div class="modal-content">
|
|
<button id="modal_close" class="modal-close">✕</button>
|
|
<img id="modal_img" src="" alt="photo preview" />
|
|
<div id="modal_actions" class="modal-actions"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="scripts_modal" class="modal" style="display:none">
|
|
<div class="modal-content modal-wide">
|
|
<button id="scripts_modal_close" class="modal-close">✕</button>
|
|
<h3>Manage Pixibot Scripts</h3>
|
|
<div id="scripts_list"></div>
|
|
<hr/>
|
|
<div>
|
|
<label>Upload new script (filename):</label>
|
|
<input id="script_filename" placeholder="my_script.txt" style="width:40%" />
|
|
<button id="script_upload" class="btn ghost">Upload</button>
|
|
</div>
|
|
<div style="margin-top:8px;">
|
|
<label>Edit active Pixibot script:</label>
|
|
<textarea id="script_editor" class="script-editor"></textarea>
|
|
<div style="text-align:right;margin-top:6px;">
|
|
<button id="script_save" class="btn primary">Save active script</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/static/gallery.js"></script>
|
|
</body>
|
|
</html>
|