Asi před čtvrt rokem jsem chtěl na svůj web implementovat kvíz. Původně
jsem měl v plánu využít některou ze snadno implementovatelných služeb pro
tvůrce WWW stránek. Hledal jsem na českém i zahraničním Internetu, ovšem
kvíz jaký jsem si představoval, jsem nenalezl. Mezi českými weby nabízejícími
různá "udělátka" pro webdesignery (jako ankety, knihy hostů,
mailformy ap.) jsem kvíz vůbec nenašel. Kdysi jsem našel zahraniční službu
nabízející kvíz, ovšem v neplacené verzi byla personalizace tohoto kvízu
výrazně omezená a především nebylo možno ovládání kvízu lokalizovat do
češtiny.
Rozhodl jsem se udělat si tedy jednoduchý kvíz v PHP (bez použití databáze).
Vlastnosti kvízu jsou následující:
- odpovědi na otázky jsou realizovány formou výběru z možností (pomocí
radio-buttonů)
- pro každou otázku musí být stejný (ale neomezený) počet variant
odpovědí
- je neomezený počet otázek
- při vyhodnocení kvízu se zobrazuje otázka, odpověď soutěžícího,
správná odpověď, resumé ("správně"/"špatně")
- na závěr kvízu se zobrazí souhrnné hodnocení (např.: "Z celkových
10 otázek jste zodpověděl(a) správně 3.
Vaše úspěšnost v kvízu je tedy 30%.")
- do souboru výsledků jsou formou CSV zapisovány výsledky jednotlivých
soutěžících
- do souboru statistik je zapsána informace o datu posledního dokončeného
kvízu, počtu soutěžících (kteří již vyzkoušeli kvíz), nejlepší
a nejhorší výsledek kvízu
- do souboru statistik a souboru výsledků se zapisuje jen "1.
pokus" soutěžícího (kontrola pomocí cookies)
Kvíz si můžete vyzkoušet zde.
Kvíz sestává ze tří souborů:
- hlavni.php - skript pro vypsání otázek a možných odpovědí +
formulář pro odeslání dat ke zpracování
- vyhodnoceni.php - skript na nějž se odkazuje hlavni.php a který
zobrazuje správnost odpovědí na jednotlivé otázky + souhrnné hodnocení
- data.php - soubor obsahující vlastní texty otázek a odpovědí
(tento souboru se vkládá (pomocí require) do souboru hlavni.php i
vyhodnoceni.php)
|
data.php
|
<?
$pocetotazek=3;
$pocetmoznosti=3;
$q1 = Array("Hlavní město ČR je", "a) Praha", "b) Brno", "c) Beroun", 1);
$q2 = Array("Česká vlajka obsahuje", "a) 2 barvy", "b) 3 barvy", "c) 4 barvy", 2);
$q3 = Array("Český národní strom je", "a) javor", "b) lípa", "c) kaštan", 2);
?>
|
Soubor data.php obsahuje především pole otázek a odpovědí. Počet polí
odpovídá počtu otázek, přičemž názvy polí musí být q1 (1. otázka),
q2, q3, q4 (4. otázka) atd. První prvek (tedy např. $q1[0]) každého pole
obsahuje otázku, druhý (tedy např. $q1[1]) až předposlední prvek obsahuje
příslušnou odpověď, poslední prvek obsahuje index prvku, který obsahuje
správnou odpověď. Proměnná $pocetotazek by měla obsahovat hodnotu
odpovídající počtu otázek, proměnná $pocetmoznosti by měla
obsahovat počet možných odpovědí na každou z otázek.
|
hlavni.php
|
<html>
<head>
<title>Kvíz</title>
</head>
<body>
<p>KVÍZ - ZADÁNÍ OTÁZEK</p><br>
<form method="post" name="mujform" action="vyhodnoceni.php"
onSubmit="mujform.mujsubmit.value='Odesílá se...';">
<?
require "./data.php";
$krok=1;
while($krok<=$pocetotazek): //CYKLUS PRO OTÁZKY
echo "Otázka ".$krok.".:<br>";
echo "<b>".${"q".$krok}[0]."</b>";
$subkrok=1;
while($subkrok<=$pocetmoznosti): //CYKLUS PRO JEDNOTLIVÉ ODPOVĚDI
echo "<br><input type=\"radio\" value=\"" . $subkrok .
"\" name=\"a".$krok."\">".${"q".$krok}[$subkrok];
$subkrok++;
endwhile;
echo "<br><hr noshade>";
$krok++;
endwhile;
echo "<center><br>
<input type=\"submit\" name=\"mujsubmit\" value=\"Odeslat\">
</center>";
?>
</form>
</body>
</html>
|
Ve výše uvedeném kódu hlavni.php je kompletní zdrojový kód stránky,
jehož stěžejní část tvoří formulář s otázkami a odpověďmi. Na úplném začátku PHP skriptu se do hlavni.php
vloží data.php. Následují dva vnořené cykly pro zobrazování otázek
a odpovědí, přičemž nadřízený cyklus projíždí jednotlivé otázky a
vnořený cyklus zobrazuje pro danou otázku její možné odpovědi. Princip
fungování těchto cyklů, domnívám se, je zřejmý. Zastavím se alespoň u
konstukce složeného názvu proměnné s níž se zde pracuje. Jak jsme si řekli
v úvodu, názvy polí s jednotlivými otázkami jsou jsou q1, q2, q3..... Naším
úkolem je podívat se v cyklu na jednotlivé otázky - tedy jednotlivá tato
pole - to zajistíme právě pomocí zápisu ${"q".$krok},
protože všechny proměnné (pole) začínají "q" a následuje číslo
odpovídající číslu otázky - toto číslo se bude v cyklu stále zvyšovat
(dokud nebude dosaženo počtu požadovaného počtu otázek). Abychom mohli v názvu
proměnné využít obsah jiné proměnné, využíváme složených závorek.
Podobné skládání (ale již bez složených závorek) se nám objevuje ještě
u názvu (name) radiobuttonů v cyklu pro jednotlivé odpovědi - name=\"a".$krok."\".
Zajistíme takto příslušné názvy proměnných (paramerů), které se budou
předávat skriptu vyhodnoceni.php.
Na závěr se zastavím ještě u malinkatého (pro funkčnost kvízu nepodstatného)
javascriptu, který zajistí změnu nápisu na tlačítku pro odeslání kvízu
po jeho odeslání (z "Odeslat" na "Odesílá se..."). Je to
detail, který se hodí, zvláště má-li návštěvník kvízu pomalejší připojení
a změna nápisu na tlačítku mu dá jasně najevo "že se něco už děje".
Jedná se o akci onSubmit="mujform.mujsubmit.value='Odesílá
se...';" u elementu FORM, kde mujform a mujsubmit
odpovídají názvu formuláře a názvu tlačítka pro odeslání.
Tolik pro dnešek. Příště si ukážeme jak zpracovat data, která nám z
hlavni.php přijdou, zobrazit vyhodnocení kvízu a zapsat výsledky a
statistiky.
Pecka Miroslav
|
