Current status

main.go

@@ -13,6 +13,7 @@ type pageParams struct{
   HasError string
   Error string
   ReqDir string
+  IsAdmin string
   } // {Error: ""}
 
 type pageUserParams struct{
@@ -21,6 +22,7 @@ type pageUserParams struct{
   ReqDir string
   Username string
   Email string
+  IsAdmin string
   } // {Error: ""}
 
 func main() {
@@ -55,21 +57,21 @@ func main() {
   iris.Post("/login", loginHandler) // login form handler
 
 	iris.Get("/", usermanager.AuthHandler, func(ctx *iris.Context) {
-    params := pageParams{"0", "", ""}
+    params := pageParams{"0", "", "", "0"}
 		if err := ctx.Render("home_boxes.html", params); err != nil {
 			println(err.Error())
 		}
 	})
 
   iris.Get("/account", usermanager.AuthHandler, func(ctx *iris.Context) {
-    params := pageUserParams{"0", "", "account", "moe", "moritz@mmnx.de"}
+    params := pageUserParams{"0", "", "account", "moe", "moritz@mmnx.de", "0"}
 		if err := ctx.Render("account_box.html", params); err != nil {
 			println(err.Error())
 		}
 	})
 
   iris.Get("/login", func(ctx *iris.Context) {
-    params := pageParams{"0", "", "login"}
+    params := pageParams{"0", "", "login", "0"}
     if err := ctx.Render("login.html", params); err != nil { // no error for normal login screen, struct{ Error string }{Error: ""}
       println(err.Error())
     }
@@ -101,7 +103,7 @@ func loginHandler(ctx *iris.Context) {
   tokenString, err := user.Login(username, password) // try to login
 
   if err != nil { // TODO: template compatible error handling
-    ctx.Render("login.html", pageParams{"1", err.Error(), "login"})
+    ctx.Render("login.html", pageParams{"1", err.Error(), "login", "0"})
   } else {
     ctx.SetCookieKV("token", tokenString)
     ctx.Redirect("/")

static/css/narrow-jumbotron.css

@@ -97,6 +97,53 @@ body {
   padding: 15px;
 }
 
+.row.marketing .col-lg-4 img {
+  max-width: 100%;
+}
+
+.row.marketing .col-lg-4 {
+  height: 10rem;
+}
+
+.clickwall {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.center {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  margin-right: -50%;
+  transform: translate(-50%, -50%);
+  padding: 15px;
+}
+
+.wrapper:hover {
+  transform: scale(1.26);
+}
+
+.wrapper {
+  width: 100%;
+  height: 100%;
+  transition-duration: 1s;
+}
+
+.os-background {
+  position: fixed;
+  left: 0;
+  right: 0;
+  z-index: -1;
+  margin-top: -15%;
+  display: block;
+  background: #eceeef;
+  width: 100%;
+  height: 100%;
+}
+
 /* Responsive: Portrait tablets and up */
 @media screen and (min-width: 48em) {
   /* Remove the padding we set earlier */

static/img/sources.txt

@@ -0,0 +1,4 @@
+mmnx_vpn.png: gab
+tux.png: https://www.kernel.org/theme/images/logos/tux.png
+windows.png: https://www.pcper.com/files/news/2015-04-10/windows_8_logo-redux2.png
+android.png: https://image.freepik.com/vektoren-kostenlos/android-boot-logo_634639.jpg

templates/account_box.html

@@ -1,60 +1,58 @@
-<!--<div class="container">-->
-  <form>
-    <div class="form-group row">
-      <label for="inputUsername3" class="col-sm-2 col-form-label">username</label>
-      <div class="col-sm-10">
-        <input type="text" class="form-control" id="inputUsername3" placeholder="{{ .Username}}">
-      </div>
-    </div>
-    <div class="form-group row">
-      <label for="inputEmail3" class="col-sm-2 col-form-label">email</label>
-      <div class="col-sm-10">
-        <input type="email" class="form-control" id="inputEmail3" placeholder="{{ .Email}}">
-      </div>
-    </div>
-    <div class="form-group row">
-      <label for="inputPassword3" class="col-sm-2 col-form-label">passwort</label>
-      <div class="col-sm-10">
-        <input type="password" class="form-control" id="inputPassword3" placeholder="passwort (leer lassen um nicht zu ändern)">
-      </div>
-    </div>
-    <fieldset class="form-group row">
-      <legend class="col-form-legend col-sm-2">Radios</legend>
-      <div class="col-sm-10">
-        <div class="form-check">
-          <label class="form-check-label">
-            <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios1" value="option1" checked>
-            Option one is this and that&mdash;be sure to include why it's great
-          </label>
+      <form>
+        <div class="form-group row">
+          <label for="inputUsername3" class="col-sm-2 col-form-label">username</label>
+          <div class="col-sm-10">
+            <input type="text" class="form-control" id="inputUsername3" placeholder="{{ .Username}}">
+          </div>
         </div>
-        <div class="form-check">
-          <label class="form-check-label">
-            <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios2" value="option2">
-            Option two can be something else and selecting it will deselect option one
-          </label>
+        <!--<div class="form-group row">
+          <label for="inputEmail3" class="col-sm-2 col-form-label">email</label>
+          <div class="col-sm-10">
+            <input type="email" class="form-control" id="inputEmail3" placeholder="{{ .Email}}">
+          </div>
+        </div>-->
+        <div class="form-group row">
+          <label for="inputPassword3" class="col-sm-2 col-form-label">passwort</label>
+          <div class="col-sm-10">
+            <input type="password" class="form-control" id="inputPassword3" placeholder="passwort (leer lassen um nicht zu ändern)">
+          </div>
         </div>
-        <div class="form-check disabled">
-          <label class="form-check-label">
-            <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios3" value="option3" disabled>
-            Option three is disabled
-          </label>
+        <!--<fieldset class="form-group row">
+          <legend class="col-form-legend col-sm-2">Radios</legend>
+          <div class="col-sm-10">
+            <div class="form-check">
+              <label class="form-check-label">
+                <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios1" value="option1" checked>
+                Option one is this and that&mdash;be sure to include why it's great
+              </label>
+            </div>
+            <div class="form-check">
+              <label class="form-check-label">
+                <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios2" value="option2">
+                Option two can be something else and selecting it will deselect option one
+              </label>
+            </div>
+            <div class="form-check disabled">
+              <label class="form-check-label">
+                <input class="form-check-input" type="radio" name="gridRadios" id="gridRadios3" value="option3" disabled>
+                Option three is disabled
+              </label>
+            </div>
+          </div>
+        </fieldset>
+        <div class="form-group row">
+          <label class="col-sm-2">Checkbox</label>
+          <div class="col-sm-10">
+            <div class="form-check">
+              <label class="form-check-label">
+                <input class="form-check-input" type="checkbox"> Check me out
+              </label>
+            </div>
+          </div>
+        </div>-->
+        <div class="form-group row">
+          <div class="offset-sm-2 col-sm-10">
+            <button type="submit" class="btn btn-primary">speichern</button>
+          </div>
         </div>
-      </div>
-    </fieldset>
-    <div class="form-group row">
-      <label class="col-sm-2">Checkbox</label>
-      <div class="col-sm-10">
-        <div class="form-check">
-          <label class="form-check-label">
-            <input class="form-check-input" type="checkbox"> Check me out
-          </label>
-        </div>
-      </div>
-    </div>
-    <div class="form-group row">
-      <div class="offset-sm-2 col-sm-10">
-        <button type="submit" class="btn btn-primary">Sign in</button>
-      </div>
-    </div>
-  </form>
-<!--</div>-->
+      </form>

templates/home_boxes.html

@@ -1,16 +1,36 @@
   <div class="jumbotron">
       <img src="/img/mmnx_vpn.png" alt="Logo mmnx_vpn" class="img-responsive">
-    </div>
+  </div>
 
     <div class="row marketing">
-      <div class="col-lg-6">
-        <h4>status</h4>
-        <p>anzahl clients: X <!-- TODO --></p>
+      <div class="col-lg-4">
+        <a href="https://cdn.mmnx.de/openvpn_2.4.0.1-1_amd64.deb">
+          <div class="wrapper">
+            <div class="center">
+              <div class="os-background"></div>
+              <img src="/img/tux.png" alt="Linux">
+            </div>
+          </div>
+        </a>
       </div>
-      <div class="col-lg-6">
-        <h4>traffic</h4>
-        <p>heute: X MB/GB<br><!-- TODO -->
-        monat: X MB/GB<br><!-- TODO -->
-        jahr: X MB/GB<br><!-- TODO --></p>
+      <div class="col-lg-4">
+        <a href="https://swupdate.openvpn.org/community/releases/openvpn-install-2.4_beta1-I601-x86_64.exe">
+          <div class="wrapper">
+            <div class="center">
+              <div class="os-background"></div>
+              <img src="/img/windows.png" alt="Windows">
+            </div>
+          </div>
+        </a>
+      </div>
+      <div class="col-lg-4">
+        <a href="https://play.google.com/store/apps/details?id=de.blinkt.openvpn">
+          <div class="wrapper">
+            <div class="center">
+              <div class="os-background"></div>
+              <img src="/img/android.png" alt="Android">
+            </div>
+          </div>
+        </a>
       </div>
     </div>

templates/layouts/main.html

@@ -48,16 +48,12 @@
         </nav>
         <h3 class="text-muted">mmnx<sub>vpn</sub></h3>
       </div>
-
-      {{ if eq .HasError "1" }}
-        {{ render "partials/notification_box.html" }}
-      {{ end }}
-
-      {{ yield }}
-
-      <footer class="footer">
-        <p>&copy; mmnx 2016</p>
-      </footer>
+      {{ if eq .HasError "1" }}{{ render "partials/notification_box.html" }}{{ end }}{{ yield }}      
+      <div class="container">
+        <footer class="footer">
+          <p>&copy; mmnx 2016</p>
+        </footer>
+      </div>
 
     </div> <!-- /container -->
     <script src="/js/ie10-viewport-bug-workaround.js"></script>