Skip to content
Snippets Groups Projects
Commit 7c741c17 authored by Silas Meister's avatar Silas Meister
Browse files

WIP change news file

parent 59f3303d
No related branches found
No related tags found
No related merge requests found
<!DOCTYPE html>
<html lang="de">
<head>
<title>NASA - Admin</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" style="text/css" href="styles.css" />
</head>
<body>
<header class="admin-header"><h1>Admin-Page</h1></header>
<form class="admin-form" action="admin.html" method="post" accept-charset="UTF-8">
<fieldset>
<legend>Select a News file</legend>
<input id="news-file" name="news-file" type="file" accept=".json" required />
<input type="submit" value="Apply" />
</fieldset>
</form>
</body>
</html>
\ No newline at end of file
......@@ -7,8 +7,8 @@
<script src="functions.js"></script>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body onload="">
<header>
<body class="nasa-body">
<header class="nasa-header">
<img class="nasa-img" src="img/nasa.png" alt="" />
<nav>
......
......@@ -2,6 +2,12 @@
ini_set("display_errors", 1);
ini_set("display_startup_errors", 1);
$file = "data/news_01.json";
if (!file_exists($file)) {
die("File not found");
}
$fileContents = file_get_contents('data/news_01.json');
if ($fileContents === NULL)
......@@ -19,8 +25,8 @@
<script src="functions.js"></script>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body onload="">
<header>
<body class="nasa-body">
<header class="nasa-header">
<img class="nasa-img" src="img/nasa.png" alt="" />
<nav>
......@@ -39,7 +45,7 @@
</form>
</li>
<li><img src="img/share_icon.png" alt="" /></li>
<li class="admin-button"><a href="admin.html">Admin</a></li>
<li class="admin-button"><a href="php/admin.php">Admin</a></li>
</ul>
<ul class="center-nav">
......
<?php declare(strict_types=1);
require_once 'Page.php';
require_once 'constants.php';
class Admin extends Page
{
private const FILE_NAME = "fileName";
protected function __construct()
{
parent::__construct();
session_start();
/*if (isset($_SESSION['EXPIRES']) && (time() - $_SESSION['EXPIRES'] > 3600)) {
session_unset();
session_destroy();
header("Location: login.php");
} else {
header("Location: login.php");
}*/
}
public function __destruct()
{
parent::__destruct();
}
protected function getViewData():array
{
return array();
}
protected function generateView():void
{
$data = $this->getViewData();
$this->generatePageHeader('NASA Admin');
$fileName = self::FILE_NAME;
echo <<<EOT
<header class="admin-header"><h1>Admin-Page</h1></header>
<form class="admin-form" action="Admin.php" method="post" accept-charset="UTF-8">
<fieldset>
<legend>Select a News file</legend>
<input id="$fileName" name="$fileName" type="file" accept=".json" required />
<input type="submit" value="Apply" />
</fieldset>
</form>
EOT;
$this->generatePageFooter();
}
protected function processReceivedData():void
{
parent::processReceivedData();
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (isset($_POST[self::FILE_NAME])) {
$_SESSION[NEWS_FILE] = $_POST[self::FILE_NAME];
header("Location: ../index.php");
die();
}
}
}
public static function main():void
{
try {
$page = new Admin();
$page->processReceivedData();
$page->generateView();
} catch (Exception $e) {
header("Content-type: text/html; charset=UTF-8");
echo $e->getMessage();
}
}
}
Admin::main();
\ No newline at end of file
<?php declare(strict_types=1);
require_once 'Page.php';
require_once 'constants.php';
class Index extends Page {
protected function __construct()
{
parent::__construct();
session_start();
}
public function __destruct()
{
parent::__destruct();
}
protected function getViewData():array
{
return array();
}
protected function generateView():void
{
$data = $this->getViewData();
$this->generatePageHeader('NASA');
$news = $this->fetchNews();
echo <<<EOT
<header class="nasa-header">
<img class="nasa-img" src="img/nasa.png" alt="" />
<nav>
<ul class="top-nav">
<li><a href="#">Missions</a></li>
<li><a href="#">Galleries</a></li>
<li><a href="#">NASA TV</a></li>
<li><a href="#">Follow NASA</a></li>
<li><a href="#">Downloads</a></li>
<li><a href="#">About</a></li>
<li><a href="#">NASA Audiences</a></li>
<li>
<form class="search-form" method="post" accept-charset="UTF-8">
<input type="search" placeholder="Search" />
<input type="button" value="" />
</form>
</li>
<li><img src="img/share_icon.png" alt="" /></li>
<li class="admin-button"><a href="php/admin.php">Admin</a></li>
</ul>
<ul class="center-nav">
<li><a href="#">International Space Station</a></li>
<li><a href="#">Journey to Mars</a></li>
<li><a href="#">Earth</a></li>
<li><a href="#">Technology</a></li>
<li><a href="#">Aeronautics</a></li>
<li><a href="#">Solar System and Beyond</a></li>
<li><a href="#">Education</a></li>
<li><a href="#">History</a></li>
<li><a href="#">Benefits to You</a></li>
</ul>
</nav>
</header>
<main>
<article class="content-large">
<div>
<div class="article-content-container">
<a class="article-link" href="#"></a>
<img id="slide-image" class="article-image" src="img/nasa_news_1.jpg" alt="" />
<div class="article-content">
<div id="slide-container" class="news-headline">
<h3>Space Station</h3>
<h2>Expedition 48 Crew Lands Safely on Earth</h2>
</div>
<div class="camera-triangle"></div>
<img class="camera-img" src="img/camera.png" alt="" />
</div>
</div>
</div>
</article>
<article class="content-small">
<div>
<div class="article-content-container">
<a class="article-link" href="#"></a>
<div class="article-content nasa-events-container">
<div class="nasa-events-top">
EOT;
$news = $newsList[0];
$title = htmlspecialchars($news["title"]);
$imageurl = htmlspecialchars($news["imgurl"]);
$content = htmlspecialchars($news["content"]);
echo <<<EOT
<p class="nasa-events-title">$title</p>
<div class="line"></div>
<a class="nasa-event" href="#">$content</a>
</div>
<div class="nasa-events-bottom">
<div class="line"></div>
<div class="nasa-events-bottom-horizontal">
<a href="#">Calendar</a>
<a href="#">Launches and Landings</a>
</div>
</div>
</div>
</div>
</div>
</article>
<article class="content-small">
<div>
<div class="article-content-container">
EOT;
$news = $newsList[1];
$title = htmlspecialchars($news["title"]);
$imageurl = htmlspecialchars($news["imgurl"]);
$content = htmlspecialchars($news["content"]);
echo <<<EOT
<a class="article-link" href="#"></a>
<img class="article-image" src="$imageurl" alt="" />
<div class="article-content overlay">
<h4 class="overlay-title">$title</h4>
<h4 class="overlay-description">$content</h4>
</div>
</div>
</div>
</article>
<article class="content-medium">
<div>
<div class="article-content-container">
EOT;
$news = $newsList[0];
$title = htmlspecialchars($news["title"]);
$imageurl = htmlspecialchars($news["imgurl"]);
$content = htmlspecialchars($news["content"]);
echo <<<EOT
<a class="article-link" href="#"></a>
<img class="article-half-image" src="$imageurl" alt="" />
<div class="article-triangle"></div>
<div class="article-content-second-half nasa-launch">
<h4>$title</h4>
<p>$content</p>
<div class="nasa-launch-links">
<a href="#">Mission Site</a>
<a href="#">Briefing Schedule</a>
<a href="#">Launch Updates</a>
<a href="#">Video to Bennu and Back</a>
</div>
</div>
</div>
</div>
</article>
<article class="content-small">
<div>
<div class="article-content-container">
<a class="article-link" href="#"></a>
<div class="article-content">
<iframe src="https://www.youtube.com/embed/XY6idnRlPsU?si=HnFL8-if6-zB6tU2" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
</div>
</div>
</article>
<article class="content-medium">
<div>
<div class="article-content-container">
<a class="article-link" href="#"></a>
<img class="article-image" src="img/ocean_worlds.jpg" alt="" />
</div>
</div>
</article>
<article class="content-small">
<div>
<div class="article-content-container">
<a class="article-link" href="#"></a>
<img class="article-image article-image-full" src="img/tweet.png" alt="" />
</div>
</div>
</article>
</main>
EOT;
$this->generatePageFooter();
}
protected function processReceivedData():void
{
parent::processReceivedData();
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (isset($_POST[self::FILE_NAME])) {
$_SESSION[NEWS_FILE] = $_POST[self::FILE_NAME];
header("Location: ../index.php");
die();
}
}
}
private function fetchNews(): array {
$file = DEFAULT_NEWS_FILE;
if (isset($_SESSION[NEWS_FILE]))
$file = $_SESSION[NEWS_FILE]
if (!file_exists($file)) {
die("File not found");
}
$fileContents = file_get_contents('data/news_01.json');
if ($fileContents === NULL)
return;
$json = json_decode($fileContents, true);
return $json["news"];
}
public static function main():void
{
try {
$page = new Index();
$page->processReceivedData();
$page->generateView();
} catch (Exception $e) {
header("Content-type: text/html; charset=UTF-8");
echo $e->getMessage();
}
}
}
Index::main();
\ No newline at end of file
<?php declare(strict_types=1);
abstract class Page {
protected mysqli $database;
protected function __construct() {
return;
error_reporting(E_ALL);
$host = "localhost";
/********************************************/
// This code switches from the the local installation (XAMPP) to the docker installation
if (gethostbyname('mariadb') != "mariadb") { // mariadb is known?
$host = "mariadb";
}
/********************************************/
$this->database = new mysqli("localhost","my_user","my_password","my_db");
// Check connection
if ($this->database->connect_errno) {
echo "Failed to connect to MySQL: " . $mysqli -> connect_error;
exit();
}
// set charset to UTF8!!
if (!$this->database->set_charset("utf8")) {
throw new Exception($this->_database->error);
}
}
protected function __destruct() {
}
protected function generatePageHeader(string $title = ""):void
{
$title = htmlspecialchars($title);
header("Content-type: text/html; charset=UTF-8");
echo <<<EOT
<!DOCTYPE html>
<html lang="de">
<head>
<title>$title</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" style="text/css" href="../styles.css" />
</head>
<body>\n
EOT;
}
protected function generatePageFooter():void
{
echo <<<EOT
</body>
</html>
EOT;
}
protected function processReceivedData():void {
}
}
\ No newline at end of file
<?php
define("NEWS_FILE", "news_file");
define("DEFAULT_NEWS_FILE", "data/news_01.json");
?>
\ No newline at end of file
* {
font-family: Verdana, Geneva, Tahoma, sans-serif;
box-sizing: border-box;
color: #eeeeee;
}
body, html {
......@@ -10,12 +9,20 @@ body, html {
width: 100%;
}
body {
a {
text-decoration: none;
}
.nasa-body {
position: relative;
background-color: #050914;
}
header {
.nasa-body * {
color: #eeeeee;
}
.nasa-header {
position: sticky;
top: 0;
z-index: 1;
......@@ -25,17 +32,13 @@ header {
background-size: auto 100%;
}
a {
text-decoration: none;
}
nav ul {
.top-nav ul, .center-nav ul {
list-style-type: none;
margin: 0;
padding: 0;
}
nav ul li a {
.top-nav ul li a, .center-nav ul li a {
text-decoration: none;
}
......@@ -414,6 +417,40 @@ main {
height: 100%;
}
/* admin.html Page */
.admin-header {
text-align: center;
}
.admin-header > h1 {
font-size: 1.5rem;
}
.admin-form {
text-align: center;
}
.admin-form > fieldset {
font-size: 1rem;
display: inline;
}
.admin-form input[type="submit"] {
background-color: lightgray;
cursor: pointer;
font-size: 0.8rem;
padding: 0.5rem;
border-radius: 0.1rem;
}
.admin-form input[type=file]::file-selector-button {
padding: 0.5em;
font-size: 0.8rem;
border-radius: 0.1em;
background-color: lightgray;
}
/*.content-small div div, .content-medium div div, .content-large div div {
background-color: blue;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment