fixed app.py

app.py

@@ -1,36 +1,275 @@
 import gradio as gr
+import json
+import os
+from pathlib import Path
 
-# Load your custom HTML
-def load_html():
-    # Load from file - replace "visualization.html" with your actual filename
-    with open("./Viewer/viewer_v2.html", "r", encoding="utf-8") as f:
-        return f.read()
+# Percorsi delle cartelle
+FOLDER_MAP = {
+    "qa_subtopics": "Viewer/Data/Our_system/QA+Topics",
+    "qa_sdgs": "Viewer/Data/Our_system/QA+SDGs",
+    "summary_subtopics": "Viewer/Data/Our_system/Summary+Topics",
+    "summary_sdgs": "Viewer/Data/Our_system/Summary+SDG"
+}
 
-# Create the Gradio interface
-with gr.Blocks(title="Humanitarian Sector Results") as demo:
-    gr.Markdown("""
-    # 🌍 Humanitarian Sector Results Visualization
+def get_available_events():
+    """Ottiene la lista di tutti gli eventi disponibili"""
+    all_events = set()
     
-    This space presents the results of our analysis. Your feedback is valuable to improve our work!
+    for folder_path in FOLDER_MAP.values():
+        if os.path.exists(folder_path):
+            for file in os.listdir(folder_path):
+                if file.endswith("_combined_data.json"):
+                    event_name = file.replace("_combined_data.json", "")
+                    all_events.add(event_name)
     
-    ### How to contribute:
-    - Explore the data visualized below
-    - Use the "Community" tab above to leave feedback
-    - Report any anomalies or suggestions for new analyses
-    """)
+    return sorted(list(all_events))
+
+def load_event_data(event_name, format_type, view_type):
+    """Carica i dati per un evento specifico"""
+    if not event_name:
+        return None
+    
+    key = f"{format_type}_{view_type}"
+    folder = FOLDER_MAP.get(key)
+    
+    if not folder:
+        return None
+    
+    filepath = os.path.join(folder, f"{event_name}_combined_data.json")
+    
+    try:
+        with open(filepath, 'r', encoding='utf-8') as f:
+            return json.load(f)
+    except Exception as e:
+        print(f"Error loading {filepath}: {e}")
+        return None
+
+def process_citations(text, contexts):
+    """Processa le citazioni nel testo"""
+    if not text or not contexts:
+        return text or ""
+    
+    import re
+    citation_regex = r'\[(\d+)\]'
+    
+    def replace_citation(match):
+        citation_id = match.group(1)
+        ctx = contexts.get(citation_id, {})
+        if ctx:
+            title = ctx.get('title', 'No title')
+            url = ctx.get('url', '#')
+            context = ctx.get('context', 'No context')
+            return f'<span class="citation" title="{context[:200]}...">[{citation_id}]</span>'
+        return match.group(0)
+    
+    return re.sub(citation_regex, replace_citation, text)
+
+def render_qa_content(cluster):
+    """Renderizza contenuto Q&A"""
+    qas = cluster.get('questions_and_answers', [])
+    if not qas:
+        return '<div class="no-data">No questions and answers available</div>'
+    
+    html = ""
+    for qa in qas:
+        question = qa.get('question') or qa.get('Question', 'No question provided')
+        answer = qa.get('updated_retrieved_answer') or qa.get('retrieved_answer') or qa.get('answer') or qa.get('updated_answer', 'No answer available')
+        contexts = qa.get('used_contexts', {})
+        
+        html += f'''
+        <div class="qa-item">
+            <div class="question">❓ {question}</div>
+            <div class="answer">{process_citations(answer, contexts)}</div>
+        </div>
+        '''
+    
+    return html
+
+def render_summary_content(cluster):
+    """Renderizza contenuto summary"""
+    summary = cluster.get('cluster_summary', 'No cluster summary available')
+    contexts = cluster.get('used_contexts', {})
+    
+    return f'<div class="cluster-summary">{process_citations(summary, contexts)}</div>'
+
+def render_clusters(clusters, format_type):
+    """Renderizza tutti i cluster"""
+    if not clusters:
+        return '<div class="no-data">No content available for this view.</div>'
+    
+    html = ""
+    for cluster in clusters:
+        cluster_headline = cluster.get('cluster_headline') or cluster.get('cluster_id', 'Cluster')
+        
+        if format_type == 'summary':
+            content = render_summary_content(cluster)
+        else:
+            content = render_qa_content(cluster)
+        
+        html += f'''
+        <div class="cluster">
+            <div class="cluster-header">🎯 {cluster_headline}</div>
+            <div class="cluster-content">{content}</div>
+        </div>
+        '''
+    
+    return html
+
+def process_file_data(file_data, format_type):
+    """Processa i dati del file per estrarre i cluster"""
+    if isinstance(file_data.get('clusters'), list):
+        return file_data['clusters']
+    
+    ignore_keys = ['file_name', 'summary', 'summary_contexts']
+    clusters = []
+    
+    for key, value in file_data.items():
+        if key in ignore_keys:
+            continue
+        
+        if format_type == 'qa':
+            clusters.append({
+                'cluster_headline': key,
+                'questions_and_answers': value if isinstance(value, list) else []
+            })
+        else:
+            if isinstance(value, list):
+                first_item = value[0] if value else {}
+                joined = '\n\n'.join([
+                    v.get('cluster_summary') or v.get('summary', '') 
+                    for v in value if isinstance(v, dict)
+                ])
+                clusters.append({
+                    'cluster_headline': key,
+                    'cluster_summary': joined or 'No cluster summary available',
+                    'used_contexts': first_item.get('used_contexts', {})
+                })
+            elif isinstance(value, str):
+                clusters.append({
+                    'cluster_headline': key,
+                    'cluster_summary': value,
+                    'used_contexts': {}
+                })
+            elif isinstance(value, dict):
+                clusters.append({
+                    'cluster_headline': key,
+                    'cluster_summary': value.get('cluster_summary') or value.get('summary', 'No cluster summary available'),
+                    'used_contexts': value.get('used_contexts', {})
+                })
+    
+    return clusters
+
+def generate_html(event_name, format_type, view_type):
+    """Genera l'HTML completo per visualizzare i dati"""
+    
+    if not event_name:
+        return """
+        <div class="container">
+            <div class="no-data">
+                <h2>Please select an event from the dropdown above.</h2>
+            </div>
+        </div>
+        """
+    
+    data = load_event_data(event_name, format_type, view_type)
+    
+    if not data:
+        return f"""
+        <div class="container">
+            <div class="no-data">
+                <h2>⚠ Error loading data</h2>
+                <p>Could not load data for: <strong>{event_name}</strong></p>
+            </div>
+        </div>
+        """
+    
+    file_name = data.get('file_name', event_name)
+    summary = data.get('summary', 'No summary available')
+    summary_contexts = data.get('summary_contexts', {})
+    
+    clusters = process_file_data(data, format_type)
+    clusters_html = render_clusters(clusters, format_type)
+    
+    html = f'''
+    <div class="file-section">
+        <div class="file-header">📄 {file_name}</div>
+        <div class="file-content">
+            <div class="summary">
+                <strong>Summary:</strong><br>
+                {process_citations(summary, summary_contexts)}
+            </div>
+            {clusters_html}
+        </div>
+    </div>
+    '''
+    
+    return html
+
+# CSS per lo styling
+CSS = """
+* { margin: 0; padding: 0; box-sizing: border-box; }
+body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
+.container { max-width: 1200px; margin: 0 auto; padding: 20px; }
+.file-section { margin-bottom: 40px; border: 2px solid #e1e5e9; border-radius: 12px; overflow: hidden; }
+.file-header { background: linear-gradient(135deg, #667eea, #764ba2); color: white; padding: 20px; font-size: 1.3em; font-weight: 600; }
+.file-content { padding: 25px; }
+.summary { background: #f8f9fa; border-left: 4px solid #667eea; padding: 20px; margin: 20px 0; border-radius: 0 8px 8px 0; line-height: 1.6; white-space: pre-wrap; }
+.cluster { margin: 30px 0; border: 1px solid #dee2e6; border-radius: 10px; overflow: hidden; }
+.cluster-header { background: linear-gradient(45deg, #28a745, #20c997); color: white; padding: 15px 20px; font-weight: 600; font-size: 1.1em; }
+.cluster-content { padding: 20px; }
+.cluster-summary { background: #e8f5e8; border-radius: 8px; padding: 15px; line-height: 1.6; white-space: pre-wrap; }
+.qa-item { margin-bottom: 20px; padding: 15px; background: #f8f9fa; border-radius: 8px; border-left: 4px solid #007bff; }
+.question { font-weight: 600; color: #495057; margin-bottom: 10px; font-size: 1.05em; }
+.answer { color: #6c757d; line-height: 1.5; white-space: pre-wrap; }
+.no-data { text-align: center; color: #6c757d; font-style: italic; padding: 40px; }
+.citation { display: inline; background: #007bff; color: white; padding: 2px 6px; border-radius: 4px; font-size: 0.85em; font-weight: 600; margin: 0 2px; cursor: help; }
+"""
+
+# Crea l'interfaccia Gradio
+with gr.Blocks(css=CSS, title="UNICEF StoryLine Report Viewer") as demo:
+    gr.Markdown("# 📊 UNICEF StoryLine Report Viewer")
+    gr.Markdown("Select an event and view to visualize the data")
+    
+    with gr.Row():
+        with gr.Column(scale=1):
+            event_dropdown = gr.Dropdown(
+                choices=get_available_events(),
+                label="Select Event",
+                value=None
+            )
+            
+            format_radio = gr.Radio(
+                choices=["qa", "summary"],
+                label="Presented as",
+                value="qa"
+            )
+            
+            view_radio = gr.Radio(
+                choices=["subtopics", "sdgs"],
+                label="Arranged by",
+                value="subtopics"
+            )
     
-    # HTML component to display your content
-    html_output = gr.HTML(value=load_html())
+    output_html = gr.HTML(label="Report Content")
     
-    gr.Markdown("""
-    ---
-    ### 💬 Leave your feedback
+    # Aggiorna l'output quando cambiano i controlli
+    event_dropdown.change(
+        fn=generate_html,
+        inputs=[event_dropdown, format_radio, view_radio],
+        outputs=output_html
+    )
     
-    Use the "Community" tab at the top of this Space to discuss results or start a discussion!
+    format_radio.change(
+        fn=generate_html,
+        inputs=[event_dropdown, format_radio, view_radio],
+        outputs=output_html
+    )
     
-    **Contact**: [Your email or GitHub link]
-    """)
+    view_radio.change(
+        fn=generate_html,
+        inputs=[event_dropdown, format_radio, view_radio],
+        outputs=output_html
+    )
 
-# Launch the app
 if __name__ == "__main__":
     demo.launch()

requirements.txt

@@ -0,0 +1 @@
+gradio==4.44.0