@@ -342,7 +342,7 @@
} catch (error) {
console.log(error);
- showNotification("Something went wrong...", "error", 3500);
+ showNotification("Something went wrong... (probably wrong password)", "error", 3500);
container.className = 'auth-container';
}
});
diff --git a/webroot/main.js b/webroot/main.js
index 0bcc2dd3..efc5d22a 100644
--- a/webroot/main.js
+++ b/webroot/main.js
@@ -6,6 +6,9 @@ var params = new URLSearchParams(window.location.search);
const collapseDmsBtn = document.getElementById("collapse-dms");
const collapseGroupsBtn = document.getElementById("collapse-groups");
+const addDmBtn = document.getElementById("add-dm-btn");
+const addGroupBtn = document.getElementById("add-group-btn");
+
const sidebarHome = document.getElementById("sidebar-home");
const sidebarHomeButton = sidebarHome.children.item(1);
const sidebarHomeIndicator = sidebarHome.children.item(0);
@@ -14,6 +17,15 @@ const sidebarAdd = document.getElementById("sidebar-add");
const sidebarAddButton = sidebarAdd.children.item(1);
const sidebarAddIndicator = sidebarAdd.children.item(0);
+const roomDetailsBar = document.getElementById("roomdetailsbar");
+const roomContent = document.getElementsByTagName("roomcontent")[0];
+const roomsBar = document.getElementById("roomsbar");
+const sideBar = document.getElementsByTagName("sidebar")[0];
+
+const roomContentMain = document.getElementsByTagName("roomcontent2")[0];
+
+const roomContentBar = roomContent.children[0];
+
function delay(time) {
@@ -256,6 +268,7 @@ async function getServerInfo(host){
}
async function Auth(username, password) {
+
let passwordHash = await hashSHA3_512(password);
let response = await fetch(`${url}/auth?u=${username}`, {
@@ -268,11 +281,13 @@ async function Auth(username, password) {
let data = await response.text();
return data;
+
}
async function fetchEncrypted(request, body)
{
+
let nonce = await getNonce(username, passwordHash);
let response = await fetch(`${url}/encryptedrequest?u=${username}`, {
@@ -413,6 +428,22 @@ collapseGroupsBtn.addEventListener("click", () => {
collapseGroupsBtn.classList.toggle("collapsed");
});
+addDmBtn.addEventListener("click", () => {
+ roomContentMain.innerHTML =
+ `
+
+
+
Add Chat
+
Add a private, encrypted chat by entering a username
+
+ `
+});
+addGroupBtn.addEventListener("click", () => {
+
+});
+
+
+
sidebarHomeButton.addEventListener("mouseenter", () => {
sidebarHomeIndicator.classList.add("hover");
});
diff --git a/webroot/style.css b/webroot/style.css
index 2e7d628d..15f1613f 100644
--- a/webroot/style.css
+++ b/webroot/style.css
@@ -27,10 +27,14 @@
font-size: 80%;
padding: 0 0.5rem;
}
+.aqua {
+ color: rgb(0 139 200);
+}
html {
font-size: max(16px, calc(100vw / 120));
}
body {
+ padding-top: env(safe-area-inset-top);
background-color: var(--main-bg-color);
display: flex;
height: 100dvh;
@@ -128,9 +132,18 @@ roomcontent {
flex-direction: column;
height: 100dvh;
- width: calc(100vw - (var(--icon-button-height) + (var(--button-margin) * 2) + var(--border-width)) - 22rem);
+ width: calc(100vw - (var(--icon-button-height) + (var(--button-margin) * 2) + var(--border-width)) - 17rem);
border-right: var(--border-width) solid var(--light-border-color);
}
+roomcontent2 {
+ display: flex;
+ flex-direction: column;
+
+ height: calc(100dvh - (var(--button-height) * 1.5));
+ width: 100%;
+}
+
+
sidebar {
display: flex;
flex-direction: column;
@@ -140,7 +153,9 @@ sidebar {
border-right: var(--border-width) solid var(--light-border-color);
}
sidebar.second {
- width: 20rem;
+ width: 17rem;
+ min-width: 17rem;
+ max-width: 17rem;
}
.sidebar-section-header {
display: flex;
@@ -199,6 +214,7 @@ hr {
#notification-container {
+ padding-top: env(safe-area-inset-top);
position: fixed;
top: 1.5rem;
left: 50%;
@@ -250,4 +266,35 @@ hr {
.notification.success {
border-color: var(--big-green);
+}
+
+roomtopbar {
+ height: calc(var(--button-height) * 1.5);
+
+ display: flex;
+ flex-direction: row;
+
+ width: 100%;
+ border-bottom: var(--border-width) solid var(--light-border-color);
+
+ line-height: calc(var(--button-height) * 1.5);
+ font-weight: bold;
+ padding-left: calc(var(--button-margin) * 3);
+ font-size: 1.5rem;
+}
+sidebar.second#roomdetailsbar {
+ height: calc(var(--button-height) * 1.5);
+
+ display: flex;
+ flex-direction: row;
+
+ border-bottom: var(--border-width) solid var(--light-border-color);
+}
+fullcontainer {
+ width: 100%;
+ height: 100%;
+}
+herotitle {
+ font-weight: bold;
+ font-size: 1.6rem;
}
\ No newline at end of file
+ 
+