Upload streamlit_app.py with huggingface_hub

streamlit_app.py

@@ -0,0 +1,488 @@
+import streamlit as st
+import pandas as pd
+import plotly.express as px
+import plotly.graph_objects as go
+from datetime import datetime
+import os
+from utils import load_data, create_project_card, create_impact_metric
+
+# Page configuration
+st.set_page_config(
+    page_title="Mera Apna Shahar - Building Inclusive Communities",
+    page_icon="🏘️",
+    layout="wide",
+    initial_sidebar_state="expanded"
+)
+
+# Custom CSS for better styling
+st.markdown("""
+<style>
+    .main-header {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        padding: 2rem;
+        border-radius: 10px;
+        margin-bottom: 2rem;
+        text-align: center;
+        color: white;
+    }
+    .mission-card {
+        background: #f8f9fa;
+        padding: 1.5rem;
+        border-radius: 10px;
+        border-left: 4px solid #667eea;
+        margin: 1rem 0;
+    }
+    .impact-metric {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: white;
+        padding: 1rem;
+        border-radius: 10px;
+        text-align: center;
+        margin: 0.5rem;
+    }
+    .project-card {
+        background: white;
+        padding: 1.5rem;
+        border-radius: 10px;
+        box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+        margin: 1rem 0;
+        border: 1px solid #e0e0e0;
+    }
+    .stButton > button {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: white;
+        border: none;
+        padding: 0.75rem 2rem;
+        border-radius: 25px;
+        font-weight: bold;
+        transition: all 0.3s ease;
+    }
+    .stButton > button:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 4px 15px rgba(0,0,0,0.2);
+    }
+</style>
+""", unsafe_allow_html=True)
+
+# Load data
+def load_ngo_data():
+    """Load and cache NGO data"""
+    projects = {
+        'Discrimination in Society': {
+            'description': 'Fighting against social discrimination and promoting equality for all',
+            'icon': '⚖️',
+            'activities': [
+                'Anti-discrimination awareness campaigns',
+                'Community dialogue sessions',
+                'Legal aid and support',
+                'Educational workshops',
+                'Social integration programs'
+            ],
+            'impact': 1500
+        },
+        'Women Environment': {
+            'description': 'Creating safe and empowering spaces for women in urban environments',
+            'icon': '👩',
+            'activities': [
+                'Women safety audits',
+                'Self-defense training',
+                'Safe spaces creation',
+                'Women\'s skill development',
+                'Leadership programs'
+            ],
+            'impact': 800
+        },
+        'Sustainable Environment': {
+            'description': 'Promoting environmental sustainability and climate action',
+            'icon': '🌱',
+            'activities': [
+                'Tree plantation drives',
+                'Waste management initiatives',
+                'Renewable energy awareness',
+                'Green building campaigns',
+                'Climate education'
+            ],
+            'impact': 2500
+        },
+        'Cleaner City': {
+            'description': 'Working towards a cleaner, healthier urban environment',
+            'icon': '🏙️',
+            'activities': [
+                'Cleanliness drives',
+                'Plastic waste reduction',
+                'Public space maintenance',
+                'Community cleaning events',
+                'Waste segregation awareness'
+            ],
+            'impact': 3200
+        }
+    }
+    return projects
+
+# Main header
+st.markdown("""
+<div class="main-header">
+    <h1>🏘️ Mera Apna Shahar</h1>
+    <h3>Building Inclusive, Sustainable Communities</h3>
+    <p>Together we create a better tomorrow for everyone</p>
+</div>
+""", unsafe_allow_html=True)
+
+# Header with anycoder credit
+col1, col2, col3 = st.columns([1, 2, 1])
+with col2:
+    st.markdown("### Transforming Communities Through Action")
+    st.markdown("*Built with [anycoder](https://huggingface.co/spaces/akhaliq/anycoder)*")
+
+# Navigation sidebar
+st.sidebar.title("Navigation")
+page = st.sidebar.radio("Go to", ["Home", "About Us", "Our Projects", "Get Involved", "Impact & Success", "Contact"])
+
+# Load data
+projects_data = load_ngo_data()
+
+if page == "Home":
+    # Hero section
+    st.markdown("## Welcome to Mera Apna Shahar")
+    st.markdown("""
+    We are a non-profit organization dedicated to creating positive change in our communities. 
+    Our mission is to build inclusive, sustainable, and equitable urban environments where every person 
+    can thrive and contribute to the betterment of society.
+    """)
+    
+    # Mission statement
+    st.markdown("### Our Mission")
+    st.markdown("""
+    <div class="mission-card">
+        <h4>🌟 Vision Statement</h4>
+        <p>To create inclusive, sustainable communities where discrimination has no place, 
+        women feel safe and empowered, the environment is protected for future generations, 
+        and our cities are clean, healthy places to live.</p>
+    </div>
+    """, unsafe_allow_html=True)
+    
+    # Quick stats
+    st.markdown("### Our Impact at a Glance")
+    col1, col2, col3, col4 = st.columns(4)
+    
+    with col1:
+        st.markdown("""
+        <div class="impact-metric">
+            <h2>8000+</h2>
+            <p>People Impacted</p>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    with col2:
+        st.markdown("""
+        <div class="impact-metric">
+            <h2>150+</h2>
+            <p>Projects Completed</p>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    with col3:
+        st.markdown("""
+        <div class="impact-metric">
+            <h2>50+</h2>
+            <p>Active Volunteers</p>
+        </div>
+        """, unsafe_allow_html=True)
+    
+    with col4:
+        st.markdown("""
+        <div class="impact-metric">
+            <h2>5+</h2>
+            <p>Years of Service</p>
+        </div>
+        """, unsafe_allow_html=True)
+
+elif page == "About Us":
+    st.markdown("## About Mera Apna Shahar")
+    
+    # Organization story
+    st.markdown("### Our Story")
+    st.markdown("""
+    Founded with a vision of creating inclusive communities, Mera Apna Shahar began as a small grassroots 
+    initiative addressing the pressing social and environmental challenges in our urban areas. 
+    What started as community volunteers coming together for local clean-up drives has evolved into 
+    a comprehensive non-profit organization tackling multiple interconnected issues.
+    """)
+    
+    st.markdown("### Our Core Values")
+    col1, col2 = st.columns(2)
+    
+    with col1:
+        st.markdown("#### 🤝 Inclusivity")
+        st.markdown("We believe in creating spaces where everyone feels welcome and valued, regardless of their background, gender, or socioeconomic status.")
+        
+        st.markdown("#### 🌍 Sustainability")
+        st.markdown("Environmental protection and sustainable practices are at the heart of everything we do, ensuring a better future for generations to come.")
+    
+    with col2:
+        st.markdown("#### 💪 Empowerment")
+        st.markdown("We focus on empowering communities, especially women and marginalized groups, to take charge of their own development.")
+        
+        st.markdown("#### 🔄 Community-Driven")
+        st.markdown("Our solutions are developed with and for the community, ensuring they are relevant, sustainable, and locally owned.")
+    
+    # Team section
+    st.markdown("### Our Leadership")
+    team_data = {
+        'Role': ['Executive Director', 'Program Manager', 'Community Outreach Coordinator', 'Environmental Specialist'],
+        'Name': ['Dr. Priya Sharma', 'Rajesh Kumar', 'Fatima Ali', 'Arjun Patel'],
+        'Experience': ['15+ years', '10+ years', '8+ years', '12+ years']
+    }
+    
+    team_df = pd.DataFrame(team_data)
+    st.table(team_df)
+
+elif page == "Our Projects":
+    st.markdown("## Our Project Areas")
+    st.markdown("We work on four key areas that are interconnected and essential for building better communities:")
+    
+    # Project cards
+    for project_name, project_info in projects_data.items():
+        st.markdown(f"""
+        <div class="project-card">
+            <h3>{project_info['icon']} {project_name}</h3>
+            <p>{project_info['description']}</p>
+            <h4>Key Activities:</h4>
+            <ul>
+        """, unsafe_allow_html=True)
+        
+        for activity in project_info['activities']:
+            st.markdown(f"<li>{activity}</li>", unsafe_allow_html=True)
+        
+        st.markdown("</ul>", unsafe_allow_html=True)
+        
+        # Show impact metric
+        col1, col2 = st.columns([3, 1])
+        with col1:
+            st.markdown(f"**People directly impacted: {project_info['impact']}+**")
+        with col2:
+            if st.button(f"Learn More About {project_name}", key=project_name):
+                st.info(f"Detailed information about {project_name} projects will be available soon!")
+        
+        st.markdown("</div>", unsafe_allow_html=True)
+
+elif page == "Get Involved":
+    st.markdown("## Get Involved")
+    st.markdown("Join us in making a difference! There are many ways you can contribute to our mission:")
+    
+    tab1, tab2, tab3, tab4 = st.tabs(["🤝 Volunteer", "💰 Donate", "📢 Partner", "📧 Contact Us"])
+    
+    with tab1:
+        st.markdown("### Become a Volunteer")
+        st.markdown("""
+        Our volunteers are the backbone of our organization. Whether you can spare a few hours a month 
+        or want to make a more significant commitment, your contribution makes a real difference.
+        """)
+        
+        with st.form("volunteer_form"):
+            col1, col2 = st.columns(2)
+            with col1:
+                name = st.text_input("Full Name")
+                email = st.text_input("Email Address")
+                phone = st.text_input("Phone Number")
+            with col2:
+                skills = st.multiselect("Skills/Interests", 
+                    ["Event Organization", "Social Media", "Teaching/Training", 
+                     "Environmental Work", "Community Outreach", "Admin Support"])
+                availability = st.selectbox("Availability", 
+                    ["Weekly", "Bi-weekly", "Monthly", "Occasionally", "Project-based"])
+            
+            experience = st.text_area("Tell us about any relevant experience or motivation to volunteer")
+            
+            submitted = st.form_submit_button("Submit Application")
+            if submitted:
+                st.success("Thank you for your interest in volunteering! We'll contact you soon.")
+    
+    with tab2:
+        st.markdown("### Support Our Work")
+        st.markdown("""
+        Your donations directly support our programs and initiatives. Every contribution, 
+        no matter the size, helps us create lasting change in communities.
+        """)
+        
+        donation_amount = st.selectbox("Choose donation amount", 
+            ["₹500", "₹1,000", "₹2,500", "₹5,000", "₹10,000", "Custom Amount"])
+        
+        if donation_amount == "Custom Amount":
+            custom_amount = st.number_input("Enter custom amount (₹)", min_value=100)
+        
+        donation_purpose = st.selectbox("Direct donation to", 
+            ["General Fund", "Anti-Discrimination Programs", "Women Empowerment", 
+             "Environmental Projects", "Clean City Initiatives"])
+        
+        if st.button("Donate Now"):
+            st.info("Thank you for your generosity! You will be redirected to our secure payment gateway.")
+    
+    with tab3:
+        st.markdown("### Partnership Opportunities")
+        st.markdown("""
+        We welcome partnerships with like-minded organizations, government agencies, 
+        and corporate entities who share our vision of creating inclusive communities.
+        """)
+        
+        partnership_type = st.selectbox("Partnership Type", 
+            ["Corporate Social Responsibility", "Government Collaboration", 
+             "NGO Partnership", "Academic Institution", "Other"])
+        
+        with st.form("partnership_form"):
+            organization = st.text_input("Organization Name")
+            contact_person = st.text_input("Contact Person")
+            partnership_details = st.text_area("Describe potential collaboration areas")
+            
+            submitted = st.form_submit_button("Submit Partnership Inquiry")
+            if submitted:
+                st.success("Thank you for your interest in partnership! We'll review and respond within 48 hours.")
+    
+    with tab4:
+        st.markdown("### Contact Us")
+        
+        contact_info = {
+            "📧 Email": "contact@meraapnashahar.org",
+            "📱 Phone": "+91 98765 43210",
+            "📍 Address": "123 Community Center, Green Park, New Delhi - 110016",
+            "🕐 Office Hours": "Monday - Friday: 9:00 AM - 6:00 PM"
+        }
+        
+        for key, value in contact_info.items():
+            st.markdown(f"**{key}** {value}")
+        
+        # Contact form
+        with st.form("contact_form"):
+            subject = st.selectbox("Subject", ["General Inquiry", "Volunteer Application", "Partnership", "Media Request", "Other"])
+            message = st.text_area("Your Message")
+            
+            submitted = st.form_submit_button("Send Message")
+            if submitted:
+                st.success("Your message has been sent! We'll respond within 24 hours.")
+
+elif page == "Impact & Success":
+    st.markdown("## Our Impact & Success Stories")
+    
+    # Impact metrics visualization
+    st.markdown("### Impact Metrics")
+    
+    # Create impact data
+    impact_data = {
+        'Project Area': ['Discrimination in Society', 'Women Environment', 'Sustainable Environment', 'Cleaner City'],
+        'People Impacted': [1500, 800, 2500, 3200],
+        'Projects Completed': [25, 18, 35, 42]
+    }
+    
+    fig1 = px.bar(impact_data, x='Project Area', y='People Impacted', 
+                  title='People Impacted by Project Area',
+                  color='People Impacted', color_continuous_scale='viridis')
+    st.plotly_chart(fig1, use_container_width=True)
+    
+    fig2 = px.bar(impact_data, x='Project Area', y='Projects Completed',
+                  title='Projects Completed by Area',
+                  color='Projects Completed', color_continuous_scale='plasma')
+    st.plotly_chart(fig2, use_container_width=True)
+    
+    # Success stories
+    st.markdown("### Success Stories")
+    
+    success_stories = [
+        {
+            "title": "Community Integration Program Success",
+            "description": "Our anti-discrimination initiative in the local community led to the successful integration of 200+ families from diverse backgrounds, fostering mutual understanding and reducing conflicts.",
+            "impact": "200+ families integrated",
+            "location": "South Delhi Communities"
+        },
+        {
+            "title": "Women's Safety Initiative",
+            "description": "Implemented comprehensive safety measures in 5 major residential areas, including improved lighting, emergency response systems, and women's self-defense training programs.",
+            "impact": "1,200+ women trained",
+            "location": "Multiple residential areas"
+        },
+        {
+            "title": "Green City Transformation",
+            "description": "Our environmental sustainability program resulted in the plantation of 5,000+ trees and establishment of 15 community gardens, significantly improving air quality and green cover.",
+            "impact": "5,000+ trees planted",
+            "location": "City-wide initiative"
+        },
+        {
+            "title": "Clean City Campaign",
+            "description": "Monthly cleanliness drives involving 500+ volunteers have transformed 25 public spaces, creating healthier and more attractive community areas.",
+            "impact": "25 public spaces transformed",
+            "location": "Various city locations"
+        }
+    ]
+    
+    for i, story in enumerate(success_stories):
+        with st.expander(f"📖 {story['title']}"):
+            col1, col2 = st.columns([3, 1])
+            with col1:
+                st.markdown(f"**Impact:** {story['impact']}")
+                st.markdown(f"**Location:** {story['location']}")
+                st.markdown(story['description'])
+            with col2:
+                if st.button("Share Story", key=f"share_{i}"):
+                    st.info("Share functionality will be available soon!")
+
+elif page == "Contact":
+    st.markdown("## Contact Information")
+    
+    # Contact details
+    col1, col2 = st.columns(2)
+    
+    with col1:
+        st.markdown("### Get in Touch")
+        st.markdown("""
+        **📧 Email:** contact@meraapnashahar.org
+        
+        **📱 Phone:** +91 98765 43210
+        
+        **📍 Address:** 
+        123 Community Center
+        Green Park, New Delhi - 110016
+        India
+        
+        **🕐 Office Hours:**
+        Monday - Friday: 9:00 AM - 6:00 PM
+        Saturday: 10:00 AM - 4:00 PM
+        Sunday: Closed
+        """)
+    
+    with col2:
+        st.markdown("### Follow Our Work")
+        st.markdown("""
+        **📱 Social Media:**
+        - Facebook: @MeraApnaShahar
+        - Instagram: @meraapnashahar
+        - Twitter: @MeraApnaShahar
+        - LinkedIn: Mera Apna Shahar Foundation
+        
+        **📰 Newsletter:** Subscribe to our monthly updates
+        """)
+        
+        # Newsletter subscription
+        with st.form("newsletter_form"):
+            email = st.text_input("Email for newsletter")
+            interests = st.multiselect("Areas of interest", list(projects_data.keys()))
+            subscribe = st.form_submit_button("Subscribe")
+            if subscribe:
+                st.success("Thank you for subscribing to our newsletter!")
+    
+    # Map placeholder
+    st.markdown("### Our Location")
+    st.info("Interactive map will be available soon. We are located in Green Park, New Delhi.")
+    
+    # Emergency contact
+    st.markdown("### Emergency Contact")
+    st.warning("**For urgent matters outside office hours:** +91 98765 43210")
+
+# Footer
+st.markdown("---")
+st.markdown("""
+<div style="text-align: center; padding: 2rem; background: #f8f9fa; border-radius: 10px; margin-top: 2rem;">
+    <h4>🌟 Mera Apna Shahar - Building Inclusive Communities Together</h4>
+    <p>Together we create a better tomorrow for everyone</p>
+    <p><small>© 2024 Mera Apna Shahar. All rights reserved. | 
+    <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank">Built with anycoder</a></small></p>
+</div>
+""", unsafe_allow_html=True)