diff options
Diffstat (limited to 'dashboard/src/templates')
10 files changed, 163 insertions, 93 deletions
diff --git a/dashboard/src/templates/account/booking_list.html b/dashboard/src/templates/account/booking_list.html index 4cd1408..21f6ff7 100644 --- a/dashboard/src/templates/account/booking_list.html +++ b/dashboard/src/templates/account/booking_list.html @@ -27,7 +27,7 @@ function edit_booking(pk){ <li>purpose: {{booking.purpose}}</li> </ul> <div class="detail_btn_group"> - <button class="btn" onclick="edit_booking({{booking.id}});">Edit</button> + <button style="display: none" class="btn" onclick="edit_booking({{booking.id}});">Edit</button> <button class="btn" onclick="location.href='/booking/detail/{{booking.id}}/';">Details</button> </div> </div> @@ -44,7 +44,7 @@ function edit_booking(pk){ <li>purpose: {{booking.purpose}}</li> </ul> <div class="detail_btn_group"> - <button class="btn" disabled=true onclick="edit_booking({{booking.id}});">Edit</button> + <button style="display: none" class="btn" disabled=true onclick="edit_booking({{booking.id}});">Edit</button> <button class="btn" onclick="location.href='/booking/detail/{{booking.id}}/';">Details</button> </div> </div> diff --git a/dashboard/src/templates/account/configuration_list.html b/dashboard/src/templates/account/configuration_list.html index f4b174b..b04535b 100644 --- a/dashboard/src/templates/account/configuration_list.html +++ b/dashboard/src/templates/account/configuration_list.html @@ -21,9 +21,10 @@ function edit_configuration(pk){ <li>id: {{config.id}}</li> <li>name: {{config.name}}</li> <li>description: {{config.description}}</li> + <li>resource: {{config.bundle}}</li> </ul> <div class="detail_btn_group"> - <button class="btn" onclick="edit_configuration({{config.id}});">Edit</button> + <button style="display: none" class="btn" onclick="edit_configuration({{config.id}});">Edit</button> </div> </div> {% endfor %} diff --git a/dashboard/src/templates/account/resource_list.html b/dashboard/src/templates/account/resource_list.html index e70cca7..2ef293b 100644 --- a/dashboard/src/templates/account/resource_list.html +++ b/dashboard/src/templates/account/resource_list.html @@ -23,7 +23,7 @@ function edit_resource(pk){ <li>description: {{resource.description}}</li> </ul> <div class="detail_btn_group"> - <button class="btn" onclick="edit_resource({{resource.id}});">Edit</button> + <button style="display: none" class="btn" onclick="edit_resource({{resource.id}});">Edit</button> </div> </div> {% endfor %} diff --git a/dashboard/src/templates/booking/steps/booking_meta.html b/dashboard/src/templates/booking/steps/booking_meta.html index a42e158..e4881ae 100644 --- a/dashboard/src/templates/booking/steps/booking_meta.html +++ b/dashboard/src/templates/booking/steps/booking_meta.html @@ -58,7 +58,6 @@ {% block onleave %} var ajaxForm = $("#booking_meta_form"); var formData = ajaxForm.serialize(); -console.log(formData); req = new XMLHttpRequest(); req.open("POST", "/wf/workflow/", false); req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); diff --git a/dashboard/src/templates/dashboard/searchable_select_multiple.html b/dashboard/src/templates/dashboard/searchable_select_multiple.html index e7128b0..ee460dd 100644 --- a/dashboard/src/templates/dashboard/searchable_select_multiple.html +++ b/dashboard/src/templates/dashboard/searchable_select_multiple.html @@ -1,6 +1,12 @@ <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script> <div class="autocomplete" style="width:400px;"> + <div id="warning_pane" style="background: #FFFFFF; color: #CC0000;"> + {% if incompatible == "true" %} + <h3>Warning: Incompatible Configuration</h3> + <p>Please make a different selection, as the current config conflicts with the selected pod</p> + {% endif %} + </div> <input id="user_field" name="ignore_this" class="form-control" autocomplete="off" type="text" placeholder="{{placeholder}}" value="{{initial.name}}" oninput="search(this.value)" {% if disabled %} disabled {% endif %} > diff --git a/dashboard/src/templates/resource/steps/pod_definition.html b/dashboard/src/templates/resource/steps/pod_definition.html index b2b4998..a72e5a5 100644 --- a/dashboard/src/templates/resource/steps/pod_definition.html +++ b/dashboard/src/templates/resource/steps/pod_definition.html @@ -141,6 +141,14 @@ function main(graphContainer, overviewContainer, toolbarContainer) { } }); + createDeleteDialog = function(id) + { + var content = document.createElement('div'); + var innerHTML = "<button style='width: 46%;' onclick=deleteCell('" + id + "');>Remove</button>" + innerHTML += "<button style='width: 46%;' onclick='currentWindow.destroy();'>Cancel</button>" + content.innerHTML = innerHTML; + showWindow(currentGraph, 'Do you want to delete this network?', content, 200, 62); + } graph.dblClick = function(evt, cell) { if( cell != null ){ @@ -148,11 +156,7 @@ function main(graphContainer, overviewContainer, toolbarContainer) { cell = cell.getParent(); } if( cell.isEdge() || cell.getId().indexOf("network") > -1 ) { - var content = document.createElement('div'); - var innerHTML = "<button onclick=deleteCell('" + cell.getId() + "');>Remove</button>" - innerHTML += "<button onclick='currentWindow.destroy();'>Cancel</button>" - content.innerHTML = innerHTML; - showWindow(this, 'Delete?', content, 200, 200); + createDeleteDialog(cell.getId()); } else { showDetailWindow(cell); @@ -226,8 +230,8 @@ function deleteCell(cellId) { function newNetworkWindow() { var innerHtml = 'Name: <input type="text" name="net_name" id="net_name_input" style="margin:5px;"><br>'; innerHtml += 'Vlan: <input type="number" step="1" name="vlan_id" id="vlan_id_input" style="margin:5px;"><br>'; - innerHtml += '<button type="button" onclick="parseNetworkWindow()">Okay</button>'; - innerHtml += '<button type="button" onclick="currentWindow.destroy();">Cancel</button><br>'; + innerHtml += '<button style="width: 46%;" onclick="parseNetworkWindow()">Okay</button>'; + innerHtml += '<button style="width: 46%;" onclick="currentWindow.destroy();">Cancel</button><br>'; innerHtml += '<div id="current_window_vlans"/>'; innerHtml += '<div id="current_window_errors"/>'; var content = document.createElement("div"); @@ -503,6 +507,7 @@ function makeMxNetwork(vlan_id, net_name) { function addPublicNetwork() { var net = makeMxNetwork(-1, "public"); + network_names.add("public"); makeSidebarNetwork("public", "", net['color'], net['element_id']); } @@ -542,14 +547,32 @@ function updateHosts(removed) { function makeSidebarNetwork(net_name, vlan_id, color, net_id){ var newNet = document.createElement("li"); + var colorBlob = document.createElement("div"); + colorBlob.className = "colorblob"; + var textContainer = document.createElement("p"); + textContainer.className = "network_innertext"; newNet.id = net_id; + var deletebutton = document.createElement("button"); + deletebutton.className = "btn btn-danger"; + deletebutton.style = "float: right; height: 20px; line-height: 8px; vertical-align: middle; width: 20px; padding-left: 5px;"; + deleteButtonText = document.createTextNode("X"); + deletebutton.appendChild(deleteButtonText); + deletebutton.addEventListener("click", function() { + createDeleteDialog(net_id); + }, false); var text = net_name; if(vlan_id){ text += " : " + vlan_id; } var newNetValue = document.createTextNode(text); - newNet.appendChild(newNetValue); - newNet.style['background'] = color; + textContainer.appendChild(newNetValue); + colorBlob.style['background'] = color; + newNet.appendChild(colorBlob); + newNet.appendChild(textContainer); + if( net_name != "public" ) + { + newNet.appendChild(deletebutton); + } document.getElementById("network_list").appendChild(newNet); } @@ -609,7 +632,7 @@ function submitForm() { <!-- Calls the main function after the page has loaded. Container is dynamically created. --> {% block content %} <div id="graphParent" - style="position:absolute;overflow:hidden;top:0px;bottom:0px;width:65%;left:0px;"> + style="position:absolute;overflow:hidden;top:0px;bottom:0px;width:75%;left:0px;"> <div id="graphContainer" style="position:relative;overflow:hidden;top:36px;bottom:0px;left:0px;right:0px;background-image:url('/static/img/mxgraph/grid.gif');cursor:default;"> </div> @@ -617,7 +640,7 @@ function submitForm() { <!-- Creates a container for the sidebar --> <div id="toolbarContainer" - style="position:absolute;white-space:nowrap;overflow:hidden;top:0px;left:0px;max-height:24px;height:36px;right:0px;padding:6px;background-image:url('/static/img/mxgraph/toolbar_bg.gif');"> + style="position:absolute;white-space:nowrap;overflow:hidden;top:0px;left:0px;right:0px;padding:6px;"> </div> <!-- Creates a container for the outline --> @@ -626,8 +649,60 @@ function submitForm() { </div> </div> - <div id="network_select" style="position:absolute;top:0px;bottom:0px;width:35%;right:0px;left:auto;background:grey"> - <button type="button" onclick="newNetworkWindow();">Add Network</button> + <style> + #network_select { + background: inherit; + padding: 0px; + padding-top: 0px; + } + #toolbarContainer { + background: #DDDDDD; + height: 36px; + } + #toolbar_extension { + height: 36px; + background: #DDDDDD; + } + #btn_add_network { + width: 100%; + } + #vlan_notice { + margin: 20px; + } + #network_list li { + border-radius: 2px; + margin: 5px; + padding: 5px; + vertical-align: middle; + background: #DDDDDD; + } + #network_list { + list-style-type: none; + padding: 0; + } + .colorblob { + width: 20px; + height: 20px; + border-radius: 50%; + display: inline-block; + vertical-align: middle; + } + .network_innertext { + display: inline-block; + padding-left: 10px; + vertical-align: middle; + padding-bottom: 0px; + margin-bottom: 2px; + } + .mxWindow { + background: #FFFFFF; + } + </style> + + <div id="network_select" style="position:absolute;top:0px;bottom:0px;width:25%;right:0px;left:auto;"> + <div id="toolbar_extension"> + <button id="btn_add_network" type="button" class="btn btn-primary" onclick="newNetworkWindow();">Add Network</button> + </div> <ul id="network_list"> </ul> <p id="vlan_notice"></p> diff --git a/dashboard/src/templates/workflow/confirm.html b/dashboard/src/templates/workflow/confirm.html index 29b90c8..2510204 100644 --- a/dashboard/src/templates/workflow/confirm.html +++ b/dashboard/src/templates/workflow/confirm.html @@ -66,7 +66,9 @@ req.open("POST", "/wf/workflow/finish/", false); req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); req.onerror = function() { alert("problem with cleaning up session"); } - req.onreadystatechange = function() { if(req.readyState === 4 ) { parent.redirect_root(); } } + req.onreadystatechange = function() { if(req.readyState === 4 ) { + window.top.refresh_iframe(); + }} req.send(formData); } diff --git a/dashboard/src/templates/workflow/exit_redirect.html b/dashboard/src/templates/workflow/exit_redirect.html new file mode 100644 index 0000000..b08df78 --- /dev/null +++ b/dashboard/src/templates/workflow/exit_redirect.html @@ -0,0 +1,6 @@ +<!DOCTYPE html> +<html> + <script> + top.window.location.href='/'; + </script> +</html> diff --git a/dashboard/src/templates/workflow/no_workflow.html b/dashboard/src/templates/workflow/no_workflow.html index ff8aab3..0ac6549 100644 --- a/dashboard/src/templates/workflow/no_workflow.html +++ b/dashboard/src/templates/workflow/no_workflow.html @@ -1,7 +1,3 @@ -{% extends "base.html" %} -{% load staticfiles %} - -{% block content %} -<h3>If you would like to create a booking or a resource, please use the links on the sidebar or from the homepage</h3> -<a href="/">Go Home</a> -{% endblock content %} +<script> + top.window.location.href='/'; +</script> diff --git a/dashboard/src/templates/workflow/viewport-base.html b/dashboard/src/templates/workflow/viewport-base.html index 37eff27..82c1324 100644 --- a/dashboard/src/templates/workflow/viewport-base.html +++ b/dashboard/src/templates/workflow/viewport-base.html @@ -71,7 +71,7 @@ .step_untouched { - background: #98B0AF; + background: #DDDDDD; } .step_invalid @@ -96,10 +96,12 @@ <button id="gob" onclick="go(step-1)" class="btn btn go_btn go_back">Go Back</button> <div class="options"> - <button class="btn" onclick="cancel_wf()">Cancel</button> + <button id="cancel_btn" class="btn" onclick="cancel_wf()">Cancel</button> </div> <div class="btn_wrapper"> -<div id="breadcrumbs"> +<div id="breadcrumbs" class="btn-group"> + <div class="btn-group" id="breadcrumb-wrapper"> + </div> </div> </div> {% csrf_token %} @@ -206,6 +208,14 @@ { context_data = data; update_breadcrumbs(data); + if(data["workflow_count"] == 1) + { + document.getElementById("cancel_btn").innerText = "Exit Workflow"; + } + else + { + document.getElementById("cancel_btn").innerText = "Return to Parent"; + } } function update_breadcrumbs(meta_json) { @@ -240,60 +250,16 @@ while(container.firstChild){ container.removeChild(container.firstChild); } - //draw enough rows for all steps - var depth = meta_json['max_depth']; - for(var i=0; i<=depth; i++){ - var div = document.createElement("DIV"); - div.id = "row"+i; - if(i<depth){ - div.style['margin-bottom'] = "7px"; - } - if(i>0){ - div.style['margin-top'] = "7px"; - } - container.appendChild(div); - } + draw_steps(meta_json); } function draw_steps(meta_json){ - var all_relations = meta_json['relations']; - var relations = []; - var active_steps = []; - var active_step = step; - while(active_step < meta_json['steps'].length){ - active_steps.push(active_step); - var index = meta_json['parents'][active_step]; - var relation = all_relations[index]; - relations.push(relation); - active_step = relation['parent']; - } - var child_index = meta_json['children'][step]; - var my_children = all_relations[child_index]; - if(my_children){ - relations.push(my_children); - } - draw_relations(relations, meta_json, active_steps); - } - - function draw_relations(relations, meta_json, active_steps){ - for(var i=0; i<relations.length; i++){ - var relation = relations[i]; - var children_container = document.createElement("DIV"); - children_container.style['display'] = "inline"; - children_container.style['margin'] = "3px"; - children_container.style['padding'] = "3px"; - console.log("meta_json: "); - console.log(meta_json); - for(var j=0; j<relation['children'].length; j++){ - var step_json = meta_json['steps'][relation['children'][j]]; - step_json['index'] = relation['children'][j]; - var active = active_steps.indexOf(step_json['index']) > -1; - var step_button = create_step(meta_json['steps'][relation['children'][j]], active); - children_container.appendChild(step_button); - } - var parent_div = document.getElementById("row" + relation['depth']); - parent_div.appendChild(children_container); + for( var i = 0; i < meta_json["steps"].length; i++ ) + { + meta_json["steps"][i]["index"] = i; + var step_btn = create_step(meta_json["steps"][i], i == meta_json["active"]); + document.getElementById("breadcrumbs").appendChild(step_btn); } } @@ -301,7 +267,6 @@ var step_dom = document.createElement("DIV"); if(active){ step_dom.className = "step_active"; - console.log(step_json['message']); } else{ step_dom.className = "step"; @@ -333,30 +298,45 @@ { update_message(msg, stat); } + step_dom.classList.add("btn"); var step_number = step_json['index']; step_dom.onclick = function(){ go(step_number); } - //TODO: background color and other style return step_dom; } function cancel_wf(){ - $.ajax({ - type: "POST", - url: "/wf/manager/", - data: {"cancel":"",}, - beforeSend: function(request) { - request.setRequestHeader("X-CSRFToken", - $('input[name="csrfmiddlewaretoken"]').val() - ); - }, - success: redirect_root() - }); + var form = $("#workflow_pop_form"); + var formData = form.serialize(); + var req = new XMLHttpRequest(); + req.open("POST", "/wf/workflow/finish/", false); + req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); + req.onerror = function() { alert("problem occurred while trying to cancel current workflow"); } + req.onreadystatechange = function() { if(req.readyState === 4){ + refresh_iframe(); + }}; + req.send(formData); + } + + function refresh_iframe() { + req = new XMLHttpRequest(); + url = "/wf/workflow/"; + req.open("GET", url, true); + req.onload = function(e) { + var doc = document.getElementById("viewport-iframe").contentWindow.document; + doc.open(); doc.write(this.responseText); doc.close(); + } + req.send(); + } + + function write_iframe(contents) + { + document.getElementById("viewport-iframe").contentWindow.document.innerHTML= contents; } function redirect_root() { - window.location.replace('/'); + window.location.replace('/wf/'); } function add_wf(type){ @@ -448,6 +428,11 @@ </script> <!-- /.col-lg-12 --> </div> +<div style="display: none;" id="workflow_pop_form_div"> +<form id="workflow_pop_form" action="/wf/workflow/finish/" method="post"> + {% csrf_token %} +</form> +</div> <iframe src="/wf/workflow" style="position: absolute; left: 351px; right: 105px; width: calc(100% - 450px); border-style: none; border-width: 1px; border-color: #888888;" scrolling="yes" id="viewport-iframe" onload="resize_iframe();"></iframe> {% endblock content %} |