Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019) — различия между версиями

Материал из 0x1.tv

(Batch edit: replace PCRE (\n\n)+(\n) with \2)
 
(не показано 19 промежуточных версий этого же участника)
;{{SpeakerInfo}}: {{Speaker|Юрий Сойко}}
<blockquote>
Рассматривается подход к встраиванию демонстрационных версий программного обеспечения в документ для повышения наглядности и интерактивности. Приведены два варианта архитектуры, реализующей данный подход: проброс окон виртуальных машин в веб-документы с отрисовкой на canvas HTML5, и реализация доступа к виртуальной машине через плагин мультимедийной системы GStreamer, с расширением формата образов системы виртуализации QEMU для упрощения интеграции гостевых образов.
</blockquote>

{{VideoSection}}
{{vimeoembed|366004233|800|450}}
<!-- 
{{youtubelink|}} -->
|39Nm0L-rZzo}}
{{SlidesSection}}
[[File:Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf|left|page=-|300px]]

{{----}}

== Thesis ==
===  Система демонстрации виртуализованного ПО на основе HTML-технологий  ===

Архитектура данной системы представлена на рис.:

[[File:ossdevconf2019-soiko-soiko1.png|64px|center|frame|Система на основе HTML-технологий]]

Техническая инфраструктура проекта включает следующие компоненты:

* система виртуализации QEMU (для гарантированной совместимости с ранее сохраненными снапшотами, мы используем задание архитектуры дополнительными параметрами строки запуска и локально собранный QEMU конкретных версий);
* клиент удалённого доступа на JavaScript, соединяющийся с виртуальной машиной по протоколу RFB (VNC) и выводящий изображение на canvas HTML5 (используется проект noVNC в связке с прокси websockify, выполняющим преобразование между RFB и WebSocket);
* JavaScript&quot;=фреймворк, отвечающий за отображение страниц документа и навигацию между ними (TimelineSetter для интерактивного таймлайна, reveal.js для презентационных материалов);
* специализированный HTTP&quot;=сервер в виде скрипта на shell, выполняющий приостановку и снятие с паузы виртуальных машин по мере перелистывания пользователем страниц информационного контента (реагирует на скрипт, привязанный к HTML&quot;=страницам).

Для развертывания и запуска ostimeline предусмотрена система скриптов, выполняющих скачивание и установку локально&quot;=используемых зависимостей, включая требуемые версии QEMU, а также пересборку контента на основе структуры подкаталогов с образами виртуальных машин и страницами информационного контента.

На базе ostimeline развернуты демонстрационные материалы по истории графических настольных и мобильных ОС, виджет&quot;=тулкитов, дистрибутивов GNU/Linux, а также находящийся в активной разработке интерактивный обзор истории текстовых процессоров. Также одним из позитивных побочных эффектов, достигнутых при разработке, было включение в апстрим QEMU интеграции курсора мыши для старинных архитектур, не поддерживающих шину USB (на текущий момент такая опция не реализована ни одной другой системой виртуализации).

===  Система запуска виртуальных машин средствами GStreamer  ===

Среди недостатков предыдущего подхода можно отметить отсутствие монолитности: контент с виртуализованными окружениями по сути представляет собой сложную систему, функционирующую как цельный интерактивный документ благодаря набору скриптов и самостоятельных программных компонентов. Однако ее развертывание и перенос на другие системы достаточно сложны, чтобы воспринимать такой «документ» как самостоятельную единицу, в сравнении с традиционными документами, содержащими нимации и видео.

Для преодоления данного недостатка был применен альтернативный подход, позволяющий трактовать образ виртуальной машины с гостевой ОС как «мультимедийный файл», проигрываемый «кодеком», использующим систему виртуализации (QEMU). На первый взгляд это решение может показаться неочевидным; однако интерактивные элементы присутствуют в медиа&quot;=файлах в течение долгого времени (например, меню DVD). Поэтому в архитектуру существующих систем воспроизведения видео заложены возможности в том или ином виде реагировать на действия пользователя.

Экспериментальная реализация была построена нами в виде плагина мультимедийного фреймворка GStreamer.


[[File:ossdevconf2019-soiko-soiko2.png|640px|center|frame|Система на основе GStreamer]]

Разработанный плагин выполняет следующие функции:

* вывод изображения экрана гостевой ОС в медиа&quot;=плеер;
* подключение к QEMU через сокет;
* регистрацию событий (движений мыши и нажатий клавиш) пользователя и передачу их в монитор QEMU.

При этом формат образов QEMU Qcow2 регистрируется в системе в качестве еще одного типа MIME.

[[File:ossdevconf2019-soiko-soiko3.png|640px|center|frame|Интерпретация образов виртуальной машины в качестве видео-контента]]

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

Файл образа Qcow2 организован в виде кластеров фиксированного размера, как для мета-данных образа, так и для данных гостевой системы (разделов диска и снапшотов). В первом кластере находится файловый заголовок, содержащий после фиксированной части секцию расширений, в конец которой и было добавлено собственное расширение, хранящее строку запуска. Помимо плагина GStreamer, была также разработана служебная утилита для сохранения (обновления) строки запуска в образе и просмотра, при ее наличии.

Текущая реализация плагина является экспериментальной; в частности, на данный момент не решена проблема поддержки формата стандартными медиа&quot;=плеерами (без их перекомпиляции), а также остается открытым вопрос включения Qcow2 в мультимедийные контейнеры (mkv).

{{----}}
[[File:{{#setmainimage:Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019)!.jpg}}|center|640px]]
{{LinksSection}}
<!-- <blockquote>[©]</blockquote> -->
{{vklink|1427}}                                          
{{fblink|2412651168987890}}                                          

<references/>

[[Категория:OSSDEVCONF-2019]]
[[Категория:Draft]]
[[Категория:Open-source]]СПО в образовании]]
[[Категория:Документирование]]
[[Категория:Юзабилити]]
{{stats|disqus_comments=1|refresh_time=2021-08-31T17:54:43.895013|vimeo_plays=40|youtube_comments=0|youtube_plays=68}}

Текущая версия на 12:22, 4 сентября 2021

Докладчик
Юрий Сойко.jpg
Юрий Сойко

Рассматривается подход к встраиванию демонстрационных версий программного обеспечения в документ для повышения наглядности и интерактивности. Приведены два варианта архитектуры, реализующей данный подход: проброс окон виртуальных машин в веб-документы с отрисовкой на canvas HTML5, и реализация доступа к виртуальной машине через плагин мультимедийной системы GStreamer, с расширением формата образов системы виртуализации QEMU для упрощения интеграции гостевых образов.

Видео

on youtube

Презентация

Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019).pdf

Thesis

Встраивание в электронный документ фреймов, содержащих «живую» демонстрацию описываемого в документе программного обеспечения, лежит в русле увеличения медийной насыщенности и интерактивности обучающих и/или информационных материалов, что в свою очередь эффективно сказывается на наглядности и усваиваемости материала. К сожалению, хотя вычислительные ресурсы современных компьютеров часто позволяют использовать подобное совмещение, существующие системы виртуализации оказались не готовы к подобному применению, и в результате в информационных материалах можно встретить лишь фрагментарные элементы «живой» демонстрации, а в основном — более традиционные мультимедийные средства: статическую графику, анимацию и видео.

Наиболее приближен к решению данной задачи ряд веб-проектов, демонстрирующих операционные системы и программное обеспечение прошлых лет на экране, встроенном в Интернет-страницу. Характерный пример – http://oldweb.today, посвященный истории старинных веб"=браузеров и построенный на основе систем контейнерной виртуализации. Также существует ряд проектов, использующих для демонстрации старинного ПО для DOS эмулятор этой операционной системы, написанный на JavaScript. Однако все проекты подобного рода разработаны как специализированные системы, и несмотря на открытые коды, применение их наработок в качестве универсальной платформы для интеграции виртуализованного ПО в электронные документы по меньшей мере затруднено.

Аналогичная задача решалась нами в двух проектах, находящихся на разных стадиях завершенности:

  • в системе демонстрации истории развития (таймлайна) графических интерфейсов пользователя на основе HTML-технологий – ostimeline;
  • в программном решении для интеграции виртуальных машин в мультимедийный фреймворк GStreamer.

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

Система демонстрации виртуализованного ПО на основе HTML-технологий

Архитектура данной системы представлена на рис.:

Система на основе HTML-технологий

Техническая инфраструктура проекта включает следующие компоненты:

  • система виртуализации QEMU (для гарантированной совместимости с ранее сохраненными снапшотами, мы используем задание архитектуры дополнительными параметрами строки запуска и локально собранный QEMU конкретных версий);
  • клиент удалённого доступа на JavaScript, соединяющийся с виртуальной машиной по протоколу RFB (VNC) и выводящий изображение на canvas HTML5 (используется проект noVNC в связке с прокси websockify, выполняющим преобразование между RFB и WebSocket);
  • JavaScript"=фреймворк, отвечающий за отображение страниц документа и навигацию между ними (TimelineSetter для интерактивного таймлайна, reveal.js для презентационных материалов);
  • специализированный HTTP"=сервер в виде скрипта на shell, выполняющий приостановку и снятие с паузы виртуальных машин по мере перелистывания пользователем страниц информационного контента (реагирует на скрипт, привязанный к HTML"=страницам).

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

На базе ostimeline развернуты демонстрационные материалы по истории графических настольных и мобильных ОС, виджет"=тулкитов, дистрибутивов GNU/Linux, а также находящийся в активной разработке интерактивный обзор истории текстовых процессоров. Также одним из позитивных побочных эффектов, достигнутых при разработке, было включение в апстрим QEMU интеграции курсора мыши для старинных архитектур, не поддерживающих шину USB (на текущий момент такая опция не реализована ни одной другой системой виртуализации).

Система запуска виртуальных машин средствами GStreamer

Среди недостатков предыдущего подхода можно отметить отсутствие монолитности: контент с виртуализованными окружениями по сути представляет собой сложную систему, функционирующую как цельный интерактивный документ благодаря набору скриптов и самостоятельных программных компонентов. Однако ее развертывание и перенос на другие системы достаточно сложны, чтобы воспринимать такой «документ» как самостоятельную единицу, в сравнении с традиционными документами, содержащими нимации и видео.

Для преодоления данного недостатка был применен альтернативный подход, позволяющий трактовать образ виртуальной машины с гостевой ОС как «мультимедийный файл», проигрываемый «кодеком», использующим систему виртуализации (QEMU). На первый взгляд это решение может показаться неочевидным; однако интерактивные элементы присутствуют в медиа"=файлах в течение долгого времени (например, меню DVD). Поэтому в архитектуру существующих систем воспроизведения видео заложены возможности в том или ином виде реагировать на действия пользователя.

Экспериментальная реализация была построена нами в виде плагина мультимедийного фреймворка GStreamer.

Система на основе GStreamer

Разработанный плагин выполняет следующие функции:

  • вывод изображения экрана гостевой ОС в медиа"=плеер;
  • подключение к QEMU через сокет;
  • регистрацию событий (движений мыши и нажатий клавиш) пользователя и передачу их в монитор QEMU.

При этом формат образов QEMU Qcow2 регистрируется в системе в качестве еще одного типа MIME.

Интерпретация образов виртуальной машины в качестве видео-контента

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

Файл образа Qcow2 организован в виде кластеров фиксированного размера, как для мета-данных образа, так и для данных гостевой системы (разделов диска и снапшотов). В первом кластере находится файловый заголовок, содержащий после фиксированной части секцию расширений, в конец которой и было добавлено собственное расширение, хранящее строку запуска. Помимо плагина GStreamer, была также разработана служебная утилита для сохранения (обновления) строки запуска в образе и просмотра, при ее наличии.

Текущая реализация плагина является экспериментальной; в частности, на данный момент не решена проблема поддержки формата стандартными медиа"=плеерами (без их перекомпиляции), а также остается открытым вопрос включения Qcow2 в мультимедийные контейнеры (mkv).

Построение документации с живыми иллюстрациями на основе встроенных виртуальных машин (Юрий Сойко, OSSDEVCONF-2019)!.jpg

Примечания и ссылки

Plays:108   Comments:1