From 1b893da07d556a4623512a8246828d1ad404a4b0 Mon Sep 17 00:00:00 2001 From: "Paul Gauthier (aider)" Date: Thu, 21 Nov 2024 10:28:09 -0800 Subject: [PATCH] refactor: Move JavaScript to separate files and use Jekyll includes --- aider/website/_includes/edit-leaderboard.js | 92 +++++++++ .../website/_includes/refactor-leaderboard.js | 85 ++++++++ aider/website/docs/leaderboards/index.md | 185 +----------------- 3 files changed, 179 insertions(+), 183 deletions(-) create mode 100644 aider/website/_includes/edit-leaderboard.js create mode 100644 aider/website/_includes/refactor-leaderboard.js diff --git a/aider/website/_includes/edit-leaderboard.js b/aider/website/_includes/edit-leaderboard.js new file mode 100644 index 000000000..d17179f4c --- /dev/null +++ b/aider/website/_includes/edit-leaderboard.js @@ -0,0 +1,92 @@ +document.addEventListener('DOMContentLoaded', function () { + var ctx = document.getElementById('editChart').getContext('2d'); + const HIGHTLIGHT_MODEL = 'no no no no'; + var leaderboardData = { + labels: [], + datasets: [{ + label: 'Percent completed correctly', + data: [], + backgroundColor: function(context) { + const label = context.chart.data.labels[context.dataIndex] || ''; + return (label && label.includes(HIGHTLIGHT_MODEL)) ? 'rgba(255, 99, 132, 0.2)' : 'rgba(54, 162, 235, 0.2)'; + }, + borderColor: function(context) { + const label = context.chart.data.labels[context.dataIndex] || ''; + return (label && label.includes(HIGHTLIGHT_MODEL)) ? 'rgba(255, 99, 132, 1)' : 'rgba(54, 162, 235, 1)'; + }, + borderWidth: 1 + }] + }; + + var allData = []; + {% for row in edit_sorted %} + allData.push({ + model: '{{ row.model }}', + pass_rate_2: {{ row.pass_rate_2 }}, + percent_cases_well_formed: {{ row.percent_cases_well_formed }} + }); + {% endfor %} + + function updateChart() { + var selectedRows = document.querySelectorAll('tr.selected'); + var showAll = selectedRows.length === 0; + + leaderboardData.labels = []; + leaderboardData.datasets[0].data = []; + + allData.forEach(function(row, index) { + var rowElement = document.getElementById('edit-row-' + index); + if (showAll) { + rowElement.classList.remove('selected'); + } + if (showAll || rowElement.classList.contains('selected')) { + leaderboardData.labels.push(row.model); + leaderboardData.datasets[0].data.push(row.pass_rate_2); + } + }); + + leaderboardChart.update(); + } + + var tableBody = document.querySelector('table tbody'); + allData.forEach(function(row, index) { + var tr = tableBody.children[index]; + tr.id = 'edit-row-' + index; + tr.style.cursor = 'pointer'; + tr.onclick = function() { + this.classList.toggle('selected'); + updateChart(); + }; + }); + + var leaderboardChart = new Chart(ctx, { + type: 'bar', + data: leaderboardData, + options: { + scales: { + y: { + beginAtZero: true + } + } + } + }); + + updateChart(); + + // Add search functionality for edit table + document.getElementById('editSearchInput').addEventListener('keyup', function() { + var searchText = this.value.toLowerCase(); + var tableBody = document.querySelector('table:first-of-type tbody'); + var rows = tableBody.getElementsByTagName('tr'); + + for (var i = 0; i < rows.length; i++) { + var rowText = rows[i].textContent.toLowerCase(); + if (rowText.includes(searchText)) { + rows[i].style.display = ''; + } else { + rows[i].style.display = 'none'; + } + } + updateChart(); + }); +}); diff --git a/aider/website/_includes/refactor-leaderboard.js b/aider/website/_includes/refactor-leaderboard.js new file mode 100644 index 000000000..8ad4eecd6 --- /dev/null +++ b/aider/website/_includes/refactor-leaderboard.js @@ -0,0 +1,85 @@ +document.addEventListener('DOMContentLoaded', function () { + var ctx = document.getElementById('refacChart').getContext('2d'); + var leaderboardData = { + labels: [], + datasets: [{ + label: 'Percent completed correctly', + data: [], + backgroundColor: 'rgba(54, 162, 235, 0.2)', + borderColor: 'rgba(54, 162, 235, 1)', + borderWidth: 1 + }] + }; + + var allData = []; + {% for row in refac_sorted %} + allData.push({ + model: '{{ row.model }}', + pass_rate_1: {{ row.pass_rate_1 }}, + percent_cases_well_formed: {{ row.percent_cases_well_formed }} + }); + {% endfor %} + + function updateChart() { + var selectedRows = document.querySelectorAll('tr.selected'); + var showAll = selectedRows.length === 0; + + leaderboardData.labels = []; + leaderboardData.datasets[0].data = []; + + allData.forEach(function(row, index) { + var rowElement = document.getElementById('refac-row-' + index); + if (showAll) { + rowElement.classList.remove('selected'); + } + if (showAll || rowElement.classList.contains('selected')) { + leaderboardData.labels.push(row.model); + leaderboardData.datasets[0].data.push(row.pass_rate_1); + } + }); + + leaderboardChart.update(); + } + + var tableBody = document.querySelectorAll('table tbody')[1]; + allData.forEach(function(row, index) { + var tr = tableBody.children[index]; + tr.id = 'refac-row-' + index; + tr.style.cursor = 'pointer'; + tr.onclick = function() { + this.classList.toggle('selected'); + updateChart(); + }; + }); + + var leaderboardChart = new Chart(ctx, { + type: 'bar', + data: leaderboardData, + options: { + scales: { + y: { + beginAtZero: true + } + } + } + }); + + updateChart(); + + // Add search functionality for refactoring table + document.getElementById('refacSearchInput').addEventListener('keyup', function() { + var searchText = this.value.toLowerCase(); + var tableBody = document.querySelector('table:nth-of-type(2) tbody'); + var rows = tableBody.getElementsByTagName('tr'); + + for (var i = 0; i < rows.length; i++) { + var rowText = rows[i].textContent.toLowerCase(); + if (rowText.includes(searchText)) { + rows[i].style.display = ''; + } else { + rows[i].style.display = 'none'; + } + } + updateChart(); + }); +}); diff --git a/aider/website/docs/leaderboards/index.md b/aider/website/docs/leaderboards/index.md index 9c79cdac5..a0695c8f3 100644 --- a/aider/website/docs/leaderboards/index.md +++ b/aider/website/docs/leaderboards/index.md @@ -59,119 +59,7 @@ The model also has to successfully apply all its changes to the source file with - - +{% include edit-leaderboard.js %}