Compare commits

..

4 Commits

Author SHA1 Message Date
caroline.slt ef3699d5f5 Reviewänderungen 2026-07-19 21:54:44 +02:00
caroline.slt fedb6f59f5 . 2026-07-19 20:58:52 +02:00
caroline.slt 5eca2f162b . 2026-07-19 20:10:51 +02:00
caroline.slt d7d121b541 . 2026-07-19 19:20:12 +02:00
11 changed files with 101 additions and 202 deletions
+12 -10
View File
@@ -81,10 +81,12 @@ $isEditMode = (isset($_GET["edit"]) && $_GET["edit"] === "1") || !empty($error);
<br> <br>
<form action="php/controller/deleteAccount-controller.php" method="POST"> <form action="php/controller/deleteAccount-controller.php"
method="POST"
class="confirm-delete-account">
<button type="submit" <button type="submit"
class="button" class="button">
onclick="return confirm('Möchtest du deinen Account und alle deine Beiträge wirklich unwiderruflich löschen?');">
Account löschen Account löschen
</button> </button>
</form> </form>
@@ -154,14 +156,16 @@ $isEditMode = (isset($_GET["edit"]) && $_GET["edit"] === "1") || !empty($error);
Bearbeiten Bearbeiten
</a> </a>
<form action="php/controller/deleteArticle-controller.php" method="POST"> <form action="php/controller/deleteArticle-controller.php"
method="POST"
class="confirm-delete-article">
<input type="hidden" <input type="hidden"
name="id" name="id"
value="<?php echo htmlspecialchars($userArticle->getID()); ?>"> value="<?php echo htmlspecialchars($userArticle->getID()); ?>">
<button type="submit" <button type="submit"
class="button" class="button">
onclick="return confirm('Möchtest du diesen Artikel wirklich löschen?');">
Löschen Löschen
</button> </button>
</form> </form>
@@ -172,11 +176,9 @@ $isEditMode = (isset($_GET["edit"]) && $_GET["edit"] === "1") || !empty($error);
<p>Du hast noch keine Beiträge erstellt.</p> <p>Du hast noch keine Beiträge erstellt.</p>
<button type="button" <a href="index.php?pfad=createArticle" class="button">
class="button"
onclick="window.location.href='index.php?pfad=createArticle';">
Beitrag erstellen! Beitrag erstellen!
</button> </a>
<?php endif; ?> <?php endif; ?>
</div> </div>
+25 -17
View File
@@ -124,7 +124,9 @@ $categories = [
</div> </div>
<noscript> <noscript>
<button type="submit" class="nav__search-button">Filter anwenden</button> <button type="submit" class="nav__search-button">
Filter anwenden
</button>
</noscript> </noscript>
</form> </form>
@@ -137,17 +139,6 @@ $categories = [
<p class="s-res-meta"><span id="s-res-result-count"><?php echo $totalResultsCount; ?></span> Treffer für Ihre Suchanfrage "<?php echo htmlspecialchars($query); ?>"</p> <p class="s-res-meta"><span id="s-res-result-count"><?php echo $totalResultsCount; ?></span> Treffer für Ihre Suchanfrage "<?php echo htmlspecialchars($query); ?>"</p>
</div> </div>
<p
id="results-loading"
class="results-loading"
role="status"
aria-live="polite"
hidden
>
<span class="results-spinner" aria-hidden="true"></span>
Suchergebnisse werden geladen …
</p>
<!-- Ergebnisliste --> <!-- Ergebnisliste -->
<div class="s-res-list"> <div class="s-res-list">
<?php if (!empty($results)): ?> <?php if (!empty($results)): ?>
@@ -204,17 +195,34 @@ $categories = [
</div> </div>
<nav class="s-res-page-navigation" aria-label="Seitennavigation"> <nav class="s-res-page-navigation" aria-label="Seitennavigation">
<!-- No-JS-Fallback: -->
<noscript> <noscript>
<?php echo renderNoJsPagination($currentPage, $totalPages, $query, $currentSort, $currentCategory, $limit); ?> <?php echo renderNoJsPagination(
$currentPage,
$totalPages,
$query,
$currentSort,
$currentCategory,
$limit
); ?>
</noscript> </noscript>
<!-- JS-Version: wird per search-results.js befüllt/eingeblendet: -->
<div id="js-page-navigation" style="display: none;"> <div id="js-page-navigation" style="display: none;">
<button type="button" class="s-res-page-btn" id="prev-page-btn">«</button> <button type="button"
class="s-res-page-btn"
id="prev-page-btn">
«
</button>
<span id="dynamic-page-numbers"></span> <span id="dynamic-page-numbers"></span>
<button type="button" class="s-res-page-btn" id="next-page-btn">»</button>
<button type="button"
class="s-res-page-btn"
id="next-page-btn">
»
</button>
</div> </div>
</nav> </nav>
</div> </div>
+5 -19
View File
@@ -237,7 +237,7 @@ if ($replyAuthor === null) {
<form method="post" <form method="post"
action="index.php?pfad=deleteComment" action="index.php?pfad=deleteComment"
class="delete-comment-form"> class="delete-comment-form confirm-delete-comment">
<input type="hidden" <input type="hidden"
name="comment_id" name="comment_id"
@@ -252,8 +252,7 @@ if ($replyAuthor === null) {
); ?>"> ); ?>">
<button type="submit" <button type="submit"
class="delete-comment-button" class="delete-comment-button">
onclick="return confirm('Möchtest du diesen Kommentar wirklich löschen?');">
Kommentar löschen Kommentar löschen
</button> </button>
</form> </form>
@@ -369,7 +368,7 @@ if ($replyAuthor === null) {
<form method="post" <form method="post"
action="index.php?pfad=deleteComment" action="index.php?pfad=deleteComment"
class="delete-comment-form"> class="delete-comment-form confirm-delete-comment">
<input type="hidden" <input type="hidden"
name="comment_id" name="comment_id"
@@ -384,9 +383,8 @@ if ($replyAuthor === null) {
); ?>"> ); ?>">
<button type="submit" <button type="submit"
class="delete-comment-button" class="delete-comment-button">
onclick="return confirm('Möchtest du diesen Kommentar wirklich löschen?');"> Antwort löschen
Kommentar löschen
</button> </button>
</form> </form>
@@ -457,18 +455,6 @@ if ($replyAuthor === null) {
<button type="submit" class="button"> <button type="submit" class="button">
Kommentar senden Kommentar senden
</button> </button>
<p
id="comment-loading"
class="comment-loading"
role="status"
aria-live="polite"
hidden
>
<span class="comment-spinner" aria-hidden="true"></span>
Kommentar wird gesendet …
</p>
</form> </form>
<?php else: ?> <?php else: ?>
<div class="comment-login-hint"> <div class="comment-login-hint">
-11
View File
@@ -113,17 +113,6 @@ $resultCount = count($results);
</p> </p>
</div> </div>
<p
id="results-loading"
class="results-loading"
role="status"
aria-live="polite"
hidden
>
<span class="results-spinner" aria-hidden="true"></span>
Kategoriebeiträge werden geladen …
</p>
<!-- Ergebnisliste --> <!-- Ergebnisliste -->
<div class="s-res-list"> <div class="s-res-list">
<?php if (!empty($results)): ?> <?php if (!empty($results)): ?>
-30
View File
@@ -226,33 +226,3 @@ h1 {
text-decoration: none; text-decoration: none;
box-sizing: border-box; box-sizing: border-box;
} }
.comment-loading {
display: flex;
align-items: center;
gap: 8px;
margin-top: 10px;
}
.comment-loading[hidden] {
display: none;
}
.comment-spinner {
width: 16px;
height: 16px;
border: 2px solid #cbd5e1;
border-top-color: #1f2937;
border-radius: 50%;
animation: comment-spinner-rotation 0.8s linear infinite;
}
@keyframes comment-spinner-rotation {
to {
transform: rotate(360deg);
}
}
#comment-form button[type="submit"]:disabled {
cursor: wait;
opacity: 0.65;
}
-29
View File
@@ -271,33 +271,4 @@ CSS für die Suchergebnis-Seite
align-items: flex-start; align-items: flex-start;
} }
} }
/* Ladeanzeige beim Nachladen von Such- und Kategorieergebnissen */
.results-loading {
display: flex;
align-items: center;
gap: 8px;
margin: 15px 0;
color: #4a5568;
font-size: 0.95rem;
}
.results-loading[hidden] {
display: none;
}
.results-spinner {
width: 16px;
height: 16px;
flex-shrink: 0;
border: 2px solid #cbd5e1;
border-top-color: #3182ce;
border-radius: 50%;
animation: results-spinner-rotation 0.8s linear infinite;
}
@keyframes results-spinner-rotation {
to {
transform: rotate(360deg);
}
}
+2 -1
View File
@@ -24,9 +24,10 @@ include_once "php/controller/index-controller.php";
<link rel="stylesheet" href="css/showCategory.css"> <link rel="stylesheet" href="css/showCategory.css">
<script src="js/comments.js" defer></script> <script src="js/comments.js" defer></script>
<script src="js/profile.js" defer></script>
<script src="js/editor.js" async></script> <script src="js/editor.js" async></script>
<script src="js/search-results.js" async></script>
<script src="js/showCategory.js" async></script> <script src="js/showCategory.js" async></script>
<script src="js/search.js" async></script>
<title>EduForge</title> <title>EduForge</title>
+19 -38
View File
@@ -11,19 +11,27 @@ document.addEventListener("DOMContentLoaded", function () {
const parentCommentInput = document.getElementById("parent-comment-id"); const parentCommentInput = document.getElementById("parent-comment-id");
const replyInfo = document.getElementById("reply-info"); const replyInfo = document.getElementById("reply-info");
const submitButton = form /**
? form.querySelector('button[type="submit"]') * Fragt vor dem Löschen eines Kommentars nach einer Bestätigung.
: null; *
* Der Listener funktioniert auch für Kommentare,
* die später per AJAX eingefügt werden.
*/
document.addEventListener("submit", function (event) {
if (!event.target.classList.contains("delete-comment-form")) {
return;
}
const loadingMessage = document.getElementById("comment-loading"); const confirmed = confirm(
"Möchtest du diesen Kommentar wirklich löschen?"
);
if ( if (!confirmed) {
!form event.preventDefault();
|| !commentsList }
|| !commentContent });
|| !parentCommentInput
|| !submitButton if (!form || !commentsList || !commentContent || !parentCommentInput) {
) {
return; return;
} }
@@ -65,23 +73,6 @@ document.addEventListener("DOMContentLoaded", function () {
form.addEventListener("submit", function (event) { form.addEventListener("submit", function (event) {
event.preventDefault(); event.preventDefault();
/*
* Verhindert einen erneuten Submit, während der vorherige
* Kommentar noch gespeichert wird.
*/
if (submitButton.disabled) {
return;
}
const originalButtonText = submitButton.textContent;
submitButton.disabled = true;
submitButton.textContent = "Wird gesendet …";
if (loadingMessage) {
loadingMessage.hidden = false;
}
const formData = new FormData(form); const formData = new FormData(form);
const parentCommentId = parentCommentInput.value; const parentCommentId = parentCommentInput.value;
@@ -181,7 +172,6 @@ document.addEventListener("DOMContentLoaded", function () {
<button <button
type="submit" type="submit"
class="delete-comment-button" class="delete-comment-button"
onclick="return confirm('Möchtest du diesen Kommentar wirklich löschen?');"
> >
Kommentar löschen Kommentar löschen
</button> </button>
@@ -259,7 +249,6 @@ document.addEventListener("DOMContentLoaded", function () {
<button <button
type="submit" type="submit"
class="delete-comment-button" class="delete-comment-button"
onclick="return confirm('Möchtest du diesen Kommentar wirklich löschen?');"
> >
Kommentar löschen Kommentar löschen
</button> </button>
@@ -298,14 +287,6 @@ document.addEventListener("DOMContentLoaded", function () {
.catch(function (error) { .catch(function (error) {
console.error(error); console.error(error);
alert("Kommentar konnte nicht gesendet werden."); alert("Kommentar konnte nicht gesendet werden.");
})
.finally(function () {
submitButton.disabled = false;
submitButton.textContent = originalButtonText;
if (loadingMessage) {
loadingMessage.hidden = true;
}
}); });
}); });
+29
View File
@@ -0,0 +1,29 @@
document.addEventListener("DOMContentLoaded", function () {
const deleteAccountForm = document.querySelector(".confirm-delete-account");
if (deleteAccountForm) {
deleteAccountForm.addEventListener("submit", function (event) {
if (!confirm("Möchtest du deinen Account und alle deine Beiträge wirklich unwiderruflich löschen?")) {
event.preventDefault();
}
});
}
const deleteArticleForms = document.querySelectorAll(".confirm-delete-article");
deleteArticleForms.forEach(function (form) {
form.addEventListener("submit", function (event) {
if (!confirm("Möchtest du diesen Artikel wirklich löschen?")) {
event.preventDefault();
}
});
});
});
+4 -23
View File
@@ -25,7 +25,6 @@
let listContainer, sortRadios, categorySelect, limitSelect; let listContainer, sortRadios, categorySelect, limitSelect;
let prevBtn, nextBtn, numbersContainer, jsNav, resultCountEl; let prevBtn, nextBtn, numbersContainer, jsNav, resultCountEl;
let loadingElement;
function init() { function init() {
listContainer = document.querySelector('.s-res-list'); listContainer = document.querySelector('.s-res-list');
@@ -39,41 +38,23 @@
numbersContainer = document.getElementById('dynamic-page-numbers'); numbersContainer = document.getElementById('dynamic-page-numbers');
jsNav = document.getElementById('js-page-navigation'); jsNav = document.getElementById('js-page-navigation');
resultCountEl = document.getElementById('s-res-result-count'); resultCountEl = document.getElementById('s-res-result-count');
loadingElement = document.getElementById('results-loading');
const checkedRadio = document.querySelector('.sort-radio:checked'); const checkedRadio = document.querySelector('.sort-radio:checked');
state.sort = checkedRadio ? checkedRadio.value : 'alphabet'; state.sort = checkedRadio ? checkedRadio.value : 'alphabet';
state.category = categorySelect ? categorySelect.value : 'all'; state.category = categorySelect ? categorySelect.value : 'all';
state.itemsPerPage = limitSelect ? (parseInt(limitSelect.value, 10) || 10) : 10; state.itemsPerPage = limitSelect ? (parseInt(limitSelect.value, 10) || 10) : 10;
if (loadingElement) {
loadingElement.hidden = false;
}
fetchFullDataset() fetchFullDataset()
.then(function (data) { .then(function (data) {
state.allItems = data.results || []; state.allItems = data.results || [];
attachEvents(); attachEvents();
render(); render();
if (jsNav) jsNav.style.display = 'flex';
if (jsNav) {
jsNav.style.display = 'flex';
}
}) })
.catch(function (err) { .catch(function (err) {
/* // JSON-Endpoint nicht erreichbar: die serverseitig gerenderte
* Falls das Nachladen nicht funktioniert, bleibt die bereits // (No-JS-)Ansicht bleibt sichtbar und funktioniert weiter.
* serverseitig ausgegebene Ergebnisliste sichtbar. console.error('Suchergebnisse konnten nicht nachgeladen werden:', err);
*/
console.error(
'Suchergebnisse konnten nicht nachgeladen werden:',
err
);
})
.finally(function () {
if (loadingElement) {
loadingElement.hidden = true;
}
}); });
} }
+4 -23
View File
@@ -21,7 +21,6 @@
let listContainer, sortRadios, searchInput, limitSelect; let listContainer, sortRadios, searchInput, limitSelect;
let prevBtn, nextBtn, numbersContainer, jsNav, resultCountEl; let prevBtn, nextBtn, numbersContainer, jsNav, resultCountEl;
let loadingElement;
let searchDebounceTimer; let searchDebounceTimer;
function init() { function init() {
@@ -36,41 +35,23 @@
numbersContainer = document.getElementById('dynamic-page-numbers'); numbersContainer = document.getElementById('dynamic-page-numbers');
jsNav = document.getElementById('js-page-navigation'); jsNav = document.getElementById('js-page-navigation');
resultCountEl = document.getElementById('s-res-result-count'); resultCountEl = document.getElementById('s-res-result-count');
loadingElement = document.getElementById('results-loading');
const checkedRadio = document.querySelector('.sort-radio:checked'); const checkedRadio = document.querySelector('.sort-radio:checked');
state.sort = checkedRadio ? checkedRadio.value : 'alphabet'; state.sort = checkedRadio ? checkedRadio.value : 'alphabet';
state.query = searchInput ? searchInput.value : ''; state.query = searchInput ? searchInput.value : '';
state.itemsPerPage = limitSelect ? (parseInt(limitSelect.value, 10) || 10) : 10; state.itemsPerPage = limitSelect ? (parseInt(limitSelect.value, 10) || 10) : 10;
if (loadingElement) {
loadingElement.hidden = false;
}
fetchFullDataset() fetchFullDataset()
.then(function (data) { .then(function (data) {
state.allItems = data.results || []; state.allItems = data.results || [];
attachEvents(); attachEvents();
render(); render();
if (jsNav) jsNav.style.display = 'flex';
if (jsNav) {
jsNav.style.display = 'flex';
}
}) })
.catch(function (err) { .catch(function (err) {
/* // JSON-Endpoint nicht erreichbar: die serverseitig gerenderte
* Falls das Nachladen nicht funktioniert, bleibt die bereits // (No-JS-)Ansicht bleibt sichtbar und funktioniert weiter.
* serverseitig ausgegebene Kategorieansicht sichtbar. console.error('Kategorie-Beiträge konnten nicht nachgeladen werden:', err);
*/
console.error(
'Kategorie-Beiträge konnten nicht nachgeladen werden:',
err
);
})
.finally(function () {
if (loadingElement) {
loadingElement.hidden = true;
}
}); });
} }