Mercurial > public > pacobot
comparison www/pages/index.html @ 12:aaf85ae1f942
add very simple html template
author | Dennis C. M. <dennis@denniscm.com> |
---|---|
date | Thu, 20 Mar 2025 11:12:21 +0000 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
11:6d91c612310a | 12:aaf85ae1f942 |
---|---|
1 <!DOCTYPE html> | |
2 <html lang="en"> | |
3 | |
4 <head> | |
5 {{ template "head.html" .}} | |
6 <style> | |
7 .container { | |
8 display: flex; | |
9 align-items: center; | |
10 gap: 10px; | |
11 } | |
12 </style> | |
13 </head> | |
14 | |
15 <body> | |
16 <h1>Hola, soy Pacobot, tu bot de Twitch.</h1> | |
17 <div class="col"> | |
18 <div class="container"> | |
19 <a href="api/auth"><button id="loginBtn">Login</button></a> | |
20 <div id="loginOkMsg">{{ if .isLogged}} ✅ Logged in {{ end }}</div> | |
21 </div> | |
22 <div class="container"> | |
23 <button id="connectBtn">Connect</button> | |
24 <div id="connectOkMsg" hidden>✅ Connected</div> | |
25 <div id="connectErrorMsg" hidden>❌ Connection failed</div> | |
26 </div> | |
27 </div> | |
28 </body> | |
29 | |
30 <script lang="js"> | |
31 const connectBtn = document.getElementById('connectBtn'); | |
32 const connectOkMsg = document.getElementById("connectOkMsg") | |
33 const connectErrorMsg = document.getElementById("connectErrorMsg") | |
34 | |
35 connectBtn.addEventListener('click', async () => { | |
36 try { | |
37 const response = await fetch('/api/connect'); | |
38 | |
39 if (!response.ok) { | |
40 throw new Error(`HTTP error! Status: ${response.status}`); | |
41 } | |
42 | |
43 connectOkMsg.hidden = false; | |
44 connectErrorMsg.hidden = true; | |
45 } catch (error) { | |
46 console.error('Login failed:', error); | |
47 connectOkMsg.hidden = true; | |
48 connectErrorMsg.hidden = false; | |
49 } | |
50 }); | |
51 </script> | |
52 | |
53 </html> |