bug fix
This commit is contained in:
parent
0294414d26
commit
582aed61ec
|
|
@ -11,7 +11,7 @@ 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
|
||||||
|
|
||||||
# Neu: Getrennter State für Inspektion vs. Navigation
|
# Getrennter State für Inspektion vs. Navigation
|
||||||
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
|
||||||
|
|
||||||
|
|
@ -35,12 +35,11 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
)
|
)
|
||||||
options = {h.payload['title']: h.payload['note_id'] for h in hits}
|
options = {h.payload['title']: h.payload['note_id'] for h in hits}
|
||||||
if options:
|
if options:
|
||||||
# Bei Suche setzen wir beides neu: Zentrum und Inspektion
|
|
||||||
selected_title = st.selectbox("Ergebnisse:", list(options.keys()), key="cy_select")
|
selected_title = st.selectbox("Ergebnisse:", list(options.keys()), key="cy_select")
|
||||||
if st.button("Laden", use_container_width=True, key="cy_load"):
|
if st.button("Laden", use_container_width=True, key="cy_load"):
|
||||||
new_id = options[selected_title]
|
new_id = options[selected_title]
|
||||||
st.session_state.graph_center_id = new_id
|
st.session_state.graph_center_id = new_id
|
||||||
st.session_state.graph_inspected_id = new_id # Gleichzeitig inspizieren
|
st.session_state.graph_inspected_id = new_id
|
||||||
st.rerun()
|
st.rerun()
|
||||||
|
|
||||||
st.divider()
|
st.divider()
|
||||||
|
|
@ -56,6 +55,7 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
|
|
||||||
st.divider()
|
st.divider()
|
||||||
st.caption("Legende")
|
st.caption("Legende")
|
||||||
|
# Hier zeigen wir die Farben an, die auch im Graphen genutzt werden
|
||||||
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)
|
||||||
|
|
||||||
|
|
@ -76,27 +76,25 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
inspected_id = st.session_state.graph_inspected_id
|
inspected_id = st.session_state.graph_inspected_id
|
||||||
|
|
||||||
# --- DATEN LADEN ---
|
# --- DATEN LADEN ---
|
||||||
# 1. Graph für das ZENTRUM 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})..."):
|
||||||
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
|
||||||
)
|
)
|
||||||
|
# Daten für den INSPIZIERTEN Knoten laden
|
||||||
# 2. Daten für den INSPIZIERTEN Knoten laden (für Editor/Inspector)
|
|
||||||
inspected_data = graph_service.get_note_with_full_content(inspected_id)
|
inspected_data = graph_service.get_note_with_full_content(inspected_id)
|
||||||
|
|
||||||
# --- ACTION BAR (OBEN) ---
|
# --- ACTION BAR (OBEN) ---
|
||||||
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:
|
||||||
st.info(f"**Ausgewählt:** {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}")
|
||||||
|
|
||||||
with c2:
|
with c2:
|
||||||
# NAVIGATION: Nur anzeigen, wenn Inspiziert != Zentrum
|
# NAVIGATION: Nur wenn Inspiziert != Zentrum
|
||||||
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
|
||||||
|
|
@ -105,7 +103,7 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
st.caption("_(Ist aktuelles Zentrum)_")
|
st.caption("_(Ist aktuelles Zentrum)_")
|
||||||
|
|
||||||
with c3:
|
with c3:
|
||||||
# EDITIEREN: Immer für den INSPIZIERTEN Knoten
|
# EDITIEREN
|
||||||
if inspected_data:
|
if inspected_data:
|
||||||
st.button("📝 Bearbeiten",
|
st.button("📝 Bearbeiten",
|
||||||
use_container_width=True,
|
use_container_width=True,
|
||||||
|
|
@ -114,7 +112,7 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
key="cy_edit_btn")
|
key="cy_edit_btn")
|
||||||
|
|
||||||
# --- INSPECTOR ---
|
# --- INSPECTOR ---
|
||||||
with st.expander("🕵️ Data Inspector (Details)", expanded=True): # Default offen für bessere UX
|
with st.expander("🕵️ Data Inspector (Details)", expanded=True):
|
||||||
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:
|
||||||
|
|
@ -136,7 +134,6 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
|
|
||||||
# Nodes konvertieren
|
# Nodes konvertieren
|
||||||
for n in nodes_data:
|
for n in nodes_data:
|
||||||
# Styles berechnen
|
|
||||||
is_center = (n.id == center_id)
|
is_center = (n.id == center_id)
|
||||||
is_inspected = (n.id == inspected_id)
|
is_inspected = (n.id == inspected_id)
|
||||||
|
|
||||||
|
|
@ -149,10 +146,10 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
"data": {
|
"data": {
|
||||||
"id": n.id,
|
"id": n.id,
|
||||||
"label": display_label,
|
"label": display_label,
|
||||||
"bg_color": n.color,
|
# WICHTIG: Hier übergeben wir die Farbe an Cytoscape
|
||||||
|
"bg_color": n.color,
|
||||||
"tooltip": tooltip_text
|
"tooltip": tooltip_text
|
||||||
},
|
},
|
||||||
# Selektion markiert den INSPIZIERTEN Knoten, nicht zwingend das Zentrum
|
|
||||||
"selected": is_inspected,
|
"selected": is_inspected,
|
||||||
"classes": "center" if is_center else ""
|
"classes": "center" if is_center else ""
|
||||||
}
|
}
|
||||||
|
|
@ -164,7 +161,10 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
if target_id:
|
if target_id:
|
||||||
cy_edge = {
|
cy_edge = {
|
||||||
"data": {
|
"data": {
|
||||||
"source": e.source, "target": target_id, "label": e.label, "line_color": e.color
|
"source": e.source,
|
||||||
|
"target": target_id,
|
||||||
|
"label": e.label,
|
||||||
|
"line_color": e.color
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
cy_elements.append(cy_edge)
|
cy_elements.append(cy_edge)
|
||||||
|
|
@ -176,7 +176,8 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
"style": {
|
"style": {
|
||||||
"label": "data(label)",
|
"label": "data(label)",
|
||||||
"width": "30px", "height": "30px",
|
"width": "30px", "height": "30px",
|
||||||
"background-color": "data(bg_color)",
|
# HIER NUTZEN WIR DIE FARBE:
|
||||||
|
"background-color": "data(bg_color)",
|
||||||
"color": "#333", "font-size": "12px",
|
"color": "#333", "font-size": "12px",
|
||||||
"text-valign": "center", "text-halign": "center",
|
"text-valign": "center", "text-halign": "center",
|
||||||
"text-wrap": "wrap", "text-max-width": "90px",
|
"text-wrap": "wrap", "text-max-width": "90px",
|
||||||
|
|
@ -184,23 +185,23 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
"title": "data(tooltip)"
|
"title": "data(tooltip)"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
# Style für den inspizierten Knoten (Gelber Rahmen, Größer)
|
# Style für Selektion (Gelb)
|
||||||
{
|
{
|
||||||
"selector": "node:selected",
|
"selector": "node:selected",
|
||||||
"style": {
|
"style": {
|
||||||
"border-width": 6,
|
"border-width": 6,
|
||||||
"border-color": "#FFC300", # Gelb/Gold für Auswahl
|
"border-color": "#FFC300",
|
||||||
"width": "50px", "height": "50px",
|
"width": "50px", "height": "50px",
|
||||||
"font-weight": "bold",
|
"font-weight": "bold",
|
||||||
"z-index": 999
|
"z-index": 999
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
# Style für das Zentrum (Roter Rahmen, falls nicht selektiert)
|
# Style für Zentrum (Rot)
|
||||||
{
|
{
|
||||||
"selector": ".center",
|
"selector": ".center",
|
||||||
"style": {
|
"style": {
|
||||||
"border-width": 4,
|
"border-width": 4,
|
||||||
"border-color": "#FF5733", # Rot
|
"border-color": "#FF5733",
|
||||||
"width": "40px", "height": "40px"
|
"width": "40px", "height": "40px"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -238,13 +239,13 @@ def render_graph_explorer_cytoscape(graph_service):
|
||||||
height="700px"
|
height="700px"
|
||||||
)
|
)
|
||||||
|
|
||||||
# --- EVENT HANDLING (Selektion) ---
|
# --- EVENT HANDLING (Nur Selektion ändern) ---
|
||||||
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]
|
||||||
|
|
||||||
# LOGIK: Nur Inspektion ändern, nicht Zentrum
|
# Nur Inspektion ändern, NICHT das Zentrum neu laden
|
||||||
if clicked_id != st.session_state.graph_inspected_id:
|
if clicked_id != st.session_state.graph_inspected_id:
|
||||||
st.session_state.graph_inspected_id = clicked_id
|
st.session_state.graph_inspected_id = clicked_id
|
||||||
st.rerun()
|
st.rerun()
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user