From 176ec9aacbc87e6077e8807c60f95a1ccbbc26e3 Mon Sep 17 00:00:00 2001
From: Adam LeBlanc <aleblanc@iol.unh.edu>
Date: Thu, 5 Mar 2020 12:37:38 -0500
Subject: [PATCH] Add akraino template for dashboard

Signed-off-by: Adam LeBlanc <aleblanc@iol.unh.edu>
Change-Id: I02242e00779bcae7cd7622c2e891e4199c8d0e71
Signed-off-by: Adam LeBlanc <aleblanc@iol.unh.edu>
---
 src/static/img/akraino_logo.logo                | Bin 0 -> 4059 bytes
 src/templates/akraino/base.html                 |  24 ++++++++++++++++++++++++
 src/templates/akraino/booking/quick_deploy.html |  11 +++++++++++
 src/templates/akraino/dashboard/landing.html    |  22 ++++++++++++++++++++++
 src/templates/akraino/layout.html               |   5 +++++
 src/templates/base/base.html                    |  10 +++++++---
 src/templates/base/booking/quick_deploy.html    |   6 +++++-
 src/templates/base/dashboard/landing.html       |   7 +++++--
 src/templates/base/layout.html                  |   2 ++
 src/templates/laas/base.html                    |  13 +++++++++++++
 src/templates/laas/layout.html                  |   5 +++++
 11 files changed, 99 insertions(+), 6 deletions(-)
 create mode 100644 src/static/img/akraino_logo.logo
 create mode 100644 src/templates/akraino/base.html
 create mode 100644 src/templates/akraino/booking/quick_deploy.html
 create mode 100644 src/templates/akraino/dashboard/landing.html
 create mode 100644 src/templates/akraino/layout.html
 create mode 100644 src/templates/laas/base.html
 create mode 100644 src/templates/laas/layout.html

diff --git a/src/static/img/akraino_logo.logo b/src/static/img/akraino_logo.logo
new file mode 100644
index 0000000000000000000000000000000000000000..ac85b38c2c46217b8000ea294cfcb641e673f244
GIT binary patch
literal 4059
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
N002ovPDHLkV1h)S*CYS{

literal 0
HcmV?d00001

diff --git a/src/templates/akraino/base.html b/src/templates/akraino/base.html
new file mode 100644
index 0000000..1368476
--- /dev/null
+++ b/src/templates/akraino/base.html
@@ -0,0 +1,24 @@
+{% extends "base/base.html" %}
+{% load staticfiles %}
+{% block bgColor %}
+<style>
+.bgAkr {
+    background: #d9c2f2;
+}
+</style>
+<nav class="navbar navbar-light bgAkr navbar-fixed-top border-bottom py-0 mb-0" role="navigation">
+{% endblock bgColor %}
+
+{% block logo %}
+<div class="col-12 col-sm order-1 order-sm-2 text-center text-lg-left">
+    <a href="https://www.lfedge.org/projects/akraino/" class="navbar-brand">
+        <img src="{% static "img/akraino_logo.logo" %}">
+    </a>
+
+    <a class="navbar-brand d-none d-lg-inline" href={% url 'dashboard:index' %}>
+        Akraino Dashboard
+    </a>
+</div>
+{% endblock logo %}
+{% block dropDown %}
+{% endblock dropDown %}
diff --git a/src/templates/akraino/booking/quick_deploy.html b/src/templates/akraino/booking/quick_deploy.html
new file mode 100644
index 0000000..56a4791
--- /dev/null
+++ b/src/templates/akraino/booking/quick_deploy.html
@@ -0,0 +1,11 @@
+{% extends "base/booking/quick_deploy.html" %}
+{% block opnfv %}
+{% endblock opnfv %}
+{% block collab %}
+<div class="col-12 col-lg-4 my-2">
+    <div class="col border rounded py-2 h-100">
+        <label>Collaborators</label>
+        {{ form.users }}
+    </div>
+</div>
+{% endblock collab %}
diff --git a/src/templates/akraino/dashboard/landing.html b/src/templates/akraino/dashboard/landing.html
new file mode 100644
index 0000000..d7f434b
--- /dev/null
+++ b/src/templates/akraino/dashboard/landing.html
@@ -0,0 +1,22 @@
+{% extends "base/dashboard/landing.html" %}
+{% block about_us %}
+    <p>The Shared Community Lab at the IOL aims to help development and testing of LFN projects by hosting hardware and providing access to the community.</p>
+    <p>To get started, you can request access to a server at the right.</p>
+{% endblock about_us %}
+
+{% block btnGrp %}
+<style>
+.btnAkr {
+    color: #fff;
+    background-color: #39c0c0;
+}
+.btnAkr:hover{
+    color: #fff;
+    background-color: #259a9a;
+}
+</style>
+<p>To get started, book a pod below:</p>
+<a class="btn btnAkr btn-lg d-flex flex-column justify-content-center align-content-center border text-white p-4" href="/booking/quick/">Book a Pod</a>
+{% endblock btnGrp %}
+{% block returningUsers %}
+{% endblock returningUsers %}
diff --git a/src/templates/akraino/layout.html b/src/templates/akraino/layout.html
new file mode 100644
index 0000000..d30ddb6
--- /dev/null
+++ b/src/templates/akraino/layout.html
@@ -0,0 +1,5 @@
+{% extends "base/layout.html" %}
+
+{% block head-title %}
+<title>Akraino Dashboard</title>
+{% endblock head-title %}
diff --git a/src/templates/base/base.html b/src/templates/base/base.html
index 6776f7e..663741a 100644
--- a/src/templates/base/base.html
+++ b/src/templates/base/base.html
@@ -12,17 +12,19 @@
 {% block basecontent %}
 <div id="wrapper" class="d-flex flex-column">
     <!-- Navigation -->
+    {% block bgColor %}
     <nav class="navbar navbar-light bg-light navbar-fixed-top border-bottom py-0 mb-0" role="navigation">
+    {% endblock bgColor %}
         <div class="container-fluid pb-2 pb-sm-0">
             <!-- Logo -->
+            {% block logo %}
             <div class="col-12 col-sm order-1 order-sm-2 text-center text-lg-left">
-                <a href="https://www.opnfv.org/" class="navbar-brand">
-                    <img src="{% static "img/opnfv-logo.png" %}">
-                </a>
+            <h2>Logo Here</h2>
                 <a class="navbar-brand d-none d-lg-inline" href={% url 'dashboard:index' %}>
                     Laas Dashboard
                 </a>
             </div>
+            {% endblock logo %}
             <!-- Sidebar button -->
             <div class="col-6 col-sm-2 d-flex order-1 order-lg-3 d-lg-none">
                 <button class="btn border mx-auto" type="button" data-toggle="collapse" data-target="#sidebar"
@@ -75,6 +77,7 @@
                             <a href="/" class="list-group-item list-group-item-action">
                                 Home
                             </a>
+                            {% block dropDown %}
                             <a class="list-group-item list-group-item-action" data-toggle="collapse"
                                 href="#createList" role="button">
                                 Create <i class="fas fa-angle-down rotate"></i>
@@ -99,6 +102,7 @@
                                     Configure OPNFV
                                 </a>
                             </div>
+                            {% endblock dropDown %}
                             <a href="{% url 'resource:hosts' %}" class="list-group-item list-group-item-action">
                                 Hosts
                             </a>
diff --git a/src/templates/base/booking/quick_deploy.html b/src/templates/base/booking/quick_deploy.html
index 8570f25..42148c8 100644
--- a/src/templates/base/booking/quick_deploy.html
+++ b/src/templates/base/booking/quick_deploy.html
@@ -12,7 +12,7 @@
                 {% bootstrap_field form.filter_field show_label=False %}
             </div>
         </div>
-        <div class="row">
+        <div class="row justify-content-center">
             <div class="col-12 col-lg-3 my-2">
                 <div class="col border rounded py-2 h-100">
                     {% bootstrap_field form.purpose %}
@@ -25,18 +25,21 @@
                     </script>
                 </div>
             </div>
+            {% block collab %}
             <div class="col-12 col-lg-3 my-2">
                 <div class="col border rounded py-2 h-100">
                     <label>Collaborators</label>
                     {{ form.users }}
                 </div>
             </div>
+            {% endblock collab %}
             <div class="col-12 col-lg-3 my-2">
                 <div class="col border rounded py-2 h-100">
                     {% bootstrap_field form.hostname %}
                     {% bootstrap_field form.image %}
                 </div>
             </div>
+            {% block opnfv %}
             <div class="col-12 col-lg-3 my-2">
                 <div class="col border rounded py-2 h-100">
                     <strong>OPNFV: (Optional)</strong>
@@ -44,6 +47,7 @@
                     {% bootstrap_field form.scenario %}
                 </div>
             </div>
+            {% endblock opnfv %}
             <div class="col-12 d-flex mt-2 justify-content-end">
                 <button id="quick_booking_confirm" onclick="submit_form();" type="button" class="btn btn-success">Confirm</button>
             </div>
diff --git a/src/templates/base/dashboard/landing.html b/src/templates/base/dashboard/landing.html
index 9e45b09..dd09dc4 100644
--- a/src/templates/base/dashboard/landing.html
+++ b/src/templates/base/dashboard/landing.html
@@ -32,9 +32,9 @@
             To get started, please log in with your <a href="/accounts/login">Linux Foundation Jira account</a>
         </h4>
         {% else %}
+        {% block btnGrp %}
         <p>To get started, book a server below:</p>
-        <a class="btn btn-primary btn-lg d-flex flex-column justify-content-center align-content-center border text-white p-4"
-            href="/booking/quick/">
+        <a class="btn btn-primary btn-lg d-flex flex-column justify-content-center align-content-center border text-white p-4" href="/booking/quick/">
             Book a Server
         </a>
         <p class="mt-4">PTLs can use our advanced options to book multi-node pods. If you are a PTL, you may use the options
@@ -45,11 +45,13 @@
             <button class="btn btn-primary" onclick="create_workflow(1)">Design a Pod</button>
             <button class="btn btn-primary" onclick="create_workflow(2)">Configure a Pod</button>
         </div>
+        {% endblock btnGrp %}
         {% endif %}
     </div>
 
     <!-- Returning users -->
     {% if not request.user.is_anonymous %}
+    {% block returningUsers %}
     <div class="col-12 col-lg-6 offset-lg-6 mb-4 mt-lg-4">
         <h2 class="ht-4 border-bottom">Returning Users</h2>
         <p>If you're a returning user, some of the following options may be of interest:</p>
@@ -65,6 +67,7 @@
             {% endif %}
         </div>
     </div>
+    {% endblock returningUsers %}
     {% endif %}
 </div>
 
diff --git a/src/templates/base/layout.html b/src/templates/base/layout.html
index f35f1a7..edf9b6b 100644
--- a/src/templates/base/layout.html
+++ b/src/templates/base/layout.html
@@ -10,7 +10,9 @@
     <meta name="description" content="">
     <meta name="author" content="">
 
+    {% block head-title %}
     <title>OPNFV Laas {{ title }}</title>
+    {% endblock head-title %}
 
     <!-- Bootstrap Core CSS -->
     <link href="{% static "node_modules/bootstrap/dist/css/bootstrap.min.css" %}"
diff --git a/src/templates/laas/base.html b/src/templates/laas/base.html
new file mode 100644
index 0000000..5e9e9db
--- /dev/null
+++ b/src/templates/laas/base.html
@@ -0,0 +1,13 @@
+{% extends "base/base.html" %}
+{% load staticfiles %}
+{% block logo %}
+<div class="col-12 col-sm order-1 order-sm-2 text-center text-lg-left">
+    <a href="https://www.opnfv.org/" class="navbar-brand">
+        <img src="{% static "img/opnfv-logo.png" %}">
+    </a>
+    <a class="navbar-brand d-none d-lg-inline" href={% url 'dashboard:index' %}>
+        Laas Dashboard
+    </a>
+</div>
+{% endblock logo %}
+
diff --git a/src/templates/laas/layout.html b/src/templates/laas/layout.html
new file mode 100644
index 0000000..f9b1d99
--- /dev/null
+++ b/src/templates/laas/layout.html
@@ -0,0 +1,5 @@
+{% extends "base/layout.html" %}
+
+{% block head-title %}
+<title>LaaS Dashboard</title>
+{% endblock head-title %}
-- 
2.16.6