Zadnji vnosi
+ Dodaj nov vnos
Išči
diff --git a/new.html b/new.html
new file mode 100644
index 0000000..0d11034
--- /dev/null
+++ b/new.html
@@ -0,0 +1,38 @@
+
+
+
+
+
+
Nov vnos
+
+
+
+
+
+
+
+ Nov vnos
+
+
+
+
+
×
+
Potrdilo
+
+
Ali ste prepričani, da želite dodati ta vnos?
+
Preverite vsebino pred shranjevanjem!
+
+ Da, dodaj vnos
+ Ne, prekliči
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/scripts/contact.js b/scripts/contact.js
index d982306..6091fda 100644
--- a/scripts/contact.js
+++ b/scripts/contact.js
@@ -3,7 +3,7 @@ const form = `
Sporočilo:
Pošlji
-
Vaše sporočilo bo vezano na vaš račun, zato vam bomo lahko odgovorili na e-pošto, ki ste jo vnesli ob registraciji.
+
Vaše sporočilo bo vezano na vaš račun, zato vam bomo lahko odgovorili na e-pošto, ki ste jo vnesli ob registraciji.
`;
document.addEventListener("DOMContentLoaded", () => {
diff --git a/scripts/index.js b/scripts/index.js
index 2ac385c..ba2745d 100644
--- a/scripts/index.js
+++ b/scripts/index.js
@@ -100,5 +100,9 @@ document.getElementById("search-input").addEventListener("keydown", (event) => {
}
});
+function addEntry() {
+ window.location.href = "/new.html";
+}
+
// DELAJ DELAJ
getLast();
\ No newline at end of file
diff --git a/scripts/login.js b/scripts/login.js
index c8fcf2e..092a8ab 100644
--- a/scripts/login.js
+++ b/scripts/login.js
@@ -29,6 +29,7 @@ document.getElementById("login-form").addEventListener("submit", async function(
if (response.status === 200) {
// Nastavi cookie, 3 ure veljaven
document.cookie = `token=${data.token}; max-age=${3 * 60 * 60}; path=/; secure; samesite=strict`;
+ document.cookie = `username=${username}; max-age=${3 * 60 * 60}; path=/; secure; samesite=strict`;
window.location.href = "/";
return;
diff --git a/scripts/main.js b/scripts/main.js
index 2e6e455..e585e3a 100644
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -45,6 +45,8 @@ function updateToggleState(theme) {
function logout() {
// Odstrani cookie tako, da ga nastaviš z max-age=0
document.cookie = 'token=; max-age=0; path=/; secure; samesite=strict';
+ document.cookie = 'username=; max-age=0; path=/; secure; samesite=strict';
+ window.location.href = "/";
}
document.addEventListener("DOMContentLoaded", function() {
diff --git a/scripts/new.js b/scripts/new.js
new file mode 100644
index 0000000..73f40d0
--- /dev/null
+++ b/scripts/new.js
@@ -0,0 +1,95 @@
+const form = `
+
`;
+
+document.getElementById("confirm-add").addEventListener("click", () => {
+ document.getElementById("new-entry-form-modal").style.display = "none";
+
+ const url = "http://localhost:3000/nov-vnos";
+ let content = document.getElementById("content").value;
+ const key = document.getElementById("key").value;
+ const examples = document.getElementById("examples").value ? "Primer: " + document.getElementById("examples").value : "Ni podanih primerov.";
+ const type = document.getElementById("type").value;
+
+ content = content.replace("
", "");
+ content = content.replace("
", "");
+
+ fetch(url, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json"
+ },
+ body: JSON.stringify({ "token": document.cookie.split(";").find(cookie => cookie.trim().startsWith("token=")).split("=")[1], "content": content, "key": key, "examples": examples, "type": type })
+ })
+ .then(response => {
+ if (!response.ok) {
+ throw new Error("Network response was not ok");
+ }
+ return response.json();
+ })
+ .then(data => {
+ console.log("Success:", data);
+ document.getElementById("contact-form").innerHTML = `
Hvala za vaš vnos!
`;
+ })
+ .catch((error) => {
+ console.error("Error:", error);
+ document.getElementById("contact-form").innerHTML = `
Prišlo je do napake pri dodajanju vnosa. Prosimo, poskusite znova pozneje.
`;
+ });
+});
+
+document.getElementById("cancel-add").addEventListener("click", () => {
+ document.getElementById("new-entry-form-modal").style.visibility = "hidden";
+});
+
+document.getElementById("close-modal").addEventListener("click", () => {
+ document.getElementById("new-entry-form-modal").style.visibility = "hidden";
+});
+
+document.addEventListener("DOMContentLoaded", () => {
+ const contactFormContainer = document.getElementById("entry-form-container");
+ // Najdi cookie "token" v cookies
+ const isLoggedIn = document.cookie.split(";").some(cookie => cookie.trim().startsWith("token="));
+ if (contactFormContainer && isLoggedIn) {
+ contactFormContainer.innerHTML = form;
+
+ document.getElementById("contact-form").addEventListener("submit", (e) => {
+ e.preventDefault();
+ document.getElementById("new-entry-form-modal").style.visibility = "visible";
+
+ // TODO: Popravi margin pri success in error textu da ne bo offsetan
+
+ });
+ } else if (contactFormContainer) {
+ contactFormContainer.innerHTML = `
Za dodajanje vnosov se morate prijaviti.
`;
+ }
+});
\ No newline at end of file
diff --git a/scripts/vnos.js b/scripts/vnos.js
index d7a3487..58d81ed 100644
--- a/scripts/vnos.js
+++ b/scripts/vnos.js
@@ -26,8 +26,53 @@ function getKey() {
Vnos dodal: ${data.data.avtor}
`;
+ // Preveri lastinino
+ let addIf = ``;
+
+ if (data.data.avtor === document.cookie.split(";").find(cookie => cookie.trim().startsWith("username="))?.split("=")[1]) {
+ addIf = `
Izbriši vnos `;
+ }
+
+ build += addIf;
+
document.getElementById("page-title").innerText = `Vnos '${data.data.kljuc}'`;
document.getElementById("entry-container-single").innerHTML += build;
+
+ document.getElementById("delete-entry-button")?.addEventListener("click", () => {
+ document.getElementById("delete-entry-modal").style.visibility = "visible";
+ });
+
+ document.getElementById("cancel-delete")?.addEventListener("click", () => {
+ document.getElementById("delete-entry-modal").style.visibility = "hidden";
+ });
+
+ document.getElementById("confirm-delete")?.addEventListener("click", () => {
+ fetch("http://localhost:3000/izbrisi-vnos", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json"
+ },
+ body: JSON.stringify({ "token": document.cookie.split(";").find(cookie => cookie.trim().startsWith("token=")).split("=")[1], "pk": kljuc })
+ })
+ .then(response => {
+ if (!response.ok) {
+ throw new Error("Network response was not ok");
+ }
+ return response.json();
+ })
+ .then(data => {
+ console.log("Success:", data);
+ window.location.href = "/";
+ })
+ .catch((error) => {
+ console.error("Error:", error);
+ document.getElementById("delete-entry-modal").style.visibility = "hidden";
+ });
+ });
+
+ document.getElementById("close-modal")?.addEventListener("click", () => {
+ document.getElementById("delete-entry-modal").style.visibility = "hidden";
+ });
})
.catch((error) => {
console.error('Error:', error);
diff --git a/styles/main.css b/styles/main.css
index ac2ae34..8444653 100644
--- a/styles/main.css
+++ b/styles/main.css
@@ -14,6 +14,8 @@
--toggle-icon-color: #f5f5f5;
--nav-btn-primary-bg: #007acc;
--nav-btn-primary-hover-bg: #006bb3;
+ --nav-btn-danger-bg: #e74c3c;
+ --nav-btn-danger-hover-bg: #c0392b;
}
:root[data-theme="light"] {
@@ -30,6 +32,8 @@
--toggle-icon-color: #444;
--nav-btn-primary-bg: #007acc;
--nav-btn-primary-hover-bg: #006bb3;
+ --nav-btn-danger-bg: #e74c3c;
+ --nav-btn-danger-hover-bg: #c0392b;
}
* {
@@ -270,13 +274,16 @@ nav {
font-weight: 500;
line-height: 1.1;
font-family: inherit;
+ cursor: pointer;
/* Smooth Theme Transition */
transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
.nav-btn:hover,
-.nav-btn:focus-visible {
+.nav-btn:focus-visible,
+.page-btn:hover,
+.page-btn:focus-visible {
background: var(--nav-btn-hover-bg);
border-color: var(--nav-btn-hover-border);
outline: none;
@@ -296,6 +303,20 @@ nav {
outline: none;
}
+.nav-btn-danger {
+ background: var(--nav-btn-danger-bg);
+ border-color: var(--nav-btn-danger-bg);
+ color: #fff;
+}
+
+.nav-btn-danger:hover,
+.nav-btn-danger:focus-visible {
+ background: var(--nav-btn-danger-hover-bg);
+ border-color: var(--nav-btn-danger-hover-bg);
+ color: #fff;
+ outline: none;
+}
+
.contact-form {
display: flex;
flex-direction: column;
@@ -312,6 +333,90 @@ nav {
margin-right: 23px;
}
+.page-unordered-list {
+ list-style-type: disc;
+ padding-left: 20px;
+ color: var(--text-color);
+
+ /* Smooth Theme Transition */
+ transition: color 0.25s ease;
+}
+
+.modal {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(0, 0, 0, 0.5);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ z-index: 10;
+ visibility: hidden;
+}
+
+.close {
+ position: absolute;
+ top: 10px;
+ right: 10px;
+ font-size: 2rem;
+ background-color: var(--nav-btn-bg);
+ border: 1px solid var(--nav-btn-border);
+ border-radius: 4px;
+ padding: 0px 9px 3px 9px;
+ margin-top: 4px;
+ color: var(--text-color);
+ cursor: pointer;
+ transition: color 0.25s ease;
+}
+
+.close:hover {
+ color: var(--nav-btn-primary-bg);
+}
+
+.modal-content {
+ background: var(--nav-btn-bg);
+ padding: 20px;
+ border-radius: 8px;
+ width: 90%;
+ max-width: 400px;
+ position: relative;
+ color: var(--text-color);
+ transition: background-color 0.25s ease, color 0.25s ease;
+}
+
+.modal-buttons {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+ margin-top: 20px;
+}
+
+.modal-buttons .page-btn:hover {
+ background: var(--nav-btn-hover-bg);
+ border-color: var(--nav-btn-hover-border);
+ color: var(--text-color);
+ outline: none;
+ cursor: pointer;
+}
+
+.modal-buttons .nav-btn-primary:hover {
+ background: var(--nav-btn-primary-hover-bg);
+ border-color: var(--nav-btn-primary-hover-bg);
+ color: #fff;
+ outline: none;
+ cursor: pointer;
+}
+
+.modal-buttons .nav-btn-danger:hover {
+ background: var(--nav-btn-danger-hover-bg);
+ border-color: var(--nav-btn-danger-hover-bg);
+ color: #fff;
+ outline: none;
+ cursor: pointer;
+}
+
@media (max-width: 720px) {
header {
padding: 6px 8px;
diff --git a/vnos.html b/vnos.html
index ab60b11..e45cdeb 100644
--- a/vnos.html
+++ b/vnos.html
@@ -19,6 +19,20 @@
Glavna stran
+
+
+
+
×
+
Izbris vnosa
+
+
Ali ste prepričani, da želite izbrisati ta vnos?
+
Ta dejanja ni mogoče razveljaviti!
+
+ Da, izbriši vnos
+ Ne, prekliči
+
+
+