Video nur einmal abspielen

Question

Liebes SoSci-Team,

ich habe aktuell das selbe Problem, komme aber mit Ihrer Lösung gerade nicht weiter. Ich möchte abenfalls, dass das Video durch den Befragten gestartet werden kann und danach nicht erneut startbar ist.
Der Code, den ich aktuell verwende lautet wie folgt:

<video width="1024" height="576" controls controlsList="nodownload" style="max-width: 100%">
  <source src="%random%"  type="video/mp4">
</video>
<script type="text/javascript">
document.getElementById("meinVideo").addEventListener("click", function() {
  document.getElementById("meinVideo").play();
});
</script>

Dadurch wird zwar während des Abspielens des Videos die Kontrolleiste ausgeblendet, diese ist aber durch einfache Bewegung der Maus wieder da und das Video kann erneut abgespielt werden.

Was ich schon versucht habe, ist das rauslöschen von "controls", was dann zwar für das Verschwinden der Kontrolleiste geführt hat, aber gleichzeitig auch das Abspielen des Videos verhindert.

Haben Sie vielleicht eine Lösung für mein Problem?

Vielen Dank für Ihre Hilfe und herzliche Grüße!

Comments

Ich habe oben eine andere Frage verlinkt, bei welcher die Lösung bereits in der Frage steht. Ansonsten auch in der Anleitung zum Nachlesen: https://www.soscisurvey.de/help/doku.php/de:create:media#optimierte_einbindung

---

Vielen Dank für Ihre Antwort!
Leider konnte ich in den von Ihnen verlinkten Anleitungen und Kommentaren keine Lösung für mein Problem finden.

Letztlich soll es lediglich darum gehen, dass das Video nur einmal abgespielt werden kann.
Kennen Sie einen entsprchenden Java- oder HTML- Baustein, der das ermöglicht?

Das einzige, was ich finden konnte, war eine Möglichkeit, nach dem Abspielen einer Audiodatei auf die nächste Seite weitergeleitet zu werden. Da sich aber auf der selben Seite noch eine Frage zum gezeigten Video befindet, wäre das in meinem Fall wenig zweckmäßig.

Vielen Dank für Ihre Hilfe!

---

> Kennen Sie einen entsprchenden Java- oder HTML- Baustein, der das ermöglicht?

Ja .. und dieser ist in dem verlinkten Abschnitt der Anleitung auch enthalten. Dort werden die Bedienelemente ausgeblendet (und bleiben ausgeblendet), wenn das Video einmal gestartet wurde.

---

Wie von Ihnen empfohlen, habe ich das in der Anleitung dargestllte Skript in folgender Form eingefügt:

<b>Einzelne Worte:</b>
<video width="1024" height="576" controls controlsList="nodownload" style="max-width: 100%">
  <source src="%random%"  type="video/mp4">
</video>
<script type="text/javascript">
<!--
 
var video = document.getElementById("stimulus");
 
// Bedienelemente ausblenden, sobald es abspielt
SoSciTools.attachEvent(video, "play", function(evt) {
  stimulus.removeAttribute("controls");
});
// Weiter-Knopf ausblenden
SoSciTools.attachEvent(window, "load", function(evt) {
  SoSciTools.submitButtonsHide();
});
// Weiter-Knopf am Ende des Videos wieder anzeigen
SoSciTools.attachEvent(stimulus, "ended", function(evt) {
  SoSciTools.submitButtonsDisplay();
});
 
// -->
</script>

Bedauerlicherweise bleiben die Bedienelemente nicht ausgeblendet, sondern blenden nach Abspielen des Videos wieder ein.

Können Sie mir bitte eine Lösung für dieses Problem nennen?
Herzlichen Dank!

---

Könnten Sie bitte einen Pretest-Link direkt (!) zu der betroffenen Seite im Fragebogen posten? Dann sehe ich mir einmal an, weshalb die Kontrollelemente nicht ausgeblendet bleiben.

In welchem Browser haben Sie getestet? Ich mag nicht ausschließen, dass der Browser es mit seinen Nutzer:innen besonders gut meint und daher die Kontrollelemente selbständig einblendet.

---

Vielen Dank! Hier ist der Link:
https://www.soscisurvey.de/maskenstudierwth2021/?act=i5iejuSIIo8WNaxqwkR9K5AR

Bisher hab ich den Fragebogen vor allem auf Firefox getstet, hatte aber gerade mit Edge dasselbe Problem...

Vielen Dank für Ihre Hilfe!

---

Danke für den Pretest-Link. Damit konnte ich den Fehler schnell identifizieren. Und zwar fehlt Ihrem <video>-Tag einfach eine ID. Und zwar jene ("stimulus"), auf welche Sie sich im JavaScript-Code beziehen.

Ergänzen Sie also ein id=...

<video id="stimulus" width="1024" height="576" controls controlsList="nodownload" style="max-width: 100%">

---

Vielen Dank! Jetzt klappt es, dass die Kontrolleiste nach dem Abspielen ausgeblendet bleibt.

Wenn ich jetzt aber die auf das Video folgende Frage nicht beantworte, fragt der Fragebogen, wie eingestellt, ob man das nicht doch noch tun möchte. In diesem Fall kann man jetzt nur noch den Fragebogen fortsetzen, indem man sich das Video erneut ansieht. Vorher gibt der Fragebogen den "Weiter"-Button nicht wieder frei.

Ist es möglich, dieß zu verhindern, sodass jemand, der eine Frage nicht beantwortet zwar nochmal gefragt wird, aber das Video trotzdem nicht erneut sehen kann?

---

> Vorher gibt der Fragebogen den "Weiter"-Button nicht wieder frei.

Dafür ist dieser Abschnitt in Ihrem Code verantwortlich:

// Weiter-Knopf ausblenden
SoSciTools.attachEvent(window, "load", function(evt) {
  SoSciTools.submitButtonsHide();
});

> aber das Video trotzdem nicht erneut sehen kann?

Dafür müssten Sie den HTML-Code in einen Textbaustein speichern (also nicht direkt als "HTML-Code" in den Fragebogen legen) und dann per Filter sicherstellen, dass das Video nur beim ersten Mal angezeigt wird:

if (getRoute() == 'next') {
  text('VD01');  // Das ist der Text, in welchem Sie den HTML-Code gespeichert haben
}

---

Danke für Ihre Antwort!
Ich bin mir allerdings unsicher, ob ich Sie koorekt verstanden habe.

Ich habe jetzt den von Ihnen empfohlenen HTML-Code als Textbaustein erstellt und diesen nicht in den Fragebogen direkt eingefügt. Dann habe ich für die Frage den Filter eingestellt, dass, wenn jemand die Frage nicht beantwortet, er zu diesem Text weitergeleitet wird. Das ändert allerdings nichts an dem Problem.
Sie sollten das noch über den Pretest-Link einsehen können.

Wie hatten Sie das denn gemeint? Ich bitte zu bedenken, dass ich kein Informatiker, sondern Mediziner bin und deswegen auf eine "Anleitung für Dummies" angewiesen bin ;-) Danke für Ihre Geduld!

---

> ob ich Sie koorekt verstanden habe.

Also ich meinte, dass Sie den HTML-Code für die Einbindung des Videos aus der Seite entfernen und ihn stattdessen in einen Text im Fragenkatalog (Darstellung "HTML-Code") speichern und anstelle des HTML-Codes im Fragebogen den PHP-Code mit dem IF verwenden.

> Dann habe ich für die Frage den Filter eingestellt, dass, wenn jemand die Frage nicht beantwortet

Diesen Filter entfernen Sie bitte wieder. Es geht nur um den PHP-Code mit dem getRoute()

---

Um ehrlich zu sein, bin ich aus Ihren Ausführungen nicht wirklich schlau geworden...
Für das aktuelle Problem haben wir jetzt folgende Lösung gefunden: Wenn eine Frage nicht beantwortet wird, wird beim Nachhaken über die Filterfunktion einfach das Video ausgeblendet.

Leider funktioniert das nicht für die Freitextfragen, die im weiteren Verlauf des Fragebogens gestellt werden. Ich habe Ihnen hier nochmal einen Pretest-Link erstellt, der Sie zu einer solchen Frage leitet: https://www.soscisurvey.de/maskenstudierwth2021/?act=aNLqwUtNg2JkBc7Bj4wA5xig

Kennen Sie eine Möglichkeit, wie man dafür sorgen kann, dass beim Nachhaken bei Nichtbeantwortung der Frage im Freitext das Video ausgeblendet wird, analog zu den MC-Fragen?

---

> Kennen Sie eine Möglichkeit, wie man dafür sorgen kann, dass beim Nachhaken bei Nichtbeantwortung der Frage im Freitext das Video ausgeblendet wird, analog zu den MC-Fragen?

Ja ... den PHP-Code, den ich oben angegeben hatte.

if (getRoute() == 'next') {
  text('VD01');
}

Diesen fügen Sie anstatt (!) des Video-HTML-Codes auf der Seite ein. Der Filter sorgt dafür, dass der Text/HTML-Code (hier im Beispiel mit der Kennung) VD01 nur dann eingeblendet wird, wenn die Seite das erste Mal angezeigt wird.

---

Guten Morgen!
Ich habe mich bemüht, ihren Lösungsvorschlag nach bestem Verständnis umzusetzen. Leider wird nun das Video gar nicht mehr angezeigt...

Unter dem Pretest-Link kommen Sie zur exemplarischen Frage: https://www.soscisurvey.de/maskenstudierwth2021/?act=aNLqwUtNg2JkBc7Bj4wA5xig

Würden Sie nochmal gucken, was fehlt oder falsch ist? Vielen Dank!

---

Sie haben als Dateiname für das Video %random% eingetragen. Hatten Sie da ursprünglich eine Zufallsauswahl für das Video?

Wenn ja, dann ersetzen Sie text('VD01') durch show('RG01'), wobei Sie statt 'RG01' die Kennung des Zufallsgenerators einsetzen, in welchem die Videos und der HTML-Code hinterlegt sind.

---

Ja, genau. Das hat funktioniert.

Vielen Dank für Ihre Hilfe!