2.7 KiB
2.7 KiB
Tasks: Side panel UX improvements
1. Storage: caret/scroll fields on the note record
- 1.1 Extend
saveNoteinshared/storage.jswith an optional caret parameter ({ caretStart, caretEnd, scrollTop }); when provided, write those fields onto the record (both insert and update-in-place paths); when absent, preserve existing fields - 1.2 Verify old records without caret fields still load and save unchanged (no IndexedDB version bump)
2. Caret persistence in the side panel
- 2.1 In
sidepanel/sidepanel.js, pass current caret (selectionStart/selectionEnd) andscrollToptosaveNotein the existing autosave (doSave) - 2.2 Track caret-only movement via
documentselectionchange(filtered to the editor) and editorscroll; debounce ~800ms into a caret-only save that callssaveNotewithout broadcasting; skip it while a content autosave is pending - 2.3 Flush any pending caret-only save on editor
blurand onvisibilitychange→ hidden
3. Focus and caret/scroll restore
- 3.1 In
loadNoteForTab, after settingeditor.value, restore caret viasetSelectionRangewith offsets clamped to content length (default 0 for legacy records), restorescrollTop(inrequestAnimationFrameif layout timing clamps it), and calleditor.focus() - 3.2 Make
reloadFromDBskip theeditor.valueassignment when fetched content is identical, so remote saves never move the local caret unnecessarily - 3.3 Manually verify focus lands when the panel opens via toolbar action and via keyboard shortcut; caret restore works on panel open, tab switch, and SPA navigation
4. Adjustable font size
- 4.1 Add
A-andA+buttons to the header insidepanel/sidepanel.htmlbefore the☰button; style them like#open-listinsidepanel/sidepanel.css - 4.2 In
sidepanel/sidepanel.js, implement font-size state: default 16px, range 10–24px, step 1px; apply viaeditor.style.fontSize; load fromlocalStorage(side-notes:fontSize) at init and persist on every change - 4.3 Wire the two buttons to decrease/increase with clamping
- 4.4 Add keyboard shortcuts in the existing keydown handler:
Ctrl/Cmd+=(and+variant) increase,Ctrl/Cmd+-decrease,Ctrl/Cmd+0reset to 16px, all withpreventDefault() - 4.5 Verify the find match scrolling (
selectMatch) still scrolls correctly at min and max font sizes
5. Validation
- 5.1 Load the unpacked extension and walk every scenario in
specs/note-editor/spec.mdandspecs/notes-storage/spec.md - 5.2 Two-panel test: same note in two tabs — caret-only movement in A does not disturb B's caret; content edit in A still refreshes B (immediately when unfocused, deferred until blur when focused)