Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Nächste Überarbeitung
Vorhergehende Überarbeitung
de:create:timer-countdown [01.06.2015 09:18] – angelegt adminde:create:timer-countdown [21.07.2021 14:45] (aktuell) – Ein Fehler im Script wurde behoben. ann-kathrin.torka
Zeile 29: Zeile 29:
 <code php> <code php>
 // Filter: Zeit abgelaufen? // Filter: Zeit abgelaufen?
-if (time() > $timeout) {+if (time() >$timeout) {
   goToPage('partNext');   goToPage('partNext');
 } }
Zeile 39: Zeile 39:
 ==== Anzeige der Zeit ==== ==== Anzeige der Zeit ====
  
-Während der Teilnehmer eine Seite innerhalb des Countdowns ausfüllt, muss zum einen die Anzeige der verbleibenden Zeit ständig aktualisiert werden, zum anderen muss überprüft werden, ob die Zeit vielleicht schon abgelaufen ist. Dafür wird JavaScript-Code in die Seite eingebunden -- und zwar mit folgendem PHP-Code, welcher die verbleibende Zeit an das JavaScript übergibt:+Während der Teilnehmer eine Seite innerhalb des Countdowns ausfüllt, muss zum einen die Anzeige der verbleibenden Zeit ständig aktualisiert werden, zum anderen muss überprüft werden, ob die Zeit vielleicht schon abgelaufen ist. Dies wird mittels [[:de:create:javascript|JavaScript]] realisiert.
  
-<code php> +Den JavaScript-Code speichern Sie als Text (Rubrik -> Text hinzufügen). Damit der Inhalt als JavaScript-Code interpretiert wird, wählen Sie als //Darstellung// "HTML-Code".
-// JavaScript zur Anzeige der verbleibenden Zeit +
-$timeLeft = $timeout time()+
-replace('%timeLeft%', $timeLeft); +
-text('js_timeout'); +
-</code> +
- +
-Den eigentlichen JavaScript-Code speichern Sie als Textbaustein mit der Kennung "js_timeout" (//Darstellung:// HTML-Code) mit folgendem Inhalt. Wenn Sie nach Ablauf des Countdown keine Meldung anzeigen möchten oder den Teilnehmer nicht automatisch weiterleiten möchten, entfernen Sie die entsprechenden Zeilen einfach. +
- +
-Beachten Sie auch die ersten beiden Zeilen, die noch keine JavaScript, sondern einfach nur HTML-Code enthalten. Diese HTML-Code bzw. ein anderes HTML-Element mit der HTML-ID "timeDisplay" können Sie prinzipiell auch an anderer Stelle im HTML-Code platzieren (z.B. in einer Frage). In diesem Fall platzieren sie den obigen PHP-Code, welcher den JavaScript-Code einbindet, am Ende der Seite. Sonst dort, wo der Countdown angezeigt werden soll.+
  
 <code javascript> <code javascript>
Zeile 78: Zeile 69:
     alert("Die Zeit ist vorbei.");     alert("Die Zeit ist vorbei.");
     // Den Teilnehmer zur nächsten Seite weiterleiten (optional)     // Den Teilnehmer zur nächsten Seite weiterleiten (optional)
-   // SoSciTools.submitPage();+    SoSciTools.submitPage();
   }   }
  
Zeile 106: Zeile 97:
 </script> </script>
 </code> </code>
 +
 +**Tipp:** Wenn Sie nach Ablauf des Countdown keine Meldung anzeigen möchten oder den Teilnehmer nicht automatisch weiterleiten möchten, entfernen Sie die entsprechenden Zeilen einfach.
 +
 +**Tipp:** Beachten Sie auch die ersten beiden Zeilen, die noch keine JavaScript, sondern einfach nur HTML-Code enthalten. Diesen HTML-Code bzw. ein anderes HTML-Element mit der HTML-ID "timeDisplay" können Sie prinzipiell auch an anderer Stelle im HTML-Code platzieren (z.B. in einer Frage). In diesem Fall platzieren sie den obigen PHP-Code, welcher den JavaScript-Code einbindet, am Ende der Seite. Sonst dort, wo der Countdown angezeigt werden soll.
 +
 +Zur Einbindung des JavaScript-Codes ist nochmals ein wenig PHP-Code auf der Fragebogen-Seite erforderlich. Folgender PHP-Code übergibt die verbleibende Zeit als Platzhalter ''%timeLeft%''.
 +
 +<code php>
 +// JavaScript zur Anzeige der verbleibenden Zeit
 +$timeLeft = $timeout - time();
 +// Statt JS01 muss hier die Kennung des Textes eingetragen werden
 +show('JS01', array(
 +  '%timeLeft%' => $timeLeft
 +));
 +</code>
 +
 +Auch dieser PHP-Code ist auf jeder Seite erforderlich, die den Countdown zeigen soll.
 +
 +**Hinweis:** Damit ''show()'' korrekt funktioniert, speichern Sie den JavaScript-Code bitte nicht als //Textbaustein// sondern als //Text// in einer Rubrik im Fragenkatalog. Als Darstellungsmodus für den Text wählen Sie bitte "HTML-Code".
de/create/timer-countdown.1433143103.txt.gz · Zuletzt geändert: 01.06.2015 09:18 von admin
 
Falls nicht anders bezeichnet, ist der Inhalt dieses Wikis unter der folgenden Lizenz veröffentlicht: CC Attribution-Share Alike 4.0 International
Driven by DokuWiki