mirror of
https://github.com/direct-img/vibegif.direct-img.link.git
synced 2026-10-29 03:34:51 +00:00
Completes the 50 colored ones, 100 in the gallery. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
33 lines
2.0 KiB
JavaScript
33 lines
2.0 KiB
JavaScript
// umbrella twirling in the rain, colored panels sweeping round, raindrops splashing off the top
|
|
const{sin,cos,PI,asin,max}=Math,T=2*PI
|
|
export const frames=24,delay=60
|
|
const COL=['#ff6b6b','#ffd43b','#4dabf7','#ff6b6b','#ffd43b','#4dabf7'],BU='#a5d8ff'
|
|
const CX=128,TOP=46,BASE=124,RX=94
|
|
const dome=c=>{c.beginPath();c.moveTo(CX-RX,BASE);c.bezierCurveTo(CX-RX,TOP-20,CX+RX,TOP-20,CX+RX,BASE);const n=6;for(let k=0;k<n;k++){const x1=CX+RX-(k+1)*2*RX/n,xm=(CX+RX-k*2*RX/n+x1)/2;c.quadraticCurveTo(xm,BASE-14,x1,BASE)}c.closePath()}
|
|
const surf=x=>{const u=(x-CX)/RX;return BASE-(BASE-TOP+16)*(1-u*u)*.98}
|
|
export default(c,t)=>{
|
|
const rot=t*T/3
|
|
for(const[x,o]of[[60,0],[104,.4],[150,.7],[196,.2],[226,.55]]){
|
|
const p=(t*2+o)%1,ys=surf(x)-6,y=-20+p*(ys+20)*1.6
|
|
c.lineWidth=4;c.fillStyle=BU
|
|
if(y<ys){c.beginPath();c.ellipse(x,y,4,8,0,0,T);c.fill();c.stroke()}
|
|
else{const q=(y-ys)/(ys*.6+12);if(q<1)for(const d of[-1,1])c.beginPath(),c.arc(x+d*14*q,ys-16*q+20*q*q,3.5,0,T),c.fill(),c.stroke()}
|
|
}
|
|
c.lineWidth=7
|
|
for(const[w,s]of[[16,'#111'],[6,'#ced4da']])c.lineWidth=w,c.strokeStyle=s,c.beginPath(),c.moveTo(CX,BASE-10),c.lineTo(CX,206),c.arc(CX-16,206,16,0,PI),c.stroke()
|
|
c.strokeStyle='#111';c.lineWidth=7
|
|
dome(c);c.fillStyle=COL[0];c.fill()
|
|
c.save();dome(c);c.clip()
|
|
for(let k=0;k<6;k++){
|
|
const a0=((rot+k*PI/3)%T+T)%T,a1=a0+PI/3
|
|
for(const w of[0,T]){
|
|
const lo=max(a0,w),hi=Math.min(a1,w+PI);if(hi<=lo)continue
|
|
const x0=CX+RX*cos(hi-w),x1=CX+RX*cos(lo-w)
|
|
c.fillStyle=COL[k];c.beginPath();c.moveTo(CX,TOP-6);c.quadraticCurveTo(x0,TOP,x0,BASE+4);c.lineTo(x1,BASE+4);c.quadraticCurveTo(x1,TOP,CX,TOP-6);c.fill()
|
|
}
|
|
}
|
|
c.lineWidth=4;for(let k=0;k<6;k++){const a=((rot+k*PI/3)%T+T)%T;if(a>PI)continue;const x=CX+RX*cos(a);c.beginPath();c.moveTo(CX,TOP-6);c.quadraticCurveTo(x,TOP,x,BASE+4);c.stroke()}
|
|
c.restore();c.lineWidth=7;dome(c);c.stroke()
|
|
c.fillStyle='#ced4da';c.beginPath();c.roundRect(CX-4,TOP-24,8,16,4);c.fill();c.lineWidth=5;c.stroke()
|
|
}
|