Места в зале

Чтобы всё было проще, в обоих залах «Звёздного света», большом и малом, места одинаковые: пять рядов, от A до E (латинскими буквами), по восемь мест в каждом. В выборе мест каждое место будет кнопкой с буквой ряда и номером: A1, A2 и так далее до E8.

Скрипт создаёт кнопки в двух циклах, один внутри другого, как в упражнении «Вложенные циклы». Внешний цикл проходит по рядам, а для каждого ряда внутренний цикл проходит по номерам от 1 до 8:

const seatRows = ["A", "B", "C", "D", "E"];
const seatsInRow = 8;

for (const letter of seatRows) {
    for (let number = 1; number <= seatsInRow; number++) {
        const seat = `${letter}${number}`;
        // Здесь создайте кнопку места...
    }
}

seat — это "A1", "A2" и так далее до "E8".

Напишите функцию showSeats(), которая рисует места выбранного сеанса в пустом div с id seats; добавьте его в выбор мест под заголовком. Функция должна знать, какой сеанс выбран, и следующие упражнения тоже. Поэтому chooseShowtime() хранит его в переменной chosenShowtime (сначала null) и только потом вызывает showSeats().

Места из массива taken сеанса уже проданы. Они получают класс taken, и нажимать на них нельзя: задайте их свойству disabled значение true, как вы делали с кнопкой в уроке «Таймеры и ожидание». includes() подскажет, есть ли место в taken.

Внешний вид. Сорок кнопок подряд переносились бы, как слова в абзаце. Разложите их по сетке из восьми столбцов, как в уроке «CSS Grid» курса CSS: repeat(8, 1fr) даёт восемь столбцов одинаковой ширины.

Типичные ошибки:

• Забыть очистить #seats в начале showSeats(). Выберите другой сеанс, и его места добавятся после старых.