This commit is contained in:
JurajKubrican
2025-01-10 23:46:36 +01:00
parent ca99429d79
commit 4b04531746
6 changed files with 107 additions and 91 deletions

8
css/main.css Normal file
View File

@@ -0,0 +1,8 @@
body {
display: flex;
flex-direction: column;
min-height: 100vh;
}
main {
flex: 1;
}

12
go.mod
View File

@@ -5,7 +5,7 @@ go 1.23.4
require (
github.com/labstack/echo/v4 v4.12.0
github.com/labstack/gommon v0.4.2
golang.org/x/net v0.24.0
golang.org/x/net v0.29.0
modernc.org/sqlite v1.34.4
)
@@ -18,12 +18,14 @@ require (
github.com/mattn/go-isatty v0.0.20 // indirect
github.com/ncruces/go-strftime v0.1.9 // indirect
github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec // indirect
github.com/stretchr/testify v1.9.0 // indirect
github.com/valyala/bytebufferpool v1.0.0 // indirect
github.com/valyala/fasttemplate v1.2.2 // indirect
golang.org/x/crypto v0.22.0 // indirect
golang.org/x/sys v0.22.0 // indirect
golang.org/x/text v0.14.0 // indirect
golang.org/x/time v0.5.0 // indirect
golang.org/x/crypto v0.27.0 // indirect
golang.org/x/sys v0.25.0 // indirect
golang.org/x/text v0.18.0 // indirect
golang.org/x/time v0.6.0 // indirect
golang.org/x/tools v0.25.0 // indirect
modernc.org/gc/v3 v3.0.0-20240107210532-573471604cb6 // indirect
modernc.org/libc v1.55.3 // indirect
modernc.org/mathutil v1.6.0 // indirect

34
go.sum
View File

@@ -25,28 +25,30 @@ github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZb
github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec h1:W09IVJc94icq4NjY3clb7Lk8O1qJ8BdBEF8z0ibU0rE=
github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec/go.mod h1:qqbHyh8v60DhA7CoWK5oRCqLrMHRGoxYCSS9EjAz6Eo=
github.com/stretchr/testify v1.8.4 h1:CcVxjf3Q8PM0mHUKJCdn+eZZtm5yQwehR5yeSVQQcUk=
github.com/stretchr/testify v1.8.4/go.mod h1:sz/lmYIOXD/1dqDmKjjqLyZ2RngseejIcXlSw2iwfAo=
github.com/stretchr/testify v1.9.0 h1:HtqpIVDClZ4nwg75+f6Lvsy/wHu+3BoSGCbBAcpTsTg=
github.com/stretchr/testify v1.9.0/go.mod h1:r2ic/lqez/lEtzL7wO/rwa5dbSLXVDPFyf8C91i36aY=
github.com/valyala/bytebufferpool v1.0.0 h1:GqA5TC/0021Y/b9FG4Oi9Mr3q7XYx6KllzawFIhcdPw=
github.com/valyala/bytebufferpool v1.0.0/go.mod h1:6bBcMArwyJ5K/AmCkWv1jt77kVWyCJ6HpOuEn7z0Csc=
github.com/valyala/fasttemplate v1.2.2 h1:lxLXG0uE3Qnshl9QyaK6XJxMXlQZELvChBOCmQD0Loo=
github.com/valyala/fasttemplate v1.2.2/go.mod h1:KHLXt3tVN2HBp8eijSv/kGJopbvo7S+qRAEEKiv+SiQ=
golang.org/x/crypto v0.22.0 h1:g1v0xeRhjcugydODzvb3mEM9SQ0HGp9s/nh3COQ/C30=
golang.org/x/crypto v0.22.0/go.mod h1:vr6Su+7cTlO45qkww3VDJlzDn0ctJvRgYbC2NvXHt+M=
golang.org/x/mod v0.16.0 h1:QX4fJ0Rr5cPQCF7O9lh9Se4pmwfwskqZfq5moyldzic=
golang.org/x/mod v0.16.0/go.mod h1:hTbmBsO62+eylJbnUtE2MGJUyE7QWk4xUqPFrRgJ+7c=
golang.org/x/net v0.24.0 h1:1PcaxkF854Fu3+lvBIx5SYn9wRlBzzcnHZSiaFFAb0w=
golang.org/x/net v0.24.0/go.mod h1:2Q7sJY5mzlzWjKtYUEXSlBWCdyaioyXzRB2RtU8KVE8=
golang.org/x/crypto v0.27.0 h1:GXm2NjJrPaiv/h1tb2UH8QfgC/hOf/+z0p6PT8o1w7A=
golang.org/x/crypto v0.27.0/go.mod h1:1Xngt8kV6Dvbssa53Ziq6Eqn0HqbZi5Z6R0ZpwQzt70=
golang.org/x/mod v0.21.0 h1:vvrHzRwRfVKSiLrG+d4FMl/Qi4ukBCE6kZlTUkDYRT0=
golang.org/x/mod v0.21.0/go.mod h1:6SkKJ3Xj0I0BrPOZoBy3bdMptDDU9oJrpohJ3eWZ1fY=
golang.org/x/net v0.29.0 h1:5ORfpBpCs4HzDYoodCDBbwHzdR5UrLBZ3sOnUJmFoHo=
golang.org/x/net v0.29.0/go.mod h1:gLkgy8jTGERgjzMic6DS9+SP0ajcu6Xu3Orq/SpETg0=
golang.org/x/sync v0.8.0 h1:3NFvSEYkUoMifnESzZl15y791HH1qU2xm6eCJU5ZPXQ=
golang.org/x/sync v0.8.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
golang.org/x/sys v0.0.0-20220811171246-fbc7d0a398ab/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
golang.org/x/sys v0.22.0 h1:RI27ohtqKCnwULzJLqkv897zojh5/DwS/ENaMzUOaWI=
golang.org/x/sys v0.22.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
golang.org/x/text v0.14.0 h1:ScX5w1eTa3QqT8oi6+ziP7dTV1S2+ALU0bI+0zXKWiQ=
golang.org/x/text v0.14.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
golang.org/x/time v0.5.0 h1:o7cqy6amK/52YcAKIPlM3a+Fpj35zvRj2TP+e1xFSfk=
golang.org/x/time v0.5.0/go.mod h1:3BpzKBy/shNhVucY/MWOyx10tF3SFh9QdLuxbVysPQM=
golang.org/x/tools v0.19.0 h1:tfGCXNR1OsFG+sVdLAitlpjAvD/I6dHDKnYrpEZUHkw=
golang.org/x/tools v0.19.0/go.mod h1:qoJWxmGSIBmAeriMx19ogtrEPrGtDbPK634QFIcLAhc=
golang.org/x/sys v0.25.0 h1:r+8e+loiHxRqhXVl6ML1nO3l1+oFoWbnlu2Ehimmi34=
golang.org/x/sys v0.25.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
golang.org/x/text v0.18.0 h1:XvMDiNzPAl0jr17s6W9lcaIhGUfUORdGCNsuLmPG224=
golang.org/x/text v0.18.0/go.mod h1:BuEKDfySbSR4drPmRPG/7iBdf8hvFMuRexcpahXilzY=
golang.org/x/time v0.6.0 h1:eTDhh4ZXt5Qf0augr54TN6suAUudPcawVZeIAPU7D4U=
golang.org/x/time v0.6.0/go.mod h1:3BpzKBy/shNhVucY/MWOyx10tF3SFh9QdLuxbVysPQM=
golang.org/x/tools v0.25.0 h1:oFU9pkj/iJgs+0DT+VMHrx+oBKs/LJMV+Uvg78sl+fE=
golang.org/x/tools v0.25.0/go.mod h1:/vtpO8WL1N9cQC3FN5zPqb//fRXskFHbLKk4OW1Q7rg=
gopkg.in/yaml.v3 v3.0.1 h1:fxVm/GzAzEWqLHuvctI91KS9hhNmmWOoWu0XTYJS7CA=
gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
modernc.org/cc/v4 v4.21.4 h1:3Be/Rdo1fpr8GrQ7IVw9OHtplU4gWbb+wNgeoBMmGLQ=

View File

@@ -43,15 +43,12 @@ func main() {
e.Logger.SetLevel(log.DEBUG)
e.Use(middleware.Logger())
boxes := getBoxes()
e.GET("/health", healthCheck)
e.Static("/images", "images")
e.Static("/css", "css")
e.GET("/", func(c echo.Context) error {
return c.Render(200, "index", newPage(boxes))
return c.Render(200, "index", newPage(getBoxes()))
})
e.GET("/ws", initWs)

View File

@@ -2,4 +2,59 @@
{{range $index, $value := .}}
<input type="checkbox" id="box-{{$index}}" name="checked" {{if $value}}checked{{end}} >
{{end}}
<script>
const socketUrl =
(window.location.protocol.startsWith("https") ? "wss://" : "ws://") +
window.location.host +
"/ws";
let socket = new WebSocket(socketUrl);
socket.addEventListener("message", function (event) {
if (event.data.startsWith("u:")) {
const items = event.data.split(";");
items.forEach((i) => {
const parts = event.data.split(":");
document.getElementById("box-" + parts[1]).checked = parts[2] === "+";
console.log("box-" + parts[1]);
});
return;
}
if (event.data.startsWith("i:")) {
const str = event.data.split("i:")[1];
const items = str.split(";");
if (items.length === 0) {
return;
}
document.querySelectorAll("input").forEach((input) => {
input.checked = false;
});
items.forEach((i) => {
if (!i) {
return;
}
console.log(i, document.getElementById("box-" + i));
document.getElementById("box-" + i).checked = true;
});
return;
}
});
setInterval(() => {
socket.send("ping");
}, 10000);
document.querySelectorAll("input").forEach((input) => {
input.addEventListener("change", (event) => {
if (socket.readyState !== socket.OPEN) {
socket = new WebSocket(socketUrl);
}
const id = event.target.id.split("-")[1];
const value = event.target.checked ? "+" : "-";
socket.send("u:" + id + ":" + value);
});
});
</script>
{{end}}

View File

@@ -7,25 +7,32 @@
<title>Home</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/htmx.org@1.9.5"></script>
<style>
body {
display: flex;
flex-direction: column;
min-height: 100vh;
}
main {
flex: 1;
}
</style>
<link rel="stylesheet" href="/main.css" >
</head>
<body class="bg-gray-900 text-white font-sans">
<nav class="bg-gray-800 py-4 shadow-md">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center justify-between">
<!-- Logo -->
<div class="text-2xl font-bold text-blue-500">
<a href="/">K</a> </div>
<!-- Navigation Links -->
<div class="space-x-6">
<!-- <a href="/" class="text-white hover:text-blue-500">Home</a> -->
<!-- <a href="/projects" class="text-white hover:text-blue-500">Projects</a> -->
<!-- <a href="/blog" class="text-white hover:text-blue-500">Blog</a> -->
</div>
</div>
</nav>
<main id="main" class="max-w-3xl mx-auto p-6 rounded-lg">
<section>
<div class="mt-4">{{template "boxes" .Boxes}}</div>
</section>
</main>
<footer class="bg-gray-800 text-center p-4">
<footer class="bg-gray-800 text-center p-4 flex flex-row justify-around">
<!-- link to github -->
<div class="mt-4">
<a href="https://github.com/JurajKubrican" class="text-blue-500"
@@ -43,59 +50,4 @@
</footer>
</body>
</html>
<script>
const socketUrl =
(window.location.protocol.startsWith("https") ? "wss://" : "ws://") +
window.location.host +
"/ws";
let socket = new WebSocket(socketUrl);
socket.addEventListener("message", function (event) {
if (event.data.startsWith("u:")) {
const items = event.data.split(";");
items.forEach((i) => {
const parts = event.data.split(":");
document.getElementById("box-" + parts[1]).checked = parts[2] === "+";
console.log("box-" + parts[1]);
});
return;
}
if (event.data.startsWith("i:")) {
const str = event.data.split("i:")[1];
const items = str.split(";");
if (items.length === 0) {
return;
}
document.querySelectorAll("input").forEach((input) => {
input.checked = false;
});
items.forEach((i) => {
if (!i) {
return;
}
console.log(i, document.getElementById("box-" + i));
document.getElementById("box-" + i).checked = true;
});
return;
}
});
setInterval(() => {
socket.send("ping");
}, 10000);
document.querySelectorAll("input").forEach((input) => {
input.addEventListener("change", (event) => {
if (socket.readyState !== socket.OPEN) {
socket = new WebSocket(socketUrl);
}
const id = event.target.id.split("-")[1];
const value = event.target.checked ? "+" : "-";
socket.send("u:" + id + ":" + value);
});
});
</script>
{{end}}