feat(graph): Phase 1+2 — full-vault, tag filter, backlinks, tooltips, depth slider
Backend (main.py): - GraphNode: added tags, incoming_count, outgoing_count - GraphEdge: added 'backlink' relation - GraphResponse: added 'scope' field - api_graph: scope=full|directory, tag= filter, backlinks - Full-vault tree walk with configurable depth 0-3 - Tag index from in-memory file index for fast filtering - Incoming/outgoing link count per node Frontend (graph.js + index.html): - Theme-adaptive colors via CSS custom properties - Depth slider (0-3) with live reload - Full-vault toggle button (🌐 Tout / 📁 Dossier) - Search input with tag filtering + visual highlighting - Tooltip on hover (name, path, tags, link counts) - Backlink edges rendered in red dashed - Node size proportional to link count - Larger modal (1000px, 85vh)
This commit is contained in:
+8
-2
@@ -699,11 +699,15 @@
|
||||
|
||||
<!-- Graph View Modal -->
|
||||
<div class="editor-modal" id="graph-modal">
|
||||
<div class="editor-container" style="max-width:90vw;width:900px;height:80vh;display:flex;flex-direction:column;">
|
||||
<div class="editor-container" style="max-width:95vw;width:1000px;height:85vh;display:flex;flex-direction:column;">
|
||||
<div class="editor-header">
|
||||
<div class="editor-title" id="graph-title">Vue Graphique</div>
|
||||
<div class="editor-actions">
|
||||
<span id="graph-info" style="font-size:0.75rem;color:var(--text-muted);margin-right:12px"></span>
|
||||
<span id="graph-info" style="font-size:0.75rem;color:var(--text-muted);margin-right:8px"></span>
|
||||
<label style="font-size:0.7rem;color:var(--text-muted);margin-right:4px">Profondeur:</label>
|
||||
<input type="range" id="graph-depth" min="0" max="3" value="1" style="width:60px;margin-right:8px" title="Profondeur d'exploration">
|
||||
<button class="editor-btn" id="graph-full-vault" title="Vue complète du vault" aria-label="Vault complet" style="font-size:0.7rem;margin-right:4px">🌐 Tout</button>
|
||||
<input type="text" id="graph-search" placeholder="Rechercher..." style="width:100px;font-size:0.75rem;padding:2px 6px;border-radius:4px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);margin-right:8px">
|
||||
<button class="editor-btn" id="graph-zoom-in" title="Zoom avant" aria-label="Zoom avant">
|
||||
<i data-lucide="zoom-in" style="width:16px;height:16px"></i>
|
||||
</button>
|
||||
@@ -720,12 +724,14 @@
|
||||
</div>
|
||||
<div class="editor-body" style="flex:1;overflow:hidden;position:relative;padding:0">
|
||||
<canvas id="graph-canvas" style="width:100%;height:100%;cursor:grab"></canvas>
|
||||
<div id="graph-tooltip" style="display:none;position:absolute;pointer-events:none;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;padding:6px 10px;font-size:0.75rem;color:var(--text-primary);max-width:250px;z-index:10;box-shadow:0 2px 8px rgba(0,0,0,0.3)"></div>
|
||||
<div id="graph-legend" style="position:absolute;bottom:12px;left:12px;display:flex;gap:16px;font-size:0.7rem;color:var(--text-muted);background:var(--bg-primary);padding:6px 12px;border-radius:6px;border:1px solid var(--border-color)">
|
||||
<span>🟦 Dossier</span>
|
||||
<span>🟩 Fichier .md</span>
|
||||
<span>⬜ Autre fichier</span>
|
||||
<span style="color:var(--text-muted)">── Parent</span>
|
||||
<span style="color:var(--accent-color,#2563eb)">┅┅ Wikilink</span>
|
||||
<span style="color:#e74c3c">← Backlink</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user