forked from urfu-2016/qa-task-05
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
52 lines (43 loc) · 2.09 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
function isWin(tiles) {
return !tiles.some(function (item, i) {
return item.textContent > 0 && item.textContent - 1 !== i;
});
}
function swapTiles(tile, emptyTile) {
var temp = tile.textContent;
tile.textContent = emptyTile.textContent;
tile.style.visibility = "hidden";
emptyTile.textContent = temp;
emptyTile.style.visibility = "visible";
}
function onTileClick(event) {
var clickedTile = event.target;
var tiles = Array.prototype.slice.call(document.getElementsByClassName("tile"));
var index = tiles.map(function (el) {return el.textContent;}).indexOf(clickedTile.textContent);
if (index + 4 < 16 && tiles[index + 4].textContent === "0") swapTiles(clickedTile, tiles[index + 4]);
else if (index - 4 >= 0 && tiles[index - 4].textContent === "0") swapTiles(clickedTile, tiles[index - 4]);
else if (index % 4 !== 3 && tiles[index + 1].textContent === "0") swapTiles(clickedTile, tiles[index + 1]);
else if (index % 4 !== 0 && tiles[index - 1].textContent === "0") swapTiles(clickedTile, tiles[index - 1]);
if (isWin(tiles)) {
document.getElementsByClassName("win")[0].style.display = "block";
document.getElementsByClassName("field")[0].style.backgroundColor = "lime";
tiles.forEach(function (tile) {tile.removeEventListener("click", onTileClick);});
}
}
function drawField() {
var field = document.getElementsByClassName("field")[0];
while (field.firstChild) field.removeChild(field.firstChild);
document.getElementsByClassName("win")[0].style.display = "none";
document.getElementsByClassName("field")[0].style.backgroundColor = "#FBFBFB";
var shuffle = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15].sort(function () {return Math.random() - .5;});
var order = [0].concat(shuffle);
for (var i = 0; i < 16; i++) {
var tile = document.createElement("div");
tile.classList.add("tile");
tile.addEventListener("click", onTileClick);
if (!order[i]) tile.style.visibility = "hidden";
tile.textContent = order[i];
field.appendChild(tile);
}
}
drawField();