aboutsummaryrefslogtreecommitdiffstats
path: root/src/templates/booking
diff options
context:
space:
mode:
Diffstat (limited to 'src/templates/booking')
-rw-r--r--src/templates/booking/booking_calendar.html2
-rw-r--r--src/templates/booking/booking_delete.html2
-rw-r--r--src/templates/booking/booking_detail.html42
-rw-r--r--src/templates/booking/booking_list.html36
-rw-r--r--src/templates/booking/quick_deploy.html134
-rw-r--r--src/templates/booking/stats.html31
-rw-r--r--src/templates/booking/steps/booking_confirm.html2
-rw-r--r--src/templates/booking/steps/booking_meta.html16
-rw-r--r--src/templates/booking/steps/resource_select.html2
-rw-r--r--src/templates/booking/steps/swconfig_select.html2
10 files changed, 121 insertions, 148 deletions
diff --git a/src/templates/booking/booking_calendar.html b/src/templates/booking/booking_calendar.html
index 1b29dc2..ddcb45d 100644
--- a/src/templates/booking/booking_calendar.html
+++ b/src/templates/booking/booking_calendar.html
@@ -1,7 +1,7 @@
{% extends "base.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block extrahead %}
{{ block.super }}
diff --git a/src/templates/booking/booking_delete.html b/src/templates/booking/booking_delete.html
index 76a5634..b89eb15 100644
--- a/src/templates/booking/booking_delete.html
+++ b/src/templates/booking/booking_delete.html
@@ -1,5 +1,5 @@
{% load jira_filters %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
<p>
Really delete Booking from {{ booking.start}} to {{ booking.end }}?
diff --git a/src/templates/booking/booking_detail.html b/src/templates/booking/booking_detail.html
index ac00e22..918f5af 100644
--- a/src/templates/booking/booking_detail.html
+++ b/src/templates/booking/booking_detail.html
@@ -1,6 +1,6 @@
{% extends "base.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block extrahead %}
{{block.super}}
@@ -19,13 +19,13 @@
<div class="container-fluid">
<div class="row">
- <div class="col-lg-4">
- <div class="panel panel-default">
- <div class="panel-heading clearfix">
+ <div class="col-12 col-lg-5">
+ <div class="card mb-4">
+ <div class="card-header d-flex">
<h4 style="display: inline;">Overview</h4>
- <a data-toggle="collapse" data-target="#panel_overview" class="btn pull-right" style="line-height: 1;">Expand</a>
+ <button data-toggle="collapse" data-target="#panel_overview" class="btn btn-outline-secondary ml-auto">Expand</button>
</div>
- <div class="panel-body collapse in" id="panel_overview">
+ <div class="card-body collapse show" id="panel_overview">
<table class="table">
<tr>
<td>Purpose</td>
@@ -60,12 +60,12 @@
</div>
<div class="row">
<div class="col-lg-12">
- <div class="panel panel-default">
- <div class="panel-heading clearfix">
+ <div class="card">
+ <div class="card-header d-flex">
<h4 style="display: inline;">Pod</h4>
- <a data-toggle="collapse" data-target="#pod_panel" class="btn pull-right" style="line-height: 1;" >Expand</a>
+ <button data-toggle="collapse" data-target="#pod_panel" class="btn btn-outline-secondary ml-auto">Expand</button>
</div>
- <div class="panel-body pod_panel collapse in" id="pod_panel">
+ <div class="card-body collapse show" id="pod_panel">
<table class="table">
{% for host in booking.resource.hosts.all %}
<tr>
@@ -177,14 +177,14 @@
</div>
</div>
</div>
- <div class="col-lg-8">
- <div class="panel panel-default">
- <div class="panel-heading clearfix">
+ <div class="col">
+ <div class="card mb-4">
+ <div class="card-header d-flex">
<h4 style="display: inline;">Deployment Progress</h4>
<p style="display: inline; margin-left: 10px;"> These are the different tasks that have to be completed before your deployment is ready</p>
- <a data-toggle="collapse" data-target="#panel_tasks" class="btn pull-right" style="line-height: 1;" >Expand</a>
+ <button data-toggle="collapse" data-target="#panel_tasks" class="btn btn-outline-secondary ml-auto">Expand</button>
</div>
- <div class="panel-body collapse in" id="panel_tasks">
+ <div class="card-body collapse show" id="panel_tasks">
<table class="table">
<style>
.progress {
@@ -269,15 +269,15 @@
</div>
</div>
<div class="row">
- <div class="col-lg-8">
- <div class="panel panel-default">
- <div class="panel-heading clearfix">
+ <div class="col">
+ <div class="card">
+ <div class="card-header d-flex">
<h4 style="display: inline;">PDF</h4>
- <a data-toggle="collapse" data-target="#pdf_panel" class="btn pull-right" style="line-height: 1;" >Expand</a>
+ <button data-toggle="collapse" data-target="#pdf_panel" class="btn btn-outline-secondary ml-auto">Expand</button>
</div>
- <div class="panel-body collapse in" id="pdf_panel" style="padding: 0px;">
+ <div class="card-body collapse show" id="pdf_panel" style="padding: 0px;">
<pre class="prettyprint lang-yaml" style="margin: 0px; padding: 15px; border: none;">
-{{pdf}}
+ {{pdf}}
</pre>
</div>
</div>
diff --git a/src/templates/booking/booking_list.html b/src/templates/booking/booking_list.html
index a245450..591ecc9 100644
--- a/src/templates/booking/booking_list.html
+++ b/src/templates/booking/booking_list.html
@@ -1,44 +1,38 @@
{% extends "base.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block extrahead %}
{{ block.super }}
<!-- DataTables CSS -->
- <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}"
+ <link href="{% static "bower_components/datatables.net-bs4/css/dataTables.bootstrap4.min.css" %}"
rel="stylesheet">
<!-- DataTables Responsive CSS -->
- <link href="{% static "bower_components/datatables-responsive/css/dataTables.responsive.css" %}"
+ <link href="{% static "bower_components/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css" %}"
rel="stylesheet">
{% endblock extrahead %}
{% block content %}
<div class="row">
- <div class="panel-body">
- <div class="dataTables_wrapper">
- <table class="table table-striped table-bordered table-hover" id="table"
- cellspacing="0"
- width="100%">
- {% include "booking/booking_table.html" %}
- </table>
- </div>
- <!-- /.table-responsive -->
- <!-- /.panel-body -->
- <!-- /.panel -->
+ <div class="col">
+ <div class="panel-body">
+ <div class="dataTables_wrapper">
+ <table class="table table-striped table-bordered table-hover" id="table"
+ cellspacing="0"
+ width="100%">
+ {% include "booking/booking_table.html" %}
+ </table>
+ </div>
+ </div>
</div>
- <!-- /.col-lg-12 -->
</div>
{% endblock content %}
{% block extrajs %}
<!-- DataTables JavaScript -->
- <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}"
- rel="stylesheet">
-
-
- <script src={% static "bower_components/datatables/media/js/jquery.dataTables.min.js" %}></script>
- <script src={% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js" %}></script>
+ <script src={% static "bower_components/datatables.net/js/jquery.dataTables.min.js" %}></script>
+ <script src={% static "bower_components/datatables.net-bs4/js/dataTables.bootstrap4.min.js" %}></script>
<script type="text/javascript">
$(document).ready(function () {
diff --git a/src/templates/booking/quick_deploy.html b/src/templates/booking/quick_deploy.html
index 03eb78c..ea80af4 100644
--- a/src/templates/booking/quick_deploy.html
+++ b/src/templates/booking/quick_deploy.html
@@ -1,6 +1,6 @@
{% extends "base.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block content %}
<style>
.grid_container {
@@ -26,14 +26,23 @@
.grid_element_2third {
grid-column-start: span 8;
}
+ .collaborator_pane {
+ display: flex;
+ flex-direction: column;
+ }
#id_length {
-moz-appearance: none;
border: none;
box-shadow: none;
}
+
input[type=range]::-moz-range-track {
background: #cccccc;
}
+
+ .grid_element {
+ overflow: hidden;
+ }
</style>
{% bootstrap_form_errors form type='non_fields' %}
<form id="quick_booking_form" action="/booking/quick/" method="POST" class="form">
@@ -70,77 +79,57 @@
</div>
</div>
<script type="text/javascript">
- var normalize = function(data)
- {
- //converts the top level keys in data to map to lists
- var normalized = {}
- for( var key in data ){
- normalized[key] = [];
- for( var subkey in data[key] ){
- normalized[key].push(data[key][subkey]);
- }
- }
- return normalized;
- }
- var update_page_contents = function(response)
- {
- document.open();
- document.write(response);
- document.close();
- }
- //form hamdler code
- submit_form = function()
+ function submit_form()
{
- //altered from initial prototype: form submits automatically,
- //but needs formatting for multiple select field
- var data = normalize(result);
- data = JSON.stringify(data);
- document.getElementById("filter_field").value = data;
+ //formats data for form submission
+ document.getElementById("filter_field").value = JSON.stringify(result);
}
- var sup_image_dict = {{ image_filter|safe }};
- var sup_installer_dict = {{ installer_filter|safe }};
- var sup_scenario_dict = {{ scenario_filter|safe }};
-
- function imageHider() {
- var data = normalize(result);
- var drop = document.getElementById("id_image");
+ function hide_dropdown(drop_id) {
+ var drop = document.getElementById(drop_id);
+ //select 'blank' option
for( var i=0; i < drop.length; i++ )
{
if ( drop.options[i].text == '---------' )
- {
drop.selectedIndex = i;
- }
}
+ //cross browser hide children
$('#id_image').children().hide();
-
for( var i = 0; i < drop.childNodes.length; i++ )
{
drop.childNodes[i].disabled = true; // closest we can get on safari to hiding it outright
}
+ }
+ function get_selected_value(key){
+ for( var attr in result[key] ){
+ if( attr in {} )
+ continue;
+ else
+ return attr;
+ }
+ return null;
+ }
- var empty_map = {}
+ var sup_image_dict = {{ image_filter|safe }};
+ var sup_installer_dict = {{ installer_filter|safe }};
+ var sup_scenario_dict = {{ scenario_filter|safe }};
+
+ function imageHider() {
+ var drop = document.getElementById("id_image");
+
+ hide_dropdown("id_image");
+
+ var lab_pk = get_selected_value("lab");
+ var host_pk = get_selected_value("host");
for ( var i=0; i < drop.childNodes.length; i++ )
{
var image_object = sup_image_dict[drop.childNodes[i].value];
if( image_object ) //weed out empty option
{
- var lab_pk = ""
- for( var j in data["labs"][0] )
- {
- if( j in {} ) { continue; }
- else { lab_pk = j; break; }
- }
- var host_pk = "";
- for( var j in data["hosts"][0] )
- {
- if( j in {} ) { continue; }
- else { host_pk = j; break; }
- }
if( image_object.host_profile == host_pk && image_object.lab == lab_pk )
{
drop.childNodes[i].style.display = "inherit";
@@ -171,28 +160,15 @@
document.getElementById('id_installer').addEventListener('change', scenarioHider);
function dropFilter(target, target_filter, master) {
- ob = document.getElementById(target);
+ var dropdown = document.getElementById(target);
- for(var i=0; i<ob.options.length; i++) {
- if ( ob.options[i].text == '---------' ) {
- ob.selectedIndex = i;
- }
- }
-
- targ_id = "#" + target;
-
- $(targ_id).children().hide();
+ hide_dropdown(target);
- for (var i = 0; i < document.getElementById(target).childNodes.length; i++)
- {
- document.getElementById(target).childNodes[i].disabled = true;
- }
var drop = document.getElementById(master);
var opts = target_filter[drop.options[drop.selectedIndex].value];
if (!opts) {
opts = {};
}
- var emptyMap = {}
var map = Object.create(null);
for (var i = 0; i < opts.length; i++) {
@@ -200,34 +176,14 @@
map[j] = true;
}
- for (var i = 0; i < document.getElementById(target).childNodes.length; i++) {
- if (document.getElementById(target).childNodes[i].value in opts && !(document.getElementById(target).childNodes[i].value in emptyMap) ) {
- document.getElementById(target).childNodes[i].style.display = "inherit";
- document.getElementById(target).childNodes[i].disabled = false;
+ for (var i = 0; i < dropdown.childNodes.length; i++) {
+ if (dropdown.childNodes[i].value in opts && !(dropdown.childNodes[i].value in {}) ) {
+ dropdown.childNodes[i].style.display = "inherit";
+ dropdown.childNodes[i].disabled = false;
}
}
}
</script>
- <button onclick="submit_form();" class="btn btn-success">Confirm</button>
+ <button id="quick_booking_confirm" onclick="submit_form();" class="btn btn-success">Confirm</button>
</form>
-<script>
- //context vars
- var prefill_host_selection = "{{host_select_field_prefill_data|default:""|safe}}";
- var prefill_purpose = "{{prefill_purpose|default:""|safe}}";
- var prefill_project = "{{prefill_project|default:""|safe}}";
- var prefill_hostname = "{{prefill_hostname|default:""|safe}}";
-
- //to handle prefill
- function prefill_host_select_field(data)
- {
- //
- if(data)
- {
- make_selection(data);
- }
- }
-
- //call init functions
- prefill_host_select_field(prefill_host_selection);
-</script>
{% endblock %}
diff --git a/src/templates/booking/stats.html b/src/templates/booking/stats.html
index 42eebdd..8bc68cd 100644
--- a/src/templates/booking/stats.html
+++ b/src/templates/booking/stats.html
@@ -41,17 +41,28 @@ function getData(){
{% endblock %}
{% block content %}
- <p>Number of days to plot: </p>
- <div class="form-group">
- <input id="number_days" type="number" class="form-control" min="1" step="1" style="display:inline;width:200px"/>
- <button class="btn btn-primary" onclick="getData();" style="display:inline;">Submit</button>
- </div>
- <div id="all_graph_container">
- <div id="booking_graph_wrapper">
- <div id="booking_graph_container"/>
+ <div class="container-fluid">
+ <div class="row">
+ <div class="col">
+ <p>Number of days to plot: </p>
+ <div class="form-group">
+ <input id="number_days" type="number" class="form-control" min="1" step="1" style="display:inline;width:200px"/>
+ <button class="btn btn-primary" onclick="getData();" style="display:inline;">Submit</button>
+ </div>
+ </div>
</div>
- <div id="user_graph_wrapper" >
- <div id="user_graph_container"/>
+ <div class="row">
+ <div class="col-12 col-md-10">
+ <!-- These graphs do NOT get redrawn when the browser size is changed -->
+ <div id="all_graph_container border" class="mw-100">
+ <div id="booking_graph_wrapper">
+ <div id="booking_graph_container"/>
+ </div>
+ <div id="user_graph_wrapper">
+ <div id="user_graph_container"/>
+ </div>
+ </div>
+ </div>
</div>
</div>
<script>
diff --git a/src/templates/booking/steps/booking_confirm.html b/src/templates/booking/steps/booking_confirm.html
index 9c7e951..40c30a9 100644
--- a/src/templates/booking/steps/booking_confirm.html
+++ b/src/templates/booking/steps/booking_confirm.html
@@ -1,7 +1,7 @@
{% extends "workflow/viewport-element.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block content %}
diff --git a/src/templates/booking/steps/booking_meta.html b/src/templates/booking/steps/booking_meta.html
index fe43f53..710d4ee 100644
--- a/src/templates/booking/steps/booking_meta.html
+++ b/src/templates/booking/steps/booking_meta.html
@@ -1,7 +1,7 @@
{% extends "workflow/viewport-element.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block content %}
@@ -10,6 +10,17 @@
padding: 5%;
}
+ .bkcontrib_panel {
+ display: flex;
+ flex-direction: column;
+ }
+
+ .bkcontrib_panel > .form-group {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ }
+
.panel{
padding: 5%;
/*border: solid 1px black;*/
@@ -48,10 +59,11 @@
</script>
{% bootstrap_field form.info_file %}
<p>You must provide a url to your project's INFO.yaml file if you are a PTL and you are trying to book a POD with multiple servers in it.</p>
+ {% bootstrap_field form.deploy_opnfv %}
</div>
<div class="panel panel_center">
</div>
- <div class="panel">
+ <div class="panel bkcontrib_panel">
<p>You may add collaborators on your booking to share resources with coworkers.</p>
{% bootstrap_field form.users label="Collaborators" %}
</div>
diff --git a/src/templates/booking/steps/resource_select.html b/src/templates/booking/steps/resource_select.html
index 7ccceb3..382316f 100644
--- a/src/templates/booking/steps/resource_select.html
+++ b/src/templates/booking/steps/resource_select.html
@@ -1,7 +1,7 @@
{% extends "workflow/viewport-element.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block content %}
diff --git a/src/templates/booking/steps/swconfig_select.html b/src/templates/booking/steps/swconfig_select.html
index 15c79d8..60a0df7 100644
--- a/src/templates/booking/steps/swconfig_select.html
+++ b/src/templates/booking/steps/swconfig_select.html
@@ -1,7 +1,7 @@
{% extends "workflow/viewport-element.html" %}
{% load staticfiles %}
-{% load bootstrap3 %}
+{% load bootstrap4 %}
{% block content %}