Add article creation frontend

assets/script.js

@@ -173,6 +173,28 @@ async function initAjax() {
     await onPageLoad();
 }
 
+async function togglearticlecreate(){
+    let articleContainerElement = document.getElementById("articlecreatecontainer");
+
+    articleContainerElement.classList.toggle("hidden");
+}
+
+async function submitarticle(){
+    let articleTitleElement = document.getElementById("articletitleinput");
+    let articleBodyElement = document.getElementById("articlebodyinput");
+    await doAction("/newsarticle", {
+       action: "addNewsArticle",
+        title: articleTitleElement,
+        body: articleBodyElement
+    });
+}
+
+async function articleInit(){
+    let articleSubmitElement = document.getElementById("articlesubmit");
+    await togglearticlecreate();
+    articleSubmitElement.addEventListener("click", submitarticle);
+}
+
 async function onPageLoad() {
     await restoreUserInfo();
     let currentSite = localStorage.getItem("currentSite");
@@ -189,6 +211,9 @@ async function onPageLoad() {
     if (currentSite === "home" && currentPage === "account" && isLoggedIn()) {
         await showDashboardGreeting();
     }
+    if (currentSite === "news" && currentPage === "index" && isLoggedIn()) {
+        await articleInit();
+    }
 }
 
 async function navigateTo(site, page) {

assets/style.css

@@ -365,3 +365,21 @@ body:has(.ye-span:hover) {
     background-repeat: repeat !important;
     background-size: 10% !important;
 }
+
+#articlecreate {
+    position: fixed;
+    border: 5px solid var(--primary);
+    z-index: 5;
+}
+
+#articlecreatecontainer{
+    position: fixed;
+    width: 100vw;
+    height: 100vh;
+    z-index: 4;
+    backdrop-filter: blur(2px);
+}
+
+.hidden {
+    display: none !important;
+}

endpoints/newsarticle.php

@@ -0,0 +1,16 @@
+<?php
+
+require_once "lib/newsarticle.php";
+
+function endpoint($endpoint_data): array
+{
+
+    return match ($endpoint_data["action"]) {
+        "getNewsArticles" => getNewsArticles(),
+        "addNewsArticle" => addNewsArticle(
+            $endpoint_data["title"],
+            $endpoint_data["body"]
+        ),
+        default => ["Status" => "Fail", "message" => "Invalid action"],
+    };
+}

lib/account.php

@@ -89,10 +89,11 @@ function verifyPassword($userID, $password): bool
 function UpdateSession(): void
 {
     global $mysqli;
-    $stmt = $mysqli->prepare("SELECT FirstName, LastName, Nickname, Email, MinecraftNick, PrivilegeLevel, LastLoginAt, LoginCount, ClassID, FavoriteColor FROM Users WHERE ID = ? AND isActivated = 1");
+    $stmt = $mysqli->prepare("SELECT ID, FirstName, LastName, Nickname, Email, MinecraftNick, PrivilegeLevel, LastLoginAt, LoginCount, ClassID, FavoriteColor FROM Users WHERE ID = ? AND isActivated = 1");
     $stmt->bind_param("i", $_SESSION["ID"]);
     $stmt->execute();
 
+    $id = 0;
     $first_name = "";
     $last_name = "";
     $nickname = "";
@@ -103,10 +104,11 @@ function UpdateSession(): void
     $favorite_color = 0;
     $lastLoginAt = null;
     $loginCount = 0;
-    $stmt->bind_result($first_name, $last_name, $nickname, $email, $minecraft_nickname, $privilege_level, $lastLoginAt, $loginCount, $class_id, $favorite_color);
+    $stmt->bind_result($id, $first_name, $last_name, $nickname, $email, $minecraft_nickname, $privilege_level, $lastLoginAt, $loginCount, $class_id, $favorite_color);
     $stmt->fetch();
     $stmt->close();
 
+    $_SESSION["id"] = $id;
     $_SESSION["first_name"] = $first_name;
     $_SESSION["last_name"] = $last_name;
     $_SESSION["nickname"] = $nickname;

lib/newsarticle.php

@@ -0,0 +1,37 @@
+<?php
+
+function getNewsArticles() :array
+    {
+        global $mysqli;
+
+        $articles = [];
+        if (isLoggedIn()) {
+            $result = $mysqli->query("SELECT NewsArticles.ID, NewsArticles.WrittenAt, NewsArticles.WrittenBy, NewsArticles.Title, NewsArticles.Body, NewsArticles.FileList, Users.Nickname FROM NewsArticles INNER JOIN Users ON NewsArticles.WrittenBy = Users.ID; ");
+
+            // Check if the query executed Successfully
+            if ($result) {
+                while ($row = $result->fetch_assoc()) {
+                    $articles[] = $row;
+                }
+            }
+        }
+
+        return $articles;
+}
+
+function addNewsArticle($title="Nazov", $body="Obsah") :array
+{
+    global $mysqli;
+
+    $output = ["Status" => "Fail"]; // Default Status is "Fail"
+    if (isLoggedIn()) {
+        $query = $mysqli->prepare("INSERT INTO NewsArticles (WrittenBy, Title, Body, FileList) VALUES (?, ?, ?, ?);");
+        $query->bind_params("issi", $_SESSION["id"], htmlspecialchars($title), htmlspecialchars($body), 0);
+        $query->execute();
+        if ($query->affected_rows > 0) {
+            $output["Status"] = "Success";
+        }
+    }
+    $query->close();
+    return $output;
+}

pages/news/index.html

@@ -1,8 +0,0 @@
-<page minimal_permission_level="2" secret="no" page_title="Novinky"></page>
-<header>
-    <h1 class="title"></h1>
-    <p>Adlerka študentské news</p>
-    <hr>
-    <p>Rohová časť stola v a A103 spáchala samovraždu po dotyku Richarda Mikloša!!!</p>
-</header>
-

pages/news/index.php

@@ -0,0 +1,43 @@
+<?php
+
+require_once "lib/router.php";
+require_once "lib/newsarticle.php";
+
+global $routerConfig;
+
+$output =  file_get_contents($routerConfig["template_dir"] . "newsArticles.html");
+
+$articles_out = "";
+$articles = getNewsArticles();
+
+foreach ($articles as $article){
+    $articleTitle = htmlspecialchars($article["Title"]);
+    $articleBody = htmlspecialchars($article["Body"]);
+    $articleFileList = $article["FileList"];
+    $articleWrittenBy = $article["WrittenBy"];
+    $articleWrittenAt = htmlspecialchars($article["WrittenAt"]);
+    $articleWrittenByName = htmlspecialchars($article["Nickname"]);
+
+    $articles_out .= "<article>
+<h2 class='newstitle'>$articleTitle</h2>
+<br>
+<p class='newsauthor'>$articleWrittenByName</p>
+<p class='newsdate'>$articleWrittenAt</p>
+<hr>
+<div class='newsbody'>
+$articleBody
+</div>
+</article>";
+}
+
+$output = str_replace("__TEMPLATE__ARTICLES_HERE__", $articles_out, $output);
+
+return [
+    "output" => $output,
+    "parameters" =>
+        [
+            "minimal_permission_level" => 2,
+            "secret" => "no",
+            "page_title" => "Novinky"
+        ]
+];

templates/newsArticles.html

@@ -0,0 +1,17 @@
+<header>
+  <h1 class="title"></h1>
+  <p>Adlerka študentské news</p>
+  <button id="articlecreateopen" onclick="togglearticlecreate()"><i class="ri-add-circle-line"></i></button>
+  <hr>
+</header>
+<div id="articleslist">
+  __TEMPLATE__ARTICLES_HERE__
+</div>
+
+<div id="articlecreatecontainer" class="hidden">
+  <div id="articlecreate">
+    <input type="text" placeholder="Article Title" id="articletitleinput"><br>
+    <textarea id="articlebodyinput" placeholder="Article Body"></textarea><br>
+    <button id="articlesubmit" onclick="submitArticle()"></button>
+  </div>
+</div>