From 8b5f54dc3842baef0cf86cfe7848c578bbd8b4ed Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A6=D0=B2=D0=B5=D1=82=D0=BA=D0=BE=D0=B2=D0=B0=20=D0=92?= =?UTF-8?q?=D0=B0=D0=BB=D0=B5=D1=80=D0=B8=D1=8F?= Date: Wed, 10 May 2017 20:11:49 +0500 Subject: [PATCH 1/6] Update index.css --- index.css | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/index.css b/index.css index 30ce6fb..256a6b6 100644 --- a/index.css +++ b/index.css @@ -1 +1,20 @@ /* Стили для пятнашек опишите в этом файле */ +#winner-note { + visibility: hidden; +} + +.cell { + width: 100px; + height: 100px; + background-color: #aaaaaa; + margin: 1px; +} + +.cell:hover { + background-color: #84aeff; + cursor: pointer; +} + +#game-field { + padding: 10px; +} From 6b1c5ef9904662d8a6861c868a43a95b6197b1bd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A6=D0=B2=D0=B5=D1=82=D0=BA=D0=BE=D0=B2=D0=B0=20=D0=92?= =?UTF-8?q?=D0=B0=D0=BB=D0=B5=D1=80=D0=B8=D1=8F?= Date: Wed, 10 May 2017 20:12:39 +0500 Subject: [PATCH 2/6] Update index.html --- index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 1cca5fe..ad1ffde 100644 --- a/index.html +++ b/index.html @@ -10,7 +10,8 @@ - +
+
You won!
>
@@ -20,7 +21,6 @@ - From 6170e5857679cb3cdfb8c8b19d5d908a2f980697 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A6=D0=B2=D0=B5=D1=82=D0=BA=D0=BE=D0=B2=D0=B0=20=D0=92?= =?UTF-8?q?=D0=B0=D0=BB=D0=B5=D1=80=D0=B8=D1=8F?= Date: Wed, 10 May 2017 20:13:38 +0500 Subject: [PATCH 3/6] Update index.js --- index.js | 73 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 73 insertions(+) diff --git a/index.js b/index.js index 8c84dd3..1609d69 100644 --- a/index.js +++ b/index.js @@ -1 +1,74 @@ // Логику пятнашек нужно описать в этом файле +var cells; + +function initGameField() { + getShuffledField(); + var field = document.getElementById('game-field'); + for (var i = 0; i < 16; i++) { + var element = document.createElement('input'); + element.setAttribute('class', 'cell'); + element.setAttribute('type', 'button'); + element.setAttribute('value', cells[i]); + element.addEventListener('click', onClick); + field.appendChild(element); + if (i === 0) + element.style.visibility = 'hidden'; + if ((i + 1) % 4 === 0) { + field.appendChild(document.createElement('br')); + } + } +} + +function isEnd() { + for (var i = 0; i < cells.length - 1; i++) { + if (parseInt(cells[i].value) !== i + 1) + return false; + } + return true; +} + +function swapCells(current, target) { + target.style.visibility = 'visible'; + target.value = current.value; + current.value = -1; + current.style.visibility = 'hidden'; + var t = parseInt(current.value); + cells[cells.indexOf(parseInt(current.value))] = target.value; + cells[cells.indexOf(parseInt(target.value))] = t; +} + +function getShuffledField() { + cells = shuffleArray([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]); + cells.unshift(-1); + +} + +function shuffleArray(cells) { + for (var i = cells.length - 1; i > 0; i--) { + var j = Math.floor(Math.random() * (i + 1)); + var temp = cells[i]; + cells[i] = cells[j]; + cells[j] = temp; + } + return cells; +} + +function onClick(event) { + var field = document.getElementById('game-field'); + var htmlCells = field.getElementsByClassName('cell'); + var currentID = cells.indexOf(parseInt(event.target.value)); + if (parseInt(htmlCells[currentID - 1].value) === -1) + swapCells(htmlCells[currentID], htmlCells[currentID - 1]); + if (parseInt(htmlCells[currentID + 1].value) === -1) + swapCells(htmlCells[currentID], htmlCells[currentID + 1]); + if (parseInt(htmlCells[currentID - 4].value) === -1) + swapCells(htmlCells[currentID], htmlCells[currentID - 4]); + if (parseInt(htmlCells[currentID + 4].value) === -1) + swapCells(htmlCells[currentID], htmlCells[currentID + 4]); + if (isEnd()) { + var note = document.getElementById('winner-note'); + note.setAttribute('visibility', 'visible'); + } +} + +initGameField(); From 105d8fddf4c75f6391b3e9dc3eea3d220b8b8e99 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A6=D0=B2=D0=B5=D1=82=D0=BA=D0=BE=D0=B2=D0=B0=20=D0=92?= =?UTF-8?q?=D0=B0=D0=BB=D0=B5=D1=80=D0=B8=D1=8F?= Date: Thu, 11 May 2017 03:19:07 +0500 Subject: [PATCH 4/6] =?UTF-8?q?=D0=98=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=B8?= =?UTF-8?q?=D0=BB=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.js | 39 ++++++++++++++++++++------------------- 1 file changed, 20 insertions(+), 19 deletions(-) diff --git a/index.js b/index.js index 1609d69..9257c11 100644 --- a/index.js +++ b/index.js @@ -11,7 +11,7 @@ function initGameField() { element.setAttribute('value', cells[i]); element.addEventListener('click', onClick); field.appendChild(element); - if (i === 0) + if (cells[i] === -1) element.style.visibility = 'hidden'; if ((i + 1) % 4 === 0) { field.appendChild(document.createElement('br')); @@ -19,9 +19,9 @@ function initGameField() { } } -function isEnd() { - for (var i = 0; i < cells.length - 1; i++) { - if (parseInt(cells[i].value) !== i + 1) +function isEnd(array) { + for (var i = 0; i < array.length - 1; i++) { + if (parseInt(array[i].value) !== i + 1) return false; } return true; @@ -32,15 +32,12 @@ function swapCells(current, target) { target.value = current.value; current.value = -1; current.style.visibility = 'hidden'; - var t = parseInt(current.value); - cells[cells.indexOf(parseInt(current.value))] = target.value; - cells[cells.indexOf(parseInt(target.value))] = t; + } function getShuffledField() { cells = shuffleArray([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]); cells.unshift(-1); - } function shuffleArray(cells) { @@ -56,18 +53,22 @@ function shuffleArray(cells) { function onClick(event) { var field = document.getElementById('game-field'); var htmlCells = field.getElementsByClassName('cell'); - var currentID = cells.indexOf(parseInt(event.target.value)); - if (parseInt(htmlCells[currentID - 1].value) === -1) - swapCells(htmlCells[currentID], htmlCells[currentID - 1]); - if (parseInt(htmlCells[currentID + 1].value) === -1) - swapCells(htmlCells[currentID], htmlCells[currentID + 1]); - if (parseInt(htmlCells[currentID - 4].value) === -1) - swapCells(htmlCells[currentID], htmlCells[currentID - 4]); - if (parseInt(htmlCells[currentID + 4].value) === -1) - swapCells(htmlCells[currentID], htmlCells[currentID + 4]); - if (isEnd()) { + var array = Array.prototype.slice.call(htmlCells, 0); + var currentID = array.indexOf(event.target); + if (currentID - 1 >= 0 && currentID % 4 !== 0 && array[currentID - 1].value === '-1') + swapCells(array[currentID], array[currentID - 1]); + else if (currentID + 1 <= 15 && currentID + 1 !== 0 && array[currentID + 1].value === '-1') + swapCells(array[currentID], array[currentID + 1]); + else if (currentID - 4 >= 0 && array[currentID - 4].value === '-1') + swapCells(array[currentID], array[currentID - 4]); + else if (currentID + 4 <= 15 && array[currentID + 4].value === '-1') + swapCells(array[currentID], array[currentID + 4]); + if (isEnd(array)) { var note = document.getElementById('winner-note'); - note.setAttribute('visibility', 'visible'); + note.style.visibility = 'visible'; + array.forEach(function (element) { + element.disabled = true; + }) } } From 28c771ca917a5192bb91dcc9aeb4ba159463ca49 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A6=D0=B2=D0=B5=D1=82=D0=BA=D0=BE=D0=B2=D0=B0=20=D0=92?= =?UTF-8?q?=D0=B0=D0=BB=D0=B5=D1=80=D0=B8=D1=8F?= Date: Thu, 11 May 2017 03:20:17 +0500 Subject: [PATCH 5/6] =?UTF-8?q?=D0=9F=D0=BE=D0=BC=D0=B5=D0=BD=D1=8F=D0=BB?= =?UTF-8?q?=D0=B0=20=D0=BC=D0=B5=D1=81=D1=82=D0=B0=D0=BC=D0=B8=20=D0=BD?= =?UTF-8?q?=D0=B0=D0=B4=D0=BF=D0=B8=D1=81=D1=8C=20=D0=B8=20=D0=B8=D0=B3?= =?UTF-8?q?=D1=80=D0=BE=D0=B2=D0=BE=D0=B5=20=D0=BF=D0=BE=D0=BB=D0=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index ad1ffde..6cc0bbc 100644 --- a/index.html +++ b/index.html @@ -10,8 +10,8 @@ +

You won!

-
You won!
>
From f43fd59ad84dfb1ee72adcf466724e797d98aa85 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A6=D0=B2=D0=B5=D1=82=D0=BA=D0=BE=D0=B2=D0=B0=20=D0=92?= =?UTF-8?q?=D0=B0=D0=BB=D0=B5=D1=80=D0=B8=D1=8F?= Date: Thu, 11 May 2017 03:20:59 +0500 Subject: [PATCH 6/6] =?UTF-8?q?=D1=81=D1=82=D0=B8=D0=BB=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.css | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/index.css b/index.css index 256a6b6..013dfc9 100644 --- a/index.css +++ b/index.css @@ -1,17 +1,19 @@ /* Стили для пятнашек опишите в этом файле */ #winner-note { visibility: hidden; + font: 30px sans-serif; + text-align: center; } .cell { width: 100px; height: 100px; - background-color: #aaaaaa; + background-color: #c1c1c1; margin: 1px; } .cell:hover { - background-color: #84aeff; + background-color: #9db6f2; cursor: pointer; }