pages/1Player_Information.py

import streamlit as st
import pandas as pd
import plotly.express as px
import plotly.graph_objects as go
import base64
from io import StringIO



# Background image setup
def set_bg():
    bg_style = """
    <style>
    .stApp {
        background-color: beige;
        color: black;
    }
    .text-box {
        background-color: rgba(255, 255, 255, 0.8);
        padding: 25px;
        border-radius: 10px;
        margin-top: 20px;
    }
    h1, h2, h3, h4, h5, h6 {
        color: black !important;
        text-align: center;
    }
    .kpi-card {
        background-color: rgba(0, 0, 0, 0.05);
        color: black;
    }
    .kpi-card .label {
        color: #333;
    }
    </style>
    """
    st.markdown(bg_style, unsafe_allow_html=True)


# Apply beige background
set_bg()


















# Load dataset
df = pd.read_csv(r"cleaned.csv")
import streamlit.components.v1 as components

# App Title
col1, col2 = st.columns([2, 1])

with col1:
    st.title("🚀 Cricket Player Career Stats Viewer")
    


with col2:
    components.html(
        """
        <script src="https://unpkg.com/@dotlottie/player-component@2.7.12/dist/dotlottie-player.mjs" type="module"></script>
        <dotlottie-player 
            src="https://lottie.host/4a7cdc9a-67d6-4509-a98d-f97862e1b596/tVTWTBvZ2a.lottie" 
            background="transparent" 
            speed="1" 
            style="width: 300px; height: 300px;" 
            loop autoplay>
        </dotlottie-player>
        """,
        height=250,
        width=200
    )

# Player selection
player_name = st.selectbox("Select a Player", df['Player'].unique())


# Filter player data
player_data = df[df['Player'] == player_name].iloc[0]

# Extract player ODI stats
runs = player_data["batting_Runs_ODI"]
avg = player_data["batting_Average_ODI"]
sr = player_data["batting_SR_ODI"]
wickets = player_data["bowling_ODI_Wickets"]
hundreds = player_data["batting_100s_ODI"]
fifties = player_data["batting_50s_ODI"]

# Custom CSS for sleek KPI cards
st.markdown("""
<style>
.kpi-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 30px;
}
.kpi-card {
    flex: 1 1 16%;
    background-color: #f0e6d6;  /* Light beige tone */
    border-radius: 12px;
    padding: 15px;
    margin: 10px;
    text-align: center;
    color: black;
    font-family: 'Segoe UI', sans-serif;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.kpi-card .label {
    font-size: 14px;
    color: #333333;
    margin-bottom: 5px;
}
.kpi-card .value {
    font-size: 26px;
    font-weight: bold;
    color: #000000;
}
</style>
""", unsafe_allow_html=True)


# Section header
st.markdown("<h2 style='color:white;'>📊 Player Performance (ODI)</h2>", unsafe_allow_html=True)

# KPI card container
st.markdown(f"""
<div class="kpi-container">
    <div class="kpi-card">
        <div class="label">🏏 Runs</div>
        <div class="value">{runs}</div>
    </div>
    <div class="kpi-card">
        <div class="label">📊 Average</div>
        <div class="value">{avg:.2f}</div>
    </div>
    <div class="kpi-card">
        <div class="label">⚡ Strike Rate</div>
        <div class="value">{sr:.2f}</div>
    </div>
    <div class="kpi-card">
        <div class="label">🎯 Wickets</div>
        <div class="value">{wickets}</div>
    </div>
    <div class="kpi-card">
        <div class="label">💯 100s</div>
        <div class="value">{hundreds}</div>
    </div>

</div>
""", unsafe_allow_html=True)



































formats = ['Test', 'ODI', 'T20', 'IPL']

# ---- Batting Career Summary ----


st.subheader("Batting Career Summary")
batting_summary = []

for fmt in formats:
    batting_summary.append([
        fmt,
        player_data[f'Matches_{fmt}'],
        player_data[f'batting_Innings_{fmt}'],
        player_data[f'batting_Runs_{fmt}'],
        player_data[f'batting_Balls_{fmt}'],
        player_data[f'batting_Highest_{fmt}'],
        player_data[f'batting_Average_{fmt}'],
        player_data[f'batting_SR_{fmt}'],
        player_data[f'batting_Not Out_{fmt}'],
        player_data[f'batting_Fours_{fmt}'],
        player_data[f'batting_Sixes_{fmt}'],
        player_data[f'batting_50s_{fmt}'],
        player_data[f'batting_100s_{fmt}'],
        player_data[f'batting_200s_{fmt}']
    ])

batting_df = pd.DataFrame(batting_summary, columns=[
    'Format', 'Matches', 'Innings', 'Runs', 'Balls Faced', 'Highest', 'Average',
    'Strike Rate', 'Not Out', '4s', '6s', '50s', '100s', '200s'
])
st.dataframe(batting_df.set_index("Format"),use_container_width=True)

# ---- Bowling Career Summary ----
st.subheader("Bowling Career Summary")
bowling_summary = []

for fmt in formats:
    bowling_summary.append([
        fmt,
        player_data[f'bowling_{fmt}_Innings'],
        player_data[f'bowling_{fmt}_Balls'],
        player_data[f'bowling_{fmt}_Runs'],
        player_data[f'bowling_{fmt}_Wickets'],
        player_data[f'bowling_{fmt}_Avg'],
        player_data[f'bowling_{fmt}_Eco'],
        player_data[f'bowling_{fmt}_SR'],
        player_data[f'bowling_{fmt}_BBI'],
        player_data[f'bowling_{fmt}_5w'],
        player_data[f'bowling_{fmt}_10w']
    ])

bowling_df = pd.DataFrame(bowling_summary, columns=[
    'Format', 'Innings', 'Balls', 'Runs', 'Wickets', 'Avg', 'Economy',
    'Strike Rate', 'BBI', '5w', '10w'
])
st.dataframe(bowling_df.set_index("Format"))

# ---- Plotly Pie Chart: Matches per Format ----
st.subheader("Matches Played per Format")
match_counts = [player_data[f'Matches_{fmt}'] for fmt in formats]


col1, col2 = st.columns(2)

# ---- Pie Chart: Match Distribution ----
with col1:
    fig1 = px.pie(
        names=formats,
        values=match_counts,
        title="Match Distribution by Format",
        hole=0.4
    )
    fig1.update_layout(
        paper_bgcolor='rgba(0, 0, 0, 0.8)',   # outer background
        plot_bgcolor='rgba(0, 0, 0, 0.7)',    # plot area
        font=dict(color='white')
    )
    st.plotly_chart(fig1, use_container_width=True, key="match_distribution")

# ---- Bar Chart: 100s and 50s ----
with col2:
    fig4 = go.Figure(data=[
        go.Bar(name='100s', x=formats, y=batting_df['100s']),
        go.Bar(name='50s', x=formats, y=batting_df['50s'])
    ])
    fig4.update_layout(
        title='Centuries and Fifties by Format',
        barmode='group',
        paper_bgcolor='rgba(0, 0, 0, 0.8)',
        plot_bgcolor='rgba(0, 0, 0, 0.7)',
        font=dict(color='white')
    )
    st.plotly_chart(fig4, use_container_width=True, key="hundreds_fifties")


# ---- Plotly Bar Charts for Additional Insights ----
st.subheader("Additional Visual Insights")
col1, col2 = st.columns(2)

with col1:
    fig2 = px.bar(
        batting_df,
        x='Format',
        y='Average',
        title='Batting Average by Format',
        text_auto=True,
        color='Format'
    )
    st.plotly_chart(fig2, use_container_width=True, key="bat_avg_chart")

with col2:
    fig3 = px.bar(
        batting_df,
        x='Format',
        y='Strike Rate',
        title='Strike Rate by Format',
        text_auto=True,
        color='Format'
    )
    st.plotly_chart(fig3, use_container_width=True, key="bat_sr_chart")







import plotly.graph_objects as go

# Line Chart for Batting Metrics
fig_batting_line = go.Figure()

# Add Average
fig_batting_line.add_trace(go.Scatter(
    x=batting_df['Format'],
    y=batting_df['Average'],
    mode='lines+markers',
    name='Batting Average',
    line=dict(width=3)
))

# Add Strike Rate
fig_batting_line.add_trace(go.Scatter(
    x=batting_df['Format'],
    y=batting_df['Strike Rate'],
    mode='lines+markers',
    name='Strike Rate',
    line=dict(width=3)
))

# Add Runs
fig_batting_line.add_trace(go.Scatter(
    x=batting_df['Format'],
    y=batting_df['Runs'],
    mode='lines+markers',
    name='Runs',
    line=dict(width=3)
))

# Style & layout
fig_batting_line.update_layout(
    title='Batting Metrics by Format',
    xaxis_title='Format',
    yaxis_title='Value',
    paper_bgcolor='rgba(0, 0, 0, 0.7)',
    plot_bgcolor='rgba(0, 0, 0, 0.5)',
    font=dict(color='white')
)

# Display in Streamlit
st.plotly_chart(fig_batting_line, use_container_width=True, key="batting_line")



















# ---- Bowling Visuals ----
st.subheader("Bowling Visual Insights")

# Bowling Average
# Row 1: Bowling Avg & Economy Rate
col1, col2 = st.columns(2)

with col1:
    fig_bowl_avg = px.bar(
        bowling_df,
        x='Format',
        y='Avg',
        title='Bowling Average by Format',
        text_auto=True,
        color='Format'
    )
    fig_bowl_avg.update_layout(
        paper_bgcolor='rgba(0, 0, 0, 0.7)',
        plot_bgcolor='rgba(0, 0, 0, 0.5)',
        font=dict(color='white')
    )
    st.plotly_chart(fig_bowl_avg, use_container_width=True, key="bowl_avg")

with col2:
    fig_bowl_eco = px.bar(
        bowling_df,
        x='Format',
        y='Economy',
        title='Economy Rate by Format',
        text_auto=True,
        color='Format'
    )
    fig_bowl_eco.update_layout(
        paper_bgcolor='rgba(0, 0, 0, 0.7)',
        plot_bgcolor='rgba(0, 0, 0, 0.5)',
        font=dict(color='white')
    )
    st.plotly_chart(fig_bowl_eco, use_container_width=True, key="bowl_eco")

# Row 2: Wickets & Hauls
col3, col4 = st.columns(2)

with col3:
    fig_wickets = px.bar(
        bowling_df,
        x='Format',
        y='Wickets',
        title='Wickets Taken by Format',
        text_auto=True,
        color='Format'
    )
    fig_wickets.update_layout(
        paper_bgcolor='rgba(0, 0, 0, 0.7)',
        plot_bgcolor='rgba(0, 0, 0, 0.5)',
        font=dict(color='white')
    )
    st.plotly_chart(fig_wickets, use_container_width=True, key="bowl_wkts")

with col4:
    fig_hauls = go.Figure(data=[
        go.Bar(name='5-wicket hauls', x=formats, y=bowling_df['5w']),
        go.Bar(name='10-wicket hauls', x=formats, y=bowling_df['10w'])
    ])
    fig_hauls.update_layout(
        title='5w and 10w Hauls by Format',
        barmode='group',
        paper_bgcolor='rgba(0, 0, 0, 0.7)',
        plot_bgcolor='rgba(0, 0, 0, 0.5)',
        font=dict(color='white')
    )
    st.plotly_chart(fig_hauls, use_container_width=True, key="bowl_hauls")













# Line Chart for Bowling Metrics
fig_bowling_line = go.Figure()

# Bowling Average
fig_bowling_line.add_trace(go.Scatter(
    x=bowling_df['Format'],
    y=bowling_df['Avg'],
    mode='lines+markers',
    name='Bowling Average',
    line=dict(width=3)
))

# Economy Rate
fig_bowling_line.add_trace(go.Scatter(
    x=bowling_df['Format'],
    y=bowling_df['Economy'],
    mode='lines+markers',
    name='Economy Rate',
    line=dict(width=3)
))

# Strike Rate


# Layout and style
fig_bowling_line.update_layout(
    title='Bowling Metrics by Format',
    xaxis_title='Format',
    yaxis_title='Value',
    paper_bgcolor='rgba(0, 0, 0, 0.7)',
    plot_bgcolor='rgba(0, 0, 0, 0.5)',
    font=dict(color='white')
)

# Display in Streamlit
st.plotly_chart(fig_bowling_line, use_container_width=True, key="bowling_line")