File size: 13,661 Bytes
038574d | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 | <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Maester Content Studio</title>
<link rel="stylesheet" href="/studio/styles.css">
</head>
<body>
<aside class="sidebar" id="sidebar">
<div class="brand"><span class="brand-mark">M</span><span>Maester</span></div>
<nav aria-label="Workspace">
<button class="nav-item active" data-view="overview"><span>⌂</span>Overview</button>
<button class="nav-item" data-view="campaigns"><span>▤</span>Campaigns</button>
<button class="nav-item" data-view="editor"><span>✎</span>Editor</button>
<button class="nav-item" data-view="calendar"><span>□</span>Calendar</button>
<button class="nav-item" data-view="jobs"><span>▷</span>Jobs</button>
<button class="nav-item" data-view="analytics"><span>⌁</span>Analytics</button>
<button class="nav-item" data-view="assets"><span>▧</span>Assets</button>
<button class="nav-item" data-view="reviews"><span>✓</span>Reviews</button>
<button class="nav-item" data-view="integrations"><span>⌘</span>Integrations</button>
<button class="nav-item" data-view="operations"><span>⚙</span>Operations</button>
</nav>
<div class="sidebar-foot"><span class="status-dot"></span><span id="connection-label">Connecting</span></div>
</aside>
<div class="workspace">
<header class="topbar">
<button class="icon-button mobile-only" id="menu-button" title="Open navigation" aria-label="Open navigation">☰</button>
<div><h1 id="view-title">Overview</h1><p id="view-context">Content operations</p></div>
<div class="top-actions">
<select id="workspace-filter" aria-label="Workspace"><option value="">All workspaces</option></select>
<button class="icon-button" id="refresh-button" title="Refresh" aria-label="Refresh">↻</button>
<button class="icon-button" id="settings-button" title="API settings" aria-label="API settings">⚙</button>
</div>
</header>
<main>
<section class="view active" id="view-overview">
<div class="metric-grid" id="overview-metrics"></div>
<div class="two-column">
<section class="surface"><div class="section-head"><h2>Production Queue</h2><button class="command" data-action="process-queue">Process next</button></div><div id="overview-queue"></div></section>
<section class="surface"><div class="section-head"><h2>Performance</h2></div><div id="overview-performance"></div></section>
</div>
<section class="surface"><div class="section-head"><h2>Review Pipeline</h2></div><div id="overview-approvals"></div></section>
</section>
<section class="view" id="view-campaigns">
<div class="toolbar"><button class="command primary" data-dialog="campaign-dialog">＋ New campaign</button><button class="command" data-dialog="repurpose-dialog">Repurpose long-form</button></div>
<section class="surface table-surface"><table><thead><tr><th>Campaign</th><th>Topic</th><th>Platforms</th><th>Variants</th><th>Status</th><th></th></tr></thead><tbody id="campaign-table"></tbody></table></section>
</section>
<section class="view" id="view-editor">
<div class="editor-layout">
<section class="surface variant-browser"><div class="section-head"><h2>Variants</h2><select id="editor-campaign-filter"><option value="">All campaigns</option></select></div><div id="variant-list" class="selection-list"></div></section>
<section class="surface editor-panel" id="variant-editor"><div class="empty-state">Select a variant</div></section>
<aside class="surface inspector" id="variant-inspector"><div class="empty-state">No selection</div></aside>
</div>
</section>
<section class="view" id="view-calendar">
<div class="toolbar"><select id="calendar-campaign"></select><input id="calendar-start" type="datetime-local"><button class="command primary" data-action="apply-schedule">Apply schedule</button></div>
<section class="surface table-surface"><table><thead><tr><th>Date</th><th>Platform</th><th>Variant</th><th>Status</th></tr></thead><tbody id="calendar-table"></tbody></table></section>
</section>
<section class="view" id="view-jobs">
<div class="toolbar"><button class="command primary" data-action="process-queue">▶ Process next</button><select id="job-filter"><option value="">All states</option><option>queued</option><option>running</option><option>rendering</option><option>ready</option><option>scheduled</option><option>published</option><option>failed</option><option>cancelled</option></select></div>
<section class="surface table-surface"><table><thead><tr><th>Job</th><th>Kind</th><th>State</th><th>Attempts</th><th>Updated</th><th></th></tr></thead><tbody id="job-table"></tbody></table></section>
</section>
<section class="view" id="view-analytics">
<div class="metric-grid" id="analytics-metrics"></div>
<div class="two-column">
<section class="surface"><div class="section-head"><h2>Winner Board</h2></div><div id="winner-board"></div></section>
<section class="surface"><div class="section-head"><h2>Ingest Metrics</h2></div><form id="analytics-form" class="form-grid compact"><label>Variant<select name="variant_id" id="analytics-variant" required></select></label><label>Platform<select name="platform"><option>tiktok</option><option>instagram_reels</option><option>facebook_shorts</option><option>youtube_shorts</option></select></label><label>Views<input name="views" type="number" min="0" value="0"></label><label>Likes<input name="likes" type="number" min="0" value="0"></label><label>Comments<input name="comments" type="number" min="0" value="0"></label><label>Shares<input name="shares" type="number" min="0" value="0"></label><label>Completion<input name="completion_rate" type="number" min="0" max="1" step="0.01" value="0"></label><button class="command primary" type="submit">Record</button></form></section>
</div>
<section class="surface"><div class="section-head"><h2>Experiments</h2><button class="command" data-action="new-experiment">＋ Experiment</button></div><div id="experiment-list"></div></section>
</section>
<section class="view" id="view-assets">
<div class="toolbar"><form id="asset-form" class="inline-form"><input name="file" type="file" required><input name="license" placeholder="License" value="owned"><input name="attribution" placeholder="Attribution"><input name="tags" placeholder="Tags, comma separated"><button class="command primary" type="submit">Upload</button></form></div>
<section class="surface table-surface"><table><thead><tr><th>Asset</th><th>Kind</th><th>Size</th><th>Rights</th><th>Tags</th><th></th></tr></thead><tbody id="asset-table"></tbody></table></section>
</section>
<section class="view" id="view-reviews">
<div class="two-column">
<section class="surface"><div class="section-head"><h2>Create Review</h2></div><form id="review-form"><label>Variants<select id="review-variants" name="variant_ids" multiple required></select></label><div class="form-row"><label>Expires in days<input name="expires_in_days" type="number" min="1" max="30" value="7"></label><label>Reviewer label<input name="created_by" value="Content team"></label></div><button class="command primary" type="submit">Create link</button></form><div id="review-result"></div></section>
<section class="surface"><div class="section-head"><h2>Pending Approval</h2></div><div id="pending-reviews"></div></section>
</div>
</section>
<section class="view" id="view-integrations">
<div class="two-column">
<section class="surface"><div class="section-head"><h2>Social Accounts</h2><button class="command" data-dialog="account-dialog">＋ Account</button></div><div id="account-list"></div></section>
<section class="surface"><div class="section-head"><h2>Delivery Integrations</h2><button class="command" data-dialog="integration-dialog">＋ Integration</button></div><div id="integration-list"></div></section>
</div>
<section class="surface"><div class="section-head"><h2>Automation Rules</h2><button class="command" data-action="new-rule">＋ Rule</button></div><div id="rule-list"></div></section>
</section>
<section class="view" id="view-operations">
<div class="metric-grid" id="ops-metrics"></div>
<div class="two-column"><section class="surface"><div class="section-head"><h2>Provider Status</h2></div><div id="provider-status"></div></section><section class="surface"><div class="section-head"><h2>Service Status</h2></div><div id="service-status"></div></section></div>
<section class="surface table-surface"><div class="section-head"><h2>Audit Log</h2></div><table><thead><tr><th>Time</th><th>Actor</th><th>Action</th><th>Resource</th></tr></thead><tbody id="audit-table"></tbody></table></section>
</section>
</main>
</div>
<div id="toast-region" aria-live="polite"></div>
<dialog id="settings-dialog"><form method="dialog" id="settings-form"><div class="dialog-head"><h2>API Settings</h2><button class="icon-button" value="cancel" aria-label="Close">×</button></div><label>API key<input id="api-key" type="password" autocomplete="off"></label><div class="dialog-actions"><button class="command" value="cancel">Cancel</button><button class="command primary" value="default">Save</button></div></form></dialog>
<dialog id="campaign-dialog"><form method="dialog" id="campaign-form"><div class="dialog-head"><h2>New Campaign</h2><button class="icon-button" value="cancel" aria-label="Close">×</button></div><div class="form-grid"><label>Name<input name="name" required></label><label>Topic<input name="topic" required></label><label>Niche<input name="niche"></label><label>Audience<input name="target_audience"></label><label>Quantity<input name="quantity" type="number" min="1" max="100" value="5"></label><label>Brand kit<select name="brand_kit_id" id="campaign-brand"><option value="">None</option></select></label><label class="span-2">Source URL<input name="source_url" type="url"></label><label class="span-2">Tone<input name="tone" value="clear, punchy, high-retention"></label></div><fieldset><legend>Platforms</legend><div class="check-row"><label><input type="checkbox" name="platforms" value="tiktok" checked>TikTok</label><label><input type="checkbox" name="platforms" value="instagram_reels" checked>Instagram</label><label><input type="checkbox" name="platforms" value="facebook_shorts">Facebook</label><label><input type="checkbox" name="platforms" value="youtube_shorts" checked>YouTube</label></div></fieldset><div class="dialog-actions"><button class="command" value="cancel">Cancel</button><button class="command primary" value="default">Create and generate</button></div></form></dialog>
<dialog id="repurpose-dialog"><form method="dialog" id="repurpose-form"><div class="dialog-head"><h2>Repurpose Long-form</h2><button class="icon-button" value="cancel" aria-label="Close">×</button></div><div class="form-grid"><label>Name<input name="name" required></label><label>Niche<input name="niche"></label><label>Quantity<input name="quantity" type="number" min="1" max="30" value="5"></label><label>Source URL<input name="source_url" type="url"></label><label class="span-2">Transcript<textarea name="transcript" rows="12" required></textarea></label></div><div class="dialog-actions"><button class="command" value="cancel">Cancel</button><button class="command primary" value="default">Create clips</button></div></form></dialog>
<dialog id="account-dialog"><form method="dialog" id="account-form"><div class="dialog-head"><h2>Social Account</h2><button class="icon-button" value="cancel" aria-label="Close">×</button></div><div class="form-grid"><label>Platform<select name="platform"><option>tiktok</option><option>instagram_reels</option><option>facebook_shorts</option><option>youtube_shorts</option></select></label><label>Handle<input name="handle" required></label><label>Display name<input name="display_name"></label><label>Token environment variable<input name="token_env" placeholder="YOUTUBE_ACCESS_TOKEN"></label><label class="span-2">Publish endpoint<input name="publish_endpoint" type="url"></label><label class="span-2">Analytics endpoint<input name="analytics_endpoint" type="url"></label></div><div class="dialog-actions"><button class="command" value="cancel">Cancel</button><button class="command primary" value="default">Add account</button></div></form></dialog>
<dialog id="integration-dialog"><form method="dialog" id="integration-form"><div class="dialog-head"><h2>Delivery Integration</h2><button class="icon-button" value="cancel" aria-label="Close">×</button></div><div class="form-grid"><label>Type<select name="kind"><option>webhook</option><option>slack</option><option>telegram</option><option>email</option><option>n8n</option><option>zapier</option><option>make</option></select></label><label>Name<input name="name" required></label><label class="span-2">Endpoint URL<input name="endpoint_url" type="url" required></label><label class="span-2">Secret environment variable<input name="secret_ref"></label></div><div class="dialog-actions"><button class="command" value="cancel">Cancel</button><button class="command primary" value="default">Add integration</button></div></form></dialog>
<script src="/studio/app.js" defer></script>
</body>
</html>
|