Atölye › Kule Savunması › 17/42. adım
Farenin altındaki kare aydınlansın: kurabiliyorsan beyaz, kuramıyorsan kırmızı. Cevabı zaten tıklamalar için
kullandığımız canBuild veriyor; aynı kural iki yerde.
Oyuncuya tıklamadan önce ne olacağını göstermek, bir oyunun adil hissettirmesinin büyük bir parçası.
```js
let hover = null // the tile under the mouse
canvas.addEventListener('pointermove', (event) => {
const p = tileAt(event)
hover = p.row >= 0 && p.row < ROWS ? p : null
})
canvas.addEventListener('pointerleave', () => {
hover = null
})
if (hover) {
ctx.fillStyle = canBuild(hover.col, hover.row) ? 'rgba(255, 255, 255, 0.25)' : 'rgba(239, 68, 68, 0.35)'
ctx.fillRect(hover.col * TILE, TOP + hover.row * TILE, TILE, TILE)
}
```let hover = null → farenin altındaki kare; başta yok.pointermove → fare canvas'ın üstünde hareket ettikçe: tileAt ile kareyi bul. p.row >= 0 && p.row < ROWS ? p : null → haritanın satırlarındaysa onu tut, değilse (üst ya da alt şerit) null.pointerleave → fare canvas'tan çıkınca unut.if (hover) { → bir kare varsa çiz. Karelerden sonra, kulelerden önce çizilir.'rgba(255, 255, 255, 0.25)' → rgba kırmızı, yeşil, mavi (0–255) ve saydamlık (0–1): %25 beyaz. Alttaki
çimen görünmeye devam eder. 'rgba(239, 68, 68, 0.35)' → %35 kırmızı.let selected satırının altına let hover = null ... yaz.pointerdown dinleyicisinin kapanan }) satırının hemen altına pointermove ve pointerleave dinleyicilerini
yaz.draw içinde kare döngülerinden sonra bir boş satır bırakıp if (hover) { ... } bloğunu yaz.Beceriler: Klavye ve fare girdisi
← Altını göster Menzili göster →