Интеграция SmartPlayer с ivideon/en: различия между версиями

Материал из SmartPlayer
(Новая страница: «=== '''Adding a device to the ivideon personal account''' === On the main page, the user will be prompted to add a device via a special button in the center of the screen - "Connect Device." thumb|center| Example of the "Connect Device" button displayed in the ivideon user personal account|800px By clicking the "Connect Device" button, the user will open a list where they need to select the desired devic...»)
(Новая страница: «=== '''Event Display in the ivideon Personal Account''' === After configuring the camera's web interface in the ivideon personal account, events will begin to appear for the user. thumb|center| Example of event display in the ivideon personal account|800px In the "Events" section of the personal account, the user needs to filter events using the provided filters. File:Строка_фильтров.png|thumb|...»)
Строка 53: Строка 53:
{{Note|'''Limitation:''' The camera must support the setting for detecting object crossing of a zone; otherwise, the previously mentioned "Enable motion detection" setting may be unavailable in the camera's web interface. An example of a camera that supports the zone-crossing detection setting can be found [here](https://www.dssl.ru/products/ds-2cd2183g2-is-2-8-mm-ip-kamera/). ivideon technical support specialists are always available to assist users with camera settings.|warn}}
{{Note|'''Limitation:''' The camera must support the setting for detecting object crossing of a zone; otherwise, the previously mentioned "Enable motion detection" setting may be unavailable in the camera's web interface. An example of a camera that supports the zone-crossing detection setting can be found [here](https://www.dssl.ru/products/ds-2cd2183g2-is-2-8-mm-ip-kamera/). ivideon technical support specialists are always available to assist users with camera settings.|warn}}
Some cameras also offer the option to record and store logs. For this purpose, the camera is equipped with the ability to insert a USB-flash drive. Logs can also be viewed in the camera's web interface (this feature is not available on all devices).
Some cameras also offer the option to record and store logs. For this purpose, the camera is equipped with the ability to insert a USB-flash drive. Logs can also be viewed in the camera's web interface (this feature is not available on all devices).
<div lang="ru" dir="ltr" class="mw-content-ltr">
=== '''Event Display in the ivideon Personal Account''' ===
=== '''Отображение событий в личном кабинете ivideon''' ===
After configuring the camera's web interface in the ivideon personal account, events will begin to appear for the user.
После настройки web-интерфейса камеры в личном кабинете ivideon пользователю начнут приходить события.
[[File:Список_событий ivideon.png|thumb|center| Example of event display in the ivideon personal account|800px]]
[[File:Список_событий ivideon.png|thumb|center| Пример отображения событий в личном кабинете ivideon|800px]]
In the "Events" section of the personal account, the user needs to filter events using the provided filters.
В разделе личного кабинета "События" пользователю необходимо отсортировать события с помощью фильтров.
[[File:Строка_фильтров.png|thumb|center| Example of event filters in the ivideon personal account|800px]]
[[File:Строка_фильтров.png|thumb|center| Пример отображения фильтров событий в личном кабинете ivideon|800px]]
From the available filters, the user needs to use the event type filter:
Из имеющихся фильтров пользователю необходимо использовать фильтр по типу события:
# Line crossing
# Пересечении линии
# Entry into a zone
# Вход в зону
After applying the filter, only the filtered events described above will be displayed in the personal account.
После применения фильтра в личном кабинете будут отображаться только отсортированные события, описанные выше.
[[File:Типы_событий.png|thumb|center| Example of filtered events in the ivideon personal account|800px]]
[[File:Типы_событий.png|thumb|center| Пример фильтрации событий в личном кабинете ivideon|800px]]
{{Note|'''Limitation:''' If one of the events listed above occurs ("Line crossing" or "Entry into a zone"), it is registered in the personal account. The event registration interval is one event every five minutes. If an event (such as a change in the color of one pixel in the camera's zone) occurs within five minutes of the timer starting, the five-minute timer will reset and start counting again. However, the event will not be sent to the ivideon personal account because the initial five-minute timer has not completed. As a result, the event that the SmartPlayer broadcast should respond to will not be triggered. The five-minute timer limitation cannot be disabled.<br>
{{Note|'''Ограничение:''' если одно из событий указанных выше произошло ("Пересечение линии" и "Вход в зону") то приходит в личный кабинет. Промежуток регистрации события - одно событие в течение пяти минут. Если после запуска таймера отсчета в пять минут у камеры произойдет событие (изменения одного цвета пикселя в зоне камеры) то пятиминутный таймер сбросится и начнет отсчет по новой. При этом событие в личный кабинет ivideon не придет, так как изначальный таймер в пять минут не закончил свой отсчет. Следовательно, и событие, на которое должна среагировать трансляция в SmartPlayer не приходит. Ограничение на длительность таймера в пять минут отключить невозможно.<br>
It's important to understand that even if the event is not sent to the ivideon personal account, the system still detects and counts it. This means that the five-minute timer will refresh and start again. |warn}}
Также нужно понимать, что хоть событие и не пришло в личный кабинет ivideon, но система его видела и засчитала. А это значит, что таймер в пять минут снова обновится и начнет отсчет. |warn}}
== '''Integration with SmartPlayer''' ==
== '''Интеграция со SmartPlayer''' ==
For integration with SmartPlayer, the user needs to perform three actions in the SmartPlayer personal account:
Для интеграции со SmartPlayer пользователю в личном кабинете SmartPlayer необходимо сделать три действия:
# Add the camera to the desired device
# Добавить на нужное устройство камеру
# Create an API key in the ivideon personal account and use it to connect to SmartPlayer
# Создать API ключ в личном кабинете ivideon и с его помощью подключиться к SmartPlayer
# Prepare the server application and broadcast(s) with correctly configured events
# Подготовить серверное приложение и трансляцию/-ии с правильно настроенными событиями
Each of these points will be detailed below.
Все эти пункты подробнее будут изложены ниже.
</div>
<div lang="ru" dir="ltr" class="mw-content-ltr">
<div lang="ru" dir="ltr" class="mw-content-ltr">
== '''Добавление камеры на устройство используемое в трансляции SmartPlayer ''' ==
== '''Добавление камеры на устройство используемое в трансляции SmartPlayer ''' ==

Версия от 15:19, 23 октября 2024

Situation Description

This instruction is intended to provide information on the proper setup of the ivideon service, as well as information for its integration with the SmartPlayer platform.

Usage Scenario for Integration with ivideon

To understand how the integration between ivideon and SmartPlayer will occur, the following general interaction scenario will be used:

  • Register/log in to the ivideon personal account
  • Add and configure the camera in the ivideon personal account
  • Obtain an API key for integration with SmartPlayer
  • Log in to the SmartPlayer personal account
  • Create a broadcast in SmartPlayer with two pages
  • Page #1 plays background content (idle mode)
  • Page #2 plays content that will be triggered by the motion detection camera
  • After the content from page #2 is played, it returns (switches back) to page #1

ivideon Setup

If you encounter problems setting up the personal account and devices in ivideon, it is recommended to contact ivideon's technical support specialist.

User Registration/Authorization in ivideon Service

The first step for the user is to register in the ivideon service. You can register by following this link. To start the registration process, the user needs to follow the link and click on the "Register" button.

Example of the "Register" button displayed on the ivideon service page

After clicking, a new window will open with a list of information that needs to be provided by the user. This list includes the following information:

  • Name
  • Email address (E-Mail)
  • Phone number
  • Password
  • Checkbox (checkmark) to accept the terms of service and privacy policy
Example of the required information for registration in the ivideon service
If the user already has an account in the ivideon service, they need to log in.

After logging into ivideon, the user will be presented with the main page of their personal account.

Example of the main page of the user's personal account in the ivideon service

Adding a device to the ivideon personal account

On the main page, the user will be prompted to add a device via a special button in the center of the screen - "Connect Device."

Example of the "Connect Device" button displayed in the ivideon user personal account

By clicking the "Connect Device" button, the user will open a list where they need to select the desired device. In this case, it's an IP camera.

Example of the list of available devices for connection in the ivideon user personal account

Next, the user is advised to choose the connection method for the IP camera. ivideon technical support specialists strongly recommend using a wired "Ethernet" connection.

Example of the types of camera connections in the ivideon user personal account

At this stage, the user will be asked to provide the device's serial number. If the user does not have this information, it is possible to register the device using the MAC address. By clicking on the special line "Use MAC address," the user will be redirected to a new registration window.

Example of registering a device via serial number and displaying the line for registration via MAC address

In the opened registration window, the user needs to enter the MAC address of the device, which can be found on the device itself (IP camera) or on the box in which the device was packaged upon purchase.

Example of registering a device via MAC address

After entering the MAC address and clicking the "Continue" button, the user's camera will be registered and displayed in their personal account.

Using the camera's web interface for configuration

Manufacturers of various cameras provide an internal interface for configuring the camera. To access it, a certain sequence of steps must be followed.
First, the user needs to go to the "Settings" section in the ivideon personal account and proceed to the "Security" category.

Example of the "Settings" section and the "Security" category in the ivideon personal account

In this category, the user can change the camera password and set the desired one if they do not know it.

Example of the line for changing the device password

Next, proceed to the camera information section. To do this, the user needs to click on the three vertical dots in the window of the registered camera and open the list of options for interacting with the camera. In this list, the user selects the line "Camera Information."

Example of the "Camera Information" line in the ivideon personal account

In the opened window, information about the camera will be provided. At the bottom of the window, there will be the required block "IP Address" with the line "eth 0". The needed IP address will be listed in this line.

Example of the camera's IP address displayed in the ivideon personal account

This IP address is copied and pasted into the browser's address bar to open the camera's settings interface. The opened page will require login credentials for the camera. After this, in the camera's web interface, go to the "Configuration" section and enable the setting or checkbox for "Enable motion detection."

Limitation: The camera must support the setting for detecting object crossing of a zone; otherwise, the previously mentioned "Enable motion detection" setting may be unavailable in the camera's web interface. An example of a camera that supports the zone-crossing detection setting can be found [here](https://www.dssl.ru/products/ds-2cd2183g2-is-2-8-mm-ip-kamera/). ivideon technical support specialists are always available to assist users with camera settings.

Some cameras also offer the option to record and store logs. For this purpose, the camera is equipped with the ability to insert a USB-flash drive. Logs can also be viewed in the camera's web interface (this feature is not available on all devices).

Event Display in the ivideon Personal Account

After configuring the camera's web interface in the ivideon personal account, events will begin to appear for the user.

Example of event display in the ivideon personal account

In the "Events" section of the personal account, the user needs to filter events using the provided filters.

Example of event filters in the ivideon personal account

From the available filters, the user needs to use the event type filter:

  1. Line crossing
  2. Entry into a zone

After applying the filter, only the filtered events described above will be displayed in the personal account.

Example of filtered events in the ivideon personal account
Limitation: If one of the events listed above occurs ("Line crossing" or "Entry into a zone"), it is registered in the personal account. The event registration interval is one event every five minutes. If an event (such as a change in the color of one pixel in the camera's zone) occurs within five minutes of the timer starting, the five-minute timer will reset and start counting again. However, the event will not be sent to the ivideon personal account because the initial five-minute timer has not completed. As a result, the event that the SmartPlayer broadcast should respond to will not be triggered. The five-minute timer limitation cannot be disabled.
It's important to understand that even if the event is not sent to the ivideon personal account, the system still detects and counts it. This means that the five-minute timer will refresh and start again.

Integration with SmartPlayer

For integration with SmartPlayer, the user needs to perform three actions in the SmartPlayer personal account:

  1. Add the camera to the desired device
  2. Create an API key in the ivideon personal account and use it to connect to SmartPlayer
  3. Prepare the server application and broadcast(s) with correctly configured events

Each of these points will be detailed below.

Добавление камеры на устройство используемое в трансляции SmartPlayer

Чтобы получать информацию об изменении состоянии камеры пользователю необходимо подключить ее к устройство, которое он будет использовать в трансляции. Данное действие можно сделать в личном кабинете SmartPlayer.

Предварительно устройство, к которому будет привязана камера, должно быть добавлено в личный кабинет. Оно будет отображено в разделе "Устройства".

Изначально пользователю необходимо перейти в раздел "Устройства" личного кабинета.

Пример отображения раздела "Устройства" в личном кабинете SmartPlayer

Далее ему нужно найти нужное устройство, кликнуть по нему и в правом тулбаре перейти в раздел "Настройки".

Пример отображения раздела "Настройки" в списке настроек устройства

В разделе настроек ему нужно найти категорию - "Камера" и открыть данную категорию.

Пример отображения категории "Камера" в настройках устройства

Открыв категорию "Камера" пользователю необходимо будем нажать на кнопку "Добавить камеру" и заполнить следующие поля:

  • Название камеры - ввести название камеры
  • Идентификатор камеры - получить его можно в личном кабинете ivideon, в разделе "Информация о камере" (ID камеры)
С помощью кнопки "Добавить камер" пользователь может добавить несколько камер к одному устройству.
Пример отображения ID камеры в личном кабинете ivideon

Прием данных в SmartPlayer по API ключу от ivideon

Чтобы подключиться к SmartPlayer и получать события от ivideon пользователю необходимо получить API - ключ внутри личного кабинета ivideon. После получения API-ключа пользователю нужно будет добавит его в настройках личного кабинета SmartPlayer.

Создание API-ключа в личном кабинете ivideon

Чтобы получить API-ключ пользователю ivideon необходимо иметь специальный тариф.

Чтобы получить API-ключ пользователю нужно перейти в раздел "Настройки" личного кабинета ivideon и перейти в категорию "Доступ и безопасность".

Пример отображения раздела "Настройки" и категории "Доступ и безопасность" в личном кабинете ivideon

В открывшейся странице пользователю необходимо найти блок "Для разработчиков" и напротив строки "Ключи доступа к API" нажать кнопку "Открыть".

Пример отображения функционала для создания API-ключа в личном кабинете ivideon

Открыв новую страницу, пользователь должен создать новый API ключ. Для этого ему необходимо в правом верхнем углу нажать на кнопку "Создать ключ". Также можно удалить все ключи на этой странице нажав на кнопку "Удалить все ключи".

Пример отображения кнопки "Создать ключ"

В открывшемся окне обязательно нужно ввести имя ключа и нажать на кнопку "Продолжить". Кнопка "Продолжить" будет неактивна пока пользователь не введёт название ключа.

Пример отображения кнопки "Продолжить" и строки для ввода названия ключа

Следующее окно отобразит пользователю новый ключ, значение которого необходимо скопировать, нажав на специальную иконку рядом со строкой, в которой указано значение. Также необходимо активировать чекбокс (галочку) "Я скопировал ключ". Иначе пользователь не сможет завершить создание API ключа, потому что кнопка "Готово" будет неактивна.

Пример отображения окна с созданным API-ключом

Нажав на кнопку "Готово" пользователя вернет на страницу со списком ключей, где будет отображен новый ключ, который будет использоваться для подключения в SmartPlayer.

Пример отображения созданного API-ключа

Применение API-ключа для интеграции со SmartPlayer

Полученный API-ключи в личном кабинете ivideon пользователь должен добавить в личный кабинет SmartPlayer. Для этого пользователю необходимо авторизоваться в личном кабинете SmartPlayer и перейти в раздел "Настройки".

Пример отображения раздела "Настройки" в личном кабинете SmartPlayer

В разделе "Настройки" пользователю необходимо перейти в блок "Интеграции".

Пример отображения Блока "Интеграции" в настройках

В данной блоке пользователю необходимо настроить следующие параметры:

  • Активировать чекбокс (галочку)
  • Ввести значение API-ключа (должен быть скопирован из личного кабинете ivideon)
  • Выбрать тип событий, которые будут использоваться в трансляции. В текущем кейсе будут использоваться только значения - "пересечения линии" и "вход в зону".
Пример отображения заполняемых параметров в блоке "Интеграции"

Создание трансляции для проигрывания в SmartPlayer с нужными настройками

Чтобы принимать данные с сервиса ivideon и заставить правильно реагировать на эти событие SmartPlayer пользователю необходимо создать трансляцию со специально настроенными параметрами.

Данный функционал доступен на следующих версиях клиентских приложения SmartPlayer:
  • Windows - ver. 2.41.7
  • Linux - ver. 2.41.7
  • Android - ver. 1.74.2 и выше.
Также на данный момент не реализован на клиентских приложения Web OS и Tizen OS

Подготовка серверного приложения:

  • Создать личный кабинет на нужном серверном приложении. При создании личного кабинета необходимо выставить роль - "admin" с видеоаналитикой
  • Вручную создать трансляцию в личном кабинете и настроить переходы для нужного контента и значениями событий (действиями для событий)

Программная часть:

  • При реализации программной части необходимо использовать "socket.io v.2". Данное решение доступно по ссылке

Личный кабинет:

  • Взаимодействие с личным кабинетом происходит по протоколу: http(s) и webSocket. Информация о "socket.io v.2" указана выше.

Информация по протоколам:

  • restApi - используется в большинстве случаев для авторизации и работы с файлами
  • Socket.io - используется большинством методов для работы с личным кабинетом

Авторизация:

  • Информация о получении необходимых токенов можно получить по ссылке
  • Информация о корректной настройки для "join" можно получить по ссылке

Получение трансляции:

  • С помощью определенного события можно получить список трансляций. Информация о получении события доступна по ссылке.

После получения данных необходимо будет выбрать нужное событие. У этого объекта необходимо взять ID, который будет подставлен в событие, описанное ниже.
Отправка ответного события:

  • Следующим шагом отправляется другое событие, доступное по ссылке, с нужными параметрами.

Событие с правильными параметрами должно переключать страницы в эфирной сетке.

Создание трансляции в личном кабинете

После настройки серверной части пользователь сможет воспользоваться подготовкой событий для воспроизведения их в трансляции.
Чтобы начать работу с событиями в трансляции пользователю необходимо сначала авторизоваться в личном кабинете.
Следующим шагом пользователю найти в личном кабинете раздел "Трансляции" и выбрать категорию "Создать".

Пример отображения раздела "Трансляции" и категории "Создать" в личном кабинете

После нажатия по категории "Создать" пользователю откроется новое окно, в котором будет показан весь интерфейс для создания трансляции.

Пример отображения интерфейса создания трансляции в личном кабинете

Далее пользователю необходимо в зависимости от своих задач создать нужно количестве страниц. Данное действие делается в левой нижней части экрана по специальной иконке в виде большого символа "+".

Пример отображения готовых страниц и иконки для добавления новых страниц в личном кабинете

Создав нужное количество страниц, пользователь должен на каждой странице выбрать зону для контента. Это делается по специальной иконке в виде прямоугольника вверху экрана.

Пример отображения иконки создания зоны для контента

При создании зоны открывается тулбар с настройками зоны, в котором можно настраивать параметры зоны.

Пример отображения тулбара с настройками для зоны

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

Пример отображения иконки для перехода в настройки страницы

В настройках страницы пользователю необходимо найти строку с параметром "Событие" и нажать на иконку в виде "+".

Пример отображения строки с параметром "Событие"

Данное действие откроет новое окно со списком событий для данной страницы.

Настройка события

Проделав действия, описанные ранее пользователю откроется окно с выбором событий. В данном окне будет три доступных варианта:

  1. Распознавание лица
  2. RFID метка
  3. Серверное приложение (нужный вариант)
Пример отображения вариантов событий при создании трансляций

Пользователь выбирает событие "Серверное приложение" и ему добавится новая строка для заполнения "Ключ". В ней необходимо выбрать вариант "По полезной нагрузке".

Пример отображения поля "Ключ" и его значения

Выбрав данный ключ пользователю станет доступна еще одна строка - "Значение". В этой строке пользователь и должен указать одно из специальных значений:

Таблица значений
Название Значение
Пересечение линии ivs.vca.line_detection.event/started
Вход в зону ivs.vca.field_detection.event.enter/started
Пример отображения поля с прописанным значением

После завершения заполнения всех полей в окне пользователю необходимо нажать на кнопку "Сохранить" в центре экрана.

Связанная информация

Для дальнейшего завершения настройки трансляции рекомендуется ознакомиться со следующими Wiki-страницами

Итог

После завершения настройки личного кабинет ivideon, интеграции с серверными приложением SmartPlayer и настройки трансляции с использованием событийной модели в личном кабинете SmartPlayer должно начать функционировать. Данное решение будет проигрывать и изменять контент при любом приближении человека в рамках выбранной и настроенной на камере зоны.

Видеоинструкция

Настройка интеграции ivideon и SmartPlayer

Дополнительная информация

Если данная статья не помогает использовать функционал по назначению или после ее прочтения остаются вопросы можно озвучить данные вопросы в разделе "Обсуждения" вверху страницы.

Пример отображения вкладки "Обсуждения" на wiki-странице

Также дополнительную информацию можно узнать на странице Как взаимодействовать пользователю с разделом "Обсуждения"

Источник — https://wiki.smartplayer.org/index.php?title=Интеграция_SmartPlayer_с_ivideon/en&oldid=14673