Update website

This commit is contained in:
Spencer Killen 2026-05-15 13:52:30 -06:00
parent f8764ff86b
commit 53c0ad4f4a
Signed by: sjkillen
GPG key ID: 1DAA9D8D7C6ADD05
6 changed files with 179 additions and 2 deletions

28
www/editor.js Normal file
View file

@ -0,0 +1,28 @@
export const url = "https://libreinternet.club/";
// Return username:password encoded in base64
export function get_login_creds() {
const username = editorusername.value;
const password = editorpassword.value;
return btoa(`${username}:${password}`);
}
async function send_request() {
const response_options = {
method: editormethod.value,
headers: {
"Authorization": `Basic ${get_login_creds()}`,
},
};
// Browser will fail the request if body is added to GET or HEAD
if (response_options.method != "GET") {
response_options.body = editorbody.value;
}
// NGINX is nonstandard in not having this as the default
if (response_options.method == "PROPFIND") {
response_options.headers["Depth"] = "infinity";
}
const response = await fetch(new Request("https://libreinternet.club/" + editorurl.value, response_options));
editorresponse.value = await response.text();
}
globalThis.send_request = send_request;

Binary file not shown.

After

Width:  |  Height:  |  Size: 138 KiB

View file

@ -3,8 +3,10 @@
<head> <head>
<title>Libre Internet Club</title> <title>Libre Internet Club</title>
<link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="style.css" />
<script type="module" src="editor.js" defer></script>
<script type="module" src="tictactoe.js" defer></script>
<link rel="stylesheet" href="tictactoe.css" />
</head> </head>
<body>
<div id="banner"> <div id="banner">
<img src="banner.gif" /> <img src="banner.gif" />
</div> </div>
@ -13,9 +15,65 @@
<li><a href="https://discord.gg/U9MQTv952">Join Discord</a></li> <li><a href="https://discord.gg/U9MQTv952">Join Discord</a></li>
<li><a href="https://matrix.to/#/#Libre_Internet:matrix.org">Matrix</a></li> <li><a href="https://matrix.to/#/#Libre_Internet:matrix.org">Matrix</a></li>
</ul> </ul>
<h2><marquee>Upcoming Events</marquee></h2>
<div class="infoblock">
<h1>Libre Local Event</h1>
<img src="events/libre_local_1.png" style="text-align: center; display: block;" />
<p>Thursday, May 21, 2026 from 12-4pm @ UoA North Campus ED 262 (Education South)</p>
<p>This event will involve discussions, presentations, and the potential for software demos. However, we also aim for the comfort of attendees. Introverted or shy attendees may feel more comfortable simply listening in or reading some of the provided event materials, and that's OK! Attendees may move in and out of the room at any time.
</p>
<p>Anyone is free to attend, in part or in full, regardless of their knowledge level or background (as long as they follow the code of conduct)!</p>
<p>Poster art by Mimi</p>
</div>
<h2> <h2>
Members Members
</h2> </h2>
<ul><a href="https://sjkillen.ca">Spencer</a></ul> <ul>
<li><a href="https://sjkillen.ca">Spencer</a></li>
<li>You! (Add yourself here using the site editor below!</li>
</ul>
<div class="infoblock">
<h2>Edit Site!</h2>
<p>username: <input id="editorusername" disabled type="text" value="libreinternet" /></p>
<p>password: <input id="editorpassword" type="text" /></p>
<select id="editormethod">
<option value="GET">GET</option>
<option value="PROPFIND">PROPFIND</option>
<option value="PUT">PUT</option>
<option value="MKCOL">MKCOL</option>
<option value="DELETE">DELETE</option>
</select>
<input disabled type="text" value="https://libreinternet.club/"/>
<input id="editorurl" placeholder="<complete URL here>" type="text" value=""/>
<button onclick="send_request()">Send request</button>
<br />
body:
<br />
<textarea id="editorbody"></textarea>
<br />
response:
<br />
<textarea disabled id="editorresponse"></textarea>
</div>
<h2>Tic Tac Toe!</h2>
<table>
<tr>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton0"></button></td>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton1"></button></td>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton2"></button></td>
</tr>
<tr>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton3"></button></td>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton4"></button></td>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton5"></button></td>
</tr>
<tr>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton6"></button></td>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton7"></button></td>
<td><button onclick="tictactoe.play_move(this)" class="tictactoe" id="tictactoebutton8"></button></td>
</tr>
</table>
<button onclick="tictactoe.reload()">Reload</button>
<button onclick="tictactoe.reset()">Reset</button>
</body> </body>
</html> </html>

View file

@ -1,3 +1,16 @@
body {
margin-top: 20px;
margin-left: 5%;
margin-right: 5%;
background-color: coral;
}
.infoblock {
background-color: lightgreen;
padding: 30px;
}
#banner img { #banner img {
width: 100%; width: 100%;
background-color: papayawhip;
} }

4
www/tictactoe.css Normal file
View file

@ -0,0 +1,4 @@
button.tictactoe {
width: 30px;
height: 30px;
}

74
www/tictactoe.js Normal file
View file

@ -0,0 +1,74 @@
import { url } from "./editor.js";
const gameurl = `${url}ticktactoegamestate`;
const board = [
tictactoebutton0,
tictactoebutton1,
tictactoebutton2,
tictactoebutton3,
tictactoebutton4,
tictactoebutton5,
tictactoebutton6,
tictactoebutton7,
tictactoebutton8,
];
let state = "";
state = await reload();
function display_state(state) {
for (const cell of board) {
cell.innerText = "";
}
let x_to_move = true;
for (const action of state) {
board[Number(action)].innerText = x_to_move ? "X" : "O";
x_to_move = !x_to_move;
}
}
async function fetch_gamestate() {
const response = await fetch(new Request(gameurl));
if (response.status == 200) {
return response.text();
}
return "";
}
async function push_gamestate(state) {
const response = await fetch(
new Request(gameurl, { method: "PUT", body: state }),
);
if (response.status < 200 || response.status > 299) {
throw new Error(`Returned status code ${response.status}`);
}
}
async function play_move(cell) {
const index = board.indexOf(cell);
if (index == -1) {
return;
}
const next_state = state + index;
await push_gamestate(next_state);
state = next_state;
display_state(state);
}
async function reload() {
state = await fetch_gamestate();
display_state(state);
return state;
}
async function reset() {
await push_gamestate("");
state = "";
display_state(state);
}
globalThis.tictactoe = {
play_move: play_move,
reload: reload,
reset: reset,
};