Create 30_Medical_Architectures.py

pages/30_Medical_Architectures.py

@@ -0,0 +1,94 @@
+import streamlit as st
+import json
+
+# Set page configuration to wide screen
+st.set_page_config(layout="wide")
+
+# Load the data from the external JSON file
+with open('data.json', 'r') as file:
+    data = json.load(file)
+
+# Set up session state to keep track of the current index
+if 'current_index' not in st.session_state:
+    st.session_state.current_index = 0
+
+# Function to display the current article
+def display_article(index):
+    article = data['articles'][index]
+
+    # Display the title and description
+    st.markdown(f"<h2 style='text-align: center;'>{article['title']}</h2>", unsafe_allow_html=True)
+    st.write(article['description'])
+
+    # Display the image centered
+    st.image(article['image'], use_column_width=True, caption=article['title'])
+
+    # Display the link
+    st.markdown(f"<div style='text-align: center;'><a href='{article['href']}' target='_blank'>Read more</a></div>", unsafe_allow_html=True)
+
+# Function to handle navigation via buttons
+def next_article():
+    if st.session_state.current_index < len(data['articles']) - 1:
+        st.session_state.current_index += 1
+
+def previous_article():
+    if st.session_state.current_index > 0:
+        st.session_state.current_index -= 1
+
+# Dropdown to select an article by title
+options = [article['title'] for article in data['articles']]
+selected_title = st.selectbox("Select an Architecture", options, index=st.session_state.current_index)
+
+# Add the Medical Architect Assistant link directly below the dropdown
+st.markdown(
+    """
+    <div style='text-align: center;'>
+        <a href='https://chatgpt.com/g/g-UexWaSEjO-medical-cloud-architect' target='_blank' style='font-size: 20px; color: #2C6BA0;'>
+            Medical Cloud Architect Assistant
+        </a>
+    </div>
+    """,
+    unsafe_allow_html=True
+)
+
+# Find the selected article index based on the title
+for i, article in enumerate(data['articles']):
+    if article['title'] == selected_title:
+        st.session_state.current_index = i
+        break
+
+# Display the current article
+display_article(st.session_state.current_index)
+
+# Add navigation buttons
+col1, col2, col3 = st.columns([1, 1, 1])
+with col1:
+    st.button("Previous", on_click=previous_article)
+with col3:
+    st.button("Next", on_click=next_article)
+
+# Show the current index out of total articles
+st.write(f"Article {st.session_state.current_index + 1} of {len(data['articles'])}")
+
+# Make the app fullscreen-friendly and wide screen
+st.markdown(
+    """
+    <style>
+        .main {
+            max-width: 100%;
+            padding-left: 10px;
+            padding-right: 10px;
+        }
+        img {
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+            max-width: 80%;
+        }
+        h2 {
+            text-align: center;
+        }
+    </style>
+    """,
+    unsafe_allow_html=True
+)