Upload 2 files

app.py

@@ -38,28 +38,24 @@ with main_app:
                     show_label=False,
                     elem_id="search-bar",
                 )
+                                    
+            leaderboard_table = gr.Dataframe(
+                value=primary_leaderboard_df[0],
+                elem_id="leaderboard-table",
+                interactive=False,
+                visible=True,
+                height=dataframe_height
+            )
 
-            with gr.Row():    
-                leaderboard_table = gr.Dataframe(
-                    value=primary_leaderboard_df[0],
-                    elem_id="leaderboard-table",
-                    interactive=False,
-                    visible=True,
-                    height=dataframe_height
-                )
-
-
-            with gr.Row():
-                gr.HTML(CLEMSCORE_TEXT)
+            gr.HTML(CLEMSCORE_TEXT)
 
             # Add a dummy leaderboard to handle search queries from the primary_leaderboard_df and not update primary_leaderboard_df
-            with gr.Row():
-                dummy_leaderboard_table = gr.Dataframe(
-                    value=primary_leaderboard_df[0],
-                    elem_id="leaderboard-table",
-                    interactive=False,
-                    visible=False
-                )
+            dummy_leaderboard_table = gr.Dataframe(
+                value=primary_leaderboard_df[0],
+                elem_id="leaderboard-table",
+                interactive=False,
+                visible=False
+            )
                 
             search_bar.submit(
                 filter_search,
@@ -114,6 +110,14 @@ with main_app:
                         elem_id="value-select-5",
                         interactive=True,
                     ) 
+                with gr.Column():
+                    mobile_view = gr.CheckboxGroup(
+                        ["Mobile View"],
+                        label ="View plot on smaller screens 📈 ",
+                        value=[],
+                        elem_id="value-select-6",
+                        interactive=True,
+                    ) 
 
             with gr.Row():
                 dummy_plot_df = gr.DataFrame(
@@ -128,35 +132,42 @@ with main_app:
 
             open_models_selection.change(
                 compare_plots,
-                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend],
+                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend, mobile_view],
                 plot_output,
                 queue=True
             )
 
             closed_models_selection.change(
                 compare_plots,
-                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend],
+                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend, mobile_view],
                 plot_output,
                 queue=True
             )
             
             show_all.change(
                 compare_plots,
-                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend],
+                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend, mobile_view],
                 plot_output,
                 queue=True
             )
 
             show_names.change(
                 compare_plots,
-                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend],
+                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend, mobile_view],
                 plot_output,
                 queue=True
             )
 
             show_legend.change(
                 compare_plots,
-                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend],
+                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend, mobile_view],
+                plot_output,
+                queue=True
+            )
+
+            mobile_view.change(
+                compare_plots,
+                [dummy_plot_df, open_models_selection, closed_models_selection, show_all, show_names, show_legend, mobile_view],
                 plot_output,
                 queue=True
             )

src/plot_utils.py

@@ -3,7 +3,7 @@ import plotly.express as px
 
 from src.assets.text_content import SHORT_NAMES
 
-def plotly_plot(df:pd.DataFrame, LIST:list, ALL:list, NAMES:list, LEGEND:list):
+def plotly_plot(df:pd.DataFrame, LIST:list, ALL:list, NAMES:list, LEGEND:list, MOBILE:list ):
     '''
     Takes in a list of models for a plotly plot
     Args:
@@ -12,6 +12,7 @@ def plotly_plot(df:pd.DataFrame, LIST:list, ALL:list, NAMES:list, LEGEND:list):
         ALL: Either [] or ["Show All Models"] - toggle view to plot all models 
         NAMES: Either [] or ["Show Names"] - toggle view to show model names on plot 
         LEGEND: Either [] or ["Show Legend"] - toggle view to show legend on plot
+        MOBILE: Either [] or ["Mobile View"] - toggle view to for smaller screens
     Returns:
         Fig: plotly figure
     '''
@@ -52,11 +53,14 @@ def plotly_plot(df:pd.DataFrame, LIST:list, ALL:list, NAMES:list, LEGEND:list):
     fig.update_xaxes(range=[-5, 105])
     fig.update_yaxes(range=[-5, 105])
 
+    if MOBILE:
+        fig.update_layout(height=600)
+
     return fig
 
 
 # ['Model', 'Clemscore', 'All(Played)', 'All(Quality Score)']
-def compare_plots(df: pd.DataFrame, LIST1: list, LIST2: list, ALL:list, NAMES:list, LEGEND: list):
+def compare_plots(df: pd.DataFrame, LIST1: list, LIST2: list, ALL:list, NAMES:list, LEGEND: list, MOBILE: list):
     '''
     Quality Score v/s % Played plot by selecting models
     Args:
@@ -66,13 +70,14 @@ def compare_plots(df: pd.DataFrame, LIST1: list, LIST2: list, ALL:list, NAMES:li
         ALL: Either [] or ["Show All Models"] - toggle view to plot all models 
         NAMES: Either [] or ["Show Names"] - toggle view to show model names on plot
         LEGEND: Either [] or ["Show Legend"] - toggle view to show legend on plot 
+        MOBILE: Either [] or ["Mobile View"] - toggle view to for smaller screens
     Returns:
         fig: The plot
     '''
 
     # Combine lists for Open source and commercial models
     LIST = LIST1 + LIST2
-    fig = plotly_plot(df, LIST, ALL, NAMES, LEGEND)
+    fig = plotly_plot(df, LIST, ALL, NAMES, LEGEND, MOBILE)
 
     return fig