... | ... | @@ -202,7 +202,7 @@ Abbildung X: Verbindung einer AmbientBox mit einem Nutzer |
|
|
|
|
|
## Event-Weiterleitung
|
|
|
|
|
|
Die Event-Weiterleitung ist einseitig von der Seite des Accelerators aus. Der Listener für das "setStatus"-Event wird jedes Mal aufgerufen, wenn ein Nutzer den Status ändert. Ein Nutzerevent wird durch die auswahl der unten im Accelerator angezeigten Buttons ausgelöst. Zu den übertragenen Events gehören die nachfolgend aufgelisteten:
|
|
|
Die Event-Weiterleitung geht einseitig von der Seite des Accelerators aus. Der Listener für das "setStatus"-Event im Accelerator wird jedes Mal aufgerufen, wenn ein Nutzer seinen Status ändert. Ein Nutzerevent wird durch die Auswahl der unten im Accelerator angezeigten Buttons ausgelöst. Zu den übertragenen Events gehören die nachfolgend aufgelisteten:
|
|
|
|
|
|
- ThumbUp: Der Nutzer hat den ThumbUp-Button gedrückt
|
|
|
- ThumbDown: Der Nutzer hat den ThumbDown-Button gedrückt
|
... | ... | @@ -221,6 +221,33 @@ Abbildung X: Event-Weiterleitung |
|
|
|
|
|
## WebRTC
|
|
|
|
|
|
Für die Kommunikation mit Audio und Video verwendet der Acelerator den WebRTC-Standard. Dieser ist ein Protokoll, das die Kommunikation zwischen Browser- und Server-Seiten ermöglicht. Die Kommunikation erfolgt hierbei ebenfalls über Websockets. Der WebRTC-Standard ist in den [WebRTC-Dokumentationen](https://www.w3.org/TR/webrtc/) zu finden.
|
|
|
|
|
|
Die WebRTC-Verbindung wird von der Seite der AmbientBox initialisiert, wenn der Nutzer die Verbindungsanfrage angenommen hat. Dafür wird eine neune Client-to-Server-Connection aus dem Browser mit dem Accelerator-Backend initialisiert. Hierbei werden ebenfalls die Event-Listener für "connect", "connect_error", "connect_timeout" und "error" registriert. Für die Umsetzung der WebRTC-Verbindung nutzt die AmbientBox bestehende Funktionalitäten des Accelerators, welche im Frontend eingebunden sind. Zu den eingebundenen Dateien gehören:
|
|
|
|
|
|
- connect.js
|
|
|
- ezMCU.js
|
|
|
- ezWebRTC.js
|
|
|
- util.js
|
|
|
- libvpx.js
|
|
|
- vpx-worker.js
|
|
|
|
|
|
Diese Dateien setzten ebenfalls Event-Listener um, welche wichtig für die WebRTC-Verbindung sind. In der nachfolgenden Tabelle sind die wichtigsten Listener aufgelistet, welche hauptsächlich für den Verbindungsaufbau verantwortlich ist.
|
|
|
|
|
|
| Datei | Event | Funktionalität |
|
|
|
| ---------- | ------------------ | -------------------------------------------------------------------------------------------------------- |
|
|
|
| ezMCU.js | mcu_registerStream | Veröffentlicht einen eigenen Audio- oder Videostream |
|
|
|
| connect.js | newStreamPublished | Erfasst alle neuen Streams und subscribed zu diesen, sofern eine Verbindung mit einer AmbientBox besteht |
|
|
|
| connect.js | streamAdded | Erfasst verfügbare Streams, und fügt diese als Audio- oder Video-Element hinzu |
|
|
|
| connect.js | streamUnpublished | Erfasst alle Streams, die unpublished wurden und unsubscribed von diesen |
|
|
|
|
|
|
Tabelle X: Event-Listener für den WebRTC-Verbindungsaufbau
|
|
|
|
|
|
Bei einem Verbindungsaufbau wird die ezMCU-Klasse initialisiert und auf das "connect"-Event der neu erstellten Socket-Verbindung gewartet. Sobald das Event ausgelöst wird, startet die Erfassung der lokalen Audio- und Videostreams. Abhängig von den konfigurierten Einstellungen werden die Berechtigunegn für die Audio- und Videostreams der Kamera und des Mikrofons der AmbientBox angefragt und als neuer Stream an den Accelerator gepublisht. Sobald alle benötigten Streams vorhanden sind, wird das "join"-Event an den Accelerator gesendet. Dieses fügt die AmbientBox als Teilnehmer in einen Raum hinzu. Danach erhält die AmbientBox alle Streams aus diesem Raum und kann sich die Streams des verknüpften Nutzers auswählen. Ebenfalls wird während des Verbindungsaufbaus die ID des WebRTC-Sockets der AmbientBox an das Accelerator-Backend über das "setWebRTCID"-Event gesendet. Dadurch kann der Accelerator die ausgewählte AmbientBox der WebRTC-Verbindung zuordnen und entsprechend die Streams verwalten. In Abbildung X ist der Ablauf des WebRTC-Verbindungsaufbaus visualisiert.
|
|
|
|
|
|

|
|
|
Abbildung X: WebRTC-Verbindungsaufbau
|
|
|
|
|
|
# Usertests
|
|
|
|
|
|
Zur Evalutaion der Usability der AmbientBox wurde das System mehreren Personen vorgeführt und ein SUS(System Usability Scale)-Fragebogen erfasst.
|
... | ... | |