New Commit: Add study note action to highlight toolbar Introduces an "Add Note" button in the reader highlight toolbar. The new action captures the current text selection, prompts for a note, appends a formatted entry (book/chapter/time) to Quick Notes with existing autosave behavior (or localStorage fallback), and marks the selected text with a green note highlight that surfaces the note on interaction.

Repository: Hestenb62/_legacy_backup

Author: Hesten Berger

Commit Message: Add study note action to highlight toolbar Introduces an "Add Note" button in the reader highlight toolbar. The new action captures the current text selection, prompts for a note, appends a formatted entry (book/chapter/time) to Quick Notes with existing autosave behavior (or localStorage fallback), and marks the selected text with a green note highlight that surfaces the note on interaction.

URL: https://github.com/Hestenb62/_legacy_backup/commit/42623da30722aae0d200a8ac9ff236c9d73ea4dd

Code Changes:

diff --git a/library/read/reader.js b/library/read/reader.js
index bb13ec0..8c69d5d 100644
--- a/library/read/reader.js
+++ b/library/read/reader.js
@@ -55,6 +55,7 @@ document.addEventListener("DOMContentLoaded", () => {
     // Highlight Toolbar Elements
     const hlToolbar = document.getElementById("highlight-toolbar");
     const hlMarkBtn = document.getElementById("hl-btn-mark");
+    const hlNoteBtn = document.getElementById("hl-btn-note");
     const hlCopyBtn = document.getElementById("hl-btn-copy");
 
     // --- Settings Panel Toggle ---
@@ -427,6 +428,59 @@ document.addEventListener("DOMContentLoaded", () => {
                 setTimeout(() => hlCopyBtn.innerHTML = originalHTML, 1500);
             });
         });
+
+        if (hlNoteBtn) {
+            hlNoteBtn.addEventListener("click", () => {
+                if (!currentRange) return;
+                const selectedText = currentRange.toString().trim();
+                if (!selectedText) return;
+
+                const noteText = prompt(`Add a study note for: "${selectedText.substring(0, 30)}${selectedText.length > 30 ? '...' : ''}"`);
+                if (noteText === null) return; // user cancelled
+
+                const bookTitle = window.BOOK_METADATA ? window.BOOK_METADATA.title : 'Book';
+                const chapterNum = window.BOOK_METADATA ? window.BOOK_METADATA.chapterNum : 1;
+
+                // Format note entry to append
+                const timeStr = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+                const noteEntry = `\n\n[Note - ${bookTitle}, Ch ${chapterNum} @ ${timeStr}]\n"${selectedText}"\nNote: ${noteText}\n`;
+
+                const notesArea = document.getElementById("quick-notes-area");
+                if (notesArea) {
+                    notesArea.value = (notesArea.value + noteEntry).trim();
+                    // Dispatch input event to trigger the existing debounce auto-save
+                    notesArea.dispatchEvent(new Event('input'));
+                } else {
+                    // Fallback to direct local storage save if not loaded
+                    try {
+                        const existing = localStorage.getItem("hl_scratchpad") || "";
+                        localStorage.setItem("hl_scratchpad", (existing + noteEntry).trim());
+                    } catch (e) {}
+                }
+
+                // Surround contents with a soft green highlight representing the note
+                try {
+                    const mark = document.createElement("mark");
+                    mark.style.backgroundColor = "rgba(74, 222, 128, 0.4)"; // Soft green
+                    mark.style.borderRadius = "0.25rem";
+                    mark.style.padding = "0 0.25rem";
+                    mark.style.cursor = "pointer";
+                    mark.title = `Note: ${noteText}`;
+
+                    // Show note on click
+                    mark.addEventListener("click", () => {
+                        alert(`Study Note:\n"${selectedText}"\n\nNote Details:\n${noteText}`);
+                    });
+
+                    currentRange.surroundContents(mark);
+                    window.getSelection().removeAllRanges();
+                } catch (e) {
+                    console.log("Boundary crossed highlighting for note", e);
+                }
+
+                hlToolbar.classList.add("hidden");
+            });
+        }
     }
 
     // --- Vocabulary Study Guide Modal & Flashcards & Quiz Router ---
diff --git a/library/read/reader_template.php b/library/read/reader_template.php
index 0ee73da..871178c 100644
--- a/library/read/reader_template.php
+++ b/library/read/reader_template.php
@@ -222,6 +222,8 @@ include ABSPATH . 'src/header.php';
 <div id="highlight-toolbar" class="hidden">
     <button id="hl-btn-mark" class="hl-btn"><i class="fas fa-highlighter text-yellow-400"></i> Mark</button>
     <div class="hl-divider"></div>
+    <button id="hl-btn-note" class="hl-btn"><i class="fas fa-sticky-note text-green-400"></i> Add Note</button>
+    <div class="hl-divider"></div>
     <button id="hl-btn-copy" class="hl-btn"><i class="fas fa-copy text-blue-400"></i> Copy</button>
 </div>