feat: add bookmark view modes (card/tile/cover) and enhance button block with visual config modal - Added three view modes for bookmark blocks: card (default with side image), tile (compact horizontal), and cover (large top image) - Implemented view mode submenu in block context menu with visual indicators for active mode - Enhanced bookmark favicon handling with fallback logic and error state tracking - Refactored button block with inline visual editor replacing text inputs - Created Button
🌌 ObsiViewer — Explorateur de voûte Obsidian
ObsiViewer est une application web moderne permettant d'explorer et de visualiser une voûte Obsidian en lecture seule depuis n'importe quel navigateur. Elle offre une expérience riche, fluide et fidèle à Obsidian, idéale pour partager vos connaissances ou accéder à vos notes en déplacement.
✨ Fonctionnalités Clés
🗂️ Navigation & Organisation
- Explorateur de fichiers : Arborescence complète, dossiers pliables.
- Recherche Avancée : Compatible Obsidian (
path:,tag:,file:, etc.) avec backend Meilisearch ultra-rapide. - Favoris (Bookmarks) : Gestion complète et synchronisée avec
.obsidian/bookmarks.json. - Tags & Calendrier : Filtrage par tags et navigation temporelle.
📝 Rendu Markdown Riche
- Support complet : Wikilinks, Callouts, Task lists, Footnotes, Math (KaTeX).
- Média : Images, diagrammes Mermaid, et dessins Excalidraw.
- Syntax Highlighting : Pour plus de 100 langages.
🕸️ Graphe Interactif
- Visualisation : Graphe de connaissances fluide (d3-force).
- Contrôles : Filtres, groupes de couleurs, physique ajustable.
- Persistance : Sauvegarde des réglages dans
.obsidian/graph.json.
🚀 Démarrage Rapide
Option 1 : Docker (Recommandé)
Utilisez Docker Compose pour lancer la stack complète (Frontend + Backend + Search).
# Dans le dossier docker-compose/
docker compose up -d
Accédez à l'application sur http://localhost:3000.
Option 2 : Développement Local
Prérequis : Node.js 20+, npm.
-
Installation
npm install -
Configuration Copiez
.env.examplevers.envet ajustez le chemin de votre vault :cp .env.example .env # Éditez .env : VAULT_PATH=/chemin/vers/votre/vault -
Lancement
- Frontend (Mode démo) :
npm run dev - Backend API :
node server/index.mjs - Full Stack (avec Meilisearch) :
npm run meili:up # Lance Meilisearch npm run meili:reindex # Indexe le vault node server/index.mjs # Lance l'API npm run dev # Lance le Frontend (autre terminal)
- Frontend (Mode démo) :
⚙️ Configuration
Les principales variables d'environnement (fichier .env) :
| Variable | Description | Défaut |
|---|---|---|
VAULT_PATH |
Chemin absolu ou relatif vers le dossier du vault | ./vault |
PORT |
Port du serveur API Express | 4000 |
MEILI_HOST |
URL de l'instance Meilisearch | http://127.0.0.1:7700 |
MEILI_MASTER_KEY |
Clé API Meilisearch | devMeiliKey123 |
🏗️ Architecture Technique
- Frontend : Angular 20 (Signals, Standalone), TailwindCSS, D3.js.
- Backend : Node.js/Express pour l'API et le file system access.
- Search : Meilisearch pour l'indexation et la recherche performante.
- Live Reload : Server-Sent Events (SSE) et Chokidar pour la détection de changements.
Pour plus de détails, consultez le dossier docs/.
🗺️ Roadmap
Le projet est en développement actif. Consultez ROADMAP.md pour voir les fonctionnalités planifiées et l'avancement.
🤝 Contribution
Les contributions sont les bienvenues !
- Forkez le projet.
- Créez une branche (
git checkout -b feature/AmazingFeature). - Commitez vos changements (
git commit -m 'Add some AmazingFeature'). - Poussez la branche (
git push origin feature/AmazingFeature). - Ouvrez une Pull Request.
📄 Licence
Usage libre pour développement et consultation.