From 6495f27bcf64d1c513a4d3bb9856d5f6a0d07091 Mon Sep 17 00:00:00 2001 From: Jonas Leder <git@jonasled.de> Date: Mon, 12 Apr 2021 19:38:30 +0200 Subject: [PATCH] add api and custom element for blog in footer --- .gitignore | 1 + js/customElements/blogFooter.js | 26 ++++++++++++++++++++++++++ js/script.js | 6 ++++-- public/API/config.php | 16 ++++++++++++++++ public/API/getBlogElements.php | 29 +++++++++++++++++++++++++++++ public/API/mysql.php | 11 +++++++++++ public/internal/footer.php | 4 +--- 7 files changed, 88 insertions(+), 5 deletions(-) create mode 100644 js/customElements/blogFooter.js create mode 100644 public/API/config.php create mode 100644 public/API/getBlogElements.php create mode 100644 public/API/mysql.php diff --git a/.gitignore b/.gitignore index e34d398..51f550e 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,6 @@ #config file public/internal/config.php +public/API/config.phpconfig #phpstorm .idea/ diff --git a/js/customElements/blogFooter.js b/js/customElements/blogFooter.js new file mode 100644 index 0000000..26e2705 --- /dev/null +++ b/js/customElements/blogFooter.js @@ -0,0 +1,26 @@ +class blogFooter extends HTMLElement { + constructor(){ + super(); + console.log("initializing footer"); + let xhr = new XMLHttpRequest(); + let ul = document.createElement("ul"); + xhr.onreadystatechange = () => { + if(xhr.readyState === 4 && xhr.status === 200){ + let blog = JSON.parse(xhr.responseText); + blog.forEach((element) => { + let li = document.createElement("li"); + let a = document.createElement("a"); + a.href = "/post.php?id=" + element["id"]; + a.innerText = element["title"]; + li.appendChild(a); + ul.appendChild(li); + }); + this.appendChild(ul); + } + } + xhr.open("GET", "/API/getBlogElements.php?position=footer"); + xhr.send(); + } +} + +customElements.define("jl-footer_blog", blogFooter); \ No newline at end of file diff --git a/js/script.js b/js/script.js index 5670e80..5946440 100644 --- a/js/script.js +++ b/js/script.js @@ -1,8 +1,10 @@ -require("./customElements/cookie"); require("./burgerMenu"); require("./error"); require("./imgPreview"); require("./includeHTML"); require("./ntpGraph"); require("./ntpMenu"); -require("./customElements/svgLoader"); \ No newline at end of file + +require("./customElements/cookie"); +require("./customElements/svgLoader"); +require("./customElements/blogFooter"); \ No newline at end of file diff --git a/public/API/config.php b/public/API/config.php new file mode 100644 index 0000000..10b2400 --- /dev/null +++ b/public/API/config.php @@ -0,0 +1,16 @@ +<?php +$mysqlServer = "localhost"; +$mysqlUser = "root"; +$mysqlPassword = "password"; +$mysqlDatabase = "website"; + +$contactmail = "m6LCSL4haTk7z4ZrgqQn8X@jonasled.de"; + +//Hcaptcha: +$sitekey = "10000000-ffff-ffff-ffff-000000000001"; +$secretkey = "0x0000000000000000000000000000000000000000"; + +$footerMaxPost = 5; +$homeMaxPost = 3; + +$trackURL = "https://matomo.jonasled.de/matomo.php?idsite=1&rec=1"; diff --git a/public/API/getBlogElements.php b/public/API/getBlogElements.php new file mode 100644 index 0000000..d9b7a81 --- /dev/null +++ b/public/API/getBlogElements.php @@ -0,0 +1,29 @@ +<?php +include "config.php"; +include "mysql.php"; + +$position = $_GET['position']; + +if($position == "index"){ + $limit = $homeMaxPost; +} else if($position == "footer"){ + $limit = $footerMaxPost; +} else { + die("wrong parameter"); +} +$responseJSON = []; + +$result = $conn->query("SELECT * FROM posts order by id desc limit $limit"); +if ($result->num_rows > 0) { + while ($row = $result->fetch_assoc()) { + $blogElement = [ + "title" => $row["title"], + "id" => $row["id"], + "content" => $row["content"] + ]; + + array_push($responseJSON, $blogElement); + } +} +header('Content-Type: application/json'); +echo json_encode($responseJSON); \ No newline at end of file diff --git a/public/API/mysql.php b/public/API/mysql.php new file mode 100644 index 0000000..5c1d19b --- /dev/null +++ b/public/API/mysql.php @@ -0,0 +1,11 @@ +<?php +include "config.php"; + +$conn = new mysqli($mysqlServer, $mysqlUser, $mysqlPassword, $mysqlDatabase); +// Check connection +if ($conn->connect_error) { + include "500.php"; + + header($_SERVER['SERVER_PROTOCOL'] . ' 500 Internal Server Error', true, 500); + die(getError500()); +} diff --git a/public/internal/footer.php b/public/internal/footer.php index 6ded459..f0fee0c 100644 --- a/public/internal/footer.php +++ b/public/internal/footer.php @@ -29,9 +29,7 @@ function getFooter(){ </div> <div id="newestPost"> <h3>Neueste Beiträge:</h3> - <ul> - $newestPost - </ul> + <jl-footer_blog></jl-footer_blog> </div> <div class="center"> <p class="center"> -- GitLab