Решение тестового задания

Ссылка на описание тестового задания: https://yadi.sk/i/pogLvxfR3aP67U

Что было сделано?

• Сверстана адаптивная страничка с календарём, кнопкой и пр. на Bootstrap 4.
• Написан скрипт script.js, который выполняет следующие функции:
  • запрашивает у сервера список забронированных дней (они хранятся в data-default.json);
  • генерирует текущий календарный месяц с выделением красным цветом забронированных дней;
  • делает все свободные дни кликабельными;
  • делает кнопку "Забронировать" активной, если выбран хотя бы один день, и наоборот, если не один свободный день не выбран;
  • обрабатывает клик на кнопку "Забронировать" и отправляет все забронированные дни (полученные + выбранные) на серверный сценарий data.php для его записи в файл data.json.
• Есть возможность перелистывания месяцев календаря, но бронирование и отображение забронированных дней доступно лишь в текущем месяце.
• Написан небольшой серверный скрипт data.php, с помощью которого я сначала сгенерировал массив забронированных дней, а затем немного переписал, чтобы он стал осуществлять функцию считывания и записи данных в файл в ответ на запросы.
• Вся работоспособность скриптов и сценария были проверены с помощью локального веб-сервера WAMP с PHP 7.1.16 и браузеров: Яндекс.Браузер, Google Chrome, Internet Explorer (IE10 и IE11).
• Чтобы после обновления страницы, дни, которые мы уже бронировали, становились красными и их повторное бронирование было недоступно, нужно немного изменить файл data.php - изменив в переменной $filenameForRead значение с data-default.json на data.json.
• Был написан 2-й вариант решения данного задания - файлы index-v2.html и script-v2.js.

Что было сделано из доп. заданий:

• Был подключен шрифт Roboto с Google Fonts.
• Был реализован эффект наведения на даты (выделение цветом) с помощью CSS. С помощью атрибута title и Bootstrap подсказок (tooltip'ов) реализовано отображение надписей "Данный день свободен" или "Данный день занят" при наведении курсора на дни текущего месяца.