Акысыз Тыйын ыргытуу жана дөңгөлөк айландыруу

Виртуалдык тыйынды ыргытыңыз, ыңгайлаштырылуучу дөңгөлөктү айландырыңыз же тизмеден кокустан бирин тандаңыз. Браузериңиздин криптографиялык коопсуз кокустугун колдонот — жөнгө салынган сынактар үчүн текшерилүүчү ачык тартылыш эмес, андыктан жөнгө салынган мелдештерге ылайыктуу эмес.

Жүктөлгөндөн кийин оффлайн иштейт

🔒 Үчөө тең браузериңиздин криптографиялык коопсуз кокустук жаратуучусун колдонот: жыйынтык алгач тандалат, андан кийин анимация көрсөтүлөт — тыйын чыныгы 50/50, дөңгөлөк буга чейин тандалган жыйынтыкка чейин айланат, ал эми тандоочу да калыс. Эч нерсе түзмөгүңүздөн чыкпайт. Бул кадимки колдонуу үчүн адилет, бирок текшерилиүчу коомдук ыргытуу эмес, ошондуктан аны жөнгө салынган мелдештерде же чоң маанилүү чечимдерде колдонбоңуз.

Бул кантип иштейт

Үч режим тең — тыйын ыргытуу, дөңгөлөк айландыруу жана вариант тандагыч — жеңүүчү натыйжаны жаратуу үчүн браузердин курулма Web Crypto API'син (crypto.getRandomValues) колдонот, андан кийин анимацияны CSS трансформдору жана requestAnimationFrame менен толугу менен клиент тарабында айдайт. Эч бир учурда сервер катышпайт.

  1. 1
    Web Crypto жеңүүчүнү тандайт
    Анимация башталганга чейин, crypto.getRandomValues Uint32Array'ди криптографиялык кокус 32-биттик бүтүн сан менен толтурат. Модуло операциясы аны варианттар санына (баш/куйрук үчүн 2, дөңгөлөк же тандагыч үчүн N) картага түшүрөт, ошондуктан ар бир натыйжада так бирдей ыктымалдуулук бар.
  2. 2
    Айландыруу бурчу натыйжага түшүү үчүн эсептелет
    Тыйын үчүн, код туура жагы менен аяктаган кошумча айландырууну (учурдагы топтолгон бурчтун үстүнө) эсептейт — баш 0°де, куйрук 180°де — андан кийин чыныгы кулак сыяктуу көрүнүшү үчүн 5 толук айландыруу кошот. Дөңгөлөк дагы ошондой жасайт: ал жеңүүчү бөлүкчөнү көрсөткүчтүн астына алып келген бурч оффсетин табат, 6 толук айландыруу кошот жана көрсөткүч дайыма бөлүкчөнүн так борборунда токтобошу үчүн кичине кокус чайкоо колдонот.
  3. 3
    CSS өткөрүлүштөрү жана requestAnimationFrame анимацияны айдайт
    Тыйын жана дөңгөлөк бир топтолгон айландыруу маанисине колдонулган кубикалык-безье жумшартуу ийриси менен CSS transform аркылуу анимацияланат — бурч орнотулгандан кийин кадр-башына JavaScript керек эмес. Вариант тандагыч анын ордуна requestAnimationFrame колдонот: ар бир кадрда, квадраттык өсүп жаткан интервал алдын ала аныкталган жеңүүчүдө дайыма токтогон слот-машина солгундоосун жаратып, белгилеме алдыга жылдырылабы же жокпу аныктайт.
  4. 4
    Натыйжа ачылат жана сессия тарыхына жазылат
    Анимация бүткөндө setTimeout иштейт (тыйын үчүн 1.3 с, дөңгөлөк үчүн 4.3 с) жана натыйжаны абалга жазат. Тыйын режими баш/куйрук саны менен 24ке чейин ыргытуунун иштеп жаткан сессия тарыхын кармайт. prefers-reduced-motion күйгөн колдонуучулар анимацияны толугу менен өткөрүп жиберип, натыйжаны дароо көрөт.

Байланыштуу куралдар

Көп берилүүчү суроолор