Atölye › Dört Bağla › 14/38. adım

Sıradaki disk

Ne yapıyoruz

Tahtanın üstünde, farenin olduğu sütunun üzerinde sıradaki disk beklesin; rengi sırası gelen oyuncunun rengi. Böylece tıklamadan önce diskin nereye düşeceğini görürsün.

```js
canvas.addEventListener('pointermove', (event) => {
  hoverCol = colAt(event)
})

  // The next disc waits above the column it would drop into.
  disc(hoverCol * CELL + CELL / 2, TOP - CELL / 2, COLORS[turn])
```

Ne işe yarıyor

Sıra sende

  1. canvas.addEventListener('pointerdown', ... satırının üstüne pointermove dinleyicisini yaz.
  2. draw içinde ctx.fillStyle = '#1d4ed8' satırının üstüne yorum satırını ve disk satırını yaz; altında bir boş satır kalsın.
  3. Çalıştır ve fareyi tahtanın üstünde gezdir: disk seni izlemeli.

Beceriler: Klavye ve fare girdisi, Canvas üzerine çizim

Tüm adımlar

  1. Koyu bir arka plan
  2. Çizen bir fonksiyon
  3. Mavi tahta
  4. Bir delik
  5. Bütün bir satır
  6. 42 deliğin hepsi
  7. Bellekteki tahta
  8. Renkli diskler
  9. Her karede çiz
  10. Disk nereye düşer?
  11. Bir sütuna oyna
  12. Sırayla
  13. Tıklayarak oyna
  14. Sıradaki disk
  15. Sıra kimde?
  16. Klavyeyle oynamak
  17. 1'den 7'ye tuşlar
  18. Yoldaki disk
  19. Yer çekimi
  20. Düşüşü izle
  21. Tahtanın içinde mi?
  22. Bir çizgi boyunca yürümek
  23. Dört yan yana mı?
  24. Kazanan var
  25. Dördünü halkala
  26. Kim kazandı?
  27. Berabere
  28. Yeniden oyna
  29. Hamleyi dene, geri al
  30. Kazan ya da engelle
  31. Oyuncuya yardım etme
  32. Ortayı tercih et
  33. Sıra bilgisayarda
  34. Sadece senin sıranda
  35. Sen ve bilgisayar
  36. Galibiyetleri say
  37. Skoru göster
  38. Kendin yap: kaybeden başlasın