LarpixClient/webroot/index.html

154 lines
No EOL
5.7 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<title>Miarven</title>
<link rel="stylesheet" href="style.css">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
</head>
<body>
<loading>
<div style="display: flex;justify-content: center;align-items: center;height:100%;flex-direction: column;text-align: center;">
<img src="favicon.svg" style="width: 6rem">
<p id="loadingstatus"></p>
</div>
</loading>
<main style="display: none;">
<sidebar>
<sidebarelement id="sidebar-home">
<indicator class="active">
</indicator>
<button class="icon-button" onclick="gotoHome()">
<svg viewBox="-1 -1 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 6V15H6V11C6 9.89543 6.89543 9 8 9C9.10457 9 10 9.89543 10 11V15H15V6L8 0L1 6Z" stroke="var(--text-color)" stroke-width="1.28" stroke-linejoin="round" stroke-linecap="round" transform="translate(0 0.5)"/>
</svg>
</button>
</sidebarelement>
<sidebarelement id="sidebar-add">
<indicator>
</indicator>
<button class="icon-button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="var(--text-color)"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
</button>
</sidebarelement>
<hr>
<hr class="bottom-element">
<sidebarelement id="sidebar-inbox">
<indicator>
</indicator>
<button class="icon-button" onclick="gotoInbox()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960" fill="var(--text-color)"><path d="M216-144q-29 0-50.5-21.5T144-216v-528q0-29.7 21.5-50.85Q187-816 216-816h528q29.7 0 50.85 21.15Q816-773.7 816-744v528q0 29-21.15 50.5T744-144H216Zm0-72h528v-144H632q-23 43-63.5 69.5T480-264q-49 0-89.5-26T328-360H216v144Zm332-148q28-28 28-68h168v-312H216v312h168q0 40 28 68t68 28q40 0 68-28ZM216-216h528-528Z"/></svg>
</button>
</sidebarelement>
<sidebarelement id="sidebar-profile">
<indicator>
</indicator>
<button class="icon-button" onclick="gotoSideProfilePopup()">
<img id="sidebar-pfp">
</button>
</sidebarelement>
</sidebar>
<sidebar class="second" id="roomsbar">
<roomtopbar>
<inherit style="display: flex;"></inherit>
</roomtopbar>
<roomcontent2>
</roomcontent2>
</sidebar>
<roomcontent>
<roomtopbar>
<inherit style="display: flex;"></inherit>
</roomtopbar>
<roomcontent2>
</roomcontent2>
</roomcontent>
<sidebar class="second" id="roomdetailsbar" style="display: none;">
<roomtopbar>
<inherit style="display: flex;"></inherit>
</roomtopbar>
<roomcontent2>
</roomcontent2>
</sidebar>
</main>
<div id="fixed-context-menu" class="context-menu">
</div>
</body>
</html>
<script src="screens.js"></script>
<script>
async function start() {
updateLoadingStatus("loading.loading");
try {
gotoHome();
if (host != null)
{
await updateProtocolAndUrl(host);
}
else
{
await updateProtocolAndUrl(window.location.hostname);
}
sidebarPfp.src = await getAvatarUrl(username);
showAction("Authenticating...", "startauth");
let res = await Auth(username, password);
clearAction("startauth");
if (res.startsWith("success:")) {
await refreshDms();
} else {
showBlahNotification("error:auth.failed.redirect.to.login");
await delay(2000);
window.location.href = "login/index.html";
}
updateLoadingStatus("loading.done");
await loadingFadeOut();
} catch (e) {
clearAction("startauth");
showBlahNotification("error:auth.failed.redirect.to.login");
await delay(2000);
window.location.href = "login/index.html";
}
}
async function refreshDms() {
try {
showAction("Refreshing dms...", "dmrefresh");
let res = await fetchEncrypted("user/dm/list", "");
console.log(res);
clearAction("dmrefresh");
}
catch (e) {
clearAction("dmrefresh");
showBlahNotification("error:dm.refresh.failed");
}
}
async function addDm() {
try {
showAction("Adding...", "dmadd");
let res = await fetchEncrypted("user/dm/invite", document.getElementById("addchat-username").value);
console.log(res);
clearAction("dmadd");
showBlahNotification(res);
}
catch (e) {
console.log(e);
clearAction("dmadd");
showBlahNotification("error:chat.add.failed");
}
}
async function createGroup() {
}
</script>
<script src="main.js"></script>
<script src="userscript.js"></script>