<?php
session_start();
   
    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 | 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.php">Bücher</a> 
                            <a id="meinebuecher" href="anmelden_meinebuecher.php">Meine Bücher</a>
                            <a  id="abmelden" href="abmelden.php">Abmelden</a>
                            <form action="">
                                <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="registrierung_erfolgreich.php" method="Post">
                            <div class="container">
                                <span id="registrierungTitel" > Registrierung </span>
                                <br>
                                <p id="datenSchutzHinweisRegistrierung" > Über diese Webseite werden personenbezogene Daten erhoben und genutzt. Für Details, beziehen Sie sich bite auf die Seite Datenschutz.</p>
                                <h4 id="registrierungAngabenZurRegistrierung">Angaben zur Registrierung<hr id="registrierungHr"></h4>
                                <br>
                                <div id="registrierungInputDiv" >
            
                                    <div class="field">
                                        <label for="vorName"><b>Vorname</b></label>
                                        <br>
                                        <input type="text" name="vorName" id="vorName" class="registrierenNormalesTextfeld"><br>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>  
            
                                    <div class="field">
                                        <label for="nachName"><b>Nachname</b></label>
                                        <br>
                                        <input type="text" name="nachName" id="nachName" class="registrierenNormalesTextfeld"><br>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>
            
                                    <div class="field">
                                        <label for="strasse"><b>Straße und Hausnummer</b></label>
                                        <br>
                                        <input type="text" name="strasse" id="strasse">
            
                                        <input type="text" name="hausnummer" id="hausNummer"><br>
                                        <p class="errorMessage"></p>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>
            
                                    <div class="field">
                                        <label for="postleitzahl"><b>Postleitzahl und Ort</b></label>
                                        <br>
                                        <input type="text" name="postleitzahl" id="postleitzahl">
            
                                        <input type="text" name="ort" id="ort"><br>
                                        <p class="errorMessage"></p>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>
            
                                    <div class="field">
                                        <label for="email"><b>E-Mail-Adresse</b></label>
                                        <br>
                                        <input type="email" name="email" id="email" class="registrierenNormalesTextfeld"><br>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>
            
                                    <div class="field">
                                        <label for="emailRep"><b>E-Mail-Adresse bestätigen</b></label>
                                        <br>
                                        <input type="email" name="emailRep" id="emailRep" class="registrierenNormalesTextfeld"><br>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>
            
                                    <div class="field">
                                        <label for="passwort"><b>Passwort</b></label>
                                        <br>
                                        <input type="password" name="passwort" id="passwort" class="registrierenNormalesTextfeld"><br>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>
            
                                    <div class="field">
                                        <label for="passwortRep"><b>Passwort bestätigen</b></label>
                                        <br>
                                        <input type="password" name="passwortRep" id="passwortRep" class="registrierenNormalesTextfeld"><br>
                                        <p class="errorMessage"></p>
                                        <br>
                                    </div>
            
                                    <div class="field">
                                        <input type="submit" value="Registrieren" name="Registrieren" id="registrierenKnopf" class="registrierenKnopf">
                                    </div>
            
                                    <br><br>
            
                                    <details>
                                        <summary>Sie habe bereits ein Konto?</summary>
                                        <p id="registrierenAusklappe"> <a href="anmelden.php"> Jetzt anmelden</a></p>
                                    </details>
                                </div>
                            </div>
                        </form>
                    </div>
                        
                    <!--Link JS file-->
                    <script src="burgerIcon.js"></script>
                    
                    <script>
                        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>';
    
?>

