diff --git a/frontend/app.js b/frontend/app.js
index d384be3..c62926d 100644
--- a/frontend/app.js
+++ b/frontend/app.js
@@ -18,6 +18,8 @@
let editorVault = null;
let editorPath = null;
let fallbackEditorEl = null;
+ let sidebarFilterCaseSensitive = false;
+ let searchCaseSensitive = false;
const panelState = {
vault: true,
tag: true,
@@ -623,11 +625,30 @@
// ---------------------------------------------------------------------------
function initSidebarFilter() {
const input = document.getElementById("sidebar-filter-input");
+ const caseBtn = document.getElementById("sidebar-filter-case-btn");
+ const clearBtn = document.getElementById("sidebar-filter-clear-btn");
+
input.addEventListener("input", () => {
- const q = input.value.trim().toLowerCase();
+ const q = sidebarFilterCaseSensitive ? input.value.trim() : input.value.trim().toLowerCase();
filterSidebarTree(q);
filterTagCloud(q);
});
+
+ caseBtn.addEventListener("click", () => {
+ sidebarFilterCaseSensitive = !sidebarFilterCaseSensitive;
+ caseBtn.classList.toggle("active");
+ const q = sidebarFilterCaseSensitive ? input.value.trim() : input.value.trim().toLowerCase();
+ filterSidebarTree(q);
+ filterTagCloud(q);
+ });
+
+ clearBtn.addEventListener("click", () => {
+ input.value = "";
+ sidebarFilterCaseSensitive = false;
+ caseBtn.classList.remove("active");
+ filterSidebarTree("");
+ filterTagCloud("");
+ });
}
function filterSidebarTree(query) {
@@ -646,8 +667,9 @@
// Second pass: show matching items and their ancestors
items.forEach((item) => {
- const text = item.textContent.toLowerCase();
- if (text.includes(query)) {
+ const text = sidebarFilterCaseSensitive ? item.textContent : item.textContent.toLowerCase();
+ const searchQuery = sidebarFilterCaseSensitive ? query : query.toLowerCase();
+ if (text.includes(searchQuery)) {
item.classList.remove("filtered-out");
// Show all ancestor containers
let parent = item.parentElement;
@@ -665,8 +687,9 @@
function filterTagCloud(query) {
const tags = document.querySelectorAll("#tag-cloud .tag-item");
tags.forEach((tag) => {
- const text = tag.textContent.toLowerCase();
- if (!query || text.includes(query)) {
+ const text = sidebarFilterCaseSensitive ? tag.textContent : tag.textContent.toLowerCase();
+ const searchQuery = sidebarFilterCaseSensitive ? query : query.toLowerCase();
+ if (!query || text.includes(searchQuery)) {
tag.classList.remove("filtered-out");
} else {
tag.classList.add("filtered-out");
@@ -1237,6 +1260,9 @@
// ---------------------------------------------------------------------------
function initSearch() {
const input = document.getElementById("search-input");
+ const caseBtn = document.getElementById("search-case-btn");
+ const clearBtn = document.getElementById("search-clear-btn");
+
input.addEventListener("input", () => {
clearTimeout(searchTimeout);
searchTimeout = setTimeout(() => {
@@ -1250,6 +1276,18 @@
}
}, 300);
});
+
+ caseBtn.addEventListener("click", () => {
+ searchCaseSensitive = !searchCaseSensitive;
+ caseBtn.classList.toggle("active");
+ });
+
+ clearBtn.addEventListener("click", () => {
+ input.value = "";
+ searchCaseSensitive = false;
+ caseBtn.classList.remove("active");
+ showWelcome();
+ });
}
async function performSearch(query, vaultFilter, tagFilter) {
diff --git a/frontend/index.html b/frontend/index.html
index 1666988..f0d23ea 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -79,6 +79,12 @@
+
+
@@ -148,13 +154,19 @@