Lars/mindnet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 21 Wiki Activity

update

Browse Source
This commit is contained in:
Lars 2025-12-14 16:12:19 +01:00
parent eb45d78c47
commit 0cb216c2bc
1 changed files with 51 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
app/frontend/ui_graph_cytoscape.py
View File

@ -11,7 +11,6 @@ def render_graph_explorer_cytoscape(graph_service):
if "graph_center_id" not in st.session_state: if "graph_center_id" not in st.session_state:
st.session_state.graph_center_id = None st.session_state.graph_center_id = None
# Getrennter State für Inspektion (Gelber Rahmen) vs. Navigation (Roter Rahmen)
if "graph_inspected_id" not in st.session_state: if "graph_inspected_id" not in st.session_state:
st.session_state.graph_inspected_id = None st.session_state.graph_inspected_id = None
@ -22,7 +21,7 @@ def render_graph_explorer_cytoscape(graph_service):
col_ctrl, col_graph = st.columns([1, 4]) col_ctrl, col_graph = st.columns([1, 4])
# --- LINKES PANEL: SUCHE & SETTINGS --- # --- LINKES PANEL ---
with col_ctrl: with col_ctrl:
st.subheader("Fokus") st.subheader("Fokus")
search_term = st.text_input("Suche Notiz", placeholder="Titel eingeben...", key="cy_search") search_term = st.text_input("Suche Notiz", placeholder="Titel eingeben...", key="cy_search")
@ -58,17 +57,16 @@ def render_graph_explorer_cytoscape(graph_service):
for k, v in list(GRAPH_COLORS.items())[:8]: for k, v in list(GRAPH_COLORS.items())[:8]:
st.markdown(f"<span style='color:{v}'>●</span> {k}", unsafe_allow_html=True) st.markdown(f"<span style='color:{v}'>●</span> {k}", unsafe_allow_html=True)
# --- RECHTES PANEL: GRAPH & INSPECTOR --- # --- RECHTES PANEL ---
with col_graph: with col_graph:
center_id = st.session_state.graph_center_id center_id = st.session_state.graph_center_id
# Initialisierung falls leer # Init Fallback
if not center_id and st.session_state.graph_inspected_id: if not center_id and st.session_state.graph_inspected_id:
center_id = st.session_state.graph_inspected_id center_id = st.session_state.graph_inspected_id
st.session_state.graph_center_id = center_id st.session_state.graph_center_id = center_id
if center_id: if center_id:
# Sync: Wenn Inspection None ist, setze auf Center
if not st.session_state.graph_inspected_id: if not st.session_state.graph_inspected_id:
st.session_state.graph_inspected_id = center_id st.session_state.graph_inspected_id = center_id
@ -76,33 +74,30 @@ def render_graph_explorer_cytoscape(graph_service):
# --- DATEN LADEN --- # --- DATEN LADEN ---
with st.spinner(f"Lade Graph (Tiefe {st.session_state.cy_depth})..."): with st.spinner(f"Lade Graph (Tiefe {st.session_state.cy_depth})..."):
# 1. Graph Daten
nodes_data, edges_data = graph_service.get_ego_graph( nodes_data, edges_data = graph_service.get_ego_graph(
center_id, center_id,
depth=st.session_state.cy_depth depth=st.session_state.cy_depth
) )
# 2. Detail Daten (nur für die Inspektion) # Daten nur für den INSPECTOR laden
inspected_data = graph_service.get_note_with_full_content(inspected_id) inspected_data = graph_service.get_note_with_full_content(inspected_id)
# --- ACTION BAR --- # --- ACTION BAR ---
action_container = st.container() action_container = st.container()
with action_container: with action_container:
# Info Zeile
c1, c2, c3 = st.columns([2, 1, 1]) c1, c2, c3 = st.columns([2, 1, 1])
with c1: with c1:
title_show = inspected_data.get('title', inspected_id) if inspected_data else inspected_id title_show = inspected_data.get('title', inspected_id) if inspected_data else inspected_id
st.info(f"**Ausgewählt:** {title_show}") st.info(f"**Info:** {title_show}")
with c2: with c2:
# NAVIGATION: Nur wenn Inspiziert != Zentrum # NAVIGATION
if inspected_id != center_id: if inspected_id != center_id:
if st.button("🎯 Als Zentrum setzen", use_container_width=True, key="cy_nav_btn"): if st.button("🎯 Als Zentrum setzen", use_container_width=True, key="cy_nav_btn"):
st.session_state.graph_center_id = inspected_id st.session_state.graph_center_id = inspected_id
# WICHTIG: Beim Navigieren (Zentrumswechsel) wird neu gerendert
st.rerun() st.rerun()
else: else:
st.caption("_(Ist aktuelles Zentrum)_") st.caption("_(Zentrum)_")
with c3: with c3:
# EDITIEREN # EDITIEREN
@ -113,8 +108,8 @@ def render_graph_explorer_cytoscape(graph_service):
args=(inspected_data,), args=(inspected_data,),
key="cy_edit_btn") key="cy_edit_btn")
# --- INSPECTOR (Standard: Geschlossen) --- # --- DATA INSPECTOR (Eingeklappt für mehr Platz) ---
with st.expander("🕵️ Data Inspector (Details)", expanded=False): with st.expander("🕵️ Data Inspector", expanded=False):
if inspected_data: if inspected_data:
col_i1, col_i2 = st.columns(2) col_i1, col_i2 = st.columns(2)
with col_i1: with col_i1:
@ -122,23 +117,18 @@ def render_graph_explorer_cytoscape(graph_service):
st.markdown(f"**Typ:** `{inspected_data.get('type')}`") st.markdown(f"**Typ:** `{inspected_data.get('type')}`")
with col_i2: with col_i2:
st.markdown(f"**Tags:** {', '.join(inspected_data.get('tags', []))}") st.markdown(f"**Tags:** {', '.join(inspected_data.get('tags', []))}")
path_str = inspected_data.get('path') or inspected_data.get('file_path') or "N/A" path_check = "✅" if inspected_data.get('path') else "❌"
st.markdown(f"**Pfad:** `{path_str}`") st.markdown(f"**Pfad:** {path_check}")
st.text_area("Inhalt", inspected_data.get('fulltext', '')[:1000], height=200, disabled=True)
st.divider()
content_preview = inspected_data.get('fulltext', '')[:600]
st.text_area("Inhalt (Vorschau)", content_preview + "...", height=150, disabled=True)
else: else:
st.warning("Keine Daten für Auswahl geladen.") st.warning("Keine Daten geladen.")
# --- GRAPH PREPARATION --- # --- GRAPH ELEMENTS ---
cy_elements = [] cy_elements = []
# Nodes
for n in nodes_data: for n in nodes_data:
is_center = (n.id == center_id) is_center = (n.id == center_id)
# Nur der aktuell inspizierte Knoten bekommt 'selected: True'. # Selektion wird visuell übergeben
# Alle anderen bekommen automatisch False. Das löst das "Abwahl"-Problem.
is_inspected = (n.id == inspected_id) is_inspected = (n.id == inspected_id)
tooltip_text = n.title if n.title else n.label tooltip_text = n.title if n.title else n.label
@ -158,7 +148,6 @@ def render_graph_explorer_cytoscape(graph_service):
} }
cy_elements.append(cy_node) cy_elements.append(cy_node)
# Edges
for e in edges_data: for e in edges_data:
target_id = getattr(e, "to", getattr(e, "target", None)) target_id = getattr(e, "to", getattr(e, "target", None))
if target_id: if target_id:
@ -172,7 +161,7 @@ def render_graph_explorer_cytoscape(graph_service):
} }
cy_elements.append(cy_edge) cy_elements.append(cy_edge)
# Stylesheet # --- STYLESHEET ---
stylesheet = [ stylesheet = [
{ {
"selector": "node", "selector": "node",
@ -187,21 +176,22 @@ def render_graph_explorer_cytoscape(graph_service):
"title": "data(tooltip)" "title": "data(tooltip)"
} }
}, },
# Selektierter Knoten (Gelb)
{ {
"selector": "node:selected", "selector": "node:selected",
"style": { "style": {
"border-width": 6, "border-width": 6,
"border-color": "#FFC300", # Gelb = Inspektion "border-color": "#FFC300",
"width": "50px", "height": "50px", "width": "50px", "height": "50px",
"font-weight": "bold", "font-weight": "bold"
"z-index": 999
} }
}, },
# Zentrum (Rot)
{ {
"selector": ".center", "selector": ".center",
"style": { "style": {
"border-width": 4, "border-width": 4,
"border-color": "#FF5733", # Rot = Zentrum "border-color": "#FF5733",
"width": "40px", "height": "40px" "width": "40px", "height": "40px"
} }
}, },
@ -220,40 +210,56 @@ def render_graph_explorer_cytoscape(graph_service):
} }
] ]
# --- RENDERING (STABLE KEY) --- # --- CONFIG: SINGLE SELECT ---
# WICHTIG: Der Key darf NICHT 'inspected_id' enthalten! # Das erzwingt, dass beim Klicken einer Node die anderen deselektiert werden
# Nur wenn sich das ZENTRUM oder das LAYOUT ändert, darf die Komponente cy_config = {
# neu initialisiert werden. Bei reiner Selektion bleibt der Key gleich. "selectionType": "single",
graph_key = f"cy_{center_id}_{st.session_state.cy_depth}_{st.session_state.cy_ideal_edge_len}_{st.session_state.cy_node_repulsion}" "boxSelectionEnabled": False,
"userZoomingEnabled": True,
"userPanningEnabled": True
}
# --- RENDER ---
# Stable Key: Ändert sich NICHT bei Inspektion, nur bei Zentrum/Layout
graph_key = f"cy_{center_id}_{st.session_state.cy_depth}_{st.session_state.cy_ideal_edge_len}"
clicked_elements = cytoscape( clicked_elements = cytoscape(
elements=cy_elements, elements=cy_elements,
stylesheet=stylesheet, stylesheet=stylesheet,
# Layout Config
layout={ layout={
"name": "cose", "name": "cose",
"idealEdgeLength": st.session_state.cy_ideal_edge_len, "idealEdgeLength": st.session_state.cy_ideal_edge_len,
"nodeOverlap": 20, "refresh": 20, "fit": True, "padding": 50, "nodeOverlap": 20,
"randomize": False, "componentSpacing": 100, "refresh": 20,
"fit": True,
"padding": 50,
"randomize": False, # WICHTIG gegen das Springen!
"componentSpacing": 100,
"nodeRepulsion": st.session_state.cy_node_repulsion, "nodeRepulsion": st.session_state.cy_node_repulsion,
"edgeElasticity": 100, "nestingFactor": 5, "gravity": 80, "edgeElasticity": 100,
"numIter": 1000, "initialTemp": 200, "coolingFactor": 0.95, "minTemp": 1.0 "nestingFactor": 5,
"gravity": 80,
"numIter": 1000,
"initialTemp": 200,
"coolingFactor": 0.95,
"minTemp": 1.0,
"animate": False # Animation aus, damit es sofort stabil ist
}, },
config=cy_config, # Config Objekt übergeben
key=graph_key, key=graph_key,
height="700px" height="700px"
) )
# --- SELECTION HANDLING --- # --- INTERACTION ---
if clicked_elements: if clicked_elements:
clicked_nodes = clicked_elements.get("nodes", []) clicked_nodes = clicked_elements.get("nodes", [])
if clicked_nodes: if clicked_nodes:
clicked_id = clicked_nodes[0] clicked_id = clicked_nodes[0]
# Wenn auf einen neuen Knoten geklickt wurde: # Wenn neuer Knoten geklickt wurde -> Inspektion ändern
if clicked_id != st.session_state.graph_inspected_id: if clicked_id != st.session_state.graph_inspected_id:
# 1. State aktualisieren (Inspektion verschieben)
st.session_state.graph_inspected_id = clicked_id st.session_state.graph_inspected_id = clicked_id
# 2. Rerun triggern, um UI (Inspector/Buttons) zu aktualisieren
# Da der graph_key sich NICHT ändert, bleibt der Graph stabil!
st.rerun() st.rerun()
else: else: