Места

1. Назначение
2. Концепция системы
   1. Точка (Point)
   2. Место (Place)
   3. Маршрут (Route)
   4. Папка (Folder)
   5. Изображения (Images)
   6. Временные точки
   7. Активные точки
3. Режимы работы
   1. Нормальный режим
   2. Режим маршрутов
   3. Режим линейки
4. Интерфейс
   1. Верхняя панель (шапка)
      1. Левая верхняя область — кнопки-переключатели:
      2. Правая верхняя область — кнопки глобальных действий:
      3. Средняя верхняя область
   2. Основная область
      1. Левая панель — структура
      2. Правая панель — просмотр/редактирование
      3. Центральная область — карта
   3. Нижняя панель (подвал)
      1. Левая нижняя область — кнопки-переключатели:
      2. Основная нижняя область
5. Принципы хранения и порядка
   1. Разделение данных и порядка
   2. Явное сохранение изменений
6. Базовый сценарий работы
   1. Создание места
   2. Создание маршрута
   3. Работа с изображениями
7. Архитектурные особенности
   1. Удаление и безопасность данных
   2. Принцип сохранения

1. Назначение

Места — это ГеоОрганайзер. Это персональная ГИС — инструмент для систематизации личных географических данных.

Это не социальная сеть. Это не «карта с метками». Это не трекер перемещений.

Это инструмент для осмысленного хранения и организации пространственной информации. Вы управляете не просто маркерами на карте. Вы управляете и структурируете собственные коллекции географических точек, связанных с ними мест, маршрутов и сопутствующих материалов в единую логическую модель.

Пример: Бар у реки, где вы периодически встречаетесь с друзьями. Можно сохранить саму точку на карте, добавить описание, фотографии, а затем включить её в маршрут вечерней прогулки.

2. Концепция системы

В основе «Мест» лежит разделение сущностей. Их всего четыре:

• Точка
• Место
• Маршрут
• Папка

Если вы понимаете разницу между ними — вы понимаете систему.

Точка (Point)

Географическая координата (широта, долгота, высота).
Это чистые пространственные данные без описания.

Точка — это конкретные географически координаты: широта, долгота, высота. Плюс её собственный уникальный идентификатор — ID.

И не более того. Она не «принадлежит» месту или маршруту. Она о них даже не знает. Она существует сама по себе.

Каждое Место связано с одной Точкой.
Маршруты состоят из последовательности Точек.

Главный принцип:

Одна точка — одна география. Она может использоваться многократно.

Место (Place)

Смысловое описание Точки.

Содержит:

• название,
• текстовое описание,
• изображения,
• привязку к одной конкретной Точке.

И много ещё разной дополнительной необязательной информации, которую вы захотите добавить.

При создании Места система автоматически создаёт новую Точку и «привязывает» это Место к этой точке. Эта техническая деталь скрыта от пользователя для упрощения интерфейса.

Само Место не хранит географических координат. Это смысл, метаописание именно места в вашей жизни. У которого, естественно, есть и своя география (Точка).

Пример: «Беседка, в которой мы впервые поцеловались с Машей». Можно сохранить это место (уже с Точкой на карте), добавить описание, фотографии, а затем включить его в маршрут вечерней ностальгической прогулки.

Технически же при включении Места в маршрут в этот маршрут попадает не само Место, а связанная с ним Точка. И таким образом, на одну и ту же Точку ссылаются уже две сущности: Место и Маршрут. И тут мы переходим к описанию Маршрутов:

Маршрут (Route)

Упорядоченная последовательность Точек.

Особенности:

• одна и та же Точка может входить в Маршрут несколько раз;
• Маршрут не копирует координаты, а хранит ссылки на существующие Точки;
• порядок Точек имеет значение.

Это позволяет строить как линейные маршруты, так и повторяющиеся сценарии движения.

Пример: «Вечерняя прогулка в пятницу вечером». Вы начинаете из дома (Точка, к которой, например, таже привязано Место «Мой дом» с фотографиями кошек и ободранных обоев), заходите в магазин купить воды (Точка), заходите в библиотеку (Точка), шатаетесь по парку (Точка, Точка, Точка…), на обратном пути опять заходите в ту же библиотеку (та же самая Точка библиотеки, просто ссылка на неё) и возвращаетесь домой (опять та же самая первая Точка, к которой до кучи привязано Место «Мой дом»). Ну, вот так провели вечер пятницы.

Папка (Folder)

Иерархическая структура для организации Мест и Маршрутов.

Каждая папка может содержать:

• несколько Мест или Маршрутов (в зависимости от дерева, куда входит папка),
• таких же вложенных папок.

Поддерживается древовидная модель с сохранением порядка элементов. В местах есть несколько разных деревьев, состоящих из Папок — в частности, есть дерево для Мест и есть дерево для Маршрутов.

На самом деле, технически, Папка не содержит в себе другие Папки, Места или Маршруты. Вся иерархия разных деревьев строится опять же по принципу «ссылок на родителя». У каждой папки есть информация, в какую другую папку она входит (просто уникальный идентификатор, ID, этой другой папки). Так же, как и у Места или Маршрута есть такая же информация, в какую Папку они входят. Но обычному пользователю об этих технических нюансах можно не задумываться.

Изображения (Images)

Фотоальбом Места или Маршрута.

Упорядоченный список загруженных вами к конкретному месту или маршруту картинок — фотографий, например. К тому же Месту «Мой дом» — подранные обои, кошки, «порядок» в кухонной раковине.

Поддерживается перетаскивание (Drag & Drop) для изменения порядка.

Порядок изображений хранится по порядковый индексу каждого изображения, но пользователь просто видит готовый отсортированный список «превьюшек» этих изображений в фотоальбоме Места или Маршрута.

При клике на превьюшку изображение открывается во всё окно браузера. При наведении мышки на левую и правую части изображения показываются стрелки — можно листать к предыдущей фотографии или следующей.

Временные точки

Это вроде временных стикеров, прикрепленных к карте на стене. Просто способ быстро отметить что-то на карте, не создавая отдельное Место с названием, положением в дереве и т.д.

Они:

• не сохраняются в базе;
• существуют только в текущей сессии;
• могут использоваться для построения маршрутов;
• могут быть преобразованы в постоянные сущности.

Активные точки

В системе есть активные (текущие) сущности:

• текущее Место
• текущий Маршрут
• текущая Точка

Активные маркеры отображаются зелёным. Для Мест и для Маршрутов активность независима.

3. Режимы работы

Система имеет три режима:

• Нормальный
• Маршруты
• Линейка

Режим определяет поведение карты и правой кнопки мыши.

3.1 Нормальный режим

Работа с Местами и временными Точками.

• ПКМ (Правая Кнопка Мыши) по пустому месту карты — создаётся временная Точка.
• ПКМ по существующей Точке — всплывающая информация о координатах с возможностью скопировать их в буфер обмена.

3.2 Режим маршрутов

Работа с текущим Маршрутом.

• ПКМ по пустому месту карты — создание и добавление новой Точки в текущий маршрут.
• ПКМ по любой существующей Точке (Места, Маршрута, временной) — добавление её в маршрут.

Точка добавляется в конец списка.

3.3 Режим линейки

Линейка — служебный маршрут для измерения расстояний.

Она, аналогично временным Точкам (которые, кстати, и использует):

• не сохраняется в базе данных,
• живёт только в рамках сессии.

ПКМ работает так же, как в режиме Маршрутов, но данные не сохраняются.

Нужен этот режим, если вы просто захотели узнать расстояние, скажем, от одного места на карте (будь то просто произвольное место, или уже существующее Место или Точка Маршрута) до другого. А оттуда, например, ещё до Питера.

В общем, чтобы просто посмотреть расстояние какого-то пути без необходимости заводить специальный Маршрут.

4. Интерфейс

Экран разделён на три колонки и три строки:

4.1 Верхняя панель (шапка)

Здесь находится:

4.1.1 Левая верхняя область — кнопки-переключатели:

• Места, Маршруты, Точки — при клике по этим кнопкам на карте показываются или скрываются все маркеры соответственно Мест, Маршрутов или отдельных временных Точек;
• Радиус — при клике по этой кнопке в левой колоке основной области ниже показывается или скрывается панель соответствующей «утилиты»; там можно ввести количество километров вокруг активной выделенной точки (будь то Точка Места, Точка Маршрута или временная Точка), и на карте показываются только маркеры, находящиеся в радиусе этого количества километров;
• Папки — переключение режима отображения Папок в деревьях Мест и маршрутов; при нажатой кнопке «Папки» вместо просто названий папок показываются поля ввода этих названий, а также поля их описаний;
• Нормальный, Маршруты, Линейка — кнопки переключения одного из трёх основных режимов работы сервиса, описанных выше.

4.1.2 Правая верхняя область — кнопки глобальных действий:

• Отменить, Вернуть — ГеоОрганайзер поддерживает систему «undo/redo», систему отмены/возврата изменений;
• Сохранить — кнопка сохранения сделанных изменений в базу данных. Изменения сохраняются только вручную и только по этой кнопке. Если есть несохранённые изменения, кнопка «Сохранить» активируется. При попытке выйти, не сохранив изменения, во всплывающем окне появится запрос подтверждения;
• Приложение — по клике на кнопку вы сможете установить приложение ГеоОрганайзера «Места» к себе на мобильное устройство или ПК/ноутбук.
• Экспорт, Импорт — система поддерживает импорт и экспорт точек в форматах GPX и JSON; вы можете, например, импортировать точки из вашего навигатора; или экспортировать места из ГеоОрганайзера в файл одного из этих форматов, чтобы скинуть их по почту другу;
• Справка — этот мануал;
• Выход — закончить рабочую сессию, разлогиниться; при этом вся ваша личная информация из памяти браузера (localStorage) удаляется; только из памяти браузера, не волнуйтесь, не из базы данных.

4.1.3 Средняя верхняя область

Здесь находятся:

• Ссылка с вашим именем (или логином, если вы не указывали имя при регистрации). По клику на ней всплывает контекстное меню с пунктами Профиль и Выход. По ссылке «Профиль» вы перейдёте на страницу вашего аккаунта, где можно менять информацию о себе: сменить свой пароль, добавить e-mail или номер телефона и т.д. А также удалить свой аккаунт из системы :(.
• Выпадающий список текущего языка интерфейса. Сейчас поддерживаются только русский и английский.
• Выпадающий список цветовых тем интерфейса.

4.2 Основная область

4.2.1 Левая панель — структура

Здесь отображаются:

• Строка моментального поиска по названию (или его части) Места или Маршрута. При вводе в неё в соответствующих деревьях остаются показанными только Места или Маршруты, названия которых соответствуют введёному.
• Поле ввода количества километров, в радиусе которого от текущей активной Точки показываются маркеры на карте (при нажатой соответствующей кнопке-переключателе, описанной выше).
• Панель со списком кнопок Точек «Линейки» (если вы в соответствующем режиме) и, собственно, расстоянием между ними. Эти кнопки в списке можно сортировать между собой перетаскиванием (Drag & Drop). Соответственно, сразу меняется и значение расстояния этого «пути», и его отображение на карте.
• Список временных Точек.
• Деревья Мест и Маршрутов в виде вложенных друг в друга Папок.

В деревьях Мест и Маршрутов:

При наведении на папку появляются иконки-кнопки:

• показать/скрыть геометки,
• добавить место/маршрут,
• добавить подпапку,
• удалить папку.

При удалении папки можно (вас об этом спросят во всплывающем окне):

• удалить всё содержимое
• или перенести его в корневую папку.

При наведении на Место или Маршрут появляются иконки-кнопки:

• показать/скрыть маркер(ы),
• добавить элемент после текущего,
• удалить.

4.2.2 Правая панель — просмотр/редактирование

Здесь располагается подробная информация о текущем выделенном Месте и текущем выделенном Маршруте. Она представлена в большинстве своём прямо в соответствующих полях ввода, так что вы её не только видите, но и можете сразу изменить.

Основныы поля:

• Название
• Описание
• Координаты — мы же помним, что сами Места и Маршруты не хранят координаты; показываются координаты связанной с Местом Точки или связанной с Маршрутом текущей активной, выделенной Точки из его списка
• Ссылка — ну, мало ли, может статья в Википедии об этой «библиотеке»
• Сортировка — число, в соответствии с которым упорядочиваются Места и Маршруты в их деревьях в левой колонке
• Видимость Места или Маршрута другим — ГеоОрганайзер поддерживает функцию «опубличивания» Мест или Маршрутов. Если поставить эту галку, другие пользователи смогут видеть это Место или Маршрут на карте, смотреть (но не менять, естественно!) информацию о нём
• Фотографии — превьюшки фотоальбома Места или Маршрута
• Домашнее место — эта галка отвечает за то, какое место будет выделенным, активным, при входе в ГеоОрганайзер; обычно это какое-то ваше основное место, дом, например; просто для удобства

Изменения применяются немедленно в интерфейсе, но сохраняются в базе данных только после нажатия кнопки «Сохранить».

4.2.3 Центральная область — карта

Поддерживаются карты OpenStreetMap и Яндекс.Карты.

4.3 Нижняя панель (подвал)

Здесь находится:

4.3.1 Левая нижняя область — кнопки-переключатели:

• Показать / скрыть все свои геометки — все маркеры Мест, временных Точек, Точек Маршрутов на карте; иногда хочется просто поразглядывать карту
• Показвть / скрыть все другие места — все маркеры на карте Мест других пользователей, которые они сделали «публичными», а также их список в левой колонке
• Показвть / скрыть все другие геометки — все маркеры на карте Мест других пользователей, которые они сделали «публичными», но оставить их список в левой колонке
• Показвть / скрыть все другие маршруты — все маркеры на карте Маршрутов других пользователей, которые они сделали «публичными»
• Показвть / скрыть метку центра карты — это перекрестие в центре карты; оно тоже перетаскивается мышкой, а если вы «перетаскиваете» саму карту, следит за её текущим центром и «прыгает» в него; вручную координаты центра можно набрать числами в этом же подвале правее:

4.3.2 Основная нижняя область

Здесь располагается выпадающий список выбора карты — OpenStreetMap или Яндекс.Карты — и координаты центра карты.

5. Принципы хранения и порядка

Разделение данных и порядка

Элементы хранятся в виде объектов с доступом по ID.
Порядок отображения определяется не порядком хранения, а отдельным полем srt.

Это обеспечивает:

• предсказуемость,
• устойчивость при синхронизации,
• корректную работу после перезагрузки,
• независимость от особенностей JavaScript-объектов.

Явное сохранение изменений

Система использует модель «отложенного сохранения».

Изменения помечаются как изменённые (dirty), но не отправляются на сервер автоматически.
Пользователь подтверждает сохранение вручную по одной-единственной кнопке «Сохранить» в правом верхнем углу окна. И только так!

Это даёт:

• контроль над транзакцией,
• возможность пакетных изменений,
• предсказуемое поведение интерфейса.

6. Базовый сценарий работы

Создание места

1. Создать Место. Если нажать «Добавить» у папки — Место создаётся в конце списка этой папки. Если нажать «Добавить» у конкретного Места — новое создаётся сразу после него. Точка создаётся автоматически в текущем центре карты.
2. Ввести название, описание, другую информацию в правой колонке.
3. Добавить фотографии.
4. Нажать «Сохранить» для сохранения изменений.

Создание маршрута

1. Создать Маршрут кликом по кнопке-иконке с плюсом в заголовке дерева Маршрутов в левой колонке.
2. Ввести название, описание, другую информацию в правой колонке, добавить фотографии.
3. Добавить Точки (кнопкой в списке точек Маршрута в правой колонке или кликом ПКМ на пустом месте на карте).
4. При необходимости поправить местоположение Точек перетаскиванием маркеров на карте.
5. При необходимости изменить порядок Точек перетаскиванием кнопок Точек в их списке в правой колонке.
6. Сохранить изменения.

Точка может быть добавлена повторно — система не создаёт её дубликат.

Работа с изображениями

• Загрузить новые изображения по кнопке «Добавить фотографии».
• Поддерживается Drag & Drop для изменения порядка отображения превьюшек.
• Порядок отображения обновляется также сохраняется в базе данных.

7. Архитектурные особенности

• Frontend: Vue 3, Pinia, Axios.
• Состояние централизовано.
• Модель данных фронтенда отражает структуру базы данных.
• Используется пакетная синхронизация изменений.

Система спроектирована с учётом масштабируемости и консистентности данных.

Удаление и безопасность данных

Если удалить Место или Точку из Маршрута:

• Если соответствующая Точка больше нигде не используется — она удаляется.
• Если используется — остаётся.

Принцип сохранения

Все изменения:

• добавление
• изменение
• удаление

сначала накапливаются в памяти.

Только при нажатии кнопки «Сохранить» в правой верхней области они записываются в базу данных.

Это позволяет:

• работать быстро,
• отменять действия,
• контролировать момент фиксации данных.

Наверх