* New leaderboard styling with custom table (instead of Gradio dataframe)

.gitignore

@@ -0,0 +1,176 @@
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py,cover
+.hypothesis/
+.pytest_cache/
+cover/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+db.sqlite3-journal
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+.pybuilder/
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+#   For a library or package, you might want to ignore these files since the code is
+#   intended to run in multiple environments; otherwise, check them in:
+# .python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# UV
+#   Similar to Pipfile.lock, it is generally recommended to include uv.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#uv.lock
+
+# poetry
+#   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
+#poetry.lock
+
+# pdm
+#   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
+#pdm.lock
+#   pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
+#   in version control.
+#   https://pdm.fming.dev/latest/usage/project/#working-with-version-control
+.pdm.toml
+.pdm-python
+.pdm-build/
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# Cython debug symbols
+cython_debug/
+
+# PyCharm
+#  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
+#  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
+#  and can be added to the global gitignore or merged into this file.  For a more nuclear
+#  option (not recommended) you can uncomment the following to ignore the entire idea folder.
+#.idea/
+
+# Ruff stuff:
+.ruff_cache/
+
+# PyPI configuration file
+.pypirc
+
+*.db

README.md

@@ -13,4 +13,9 @@ header: mini
 sdk_version: 5.1.0
 short_description: Vote on the latest TTS models!
 ---
-# TTS Arena
+
+# TTS Arena
+
+The codebase for TTS Arena v2.
+
+The TTS Arena is a Gradio app with several components. Please refer to the `app` directory for more information.

app/config.py

@@ -1,5 +1,10 @@
 import os
 
+RUNNING_LOCALLY = os.getenv('RUNNING_LOCALLY', '0').lower() in ('true', '1', 't')
+if RUNNING_LOCALLY:
+    print("Running locally, not syncing DB to HF dataset")
+else:
+    print("Running in HF Space, syncing DB to HF dataset")
 # NOTE: Configure models in `models.py`
 
 #########################
@@ -17,7 +22,8 @@ DB_PATH = f"/data/{DB_NAME}" if os.path.isdir("/data") else DB_NAME # If /data a
 
 ROUTER_ID = "TTS-AGI/tts-router" # You should use a router space to route TTS models to avoid exposing your API keys!
 
-SYNC_DB = True # Sync DB to HF dataset?
+SYNC_DB = not RUNNING_LOCALLY # Sync DB to HF dataset?
+
 DB_DATASET_ID = os.getenv('DATASET_ID') # HF dataset ID, can be None if not syncing
 
 SPACE_ID = os.getenv('SPACE_ID') # Don't change this! It detects if we're running in a HF Space

app/leaderboard.py

@@ -3,7 +3,7 @@ from .db import *
 from .models import *
 
 import pandas as pd
-def get_leaderboard(reveal_prelim = False, hide_battle_votes = False):
+def get_leaderboard(reveal_prelim = False, hide_battle_votes = False, sort_by_elo = False, hide_proprietary = False):
     conn = get_db()
     cursor = conn.cursor()
     
@@ -30,30 +30,243 @@ def get_leaderboard(reveal_prelim = False, hide_battle_votes = False):
     data = cursor.fetchall()
     df = pd.DataFrame(data, columns=['name', 'upvote', 'downvote'])
     df['name'] = df['name'].replace(model_names).replace('Anonymous Sparkle', 'Fish Speech v1.5')
+    
+    # Calculate total votes and win rate
     df['votes'] = df['upvote'] + df['downvote']
+    df['win_rate'] = (df['upvote'] / df['votes'] * 100).round(1)
+    
+    # Remove models with no votes
+    df = df[df['votes'] > 0]
 
     # Filter out rows with insufficient votes if not revealing preliminary results
     if not reveal_prelim:
         df = df[df['votes'] > 500]
 
-    ## ELO SCORE
-    df['score'] = 1200
+    ## Calculate ELO SCORE (kept as secondary metric)
+    df['elo'] = 1200
     for i in range(len(df)):
         for j in range(len(df)):
             if i != j:
                 try:
-                    expected_a = 1 / (1 + 10 ** ((df['score'].iloc[j] - df['score'].iloc[i]) / 400))
-                    expected_b = 1 / (1 + 10 ** ((df['score'].iloc[i] - df['score'].iloc[j]) / 400))
+                    expected_a = 1 / (1 + 10 ** ((df['elo'].iloc[j] - df['elo'].iloc[i]) / 400))
+                    expected_b = 1 / (1 + 10 ** ((df['elo'].iloc[i] - df['elo'].iloc[j]) / 400))
                     actual_a = df['upvote'].iloc[i] / df['votes'].iloc[i] if df['votes'].iloc[i] > 0 else 0.5
                     actual_b = df['upvote'].iloc[j] / df['votes'].iloc[j] if df['votes'].iloc[j] > 0 else 0.5
-                    df.iloc[i, df.columns.get_loc('score')] += 32 * (actual_a - expected_a)
-                    df.iloc[j, df.columns.get_loc('score')] += 32 * (actual_b - expected_b)
+                    df.iloc[i, df.columns.get_loc('elo')] += 32 * (actual_a - expected_a)
+                    df.iloc[j, df.columns.get_loc('elo')] += 32 * (actual_b - expected_b)
                 except Exception as e:
                     print(f"Error in ELO calculation for rows {i} and {j}: {str(e)}")
                     continue
-    df['score'] = round(df['score'])
-    ## ELO SCORE
-    df = df.sort_values(by='score', ascending=False)
+    df['elo'] = round(df['elo'])
+
+    # Sort based on user preference
+    sort_column = 'elo' if sort_by_elo else 'win_rate'
+    df = df.sort_values(by=sort_column, ascending=False)
     df['order'] = ['#' + str(i + 1) for i in range(len(df))]
-    df = df[['order', 'name', 'score', 'votes']]
-    return df
+    
+    # Select and order columns for display
+    df = df[['order', 'name', 'win_rate', 'votes', 'elo']]
+    
+    # Remove proprietary models if filter is enabled
+    if hide_proprietary:
+        df = df[~df['name'].isin(closed_source)]
+    
+    # Convert DataFrame to markdown table with CSS styling
+    markdown_table = """
+<style>
+/* Reset any Gradio table styles */
+.leaderboard-table, 
+.leaderboard-table th, 
+.leaderboard-table td {
+    border: none !important;
+    border-collapse: separate !important;
+    border-spacing: 0 !important;
+}
+
+.leaderboard-container {
+    background: var(--background-fill-primary);
+    border: 1px solid var(--border-color-primary);
+    border-radius: 12px;
+    padding: 4px;
+    margin: 10px 0;
+    width: 100%;
+    overflow-x: auto;  /* Enable horizontal scroll */
+}
+
+.leaderboard-scroll {
+    max-height: 600px;
+    overflow-y: auto;
+    border-radius: 8px;
+}
+
+.leaderboard-table {
+    width: 100%;
+    border-spacing: 0;
+    border-collapse: separate;
+    font-size: 15px;
+    line-height: 1.5;
+    table-layout: auto;  /* Allow flexible column widths */
+}
+
+.leaderboard-table th {
+    background: var(--background-fill-secondary);
+    color: var(--body-text-color);
+    font-weight: 600;
+    text-align: left;
+    padding: 12px 16px;
+    position: sticky;
+    top: 0;
+    z-index: 1;
+}
+
+.leaderboard-table th:after {
+    content: '';
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    border-bottom: 1px solid var(--border-color-primary);
+}
+
+.leaderboard-table td {
+    padding: 12px 16px;
+    color: var(--body-text-color);
+}
+
+.leaderboard-table tr td {
+    border-bottom: 1px solid var(--border-color-primary);
+}
+
+.leaderboard-table tr:last-child td {
+    border-bottom: none;
+}
+
+.leaderboard-table tr:hover td {
+    background: var(--background-fill-secondary);
+}
+
+/* Column-specific styles */
+.leaderboard-table .col-rank {
+    width: 70px;
+    min-width: 70px;  /* Prevent rank from shrinking */
+}
+
+.leaderboard-table .col-model {
+    min-width: 200px;  /* Minimum width before scrolling */
+}
+
+.leaderboard-table .col-winrate {
+    width: 100px;
+    min-width: 100px;  /* Prevent win rate from shrinking */
+}
+
+.leaderboard-table .col-votes {
+    width: 100px;
+    min-width: 100px;  /* Prevent votes from shrinking */
+}
+
+.leaderboard-table .col-arena {
+    width: 100px;
+    min-width: 100px;  /* Prevent arena score from shrinking */
+}
+
+.win-rate {
+    display: inline-block;
+    font-weight: 600;
+    padding: 4px 8px;
+    border-radius: 6px;
+    min-width: 65px;
+    text-align: center;
+}
+
+.win-rate-excellent {
+    background-color: var(--color-accent);
+    color: var(--color-accent-foreground);
+}
+
+.win-rate-good {
+    background-color: var(--color-accent-soft);
+    color: var(--body-text-color);
+}
+
+.win-rate-average {
+    background-color: var(--background-fill-secondary);
+    color: var(--body-text-color);
+    border: 1px solid var(--border-color-primary);
+}
+
+.win-rate-below {
+    background-color: var(--error-background-fill);
+    color: var(--body-text-color);
+}
+
+.model-link {
+    color: var(--body-text-color) !important;
+    text-decoration: none !important;
+    border-bottom: 1px dashed var(--border-color-primary);
+}
+
+.model-link:hover {
+    color: var(--color-accent) !important;
+    border-bottom-color: var(--color-accent) !important;
+}
+
+.proprietary-badge {
+    display: inline-block;
+    font-size: 12px;
+    padding: 2px 6px;
+    border-radius: 4px;
+    background-color: var(--background-fill-secondary);
+    color: var(--body-text-color);
+    margin-left: 6px;
+    border: 1px solid var(--border-color-primary);
+}
+</style>
+<div class="leaderboard-container">
+<div class="leaderboard-scroll">
+<table class="leaderboard-table">
+<thead>
+<tr>
+<th class="col-rank">Rank</th>
+<th class="col-model">Model</th>
+<th class="col-winrate">Win Rate</th>
+<th class="col-votes">Votes</th>
+""" + ("""<th class="col-arena">Arena Score</th>""" if sort_by_elo else "") + """
+</tr>
+</thead>
+<tbody>
+"""
+    
+    def get_win_rate_class(win_rate):
+        if win_rate >= 60:
+            return "win-rate-excellent"
+        elif win_rate >= 55:
+            return "win-rate-good"
+        elif win_rate >= 45:
+            return "win-rate-average"
+        else:
+            return "win-rate-below"
+    
+    for _, row in df.iterrows():
+        win_rate_class = get_win_rate_class(row['win_rate'])
+        win_rate_html = f'<span class="win-rate {win_rate_class}">{row["win_rate"]}%</span>'
+        
+        # Add link to model name if available and proprietary badge if closed source
+        model_name = row['name']
+        original_model_name = model_name
+        if model_name in model_links:
+            model_name = f'<a href="{model_links[model_name]}" target="_blank" class="model-link">{model_name}</a>'
+        
+        if original_model_name in closed_source:
+            model_name += '<span class="proprietary-badge">Proprietary</span>'
+        
+        markdown_table += f'''<tr>
+            <td class="col-rank">{row['order']}</td>
+            <td class="col-model">{model_name}</td>
+            <td class="col-winrate">{win_rate_html}</td>
+            <td class="col-votes">{row['votes']:,}</td>''' + (
+            f'''<td class="col-arena">{int(row['elo'])}</td>''' if sort_by_elo else ""
+        ) + "</tr>\n"
+    
+    markdown_table += "</tbody></table></div></div>"
+    return markdown_table

app/models.py

@@ -22,6 +22,36 @@ AVAILABLE_MODELS = {
     #'Fish Speech v1.4': 'fish',
 }
 
+model_links = {
+    'ElevenLabs': 'https://elevenlabs.io/',
+    'Play.HT 2.0': 'https://play.ht/',
+    'Play.HT 3.0 Mini': 'https://play.ht/',
+    'XTTSv2': 'https://huggingface.co/coqui/XTTS-v2',
+    'MeloTTS': 'https://github.com/myshell-ai/MeloTTS',
+    'StyleTTS 2': 'https://github.com/yl4579/StyleTTS2',
+    'Parler TTS Large': 'https://github.com/huggingface/parler-tts',
+    'Parler TTS': 'https://github.com/huggingface/parler-tts',
+    'Fish Speech v1.5': 'https://github.com/fishaudio/fish-speech',
+    'Fish Speech v1.4': 'https://github.com/fishaudio/fish-speech',
+    'GPT-SoVITS': 'https://github.com/RVC-Boss/GPT-SoVITS',
+    'WhisperSpeech': 'https://github.com/WhisperSpeech/WhisperSpeech',
+    'VoiceCraft 2.0': 'https://github.com/jasonppy/VoiceCraft',
+    'PlayDialog': 'https://play.ht/',
+    'Kokoro v0.19': 'https://huggingface.co/hexgrad/Kokoro-82M',
+    'CosyVoice 2.0': 'https://github.com/FunAudioLLM/CosyVoice',
+    'MetaVoice': 'https://github.com/metavoiceio/metavoice-src',
+    'OpenVoice': 'https://github.com/myshell-ai/OpenVoice',
+    'OpenVoice V2': 'https://github.com/myshell-ai/OpenVoice',
+    'Pheme': 'https://github.com/PolyAI-LDN/pheme',
+    'Vokan TTS': 'https://huggingface.co/ShoukanLabs/Vokan',
+}
+
+closed_source = [
+    'ElevenLabs',
+    'Play.HT 2.0',
+    'Play.HT 3.0 Mini',
+    'PlayDialog',
+]
 
 # Model name mapping, can include models that users cannot vote on
 model_names = {

app/ui.py

@@ -9,7 +9,32 @@ from .ui_leaderboard import *
 with gr.Blocks() as about:
     gr.Markdown(ABOUT)
 
-with gr.Blocks(css="footer {visibility: hidden}textbox{resize:none}", title="TTS Arena") as app:
+CSS = """
+footer {visibility: hidden}
+textbox {resize: none}
+
+/* Custom scrollbar styles */
+::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+}
+
+::-webkit-scrollbar-track {
+    background: var(--background-fill-primary);
+    border-radius: 4px;
+}
+
+::-webkit-scrollbar-thumb {
+    background: var(--border-color-primary);
+    border-radius: 4px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: var(--body-text-color);
+}
+"""
+
+with gr.Blocks(css=CSS, theme=gr.themes.Default(font=[gr.themes.GoogleFont("Geist"), "sans-serif"]), title="TTS Arena") as app:
     gr.Markdown(DESCR)
     gr.TabbedInterface([vote, battle, leaderboard, about], ['Vote', 'Battle', 'Leaderboard', 'About'])
     if CITATION_TEXT:

app/ui_leaderboard.py

@@ -5,13 +5,51 @@ from .messages import *
 
 with gr.Blocks() as leaderboard:
     gr.Markdown(LDESC)
-    df = gr.Dataframe(interactive=False, min_width=0, wrap=True, column_widths=[30, 200, 50, 50])
+    table = gr.HTML()  # Changed to HTML to support custom CSS
     reloadbtn = gr.Button("Refresh")
     with gr.Row():
-        reveal_prelim = gr.Checkbox(label="Reveal preliminary results", info="Show all models, including models with very few human ratings.", scale=1)
-        hide_battle_votes = gr.Checkbox(label="Hide Battle Mode votes", info="Exclude votes obtained through Battle Mode.", scale=1)
-    reveal_prelim.input(get_leaderboard, inputs=[reveal_prelim, hide_battle_votes], outputs=[df])
-    hide_battle_votes.input(get_leaderboard, inputs=[reveal_prelim, hide_battle_votes], outputs=[df])
-    leaderboard.load(get_leaderboard, inputs=[reveal_prelim, hide_battle_votes], outputs=[df])
-    reloadbtn.click(get_leaderboard, inputs=[reveal_prelim, hide_battle_votes], outputs=[df])
+        with gr.Column(scale=1):
+            reveal_prelim = gr.Checkbox(
+                label="Reveal preliminary results",
+                info="Show all models, including models with very few human ratings.",
+            )
+        with gr.Column(scale=1):
+            hide_battle_votes = gr.Checkbox(
+                label="Hide Battle Mode votes",
+                info="Exclude votes obtained through Battle Mode.",
+            )
+        with gr.Column(scale=1):
+            sort_by_elo = gr.Checkbox(
+                label="Sort by Arena Score",
+                info="Sort models by Arena Score instead of win rate",
+                value=False,
+            )
+        with gr.Column(scale=1):
+            hide_proprietary = gr.Checkbox(
+                label="Hide proprietary models",
+                info="Show only open models",
+                value=False,
+            )
+
+    def update_leaderboard(*args):
+        return get_leaderboard(*args)
+
+    reveal_prelim.input(update_leaderboard, 
+                       inputs=[reveal_prelim, hide_battle_votes, sort_by_elo, hide_proprietary], 
+                       outputs=[table])
+    hide_battle_votes.input(update_leaderboard, 
+                           inputs=[reveal_prelim, hide_battle_votes, sort_by_elo, hide_proprietary], 
+                           outputs=[table])
+    sort_by_elo.input(update_leaderboard, 
+                      inputs=[reveal_prelim, hide_battle_votes, sort_by_elo, hide_proprietary], 
+                      outputs=[table])
+    hide_proprietary.input(update_leaderboard, 
+                          inputs=[reveal_prelim, hide_battle_votes, sort_by_elo, hide_proprietary], 
+                          outputs=[table])
+    leaderboard.load(update_leaderboard, 
+                    inputs=[reveal_prelim, hide_battle_votes, sort_by_elo, hide_proprietary], 
+                    outputs=[table])
+    reloadbtn.click(update_leaderboard, 
+                    inputs=[reveal_prelim, hide_battle_votes, sort_by_elo, hide_proprietary], 
+                    outputs=[table])
     # gr.Markdown("DISCLAIMER: The licenses listed may not be accurate or up to date, you are responsible for checking the licenses before using the models. Also note that some models may have additional usage restrictions.")