New Master Started
|
@ -0,0 +1,49 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>404 - Page Or Resource Not Found</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 24pt;
|
||||
background-color: #000;
|
||||
color: #000;
|
||||
}
|
||||
.container {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
padding: 40px auto;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
h1 {
|
||||
color: #a12727;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
a {
|
||||
color:white;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.links {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
.links a {
|
||||
margin: 0px 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>404 - Page Or Resource Not Found</h1>
|
||||
<div class="links">
|
||||
<a href="/">Bring me back home</a>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
|
@ -0,0 +1,202 @@
|
|||
<!DOCTYPE html>
|
||||
<?php
|
||||
session_start();
|
||||
if(isset($_SESSION['eingeloggt']) && $_SESSION['eingeloggt'] == 1 ){
|
||||
echo '
|
||||
|
||||
<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">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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="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="meinebuecher.html">Abbrechen</a>
|
||||
</div>
|
||||
|
||||
<br><br><br>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--------------------------------------------------------------------->
|
||||
|
||||
<!--Link JS file-->
|
||||
<script src="burgerIcon.js"></script>
|
||||
|
||||
<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>';
|
||||
|
||||
}else{
|
||||
echo '
|
||||
<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">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.html">Abmelden</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="anmelden.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="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.html">zurück zur Startseite</a>
|
||||
|
||||
</div>
|
||||
|
||||
<br><br><br>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--------------------------------------------------------------------->
|
||||
|
||||
<!--Link JS file-->
|
||||
<script src="burgerIcon.js"></script>
|
||||
|
||||
<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>';
|
||||
}
|
||||
|
||||
?>
|
|
@ -0,0 +1,102 @@
|
|||
<!DOCTYPE html>
|
||||
<?php
|
||||
session_start();
|
||||
$_SESSION['eingeloggt'] = 3;
|
||||
|
||||
echo '
|
||||
<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">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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="logOffSuccessfulTitle">Erfolgreich abgemeldet</h1>
|
||||
</div>
|
||||
<div class="mainContent">
|
||||
<p id="mainText">
|
||||
Sie wurden abgemeldet.
|
||||
<br><br>
|
||||
|
||||
<div class="buttonContainer">
|
||||
<a id="backToHomeButton" href="index.html">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>
|
||||
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>';
|
||||
?>
|
|
@ -0,0 +1,226 @@
|
|||
<?php
|
||||
session_start();
|
||||
if($_SESSION['eingeloggt'] == 3 ){
|
||||
echo '<!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>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script type="text/javascript">
|
||||
sessionStorage.setItem("clicked-last", "warenkorb.html")
|
||||
</script>
|
||||
|
||||
|
||||
<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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.png" alt="Bild von einem Wagen"
|
||||
width="50" height="50"/> </a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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.html">Datenschutz</a>.</p>
|
||||
</div>
|
||||
|
||||
<div class="anmeldeInput">
|
||||
<h2 class="anmeldung-überschriften">Angaben zur Anmeldung</h2>
|
||||
<hr>
|
||||
|
||||
<div>
|
||||
<form class="anmeldung-überschriften" action="warenkorb.php">
|
||||
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>
|
||||
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>';
|
||||
}else{
|
||||
|
||||
echo '<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">
|
||||
</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" style="height:200px;" >
|
||||
<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.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.html">Abmelden</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.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.png" alt="Bild von einem Wagen"
|
||||
width="50" height="50"/> </a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<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.html">Jetzt reservieren</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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>';
|
||||
|
||||
|
||||
}
|
||||
|
||||
?>
|
|
@ -0,0 +1,204 @@
|
|||
<?php
|
||||
session_start();
|
||||
|
||||
if($_SESSION['eingeloggt'] == 3 ){
|
||||
echo '<!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>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script type="text/javascript">
|
||||
sessionStorage.setItem("clicked-last", "warenkorb.html")
|
||||
</script>
|
||||
|
||||
|
||||
<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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.png" alt="Bild von einem Wagen"
|
||||
width="50" height="50"/> </a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<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.html">Datenschutz</a>.</p>
|
||||
</div>
|
||||
|
||||
<div class="anmeldeInput">
|
||||
<h2 class="anmeldung-überschriften">Angaben zur Anmeldung</h2>
|
||||
<hr>
|
||||
|
||||
<div>
|
||||
<form class="anmeldung-überschriften" action="meinebuecher.php">
|
||||
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>
|
||||
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>';
|
||||
}else{
|
||||
echo '<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 | Meine Bücher</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<h1 class="kopf" style="height:200px;" >
|
||||
<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.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.html">Abmelden</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.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.png" alt="Bild von einem Wagen"
|
||||
width="50" height="50"/> </a>
|
||||
</div>
|
||||
</header>
|
||||
<div class="containerofmeinebuecher">
|
||||
<p id="meinebüchertitel">Meine Bücher</p>
|
||||
</div>
|
||||
<!--Link JS file-->
|
||||
<script src="burgerIcon.js"></script>
|
||||
|
||||
<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>
|
||||
</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>';
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,146 @@
|
|||
<!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 | Bücher</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.png" alt="Bild von einem Wagen"
|
||||
width="50" height="50"/> </a>
|
||||
</div>
|
||||
</header>
|
||||
<div class="containerofbuecher">
|
||||
<p id="büchertitel">Bücher</p>
|
||||
<!--First Item-->
|
||||
<div id="firstItem" class="items" >
|
||||
<a href="percy.html"><img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/></a>
|
||||
|
||||
<h3 class="headerinItem">
|
||||
<a href="percy.html">Percy Jackson: Diebe im Olymp</a>
|
||||
</h3>
|
||||
<p class="discinItem">Verfasser: Rick Riordan <br>
|
||||
Erscheinungsjahr: 2010 <br>
|
||||
Verlag: Carlsen <br>
|
||||
Kategorie: Fantasy
|
||||
</p>
|
||||
<a class="greenbutton" href="percy.html">Verfügbar</a>
|
||||
<a class="binPicture" href=""><img src="pictures/shopping_cart.png" width="25" height="25"></a>
|
||||
<hr style="width: 92%;">
|
||||
</div>
|
||||
|
||||
<!--Second Item-->
|
||||
<div id="secondItem" class="items">
|
||||
<a href="dalmatians.html"><img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/></a>
|
||||
<h3 class="headerinItem">
|
||||
<a href="dalmatians.html">The Hundred and One Dalmatians</a>
|
||||
</h3>
|
||||
<p class="discinItem">Verfasser: Dodie Smith <br>
|
||||
Erscheinungsjahr: 2015 <br>
|
||||
Verlag: Farshore <br>
|
||||
Kategorie: Kinderbuch
|
||||
</p>
|
||||
<a class="redbutton" href="dalmatians.html">Verfügbar ab: 30.04.2023</a>
|
||||
<a class="binPicture" href="anmelden.php"><img src="pictures/shopping_cart.png" width="25" height="25"></a>
|
||||
<hr style="width:92%;">
|
||||
|
||||
</div>
|
||||
|
||||
<!--Third Item-->
|
||||
<div id="thirdItem" class="items">
|
||||
<a href="penguin.html"><img src="pictures/penguin_highway.jpg" width="125" height="200"/></a>
|
||||
|
||||
<h3 class="headerinItem">
|
||||
<a href="penguin.html">Penguin Highway</a>
|
||||
|
||||
</h3>
|
||||
<p class="discinItem">Verfasser: Tomihiko Morimi <br>
|
||||
Erscheinungsjahr: 2019 <br>
|
||||
Verlag: Yen On <br>
|
||||
Kategorie: Fantasy
|
||||
</p>
|
||||
<a class="greenbutton" href="penguin.html">Verfügbar</a>
|
||||
<a class="binPicture" href=""><img src="pictures/shopping_cart.png" width="25" height="25"></a>
|
||||
<hr style="width: 92%;">
|
||||
|
||||
</div>
|
||||
|
||||
<!--fourth Item-->
|
||||
<div id="fourthItem" class="items" >
|
||||
<a href="es.html"><img src="pictures/es.jpg" width="125" height="200"/></a>
|
||||
|
||||
<h3 class="headerinItem">
|
||||
<a href="es.html">Es</a>
|
||||
</h3>
|
||||
<p class="discinItem">Verfasser: Stephen King <br>
|
||||
Erscheinungsjahr: 2011 <br>
|
||||
Verlag: Heyne <br>
|
||||
Kategorie: Horror
|
||||
</p>
|
||||
<a class="redbutton" href="es.html" >Verfügbar ab: 10.05.2023</a>
|
||||
<a class="binPicture" href=""><img src="pictures/shopping_cart.png" width="25" height="25"></a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!--Link JS file-->
|
||||
<script src="burgerIcon.js"></script>
|
||||
<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>
|
||||
</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>
|
||||
|
|
@ -0,0 +1,160 @@
|
|||
|
||||
|
||||
function openNav() {
|
||||
var showNav = `
|
||||
#CandleID{
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#uberuns{
|
||||
pointer-events: auto;
|
||||
opacity: 1;
|
||||
}
|
||||
#abmelden{
|
||||
pointer-events: auto;
|
||||
opacity: 1;
|
||||
}
|
||||
#buecher{
|
||||
pointer-events: auto;
|
||||
opacity: 1;
|
||||
}
|
||||
#meinebuecher{
|
||||
pointer-events: auto;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#nav-toggle {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
.suchleiste{
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
#buttonID{
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
.suchleiste{
|
||||
position: fixed;
|
||||
right: 280px;
|
||||
top: 0px;
|
||||
}
|
||||
#buttonID{
|
||||
position: fixed;
|
||||
right: 240px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
#uberuns{
|
||||
position: fixed;
|
||||
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: 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: 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;
|
||||
}
|
||||
|
||||
|
||||
`;
|
||||
var closeNav = `#CandleID{
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
|
||||
`;
|
||||
if (document.getElementById('nav-toggle').checked) {
|
||||
var styleSheet = document.createElement("style")
|
||||
styleSheet.innerText = showNav
|
||||
document.head.appendChild(styleSheet)
|
||||
} else {
|
||||
var link = document.createElement('link');
|
||||
|
||||
// set the attributes for link element
|
||||
link.rel = 'stylesheet';
|
||||
|
||||
link.type = 'text/css';
|
||||
|
||||
link.href = 'style.css';
|
||||
|
||||
// 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)
|
||||
}
|
||||
}
|
||||
|
||||
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 = 'style.css';
|
||||
link.media = 'all';
|
||||
// Get HTML head element to append
|
||||
// link element to it
|
||||
//document.getElementsByTagName('head').appendChild(link);
|
||||
head.appendChild(link);
|
||||
|
||||
var styleSheet = document.createElement("style")
|
||||
styleSheet.innerText = closeNav
|
||||
document.head.appendChild(styleSheet)
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<?php
|
||||
$db_link = mysqli_connect('localhost', 'root', '', 'bibliothek');
|
||||
|
||||
if(!$db_link){
|
||||
die("<p>Verbindung nicht hergestellt</p>");
|
||||
}else{
|
||||
echo "Verbindung hergestellt!";
|
||||
}
|
||||
|
||||
function runSQL($sql){
|
||||
global $db_link;
|
||||
$db_res = mysqli_query($db_link, $sql) or die("SQL_Abfrage: " . $sql . "Fehler: " . mysqli_error($db_link));
|
||||
return $db_res;
|
||||
}
|
||||
?>
|
|
@ -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" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
<title>Candle Bibliothek | The Hundred and One Dalmatians</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.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 Vil! 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>
|
||||
Sprache: 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>
|
||||
</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>
|
|
@ -0,0 +1,96 @@
|
|||
<!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 | Datenschutz</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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>
|
||||
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>
|
|
@ -0,0 +1,138 @@
|
|||
<!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">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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="">
|
||||
<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>
|
||||
</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>
|
|
@ -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" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
<title>Candle Bibliothek | Es</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.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>
|
||||
Sprache: 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>
|
||||
</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>
|
|
@ -0,0 +1,90 @@
|
|||
<!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 | Impressum</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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>
|
||||
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>
|
|
@ -0,0 +1,98 @@
|
|||
<!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 | Home</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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>
|
||||
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>
|
|
@ -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 | Kontakt</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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>
|
||||
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>
|
|
@ -0,0 +1,87 @@
|
|||
<!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>
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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">Die Reservierung wurde erfolgreich aufgehoben.</p>
|
||||
|
||||
<div id="verlängerungButtonContainer">
|
||||
<a id = "verlängerungErfolgreichButton1" href="meinebuecher.html">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>
|
||||
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>
|
|
@ -0,0 +1,87 @@
|
|||
<!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>
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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.html">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>
|
||||
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>
|
|
@ -0,0 +1,97 @@
|
|||
<!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 Meine Bücher</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
<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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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">Reservierung stornieren</h1>
|
||||
<div id="verlängerungContent">
|
||||
<p id="möchten-sie">Möchten Sie die Reservierung für das folgende Buch wirklich stornieren?</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">Abholbereit am: 03.05.2023</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="verlängerungButtonContainer">
|
||||
<a id = "verlängerungButton1" href="loeschenErfolgreich_meine_buecher.html">Bestätigen</a>
|
||||
<a id = "verlängerungButton2" href="meinebuecher.html">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>
|
||||
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>
|
|
@ -0,0 +1,97 @@
|
|||
<!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>
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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.html">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>
|
||||
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>
|
|
@ -0,0 +1,84 @@
|
|||
<!DOCTYPE html>
|
||||
<?php
|
||||
session_start();
|
||||
$_SESSION['eingeloggt'] = 1;
|
||||
echo '<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 | Meine Bücher</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.png" alt="Bild von einem Wagen"
|
||||
width="50" height="50"/> </a>
|
||||
</div>
|
||||
</header>
|
||||
<div class="containerofmeinebuecher">
|
||||
<p id="meinebüchertitel">Meine Bücher</p>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!--Link JS file-->
|
||||
<script src="burgerIcon.js"></script>
|
||||
|
||||
<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>
|
||||
</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>';
|
||||
|
||||
?>
|
|
@ -0,0 +1,99 @@
|
|||
<!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 | Penguin Highway</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.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>
|
||||
</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>
|
|
@ -0,0 +1,102 @@
|
|||
<!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 | Percy Jackson: Diebe im Olymp</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.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 Götter 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>
|
||||
</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>
|
After Width: | Height: | Size: 11 KiB |
After Width: | Height: | Size: 1.1 MiB |
After Width: | Height: | Size: 27 KiB |
After Width: | Height: | Size: 177 KiB |
After Width: | Height: | Size: 20 KiB |
After Width: | Height: | Size: 22 KiB |
After Width: | Height: | Size: 77 KiB |
After Width: | Height: | Size: 196 KiB |
After Width: | Height: | Size: 19 KiB |
After Width: | Height: | Size: 27 KiB |
After Width: | Height: | Size: 20 KiB |
After Width: | Height: | Size: 239 KiB |
After Width: | Height: | Size: 667 KiB |
|
@ -0,0 +1,89 @@
|
|||
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");
|
||||
|
||||
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 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">
|
||||
//var addItemButton = document.getElementsByClassName("input-group-field");
|
||||
|
||||
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;
|
||||
if(getValue < 10){
|
||||
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--;
|
||||
}
|
||||
shopItem.getElementsByClassName('input-group-field')[0].value = getValue;
|
||||
localStorage.setItem(title, getValue)
|
||||
|
||||
|
||||
}
|
|
@ -0,0 +1,175 @@
|
|||
<!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">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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">
|
||||
|
||||
<!--Bei action wird später eine php-Datei eingefügt,
|
||||
welche sich um die Verarbeitung der Daten kümmert.-->
|
||||
<form id="registrierungForm" action="">
|
||||
<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="button" value="Registrieren" id="registrierenKnopf" class="registrierenKnopf">
|
||||
</div>
|
||||
|
||||
<br><br>
|
||||
|
||||
<details>
|
||||
<summary>Sie habe bereits ein Konto?</summary>
|
||||
<p id="registrierenAusklappe"> <a href="anmelden_warenkorb.html"> Jetzt anmelden</a></p>
|
||||
</details>
|
||||
</div>
|
||||
</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>
|
||||
<script src="registrierung_verhalten.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
|
@ -0,0 +1,175 @@
|
|||
<!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">
|
||||
</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="anmelden.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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">
|
||||
|
||||
<!--Bei action wird später eine php-Datei eingefügt,
|
||||
welche sich um die Verarbeitung der Daten kümmert.-->
|
||||
<form id="registrierungForm" action="">
|
||||
<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="button" value="Registrieren" id="registrierenKnopf" class="registrierenKnopf">
|
||||
</div>
|
||||
|
||||
<br><br>
|
||||
|
||||
<details>
|
||||
<summary>Sie habe bereits ein Konto?</summary>
|
||||
<p id="registrierenAusklappe"> <a href="anmelden_warenkorb.html"> Jetzt anmelden</a></p>
|
||||
</details>
|
||||
</div>
|
||||
</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>
|
||||
<script src="registrierung_verhalten.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
|
@ -0,0 +1,120 @@
|
|||
<!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">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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">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">XXXXXX.</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€ 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>
|
||||
<!--TODO: Event für den Button befindet sich momentan
|
||||
noch hier in der Datei. Soll die Funktion in eine
|
||||
andere Datei verschoben werden, da sich eigentlich keine
|
||||
EventListener in der HTML-Datei befinden sollen?-->
|
||||
<input type="button" id="loginNowButton" value="Jetzt anmelden"
|
||||
onclick="linkToLoginPage()">
|
||||
|
||||
<script>
|
||||
function linkToLoginPage() {
|
||||
window.location.replace("anmelden_meinebuecher.html");
|
||||
}
|
||||
</script>
|
||||
|
||||
<br><br><br>
|
||||
</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>
|
||||
</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>
|
|
@ -0,0 +1,655 @@
|
|||
// 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)[ ][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))) {
|
||||
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.html");
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
// TODO: Soll irgendetwas passieren?
|
||||
return false;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,93 @@
|
|||
<!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>
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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>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.html">Meine Bücher</a>".</p>
|
||||
|
||||
|
||||
<div id="button-container">
|
||||
<a href="meinebuecher.html">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">
|
||||
<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>
|
|
@ -0,0 +1,124 @@
|
|||
<!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>
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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.html">Meine Bücher</a>".
|
||||
</p>
|
||||
|
||||
<div id="button-container">
|
||||
<a href="warenkorb.html">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>
|
||||
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>
|
|
@ -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 | Über Uns</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
</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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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> Ü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>
|
||||
</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>
|
|
@ -0,0 +1,97 @@
|
|||
<!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 | Verlängerung</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
<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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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 class="item" id="verlängerungItem">
|
||||
<img src="pictures/es.jpg" alt="Es" height="200">
|
||||
<div class="beschreibung">
|
||||
<h2>Es</h2>
|
||||
<h3>von Stephen King</h3>
|
||||
<div class="b2 green">Rückgabe am: 03.05.2023</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="verlängerungButtonContainer">
|
||||
<a id = "verlängerungButton1" href="verlaengerungErfolgreich.html">Bestätigen</a>
|
||||
<a id = "verlängerungButton2" href="meinebuecher.html">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>
|
||||
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>
|
|
@ -0,0 +1,97 @@
|
|||
<!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 | Verlängerung Bestätigung</title>
|
||||
<link rel="icon" href="pictures/candle.png">
|
||||
<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="anmelden_meinebuecher.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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="anmelden.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 verlängert</h1>
|
||||
<div id="verlängerungContent">
|
||||
<p id="möchten-sie">Das Buch wurde verlängert.<br>Neues Rückgabedatum: 10.05.2023</p>
|
||||
|
||||
|
||||
<div class="item" id="verlängerungItem">
|
||||
<img src="pictures/es.jpg" alt="Es" height="200">
|
||||
<div class="beschreibung">
|
||||
<h2>Es</h2>
|
||||
<h3>von Stephen King</h3>
|
||||
<div class="b2 green">Rückgabe am: 10.05.2023</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="verlängerungButtonContainer">
|
||||
<a id = "verlängerungErfolgreichButton1" href="meinebuecher.html">Zurück zu 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">
|
||||
<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>
|
|
@ -0,0 +1,101 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<?php
|
||||
session_start();
|
||||
$_SESSION['eingeloggt'] = 1;
|
||||
|
||||
echo '<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">
|
||||
</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.php">Meine Bücher</a>
|
||||
<a id="abmelden" href="abmelden.php">Abmelden</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.php" id="warenKorbID"> <img id="shoppingCard" src="pictures/einkaufswagen.png" alt="Bild von einem Wagen"
|
||||
width="50" height="50"/> </a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<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.html">Jetzt reservieren</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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>';
|
||||
|
||||
?>
|