HTMl/JS Player

<p>Требуется разработать два идентичных одностраничных примера на стороне клиента с использованием HTML-плееров:</p><ol><li><p>Video.js</p></li><li><p>Plyr (<a href="https://github.com/sampotts/plyr?tab=readme-ov-file#ads">https://github.com/sampotts/plyr?tab=readme-ov-file#ads</a>)</p></li></ol><p><b>Требования к функционалу плеера:</b></p><ul><li><p>Плеер должен быть настроен или доработан таким образом, чтобы поддерживать следующие функции:</p><ul><li><p>Прерывание видео через N секунд просмотра.</p></li><li><p>При достижении определенного времени отображать тень на содержимом и показывать псевдо-модальный HTML-блок поверх страницы, пропорционально размеру окна.</p></li></ul></li></ul><p><b>HTML-блоки:</b></p><ul><li><p>HTML-блок должен быть представлен в двух идентичных вариантах, расположенных в отдельных парах HTML/JS файлов, различающихся только цветовой гаммой.</p></li><li><p>Имя шаблона с блоком задается в настройках рядом с плеером.</p></li><li><p>HTML-блок должен содержать позыв установить некое ПО для продолжения, при этом дизайн должен быть стильным и стимулировать пользователя нажать на красивую анимированную кнопку.</p></li></ul><p><b>Важные моменты:</b></p><ul><li><p>При нажатии в любое другое место на странице, HTML-блок скрывается, видео продолжает воспроизводиться, таймер сбрасывается, и процесс повторяется.</p></li><li><p>Каждый показ HTML-блока сопровождается установкой cookie с номером попытки, который должен отображаться в отладочной консоли.</p></li><li><p>Лучше сделать за 2-3 дня и разместить на github</p></li></ul>