Upload 10 files

app.py

@@ -20,6 +20,53 @@ def encode_image_to_base64(image_path):
             return f"data:{mime_type};base64,{encoded}"
     return ""
 
+def generate_table_html():
+    """Generate table HTML from data"""
+    models = [
+        {"name": "gpt-5", "overall_score": 0.749, "valid_tool_name_rate": 100.0, "schema_compliance": 99.3, "execution_success": 99.1, "task_fulfillment": 0.677, "information_grounding": 0.828, "tool_appropriateness": 0.767, "parameter_accuracy": 0.749, "dependency_awareness": 0.649, "parallelism_efficiency": 0.339},
+        {"name": "o3", "overall_score": 0.715, "valid_tool_name_rate": 99.3, "schema_compliance": 99.9, "execution_success": 97.1, "task_fulfillment": 0.641, "information_grounding": 0.706, "tool_appropriateness": 0.724, "parameter_accuracy": 0.726, "dependency_awareness": 0.592, "parallelism_efficiency": 0.359},
+        {"name": "gpt-oss-120b", "overall_score": 0.692, "valid_tool_name_rate": 97.7, "schema_compliance": 98.8, "execution_success": 94.0, "task_fulfillment": 0.636, "information_grounding": 0.705, "tool_appropriateness": 0.691, "parameter_accuracy": 0.661, "dependency_awareness": 0.576, "parallelism_efficiency": 0.329},
+        {"name": "gemini-2.5-pro", "overall_score": 0.690, "valid_tool_name_rate": 99.4, "schema_compliance": 99.6, "execution_success": 96.9, "task_fulfillment": 0.562, "information_grounding": 0.725, "tool_appropriateness": 0.717, "parameter_accuracy": 0.670, "dependency_awareness": 0.541, "parallelism_efficiency": 0.329},
+        {"name": "claude-sonnet-4", "overall_score": 0.681, "valid_tool_name_rate": 100.0, "schema_compliance": 99.8, "execution_success": 98.8, "task_fulfillment": 0.554, "information_grounding": 0.676, "tool_appropriateness": 0.689, "parameter_accuracy": 0.671, "dependency_awareness": 0.541, "parallelism_efficiency": 0.328},
+        {"name": "qwen3-235b-a22b-2507", "overall_score": 0.678, "valid_tool_name_rate": 99.1, "schema_compliance": 99.3, "execution_success": 94.8, "task_fulfillment": 0.549, "information_grounding": 0.625, "tool_appropriateness": 0.688, "parameter_accuracy": 0.712, "dependency_awareness": 0.542, "parallelism_efficiency": 0.355},
+        {"name": "glm-4.5", "overall_score": 0.668, "valid_tool_name_rate": 99.7, "schema_compliance": 99.7, "execution_success": 97.4, "task_fulfillment": 0.525, "information_grounding": 0.682, "tool_appropriateness": 0.680, "parameter_accuracy": 0.661, "dependency_awareness": 0.523, "parallelism_efficiency": 0.297},
+        {"name": "gpt-oss-20b", "overall_score": 0.654, "valid_tool_name_rate": 98.8, "schema_compliance": 99.1, "execution_success": 93.6, "task_fulfillment": 0.547, "information_grounding": 0.623, "tool_appropriateness": 0.661, "parameter_accuracy": 0.638, "dependency_awareness": 0.509, "parallelism_efficiency": 0.309},
+        {"name": "kimi-k2", "overall_score": 0.629, "valid_tool_name_rate": 98.8, "schema_compliance": 98.1, "execution_success": 94.5, "task_fulfillment": 0.502, "information_grounding": 0.577, "tool_appropriateness": 0.631, "parameter_accuracy": 0.623, "dependency_awareness": 0.448, "parallelism_efficiency": 0.307},
+        {"name": "qwen3-30b-a3b-instruct-2507", "overall_score": 0.627, "valid_tool_name_rate": 99.2, "schema_compliance": 95.4, "execution_success": 94.4, "task_fulfillment": 0.459, "information_grounding": 0.536, "tool_appropriateness": 0.658, "parameter_accuracy": 0.646, "dependency_awareness": 0.471, "parallelism_efficiency": 0.318},
+        {"name": "gemini-2.5-flash-lite", "overall_score": 0.598, "valid_tool_name_rate": 98.7, "schema_compliance": 98.8, "execution_success": 91.1, "task_fulfillment": 0.446, "information_grounding": 0.569, "tool_appropriateness": 0.629, "parameter_accuracy": 0.564, "dependency_awareness": 0.423, "parallelism_efficiency": 0.262},
+        {"name": "gpt-4o", "overall_score": 0.595, "valid_tool_name_rate": 96.7, "schema_compliance": 87.6, "execution_success": 85.3, "task_fulfillment": 0.477, "information_grounding": 0.519, "tool_appropriateness": 0.588, "parameter_accuracy": 0.551, "dependency_awareness": 0.423, "parallelism_efficiency": 0.253},
+        {"name": "gemma-3-27b-it", "overall_score": 0.582, "valid_tool_name_rate": 98.4, "schema_compliance": 81.6, "execution_success": 85.5, "task_fulfillment": 0.396, "information_grounding": 0.495, "tool_appropriateness": 0.588, "parameter_accuracy": 0.530, "dependency_awareness": 0.408, "parallelism_efficiency": 0.251},
+        {"name": "llama-3-3-70b-instruct", "overall_score": 0.558, "valid_tool_name_rate": 99.5, "schema_compliance": 93.1, "execution_success": 91.5, "task_fulfillment": 0.366, "information_grounding": 0.476, "tool_appropriateness": 0.554, "parameter_accuracy": 0.486, "dependency_awareness": 0.359, "parallelism_efficiency": 0.244},
+        {"name": "gpt-4o-mini", "overall_score": 0.557, "valid_tool_name_rate": 95.5, "schema_compliance": 86.5, "execution_success": 84.0, "task_fulfillment": 0.426, "information_grounding": 0.453, "tool_appropriateness": 0.556, "parameter_accuracy": 0.499, "dependency_awareness": 0.359, "parallelism_efficiency": 0.230},
+        {"name": "mistral-small-2503", "overall_score": 0.530, "valid_tool_name_rate": 92.0, "schema_compliance": 95.6, "execution_success": 87.2, "task_fulfillment": 0.344, "information_grounding": 0.438, "tool_appropriateness": 0.528, "parameter_accuracy": 0.462, "dependency_awareness": 0.345, "parallelism_efficiency": 0.220},
+        {"name": "llama-3-1-70b-instruct", "overall_score": 0.510, "valid_tool_name_rate": 99.2, "schema_compliance": 90.5, "execution_success": 92.5, "task_fulfillment": 0.314, "information_grounding": 0.432, "tool_appropriateness": 0.523, "parameter_accuracy": 0.433, "dependency_awareness": 0.303, "parallelism_efficiency": 0.190},
+        {"name": "nova-micro-v1", "overall_score": 0.508, "valid_tool_name_rate": 96.0, "schema_compliance": 93.1, "execution_success": 87.8, "task_fulfillment": 0.339, "information_grounding": 0.419, "tool_appropriateness": 0.504, "parameter_accuracy": 0.428, "dependency_awareness": 0.315, "parallelism_efficiency": 0.212},
+        {"name": "llama-3-2-90b-vision-instruct", "overall_score": 0.495, "valid_tool_name_rate": 99.6, "schema_compliance": 85.0, "execution_success": 90.9, "task_fulfillment": 0.293, "information_grounding": 0.444, "tool_appropriateness": 0.515, "parameter_accuracy": 0.427, "dependency_awareness": 0.267, "parallelism_efficiency": 0.173},
+        {"name": "llama-3-1-8b-instruct", "overall_score": 0.428, "valid_tool_name_rate": 96.1, "schema_compliance": 89.4, "execution_success": 90.9, "task_fulfillment": 0.261, "information_grounding": 0.295, "tool_appropriateness": 0.352, "parameter_accuracy": 0.310, "dependency_awareness": 0.221, "parallelism_efficiency": 0.141}
+    ]
+    
+    # Sort by overall score descending
+    models.sort(key=lambda x: x['overall_score'], reverse=True)
+    
+    rows = []
+    for model in models:
+        row = f'''<tr>
+            <td class="model-col"><span class="model-name">{model['name']}</span></td>
+            <td class="score-col"><span class="score">{model['overall_score']:.3f}</span></td>
+            <td class="metric-col">{model['valid_tool_name_rate']:.1f}%</td>
+            <td class="metric-col">{model['schema_compliance']:.1f}%</td>
+            <td class="metric-col">{model['execution_success']:.1f}%</td>
+            <td class="metric-col">{model['task_fulfillment']:.3f}</td>
+            <td class="metric-col">{model['information_grounding']:.3f}</td>
+            <td class="metric-col">{model['tool_appropriateness']:.3f}</td>
+            <td class="metric-col">{model['parameter_accuracy']:.3f}</td>
+            <td class="metric-col">{model['dependency_awareness']:.3f}</td>
+            <td class="metric-col">{model['parallelism_efficiency']:.3f}</td>
+        </tr>'''
+        rows.append(row)
+    
+    return '\n'.join(rows)
+
 def create_gradio_app():
     """
     Gradio app to serve the static HTML leaderboard with embedded images
@@ -34,10 +81,6 @@ def create_gradio_app():
     with open('style.css', 'r', encoding='utf-8') as f:
         css_content = f.read()
     
-    # Read the JavaScript content
-    with open('script.js', 'r', encoding='utf-8') as f:
-        js_content = f.read()
-    
     # Convert images to base64 for embedding
     diagram_b64 = encode_image_to_base64('mcp-bench.png')
     ranking_b64 = encode_image_to_base64('ranking.png')
@@ -51,20 +94,58 @@ def create_gradio_app():
         f'src="{ranking_b64}"'
     )
     
-    # Combine everything into a single HTML page
+    # Generate static table HTML
+    table_html = generate_table_html()
+    
+    # Replace the empty tbody with pre-generated content
     combined_html = html_content.replace(
+        '<tbody id="tableBody">\n                    <!-- Table rows will be generated by JavaScript -->\n                </tbody>',
+        f'<tbody id="tableBody">{table_html}</tbody>'
+    ).replace(
         '<link rel="stylesheet" href="style.css">',
         f'<style>{css_content}</style>'
-    ).replace(
-        '<script src="script.js"></script>',
-        f'<script>if(document.readyState === "loading") {{ document.addEventListener("DOMContentLoaded", () => {{ {js_content} }}); }} else {{ {js_content} }}</script>'
     )
     
+    # The HTML already has the minimal JavaScript for citation copy and date update
+    
     # Create the Gradio interface
     with gr.Blocks(
         title="MCP-Bench Leaderboard",
         theme=gr.themes.Soft(),
-        css="body { margin: 0; padding: 0; }"
+        css="""
+        .gradio-container { padding: 0 !important; }
+        #leaderboard-container { 
+            width: 100% !important; 
+            max-width: none !important;
+            margin: 0 !important;
+            padding: 0 !important;
+        }
+        #leaderboard-container * { 
+            box-sizing: border-box; 
+        }
+        /* Force button text to be white and remove underlines */
+        #leaderboard-container .paper-link {
+            color: white !important;
+            background-color: #4285F4 !important;
+            text-decoration: none !important;
+        }
+        #leaderboard-container .paper-link:hover,
+        #leaderboard-container .paper-link:focus,
+        #leaderboard-container .paper-link:visited,
+        #leaderboard-container .paper-link:active {
+            color: white !important;
+            background-color: #3367D6 !important;
+            text-decoration: none !important;
+        }
+        /* Fix font issues for authors */
+        #leaderboard-container .paper-authors {
+            font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+        }
+        /* Remove any underlines from links globally */
+        #leaderboard-container a {
+            text-decoration: none !important;
+        }
+        """
     ) as demo:
         gr.HTML(
             combined_html,

index.html

@@ -48,78 +48,42 @@
         <section class="leaderboard-section" id="leaderboard">
             <h2 class="section-title">Detailed Results</h2>
 
-        <div class="controls">
-            <div class="search-container">
-                <i class="fas fa-search"></i>
-                <input type="text" id="searchInput" placeholder="Search models..." class="search-input">
-            </div>
-            
-            <div class="filter-container">
-                <label for="sortSelect">Sort by:</label>
-                <select id="sortSelect" class="sort-select">
-                    <option value="overall_score">Overall Score</option>
-                    <option value="valid_tool_schema">Valid Tool Schema</option>
-                    <option value="compliance">Compliance</option>
-                    <option value="task_success">Task Success</option>
-                    <option value="schema_understanding">Schema Understanding</option>
-                    <option value="task_completion">Task Completion</option>
-                    <option value="tool_usage">Tool Usage</option>
-                    <option value="planning_effectiveness">Planning Effectiveness</option>
-                </select>
-                
-                <button id="sortOrder" class="sort-btn" title="Toggle sort order">
-                    <i class="fas fa-sort-amount-down"></i>
-                </button>
-            </div>
-        </div>
-
         <div class="table-container">
             <table class="leaderboard-table" id="leaderboardTable">
                 <thead>
                     <tr>
-                        <th class="model-col sortable" data-column="name">
+                        <th class="model-col">
                             <strong>Model</strong>
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="score-col sortable" data-column="overall_score">
+                        <th class="score-col">
                             <strong>Overall Score</strong>
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="valid_tool_name_rate">
+                        <th class="metric-col">
                             Valid Tool<br>Name Rate
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="schema_compliance">
+                        <th class="metric-col">
                             Schema<br>Compliance
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="execution_success">
+                        <th class="metric-col">
                             Execution<br>Success
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="task_fulfillment">
+                        <th class="metric-col">
                             Task<br>Fulfillment
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="information_grounding">
+                        <th class="metric-col">
                             Information<br>Grounding
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="tool_appropriateness">
+                        <th class="metric-col">
                             Tool<br>Appropriateness
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="parameter_accuracy">
+                        <th class="metric-col">
                             Parameter<br>Accuracy
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="dependency_awareness">
+                        <th class="metric-col">
                             Dependency<br>Awareness
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
-                        <th class="metric-col sortable" data-column="parallelism_efficiency">
+                        <th class="metric-col">
                             Parallelism<br>and Efficiency
-                            <i class="fas fa-sort sort-icon"></i>
                         </th>
                     </tr>
                 </thead>
@@ -129,10 +93,6 @@
             </table>
         </div>
 
-        <div class="loading" id="loading">
-            <i class="fas fa-spinner fa-spin"></i>
-            Loading leaderboard data...
-        </div>
 
         </section>
 
@@ -158,6 +118,30 @@
         </footer>
     </div>
 
-    <script src="script.js"></script>
+    <script>
+        // Copy citation function
+        function copyCitation() {
+            const citationText = document.querySelector('.citation-text').textContent;
+            navigator.clipboard.writeText(citationText).then(() => {
+                const button = document.querySelector('.copy-citation-btn');
+                const originalText = button.innerHTML;
+                button.innerHTML = '<i class="fas fa-check"></i> Copied!';
+                button.style.backgroundColor = '#4caf50';
+                
+                setTimeout(() => {
+                    button.innerHTML = originalText;
+                    button.style.backgroundColor = '';
+                }, 2000);
+            });
+        }
+        
+        // Update last updated date
+        document.addEventListener('DOMContentLoaded', function() {
+            const lastUpdated = document.getElementById('lastUpdated');
+            if (lastUpdated) {
+                lastUpdated.textContent = 'December 2024';
+            }
+        });
+    </script>
 </body>
 </html>

script.js

@@ -275,10 +275,12 @@ class LeaderboardApp {
 
     async init() {
         try {
+            console.log('Starting LeaderboardApp initialization...');
             this.loadData();
             this.setupEventListeners();
             this.renderTable();
             this.updateLastUpdated();
+            console.log('LeaderboardApp initialization complete');
         } catch (error) {
             console.error('Failed to initialize app:', error);
             this.showError('Failed to load leaderboard data');
@@ -287,14 +289,24 @@ class LeaderboardApp {
 
     loadData() {
         const loading = document.getElementById('loading');
-        loading.classList.add('active');
+        if (loading) {
+            loading.classList.add('active');
+        }
         
         try {
+            console.log('Loading LEADERBOARD_DATA...');
             this.data = LEADERBOARD_DATA;
+            console.log('Data loaded, models count:', this.data.models ? this.data.models.length : 0);
             this.filteredData = [...this.data.models];
+            console.log('Filtered data initialized with', this.filteredData.length, 'models');
             this.sortData();
+            console.log('Data sorted');
+        } catch (error) {
+            console.error('Error loading data:', error);
         } finally {
-            loading.classList.remove('active');
+            if (loading) {
+                loading.classList.remove('active');
+            }
         }
     }
 
@@ -383,10 +395,16 @@ class LeaderboardApp {
     renderTable() {
         const tableBody = document.getElementById('tableBody');
         
-        if (this.filteredData.length === 0) {
+        if (!tableBody) {
+            console.error('tableBody element not found!');
+            return;
+        }
+        
+        if (!this.filteredData || this.filteredData.length === 0) {
+            console.log('No filtered data to display');
             tableBody.innerHTML = `
                 <tr>
-                    <td colspan="9" class="no-results">
+                    <td colspan="11" class="no-results">
                         <i class="fas fa-search"></i>
                         No models found matching your search criteria
                     </td>
@@ -395,6 +413,7 @@ class LeaderboardApp {
             return;
         }
 
+        console.log(`Rendering ${this.filteredData.length} models`);
         tableBody.innerHTML = this.filteredData
             .map((model) => this.createTableRow(model))
             .join('');

style.css

@@ -100,7 +100,7 @@ body {
     padding: 10px 20px;
     background-color: var(--primary-color);
     color: white;
-    text-decoration: none;
+    text-decoration: none !important;
     border-radius: var(--border-radius);
     font-weight: 500;
     transition: all 0.3s ease;
@@ -112,25 +112,15 @@ body {
     transform: translateY(-2px);
     box-shadow: var(--shadow-md);
     color: white;
-    text-decoration: none;
+    text-decoration: none !important;
 }
 
-/* Specific colors for different links */
-.paper-link[href*="github"] {
-    background-color: #333333;
+.paper-link:focus,
+.paper-link:visited,
+.paper-link:active {
+    text-decoration: none !important;
 }
 
-.paper-link[href*="github"]:hover {
-    background-color: #555555;
-}
-
-.paper-link[href*="arxiv"] {
-    background-color: #b31b1b;
-}
-
-.paper-link[href*="arxiv"]:hover {
-    background-color: #d41e1e;
-}
 
 .diagram-section {
     text-align: center;