馃 distributed transcription service
thistle.dunkirk.sh
1<!DOCTYPE html>
2<html lang="en">
3
4<head>
5 <meta charset="UTF-8">
6 <meta name="viewport" content="width=device-width, initial-scale=1.0">
7 <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; font-src 'self'; connect-src 'self'; form-action 'self'; base-uri 'self'; frame-ancestors 'none'; object-src 'none'">
8 <title>Admin - Thistle</title>
9 <link rel="apple-touch-icon" sizes="180x180" href="../../public/favicon/apple-touch-icon.png">
10 <link rel="icon" type="image/png" sizes="32x32" href="../../public/favicon/favicon-32x32.png">
11 <link rel="icon" type="image/png" sizes="16x16" href="../../public/favicon/favicon-16x16.png">
12 <link rel="manifest" href="../../public/favicon/site.webmanifest">
13 <link rel="stylesheet" href="../styles/main.css">
14 <link rel="stylesheet" href="../styles/admin.css">
15</head>
16
17<body>
18 <header>
19 <div class="header-content">
20 <a href="/" class="site-title">
21 <img src="../../public/favicon/favicon-32x32.png" alt="Thistle logo">
22 <span>Thistle</span>
23 </a>
24 <auth-component></auth-component>
25 </div>
26 </header>
27
28 <main>
29 <h1>Admin Dashboard</h1>
30
31 <div id="error-message" class="error hidden"></div>
32
33 <div id="loading" class="loading">Loading...</div>
34
35 <div id="content" class="hidden">
36 <div class="stats">
37 <div class="stat-card">
38 <div class="stat-value" id="total-users">0</div>
39 <div class="stat-label">Total Users</div>
40 </div>
41 <div class="stat-card">
42 <div class="stat-value" id="total-transcriptions">0</div>
43 <div class="stat-label">Total Transcriptions</div>
44 </div>
45 <div class="stat-card">
46 <div class="stat-value" id="failed-transcriptions">0</div>
47 <div class="stat-label">Failed Transcriptions</div>
48 </div>
49 </div>
50
51 <div class="tabs">
52 <button class="tab active" data-tab="pending">Pending Recordings</button>
53 <button class="tab" data-tab="transcriptions">Transcriptions</button>
54 <button class="tab" data-tab="users">Users</button>
55 <button class="tab" data-tab="classes">Classes</button>
56 </div>
57
58 <div id="pending-tab" class="tab-content active">
59 <div class="section">
60 <h2 class="section-title">Pending Recordings</h2>
61 <admin-pending-recordings></admin-pending-recordings>
62 </div>
63 </div>
64
65 <div id="transcriptions-tab" class="tab-content">
66 <div class="section">
67 <h2 class="section-title">All Transcriptions</h2>
68 <admin-transcriptions id="transcriptions-component"></admin-transcriptions>
69 </div>
70 </div>
71
72 <div id="users-tab" class="tab-content">
73 <div class="section">
74 <h2 class="section-title">All Users</h2>
75 <admin-users id="users-component"></admin-users>
76 </div>
77 </div>
78
79 <div id="classes-tab" class="tab-content">
80 <div class="section">
81 <h2 class="section-title">Manage Classes</h2>
82 <admin-classes></admin-classes>
83 </div>
84 </div>
85 </div>
86 </main>
87
88 <user-modal id="user-modal"></user-modal>
89 <transcript-modal id="transcript-modal"></transcript-modal>
90
91 <script type="module" src="../components/auth.ts"></script>
92 <script type="module" src="../components/admin-pending-recordings.ts"></script>
93 <script type="module" src="../components/admin-transcriptions.ts"></script>
94 <script type="module" src="../components/admin-users.ts"></script>
95 <script type="module" src="../components/admin-classes.ts"></script>
96 <script type="module" src="../components/user-modal.ts"></script>
97 <script type="module" src="../components/transcript-view-modal.ts"></script>
98 <script type="module" src="./admin.ts"></script>
99</body>
100
101</html>