Update pages/2player_comparison.py

pages/2player_comparison.py

@@ -1,133 +1,185 @@
 import streamlit as st
 import pandas as pd
-import pickle
-import matplotlib.pyplot as plt
-import seaborn as sns
 import numpy as np
-
-# Load model and encoder
+import pickle
+import plotly.express as px
+from PIL import Image
+
+# ========== Custom CSS Styling ==========
+st.markdown("""
+<style>
+.stApp {
+    background-color: #f0f4f8;  /* Light clean background */
+}
+.title {
+    text-align: center;
+    color: #222222;
+    font-size: 40px;
+    font-family: 'Times New Roman';
+    font-weight: bold;
+}
+.header {
+    font-size: 32px;
+    font-family: 'Times New Roman';
+    color: #1a1a1a;
+    font-style: italic;
+    font-weight: bold;
+}
+.header1 {
+    font-size: 28px;
+    font-family: 'Times New Roman';
+    color: #333333;
+    font-style: italic;
+    font-weight: bold;
+}
+.header2 {
+    font-size: 20px;
+    font-family: 'Times New Roman';
+    color: #444444;
+    font-style: italic;
+    font-weight: bold;
+}
+.content {
+    font-size: 20px;
+    font-family: 'Times New Roman';
+    line-height: 1.6;
+    color: #222222;
+}
+.example {
+    font-size: 16px;
+    font-family: 'Times New Roman';
+    font-style: italic;
+    color: #666666;
+}
+</style>
+""", unsafe_allow_html=True)
+
+# ========== Load Model and Data ==========
 @st.cache_resource
-def load_model_and_encoder():
-    with open('best_rf_pipeline.pkl', 'rb') as f:
+def load_model_and_data():
+    with open("best_rf_pipeline.pkl", "rb") as f:
         model = pickle.load(f)
-    with open('label_encoder.pkl', 'rb') as f:
+    with open("label_encoder.pkl", "rb") as f:
         encoder = pickle.load(f)
-    return model, encoder
-
-# Load player dataset
-@st.cache_data
-def load_data():
-    return pd.read_csv('Reduced_final_teams.csv')
-
-# Fuzzy match player name
-def get_matching_player(name_from_file, player_list):
-    name_lower = name_from_file.lower()
-    for player in player_list:
-        if player.lower() == name_lower:
-            return player
-    return None
-
-# Horizontal bar chart
-def plot_horizontal_bar(df, player1, player2):
-    st.subheader("📊 Stat Comparison - Horizontal Bar Chart")
-    num_cols = df.select_dtypes(include='number').columns
-    df_num = df[num_cols].T
-    df_num.columns = [player1, player2]
-    df_num = df_num.sort_values(by=player1, ascending=False).head(15)
-
-    fig, ax = plt.subplots(figsize=(10, 7))
-    df_num.plot(kind='barh', ax=ax)
-    ax.set_title(f"{player1} vs {player2} - Key Stats")
-    ax.set_xlabel("Value")
-    ax.set_ylabel("Metric")
-    ax.legend(loc="lower right")
-    st.pyplot(fig)
-
-# Pie chart comparison
-def plot_pie_charts(player1_data, player2_data, player1, player2):
-    st.subheader("🥧 Batting vs Bowling Contribution")
-    col1, col2 = st.columns(2)
-
-    for col, player_data, player_name in zip([col1, col2], [player1_data, player2_data], [player1, player2]):
-        batting_total = player_data.get('Runs_ODI', 0) + player_data.get('Runs_T20', 0) + player_data.get('Runs_Test', 0)
-        bowling_total = player_data.get('Wickets_ODI', 0) + player_data.get('Wickets_T20', 0) + player_data.get('Wickets_Test', 0)
-
-        labels = ['Batting', 'Bowling']
-        sizes = [batting_total, bowling_total]
-
-        fig, ax = plt.subplots()
-        ax.pie(sizes, labels=labels, autopct='%1.1f%%', startangle=90, colors=['#4CAF50', '#2196F3'])
-        ax.axis('equal')
-        col.pyplot(fig)
-        col.caption(f"{player_name}'s Batting vs Bowling")
-
-# Bowling metric bar chart
-def plot_bowling_comparison(df, player1, player2):
-    st.subheader("🎯 Bowling Metrics Comparison")
-
-    bowling_cols = [col for col in df.columns if 'Wickets' in col or 'Economy' in col or 'Bowling_Average' in col]
-    df_bowling = df[bowling_cols].T
-    df_bowling.columns = [player1, player2]
-    df_bowling = df_bowling.dropna().sort_values(by=player1, ascending=False)
-
-    fig, ax = plt.subplots(figsize=(10, 6))
-    df_bowling.plot(kind='bar', ax=ax)
-    ax.set_title("Bowling Stats")
-    ax.set_ylabel("Value")
-    ax.set_xticklabels(df_bowling.index, rotation=45, ha='right')
-    ax.legend(loc="upper right")
-    st.pyplot(fig)
-
-# Main app
-def main():
-    st.set_page_config(layout="wide")
-    st.title("Cricket Player Comparison Tool 🏏")
-
-    df = load_data()
-    model, encoder = load_model_and_encoder()
-    player_list = df['Player'].tolist()
-
-    # Upload images
-    col1, col2 = st.columns(2)
-    with col1:
-        img1 = st.file_uploader("Upload Image for Player 1", type=['png', 'jpg', 'jpeg'], key='img1')
-    with col2:
-        img2 = st.file_uploader("Upload Image for Player 2", type=['png', 'jpg', 'jpeg'], key='img2')
-
-    if img1 and img2:
-        name1_raw = img1.name.rsplit('.', 1)[0]
-        name2_raw = img2.name.rsplit('.', 1)[0]
-
-        player1_name = get_matching_player(name1_raw, player_list)
-        player2_name = get_matching_player(name2_raw, player_list)
-
-        if player1_name and player2_name and player1_name != player2_name:
-            player1_data = df[df['Player'].str.lower() == player1_name.lower()].squeeze()
-            player2_data = df[df['Player'].str.lower() == player2_name.lower()].squeeze()
-
-            st.success(f"Comparing **{player1_name}** vs **{player2_name}**")
-
-            col3, col4 = st.columns(2)
-            with col3:
-                st.image(img1, caption=player1_name, use_container_width=True)
-            with col4:
-                st.image(img2, caption=player2_name, use_container_width=True)
-
-            # Display comparison table
-            comparison_df = pd.DataFrame([player1_data, player2_data])
-            comparison_df.set_index('Player', inplace=True)
-            st.subheader("📋 Full Stats Table")
-            st.dataframe(comparison_df.T)
-
-            # Visualizations
-            plot_horizontal_bar(comparison_df, player1_name, player2_name)
-            plot_pie_charts(player1_data, player2_data, player1_name, player2_name)
-            plot_bowling_comparison(comparison_df, player1_name, player2_name)
-
-        else:
-            st.error("❌ Player names from image files don't match or are the same. Please check file names.")
-    else:
-        st.info("📸 Please upload two player images to continue.")
-
-if __name__ == "__main__":
-    main()
+    stats_df = pd.read_csv("Reduced_final_teams.csv")
+    return model, encoder, stats_df
+
+pipeline, label_encoder, stats_df = load_model_and_data()
+
+# ========== Plot Functions ==========
+def plot_bar_comparison(x_labels, p1_values, p2_values, p1_name, p2_name, title, y_axis_label):
+    fig = px.bar(
+        x=x_labels * 2,
+        y=p1_values + p2_values,
+        color=[p1_name] * len(x_labels) + [p2_name] * len(x_labels),
+        barmode="group",
+        labels={"x": "Format", "y": y_axis_label, "color": "Player"},
+        title=title,
+        text=p1_values + p2_values
+    )
+    fig.update_traces(textposition='outside')
+    st.plotly_chart(fig, use_container_width=True)
+
+def plot_line_comparison(x_labels, p1_values, p2_values, p1_name, p2_name, title, y_axis_label):
+    fig = px.line(
+        x=x_labels * 2,
+        y=p1_values + p2_values,
+        color=[p1_name] * len(x_labels) + [p2_name] * len(x_labels),
+        markers=True,
+        labels={"x": "Format", "y": y_axis_label, "color": "Player"},
+        title=title
+    )
+    st.plotly_chart(fig, use_container_width=True)
+
+# ========== App Layout ==========
+st.markdown("<div class='title'> Player Comparison📊 </div><br>", unsafe_allow_html=True)
+
+col_img1, col_img2 = st.columns(2)
+
+with col_img1:
+    st.markdown("<div class='header'> Upload Player Image 1 </div><br>", unsafe_allow_html=True)
+    uploaded_file1 = st.file_uploader("", type=["jpg", "png", "jpeg"], key="img1", label_visibility="collapsed")
+    if uploaded_file1 is not None:
+        display_img1 = Image.open(uploaded_file1).convert('RGB')
+        st.image(display_img1, caption="Player 1", use_container_width=True)
+
+with col_img2:
+    st.markdown("<div class='header'> Upload Player Image 2 </div><br>", unsafe_allow_html=True)
+    uploaded_file2 = st.file_uploader("", type=["jpg", "png", "jpeg"], key="img2", label_visibility="collapsed")
+    if uploaded_file2 is not None:
+        display_img2 = Image.open(uploaded_file2).convert('RGB')
+        st.image(display_img2, caption="Player 2", use_container_width=True)
+
+# ========== Predict and Compare ==========
+if uploaded_file1 and uploaded_file2:
+    gray_img1 = Image.open(uploaded_file1).convert('L').resize((50, 50))
+    gray_img2 = Image.open(uploaded_file2).convert('L').resize((50, 50))
+
+    arr1 = np.array(gray_img1).flatten().reshape(1, -1)
+    arr2 = np.array(gray_img2).flatten().reshape(1, -1)
+
+    model, encoder, stats_df = load_model_and_data()
+
+    pred1 = model.predict(arr1)[0]
+    pred2 = model.predict(arr2)[0]
+
+    player_1 = encoder.inverse_transform([pred1])[0]
+    player_2 = encoder.inverse_transform([pred2])[0]
+
+    st.success(f"Player 1: {player_1}")
+    st.success(f"Player 2: {player_2}")
+
+    p1_data = stats_df[stats_df["Player"] == player_1].iloc[0]
+    p2_data = stats_df[stats_df["Player"] == player_2].iloc[0]
+
+    colA, colB = st.columns(2)
+    with colA:
+        show_batting = st.button("Show Batting Comparison 🏏")
+    with colB:
+        show_bowling = st.button("Show Bowling Comparison 🎯")
+
+    if show_batting:
+        st.markdown(f"<div class='header'>Batting Comparison: {player_1} vs {player_2} 🏏</div><br>", unsafe_allow_html=True)
+        formats = ["Test", "ODI", "T20", "IPL"]
+
+        batting_bar_metrics = {
+            "Runs": "batting_Runs_",
+            "50s": "batting_50s_",
+            "100s": "batting_100s_"
+        }
+        for metric_name, prefix in batting_bar_metrics.items():
+            p1_vals = [p1_data.get(f"{prefix}{fmt}", 0) for fmt in formats]
+            p2_vals = [p2_data.get(f"{prefix}{fmt}", 0) for fmt in formats]
+            plot_bar_comparison(formats, p1_vals, p2_vals, player_1, player_2, f"{metric_name} by Format", metric_name)
+
+        batting_line_metrics = {
+            "Batting Average": "batting_Average_",
+            "Strike Rate": "batting_SR_"
+        }
+        for metric_name, prefix in batting_line_metrics.items():
+            p1_vals = [p1_data.get(f"{prefix}{fmt}", 0) for fmt in formats]
+            p2_vals = [p2_data.get(f"{prefix}{fmt}", 0) for fmt in formats]
+            plot_line_comparison(formats, p1_vals, p2_vals, player_1, player_2, f"{metric_name} by Format", metric_name)
+
+    if show_bowling:
+        st.markdown(f"<div class='header'>Bowling Comparison: {player_1} vs {player_2} 🎯</div><br>", unsafe_allow_html=True)
+        formats = ["Test", "ODI", "T20", "IPL"]
+
+        bowling_bar_metrics = {
+            "Wickets": "_Wickets",
+            "Maidens": "_Maidens",
+            "Economy Rate": "_Eco"
+        }
+        for metric_name, suffix in bowling_bar_metrics.items():
+            p1_vals = [p1_data.get(f"bowling_{fmt}{suffix}", 0) for fmt in formats]
+            p2_vals = [p2_data.get(f"bowling_{fmt}{suffix}", 0) for fmt in formats]
+            plot_bar_comparison(formats, p1_vals, p2_vals, player_1, player_2, f"{metric_name} by Format", metric_name)
+
+        bowling_line_metrics = {
+            "Bowling Average": "_Avg",
+            "Strike Rate": "_SR"
+        }
+        for metric_name, suffix in bowling_line_metrics.items():
+            p1_vals = [p1_data.get(f"bowling_{fmt}{suffix}", 0) for fmt in formats]
+            p2_vals = [p2_data.get(f"bowling_{fmt}{suffix}", 0) for fmt in formats]
+            plot_line_comparison(formats, p1_vals, p2_vals, player_1, player_2, f"{metric_name} by Format", metric_name)