start frontend

Signed-off-by: Xe <me@christine.website>
This commit is contained in:
Cadey Ratio 2022-01-17 15:46:51 +00:00
parent 84ca87befa
commit da3f351960
3 changed files with 81 additions and 2 deletions

View File

@ -6,6 +6,7 @@ import (
"database/sql"
"embed"
"encoding/json"
"io"
"net/http"
"time"
@ -47,6 +48,17 @@ func NewServer(db *sql.DB, srv *tsnet.Server) *Server {
srv: srv,
}
mux.HandleFunc("/schema.sql", func(w http.ResponseWriter, r *http.Request) {
w.Header().Set("Content-Type", "text/plain")
fin, err := schemaFS.Open("schema/schema.sql")
if err != nil {
http.Error(w, "not found??", http.StatusNotFound)
return
}
defer fin.Close()
io.Copy(w, fin)
})
mux.HandleFunc("/api/whois", s.whois)
mux.HandleFunc("/api/importcsv", s.importCSV)
mux.HandleFunc("/api/queries/get", s.getQueries)

21
static/index.html Normal file
View File

@ -0,0 +1,21 @@
<html>
<head>
<script type="module" src="/static/js/main.js"></script>
<link rel="stylesheet" type="text/css" href="/static/css/xess.css" />
<title>Twitchalitics</title>
</head>
<body>
<main>
<h1>Twitchalitics</h1>
<p id="error"></p>
<div id="appRoot">
Loading...
</div>
<hr />
<a href="/static/importcsv.html">Import CSV tool</a>
</main>
</body>
</html>

View File

@ -1,4 +1,50 @@
import { h, g, x, r } from "./xeact.js";
import { div, span, h1 } from "./xeact-html.js";
import { h, g, x, r, t, u } from "./xeact.js";
import { div, span, h2, ahref, br } from "./xeact-html.js";
let li = (b) => h("li", {}, b);
let ul = (b) => h("ul", {}, b);
let code = (b) => h("code", {}, b);
let getWhois = async() => {
let resp = await fetch(u("/api/whois"));
resp = await resp.json();
return resp;
};
let getQueries = async() => {
let resp = await fetch(u("/api/queries/get"));
resp = await resp.json();
resp = resp.map((q) => li(span({}, [t(q.name), t(" "), code(q.query), t(" "), t(`added by ${q.who}`)])));
return resp;
};
let queryForm = () => {
return div({}, [
h2("SQL Query"),
ahref("/schema.sql", "Schema"),
h("form", {action: "", autocorrect: "off", autocapitalize: "none", style: "display:flex"}, [
h("input", {type: "search", style: "width:100%"}),
h("button", {type: "submit"}, t("👀"))
]),
]);
};
let mainUI = async () => {
let root = g("appRoot");
x(root);
let whois = await getWhois();
let queries = await getQueries();
let qf = queryForm();
root.appendChild(div({}, [
t(`Hello, ${whois.UserProfile.DisplayName}.`),
qf,
h2("Results"),
h2("Fun Queries to Try"),
div({}, queries),
]));
};
mainUI();