Запущен holztour.ch

Всем привет, сегодня небольшой отчёт о только что запущенном проекте holztour.ch.
Это небольшой швейцарский сервис для туристов, чтобы они знали, какие места можно посетить. Туристы смотрят где вкусно кормят, где можно полазить по горам, поспать и всё такое. А владельцы этих заведений выставляют про них информацию по подписке. Этакий туристический 2GIS.
Проект разработан на Vesp, собственно для работы с ним меня и позвали в Pixmill изначально, в конце 2020. Но, в связи с пандемией, интерес к туризму сильно просел, и проект забуксовал.
Тем не менее, 1 апреля 2022 мы его запустили, хоть и не в окончательном варианте. Планируется еще много доработок по функционалу.
Как обычно для управления данными написана собственная админка. Каждая локация - это отдельная запись в таблице, к которой првязана карточка владельца места и галерея.
Общие свойства локации выглядят вот так:
А галерея вот так:
Картинки можно закидывать пачкой, сортировать перетаскиванием, отключать и удалять ненужные.
Сервис работает не для всей Швейцарии, а только для трёх регионов в самом центре страны: Obwalden, Nidwalden и Haslital.Все активные локации привязываются к одному из регионов и выводятся на общей карте через API сервиса MapBox.
При клике на маркер выводится карточка локации с описанием и галереей.
Отдельной особенностью является вывод соседних точек, расположенных в радиусе 20 километров.
Поиск соседей я добавил прямо в модель Location, работает он через формулы MySQL по координатам точек:
earth = 6371; // радиус планеты в километрах
if ($this->lng && $this->lat) {
    $c->where('id', '!=', $this->id); // исключаем текущую модель
    // И преминяем формулу, которую написал кто-то поумнее меня
    $c->havingRaw("
        $earth * acos(cos(radians($this->lat)) * cos(radians(lat)) * cos(radians(lng)
        - radians($this->lng)) + sin(radians($this->lat)) * sin(radians(lat))) <= $distance
    ");
}
Сайт является типичным SPA, все страницы выводятся без перезагрузки. Но как видно по картинкам, карточки локаций показываются модальными окнами, поэтому при перемещении по ним позиция на карте никак не меняется.
Есть сохранение локаций в избранное. Авторизацию и личный кабинет пока не делали, поэтому избранное хранится в LocalStorage браузера.
В наличии и мощный фильтр, который позволяет искать места по названию и характеристикам. Фильтруется всё на стороне клиента, через Vuex, никаких дополнительных запросов на сервер.
В локациях могут проходить разные мероприятия, поэтому есть и фильтр по датам.
На данный момент реализовано примерно 75% планируемого функционала, дальнейшие работы планируются по мере роста туристической активности. Например, должно быть прокладывание маршрута на карте из одной точки в другую.
Но уже сейчас можно зайти на holztour.ch, покликать по ссылкам и повздыхать по прекрасным видам.
Если есть вопросы - задавайте, с удовольствием расскажу подробности.

9 комментариев

Дима Сайт
Привет! Симпатичный получился сайт, но есть нюансы юзабилити под виндой. И вопросы есть, раз просил :)
1. Fontend: Всё чаще начинаю замечать что верстают под тачпад mac-девайсов, с горизонтальной прокруткой и без прикручивания JS-галерей «всегда делали»
Действительно ли такой низкий % win-пользователей что можно забивать теперь на внешний вид scrollbar-а и никто не озадачивается поиском (или созданием) решений JS-галереи (с кнопочками, autoplay и infinity таким, чтобы работало и по классике (например, крутилось мышкой без зажатого shift) и на тачпадах ноутбуков тоже двумя пальцами крутилось?
У нас вот дилемма с коллегами, мы прикручиваем галереи типа таких: https://getuikit.com/docs/slider#gap но они не крутятся «пальцами на ноутбуке», а кто-то делает как на скриншоте выше (вот ссылка на оригинал), но они выглядят на windowds не очень как видишь, и не крутятся мышкой...
Между тем, на главной под картой список карточек объектов сделан тоже каруселью с горизонтальным скроллом, и там скроллбар кастомизован (под некий прогрессбар):
Василий Наумкин
Честно говоря даже не задумывался, как оно там на Windows выглядит. Мне вообще непонятно, почему отображение скролла зависит аж от операционной системы, а не браузера.
По дизайну сролла быть не должно вообще, так это я еще, наверное, как-то буду исправлять.
Список локаций выводится типа страницами. Он так в дизайне нарисован, с ним пришлось заморочиться.
Дима Сайт
2. Backend: Заголовочки ответа сервера (который к стати очень шустрый) alt-svc: h3=":443";... порадовали!
Знаем-помним что Василий любит серверные плюшки) Вот с выходом MODX3 хотим и HTTP/3 тоже завести, и как это сделать в nginx более менее есть материал в сети, а вот почему на половине браузеров не работает это (вот у меня например, хотя совсем недавно я видел тыщу раз как в консоли разработчика google analytics скрипты грузились по h3-29), расписано не очень.
Не сталкивался? У тебя «зеленый» тест https://quic.nginx.org/quic.html ? Работает HTTP/3 ?
Василий Наумкин
Здесь сервер не мой, а Cyon, они же его и настраивают. Я пока с HTTP/3 не работал, просто не довелось еще.
Тест у меня вот такой, видимо всё хорошо:
Дима Сайт
Так ведь нет, судя по скрину у тебя в тесте запросы тоже не идут по HTTP/3, они должны быть помечены как QUIC, зеленые (см. легенду в левой части), и ответ типа: Total requests: 3000 Success with QUIC: 3000 Ну и apple-экосистема сейчас чуток отстает в поддержке https://caniuse.com/http3 Если у тебя есть dev-версия safari там это должно работать, но основной профит насколько я понимаю, будет при первом коннекте только...
Василий Наумкин
А, понял. Спасибо за инфу.
На Windows 11 у меня тоже зелёным не загорается, ни в Firefox, ни в Edge.
ЕвгенийК
Приветствую!
Достаточно интересно. На сайте bezumkin, рендеринг вроде есть, а holztour больше как приложение выполнено. Интересно, щас VESP глянуть надо...
Василий Наумкин
Они сделаны абсолютно одинаково, просто на bezumkin.ru включен серверный рендеринг, а на holztour - нет. Там страницы сгенерированы статически и рендерятся только в браузере.
Когда будет нужно, запустим SSR и на holztour.
ЕвгенийК
Это хорошо, что такая возможность есть и может быть использована. А то тенденция, мания, что-то в последнее время. Даже в крупных проектах. Мол хотим сделать сайт, хотим людей и т.д. а делают приложение. И с удивлением обнаруживают, что тот же Google на все свои скромные попытки заявить, что мы мол уже можем почти, индексим и js, на деле показывает не только значительное понижение в выдачи, но и полное отсутствие индексации. Лишая владельца сайта первоначальной заявленной цели, трафика. Дальше начал смотреть, интересно, спасибо.
bezumkin.ru
Personal website of Vasily Naumkin
Прямой эфир
Василий Наумкин
01.07.2024, 11:56:41
Да, верно, именно так. А в контроллере, скорее всего, ловить данные методом post.
Василий Наумкин
26.06.2024, 09:38:15
О, точно, вылезает если не залогинен. Спасибо, исправил!
Василий Наумкин
09.04.2024, 04:45:01
> Ошибка 500 Это не похоже на ошибку Nginx, это скорее всего ошибка PHP - надо смотреть его логи. ...
Futuris
04.04.2024, 08:56:12
Я просто немного запутался. Когда в абзаце "Vesp/Core" ты пишешь про "новый trait FileModel", я поду...
Василий Наумкин
20.03.2024, 21:21:52
Volledig!
Андрей
14.03.2024, 13:47:10
Василий! Как всегда очень круто! Моё почтение!
russel gal
09.03.2024, 20:17:18
> А этот стоило написать хотя бы затем, чтобы получить комментарий от юзера, который ничего не писал...
Александр Наумов
27.01.2024, 03:06:18
Василий, спасибо! Извини, тупанул.
Василий Наумкин
22.01.2024, 07:43:20
Давай-давай!
Василий Наумкин
24.12.2023, 14:26:13
Спасибо!