Webbserverprogrammering 1

Show sourcecode

The following files exists in this folder. Click to view.

Webserver1/Ovningar/Quiz/

account.php
create_quiz.js
create_quiz.php
fetch_table.php
frontpage.php
header.php
login.php
quiz.php
quiz_answer_finished.php
quiz_creation_finished.php
signup.php
style.css

account.php

386 lines UTF-8 Windows (CRLF)
<?php
session_start
();

// show all error reporting
error_reporting(-1); // Report all type of errors
ini_set('display_errors'1); // Display all errors 
ini_set('output_buffering'0); // Do not buffer outputs, write directly

if (!isset($_SESSION["isLoggedIn"]) || ["isLoggedIn"] != true) {
  
$_SESSION["lastVisited"] = "https://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
  
header("Location:login.php?redirect=true");
}
?>

<!DOCTYPE html>
<html lang="sv">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Adminsida</title>
  <style>
    .hidden {
      display: none;
    }

    table {
      border: 1px solid black;
    }
  </style>
  <link rel="stylesheet" href="style.css">
</head>

<body style="background-color: lavender;">
  <?php
  $SQLop 
= isset($_POST['SQLop']) ? $_POST['SQLop'] : "update";
  
$id = isset($_POST['id']) ? $_POST['id'] : null;
  
$username = isset($_POST['username']) ? $_POST['username'] : null;
  
$isAdmin = isset($_POST['isAdmin']) ? $_POST['isAdmin'] : null;


  include(
'../../incl/dbconnection.php');
  
/**
   * @var PDO $dbconn
   */

  // Logif för att updatera och ta bort users
  
if (!is_null($id)) {
    try {
      
$sqlSelect "SELECT * FROM quiz_users WHERE user_id=?";

      
$sqlUpdate "UPDATE quiz_users
      SET username=?, is_admin=?
      WHERE user_id=?"
;

      
$sqlDelete "DELETE FROM quiz_users
      WHERE user_id=?"
;

      if (
$SQLop == "update") {
        
$dbconn->beginTransaction();
        
$stmt $dbconn->prepare($sqlSelect);
        
$stmt->execute([$id]);

        
$row $stmt->fetch(PDO::FETCH_ASSOC);
        
print_r($row);
        if (
$row) {
          
$username $username $username $row["username"];
          
$isAdmin $isAdmin $isAdmin $row["is_admin"];
        }

        
$updateStmt $dbconn->prepare($sqlUpdate);
        
$data = array($username$isAdmin$id);
        
$updateStmt->execute($data);

        
$dbconn->commit();
        echo 
"Användarinformation för id $id uppdaterad!";
      } elseif (
$SQLop == "delete") {
        
$dbconn->beginTransaction();
        
$stmt $dbconn->prepare($sqlDelete);
        
$stmt->execute(array($id));
        
$dbconn->commit();
        echo 
"Användaren med id $id borttagen!";
      }
    } catch (
PDOException $e) {
      
$dbconn->rollBack();
      echo 
"<br>" $e->getMessage();
    }
  }
  unset(
$_POST);
  
?>
  <?php
  
if (
    isset(
$_SESSION["isAdmin"]) && $_SESSION["isAdmin"] == true
    
&& (!isset($_GET['forceNonAdmin']) || $_GET['forceNonAdmin'] === "false")
  ) {
    
// ------ ADMIN SIDA ------ //
  
?>
    <div class="center-content">
      <h2 class="text-center">Adminpanel</h2>
      <form method="post" action="">
        <table>
          <tr>
            <td>Läge:</td>
            <td>
              <select name="SQLop" id="SQLop">
                <option value="update">Uppdatera</option>
                <option value="delete">Ta bort</option>
              </select>
              (quiz_users tabellen)
            </td>
          </tr>
          <tr id="idRow">
            <td>id*:</td>
            <td><input type="number" id="idInput" name="id" required>
          </tr>
          <tr id="usernameRow">
            <td>
              <p>Användarnamn:</p>
            </td>
            <td><input type="text" name="username" size=40 maxlength=100>
            </td>
          </tr>
          <tr id="userTypeRow">
            <td>Admin privilleger:</td>
            <td><input type="checkbox" name="isAdmin" value="1">
            </td>
          </tr>
          <tr>
            <td><button type="submit" id="submitButton">Uppdatera</button></td>
          </tr>
          <tr>
            <td>
              <hr>
              <select name="tableSelect" id="tableSelect">
                <?php
                $quizTables 
$dbconn->query("SELECT table_name FROM information_schema.tables WHERE table_schema = DATABASE() AND table_name LIKE 'quiz\_%'");
                foreach (
$quizTables->fetchAll(PDO::FETCH_ASSOC) as $value) {
                  
$value array_change_key_case($valueCASE_LOWER); // Ändra för kompabilitet på lokal och labbserver
                  
print_r($value);
                
?>
                  <option value="<?php echo $value["table_name"]; ?>"><?php echo $value["table_name"]; ?></option>
                <?php
                
}
                
?>
              </select>
              <button type="button" id="showButton">Visa tabell</button>
            </td>
          </tr>
        </table>
      </form>
      <div class="row" style="justify-content:center">
        <a href="frontpage.php" class="center-container" style="text-decoration: none;">
          <button class="big-button">Tillbaka till startsidan</button>
        </a>
        <a href="account.php?forceNonAdmin=true" class="center-container" style="text-decoration: none;">
          <button class="big-button">Se non-admin sida</button>
        </a>
      </div>
    </div>

    <!-- This div will hold the table we fetch from the database -->
    <div id="tableContainer"></div>

    <script>
      let selector = document.getElementById("SQLop")

      rows = {
        "idRow": document.getElementById("idRow"),
        "usernameRow": document.getElementById("usernameRow"),
        "userTypeRow": document.getElementById("userTypeRow")
      }

      selector.addEventListener('change', (event) => {
        let value = event.target.value;
        switch (value) {
          case "update": {
            rows["idRow"].classList.remove("hidden")
            rows["usernameRow"].classList.remove("hidden")
            rows["userTypeRow"].classList.remove("hidden")

            submitButton.innerText = "Uppdatera"
            break
          }
          case "delete": {
            rows["idRow"].classList.remove("hidden")
            rows["usernameRow"].classList.add("hidden")
            rows["userTypeRow"].classList.add("hidden")

            submitButton.innerText = "Ta bort"
            break
          }
        }
      });

      // Show items in table by clicking button
      showButton.addEventListener("click", async () => {
        try {
          const table = document.getElementById("tableSelect").value;
          const response = await fetch(`fetch_table.php?table=${table}`);
          if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
          }
          const data = await response.json();

          const tableContainer = document.getElementById("tableContainer");

          if (data.length === 0) {
            tableContainer.innerHTML = `<p>Tabellen är tom.</p>`
          }

          // console.log(data)

          // Build the table HTML
          let tableHTML = `
          <h2>Users</h2>
          <table border="1">
          <thead>
            <tr>
          `;

          Object.keys(data[0]).forEach(col => {
            tableHTML += "<th>" + col + "</th>";
          });

          tableHTML += `
            </tr>
          </thead>
          <tbody>`;

          // TODO: JOIN (kanske?)
          data.forEach(row => {
            tableHTML += "<tr>"
            Object.values(row).forEach(val => {
              tableHTML += `<td>${val}</td>`
            })
            tableHTML += "</tr>"
          });

          tableHTML += '</tbody></table>';
          tableContainer.innerHTML = tableHTML;
        } catch (error) {
          console.error('Kunde inte hämta tabelldata:', error);
          document.getElementById('tableContainer').innerHTML = '<p>Ett fel uppstod vid hämtning av data.</p>';
        }
      });
    </script>
  <?php
  
} else {
    echo 
'<div id="account-content">';
    
// ------- VANLIG SIDA ------- //
    
$_usernameStmt $dbconn->prepare("SELECT username FROM quiz_users WHERE user_id=?");
    
$_usernameStmt->execute([$_SESSION['userId']]);

    
$username $_usernameStmt->fetch(PDO::FETCH_ASSOC)['username'];

    echo 
"<h1>Välkommen, $username </h1>";
  
?>
    <a href="frontpage.php" style="text-decoration: none;">
      <button class="big-button">Tillbaka till startsidan</button>
    </a>
    <h2>Här är alla dina resultat:</h2>
    <div id="results-container">
      <div id="result-list">
        <?php
        $sqlQuizResults 
"SELECT
      qr.score,
      qr.quiz_id,
      qq.quiz_name,
      qr.completed_at,
      qr.quiz_result_id
      FROM quiz_quiz_results qr
      JOIN quiz_quizzes qq ON qr.quiz_id=qq.quiz_id
      WHERE user_id=?"
;
        
$sqlQuizAnswers "SELECT
      qa.option_id
      FROM quiz_answers qa
      WHERE qa.quiz_result_id=?
      "
;
        
$sqlQuizQuestions "SELECT
      question_id,
      question_text,
      question_order
      FROM quiz_questions
      WHERE quiz_id=?
      ORDER BY question_order
      "
;
        
$sqlOptions "SELECT
      option_id,
      option_text,
      is_correct
      FROM quiz_options
      WHERE question_id=?
      "
;
        
$quizResultsStmt $dbconn->prepare($sqlQuizResults);
        
$quizAnswersStmt $dbconn->prepare($sqlQuizAnswers);
        
$quizQuestionsStmt $dbconn->prepare($sqlQuizQuestions);
        
$quizOptionsStmt $dbconn->prepare($sqlOptions);
        
$quizResultsStmt->execute([$_SESSION['userId']]);
        foreach (
$quizResultsStmt->fetchAll(PDO::FETCH_ASSOC) as $quiz):
        
?>
          <details>
            <summary>
              Quiz: <?php echo $quiz["quiz_name"]; ?>
              | Blev färdig: <?php echo $quiz["completed_at"]; ?>
            </summary>
            <?php
            $quizQuestionsStmt
->execute([$quiz["quiz_id"]]);
            
$questions $quizQuestionsStmt->fetchAll(PDO::FETCH_ASSOC);
            foreach (
$questions as $question):
            
?>
              <details open>
                <summary><?php echo $question["question_text"?></summary>
                <?php
                $quizOptionsStmt
->execute([$question["question_id"]]);
                
$options $quizOptionsStmt->fetchAll(PDO::FETCH_ASSOC);
                
$quizAnswersStmt->execute([$quiz["quiz_result_id"]]);
                
$answers $quizAnswersStmt->fetchAll(PDO::FETCH_ASSOC);
                
// $answers är array av array, konvertera till array av option_id:s
                
$optionsChosen array_column($answers"option_id");
                
// Flagga för hantering av frågor med flera rätta svar
                
$answeredCorrect false;
                
// Kolla om user svarade något rätt alternativ
                
foreach ($options as $opt) {
                  if (
$opt["is_correct"] && in_array($opt["option_id"], $optionsChosen)) {
                    
$answeredCorrect true;
                  }
                }
                
// Visa alternativ i rätt färg
                
foreach ($options as $opt) {
                  
$color "#000";
                  
// Om man svarade fel, rött
                  
if (in_array($opt["option_id"], $optionsChosen) && !$opt["is_correct"]) {
                    
$color "#C00";
                  }
                  
// Om man svarade rätt
                  
elseif ($answeredCorrect) {
                    
// Rätt svar
                    
if (in_array($opt["option_id"], $optionsChosen) && $opt["is_correct"]) {
                      
$color "#0C0";
                    }
                    
// Annat rätt alternativ
                    
elseif ($opt["is_correct"]) {
                      
$color "#0AC";
                    }
                  }
                  
// Om ett svar är rätt (utan att användaren svarade rätt)
                  
elseif ($opt["is_correct"]) {
                    
$color "#0C0";
                  }
                  
// Skapa rad
                  
echo "<p style='color:$color;'>" $opt["option_text"] . "</p>";
                }
                
?>
              </details>
            <?php
            
endforeach
            
?>
          </details>
        <?php
        
endforeach
        
?>

      </div>
      <div class="result-color-legend">
  <div class="row">
    <div class="circle red"></div>
    <p>Fel svar</p>
  </div>
  <div class="row">
    <div class="circle green"></div>
    <p>Rätt svar</p>
  </div>
  <div class="row">
    <div class="circle blue"></div>
    <p>Annat rätt alternativ</p>
  </div>
</div>
      <?php
    
}
      
?>
    </div>
    </div>

</body>

</html>