Boilerplate for login system.

5 files changed, 65 insertions, 2 deletions

diff --git a/views/home.handlebars b/views/home.handlebars
index 6061e4e..b0b7d34 100644
--- a/views/home.handlebars
+++ b/views/home.handlebars
@@ -8,7 +8,7 @@
     </div>
     <div class="card-body">
       <div class="card-text">
-        {{this.text}}
+        {{{this.text}}}
       </div>
       <a href="/remove-post/{{this._id}}" class="badge float-end">Remove</a>
     </div>
diff --git a/views/layouts/main.handlebars b/views/layouts/main.handlebars
index 9eccc37..41585e5 100644
--- a/views/layouts/main.handlebars
+++ b/views/layouts/main.handlebars
@@ -31,6 +31,23 @@
                 <a class="nav-link" href="/new-post">New Post</a>
               {{/if}}
             </li>
+            <li class="nav-item">
+              {{#if login}}
+                <a class="nav-link active" aria-current="page" href="/login">Login</a>
+              {{else}}
+                <a class="nav-link" href="/login">Login</a>
+              {{/if}}
+            </li>
+            <li class="nav-item">
+              {{#if register}}
+                <a class="nav-link active" aria-current="page" href="/register">Register</a>
+              {{else}}
+                <a class="nav-link" href="/register">Register</a>
+              {{/if}}
+            </li>
+            <li class="nav-item">
+                <a class="nav-link" href="/logout">Logout</a>
+            </li>
           </ul>
         </div>
       </div>
diff --git a/views/login.handlebars b/views/login.handlebars
new file mode 100644
index 0000000..47e2166
--- /dev/null
+++ b/views/login.handlebars
@@ -0,0 +1,14 @@
+<div class="container">
+  <h1 class="mt-2">{{ title }}</h1>
+  <form action="/login" method="post" accept-charset="utf-8">
+    <div class="mb-3">
+      <label for="email" class="form-label">Email:</label>
+      <input name="email" type="email" class="form-control" id="email" required>
+    </div>
+    <div class="mb-3">
+      <label for="password" class="form-label">Password:</label>
+      <input name="password" class="form-control" id="password" required></input>
+    </div>
+    <button type="submit" class="btn">Login</button>
+  </form>
+</div>
diff --git a/views/new-post.handlebars b/views/new-post.handlebars
index 19984ee..9e42ba9 100644
--- a/views/new-post.handlebars
+++ b/views/new-post.handlebars
@@ -7,8 +7,14 @@
     </div>
     <div class="mb-3">
       <label for="post_text" class="form-label">Post text:</label>
-      <textarea name="text" class="form-control" id="post_text" rows="3" required></textarea>
+      <textarea name="text" class="form-control" id="post_text"></textarea>
     </div>
     <button type="submit" class="btn">Submit</button>
   </form>
 </div>
+<script src="https://cdn.ckeditor.com/ckeditor5/27.1.0/classic/ckeditor.js"></script>
+<script>
+ClassicEditor
+  .create(document.querySelector('#post_text'))
+  .catch(error => console.error(error));
+</script>
diff --git a/views/register.handlebars b/views/register.handlebars
new file mode 100644
index 0000000..d18a6b8
--- /dev/null
+++ b/views/register.handlebars
@@ -0,0 +1,26 @@
+<div class="container">
+  <h1 class="mt-2">{{ title }}</h1>
+  <form action="/register" method="post" accept-charset="utf-8">
+    <div class="mb-3">
+      <label for="firstname" class="form-label">First name:</label>
+      <input name="firstname" type="text" class="form-control" id="firstname">
+    </div>
+    <div class="mb-3">
+      <label for="lastname" class="form-label">Last name:</label>
+      <input name="lastname" type="text" class="form-control" id="lastname">
+    </div>
+    <div class="mb-3">
+      <label for="email" class="form-label">Email:</label>
+      <input name="email" type="text" class="form-control" id="email">
+    </div>
+    <div class="mb-3">
+      <label for="password" class="form-label">Password:</label>
+      <input name="password" type="password" class="form-control" id="password">
+    </div>
+    <div class="mb-3">
+      <label for="confirmPassword" class="form-label">Confirm password:</label>
+      <input name="confirmPassword" type="password" class="form-control" id="confirmPassword">
+    </div>
+    <button type="submit" class="btn">Register</button>
+  </form>
+</div>