وړیا د سکې اچونه او د چورلک ګرزول

دا څنګه کار کوي

ټول درې حالتونه — سکې اچول، ویل ګرځول، او انتخاب ټاکل — د براوزر جوړ شوي Web Crypto API (crypto.getRandomValues) کاروي ترڅو بریالی پایله جوړه کړي، بیا انیمیشن بشپړ کلاینټ-اړخ د CSS transforms او requestAnimationFrame سره چلوي. سرور هیڅ ځای پکې شامل نه دی.

1. 1
   Web Crypto بریالی ټاکي

   له کوم انیمیشن پیل نه مخکې، crypto.getRandomValues یو Uint32Array د یوه کریپتوګرافیک تصادفي 32-بټ عدد سره ډکوي. یو موډولو عملیه یې د اپشنونو شمېر ته نقشه کوي (2 د سرونو/لکیو لپاره، N د ویل یا ټاکونکي لپاره)، نو هر پایله دقیقاً مساوي احتمال لري.
2. 2
   چورلیدو زاویه محاسبه کیږي ترڅو پر پایله کیني

   د سکې لپاره، کوډ لنډ اضافي چورلیدل محاسبه کوي (اوسني ټول زاویې پورته) چې د سمې مخې پورته کیدو سره پای ته رسیږي — سر پر 0°، لکۍ پر 180° — بیا 5 بشپړ چورلیدونه ورزیاتوي نو یو ریښتینی الوتون ښکاري. ویل همداسې کوي: دا هغه زاویه آفسیټ مومي چې بریالی ټوټه نښه لاندې راوړي، 6 بشپړ چورلیدونه ورزیاتوي، او یو کوچنی تصادفي جیټر پلي کوي نو نښه تل د ټوټې مرکز کې ودریږي نه.
3. 3
   CSS انتقالونه او requestAnimationFrame انیمیشن چلوي

   سکه او ویل د CSS transform سره د یوه cubic-bezier اسانتیا کرو سره انیمیشن کیږي چې یوه واحد راټول شوي چورلیدل ارزښت باندې پلي کیږي — یو ځل چې زاویه ټاکل شي هیڅ فریم-پر-فریم JavaScript ته اړتیا نشته. انتخاب ټاکونکی پرځای یې requestAnimationFrame کاروي: هر فریم، یو کوادراتیک ډول لوی کیدونکی وقفه ټاکي چې آیا روښانتیا پرمخ بوځي، چې یو سلاټ-ماشین ورو کیدل جوړوي چې تل پر مخکې-ټاکل شوي بریالي ودریږي.
4. 4
   پایله ښکاره کیږي او ناسته تاریخچې ته لیکل کیږي

   یو setTimeout هڅیږي کله چې انیمیشن بشپړ شي (1.3 ثانیې د سکې لپاره، 4.3 ثانیې د ویل لپاره) او پایله حالت ته لیکي. سکه حالت تر 24 اچونو پورې د یوې پرمخ‌تلونکي ناسته تاریخچه سره سرونو/لکیو شمېرو سره ساتي. کارونکي چې prefers-reduced-motion فعال لري انیمیشن بشپړ پرېږدي او پایله سملاسي وینې.

اړوندې وسیلې