Neidio i'r prif gynnwys

Fflipio Darn Arian a Throelli Olwyn am ddim

Tafla darn arian rhithwir, troelli olwyn y gellir ei ddomestigo, neu dewiswch ar hap o restr o opsiynau. Yn defnyddio anwadrwydd cryptograffig diogelach dy borwr — nid yw'n dyniad cyhoeddus gellir ei wirio, felly osgoi cystadlaethau reoleiddiedig.

Yn gweithio all-lein ar ôl llwytho

🔒 Mae'r tri yn defnyddio generadur rhif ar hap cryptograffig-ddiogel dy borwr: mae'r canlyniad yn cael ei ddewis yn gyntaf, yna wedi'i animeiddio — mae'r darn arian yn wir 50/50, mae'r olwyn yn cael ei throl i'r canlyniad sydd eisoes wedi'i ddewis, ac mae'r dethol yn ddibartiwm. Nid yw dim yn gadael dy ddyfais. Mae hyn yn deg i ddefnydd achlysurol, ond nid yw'n dyniad cyhoeddus y gellir ei wirio, felly osgoi cystadlaethau reoleiddiedig neu benderfyniadau gwerth uchel.

Defnyddiau cyffredin

  • Fflipio Darn i Wneud PenderfyniadauDefnyddiwch fflipio darn rhithwir teg i wneud penderfyniadau cyflym, di-duedd pan fyddwch mewn penbleth rhwng dwy opsiwn.
  • Troelli'r Olwyn ar gyfer Aseiniadau Tîm Ar HapDefnyddiwch yr olwyn droelli addasadwy i aseinio aelodau tîm ar hap i dasgau, rolau neu grwpiau.
  • Dewisydd Myfyriwr Ar Hap ar gyfer Ystafelloedd DosbarthDefnyddiwch yr olwyn droelli neu ddewisydd opsiynau i alw ar fyfyrwyr ar hap, aseinio grwpiau neu ddewis gwirfoddolwyr.
  • Fflipio Darn Rhithwir ar gyfer ChwaraeonFflipio darn teg i benderfynu ochr tîm, meddiannaeth gyntaf, trefn gwasanaethu neu benderfyniadau chwaraeon eraill.
  • Dewisydd Ar Hap ar gyfer GiveawaysDewiswch enillydd ar hap o restr mynediadau gan ddefnyddio'r Dewisydd Opsiynau — tryloyw a theg.

Sut Mae'n Gweithio

Mae pob un o'r tri modd — tafl ceiniog, olwyn troelli, a dewisydd opsiwn — yn defnyddio Web Crypto API adeiledig y porwr (crypto.getRandomValues) i gynhyrchu'r canlyniad buddugol, yna'n gyrru'r animeiddiad yn gyfan gwbl ochr-cleient â throsffurfiadau CSS a requestAnimationFrame. Nid oes gweinydd yn gysylltiedig ar unrhyw bwynt.

  1. 1
    Mae Web Crypto yn dewis y buddugwr
    Cyn i unrhyw animeiddiad ddechrau, mae crypto.getRandomValues yn llenwi Uint32Array â chyfanrif 32-bit ar hap cryptograffig. Mae gweithred modwlo'n ei fapio i nifer yr opsiynau (2 ar gyfer pen/cynffon, N ar gyfer yr olwyn neu'r dewisydd), fel bod gan bob canlyniad union yr un tebygolrwydd.
  2. 2
    Cyfrifir ongl gylchdroi i lanio ar y canlyniad
    Ar gyfer y geiniog, mae'r cod yn cyfrifo'r cylchdroad ychwanegol byrraf (uwchben yr ongl gronnol gyfredol) sy'n gorffen â'r wyneb cywir i fyny — pen ar 0°, cynffon ar 180° — yna'n ychwanegu 5 troelliad llawn fel ei fod yn edrych fel tafl go iawn. Mae'r olwyn yn gwneud yr un peth: mae'n dod o hyd i'r ansymudiad onglog sy'n dod â'r sleisen fuddugol o dan y pwyntydd, yn ychwanegu 6 chylchdroad llawn, ac yn cymhwyso siglad bach ar hap fel nad yw'r pwyntydd bob amser yn stopio'n union yng nghanol y sleisen.
  3. 3
    Mae trosiadau CSS a requestAnimationFrame yn gyrru'r animeiddiad
    Mae'r geiniog a'r olwyn yn animeiddio drwy trosffurfiad CSS gyda chromlin esmwytho cubic-bezier wedi'i chymhwyso i un gwerth cylchdroi cronnus — nid oes angen JavaScript fesul ffrâm unwaith y bydd yr ongl wedi'i gosod. Mae'r dewisydd opsiwn yn defnyddio requestAnimationFrame yn lle hynny: bob ffrâm, mae cyfwng sy'n tyfu'n cwadratig yn penderfynu a ddylid symud y goleuo ymlaen, gan gynhyrchu arafiad arddull peiriant slot sy'n bob amser yn stopio ar y buddugwr a bennwyd ymlaen llaw.
  4. 4
    Datgelir y canlyniad a'i gofnodi i hanes y sesiwn
    Mae setTimeout yn tanio pan fydd yr animeiddiad yn cwblhau (1.3 e ar gyfer y geiniog, 4.3 e ar gyfer yr olwyn) ac yn ysgrifennu'r canlyniad i gyflwr. Mae modd y geiniog yn cadw hanes sesiwn parhaus o hyd at 24 tafl gyda chyfrifon pen/cynffon. Mae defnyddwyr sydd wedi galluogi prefers-reduced-motion yn hepgor yr animeiddiad yn gyfan gwbl ac yn gweld y canlyniad ar unwaith.

Offer Cysylltiedig

Cwestiynau Cyffredin