# Веб-пульт управления квадрокоптером

При подключении к Клеверу по Wi-Fi (`CLEVER-xxxx`) по адресу [192.168.11.1:7070](http://192.168.11.1:7070) открывается web-приложение – пульт управления квадрокоптером.

Для работы пульта необходимо убедиться, что в launch-файле Клевера (`~/catkin_ws/src/clever/clever/launch/clever.launch`) включены аргументы `web_server` и `rosbridge`.

```xml
<arg name="rosbridge" default="true"/>
```

```xml
<arg name="web_server" default="true"/>
```

При изменении launch-файла необходимо перезапустить сервис `clever`:

```bash
sudo systemctl restart clever
```

## Стартовый экран

При загрузке приложения, автоматически устанавливается соединение с сервером ROS.

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

![](assets/webrc_no_connection.png)

После установления соединения интерфейс разблокируется.

![](assets/webrc.png)

В интефейсе доступны:

* Верхняя \(информацинно-командная\) панель
* Уведомления
* Контролы
* HUD

## Верхняя панель

Здесь расположены индикаторы и кнопки действий.

* кнопка-индикатор уведомлений 
  * отображает иконку типа последнего уведомления
  * анимируется при наличии непрочитанных уведомлений
  * открывает панель уведомлений
* индикатор уровня Wi-Fi сигнала \(пока нет возможности знать\)
* индикатор уровня заряда батареи \(пока нет возможности знать\)
* кнопка **DISARM** на случай необходимости отключить винты в полёте
* кнопка-индикатор записи видео при записи светится красным и показывает тайминг
  ⚠️ _Нет API для включения/выключения записи_
* кнопка переключения камер. Если на дроне больше одной камеры, позволяет переключиться между ними.
  ⚠️ _Нет API для получения данных о количестве камер на дрное_
* кнопка сохранения текущего кадра на камере
  ⚠️ _Нет API, поэтому пока что эта кнопка отвечает за включение/выключение трансляции с камеры_

## Уведомления 🔔

* всплывающие – самые важные уведомления всплывают на месте верхней панели
  * нажатие по уведомлению открывает ленту уведомлений
  * можно смахнуть проведя по уведомлению пальцем \(как и с нативным системным уведомлением\)
* панель уведомлений – полноэкранная лента уведомлений в хронологическом порядке
  * объединяет одинаковые сообщения в один, с указанием количества повторений
  * открывается нажатием на всплывающее уведомление или кнопку уведомлений на верхней панели

![](assets/webrc_notifications.png)

## Контролы 🎮

Бандл контролов – обёртка над несоклькими контроллами, решающая общие над ними задачи.

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

### Основной бандл

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

* левый – altitude и yaw
* правый – pitch и roll.

Каждому стику можно задать жесты-экшены, которые будут активироваться при уведении пальца за границу максимального значения в указаной стороне стика. **\(ссылка на доку по стику\)**

#### Действия

При касании контролов запрашивается режим OFFBOARD.

⚠️ _Не запрашивается когда дрон уже в режиме OFFBOARD или когда активен хотя бы один жест._

![](assets/webrc_offboarding.gif)

Все этапы переключения дрона в режим OFFBOARD отражаются соответствующим цветом контрола

* красный – не удалось запросить режим, ошибка при отправке сообщения
* жёлтый – режим запрошен, ждём когда дрон начнёт слать **mode: OFFBOARD**
* зелёный – успешно переключился в OFFBOARD

В режиме OFFBOARD бандл публикует в топик **/mavros/setpoint\_raw/local** данные со стиков соответственно:

* левый
  * по горизонтали – **yaw\_rate**
  * по вертикали – **z** \(altitude\)
* правый
  * по гризонтали – **x** \(roll\)
  * по вертикали – **y** \(pitch\)

Жесты на левом стике

* ARM – в правом нижнем углу
* DISARM – в левом нижнем углу

![](assets/webrc_arm_disarm.gif)

Бандл так же следит за тем, что бы данные в топик публиковались непрерывно. Если пользователь остановил пальцы или отпустил контролы, то бандл продолжит публиковать данные с некой минимальной периодичностью, во избежание выпадания дрона из OFFBOARD.

## Head-Up Display

Расположен по центру экрана и отображает текущую скорость\(сверху экрана\) и высоту\(снизу экрана\).

Так же, между скоростью и высотой можно выводить любую другую информацию \(например, режимы дрона или данные со стиков\).

