Движок и API

Движок сочетает декларативные HTML-атрибуты с JavaScript API презентации.

Атрибуты слайда

Назначение	Синтаксис
Перейти на слайд	data-go="slide-id"
Открыть локальный ресурс	data-asset="assets/file.pdf"
Записать клик	data-track="event-id"
Описание события	data-desc="Описание"
Подставить клиента	{{viewer.name}}

<button data-go="results" data-track="open_results">Результаты</button>
<button data-asset="assets/catalog.pdf">Каталог PDF</button>
<p>Материалы для <span>{{viewer.name}}</span></p>

Относительные URL в src, href, poster, srcset и CSS url() внутри HTML переписываются на локальные URL установленного пакета.

API движка

После запуска Viewer экземпляр доступен как window.pulse:

pulse.go('results');
pulse.next();
pulse.prev();
pulse.setViewer('Компания А');

pulse.onNavigate(({ i, mountedCount, total }) => {});
pulse.onTick(({ elapsed }) => {});

setViewer() обновляет {{viewer.name}} в смонтированных слайдах. В PWA это значение автоматически берётся из поля «Название клиента».

API пакета

entry.js может экспортировать setup(api). Viewer вызывает его до запуска презентации.

export function setup(api) {
  const logo = api.assetUrl('assets/logo.svg');

  api.track({
    id: 'package_ready',
    description: 'Код презентации инициализирован',
    data: { logo }
  });

  console.log(api.package.id, api.package.version);
}

Поле	Назначение
api.assetUrl(path)	получить локальный URL файла из пакета
api.track(event)	добавить собственное событие в аналитику
api.package	неизменяемые id и version текущего пакета

Аналитика показа

Движок записывает просмотр слайда, время нахождения и клики по data-track. После кнопки «Завершить» PWA формирует один пакет событий и кладёт его в IndexedDB. Каждая запись привязана к точной версии .pulse; отсутствие сети не влияет на презентацию.

Отправка outbox в backend и кабинет отчётов пока не реализованы.