burger changes

main

@@ -309,6 +309,28 @@ def apiremovenote():
             return {}, 422
 
 
+@app.route("/api/deleteaccount", methods=("GET", "POST"))
+def apideleteaccount():
+    if request.method == "POST":
+        data = request.get_json()
+        secretKey = data["secretKey"]
+
+        userCookie = get_session(secretKey)
+        user = get_user(userCookie["id"])
+
+        conn = get_db_connection()
+        conn.execute("DELETE FROM notes WHERE creator = ?", (userCookie["id"],))
+        conn.commit()
+        conn.close()
+
+        conn = get_db_connection()
+        conn.execute("DELETE FROM users WHERE id = ?", (userCookie["id"],))
+        conn.commit()
+        conn.close()
+
+        return {}, 200
+
+
 @app.route("/listusers/<secretkey>", methods=("GET", "POST"))
 def listusers(secretkey):
     if secretkey == SECRET_KEY:

static/css/style.css

@@ -97,10 +97,11 @@ body {
     position: fixed;
     right: 0;
     bottom: 0;
+    padding: 4px;
     border: none;
     font-size: 16px;
-    width: calc(100% - 180px - 7px);
+    width: calc(100% - 180px - 7px - 6px);
-    height: calc(100% - 50px - 6px);
+    height: calc(100% - 50px - 6px - 8px);
     font-family: "Inter", sans-serif;
 }
 
@@ -137,9 +138,23 @@ body {
     border-radius: 8px;
 }
 
+.optionsDiv progress {
+    width: 100%;
+    background-color: #d8d8d8;
+    border: none;
+    border-radius: 99px;
+    height: 7px;
+}
+.optionsDiv progress::-moz-progress-bar {
+    background: #157efb;
+}
+.optionsDiv progresss::-webkit-progress-value {
+    background: #157efb;
+}
+
 .optionsDiv .exit {
     position: absolute;
-    right: 10px;
+    right: 5px;
     width: 40px;
     height: 40px;
     font-size: 16px;
@@ -225,7 +240,7 @@ body {
     box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
 }
 
-/* dark theme from my ass */
+/* dark theme, slightly modified */
 
 @media (prefers-color-scheme: dark) {
 	:root {
@@ -244,32 +259,24 @@ body {
 
 	body {
 		color: white;
-		background-color: var(--gray-900);
+		background-color: #030303;
 	}
 
 	.topBar {
-		background-color: var(--gray-800);
+		background-color: rgba(18, 18, 18, 0.5);
-		backdrop-filter: blur(0px);
+        border-color: #303030;
-		-webkit-backdrop-filter: blur(20px);
-		border: none;
-		border-color: transparent;
-		border-width: 0px;
-		border-bottom-width: 0px;
 	}
 
 	.notesBar {
-		background-color: var(--gray-800);
+		background-color: #030303;
-		backdrop-filter: none;
+        border: solid;
-		-webkit-backdrop-filter: none;
+        border-width: 0px;
-		border: none;
+        border-right-width: 1px;
-		border-color: #dadada00;
+        border-color: #303030;
-		border-width: 0px;
-		border-top-width: 0px;
-		border-right-width: 0px;
 	}
 
 	.noteBox {
-		background-color: var(--gray-900);
+        background-color: #030303;
 		color: white;
 	}
 
@@ -282,8 +289,8 @@ body {
 	}
 
 	.notesBar button {
-		background-color: var(--gray-700);
+		background-color: #141414;
-		border-color: var(--gray-600);
+        border: none;
 	}
 
 	.notesBar .selected {
@@ -297,18 +304,15 @@ body {
 	}
 
 	.optionsDiv .exit {
-		background-color: crimson;
+        background-color: var(--gray-700);
 		color: white;
 	}
 
-	.mainDiv .green {
+	.mainDiv .feature {
-		background-color: var(--gray-800);
+		background-color: #141414;
-		border: 1px solid #00b100;
+		border: solid;
-	}
+        border-width: 1px;
-
+        border-color: #303030;
-	.mainDiv .yellow {
-		background-color: var(--gray-800);
-		border: 1px solid #FFD700;
 	}
 
 	.inoutdiv {

static/js/login.js

@@ -1,9 +1,11 @@
 if (localStorage.getItem("DONOTSHARE-secretkey") !== null) {
     window.location.replace("/app")
+    document.body.innerHTML = "Redirecting.."
     throw new Error();
 }
 if (localStorage.getItem("DONOTSHARE-password") !== null) {
     window.location.replace("/app")
+    document.body.innerHTML = "Redirecting.."
     throw new Error();
 }
 

static/js/main.js

@@ -1,13 +1,15 @@
 if (localStorage.getItem("DONOTSHARE-secretkey") === null) {
     window.location.replace("/")
+    document.body.innerHTML = "Redirecting.."
     throw new Error();
 }
 if (localStorage.getItem("DONOTSHARE-password") === null) {
     window.location.replace("/")
+    document.body.innerHTML = "Redirecting.."
     throw new Error();
 }
 
-function formatBytes(a, b = 2) { if (!+a) return "0 Bytes"; const c = 0 > b ? 0 : b, d = Math.floor(Math.log(a) / Math.log(1024)); return `${parseFloat((a / Math.pow(1024, d)).toFixed(c))} ${["Bytes", "KiB", "MiB", "GiB", "TiB", "PiB", "EiB", "ZiB", "YiB"][d]}` }
+function formatBytes(a, b = 2) { if (!+a) return "0 Bytes"; const c = 0 > b ? 0 : b, d = Math.floor(Math.log(a) / Math.log(1000)); return `${parseFloat((a / Math.pow(1000, d)).toFixed(c))} ${["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"][d]}` }
 
 let secretkey = localStorage.getItem("DONOTSHARE-secretkey")
 let password = localStorage.getItem("DONOTSHARE-password")
@@ -15,7 +17,9 @@ let password = localStorage.getItem("DONOTSHARE-password")
 let usernameBox = document.getElementById("usernameBox")
 let optionsCoverDiv = document.getElementById("optionsCoverDiv")
 let exitThing = document.getElementById("exitThing")
+let deleteMyAccountButton = document.getElementById("deleteMyAccountButton")
 let storageThing = document.getElementById("storageThing")
+let storageProgressThing = document.getElementById("storageProgressThing")
 let usernameThing = document.getElementById("usernameThing")
 let logOutButton = document.getElementById("logOutButton")
 let notesBar = document.getElementById("notesBar")
@@ -77,34 +81,62 @@ if (/Android|iPhone/i.test(navigator.userAgent)) {
 noteBox.value = ""
 noteBox.readOnly = true
 
-fetch("/api/userinfo", {
+function updateUserInfo() {
-    method: "POST",
+    fetch("/api/userinfo", {
-    body: JSON.stringify({
+        method: "POST",
-        secretKey: secretkey
+        body: JSON.stringify({
-    }),
+            secretKey: secretkey
-    headers: {
+        }),
-        "Content-type": "application/json; charset=UTF-8"
+        headers: {
-    }
+            "Content-type": "application/json; charset=UTF-8"
-})
+        }
-    .then((response) => response)
+    })
-    .then((response) => {
+        .then((response) => response)
-        async function doStuff() {
+        .then((response) => {
-            let responseData = await response.json()
+            async function doStuff() {
-            usernameBox.innerText = responseData["username"]
+                let responseData = await response.json()
-            usernameBox.addEventListener("click", (event) => {
+                usernameBox.innerText = responseData["username"]
-                optionsCoverDiv.classList.remove("hidden")
                 usernameThing.innerText = "logged in as " + responseData["username"]
                 storageThing.innerText = "you've used " + formatBytes(responseData["storageused"]) + " out of " + formatBytes(responseData["storagemax"])
-            });
+                storageProgressThing.value = responseData["storageused"]
-            logOutButton.addEventListener("click", (event) => {
+                storageProgressThing.max = responseData["storagemax"]
+            }
+            doStuff()
+        });
+}
+usernameBox.addEventListener("click", (event) => {
+    optionsCoverDiv.classList.remove("hidden")
+    updateUserInfo()
+});
+logOutButton.addEventListener("click", (event) => {
+    window.location.href = "/api/logout"
+});
+exitThing.addEventListener("click", (event) => {
+    optionsCoverDiv.classList.add("hidden")
+});
+deleteMyAccountButton.addEventListener("click", (event) => {
+    if (confirm("are you REALLY sure that you want to delete your account? there's no going back.") == true) {
+        fetch("/api/deleteaccount", {
+            method: "POST",
+            body: JSON.stringify({
+                secretKey: secretkey
+            }),
+            headers: {
+                "Content-type": "application/json; charset=UTF-8"
+            }
+        })
+        .then((response) => response)
+        .then((response) => {
+            if (response.status == 200) {
                 window.location.href = "/api/logout"
-            });
+            } else {
-            exitThing.addEventListener("click", (event) => {
+                alert("failed to delete account (" + String(response.status) + ")")
-                optionsCoverDiv.classList.add("hidden")
+            }
-            });
+        })
-        }
+    }
-        doStuff()
+});
-    });
+
+updateUserInfo()
 
 function selectNote(nameithink) {
     document.querySelectorAll(".noteButton").forEach((el) => el.classList.remove("selected"));

static/js/signup.js

@@ -1,9 +1,11 @@
 if (localStorage.getItem("DONOTSHARE-secretkey") !== null) {
     window.location.replace("/app")
+    document.body.innerHTML = "Redirecting.."
     throw new Error();
 }
 if (localStorage.getItem("DONOTSHARE-password") !== null) {
     window.location.replace("/app")
+    document.body.innerHTML = "Redirecting.."
     throw new Error();
 }
 

templates/app.html

@@ -29,9 +29,10 @@
             <button class="exit" id="exitThing">X</button>
             <h3>manage your account</h3>
             <p id="usernameThing"></p>
+            <progress id="storageProgressThing" value="0" max="100"></progress><br>
             <p id="storageThing"></p>
             <button id="logOutButton">log out</button>
-            <button class="hidden" id="logOutButton">delete my account</button>
+            <button id="deleteMyAccountButton">delete my account</button>
         </div>
     </div>
 

templates/main.html

@@ -13,19 +13,22 @@
     <div class="mainDiv">
     <br>
     <h1>burgernotes</h1>
-    <p>minimal note taking app</p>
+    <p>simple note taking app</p>
     <br>
     <a href="/signup">sign up</a>
     <a href="/login">log in</a>
     <br><br><br>
 
+    <img height="280px" src="/static/mainimg.png">
+
+    <br><br>
     <div class="feature green">
         <h4>secure</h4>
         <p>all your notes are fully end-to-end encrypted. only you can read your notes, not anyone else.</p>
     </div>
     <div class="feature yellow">
         <h4>always up-to-date</h4>
-        <p>your notes automatically sync across your devices.</p>
+        <p>your notes seamlessly sync across your devices.</p>
     </div>
     </div>
 </body>