drjones/pleiades
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Interactive background (mouse parallax + cursor glow) + OpenAPI spec + agent structured data

Browse Source
This commit is contained in:
drjones
2026-09-19 21:17:13 -07:00
parent 8502e3471a
commit 19625811d6
3 changed files with 100 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
templates/base.html
View File

@@ -6,9 +6,21 @@
<title>{% block title %}Clean Proxys{% endblock %}</title>
<meta name="description" content="Clean residential SOCKS5 & HTTP proxies. Global geo-targeting. No KYC. Bitcoin checkout. Encrypted backend. Agent-ready.">
<meta name="robots" content="index,follow">
<meta name="ai-agent" content="api: /api/v1/info, /openapi.json; purchase: POST /api/v1/proxy; auth: username+password; billing: bitcoin">
<meta property="og:title" content="Clean Proxys — residential SOCKS5 proxies">
<meta property="og:description" content="Clean, fast, geo-targeted residential proxies. No KYC. Pay with Bitcoin. Built for agents and humans alike.">
<meta property="og:type" content="website">
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebAPI",
"name": "Clean Proxys API",
"description": "Programmatic residential SOCKS5/HTTP proxy purchase. One-call provisioning, Bitcoin billing.",
"documentation": "https://clean-proxys.thetempleofdoom.com/llms.txt",
"termsOfService": "https://clean-proxys.thetempleofdoom.com/",
"provider": {"@type": "Organization", "name": "Clean Proxys"}
}
</script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet">
@@ -18,6 +30,7 @@
<body>
<canvas id="stars"></canvas>
<div class="grid-overlay"></div>
<div id="glow"></div>
<nav>
<div class="wrap inner">
@@ -43,44 +56,65 @@
<div class="wrap">
Clean Proxys — residential SOCKS5 &amp; HTTP proxies. &nbsp;·&nbsp;
<a href="https://buymeacoffee.com/r26xrthzttg" target="_blank" rel="noopener">Support the project ☕</a>
&nbsp;·&nbsp; <a href="/llms.txt">llms.txt</a>
&nbsp;·&nbsp; <a href="/llms.txt">llms.txt</a> &nbsp;·&nbsp; <a href="/openapi.json">OpenAPI</a>
</div>
</footer>
<script>
// slow, calm starfield — no fast motion
// interactive background: slow starfield + mouse parallax + cursor glow (all smooth, no fast motion)
(function(){
const c = document.getElementById('stars'), x = c.getContext('2d');
const glow = document.getElementById('glow');
let W, H, pts = [];
const raw = { x: innerWidth/2, y: innerHeight/2 }; // actual cursor
const sm = { x: innerWidth/2, y: innerHeight/2 }; // smoothed (lerp)
function resize(){
W = c.width = innerWidth; H = c.height = innerHeight;
const n = Math.min(140, Math.floor(W * H / 9000));
const n = Math.min(150, Math.floor(W * H / 8500));
pts = Array.from({length: n}, () => ({
x: Math.random()*W, y: Math.random()*H,
r: Math.random()*1.3 + .3,
vx: (Math.random()-.5)*.12, vy: (Math.random()-.5)*.12,
r: Math.random()*1.4 + .3,
vx: (Math.random()-.5)*.1, vy: (Math.random()-.5)*.1,
d: Math.random()*2 + .3, // parallax depth
a: Math.random()*.5 + .2
}));
}
resize(); addEventListener('resize', resize);
addEventListener('mousemove', e => { raw.x = e.clientX; raw.y = e.clientY; });
function tick(){
sm.x += (raw.x - sm.x) * .08; // smooth follow
sm.y += (raw.y - sm.y) * .08;
// parallax: normalized cursor -> star offset (opposite, subtle)
const nx = (sm.x / W - .5) * 2, ny = (sm.y / H - .5) * 2;
const px = nx * 28, py = ny * 28;
x.clearRect(0,0,W,H);
for (const p of pts){
p.x += p.vx; p.y += p.vy;
if (p.x<0)p.x=W; if(p.x>W)p.x=0; if(p.y<0)p.y=H; if(p.y>H)p.y=0;
x.beginPath(); x.arc(p.x,p.y,p.r,0,7);
const sx = p.x - px*p.d, sy = p.y - py*p.d;
x.beginPath(); x.arc(sx,sy,p.r,0,7);
x.fillStyle = 'rgba(180,230,255,'+p.a+')'; x.fill();
}
// faint constellation lines between near stars
for (let i=0;i<pts.length;i++){
for (let j=i+1;j<pts.length;j++){
const dx=pts[i].x-pts[j].x, dy=pts[i].y-pts[j].y, d=dx*dx+dy*dy;
if (d < 120*120){
x.beginPath(); x.moveTo(pts[i].x,pts[i].y); x.lineTo(pts[j].x,pts[j].y);
x.strokeStyle = 'rgba(0,229,255,'+(0.05*(1-d/(120*120)))+')'; x.stroke();
const dx=(pts[i].x-px*pts[i].d)-(pts[j].x-px*pts[j].d);
const dy=(pts[i].y-py*pts[i].d)-(pts[j].y-py*pts[j].d);
const d=dx*dx+dy*dy;
if (d < 130*130){
x.beginPath();
x.moveTo(pts[i].x-px*pts[i].d, pts[i].y-py*pts[i].d);
x.lineTo(pts[j].x-px*pts[j].d, pts[j].y-py*pts[j].d);
x.strokeStyle='rgba(0,229,255,'+(0.06*(1-d/(130*130)))+')'; x.stroke();
}
}
}
// cursor glow follows (smoothed)
glow.style.transform = 'translate(' + (sm.x) + 'px,' + (sm.y) + 'px)';
requestAnimationFrame(tick);
}
tick();