diff --git a/priv/static/index.html b/priv/static/index.html
index c5f8ba2..9549ee0 100644
--- a/priv/static/index.html
+++ b/priv/static/index.html
@@ -63,6 +63,9 @@
+
+
+
diff --git a/priv/static/js/jenot.js b/priv/static/js/jenot.js
index be51c06..86c06fe 100644
--- a/priv/static/js/jenot.js
+++ b/priv/static/js/jenot.js
@@ -92,6 +92,36 @@ if (notificationsAvailable()) {
});
}
+// Search
+
+let filter = "";
+const search = document.querySelector("#search");
+
+search.addEventListener("input", (e) => {
+ filter = e.target.value.trim().toLowerCase();
+ Notes.saveStorage();
+});
+
+function filterNotes(notes) {
+ if (filter !== "") {
+ return notes.filter(
+ (n) =>
+ n.title.toLowerCase().indexOf(filter) > -1 ||
+ textOf(n.content).toLowerCase().indexOf(filter) > -1,
+ );
+ }
+
+ return notes;
+}
+
+function textOf(content) {
+ if (typeof content === "object") {
+ return content.map((n) => n.content).join("");
+ } else {
+ return content;
+ }
+}
+
// There are two note-form component instances - one for
// composing new notes and another one for editing existing notes.
@@ -155,7 +185,8 @@ function notesEqual(note1, note2) {
}
async function render() {
- const notes = await Notes.all();
+ const allNotes = await Notes.all();
+ const notes = filterNotes(allNotes);
const notesContainer = document.querySelector("#notes");
let previousId = null;
diff --git a/priv/static/style.css b/priv/static/style.css
index 0f4a67a..5f5e3de 100644
--- a/priv/static/style.css
+++ b/priv/static/style.css
@@ -311,6 +311,11 @@ button {
gap: var(--gap-1);
}
+#search {
+ width: 10em;
+ min-width: 0;
+}
+
#notes {
display: flex;
flex-direction: column;