Mercurial > public > pacobot
diff 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 |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/www/pages/index.html Thu Mar 20 11:12:21 2025 +0000 @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + {{ template "head.html" .}} + <style> + .container { + display: flex; + align-items: center; + gap: 10px; + } + </style> +</head> + +<body> + <h1>Hola, soy Pacobot, tu bot de Twitch.</h1> + <div class="col"> + <div class="container"> + <a href="api/auth"><button id="loginBtn">Login</button></a> + <div id="loginOkMsg">{{ if .isLogged}} ✅ Logged in {{ end }}</div> + </div> + <div class="container"> + <button id="connectBtn">Connect</button> + <div id="connectOkMsg" hidden>✅ Connected</div> + <div id="connectErrorMsg" hidden>❌ Connection failed</div> + </div> + </div> +</body> + +<script lang="js"> + const connectBtn = document.getElementById('connectBtn'); + const connectOkMsg = document.getElementById("connectOkMsg") + const connectErrorMsg = document.getElementById("connectErrorMsg") + + connectBtn.addEventListener('click', async () => { + try { + const response = await fetch('/api/connect'); + + if (!response.ok) { + throw new Error(`HTTP error! Status: ${response.status}`); + } + + connectOkMsg.hidden = false; + connectErrorMsg.hidden = true; + } catch (error) { + console.error('Login failed:', error); + connectOkMsg.hidden = true; + connectErrorMsg.hidden = false; + } + }); +</script> + +</html> \ No newline at end of file