From d3be609d16f1191a38b5fb2a1cc303ffb2eb43f7 Mon Sep 17 00:00:00 2001
From: Seil0 <seil0@mosad.xyz>
Date: Wed, 15 Jan 2020 10:55:24 +0100
Subject: [PATCH] added customer account settings [Part 1]

* moved footer Mapping to the bottom of RequestController()
---
 .../hso/ecommerce/app/RequestController.java  | 76 ++++++++++++++----
 .../src/main/resources/static/css/dialog.css  | 19 +++++
 .../templates/customerAccountSettings.html    | 78 +++++++++++++++++++
 .../resources/templates/fragments/header.html |  2 +-
 .../src/main/resources/templates/home.html    |  2 +-
 .../main/resources/templates/register.html    |  5 +-
 6 files changed, 164 insertions(+), 18 deletions(-)
 create mode 100644 prototype/src/main/resources/static/css/dialog.css
 create mode 100644 prototype/src/main/resources/templates/customerAccountSettings.html

diff --git a/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java b/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java
index 9a0e605..7ecbc04 100644
--- a/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java
+++ b/prototype/src/main/java/org/hso/ecommerce/app/RequestController.java
@@ -11,6 +11,9 @@ import javax.servlet.http.HttpServletResponse;
 import java.util.List;
 import java.util.UUID;
 
+/**
+ * TODO clean up this class
+ */
 @Controller
 public class RequestController {
 
@@ -38,28 +41,58 @@ public class RequestController {
     }
 
     @GetMapping("/articledetail")
-    public String articledetail() { return "articleDetail";}
+    public String articledetail() {
+        return "articleDetail";
+    }
 
     @GetMapping("/searchresults")
-    public String searchresults() { return "searchResults";}
+    public String searchresults() {
+        return "searchResults";
+    }
 
     @GetMapping("/employee/articles")
-    public String articles() { return "articles";}
+    public String articles() {
+        return "articles";
+    }
 
     @GetMapping("/employee/listedarticles")
-    public String listedarticles() { return "listedArticles";}
+    public String listedarticles() {
+        return "listedArticles";
+    }
 
     @GetMapping("/employee/listedarticlesedit")
-    public String listedarticlesedit() { return "listedArticlesEdit";}
-    
-    @GetMapping("/about")
-    public String about() { return "about";}
-    
-    @GetMapping("/terms")
-    public String terms() { return "terms";}
-    
-    @GetMapping("/privacy")
-    public String privacy() { return "privacy";}
+    public String listedarticlesedit() {
+        return "listedArticlesEdit";
+    }
+
+    @GetMapping("/customer/accountsettings")
+    public String customerAccountSettings(Model model) {
+        Customer customer = new Customer();
+        customer.setFirstname("Max");
+        customer.setLastname("Mustermann");
+        customer.setUsername("Max.TestKunde");
+        customer.setPassword("test123");
+        model.addAttribute(customer);
+
+        model.addAttribute("fullname", customer.getFirstname() + " " + customer.getLastname());
+        model.addAttribute("email", "Test.User@ecommere.com");
+
+        model.addAttribute("street", "Musterstraße 42a");
+        model.addAttribute("city", "Musterstadt");
+        model.addAttribute("zipcode", "12345");
+        model.addAttribute("country", "Musterland");
+
+        return "customerAccountSettings";
+    }
+
+    @RequestMapping(value="/updateAccountSettings", method=RequestMethod.POST, params="action=updateAccountSettings")
+    public String updateAccountSettings(@ModelAttribute Customer customer, HttpServletResponse response) {
+        // do the login magic and get a loginToken
+        System.out.println(customer.username);
+        System.out.println(customer.password);
+
+        return "redirect:/customer/accountsettings";
+    }
 
     @GetMapping("/login")
     public String login(@CookieValue(value = "loginToken", defaultValue = "") String loginToken, Model model) {
@@ -126,4 +159,19 @@ public class RequestController {
         return "redirect:/home";
     }
 
+    @GetMapping("/about")
+    public String about() {
+        return "about";
+    }
+
+    @GetMapping("/terms")
+    public String terms() {
+        return "terms";
+    }
+
+    @GetMapping("/privacy")
+    public String privacy() {
+        return "privacy";
+    }
+
 }
diff --git a/prototype/src/main/resources/static/css/dialog.css b/prototype/src/main/resources/static/css/dialog.css
new file mode 100644
index 0000000..114eb80
--- /dev/null
+++ b/prototype/src/main/resources/static/css/dialog.css
@@ -0,0 +1,19 @@
+.dialog {
+    display: none; /* Hidden by default */
+    position: fixed; /* Stay in place */
+    z-index: 1;
+    left: 0;
+    top: 0;
+    width: 100%; /* Full width */
+    height: 100%; /* Full height */
+    overflow: auto; /* Enable scroll if needed */
+    padding-top: 60px;
+}
+
+.dialog-content {
+    background-color: var(--c-black);
+    margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
+    border: 1px solid #888;
+    width: 50%; /* Could be more or less, depending on screen size */
+
+}
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/customerAccountSettings.html b/prototype/src/main/resources/templates/customerAccountSettings.html
new file mode 100644
index 0000000..e7288af
--- /dev/null
+++ b/prototype/src/main/resources/templates/customerAccountSettings.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
+<head>
+    <meta charset="UTF-8">
+    <title>eCommerce - Account Settings</title>
+    <link rel="stylesheet" th:href="@{/css/ecom.css}"/>
+    <link rel="stylesheet" th:href="@{/css/listedArticles.css}" />
+</head>
+<body>
+    <nav th:replace="fragments/header :: header">Header</nav>
+    <main class='content-width'>
+        <div class="content-width">
+            <h1> Account Settings </h1>
+
+
+            <form class="formgrid" th:action="@{/updateAccountSettings}" th:object="${customer}" method="post">
+
+                <div class="l">
+                    <h2>General Settings</h2>
+                    <p class="l">
+                        <label for="username">Username *</label>
+                        <input class="linestyle full-width" type="text" id="username" th:field="*{username}"  th:value="${username}" />
+                    </p>
+                    <p class="l">
+                        <label for="fullname">Full Name *</label>
+                        <input class="linestyle full-width" type="text" id="fullname" th:value="${fullname}" />
+                    </p>
+                    <p class="l">
+                        <label for="email">Email Address *</label>
+                        <input class="linestyle full-width" type="text" id="email" th:value="${email}" />
+                    </p>
+                    <p class="l">
+                        <label for="password">Password *</label>
+                        <input class="linestyle full-width" type="password" id="password" th:field="*{password}" th:value="${password}" />
+                    </p>
+                </div>
+
+                <div class="l">
+                    <h2>Shipment Settings</h2>
+                    <p class="l">
+                        <label for="street">Street + Hous No. *</label>
+                        <input class="linestyle full-width" type="text" id="street" th:value="${street}" />
+                    </p>
+
+                    <div class="l">
+                        <p class="m">
+                            <label for="city">City *</label>
+                            <input class="linestyle full-width" type="text" id="city" th:value="${city}" />
+                        </p>
+                        <p class="s">
+                            <label for="zipcode">ZIP Code *</label>
+                            <input class="linestyle full-width" type="text" id="zipcode" th:value="${zipcode}" />
+                        </p>
+                    </div>
+
+                    <p class="l">
+                        <label for="country">Country *</label>
+                        <input class="linestyle full-width" type="text" id="country" th:value="${country}" />
+                    </p>
+                </div>
+
+                <div class="l">
+                    <h2>Payment Settings</h2>
+                    <h3>TODO</h3>
+                </div>
+
+                <div class="spacer"></div>
+
+                <div class="l">
+                    <button type="submit" name="action" value="updateAccountSettings">Änderungen speichern</button>
+                    <button type="reset">Zurücksetzen</button>
+                </div>
+            </form>
+        </div>
+    </main>
+    <footer th:replace="fragments/footer :: footer"></footer>
+</body>
+</html>
\ No newline at end of file
diff --git a/prototype/src/main/resources/templates/fragments/header.html b/prototype/src/main/resources/templates/fragments/header.html
index 8bc8fe2..15f92df 100644
--- a/prototype/src/main/resources/templates/fragments/header.html
+++ b/prototype/src/main/resources/templates/fragments/header.html
@@ -2,7 +2,7 @@
 <html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
 <head>
     <meta charset="utf-8">
-    <title>e-commerce</title>
+    <title>eCommerce</title>
 </head>
 <body>
     <nav class='hero' th:fragment="header">
diff --git a/prototype/src/main/resources/templates/home.html b/prototype/src/main/resources/templates/home.html
index e38d1b5..62e578f 100644
--- a/prototype/src/main/resources/templates/home.html
+++ b/prototype/src/main/resources/templates/home.html
@@ -2,7 +2,7 @@
 <html lang="de" dir="ltr" xmlns:th="http://www.thymeleaf.org">
 <head>
     <meta charset="utf-8">
-    <title>e-commerce</title>
+    <title>eCommerce</title>
     <link href="../static/css/ecom.css" rel="stylesheet" th:href="@{/css/ecom.css}"/>
 </head>
 <body>
diff --git a/prototype/src/main/resources/templates/register.html b/prototype/src/main/resources/templates/register.html
index e7b8339..1d1a78d 100644
--- a/prototype/src/main/resources/templates/register.html
+++ b/prototype/src/main/resources/templates/register.html
@@ -4,14 +4,15 @@
     <meta charset="utf-8">
     <title>e-commerce</title>
     <link href="../static/css/ecom.css" rel="stylesheet" th:href="@{/css/ecom.css}"/>
+    <link href="../static/css/dialog.css" rel="stylesheet" th:href="@{/css/dialog.css}"/>
 </head>
 <body>
     <nav th:replace="fragments/header :: header">Header</nav>
     <main>
         <form class="dialog-content" th:action="@{/register}" th:object="${customer}" method="post">
             <div class="container">
-                <label><b>Username</b></label>
-                <input type="text" th:field="*{username}" placeholder="Enter Username" name="uname" required>
+                <label for="username">Username</label>
+                <input type="text" th:field="*{username}" placeholder="Enter Username" id="username" required>
 
                 <label><b>Password</b></label>
                 <input type="password" th:field="*{password}" placeholder="Enter Password" name="pwd" required>