4.2. Место в системе
Для демонстрации места компонента в системе видеонаблюдении спроектирована схема взаимодействия модулей системы видеонаблюдения.
Рисунок 4.2.1 – Схема взаимодействия модулей системы видеонаблюдения
4.3. Описание структур данных
В процессе деятельности систем, интегрируемых в систему видеонаблюдения, формируются большие объемы информации, и поэтому целесообразно применение баз данных.
Для наглядного представления физического хранения информации была разработана информационная модель.
Рисунок 4.3.1 – Информационная модель
4.4. Описание компонента
Компонент является веб-компонентом Wasaby Framework и является частью веб-компонента видеоплеера.
Программа работает в интерактивном режиме, основанном на тесном взаимодействии с конечным пользователем. Для использования функциональных возможностей программы необходимо задействовать соответствующие элементы интерфейсной части программы.
Функции, выполняемые программой
Компонент является частью веб-компонента видеоплеера и обладает следующими характеристиками:
- возможность просмотра событий системы видеонаблюдения в виде записей таблицы;
- возможность просмотра событий на временной шкале видеоплеера в виде сегментов, соответствующие событиям системы видеонаблюдения, согласно действующей цветовой схеме.
Условия, необходимые для выполнения программы
Требуется наличие любого из перечисленных интернет-браузеров последних версий: Google Chrome, Yandex Browser, Mozilla Firefox, Safari, Спутник, Opera, Microsoft Edge.
4.5. Компонент Wasaby
Контрол (компонент) — это изолированная часть функционала, которую можно использовать повторно при разработке интерфейса. В файловой структуре представляет собой минимум два файла: TypeScript-модуль, где описана логика, и WML-шаблон, где описано представление.
Контролы можно вкладывать друг в друга, образуя дерево, где есть родительские и дочерние элементы. Создать новый контрол можно через композицию других контролов.
Разработка контрола начинается с описания класса, который должен наследоваться от базового класса (UI/Base:Control). Описание класса помещается в отдельном TypeScript-модуле.
Неотъемлемой частью любого контрола является его визуальное отображение, которое описывают в шаблонах. В Wasaby для шаблонов создано собственное расширение файла — WML (Wasaby Markup Language). Для импорта шаблона используют директиву import, а импортированный шаблон передают в свойство _template. Для описания визуального отображения контрола применяется декларативный подход. Достаточно указать в каком месте шаблона следует вывести данные, а дальнейшую работу выполнит ядро Wasaby.
Выделяются три основных фазы жизненного цикла: создание, обновление и уничтожение. В рамках каждой фазы выполняются методы, называемые хуками жизненного цикла. Хуки можно определить в описании класса контрола.
Рисунок 4.5.1 – Схема жизненного цикла компонента Wasaby
Опции — это объект, в котором хранятся параметры, переданные при инициализации контрола. Опции доступны только на чтение, и менять их можно только через родительский контрол. Такое ограничение введено для того, чтобы избежать излишнего усложнения кода. Изменение объекта опций подобно изменению аргументов, переданных в функцию. Опции должны меняться только в том случае, если родитель изменил параметры контрола. Wasaby по умолчанию синхронизирует изменения опций в одном направлении — из родительского контрола к дочерним. Для создания двусторонней синхронизации используют директиву bind.
Каждый контрол хранит некоторое внутреннее состояние, представленное набором свойств. В каждый момент времени контрол может отличаться своим состоянием. Состояние контрола используется для работы контрола и организуется разработчиком. Свойство контрола становится реактивным, когда используется в шаблоне. Если значение свойства изменяется, Wasaby автоматически запрашивает его перерисовку в шаблоне.