Atölye › Amiral Battı › 12/35. adım
Şimdi düşman denizinde bir kareye dokunmak (tıklamak) o kareye ateş etsin. Tıklamanın sayfadaki yerini önce canvas piksellerine, sonra satır ve sütuna çeviriyoruz. Denizin dışına yapılan tıklamalar bir şey yapmayacak.
```js
canvas.addEventListener('pointerdown', (event) => {
const rect = canvas.getBoundingClientRect()
const x = ((event.clientX - rect.left) * canvas.width) / rect.width - SEA.x
const y = ((event.clientY - rect.top) * canvas.height) / rect.height - SEA.y
const r = Math.floor(y / BIG)
const c = Math.floor(x / BIG)
if (r >= 0 && r < N && c >= 0 && c < N) playerShoots(r, c)
})
```canvas.addEventListener('pointerdown', ...) → canvas'a basıldığında (tıklama ya da dokunma).rect → canvas'ın ekranda durduğu kutu. (event.clientX - rect.left) * canvas.width / rect.width → tıklamanın
canvas içindeki x'i; canvas ekranda büyütülüp küçültülse de doğru.- SEA.x, - SEA.y → denizin köşesinden ölçülen uzaklık.Math.floor(y / BIG) → 36'ya bölüp aşağı yuvarlayınca satır numarası çıkar (örneğin 80 / 36 = 2.2 → 2).
Sütun da aynı yolla.if (r >= 0 && r < N && c >= 0 && c < N) → kare denizin içindeyse ateş et. Dışarıdaysa satır ya da sütun eksi
veya 10'dan büyük olur.Dinleyiciyi function drawSea( satırının üstüne yaz; altında bir boş satır kalsın. Çalıştır ve düşman denizine
tıkla: beyaz ve kırmızı noktalar belirmeli.
Beceriler: Klavye ve fare girdisi
← Senin atışın Bir mesaj satırı →