singleEnd

test/index.php

@@ -17,7 +17,7 @@ include $_SERVER["DOCUMENT_ROOT"] . "/php/pages.php";
     <h1>Rozpocznij test - quiz PHP</h1>
     <div class="wrap">
         <main id="content">
-
+            <h3>Rozpocznij test</h3>
             <form id="startForm">
                 <?php
                 if (isset($_GET["own"]))

test/single/index.php

@@ -17,12 +17,13 @@ include $_SERVER["DOCUMENT_ROOT"] . "/php/pages.php";
     <h1>Pojedyńcze pytanie - quiz PHP</h1>
     <div class="wrap">
         <main id="content">
+            <h3>Rozwiąż pytanie</h3>
             <form id="startForm">
                 Wyświetlania pytań:
                 <p style="text-align: left;">
-                    <input type="radio" name="random" value="true" checked> Losowo<br>
+                    <input type="radio" name="random" value="true" onchange="lastRandomQuestion=true;" checked> Losowo<br>
-                    <input type="radio" name="random" value="false" id="byQID"> Wg nr pytania w bazie<br>
+                    <input type="radio" name="random" value="false" onchange="lastRandomQuestion=false;" id="byQID"> Wg nr pytania w bazie<br>
-                    <span id="QIDnum" style="visibility: hidden;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Nr: <input type="number" name="QID" min="0" max="9999" value="1"></span>
+                    <span id="QIDnum" style="visibility: hidden;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Nr: <input type="number" name="QID" min="1" max="9999" value="1"></span>
                 </p>
                 <p><input type="submit" value="Znajdź pytanie"></p>
                 <?php

test/single/single.js

@@ -1,3 +1,5 @@
+lastSaveQuestion = false;
+lastRandomQuestion = true;
 document.addEventListener("DOMContentLoaded", function () {
     async function generateQuestion(formE) {
         formE.preventDefault();
@@ -12,20 +14,100 @@ document.addEventListener("DOMContentLoaded", function () {
             }
         });
         const result = await response.json();
+        const output = document.getElementById("info");
         output.innerHTML = result.msg;
         output.style.display = "block";
+        if (result.question) setTimeout(function () {
+            function beforeunloadFunc(e) { e.preventDefault(); }
+            window.addEventListener('beforeunload', beforeunloadFunc);
+            contentHTML = "<form id='questionForm'>";
+
+            contentHTML +=
+                `<div class="question">
+                    <h4>Pytanie <sub>w bazie nr ${result.question.QID}</sub></h4>
+                    <h3>${result.question.content}</h3>
+                    <p id="questionInfo"></p>
+                    <div class="answer">
+                        <input type="hidden" name="QID" value="${result.question.QID}"/>
+                        <input type="hidden" name="answer" value="-"/>
+                        <span id="A"><input type="radio" name="answer" value="A"/><b>A.</b> ${result.question.answerA}<br/></span>
+                        <span id="B"><input type="radio" name="answer" value="B"/><b>B.</b> ${result.question.answerB}<br/></span>
+                        <span id="C"><input type="radio" name="answer" value="C"/><b>C.</b> ${result.question.answerC}<br/></span>
+                        <span id="D"><input type="radio" name="answer" value="D"/><b>D.</b> ${result.question.answerD}<br/></span>
+                    </div>
+                </div>`;
+            contentHTML += `<div id="end"><p>`;
+            if (logged) contentHTML += `Zapisać odpowiedź na pytanie? <input type="checkbox" name="save" id="save" onchange="lastSaveQuestion = element.checked;" ${(lastSaveQuestion) ? "checked" : ""}/><br/>`;
+            contentHTML += `</p>
+            <input type="submit" value="Odpowiedz"/></div>
+            </form>
+            <div id="new"></div>
+            <p><a href="/">Wróc do strony głównej</a></p>`;
+            mainContent.innerHTML = contentHTML;
+            document.getElementById("questionForm").addEventListener("submit", async function (formE) {
+                formE.preventDefault();
+                window.removeEventListener('beforeunload', beforeunloadFunc);
+                let formData = new FormData(formE.target);
+                formData.append("checkQuestion", "true");
+                const response = await fetch("single.php", {
+                    method: "POST",
+                    body: formData,
+                    credentials: "include",
+                    headers: {
+                        'X-Requested-With': 'XMLHttpRequest'
+                    }
+                });
+                const result = await response.json();
+                if (result.status == "OK") {
+                    window.scrollTo({ top: 0, behavior: 'smooth' });
+                    const qInfo = document.getElementById(`questionInfo`);
+                    let correctLetter = ["A", "B", "C", "D"].includes(result.answeredChar);
+                    if (!result.correct && correctLetter) {
+                        qInfo.innerHTML = `Nieprawidłowa odpowiedź, odpowiedziałeś ${result.answeredChar}, prawidłowa odpowiedź to ${result.correctChar}`;
+                        qInfo.style.color = "red";
+                        document.getElementById(`${result.answeredChar}`).style.color = "red";
+                        document.getElementById(`${result.correctChar}`).style.color = "green";
+                    }
+                    else if (!correctLetter) {
+                        qInfo.innerHTML = `Nie odpowiedziałeś na pytanie, prawidłowa odpowiedź to ${result.correctChar}`;
+                        qInfo.style.color = "red";
+                        document.getElementById(`${result.correctChar}`).style.color = "green";
+                    } else {
+                        qInfo.innerHTML = `Odpowiedziałeś prawidłowo, prawidłowa odpowiedż to ${result.correctChar}`;
+                        qInfo.style.color = "green";
+                        document.getElementById(`${result.answeredChar}`).style.color = "green";
+                    }
+                    document.getElementById("end").style.display = "none";
+                    document.getElementById("new").innerHTML = `
+                    <form id="startForm">
+                        Nowe pytanie:
+                        <p style="text-align: left;">
+                            <input type="radio" name="random" value="true" onchange="lastRandomQuestion=true;" ${(lastRandomQuestion) ? "checked" : ""}> Losowo<br>
+                            <input type="radio" name="random" value="false" onchange="lastRandomQuestion=false;" id="byQID" ${(lastRandomQuestion) ? "" : "checked"}> Wg nr pytania w bazie<br>
+                            <span id="QIDnum" style="visibility: hidden;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Nr: <input type="number" name="QID" min="1" max="9999" value="${result.QID + 1}"></span>
+                        </p>
+                        <p id="info"></p>
+                        <p><input type="submit" value="Znajdź pytanie"></p>
+                    </form>`;
+                    randomRadioFunc();
+                    document.getElementById("startForm").addEventListener("submit", generateQuestion);
+                } else alert("Wystąpił błąd, spróbuj ponownie");
+            });
+        }, 300);
     }
-    const output = document.getElementById("info");
     const mainContent = document.getElementById("content");
+    function randomRadioFunc() {
+        const QIDnum = document.getElementById("QIDnum");
         const randomRadio = document.querySelectorAll("input[name='random']");
         randomRadio.forEach(function (inputRadio) {
-        inputRadio.addEventListener("change", function (QIDnum) {
+            inputRadio.addEventListener("change", function () {
                 if (document.getElementById("byQID").checked) {
                     QIDnum.style.visibility = "visible";
-            } else {
+                } else QIDnum.style.visibility = "hidden";
-                QIDnum.style.visibility = "hidden";
+            });
+        });
+        if (!lastRandomQuestion) QIDnum.style.visibility = "visible";
     }
-        });
+    randomRadioFunc();
-    });
     document.getElementById("startForm").addEventListener("submit", generateQuestion);
 });

test/single/single.php

@@ -5,8 +5,61 @@ if (!checkLogin()) {
     exit();
 }
 if ($_SERVER['REQUEST_METHOD'] == "POST" && isset($_POST["generateQuestion"])) {
-    
+    $conn = connectDB();
+    if (!isset($_POST["random"])) echo jsonMsg("Błąd, nie wybrano typu wyboru pytania");
+    if ($_POST["random"] == "true") {
+        $stmt = $conn->prepare("SELECT QID FROM questions ORDER BY rand() LIMIT 1");
+        $stmt->execute();
+        $stmt->bind_result($selectedQID);
+        $stmt->fetch();
+        $stmt->close();
+    } else {
+        $selectedQID = (int) $_POST["QID"];
+        $stmt = $conn->prepare("SELECT QID FROM questions WHERE QID = ?");
+        $stmt->bind_param("i", $selectedQID);
+        $stmt->execute();
+        $stmt->store_result();
+        if ($stmt->num_rows != 1)
+            jsonMsg("Nie ma pytania w bazie o nr $selectedQID");
+        $stmt->close();
+    }
+    $stmt = $conn->prepare("SELECT QID, content, answerA, answerB, answerC, answerD FROM questions WHERE QID = ?");
+    $stmt->bind_param("i", $selectedQID);
+    $stmt->execute();
+    $stmt->bind_result($QID, $content, $answerA, $answerB, $answerC, $answerD);
+    $stmt->fetch();
+    $result["question"] = [
+        "QID" => $QID,
+        "content" => $content,
+        "answerA" => $answerA,
+        "answerB" => $answerB,
+        "answerC" => $answerC,
+        "answerD" => $answerD
+    ];
+    $stmt->close();
+    $conn->close();
+    $result["msg"] = "Wygenerowano pytanie o nr $selectedQID";
+    echo json_encode($result);
 } else if ($_SERVER['REQUEST_METHOD'] == "POST" && isset($_POST["checkQuestion"])) {
-
+    $conn = connectDB();
+    $stmt = $conn->prepare("SELECT QID, answerChar FROM questions WHERE QID = ?");
+    $stmt->bind_param("i", $_POST["QID"]);
+    $stmt->execute();
+    $stmt->bind_result($QID, $correctChar);
+    $stmt->fetch();
+    $stmt->close();
+    $answerChar = $_POST["answer"];
+    $correct = $_POST["answer"]==$correctChar;
+    $result = ["QID" => $QID, "answeredChar" => $answerChar, "correct" => $correct, "correctChar" => $correctChar];
+    if (isset($_POST["save"]) && isset($_SESSION["username"])) {
+        $stmt = $conn->prepare("INSERT INTO questionAnswers (QID, answerChar, correct, UID) VALUES (?, ?, ?, ?)");
+        $stmt->bind_param("isii", $QID, $answerChar, $correct, $_SESSION["UID"]);
+        $stmt->execute();
+        $stmt->close();
+    }
+    $conn->close();
+    $result["status"] = "OK";
+    $result["msg"] = "Ukończono pomyślnie";
+    echo json_encode($result);
 } else
     jsonMsg("Nieprawidłowy request");