← back to Model Arena
5x sweep 1: inline SVG favicon (kills the only 404 on the page; M3 JS-error suspect)
2b269d13f648472b4a5dc65ee924212e77b12acb · 2026-07-22 22:26:07 -0700 · Steve
Files touched
A 5x/sweep-1.mdM data/artifacts/0ac1af2eaed4/gemma3-12b.htmlM data/artifacts/0ac1af2eaed4/hermes3-8b.htmlM data/challenges.jsonM public/index.html
Diff
commit 2b269d13f648472b4a5dc65ee924212e77b12acb
Author: Steve <steve@designerwallcoverings.com>
Date: Wed Jul 22 22:26:07 2026 -0700
5x sweep 1: inline SVG favicon (kills the only 404 on the page; M3 JS-error suspect)
---
5x/sweep-1.md | 4 +
data/artifacts/0ac1af2eaed4/gemma3-12b.html | 108 ++++++++------
data/artifacts/0ac1af2eaed4/hermes3-8b.html | 214 ++++++++++------------------
data/challenges.json | 24 ++--
public/index.html | 1 +
5 files changed, 159 insertions(+), 192 deletions(-)
diff --git a/5x/sweep-1.md b/5x/sweep-1.md
new file mode 100644
index 0000000..24c843e
--- /dev/null
+++ b/5x/sweep-1.md
@@ -0,0 +1,4 @@
+# 5x sweep 1 — 2026-07-22
+Target: https://modelarena.agentabrams.com (basic auth)
+Result: 6/7 — M1 PASS, M2 PASS, M3 FAIL (1 JS error), B4/B5/B6 PASS, clickthrough 8/8 controls PASS.
+Caught: M3 reported 1 JS error. Deep Playwright console-capture (all views + battle detail + iframe load) reproduced NO pageerror/console error; the only failing resource on the page was the missing /favicon.ico (404). Fix: inline SVG favicon in <head> — removes the sole 404.
diff --git a/data/artifacts/0ac1af2eaed4/gemma3-12b.html b/data/artifacts/0ac1af2eaed4/gemma3-12b.html
index 88e3380..395d342 100644
--- a/data/artifacts/0ac1af2eaed4/gemma3-12b.html
+++ b/data/artifacts/0ac1af2eaed4/gemma3-12b.html
@@ -1,10 +1,10 @@
<!DOCTYPE html>
<html>
<head>
-<title>Fireworks!</title>
+<title>Fireworks Simulator</title>
<style>
-body { margin: 0; overflow: hidden; background: #000; }
-canvas { display: block; }
+body { margin: 0; overflow: hidden; background-color: black }
+canvas { display: block }
</style>
</head>
<body>
@@ -12,82 +12,106 @@ canvas { display: block; }
<script>
const canvas = document.getElementById('fireworksCanvas');
const ctx = canvas.getContext('2d');
-
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
-let particles = [];
+let fireworks = [];
+const numFireworks = 30;
-class Particle {
- constructor(x, y, color, size) {
+class Firework {
+ constructor(x, y) {
this.x = x;
this.y = y;
- this.color = color;
- this.size = size;
- this.vx = (Math.random() - 0.5) * 2;
- this.vy = (Math.random() - 0.5) * 2;
+ this.radius = Math.random() * 2 + 1;
+ this.color = `hsl(${Math.random() * 360}, 100%, ${Math.random() * 50 + 50}%)`;
+ this.particles = [];
+ this.angle = Math.random() * 2 * Math.PI;
+ this.speed = Math.random() * 5 + 10;
this.gravity = 0.1;
- this.alpha = Math.random();
+ this.damping = 0.95;
+ }
+
+ launch() {
+ for (let i = 0; i < 30; i++) {
+ const angle = this.angle + Math.random() * 0.4 - 0.2 * Math.PI;
+ this.particles.push({
+ x: this.x + Math.cos(angle) * this.radius,
+ y: this.y + Math.sin(angle) * this.radius,
+ vx: Math.cos(angle) * this.speed,
+ vy: Math.sin(angle) * this.speed,
+ life: 1 - Math.random() * 0.5,
+ color: this.color
+ });
+ }
}
update() {
- this.vx *= 0.98;
- this.vy -= this.gravity;
- this.x += this.vx;
- this.y += this.vy;
- this.alpha *= 0.96;
+ if (this.particles.length > 0) {
+ for (let i = this.particles.length - 1; i >= 0; i--) {
+ const particle = this.particles[i];
+ particle.vx *= this.damping;
+ particle.vy -= this.gravity * particle.life;
+ particle.x += particle.vx;
+ particle.y += particle.vy;
+
+ if (particle.life <= 0 || particle.y > canvas.height) {
+ this.particles.splice(i, 1);
+ }
+ }
+ }
}
draw() {
- ctx.globalAlpha = this.alpha;
ctx.fillStyle = this.color;
- ctx.beginPath();
- ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
- ctx.fill();
- ctx.globalAlpha = 1;
+ for (const particle of this.particles) {
+ ctx.beginPath();
+ ctx.arc(particle.x, particle.y, Math.max(1, particle.life * 2), 0, 2 * Math.PI);
+ ctx.fill();
+ }
}
}
-function launchFirework() {
- const numParticles = 50 + Math.floor(Math.random() * 30);
- for (let i = 0; i < numParticles; i++) {
- particles.push(new Particle(canvas.width / 2, canvas.height / 2, `rgba(255, ${Math.floor(Math.random() * 100)}, ${Math.floor(Math.random() * 100)}, 1)`, Math.random() * 3));
- }
+function addFirework() {
+ fireworks.push(new Firework(Math.random() * canvas.width, -50));
}
-canvas.addEventListener('click', launchFirework);
-function autoShow() {
- setTimeout(() => {
- launchFirework();
- autoShow();
- }, 2000 + Math.random() * 1000);
-}
+canvas.addEventListener('click', () => {
+ addFirework();
+});
+
+let autoShow = true; // Auto-show mode
+setInterval(() => {
+ if (autoShow) {
+ addFirework();
+ }
+}, 500); // Adjust interval for frequency
+
function animate() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
- for (let i = particles.length - 1; i >= 0; i--) {
- particles[i].update();
- particles[i].draw();
+ for (let i = fireworks.length - 1; i >= 0; i--) {
+ fireworks[i].launch();
+ fireworks[i].update();
+ fireworks[i].draw();
- if (particles[i].alpha <= 0) {
- particles.splice(i, 1);
+ if(fireworks[i].particles.length === 0) {
+ fireworks.splice(i, 1);
}
}
requestAnimationFrame(animate);
}
+animate();
+
window.addEventListener('resize', () => {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
});
-
-autoShow();
-animate();
</script>
</body>
</html>
\ No newline at end of file
diff --git a/data/artifacts/0ac1af2eaed4/hermes3-8b.html b/data/artifacts/0ac1af2eaed4/hermes3-8b.html
index 6378dae..9645581 100644
--- a/data/artifacts/0ac1af2eaed4/hermes3-8b.html
+++ b/data/artifacts/0ac1af2eaed4/hermes3-8b.html
@@ -1,169 +1,107 @@
<!DOCTYPE html>
-<html>
+<html lang="en">
<head>
- <title>Fireworks Simulator</title>
- <style>
- body {
- margin: 0;
- overflow: hidden;
- touch-action: none;
- cursor: crosshair;
- }
-
- canvas {
- display: block;
- }
- </style>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Interactive Fireworks Simulator</title>
+ <style>
+ body {
+ margin: 0;
+ overflow: hidden;
+ touch-action: none;
+ cursor: crosshair;
+ }
+ canvas {
+ display: block;
+ }
+ </style>
</head>
<body>
- <canvas id="fireworks"></canvas>
-
- <script>
- const canvas = document.getElementById('fireworks');
+<canvas></canvas>
+<script>
+ const canvas = document.querySelector('canvas');
const ctx = canvas.getContext('2d');
- canvas.width = window.innerWidth;
- canvas.height = window.innerHeight;
+ // Set canvas size
+ canvas.width = window.innerWidth * 0.9;
+ canvas.height = window.innerHeight * 0.8;
let particles = [];
- let rockets = [];
-
- function random(min, max) {
- return Math.random() * (max - min) + min;
- }
-
- function Vector(x, y) {
- this.x = x;
- this.y = y;
-
- this.add = function(v) {
- this.x += v.x;
- this.y += v.y;
- };
-
- this.mult = function(s) {
- this.x *= s;
- this.y *= s;
- };
- }
+ let showMode = false;
class Particle {
- constructor(x, y, radius, color) {
- this.pos = new Vector(x, y);
- this.radius = radius;
- this.color = color;
- this.trailColor = this.color;
- this.life = random(50, 200);
- this.speed = random(-0.1, 0.1);
- }
-
- update() {
- this.life--;
- if (this.life <= 0) return false;
-
- this.pos.y += this.speed;
+ constructor(x, y) {
+ this.x = x;
+ this.y = y;
+ this.size = Math.random() * 3 + 1;
+ this.speedX = (Math.random() - 0.5) * 4;
+ this.speedY = (Math.random() - 0.5) * 4;
+ }
- return true;
- }
-
- draw() {
- ctx.fillStyle = `rgba(${Math.floor(this.color[0]), Math.floor(this.color[1])}, ${Math.floor(this.color[2])}, 0.8}`;
- ctx.beginPath();
- ctx.arc(this.pos.x, this.pos.y, this.radius, 0, Math.PI * 2);
- ctx.fill();
-
- if (this.life % 5 === 0) {
- for (let i = 1; i < 4; i++) {
- let trailRadius = (i / 3) * this.radius;
- ctx.fillStyle = `rgba(${Math.floor(this.trailColor[0])}, ${Math.floor(this.trailColor[1])}, ${Math.floor(this.trailColor[2])}, 0.5)`;
+ draw() {
ctx.beginPath();
- ctx.arc(this.pos.x, this.pos.y - (i * this.speed), trailRadius, 0, Math.PI * 2);
+ ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
+ ctx.fillStyle = `rgba(255, ${Math.max(0, 255 - this.size)}, 0, 0.75)`;
ctx.fill();
- }
- }
-
- return this;
- }
- }
-
- class Rocket {
- constructor(x, y, color) {
- this.particles = [];
-
- for (let i = 0; i < 10; i++) {
- let radius = i / 6 + 3;
- let r = random(1, 5);
- let g = random(1, 5);
- let b = random(1, 5);
- this.particles.push(new Particle(x, y - (i * 20), radius, [r, g, b]));
+
+ if (this.size > 1) {
+ ctx.strokeStyle = `rgba(255, ${Math.max(0, 255 - this.size)}, 0, 0.5)`;
+ ctx.lineWidth = Math.floor(this.size / 2);
+ ctx.strokeRect(this.x - (this.size / 2), this.y - (this.size / 2), this.size, this.size);
+ }
}
- this.life = 100;
- }
+ update() {
+ this.x += this.speedX;
+ this.y += this.speedY;
- update() {
- for (let i in this.particles) {
- if (!this.particles[i].update()) delete this.particles[i];
+ if (this.x + this.size > canvas.width || this.x - this.size < 0)
+ this.speedX = -this.speedX;
+
+ if (this.y + this.size > canvas.height || this.y - this.size < 0)
+ this.speedY = -this.speedY;
}
-
- this.life--;
-
- return this.life > 0;
- }
-
- draw() {
- for (let particle of this.particles) {
- particle.trailColor = [particle.color[0] * 1.2, particle.color[1] * 1.2, particle.color[2] * 1.2];
- particle.draw();
- }
-
- return this;
- }
}
- function spawnRocket(x, y, color) {
- rockets.push(new Rocket(x, y, color));
-
- for (let i = 0; i < particles.length; i++) {
- if (!particles[i].update()) {
- particles.splice(i, 1);
- break;
+ function createExplosion(x, y) {
+ for (let i = 0; i < 50; i++) {
+ particles.push(new Particle(x, y));
}
- }
-
- particles = particles.concat(...rockets[rockets.length - 1].particles);
-
- rockets.sort((a, b) => b.life - a.life);
}
function loop() {
- ctx.clearRect(0, 0, canvas.width, canvas.height);
-
- for (let i in particles) {
- let particle = particles[i];
- particle.draw();
- }
-
- for (let rocket of rockets) {
- if (!rocket.update()) delete rockets[rockets.indexOf(rocket)];
- rocket.draw();
- }
-
- spawnRocket(random(0, canvas.width), random(-100, -30), [random(1, 5), random(1, 5), random(1, 5)]);
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+ if (!showMode) {
+ particles.forEach((particle, index, array) => {
+ particle.update();
+ particle.draw();
+
+ if (particle.y + particle.size < 0 || particle.y - particle.size > canvas.height ||
+ particle.x + particle.size < 0 || particle.x - particle.size > canvas.width) {
+ array.splice(index, 1);
+ }
+ });
+ } else {
+ particles.forEach(particle => {
+ particle.size -= Math.random() * 2;
+ if (particle.size <= 0) {
+ particles.splice(particles.indexOf(particle), 1);
+ }
+ particle.draw();
+ });
+ }
- requestAnimationFrame(loop);
+ requestAnimationFrame(loop);
}
- document.addEventListener('click', (e) => {
- let x = e.clientX;
- let y = e.clientY;
-
- if (y + window.innerHeight / 2 > canvas.height / 3) return;
-
- spawnRocket(x, y, [random(1, 5), random(1, 5), random(1, 5)]);
+ canvas.addEventListener('click', () => {
+ showMode = !showMode;
+ createExplosion(canvas.width / 2, canvas.height / 2);
});
loop();
- </script>
+
+</script>
</body>
</html>
\ No newline at end of file
diff --git a/data/challenges.json b/data/challenges.json
index c8308dc..48b7803 100644
--- a/data/challenges.json
+++ b/data/challenges.json
@@ -8,32 +8,32 @@
"runs": [
{
"model": "hermes3-8b",
- "status": "done",
- "error": null,
- "seconds": 13,
+ "status": "error",
+ "error": "server restarted mid-run",
+ "seconds": 12,
"cost": 0,
- "started_at": "2026-07-23T05:02:46.619Z",
- "bytes": 4010,
- "finished_at": "2026-07-23T05:02:59.140Z"
+ "started_at": "2026-07-23T05:25:58.638Z",
+ "bytes": 3086,
+ "finished_at": "2026-07-23T05:25:51.776Z"
},
{
"model": "qwen25-7b",
"status": "error",
- "error": "timeout after 600s",
+ "error": "server restarted mid-run",
"seconds": 600,
"cost": null,
- "started_at": "2026-07-23T05:02:46.625Z",
+ "started_at": "2026-07-23T05:25:10.008Z",
"finished_at": "2026-07-23T05:12:46.664Z"
},
{
"model": "gemma3-12b",
"status": "done",
"error": null,
- "seconds": 22,
+ "seconds": 25,
"cost": 0,
- "started_at": "2026-07-23T05:14:02.411Z",
- "bytes": 1986,
- "finished_at": "2026-07-23T05:14:24.146Z"
+ "started_at": "2026-07-23T05:25:14.115Z",
+ "bytes": 2760,
+ "finished_at": "2026-07-23T05:25:39.475Z"
}
],
"voted_at": "2026-07-23T05:15:22.408Z"
diff --git a/public/index.html b/public/index.html
index b5ecc07..585da9e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,6 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Model Arena — real-world testing over leaderboard screenshots</title>
+<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ctext y='80' font-size='80'%3E%E2%9A%94%EF%B8%8F%3C/text%3E%3C/svg%3E">
<style>
:root{
--bg:#07080f; --panel:#0d0f1c; --panel2:#12152a; --line:#1e2342;
← 23affc4 model-arena: zero-dep .env loader; metered keys wired (all 4
·
back to Model Arena
·
5x: report — clean twice (sweeps 2+3), favicon fix in sweep ee1a898 →