add stuff

This commit is contained in:
maaa 2023-10-16 20:45:00 +02:00
parent 839d04ebc6
commit df9d21da58
6 changed files with 191 additions and 15 deletions

13
main
View File

@ -438,6 +438,19 @@ def apisessionsremove():
else: else:
return {}, 422 return {}, 422
@app.route("/api/submitfeedback", methods=("GET", "POST"))
def apisubmitfeedback():
if request.method == "POST":
data = request.get_json()
secretKey = data["secretKey"]
feedback = data["feedback"]
print("feedback: " + feedback)
return {}, 200
@app.route("/listusers/<secretkey>", methods=("GET", "POST")) @app.route("/listusers/<secretkey>", methods=("GET", "POST"))
def listusers(secretkey): def listusers(secretkey):
if secretkey == SECRET_KEY: if secretkey == SECRET_KEY:

View File

@ -13,7 +13,8 @@
--note-button-text-color: #ffffff; --note-button-text-color: #ffffff;
--unselected-note-button-text-color: #000000; --unselected-note-button-text-color: #000000;
--option-background: #ffffff; --option-background: #ffffff;
--invert: 100% --invert: 100%;
--bottomBarHover: #e4e4e4;
} }
/* dark mode */ /* dark mode */
@ -32,48 +33,68 @@
--note-button-text-color: #ffffff; --note-button-text-color: #ffffff;
--unselected-note-button-text-color: #ffffff; --unselected-note-button-text-color: #ffffff;
--option-background: #202124; --option-background: #202124;
--invert: 100% --invert: 100%;
--bottomBarHover: #e4e4e4;
} }
.startDiv p { .startDiv p {
color: white !important; color: white !important;
} }
.topBar p { .topBar p {
color: white !important; color: white !important;
} }
.newNote { .newNote {
color: white !important; color: white !important;
} }
.newNote img { .newNote img {
filter: invert(100%) filter: invert(100%)
} }
#errorDiv p { #errorDiv p {
color: white !important; color: white !important;
} }
.optionsCoverDiv p { .optionsCoverDiv p {
color: white !important; color: white !important;
} }
.burgerSession img { .burgerSession img {
filter: invert(100%) !important filter: invert(100%) !important
} }
.feature h3, p {
.feature h3,
p {
color: black !important; color: black !important;
} }
.links a { .links a {
color: white !important; color: white !important;
} }
.inoutdiv p { .inoutdiv p {
color: white !important; color: white !important;
} }
.inoutdiv a { .inoutdiv a {
color: #969696 !important; color: #969696 !important;
} }
.inoutdiv input { .inoutdiv input {
color: white; color: white;
background-color: #202124; background-color: #202124;
} }
} }
p, h1, h2, h3, h4, h5, h6 { p,
h1,
h2,
h3,
h4,
h5,
h6 {
color: var(--text-color); color: var(--text-color);
} }
@ -97,6 +118,48 @@ body {
border-bottom-width: 1px; border-bottom-width: 1px;
} }
.bottomBar {
position: fixed;
width: 100%;
height: 29px;
bottom: 0;
background-color: var(--bar);
border: solid;
border-color: var(--border-color);
border-width: 0px;
border-top-width: 1px;
}
.bottomBar button {
background-color: rgba(0, 0, 0, 0);
color: var(--text-color);
height: 100%;
border: none;
font-size: 14px;
padding-left: 7.5px;
padding-right: 7.5px;
}
.bottomBar .removeButton {
padding-left: 17.5px;
padding-right: 17.5px;
transform: translateY(-5px);
background-image: url("/static/svg/delete.svg");
background-position: center;
background-repeat: no-repeat;
background-size: 55%;
}
.bottomBar button:hover {
background-color: var(--bottomBarHover);
}
.bottomBar .right {
float: right;
}
.burgerDropdown { .burgerDropdown {
position: fixed; position: fixed;
z-index: 2; z-index: 2;
@ -140,7 +203,6 @@ body {
.topBar .logo { .topBar .logo {
padding-left: 12px; padding-left: 12px;
cursor: pointer;
} }
.topBar .usernameBox { .topBar .usernameBox {
@ -153,8 +215,8 @@ body {
.notesBar { .notesBar {
position: fixed; position: fixed;
width: 180px; width: 180px;
bottom: 0; top: 50px;
height: calc(100% - 50px - 1px); height: calc(100% - 50px - 30px - 1px);
background-color: var(--bar); background-color: var(--bar);
@ -189,6 +251,7 @@ body {
font-size: 15px; font-size: 15px;
text-align: left; text-align: left;
cursor: pointer;
} }
.notesBar .loadingStuff { .notesBar .loadingStuff {
@ -227,6 +290,7 @@ body {
font-size: 16px; font-size: 16px;
margin-bottom: 5px; margin-bottom: 5px;
cursor: pointer;
} }
.notesBar .newNote img { .notesBar .newNote img {
@ -239,14 +303,14 @@ body {
resize: none; resize: none;
position: fixed; position: fixed;
right: 0; right: 0;
bottom: 0; top: 55px;
padding: 4px; padding: 4px;
border: none; border: none;
font-size: 16px; font-size: 16px;
color: var(--text-color); color: var(--text-color);
background-color: var(--editor); background-color: var(--editor);
width: calc(100% - 180px - 7px - 6px); width: calc(100% - 180px - 7px - 6px);
height: calc(100% - 50px - 6px - 8px); height: calc(100% - 50px - 6px - 8px - 30px);
font-family: "Inter", sans-serif; font-family: "Inter", sans-serif;
} }
@ -288,6 +352,7 @@ body {
text-decoration: none; text-decoration: none;
background-color: var(--theme-color); background-color: var(--theme-color);
border-radius: 8px; border-radius: 8px;
cursor: pointer;
} }
.optionsDiv .normalButton { .optionsDiv .normalButton {
@ -311,6 +376,7 @@ body {
border-width: 1px; border-width: 1px;
border-radius: 8px; border-radius: 8px;
} }
.optionsDiv .mfacheckbox { .optionsDiv .mfacheckbox {
display: inline; display: inline;
margin: 0; margin: 0;
@ -320,6 +386,7 @@ body {
height: 17px; height: 17px;
width: 17px; width: 17px;
} }
.optionsDiv input:focus { .optionsDiv input:focus {
outline: 0; outline: 0;
border-color: var(--theme-color); border-color: var(--theme-color);

View File

@ -131,9 +131,10 @@ closeErrorButton.addEventListener("click", (event) => {
optionsCoverDiv.classList.add("hidden") optionsCoverDiv.classList.add("hidden")
}); });
function displayPrompt(message, callback) { function displayPrompt(message, placeholdertext, callback) {
errorMessageThing.innerText = message errorMessageThing.innerText = message
errorInput.value = "" errorInput.value = ""
errorInput.placeholder = placeholdertext
closeErrorButton.addEventListener("click", (event) => { closeErrorButton.addEventListener("click", (event) => {
if (callback) { if (callback) {
@ -175,6 +176,29 @@ closeErrorButton.addEventListener("click", (event) => {
cancelErrorButton.classList.add("hidden") cancelErrorButton.classList.add("hidden")
}); });
function updateFont() {
let currentFontSize = localStorage.getItem("SETTING-fontsize")
noteBox.style.fontSize = currentFontSize + "px"
textSizeBox.innerText = currentFontSize + "px"
}
if (localStorage.getItem("SETTING-fontsize") === null) {
localStorage.setItem("SETTING-fontsize", "16")
updateFont()
} else {
updateFont()
}
textPlusBox.addEventListener("click", (event) => {
localStorage.setItem("SETTING-fontsize", String(Number(localStorage.getItem("SETTING-fontsize")) + Number(1)))
updateFont()
});
textMinusBox.addEventListener("click", (event) => {
localStorage.setItem("SETTING-fontsize", String(Number(localStorage.getItem("SETTING-fontsize")) - Number(1)))
updateFont()
});
function updateUserInfo() { function updateUserInfo() {
fetch("/api/userinfo", { fetch("/api/userinfo", {
method: "POST", method: "POST",
@ -238,7 +262,7 @@ deleteMyAccountButton.addEventListener("click", (event) => {
if (response.status == 200) { if (response.status == 200) {
window.location.href = "/api/logout" window.location.href = "/api/logout"
} else { } else {
displayError("failed to delete account (" + String(response.status) + ")") displayError("failed to delete account (HTTP error code " + response.status + ")")
} }
}) })
} }
@ -336,6 +360,14 @@ exitMfaThing.addEventListener("click", (event) => {
updateUserInfo() updateUserInfo()
function updateWordCount() {
let wordCount = noteBox.value.split(" ").length
if (wordCount == 1) {
wordCount = 0
}
wordCountBox.innerText = wordCount + " words"
}
function selectNote(nameithink) { function selectNote(nameithink) {
document.querySelectorAll(".noteButton").forEach((el) => el.classList.remove("selected")); document.querySelectorAll(".noteButton").forEach((el) => el.classList.remove("selected"));
let thingArray = Array.from(document.querySelectorAll(".noteButton")).find(el => el.id == nameithink); let thingArray = Array.from(document.querySelectorAll(".noteButton")).find(el => el.id == nameithink);
@ -370,8 +402,10 @@ function selectNote(nameithink) {
let originalText = bytes.toString(CryptoJS.enc.Utf8); let originalText = bytes.toString(CryptoJS.enc.Utf8);
noteBox.value = originalText noteBox.value = originalText
updateWordCount()
noteBox.addEventListener("input", (event) => { noteBox.addEventListener("input", (event) => {
updateWordCount()
clearTimeout(timer); clearTimeout(timer);
timer = setTimeout(() => { timer = setTimeout(() => {
let encryptedText = CryptoJS.AES.encrypt(noteBox.value, password).toString(); let encryptedText = CryptoJS.AES.encrypt(noteBox.value, password).toString();
@ -424,6 +458,7 @@ function updateNotes() {
noteBox.placeholder = "" noteBox.placeholder = ""
noteBox.value = "" noteBox.value = ""
clearTimeout(timer) clearTimeout(timer)
updateWordCount()
let responseData = await response.json() let responseData = await response.json()
for (let i in responseData) { for (let i in responseData) {
@ -470,7 +505,7 @@ function updateNotes() {
updateNotes() updateNotes()
newNote.addEventListener("click", (event) => { newNote.addEventListener("click", (event) => {
let noteName = displayPrompt("note name? :3", burgerFunction) let noteName = displayPrompt("note name? :3", "e.g. shopping list", burgerFunction)
function burgerFunction(noteName) { function burgerFunction(noteName) {
if (noteName != null) { if (noteName != null) {
let encryptedName = CryptoJS.AES.encrypt(noteName, password).toString(); let encryptedName = CryptoJS.AES.encrypt(noteName, password).toString();
@ -487,11 +522,10 @@ newNote.addEventListener("click", (event) => {
.catch((error) => { .catch((error) => {
displayError("failed to create new note, please try again later") displayError("failed to create new note, please try again later")
}) })
.then((response) => response)
.then((response) => { .then((response) => {
if (response.status !== 200) { if (response.status !== 200) {
updateNotes() updateNotes()
displayError("something went wrong while creating note") displayError("failed to create new note (HTTP error code " + response.status + ")")
} else { } else {
updateNotes() updateNotes()
} }
@ -552,4 +586,56 @@ function exportNotes() {
exportNotesButton.addEventListener("click", (event) => { exportNotesButton.addEventListener("click", (event) => {
exportNotesButton.innerText = "downloading.." exportNotesButton.innerText = "downloading.."
exportNotes() exportNotes()
});
sendFeedbackButton.addEventListener("click", (event) => {
let noteName = displayPrompt("Feedback:", "Write your feedback here. Don't include personal info.", burgerFunction)
function burgerFunction(feedbackText) {
if (feedbackText != null) {
fetch("/api/submitfeedback", {
method: "POST",
body: JSON.stringify({
secretKey: secretkey,
feedback: feedbackText
}),
headers: {
"Content-type": "application/json; charset=UTF-8"
}
})
.catch((error) => {
displayError("failed to submit feedback, please try again later")
})
.then((response) => {
if (response.status == 200) {
displayError("Thank you for submitting feedback!")
} else {
displayError("failed to submit feedback (HTTP error code " + response.status + ")")
}
});
};
}
});
removeBox.addEventListener("click", (event) => {
if (selectedNote == 0) {
displayError("you need to select a note first!")
} else {
fetch("/api/removenote", {
method: "POST",
body: JSON.stringify({
secretKey: secretkey,
noteId: selectedNote
}),
headers: {
"Content-type": "application/json; charset=UTF-8"
}
})
.then((response) => response)
.then((response) => {
updateNotes()
})
.catch((error) => {
displayError("something went wrong! please try again later")
})
}
}); });

Binary file not shown.

Before

Width:  |  Height:  |  Size: 663 KiB

1
static/svg/delete.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24"><path d="M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z"/></svg>

After

Width:  |  Height:  |  Size: 300 B

View File

@ -18,6 +18,15 @@
<p tabindex="0" id="usernameBox" class="usernameBox"></p> <p tabindex="0" id="usernameBox" class="usernameBox"></p>
</div> </div>
<div class="bottomBar">
<button id="removeBox" class="removeButton"></button>
<button id="wordCountBox">0 words</button>
<button id="textMinusBox" class="right">-</button>
<button id="textSizeBox" class="right">16px</button>
<button id="textPlusBox" class="right">+</button>
<button id="sendFeedbackButton" class="right">Send feedback</button>
</div>
<div id="notesBar" class="notesBar"> <div id="notesBar" class="notesBar">
<button id="newNote" class="newNote"><img id="newNoteImage" draggable="false" alt="" <button id="newNote" class="newNote"><img id="newNoteImage" draggable="false" alt=""
src="/static/svg/add.svg">new note</button> src="/static/svg/add.svg">new note</button>
@ -70,7 +79,7 @@
</div> </div>
<div id="errorDiv" class="optionsDiv hidden"> <div id="errorDiv" class="optionsDiv hidden">
<p id="errorMessageThing"></p> <p id="errorMessageThing"></p>
<input class="hidden" id="errorInput" type="text" placeholder="e.g. shopping list"><br></input> <input class="hidden" id="errorInput" type="text" placeholder=""><br></input>
<button class="normalButton" id="closeErrorButton">OK</button> <button class="normalButton" id="closeErrorButton">OK</button>
<button class="normalButton hidden" id="cancelErrorButton">Cancel</button> <button class="normalButton hidden" id="cancelErrorButton">Cancel</button>
</div> </div>