Просмотр кода страницы Инструкция по работе с виджетом навигации для ver. 1.0

== '''Описание ситуации''' ==
Данный виджет выводит на устройства (панели под управлением Windows OS и Linux OS) информацию о навигации внутри определенного здания. Виджет требует предварительной настройки, после которой он будет корректно работать на обозначенных выше панелях.
== '''Серверная логика''' ==
Серверная часть отсутствует. Вся работа виджета проводится внутри личного кабинета SmartPlayer и информация выводится на устройства благодаря функционалу платформы и личного кабинета.
== '''Добавление виджета в личный кабинет''' ==
Чтобы добавить данный виджет в личный кабинет, пользователю необходимо запросить у специалиста команды технической поддержки архив с содержимым. Он будет предоставлен в формате .zip-архива.<br>
После этого, пользователь должен авторизоваться в личном кабинете и перейти в раздел «Контент».
[[File:Раздел_контент_личного_кабиента.png|thumb|center| Пример отображения раздела «Контент» в личном кабинете |800px]]
В разделе «Контент» необходимо перенести данный виджет из локального хранилища в личный кабинет. После того как пользователь перенесет виджет в личный кабинет, он отобразится в списке с контентом.
[[File:Виджет_навигации.png|thumb|center| Пример отображения переноса виджета в личном кабинете SmartPlayer|800px]]

== '''Главная страница виджета''' ==
После переноса виджета для первичной настройки пользователю необходимо дважды кликнуть по иконке виджета. Данное действие перенесет его на главную страницу.<br>
На главной странице виджета пользователь может кликнуть по иконке в виде шестеренки, чтобы перейти в настройки виджета.
[[File:Инструкция_тбанк.png|thumb|center| Пример отображения иконки для перехода в настройки виджета|800px]]
Также, на главное странице виджета если он предварительно был настроен доступно превью настройки карты, которое включает в себя:
* карту помещения (с обозначением панели на ней) занимающая большую часть главной страницы;
* переключатель с нумерацией этажей (если этажей больше 1), который расположен в правой верхней части главной страницы;
[[File:Переключатель_этажей.png|thumb|center| Пример отображения переключателя этажей |800px]]
* объекты фильтрации для быстрого построения маршрута (коворкинг, принтер, гардероб и прочие), которые при клике отрисуют маршрут до ближайшего объекта. Располагается под списком этажей.
[[File:Виджет_и_фильтрация.png|thumb|center| Пример отображения объектов фильтрации в виджете |800px]]
* клавиатура с ручным вводом, позволяющая искать необходимые на карте объекты. Работает на двух языках: русский и английский. Отображается в виде строки с иконкой лупы в правой нижней части экрана. По умолчанию находится в скрытом состоянии, по клику разворачивается на половину экрана настройки.
[[File:Клавиатура_виджета.png|thumb|center| Пример отображения иконки клавиатуры для поиска объектов|800px]]

== '''Кнопка «Настройки»''' ==
Перейдя на страницу «Настройки» пользователь может настроить следующие параметры:
* разрешение — можно выбрать разрешения для виджета. Доступно: Full HD (1920X1080) или 4K(3840X2160);
* время сессии - прописать значение длительности рабочей сессии. Измеряется в секундах;
* чекбокс (галочка) «Показывать навигацию прокладки маршрута» — активирует прокладку маршрута в виджете;
* кнопка «Удалить» карту — позволяет удалить добавленную в виджет карту;
* поле с объектами — прописать значение с для объекта. По умолчанию значение: [object Object]; 
{{Note|Ниже будут описаны два отдельных блока настроек вынесенных в виде кнопок: 
# Редактор карт.
# Редактора навигации.|warh}}
[[File:Список_настроек_навигации.png|thumb|center| Пример отображения настроек виджета навигации|800px]]
=== '''Редактора карт''' ===
{{Note|Данный блок настройки параметров будет доработан ко второй итерации виджета. На данный момент недоступен.|warn}}

=== '''Редактора навигации''' ===
При нажатии на кнопку «Редактор навигации» открывается новая страница, в которой пользователь увидит:
* список этажей (если этажи были преднастроены) — отображаются добавленные этажи с описанием;
* кнопку «Добавить этаж» — кнопка, позволяющая добавить этаж в список. Заполнение параметров для этажа будет описано в следующем разделе;
* кнопка «Сохранить карты» — позволяет сохранить настроенные этажи и карты;
* кнопка «Выйти из редактора» — позволяет вернутся обратно к главному экрану без сохранения изменений.
[[File:Страница_редактора_навигации изм.png|thumb|center| Пример отображения управления этажами|800px]]
{{Note|Любой добавленный этаж можно удалить кликнув на иконку в виде корзины.
[[File:Удаление_этажа.png|thumb|center| Пример отображения иконки для удаления этажа|800px]]|warn}}
===='''Процесс настройки этажа в виджете''' ====
Если пользователь добавил новый этаж то в правой части экрана настроек виджета появится набор полей, который будут первым шагом настройки навигации. В список полей которые необходимо заполнить входят:
* название этажа — проставить числовое значение этажа;
* список кабинетов — поле для текстового ввода названия типов кабинетов доступных на этаже. Разделителем для поля является запятая (",");
* список категории комнат — поле для текстового ввода названия типов комнат доступных на этаже. Разделителем для поля является запятая (",");
* список общих категорий комнат — поле для текстового ввода названия категорий комнат доступных на этаже. Разделителем для поля является запятая (",").
{{Note|После заполнения всех полей необходимо нажать на кнопку «Далее» чтобы перейти к следующему шагу|warn}}
[[File:Поля_для_этажа.png|thumb|center| Пример отображения полей для создания этажа|800px]]
Следующим этапом будет добавление различных типов SVG-иконок отображающих помещения. Если иконки отсутствуют то будет текст категории помещения и рядом с ним кнопка «Загрузить изображение», которое позволит добавить SVG-файл из устройства в личный кабинет
{{Note|После заполнения всех полей необходимо нажать на кнопку «Далее» чтобы перейти к следующему шагу. Если необходимо вернуться на предыдущий шаг нажмите на кнопку «Назад».|warn}}
[[File:Загрузка_иконки.png|thumb|center| Пример отображения страницы с загруженными SVG-иконками|800px]]
Далее переходим на следующую страницу настройки. Здесь будет вестись работа со схемами этажа. Если она есть - пользователь сможет ее выбрать. Если схем отсутствует, ее можно добавить кликнуть по кнопке «Выбрать схему этажа».
{{Note|После заполнения всех полей необходимо нажать на кнопку «Далее» чтобы перейти к следующему шагу. Если необходимо вернуться на предыдущий шаг нажмите на кнопку «Назад».|warn}}
[[File:Выбор_схемы_этажа_.png|thumb|center| Пример отображения кнопки «Выбрать схему этажа»|800px]]
Последним этапом будет многоуровневая настройка схемы самого этажа, которые будут расположены в правом верхнем углу. Здесь пользователь сможет:
* настроить сетку — отображает параметры, которые позволяют управлять сеткой: количество строк сетки, количество столбцов сетки, размер клеток, смещение по оси X, смещение по оси Y. Все параметры настраиваются ползунками;
[[File:Настройка_сетки.png|thumb|center| Пример отображения настроек сетки|800px]]
* установка стен — с помощью кликов по сетке позволяет построить стены на ячейках сетки. Закрашенный квадрат показывает что блок стены для виджета установлен;
* смещение точек — отображает смещение точек в виджете по осям X и Y. Смещение можно настроить значением в пикселях (px);
[[File:Смещение_точкт.png|thumb|center| Пример отображения смещение точек на карте|800px]]
* установка постамата — с помощью клика на карте позволяет установить маркер постамата с виджетом от которого будет строиться маршрут;
* установка лестниц — даёт возможность обозначить лестницу на карте. При выставлении лестницы всплывает модальное окно, в котором определяется статус лестницы как альтернативный маршрут. Нужно выбрать назначение лестницы - по ней можно покинуть этаж или вернуться;
[[File:Модальное_окно_для_лестницы.png|thumb|center| Пример отображения работы с лестницами на карте|800px]]
* установка кабинетов — при наличии свободных слотов для кабинетов позволяет выставить их на карте и заполнить информацию о кабинетах.
[[File:Работа_с_кабинетом.png|thumb|center| Пример отображения настройки кабинетов |800px]]
{{Note|Завершив настройку всех параметров пользователю необходимо нажать на кнопку «Сохранить» на экране сетки. Если необходимо вернуться на предыдущий шаг нажмите на кнопку «Назад».|warn}}

== '''Завершение настройки виджета''' ==
После завершения работ по настройке виджета пользователь должен нажать на кнопку «Применить настройки» внизу экрана и еще ниже кликнуть на кнопку «Сохранить».
[[File:Применить_и_сохранить_навигация.png|thumb|center| Пример отображения кнопок для завершения настройки виджета|800px]]
== '''Загрузка и скачивание настроек''' ==
В процессе взаимодействия с настройками виджета пользователь может загрузить или выгрузить настройки виджета. Каждое из указанных действий работает с помощью отдельных иконок в интерфейсе виджета. Иконки расположены в виджете снизу по центру.
[[File:Скачка_и_загрузка_навигации.png|thumb|center| Пример отображения кнопок для загрузки и выгрузки настроек|800px]]
== '''Управление настроенным виджетом''' ==
Как только виджет будет настроен пользователь сможет проверить его работу. Необходимо выбрать объект и посмотреть маршрут на карте. В виджете кроме маршрута также появится подсказка с описанием действия.
[[File:Подсказка_с_описания.png|thumb|center| Пример отображения маршрута до нужного объекта|800px]]
{{Note|Если объект находится на другом этаже то в подсказке отобразится указанием какую лестницу или лифт использовать чтобы добраться до конечной точки назначения.
[[File:Подсказка_перехода.png|thumb|center| Пример отображения подсказки с указателями перехода на другой этаж|800px]]|warn}}
При выборе фильтров по объектам доступна два типа отображения:
* если объект на карте один до него строится маршрут на карте;
* если объектов поиска на этаж несколько они подсвечиваются внутри виджета.

== '''Добавление настроенного виджета в трансляцию''' ==
Чтобы полностью ознакомиться с работой данной функциональности, пользователю необходимо запустить трансляцию с расписанием и добавить в качестве контента данный виджет. Чтобы ознакомиться с описанными ранее шагами по созданию трансляции и расписания рекомендуется просмотреть следующие статьи из Wiki SmartPlayer:
* [[Раздел "Устройства"]]
* [[Раздел "Контент на устройства"]]
* [[Раздел "Трансляции"]]
* [[Раздел "Расписание"]]
== '''Видеоинструкция''' ==
[https://vk.com/video-227547238_456239103 Инструкция по работе с виджетом навигации]
== '''Дополнительная информация''' ==
Если данная статья не помогает использовать функционал по назначению или после прочтения остаются вопросы, их можно озвучить в разделе "Обсуждения" вверху страницы.
[[File:Обсуждение_виджета_навигаций.png|thumb|center| Пример отображения вкладки «Обсуждения» на wiki-странице |800px]]
Также дополнительную информацию можно узнать на странице [[Как взаимодействовать пользователю с разделом "Обсуждения"]]