Compare commits

...

120 Commits

Author SHA1 Message Date
Nils Eilinghoff b1c578452c Merge remote-tracking branch 'origin/master' 2023-06-14 21:29:46 +02:00
Jasmin Weise ac15420813 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-14 21:29:28 +02:00
Jasmin Weise 71a0def498 Fertig 2023-06-14 21:29:16 +02:00
Nils Eilinghoff cd2debae98 Anmeldung 2023-06-14 21:29:08 +02:00
Nils Eilinghoff e00f680053 Verlängerung 2023-06-14 21:06:12 +02:00
Jasmin Weise c28d830a8c Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-14 20:34:35 +02:00
Jasmin Weise d7875735a9 Echo entfernt 2023-06-14 20:33:56 +02:00
Nils Eilinghoff 2b2311deca Header Angepasst 2023-06-14 20:31:11 +02:00
GhadaA98 4dc2160df5 warenkorb done 2023-06-14 20:22:44 +02:00
Nils Eilinghoff 2ef6a4a062 Meh 2023-06-14 20:01:56 +02:00
GhadaA98 84f306add9 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-14 19:51:46 +02:00
GhadaA98 a74a16569d aktuellste Stand 2023-06-14 19:48:38 +02:00
Nils Eilinghoff 968ab11917 Meh 2023-06-14 19:28:38 +02:00
GhadaA98 02619b31b2 anmeldesystem wurde geändert 2023-06-14 19:22:59 +02:00
Jasmin Weise 5ba709c313 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-14 18:26:14 +02:00
Jasmin Weise 34f5705b25 . 2023-06-14 18:26:05 +02:00
Nils Eilinghoff 63ae22f55b Merge remote-tracking branch 'origin/master' 2023-06-14 18:25:52 +02:00
Jasmin Weise c3e262d459 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-14 18:25:25 +02:00
Jasmin Weise 4198a28c2e Funktioniert 2023-06-14 18:23:07 +02:00
Nils Eilinghoff e9e436facc Meine Bücher weiter gemacht part 3 2023-06-14 18:18:54 +02:00
Nils Eilinghoff b8fecd611b Meine Bücher weiter gemacht 2023-06-14 17:23:07 +02:00
Nils Eilinghoff 149cda66ae Meine Bücher weiter gemacht 2023-06-14 16:18:00 +02:00
Nils Eilinghoff f775cc5585 Mehr JS ausgelagert/durch <a> ersetzt 2023-06-14 12:30:04 +02:00
Nils Eilinghoff 2d9cc6e871 JS weiterleitungen zu <a> geändert 2023-06-14 12:12:54 +02:00
Nils Eilinghoff 360d3fdf06 Das Resizing script ausgelagert in resize.js 2023-06-14 12:04:25 +02:00
Nils Eilinghoff 6334b4ec1f Abmelde Button ist jetzt dynamisch 2023-06-14 11:44:33 +02:00
Jasmin Weise 9a64d32046 Erstellt, Grundgerüst steht
Eigentliche Funktion folgt in reservierung_bestaetigung
2023-06-13 23:04:28 +02:00
Jasmin Weise 26db92adeb Grundfunktionen implementiert
Wird noch bearbeitet, siehe TODO Liste am Anfang
2023-06-13 23:02:21 +02:00
Jasmin Weise 75accc1cd2 Erstellt, wird vielleicht noch zusammengefasst 2023-06-13 22:54:41 +02:00
Jasmin Weise 72cee710da Original Versionen, nicht auf dem Server 2023-06-13 22:54:13 +02:00
Jasmin Weise c540d82713 Wird noch erweitert / verbessert 2023-06-13 22:53:43 +02:00
Jasmin Weise 43695d5a4b Icons hinzugefügt 2023-06-13 22:53:01 +02:00
Jasmin Weise f021b2c047 Buch kann zum Warenkorb hinzugefügt werden
Alert zum Testen entfernt
2023-06-13 12:32:26 +02:00
Jasmin Weise d0809226c5 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-13 12:24:48 +02:00
Jasmin Weise eca4c4179c Warenkorb Symbol fügt das Buch zum Warenkorb hinzu 2023-06-13 12:22:38 +02:00
Jasmin Weise 0a96c84fbc Erstellt, wird noch bearbeitet 2023-06-13 12:22:16 +02:00
Nils 65e466b86a header wieder eingebunden bis ich das dynamische fertig habe 2023-06-13 12:09:23 +02:00
Sebastian Greil eff1e08bb7 replaced index.html with index.php 2023-06-12 16:36:23 +02:00
Nils Eilinghoff cac72169a0 abmelde button dynamisch für alle html dateien, angefangen es für die php dateien zu machen -> alle html dateien mussten zu php dateien verändert werden 2023-06-12 16:17:49 +02:00
Nils Eilinghoff d6f6462e60 Nav Ausgetauscht 2023-06-12 11:23:37 +02:00
Nils Eilinghoff 1b8f7037c6 Header und Footer ausgetauscht 2023-06-12 10:30:40 +02:00
Jasmin Weise c726bcc3ad Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-11 21:54:07 +02:00
Jasmin Weise c9ddb8c3e8 b.BuchID = $ID durch Prepared Statement ersetzt 2023-06-11 21:52:53 +02:00
Sebastian Greil edecc52eb0 meinebuecher stand 11.06 2023-06-11 12:00:38 +02:00
Sebastian Greil 27432e2f56 html code mit weiterleitung ersetzt 2023-06-10 12:00:36 +02:00
Sebastian Greil 7366d4d561 Merge remote-tracking branch 'origin/master' 2023-06-09 16:11:15 +02:00
Jasmin Weise bc72908c1a Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-08 15:12:59 +02:00
Jasmin Weise 7c6e956c9e Buch Cover sind jetzt in einem eigenen Ordner
Zutreffender Code wurde angepasst
2023-06-08 15:12:13 +02:00
Nils Eilinghoff eac5d8366a meinebuecher.php head und footer angepasst 2023-06-07 21:32:08 +02:00
Sebastian Greil 9f146a1aa8 Merge remote-tracking branch 'origin/master' 2023-06-07 09:50:16 +02:00
GhadaA98 198064ee71 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-07 09:45:11 +02:00
GhadaA98 154e52d89d kleingeschrieben 2023-06-07 09:44:46 +02:00
Nils Eilinghoff 130ecfe1af buecher.php bookdetails 2023-06-07 09:32:32 +02:00
Nils Eilinghoff 4c9e82db27 buecher.php fertig 2023-06-07 09:28:03 +02:00
Jasmin Weise 08fd5ab5ff Kleine Veränderung 2023-06-07 09:11:18 +02:00
Sebastian Greil ec4e6931a5 alten lokalen sessionstorage Eintrag entfernt 2023-06-06 16:24:13 +02:00
Jasmin Weise 32cae688a8 Großschreibung im Button 2023-06-06 13:43:05 +02:00
Jasmin Weise 0c7fed4bd4 EInfache Suche eingebunden 2023-06-06 13:41:47 +02:00
Jasmin Weise dd04b249fd notwendiges_laden.js eingebunden 2023-06-06 13:35:56 +02:00
Jasmin Weise 741a54c98a Nachnamen mit van sind nun erlaubt
Passwort Fehlermeldungen werden korrekt angezeigt
2023-06-06 13:23:43 +02:00
Jasmin Weise 3255505335 Nachnamen mit van sind nun erlaubt 2023-06-06 13:23:20 +02:00
Jasmin Weise 64268a05df Einfache Suche eingebunden 2023-06-06 13:22:51 +02:00
Jasmin Weise fbd729ed34 Button "Suchfelder leeren" leicht verkleinert 2023-06-06 12:50:23 +02:00
Jasmin Weise 0bc3d95ab2 Überschriften an Mockup angepasst
notwendiges_laden.js eingebunden
2023-06-06 12:42:24 +02:00
Jasmin Weise 71733ca50b Impressum Überschriften an Mockup angepasst 2023-06-06 12:41:33 +02:00
Jasmin Weise 3c3ca63332 Datei neu erstellt
Probleme mit Dateiname behoben
notwendiges_laden.js eingebunden
2023-06-06 12:28:17 +02:00
Jasmin Weise 7db7b9e44a . 2023-06-06 12:27:37 +02:00
Jasmin Weise b81a8a0bf7 notwendiges_laden.js eingebunden 2023-06-06 12:25:51 +02:00
GhadaA98 108fb5041e add a reset-counter file to reset the Primary key 2023-06-05 17:07:04 +02:00
GhadaA98 94506f14c9 Verfeinerungen 2023-06-05 16:57:35 +02:00
GhadaA98 7439b9d2c3 an-/ Abmeldung und Registrierung komplett fertig 2023-06-05 16:49:14 +02:00
GhadaA98 c56d4fd19d anmeldung 2023-06-05 15:13:50 +02:00
GhadaA98 cfb1d8f8ee Registrierung erfolgreich abgeschlossen 2023-06-05 13:44:55 +02:00
GhadaA98 07820676c7 adding new files 2023-06-05 11:37:55 +02:00
GhadaA98 c5b91bed6f Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-04 11:33:54 +02:00
Jasmin Weise d90ec603d9 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-03 20:37:12 +02:00
Jasmin Weise d5ff2cf529 "Verfügbar ab:" funktioniert 2023-06-03 20:36:42 +02:00
Nils Eilinghoff 9dd79f3d1c buecher.php auf suchergebnisse.php basierend geändert 2023-06-03 16:53:27 +02:00
Nils Eilinghoff 019551bdf2 buecher.html -> buecher.php
buecher.php notwendiges_laden.js integriert
2023-06-03 16:34:55 +02:00
Jasmin Weise 2d7aa183aa notwendiges_laden.js eingebunden 2023-06-03 14:55:09 +02:00
Jasmin Weise 6b663eb974 notwendiges_laden.js eingebunden
Umbenannt
TODO: Datum bei "Verfügbar ab:"
2023-06-03 14:53:35 +02:00
Jasmin Weise b77bf37c44 notwendiges_laden.js eingebunden
TODO: Mögliches Verhalten bei falschen Eingaben
TODO: Monat und Tag sind unnötig
2023-06-03 14:49:44 +02:00
Jasmin Weise 237f887f69 Einfache Suche im geladenen Header funktioniert 2023-06-03 14:49:04 +02:00
Jasmin Weise ef632ec0d0 Javascript um Header, Footer und Nav zu laden 2023-06-03 14:02:44 +02:00
GhadaA98 6003422419 Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-06-02 23:19:57 +02:00
Jasmin Weise 2730d10153 Suchergebnisse Erweiterte Suche
Es fehlt: Verfügbar ab...
2023-06-02 21:06:56 +02:00
Jasmin Weise 8fc8c48414 . 2023-06-02 21:06:30 +02:00
Jasmin Weise fc9cb8d190 Erreichbar über Suchergebnisse. 2023-06-02 21:05:05 +02:00
Jasmin Weise cbbfc06fdd Erweiterte Suche funktioniert (Jahr fehlt) 2023-06-02 13:17:12 +02:00
Jasmin Weise 86f191db5d Datei wieder umbenannt wegen Verlinkungsproblemen. 2023-06-02 11:57:34 +02:00
Jasmin Weise 3ef869eedb .hauptcontainer -> height auf 71% geändert 2023-06-01 20:00:46 +02:00
Nils Eilinghoff 2c6be7fb8d Upload files to 'pictures' 2023-06-01 18:44:23 +02:00
Nils Eilinghoff 585811e650 Upload files to 'pictures' 2023-06-01 18:44:10 +02:00
Jasmin Weise 76d62030c1 Dateiname erweiterteSuche geändert. 2023-06-01 14:13:08 +02:00
Jasmin Weise fb5332b24c Noch nicht fertig. 2023-06-01 14:12:32 +02:00
GhadaA98 3c3a97378d Merge branch 'master' of https://gitty.informatik.hs-mannheim.de/2123174/Candle 2023-05-31 16:06:30 +02:00
GhadaA98 82d9156636 trying to connect to the database 2023-05-31 16:03:16 +02:00
Sebastian 8c67f39f85 falsche .html Endungen mit .php ersetzt 2023-05-31 13:51:15 +02:00
GhadaA98 ed9d1349c0 an-/abmelden 2023-05-30 21:51:35 +02:00
GhadaA98 b0d5e7a461 Registrierung_Daten serverseitig überprüft 2023-05-30 19:57:00 +02:00
GhadaA98 289a66a5f3 Änderungen 2023-05-30 13:54:44 +02:00
GhadaA98 914cc5ebe7 Verbindung zur Datenbank wieder hergestellt 2023-05-28 16:13:02 +02:00
GhadaA98 58b52438a8 Data base 2023-05-28 13:37:02 +02:00
GhadaA98 66ab4929f4 connection mit dem DB hergestellt 2023-05-27 17:42:56 +02:00
GhadaA98 1b840b07d6 registrierung 2023-05-27 17:16:45 +02:00
GhadaA98 cf73e14b43 an-/abmelden 2023-05-27 15:05:06 +02:00
GhadaA98 3dc6d4ac58 klein schreiben 2023-05-26 18:12:29 +02:00
GhadaA98 8075599ab6 klein schreiben 2023-05-26 17:57:34 +02:00
GhadaA98 c52187ebbc klein schreiben 2023-05-26 16:44:35 +02:00
Nils Eilinghoff c8fb81f2b7 New Master Started 2023-05-26 16:39:10 +02:00
Nils Eilinghoff a275502501 Delete 'code.zip' 2023-05-26 16:37:15 +02:00
Nils Eilinghoff 3d5a11a91e Upload files to '' 2023-05-26 16:37:09 +02:00
Nils Eilinghoff 1560a821bb Delete 'index.html' 2023-05-26 16:36:44 +02:00
Nils Eilinghoff 2a9c987c3d Delete 'impressum.html' 2023-05-26 16:36:41 +02:00
Nils Eilinghoff 38eea39133 Delete 'es.html' 2023-05-26 16:36:38 +02:00
Nils Eilinghoff 5eddde5807 Delete 'erweiterteSuche.html' 2023-05-26 16:36:36 +02:00
Nils Eilinghoff c3bf9a6cef Delete 'datenschutz.html' 2023-05-26 16:36:33 +02:00
Nils Eilinghoff 108079d061 Upload files to '' 2023-05-26 16:36:05 +02:00
Sebastian Greil a0543e18b7 delete 2023-05-26 16:34:33 +02:00
Sebastian Greil b65128a406 Bilder klickbar und hover fixed 2023-05-26 16:33:29 +02:00
89 changed files with 7410 additions and 2371 deletions

View File

@ -1,2 +0,0 @@
ErrorDocument 404 http://bib-candle.com/404.html

View File

@ -1,3 +0,0 @@
{
"liveServer.settings.port": 5501
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

139
abmelden.php 100644
View File

@ -0,0 +1,139 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Abmelden</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
if(isset($_SESSION['eingeloggt']) && $_SESSION['eingeloggt'] == 1 ){
echo '
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="logOffTitle">Abmelden</h1>
</div>
<div class="mainContent">
<p id="mainText">
Sie sind bereits angemeldet, wollen Sie sich jetzt abmelden?
<br><br>
<div class="buttonContainer">
<a id="backToHomeButton" href="abmelden_erfolgreich.php">Bestätigen</a>
<a id="logInAgainButton" href="anmelden_meinebuecher.php">Abbrechen</a>
</div>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>';
}else{
echo '
<html>
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="logOffTitle">Abmelden</h1>
</div>
<div class="mainContent">
<p id="mainText">
Sie sind noch nicht angemeldet.
<br><br>
<div class="buttonContainer">
<a id="backToHomeButton" href="index.php">Zurück zur Startseite</a>
</div>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>';
exit();
}
?>

View File

@ -0,0 +1,89 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
session_unset();
session_destroy();
echo '
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="logOffSuccessfulTitle">Erfolgreich abgemeldet</h1>
</div>
<div class="mainContent">
<p id="mainText">
Sie wurden abgemeldet.
<br><br>
<div class="buttonContainer">
<a id="backToHomeButton" href="index.php">Zur Startseite</a>
<a id="logInAgainButton" href="anmelden_meinebuecher.php">Erneut anmelden</a>
</div>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>';
?>

View File

@ -1,105 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
<script src="burgerIcon.js"></script>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meineBuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweiterteSuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="anmeldung">
<div class="anmeldung-text">
<h1 class="anmeldung-überschrift" >Anmelden</h1>
<p id="obererText">Über die Webseite werden personenbezogene Daten erhoben und genutzt.
Für Details, beziehen Sie sich bitte auf die Seite <span>Datenschutz</span></p>
</div>
<div class="anmeldeInput">
<h2 class="anmeldung-überschrift">Angaben zur Anmeldung</h2>
<hr style="background-color:#A78766; height: 2px; width: 200px; border: none; position: relative;
top:3px">
<div>
<form class="anmeldung-überschrift" action="meinebuecher.html">
Karten-ID</br>
<input type="text" name="karten-id"></br>
Passwort</br>
<input type="password" name="password"></br>
<input id="anmeldebutton" type="submit" name="submit" href="buecher.html" value="Anmelden">
</form>
</div>
<div class="anmeldung-ausklappen">
<details>
<summary>Passwort vergessen / Passwort ändern</summary>
<p>Sollten sie Ihr Passwort vergessen haben oder wollen Sie es ändern,
kommen Sie bitte mit ihrem Bibliotheksausweis zu uns in die Bibliothek</p>
</details>
<details>
<summary>Sie haben noch kein Konto?</summary>
<p><a href="registrierung.html">Jetzt registrieren</a></p>
</details>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

122
anmelden.php 100644
View File

@ -0,0 +1,122 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Anmeldung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
if(isset($_SESSION['eingeloggt']) && $_SESSION['eingeloggt'] == 1 ){
require_once "reservierung.php";
}else{
echo '
<div class="anmeldung">
<h1 class="anmeldung-überschriften" >Anmelden</h1>
<div class="anmeldung-rest">
<div class="anmeldung-text">
<p id="obererText">Über die Webseite werden personenbezogene Daten erhoben und genutzt.
Für Details, beziehen Sie sich bitte auf die Seite <a href="datenschutz.php">Datenschutz</a>.</p>
</div>
<div class="anmeldeInput">
<h2 class="anmeldung-überschriften">Angaben zur Anmeldung</h2>
<hr>
<div>
<form class="anmeldung-überschriften" accept-charset="UTF-8" action="anmeldesystem_warenkorb.php" method="POST">
Karten-ID <span id="question-mark">
<svg width="20px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256
256 0 1 1 512 0A256 256 0 1 1 0 256zm169.8-90.7c7.9-22.3 29.1-37.3
52.8-37.3h58.3c34.9 0 63.1 28.3 63.1 63.1c0 22.6-12.1 43.5-31.7 54.8L280
264.4c-.2 13-10.9 23.6-24 23.6c-13.3 0-24-10.7-24-24V250.5c0-8.6 4.6-16.5
12.1-20.8l44.3-25.4c4.7-2.7 7.6-7.7 7.6-13.1c0-8.4-6.8-15.1-15.1-15.1H222.6c-3.4
0-6.4 2.1-7.5 5.3l-.4 1.2c-4.4 12.5-18.2 19-30.6 14.6s-19-18.2-14.6-30.6l.4-1.2zM224
352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"/></svg>
<span id="tooltip">Ihre Karten-ID befindet sich auf ihrem Bibliotheksausweis</span>
</span></br>
<input type="text" name="karten-id" required></br>
Passwort</br>
<input type="password" name="password" required></br>
<input id="anmeldebutton" type="submit" name="submit" value="Anmelden">
</form>
</div>
<div class="anmeldung-ausklappen">
<details>
<summary>Passwort vergessen / Passwort ändern</summary>
<p>Sollten Sie Ihr Passwort vergessen haben oder wollen Sie es ändern,
kommen Sie bitte mit ihrem Bibliotheksausweis zu uns in die Bibliothek</p>
</details>
<details>
<summary>Sie haben noch kein Konto?</summary>
<p><a href="registrierung.php">Jetzt registrieren</a></p>
</details>
</div>
</div>
</div>
</div>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>';
}
?>

View File

@ -0,0 +1,119 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Anmeldung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
if(isset($_SESSION['eingeloggt']) && $_SESSION['eingeloggt'] == 1 ){
require_once "meinebuecher.php";
}else{
echo '
<div class="anmeldung">
<h1 class="anmeldung-überschriften" >Anmelden</h1>
<div class="anmeldung-rest">
<div class="anmeldung-text">
<p id="obererText">Über die Webseite werden personenbezogene Daten erhoben und genutzt.
Für Details, beziehen Sie sich bitte auf die Seite <a href="datenschutz.php">Datenschutz</a>.</p>
</div>
<div class="anmeldeInput">
<h2 class="anmeldung-überschriften">Angaben zur Anmeldung</h2>
<hr>
<div>
<form class="anmeldung-überschriften" accept-charset="UTF-8" action="anmeldesystem_meinebuecher.php" method="POST">
Karten-ID <span id="question-mark">
<svg width="20px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256
256 0 1 1 512 0A256 256 0 1 1 0 256zm169.8-90.7c7.9-22.3 29.1-37.3
52.8-37.3h58.3c34.9 0 63.1 28.3 63.1 63.1c0 22.6-12.1 43.5-31.7 54.8L280
264.4c-.2 13-10.9 23.6-24 23.6c-13.3 0-24-10.7-24-24V250.5c0-8.6 4.6-16.5
12.1-20.8l44.3-25.4c4.7-2.7 7.6-7.7 7.6-13.1c0-8.4-6.8-15.1-15.1-15.1H222.6c-3.4
0-6.4 2.1-7.5 5.3l-.4 1.2c-4.4 12.5-18.2 19-30.6 14.6s-19-18.2-14.6-30.6l.4-1.2zM224
352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"/></svg>
<span id="tooltip">Ihre Karten-ID befindet sich auf ihrem Bibliotheksausweis</span>
</span></br>
<input type="text" name="karten-id" required></br>
Passwort</br>
<input type="password" name="password" required></br>
<input id="anmeldebutton" type="submit" name="submit" value="Anmelden">
</form>
</div>
<div class="anmeldung-ausklappen">
<details>
<summary>Passwort vergessen / Passwort ändern</summary>
<p>Sollten Sie Ihr Passwort vergessen haben oder wollen Sie es ändern,
kommen Sie bitte mit ihrem Bibliotheksausweis zu uns in die Bibliothek</p>
</details>
<details>
<summary>Sie haben noch kein Konto?</summary>
<p><a href="registrierung.php">Jetzt registrieren</a></p>
</details>
</div>
</div>
</div>
</div>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>';
}

View File

@ -0,0 +1,46 @@
<?php session_start();
$db_link = mysqli_connect('localhost', 'web_b-3', 'een7Ao6s', 'bibliothek_candle', '3306');
function runSQL($sql){
global $db_link;
$db_res = mysqli_query($db_link, $sql);
if(!$db_res){
header("Location: 404.html");
exit;
}
return $db_res;
}
if(isset($_POST['submit'])){
$kartenid = $_POST['karten-id'];
$passwort = $_POST['password'];
$existiert = runSQL("SELECT COUNT(*) FROM `benutzer` WHERE `KartenID` = '$kartenid' and `Passwort` = '$passwort'");
$row = mysqli_fetch_array($existiert);
$karteexistiert = runSQL("SELECT COUNT(*) FROM `benutzer` WHERE `KartenID` = '$kartenid'");
$zeile = mysqli_fetch_array($karteexistiert);
if($row['COUNT(*)'] > 0){
$_SESSION['eingeloggt'] = 1;
if(!isset($_SESSION['userID'])){
$sql = $db_link->prepare("SELECT benutzer.BenutzerID FROM benutzer WHERE benutzer.KartenID = ?;");
$sql->bind_param("i", $kartenid);
$sql->execute();
$result = $sql->get_result();
if (mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_assoc($result)) {
$_SESSION['userID'] = $row['BenutzerID'];
}
}
}
header("Location: meinebuecher.php");
}else if($zeile['COUNT(*)'] > 0){
header("Location: passwort_stimmt_nicht.php");
}else{
header("Location: benutzer_existiert_nicht.php");
}
}else{
header("Location: 404.html");
}
?>

View File

@ -0,0 +1,47 @@
<?php session_start();
$db_link = mysqli_connect('localhost', 'web_b-3', 'een7Ao6s', 'bibliothek_candle', '3306');
function runSQL($sql){
global $db_link;
$db_res = mysqli_query($db_link, $sql);
if(!$db_res){
header("Location: 404.html");
exit;
}
return $db_res;
}
if(isset($_POST['submit'])){
$kartenid = $_POST['karten-id'];
$passwort = $_POST['password'];
$existiert = runSQL("SELECT COUNT(*) FROM `benutzer` WHERE `KartenID` = '$kartenid' and `Passwort` = '$passwort'");
$row = mysqli_fetch_array($existiert);
$karteexistiert = runSQL("SELECT COUNT(*) FROM `benutzer` WHERE `KartenID` = '$kartenid'");
$zeile = mysqli_fetch_array($karteexistiert);
if($row['COUNT(*)'] > 0){
$_SESSION['eingeloggt'] = 1;
if(!isset($_SESSION['userID'])){
$sql = $db_link->prepare("SELECT benutzer.BenutzerID FROM benutzer WHERE benutzer.KartenID = ?;");
$sql->bind_param("i", $kartenid);
$sql->execute();
$result = $sql->get_result();
if (mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_assoc($result)) {
$_SESSION['userID'] = $row['BenutzerID'];
}
}
}
header("Location: reservierung.php");
}else if($zeile['COUNT(*)'] > 0){
header("Location: passwort_stimmt_nicht.php");
}else{
header("Location: benutzer_existiert_nicht.php");
}
}else{
header("Location: 404.html");
}
?>

View File

@ -0,0 +1,82 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Erfolgreich Registriert</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="registeredTitle">Fehler</h1>
</div>
<div class="mainContent">
<p id="textFirstHalf">
Sie haben sich noch nicht registriert!
</p>
<a type="button" id="loginNowButton" href="registrierung.php"> Jetzt Registrieren </a>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,81 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Erfolgreich Registriert</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="registeredTitle">Fehler</h1>
</div>
<div class="mainContent">
<p id="textFirstHalf">
Benutzer schon vorhanden!
</p>
<a type="button" id="loginNowButton" href="anmelden.php"> Anmelden </a>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 294 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 84 KiB

View File

Before

Width:  |  Height:  |  Size: 177 KiB

After

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 674 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 57 KiB

View File

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 77 KiB

View File

Before

Width:  |  Height:  |  Size: 196 KiB

After

Width:  |  Height:  |  Size: 196 KiB

View File

Before

Width:  |  Height:  |  Size: 667 KiB

After

Width:  |  Height:  |  Size: 667 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 115 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 KiB

96
buch_details.css 100644
View File

@ -0,0 +1,96 @@
/*TODO: Hintergrundfarben entfernen*/
.hauptcontainer {
/*Einzelne Elemente untereinander anzeigen.*/
flex-direction: column;
}
/*Container wird mit Daten aus der Datenbank gefüllt.*/
#bookInfo_container {
padding-left: 45px;
padding-right: 50px;
padding-bottom: 50px;
padding-top: 30px;
}
.book_container {
/*background-color: blueviolet;*/
display: flex;
/*Einzelne Elemente nebeneinander anzeigen.*/
flex-direction: row;
}
.bookCover_container {
/*background-color: blue;*/
display: flex;
/*Verbietet dem Container, seine Standardgröße (px) zu ändern.*/
flex: 0 0 150px;
align-items: center;
height: auto;
}
.bookCover {
/*Bild passt sich seinem Container an.*/
max-width:100%;
max-height:100%;
}
.bookDetails_container {
/* background-color: aquamarine; */
width: 100%;
display: flex;
flex-direction: column;
padding-left: 25px;
padding-right: 25px;
}
.bookTitle {
margin-bottom: 10px;
font-weight: 400;
}
.bookDetails {
margin-bottom: 10px;
}
.available_container {
width: fit-content;
/*Hintergrundfarbe wird an Inhalt angepasst.*/
background-color: #70AD47;
/*background-color: #F34343;*/
/*Element immer an der unteren Seite des Containers platzieren.*/
margin-top: auto;
}
.available {
color: white;
margin: 10px 25px;
}
.shoppingCart_container {
/* background-color: chartreuse; */
margin-left: auto;
margin-top: auto;
flex: 0 0 40px;
}
.shoppingCart {
background-image: url('pictures/shopping_cart.png');
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
}
.shoppingCart:hover {
background-image: url('pictures/shopping_cart_hover.png');
cursor: pointer;
}
.content_container, .bookMoreDetails_container {
margin-top: 25px;
}
.bookContent_heading, .bookDetails_heading {
font-weight: 400;
}

243
buch_details.php 100644
View File

@ -0,0 +1,243 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="buch_details.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Details</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="hauptcontainer">
<?php
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
/* SQL-Befehl vorbereiten */
$sql = $connection->prepare("SELECT b.BuchID, b.Titel,
b.Erscheinungsjahr, b.Bild, b.Verlag,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
GROUP_CONCAT(DISTINCT k.Name SEPARATOR ', ') AS 'Kategorie',
b.ISBN, b.Klappentext AS 'Inhalt', sp.Bezeichnung AS 'Sprache',
GROUP_CONCAT(DISTINCT st.Text SEPARATOR ', ') AS 'Stichwort',
IF(b.Anzahl!=0, 'Verfügbar', CONCAT('Verfügbar ab: ',
(SELECT DATE_FORMAT(DATE_ADD(ab.Enddatum, INTERVAL 1 DAY)
,'%d.%m.%Y') FROM `ausgeliehenes_buch` AS ab
WHERE ab.BuchID = b.BuchID
ORDER BY ab.Reserviert ASC, ab.Enddatum ASC LIMIT 1)))
AS 'Verfügbarkeit' FROM `buch` AS b
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
INNER JOIN `buch_hat_kategorie` AS bhk ON bhk.BuchID = b.BuchID
INNER JOIN `kategorie` AS k ON k.KategorieID = bhk.KategorieID
INNER JOIN `sprache` AS sp ON sp.SprachenID = b.SprachenID
INNER JOIN `buch_hat_stichwort` AS bhs ON bhs.BuchID = b.BuchID
INNER JOIN `stichwort` AS st ON st.StichwortID = bhs.StichwortID
WHERE b.BuchID = ?
GROUP BY b.BuchID;");
// Parameter binden
$sql->bind_param("i", $ID);
// Übergebene ID des angeklickten Container speichern
$containerID = $_GET['bookID'];
// Buch ID abtrennen
$ID = str_replace('book_container', '', $containerID);
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookPublishingYear = $row['Erscheinungsjahr'];
$bookPublisher = $row['Verlag'];
$bookAuthor = $row['Autor'];
$bookCategory = $row['Kategorie'];
$bookAvailability = $row['Verfügbarkeit'];
$bookContent = $row['Inhalt'];
$bookISBN = $row['ISBN'];
$bookLanguage = $row['Sprache'];
$bookKeywords = $row['Stichwort'];
/* TODO: OnClick auslagern. */
echo
"<div id='bookInfo_container'>
<div class='book_container'>
<div class='bookCover_container'>
<img class='bookCover'
src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>Verfasser: $bookAuthor</p>
<p class='publishing_year'>Erscheinungsjahr:
$bookPublishingYear</p>
<p class='publisher'>Verlag:
$bookPublisher</p>
<p class='category'>Kategorie:
$bookCategory</p>
</div>
<div class='available_container'>
<p id='available_$bookID' class='available'>
$bookAvailability</p>
<!--TODO: Auslagern - Geht nicht - JS was PHP informationen braucht-->
<script type='text/javascript'
type='JavaScript'>
(function() {
var currentElement = document.
getElementById
('available_$bookID');
var parentDiv =
currentElement.parentElement;
if (currentElement.innerHTML.trim()
== 'Verfügbar') {
parentDiv.style.backgroundColor
= '#70AD47';
}
else {
parentDiv.style.backgroundColor
= '#F34343';
}
var newTitle =
'Candle Bibliothek | $bookTitle';
document.title = newTitle;
})();
</script>
</div>
</div>
<!--TODO: OnClick Event auslagern-->
<div class='shoppingCart_container'
id='shoppingCart$bookID'
onclick='addBookToCart(this.id)'>
<div class='shoppingCart'></div>
</div>
</div>
<div class='content_container'>
<h2 class='bookContent_heading'>Inhalt</h2>
<p class='bookContent'>$bookContent</p>
</div>
<div class='bookMoreDetails_container'>
<h2 class='bookDetails_heading'>Details</h2>
<p class='bookISBN'>ISBN: $bookISBN</p>
<p class='bookLanguage'>Sprache: $bookLanguage</p>
<p class='bookKeywords'>Stichwörter:
$bookKeywords</p>
</div>
</div>";
}
} else {
echo "Keine Infos vorhanden.";
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
mysqli_close($connection);
?>
</div>
<!------------------------------------------------------------------------->
<!-- TODO: Auslagern (falls möglich) -->
<script>
function addBookToCart(ID) {
// OnClick Event für open_bookDetails stoppen
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
// ID abtrennen
ID = ID.replace('shoppingCart', '');
var request = new XMLHttpRequest();
request.open('POST',
'http://141.19.142.11/warenkorb_funktionen.php', true);
// TODO: Handler erstellen
request.onload = function() {
console.log(this.responseText);
}
request.setRequestHeader('Content-type',
'application/x-www-form-urlencoded');
request.send(`function=addBookToCart&id=${ID}`);
}
</script>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,139 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="store.js" defer></script>
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="containerofbuecher">
<p id="büchertitel">Bücher</p>
<div id="firstItem" class="items" >
<a href="percy.html"><img class="buecherImages" src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/></a>
<h3 class="headerinItem">
Percy Jackson: Diebe im Olymp
</h3>
<p class="discinItem">Verfasser: Rick Riordan <br>
Erscheinungsjahr: 2010 <br>
Verlag: Carlsen <br>
Kategorie: Fantasy
</p>
<a class="greenbutton">Verfügbar</a>
<a class="binPicture" ><img src="pictures/shopping_cart.png" width="25" height="25"></a>
<hr style="width: 90%; position: absolute; top: 220px;">
</div>
<!--Second Item-->
<div id="secondItem" class="items">
<a href="dalmatians.html"><img class="buecherImages" src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/></a>
<h3 class="headerinItem">
The Hundred and One Dalmatians
</h3>
<p class="discinItem">Verfasser: Dodie Smith <br>
Erscheinungsjahr: 2015 <br>
Verlag: Farshore <br>
Kategorie: Kinderbuch
</p>
<a class="redbutton" >Verfügbar ab: 30.04.2023</a>
<a class="binPicture" ><img src="pictures/shopping_cart.png" width="25" height="25"></a>
<hr style="width: 90%; position: absolute; top: 220px;">
</div>
<!--Third Item-->
<div id="thirdItem" class="items">
<a href="penguin.html"><img class="buecherImages" src="pictures/penguin_highway.jpg" width="125" height="200"/> </a>
<h3 class="headerinItem">
Penguin Highway
</h3>
<p class="discinItem">Verfasser: Tomihiko Morimi <br>
Erscheinungsjahr: 2019 <br>
Verlag: Yen On <br>
Kategorie: Fantasy
</p>
<a class="greenbutton" >Verfügbar</a>
<a class="binPicture" ><img src="pictures/shopping_cart.png" width="25" height="25"></a>
<hr style="width: 90%; position: absolute; top: 220px;">
</div>
<!--fourth Item-->
<div id="fourthItem" class="items" >
<a href="es.html"><img class="buecherImages" src="pictures/es.jpg" width="125" height="200"/> </a>
<h3 class="headerinItem">
Es
</h3>
<p class="discinItem">Verfasser: Stephen King <br>
Erscheinungsjahr: 2011 <br>
Verlag: Heyne <br>
Kategorie: Horror
</p>
<a class="redbutton" >Verfügbar ab: 10.05.2023</a>
<a class="binPicture" ><img src="pictures/shopping_cart.png" width="25" height="25"></a>
</div>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<!--Burger-->
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

222
buecher.php 100644
View File

@ -0,0 +1,222 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Bücher</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<div class="hauptcontainer">
<h1 id="searchResult_heading">Bücher</h1>
<div id="searchResult_container">
<?php
$sql = '';
// SQL-Befehl zusammenstellen
$sql = "SELECT b.BuchID, b.Titel, b.Erscheinungsjahr, b.Bild,
b.Verlag,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
GROUP_CONCAT(DISTINCT k.Name SEPARATOR ', ') AS 'Kategorie',
b.ISBN, b.Klappentext AS 'Inhalt', sp.Bezeichnung AS 'Sprache',
GROUP_CONCAT(DISTINCT st.Text SEPARATOR ', ') AS 'Stichwort',
IF(b.Anzahl!=0, 'Verfügbar', CONCAT('Verfügbar ab: ',
(SELECT DATE_FORMAT(DATE_ADD(ab.Enddatum, INTERVAL 1 DAY)
,'%d.%m.%Y') FROM `ausgeliehenes_buch` AS ab
WHERE ab.BuchID = b.BuchID
ORDER BY ab.Reserviert ASC, ab.Enddatum ASC LIMIT 1)))
AS 'Verfügbarkeit' FROM `buch` AS b
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
INNER JOIN `buch_hat_kategorie` AS bhk ON bhk.BuchID = b.BuchID
INNER JOIN `kategorie` AS k ON k.KategorieID = bhk.KategorieID
INNER JOIN `sprache` AS sp ON sp.SprachenID = b.SprachenID
INNER JOIN `buch_hat_stichwort` AS bhs ON bhs.BuchID = b.BuchID
INNER JOIN `stichwort` AS st ON st.StichwortID = bhs.StichwortID
GROUP BY b.BuchID
;";
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
$result = mysqli_query($connection, $sql);
$counter = 0;
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookPublishingYear = $row['Erscheinungsjahr'];
$bookPublisher = $row['Verlag'];
$bookAuthor = $row['Autor'];
$bookCategory = $row['Kategorie'];
$bookAvailability = $row['Verfügbarkeit'];
if ($counter != 0) {
echo "<div class='divider'></div>";
}
// TODO: OnClick auslagern.
echo "<div id='book_container$bookID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover'
src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>Verfasser: $bookAuthor</p>
<p class='publishing_year'>
Erscheinungsjahr: $bookPublishingYear</p>
<p class='publisher'>
Verlag: $bookPublisher</p>
<p class='category'>
Kategorie: $bookCategory</p>
</div>
<div class='available_container'>
<p id='available_$bookID' class='available'>
$bookAvailability</p>
<!--TODO: Auslagern-->
<script type='text/javascript'
type='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$bookID');
var parentDiv =
currentElement.parentElement;
if (currentElement.innerHTML.trim()
== 'Verfügbar') {
parentDiv.style.backgroundColor
= '#70AD47';
}
else {
parentDiv.style.backgroundColor
= '#F34343';
}
})();
</script>
</div>
</div>
<!--TODO: OnClick Event auslagern-->
<div class='shoppingCart_container'
id='shoppingCart$bookID'
onclick='addBookToCart(this.id)'>
<div class='shoppingCart'></div>
</div>
</div>";
$counter++;
}
} else {
echo "Keine Ergebnisse.";
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
mysqli_close($connection);
?>
</div>
</div>
<script>
function open_bookDetails(ID) {
var data = new URLSearchParams();
data.append("bookID", ID);
var url = "http://141.19.142.11/buch_details.php?" +
data.toString();
location.href = url;
}
function addBookToCart(ID) {
// OnClick Event für open_bookDetails stoppen
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
// ID abtrennen
ID = ID.replace('shoppingCart', '');
var request = new XMLHttpRequest();
request.open('POST',
'http://141.19.142.11/warenkorb_funktionen.php', true);
// TODO: Handler erstellen
request.onload = function() {
console.log(this.responseText);
}
request.setRequestHeader('Content-type',
'application/x-www-form-urlencoded');
request.send(`function=addBookToCart&id=${ID}`);
}
</script>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<!--Burger-->
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -6,10 +6,15 @@ function openNav() {
opacity: 0;
pointer-events: none;
}
#uberuns{
pointer-events: auto;
opacity: 1;
}
#abmelden{
pointer-events: auto;
opacity: 1;
}
#buecher{
pointer-events: auto;
opacity: 1;
@ -18,6 +23,14 @@ function openNav() {
pointer-events: auto;
opacity: 1;
}
#erweitertesuche{
position: fixed;
right: 450px;
top: 13px;
opacity: 1;
pointer-events: auto;
}
#nav-toggle {
opacity: 1;
@ -34,7 +47,7 @@ function openNav() {
.suchleiste{
position: fixed;
right: 280px;
right: 233px;
top: 0px;
}
#buttonID{
@ -42,21 +55,59 @@ function openNav() {
right: 240px;
top: 0px;
}
#uberuns{
position: fixed;
left: 340px;
top: 43px;
left: 43%;
top: 96px;
width: 120px;
height: 35px;
background-color:#664220 ;
color:rgb(255, 255, 255);
}
#abmelden{
position: fixed;
left: 0px;
top: 150px;
width: 120px;
height: 35px;
background-color:#664220 ;
color:rgb(255, 255, 255);
}
#buecher{
position: fixed;
left: 340px;
top: 96px;
left: 43%;
top: 43px;
width: 120px;
height: 35px;
background-color:#664220 ;
color:rgb(255, 255, 255);
padding-right:10px;
padding-left: 8px;
padding-top: 15px;
padding-bottom: 0px;
text-align: center;
text-decoration: none;
}
#meinebuecher{
position: fixed;
left: 340px;
top: 150px;
left: 43%;
top: 149px;
width: 120px;
height: 35px;
background-color:#664220 ;
color:rgb(255, 255, 255);
padding-right:10px;
padding-left: 8px;
padding-top: 15px;
padding-bottom: 0px;
text-align: center;
text-decoration: none;
}
@ -65,6 +116,8 @@ function openNav() {
opacity: 1;
pointer-events: auto;
}
`;
if (document.getElementById('nav-toggle').checked) {
var styleSheet = document.createElement("style")
@ -78,7 +131,7 @@ function openNav() {
link.type = 'text/css';
link.href = 'probestyle.css';
link.href = 'style.css';
// Get HTML head element to append
// link element to it
@ -91,21 +144,24 @@ function openNav() {
function unset()
{
var link = document.createElement('link');
var head = document.getElementsByTagName('head')[0];
// set the attributes for link element
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = 'probestyle.css';
link.href = 'style.css';
link.media = 'all';
// Get HTML head element to append
// link element to it
document.getElementsByTagName('HEAD')[0].appendChild(link);
var styleSheet = document.createElement("style")
styleSheet.innerText = closeNav
document.head.appendChild(styleSheet)
//document.getElementsByTagName('head').appendChild(link);
head.appendChild(link);
var styleSheet = document.createElement("style")
styleSheet.innerText = closeNav
document.head.appendChild(styleSheet)
}

View File

@ -1,97 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="haupt">
<!--Second Item-->
<div id="secondItem" class="items" >
<img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/>
<h3 class="headerinItem">
The Hundred and One Dalmatians
</h3>
<p class="discinItem">Verfasser: Dodie Smith <br>
Erscheinungsjahr: 2015 <br>
Verlag: Farshore <br>
Kategorie: Kinderbuch
</p>
<a class="redbutton" href="">Verfügbar ab: 03.04.2023</a>
<img id="shoppingwagen" src="pictures/shopping_cart.png" alt="shoppingwagen" href=""></a>
<p class="percypar">
<strong style="font-size: 25px;">Inhalt</strong> <br>
When Missis and Pongo's darling Dalmatian puppies are stolen, they know just who to suspect... the evil Cruella de Vill She's enough to
scare the spots off a pup and she would love nothing more than to turn them into a spotty fur coat! <br><br>
With the help of some fearless furry friends, the parents set off on a brave rescue attempt. But can the Dalmatian parents rescue their precious pups in time?
<br><br>
<strong style="font-size: 25px;">Details</strong> <br>
ISBN: 978-1-4052-7840-9 <br>
Sprahce: Englisch <br>
Stichwörter: Dalmatiner, Hunde, England, Welpen
</p>
</div>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

View File

@ -1,93 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p2">
<span id="titlebraun"><strong> Datenschutz </strong></span>
<br><br>
<strong>Wir nehmen Datenschutz ernst</strong> <br>
Der Schutz Ihrer Privatsphäre bei der Verarbeitung persönlicher Daten ist für uns ein wichtiges Anliegen. Wenn Sie unsere Webseite besuchen, speichern unsere Webserver standardmäßig die IP Ihres Internet Service Provider, die Webseite, von der aus Sie uns besuchen, die Webseiten, die Sie bei uns besuchen sowie das Datum und die Dauer des Besuches. Diese Informationen sind für die technische Übertragung der Webseiten und den sicheren Serverbetrieb zwingend erforderlich. Eine personalisierte Auswertung dieser Daten erfolgt nicht.
<br><strong>Personenbezogene Daten</strong> <br>
Personenbezogene Daten sind Daten über Ihre Person. Diese beinhalten Ihren Namen und Ihre Email Adresse. Sie müssen auch keine personenbezogenen Daten preisgeben um unsere Internetseite besuchen zu können. <br>
In einigen Fällen benötigen wir Ihren Namen und Adresse sowie weitere Informationen um Ihnen die gewünschte Dienstleistung anbieten zu können. Wenn Sie einen unserer Services nutzen, sammeln wir in der Regel nur die Daten die notwendig sind um Ihnen unseren Service bieten zu können. Möglicherweise fragen wir Sie nach weiteren Informationen, die aber freiwilliger Natur sind. Wann immer wir personenbezogene Daten verarbeiten, tun wir dies um Ihnen unseren Service anbieten zu können oder um unsere kommerziellen Ziele zu verfolgen.
<br><strong>Automatisch gespeicherte nicht personenbezogene Daten</strong>
<br>Wenn Sie unsere Internetseiten besuchen, speichern wir aus administrativen und technischen Gründen bestimmte Informationen. Diese sind: Typ und Version des verwendeten Browsers, Datum und Uhrzeit des Zugriffs, sowie die IP Adresse.
Diese Daten werden anonymisiert und lediglich für statistische Zwecke bzw. dafür verwendet, unsere Internet- und Onlinedienste zu verbessern.
<br>Diese anonymisierten Daten werden getrennt von personenbezogenen Daten auf sicheren Systemen gespeichert und können keinen individuellen Personen zugeordnet werden. Das bedeutet, dass Ihre personenbezogenen Daten jederzeit geschützt bleiben.
<br><strong>Cookies</strong> <br>Wenn Sie unsere Internetseiten besuchen speichern wir möglicherweise Informationen auf Ihrem Computer in Form von Cookies. Cookies sind kleine Dateien die von einem Internetserver an Ihren Browser übertragen und auf dessen Festplatte gespeichert werden. Die Rechtsgrundlage für die Verwendung von Cookies stellt dabei Art. 6 Abs. 1 lit f DSGVO dar.
Lediglich die Internet Protokoll Adresse wird hierbei gespeichert keine sonstigen personenbezogenen Daten. Diese Information die in den Cookies gespeichert wird erlaubt es, Sie bei dem nächsten Besuch auf unserer Internetseite automatisch wiederzuerkennen, wodurch Ihnen die Nutzung erleichtert wird.
<br>Natürlich können Sie unsere Internetseiten auch besuchen ohne Cookies zu akzeptieren. Wenn Sie nicht möchten, dass Ihr Computer beim nächsten Besuch wiedererkannt wird können Sie die Verwendung von Cookies auch ablehnen indem Sie die Einstellungen in Ihrem Browser auf „Cookies ablehnen“ ändern. Die jeweilige Vorgehensweise finden Sie in der Bedienungsanleitung Ihres jeweiligen Browsers. Wenn Sie die Verwendung von Cookies ablehnen, kann es jedoch zu Einschränkungen in der Nutzung mancher Bereiche unserer Internetseiten kommen.
Rechtsgrundlage für den Einsatz der Cookies ist unser berechtigtes Interesse gem. Art. 6 Abs. 1 lit. f DSGVO.
<br><strong>Sicherheit</strong><br>Wir haben technische und administrative Sicherheitsvorkehrungen getroffen um Ihre personenbezogenen Daten gegen Verlust, Zerstörung, Manipulation und unautorisierten Zugriff zu schützen. All unsere Mitarbeiter sowie für uns tätige Dienstleister sind auf die gültigen Datenschutzgesetze verpflichtet.
<br>Wann immer wir personenbezogene Daten sammeln und verarbeiten werden diese verschlüsselt bevor sie übertragen werden. Das heißt, dass Ihre Daten nicht von Dritten missbraucht werden können. Unsere Sicherheitsvorkehrungen unterliegen dabei einem ständigen Verbesserungsprozess und unsere Datenschutzerklärungen werden ständig überarbeitet. Bitte stellen Sie sicher, dass Ihnen die aktuellste Version vorliegt.
<br> <strong>Bettroffenenrechte</strong> <br>Bitte kontaktieren Sie uns jederzeit, wenn Sie sich informieren möchten welche personenbezogenen Daten wir über Sie speichern bzw. wenn Sie diese berichtigen oder löschen lassen wollen. Desweiteren haben Sie das Recht auf Einschränkung der Verarbeitung (Art. 18 DSGVO), ein Widerspruchsrechts gegen die Verarbeitung (Art. 21 DSGVO) sowie das Recht auf Datenübertragbarkeit (Art. 20 DSGVO).In diesen Fällen wenden Sie sich bitte direkt an uns.
<br><strong>Änderungen dieser Datenschutzerklärung</strong><br>Wir behalten uns das Recht vor, unsere Datenschutzerklärungen zu ändern falls dies aufgrund neuer Technologien notwendig sein sollte. Bitte stellen Sie sicher, dass Ihnen die aktuellste Version vorliegt. Werden an dieser Datenschutzerklärung grundlegende Änderungen vorgenommen, geben wir diese auf unserer Website bekannt.
</p>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

182
datenschutz.php 100644
View File

@ -0,0 +1,182 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="buch_details.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Details</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p2">
<span id="titlebraun"><strong> Datenschutz </strong></span>
<br><br>
<strong>Wir nehmen Datenschutz ernst</strong><br>
Der Schutz Ihrer Privatsphäre bei der Verarbeitung persönlicher
Daten ist für uns ein wichtiges Anliegen.
Wenn Sie unsere Webseite besuchen,
speichern unsere Webserver standardmäßig die IP
Ihres Internet Service Provider, die Webseite,
von der aus Sie uns besuchen, die Webseiten,
die Sie bei uns besuchen sowie das Datum
und die Dauer des Besuches.
Diese Informationen sind für die technische Übertragung der
Webseiten und den sicheren Serverbetrieb zwingend erforderlich.
Eine personalisierte Auswertung dieser Daten erfolgt nicht.
<br><strong>Personenbezogene Daten</strong> <br>
Personenbezogene Daten sind Daten über Ihre Person.
Diese beinhalten Ihren Namen und Ihre Email Adresse.
Sie müssen auch keine personenbezogenen Daten preisgeben
um unsere Internetseite besuchen zu können. <br>
In einigen Fällen benötigen wir Ihren Namen und Adresse
sowie weitere Informationen um Ihnen die gewünschte
Dienstleistung anbieten zu können.
Wenn Sie einen unserer Services nutzen,
sammeln wir in der Regel nur die Daten die notwendig sind
um Ihnen unseren Service bieten zu können.
Möglicherweise fragen wir Sie nach weiteren Informationen,
die aber freiwilliger Natur sind.
Wann immer wir personenbezogene Daten verarbeiten,
tun wir dies um Ihnen unseren Service anbieten zu können
oder um unsere kommerziellen Ziele zu verfolgen.
<br><strong>Automatisch gespeicherte
nicht personenbezogene Daten</strong>
<br>Wenn Sie unsere Internetseiten besuchen,
speichern wir aus administrativen und technischen Gründen
bestimmte Informationen.
Diese sind: Typ und Version des verwendeten Browsers,
Datum und Uhrzeit des Zugriffs, sowie die IP Adresse.
Diese Daten werden anonymisiert und lediglich
für statistische Zwecke bzw. dafür verwendet,
unsere Internet- und Onlinedienste zu verbessern.
<br>Diese anonymisierten Daten werden getrennt von
personenbezogenen Daten auf sicheren Systemen gespeichert
und können keinen individuellen Personen zugeordnet werden.
Das bedeutet,
dass Ihre personenbezogenen Daten jederzeit geschützt bleiben.
<br><strong>Cookies</strong><br>
Wenn Sie unsere Internetseiten besuchen speichern wir
möglicherweise Informationen auf Ihrem Computer
in Form von Cookies.
Cookies sind kleine Dateien die von einem Internetserver
an Ihren Browser übertragen und auf dessen
Festplatte gespeichert werden.
Die Rechtsgrundlage für die Verwendung von Cookies
stellt dabei Art. 6 Abs. 1 lit f DSGVO dar.
Lediglich die Internet Protokoll Adresse wird hierbei
gespeichert keine sonstigen personenbezogenen Daten.
Diese Information die in den Cookies gespeichert wird
erlaubt es,
Sie bei dem nächsten Besuch auf unserer Internetseite
automatisch wiederzuerkennen,
wodurch Ihnen die Nutzung erleichtert wird.
<br>Natürlich können Sie unsere Internetseiten auch besuchen
ohne Cookies zu akzeptieren.
Wenn Sie nicht möchten, dass Ihr Computer beim nächsten Besuch
wiedererkannt wird können Sie die Verwendung von Cookies
auch ablehnen indem Sie die Einstellungen in Ihrem Browser
auf „Cookies ablehnen“ ändern.
Die jeweilige Vorgehensweise finden Sie in
der Bedienungsanleitung Ihres jeweiligen Browsers.
Wenn Sie die Verwendung von Cookies ablehnen,
kann es jedoch zu Einschränkungen in der Nutzung
mancher Bereiche unserer Internetseiten kommen.
Rechtsgrundlage für den Einsatz der Cookies ist
unser berechtigtes Interesse gem. Art. 6 Abs. 1 lit. f DSGVO.
<br><strong>Sicherheit</strong><br>
Wir haben technische und administrative Sicherheitsvorkehrungen
getroffen um Ihre personenbezogenen Daten
gegen Verlust, Zerstörung, Manipulation
und unautorisierten Zugriff zu schützen.
All unsere Mitarbeiter sowie für uns tätige Dienstleister
sind auf die gültigen Datenschutzgesetze verpflichtet.
<br>Wann immer wir personenbezogene Daten sammeln
und verarbeiten werden diese verschlüsselt
bevor sie übertragen werden.
Das heißt,
dass Ihre Daten nicht von Dritten missbraucht werden können.
Unsere Sicherheitsvorkehrungen unterliegen dabei
einem ständigen Verbesserungsprozess und unsere
Datenschutzerklärungen werden ständig überarbeitet.
Bitte stellen Sie sicher,
dass Ihnen die aktuellste Version vorliegt.
<br> <strong>Bettroffenenrechte</strong><br>
Bitte kontaktieren Sie uns jederzeit,
wenn Sie sich informieren möchten welche personenbezogenen
Daten wir über Sie speichern bzw. wenn Sie diese berichtigen
oder löschen lassen wollen.
Desweiteren haben Sie das Recht auf Einschränkung
der Verarbeitung (Art. 18 DSGVO),
ein Widerspruchsrechts gegen die Verarbeitung (Art. 21 DSGVO)
sowie das Recht auf Datenübertragbarkeit (Art. 20 DSGVO).
In diesen Fällen wenden Sie sich bitte direkt an uns.
<br><strong>Änderungen dieser Datenschutzerklärung</strong><br>
Wir behalten uns das Recht vor,
unsere Datenschutzerklärungen zu ändern falls dies aufgrund
neuer Technologien notwendig sein sollte.
Bitte stellen Sie sicher,
dass Ihnen die aktuellste Version vorliegt.
Werden an dieser Datenschutzerklärung grundlegende Änderungen
vorgenommen, geben wir diese auf unserer Website bekannt.
</p>
</div>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,135 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="hauptcontainer">
<span id="titelerweitertesuche" > Erweiterte Suche </span> <br><br>
<form action="">
<input type="search" value="Titel" class="buchtitel" list="Titel">
<datalist id="Titel">
<option value="Titel"></option>
</datalist>
<input type="text" class="buchtiteloptions" list="buchtiteloptionen">
<input type="search" value="und" class="und-wort1" list="Und">
<datalist id="Und">
<option value="und"></option>
<option value="oder"></option>
</datalist>
<input type="search" value="Autor" class="autor" list="Autor">
<datalist id="Autor">
<option value="Autor"></option>
</datalist>
<input type="text" class="autoroptions" list="autoroptionen">
<input type="search" value="und" class="und-wort2" list="Und" >
<datalist id="Und">
<option value="und"></option>
<option value="oder"></option>
</datalist>
<input type="search" value="Stichwort" class="stichwort" list="Stichwort">
<datalist id="Stichwort">
<option value="Stichwort"></option>
</datalist>
<input type="text" class="stichwörteroptions" list="stichwörteroptionen">
<span id="weiteresuchkriterien" style> Weitere Suchkriterien</span><br><br></p>
<span class="jahrvon">Jahr von </span>
<input type="date" class="anfangsdatum" name="Buchdatum1">
<span class="bis">bis </span>
<input type="date" class="endsdatum" name="Buchdatum2">
<span class="sprache">Sprache </span>
<input type="search" class="spracheingabe" list="sprachoptionen">
<datalist id="sprachoptionen">
<option value="Deutsch"></option>
<option value="Englisch"></option>
<option value="Arabisch"></option>
<option value="Französisch"></option>
</datalist>
<span class="verfügbarkeit">Verfügbarkeit</span>
<input type="checkbox" class="checkbox" name="status" value="verfügbareBücher">
<span class="kommentar">verfügbare Bücher</span>
<a id="suchen" href="">suchen</a>
<a id="suchfelderleeren" href="">Suchfelder leeren</a>
</form>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

129
erweitertesuche.php 100644
View File

@ -0,0 +1,129 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Erweiterte Suche</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<div class="hauptcontainer">
<span id="titelerweitertesuche" > Erweiterte Suche </span> <br><br>
<form action="suchergebnisse.php" method="get">
<input type="hidden" name="searchType" value="extended">
<select id="dropdown1" name="dropdown1" class="buchtitel">
<option selected="selected">Titel</option>
<option>Autor</option>
<option>Verlag</option>
<option>Stichwort</option>
<option>Kategorie</option>
</select>
<input type="search" name="search1" class="buchtiteloptions">
<select id="and_or" name="and_or1" class="und-wort1">
<option>und</option>
<option>oder</option>
</select>
<select id="dropdown2" name="dropdown2" class="autor">
<option>Titel</option>
<option selected="selected">Autor</option>
<option>Verlag</option>
<option>Stichwort</option>
<option>Kategorie</option>
</select>
<input type="search" name="search2" class="autoroptions">
<select id="and_or" name="and_or2" class="und-wort2">
<option>und</option>
<option>oder</option>
</select>
<select id="dropdown3" name="dropdown3" class="stichwort">
<option>Titel</option>
<option>Autor</option>
<option>Verlag</option>
<option selected="selected">Stichwort</option>
<option>Kategorie</option>
</select>
<input type="search" name="search3" class="stichwörteroptions">
<span id="weiteresuchkriterien" style>
Weitere Suchkriterien</span><br><br></p>
<span class="jahrvon">Jahr von </span>
<input type="date" class="anfangsdatum" name="Buchdatum1">
<span class="bis">bis </span>
<input type="date" class="endsdatum" name="Buchdatum2">
<span class="sprache">Sprache </span>
<select id="language" name="language" class="spracheingabe">
<option>Alle Sprachen</option>
<option>Deutsch</option>
<option>Englisch</option>
<option>Französisch</option>
<option>Arabisch</option>
</select>
<span class="verfügbarkeit">Verfügbarkeit</span>
<input type="checkbox" class="checkbox"
name="status" value="verfügbareBücher">
<span class="kommentar">verfügbare Bücher</span>
<input type="submit" id="suchen" value="Suchen">
<a id="suchfelderleeren" href="">Suchfelder leeren</a>
</form>
</div>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

97
es.html
View File

@ -1,97 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="haupt">
<!--fourth Item-->
<div id="firstItem" class="items" >
<img src="pictures/es.jpg" width="125" height="200"/>
<h3 class="headerinItem">
Es
</h3>
<p class="discinItem">Verfasser: Stephen King <br>
Erscheinungsjahr: 2011 <br>
Verlag: Heyne <br>
Kategorie: Horror
</p>
<a class="redbutton" href="">Verfügbar ab: 10.05.2023</a>
<img id="shoppingwagen" src="pictures/shopping_cart.png" alt="shoppingwagen" href=""></a>
<p class="percypar">
<strong style="font-size: 25px;">Inhalt</strong> <br>
Inhalt:
In Derry, Maine, schlummert das Böse in der Kanalisation: Alle 28 Jahre wacht es auf und muss fressen.
Jetzt taucht »Es« wieder empor. Sieben Freunde entschließen sich, dem Grauen entgegenzutreten und ein Ende zu setzen.
<br><br>
<strong style="font-size: 25px;">Details</strong> <br>
ISBN: 978-3-453-43577-3 <br>
Sprahce: Deutsch <br>
Stichwörter: Horror, clown, Teenager, Monster
</p>
</div>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

View File

@ -1,87 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle" >
<p class="p2">
<span id="titlebraun"><strong> Impressum </strong></span>
<br><br>
<strong style="font-style: italic;">Firmensitz</strong><br>
Bibliothek Candle GmbH <br>
Paul-Wittsack-Straße 10 <br>
68163 Mannheim <br>
<strong style="font-style: italic;">Kontaktdaten</strong> <br>
Telefon: +49XXXXXXXX Montag bis Freitag von 9 bis 18 Uhr <br>
Telefax: 069 54 732122 <br>
E-Mail: 2211780@stud.hs-mannheim.de <br>
</p>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

86
impressum.php 100644
View File

@ -0,0 +1,86 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Suchergebnisse</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div>
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle" >
<div class="impressum-container">
<h1>Impressum</h1>
<h2>Firmensitz</h2>
<p class="impressum-text">
Bibliothek Candle GmbH <br>
Paul-Wittsack-Straße 10 <br>
68163 Mannheim <br>
</p>
<h2>Kontaktdaten</h2>
<p class="impressum-text">
Telefon: +49XXXXXXXX Montag bis Freitag von 9 bis 18 Uhr <br>
Telefax: 069 54 732122 <br>
E-Mail: 2211780@stud.hs-mannheim.de <br>
</p>
</div>
</div>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,95 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meineBuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p1">
<span id="titleschwarz">HERZLICH WILLKOMMEN!</span>
<br><br>
Die Bibliothek CANDLE begrüßt Sie ganz herzlich auf ihren Internetseiten. <br> <br>
Nutzen Sie unser umfangreiches Angebot aus den beliebtesten Büchern. <br> <br>
Wir freuen uns auf Ihren Besuch!
<br><br>
<span id="titleschwarz">VERANSTALTUNGEN!</span>
<br><br>
Leserunde | jeden Mittwoch | 17:30 Uhr
<br><br>
<span style="color: #000;" >HARRY POTTER-REIHE (aktuell) </span>
<br><br>
<span style="color: #000;">
Die erfolgreiche Buchreihe um den Zauberlehrling Harry James Potter umfasst insgesamt sieben Bände.
In jedem wird ein Schul- und Lehrjahr von Harry und seinen Freunden auf dem Zauberinternat Hogwarts erzählt.
Neben alltäglichen Problemen eines Jugendlichen, wird Harry immer wieder mit dem bösen Magier Lord Voldemort und seinen Gefolgsleuten,
den sogenannten Todessern, konfrontiert.
</span>
<br>
<a href="" style="font-style: italic; text-decoration: none; color: #000;" >mehr dazu...</a>
</p>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

100
index.php 100644
View File

@ -0,0 +1,100 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="buch_details.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Details</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p1">
<span class="titleschwarz">HERZLICH WILLKOMMEN!</span>
<br><br>
Die Bibliothek CANDLE begrüßt Sie
ganz herzlich auf ihren Internetseiten.<br><br>
Nutzen Sie unser umfangreiches Angebot aus den beliebtesten Büchern.
<br><br>Wir freuen uns auf Ihren Besuch!
<br><br>
<span class="titleschwarz">VERANSTALTUNGEN!</span>
<br><br>
Leserunde | jeden Mittwoch | 17:30 Uhr
<br><br>
<span style="color: #000;" >HARRY POTTER-REIHE (aktuell) </span>
<br><br>
<span style="color: #000;">
Die erfolgreiche Buchreihe um den Zauberlehrling
Harry James Potter umfasst insgesamt sieben Bände.
In jedem wird ein Schul- und Lehrjahr von Harry
und seinen Freunden auf dem Zauberinternat Hogwarts erzählt.
Neben alltäglichen Problemen eines Jugendlichen,
wird Harry immer wieder mit dem bösen Magier Lord Voldemort
und seinen Gefolgsleuten, den sogenannten Todessern, konfrontiert.
</span>
<br>
<a href=""
style="font-style: italic; text-decoration: none; color: #000;">
mehr dazu...</a>
</p>
</div>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,78 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meineBuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweiterteSuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle" >
<p class="p2">
<span id="titlebraun"><strong> Kontakt </strong></span>
<br><br>
Kundenservice: +49XXXXXXXXX <br>
Telefax: 069 54 732122 <br>
E-Mail: 2211780@stud.hs-mannheim.de <br>
</p>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

79
kontakt.php 100644
View File

@ -0,0 +1,79 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="buch_details.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Details</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p2">
<span id="titlebraun"><strong> Kontakt </strong></span>
<br><br>
Kundenservice: +49XXXXXXXXX <br>
Telefax: 069 54 732122 <br>
E-Mail: 2211780@stud.hs-mannheim.de <br>
</p>
</div>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,169 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Löschen Erfolgreich Meine Bücher</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
$BookID = $_GET['buchID'];
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
$sqlDelete = $connection->prepare("
DELETE FROM `ausgeliehenes_buch` WHERE `ausgeliehenes_buch`.`AusleihID` = ?;");
$sqlDelete->bind_param("i", $ID);
$ID = $_GET['ausleihID'];
// SQL-Befehl ausführen
$sqlDelete->execute();
$sqlGetQuantity = $connection->prepare(
"SELECT Anzahl, MaxAnzahl FROM `buch` WHERE BuchID = ?;");
$sqlGetQuantity->bind_param("i", $BookID);
$sqlGetQuantity->execute();
// Ergebnis speichern
$resultGetQuantity = $sqlGetQuantity->get_result();
if (mysqli_num_rows($resultGetQuantity) > 0) {
while($rowGetQuantity = mysqli_fetch_assoc($resultGetQuantity)) {
$bookQuantity = $rowGetQuantity['Anzahl'];
$bookMaxQuantity = $rowGetQuantity['MaxAnzahl'];
$bookTempQuantity = $bookQuantity + 1;
$bookTempQuantityNew = $bookMaxQuantity - $bookTempQuantity;
$sqlGetBorrowedQuantity = $connection->prepare(
"SELECT COUNT(*) AS Ausgeliehen
FROM `ausgeliehenes_buch` WHERE BuchID = ?;"
);
$sqlGetBorrowedQuantity->bind_param("i", $BookID);
$sqlGetBorrowedQuantity->execute();
// Ergebnis speichern
$resultGetBorrowedQuantity = $sqlGetBorrowedQuantity->get_result();
if (mysqli_num_rows($resultGetBorrowedQuantity) > 0) {
while($rowGetBorrowedQuantity = mysqli_fetch_assoc($resultGetBorrowedQuantity)) {
$bookBorrowedQuantity = $rowGetBorrowedQuantity['Ausgeliehen'];
if ($bookBorrowedQuantity == $bookTempQuantityNew) {
$sqlUpdateBook = $connection->prepare(
"UPDATE buch SET Anzahl = Anzahl+1
WHERE buch.BuchID = ? ;"
);
$sqlUpdateBook->bind_param("i", $BookID);
$sqlUpdateBook->execute();
}
else {
$sqlGetBorrowedID = $connection->prepare(
"SELECT AusleihID
FROM `ausgeliehenes_buch`
WHERE BuchID = ?
AND Reserviert=1
ORDER BY Enddatum
DESC LIMIT 1;"
);
$sqlGetBorrowedID->bind_param("i", $BookID);
$sqlGetBorrowedID->execute();
// Ergebnis speichern
$resultGetBorrowedID = $sqlGetBorrowedID->get_result();
if (mysqli_num_rows($resultGetBorrowedID) > 0) {
while($rowGetBorrowedID = mysqli_fetch_assoc($resultGetBorrowedID)) {
$bookBorrowedID = $rowGetBorrowedID['AusleihID'];
$sqlUpdateBookID = $connection->prepare(
"UPDATE `ausgeliehenes_buch`
SET `Verlängerbar` = '1',
`Reserviert` = '0'
WHERE `ausgeliehenes_buch`.`AusleihID` = ?;"
);
$sqlUpdateBookID->bind_param("i", $bookBorrowedID);
$sqlUpdateBookID->execute();
}
}
}
}
}
}
}
?>
<div class="hauptcontainer" id="verlängerung">
<h1 id="verlängerungH1">Buch erfolgreich entfernt</h1>
<div id="verlängerungContent">
<p id="möchten-sie">Die Reservierung wurde erfolgreich aufgehoben.</p>
<div id="verlängerungButtonContainer">
<a id = "verlängerungErfolgreichButton1" href="meinebuecher.php">Zurück zum Warennkorb</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,78 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Löschen Erfolgreich</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<div class="hauptcontainer" id="verlängerung">
<h1 id="verlängerungH1">Buch erfolgreich entfernt</h1>
<div id="verlängerungContent">
<p id="möchten-sie">Das Buch wurde aus Ihrem Warenkorb entfernt.</p>
<div id="verlängerungButtonContainer">
<a id = "verlängerungErfolgreichButton1" href="warenkorb.php">Zurück zum Warennkorb</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,220 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Löschen Meine Bücher</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<div class="hauptcontainer">
<h1 id="searchResult_heading">Reservierung stornieren</h1>
<div id="searchResult_container">
<?php
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
/* SQL-Befehl vorbereiten */
$sql = $connection->prepare("SELECT ab.AusleihID, ab.BuchID, b.Titel, b.Bild, ab.Verlängerbar, DATE_FORMAT(ab.Anfangsdatum, '%d.%m.%Y') as Anfangsdatum, DATE_FORMAT(ab.Enddatum, '%d.%m.%Y') as Enddatum,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) = Curdate(), 'Sofort Abholbereit',
(
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) > Curdate(),
CONCAT(
'Abholbereit am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Anfangsdatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
)
, CONCAT(
'Rückgabe am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Enddatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
))
)
)
AS 'Verfügbarkeit'
FROM ausgeliehenes_buch AS ab
INNER JOIN buch as b
ON ab.BuchID = b.BuchID
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
WHERE ab.AusleihID=?
GROUP BY ab.AusleihID;;");
// Parameter binden
$sql->bind_param("i", $ID);
// Übergebene ID des angeklickten Container speichern
$containerID = $_GET['ausleihID'];
// Buch ID abtrennen
$ID = str_replace('placeholder_container', '', $containerID);
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$ausleihID = $row['AusleihID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookAuthor = $row['Autor'];
$bookAvailability = $row['Verfügbarkeit'];
$bookExtendable = $row['Verlängerbar'];
$bookStartdate = $row['Anfangsdatum'];
$bookEnddate = $row['Enddatum'];
$bookStartdatePlusSeven = $bookStartdate +7;
/* TODO: OnClick auslagern. */
echo "<div id='book_container$bookID+$ausleihID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover' src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>von $bookAuthor</p>
</div>
<div class='available_container'>
<p id='available_$ausleihID' class='available'>
$bookAvailability</p>
</div>
<div>
<p id='bestellungsInfo$ausleihID'></p>
</div>
</div>
<div class='placeholder_container' id='placeholder_container$ausleihID'>
<div class='placeholder' id='placeholder$ausleihID'></div>
</div>
<script type='text/javascript'
language='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$ausleihID');
var parentDiv = currentElement.parentElement;
// Sofort Abholbereit
if (currentElement.innerHTML.trim() === 'Sofort Abholbereit') {
parentDiv.style.backgroundColor
= '#70AD47';
document.getElementById('bestellungsInfo$ausleihID').innerHTML = 'Diese Reservierung verfällt, wenn das Buch nicht bis zum $bookStartdatePlusSeven abgeholt wurde.';
}
else
// Noch nicht Ausgeliehen
{
parentDiv.style.backgroundColor
= '#F34343';
document.getElementById('bestellungsInfo$ausleihID').innerHTML = 'Dieses Buch ist für sie Reserviert.';
document.getElementById('placeholder$ausleihID').classList.add('bin');
}
})();
</script>
</div>";
}
} else {
echo "Keine Infos vorhanden.";
echo $_POST['ausleihID'];
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
echo "
<div id='verlängerungButtonContainer'>
<a id = 'verlängerungButton1' href='loeschen_erfolgreich_meine_buecher.php?ausleihID=$ID&buchID=$bookID'>Bestätigen</a>
<a id = 'verlängerungButton2' href='meinebuecher.php'>Abbrechen</a>
</div>";
mysqli_close($connection);
?>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,88 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Löschen Warenkorb</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<div class="hauptcontainer" id="verlängerung">
<h1 id="verlängerungH1">Buch entfernen</h1>
<div id="verlängerungContent">
<p id="möchten-sie">Möchten Sie das folgende Buch wirklich aus Ihrem Warenkorb entfernen?</p>
<div class="item" id="verlängerungItem">
<img src="pictures/the_hundred_and_one_dalmatians.jpg" alt="The Hundred and One Dalmatians" height="200">
<div class="beschreibung">
<h2>The Hundred and One Dalmatians</h2>
<h3>von Dodie Smith</h3>
<div class="b2 red">Verfügbar ab: 03.05.2023</div>
</div>
</div>
<div id="verlängerungButtonContainer">
<a id = "verlängerungButton1" href="loeschenErfolgreich_warenkorb.html">Bestätigen</a>
<a id = "verlängerungButton2" href="warenkorb.php">Abbrechen</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,89 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="warenkorb.js" async></script>
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="containerofmeinebuecher">
<p id="meinebüchertitel">Meine Bücher</p>
<!--first item-->
<!-- <div class="items" >
<img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/>
<h3 class="headerinItem">
Percy Jackson: Diebe im Olymp
</h3>
<p class="discinItem">von Rick Riordan <br>
</p>
<a class="greenbutton" href="">Sofort Abholbereit</a>
<a class="binPicture" href=""><img src="pictures/bin.png" width="25" height="25"></a>
<p id="message">Diese Reservierung verfällt, wenn das Buch nicht bis zum 24.04.2023 abgeholt wurde.</p>
<hr style="width: 92%;">
</div>
-->
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<!--Burger-->
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

260
meinebuecher.php 100644
View File

@ -0,0 +1,260 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Meine Bücher</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
$db_link = mysqli_connect('localhost', 'web_b-3', 'een7Ao6s', 'bibliothek_candle', '3306');
echo '
<div class="hauptcontainer">
<h1 id="searchResult_heading">Meine Bücher</h1>
<div id="searchResult_container">';
$sql = $db_link->prepare(
"SELECT ab.AusleihID, ab.BuchID, b.Titel, b.Bild, ab.Verlängerbar, DATE_FORMAT(ab.Anfangsdatum, '%d.%m.%Y') as Anfangsdatum, DATE_FORMAT(ab.Enddatum, '%d.%m.%Y') as Enddatum,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) = Curdate(), 'Sofort Abholbereit',
(
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) > Curdate(),
CONCAT(
'Abholbereit am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Anfangsdatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
)
, CONCAT(
'Rückgabe am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Enddatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
))
)
)
AS 'Verfügbarkeit'
FROM ausgeliehenes_buch AS ab
INNER JOIN buch as b
ON ab.BuchID = b.BuchID
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
WHERE ab.BenutzerID=?
GROUP BY ab.AusleihID;");
$sql->bind_param("i", $BenutzerID);
$BenutzerID = $_SESSION['userID'];
$sql->execute();
$result = $sql->get_result();
$connection = $db_link;
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
$counter = 0;
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$ausleihID = $row['AusleihID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookAuthor = $row['Autor'];
$bookAvailability = $row['Verfügbarkeit'];
$bookExtendable = $row['Verlängerbar'];
$bookStartdate = $row['Anfangsdatum'];
$bookEnddate = $row['Enddatum'];
$bookStartdatePlusSeven = $bookStartdate +7;
if ($counter != 0) {
echo "<div class='divider'></div>";
}
// TODO: OnClick auslagern.
echo "<div id='book_container$bookID+$ausleihID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover' src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>von $bookAuthor</p>
</div>
<div class='available_container'>
<p id='available_$ausleihID' class='available'>
$bookAvailability</p>
</div>
<div>
<p id='bestellungsInfo$ausleihID'></p>
</div>
</div>
<div class='placeholder_container' id='placeholder_container$ausleihID'>
<div class='placeholder' id='placeholder$ausleihID'></div>
</div>
<script type='text/javascript'
language='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$ausleihID');
var parentDiv = currentElement.parentElement;
// Sofort Abholbereit
if (currentElement.innerHTML.trim() === 'Sofort Abholbereit') {
parentDiv.style.backgroundColor
= '#70AD47';
document.getElementById('bestellungsInfo$ausleihID').innerHTML = 'Diese Reservierung verfällt, wenn das Buch nicht bis zum $bookStartdatePlusSeven abgeholt wurde.';
document.getElementById('placeholder$ausleihID').classList.add('bin');
document.getElementById('placeholder_container$ausleihID').addEventListener('click', function(){
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
ID = this.id;
var data = new URLSearchParams();
data.append('ausleihID', ID);
var url = 'http://141.19.142.11/loeschen_meine_buecher.php?' + data.toString();
location.href = url;
});
}
// Ausgeliehen und Verlängerbar
else if (currentElement.innerHTML.trim().includes('Rückgabe') && $bookExtendable === 1){
parentDiv.style.backgroundColor
= '#70AD47';
document.getElementById('placeholder$ausleihID').classList.add('extend');
document.getElementById('placeholder_container$ausleihID').addEventListener('click', function(){
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
ID = this.id;
var data = new URLSearchParams();
data.append('ausleihID', ID);
var url = 'http://141.19.142.11/verlaengerung.php?' + data.toString();
location.href = url;
});
}
// Ausgeliehen und nicht Verlängerbar
else if (currentElement.innerHTML.trim().includes('Rückgabe') && $bookExtendable === 0){
parentDiv.style.backgroundColor
= '#F34343';
} else
// Noch nicht Ausgeliehen
{
parentDiv.style.backgroundColor
= '#F34343';
document.getElementById('bestellungsInfo$ausleihID').innerHTML = 'Dieses Buch ist für sie Reserviert.';
document.getElementById('placeholder$ausleihID').classList.add('bin');
document.getElementById('placeholder_container$ausleihID').addEventListener('click', function(){
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
ID = this.id;
var data = new URLSearchParams();
data.append('ausleihID', ID);
var url = 'http://141.19.142.11/loeschen_meine_buecher.php?' + data.toString();
location.href = url;
});
}
})();
</script>
</div>";
$counter++;
}
} else {
echo "Keine Ergebnisse.";
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
mysqli_close($connection);
?>
</div>
</div>
<script>
function open_bookDetails(ID) {
var data = new URLSearchParams();
ID = ID.substr(0, ID.lastIndexOf('+'));
data.append("bookID", ID);
var url = "http://141.19.142.11/buch_details.php?" +
data.toString();
location.href = url;
}
function bin (ID){
// OnClick Event für open_bookDetails stoppen
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
alert(ID)
}
</script>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<!--Burger-->
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,50 @@
// document.getElementById("header").innerHTML = `
// <h1 class='kopf' >
// <br><br>
// Bibliothek
// <a href='index.php' id='bildID'>
// <img id='CandleID' src='pictures/candle.png'
// alt='Bild von einer Kerze' width='200' height='192'/></a>
// <br><br>
// Candle
// </h1>
// <div>
// <a id='uberuns' href='uberuns.php'>Über Uns</a>
// <a id='buecher' href='buecher.php'>Bücher</a>
// <a id='meinebuecher' href='anmelden_meinebuecher.php'>
// Meine Bücher</a>
// <a id='abmelden' href='abmelden.php'>Abmelden</a>
// <form action='suchergebnisse.php'>
// <input type="hidden" name="searchType" value="simple">
// <input name="searchFor" class='suchleiste' type='search'
// placeholder='Suche...'>
// <button type='submit' id='buttonID' class='searchButton'>
// <i class='fa fa-search'></i>
// </button>
// </form>
// <a id='erweitertesuche' href='erweitertesuche.php'>
// Erweiterte Suche</a>
// <a href='anmelden.php' id='warenKorbID'>
// <img id='shoppingCard' src='pictures/einkaufswagen.png'
// alt='Bild von einem Wagen' width='50' height='50'/>
// </a>
// </div>`;
document.getElementById("footer").innerHTML = `
<div>
<a id="impressum" href="impressum.php">Impressum</a>
<a id="kontakt" href="kontakt.php">Kontakt</a>
<a id="datenschutz" href="datenschutz.php">Datenschutz</a>
</div>`;
document.getElementById("activeid").innerHTML = `
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle"
type="checkbox" onclick="openNav()">
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</div>`;

View File

@ -0,0 +1,81 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Erfolgreich Registriert</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="registeredTitle">Fehler</h1>
</div>
<div class="mainContent">
<p id="textFirstHalf">
Das Passwort ist falsch!
</p>
<a type="button" id="loginNowButton" href="anmelden.php"> Erneut Versuchen </a>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,96 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="haupt">
<!--Third Item-->
<div id="firstItem" class="items" >
<img src="pictures/penguin_highway.jpg" width="125" height="200"/>
<h3 class="headerinItem">
Penguin Highway
</h3>
<p class="discinItem">Verfasser: Tomihiko Morimi <br>
Erscheinungsjahr: 2019 <br>
Verlag: Yen On <br>
Kategorie: Fantasy
</p>
<a class="greenbutton" href="">Verfügbar</a>
<img id="shoppingwagen" src="pictures/shopping_cart.png" alt="shoppingwagen" href=""></a>
<p class="percypar">
<strong style="font-size: 25px;">Inhalt</strong> <br>
I may only be in fourth grade, but I know more than most adults. I take notes every day and read all kinds of books, so I have a solid grasp on the world
around me. But suddenly, there are penguins in my town! I know it has something to do with the lady at the dentist and her weird powers, and I'm going to get to the bottom of it...
<br><br>
<strong style="font-size: 25px;">Details</strong> <br>
ISBN: 978-1-9753-8260-5 <br>
Sprache: Englisch <br>
Stichwörter: Penguine, Freundschaft, Meer, Küste
</p>
</div>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

View File

@ -1,99 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="haupt">
<!--First Item-->
<div id="firstItem" class="items" >
<img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/>
<h3 class="headerinItem">
Percy Jackson: Diebe im Olymp
</h3>
<p class="discinItem">Verfasser: Rick Riordan <br>
Erscheinungsjahr: 2010 <br>
Verlag: Carlsen <br>
Kategorie: Fantasy
</p>
<a class="greenbutton" href="">Verfügbar</a>
<img id="shoppingwagen" src="pictures/shopping_cart.png" alt="shoppingwagen" href=""></a>
<p class="percypar">
<strong style="font-size: 25px;">Inhalt</strong> <br>
Percy versteht die Welt nicht mehr. Jedes Jahr fliegt er von einer anderen Schule. Ständig passieren ihm seltsame Unfälle. Und jetzt soll er
auch noch an dem Tornado schuld sein! Langsam wird ihm klar: irgendjemand hat es auf ihn abgesehen. Als Percy sich mit Hilfe seines Freundes Grover vor
einem Minotaurus ins Camp Half-Blood rettet, erfährt er die Wahrheit: Sein Vater ist der Meeresgott Poseidon, Percy also ein Halbgott. Und er hat einen mächtigen
Feind: Kronos, den Titanen. Die Gotter stehen Kopf- und Percy und seine Freunde vor einem unglaublichen Abenteuer...
<br><br>
<strong style="font-size: 25px;">Details</strong> <br>
ISBN: 978-3-551-55661-5 <br>
Sprache: Deutsch <br>
Stichwörter: Griechenland, Griechische Sagen, Griechische Götter, Zeus, Demeter, Persephone, Hera, Hades, Poseidon, Athene, Aphrodite, Ares, Hephaistos,
Apollo, Artemis, Hermes, Dionysos, Sage, Sagen
</p>
</div>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

BIN
pictures/add.png 100644

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

View File

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

BIN
pictures/extend.png 100644

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

BIN
pictures/remove.png 100644

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

View File

@ -3,43 +3,43 @@ var inputNumber = document.getElementsByClassName('input-group-field');
if (window.location.pathname.includes("/warenkorb.html")) {
document.addEventListener("DOMContentLoaded", function () {
$(window).on('load',function() {
for(var y = 0;y<inputNumber.length;y++)
{
showValue(inputNumber[y]);
}
var minusButton = document.getElementsByClassName("fa fa-minus");
for(var y = 0;y<inputNumber.length;y++)
{
showValue(inputNumber[y]);
}
var plusButton = document.getElementsByClassName("fa fa-plus");
var minusButton = document.getElementsByClassName("fa fa-minus");
var plusButton = document.getElementsByClassName("fa fa-plus");
//Dieser Code Block gehört zur Warenkorb Datei
for(var i = 0;i<plusButton.length;i++)
{
var button = plusButton[i]
button.addEventListener('click', incrmenetValue)
}
for(var i = 0;i<plusButton.length;i++)
{
for(var j = 0;j<minusButton.length;j++)
{
var button1 = minusButton[j]
button1.addEventListener('click', decrmenetValue)
var button = plusButton[i]
}
}
);
});
button.addEventListener('click', incrmenetValue)
}
for(var j = 0;j<minusButton.length;j++)
{
var button1 = minusButton[j]
button1.addEventListener('click', decrmenetValue)
}
}
);
});
}
//<input class="input-group-field" type="number" name="quantity" value="1">
@ -47,41 +47,41 @@ for(var j = 0;j<minusButton.length;j++)
function showValue(event)
{
var shopItem = event.parentElement.parentElement.parentElement
var title = shopItem.getElementsByTagName('h3')[0].innerHTML
var getValue = localStorage.getItem(title) || 0;
shopItem.getElementsByClassName('input-group-field')[0].value = getValue;
}
function incrmenetValue(event)
{
var buttony = event.target
var shopItem = buttony.parentElement.parentElement.parentElement.parentElement.parentElement
var title = shopItem.getElementsByTagName('h3')[0].innerHTML
var getValue= localStorage.getItem(title) || 0;
// var getValue = shopItem.getElementsByClassName('input-group-field')[0].value;
// var getValue = shopItem.getElementsByClassName('input-group-field')[0].value;
if(getValue < 10){
getValue++;
}
getValue++;
}
shopItem.getElementsByClassName('input-group-field')[0].value = getValue;
localStorage.setItem(title, getValue)
}
function decrmenetValue(event)
{
{
var buttony = event.target
var shopItem = buttony.parentElement.parentElement.parentElement.parentElement.parentElement
var title = shopItem.getElementsByTagName('h3')[0].innerHTML
var getValue= localStorage.getItem(title) || 0;
if(getValue > 0){
getValue--;
}
if(getValue > 0){
getValue--;
}
shopItem.getElementsByClassName('input-group-field')[0].value = getValue;
localStorage.setItem(title, getValue)

View File

@ -1,92 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="200"/>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberUns.html">Über Uns</a>
<a id="buecher" href="bücher.html">Bücher</a>
<a id="meinebuecher" href="meineBücher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweiterteSuche.html">Erweiterte Suche</a>
</div>
</header>
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p1">
<span id="titleschwarz">HERZLICH WILLKOMMEN!</span>
<br><br>
Die Bibliothek CANDLE begrüßt Sie ganz herzlich auf ihren Internetseiten. <br> <br>
Nutzen Sie unser umfangreiches Angebot aus den beliebtesten Büchern. <br> <br>
Wir freuen uns auf Ihren Besuch!
<br><br>
<span id="titleschwarz">VERANSTALTUNGEN!</span>
<br><br>
Leserunde | jeden Mittwoch | 17:30 Uhr
<br><br>
<span style="color: #000;" >HARRY POTTER-REIHE (aktuell) </span>
<br><br>
<span style="color: #000;">
Die erfolgreiche Buchreihe um den Zauberlehrling Harry James Potter umfasst insgesamt sieben Bände.
In jedem wird ein Schul- und Lehrjahr von Harry und seinen Freunden auf dem Zauberinternat Hogwarts erzählt.
Neben alltäglichen Problemen eines Jugendlichen, wird Harry immer wieder mit dem bösen Magier Lord Voldemort und seinen Gefolgsleuten,
den sogenannten Todessern, konfrontiert.
</span>
<br>
<a href="" style="font-style: italic; text-decoration: none; color: #000;" >mehr dazu...</a>
</p>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

View File

@ -0,0 +1,180 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Erfolgreich Registriert</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
$db_link = mysqli_connect('localhost', 'web_b-3', 'een7Ao6s', 'bibliothek_candle', '3306');
function runSQL($sql){
global $db_link;
$db_res = mysqli_query($db_link, $sql);
if(!$db_res){
header("Location: 404.html");
exit;
}
return $db_res;
}
function register($vorname,
$nachname ,
$email,
$passwort, $strasse, $hausnummer, $ort, $plz){
global $db_link;
$vorname = mysqli_real_escape_string($db_link, $vorname);
$nachname = mysqli_real_escape_string($db_link, $nachname);
$email = mysqli_real_escape_string($db_link, $email);
$passwort = mysqli_real_escape_string($db_link, $passwort);
$ort = mysqli_real_escape_string($db_link, $ort);
$plz = mysqli_real_escape_string($db_link, $plz);
$strasse = mysqli_real_escape_string($db_link, $strasse);
$hausnummer = mysqli_real_escape_string($db_link, $hausnummer);
//Benutzer schon vorhanden?
$db_res = runSQL("SELECT COUNT(*) FROM `benutzer` WHERE `E-MailAdresse`='$email'");
$row = mysqli_fetch_array($db_res);
if($row['COUNT(*)'] > 0)
{
header("Location: benutzer_schon_existiert.php");
return 'Es gibt schon einen Benutzer mit der angegebenen E-Mail Adresse';
}else{
$zweiterbefehl = runSQL("INSERT INTO `benutzer` (`VorName`, `NachName`, `KartenID`, `E-MailAdresse`, `AdressenID`, `Passwort`)
VALUES ('$vorname', '$nachname', '100', '$email', '1', '$passwort')");
$dritterbefehl = runSQL("UPDATE `benutzer`
SET `KartenID` = 1000000000 + (SELECT `BenutzerID` FROM `benutzer` WHERE `E-MailAdresse` = '$email')
WHERE `E-MailAdresse` = '$email'");
$adr = runSQL("SELECT COUNT(*) FROM `adresse` WHERE `Stadt` = '$ort' and `Postleitzahl` = '$plz' and `Straße`='$strasse' and `Hausnummer` ='$hausnummer'");
$zeile = mysqli_fetch_array($adr);
if($zeile['COUNT(*)'] > 0){
$vierterbefehl = runSQL("UPDATE `benutzer` b
INNER JOIN `adresse` a ON a.`Stadt` = '$ort' AND a.`Postleitzahl` = '$plz'
AND a.`Straße` = '$strasse' AND a.`Hausnummer` = '$hausnummer'
SET b.`AdressenID` = a.`AdressenID`
WHERE b.`E-MailAdresse` = '$email'");
}else{
$ersterbefehl = runSQL("INSERT INTO `adresse` (`Stadt`, `Postleitzahl`, `Straße`, `Hausnummer`)
VALUES ('$ort', '$plz', '$strasse', '$hausnummer')");
$vierterbefehl = runSQL("UPDATE `benutzer` b
INNER JOIN `adresse` a ON a.`Stadt` = '$ort' AND a.`Postleitzahl` = '$plz'
AND a.`Straße` = '$strasse' AND a.`Hausnummer` = '$hausnummer'
SET b.`AdressenID` = a.`AdressenID`
WHERE b.`E-MailAdresse` = '$email'");
}
// SQL-Abfrage ausführen
$sql = "SELECT `KartenID` FROM `benutzer` WHERE `E-MailAdresse` = '$email'";
$result = runSQL($sql);
// Überprüfen, ob die Abfrage erfolgreich war
if ($result->num_rows > 0) {
// Den Wert aus dem Ergebnis abrufen
$row = $result->fetch_assoc();
$kartenid = $row["KartenID"];
}
echo '
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="registeredTitle">Erfolgreich registriert</h1>
</div>
<div class="mainContent">
<p id="textFirstHalf">
Sie wurden erfolgreich registriert.
<br><br>Ihre Karten-ID ist</p>
<!--TODO: Placeholder entfernen
und durch ID aus Datenbank ersetzen-->
<p id="cardID">' . htmlspecialchars($kartenid) .'</p>
<br><br>
<p id="textLastHalf">
Mit dieser ID und Ihrem Passwort
können Sie sich direkt auf unserer Website anmelden und,
bei Bedarf, bereits Bücher für eine Ausleihe reservieren.
<br><br>Die Karten-ID findet sich auf Ihrem
Bibliotheksausweis wieder, welchen Sie bei Ihrem ersten
Besuch in unserer Bibliothek erhalten.
<br>Der Bibliotheksausweis kostet 10 Euro und muss jedes Jahr
vor Ort für den gleichen Preis verlängert werden.
<br>Bitte beachten Sie, dass ohne Vorlage eines
gültigen Ausweises, keine Bücher abgeholt werden können.
</p>
<br>
<a type="button" id="loginNowButton" href="anmelden_meinebuecher.php"> Jetzt anmelden </a>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>';
}
}
?>

View File

@ -1,129 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberUns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweiterteSuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="hauptcontainer">
<form action="">
<div class="container">
<span id="registrierungTitel" > Regestrierung </span>
<br>
<p id="datenSchutzHinweisRegistrierung" > Über diese Webseite werden personenbezogene Daten erhoben und genutzt. Für Details, beziehen Sie sich bite auf die Seite Datenschutz.</p>
<h4 id="registrierungAngabenZurRegistrierung">Angaben zur Regestrierung<hr id="registrierungHr"></h4>
<br>
<span id="registrierungInputSpan" >
<label for="vorName"><b>Vorname</b></label>
<br>
<input type="text" name="vorName" id="vorName" class="registrierenNormalesTextfeld" required>
<br>
<label for="nachName"><b>Nachname</b></label>
<br>
<input type="text" name="nachName" id="nachName" class="registrierenNormalesTextfeld" required>
<br>
<label for="strasse"><b>Straße und Hausnummer</b></label>
<br>
<input type="text" name="strasse" id="strasse" required>
<input type="number" name="hausnummer" id="hausNummer" required>
<br>
<label for="postleitzahl"><b>Postleitzahl und Ort</b></label>
<br>
<input type="number" name="postleitzahl" id="postleitzahl" required>
<input type="text" name="ort" id="ort" required>
<br>
<label for="email"><b>E-Mail-Adresse</b></label>
<br>
<input type="email" name="email" id="email" class="registrierenNormalesTextfeld" required>
<br>
<label for="emailRep"><b>E-Mail-Adresse bestätigen</b></label>
<br>
<input type="email" name="emailRep" id="emailRep" class="registrierenNormalesTextfeld" required>
<br>
<label for="passwort"><b>Passwort</b></label>
<br>
<input type="password" name="passwort" id="passwort" class="registrierenNormalesTextfeld" required>
<br>
<label for="passwortRep"><b>Passwort bestätigen</b></label>
<br>
<input type="password" name="passwortRep" id="passwortRep" class="registrierenNormalesTextfeld" required>
<br>
<button type="submit" class="registrierenKnopf">Registrieren</button>
<br><br>
<details>
<summary>Sie habe bereits ein Konto?</summary>
<p id="registrierenAusklappe"> <a href="anmelden.html"> Jetzt anmelden</a></p>
</details>
</span>
</div>
</form>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</div>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

168
registrierung.php 100644
View File

@ -0,0 +1,168 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Registrierung</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
echo '
<div class="hauptcontainer">
<!--Bei action wird später eine php-Datei eingefügt,
welche sich um die Verarbeitung der Daten kümmert.-->
<form id="registrierungForm" action="registrierung_erfolgreich.php" method="Post">
<div class="container">
<span id="registrierungTitel" > Registrierung </span>
<br>
<p id="datenSchutzHinweisRegistrierung" > Über diese Webseite werden personenbezogene Daten erhoben und genutzt. Für Details, beziehen Sie sich bite auf die Seite Datenschutz.</p>
<h4 id="registrierungAngabenZurRegistrierung">Angaben zur Registrierung<hr id="registrierungHr"></h4>
<br>
<div id="registrierungInputDiv" >
<div class="field">
<label for="vorName"><b>Vorname</b></label>
<br>
<input type="text" name="vorName" id="vorName" class="registrierenNormalesTextfeld"><br>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<label for="nachName"><b>Nachname</b></label>
<br>
<input type="text" name="nachName" id="nachName" class="registrierenNormalesTextfeld"><br>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<label for="strasse"><b>Straße und Hausnummer</b></label>
<br>
<input type="text" name="strasse" id="strasse">
<input type="text" name="hausnummer" id="hausNummer"><br>
<p class="errorMessage"></p>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<label for="postleitzahl"><b>Postleitzahl und Ort</b></label>
<br>
<input type="text" name="postleitzahl" id="postleitzahl">
<input type="text" name="ort" id="ort"><br>
<p class="errorMessage"></p>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<label for="email"><b>E-Mail-Adresse</b></label>
<br>
<input type="email" name="email" id="email" class="registrierenNormalesTextfeld"><br>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<label for="emailRep"><b>E-Mail-Adresse bestätigen</b></label>
<br>
<input type="email" name="emailRep" id="emailRep" class="registrierenNormalesTextfeld"><br>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<label for="passwort"><b>Passwort</b></label>
<br>
<input type="password" name="passwort" id="passwort" class="registrierenNormalesTextfeld"><br>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<label for="passwortRep"><b>Passwort bestätigen</b></label>
<br>
<input type="password" name="passwortRep" id="passwortRep" class="registrierenNormalesTextfeld"><br>
<p class="errorMessage"></p>
<br>
</div>
<div class="field">
<input type="submit" value="Registrieren" name="Registrieren" id="registrierenKnopf" class="registrierenKnopf">
</div>
<br><br>
<details>
<summary>Sie habe bereits ein Konto?</summary>
<p id="registrierenAusklappe"> <a href="anmelden.php"> Jetzt anmelden</a></p>
</details>
</div>
</div>
</form>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<<footer id="footer" class="fuss" ></footer>
<script src="registrierung_verhalten.js"></script>
</body>
</html>';
?>

View File

@ -0,0 +1,94 @@
<?php
session_start();
header('Content-Type: text/html; charset=UTF-8');
require('registriersystem.php');
if(isset($_POST['Registrieren'])){
$vorname = $_POST["vorName"];
$nachname = $_POST['nachName'];
$strasse = $_POST['strasse'];
$hausnummer = $_POST['hausnummer'];
$plz = $_POST['postleitzahl'];
$ort = $_POST['ort'];
$emailrep = $_POST['emailRep'];
$email = $_POST['email'];
$passwort = $_POST['passwort'];
$passwortrep = $_POST['passwortRep'];
if(empty($vorname) || empty($nachname) || empty($strasse) ||
empty($hausnummer) || empty($plz) || empty($ort) ||
empty($emailrep) || empty($email) || empty($passwort) || empty($passwortrep))
{
header("Location: registrierung_wiederholen.php");
}elseif (!preg_match("/^[A-Za-zÄÖÜäöüß -]*$/", $vorname)
|| !preg_match("/.{2,}/", $vorname)
|| preg_match("/(?:([- ])\1{1,}|( -)|(- ))/", $vorname)
|| !preg_match("/^([A-ZÄÖÜa-zäöüß]{2,}[ -]?)+$/", $vorname)
|| !preg_match("/[a-zäöüß]$/", $vorname)
|| !preg_match("/^[A-ZÄÖÜ][a-zäöüß]+([- ][A-ZÄÖÜ][a-zäöüß]+)*$/", $vorname)
|| preg_match("/(\w)\1{2,}/", $vorname)) {
header("Location: registrierung_wiederholen.php");
}elseif (!preg_match("/^[A-Za-zÄÖÜäöüß -]*$/", $nachname)
|| !preg_match("/.{2,}/", $nachname)
|| preg_match("/([-])\1{1,}/", $nachname)
|| !preg_match("/^([A-ZÄÖÜa-zäöüß]{2,}[ -]?)+$/", $nachname)
|| !preg_match("/[a-zäöüß]$/", $nachname)
|| preg_match("/[A-ZÄÖÜ][a-zäöüß]+[ ]+[A-ZÄÖÜ][a-zäöüß]+/", $nachname)
|| !preg_match("/^(von( der)?|zu|van)[ ][A-ZÄÖÜ]|^[A-ZÄÖÜ]/", $nachname)
|| !preg_match("/(^(von( der)?|zu|van)[ ][A-ZÄÖÜ][a-zäöüß]+|^[A-ZÄÖÜ][a-zäöüß]+)([-][A-ZÄÖÜ][a-zäöüß]+)?$/", $nachname)
|| preg_match("/(\w)\1{2,}/", $nachname)) {
header("Location: registrierung_wiederholen.php");
}elseif ( !preg_match("/.{2,}/", $strasse)
|| !preg_match("/^[^0-9]*$|[0-9]$/", $strasse)
|| !preg_match("/^[A-Za-z0-9ÄÖÜäöüß' -]+$/", $strasse)
|| !preg_match("/^[A-ZÄÖÜ][ -]?[a-zäöü0-9ß']+([ -]?[A-ZÄÖÜ0-9][A-Za-z0-9ÄÖÜäöüß']+)*$/", $strasse)
|| !preg_match("/[0-9]$|[a-zäöüß]$/", $strasse)) {
header("Location: registrierung_wiederholen.php");
}elseif ( !preg_match("/^[0-9]/", $hausnummer)
|| preg_match("/^0/", $hausnummer)
|| !preg_match("/^[1-9][0-9]{0,3}[a-z]?$/", $hausnummer)){
header("Location: registrierung_wiederholen.php");
}elseif ( !preg_match("/^(0100[1-9]|010[1-9][0-9]|01[1-9][0-9]{2}|0[2-9][0-9]{3}|[1-9][0-9]{4})$/", $plz)){
header("Location: registrierung_wiederholen.php");
}elseif ( !preg_match("/.{2,}/", $ort)
|| preg_match("/[ \/-][ \/-]/", $ort)
|| !preg_match("/^[A-ZÄÖÜa-zäöüß \/-]+$/", $ort)
|| preg_match("/(\w)\1{2,}/", $ort)
|| !preg_match("/^[A-ZÄÖÜ]/", $ort)
|| !preg_match("/[a-zäöüß]$/", $ort)
|| !preg_match("/^[A-ZÄÖÜ][a-zäöüß]+([ -\/][A-ZÄÖÜa-zäöü][a-zäöüß]+)*$/", $ort)){
header("Location: registrierung_wiederholen.php");
}elseif ( !preg_match("/[A-Za-z0-9_!#$%&'*+-\/=?^_`.{|}~]+[@][A-Za-z0-9-]+[.][A-Za-z]{2,}/", $email)){
header("Location: registrierung_wiederholen.php");
}elseif($email != $emailrep){
header("Location: registrierung_wiederholen.php");
}elseif (!preg_match("/^(?=.*[A-ZÄÖÜ])(?=.*[a-zäöüß])(?=.*[0-9])(?=.*[!°`´@#$%^&*()_+\-=\[\]{};':\"\\|,.<>\/?]).{6,}$/", $passwort)
|| !preg_match("/.{6,}/", $passwort)){
header("Location: registrierung_wiederholen.php");
}elseif($passwort != $passwortrep){
header("Location: registrierung_wiederholen.php");
}else{
register($vorname,
$nachname ,
$email,
$passwort, $strasse, $hausnummer, $ort, $plz);
}
}
?>

View File

@ -0,0 +1,657 @@
// TODO: Aufräumen
// Großbuchstaben -> [A-Z]
// Kleinbuchstaben -> [a-z]
// Bindestrich -> [-]
// Unterstrich -> [_]
// Leerzeichen -> [ ]
// Großbuchstaben (Umlaute) -> [ÄÖÜ]
// Kleinbuchstaben (Umlaute) -> [äöü]
// Sonderzeichen -> [°^!"§$%&/{}()[]=?\´`@€+*~#'<>|,;.:-_]
//------------------------------------------------------------------------------
// EventListener für die Eingabefelder hinzufügen.
document.getElementById("vorName").addEventListener("blur", checkFirstName);
document.getElementById("nachName").addEventListener("blur", checkLastName);
document.getElementById("strasse").addEventListener("blur", checkStreetName);
document.getElementById("hausNummer")
.addEventListener("blur", checkHouseNumber);
document.getElementById("postleitzahl").addEventListener("blur", checkPLZ);
document.getElementById("ort").addEventListener("blur", checkCity);
document.getElementById("email").addEventListener("blur", checkEmailAddress);
document.getElementById("emailRep")
.addEventListener("blur", checkRepeat_EmailAddress);
document.getElementById("passwort").addEventListener("blur", checkPassword);
document.getElementById("passwortRep")
.addEventListener("blur", checkRepeat_Password);
// EventListener für den Button "Registrieren" hinzufügen.
document.getElementById("registrierenKnopf")
.addEventListener("click", checkForPossibleSubmit);
/* // EventListener für das Formular hinzufügen.
document.getElementById("registrierungForm")
.addEventListener("submit", checkForPossibleSubmit); */
//------------------------------------------------------------------------------
/**
* Überprüft, ob ein Eingabefeld ausgefüllt wurde.
*
* @param element Eingabefeld, welches überprüft werden soll.
* @returns false -> Feld wurde nicht ausgefüllt; true -> Feld wurde ausgefüllt.
*/
function checkIfElementHasValue(element) {
regex_onlyWhitespaces = /^\s*$/;
if (element.value == "" || element.value == null
|| regex_onlyWhitespaces.test(element.value)) {
return false;
}
else {
return true;
}
}
/**
* Zeigt eine Fehlermeldung unter dem übergebenen Eingabefeld ein.
*
* @param inputField Eingabefeld, unter dem die Meldung erscheinen soll.
* @param pNumber Nummer des Paragraphen Elements, welches geändert werden soll.
* @param message Fehlermeldung, die angezeigt werden soll.
*/
function showErrorMessage(inputField, pNumber, message) {
inputField.style.border = "2px solid #F22C2C"
var classOfInputField = inputField.parentElement;
var errorMessage = classOfInputField.getElementsByTagName('p')[pNumber];
errorMessage.innerHTML = message;
errorMessage.style.display = "block";
}
/**
* Entfernt eine Fehlermeldung, falls vorhanden.
*
* @param inputField Eingabefeld, dessen Meldung entfernt werden soll.
* @param pNumber Nummer des Paragraphen Elements, welches geändert werden soll.
*/
function removeErrorMessage(inputField, pNumber) {
inputField.style.border = "2px solid #70AD47"
var classOfInputField = inputField.parentElement;
var errorMessage = classOfInputField.getElementsByTagName('p')[pNumber];
errorMessage.style.display = "none";
}
/**
* Jeder Vorname beginnt mit einem Großbuchstaben,
* gefolgt von mindestens einem Kleinbuchstaben.
* Mehrere Vornamen können mit einem Leerzeichen
* oder Bindestrich getrennt werden.
*/
// Beispiele zum Testen:
// Anna -> Keine Fehlermeldung
// Björn -> Keine Fehlermeldung
// Anna-Maria -> Keine Fehlermeldung
// Anna Maria -> Keine Fehlermeldung
// -> Fehlermeldung Leeres Feld
// -> Fehlermeldung Leeres Feld
// Sarah. -> Fehlermeldung Erlaubte Zeichen
// Karín -> Fehlermeldung Erlaubte Zeichen
// 1234 -> Fehlermeldung Erlaubte Zeichen
// L -> Fehlermeldung Anzahl Zeichen
// Anna maria -> Fehlermeldung Groß- und Kleinschreibung
// Anna MAria -> Fehlermeldung Groß- und Kleinschreibung
// Annnna -> Fehlermeldung Aufeinanderfolgende Gleiche Zeichen
// Anna--Maria -> Fehlermeldung Aufeinanderfolgende Sonderzeichen
// Anna Maria -> Fehlermeldung Aufeinanderfolgende Sonderzeichen
// Anna M -> Fehlermeldung Anzahl Zeichen pro Teil
// Anna- -> Fehlermeldung Letztes Zeichen
// Anna -> Fehlermeldung Letztes Zeichen
function checkFirstName() {
var firstName = document.getElementById("vorName");
// Fehlermeldung Leeres Feld
if (!(checkIfElementHasValue(firstName))) {
showErrorMessage(firstName, 0, "Bitte füllen Sie das Feld aus.")
return false;
}
// Fehlermeldung Erlaubte Zeichen
else if (!(/^[A-Za-zÄÖÜäöüß -]*$/.test(firstName.value))) {
showErrorMessage(firstName, 0,
"Ein Vorname darf nur Groß- und Kleinbuchstaben von A-Z, "
+ "sowie Umlaute, Eszett, Bindestriche und Leerzeichen enthalten.");
return false;
}
// Fehlermeldung Anzahl Zeichen
else if (!(/.{2,}/.test(firstName.value))) {
showErrorMessage(firstName, 0,
"Ein Vorname muss aus mindestens zwei Buchstaben bestehen.");
return false;
}
// Fehlermeldung Aufeinanderfolgende Sonderzeichen
else if (/(?:([- ])\1{1,}|( -)|(- ))/.test(firstName.value)) {
showErrorMessage(firstName, 0,
"Mehrere Sonderzeichen dürfen nicht nebeneinander stehen.");
return false;
}
// Fehlermeldung Anzahl Zeichen pro Teil
else if (!(/^([A-ZÄÖÜa-zäöüß]{2,}[ -]?)+$/.test(firstName.value))) {
showErrorMessage(firstName, 0,
"Jeder Teil eines Vornamens muss aus "
+ "mindestens zwei Buchstaben bestehen.");
return false;
}
// Fehlermeldung Letztes Zeichen
else if (!(/[a-zäöüß]$/.test(firstName.value))) {
showErrorMessage(firstName, 0,
"Der Vorname muss mit einem Kleinbuchstaben enden.");
return false;
}
// Fehlermeldung Groß- und Kleinschreibung
else if (!(/^[A-ZÄÖÜ][a-zäöüß]+([- ][A-ZÄÖÜ][a-zäöüß]+)*$/
.test(firstName.value))) {
showErrorMessage(firstName, 0,
"Jeder Teil eines Vornamens "
+ "muss mit einem Großbuchstaben beginnen. "
+ "Nach einem Großbuchstaben folgen nur Kleinbuchstaben.");
return false;
}
// Fehlermeldung Aufeinanderfolgende Gleiche Zeichen
else if (/(\w)\1{2,}/.test(firstName.value)) {
showErrorMessage(firstName, 0,
"Es dürfen nicht mehr als zwei gleiche Buchstaben "
+ "nebeneinander stehen.");
return false;
}
else {
removeErrorMessage(firstName, 0);
return true;
}
}
/**
* Ein Nachname kann mit einem Klein- oder Großbuchstaben beginnen,
* gefolgt von mindestens einem Kleinbuchstaben.
* Mehrere Nachnamen können mit einem Leerzeichen
* oder Bindestrich getrennt werden.
*/
// Beispiele zum Testen:
// Schulze -> Keine Fehlermeldung
// Jäger -> Keine Fehlermeldung
// Ziegler-Hermann -> Keine Fehlermeldung
// von der Leyen -> Keine Fehlermeldung
// von Bern -> Keine Fehlermeldung
// zu Liechtenstein -> Keine Fehlermeldung
// Bÿl -> Fehlermeldung Erlaubte Zeichen
// Jäger. -> Fehlermeldung Erlaubte Zeichen
// 1234 -> Fehlermeldung Erlaubte Zeichen
// B -> Fehlermeldung Anzahl Zeichen
// -> Fehlermeldung Leeres Feld
// -> Fehlermeldung Leeres Feld
// bauer -> Fehlermeldung Erlaubtes Namenspräfix
// vom Bauer -> Fehlermeldung Erlaubtes Namenspräfix
// BauEr -> Fehlermeldung Groß- und Kleinschreibung
// Bauuuer -> Fehlermeldung Aufeinanderfolgende Gleiche Zeichen
// Ziegler Hermann -> Fehler Doppelnamen
// Ziegler--Hermann -> Fehlermeldung Aufeinanderfolgende Sonderzeichen
// Bauer- -> Fehlermeldung Letztes Zeichen
function checkLastName() {
var lastName = document.getElementById("nachName");
// Fehlermeldung Leeres Feld
if (!(checkIfElementHasValue(lastName))) {
showErrorMessage(lastName, 0, "Bitte füllen Sie das Feld aus.")
return false;
}
// Fehlermeldung Erlaubte Zeichen
else if (!(/^[A-Za-zÄÖÜäöüß -]*$/.test(lastName.value))) {
showErrorMessage(lastName, 0,
"Ein Nachname darf nur Groß- und Kleinbuchstaben von A-Z, "
+ "sowie Umlaute, Eszett, Bindestriche und Leerzeichen enthalten.");
return false;
}
// Fehlermeldung Anzahl Zeichen
else if (!(/.{2,}/.test(lastName.value))) {
showErrorMessage(lastName, 0,
"Ein Nachname muss aus mindestens zwei Buchstaben bestehen.");
return false;
}
// Fehlermeldung Aufeinanderfolgende Sonderzeichen
else if (/([-])\1{1,}/.test(lastName.value)) {
showErrorMessage(lastName, 0,
"Mehrere Sonderzeichen dürfen nicht nebeneinander stehen.");
return false;
}
// Fehlermeldung Anzahl Zeichen pro Teil
else if (!(/^([A-ZÄÖÜa-zäöüß]{2,}[ -]?)+$/.test(lastName.value))) {
showErrorMessage(lastName, 0,
"Jeder Teil eines Nachnamens muss aus "
+ "mindestens zwei Buchstaben bestehen.");
return false;
}
// Fehlermeldung Letztes Zeichen
else if (!(/[a-zäöüß]$/.test(lastName.value))) {
showErrorMessage(lastName, 0,
"Der Nachname muss mit einem Kleinbuchstaben enden.");
return false;
}
// Fehler Doppelnamen
else if (/[A-ZÄÖÜ][a-zäöüß]+[ ]+[A-ZÄÖÜ][a-zäöüß]+/.test(lastName.value)) {
showErrorMessage(lastName, 0,
"Doppelnamen müssen mit einem Bindestrich getrennt werden.");
return false;
}
// Fehlermeldung Erlaubtes Namenspräfix
else if (!(/^(von( der)?|zu)[ ][A-ZÄÖÜ]|^[A-ZÄÖÜ]/.test(lastName.value))) {
showErrorMessage(lastName, 0,
"Ein Nachname muss muss mit einem Großbuchstaben beginnen, "
+ "es sei denn, Sie benutzen ein Namenspräfix.<br>"
+ "Gültige Namenspräfixe sind 'von', 'zu' und 'von der'.");
return false;
}
// Fehlermeldung Groß- und Kleinschreibung
else if (!(/(^(von( der)?|zu|van)[ ][A-ZÄÖÜ][a-zäöüß]+|^[A-ZÄÖÜ][a-zäöüß]+)([-][A-ZÄÖÜ][a-zäöüß]+)?$/.test(lastName.value))) {
showErrorMessage(lastName, 0,
"Jeder Teil eines Nachnamens, bis auf den möglichen Namenszusatz am Anfang, "
+ "muss mit einem Großbuchstaben beginnen. "
+ "Nach einem Großbuchstaben folgen nur Kleinbuchstaben.");
return false;
}
// Fehlermeldung Aufeinanderfolgende Gleiche Zeichen
else if (/(\w)\1{2,}/.test(lastName.value)) {
showErrorMessage(lastName, 0,
"Es dürfen nicht mehr als zwei gleiche Buchstaben "
+ "nebeneinander stehen.");
return false;
}
else {
removeErrorMessage(lastName, 0);
return true;
}
}
/**
* Ein Straßenname kann aus Buchstaben (inlusive Umlaute), Ziffern
* oder einer Mischung aus beidem bestehen.
* Auch Apostrophen und das scharfe S können im Namen vorkommen,
* stehen aber nie am Anfang.
* Ein Straßenname kann aus mehreren Teilen bestehen,
* welche mit einem Leerzeichen oder Bindestrich getrennt werden.
*/
// Beispiele zum Testen:
// Straße 73 -> Keine Fehlermeldung
// Kurt-Romstöck-Ring -> Keine Fehlermeldung
// Laehr'scher Jagdweg -> Keine Fehlermeldung
// A 3 -> Keine Fehlermeldung -> Keine Fehlermeldung
// A3 -> Keine Fehlermeldung
// -> Fehlermeldung Leeres Feld
// -> Fehlermeldung Leeres Feld
// Frießenstr. -> Fehlermeldung Erlaubte Zeichen
// D -> Fehlermeldung Anzahl Zeichen
// 1234 -> Fehlermeldung Ziffern
// Fri3senstraße -> Fehlermeldung Ziffern
// kurt-Romstöck-Ring -> Fehlermeldung Groß- und Kleinschreibung
// Rue de Saint-Germain-lès-Corbeil -> Fehlermeldung Erlaubte Zeichen
// Musterstraße' -> Fehlermeldung Letztes Zeichen
function checkStreetName() {
var streetName = document.getElementById("strasse");
// Fehlermeldung Leeres Feld
if (!(checkIfElementHasValue(streetName))) {
showErrorMessage(streetName, 0,
"Bitte füllen Sie das Feld Straße aus.");
return false;
}
// Fehlermeldung Anzahl Zeichen
else if (!(/.{2,}/.test(streetName.value))) {
showErrorMessage(streetName, 0,
"Ein Straßenname muss aus mindestens zwei Zeichen bestehen.");
return false;
}
// Fehlermeldung Ziffern
else if (!(/^[^0-9]*$|[0-9]$/.test(streetName.value))) {
showErrorMessage(streetName, 0,
"Ziffern und Zahlen dürfen nur am Ende des Straßennamens stehen.");
return false;
}
// Fehlermeldung Erlaubte Zeichen
else if (!(/^[A-Za-z0-9ÄÖÜäöüß' -]+$/.test(streetName.value))) {
showErrorMessage(streetName, 0,
"Ein Straßenname darf nur aus Groß- und Kleinbuchstaben, "
+ "Umlauten, Eszett, Ziffern, Bindestrichen "
+ "und Apostrophen bestehen.<br>Bitte stellen Sie sicher, "
+ "dass alle Abkürzungen ausgeschrieben sind.");
return false;
}
// Fehlermeldung Groß- und Kleinschreibung
else if (!(/^[A-ZÄÖÜ][ -]?[a-zäöü0-9ß']+([ -]?[A-ZÄÖÜ0-9][A-Za-z0-9ÄÖÜäöüß']+)*$/)
.test(streetName.value)) {
showErrorMessage(streetName, 0,
"Jeder Teil des Straßennamens muss "
+ "mit einem Großbuchstaben beginnen.");
return false;
}
// Fehlermeldung Letztes Zeichen
else if (!(/[0-9]$|[a-zäöüß]$/.test(streetName.value))) {
showErrorMessage(streetName, 0,
"Ein Straßenname kann nur mit einer Ziffer "
+ "oder einem Kleinbuchstaben enden.");
return false;
}
else {
removeErrorMessage(streetName, 0);
return true;
}
}
/**
* Eine Hausnummer kann aus Ziffern und maximal einem Kleinbuchstaben bestehen.
* Jede Hausnummer beginnt mit mindestens einer Ziffer.
*/
// Beispiele zum Testen:
// 54 -> Keine Fehlermeldung
// 2a -> Keine Fehlermeldung
// -> Fehlermeldung Leeres Feld
// -> Fehlermeldung Leeres Feld
// a3 -> Fehlermeldung Erstes Zeichen
// 2A -> Fehlermeldung Syntax
// 2ab -> Fehlermeldung Syntax
// 12345 -> Fehlermeldung Syntax
// 0 -> Fehlermeldung Führende Null
function checkHouseNumber() {
var houseNumber = document.getElementById("hausNummer");
// Fehlermeldung Leeres Feld
if (!(checkIfElementHasValue(houseNumber))) {
showErrorMessage(houseNumber, 1,
"Bitte füllen Sie das Feld Hausnummer aus.");
return false;
}
// Fehlermeldung Erstes Zeichen
else if (!(/^[0-9]/.test(houseNumber.value))) {
showErrorMessage(houseNumber, 1,
"Eine Hausnummer muss mit einer Ziffer beginnen.");
return false;
}
// Fehlermeldung Führende Null
else if (/^0/.test(houseNumber.value)) {
showErrorMessage(houseNumber, 1,
"Eine Hausnummer kann nicht mit einer Null beginnen.");
return false;
}
// Fehlermeldung Syntax
else if (!(/^[1-9][0-9]{0,3}[a-z]?$/.test(houseNumber.value))) {
showErrorMessage(houseNumber, 1,
"Bitte geben Sie eine gültige Hausnummer ein, "
+ "welche aus maximal fünf Ziffern und maximal "
+ "einem Kleinbuchstaben am Ende der Hausnummer besteht.");
return false;
}
else {
removeErrorMessage(houseNumber, 1);
return true;
}
}
/**
* Eine Postleitzahl besteht aus einer Reihe von fünf Ziffern.
* Die kleinste mögliche Postzahl ist 01001.
*/
// Beispiele zum Testen:
// 67547 -> Keine Fehlermeldung
// 08123 -> Keine Fehlermeldung
// -> Fehlermeldung Leeres Feld
// -> Fehlermeldung Leeres Feld
// 00000 -> Fehlermeldung Syntax
function checkPLZ() {
var plz = document.getElementById("postleitzahl");
// Fehlermeldung Leeres Feld
if (!(checkIfElementHasValue(plz))) {
showErrorMessage(plz, 0,
"Bitte füllen Sie das Feld Postleitzahl aus.");
return false;
}
// Fehlermeldung Syntax
else if (!(/^(0100[1-9]|010[1-9][0-9]|01[1-9][0-9]{2}|0[2-9][0-9]{3}|[1-9][0-9]{4})$/
.test(plz.value))) {
showErrorMessage(plz, 0,
"Bitte geben Sie eine gültige Postleitzahl ein, "
+ "welche aus fünf Ziffern besteht. "
+ "Die kleinste gültige Postleitzahl ist 01001.");
return false;
}
else {
removeErrorMessage(plz, 0);
return true;
}
}
/**
* Ein Stadtname besteht aus Buchstaben (inklusive Umlaute und Eszett),
* kann mehrere Teile haben und beginnt immer mit einem Großbuchstaben.
* Die einzelnen Teile können durch ein Leerzeichen, einen Bindestrich,
* oder einen Schrägstrich getrennt werden.
*/
// Beispiele zum Testen:
// Füssen -> Keine Fehlermeldung
// Frankenberg/Sachsen -> Keine Fehlermeldung
// Eschenbach in der Oberpfalz -> Keine Fehlermeldung
// Auma-Weidatal -> Keine Fehlermeldung
// Gießen -> Keine Fehlermeldung
// -> Fehlermeldung Leeres Feld
// -> Fehlermeldung Leeres Feld
// St. Ingbert -> Fehlermeldung Erlaubte Zeichen
// Auma--Weidatal -> Fehlermeldung Aufeinanderfolgende Sonderzeichen
// Frankenberg/ Sachsen -> Fehlermeldung Aufeinanderfolgende Sonderzeichen
// Füsssen -> Fehlermeldung Aufeinanderfolgende Gleiche Zeichen
// S -> Fehlermeldung Anzahl Zeichen
// Auma-weidatal -> Fehlermeldung Groß- und Kleinschreibung
// füssen -> Fehlermeldung Großschreibung Anfang
// FüSsen -> Fehlermeldung Groß- und Kleinschreibung
// Auma- -> Fehlermeldung Letztes Zeichen
function checkCity() {
var city = document.getElementById("ort");
// Fehlermeldung Leeres Feld
if (!(checkIfElementHasValue(city))) {
showErrorMessage(city, 1,
"Bitte füllen Sie das Feld Ort aus.");
return false;
}
// Fehlermeldung Anzahl Zeichen
else if (!(/.{2,}/.test(city.value))) {
showErrorMessage(city, 1,
"Ein Ortsname muss aus mindestens zwei Zeichen bestehen.");
return false;
}
// Fehlermeldung Aufeinanderfolgende Sonderzeichen
else if (/[ \/-][ \/-]/.test(city.value)) {
showErrorMessage(city, 1,
"Mehrere Sonderzeichen dürfen nicht nebeneinander stehen.");
return false;
}
// Fehlermeldung Erlaubte Zeichen
else if (!(/^[A-ZÄÖÜa-zäöüß \/-]+$/.test(city.value))) {
showErrorMessage(city, 1,
"Ein Ortsname kann nur aus Groß- und Kleinbuchstaben, "
+ "inklusive Umlauten und Eszett bestehen. "
+ "Mehrteilige Ortsnamen können mit einem Leerzeichen, Bindestrich "
+ "oder Schrägstrich getrennt werden. Bitte stellen Sie außerdem "
+" sicher, dass alle Abkürzungen ausgeschrieben sind.")
return false;
}
// Fehlermeldung Aufeinanderfolgende Gleiche Zeichen
else if (/(\w)\1{2,}/.test(city.value)) {
showErrorMessage(city, 1,
"Es dürfen nicht mehr als zwei gleiche Buchstaben "
+ "nebeneinander stehen.");
return false;
}
// Fehlermeldung Großschreibung Anfang
else if (!(/^[A-ZÄÖÜ]/.test(city.value))) {
showErrorMessage(city, 1,
"Ein Ortsname muss mit einem Großbuchstaben beginnen.");
return false;
}
// Fehlermeldung Letztes Zeichen
else if (!(/[a-zäöüß]$/.test(city.value))) {
showErrorMessage(city, 1,
"Ein Ortsname kann nur mit einem Kleinbuchstaben enden.");
return false;
}
// Fehlermeldung Groß- und Kleinschreibung
else if (!(/^[A-ZÄÖÜ][a-zäöüß]+([ -\/][A-ZÄÖÜa-zäöü][a-zäöüß]+)*$/)
.test(city.value)) {
showErrorMessage(city, 1,
"Großbuchstaben können nur am Anfang des Ortsnamens oder, "
+ "bei mehrteiligen Ortsnamen, am Anfang eines Teilnamens stehen.");
return false;
}
else {
removeErrorMessage(city, 1);
return true;
}
}
/**
* Eine E-Mail-Addresse besteht aus einem Lokal- und einem Domänenteil,
* welche durch ein @ Zeichen getrennt werden.
* Der lokale Teil darf Buchstaben (Basis-Lateinisch), Ziffern
* und verschiedene Sonderzeichen enthalten.
*
* Der ganze Lokalteil oder Teilabschnitte
* können mit Anführungszeichen umschlossen werden.
* Innerhalb der Anführungszeichen dürfen zusätzliche Sonderzeichen
* und Leerzeichen genutzt werden.
* Auch erneute Anführungszeichen und Backslashes sind erlaubt,
* müssen aber nach einem zusätzlichen Backslash stehen.
* Am Anfang und Ende des lokalen Teils dürfen Kommentare in runden Klammern stehen.
* Der Lokalteil darf nicht mit einem Punkt beginnen oder enden.
*
* Der Domänenteil besteht meist selbst aus drei Teilen:
* einem Hostnamen, einem Punkt und einer Top-Level-Domain.
* Die Top-Level-Domain besteht aus mindestens zwei Zeichen.
*
*/
// Beispiele zum Testen:
// MaxMustermann@email.de -> Keine Fehlermeldung
// Max!#.Mustermann@email9.com -> Keine Fehlermeldung
function checkEmailAddress() {
const regex_emailAddress = /[A-Za-z0-9_!#$%&'*+-\/=?^_`.{|}~]+[@][A-Za-z0-9-]+[.][A-Za-z]{2,}/;
var emailAddress = document.getElementById("email");
if (!(checkIfElementHasValue(emailAddress))) {
showErrorMessage(emailAddress, 0, "Bitte füllen Sie das Feld aus.");
return false;
}
else if (!(regex_emailAddress.test(emailAddress.value))) {
showErrorMessage(emailAddress, 0, "Bitte geben Sie eine gültige E-Mail-Addresse ein, welche die Form 'lokalerTeil@domainteil.topLevelDomain' hat. Erlaubte Zeichen sind Groß- und Kleinbuchstaben, Ziffern und Sonderzeichen.");
return false;
}
else {
removeErrorMessage(emailAddress, 0);
return true;
}
}
/**
* Prüft die Übereinstimmung mit der bereits eingegebenen E-Mail-Addresse.
*/
function checkRepeat_EmailAddress() {
var emailAddress = document.getElementById("email");
var repeatEmailAddress = document.getElementById("emailRep");
if (!(checkIfElementHasValue(repeatEmailAddress))) {
showErrorMessage(repeatEmailAddress, 0,
"Bitte füllen Sie das Feld aus.");
return false;
}
else if (emailAddress.value != repeatEmailAddress.value) {
showErrorMessage(repeatEmailAddress, 0,
"Bitte stellen Sie sicher, "
+ "dass die E-Mail-Addressen miteinander übereinstimmen.");
return false;
}
else {
removeErrorMessage(repeatEmailAddress, 0);
return true;
}
}
/**
* Ein Passwort muss aus mindestens sechs Zeichen bestehen.
* Außerdem muss das Passwort mindestens einen Groß- und Kleinbuchstaben
* (Basis-Lateinisch und Umlaute), eine Ziffer
* und eines der folgenden Sonderzeichen enthalten:
* [!°`´@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]
*/
function checkPassword() {
var regex_password = /^(?=.*[A-ZÄÖÜ])(?=.*[a-zäöüß])(?=.*[0-9])(?=.*[!°`´@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]).{6,}$/;
var password = document.getElementById("passwort");
if (!(checkIfElementHasValue(password))) {
showErrorMessage(password, 0, "Bitte füllen Sie das Feld aus.")
return false;
}
// Fehlermeldung Anzahl Zeichen
else if (!(/^.{6,}$/.test(password.value))) {
showErrorMessage(password, 0,
"Ihr Passwort muss eine Länge von mindestens sechs Zeichen haben.");
return false;
}
else if (!(regex_password.test(password.value))) {
showErrorMessage(password, 0,
"Ihr Passwort muss mindestens einen "
+ "Groß- und Kleinbuchstaben (inklusive Umlaute und Eszett), "
+ "eine Ziffer und ein Sonderzeichen enthalten.");
return false;
}
else {
removeErrorMessage(password, 0);
return true;
}
}
/**
* Prüft die Übereinstimmung mit dem bereits eingegebenen Passwort.
*/
function checkRepeat_Password() {
var password = document.getElementById("passwort");
var repeatPassword = document.getElementById("passwortRep");
if (!(checkIfElementHasValue(repeatPassword))) {
showErrorMessage(repeatPassword, 0, "Bitte füllen Sie das Feld aus.")
return false;
}
else if (repeatPassword.value != password.value) {
showErrorMessage(repeatPassword, 0,
"Bitte stellen Sie sicher, "
+ "dass die Passwörter miteinander übereinstimmen.");
return false;
}
else {
removeErrorMessage(repeatPassword, 0);
return true;
}
}
/**
* Prüft, ob alle Eingaben des Formulars vorhanden und gültig sind.
* Ist dies der Fall, werden die Daten verarbeitet
* und der Nutzer wird auf die Seite "Erfolgreich registriert" weitergeleitet.
*/
/*function checkForPossibleSubmit() {
var firstName = checkFirstName();
var lastName = checkLastName();
var streetName = checkStreetName();
var houseNumber = checkHouseNumber();
var plz = checkPLZ();
var city = checkCity();
var emailAddress = checkEmailAddress();
var repeatEmailAddress = checkRepeat_EmailAddress();
var password = checkPassword();
var repeatPassword = checkRepeat_Password();
if (firstName && lastName && streetName && houseNumber && plz && city &&
emailAddress && repeatEmailAddress && password && repeatPassword) {
// TODO: Formular submitten.
window.location.replace("registrierung_erfolgreich.php");
}
else
{
// TODO: Soll irgendetwas passieren?
return false;
}
}*/

View File

@ -0,0 +1,81 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Erfolgreich Registriert</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!--------------------------------------------------------------------->
<div class="mainContentContainer">
<div class="titleContainer">
<h1 id="registeredTitle">Fehler</h1>
</div>
<div class="mainContent">
<p id="textFirstHalf">
Füllen Sie bitte alle Felder aus.
</p>
<a type="button" id="loginNowButton" href="registrierung.php"> Erneut Versuchen </a>
<br><br><br>
</div>
</div>
<!--------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

130
reservierung.css 100644
View File

@ -0,0 +1,130 @@
/*TODO: Hintergrundfarben entfernen*/
.hauptcontainer {
/*Einzelne Elemente untereinander anzeigen.*/
flex-direction: column;
}
#reservationConfirmation_heading {
/* background-color: #70AD47; */
margin-top: 30px;
margin-left: 30px;
margin-bottom: 25px;
margin-right: 50px;
font-weight: 500;
}
#reservationConfirmation_subHeading {
margin-left: 45px;
margin-bottom: 20px;
font-weight: 500;
font-size: 20px;
}
/*Container wird mit Daten aus der Datenbank gefüllt.*/
#booksToReserve_container {
padding-left: 45px;
padding-right: 50px;
padding-bottom: 30px;
}
.book_container {
/* background-color: blueviolet; */
display: flex;
/*Einzelne Elemente nebeneinander anzeigen.*/
flex-direction: row;
cursor: pointer;
}
.bookCover_container {
/*background-color: blue;*/
display: flex;
/*Verbietet dem Container, seine Standardgröße (px) zu ändern.*/
flex: 0 0 75px;
align-items: center;
height: auto;
}
.bookCover {
/*Bild passt sich seinem Container an.*/
max-width:100%;
max-height:100%;
}
.bookDetails_container {
/* background-color: aquamarine; */
width: 100%;
display: flex;
flex-direction: column;
padding-left: 15px;
padding-right: 15px;
}
.bookTitle {
margin-bottom: 10px;
font-weight: 500;
font-size: 16px;
}
.available_container {
width: fit-content;
/*Hintergrundfarbe wird an Inhalt angepasst.*/
background-color: #70AD47;
/*background-color: #F34343;*/
/*Element immer an der unteren Seite des Containers platzieren.*/
margin-top: auto;
}
.available {
color: white;
margin: 10px 25px;
}
.divider {
margin-top: 15px;
margin-bottom: 15px;
background-color: #987554;
width: 100%;
height: 1px;
}
#reservationConfirmationText {
margin-left: 45px;
margin-right: 50px;
}
#meinebuecher_link {
color: inherit;
}
#button_container {
margin-top: 20px;
padding-left: 45px;
padding-right: 50px;
margin-bottom: 50px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.reserve_button {
background-color: #664220;
color:white;
text-align: center;
border-radius: 10px;
font-size: medium;
border-width: 0px;
padding: 15px;
}
#backToCart_button {
margin-right: auto;
cursor: pointer;
}
#confirm_button {
margin-left: auto;
cursor: pointer;
}

242
reservierung.php 100644
View File

@ -0,0 +1,242 @@
<!--
TODO (optional):
- 80 Zeichen
-->
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="reservierung.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Reservierungsbestätigung</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="hauptcontainer">
<h1 id="reservationConfirmation_heading">Reservierungsbestätigung</h1>
<h2 id="reservationConfirmation_subHeading">
Möchten Sie die folgenden Bücher reservieren?
</h2>
<div id="booksToReserve_container">
<?php
session_start();
// Counter für Divider
$counter = 0;
// Überprüfen, ob Bücher im Warenkorb liegen
if(isset($_SESSION['cart']) && !empty($_SESSION['cart'])) {
// Es liegen Bücher im Warenkorb
// Alle Elemente im Warenkorb durchgehen
foreach ($_SESSION["cart"] as $key=>$item) {
$quantity = $item['quantity'];
$sql = '';
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
/* SQL-Befehl vorbereiten */
$sql = $connection->prepare("SELECT b.BuchID, b.Titel,
b.Bild,
IF(b.Anzahl!=0, 'Verfügbar', CONCAT('Verfügbar ab: ',
(SELECT DATE_FORMAT(DATE_ADD(ab.Enddatum, INTERVAL 1 DAY)
,'%d.%m.%Y') FROM `ausgeliehenes_buch` AS ab
WHERE ab.BuchID = b.BuchID
ORDER BY ab.Reserviert ASC, ab.Enddatum ASC LIMIT 1)))
AS 'Verfügbarkeit' FROM `buch` AS b
WHERE b.BuchID = ?
GROUP BY b.BuchID;");
// Parameter binden
$sql->bind_param("i", $ID);
// ID festlegen
$ID = $key;
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if ($counter != 0) {
echo "<div class='divider'></div>";
}
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookAuthor = $row['Autor'];
$bookAvailability = $row['Verfügbarkeit'];
// TODO: OnClick auslagern.
echo "<div id='book_container$bookID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover'
src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='available_container'>
<p id='available_$bookID' class='available'>
$bookAvailability</p>
<!--TODO: Auslagern-->
<script type='text/javascript'
language='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$bookID');
var parentDiv =
currentElement.parentElement;
if (currentElement.innerHTML.trim()
== 'Verfügbar') {
parentDiv.style.backgroundColor
= '#70AD47';
}
else {
parentDiv.style.backgroundColor
= '#F34343';
}
})();
</script>
</div>
</div>
</div>";
$counter++;
}
} else {
echo "Keine Ergebnisse.";
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
mysqli_close($connection);
$counter++;
}
}
else {
// Es liegen keine Bücher im Warenkorb
echo
"Der Warenkorb ist leer,
bitte fügen Sie Bücher hinzu.";
}
?>
</div>
<p id="reservationConfirmationText">Bitte beachten Sie,
dass die Reservierung für ein Buch automatisch verfällt,
sollten Sie es nicht innerhalb von 7 Tagen abholen.
<br>
Die Informationen darüber, ab wann ein Buch verfügbar ist
und bis wann es spätestens abgeholt werden muss,
finden Sie nach einer erfolgreichen Reservierung auf der Seite
<a id="meinebuecher_link" href="meinebuecher.php">
„Meine Bücher“</a>.
</p>
<div id="button_container">
<input id="backToCart_button" class="reserve_button" type="button"
onclick="open_cart()" value="Zurück zum Warenkorb">
<input id="confirm_button" class="reserve_button" type="button"
onclick="open_reservationConfirmation()" value="Bestätigen">
</div>
</div>
<!------------------------------------------------------------------------->
<!-- TODO: Auslagern (falls möglich) -->
<script>
function open_bookDetails(ID) {
var data = new URLSearchParams();
data.append("bookID", ID);
var url = "http://141.19.142.11/buch_details.php?" +
data.toString();
location.href = url;
}
function open_reservationConfirmation() {
var url = "http://141.19.142.11/reservierung_bestaetigung.php";
location.href = url;
}
function open_cart() {
var url = "http://141.19.142.11/warenkorb.php";
location.href = url;
}
</script>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,357 @@
<!--
TODO:
- 80 Zeichen
-->
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Reservierungsbestätigung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
// Benutzer ID abholen
//$userID = ?;
$userID = $_SESSION['userID'];
// Überprüfen, ob Bücher im Warenkorb liegen
if(isset($_SESSION['cart']) && !empty($_SESSION['cart'])) {
// Jedes Buch im Warenkorb durchgehen
foreach ($_SESSION["cart"] as $key=>$item) {
// Ausgewählte Menge speichern
$quantity = $item['quantity'];
$sql = '';
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
/* SQL-Befehl vorbereiten */
$sql = $connection->prepare("SELECT b.BuchID, b.Anzahl,
b.MaxAnzahl
FROM `buch` AS b
WHERE b.BuchID = ?
GROUP BY b.BuchID;");
// Parameter binden
$sql->bind_param("i", $ID);
// ID festlegen
$ID = $key;
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$bookQuantity = $row['Anzahl'];
$bookMaxQuantity = $row['MaxAnzahl'];
$quantityNew = $quantity;
// Überprüfen, ob die ausgewählte Menge vorhanden ist
if ($bookQuantity == 0) {
// Alle Bücher ausgeliehen
$sqlSearch = $connection->prepare(
"SELECT AusleihID,
Enddatum,
Reserviert
FROM `ausgeliehenes_buch`
WHERE BuchID=?
AND Reserviert=0
ORDER BY `Enddatum` LIMIT ?;");
// Parameter binden
$sqlSearch->bind_param("ii", $bookID, $quantity);
// SQL-Befehl ausführen
$sqlSearch->execute();
// Ergebnis speichern
$resultSearch = $sqlSearch->get_result();
// Alle Ergebnisse durchgehen
while($rowSearch = mysqli_fetch_assoc($resultSearch)) {
$borrowID = $rowSearch['AusleihID'];
$borrowEndDate = $rowSearch['Enddatum'];
//Buch zu `ausgeliehenes_buch` hinzufügen
$sqlInsert =
"INSERT INTO `ausgeliehenes_buch`
(`AusleihID`, `BenutzerID`, `BuchID`,
`Anfangsdatum`, `Enddatum`, `Verlängerbar`,
`Reserviert`)
VALUES
(NULL, '$userID', '$bookID',
DATE_ADD('$borrowEndDate', INTERVAL 1 DAY),
DATE_ADD(
DATE_ADD('$borrowEndDate', INTERVAL 1 DAY),
INTERVAL 14 DAY),
'1', '0');";
mysqli_query($connection, $sqlInsert);
// Anzahl des Buches in der Datenbank reduzieren
$sqlUpdate = $connection->prepare(
"UPDATE `ausgeliehenes_buch`
SET `Verlängerbar` = '0',
`Reserviert` = '1'
WHERE `AusleihID` = ?;");
// Parameter binden
$sqlUpdate->bind_param("i", $borrowID);
// SQL-Befehl ausführen
$sqlUpdate->execute();
}
}
else if ($quantity <= $bookQuantity) {
// Ausgewählte Menge ist komplett vorhanden
// Alle gleichen Bücher in die Datenbank einfügen
while ($quantityNew != 0) {
// Buch zu `ausgeliehenes_buch` hinzufügen
$sqlInsert =
"INSERT INTO `ausgeliehenes_buch`
(`AusleihID`, `BenutzerID`, `BuchID`,
`Anfangsdatum`, `Enddatum`, `Verlängerbar`,
`Reserviert`)
VALUES
(NULL, '$userID', '$bookID', CURDATE(),
DATE_ADD(CURDATE(), INTERVAL 14 DAY),
'1', '0'); ";
mysqli_query($connection, $sqlInsert);
$quantityNew--;
}
$bookQuantityNew = $bookQuantity - $quantity;
// Anzahl des Buches in der Datenbank reduzieren
$sqlReduce = $connection->prepare(
"UPDATE `buch`
SET `Anzahl` = '$bookQuantityNew'
WHERE `buch`.`BuchID` = ?;");
// Parameter binden
$sqlReduce->bind_param("i", $bookID);
// SQL-Befehl ausführen
$sqlReduce->execute();
}
else if ($quantity > $bookQuantity) {
// Bücher, welche noch vorhanden sind
// Alle gleichen Bücher in die Datenbank einfügen
$quantityNew = $quantity - $bookQuantity;
$quantityRest = $quantity;
while ($quantityNew != 0) {
//Buch zu `ausgeliehenes_buch` hinzufügen
$sqlInsert =
"INSERT INTO `ausgeliehenes_buch`
(`AusleihID`, `BenutzerID`, `BuchID`,
`Anfangsdatum`, `Enddatum`, `Verlängerbar`,
`Reserviert`)
VALUES
(NULL, '$userID', '$bookID', CURDATE(),
DATE_ADD(CURDATE(), INTERVAL 14 DAY),
'1', '0'); ";
mysqli_query($connection, $sqlInsert);
$quantityNew--;
$quantityRest--;
}
$bookQuantityNew =
$bookQuantity - ($quantity - $bookQuantity);
// Anzahl des Buches in der Datenbank reduzieren
$sqlReduce = $connection->prepare(
"UPDATE `buch`
SET `Anzahl` = '$bookQuantityNew'
WHERE `buch`.`BuchID` = ?;");
// Parameter binden
$sqlReduce->bind_param("i", $bookID);
// SQL-Befehl ausführen
$sqlReduce->execute();
// Bücher, welche bereits ausgeliehen wurden
$sqlSearch = $connection->prepare(
"SELECT AusleihID,
Enddatum,
Reserviert
FROM `ausgeliehenes_buch`
WHERE BuchID=?
AND Reserviert=0
ORDER BY `Enddatum` LIMIT ?;");
// Parameter binden
$sqlSearch->bind_param("ii", $bookID, $quantityRest);
// SQL-Befehl ausführen
$sqlSearch->execute();
// Ergebnis speichern
$resultSearch = $sqlSearch->get_result();
// Alle Ergebnisse durchgehen
while($rowSearch = mysqli_fetch_assoc($resultSearch)) {
$borrowID = $rowSearch['AusleihID'];
$borrowEndDate = $rowSearch['Enddatum'];
//Buch zu `ausgeliehenes_buch` hinzufügen
$sqlInsert =
"INSERT INTO `ausgeliehenes_buch`
(`AusleihID`, `BenutzerID`, `BuchID`,
`Anfangsdatum`, `Enddatum`, `Verlängerbar`,
`Reserviert`)
VALUES
(NULL, '$userID', '$bookID',
DATE_ADD('$borrowEndDate', INTERVAL 1 DAY),
DATE_ADD(
DATE_ADD('$borrowEndDate', INTERVAL 1 DAY),
INTERVAL 14 DAY),
'1', '0');";
mysqli_query($connection, $sqlInsert);
// Anzahl des Buches in der Datenbank reduzieren
$sqlUpdate = $connection->prepare(
"UPDATE `ausgeliehenes_buch`
SET `Verlängerbar` = '0',
`Reserviert` = '1'
WHERE `AusleihID` = ?;");
// Parameter binden
$sqlUpdate->bind_param("i", $borrowID);
// SQL-Befehl ausführen
$sqlUpdate->execute();
}
}
}
} else {
echo "Buch konnte nicht gefunden werden.";
}
mysqli_close($connection);
// Buch aus dem Warenkorb löschen
// Überprüfen, ob das Buch im Warenkorb liegt
if (isset($_SESSION['cart'][$bookID])) {
// Buch existiert im Warenkorb, kann gelöscht werden
unset($_SESSION['cart'][$bookID]);
}
}
}
?>
<div id="reservierung">
<h1>Reservierung erfolgreich bestätigt</h1>
<div id="reservierung-left">
<p id="erklärung">Ihre Reservierung wurde bestätigt. Einen Überblick über Ihre reservierten Bücher
sowie die Informationen darüber, ab wann ein Buch verfügbar ist und bis wann es spätestens abgeholt
werden muss, finden Sie auf der Seite "<a href="meinebuecher.php">Meine Bücher</a>".</p>
<div id="button-container">
<a href="meinebuecher.php">Meine Bücher</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,115 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Reservierung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<div id="reservierung">
<h1>Reservierungsbestätigung</h1>
<div id="reservierung-left">
<p id="möchten-sie">Möchten Sie die folgenden Bücher reservieren?</p>
<div class="item">
<img src="pictures/percy_jackson_diebe_im_olymp.jpg" alt="Percy Jackson: Diebe im Olymp" height="120">
<div class="beschreibung">
<h2>Percy Jackson: Diebe in Olymp</h2>
<div class="b2 green">Sofort Abholbereit</div>
</div>
</div>
<hr>
<div class="item">
<img src="pictures/the_hundred_and_one_dalmatians.jpg" alt="The Hundred and One Dalmatians" height="120">
<div class="beschreibung">
<h2>The Hundred and One Dalmatians</h2>
<div class="b2 red">Verfügbar ab: 03.05.2023</div>
</div>
</div>
<hr>
<div class="item">
<img src="pictures/penguin_highway.jpg" alt="Penguin Highway" height="120">
<div class="beschreibung">
<h2>Penguin Highway</h2>
<div class="b2 red">Verfügbar ab: 30.04.2023</div>
</div>
</div>
<p id="erklärung">Bitte beachten Sie, dass die Reservierung für ein Buch automatisch verfällt, sollten Sie es nicht
innerhalb von 7 Tagen abholen.</br>
Die Informationen darüber, ab wann ein Buch verfügbar ist und bis wann es spätestens abgeholt werden muss,
finden Sie nach einer erfolgreichen Reservierung auf der Seite "<a href="meinebuecher.php">Meine Bücher</a>".
</p>
<div id="button-container">
<a href="warenkorb.php">Zurück zum Warenkorb</a>
<a href="reservierung-bestaetigung.html">Bestätigen</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

16
reset_counter.php 100644
View File

@ -0,0 +1,16 @@
<?php
$db_link = mysqli_connect('localhost', 'web_b-3', 'een7Ao6s', 'bibliothek_candle', '3306');
function runSQL($sql){
global $db_link;
$db_res = mysqli_query($db_link, $sql);
if(!$db_res){
header("Location: 404.html");
exit;
}
return $db_res;
}
runSQL("ALTER TABLE `benutzer` AUTO_INCREMENT = 1");
runSQL("ALTER TABLE `adresse` AUTO_INCREMENT = 1");
?>

8
resize.js 100644
View File

@ -0,0 +1,8 @@
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})

169
store.js
View File

@ -1,169 +0,0 @@
var warenkorb = [];
if (window.location.pathname.includes("/buecher.html")) {
document.addEventListener("DOMContentLoaded", function () {
$(window).on('load',function() {
var addItemButton = document.getElementsByClassName("binPicture");
//Dieser Code Block gehört zur Warenkorb Datei
for(var i = 0;i<addItemButton.length;i++)
{
var button = addItemButton[i]
button.addEventListener('click', addtoCartClick)
}
}
);
});
}
if (window.location.pathname.includes("/warenkorb.html")) {
document.addEventListener("DOMContentLoaded", function () {
// prüfe, ob der Benutzer sich auf der warenkorb.html-Seite befindet und erstelle das DIV
// convert JSON string to relevant object
var warenkorby = localStorage.getItem("items") || [];
const parsedArray = JSON.parse(warenkorby)
addingAll(parsedArray)
}
);}
//headerinItem
//discinItem
function addtoCartClick(event)
{
var button = event.target
var shopItem = button.parentElement.parentElement
var title = shopItem.getElementsByClassName('headerinItem')[0].innerHTML
var desc = shopItem.getElementsByClassName('discinItem')[0].innerHTML
var image = shopItem.getElementsByClassName('buecherImages')[0].src
var buttonColor = shopItem.getElementsByTagName('a')[1].innerHTML
//Split the description
var firstName = desc.split(' ')[1];
var lastName = desc.split(' ')[2];
console.log(firstName)
console.log(lastName)
var description = 'von ' + firstName +' ' + lastName;
addItemToCart(title,description,image,buttonColor)
}
function addItemToCart(title,desc,image,buttonColor)
{
var cartRow = document.createElement('div')
// var cartItems = document.getElementsByClassName('containerofbuecher')[0]
var cartRowConetent = ` <div class="items" >
<img src="${image}" width="125" height="200"/>
<h3 class="headerinItem">
${title}
</h3>
<p class="discinItem">${desc}</p>
<a class="greenbutton" href="percy.html">Verfügbar</a>
<!--Buttons-->
<div class="inputPlusMinus">
<div class="input-group plus-minus-input">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="minusButton" data-quantity="minus" data-field="quantity">
<i class="fa fa-minus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
<input class="input-group-field" type="number" onkeydown="return false" name="quantity" value="0">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="plusButton" data-quantity="plus" data-field="quantity">
<i class="fa fa-plus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
</div>
<a class="binPicture" ><img src="pictures/bin.png" width="25" height="25"></a>
</div>
<hr style="width: 96%;">
</div>
`
try {
var warenkorby = localStorage.getItem("items") || [];
var parsedArray = JSON.parse(warenkorby)
} catch (error) {
warenkorb.push(cartRowConetent)
// convert array to JSON string using JSON.stringify()
const jsonArray = JSON.stringify(warenkorb);
// save to localStorage using "array" as the key and jsonArray as the value
localStorage.setItem('items', jsonArray);
return ;
}
var existAlready = false;
cartRow.innerHTML = cartRowConetent;
for(var j = 0;j<parsedArray.length;j++)
{
if(parsedArray[j] == cartRowConetent)
{
existAlready = true;
}
}
if(buttonColor.includes("ab"))
{
existAlready = true;
}
if(!existAlready){
var warenkorbying = localStorage.getItem("items") || [];
warenkorb = JSON.parse(warenkorbying)
warenkorb.push(cartRowConetent)
// convert array to JSON string using JSON.stringify()
const jsonArray = JSON.stringify(warenkorb);
// save to localStorage using "array" as the key and jsonArray as the value
localStorage.setItem('items', jsonArray);
// localStorage.setItem("items",warenkorb)
// cartItems.append(cartRow);
}
}
function addingAll(wat) {
// var cartItems = document.getElementsByClassName('containerOfAll')[0];
for (var i = 0; i < wat.length; i++) {
/* var cartRow = document.createElement('div');
cartRow.insertAdjacentHTML('beforeend', wat[i]);
cartItems.appendChild(cartRow);
*/
insertHTMLStringToContainer(wat[i],"containerOfAll")
}
}
function insertHTMLStringToContainer(htmlString, containerId) {
var container = document.getElementsByClassName(containerId)[0];
container.insertAdjacentHTML('beforeend', htmlString);
}

File diff suppressed because it is too large Load Diff

146
suchergebnisse.css 100644
View File

@ -0,0 +1,146 @@
/*TODO: Hintergrundfarben entfernen*/
.hauptcontainer {
/*Einzelne Elemente untereinander anzeigen.*/
flex-direction: column;
}
#searchResult_heading {
/* background-color: #70AD47; */
margin-top: 30px;
margin-left: 30px;
margin-bottom: 25px;
margin-right: 50px;
font-weight: 500;
}
/*Container wird mit Daten aus der Datenbank gefüllt.*/
#searchResult_container {
padding-left: 45px;
padding-right: 50px;
padding-bottom: 50px;
}
.book_container {
/* background-color: blueviolet; */
display: flex;
/*Einzelne Elemente nebeneinander anzeigen.*/
flex-direction: row;
cursor: pointer;
}
.bookCover_container {
/*background-color: blue;*/
display: flex;
/*Verbietet dem Container, seine Standardgröße (px) zu ändern.*/
flex: 0 0 150px;
align-items: center;
height: auto;
}
.bookCover {
/*Bild passt sich seinem Container an.*/
max-width:100%;
max-height:100%;
}
.bookDetails_container {
/* background-color: aquamarine; */
width: 100%;
display: flex;
flex-direction: column;
padding-left: 15px;
padding-right: 15px;
}
.bookTitle {
margin-bottom: 10px;
font-weight: 400;
}
.bookDetails {
margin-bottom: 10px;
}
.available_container {
width: fit-content;
/*Hintergrundfarbe wird an Inhalt angepasst.*/
background-color: #70AD47;
/*background-color: #F34343;*/
/*Element immer an der unteren Seite des Containers platzieren.*/
margin-top: auto;
}
.available {
color: white;
margin: 10px 25px;
}
.shoppingCart_container {
/* background-color: chartreuse; */
margin-left: auto;
margin-top: auto;
flex: 0 0 40px;
}
.shoppingCart {
background-image: url('pictures/shopping_cart.png');
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
}
.shoppingCart:hover {
background-image: url('pictures/shopping_cart_hover.png');
cursor: pointer;
}
.bin_container {
/* background-color: chartreuse; */
margin-left: auto;
margin-top: auto;
flex: 0 0 40px;
}
.bin {
background-image: url('pictures/bin.png');
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
}
.bin:hover {
background-image: url('pictures/bin_hover.png');
cursor: pointer;
}
.extend {
background-image: url('pictures/extend.png');
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
}
.extend:hover {
background-image: url('pictures/extend_hover.png');
cursor: pointer;
}
.placeholder_container {
/* background-color: chartreuse; */
margin-left: auto;
margin-top: auto;
flex: 0 0 40px;
}
.divider {
margin-top: 15px;
margin-bottom: 15px;
background-color: #987554;
width: 100%;
height: 1px;
}

339
suchergebnisse.php 100644
View File

@ -0,0 +1,339 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Suchergebnisse</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="hauptcontainer">
<h1 id="searchResult_heading">Suchergebnisse</h1>
<div id="searchResult_container">
<?php
$sql = '';
$sourceForm = $_GET['searchType'];
// Überprüfen, welches Formular die Datei aufgerufen hat
if ($sourceForm == "simple") {
// Einfache Suche
// Eingegebene Daten in einer Variable speichern
$searchQuery = $_GET['searchFor'];
// Mögliche Whitspaces hinten und vorne entfernen
$searchQuery = trim($searchQuery, " \t\n\r\0\x0B");
// SQL-Befehl zusammenstellen
$sql = "SELECT b.BuchID, b.Titel, b.Erscheinungsjahr, b.Bild,
b.Verlag,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
GROUP_CONCAT(DISTINCT k.Name SEPARATOR ', ') AS 'Kategorie',
b.ISBN, b.Klappentext AS 'Inhalt', sp.Bezeichnung AS 'Sprache',
GROUP_CONCAT(DISTINCT st.Text SEPARATOR ', ') AS 'Stichwort',
IF(b.Anzahl!=0, 'Verfügbar', CONCAT('Verfügbar ab: ',
(SELECT DATE_FORMAT(DATE_ADD(ab.Enddatum, INTERVAL 1 DAY)
,'%d.%m.%Y') FROM `ausgeliehenes_buch` AS ab
WHERE ab.BuchID = b.BuchID
ORDER BY ab.Reserviert ASC, ab.Enddatum ASC LIMIT 1)))
AS 'Verfügbarkeit' FROM `buch` AS b
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
INNER JOIN `buch_hat_kategorie` AS bhk ON bhk.BuchID = b.BuchID
INNER JOIN `kategorie` AS k ON k.KategorieID = bhk.KategorieID
INNER JOIN `sprache` AS sp ON sp.SprachenID = b.SprachenID
INNER JOIN `buch_hat_stichwort` AS bhs ON bhs.BuchID = b.BuchID
INNER JOIN `stichwort` AS st ON st.StichwortID = bhs.StichwortID
GROUP BY b.BuchID
HAVING b.Titel LIKE '%$searchQuery%'
OR b.Erscheinungsjahr LIKE '%$searchQuery%'
OR b.Verlag LIKE '%$searchQuery%'
OR Autor LIKE '%$searchQuery%'
OR Kategorie LIKE '%$searchQuery%'
OR Inhalt LIKE '%$searchQuery%'
OR Sprache LIKE '%$searchQuery%'
OR Stichwort LIKE '%$searchQuery%';";
}
else if ($sourceForm == "extended") {
// Erweiterte Suche
// Eingegebene Daten in Variablen speichern
$dropdown1 = $_GET['dropdown1'];
$search1 = $_GET['search1'];
// Mögliche Whitspaces hinten und vorne entfernen
$search1 = trim($search1, " \t\n\r\0\x0B");
$andOr1 = $_GET['and_or1'];
if ($andOr1 == 'und') {
$andOr1 = 'AND';
}
else {
$andOr1 = 'OR';
}
$dropdown2 = $_GET['dropdown2'];
$search2 = $_GET['search2'];
// Mögliche Whitspaces hinten und vorne entfernen
$search2 = trim($search2, " \t\n\r\0\x0B");
$andOr2 = $_GET['and_or2'];
if ($andOr2 == 'und') {
$andOr2 = 'AND';
}
else {
$andOr2 = 'OR';
}
$dropdown3 = $_GET['dropdown3'];
$search3 = $_GET['search3'];
// Mögliche Whitspaces hinten und vorne entfernen
$search3 = trim($search3, " \t\n\r\0\x0B");
$startYear = $_GET['Buchdatum1'];
$startYear = substr($startYear, 0, 4);
$endYear = $_GET['Buchdatum2'];
$endYear = substr($endYear, 0, 4);
$yearQuery = '';
// Nur Startjahr
if ($startYear && !$endYear) {
$yearQuery = "WHERE b.Erscheinungsjahr > $startYear";
}
// Nur Endjahr
else if (!$startYear && $endYear) {
$yearQuery = "WHERE b.Erscheinungsjahr < $endYear";
}
// Start- und Endjahr
else if ($startYear && $endYear) {
$yearQuery = "WHERE b.Erscheinungsjahr
BETWEEN $startYear AND $endYear";
}
$language = $_GET['language'];
if ($language == 'Alle Sprachen') {
$language = '%%';
}
$available = isset($_GET['status']);
if ($available) {
$available = 'Verfügbar';
}
else {
$available = '%%';
}
// SQL-Befehl zusammenstellen
$sql = "SELECT b.BuchID, b.Titel, b.Erscheinungsjahr, b.Bild,
b.Verlag,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
GROUP_CONCAT(DISTINCT k.Name SEPARATOR ', ') AS 'Kategorie',
b.ISBN, b.Klappentext AS 'Inhalt', sp.Bezeichnung AS 'Sprache',
GROUP_CONCAT(DISTINCT st.Text SEPARATOR ', ') AS 'Stichwort',
IF(b.Anzahl!=0, 'Verfügbar', CONCAT('Verfügbar ab: ',
(SELECT DATE_FORMAT(DATE_ADD(ab.Enddatum, INTERVAL 1 DAY)
,'%d.%m.%Y') FROM `ausgeliehenes_buch` AS ab
WHERE ab.BuchID = b.BuchID
ORDER BY ab.Reserviert ASC, ab.Enddatum ASC LIMIT 1)))
AS 'Verfügbarkeit' FROM `buch` AS b
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
INNER JOIN `buch_hat_kategorie` AS bhk ON bhk.BuchID = b.BuchID
INNER JOIN `kategorie` AS k ON k.KategorieID = bhk.KategorieID
INNER JOIN `sprache` AS sp ON sp.SprachenID = b.SprachenID
INNER JOIN `buch_hat_stichwort` AS bhs ON bhs.BuchID = b.BuchID
INNER JOIN `stichwort` AS st ON st.StichwortID = bhs.StichwortID
$yearQuery
GROUP BY b.BuchID
HAVING $dropdown1 LIKE '%$search1%'
$andOr1 $dropdown2 LIKE '%$search2%'
$andOr2 $dropdown3 LIKE '%$search3%'
AND Sprache LIKE '$language'
AND Verfügbarkeit LIKE '$available';";
}
else {
// Form wurde nicht erkannt
}
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
$result = mysqli_query($connection, $sql);
$counter = 0;
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookPublishingYear = $row['Erscheinungsjahr'];
$bookPublisher = $row['Verlag'];
$bookAuthor = $row['Autor'];
$bookCategory = $row['Kategorie'];
$bookAvailability = $row['Verfügbarkeit'];
if ($counter != 0) {
echo "<div class='divider'></div>";
}
// TODO: OnClick Event auslagern
echo "<div id='book_container$bookID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover'
src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>Verfasser: $bookAuthor</p>
<p class='publishing_year'>
Erscheinungsjahr: $bookPublishingYear</p>
<p class='publisher'>
Verlag: $bookPublisher</p>
<p class='category'>
Kategorie: $bookCategory</p>
</div>
<div class='available_container'>
<p id='available_$bookID' class='available'>
$bookAvailability</p>
<!--TODO: Auslagern-->
<script type='text/javascript'
language='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$bookID');
var parentDiv =
currentElement.parentElement;
if (currentElement.innerHTML.trim()
== 'Verfügbar') {
parentDiv.style.backgroundColor
= '#70AD47';
}
else {
parentDiv.style.backgroundColor
= '#F34343';
}
})();
</script>
</div>
</div>
<!--TODO: OnClick Event auslagern-->
<div class='shoppingCart_container'
id='shoppingCart$bookID'
onclick='addBookToCart(this.id)'>
<div class='shoppingCart'></div>
</div>
</div>";
$counter++;
}
} else {
echo "Keine Ergebnisse.";
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
mysqli_close($connection);
?>
</div>
</div>
<!------------------------------------------------------------------------->
<!-- TODO: Auslagern (falls möglich) -->
<script>
function open_bookDetails(ID) {
var data = new URLSearchParams();
data.append("bookID", ID);
var url = "http://141.19.142.11/buch_details.php?" +
data.toString();
location.href = url;
}
function addBookToCart(ID) {
// OnClick Event für open_bookDetails stoppen
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
// ID abtrennen
ID = ID.replace('shoppingCart', '');
var request = new XMLHttpRequest();
request.open('POST',
'http://141.19.142.11/warenkorb_funktionen.php', true);
// TODO: Handler erstellen
request.onload = function() {
console.log(this.responseText);
}
request.setRequestHeader('Content-type',
'application/x-www-form-urlencoded');
request.send(`function=addBookToCart&id=${ID}`);
}
</script>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,85 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p2">
<span id="titlebraun"><strong> &Uuml;ber uns</strong></span>
<br><br>
In einer Zeit, die von Digitalisierung dominiert wird, werden immer mehr physische
Medien in digitale Systeme integriert. <br> Auch wenn dieses Phänomen auf den ersten Blick nur positiv erscheint,
zieht es auch große Nachteile mit sich. So ist zum Beispiel nicht jeder Mensch in der finanziellen Lage,
sich die nötigen technischen Geräte zu leisten. <br>Selbst wenn die Technik vorhanden ist, kann oder will nicht jeder damit umgehen,
manche haben vielleicht sogar gesundheitliche Probleme, die es Ihnen nicht ermöglichen,
für längere Zeit auf einem Bildschirm zu schauen. <br>
Unsere Bibliothek Candle hat es sich deshalb zum Ziel gesetzt, Bücher in einem greifbaren Zustand anzubieten.
Ob „Hamlet“, „Harry Potter“ oder „Der große Gatsby“, bei uns kommt jeder Bücherwurm auf den Geschmack.
</p>
</div>
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

95
uberuns.php 100644
View File

@ -0,0 +1,95 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Suchergebnisse</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p2">
<span id="titlebraun"><strong> &Uuml;ber uns</strong></span>
<br><br>
In einer Zeit, die von Digitalisierung dominiert wird,
werden immer mehr physische
Medien in digitale Systeme integriert.
<br>
Auch wenn dieses Phänomen auf den ersten Blick
nur positiv erscheint, zieht es auch große Nachteile mit sich.
So ist zum Beispiel nicht jeder Mensch in der finanziellen Lage,
sich die nötigen technischen Geräte zu leisten.
<br>
Selbst wenn die Technik vorhanden ist,
kann oder will nicht jeder damit umgehen,
manche haben vielleicht sogar gesundheitliche Probleme,
die es Ihnen nicht ermöglichen,
für längere Zeit auf einem Bildschirm zu schauen.
<br>
Unsere Bibliothek Candle hat es sich deshalb zum Ziel gesetzt,
Bücher in einem greifbaren Zustand anzubieten.
Ob „Hamlet“, „Harry Potter“ oder „Der große Gatsby“,
bei uns kommt jeder Bücherwurm auf den Geschmack.
</p>
</div>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -1,60 +0,0 @@
function checkFirstName() {
let regex_firstName = /[A-Z]/;
var firstName = document.getElementById("firstName");
var errorMessage = document.getElementById("errorMessage_firstName");
if (!(regex_firstName.test(firstName.value))) {
errorMessage.innerHTML = "HALLO!";
errorMessage.style.display = "block";
}
else {
errorMessage.style.display = "none";
}
}
function checkLastName() {
// Erlaubte Zeichen:
// Großbuchstaben -> [A-Z]
// Kleinbuchstaben -> [a-z]
// Bindestrich -> [-]
// Leerzeichen -> [ ]
const regex_lastName = /1/;
}
function checkStreetName() {
// Erlaubte Zeichen:
// Großbuchstaben -> [A-Z]
// Kleinbuchstaben -> [a-z]
// Bindestrich -> [-]
//
const regex_streetName = /1/;
}
function checkHouseNumber() {
const regex_houseNumber = /1/;
}
function checkPLZ() {
const regex_plz = /1/;
}
function checkCity() {
const regex_city = /1/;
}
function checkEmailAddress() {
const regex_emailAdress = /1/;
}
function checkRepeat_EmailAddress() {
}
function checkPassword() {
const regex_password = /1/;
}
function checkRepeat_Password() {
// Input des Felds password
var password = document.getElementById("password");
}

212
verlaengerung.php 100644
View File

@ -0,0 +1,212 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Verlängerung Meine Bücher</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<div class="hauptcontainer"id="verlängerung">
<h1 id="verlängerungH1">Buch verlängern</h1>
<div id="verlängerungContent">
<p id="möchten-sie">Möchten Sie das folgende Buch um 7 Tage verlängern?</p>
<div id="searchResult_container">
<?php
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
/* SQL-Befehl vorbereiten */
$sql = $connection->prepare("SELECT ab.AusleihID, ab.BuchID, b.Titel, b.Bild, ab.Verlängerbar, DATE_FORMAT(ab.Anfangsdatum, '%d.%m.%Y') as Anfangsdatum, DATE_FORMAT(ab.Enddatum, '%d.%m.%Y') as Enddatum,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) = Curdate(), 'Sofort Abholbereit',
(
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) > Curdate(),
CONCAT(
'Abholbereit am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Anfangsdatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
)
, CONCAT(
'Rückgabe am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Enddatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
))
)
)
AS 'Verfügbarkeit'
FROM ausgeliehenes_buch AS ab
INNER JOIN buch as b
ON ab.BuchID = b.BuchID
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
WHERE ab.AusleihID=?
GROUP BY ab.AusleihID;;");
// Parameter binden
$sql->bind_param("i", $ID);
// Übergebene ID des angeklickten Container speichern
$containerID = $_GET['ausleihID'];
// Buch ID abtrennen
$ID = str_replace('placeholder_container', '', $containerID);
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$ausleihID = $row['AusleihID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookAuthor = $row['Autor'];
$bookAvailability = $row['Verfügbarkeit'];
$bookExtendable = $row['Verlängerbar'];
$bookStartdate = $row['Anfangsdatum'];
$bookEnddate = $row['Enddatum'];
$bookStartdatePlusSeven = $bookStartdate +7;
/* TODO: OnClick auslagern. */
echo "<div id='book_container$bookID+$ausleihID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover' src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>von $bookAuthor</p>
</div>
<div class='available_container'>
<p id='available_$ausleihID' class='available'>
$bookAvailability</p>
</div>
<div>
<p id='bestellungsInfo$ausleihID'></p>
</div>
</div>
<div class='placeholder_container' id='placeholder_container$ausleihID'>
<div class='placeholder' id='placeholder$ausleihID'></div>
</div>
<script type='text/javascript'
language='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$ausleihID');
var parentDiv = currentElement.parentElement;
// Ausgeliehen und Verlängerbar
parentDiv.style.backgroundColor
= '#70AD47';
})();
</script>
</div>";
}
} else {
echo "Keine Infos vorhanden.";
echo $_POST['ausleihID'];
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
echo "
<div id='verlängerungButtonContainer'>
<a id = 'verlängerungButton1' href='verlaengerung_erfolgreich.php?ausleihID=$ID&buchID=$bookID'>Bestätigen</a>
<a id = 'verlängerungButton2' href='meinebuecher.php'>Abbrechen</a>
</div>";
mysqli_close($connection);
?>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,206 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="suchergebnisse.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Verlängerung Bestätigung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
<script src="notwendiges_laden.js" defer></script>
</head>
<body>
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.php">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.php">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
$ID = $_GET['ausleihID'];
$BookID = $_GET['buchID'];
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
$sql = $connection->prepare("
UPDATE `ausgeliehenes_buch` SET `Enddatum` = DATE_ADD(Enddatum,INTERVAL 7 DAY) WHERE `ausgeliehenes_buch`.`AusleihID` = ?;
");
$sql->bind_param("i", $ID);
$sql->execute();
$sql = $connection->prepare("SELECT ab.AusleihID, ab.BuchID, b.Titel, b.Bild, ab.Verlängerbar, DATE_FORMAT(ab.Anfangsdatum, '%d.%m.%Y') as Anfangsdatum, DATE_FORMAT(ab.Enddatum, '%d.%m.%Y') as Enddatum,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) = Curdate(), 'Sofort Abholbereit',
(
IF(
(SELECT ausgeliehenes_buch.Anfangsdatum FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID) > Curdate(),
CONCAT(
'Abholbereit am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Anfangsdatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
)
, CONCAT(
'Rückgabe am: ', (
SELECT DATE_FORMAT(
ausgeliehenes_buch.Enddatum , '%d.%m.%Y'
) FROM ausgeliehenes_buch WHERE ausgeliehenes_buch.AusleihID=ab.AusleihID
)
))
)
)
AS 'Verfügbarkeit'
FROM ausgeliehenes_buch AS ab
INNER JOIN buch as b
ON ab.BuchID = b.BuchID
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
WHERE ab.AusleihID=?
GROUP BY ab.AusleihID;;");
// Parameter binden
$sql->bind_param("i", $ID);
// Übergebene ID des angeklickten Container speichern
$containerID = $_GET['ausleihID'];
// Buch ID abtrennen
$ID = str_replace('placeholder_container', '', $containerID);
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$ausleihID = $row['AusleihID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookAuthor = $row['Autor'];
$bookAvailability = $row['Verfügbarkeit'];
$bookExtendable = $row['Verlängerbar'];
$bookStartdate = $row['Anfangsdatum'];
$bookEnddate = $row['Enddatum'];
$bookStartdatePlusSeven = $bookStartdate +7;
/* TODO: OnClick auslagern. */
echo " <div class='hauptcontainer'id='verlängerung'>
<h1 id='verlängerungH1'>Buch erfolgreich verlängert</h1>
<div id='verlängerungContent'>
<p id='möchten-sie'>Das Buch wurde verlängert.<br>Neues Rückgabedatum: $bookEnddate</p>
<div id='searchResult_container'>
<div id='book_container$bookID+$ausleihID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover' src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>von $bookAuthor</p>
</div>
<div class='available_container'>
<p id='available_$ausleihID' class='available'>
$bookAvailability</p>
</div>
<div>
<p id='bestellungsInfo$ausleihID'></p>
</div>
</div>
<div class='placeholder_container' id='placeholder_container$ausleihID'>
<div class='placeholder' id='placeholder$ausleihID'></div>
</div>
<script type='text/javascript'
language='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$ausleihID');
var parentDiv = currentElement.parentElement;
// Ausgeliehen und Verlängerbar
parentDiv.style.backgroundColor
= '#70AD47';
})();
</script>
</div>
<div id='verlängerungButtonContainer'>
<a id = 'verlängerungErfolgreichButton1' href='meinebuecher.php'>Zurück zu Meine Bücher</a>
</div>
</div>
</div>
</div>";
}
} else {
echo "Keine Infos vorhanden.";
echo $_POST['ausleihID'];
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
?>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

217
warenkorb.css 100644
View File

@ -0,0 +1,217 @@
/*TODO: Hintergrundfarben entfernen*/
.hauptcontainer {
/*Einzelne Elemente untereinander anzeigen.*/
flex-direction: column;
background-color: #987554;
}
#shoppingCart_heading {
/* background-color: #70AD47; */
margin-top: 30px;
margin-left: 30px;
margin-right: 50px;
font-weight: 500;
color: white;
}
#secondary_container {
display: flex;
flex-direction: row;
margin-left: 30px;
margin-right: 50px;
margin-bottom: 50px;
}
/*Container wird mit Daten aus der Datenbank gefüllt.*/
#cartItems_container {
padding: 15px;
background-color: #E5D3B3;
overflow-y:auto
}
.book_container {
/* background-color: blueviolet; */
display: flex;
/*Einzelne Elemente nebeneinander anzeigen.*/
flex-direction: row;
cursor: pointer;
min-width: 0;
}
.bookCover_container {
/* background-color: blue; */
display: flex;
/*Verbietet dem Container, seine Standardgröße (px) zu ändern.*/
flex: 0 0 150px;
align-items: center;
height: auto;
}
.bookCover {
/*Bild passt sich seinem Container an.*/
max-width:100%;
max-height:100%;
}
.bookDetails_container {
/* background-color: aquamarine; */
width: 100%;
display: flex;
flex-direction: column;
padding-left: 15px;
padding-right: 15px;
}
.bookTitle {
margin-bottom: 10px;
font-weight: 400;
}
.bookDetails {
margin-bottom: 10px;
}
.available_container {
width: fit-content;
/*Hintergrundfarbe wird an Inhalt angepasst.*/
background-color: #70AD47;
/*background-color: #F34343;*/
/*Element immer an der unteren Seite des Containers platzieren.*/
margin-top: auto;
}
.available {
color: white;
margin: 10px 25px;
}
.quantity_container {
/* background-color: chartreuse; */
display: flex;
margin-left: auto;
margin-top: auto;
flex: 0 0 40px;
}
.reduce_container {
/* background-color: coral; */
display: flex;
align-items: center;
}
.reduce {
background-image: url('pictures/remove.png');
width: 30px;
height: 30px;
background-size: contain;
background-repeat: no-repeat;
}
.reduce:hover {
background-image: url('pictures/remove_hover.png');
cursor: pointer;
}
.quantityText_container {
width: 30px;
background-color: white;
border-color: black;
border-style: solid;
border-width: 1px;
display: flex;
justify-content: center;
align-items: center;
cursor: default;
margin-left: 10px;
margin-right: 10px;
}
.add_container {
/* background-color: coral; */
display: flex;
align-items: center;
}
.add {
background-image: url('pictures/add.png');
width: 30px;
height: 30px;
background-size: contain;
background-repeat: no-repeat;
}
.add:hover {
background-image: url('pictures/add_hover.png');
cursor: pointer;
}
.trashCan_container {
/* background-color: chartreuse; */
padding-left: 20px;
margin-left: auto;
margin-top: auto;
flex: 0 0 30px;
}
.trashCan {
background-image: url('pictures/bin.png');
width: 30px;
height: 30px;
background-size: contain;
background-repeat: no-repeat;
}
.trashCan:hover {
background-image: url('pictures/bin_hover.png');
cursor: pointer;
}
.divider {
margin-top: 15px;
margin-bottom: 15px;
background-color: #987554;
width: 100%;
height: 1px;
}
#totalQuantity_container {
background-color: #E5D3B3;
margin-left: 25px;
display: flex;
flex-direction: column;
align-items: center;
/* TODO: Elegantere Lösung finden */
min-width: 200px;
max-width: 200px;
min-height: 70px;
max-height: 70px;
padding: 15px;
}
#reserveNow {
margin-top: 10px;
background-color: #664220;
width: 160px;
height: 40px;
color:white;
text-align: center;
border-radius: 50px;
font-size: medium;
border-width: 0px;
cursor: pointer;
}
/*----------------------------------------------------------------------------*/
@media screen and (max-width: 800px) {
#secondary_container {
flex-direction: column;
align-items: center;
}
#totalQuantity_container {
margin-top: 30px;
margin-left: 0px;
}
}

View File

@ -1,225 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="warenkorb.js" defer></script>
<script src="plusminusbutton.js" type="text/javascript" ></script>
<script src="store.js" ></script>
<title>Candle Bibliothek</title>
</head>
<body style="background-color:#987554;">
<header>
<script src="burgerIcon.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="meinebuecher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">Erweiterte Suche</a>
<a href="warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="main">
<h1 id="warenkorbHeader">
Warenkorb
</h1>
<div class="containerOfAll">
<!-- Change the `data-field` of buttons and `name` of input field's for multiple plus minus buttons-->
<!--First Item-->
<!-- <div class="items" >
<img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/>
<h3 class="headerinItem">
Percy Jackson: Diebe im Olymp
</h3>
<p class="discinItem">von Rick Riordan</p>
<a class="greenbutton" href="percy.html">Verfügbar</a>
-->
<!--Buttons-->
<!-- <div class="inputPlusMinus">
<div class="input-group plus-minus-input">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="minusButton" data-quantity="minus" data-field="quantity">
<i class="fa fa-minus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
<input class="input-group-field" type="number" name="quantity" value="1">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="plusButton" data-quantity="plus" data-field="quantity">
<i class="fa fa-plus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
</div>
<a class="binPicture" ><img src="pictures/bin.png" width="25" height="25"></a>
</div>
<hr style="width: 96%;">
</div>
-->
<!--Second Item-->
<!--
<div class="items">
<img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/>
<h3 class="headerinItem">
The Hundred and One Dalmatians
</h3>
<p class="discinItem">von Dodie Smith</p>
<a class="redbutton" href="dalmatians.html">Verfügbar ab: 30.04.2023</a>
-->
<!--Buttons-->
<!-- <div class="inputPlusMinus">
<div class="input-group plus-minus-input">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="minusButton" data-quantity="minus" data-field="quantity">
<i class="fa fa-minus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
<input class="input-group-field" type="number" name="quantity" value="1">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="plusButton" data-quantity="plus" data-field="quantity">
<i class="fa fa-plus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
</div>
<a class="binPicture" ><img src="pictures/bin.png" width="25" height="25"></a>
</div>
<hr style="width: 96%;">
</div>
-->
<!--Third Item-->
<!-- <div class="items">
<img src="pictures/penguin_highway.jpg" width="125" height="200"/>
<h3 class="headerinItem">
Penguin Highway
</h3>
<p class="discinItem">von Tomihiko Morimi</p>
<a class="greenbutton" href="penguin.html">Verfügbar</a>
-->
<!--Buttons-->
<!-- <div class="inputPlusMinus">
<div class="input-group plus-minus-input">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="minusButton" data-quantity="minus" data-field="quantity">
<i class="fa fa-minus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
<input class="input-group-field" type="number" name="quantity" value="0">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="plusButton" data-quantity="plus" data-field="quantity">
<i class="fa fa-plus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
</div>
<a class="binPicture"><img src="pictures/bin.png" width="25" height="25"></a>
</div>
<hr style="width: 96%;">
</div>
-->
<!--fourth Item-->
<!-- <div class="items" >
<img src="pictures/es.jpg" width="125" height="200"/>
<h3 class="headerinItem">
Es
</h3>
<p class="discinItem">von Stephen Kind</p>
<a class="redbutton" href="es.html" >Verfügbar ab: 10.05.2023</a>
-->
<!--Buttons-->
<!-- <div class="inputPlusMinus">
<div class="input-group plus-minus-input">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="minusButton" data-quantity="minus" data-field="quantity">
<i class="fa fa-minus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
<input class="input-group-field" type="number" name="quantity" value="0">
<div class="input-group-button">
<button type="button" class="button hollow circle" id="plusButton" data-quantity="plus" data-field="quantity">
<i class="fa fa-plus" style="opacity: 0.7;" aria-hidden="true"></i>
</button>
</div>
</div>
<a class="binPicture"><img src="pictures/bin.png" width="25" height="25"></a>
</div>
</div>
-->
</div>
<!--Reservieren-->
<div id="reservieren">
<h2 id="ArtikelWarenkorb"> 0 Artikel</h2>
<a id="jetztReservieren" href="anmelden.html">Jetzt reservieren</a>
</div>
</div>
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>

View File

@ -1,153 +0,0 @@
var parsed = [];
var addItemButton = document.getElementsByClassName("binPicture");
if (window.location.pathname.includes("/warenkorb.html")) {
document.addEventListener("DOMContentLoaded", function () {
var addItemButton = document.getElementById("jetztReservieren");
addItemButton.addEventListener('click', parseAttributes)
deleteItem()
});
}
if (window.location.pathname.includes("/meinebuecher.html")) {
document.addEventListener("DOMContentLoaded", function () {
warenkorby = localStorage.getItem("meinebuecher") || [];
const parsedArray = JSON.parse(warenkorby)
addingMeinBuecher(parsedArray)
}
);}
function deleteItem()
{
updateArticle()
//Dieser Code Block gehört zur Warenkorb Datei
for(var i = 0;i<addItemButton.length;i++)
{
var button = addItemButton[i]
button.addEventListener(('click'), function(event)
{
var buttonClicked = event.target
var diving = buttonClicked.parentElement.parentElement.parentElement;
// Set counter to Zero
var title = diving.getElementsByTagName('h3')[0].innerHTML
var getValue= localStorage.getItem(title) || 0;
diving.getElementsByClassName('input-group-field')[0].value = getValue;
localStorage.setItem(title, 0)
var title = diving.getElementsByTagName('h3')[0].innerHTML
var warenkorby = localStorage.getItem("items") || [];
var parsedArray = JSON.parse(warenkorby)
for(var j = 0;j<parsedArray.length;j++)
{
const parser = new DOMParser();
const parsedDocument = parser.parseFromString(parsedArray[j], "text/html");
var titling =parsedDocument.getElementsByTagName('h3')[0].innerHTML
var classred = parsedDocument.getElementsByTagName('a')[0].innerHTML
if(titling.includes(title) ||classred.includes("red") ) {
delete warenkorb[j];
const jsonArray = JSON.stringify(warenkorb);
localStorage.setItem('items', jsonArray);
break;
}
}
buttonClicked.parentElement.parentElement.parentElement.remove()
delete addItemButton[i]
var getArticleNumber = document.getElementById("ArtikelWarenkorb").innerHTML = addItemButton.length + " Artikel";
}
)
}
}
function updateArticle()
{
var getArticleNumber = document.getElementById("ArtikelWarenkorb").innerHTML = addItemButton.length + " Artikel";
}
function parseAttributes()
{
var warenkorby = localStorage.getItem("items") || [];
var parsedArray = JSON.parse(warenkorby)
for(var j =0 ;j<parsedArray.length;j++)
{
const parser = new DOMParser();
const parsedDocument = parser.parseFromString(parsedArray[j], "text/html");
var imaging =parsedDocument.getElementsByTagName('img')[0].src
var discription = parsedDocument.getElementsByTagName('p')[0].innerHTML
var titling = parsedDocument.getElementsByTagName('h3')[0].innerHTML
// var cartItems = document.getElementsByClassName('containerofbuecher')[0]
var cartRowConetent = `<div class="items" >
<img src="${imaging}" width="125" height="200"/>
<h3 class="headerinItem">
${titling}</h3>
<p class="discinItem">${discription}</p>
<a class="greenbutton" href="">Sofort Abholbereit</a>
<a class="binPicture" href=""><img src="pictures/bin.png" width="25" height="25"></a>
<p id="message">Diese Reservierung verfällt, wenn das Buch nicht bis zum 24.04.2023 abgeholt wurde.</p>
<hr style="width: 90%;">
</div>
`
parsed.push(cartRowConetent)
}
// convert array to JSON string using JSON.stringify()
const jsonArray = JSON.stringify(parsed);
// save to localStorage using "array" as the key and jsonArray as the value
localStorage.setItem('meinebuecher', jsonArray);
localStorage.removeItem('items');
}
function addingMeinBuecher(wat) {
// var cartItems = document.getElementsByClassName('containerOfAll')[0];
for (var i = 0; i < wat.length; i++) {
/* var cartRow = document.createElement('div');
cartRow.insertAdjacentHTML('beforeend', wat[i]);
cartItems.appendChild(cartRow);
*/
insertHTMLStringToContainer(wat[i],"containerofmeinebuecher")
}
}
function insertHTMLStringToContainer(htmlString, containerId) {
var container = document.getElementsByClassName(containerId)[0];
container.insertAdjacentHTML('beforeend', htmlString);
}
function addingAll(wat) {
// var cartItems = document.getElementsByClassName('containerOfAll')[0];
for (var i = 0; i < wat.length; i++) {
/* var cartRow = document.createElement('div');
cartRow.insertAdjacentHTML('beforeend', wat[i]);
cartItems.appendChild(cartRow);
*/
insertHTMLStringToContainer(wat[i],"containerOfAll")
}
}

384
warenkorb.php 100644
View File

@ -0,0 +1,384 @@
<!--
TODO:
- Seite ist noch nicht erreichbar
- Löschbestätigung -> removeBookFromCart verschieben
TODO (optional, geringe Priorität):
- 80 Zeichen
- JS Funktionen größtmöglich auslagern
- Mengenfeld bearbeitbar machen
- Layout verbessern (z.B. resize)
-->
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="Stylesheet" type="text/css" href="warenkorb.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Warenkorb</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body onload="on_load()">
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.html" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<!------------------------------------------------------------------------->
<div class="hauptcontainer">
<h1 id="shoppingCart_heading">Warenkorb</h1>
<div id="secondary_container">
<div id='cartItems_container'>
<?php
session_start();
// Counter für Divider
$counter = 0;
// Überprüfen, ob Bücher im Warenkorb liegen
if(isset($_SESSION['cart']) && !empty($_SESSION['cart'])) {
// Es liegen Bücher im Warenkorb
// Alle Elemente im Warenkorb durchgehen
foreach ($_SESSION["cart"] as $key=>$item) {
$quantity = $item['quantity'];
$sql = '';
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
/* SQL-Befehl vorbereiten */
$sql = $connection->prepare("SELECT b.BuchID, b.Titel,
b.Bild,
GROUP_CONCAT(DISTINCT CONCAT(a.VorName, ' ', a.NachName)
SEPARATOR ', ') AS 'Autor',
IF(b.Anzahl!=0, 'Verfügbar', CONCAT('Verfügbar ab: ',
(SELECT DATE_FORMAT(DATE_ADD(ab.Enddatum, INTERVAL 1 DAY)
,'%d.%m.%Y') FROM `ausgeliehenes_buch` AS ab
WHERE ab.BuchID = b.BuchID
ORDER BY ab.Reserviert ASC, ab.Enddatum ASC LIMIT 1)))
AS 'Verfügbarkeit' FROM `buch` AS b
INNER JOIN `buch_verfasst_von_autor` AS bvva
ON b.BuchID = bvva.BuchID
INNER JOIN `autor` AS a ON bvva.AutorNr = a.AutorNr
WHERE b.BuchID = ?
GROUP BY b.BuchID;");
// Parameter binden
$sql->bind_param("i", $ID);
// ID festlegen
$ID = $key;
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if ($counter != 0) {
echo "<div class='divider'></div>";
}
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$bookCover = $row['Bild'];
$bookTitle = $row['Titel'];
$bookAuthor = $row['Autor'];
$bookAvailability = $row['Verfügbarkeit'];
// TODO: OnClick auslagern.
echo "<div id='book_container$bookID' class='book_container'
onclick='open_bookDetails(this.id)'>
<div class='bookCover_container'>
<img class='bookCover'
src='book_covers/$bookCover'
alt='Kein Bild vorhanden'>
</div>
<div class='bookDetails_container'>
<h2 class='bookTitle'>$bookTitle</h2>
<div class='bookDetails'>
<p class='author'>von $bookAuthor</p>
</div>
<div class='available_container'>
<p id='available_$bookID' class='available'>
$bookAvailability</p>
<!--TODO: Auslagern-->
<script type='text/javascript'
language='JavaScript'>
(function() {
var currentElement = document.
getElementById('available_$bookID');
var parentDiv =
currentElement.parentElement;
if (currentElement.innerHTML.trim()
== 'Verfügbar') {
parentDiv.style.backgroundColor
= '#70AD47';
}
else {
parentDiv.style.backgroundColor
= '#F34343';
}
})();
</script>
</div>
</div>
<!--TODO: OnClick Event auslagern-->
<div class='quantity_container'>
<div class='reduce_container'
id='reduce$bookID'
onclick='decreaseQuantity(this.id)'>
<div class='reduce'></div>
</div>
<div class='quantityText_container'>
<p class='quantityText'
id='quantityText$bookID'>$quantity</p>
</div>
<div class='add_container'
id='add$bookID'
onclick='increaseQuantity(this.id)'>
<div class='add'></div>
</div>
</div>
<div class='trashCan_container'
id='trashCan$bookID'
onclick='removeBookFromCart(this.id)'>
<div class='trashCan'></div>
</div>
</div>";
$counter++;
}
} else {
echo "Keine Ergebnisse.";
}
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
mysqli_close($connection);
$counter++;
}
}
else {
// Es liegen keine Bücher im Warenkorb
echo
"Der Warenkorb ist leer,
bitte fügen Sie Bücher hinzu.";
}
?>
</div>
<div id='totalQuantity_container'>
<div id='totalQuantityText_container'>
<p id='totalQuantityText'>? Artikel</p>
</div>
<input type='button' id='reserveNow'
onclick='open_reservation()' value='Jetzt reservieren'>
</div>
</div>
</div>
<!------------------------------------------------------------------------->
<!-- TODO: Auslagern (falls möglich) -->
<script>
/*
* Überprüft, ob Bücher im Warenkorb existieren.
* Ist die nicht der Fall, wird der "Jetzt reservieren" Button
* deaktiviert.
*/
function on_load() {
var book_container =
document.getElementsByClassName("book_container");
if (book_container.length > 0) {
// Bücher existieren, Button aktivieren
document.getElementById("reserveNow").disabled = false;
getTotalQuantity();
}
else {
// Bücher existieren nicht, Button deaktivieren
document.getElementById("reserveNow").disabled = true;
document.getElementById("totalQuantityText").innerHTML
= "0 Artikel";
}
}
function getTotalQuantity() {
const collection = document.getElementsByClassName("quantityText");
var totalAmount = 0;
for (var i = 0; i < collection.length; i++) {
totalAmount = totalAmount + parseInt(collection[i].innerHTML);
}
document.getElementById("totalQuantityText").innerHTML
= `${totalAmount} Artikel`;
}
function open_bookDetails(ID) {
var data = new URLSearchParams();
data.append("bookID", ID);
var url = "http://141.19.142.11/buch_details.php?" +
data.toString();
location.href = url;
}
function decreaseQuantity(ID) {
// OnClick Event für open_bookDetails stoppen
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
// ID abtrennen
ID = ID.replace('reduce', '');
var request = new XMLHttpRequest();
request.open('POST',
'http://141.19.142.11/warenkorb_funktionen.php', true);
// TODO: Handler erstellen
request.onload = function() {
console.log(this.responseText);
// Überprüfen, ob die Menge im Warenkorb verringert wurde
if (this.responseText.includes('Erfolgreich verringert')) {
toChange = document.getElementById(`quantityText${ID}`);
toChange.innerHTML = parseInt(toChange.innerHTML) - 1;
getTotalQuantity();
}
}
request.setRequestHeader('Content-type',
'application/x-www-form-urlencoded');
request.send(`function=decreaseQuantity&id=${ID}`);
}
function increaseQuantity(ID) {
// OnClick Event für open_bookDetails stoppen
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
// ID abtrennen
ID = ID.replace('add', '');
var request = new XMLHttpRequest();
request.open('POST',
'http://141.19.142.11/warenkorb_funktionen.php', true);
// TODO: Handler erstellen
request.onload = function() {
console.log(this.responseText);
// Überprüfen, ob die Menge im Warenkorb erhöht wurde
if (this.responseText.includes('Erfolgreich erhöht')) {
toChange = document.getElementById(`quantityText${ID}`);
toChange.innerHTML = parseInt(toChange.innerHTML) + 1;
getTotalQuantity();
}
}
request.setRequestHeader('Content-type',
'application/x-www-form-urlencoded');
request.send(`function=increaseQuantity&id=${ID}`);
}
function removeBookFromCart(ID) {
// OnClick Event für open_bookDetails stoppen
if (!e) var e = window.event;
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
// ID abtrennen
ID = ID.replace('trashCan', '');
var request = new XMLHttpRequest();
request.open('POST',
'http://141.19.142.11/warenkorb_funktionen.php', true);
// TODO: Handler erstellen
request.onload = function() {
console.log(this.responseText);
// Überprüfen, ob das Buch aus dem Warenkorb entfernt wurde
if (this.responseText.includes('Erfolgreich entfernt')) {
window.location.reload(true);
}
}
request.setRequestHeader('Content-type',
'application/x-www-form-urlencoded');
request.send(`function=removeBookFromCart&id=${ID}`);
}
function open_reservation() {
var url = "http://141.19.142.11/anmelden.php";
location.href = url;
}
</script>
<!------------------------------------------------------------------------->
<!--Link JS file-->
<script src="burgerIcon.js"></script>
<!--If it was small and got big,
it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>

View File

@ -0,0 +1,134 @@
<!DOCTYPE html>
<html>
<?php
// Session starten
session_start();
if (isset($_POST['function'])) {
$function = $_POST['function'];
switch($function) {
case 'addBookToCart':
addBookToCart($_POST['id']);
break;
case 'removeBookFromCart':
removeBookFromCart($_POST['id']);
break;
case 'increaseQuantity':
increaseQuantity($_POST['id']);
break;
case 'decreaseQuantity':
decreaseQuantity($_POST['id']);
break;
default:
echo "Funktion existiert nicht.";
}
}
/**
* Fügt ein Buch zum Warenkorb hinzu.
*/
function addBookToCart($bookID) {
// Überprüfen, ob bereits ein Warenkorb hinterlegt ist
if (!(isset($_SESSION['cart']))) {
// Wenn nicht, Einkaufswagen hinterlegen
$_SESSION['cart'] = array();
}
// Wurde das Buch bereits zum Warenkorb hinzugefügt?
if (isset($_SESSION['cart'][$bookID])) {
// Buch liegt bereits im Warenkorb, Menge erhöhen
increaseQuantity($bookID);
}
else {
// Buch liegt noch nicht im Warenkorb, jetzt hinzufügen
$_SESSION['cart'][$bookID] = array('quantity' => 1);
}
}
/**
* Entfernt ein Buch aus dem Warenkorb.
*/
function removeBookFromCart($bookID) {
// Überprüfen, ob das Buch im Warenkorb liegt
if (isset($_SESSION['cart'][$bookID])) {
// Buch existiert im Warenkorb, kann gelöscht werden
unset($_SESSION['cart'][$bookID]);
echo "Erfolgreich entfernt.";
}
}
/**
* Erhöht die Menge eines Buches im Warenkorb.
*/
function increaseQuantity($bookID) {
// Verbinden mit der Datenbank
$servername = "localhost";
$username = "web_b-3";
$password = "een7Ao6s";
$dbname = "bibliothek_candle";
$connection =
mysqli_connect($servername, $username, $password, $dbname);
if (!$connection) {
die("Verbindung fehlgeschlagen: " . mysqli_connect_error());
}
// SQL-Befehl vorbereiten
$sql = $connection->prepare(
"SELECT b.BuchID, b.MaxAnzahl
FROM `buch` AS b
WHERE b.BuchID = ?;");
// Parameter binden
$sql->bind_param("i", $bookID);
// SQL-Befehl ausführen
$sql->execute();
// Ergebnis speichern
$result = $sql->get_result();
if (!$result) {
die("Ungültige SQL-Abfrage: " . mysqli_connect_error());
}
// Ergebnis verarbeiten
if (mysqli_num_rows($result) > 0) {
while($row = mysqli_fetch_assoc($result)) {
$bookID = $row['BuchID'];
$bookMaxQuantity = $row['MaxAnzahl'];
}
} else {
echo "Kein Buch mit dieser ID vorhanden.";
}
// Verbindung schließen
mysqli_close($connection);
// Wurde die maximale Menge bereits erreicht?
if ($_SESSION['cart'][$bookID]['quantity'] < $bookMaxQuantity) {
/* Maximale Menge wurde noch nicht erreicht, die Menge im
Warenkorb kann erhöht werden */
$_SESSION['cart'][$bookID]['quantity'] += 1;
echo "Erfolgreich erhöht.";
}
}
/**
* Verringert die Menge eines Buches im Warenkorb.
*/
function decreaseQuantity($bookID) {
// Ist die Menge höher als 1?
if ($_SESSION['cart'][$bookID]['quantity'] > 1) {
// Menge des Buches kann verringert werden
$_SESSION['cart'][$bookID]['quantity'] -= 1;
echo "Erfolgreich verringert.";
}
}
?>
</html>

View File

@ -0,0 +1,121 @@
<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Warenkorb</title>
<link rel="icon" href="pictures/candle.png">
<script src="notwendiges_laden.js" defer></script>
</head>
<body style="background-color:#987554;">
<header id="header">
<h1 class="kopf" >
<br><br>
Bibliothek
<a href="index.php" id="bildID">
<img id="CandleID" src="pictures/candle.png"
alt="Bild von einer Kerze" width="200" height="192"/></a>
<br><br>
Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.php">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.php">
Meine Bücher</a>
<?php
session_start();
if(isset($_SESSION["eingeloggt"]) && $_SESSION["eingeloggt"] == 1 ){
echo "<a id='abmelden' href='abmelden.php'>Abmelden</a>";}
?>
<form action="suchergebnisse.php">
<input type="hidden" name="searchType" value="simple">
<input name="searchFor" class="suchleiste" type="search"
placeholder="Suche...">
<button type="submit" id="buttonID" class="searchButton">
<i class="fa fa-search"></i>
</button>
</form>
<a id="erweitertesuche" href="erweitertesuche.html">
Erweiterte Suche</a>
<a href="warenkorb.php" id="warenKorbID">
<img id="shoppingCard" src="pictures/einkaufswagen.png"
alt="Bild von einem Wagen" width="50" height="50"/>
</a>
</div>
</header>
<?php
session_start();
$db_link = mysqli_connect('localhost', 'web_b-3', 'een7Ao6s', 'bibliothek_candle', '3306');
function runSQL($sql){
global $db_link;
$db_res = mysqli_query($db_link, $sql);
if(!$db_res){
header("Location: 404.html");
exit;
}
return $db_res;
}
if(isset($_POST['submit'])){
$kartenid = $_POST['karten-id'];
$passwort = $_POST['password'];
$existiert = runSQL("SELECT COUNT(*) FROM `benutzer` WHERE `KartenID` = '$kartenid' and `Passwort` = '$passwort'");
$karteexistiert = runSQL("SELECT COUNT(*) FROM `benutzer` WHERE `KartenID` = '$kartenid'");
$zeile = mysqli_fetch_array($karteexistiert);
$row = mysqli_fetch_array($existiert);
if($row['COUNT(*)'] > 0){
$_SESSION['eingeloggt'] = 1;
echo '
<div class="main">
<h1 id="warenkorbHeader">
Warenkorb
</h1>
<div class="containerOfAll">
</div>
<!--Reservieren-->
<div id="reservieren">
<h2 id="ArtikelWarenkorb"> </h2>
<a id="jetztReservieren" href="reservierung.php">Jetzt reservieren</a>
</div>
</div>
<script src="resize.js"></script>
<nav id="activeid" class="active"></nav>
<footer id="footer" class="fuss" ></footer>
</body>
</html>';
}else if($zeile['COUNT(*)'] > 0){
header("Location: passwort_stimmt_nicht.php");
}else{
header("Location: benutzer_existiert_nicht.php");
}
}else{
header("Location: 404.html");
}
?>