Click-Count Video abspielen

Question

Hallo,

in unserem Fragebogen, wird pro Frage jeweils ein Video abgespielt. Für uns ist es wichtig, zu wissen wie oft der aktuelle Teilnehmer jedes Video abgespielt hat. Momentan wird dies über eine offene Frage abgefragt. Schöner wäre es natürlich einen counter zu haben, der zählt, wie oft auf 'play' gedrückt wurde. Leider ist meine Erfahrung mit Java-Script und/oder PHP sehr begrenzt.

Nach einigem Suchen im Forum, habe ich folgenden HTML-Code zusammen gebastelt:

<script type="text/javascript">
var count=getElementById("EK02_02")
SoSciTools.attachEvent(video,"play",count=count+1)
</script>

Ich bin mir aber leider relativ sicher, dass das so nicht klappt. Ich bin mir besonders unsicher, wie das mit dem Abspeichern in den internen Variablen funktioniert. Brauche ich hierfür die Funktion 'put()'? Ich möchte am Ende für jeden Teilnehmer pro Video einen Wert mit der Anzahl an "Klicks auf play" haben. Also pro Video eine interne Variable und pro Teilnehmer einen 'Eintrag' in dieser internen Variable. Können Sie mir hier helfen?

Schon einmal vielen Dank und liebe Grüße

Answer 1

Hallo,

der Javascript Code würde in Ihrem Fall ungefähr so aussehen:

<script type="text/javascript">

var audio = document.getElementById("audio6")
var input = document.getElementById("A103_01");

SoSciTools.attachEvent(audio,"play",function(){
    i = parseInt(input.value);
    if (isNaN(i)) {
      i = 0;
    }
    i = i+1
    input.value = i;
});

console.log(input.value);
</script>

Ich habe hier testweise eine Audiodatei benutzt und meine interne Variable heißt A103.
Sie müssen aber wahrscheinlich, wenn Sie für jede Ihrer Dateien einen eigenen Click Count haben wollen, für jede eine eigene Variable anlegen (A103_01, A103_02, etc.) und auch die Hilfsvariable i variieren.

Liebe Grüße

Comments

Hallo,

lieben dank für die schnelle Antwort! Ja, ich denke ich brauche pro Video dann eine interne variable. Ich habe die Videos aber nicht als Datei hochgeladen, sondern sie sind als Link von unserer Datenbank eingebunden. Wie funktioniert hier dann die Funktion document.getElementById()?

VG

---

Hallo,

das hängt ein bisschen davon ab, wie Sie das Video eingebunden haben. Wenn Sie das Video direkt als Videoformat einbinden, dann bleibt es über document.getElementById() asnprechbar, über iframe aber nicht.
Am besten würden Sie mir einmal kurz einen Link zu einem Pretest und den HTML Code geben, den Sie zum einbinden benutzen.

Viele Grüße

---

Hallo,
ich habe meinen Kommentar als neue Antwort (s.u.) forumliert.
Viele Grüße,

Answer 2

Hallo,

vielen Dank für die Hilfe schon einmal!

Hier ist ein Link zum Pretest: https://www.soscisurvey.de/AVAMOC/?act=CZu2RrSnQbiVtUoTFP2iwJFH

Eingebunden habe ich die Videos so:

<p style="text-align: center;"><font size="4">Bitte schauen Sie sich das Video mehrmals an und beantworten dann die unten stehenden Fragen.</font></p>

<p style="text-align: center;">
<video width="610" height="350" controls autoplay id= "stimulus_01"> 
<source src="https://www.zib.de/grewe/fiDaib4EipheiPheez7e/ID1816_happy_3D1019_zo.mp4" type="video/mp4" /> </video>
</p>

Mein Code für den Click-Count für ein Video würde jetzt so aussehen:

<script type="text/javascript">

var video = document.getElementById("stimulus_01")
var input = document.getElementById("R150_01");
input.value = parseInt("0");
SoSciTools.attachEvent(video,"play",function(){

    iR150_01 = parseInt(input.value);
    iR150_01 = iR150_01+1
    input.value = iR150_01;

})

console.log(input.value);
</script>

Wäre das so richtig? Und dieser HTML-Code dann auf jede Seite mit einem Video, mit den entsprechenden id's,internen variablen und Helfer-Variablen? Sollte der Java-Script Code über, oder unter der Frage stehen? Die Videos sind in den Frage-Text eingebunden.

Vielen Lieben Dank

Comments

Das sieht für mich so gut aus! Am besten schreiben Sie das für ein paar Fragen und probieren das ganze im Debug Modus aus, da wird Ihnen angezeigt, was in die internen Variablen rein geschrieben wird.
Den Code-Block packen Sie nach ganz unten auf die Seite als letztes Element.

---

Hallo,

Leider wird nichts in die Variable geschrieben, wenn ich es im Debug Modus ausprobiere.Auch nicht, wenn ich zur nächsten Seite gehe. Ich habe auch kontrolliert, dass die richtige stimulus ID und interne variable zugeordnet sind. Generell taucht die interne Variable R150_01 nicht in der Debug Information auf. Der Code wird also komplett "ignoriert".

Könnte es sein, dass ich einen Fehler beim Vergeben der ID des Videos gemacht habe und es deswegen nicht mit dem click-count in Verbindung gebracht wird?

VG und Ihnen ein schönes Wochenende!

---

Hallo,

haben Sie die interne Variable als Element in den Fragebogen gezogen? Am besten am Anfang der Seite. Außerdem ist mir aufgefallen, dass die ID des Videos keinen Unterstrich hat in Ihrem Pretest, das ist aber nicht der Grund, warum die Variable gar nicht angezeigt wird.

Liebe Grüße und Ihnen auch ein schönes Wochenende!

---

Hallo,

es hat geklappt! Vielen lieben Dank.

Liebe Grüße,

---

Hallo,

ich habe noch eine weitere, verwandte Frage als Antwort gepostet. Ich hoffe das ist i.O.!

VG

Answer 3

Hallo,

vielleicht können Sie mir noch bei einer weiteren Schwierigkeit helfen. Mir ist aufgefallen, dass logischerweise, auch ein count hinzukommt, wenn ich das Video pausiere und dann erneut auf play drücke.

Nun habe ich gedacht, ich könnte die controls ausblenden während das Video abgespielt wird, um ein Pausieren zu vermeiden. Leider funktioniert es auch nach längerem rumprobieren aber mal wieder nicht so, wie ich mir das vorstelle.. Ich habe versucht das ganze direkt im Frage-Text zu inkludieren, damit es übersichtlicher ist. Eine andere Möglichkeit wäre sicher, den Befehl in dem oben gebastelten Code für den ClickCount mit einzufügen. Nur wo genau dann? Ich wäre sehr dankbar, wenn Sie sich meinen momentanen HTML-Code in dem Frage-Text noch einmal anschauen könnten:

 <p style="text-align: center;"><font size="4">Bitte schauen Sie sich das Video mehrmals an und beantworten dann die unten stehende Frage.</font></p>
<p style="text-align: center;">
<video width="610" height="350" id="stimulusSS01" controls controlsList="nodownload" autoplay > 
<source src="https://www.zib.de/grewe/fiDaib4EipheiPheez7e/ID1816_happy_3D1019_zo.mp4" type="video/mp4" />
</video>
</p>

<script type="text/javascript">
<var video = document.getElementById("stimulusSS01");

SoSciTools.attachEvent(video, "play", function(evt) {
  stimulus.removeAttribute("controls");
});
</script>

Ich hoffe, all mein Nachfragen ist in Ordnung. Für mich ist dieser Weg eine super Gelegenheit einiges dazu zu lernen!

Viele Grüße

Comments

Hallo,

erst mal eine kurze Frage: Sie wollen ja zählen, wie oft Ihr Video abgespielt wird, richtig? Momentan fehlt Ihnen dann ja auch der erste Durchlauf, weil Ihr Video auf autoplay steht? Und wie soll das dann vom Ablauf her sein, die Controls werden währen dem abspielen ausgeblendet und dann wieder eingeblendet, sobald das Video durchgelaufen ist?

Natürlich können Sie gerne Fragen stellen, dafür ist der Support ja da ;)

Viele Grüße

---

Hallo,

der autoplay wird schon mitgezählt, das habe ich kontrolliert.

Genau, ich würde gerne, dass immer während das Video spielt die controls ausgeblendet sind und sie dann nach dem abspielen wieder eingeblendet werden, damit das Video beliebig oft abgespielt werden kann.

Alternativ, könnte man auch den Pause-Button als solchen abschaffen, aber das kommt mir komplizierter vor.

Lieben Dank!

---

Ich habe das ganze jetzt so gelöst:

<script type="text/javascript">

var video = document.getElementById("audio6");
var input = document.getElementById("A103_01");
input.value = parseInt("0");
SoSciTools.attachEvent(video,"play",function(){
    video.controls = false;
    i = parseInt(input.value);
    i = i+1
    input.value = i;

})

setInterval(function(){
if ((video.ended) == true) {
    video.controls = true;
}
 }, 1000);

</script>

Zur Erklärung: Ich schalte beim Klicken von Play die controls aus und packe eine Funktion mit rein, die jede Sekunde (1000ms) im Intervall überprüft, ob das Video (in meinem Fall Audio) schon vorbei ist und in dem Fall die controls wieder einblendet.

---

Vielen Dank!

Zur Klärung: Dieses script kommt dann mit in meinen Fragetext und ist unabhängig von dem Click-Count richtig? Muss ich dann eine neue interne Variable erstellen hierfür (pro Video?) oder woher kommt 'A103_01'?

Liebe Grüße

---

Das ist jetzt der komplette Code für das HTML-Code Fenster pro Video. Der obere Teil setzt den Click Count und stellt die controls aus (alles in .attachEvent()) und der untere Teil sorgt dafür, dass alles wieder eingeblendet wird. Sie brauchen dafür keine neuen Variablen, Sie brauchen nur die eine zusätzliche Zeile in .attachEvent (video.controls = false;) und den unteren Teil in setInterval(). "A103_01" ist nur meine interne Variable für den Click Count, bei Ihnen müsste das "R150_01" sein.

Viele Grüße!