mirror of
https://github.com/direct-img/vibegif.direct-img.link.git
synced 2026-10-29 03:34:51 +00:00
404s, loaders, success, errors, empty states, confirmation, under construction, offline and more: 50 monochrome (ui), 50 colored (uicolor) and 50 with an anime girl (uianime), on /test until approved. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
24 lines
1.0 KiB
JavaScript
24 lines
1.0 KiB
JavaScript
// tear-off calendar pad, the top page flips up over the binding and away, but every page underneath is blank too
|
|
const{sin,cos,PI,min,max}=Math
|
|
export const frames=32,delay=55
|
|
const ease=u=>(u=min(1,max(0,u)),u<.5?2*u*u:1-2*(1-u)**2)
|
|
const X=128,Y=102,W=160,H=124
|
|
const flip=(c,a)=>{
|
|
const k=cos(a),y=Y+H*k*(k>0?1:.62),w=W/2*(1+.2*sin(a)),y0=k>0?Y-20:Y
|
|
c.fillStyle=k>0?'#fff':'#ddd'
|
|
c.beginPath();c.moveTo(X-W/2,y0);c.lineTo(X-w,y);c.lineTo(X+w,y);c.lineTo(X+W/2,y0);c.closePath();c.fill();c.stroke()
|
|
c.fillStyle='#fff'
|
|
}
|
|
export default(c,t)=>{
|
|
const a=1.5*PI*ease((t*2%1)/.78)
|
|
if(a>PI)flip(c,a)
|
|
c.beginPath();c.rect(X-W/2+5,Y-10,W-10,H+20);c.fill();c.stroke()
|
|
c.beginPath();c.rect(X-W/2,Y-20,W,H+20);c.fill();c.stroke()
|
|
if(a<PI/2)flip(c,a)
|
|
for(const d of[-1,1])c.beginPath(),c.roundRect(X+d*44-9,34,18,40,9),c.fill(),c.stroke()
|
|
c.beginPath();c.roundRect(X-W/2-12,58,W+24,50,14);c.fill();c.stroke()
|
|
c.fillStyle='#111';for(const d of[-1,1])c.beginPath(),c.arc(X+d*44,72,6,0,7),c.fill()
|
|
c.fillStyle='#fff'
|
|
if(a>=PI/2&&a<=PI)flip(c,a)
|
|
}
|