osops-coda/coda/templates/coda/security_groups.html

95 lines
4.2 KiB
HTML
Executable File

<script type="text/javascript">
$(document).ready(function(){
var csrftoken = Cookies.get('csrftoken');
var project_id = "{{ project_id }}";
var region = "{{ region }}";
var update_cache = "{{ update_cache }}";
$.post('/coda/security_groups/', {csrfmiddlewaretoken: csrftoken, project_id: project_id, region: region, update_cache: update_cache}, function(data, status){
var tbody = $('#securitygroups_{{ region }}_{{ project_id }}').find('tbody');
data = JSON.parse(data);
if(data.length > 0) {
$.each(data, function (i, secgroup) {
var tr = $("<tr>");
var rulesBody = $("<tbody>");
tr.append("<td>" + secgroup.name + "</td>");
tr.append("<td>" + secgroup.description + "</td>");
tr.append("<td>" + secgroup.id + "</td>");
$.each(secgroup.security_group_rules, function (i, rule) {
var rulesRow = $("<tr>");
rulesRow.append("<td>" + rule.id + "</td>");
rulesRow.append("<td>" + rule.direction + "</td>");
rulesRow.append("<td>" + rule.protocol + "</td>");
rulesRow.append("<td>" + rule.port_range_min + "</td>");
rulesRow.append("<td>" + rule.port_range_max + "</td>");
rulesRow.append("<td>" + rule.remote_ip_prefix + "</td>");
rulesBody.append(rulesRow);
});
var ruleTable = $("<table>");
var ruleHeaderRow = $("<tr>");
ruleTable.addClass("table")
ruleTable.addClass("table-bordered")
ruleTable.addClass("datatable")
ruleHeaderRow.append($("<th>UUID</th>").addClass("normal_column"));
ruleHeaderRow.append($("<th>Direction</th>").addClass("normal_column"));
ruleHeaderRow.append($("<th>Protocol</th>").addClass("normal_column"));
ruleHeaderRow.append($("<th>Min Port</th>").addClass("normal_column"));
ruleHeaderRow.append($("<th>Max Port</th>").addClass("normal_column"));
ruleHeaderRow.append($("<th>CIDR</th>").addClass("normal_column"));
ruleTable.append($("<thead>").append(ruleHeaderRow));
ruleTable.append(rulesBody);
ruleTable.append($("<tfoot>").append($("<tr>").append($("<td colspan='6'>"))));
tr.append($("<td>").append(ruleTable));
tbody.append(tr);
});
var footerMessage = "Displaying " + data.length + " item";
if (data.length > 1)
footerMessage += "s";
$('#securitygroups_{{ region }}_{{ project_id }}').find('span').text(footerMessage);
} else {
var resultsDiv = $('#securitygroups_{{ region }}_{{ project_id }}').find('#results');
resultsDiv.html("<h4>No Security Groups in region.</h4>")
}
$('#securitygroups_{{ region }}_{{ project_id }}').find('#querying').hide();
$('#securitygroups_{{ region }}_{{ project_id }}').find('#results').show();
});
});
</script>
<div id="securitygroups_{{ region }}_{{ project_id }}" class="table_wrapper">
<div id="querying">
<h3>Querying Security Groups for region: {{ region }}...</h3>
</div>
<div id="results" style="display: none">
<h3 class="table_title">Security Groups</h3>
<table class="table table-bordered datatable">
<thead>
<tr>
<th class="normal_column">Name</th>
<th class="normal_column">Description</th>
<th class="normal_column">UUID</th>
<th class="normal_column">Rules</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<td colspan="4">
<span class="table_count"></span>
</td>
</tr>
</tfoot>
</table>
</div>
</div>