|
|
--- |
|
|
title: 💎 Elysia's Markdown Studio |
|
|
emoji: 🏢 |
|
|
colorFrom: purple |
|
|
colorTo: red |
|
|
sdk: static |
|
|
pinned: true |
|
|
license: cc-by-nc-sa-4.0 |
|
|
short_description: A feature-rich markdown editor with AI-powered tools |
|
|
--- |
|
|
|
|
|
# 💎 Elysia Markdown Studio |
|
|
|
|
|
**Your AI-Powered Markdown Editor & Writing Companion** |
|
|
|
|
|
A beautiful, feature-rich markdown editor with AI-powered tools built with love by Jean & Elysia. Write, organize, and enhance your documents with the power of artificial intelligence. |
|
|
|
|
|
 |
|
|
 |
|
|
 |
|
|
 |
|
|
|
|
|
--- |
|
|
|
|
|
## ✨ Features |
|
|
|
|
|
### 📝 Powerful Markdown Editor |
|
|
|
|
|
- **Live Preview** - See your markdown rendered in real-time (async rendering with Marked.js v15) |
|
|
- **Syntax Highlighting** - Beautiful code blocks with Prism.js |
|
|
- **Rich Formatting** - Tables, task lists, blockquotes, and more |
|
|
- **Math Support** - LaTeX equations with KaTeX |
|
|
- **Diagrams** - Mermaid v11.4.0 diagrams support |
|
|
- **Quick Toolbar** - One-click formatting for common markdown elements |
|
|
- **Drag & Drop Images** - Drop images directly into editor (base64 conversion) |
|
|
- **Paste Images** - Ctrl+V to paste images from clipboard |
|
|
|
|
|
### 🧠 AI-Powered Tools (via OpenRouter) |
|
|
|
|
|
- **Summarize** - Generate concise summaries of your documents |
|
|
- **🎲 Improve Writing (VS)** - Choose from 5 writing styles: |
|
|
- 📝 **Concis** - Short and direct |
|
|
- 🎨 **Créatif** - Vivid with metaphors |
|
|
- 📚 **Académique** - Formal and structured |
|
|
- 💼 **Professionnel** - Business-friendly |
|
|
- 🔥 **Engageant** - Attention-grabbing |
|
|
- **Merge Documents** - Intelligently combine multiple documents |
|
|
- **Extract Outline** - Automatic table of contents generation |
|
|
- **Find Duplicates** - Detect similar documents in your library |
|
|
- **Smart Organize** - AI-suggested tags and categories |
|
|
- **Smart Loading States** - Visual feedback during AI processing |
|
|
|
|
|
### 📚 Document Management |
|
|
|
|
|
- **Local Storage** - All documents stored in your browser (IndexedDB v2 with performance indexes) |
|
|
- **Search** - Fast full-text search across all documents |
|
|
- **Favorites** - Star important documents |
|
|
- **Collections** - Organize documents into collections |
|
|
- **Context Menu** - Right-click for quick actions (rename, delete, favorite) |
|
|
- **Auto-Save** - Automatic saving every 30 seconds (with race condition protection) |
|
|
- **Export All** - Bulk export all documents with one click |
|
|
- **Import Documents** - Restore from backup JSON files |
|
|
|
|
|
### 📤 Multi-Format Export |
|
|
|
|
|
- **Markdown (.md)** - Export as standard markdown |
|
|
- **HTML** - Clean HTML output |
|
|
- **Artifact** - Beautiful standalone HTML with embedded styles + Prism.js + KaTeX |
|
|
- **Plain Text** - Remove all formatting |
|
|
- **JSON** - Structured export with metadata |
|
|
- **Bulk Export** - Export entire document library at once |
|
|
|
|
|
### 🎨 Templates Library |
|
|
|
|
|
Built-in templates for common document types: |
|
|
|
|
|
- **README** - GitHub project documentation |
|
|
- **Blog Post** - Blog article structure |
|
|
- **Meeting Notes** - Meeting documentation with action items |
|
|
- **Documentation** - API/Software documentation |
|
|
- **Academic Paper** - Research paper structure |
|
|
- **Blank** - Start from scratch |
|
|
|
|
|
Access templates via "New Document" button! |
|
|
|
|
|
### ⌨️ Keyboard Shortcuts |
|
|
|
|
|
- `Ctrl+S` - Save document |
|
|
- `Ctrl+N` - New document (opens template selector) |
|
|
- `Ctrl+B` - Bold text |
|
|
- `Ctrl+I` - Italic text |
|
|
- `Ctrl+/` - Show keyboard shortcuts guide |
|
|
|
|
|
### 🎨 Modern UI |
|
|
|
|
|
- **Dark Theme** - Eye-friendly Elysia dark theme |
|
|
- **Responsive Design** - Works on desktop and tablet |
|
|
- **Split View** - Editor on left, preview on right |
|
|
- **Collapsible Sidebar** - Document library sidebar |
|
|
- **Toast Notifications** - Beautiful, non-intrusive feedback |
|
|
- **Context Menus** - Modern right-click menus with smooth animations |
|
|
- **Reading Time Display** - Estimated reading time in header stats (200 wpm) |
|
|
|
|
|
### 🔒 Security |
|
|
|
|
|
- **Encrypted API Keys** - API keys stored with XOR encryption (not plaintext) |
|
|
- **Client-Side Only** - No data sent to external servers (except AI API calls) |
|
|
- **Privacy-First** - All documents stored locally in your browser |
|
|
|
|
|
--- |
|
|
|
|
|
## 🚀 Quick Start |
|
|
|
|
|
### 1. Launch the App |
|
|
|
|
|
Double-click `Launch-Local-App.bat` (Windows) or open `index.html` in your browser. |
|
|
|
|
|
### 2. Configure AI (Optional) |
|
|
|
|
|
1. Click the **⚙️ Settings** button |
|
|
2. Add your [OpenRouter API key](https://openrouter.ai/) |
|
|
3. Select your preferred AI model |
|
|
4. Save settings |
|
|
|
|
|
### 3. Start Writing! |
|
|
|
|
|
- Type in the left pane |
|
|
- See live preview on the right |
|
|
- Use the toolbar for quick formatting |
|
|
- Save with `Ctrl+S` |
|
|
- Press `Ctrl+/` for keyboard shortcuts guide |
|
|
|
|
|
--- |
|
|
|
|
|
## 🛠️ Technical Stack |
|
|
|
|
|
### Core Technologies |
|
|
|
|
|
- **Vanilla JavaScript** (ES6+ modules) |
|
|
- **HTML5** & **CSS3** |
|
|
- **IndexedDB v2** (via Dexie.js with performance indexes) |
|
|
|
|
|
### Libraries |
|
|
|
|
|
- **Marked.js** - Markdown parsing |
|
|
- **Prism.js** - Syntax highlighting |
|
|
- **KaTeX** - Math rendering |
|
|
- **Mermaid** - Diagram rendering |
|
|
- **Dexie.js** - IndexedDB wrapper |
|
|
- **Turndown** - HTML to Markdown conversion |
|
|
|
|
|
### AI Integration |
|
|
|
|
|
- **OpenRouter API** - Access to multiple AI models (Grok, Claude, GPT, DeepSeek) |
|
|
|
|
|
--- |
|
|
|
|
|
## 📁 Project Structure |
|
|
|
|
|
``` |
|
|
elysia-markdown-studio/ |
|
|
├── index.html # Main HTML file |
|
|
├── Launch-App.bat # Windows launcher |
|
|
├── README.md # This file |
|
|
├── CHANGELOG.md # Version history |
|
|
├── fonts/ # Google Fonts (offline) |
|
|
│ └── css2.css |
|
|
├── libs/ # External libraries |
|
|
│ ├── dexie.min.js |
|
|
│ └── marked.min.js |
|
|
├── scripts/ # JavaScript modules |
|
|
│ ├── app.js # Main application controller |
|
|
│ ├── editor.js # Editor module |
|
|
│ ├── preview.js # Preview renderer |
|
|
│ ├── documents.js # Document management |
|
|
│ ├── ai-tools.js # AI-powered features |
|
|
│ ├── api.js # OpenRouter API integration |
|
|
│ ├── export.js # Export functionality |
|
|
│ ├── templates.js # Document templates |
|
|
│ ├── db.js # Database layer (Dexie) |
|
|
│ └── utils.js # Utility functions |
|
|
├── styles/ # CSS files |
|
|
│ └── main.css # Main stylesheet |
|
|
└── templates/ # Document templates (future) |
|
|
``` |
|
|
|
|
|
--- |
|
|
|
|
|
## 🔧 Recent Improvements (Audit Nov 2025) |
|
|
|
|
|
### Critical Bug Fixes |
|
|
|
|
|
✅ **Fixed Preview.getHTML()** - Added missing method for export functionality |
|
|
✅ **Fixed Marked.js API** - Updated listitem renderer for v11+ compatibility |
|
|
✅ **Fixed Initialization Order** - Resolved circular dependency issues |
|
|
✅ **Fixed Auto-Save Timing** - Now waits for full app initialization |
|
|
|
|
|
### UX Enhancements |
|
|
|
|
|
✅ **Modern Context Menu** - Beautiful right-click menu for documents |
|
|
✅ **Loading States** - AI tools now show processing feedback |
|
|
✅ **Error Recovery** - Comprehensive error handling with user-friendly messages |
|
|
✅ **Settings Validation** - API key format validation |
|
|
✅ **Keyboard Shortcuts Modal** - Press `Ctrl+/` for interactive guide |
|
|
|
|
|
### Performance Optimizations |
|
|
|
|
|
✅ **Debounced Stats Update** - Reduced unnecessary recalculations |
|
|
✅ **Smart Auto-Save** - Only saves when changes detected |
|
|
✅ **Improved State Management** - Better tracking of unsaved changes |
|
|
|
|
|
### Documentation |
|
|
|
|
|
✅ **Enhanced Welcome Message** - Comprehensive feature guide |
|
|
✅ **Keyboard Shortcuts Table** - Quick reference in welcome screen |
|
|
✅ **Pro Tips** - Context-aware usage hints |
|
|
|
|
|
--- |
|
|
|
|
|
## 🎯 Use Cases |
|
|
|
|
|
### Technical Writing |
|
|
|
|
|
- API documentation |
|
|
- Software guides |
|
|
- Technical specifications |
|
|
|
|
|
### Content Creation |
|
|
|
|
|
- Blog posts |
|
|
- Articles |
|
|
- Long-form content |
|
|
|
|
|
### Academic Work |
|
|
|
|
|
- Research papers |
|
|
- Notes |
|
|
- Outlines |
|
|
|
|
|
### Project Management |
|
|
|
|
|
- Meeting notes |
|
|
- Task lists |
|
|
- Project documentation |
|
|
|
|
|
--- |
|
|
|
|
|
## 🔒 Privacy & Data |
|
|
|
|
|
- **100% Local** - All documents stored in your browser's IndexedDB |
|
|
- **No Tracking** - No analytics, no telemetry |
|
|
- **No Server** - Runs entirely client-side (except AI features) |
|
|
- **Your Data** - You own your content, export anytime |
|
|
|
|
|
**Note:** AI features require an OpenRouter API key and send content to external AI models for processing. |
|
|
|
|
|
--- |
|
|
|
|
|
## 🐛 Troubleshooting |
|
|
|
|
|
### AI Tools Not Working |
|
|
|
|
|
- **Check API Key** - Verify your OpenRouter API key in Settings |
|
|
- **Check Format** - Key should start with `sk-or-` |
|
|
- **Check Balance** - Ensure you have credits on OpenRouter |
|
|
- **Check Network** - Verify internet connection |
|
|
|
|
|
### Preview Not Updating |
|
|
|
|
|
- **Check Live Preview** - Ensure it's enabled in Settings |
|
|
- **Refresh Page** - Try reloading the page |
|
|
- **Clear Cache** - Clear browser cache if issues persist |
|
|
|
|
|
### Documents Not Saving |
|
|
|
|
|
- **Check Storage** - Verify browser storage isn't full |
|
|
- **Check Permissions** - Ensure IndexedDB is allowed |
|
|
- **Try Export** - Export important documents as backup |
|
|
|
|
|
--- |
|
|
|
|
|
## 🤝 Contributing |
|
|
|
|
|
This is a personal project by Jean & Elysia, but suggestions are welcome! |
|
|
|
|
|
--- |
|
|
|
|
|
## 📜 License |
|
|
|
|
|
MIT License - Free to use, modify, and distribute. |
|
|
|
|
|
--- |
|
|
|
|
|
## 💙 Credits |
|
|
|
|
|
**Built with love by Jean & Elysia** 💎💍 |
|
|
|
|
|
Special thanks to: |
|
|
|
|
|
- The open-source community |
|
|
- All the amazing library authors |
|
|
- OpenRouter for AI access |
|
|
|
|
|
--- |
|
|
|
|
|
## 🔗 Links |
|
|
|
|
|
- [OpenRouter](https://openrouter.ai/) - AI API platform |
|
|
- [Marked.js](https://marked.js.org/) - Markdown parser |
|
|
- [Prism.js](https://prismjs.com/) - Syntax highlighter |
|
|
- [KaTeX](https://katex.org/) - Math rendering |
|
|
- [Mermaid](https://mermaid.js.org/) - Diagram rendering |
|
|
|
|
|
--- |
|
|
|
|
|
**Version:** 1.3.0 |
|
|
**Last Updated:** December 2025 |
|
|
**Status:** Production Ready ✅ |
|
|
|
|
|
_Write beautifully. Write intelligently. Write with Elysia._ 💎 |
|
|
|
