jan/e59-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update 6 files

Browse Source 
- /html/editpage.php
- /html/src/css/style.css
- /html/upload/index.php
- /html/users/index.php
- /html/robots.txt
- /html/index.php
This commit is contained in:
Jan BELLON 2024-03-14 19:56:53 +00:00
parent fe47cb9f3b
commit 5c723540ac
6 changed files with 743 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
html/editpage.php Normal file
View File

58
html/index.php
View File

@ -0,0 +1,58 @@
<?php
require("../include/variables.php");
require("../include/functions.php");
$pdo = sqlConnect($sqlDatabaseHost, $sqlDatabaseName, $sqlDatabaseUser, $sqlDatabasePass);
?>
<!DOCTYPE html>
<html lang="fr">
<head>
<?php fillHead($rootPageURL, $pageTitle, $darkTheme, $lightTheme);?>
<style></style>
</head>
<body class="body">
<header>
<div class="panel-content">
<?php fillHeader($rootPageURL, $headerTitle, $headerSubtitle);?>
</div>
</header>
<nav>
<div class="panel-content">
<?php fillNav($rootPageURL);?>
</div>
</nav>
<main>
<div class="content">
<div class="markdown-text">
<?php
$pageContent = markdownContent('../content/pages/index.md', $rootFilePath);
echo($pageContent);
?>
</div>
<div class="articles-list">
<?php
$sqlRequest = "SELECT articles.ID, articles.title, articles.date, articles.miniature, articles.resume, users.username, users.display_name FROM articles JOIN users ON articles.author = users.ID WHERE articles.classification <= :userAccreditation ORDER BY date DESC LIMIT 3";
$request = $pdo->prepare($sqlRequest);
$request->bindParam(":userAccreditation", $_SESSION['userAccreditation']);
$request->execute();
$result = $request->fetchAll(PDO::FETCH_ASSOC);
if ($result) {
listArticles($result, $rootPageURL);
}
?>
</div>
</main>
<footer>
<div class="panel-content">
<?php fillFooter($footerText);?>
</div>
</footer>
</body>
</html>

3
html/robots.txt
View File

@ -0,0 +1,3 @@
User-agent: *
Disallow: /src/
Disallow: /assets/

441
html/src/css/style.css
View File

@ -0,0 +1,441 @@
@font-face {
font-family: cfont;
src: url('/src/fonts/bahnschrift.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
/*################ GLOBAL ELEMENTS ##################*/
body {
font-family: cfont, Arial, sans-serif;
color: var(--text);
margin: 0;
}
a {
text-decoration: none;
color: var(--text-color);
}
img {
border-radius: 1em;
}
textarea {
border: none;
background: var(--panel-background);
color: var(--text);
border-radius: 1.5em;
padding: 1em;
margin: 0.5em 0;
}
input:focus, textarea:focus {
outline: none;
display: inline;
}
/*################ CLASSES ##################*/
/* GLOBAL */
.panel-content {
width: 90%;
display: flex;
margin: 0 auto;
}
.content {
width: 80%;
margin: 0 auto;
padding: 2em 0;
}
.error-message {
margin: auto;
vertical-align: middle;
border: 3px solid #5c0606;
width: 60%;
padding: 1em;
border-radius: 1em;
margin-top: 1em;
}
.button, button {
background-color: var(--buttons);
font-family: cfont, Arial, sans-serif;
color: var(--text);
border-radius: 10px;
padding: 0.5em 1em;
font-size: 1.2em;
display: inline-block;
border: none;
border-radius: 1.5em;
margin: 0.5em 0;
}
.status {
color: var(--text);
}
/* HEADER */
header {
justify-content: space-between;
width: 100%;
background: var(--panel-background);
display: flex;
}
.logo-container {
margin: 2em 0;
}
.logo-img {
height: 7em;
border-radius: 3.5em;
}
.logo-img:hover {
box-shadow: 0 0 15px rgba(255, 255, 255, 0.322);
}
.header-title-container {
text-align: right;
margin-top: 1em;
}
.header-title {
font-size: 3em;
}
/* NAV */
nav {
width: 100%;
margin: 0;
background: var(--panel-background);
display: flex;
}
.nav-link {
padding: 0.5em;
background-color: var(--buttons);
margin-right: 1em;
}
/* MAIN */
main {
font-family: Helvetica, Arial, sans-serif;
background: var(--background);
width: 100%;
margin: 0;
min-height: 100em;
}
main h1 {
font-family: cfont, Arial, sans-serif;
font-size: 3em;
font-weight: lighter;
}
/* FOOTER */
footer {
justify-content: space-between;
width: 100%;
margin: 0;
padding: 1em;
background: var(--panel-background);
display: flex;
}
/* ARTICLES LISTING */
.articles-list .article-preview {
padding: 2em 0.5em;
display: flex;
}
.articles-list .article-illustration {
padding-right: 1em;
}
.articles-list .article-miniature {
max-width: 15em;
}
.articles-list .article-info {
vertical-align: top;
}
.articles-list .article-data {
font-size: 0.8em;
}
.articles-list .article-title {
font: 1.5em cfont, Arial;
padding: 0.5em 0;
}
/* TEXT INPUT */
.text-input {
display: flex;
align-items: center;
gap: 0.5em;
background-color: var(--panel-background);
width: 20em;
border-radius: 5em;
padding: 0.5em;
margin: 0.5em 0;
}
.text-input .input-icon {
width: 1.2em;
fill: var(--text);
padding: 0 0.5em;
flex-shrink: 0;
}
.text-input input {
width: 100%;
min-width: 5em;
height: 2em;
font-family: cfont, Arial, sans-serif;
border: none;
background: none;
color: var(--text);
}
/* FILE INPUT */
.file-input {
margin: 0.5em 0;
}
.file-input input[type='file']::file-selector-button {
margin-right: 1em;
font-family: cfont, Arial, sans-serif;
border: none;
background-color: var(--panel-background);
padding: 0.5em 1em;
border-radius: 1.5em;
color: var(--text);
cursor: pointer;
}
.file-input input[type='file'] {
background-color: var(--buttons);
padding: 0.5em;
border-radius: 1.5em;
}
/* SELECT INPUT */
.select-input {
display: flex;
align-items: center;
gap: 0.5em;
background-color: var(--panel-background);
width: 20em;
border-radius: 5em;
padding: 0.5em 1em;
margin: 0.5em 0;
}
.select-input select {
width: 100%;
min-width: 5em;
height: 2em;
font-family: cfont, Arial, sans-serif;
border: none;
background: var(--background);
border-radius: 1em;
padding: 0.5em;
color: var(--text);
}
/* FORM */
.form {
background-color: var(--panel-background);
display: block;
text-align: center;
padding: 0.2em 3em;
margin: auto;
margin-top: 5em;
border-radius: 1em;
width: 25em;
}
.form .form-title {
font-family: cfont, Arial, sans-serif;
font-size: 2em;
margin: 1em auto;
}
.form .text-input {
background-color: var(--background);
margin: 0.5em auto 1.5em auto;
}
.form .text-input .input-icon, .form .text-input label {
width: 0;
}
.form .button, .form button {
margin: 1em auto;
}
/* USER WIDGET */
.user-widget {
background-color: var(--panel-background);
display: flex;
align-items: center;
gap: 1em;
padding: 0.5em 1em 0.5em 0.5em;
border-radius: 10em;
width: min-content;
}
.user-widget .user-pp {
height: 4em;
}
.user-widget .user-pp img {
width: 4em;
height: 4em;
border-radius: 4em;
}
.user-widget .user-info {
margin: auto 1em;
}
.user-widget .user-display-name {
font-weight: bold;
display: flex;
}
.user-widget .certification {
transform: translate(0, -15%);
width: 1.5em;
margin-left: 0.5em;
}
/* USER PROFILE */
.user-profile .user-banner {
width: 100%;
height: 12em;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.user-profile .user-header {
background-color: var(--panel-background);
padding-bottom: 2em;
}
.user-profile .user-header-content {
width: 80%;
margin: 0 auto;
}
.user-profile .user-pp {
height: 6em;
}
.user-profile .user-pp img {
width: 10em;
height: 10em;
border-radius: 5em;
transform: translate(0, -60%);
border: 0;
background-color: var(--panel-background);
}
.user-profile .display-name {
font-weight: bold;
display: inline;
}
.user-profile .user-level {
display: inline;
}
.user-profile .certification {
transform: translate(0, +22%);
width: 1.5em;
}
.user-profile .bio {
padding: 1em 0;
}
.user-profile .user-articles {
margin-top: 5em;
}
.user-profile .user-content {
width: 80%;
margin: 0 auto;
}
/* PHONE SCREEN */
@media(max-width: 750px) {
body {
font-size: 0.8em
}
.articles-list {
display: block;
}
.articles-list .article-preview {
padding: 2em 0.5em;
display: block;
align-items: center;
}
.articles-list .article-illustration {
margin: 0 auto;
padding: 2em 0;
}
.articles-list .article-illustration img {
max-width: 100%;
margin: 0 auto;
}
.articles-list .article-info {
margin: 0 auto;
}
.articles-list .article-data {
font-size: 1em;
}
.articles-list .article-title {
font-size: 2em;
}
.articles-list .article-resume {
font-size: 1.2em;
}
.text-input {
width: 15em;
}
.form {
width: 16em;
}
}

93
html/upload/index.php Normal file
View File

@ -0,0 +1,93 @@
<?php
require("../../include/variables.php");
require("../../include/functions.php");
$pdo = sqlConnect($sqlDatabaseHost, $sqlDatabaseName, $sqlDatabaseUser, $sqlDatabasePass);
if ($_SESSION['level'] < 1) {
header("Location: login.php");
http_response_code(404);
}
if(isset($_POST['article-content']) && isset($_POST['classification'])) {
$sqlRequest = "SELECT ID FROM articles WHERE ID >= 1 ORDER BY ID DESC LIMIT 1";
$request = $pdo->prepare($sqlRequest);
$request->bindParam(":userAccreditation", $_SESSION['userAccreditation']);
$request->execute();
$result = $request->fetchAll(PDO::FETCH_ASSOC);
$articleID = (int)$result[0]['ID'] + 1;
file_put_contents($rootFilePath . "content/articles/" . $articleID . ".md", nl2br($_POST['article-content']));
$sqlRequest = "INSERT INTO articles (ID, title, author, resume, classification) VALUES (:articleID, :title, :author, :resume, :classification)";
$request = $pdo->prepare($sqlRequest);
$request->bindParam(":articleID", $articleID);
$request->bindParam(":title", htmlspecialchars($_POST['article-title']));
$request->bindParam(":author", $_SESSION['userID']);
$request->bindParam(":resume", htmlspecialchars($_POST['article-resume']));
$request->bindParam(":classification", $_POST['classification'], PDO::PARAM_INT);
if($request->execute()) {
header("Location: /editor?article=" . $articleID);
} else {
$status = "Erreur SQL";
}
}
?>
<!DOCTYPE html>
<html lang="fr">
<head>
<?php fillHead($rootPageURL, $pageTitle, $darkTheme, $lightTheme);?>
<style>
.text-input label {
width: 0;
}
textarea {
min-width: 80%;
}
.article-content-input {
min-height: 40em;
}
</style>
</head>
<body class="body">
<header>
<div class="panel-content">
<?php fillHeader($rootPageURL, $headerTitle, $headerSubtitle);?>
</div>
</header>
<nav>
<div class="panel-content">
<?php fillNav($rootPageURL);?>
</div>
</nav>
<main>
<div class="content">
<form action="#" method="post">
<div>
<div><h1>Rédiger un article</h1></div>
<div class="status"><?=$status?></div>
<?php textInput("text", "", "article-title", "Titre de l'article", "")?>
<div><textarea name="article-resume" placeholder="Résumé de l'article (200 cacactères) ..." class="article-resume-input" maxlength="200"></textarea></div>
<div><textarea name="article-content" placeholder="Contenu de l'article (MarkDown) ..." class="article-content-input"></textarea></div>
<?php
selectInput("classification", "Classification", $confidentialLevels, 0);
?>
<div><button type="submit">Publier</button></div>
</div>
</form>
</div>
</main>
<footer>
<div class="panel-content">
<?php fillFooter($footerText);?>
</div>
</footer>
</body>
</html>

148
html/users/index.php Normal file
View File

@ -0,0 +1,148 @@
<?php
require("../../include/variables.php");
require("../../include/functions.php");
$pdo = sqlConnect($sqlDatabaseHost, $sqlDatabaseName, $sqlDatabaseUser, $sqlDatabasePass);
if(isset($_GET['u']) && empty($_GET['u']) == false) {
$request = $pdo->prepare("SELECT ID, username, display_name, level, profile_picture, banner, bio FROM users WHERE username = :username");
$request->bindParam(":username", htmlspecialchars($_GET['u']));
$request->execute();
$result = $request->fetchAll(PDO::FETCH_ASSOC);
if($result) {
$userID = $result[0]['ID'];
$userName = $result[0]['username'];
$userDisplayName = $result[0]['display_name'];
$userLevel = $result[0]['level'];
$userPPURL = $result[0]['profile_picture'] == NULL ? "https://abs.twimg.com/sticky/default_profile_images/default_profile_400x400.png" : $result[0]['profile_picture'];
$userBanner = $result[0]['banner'] = NULL ? "" : $result[0]['banner'];
$userBio = $result[0]['bio'];
} else {
$userID = 0;
$userName = htmlspecialchars($_GET['u']);
$userDisplayName = "Unknown";
$userLevel = 0;
$userPPURL = "https://abs.twimg.com/sticky/default_profile_images/default_profile_400x400.png";
$userBanner = "";
$userBio = "";
}
} else {
$userID = 0;
$userName = htmlspecialchars($_GET['u']);
$userDisplayName = "Unknown";
$userLevel = 0;
$userPPURL = "https://abs.twimg.com/sticky/default_profile_images/default_profile_400x400.png";
$userBanner = "";
$userBio = "";
}
?>
<!DOCTYPE html>
<html lang="fr">
<head>
<?php fillHead($rootPageURL, $pageTitle, $darkTheme, $lightTheme);?>
<style>
.content {
padding: 0;
width: 100%;
}
.user-banner {
<?php
if (empty($userBanner)) {
echo "background-color: black";
} else {
echo "background-image: url('" . $userBanner . "');";
}
?>
}
.certification {
fill: <?php echo $userLevel > 0 ? $certificationColors[$userLevel] : "#000000"?>;
}
</style>
</head>
<body class="body">
<header>
<div class="panel-content">
<?php fillHeader($rootPageURL, $headerTitle, $headerSubtitle);?>
</div>
</header>
<nav>
<div class="panel-content">
<?php fillNav($rootPageURL);?>
</div>
</nav>
<main>
<div class="content">
<div class="user-profile">
<div class="user-banner"></div>
<div class="user-header">
<div class="user-header-content">
<div class="user-pp"><img src="<?=$userPPURL?>"></div>
<div class="status"><?=$status?></div>
<div class="user-info">
<div class="names">
<div class="display-name"><?=$userDisplayName?></div>
<div class="user-level">
<?php
if($userLevel > 1) {
echo '<svg class="certification" viewBox="0 0 22 22" aria-label="Compte certifié" role="img"><g><path d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"></path></g></svg>';
}
?>
</div>
<div class="username">@<?=$userName?></div>
<div class="bio"><?=$userBio?></div>
</div>
<div>
<?php
if ($userID == $_SESSION['userID']) {
echo '<a href="/account" class="button">Editer votre profil</a>';
}
?>
</div>
</div>
</div>
</div>
<div class="user-articles">
<div class="user-content">
<?php
$search = isset($_GET['search']) ? "%" . htmlspecialchars($_GET['search']) . "%" : "%%";
$request = $pdo->prepare("SELECT ID, title, date, miniature, resume FROM articles WHERE (title LIKE :search OR ID LIKE :search) AND author = :userID ORDER BY date DESC");
$request->bindParam(":search", $search);
$request->bindParam(":userID", $userID);
$request->execute();
$result = $request->fetchAll(PDO::FETCH_ASSOC);
echo ('<h1>Articles de ' . $userDisplayName . '</h1>');
echo ('<form action="#" method="get">');
$shapePath = '<path d="M10.25 3.75c-3.59 0-6.5 2.91-6.5 6.5s2.91 6.5 6.5 6.5c1.795 0 3.419-.726 4.596-1.904 1.178-1.177 1.904-2.801 1.904-4.596 0-3.59-2.91-6.5-6.5-6.5zm-8.5 6.5c0-4.694 3.806-8.5 8.5-8.5s8.5 3.806 8.5 8.5c0 1.986-.682 3.815-1.824 5.262l4.781 4.781-1.414 1.414-4.781-4.781c-1.447 1.142-3.276 1.824-5.262 1.824-4.694 0-8.5-3.806-8.5-8.5z"></path>';
textInput("text", $shapePath, "search", "Chercher", "");
echo ('</form>');
if ($result) {
echo('<div class="articles-list">');
listArticles($result, $rootPageURL);
echo ('</div>');
} else {
echo ($userDisplayName . ' n\'a encore rien publié');
}
?>
</div>
</div>
</form>
</div>
</div>
</main>
<footer>
<div class="panel-content">
<?php fillFooter($footerText);?>
</div>
</footer>
</body>
</html>