Crizomb/android_hosting_tutorials
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

little website

Browse source
This commit is contained in:
Crizomb 2025-07-29 02:23:10 +02:00
parent 4d14982e38
commit 2e6f697a69
8 changed files with 201 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

23
little_website/public/index.html Normal file
View file

@ -0,0 +1,23 @@
<!DOCTYPE <html>
<head>
<meta charset="UTF-8" />
<title>Hosted on my phone btw</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<h1>Hosted on a phone from 2016 btw</h1>
<div id="battery-status">Loading battery status...</div>
<h1>Leave an anonymous message</h1>
<form id="msgForm">
<textarea id="message" rows="4" cols="40" maxlength="1000" placeholder="Your message..."></textarea><br>
<button type="submit">Send</button>
</form>
<h2>Recent Messages</h2>
<ul id="messages"></ul>
<script type="text/javascript" src="script.js"></script>
</body>
</html>

53
little_website/public/script.js Normal file
View file

@ -0,0 +1,53 @@
async function loadBattery() {
const res = await fetch('/api/battery');
const data = await res.json();
console.log(data);
const battery_json = JSON.parse(data.battery);
const health = battery_json.health;
const status = battery_json.status;
const percentage = battery_json.percentage;
const voltage = battery_json.voltage;
const current = battery_json.current;
const temperature = battery_json.temperature;
let power = parseInt(voltage) * parseInt(current) / 1000000000;
power = String(power).substring(0, 5);
document.getElementById("battery-status").innerText = `Battery infos 🔋\n\nstatus : ${status}\nLevel : ${percentage}%\nPower : ${power}W (${current}µA x ${voltage}mV)\nTemperature : ${temperature}°C\nHealth : ${health}`;
}
async function loadMessages() {
const res = await fetch('/api/messages');
const data = await res.json();
const list = document.getElementById("messages");
list.innerHTML = "";
data.forEach(msg => {
const li = document.createElement("li");
li.textContent = `[${new Date(msg.time).toLocaleTimeString()}] ${msg.message}`;
list.appendChild(li);
});
}
document.getElementById("msgForm").addEventListener("submit", async (e) => {
e.preventDefault();
const message = document.getElementById("message").value.trim().substring(0, 1000);
const captcha = {};
const captchaAnswer = {};
const res = await fetch("/api/message", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ message, captchaAnswer, captcha })
});
const result = await res.json();
if (result.success) {
alert("Message sent!");
document.getElementById("message").value = "";
loadMessages();
} else {
alert(result);
}
});
loadMessages();
loadBattery();
setInterval(loadBattery, 30000);

BIN
little_website/public/shrek.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 150 KiB

34
little_website/public/style.css Normal file
View file

@ -0,0 +1,34 @@
body {
font-family: sans-serif;
padding: 20px;
max-width: 600px;
margin: auto;
background-image: url("shrek.png");
background-repeat: no-repeat;
background-position: bottom;
}
#battery-status {
font-size: 1.2em;
margin-bottom: 10px;
color: green;
}
textarea {
width: 100%;
margin-bottom: 10px;
}
ul {
list-style: none;
padding-left: 0;
}
li {
border-bottom: 1px solid #ccc;
padding: 5px 0;
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
max-width: 100%;
}