mirror of
https://github.com/Aider-AI/aider.git
synced 2025-06-01 10:14:59 +00:00
refactor: Move JavaScript to separate files and use Jekyll includes
This commit is contained in:
Paul Gauthier (aider)
parent
2f8aa3471b
commit
1b893da07d
3 changed files with 179 additions and 183 deletions
92
aider/website/_includes/edit-leaderboard.js
Normal file
92
aider/website/_includes/edit-leaderboard.js
Normal file
|
|
@ -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();
|
||||||
|
});
|
||||||
|
});
|
||||||
85
aider/website/_includes/refactor-leaderboard.js
Normal file
85
aider/website/_includes/refactor-leaderboard.js
Normal file
|
|
@ -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();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -59,119 +59,7 @@ The model also has to successfully apply all its changes to the source file with
|
||||||
|
|
||||||
<canvas id="editChart" width="800" height="450" style="margin-top: 20px"></canvas>
|
<canvas id="editChart" width="800" height="450" style="margin-top: 20px"></canvas>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||||
<script>
|
{% include edit-leaderboard.js %}
|
||||||
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();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<script>
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
// 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();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<style>
|
<style>
|
||||||
tr.selected {
|
tr.selected {
|
||||||
color: #0056b3;
|
color: #0056b3;
|
||||||
|
|
@ -224,76 +112,7 @@ Therefore, results are available for fewer models.
|
||||||
|
|
||||||
<canvas id="refacChart" width="800" height="450" style="margin-top: 20px"></canvas>
|
<canvas id="refacChart" width="800" height="450" style="margin-top: 20px"></canvas>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||||
<script>
|
{% include refactor-leaderboard.js %}
|
||||||
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();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
|
|
||||||
## LLM code editing skill by model release date
|
## LLM code editing skill by model release date
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue