responsive navbar

src/data.rs

@@ -16,6 +16,7 @@
 */
 //! App data: redis cache, database connections, etc.
 use std::sync::Arc;
+use std::thread;
 
 use actix::prelude::*;
 use argon2_creds::{Config, ConfigBuilder, PasswordPolicy};
@@ -145,12 +146,6 @@ impl Data {
     #[cfg(not(tarpaulin_include))]
     /// create new instance of app data
     pub async fn new() -> Arc<Self> {
-        let db = PgPoolOptions::new()
-            .max_connections(SETTINGS.database.pool)
-            .connect(&SETTINGS.database.url)
-            .await
-            .expect("Unable to form database pool");
-
         let creds = ConfigBuilder::default()
             .username_case_mapped(true)
             .profanity(true)
@@ -159,9 +154,19 @@ impl Data {
             .build()
             .unwrap();
 
+        let c = creds.clone();
+
+        let init = thread::spawn(move || {
             log::info!("Initializing credential manager");
-        //creds.init();
+            c.init();
             log::info!("Initialized credential manager");
+        });
+
+        let db = PgPoolOptions::new()
+            .max_connections(SETTINGS.database.pool)
+            .connect(&SETTINGS.database.url)
+            .await
+            .expect("Unable to form database pool");
 
         let data = Data {
             creds,
@@ -170,6 +175,8 @@ impl Data {
             mailer: Self::get_mailer(),
         };
 
+        init.join().unwrap();
+
         Arc::new(data)
     }
 

src/email/verification.rs

@@ -112,7 +112,8 @@ mod tests {
             .unwrap();
 
         let client = Client::default();
-        let mut resp = client.get("http://localhost:1080/email")
+        let mut resp = client
+            .get("http://localhost:1080/email")
             .send()
             .await
             .unwrap();
@@ -120,7 +121,8 @@ mod tests {
         let data = &data[0];
         let smtp = SETTINGS.smtp.as_ref().unwrap();
 
-        let from_addr = &data["headers"]["from"];["address"];
+        let from_addr = &data["headers"]["from"];
+        ["address"];
 
         assert!(from_addr.to_string().contains(&smtp.from));
 

src/pages/auth/email_verify.rs

@@ -0,0 +1,51 @@
+/*
+ * Copyright (C) 2021  Aravinth Manivannan <realaravinth@batsense.net>
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+//! Email operations: verification, notification, etc
+use lettre::{
+    message::{header, MultiPart, SinglePart},
+    AsyncTransport, Message,
+};
+use sailfish::TemplateOnce;
+
+use crate::errors::*;
+use crate::Data;
+use crate::SETTINGS;
+
+const PAGE: &str = "Login";
+
+#[derive(Clone, Default, TemplateOnce)]
+#[template(path = "auth/email-verification/index.html")]
+struct IndexPage {
+    email: String,
+}
+
+
+lazy_static! {
+    static ref INDEX: String = IndexPage::default().render_once().unwrap();
+}
+
+#[get(path = "PAGES.auth.login")]
+pub async fn email_verification() -> impl Responder {
+    HttpResponse::Ok()
+        .content_type("text/html; charset=utf-8")
+        .body(&*INDEX)
+}
+
+//TODO
+// Design cookie system to handle registration to showing this page,
+// verifying email and discarding the cookie

templates/auth/email-verification/index.html

@@ -0,0 +1,28 @@
+<. include!("../../components/headers/index.html"); .>
+<div class="tmp-layout">
+<main class="auth-main">
+  <div class="auth-inner-container">
+
+    <img src="<.=
+    crate::FILES.get("./static/cache/img/icon-trans.png").unwrap().>"
+    class="auth__logo" alt="mcaptcha logo" />
+
+  <div
+    class="sitekey-form"
+  >
+    <h1 class="form__title">
+      Please verify your email address to continue
+    </h1>
+      An email has been sent to 
+
+  </div>
+    <p class="auth__secondary-action__banner">
+      New to mCaptcha?
+      <a 
+		  href="<.= crate::PAGES.auth.join .>"
+		  class="auth__secondary-action__link">
+		  Create an account
+	  </a>
+    </p>
+  </div>
+<. include!("../../components/footers.html"); .>

templates/components/headers/csp.html

@@ -1,4 +1,6 @@
+<!--
 <meta
   http-equiv="Content-Security-Policy"
   content="default-src 'self' *.mcaptcha.org mcaptcha.org mcaptcha.io *.mcaptcha.io; img-src 'self'; style-src 'self'; child-src 'none'; script-src 'self';"
 />
+-->

templates/email/verification/index.html

@@ -20,9 +20,16 @@
       <p class="message__text">
         Please verify your email address to continue.
       </p>
-      <button class="button">
+      <form
+        action="<.= verification_link .>"
+        method="get"
+        accept-charset="utf-8"
+		class="verification__form"
+      >
+        <button type="submit" class="button">
           Click here to verify
         </button>
+      </form>
 
       <p class="message__text">
         If you were not able to see the verification button, click the following

templates/main.scss

@@ -48,7 +48,7 @@ nav {
   /* needed for the floated layout */
   clear: both;
   grid-area: navbar;
-  height: 100%;
+//  height: 100%;
 }
 
 .tmp-layout {

templates/panel/index.html

@@ -10,7 +10,7 @@
     <ul class="sitekey-list__box">
         <p> 
             It looks like you don't have any sitekeys. Click 
-                <a href="<.= crate::PAGES.panel.sitekey.add .>">here></a> to add new sitekey.
+			<a href="<.= crate::PAGES.panel.sitekey.add .>">here</a> to add new sitekey.
         </p>
     </ul>
 

templates/panel/navbar/index.html

@@ -1,11 +1,17 @@
 <nav class="secondary-menu">
-  <ul class="secondary-menu__lsit">
-    <li class="secondary-menu__heading">
+	<input type="checkbox" class="nav-toggle" id="nav-toggle" >
+  <div class="secondary-menu__heading">
     <img class="secondary-menu__logo" src="<.= crate::FILES.get("./static/cache/img/icon-trans.png").unwrap() .>" alt="Logo" />
     <div class="secondary-menu__brand-name">
       mCaptcha
     </div>
-    </li>
+	<label class="nav__hamburger-menu"for="nav-toggle">
+      <span></span>
+      <span></span>
+      <span></span>
+    </label>
+  </div>
+  <ul class="secondary-menu__list">
     
     <!--
           <li class="secondary-menu__section-partition"></li>

templates/panel/navbar/main.scss

@@ -26,21 +26,32 @@
   // top: 0;
   // right: 0;
 
-  height: 100%;
-  overflow: auto;
+  //height: 100%;
+  //overflow: auto;
+  display: flex;
+  flex-direction: column;
 
   background-color: $secondary-backdrop;
   color: $light-text;
 }
 
-.secondary-menu__lsit{
-	position: fixed;
-	top: 0;
-	bottom: 0;
+.nav-toggle {
+  display: none;
+}
+
+.nav__hamburger-menu {
+  display: none;
+}
+
+.secondary-menu__list {
+  // position: fixed;
+  // top: 0;
+  // bottom: 0;
+  height: 100%;
 }
 
 .secondary-menu__heading {
-  margin: auto;
+  //  margin: auto;
   padding: 20px 5px;
   display: flex;
 }

templates/panel/navbar/mobile.scss

@@ -14,11 +14,61 @@
  * You should have received a copy of the GNU Affero General Public License
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
+@import '../../vars';
 
 .secondary-menu {
   display: block;
 }
 
-.secondary-menu__lsit {
-  position: sticky;
+.secondary-menu__list {
+  //  position: sticky;
+  height: 0px;
+  overflow: hidden;
+}
+
+.nav__hamburger-menu {
+  display: inline-block;
+  width: 50px;
+  height: 50px;
+  padding: 13px;
+}
+
+.nav__hamburger-menu:hover {
+  cursor: grab;
+}
+
+.nav__hamburger-menu:hover > span {
+  color: $green;
+}
+
+.nav__hamburger-menu > span {
+  display: block;
+  width: 25px;
+  height: 10px;
+  border-top: 2px solid #eee;
+}
+
+.secondary-menu__logo {
+  width: 40px;
+  height: 40px;
+}
+
+.secondary-menu__heading {
+  padding: 10px 5px;
+}
+
+.secondary-menu__brand-name {
+  font-size: 1rem;
+  font-weight: 700;
+}
+
+.nav-toggle:not(:checked) ~ .secondary-menu__list {
+  height: 0px;
+  //  overflow-y: hidden;
+  //  max-height: 100%;
+}
+
+.nav-toggle:checked ~ .secondary-menu__list {
+  height: 100%;
+  overflow-y: auto;
 }