ErrorNoInternet/button
1
0
Fork 0
forked from deadvey/button
Code Pull Requests Activity

added a static directory

Browse Source
This commit is contained in:
deadvey
2026-05-31 19:46:05 +01:00
parent 8352b9c7fd
commit 9a581ed5fc
5 changed files with 172 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main.rs
+3 -2
View File
@@ -24,6 +24,7 @@ use tokio::
sync::{Mutex, mpsc}, sync::{Mutex, mpsc},
time::{Duration, sleep}, time::{Duration, sleep},
}; };
use tower_http::services::ServeDir;
use futures::StreamExt as _; use futures::StreamExt as _;
use rand::random_bool; use rand::random_bool;
use serde::{Deserialize, Serialize, de}; use serde::{Deserialize, Serialize, de};
@@ -130,11 +131,11 @@ async fn main() -> anyhow::Result<()>
}); });
} }
let static_files = ServeDir::new("./static");
let app = Router::new() let app = Router::new()
.route("/", get(index)) .fallback_service(static_files)
.route("/ws", get(ws_handler)) .route("/ws", get(ws_handler))
.route("/ws-leaderboard", get(leaderboard_handler)) .route("/ws-leaderboard", get(leaderboard_handler))
.route("/leaderboard", get(leaderboard))
.with_state .with_state
(AppState { (AppState {
tx, tx,
static/favicon.ico
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

static/index.css
+25
View File
@@ -0,0 +1,25 @@
#button {
background-color: red;
border: darkred solid 15px;
border-radius: 50%;
font-size: 50px;
padding: 100px;
width: 300px;
height: 300px;
font-family: monospace, arial;
}
#button:active {
background-color: red;
border: red solid 20px;
}
#score-table {
position: absolute;
top: 0px;
right: 0px;
}
td,tr,table,th {
border: black solid;
}
table {
border-collapse: collapse;
}
static/index.html
+67
View File
@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/index.css" />
</head>
<body>
<h1>Each time you press the button there's a 1/3 chance of returning to 0</h1>
<button id="button" onclick="send_click()">0</button>
<div id="score-table"></div>
</body>
<script>
const regex = new RegExp("^[a-zA-Z0-9_-]+$");
const ws = new WebSocket('ws://deadvey.com:8084/ws');
console.log(name)
let latestMessage = 0;
ws.onopen = (event) => {
let name = validate_data(prompt("Nickname for the leaderboard"));
ws.send(name);
}
const ws_leaderboard = new WebSocket('ws://deadvey.com:8084/ws-leaderboard');
ws_leaderboard.onopen = (event) => {
ws_leaderboard.send("1");
};
ws_leaderboard.onmessage = (event) => {
console.log(event.data);
firstMessage = false;
data = JSON.parse(event.data);
const tableDiv = document.getElementById("score-table");
const table = document.createElement("table");
// Add header row
table.innerHTML = `<tr><th>Rank</th><th>Score</th><th>Name</th><th>P</th></tr>`;
// Add data rows concisely using forEach
data.hiscores.forEach((entry, index) => {
table.innerHTML += `<tr>
<td>#${index + 1}</td>
<td>${validate_data(entry.score)}</td>
<td>${validate_data(entry.person)}</td>
<td>${((2/3)**validate_data(entry.score)).toExponential(2)}</td>
</tr>`;
});
tableDiv.appendChild(table);
};
ws.onmessage = (event) => {
console.log(event.data);
latestMessage = validate_data(event.data);
}
function send_click()
{
ws.send("");
if (latestMessage !== null) {
document.getElementById("button").textContent=latestMessage;
latestMessage = null;
}
}
function get_rand(min, max) {
return Math.round(Math.random() * (max - min) + min);
}
window.addEventListener('beforeunload', () => {
ws.close();
});
function validate_data(data) { // Only allow a-z, A-Z, 0-9, - and _ characters, sorry Ramón
if (regex.test(data)) { return data }
else { return "anon" }
}
</script>
</html>
static/leaderboard/index.html
+77
View File
@@ -0,0 +1,77 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/index.css" />
</head>
<body>
<h1>Hiscores</h1>
<p>Highest achieved numbers before returning to 0</p>
<div id="hiscore-table"></div>
<h1>Loscores</h1>
<p>Highest number of consecutive resets to 0</p>
<div id="loscore-table"></div>
<h1>Userscores</h1>
<p>Total number of resets and personal bests of each username</p>
<div id="pingscore-table"></div>
</body>
<script>
const ws = new WebSocket('ws://deadvey.com:8084/ws-leaderboard');
const regex = new RegExp("^[a-zA-Z0-9_-]+$");
ws.onopen = (event) => {
ws.send('0'); // send all
};
let latestMessage = 0;
ws.onmessage = (event) => {
console.log(event.data);
data = JSON.parse(event.data);
const tableDiv = document.getElementById("hiscore-table");
const table = document.createElement("table");
// Add header row
table.innerHTML = `<tr><th>Rank</th><th>Score</th><th>Name</th><th>P</th></tr>`;
// Add data rows concisely using forEach
data.hiscores.forEach((entry, index) => {
table.innerHTML += `<tr>
<td>#${index + 1}</td>
<td>${validate_data(entry.score)}</td>
<td>${validate_data(entry.person)}</td>
<td>${((2/3)**validate_data(entry.score)).toExponential(8)}</td>
</tr>`;
});
tableDiv.appendChild(table);
const tableDiv2 = document.getElementById("loscore-table");
const table2 = document.createElement("table");
table2.innerHTML = `<tr><th>Rank</th><th>Score</th><th>Name</th><th>P</th></tr>`;
data.loscores.forEach((entry, index) => {
table2.innerHTML += `<tr>
<td>#${index + 1}</td>
<td>${validate_data(entry.score)}</td>
<td>${validate_data(entry.person)}</td>
<td>${((1/3)**validate_data(entry.score)).toExponential(8)}</td>
</tr>`;
});
tableDiv2.appendChild(table2);
const tableDiv3 = document.getElementById("pingscore-table");
const table3 = document.createElement("table");
table3.innerHTML = `<tr><th>Rank</th><th>Name</th><th>Reset count</th><th>PB</th></tr>`;
let pingscores = data.pingscores;
let sorted = Object.entries(pingscores).sort(([,[a,]],[,[b,]]) => b - a)
sorted.forEach(([person,scores],index) => {
table3.innerHTML += `<tr>
<td>#${index + 1}</td>
<td>${validate_data(person)}</td>
<td>${validate_data(scores[0])}</td>
<td>${validate_data(scores[1])}</td>
</tr>`;
});
tableDiv3.appendChild(table3);
};
window.addEventListener('beforeunload', () => {
ws.close();
});
function validate_data(data) { // Only allow a-z, A-Z, 0-9, - and _ characters, sorry Ramón
if (regex.test(data)) { return data }
else { return "anon" }
}
</script>
</html>