Выбор сеанса

Теперь самое главное: билеты. В каждой строке таблицы появится кнопка Выбрать места. Нажатие на неё открывает под таблицей выбор мест, в заголовке которого указаны день, время и фильм. В этом упражнении вы добавите выбор мест и откроете его; сами места появятся в следующем.

Выбор мест — это раздел showtimes.html под таблицей:

<section id="seat-picker" hidden>
    <h2 id="picker-title"></h2>
</section>

Атрибут hidden скрывает элемент. Скрипт показывает его так: seatPicker.hidden = false;, а true снова скрывает. Это удобно для частей страницы, которые пока не нужны.

Кнопки создаёт showShowtimes(), каждую в пятой ячейке своей строки. (Добавьте в строку заголовков ещё и пятую, пустую ячейку th, чтобы линия под заголовками шла и над кнопками.) Обработчик каждой кнопки должен знать, какой сеанс в её строке. Создавайте его внутри цикла, как вы делали с избранным в мини-проекте «Киновечер», и он запомнит сеанс своего витка цикла:

button.addEventListener("click", function () {
    chooseShowtime(showtime);
});

Функцию chooseShowtime() вам предстоит написать самим: она заполняет заголовок и показывает выбор мест. В следующих упражнениях она будет делать больше.