Atölye › 15 Bulmacası › 15/27. adım
Klavyeyle de oynayalım. Oklar en doğal şöyle hissettirir: ok, taşı o yöne götürür. Sol ok, boşluğun sağındaki taşı sola kaydırır; yukarı ok, boşluğun altındaki taşı yukarı çeker.
Hangi taşın geleceğini küçük bir tablodan (nesne) buluruz: sol ok → boşluğun bir sağı (+1), yukarı ok → bir altı
(+N)...
```js
// An arrow moves the tile on the other side of the gap in that direction: Left slides the tile right of the gap to the left.
document.addEventListener('keydown', (event) => {
const gap = tiles.indexOf(0)
const from = { ArrowLeft: 1, ArrowRight: -1, ArrowUp: N, ArrowDown: -N }[event.key]
if (from !== undefined) {
event.preventDefault()
if (neighbors(gap).includes(gap + from)) move(gap + from)
}
})
```document.addEventListener('keydown', (event) => { ... }) → sayfada bir tuşa basıldığında çalışır. event.key
tuşun adı: 'ArrowLeft', 'ArrowUp'...{ ArrowLeft: 1, ArrowRight: -1, ArrowUp: N, ArrowDown: -N } → bir nesne, burada bir tablo: sol tarafta ad,
sağ tarafta değer. Sondaki [event.key] tablodan o tuşun değerini okur: sol okta 1. Tabloda olmayan bir tuşta
undefined ("yok") çıkar.if (from !== undefined) → !== "eşit değil": yani bir ok tuşuysa.event.preventDefault() → tarayıcının kendi işini engeller: oklar normalde sayfayı kaydırır.neighbors(gap).includes(gap + from) → gelecek taş gerçekten boşluğun komşusu mu? Boşluk son sütundaysa gap + 1 bir
alt satırın başıdır; bu kontrol onu engeller.function squareX(i) { satırının üstüne yorum satırını ve dinleyiciyi yaz; arada bir boş satır kalsın.
Çalıştır, oyuna bir kez tıkla ve okları dene.
Beceriler: Klavye ve fare girdisi