Ищу frontend-разработчика, который на одной странице сайта на Tilda развернул бы панораму krpano и добавил бы в неё визуализацию. Файлы панорам у меня есть, нужно именно запустить их на странице сайта и добавить визуализацию. Документация библиотеки: https://krpano.com/docu/embedpano/#top. Также отмечу, что chatGPT весьма эффективно пишет код для этой библиотеки, поэтому думаю, что с самой библиотекой проблем возникнуть не должно.
Что конкретно необходимо сделать:
1. Есть сайт, работающий на Tilda. Сайт пустой. Нужно, чтобы на одной из страниц сайта запускалась панорама библиотеки krpano.
2. Сейчас панорама работает так (запускается на локальном сервере, не на сайте): - Отображается сцена №1; - Клик по точке перемещения открывает сцену №2; - На сцене №2 присутствует изображение дома. Дом имеет несколько этажей; - Клик по изображению дома открывает картинку с планом этажа.
Целевой результат выглядит так: - Отображается сцена №1; - Клик по точке перемещения открывает сцену №2; - На сцене №2 присутствует изображение дома. При открытии сцены с помощью анимации выделяем цветными прямоугольниками этажи дома, давая понять пользователю, что каждый отдельный этаж кликабельный. Визуализация временная - как только показали пользователю кликабельность этажей, её выключаем; - Если навести курсор на такой прямоугольник, то он подсвечивается. Клик по прямоугольнику открывает картинку с планом этажа. Картину с планом можно закрыть кликом по крестику; - Квартиры на плане этажа также подсвечиваются временной визуализацией как и этажи на доме, давая понять пользователю, что они кликабельны; - Если навести курсор на квартиру, то открывается небольшой поп-ап с с основными характеристиками квартиры. Внизу поп-апа кнопка, клик по которой открывает панораму квартиры; - Клик по кнопке панорамы квартиры открывает соответствующую панораму.
3. Чтобы пользователь знал в какой части панорамы находится, нужно отображать “хлебные крошки” вверху всех страниц. Т.е. там фиксируется в какие сцены проваливался пользователь. Если кликнуть по любой из “крошек”, то должна открыться соответствующая сцена.
4. Чтобы я мог разобраться в вашем коде, попрошу оставить как можно больше комментариев в нём что и как работает. В будущем хотел бы реализовывать описанный выше функционал самостоятельно.
5. Попрошу консультацию о том, как правильно и безопасно интегрировать получившиеся панорамы в другие сайты. Пока вижу два варианта: 1. отдельная страница с панорамами на сайте и 2. фрейм с панорамой, вставленный на уже существующую страницу сайта. Также хотелось бы понять ограничения производительности получившихся решений, максимальное количество сцен для быстрой работы сайта.
Для выполнения этой задачи с меня:
- доступы к Siteground и Tilda; - файлы двух панорам: - Сцена 1 → Сцена 2. На Сцене 2 изображение дома. При клике на дом открывается план этажа, этот план можно закрыть нажатием на крестик; - Панорама квартиры, состоящая из двух сцен.