Compare commits
4 Commits
6887b41fcc
...
a15d2260d1
| Author | SHA1 | Date | |
|---|---|---|---|
| a15d2260d1 | |||
| dced7ae0db | |||
| 5727c54b1c | |||
| f9001122d9 |
147
about.php
Normal file
147
about.php
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
<?php
|
||||||
|
require_once 'includes/config.php';
|
||||||
|
require_once 'includes/DeltaConverter.php';
|
||||||
|
require_once 'includes/Stats.php';
|
||||||
|
|
||||||
|
$config = Config::load();
|
||||||
|
$about = $config['about'] ?? [
|
||||||
|
'title' => 'À propos',
|
||||||
|
'content' => '',
|
||||||
|
'background' => ''
|
||||||
|
];
|
||||||
|
|
||||||
|
// Charger les statistiques
|
||||||
|
$stats = new Stats();
|
||||||
|
$siteStats = $stats->getStats();
|
||||||
|
|
||||||
|
// Fonction pour convertir le contenu Delta en HTML
|
||||||
|
function deltaToHtml($content) {
|
||||||
|
return DeltaConverter::toHtml($content);
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title><?= htmlspecialchars($about['title']) ?> - <?= htmlspecialchars($config['site']['name']) ?></title>
|
||||||
|
|
||||||
|
<?php if (file_exists(__DIR__ . '/assets/images/site/favicon.png')): ?>
|
||||||
|
<link rel="icon" type="image/png" href="assets/images/site/favicon.png">
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="assets/css/public.css">
|
||||||
|
<link rel="stylesheet" href="assets/css/content.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<!-- En-tête avec image de fond -->
|
||||||
|
<header class="novel-header">
|
||||||
|
<?php if (!empty($about['background'])): ?>
|
||||||
|
<div class="novel-header-background" style="background-image: url('<?= htmlspecialchars($about['background']) ?>');"></div>
|
||||||
|
<?php endif; ?>
|
||||||
|
<h1><?= htmlspecialchars($about['title']) ?></h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!-- Contenu principal -->
|
||||||
|
<div class="novel-content">
|
||||||
|
<div class="novel-description">
|
||||||
|
<?= deltaToHtml($about['content']) ?>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<aside class="stats-menu">
|
||||||
|
<h2>Statistiques</h2>
|
||||||
|
<ul class="stats-list">
|
||||||
|
<!-- Nombre total de romans -->
|
||||||
|
<li class="stats-item">
|
||||||
|
<div class="stats-label">Romans publiés</div>
|
||||||
|
<div class="stats-value"><?= Stats::formatNumber($siteStats['total_stories']) ?></div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- Nombre total de chapitres -->
|
||||||
|
<li class="stats-item">
|
||||||
|
<div class="stats-label">Chapitres écrits</div>
|
||||||
|
<div class="stats-value"><?= Stats::formatNumber($siteStats['total_chapters']) ?></div>
|
||||||
|
<div class="stats-detail">
|
||||||
|
Moyenne de <?= $siteStats['avg_chapters_per_story'] ?> chapitres par roman
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- Nombre total de mots -->
|
||||||
|
<li class="stats-item">
|
||||||
|
<div class="stats-label">Mots écrits</div>
|
||||||
|
<div class="stats-value"><?= Stats::formatNumber($siteStats['total_words']) ?></div>
|
||||||
|
<div class="stats-detail">
|
||||||
|
Moyenne de <?= Stats::formatNumber($siteStats['avg_words_per_chapter']) ?> mots par chapitre
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<!-- Roman avec le plus de chapitres -->
|
||||||
|
<?php if ($siteStats['most_chapters']['story']): ?>
|
||||||
|
<li class="stats-item">
|
||||||
|
<div class="stats-label">Plus long roman</div>
|
||||||
|
<div class="stats-value"><?= Stats::formatNumber($siteStats['most_chapters']['count']) ?> chapitres</div>
|
||||||
|
<div class="stats-detail">
|
||||||
|
<a href="roman.php?id=<?= htmlspecialchars($siteStats['most_chapters']['story']['id']) ?>">
|
||||||
|
<?= htmlspecialchars($siteStats['most_chapters']['story']['title']) ?>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<!-- Plus long chapitre -->
|
||||||
|
<?php if ($siteStats['longest_chapter']['story']): ?>
|
||||||
|
<li class="stats-item">
|
||||||
|
<div class="stats-label">Plus long chapitre</div>
|
||||||
|
<div class="stats-value"><?= Stats::formatNumber($siteStats['longest_chapter']['words']) ?> mots</div>
|
||||||
|
<div class="stats-detail">
|
||||||
|
<a href="roman.php?id=<?= htmlspecialchars($siteStats['longest_chapter']['story']['id']) ?>">
|
||||||
|
<?= htmlspecialchars($siteStats['longest_chapter']['story']['title']) ?>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<!-- Dernière mise à jour -->
|
||||||
|
<?php if ($siteStats['latest_update']['story']): ?>
|
||||||
|
<li class="stats-item">
|
||||||
|
<div class="stats-label">Dernière mise à jour</div>
|
||||||
|
<div class="stats-value"><?= Stats::formatDate($siteStats['latest_update']['date']) ?></div>
|
||||||
|
<div class="stats-detail">
|
||||||
|
<a href="roman.php?id=<?= htmlspecialchars($siteStats['latest_update']['story']['id']) ?>">
|
||||||
|
<?= htmlspecialchars($siteStats['latest_update']['story']['title']) ?>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<?php endif; ?>
|
||||||
|
</ul>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="back-to-home">
|
||||||
|
<a href="index.php">← Retour à l'accueil</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button class="scroll-top" aria-label="Retour en haut de page">↑</button>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const scrollTopBtn = document.querySelector('.scroll-top');
|
||||||
|
|
||||||
|
window.addEventListener('scroll', function() {
|
||||||
|
if (window.pageYOffset > 300) {
|
||||||
|
scrollTopBtn.classList.add('visible');
|
||||||
|
} else {
|
||||||
|
scrollTopBtn.classList.remove('visible');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
scrollTopBtn.addEventListener('click', function() {
|
||||||
|
window.scrollTo({
|
||||||
|
top: 0,
|
||||||
|
behavior: 'smooth'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -92,7 +92,7 @@ $stories = Stories::getAll();
|
|||||||
: 'version inconnue';
|
: 'version inconnue';
|
||||||
?>
|
?>
|
||||||
<div class="version-banner">
|
<div class="version-banner">
|
||||||
Lectures d'Esenjin - v.<?= htmlspecialchars($version) ?>
|
Lectures d'Esenjin - <a href="https://git.crystalyx.net/Esenjin_Asakha/Lectures" target="_blank" style="color: inherit; text-decoration: underline;">v.<?= htmlspecialchars($version) ?></a>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@ -17,10 +17,14 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
|||||||
try {
|
try {
|
||||||
$config = Config::load();
|
$config = Config::load();
|
||||||
|
|
||||||
// Mise à jour des valeurs textuelles
|
// Mise à jour des valeurs textuelles du site
|
||||||
$config['site']['name'] = trim($_POST['site_name'] ?? '');
|
$config['site']['name'] = trim($_POST['site_name'] ?? '');
|
||||||
$config['site']['description'] = trim($_POST['site_description'] ?? '');
|
$config['site']['description'] = trim($_POST['site_description'] ?? '');
|
||||||
|
|
||||||
|
// Mise à jour des valeurs de la page À propos
|
||||||
|
$config['about']['title'] = trim($_POST['about_title'] ?? 'À propos');
|
||||||
|
$config['about']['content'] = $_POST['about_content'] ?? '';
|
||||||
|
|
||||||
// Validation
|
// Validation
|
||||||
if (empty($config['site']['name'])) {
|
if (empty($config['site']['name'])) {
|
||||||
throw new Exception('Le nom du site est requis');
|
throw new Exception('Le nom du site est requis');
|
||||||
@ -32,6 +36,12 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
|||||||
$config['site']['logo'] = $uploadHandler->handleLogoUpload($_FILES['site_logo']);
|
$config['site']['logo'] = $uploadHandler->handleLogoUpload($_FILES['site_logo']);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Gestion de l'upload du background de la page À propos
|
||||||
|
if (isset($_FILES['about_background']) && $_FILES['about_background']['error'] !== UPLOAD_ERR_NO_FILE) {
|
||||||
|
$uploadHandler = new SiteUploadHandler();
|
||||||
|
$config['about']['background'] = $uploadHandler->handleBackgroundUpload($_FILES['about_background']);
|
||||||
|
}
|
||||||
|
|
||||||
// Sauvegarde
|
// Sauvegarde
|
||||||
Config::save($config);
|
Config::save($config);
|
||||||
$success = 'Configuration mise à jour avec succès';
|
$success = 'Configuration mise à jour avec succès';
|
||||||
@ -54,13 +64,12 @@ $config = Config::load();
|
|||||||
<link rel="icon" type="image/png" href="../assets/images/site/favicon.png">
|
<link rel="icon" type="image/png" href="../assets/images/site/favicon.png">
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
<link rel="stylesheet" href="../assets/css/main.css">
|
<link rel="stylesheet" href="../assets/css/main.css">
|
||||||
|
<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<nav class="admin-nav">
|
<nav class="admin-nav">
|
||||||
<div class="nav-brand">
|
<div class="nav-brand">
|
||||||
<?php
|
<?php if (!empty($config['site']['logo'])): ?>
|
||||||
$config = Config::load();
|
|
||||||
if (!empty($config['site']['logo'])): ?>
|
|
||||||
<img src="<?= htmlspecialchars('../' . $config['site']['logo']) ?>"
|
<img src="<?= htmlspecialchars('../' . $config['site']['logo']) ?>"
|
||||||
alt="<?= htmlspecialchars($config['site']['name']) ?>">
|
alt="<?= htmlspecialchars($config['site']['name']) ?>">
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
@ -82,68 +91,201 @@ $config = Config::load();
|
|||||||
<div class="error-message"><?= htmlspecialchars($error) ?></div>
|
<div class="error-message"><?= htmlspecialchars($error) ?></div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<form method="POST" class="options-form" enctype="multipart/form-data">
|
<div class="options-container">
|
||||||
<div class="form-group">
|
<!-- Section Options du Site -->
|
||||||
<label for="site_name">Nom du site</label>
|
<section class="options-section">
|
||||||
<input type="text"
|
<h2>Options générales</h2>
|
||||||
id="site_name"
|
<form method="POST" class="options-form" enctype="multipart/form-data">
|
||||||
name="site_name"
|
<div class="form-group">
|
||||||
value="<?= htmlspecialchars($config['site']['name']) ?>"
|
<label for="site_name">Nom du site</label>
|
||||||
required>
|
<input type="text"
|
||||||
</div>
|
id="site_name"
|
||||||
|
name="site_name"
|
||||||
<div class="form-group">
|
value="<?= htmlspecialchars($config['site']['name']) ?>"
|
||||||
<label for="site_description">Description du site</label>
|
required>
|
||||||
<textarea id="site_description"
|
|
||||||
name="site_description"
|
|
||||||
rows="4"><?= htmlspecialchars($config['site']['description']) ?></textarea>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="site_logo">Logo du site</label>
|
|
||||||
<?php if (!empty($config['site']['logo'])): ?>
|
|
||||||
<div class="current-logo">
|
|
||||||
<img src="<?= htmlspecialchars('../' . $config['site']['logo']) ?>"
|
|
||||||
alt="Logo actuel"
|
|
||||||
style="max-height: 100px; margin: 10px 0;">
|
|
||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
|
||||||
<input type="file"
|
|
||||||
id="site_logo"
|
|
||||||
name="site_logo"
|
|
||||||
accept="image/jpeg,image/png,image/gif,image/svg+xml">
|
|
||||||
<small>Formats acceptés : JPG, PNG, GIF, SVG. Taille maximum : 2MB</small>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button type="submit" class="button">Enregistrer les modifications</button>
|
<div class="form-group">
|
||||||
</form>
|
<label for="site_description">Description du site</label>
|
||||||
|
<textarea id="site_description"
|
||||||
|
name="site_description"
|
||||||
|
rows="4"><?= htmlspecialchars($config['site']['description']) ?></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="site_logo">Logo du site</label>
|
||||||
|
<?php if (!empty($config['site']['logo'])): ?>
|
||||||
|
<div class="current-logo">
|
||||||
|
<img src="<?= htmlspecialchars('../' . $config['site']['logo']) ?>"
|
||||||
|
alt="Logo actuel"
|
||||||
|
style="max-height: 100px; margin: 10px 0;">
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
<input type="file"
|
||||||
|
id="site_logo"
|
||||||
|
name="site_logo"
|
||||||
|
accept="image/jpeg,image/png,image/gif,image/svg+xml">
|
||||||
|
<small>Formats acceptés : JPG, PNG, GIF, SVG. Taille maximum : 2MB</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Section À Propos -->
|
||||||
|
<h2>Page "À propos"</h2>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="about_title">Titre de la page</label>
|
||||||
|
<input type="text"
|
||||||
|
id="about_title"
|
||||||
|
name="about_title"
|
||||||
|
value="<?= htmlspecialchars($config['about']['title'] ?? 'À propos') ?>">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="about_background">Image de fond</label>
|
||||||
|
<?php if (!empty($config['about']['background'])): ?>
|
||||||
|
<div class="current-background">
|
||||||
|
<img src="<?= htmlspecialchars('../' . $config['about']['background']) ?>"
|
||||||
|
alt="Image de fond actuelle"
|
||||||
|
style="max-height: 100px; margin: 10px 0;">
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
|
<input type="file"
|
||||||
|
id="about_background"
|
||||||
|
name="about_background"
|
||||||
|
accept="image/*">
|
||||||
|
<small>Format recommandé : 1920x250px, JPG/PNG</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="about_content">Contenu de la page</label>
|
||||||
|
<input type="hidden" id="about_content" name="about_content">
|
||||||
|
<div id="aboutEditor"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button type="submit" class="button">Enregistrer les modifications</button>
|
||||||
|
</form>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
<script src="https://cdn.quilljs.com/1.3.6/quill.min.js"></script>
|
||||||
<script>
|
<script>
|
||||||
// Prévisualisation du logo
|
|
||||||
document.getElementById('site_logo').addEventListener('change', function(e) {
|
|
||||||
const file = e.target.files[0];
|
|
||||||
if (file) {
|
|
||||||
const reader = new FileReader();
|
|
||||||
reader.onload = function(e) {
|
|
||||||
let currentLogo = document.querySelector('.current-logo');
|
|
||||||
if (!currentLogo) {
|
|
||||||
currentLogo = document.createElement('div');
|
|
||||||
currentLogo.className = 'current-logo';
|
|
||||||
e.target.parentElement.insertBefore(currentLogo, e.target.nextSibling);
|
|
||||||
}
|
|
||||||
currentLogo.innerHTML = `
|
|
||||||
<img src="${e.target.result}"
|
|
||||||
alt="Aperçu du logo"
|
|
||||||
style="max-height: 100px; margin: 10px 0;">
|
|
||||||
`;
|
|
||||||
};
|
|
||||||
reader.readAsDataURL(file);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Détection des changements non sauvegardés
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
// Prévisualisation du logo
|
||||||
|
document.getElementById('site_logo').addEventListener('change', function(e) {
|
||||||
|
const file = e.target.files[0];
|
||||||
|
if (file) {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.onload = function(e) {
|
||||||
|
let currentLogo = document.querySelector('.current-logo');
|
||||||
|
if (!currentLogo) {
|
||||||
|
currentLogo = document.createElement('div');
|
||||||
|
currentLogo.className = 'current-logo';
|
||||||
|
e.target.parentElement.insertBefore(currentLogo, e.target.nextSibling);
|
||||||
|
}
|
||||||
|
currentLogo.innerHTML = `
|
||||||
|
<img src="${e.target.result}"
|
||||||
|
alt="Aperçu du logo"
|
||||||
|
style="max-height: 100px; margin: 10px 0;">
|
||||||
|
`;
|
||||||
|
};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Prévisualisation du background
|
||||||
|
document.getElementById('about_background').addEventListener('change', function(e) {
|
||||||
|
const file = e.target.files[0];
|
||||||
|
if (file) {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.onload = function(e) {
|
||||||
|
let currentBackground = document.querySelector('.current-background');
|
||||||
|
if (!currentBackground) {
|
||||||
|
currentBackground = document.createElement('div');
|
||||||
|
currentBackground.className = 'current-background';
|
||||||
|
e.target.parentElement.insertBefore(currentBackground, e.target.nextSibling);
|
||||||
|
}
|
||||||
|
currentBackground.innerHTML = `
|
||||||
|
<img src="${e.target.result}"
|
||||||
|
alt="Aperçu du fond"
|
||||||
|
style="max-height: 100px; margin: 10px 0;">
|
||||||
|
`;
|
||||||
|
};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Configuration de l'éditeur Quill
|
||||||
|
const aboutEditor = new Quill('#aboutEditor', {
|
||||||
|
theme: 'snow',
|
||||||
|
modules: {
|
||||||
|
toolbar: {
|
||||||
|
container: [
|
||||||
|
[{ 'header': [1, 2, 3, false] }],
|
||||||
|
['bold', 'italic', 'underline', 'strike'],
|
||||||
|
[{ 'color': [] }, { 'background': [] }],
|
||||||
|
[{ 'font': [] }],
|
||||||
|
[{ 'align': [] }],
|
||||||
|
['blockquote', 'code-block'],
|
||||||
|
[{ 'list': 'ordered'}, { 'list': 'bullet' }],
|
||||||
|
[{ 'script': 'sub'}, { 'script': 'super' }],
|
||||||
|
[{ 'indent': '-1'}, { 'indent': '+1' }],
|
||||||
|
[{ 'direction': 'rtl' }],
|
||||||
|
['link', 'image', 'video'],
|
||||||
|
['clean']
|
||||||
|
],
|
||||||
|
handlers: {
|
||||||
|
image: function() {
|
||||||
|
const input = document.createElement('input');
|
||||||
|
input.setAttribute('type', 'file');
|
||||||
|
input.setAttribute('accept', 'image/*');
|
||||||
|
input.click();
|
||||||
|
|
||||||
|
input.onchange = async () => {
|
||||||
|
const file = input.files[0];
|
||||||
|
if (file) {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('image', file);
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch('api/upload-image.php', {
|
||||||
|
method: 'POST',
|
||||||
|
body: formData
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) throw new Error('Upload failed');
|
||||||
|
|
||||||
|
const result = await response.json();
|
||||||
|
if (result.success) {
|
||||||
|
const range = aboutEditor.getSelection(true);
|
||||||
|
aboutEditor.insertEmbed(range.index, 'image', result.url);
|
||||||
|
aboutEditor.setSelection(range.index + 1);
|
||||||
|
} else {
|
||||||
|
showNotification(result.error || 'Erreur lors de l\'upload', 'error');
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error:', error);
|
||||||
|
showNotification('Erreur lors de l\'upload de l\'image', 'error');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
placeholder: 'Commencez à écrire le contenu de la page À propos...'
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initialiser le contenu si existant
|
||||||
|
<?php if (!empty($config['about']['content'])): ?>
|
||||||
|
aboutEditor.root.innerHTML = <?= json_encode($config['about']['content']) ?>;
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
// Mise à jour du champ caché avant la soumission
|
||||||
|
document.querySelector('form').addEventListener('submit', function() {
|
||||||
|
document.querySelector('#about_content').value = aboutEditor.root.innerHTML;
|
||||||
|
});
|
||||||
|
|
||||||
|
// Détection des changements non sauvegardés
|
||||||
const form = document.querySelector('form');
|
const form = document.querySelector('form');
|
||||||
const initialState = new FormData(form).toString();
|
const initialState = new FormData(form).toString();
|
||||||
|
|
||||||
@ -155,6 +297,7 @@ $config = Config::load();
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/dialog.css">
|
<link rel="stylesheet" href="../assets/css/dialog.css">
|
||||||
<script src="../assets/js/dialog.js"></script>
|
<script src="../assets/js/dialog.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@ -1,3 +1,6 @@
|
|||||||
|
/* Import d'autres fichiers CSS */
|
||||||
|
@import 'stats.css';
|
||||||
|
|
||||||
/* Import Google Fonts */
|
/* Import Google Fonts */
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
|
||||||
|
|
||||||
@ -101,6 +104,26 @@ body {
|
|||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.header-actions {
|
||||||
|
position: absolute;
|
||||||
|
top: var(--spacing-md);
|
||||||
|
right: var(--spacing-md);
|
||||||
|
}
|
||||||
|
|
||||||
|
.about-button {
|
||||||
|
display: inline-block;
|
||||||
|
padding: var(--spacing-sm) var(--spacing-md);
|
||||||
|
background-color: var(--accent-primary);
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: var(--radius-sm);
|
||||||
|
transition: var(--transition);
|
||||||
|
}
|
||||||
|
|
||||||
|
.about-button:hover {
|
||||||
|
background-color: var(--accent-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
/* Conteneur principal */
|
/* Conteneur principal */
|
||||||
.main-content {
|
.main-content {
|
||||||
max-width: var(--content-width);
|
max-width: var(--content-width);
|
||||||
@ -467,6 +490,38 @@ body {
|
|||||||
color: var(--accent-primary);
|
color: var(--accent-primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Bouton retour en haut */
|
||||||
|
.scroll-top {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 2rem;
|
||||||
|
right: 2rem;
|
||||||
|
background-color: var(--bg-tertiary);
|
||||||
|
color: var(--text-primary);
|
||||||
|
width: 3rem;
|
||||||
|
height: 3rem;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
text-decoration: none;
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
cursor: pointer;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-top.visible {
|
||||||
|
opacity: 1;
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-top:hover {
|
||||||
|
background-color: var(--accent-primary);
|
||||||
|
color: var(--text-tertiary);
|
||||||
|
}
|
||||||
|
|
||||||
/* Responsive */
|
/* Responsive */
|
||||||
@media (max-width: 1200px) {
|
@media (max-width: 1200px) {
|
||||||
:root {
|
:root {
|
||||||
|
|||||||
73
assets/css/stats.css
Normal file
73
assets/css/stats.css
Normal file
@ -0,0 +1,73 @@
|
|||||||
|
.stats-menu {
|
||||||
|
background: var(--bg-tertiary);
|
||||||
|
padding: var(--spacing-lg);
|
||||||
|
border-radius: var(--radius-md);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
position: sticky;
|
||||||
|
top: var(--spacing-lg);
|
||||||
|
align-self: start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-menu h2 {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-bottom: var(--spacing-md);
|
||||||
|
color: var(--text-primary);
|
||||||
|
padding-bottom: var(--spacing-sm);
|
||||||
|
border-bottom: 2px solid var(--accent-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-list {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-item {
|
||||||
|
margin-bottom: var(--spacing-md);
|
||||||
|
padding-bottom: var(--spacing-md);
|
||||||
|
border-bottom: 1px solid var(--border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-item:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
margin-bottom: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-label {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
color: var(--text-secondary);
|
||||||
|
margin-bottom: var(--spacing-xs);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-value {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
color: var(--text-primary);
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-detail {
|
||||||
|
font-size: 0.85rem;
|
||||||
|
color: var(--accent-primary);
|
||||||
|
margin-top: var(--spacing-xs);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Style pour les liens dans les stats */
|
||||||
|
.stats-detail a {
|
||||||
|
color: var(--accent-primary);
|
||||||
|
text-decoration: none;
|
||||||
|
transition: color var(--transition-fast);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-detail a:hover {
|
||||||
|
color: var(--accent-secondary);
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Media queries */
|
||||||
|
@media (max-width: 900px) {
|
||||||
|
.stats-menu {
|
||||||
|
position: static;
|
||||||
|
margin-top: var(--spacing-xl);
|
||||||
|
}
|
||||||
|
}
|
||||||
25
chapitre.php
25
chapitre.php
@ -114,5 +114,30 @@ $config = Config::load();
|
|||||||
<div class="back-to-home">
|
<div class="back-to-home">
|
||||||
<a href="index.php">← Retour à l'accueil</a> | <a href="roman.php?id=<?= urlencode($storyId) ?>">← Retour au roman</a>
|
<a href="index.php">← Retour à l'accueil</a> | <a href="roman.php?id=<?= urlencode($storyId) ?>">← Retour au roman</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<button class="scroll-top" aria-label="Retour en haut de page">↑</button>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const scrollTopBtn = document.querySelector('.scroll-top');
|
||||||
|
|
||||||
|
// Afficher/masquer le bouton
|
||||||
|
window.addEventListener('scroll', function() {
|
||||||
|
if (window.pageYOffset > 300) {
|
||||||
|
scrollTopBtn.classList.add('visible');
|
||||||
|
} else {
|
||||||
|
scrollTopBtn.classList.remove('visible');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Action de retour en haut
|
||||||
|
scrollTopBtn.addEventListener('click', function() {
|
||||||
|
window.scrollTo({
|
||||||
|
top: 0,
|
||||||
|
behavior: 'smooth'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@ -3,6 +3,11 @@
|
|||||||
"name": "Nom du Site",
|
"name": "Nom du Site",
|
||||||
"description": "Description du site"
|
"description": "Description du site"
|
||||||
},
|
},
|
||||||
|
"about": {
|
||||||
|
"title": "À propos",
|
||||||
|
"content": "",
|
||||||
|
"background": "assets/images/site/about-bg.jpg"
|
||||||
|
},
|
||||||
"users": [
|
"users": [
|
||||||
{
|
{
|
||||||
"id": "admin",
|
"id": "admin",
|
||||||
|
|||||||
118
includes/Stats.php
Normal file
118
includes/Stats.php
Normal file
@ -0,0 +1,118 @@
|
|||||||
|
<?php
|
||||||
|
class Stats {
|
||||||
|
private static $storiesDir = __DIR__ . '/../stories/';
|
||||||
|
private $stories = [];
|
||||||
|
private $stats = [];
|
||||||
|
|
||||||
|
public function __construct() {
|
||||||
|
$this->loadStories();
|
||||||
|
$this->calculateStats();
|
||||||
|
}
|
||||||
|
|
||||||
|
private function loadStories() {
|
||||||
|
foreach (glob(self::$storiesDir . '*.json') as $file) {
|
||||||
|
$this->stories[] = json_decode(file_get_contents($file), true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private function calculateStats() {
|
||||||
|
$totalChapters = 0;
|
||||||
|
$totalWords = 0;
|
||||||
|
$maxChapters = 0;
|
||||||
|
$storyWithMostChapters = null;
|
||||||
|
$lastUpdate = null;
|
||||||
|
$mostRecentStory = null;
|
||||||
|
$longestChapter = [
|
||||||
|
'words' => 0,
|
||||||
|
'story' => null,
|
||||||
|
'chapter' => null
|
||||||
|
];
|
||||||
|
|
||||||
|
foreach ($this->stories as $story) {
|
||||||
|
// Compter les chapitres
|
||||||
|
$chapterCount = count($story['chapters'] ?? []);
|
||||||
|
$totalChapters += $chapterCount;
|
||||||
|
|
||||||
|
// Trouver le roman avec le plus de chapitres
|
||||||
|
if ($chapterCount > $maxChapters) {
|
||||||
|
$maxChapters = $chapterCount;
|
||||||
|
$storyWithMostChapters = $story;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Trouver la dernière mise à jour
|
||||||
|
$storyUpdate = strtotime($story['updated']);
|
||||||
|
if (!$lastUpdate || $storyUpdate > $lastUpdate) {
|
||||||
|
$lastUpdate = $storyUpdate;
|
||||||
|
$mostRecentStory = $story;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Compter les mots et trouver le plus long chapitre
|
||||||
|
foreach ($story['chapters'] ?? [] as $chapter) {
|
||||||
|
$content = $chapter['content'];
|
||||||
|
|
||||||
|
// Si le contenu est au format JSON (Delta)
|
||||||
|
if (is_string($content) && $this->isJson($content)) {
|
||||||
|
$content = json_decode($content, true);
|
||||||
|
$text = '';
|
||||||
|
if (isset($content['ops'])) {
|
||||||
|
foreach ($content['ops'] as $op) {
|
||||||
|
if (is_string($op['insert'])) {
|
||||||
|
$text .= $op['insert'];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// Si le contenu est en HTML
|
||||||
|
$text = strip_tags($content);
|
||||||
|
}
|
||||||
|
|
||||||
|
$wordCount = str_word_count(strip_tags($text));
|
||||||
|
$totalWords += $wordCount;
|
||||||
|
|
||||||
|
if ($wordCount > $longestChapter['words']) {
|
||||||
|
$longestChapter = [
|
||||||
|
'words' => $wordCount,
|
||||||
|
'story' => $story,
|
||||||
|
'chapter' => $chapter
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$this->stats = [
|
||||||
|
'total_stories' => count($this->stories),
|
||||||
|
'total_chapters' => $totalChapters,
|
||||||
|
'total_words' => $totalWords,
|
||||||
|
'avg_chapters_per_story' => $this->stories ? round($totalChapters / count($this->stories), 1) : 0,
|
||||||
|
'avg_words_per_chapter' => $totalChapters ? round($totalWords / $totalChapters) : 0,
|
||||||
|
'most_chapters' => [
|
||||||
|
'story' => $storyWithMostChapters,
|
||||||
|
'count' => $maxChapters
|
||||||
|
],
|
||||||
|
'longest_chapter' => $longestChapter,
|
||||||
|
'latest_update' => [
|
||||||
|
'story' => $mostRecentStory,
|
||||||
|
'date' => $lastUpdate
|
||||||
|
]
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
public function getStats() {
|
||||||
|
return $this->stats;
|
||||||
|
}
|
||||||
|
|
||||||
|
private function isJson($string) {
|
||||||
|
json_decode($string);
|
||||||
|
return json_last_error() === JSON_ERROR_NONE;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Méthodes utilitaires pour le formatage
|
||||||
|
public static function formatNumber($number) {
|
||||||
|
return number_format($number, 0, ',', ' ');
|
||||||
|
}
|
||||||
|
|
||||||
|
public static function formatDate($timestamp) {
|
||||||
|
if (!$timestamp) return 'Jamais';
|
||||||
|
return date('d/m/Y', $timestamp);
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,8 +1,8 @@
|
|||||||
<?php
|
<?php
|
||||||
class SiteUploadHandler {
|
class SiteUploadHandler {
|
||||||
private $uploadDir;
|
private $uploadDir;
|
||||||
private $allowedTypes = ['image/jpeg', 'image/png', 'image/gif', 'image/svg+xml'];
|
private $allowedTypes = ['image/jpeg', 'image/png', 'image/gif', 'image/webp'];
|
||||||
private $maxFileSize = 2097152; // 2MB
|
private $maxFileSize = 5242880; // 5MB
|
||||||
|
|
||||||
public function __construct() {
|
public function __construct() {
|
||||||
$this->uploadDir = __DIR__ . '/../assets/images/site/';
|
$this->uploadDir = __DIR__ . '/../assets/images/site/';
|
||||||
@ -18,11 +18,11 @@ class SiteUploadHandler {
|
|||||||
$finfo = new finfo(FILEINFO_MIME_TYPE);
|
$finfo = new finfo(FILEINFO_MIME_TYPE);
|
||||||
$mimeType = $finfo->file($file['tmp_name']);
|
$mimeType = $finfo->file($file['tmp_name']);
|
||||||
if (!in_array($mimeType, $this->allowedTypes)) {
|
if (!in_array($mimeType, $this->allowedTypes)) {
|
||||||
throw new Exception('Type de fichier non autorisé. Types acceptés : JPG, PNG, GIF, SVG');
|
throw new Exception('Type de fichier non autorisé. Types acceptés : JPG, PNG, GIF, WEBP');
|
||||||
}
|
}
|
||||||
|
|
||||||
if ($file['size'] > $this->maxFileSize) {
|
if ($file['size'] > $this->maxFileSize) {
|
||||||
throw new Exception('Fichier trop volumineux. Taille maximum : 2MB');
|
throw new Exception('Fichier trop volumineux. Taille maximum : 5MB');
|
||||||
}
|
}
|
||||||
|
|
||||||
$extension = $this->getExtensionFromMimeType($mimeType);
|
$extension = $this->getExtensionFromMimeType($mimeType);
|
||||||
@ -47,6 +47,103 @@ class SiteUploadHandler {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public function handleBackgroundUpload($file) {
|
||||||
|
try {
|
||||||
|
if ($file['error'] !== UPLOAD_ERR_OK) {
|
||||||
|
throw new Exception($this->getUploadErrorMessage($file['error']));
|
||||||
|
}
|
||||||
|
|
||||||
|
$finfo = new finfo(FILEINFO_MIME_TYPE);
|
||||||
|
$mimeType = $finfo->file($file['tmp_name']);
|
||||||
|
if (!in_array($mimeType, $this->allowedTypes)) {
|
||||||
|
throw new Exception('Type de fichier non autorisé. Types acceptés : JPG, PNG, GIF, WEBP');
|
||||||
|
}
|
||||||
|
|
||||||
|
if ($file['size'] > $this->maxFileSize) {
|
||||||
|
throw new Exception('Fichier trop volumineux. Taille maximum : 5MB');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Vérifier les dimensions de l'image
|
||||||
|
list($width, $height) = getimagesize($file['tmp_name']);
|
||||||
|
$minWidth = 1200;
|
||||||
|
$minHeight = 600;
|
||||||
|
|
||||||
|
if ($width < $minWidth || $height < $minHeight) {
|
||||||
|
throw new Exception("L'image doit faire au moins {$minWidth}x{$minHeight} pixels");
|
||||||
|
}
|
||||||
|
|
||||||
|
$extension = $this->getExtensionFromMimeType($mimeType);
|
||||||
|
$filename = 'about-bg.' . $extension;
|
||||||
|
$targetPath = $this->uploadDir . $filename;
|
||||||
|
|
||||||
|
// Supprimer l'ancien background s'il existe
|
||||||
|
$this->removeOldBackground();
|
||||||
|
|
||||||
|
// Redimensionner l'image si nécessaire
|
||||||
|
$maxWidth = 1920;
|
||||||
|
$maxHeight = 1080;
|
||||||
|
|
||||||
|
if ($width > $maxWidth || $height > $maxHeight) {
|
||||||
|
$this->resizeImage(
|
||||||
|
$file['tmp_name'],
|
||||||
|
$targetPath,
|
||||||
|
$mimeType,
|
||||||
|
$maxWidth,
|
||||||
|
$maxHeight
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
if (!move_uploaded_file($file['tmp_name'], $targetPath)) {
|
||||||
|
throw new Exception('Erreur lors du déplacement du fichier uploadé');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return 'assets/images/site/' . $filename;
|
||||||
|
|
||||||
|
} catch (Exception $e) {
|
||||||
|
throw $e;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private function removeOldBackground() {
|
||||||
|
foreach (glob($this->uploadDir . 'about-bg.*') as $file) {
|
||||||
|
unlink($file);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private function resizeImage($sourcePath, $targetPath, $mimeType, $maxWidth, $maxHeight) {
|
||||||
|
list($width, $height) = getimagesize($sourcePath);
|
||||||
|
|
||||||
|
// Calculer les nouvelles dimensions en conservant le ratio
|
||||||
|
$ratio = min($maxWidth / $width, $maxHeight / $height);
|
||||||
|
$newWidth = round($width * $ratio);
|
||||||
|
$newHeight = round($height * $ratio);
|
||||||
|
|
||||||
|
// Créer la nouvelle image
|
||||||
|
$sourceImage = $this->createImageFromFile($sourcePath, $mimeType);
|
||||||
|
$newImage = imagecreatetruecolor($newWidth, $newHeight);
|
||||||
|
|
||||||
|
// Préserver la transparence pour PNG
|
||||||
|
if ($mimeType === 'image/png') {
|
||||||
|
imagealphablending($newImage, false);
|
||||||
|
imagesavealpha($newImage, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Redimensionner
|
||||||
|
imagecopyresampled(
|
||||||
|
$newImage, $sourceImage,
|
||||||
|
0, 0, 0, 0,
|
||||||
|
$newWidth, $newHeight,
|
||||||
|
$width, $height
|
||||||
|
);
|
||||||
|
|
||||||
|
// Sauvegarder l'image redimensionnée
|
||||||
|
$this->saveImage($newImage, $targetPath, $mimeType);
|
||||||
|
|
||||||
|
// Libérer la mémoire
|
||||||
|
imagedestroy($sourceImage);
|
||||||
|
imagedestroy($newImage);
|
||||||
|
}
|
||||||
|
|
||||||
private function ensureUploadDirectory() {
|
private function ensureUploadDirectory() {
|
||||||
if (!file_exists($this->uploadDir)) {
|
if (!file_exists($this->uploadDir)) {
|
||||||
if (!mkdir($this->uploadDir, 0755, true)) {
|
if (!mkdir($this->uploadDir, 0755, true)) {
|
||||||
@ -113,8 +210,25 @@ class SiteUploadHandler {
|
|||||||
return imagecreatefrompng($file);
|
return imagecreatefrompng($file);
|
||||||
case 'image/gif':
|
case 'image/gif':
|
||||||
return imagecreatefromgif($file);
|
return imagecreatefromgif($file);
|
||||||
|
case 'image/webp':
|
||||||
|
return imagecreatefromwebp($file);
|
||||||
default:
|
default:
|
||||||
throw new Exception('Type d\'image non supporté pour le favicon');
|
throw new Exception('Type d\'image non supporté');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private function saveImage($image, $path, $mimeType) {
|
||||||
|
switch ($mimeType) {
|
||||||
|
case 'image/jpeg':
|
||||||
|
return imagejpeg($image, $path, 85);
|
||||||
|
case 'image/png':
|
||||||
|
return imagepng($image, $path, 9);
|
||||||
|
case 'image/gif':
|
||||||
|
return imagegif($image, $path);
|
||||||
|
case 'image/webp':
|
||||||
|
return imagewebp($image, $path, 85);
|
||||||
|
default:
|
||||||
|
throw new Exception('Type d\'image non supporté');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -123,9 +237,9 @@ class SiteUploadHandler {
|
|||||||
'image/jpeg' => 'jpg',
|
'image/jpeg' => 'jpg',
|
||||||
'image/png' => 'png',
|
'image/png' => 'png',
|
||||||
'image/gif' => 'gif',
|
'image/gif' => 'gif',
|
||||||
'image/svg+xml' => 'svg'
|
'image/webp' => 'webp'
|
||||||
];
|
];
|
||||||
return $map[$mimeType] ?? 'png';
|
return $map[$mimeType] ?? 'jpg';
|
||||||
}
|
}
|
||||||
|
|
||||||
private function getUploadErrorMessage($error) {
|
private function getUploadErrorMessage($error) {
|
||||||
|
|||||||
29
index.php
29
index.php
@ -61,6 +61,10 @@ function formatDate($date) {
|
|||||||
<h1><?= htmlspecialchars($config['site']['name']) ?></h1>
|
<h1><?= htmlspecialchars($config['site']['name']) ?></h1>
|
||||||
<p><?= nl2br(htmlspecialchars($config['site']['description'])) ?></p>
|
<p><?= nl2br(htmlspecialchars($config['site']['description'])) ?></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="header-actions">
|
||||||
|
<a href="about.php" class="about-button">À propos</a>
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -87,5 +91,30 @@ function formatDate($date) {
|
|||||||
<?php endforeach; ?>
|
<?php endforeach; ?>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
|
<button class="scroll-top" aria-label="Retour en haut de page">↑</button>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const scrollTopBtn = document.querySelector('.scroll-top');
|
||||||
|
|
||||||
|
// Afficher/masquer le bouton
|
||||||
|
window.addEventListener('scroll', function() {
|
||||||
|
if (window.pageYOffset > 300) {
|
||||||
|
scrollTopBtn.classList.add('visible');
|
||||||
|
} else {
|
||||||
|
scrollTopBtn.classList.remove('visible');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Action de retour en haut
|
||||||
|
scrollTopBtn.addEventListener('click', function() {
|
||||||
|
window.scrollTo({
|
||||||
|
top: 0,
|
||||||
|
behavior: 'smooth'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
25
roman.php
25
roman.php
@ -83,5 +83,30 @@ $config = Config::load();
|
|||||||
<a href="index.php">← Retour à l'accueil</a>
|
<a href="index.php">← Retour à l'accueil</a>
|
||||||
</div>
|
</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<button class="scroll-top" aria-label="Retour en haut de page">↑</button>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const scrollTopBtn = document.querySelector('.scroll-top');
|
||||||
|
|
||||||
|
// Afficher/masquer le bouton
|
||||||
|
window.addEventListener('scroll', function() {
|
||||||
|
if (window.pageYOffset > 300) {
|
||||||
|
scrollTopBtn.classList.add('visible');
|
||||||
|
} else {
|
||||||
|
scrollTopBtn.classList.remove('visible');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Action de retour en haut
|
||||||
|
scrollTopBtn.addEventListener('click', function() {
|
||||||
|
window.scrollTo({
|
||||||
|
top: 0,
|
||||||
|
behavior: 'smooth'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
@ -1 +1 @@
|
|||||||
1.1.0
|
1.1.1
|
||||||
Loading…
x
Reference in New Issue
Block a user