Разработка HTML + JS страницы
Станица должна содержать следующие элементы: video,img, timeline (либо chart в виде bars), календарь. При открытии страницы с сервера загружаются данные в виде (пример):
000000030/Camera/2021-03-12/cam2_vid_12-03-2021_18-47-51_640x360.mp4|Автомобиль гн а123вс777
000000030/Camera/2021-03-12/cam2_vid_12-03-2021_18-46-23_640x360.mp4|Посетитель Иванов И.И.
000000030/Camera/2021-03-12/cam2_vid_12-03-2021_18-40-13_640x360.mp4|Посетитель, нераспознан
и
000000030/Camera/2021-03-12/cam2_img_12-03-2021_17-49-56_640x480.jpg
000000030/Camera/2021-03-12/cam2_img_12-03-2021_17-50-47_640x480.jpg
000000030/Camera/2021-03-12/cam2_img_12-03-2021_17-51-47_640x480.jpg
Как видно из содержания, это пути к файлам jpg или mp4.
В таймлайне необходимо данные отсортировать по времени указанном в файле и там где есть видео высота столба с нераспознанные видео 2, распознанное 3, фото - 1.
При клике на таймлайне отображается элемент содержащийся в списке, полученном при старте страницы. JS считает время и отображает его в вехнем левом угле, где фото листает со скорость 1 фото в Х секунд (как указано пользователем), когда доходит до видео делает img невидимым, контейнер с video видимым и запускает проигрывание. По окончании или проигрывает далле фото, или видео, по указанному выше алгоритму.
Оплата за клиентскую и серверную часть. Или все на PHP c подключением к серверу и прорисовкой страницы, но лучше ч-н типо node.js или python websockets.