Adds Template Overrides

Changes the structure of the template directories to allow
a new project to define their own set of override templates
that inherit from a common base.

I have slightly modified landing.html here as an example.
In comming changes we will try to move all the "laas" specific
content into the laas directory

Change-Id: I46151be182de901f870debb247b305ea34ae77ba
Signed-off-by: Parker Berberian <pberberian@iol.unh.edu>

1 files changed, 163 insertions, 0 deletions

diff --git a/src/templates/base/base.html b/src/templates/base/base.html
new file mode 100644
index 0000000..4011739
--- /dev/null
+++ b/src/templates/base/base.html
@@ -0,0 +1,163 @@
+{% extends "layout.html" %}
+{% load bootstrap4 %}
+{% load staticfiles %}
+{% block extrahead %}
+
+
+<!-- Custom CSS -->
+<link href="{% static "css/base.css" %}" rel="stylesheet">
+<script src="/static/js/dashboard.js"></script>
+
+{% endblock %}
+{% block basecontent %}
+<div id="wrapper" class="d-flex flex-column">
+    <!-- Navigation -->
+    <nav class="navbar navbar-light bg-light navbar-fixed-top border-bottom py-0 mb-0" role="navigation">
+        <div class="container-fluid pb-2 pb-sm-0">
+            <!-- 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>
+            <!-- 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"
+                    aria-expanded="false" aria-controls="sidebar">
+                    <i class="fas fa-bars d-inline"></i>
+                </button>
+            </div>
+            <!-- Login dropdown -->
+            <div class="col-6 col-sm-2 order-3 d-flex">
+                <ul class="nav mx-auto mr-sm-0">
+                    <li class="dropdown ml-auto">
+                        <a class="nav-link p-0 text-dark p-2" data-toggle="dropdown" href="#">
+                            {% if request.user.username %}
+                                {{request.user.username}}
+                            {% else %}
+                                <i class="fas fa-user"></i>
+                            {% endif %}
+                            <i class="fas fa-caret-down rotate"></i>
+                        </a>
+                        <div class="dropdown-menu dropdown-menu-right">
+                            {% if user.is_authenticated %}
+                                <a href="{% url 'account:settings' %}" class="text-dark dropdown-item">
+                                    <i class="fas fa-cog"></i>
+                                    Settings
+                                </a>
+                                <a href="{% url 'account:logout' %}?next={{ request.path }}" class="text-dark dropdown-item">
+                                    <i class="fas fa-sign-out-alt"></i>
+                                    Logout
+                                </a>
+                            {% else %}
+                                <a href="{% url 'account:login' %}" class="text-dark dropdown-item">
+                                    <i class="fas fa-sign-in-alt"></i>
+                                    Login with Jira
+                                </a>
+                            {% endif %}
+                        </div>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Page Content -->
+    <div class="container-fluid d-flex flex-grow-1 px-0 align-items-start flex-column">
+        <div class="row flex-grow-1 w-100 mx-0 align-content-start flex-lg-grow-1">
+            <div class="col-12 col-lg-auto px-0 border-right border-left bg-light" role="navigation">
+                <nav class="navbar navbar-expand-lg border-bottom p-0 w-100 sidebar">
+                    <div class="collapse navbar-collapse" id="sidebar">
+                        <div class="list-group list-group-flush w-100 bg-light">
+                            <a href="/" class="list-group-item list-group-item-action">
+                                Home
+                            </a>
+                            {% csrf_token %}
+                            <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>
+                            </a>
+                            <div class="collapse" id="createList">
+                                <a href="/booking/quick/" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    Express Booking
+                                </a>
+                                <a href="#" onclick="create_workflow(0)" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    Book a Pod
+                                </a>
+                                <a href="#" onclick="create_workflow(1)" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    Design a Pod
+                                </a>
+                                <a href="#" onclick="create_workflow(2)" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    Configure a Pod
+                                </a>
+                                <a href="#" onclick="create_workflow(3)" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    Create a Snapshot
+                                </a>
+                                <a href="#" onclick="create_workflow(4)" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    Configure OPNFV
+                                </a>
+                            </div>
+                            <a href="{% url 'resource:hosts' %}" class="list-group-item list-group-item-action">
+                                Hosts
+                            </a>
+                            {% if user.is_authenticated %}
+                                <a href="{% url 'account:users' %}" class="list-group-item list-group-item-action">
+                                    User List
+                                </a>
+                            {% endif %}
+                            <a href="{% url 'booking:list' %}" class="list-group-item list-group-item-action">
+                                Booking List
+                            </a>
+                            <a href="{% url 'booking:stats' %}" class="list-group-item list-group-item-action">
+                                Booking Statistics
+                            </a>
+                            <a class="list-group-item list-group-item-action" data-toggle="collapse"
+                                href="#accountList" role="button">
+                                Account <i class="fas fa-angle-down rotate"></i>
+                            </a>
+                            <div class="collapse" id="accountList">
+                                <a href="{% url 'account:my-resources' %}" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    My Resources
+                                </a>
+                                <a href="{% url 'account:my-bookings' %}" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    My Bookings
+                                </a>
+                                <a href="{% url 'account:my-configurations' %}" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    My Configurations
+                                </a>
+                                <a href="{% url 'account:my-images' %}" class="list-group-item list-group-item-action list-group-item-secondary">
+                                    My Snapshots
+                                </a>
+                            </div>
+                            <a href="{% url 'dashboard:all_labs' %}" class="list-group-item list-group-item-action">
+                                Lab Info
+                            </a>
+                            <a href="{% url 'notifier:messages' %}" class="list-group-item list-group-item-action">
+                                Inbox
+                            </a>
+                        </div>
+                    </div>
+                </nav>
+            </div>
+            <div class="col overflow-auto flex-grow-1 d-flex flex-column h-100">
+                {% if title %}
+                <div class="row flex-shrink-1">
+                    <div class="col-lg-12">
+                        <h1 class="page-header">{{ title }}</h1>
+                    </div>
+                </div>
+                {% endif %}
+                {% if messages %}
+                    <div id="bsm" class="mt-4">{% bootstrap_messages %}</div>
+                {% endif %}
+                <!-- Content block placed here -->
+                {% block content %}
+                {% endblock content %}
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock basecontent %}