Update app.py

app.py

@@ -17,17 +17,249 @@ SHEET_ID = "1mmdWAyOCYq4yXMgP53Duq712AnlqZWLkfIo76JqM7wM"
 SHEET_NAME = "Condition1"
 
 # ========== استایل‌های سفارشی یکپارچه ==========
-# (استایل‌ها مانند قبل باقی می‌مانند)
-# ...
+st.markdown("""
+<style>
+    @font-face {
+        font-family: 'Vazir';
+        src: url('https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/Vazir.woff') format('woff');
+    }
+
+    :root {
+        --primary: #6a0dad;
+        --text: #333333;
+        --background: #ffffff;
+        --border: #dddddd;
+        --input-bg: #ffffff;
+        --secondary-bg: #f8f9fa;
+        --green: #f0ff0;
+    }
+
+    * {
+        font-family: 'Vazir', sans-serif !important;
+        text-align: right !important;
+        direction: rtl !important;
+    }
+
+    /* تنظیمات اصلی */
+    body, .stApp, [data-testid="stAppViewContainer"] {
+        background-color: var(--background) !important;
+        color: var(--text) !important;
+    }
+
+    /* هدر راهیار */
+    .rahyar-title {
+        color: var(--primary) !important;
+        margin: 0 !important;
+    }
+    
+    .rahyar-subtitle {
+        color: var(--primary) !important;
+        margin: 0 !important;
+        font-size: 14px !important;
+    }
+
+    /* باکس‌های ورودی */
+    .stTextInput input, 
+    .stNumberInput input, 
+    .stSelectbox select,
+    .stTextArea textarea,
+    .stDateInput input,
+    .stTimeInput input,
+    .stMultiSelect div[role="combobox"],
+    div[data-testid="stVerticalBlock"] > div[data-testid="stHorizontalBlock"] > div > div > div > div > input,
+    /* لیست dropdown */
+    .st-bq, .st-br, .st-bs, .st-bt, .st-bu, .st-bv, .st-bw, .st-bx, .st-by, .st-bz {
+        color: var(--text) !important;
+        background-color: var(--input-bg) !important;
+    }
+
+    /* استایل برای متن بالای باکس‌های دموگرافیک */
+    .stTextInput > label,
+    .stNumberInput > label,
+    .stSelectbox > label,
+    .stRadio > label,
+    .stSlider > label {
+        color: black !important;
+        font-weight: bold !important;
+    }
+
+    /* Placeholder */
+    ::placeholder {
+        color: var(--text) !important;
+        opacity: 0.7 !important;
+    }
+
+    /* دکمه اصلی (بنفش با متن سفید) */
+    .stButton>button, 
+    [data-testid="baseButton-primary"],
+    .accept-btn,
+    div[data-testid="stVerticalBlock"] > div[data-testid="stHorizontalBlock"] > div > div > button {
+        background-color: var(--primary) !important;
+        color: white !important;
+        border: none !important;
+        border-radius: 8px !important;
+        padding: 10px 20px !important;
+        font-weight: bold !important;
+    }
+
+    /* دکمه ثانویه (سفید با حاشیه بنفش) */
+    .stFormSubmitButton>button,
+    [data-testid="baseButton-secondary"],
+    .reject-btn {
+        background-color: var(--primary) !important;
+        color: var(--input-bg) !important;
+        border: 1px solid var(--primary) !important;
+        border-radius: 8px !important;
+        padding: 10px 20px !important;
+        font-weight: bold !important;
+    }
+
+
+    /* کامپوننت‌های سفارشی */
+    .rahyar-header {
+        background-color: var(--primary) !important;
+        color: white !important;
+        padding: 15px !important;
+        border-radius: 10px !important;
+        margin-bottom: 20px !important;
+        text-align: center !important;
+    }
+
+    .price-container {
+        background-color: var(--secondary-bg) !important;
+        border-radius: 10px !important;
+        padding: 15px !important;
+        margin: 15px 0 !important;
+        border-right: 5px solid var(--primary) !important;
+    }
+
+    .rahyar-price {
+        color: var(--primary) !important;
+        font-size: 28px !important;
+        font-weight: bold !important;
+    }
+
+    /* فرم دموگرافیک */
+    .stSelectbox > div > div {
+        background-color: white !important;
+        color: var(--text) !important;
+    }
+    
+    .stSelectbox option {
+        background-color: white !important;
+        color: var(--text) !important;
+    }
+
+    /* توضیحات */
+    .explanation-title {
+        color: var(--primary) !important;
+        font-weight: bold !important;
+        margin: 20px 0 10px 0 !important;
+        font-size: 18px !important;
+    }
+
+    .explanation-item {
+        background-color: var(--secondary-bg) !important;
+        border-radius: 8px !important;
+        padding: 12px 15px !important;
+        margin: 8px 0 !important;
+        border-right: 3px solid var(--primary) !important;
+    }
+
+    /* استایل برای سوالات رادیویی و گزینه‌ها */
+    .stRadio > label,
+    .stRadio > div > label,
+    .stRadio > div > div > label,
+    .stRadio > div > div > div > label,
+    .stRadio span {
+        color: black !important;
+    }
+    
+    /* استایل برای متن سوالات */
+    .stMarkdown h3, 
+    .stMarkdown p {
+        color: black !important;
+    }
+    
+    /* استایل برای دکمه ثبت */
+    .stButton > button {
+        color: white !important;
+    }
+
+    /* پیام موفقیت */
+    .stAlert .stSuccess {
+        color: var(--text) !important;
+        background-color: #f0fff0 !important;
+    }
+
+
+    /* تنظیمات مخصوص دسکتاپ */
+    @media (min-width: 769px) {
+        .folium-map {
+            height: 500px !important;
+        }
+    }
+
+    /* تنظیمات مخصوص موبایل */
+    @media (max-width: 768px) {
+        .folium-map {
+            height: 300px !important;
+        }
+        
+        .stSelectbox > div > div {
+            padding: 8px !important;
+        }
+    }
+</style>
+""", unsafe_allow_html=True)
 
 # ========== توابع اصلی ==========
 def create_ride_map():
     """ایجاد نقشه سفر با Folium"""
-    # (کد مانند قبل)
+    start_point = [35.7698, 51.4116]  # میدان ونک
+    end_point = [35.8044, 51.4258]    # میدان تجریش
+    
+    m = folium.Map(location=[35.7871, 51.4187], zoom_start=13)
+    
+    folium.Marker(
+        start_point,
+        popup="<b>مبدأ:</b> میدان ونک",
+        icon=folium.Icon(color="green", icon="flag", prefix="fa")
+    ).add_to(m)
+    
+    folium.Marker(
+        end_point,
+        popup="<b>مقصد:</b> میدان تجریش",
+        icon=folium.Icon(color="red", icon="flag", prefix="fa")
+    ).add_to(m)
+    
+    folium.PolyLine(
+        [start_point, end_point],
+        color="#6a0dad",
+        weight=3,
+        opacity=1
+    ).add_to(m)
+    
+    return m
 
 def show_explanation(exp_type):
     """نمایش توضیحات قیمت"""
-    # (کد مانند قبل)
+    explanations = {
+        "input": [
+            "سطح تقاضا در منطقه: زیاد",
+            "تعداد رانندگان فعال: کم",
+            "زمان روز: ساعت اوج ترافیک",
+            "شرایط جوی: هوای بارانی"
+        ],
+        "counterfactual": [
+            "اگر این سفر را ۳۰ دقیقه دیرتر درخواست می‌کردید، به دلیل سطح تقاضای کمتر، رانندگان فعال بیش‌تر، زمان بهتر روز و شرایط جوی بهتر، ممکن بود قیمت ۱۵٪ کمتر باشد.",
+        ]
+    }
+    
+    if exp_type != "control":
+        st.markdown("<p class='explanation-title'>علت قیمت گذاری:</p>", unsafe_allow_html=True)
+        for item in explanations.get(exp_type, []):
+            st.markdown(f"<p class='explanation-item'>• {item}</p>", unsafe_allow_html=True)
 
 def create_likert_question(question, key, scale_type="5point"):
     """سوال لیکرت با دکمه‌ها"""
@@ -74,7 +306,24 @@ def create_likert_question(question, key, scale_type="5point"):
 # ========== توابع مدیریت داده‌ها ==========
 def get_credentials():
     """دریافت اعتبارنامه از Secrets"""
-    # (کد مانند قبل)
+    try:
+        service_account_json = os.environ.get('GCP_SERVICE_ACCOUNT')
+        if not service_account_json:
+            st.error("مقدار GCP_SERVICE_ACCOUNT در محیط یافت نشد")
+            return None
+            
+        service_account_info = json.loads(service_account_json)
+        creds = Credentials.from_service_account_info(
+            service_account_info,
+            scopes=[
+                "https://www.googleapis.com/auth/spreadsheets",
+                "https://www.googleapis.com/auth/drive.file"
+            ]
+        )
+        return creds
+    except Exception as e:
+        st.error(f"خطا در دریافت اعتبارنامه: {str(e)}")
+        return None
 
 def save_to_sheet(data):
     try:
@@ -133,10 +382,149 @@ def save_to_sheet(data):
         
     except Exception as e:
         st.error(f"خطا در ذخیره‌سازی: {str(e)}")
-        return False
+        return False 
 
 # ========== بخش‌های فرم ==========
-# (صفحات welcome, contact, demographic, scenario_explanation, map_view مانند قبل)
+
+def welcome_page():
+    """صفحه خوشامدگویی"""
+    st.markdown("""
+    <div style="text-align: center; margin-bottom: 30px;">
+        <h2> 🚖 قیمت‌گذاری در پلتفرم‌های درخواست تاکسی اینترنتی</h2>
+        <p>👋با سلام و درود</p>
+        <p>پیشاپیش بابت زمانی که برای پاسخ به سوالات این پرسشنامه و پیش‌برد اهداف علمی دانشجویان می‌گذارید، متشکرم.</p>
+        <p>جهت تقدیر از شرکت‌کنندگان، به دو نفر به قید قرعه جایزه 5 میلیون ریالی تقدیم خواهد شد.</p>
+    </div>
+    
+    <div style="display: flex; align-items: center; background-color: #f0f2f6; border-radius: 10px; padding: 20px; gap: 20px;">
+        <div style="flex: 0 0 100px;">
+            <img src="https://huggingface.co/spaces/maryamilka/surge-pricing/resolve/main/shariflogo.png" alt="لوگو دانشگاه شریف" style="width: 100%; max-width: 100px;">
+        </div>
+        <div style="flex: 1;">
+            <h3>درباره تحقیق:</h3>
+            <p>این پرسشنامه بخشی از یک پایان‌نامه کارشناسی ارشد در دانشگاه صنعتی شریف است که به بررسی ادراک انصاف در قیمت‌گذاری در پلتفرم‌های درخواست تاکسی اینترنتی می‌پردازد.</p>
+            <p>پاسخ‌های شما به سوالات کاملاً محرمانه خواهد بود و فقط در جهت اهداف علمی استفاده خواهد شذ.</p>
+            <p>جهت شروع روی دکمه زیر کلیک کنید 👇🏻</p>
+        </div>
+    </div>
+    """, unsafe_allow_html=True)
+    
+    if st.button("شروع پرسشنامه", key="start_btn", type="primary"):
+        st.session_state.current_page = "contact"
+        st.session_state.start_time = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+        st.rerun()
+
+
+def user_contact():
+    """راه ارتباطی ساده"""
+    st.markdown("""
+    <div style="text-align: center; margin-bottom: 30px;">
+        <h3>📩 راه ارتباطی شما (اختیاری)</h3>
+        <p>در صورت تمایل به شرکت در قرعه‌کشی می‌توانید آیدی تلگرام، شماره تماس یا ایمیل خود را وارد کنید:</p>
+    </div>
+    """, unsafe_allow_html=True)
+    
+    contact_info = st.text_input(
+        "راه ارتباطی (اختیاری)",
+        placeholder="مثال: @username یا 09123456789 یا example@email.com",
+        key="user_contact_input"
+    )
+
+    if st.button("ادامه", key="continue_btn", type="primary"):
+        st.session_state.user_contact = contact_info
+        st.session_state.current_page = "demographic"
+        st.rerun()
+        
+def demographic_form():
+    """فرم اطلاعات دموگرافیک"""
+    st.markdown("### 📝 اطلاعات دموگرافیک")
+    
+    with st.form("demographic_form"):
+        age = st.number_input("سن", min_value=18, max_value=100)
+        gender = st.selectbox("جنسیت", ["مرد", "زن", "سایر"])
+        education = st.selectbox("تحصیلات", ["دیپلم", "لیسانس", "فوق لیسانس", "دکترا"])
+        ride_frequency = st.selectbox("دفعات استفاده از سرویس‌های اشتراک سفر در ماه", 
+                                    ["کمتر از 5 بار", "5-10 بار", "بیش از 10 بار"])
+
+        if st.form_submit_button("ادامه"):
+            st.session_state.demographic_data = {
+                "age": age,
+                "gender": gender,
+                "education": education,
+                "ride_frequency": ride_frequency
+            }
+            st.session_state.current_page = "scenario_explanation"
+            st.rerun()  
+  
+def scenario_explanation():
+    """توضیح سناریو"""
+    col1, col2 = st.columns([1, 4])
+    with col1:
+        try:
+            st.image("rahyar.png", width=80)
+        except:
+            st.image("https://via.placeholder.com/80/6a0dad/FFFFFF?text=LOGO", width=80)
+    with col2:
+        st.markdown("""
+        <h2 class="rahyar-title">رهیار 🚖</h2>
+        <p class="rahyar-subtitle">همراه سفرهای درون‌شهری شما، راهی مطمئن، راهی روشن، رهیار</p>
+        """, unsafe_allow_html=True)
+    
+    st.markdown("### سناریوی تحقیق")
+    
+    st.markdown("""
+    <div style="background-color: #f8f9fa; padding: 15px; border-radius: 10px;">
+        <p>فرض کنید یک اپلیکیشن حمل‌ونقل آنلاین ایرانی به اسم رهیار طراحی شده، چیزی شبیه اسنپ یا تپسی، اما جدیدتر و با شعار "همراه سفرهای شما، راهی مطمئن، راهی روشن، رهیار"</p>
+        <p>در یک روز عادی، شما قصد دارید برای سفری از طریق این پلتفرم اقدام کنید..</p>
+        <p>با کلیک بر دکمه ادامه، اطلاعات سفر را مشاهده کنید.</p>
+    </div>
+    """, unsafe_allow_html=True)
+    
+    if st.button("ادامه", key="continue_btn", type="primary"):
+        st.session_state.current_page = "map_view"
+        st.rerun()
+
+def map_view():
+    """نمایش نقشه و قیمت"""
+    col1, col2 = st.columns([1, 4])
+    with col1:
+        st.image("https://via.placeholder.com/80/6a0dad/FFFFFF?text=LOGO", width=80)
+    with col2:
+        st.markdown("""
+        <h2 style="color: #6a0dad; margin: 0;">رهیار 🚖</h2>
+        <p style="color: #6a0dad; margin: 0;">همراه سفرهای درون‌شهری شما، راهی مطمئن، راهی روشن، رهیار</p>
+        """, unsafe_allow_html=True)
+
+    st.markdown("### مسیر سفر شما")
+    folium_static(create_ride_map(), width=1000 if st.session_state.is_desktop else 800, 
+                 height=500 if st.session_state.is_desktop else 400)
+
+    # قیمت
+    st.markdown(f"""
+    <div class="price-container">
+        <div style="display: flex; justify-content: space-between; align-items: center;">
+            <span>راهیار <span style="background-color: #e6e6fa; color: #6a0dad; padding: 2px 8px; border-radius: 12px; font-size: 14px;">به صرفه</span></span>
+            <span class="rahyar-price">{st.session_state.price:,} تومان</span>
+        </div>
+    </div>
+    """, unsafe_allow_html=True)
+    
+    show_explanation(st.session_state.scenario_type)
+    
+    # دکمه‌ها
+    col1, col2 = st.columns(2)
+    with col1:
+        if st.button("درخواست راهیار", key="accept_btn", use_container_width=True):
+            st.session_state.price_accepted = 1
+            st.session_state.current_page = "attention_check1"
+            st.rerun()
+    
+    with col2:
+        if st.button("رد قیمت", key="reject_btn", use_container_width=True):
+            st.session_state.price_accepted = 0
+            st.session_state.current_page = "attention_check1"
+            st.rerun()
+
 
 def attention_check1():
     """سوال توجه اول (رادیویی ساده)"""
@@ -218,8 +606,91 @@ def random_likert_questions():
     else:
         st.session_state.current_page = "attention_check2"
         st.rerun()
+        
+def explanation_questions():
+    """سوالات درباره توضیحات قیمت"""
+    st.markdown("""
+    <style>
+        /* تضمین رنگ متن برای تمام سطوح */
+        .st-ec, .st-ed, .st-ee, .st-ef, .st-eg, .st-eh, .st-ei, .st-ej {
+            color: black !important;
+        }
+    </style>
+    """, unsafe_allow_html=True)
+    st.markdown("### 📋 سوالات تکمیلی")
 
-# (صفحات explanation_questions و thank_you مانند قبل)
+    # سوال اول
+    explanation_received = st.radio(
+        "آیا برای قیمت پیشنهادی این سفر، توضیحی به شما ارائه شد؟",
+        ["بله", "خیر"],
+        index=None,
+        key="explanation_received"
+    )
+    
+    # سوال دوم (فقط اگر پاسخ بله باشد)
+    explanation_type = None
+    if explanation_received == "بله":
+        explanation_type = st.radio(
+            "اگر توضیحی دریافت کردید، این توضیح بیشتر به کدام مورد شباهت داشت؟",
+            [
+                "بر اساس عواملی که در قیمت‌گذاری لحاظ شده‌اند",
+                "شامل سناریوهای جایگزین که می‌توانستند قیمت متفاوتی ایجاد کنند",
+                "توضیحی دریافت نکردم"
+            ],
+            index=None,
+            key="explanation_type"
+        )
+    
+    if st.button("ثبت پاسخ‌ها", type="primary"):
+        if explanation_received is None:
+            st.warning("لطفاً به سوال اول پاسخ دهید")
+        elif explanation_received == "بله" and explanation_type is None:
+            st.warning("لطفاً به سوال دوم پاسخ دهید")
+        else:
+            st.session_state.explanation_data = {
+                "explanation_received": explanation_received,
+                "explanation_type": explanation_type if explanation_received == "بله" else "N/A"
+            }
+            
+            # جمع‌آوری تمام داده‌ها برای ذخیره‌سازی
+            end_time = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
+            start_time = datetime.strptime(st.session_state.start_time, "%Y-%m-%d %H:%M:%S")
+            completion_time = (datetime.now() - start_time).total_seconds()
+            
+            save_data = {
+                "start_time": st.session_state.start_time,
+                "end_time": end_time,
+                "completion_time": completion_time,
+                "scenario_type": st.session_state.scenario_type,
+                "price": st.session_state.price,
+                "user_contact": st.session_state.get("user_contact", ""),
+                "price_accepted": st.session_state.get("price_accepted", 0),
+                "attention_check1": st.session_state.get("attention_check1", None),
+                "attention_check2": st.session_state.get("attention_check2", None),
+                "explanation_received": explanation_received,
+                "explanation_type": explanation_type if explanation_received == "بله" else "N/A",
+                **st.session_state.demographic_data
+            }
+            
+            # اضافه کردن پاسخ‌های لیکرت
+            for q in st.session_state.all_questions:
+                save_data[q["label"]] = st.session_state.get(q["key"], None)
+            
+            if save_to_sheet(save_data):
+                st.session_state.current_page = "thank_you"
+                st.rerun()
+            else:
+                st.error("خطا در ذخیره‌سازی داده‌ها. لطفاً دوباره تلاش کنید.")
+
+
+def thank_you_page():
+    """صفحه تشکر"""
+    st.success("✅ پاسخ‌های شما با موفقیت ثبت شد. با تشکر از مشارکت شما در این تحقیق!")
+    st.balloons()
+    
+    if st.button("بازگشت به ابتدا"):
+        st.session_state.clear()
+        st.rerun()
 
 # ========== مدیریت وضعیت و صفحه‌بندی ==========
 def main():