Испытания

Пятнашки

JS: DOM API

Модификация игры в пятнашки, в которой управление осуществляется с помощью стрелок.

application.js

Реализуйте игру в соответствие со следующими требованиями:

  • Размер поля должен быть 4x4
  • В начальной позиции пустым всегда является правый нижний квадрат
  • Элементы формируются случайным образом по следующему алгоритму: сначала они перемешиваются используя randomize(values), а затем они наполняют таблицу. Таблица должна заполняться значениями сверху вниз, то есть пятый элемент, добавляемый в неё, находится по индексам [0, 1];

Перемещение костяшек происходит с помощью стрелок.

Так как тесты завязаны на верстку (Bootstrap), то к ней предъявляются особые требования. Вот как выглядит начальная позиция:

<div class="gem-puzzle">
    <table class="table-bordered">
        <tbody>
            <tr>
                <td class="p-3">10</td>
                <td class="p-3">11</td>
                <td class="p-3">6</td>
                <td class="p-3">4</td>
            </tr>
            <tr>
                <td class="p-3">14</td>
                <td class="p-3">2</td>
                <td class="p-3">12</td>
                <td class="p-3">1</td>
            </tr>
            <tr>
                <td class="p-3">3</td>
                <td class="p-3">13</td>
                <td class="p-3">9</td>
                <td class="p-3">8</td>
            </tr>
            <tr>
                <td class="p-3">5</td>
                <td class="p-3">7</td>
                <td class="p-3">15</td>
                <td class="p-3 table-active"></td>
            </tr>
        </tbody>
    </table>
</div>
  • Класс таблицы постоянен
  • У каждой ячейки проставлен класс p-3
  • Пустая ячейка не содержит текста.
  • У пустой ячейки добавляется класс table-active

init position

Подсказки

  • Нажатие на клавиши генерирует код, по которому можно понять что за клавиша была нажата
  • Коды для стрелок можно подсмотреть в тестах
Успешных завершений: 72%

Последние код-ревью

Автор Дата обновления Версий
mburdastyh 04 июля, 11:23 1
asmolko 16 июня, 14:04 1
user-157d14ee7bf1733e 14 июня, 11:09 1
nikitauzakov 05 июня, 06:09 1
hydazepam 04 июня, 07:42 1