doc updates

README.md

@@ -68,6 +68,17 @@ NoteDiscovery is a **lightweight, self-hosted note-taking application** that put
 - 📑 **Outline Panel** - Navigate headings with click-to-jump TOC
 - 🤖 **AI Assistant Ready** - MCP integration for Claude, Cursor & more
 
+## ✏️ Drawing editor
+
+NoteDiscovery isn’t only markdown—you can **sketch and annotate** without leaving the app. Create a **New drawing** from the sidebar; the app saves a `drawing-{timestamp}.png` next to your notes, same as any other file in your vault.
+
+- **Real tools** — Freehand pencil, straight lines, rectangles, ellipses, **eraser** (background-color stroke), **eyedropper** to sample colors from the canvas, and **clear** to replace the image with a blank canvas (with confirmation).
+- **Comfortable controls** — Color picker and stroke width on the drawing toolbar; **undo/redo** for strokes (same shortcuts as the editor when a drawing is open).
+- **Saves like everything else** — **Autosave** after you finish a stroke, plus **Ctrl+S** / **Cmd+S** to flush the PNG to disk immediately.
+- **Plain PNG** — Drawings are normal images on disk, so previews, export, and backups work the same as for screenshots or diagrams.
+
+> 📖 **Full details:** [DRAWING.md](documentation/DRAWING.md) · Listed in [FEATURES.md](documentation/FEATURES.md)
+
 ## 🤖 AI-Powered Note Management
 
 <p align="center">
@@ -240,6 +251,7 @@ Want to learn more?
 
 - 🎨 **[THEMES.md](documentation/THEMES.md)** - Theme customization and creating custom themes
 - ✨ **[FEATURES.md](documentation/FEATURES.md)** - Complete feature list and keyboard shortcuts
+- ✏️ **[DRAWING.md](documentation/DRAWING.md)** - Built-in drawing editor (`drawing-*.png`), save behavior, and API notes
 - 🏷️ **[TAGS.md](documentation/TAGS.md)** - Organize notes with tags and combined filtering
 - 📋 **[TEMPLATES.md](documentation/TEMPLATES.md)** - Create notes from reusable templates with dynamic placeholders
 - 🧮 **[MATHJAX.md](documentation/MATHJAX.md)** - LaTeX/Math notation examples and syntax reference

docs/index.html

@@ -7,8 +7,8 @@
     <!-- Primary Meta Tags -->
     <title>NoteDiscovery - Your Self-Hosted Knowledge Base</title>
     <meta name="title" content="NoteDiscovery - Your Self-Hosted Knowledge Base">
-    <meta name="description" content="A lightweight, privacy-focused Markdown note-taking application with AI assistant integration (MCP), wikilinks, graph view, LaTeX math, Mermaid diagrams, tags, templates, and code highlighting. Works with Claude, Cursor, and other AI tools. Self-hosted, free, and open source.">
+    <meta name="description" content="A lightweight, privacy-focused Markdown note-taking application with AI assistant integration (MCP), wikilinks, graph view, embedded drawing editor, LaTeX math, Mermaid diagrams, tags, templates, and code highlighting. Works with Claude, Cursor, and other AI tools. Self-hosted, free, and open source.">
-    <meta name="keywords" content="note taking, markdown editor, self-hosted, knowledge base, open source, privacy, notes app, docker, second brain, obsidian alternative, notion, evernote, onenote, latex, mermaid, diagrams, math equations, templates, tags, yaml frontmatter, AI assistant, MCP, model context protocol, Claude, Cursor, AI notes, AI knowledge base, AI-powered notes">
+    <meta name="keywords" content="note taking, markdown editor, self-hosted, knowledge base, open source, privacy, notes app, docker, second brain, obsidian alternative, notion, evernote, onenote, latex, mermaid, diagrams, drawing, sketch, whiteboard, math equations, templates, tags, yaml frontmatter, AI assistant, MCP, model context protocol, Claude, Cursor, AI notes, AI knowledge base, AI-powered notes">
     <meta name="author" content="Gamosoft">
     <meta name="robots" content="index, follow">
     <link rel="canonical" href="https://www.notediscovery.com">
@@ -17,7 +17,7 @@
     <meta property="og:type" content="website">
     <meta property="og:url" content="https://www.notediscovery.com">
     <meta property="og:title" content="NoteDiscovery - Your Self-Hosted Knowledge Base">
-    <meta property="og:description" content="AI-powered note-taking with MCP integration for Claude, Cursor & more. LaTeX math, Mermaid diagrams, graph view, wikilinks. Self-hosted, free, and open source.">
+    <meta property="og:description" content="AI-powered note-taking with MCP integration for Claude, Cursor & more. LaTeX math, Mermaid diagrams, drawing editor, graph view, wikilinks. Self-hosted, free, and open source.">
     <meta property="og:image" content="https://www.notediscovery.com/og-image.png">
     <meta property="og:image:width" content="1200">
     <meta property="og:image:height" content="630">
@@ -28,7 +28,7 @@
     <meta name="twitter:site" content="@gamosoft">
     <meta name="twitter:creator" content="@gamosoft">
     <meta name="twitter:title" content="NoteDiscovery - Your Self-Hosted Knowledge Base">
-    <meta name="twitter:description" content="AI-powered note-taking with MCP integration for Claude & Cursor. LaTeX, Mermaid diagrams, graph view. Self-hosted, free, open source.">
+    <meta name="twitter:description" content="AI-powered note-taking with MCP integration for Claude & Cursor. LaTeX, Mermaid diagrams, drawing editor, graph view. Self-hosted, free, open source.">
     <meta name="twitter:image" content="https://www.notediscovery.com/og-image.png">
     <meta name="twitter:image:alt" content="NoteDiscovery - Self-hosted note-taking application interface">
     
@@ -353,7 +353,7 @@
             animation: fadeInScale 0.6s ease-out forwards;
         }
 
-        /* Stagger animation delays for feature cards (5 rows × 3 cols = 15 cards) */
+        /* Stagger animation delays for feature cards (16 cards) */
         .feature.animated:nth-child(1) { animation-delay: 0s; }
         .feature.animated:nth-child(2) { animation-delay: 0.1s; }
         .feature.animated:nth-child(3) { animation-delay: 0.2s; }
@@ -369,6 +369,7 @@
         .feature.animated:nth-child(13) { animation-delay: 0.2s; }
         .feature.animated:nth-child(14) { animation-delay: 0.3s; }
         .feature.animated:nth-child(15) { animation-delay: 0.4s; }
+        .feature.animated:nth-child(16) { animation-delay: 0.45s; }
 
         .screenshot-section {
             margin: 4rem 0 3rem 0;
@@ -689,7 +690,7 @@
         <div class="hero animate-on-scroll">
             <div class="hero-content">
                 <h2>Take Control of Your Notes</h2>
-                <p>A lightweight, privacy-focused note-taking application with powerful features: AI assistant integration (MCP), LaTeX math equations, Mermaid diagrams, smart tags, custom templates, code highlighting, and more. Write and organize your notes with a beautiful, modern interface all running on your own server.</p>
+                <p>A lightweight, privacy-focused note-taking application with powerful features: AI assistant integration (MCP), LaTeX math equations, Mermaid diagrams, an embedded drawing editor for quick sketches, smart tags, custom templates, code highlighting, and more. Write and organize your notes with a beautiful, modern interface all running on your own server.</p>
                 <div class="cta-buttons">
                     <a href="https://gamosoft-notediscovery-demo.hf.space" class="cta-button demo" target="_blank" rel="noopener">Try Live Demo</a>
                     <a href="https://github.com/gamosoft/NoteDiscovery" class="cta-button" target="_blank" rel="noopener">Get Started on GitHub →</a>
@@ -858,6 +859,12 @@
                 <p>Create flowcharts, mind maps, and diagrams with Mermaid syntax.</p>
             </div>
 
+            <div class="feature animate-on-scroll">
+                <div class="feature-icon">✏️</div>
+                <h3>Drawing editor</h3>
+                <p>Sketch and annotate as PNG files next to your notes—autosave, shapes, eraser, and eyedropper.</p>
+            </div>
+
             <div class="feature animate-on-scroll">
                 <div class="feature-icon">💻</div>
                 <h3>Code Highlighting</h3>
@@ -1191,11 +1198,11 @@
       "@context": "https://schema.org",
       "@type": "SoftwareApplication",
       "name": "NoteDiscovery",
-      "description": "A lightweight, AI-powered Markdown note-taking application with MCP integration for Claude, Cursor and other AI assistants. Features LaTeX math, Mermaid diagrams, graph view, and code highlighting. Self-hosted Obsidian and Evernote alternative. Free and open source.",
+      "description": "A lightweight, AI-powered Markdown note-taking application with MCP integration for Claude, Cursor and other AI assistants. Features LaTeX math, Mermaid diagrams, drawing editor, graph view, and code highlighting. Self-hosted Obsidian and Evernote alternative. Free and open source.",
       "url": "https://www.notediscovery.com",
       "applicationCategory": "ProductivityApplication",
       "operatingSystem": "Linux, Windows, macOS",
-      "featureList": "AI assistant integration, MCP (Model Context Protocol), Claude integration, Cursor integration, Markdown editor, Wikilinks, Graph view, LaTeX math equations, Mermaid diagrams, Code syntax highlighting, Dark mode, Plugin system, Internal links, Properties panel, HTML export, Full-text search, Self-hosted, Obsidian alternative, Evernote alternative, Notion alternative, Second brain, AI-powered notes",
+      "featureList": "AI assistant integration, MCP (Model Context Protocol), Claude integration, Cursor integration, Markdown editor, Wikilinks, Graph view, Drawing editor, LaTeX math equations, Mermaid diagrams, Code syntax highlighting, Dark mode, Plugin system, Internal links, Properties panel, HTML export, Full-text search, Self-hosted, Obsidian alternative, Evernote alternative, Notion alternative, Second brain, AI-powered notes",
       "offers": {
         "@type": "Offer",
         "price": "0",

documentation/API.md

@@ -214,6 +214,31 @@ curl http://localhost:8000/api/media/folder/_attachments/image-20240417093343.pn
 - The file exists and is a valid media format
 - The requesting user is authenticated (if auth is enabled)
 
+### Update drawing (PNG in place)
+
+```http
+PUT /api/media/{media_path}
+Content-Type: image/png
+```
+
+Overwrites an **existing** file in the vault. The server only accepts targets whose filename matches **`drawing-*.png`** (lowercase `.png`). The body must be a valid **PNG** (magic bytes are checked). Used by the in-app drawing editor when saving.
+
+**Requirements:**
+- File must already exist (create new drawings via **New drawing** / `POST /api/upload-media` with `next_to_notes`, not via PUT).
+- Path must stay within the notes directory (same rules as GET).
+
+**Response:**
+```json
+{ "success": true, "path": "folder/drawing-20260101120000.png" }
+```
+
+**Example:**
+```bash
+curl -X PUT http://localhost:8000/api/media/myproject/drawing-20260101120000.png \
+  -H "Content-Type: image/png" \
+  --data-binary @sketch.png
+```
+
 ### Upload Media
 ```http
 POST /api/upload-media

documentation/DRAWING.md

@@ -0,0 +1,29 @@
+# Drawing editor
+
+NoteDiscovery includes a **built-in drawing editor** for sketching and annotating directly in the app. Drawings are stored as ordinary **PNG files** in your vault, so they work like any other image: previews, export, and backups behave the same.
+
+## Creating a drawing
+
+Use the **+ New** menu in the sidebar and choose **New drawing**. The app creates a file named `drawing-{timestamp}.png` next to your notes (in the folder you pick), then opens it in the drawing viewer.
+
+## Editor overview
+
+- **Tools** — Freehand pencil, straight line, rectangle, and ellipse; **eraser** (paints with the canvas background color); **eyedropper** to sample a color from the canvas.
+- **Color & stroke width** — Color picker and width slider appear on the same toolbar as the tools.
+- **Undo / redo** — Use the main toolbar buttons or **Ctrl+Z** / **Ctrl+Y** (same shortcuts as the note editor; they apply to strokes while a drawing is open).
+- **Clear** — Replaces the current session with a **blank white image** and schedules a save (see [FEATURES.md](FEATURES.md) for the exact behavior and confirmation).
+- **Saving** — Changes are saved automatically after you finish a stroke (debounced), and you can press **Ctrl+S** (Cmd+S on Mac) to save the PNG immediately.
+
+## Files on disk
+
+- Only files whose names match **`drawing-*.png`** are opened in the drawing editor; other PNGs open as normal images.
+- The saved PNG’s **pixel dimensions** match the drawing pane at save time (layout and device pixel ratio), similar to a screenshot of the canvas area.
+
+## API
+
+To update an existing drawing from automation, use **PUT `/api/media/{path}`** with a **PNG body**; the server only allows in-place updates for `drawing-*.png` paths. See [API.md](API.md#update-drawing-png-in-place).
+
+## See also
+
+- [FEATURES.md](FEATURES.md) — Full feature list and keyboard shortcuts  
+- [API.md](API.md) — Media endpoints  

documentation/FEATURES.md

@@ -15,6 +15,7 @@
 - **Public Sharing** - Share notes via token-based URLs with optional QR code for mobile (see [SHARING.md](SHARING.md))
 
 ### Media Support
+- **Drawing editor** - Create and edit **`drawing-*.png`** sketches next to your notes (pencil, shapes, eraser, eyedropper, autosave); see [DRAWING.md](DRAWING.md)
 - **Drag & drop upload** - Drop files from your file system directly into the editor
 - **Clipboard paste** - Paste images from clipboard with Ctrl+V
 - **Images** - JPG, PNG, GIF, WebP (default max 10MB, configurable)
@@ -311,11 +312,11 @@ date: {{date}}
 | Windows/Linux | Mac | Action |
 |---------------|-----|--------|
 | `Ctrl+Alt+P` | `Cmd+Option+P` | Quick Switcher (jump to any note) |
-| `Ctrl+S` | `Cmd+S` | Save note |
+| `Ctrl+S` | `Cmd+S` | Save note (or **save drawing PNG** when a `drawing-*.png` is open) |
 | `Ctrl+Alt+N` | `Cmd+Option+N` | New note |
 | `Ctrl+Alt+F` | `Cmd+Option+F` | New folder |
-| `Ctrl+Z` | `Cmd+Z` | Undo |
+| `Ctrl+Z` | `Cmd+Z` | Undo (note edits, or **drawing strokes** when a drawing is open) |
-| `Ctrl+Y` or `Ctrl+Shift+Z` | `Cmd+Y` or `Cmd+Shift+Z` | Redo |
+| `Ctrl+Y` or `Ctrl+Shift+Z` | `Cmd+Y` or `Cmd+Shift+Z` | Redo (note edits, or **drawing strokes** when a drawing is open) |
 | `Ctrl+Alt+Z` | `Cmd+Option+Z` | Toggle Zen Mode |
 | `Esc` | `Esc` | Exit Zen Mode |
 | `F3` | `F3` | Next search match |