Merge "Make landing page less sparse"
[pharos-tools.git] / dashboard / src / templates / base.html
1 {% extends "layout.html" %}
2 {% load bootstrap3 %}
3 {% load staticfiles %}
4 {% block extrahead %}
5
6
7     <!-- Custom CSS -->
8     <link href="{% static "bower_components/startbootstrap-sb-admin-2-blackrockdigital/dist/css/sb-admin-2.min.css" %}"
9           rel="stylesheet">
10     <link href="{% static "css/theme.css" %}" rel="stylesheet">
11     <link href="{% static "css/detail_view.css" %}" rel="stylesheet">
12
13 <script type="text/javascript">
14     function cwf(type)
15     {
16         $.ajax({
17             type: "POST",
18             url: "/",
19             data: {"create":type},
20             beforeSend: function(request) {
21                 request.setRequestHeader("X-CSRFToken",
22                 $('input[name="csrfmiddlewaretoken"]').val()
23                 );
24             }
25         }).done(function (data) {
26             window.location.replace("/wf/");
27         }).fail(function(jqxHR, textstatus) {
28             alert("Something went wrong...");});
29     }
30        function continue_wf()
31     {
32         window.location.replace("/wf/");
33     }
34
35     function toggle_create_drop()
36     {
37         drop_div = document.getElementById("create_drop");
38
39         if (drop_div.style.display === "none")
40         {
41             drop_div.style.display = "inherit";
42         }
43         else
44         {
45             drop_div.style.display = "none";
46         }
47     }
48 </script>
49 <style>
50     .create_drop {
51         display: none;
52         width: 100%;
53     }
54
55     .create_drop button {
56         width: 100%;
57     }
58
59     .drop_btn {
60         border-radius: 0px;
61         background-color: CCCCCC
62     }
63
64     .drop_btn:hover {
65         color: #555;
66         border-top: 1px solid #E7E7E7;
67         border-bottom: 1px solid #E7E7E7;
68     }
69 </style>
70
71 {% endblock %}
72 {% block basecontent %}
73     <div id="wrapper">
74         <!-- Navigation -->
75         <nav class="navbar navbar-default navbar-static-top" role="navigation"
76              style="margin-bottom: 0">
77             <div class="navbar-header">
78                 <button type="button" class="navbar-toggle" data-toggle="collapse"
79                         data-target=".navbar-collapse">
80                     <span class="sr-only">Toggle navigation</span>
81                     <span class="icon-bar"></span>
82                     <span class="icon-bar"></span>
83                     <span class="icon-bar"></span>
84                 </button>
85                 <a href="https://www.opnfv.org/" class="navbar-left"><img
86                         src="{% static "img/opnfv-logo.png" %}"></a>
87                 <a class="navbar-brand" href={% url 'dashboard:index' %}>Pharos Dashboard</a>
88             </div>
89             <!-- /.navbar-header -->
90
91             <ul class="nav navbar-top-links navbar-right">
92                 <li class="dropdown">
93                     <a class="dropdown-toggle" data-toggle="dropdown" href="#">
94                         <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
95                     </a>
96                     <ul class="dropdown-menu dropdown-user">
97                         {% if user.is_authenticated %}
98                             <li><a href="{% url 'account:settings' %}"><i
99                                     class="fa fa-gear fa-fw"></i>
100                                 Settings</a>
101                             </li>
102                             <li class="divider"></li>
103                             <li><a href="{% url 'account:logout' %}?next={{ request.path }}"><i
104                                     class="fa fa-sign-out fa-fw"></i>
105                                 Logout</a>
106                             </li>
107                         {% else %}
108                             <li><a href="{% url 'account:login' %}"><i
109                                     class="fa fa-sign-in fa-fw"></i>
110                                 Login with Jira</a>
111                             <li>
112                         {% endif %}
113                     </ul>
114                     <!-- /.dropdown-user -->
115                 </li>
116                 <!-- /.dropdown -->
117             </ul>
118             <!-- /.navbar-top-links -->
119
120             <div class="navbar-default sidebar" role="navigation">
121                 <div class="sidebar-nav navbar-collapse">
122                     <ul class="nav" id="side-menu">
123                         <li>
124                             <a href="/"><i class="fa fa-fw"></i>Home</a>
125                         </li>
126                         <li style="width: 100%;">
127                             <a href="javascript:toggle_create_drop();"><i class="fa fa-fw"></i>Create<i
128                                     class="fa fa-fw fa-caret-down"></i>
129                                 </a>
130                                 {% csrf_token %}
131                                 <div id="create_drop" class="create_drop" style="display:none">
132                                     <button class="btn drop_btn" onclick="location.href='/booking/quick/'">Express Booking</a>
133                                     <button class="btn drop_btn" onclick="cwf(0)">Book a Pod</button>
134                                     <button class="btn drop_btn" onclick="cwf(1)">Design a Pod</button>
135                                     <button class="btn drop_btn" onclick="cwf(2)">Configure a Pod</button>
136                                     <button class="btn drop_btn" onclick="cwf(3)">Create a Snapshot</button>
137                                 </div>
138                         </li>
139                         <li>
140                             <a href="{% url 'resource:hosts' %}"><i
141                                     class="fa fa-fw"></i>Hosts
142                                 </a>
143                         </li>
144                         {% if user.is_authenticated %}
145                         <li>
146                             <a href="{% url 'account:users' %}"><i
147                                     class="fa fa-fw"></i>User List
148                             </a>
149                         </li>
150                         {% endif %}
151                         <li>
152                             <a href="{% url 'booking:list' %}"><i
153                                     class="fa fa-fw"></i>Booking List
154                             </a>
155                         </li>
156                         <li>
157                             <a href="{% url 'booking:stats' %}"><i
158                                     class="fa fa-fw"></i>Booking Statistics</a>
159                         </li>
160                         <li>
161                             <a href="{% url 'api-root' %}"><i
162                                     class="fa fa-fw"></i>API
163                             </a>
164                         </li>
165                         <li>
166                             <a href="{% url 'account:my-account' %}"><i
167                                     class="fa fa-fw"></i>Account
168                             </a>
169                         </li>
170                         <li>
171                             <a href="{% url 'dashboard:all_labs' %}"><i
172                                     class="fa fa-fw"></i>Lab Info
173                             </a>
174                         </li>
175                         <li>
176                             <a href="{% url 'notifier:messages' %}"><i
177                                     class="fa fa-fw"></i>Inbox
178                             </a>
179                         </li>
180                     </ul>
181                 </div>
182                 <!-- /.sidebar-collapse -->
183             </div>
184             <!-- /.navbar-static-side -->
185         </nav>
186
187         <!-- Page Content -->
188         <div id="page-wrapper">
189             {% if title %}
190             <div class="row">
191                 <div class="col-lg-12">
192                     <h1 class="page-header">{{ title }}</h1>
193                 </div>
194                 <!-- /.col-lg-12 -->
195             </div>
196             {% endif %}
197             <div id="bsm">{% bootstrap_messages %}</div>
198
199             {% block content %}
200
201             {% endblock content %}
202         </div>
203         <!-- /#page-wrapper -->
204     </div>
205     <!-- /#wrapper -->
206 {% endblock basecontent %}