Update app.py

app.py

@@ -743,97 +743,86 @@ import streamlit as st
 import plotly.graph_objects as go
 
 def custom_likert_slider(question_data):
-    """نمایش سوال لیکرت با طیف Plotly (فلیپ‌شده)"""
+import plotly.graph_objects as go
+
+def custom_likert_slider(question_data):
+    """نمایش سوال لیکرت با اسلایدر و طیف رنگی Plotly"""
     question = question_data["question"]
     key = question_data["key"]
     points = question_data["scale"]
-    labels = question_data.get("labels", ["کمترین", "بیشترین"])  # لیبل‌های دو طرف
-    scale_labels = ["خیلی کم", "کم", "نسبتاً کم", "متوسط", "نسبتاً زیاد", "زیاد", "خیلی زیاد"]  # لیبل‌های طیف
+    labels = question_data.get("labels", ["کاملاً مخالفم", "کاملاً موافقم"])
     
     # مقدار پیش‌فرض (وسط طیف)
-    default_value = (points + 1) // 2 - 1  # برای مقیاس ۰ تا ۶
-
-    # نمایش سوال
-    st.markdown(f"<p style='font-size:16px; margin-bottom:5px; font-family:\"B Nazanin\"; direction:rtl;'>{question}</p>", unsafe_allow_html=True)
-
-    # لیبل‌های دو طرف (فلیپ‌شده)
-    st.markdown(
-        f"""
-        <div class="slider-labels" style='display:flex; justify-content:space-between; font-size:16px; font-weight:bold; margin-bottom:12px; color:#333333; font-family:"B Nazanin"; direction:rtl;'>
-            <span>{labels[1]}</span>  <!-- بیشترین (مثل کاملاً منصفانه) سمت راست -->
-            <span>{labels[0]}</span>  <!-- کمترین (مثل کاملاً نامنصفانه) سمت چپ -->
-        </div>
-        """,
-        unsafe_allow_html=True
-    )
-
-    # انتخاب عددی از اسلایدر معمولی
-    raw_value = st.slider(
-        "",
+    default_value = st.session_state.answers.get(key, (points - 1) // 2)
+    
+    st.markdown(f"**{question}**")
+    
+    # ایجاد اسلایدر عددی
+    selected = st.slider(
+        "انتخاب شدت",
         min_value=0,
         max_value=points-1,
-        value=st.session_state.get(key, default_value),
+        value=default_value,
         step=1,
-        key=key,
-        format="%d"
+        key=f"slider_{key}",
+        label_visibility="collapsed"
     )
-
-    # معکوس کردن مقدار برای ذخیره‌سازی (۰ به ۷، ۱ به ۶، و غیره)
-    flipped_value = points - raw_value
-
-    # نمایش طیف با Plotly (فلیپ‌شده)
-    positions = list(range(len(scale_labels)))
+    
+    # ذخیره فوری مقدار در session_state
+    st.session_state.answers[key] = selected
+    st.session_state[key] = selected
+    
+    # نمایش طیف با رنگ بنفش روی گزینه انتخاب‌شده
     fig = go.Figure()
-
+    
+    positions = list(range(points))
     fig.add_trace(go.Scatter(
         x=positions,
-        y=[0]*len(scale_labels),
+        y=[0]*points,
         mode='markers+text',
         marker=dict(
-            size=24,  # دایره‌های بزرگ‌تر
-            color=['#d8d2f3' if i != raw_value else '#6a0dad' for i in positions],  # بنفش تیره برای انتخاب‌شده
-            line=dict(width=2, color='#ffffff')  # حاشیه سفید
+            size=25,
+            color=['#d1c4e9' if i != selected else '#6a0dad' for i in positions],
+            line=dict(width=2, color='#6a0dad')
         ),
-        text=scale_labels,
+        text=labels if len(labels) == points else positions,
         textposition="top center",
-        textfont=dict(family="B Nazanin", size=16, color="#333333")
+        textfont=dict(size=14)
     ))
-
+    
+    # خط اتصال نقاط
+    fig.add_trace(go.Scatter(
+        x=positions,
+        y=[0]*points,
+        mode='lines',
+        line=dict(color='#d1c4e9', width=2),
+        hoverinfo='none'
+    ))
+    
     fig.update_layout(
         xaxis=dict(
             tickmode='array',
             tickvals=positions,
-            ticktext=scale_labels[::-1],  # فلیپ کردن لیبل‌ها (خیلی زیاد سمت راست)
+            ticktext=labels if len(labels) == points else positions,
             showgrid=False,
             zeroline=False,
-            tickfont=dict(family="B Nazanin", size=14),
-            autorange="reversed"  # فلیپ کردن محور x
+            range=[-0.5, points-0.5]
         ),
-        yaxis=dict(showticklabels=False, showgrid=False, zeroline=False),
+        yaxis=dict(showticklabels=False, showgrid=False, zeroline=False, range=[-0.1, 0.1]),
         margin=dict(l=20, r=20, t=40, b=20),
-        height=200,
+        height=150,
         showlegend=False,
-        paper_bgcolor="#f8f9fa",  # پس‌زمینه هماهنگ
-        plot_bgcolor="#f8f9fa"
+        hovermode=False
     )
-
-    st.plotly_chart(fig, use_container_width=True)
-
-    # نمایش پاسخ انتخاب‌شده (مقدار فلیپ‌شده)
-    st.markdown(
-        f"""
-        <p class="slider-response" style='text-align:center; color:#6a0dad; font-weight:bold; font-size:18px; margin-top:15px; font-family:"B Nazanin"; direction:rtl; background:#f0e6ff; padding:8px; border-radius:6px;'>
-            پاسخ انتخاب‌شده: {scale_labels[raw_value]} ({flipped_value})
-        </p>
-        """,
-        unsafe_allow_html=True
-    )
-
-    # دیباگ
-    st.write(f"Debug: مقدار خام: {raw_value}, مقدار فلیپ‌شده ذخیره‌شده برای {key}: {flipped_value}")
     
-    # ذخیره مقدار فلیپ‌شده
-    return flipped_value
+    st.plotly_chart(fig, use_container_width=True, config={'staticPlot': True})
+    
+    # نمایش انتخاب
+    selected_label = labels[selected] if len(labels) > selected else str(selected+1)
+    st.markdown(f"<p style='text-align:center; color:#6a0dad; font-weight:bold;'>پاسخ شما: <strong>{selected_label}</strong></p>", 
+                unsafe_allow_html=True)
+    
+    return selected
     
 def create_ride_map():
     """ایجاد نقشه سفر با Folium - نسخه اصلاح شده با مناطق عمومی"""