Commit daf265d4 by Kálmán Viktor

network: bootstrap3 migration and bugfixes

parent 6f49fcd2
......@@ -285,4 +285,6 @@ finally:
TEST_RUNNER = 'django_nose.NoseTestSuiteRunner'
CRISPY_TEMPLATE_PACK = 'bootstrap3'
# vim: et sw=4 ai fenc=utf8 smarttab :
......@@ -174,7 +174,14 @@ function validateForm() {
// name
record_name = $('#id_name').val()
if(!domain_re.test(record_name)) {
if(!record_name) {
messages.push({
'message': gettext("You must specify a name!"),
'id': 'name'
});
}
else if(!domain_re.test(record_name)) {
text = gettext('%s - invalid domain name'),
messages.push({
'message': interpolate(text, [record_name]),
......@@ -230,8 +237,8 @@ function resetForm() {
// removes all error messages / classes
function resetErrors() {
// reset invalid inputs too
$('div[id^="div_id_"][class*="error"]').each(function() {
$(this).removeClass('error');
$('div[id^="div_id_"][class*="has-error"]').each(function() {
$(this).removeClass('has-error');
});
// remove the error messages
......@@ -267,7 +274,7 @@ $(function() {
$('#submit-id-submit').hide();
$('#div_id_type .controls').append(
//' <a id="type_next" onclick="type_next()" class="btn btn-info">Next</a>'
'<span id="type_next" class="help-inline"><strong>' +
'<span id="type_next" class="help-block"><strong>' +
gettext('Specify a type!') +
'</strong></span>'
);
......@@ -301,16 +308,16 @@ function type_next() {
function appendMessage(type, messages, id) {
$('#js_error').remove();
resetErrors();
message = '<div id="js_error" style="display: none;" class="alert alert-' + type + ' alert-block"><ul>'
message = '<div id="js_error" style="display: none;" class="alert alert-danger"><ul>'
for(var i = 0;i < messages.length; i++) {
message += "<li>" +messages[i].message+ "</li>";
if(messages[i].id) {
$('#id_' + messages[i].id).closest('div[class="control-group"]').addClass("error");
$('#id_' + messages[i].id).closest('div[class="form-group"]').addClass("has-error");
}
}
message +='</ul></div>';
$('.form-horizontal').before(message);
$('form').before(message);
$('html, body').animate({ scrollTop: 0}, 'slow', function() {
$('#js_error').fadeIn();
});
......@@ -321,8 +328,8 @@ function appendMessage(type, messages, id) {
// it also removes the help-inline span that shouldn't really appear
$('* [id^="id_"]').focus(function() {
id = "#div_" + $(this).prop('id');
if($(id).hasClass('error')) {
$(id).removeClass('error');
if($(id).hasClass('has-error')) {
$(id).removeClass('has-error');
$('span[id="error_1_' + $(this).attr('id') + '"]').remove();
}
});
......@@ -9,13 +9,23 @@
<title>{% block title %}Firewall GUI{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,400&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<link href="{% static "css/bootstrap.min.css" %}" rel="stylesheet">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" />
<style type="text/css">
body {
padding-top:40px;
}
/* note: this doesn't really work */
a i:hover {
text-decoration: none;
}
footer {
margin-top: 40px;
}
</style>
<link href="{% static "css/bootstrap-responsive.min.css" %}" rel="stylesheet">
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
......@@ -26,21 +36,19 @@
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="{% url network.index %}">CIRCLE Network</a>
<div class="nav-collapse collapse">
<ul class="nav">
<div class="navbar-header">
<a class="navbar-brand" href="{% url network.index %}">CIRCLE Network</a>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
{% include "network/menu.html" %}
</ul>
</div>
</div>
</div>
</div>
{% block messages %}
{% if messages %}
......@@ -52,14 +60,18 @@
{% endif %}
{% endblock messages %}
<div class="container">
{% block content %}
<div class="alert-block">This is an abstract base template.</div>
{% endblock %}
</div>
{% block content %}
<div class="alert-block">This is an abstract base template.</div>
{% endblock %}
<footer>
<p class="pull-right"><a href="#">Vissza az oldal tetejére</a></p>
<p>&copy; 2013 BME Közigazgatási Informatikai Központ
</footer>
</div><!-- .container -->
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="{% url network.js_catalog %}"></script>
<script src="{% static "js/bootstrap.min.js" %}"></script>
<script src="{% static "js/bootbox.min.js" %}"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<!--<script src="{% static "js/select2-3.4.0/select2.min.js" %}"></script>-->
<script src="{% static "js/network.js" %}"></script>
<script>
......
......@@ -6,9 +6,12 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<h1>{{ form.ipv4.value }} <small>details of restriction</small></h1>
<div class="page-header">
<h1>{{ form.ipv4.value }} <small>{{ form.type.value }}</small></h1>
</div>
<div class="row">
<div class="col-sm-4">
{% crispy form %}
</div>
</div>
{% crispy form %}
{% endblock %}
......@@ -5,7 +5,7 @@
{% load staticfiles %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>Blacklist <small></small></h1>
</div>
......
{% load i18n %}
{% load l10n %}
<span style="color: #FF0000;">[{{ record.r_type }}]</span>
{# <span style="color: #FF0000;">[{{ record.r_type }}]</span> #}
{% if record.direction == "1" %}{{ record.foreign_network }}{% else %}{{ record.r_type }}{% endif %}
{#<span style="color: #0000FF;"> ▸ </span>#}
<i class="icon-arrow-right"></i>
......
......@@ -11,10 +11,10 @@
{% endif %}
{% if record.extra %}
<span class="label label-inverse">{{ record.extra }}</span>
<span class="label label-default">{{ record.extra }}</span>
{% endif %}
{% if record.nat %}
<span class="label">NAT
<span class="label label-success">NAT
[ {{ record.dport }} <i class="icon-arrow-right"></i> {{record.nat_dport}} ]</span>
{% endif %}
......@@ -6,9 +6,13 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<h1>{{ form.name.value }} <small>details of domain</small></h1>
<div class="page-header">
<h1>{{ form.name.value }} <small></small></h1>
</div>
{% crispy form %}
<div class="row">
<div class="col-sm-4">
{% crispy form %}
</div>
</div>
{% endblock %}
......@@ -5,7 +5,7 @@
{% load staticfiles %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>Domains <small>list of all domains</small></h1>
</div>
......
......@@ -6,9 +6,13 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>{{ form.name.value }} <small>details of group</small></h1>
</div>
{% crispy form %}
<div class="row">
<div class="col-sm-6">
{% crispy form %}
</div>
</div>
{% endblock %}
......@@ -5,7 +5,7 @@
{% load staticfiles %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>Host groups <small>list of all host groups</small></h1>
</div>
......
......@@ -6,16 +6,17 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h2>Create a new host</h2>
</div>
<div class="row">
<div class="span8">
<div class="col-sm-8">
{% crispy form %}
</div>
<div class="span4">
</div><!-- span4 -->
<div class="col-sm-4">
Maybe some help text here?
</div><!-- col-sm-4 -->
</div><!-- row -->
{% endblock %}
......@@ -6,48 +6,61 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>{{ form.hostname.value }} <small>details of host</small></h1>
</div>
<div class="row">
<div class="span8">
{% crispy form %}
</div>
<div class="span4">
<h3>Rules</h3>
{% render_table rule_list %}
<h3>Groups</h3>
{% for group in group_rule_list %}
<div>
<h4 id="{{ group.pk }}_group_pk">{{ group.name }}
<a href="{% url network.remove_host_group pk=host_pk group_pk=group.pk %}?from={{ request.path }}">
<i class="icon-remove" style="vertical-align: middle;"></i></a>
<a href="{% url network.group group.pk %}">
<i class="icon-pencil" style="vertical-align: middle;"></i></a>
</h4>
{% render_table group.table %}
<div class="col-sm-8">
{% crispy form %}
</div>
<div class="col-sm-4">
<div class="page-header">
<h3>Rules</h3>
</div>
{% endfor %}
<h3>Add host group</h3>
{% if rule_list.data.data.count > 0 %}
{% render_table rule_list %}
{% else %}
No rules associated with this host!
{% endif %}
<div class="page-header">
<h3>Groups</h3>
</div>
{% for group in group_rule_list %}
<div>
<h4 id="{{ group.pk }}_group_pk">{{ group.name }}
<a href="{% url network.remove_host_group pk=host_pk group_pk=group.pk %}?from={{ request.path }}">
<i class="icon-remove" style="vertical-align: middle;"></i></a>
<a href="{% url network.group group.pk %}">
<i class="icon-pencil" style="vertical-align: middle;"></i></a>
</h4>
{% render_table group.table %}
</div>
{% endfor %}
<div class="page-header">
<h3>Add host group</h3>
</div>
{% if not_used_groups|length == 0 %}
No more groups to add!
{% else %}
<form action="{% url network.add_host_group pk=host_pk %}" method="POST">
<form action="{% url network.add_host_group pk=host_pk %}" method="POST">
{% csrf_token %}
<div class="input-append">
<select name="group" id="add_group">
{% for rest in not_used_groups %}
<option value="{{ rest.pk }}">{{ rest }}</option>
{% endfor %}
</select>
<input type="submit" value="Add group" class="btn"></input>
</div><!-- input append -->
</form>
<div class="input-group">
<select name="group" id="add_group" class="form-control">
{% for rest in not_used_groups %}
<option value="{{ rest.pk }}">{{ rest }}</option>
{% endfor %}
</select>
<div class="input-group-btn">
<input type="submit" value="Add group" class="btn btn-default"></input>
</div>
</div><!-- input-group -->
</form>
{% endif %}
</div><!-- span4 -->
</div><!-- col-sm-4 -->
</div><!-- row -->
{% endblock %}
......@@ -8,7 +8,7 @@
<style>
</style>
<div class="page-heading">
<div class="page-header">
<h1>
Hosts
<small>
......@@ -18,7 +18,7 @@
</h1>
</div>
<ul class="nav nav-pills">
<ul class="nav nav-pills" style="margin: 5px 0 20px 0;">
<li class="disabled"><a href="#">Filter by vlans</a></li>
<li {% if not request.GET.vlan %} class="active"{% endif %}><a href="{{ request.path }}">ALL</a></li>
{% for vlan in vlans %}
......
......@@ -5,7 +5,7 @@
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>Latest modifications</h1>
</div>
......@@ -23,15 +23,15 @@
<td><a href="{{ l.link }}">{{ l.name }}</a></td>
<td>{{ l.modified_at|timesince }}</td>
</tr>
{% endfor %}
{% endfor %}
</table>
<div class="page-heading">
<div class="page-header">
<h1>Dashboard <small>foo bar baz</small></h1>
</div>
<ul class="thumbnails">
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead"><a href="{% url network.host_list %}">Hosts</a> are machines on the network.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......@@ -39,7 +39,7 @@
</p>
</div>
</li>
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead">Lorem ipsum <a href="#">dolor</a> sit amet, consectetur adipiscing elit.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......@@ -47,7 +47,7 @@
</p>
</div>
</li>
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead">Lorem ipsum <a href="#">dolor</a> sit amet, consectetur adipiscing elit.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......@@ -55,7 +55,7 @@
</p>
</div>
</li>
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead">Lorem ipsum <a href="#">dolor</a> sit amet, consectetur adipiscing elit.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......@@ -66,7 +66,7 @@
</ul>
<ul class="thumbnails">
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead">Lorem ipsum <a href="#">dolor</a> sit amet, consectetur adipiscing elit.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......@@ -74,7 +74,7 @@
</p>
</div>
</li>
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead">Lorem ipsum <a href="#">dolor</a> sit amet, consectetur adipiscing elit.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......@@ -82,7 +82,7 @@
</p>
</div>
</li>
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead">Lorem ipsum <a href="#">dolor</a> sit amet, consectetur adipiscing elit.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......@@ -90,7 +90,7 @@
</p>
</div>
</li>
<li class="span3">
<li class="col-sm-3">
<div class="thumbnail">
<p class="lead">Lorem ipsum <a href="#">dolor</a> sit amet, consectetur adipiscing elit.</p>
<p>Proin mattis enim risus. Ut condimentum eu enim quis auctor. Duis lobortis sollicitudin lacus, scelerisque dictum arcu aliquam nec.</p>
......
......@@ -6,20 +6,19 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h2>Create a new record</h2>
</div>
<div class="row">
<div class="span8">
<div class="col-sm-6">
{% crispy form %}
</div>
<div class="span4">
</div><!-- span4 -->
<div class="col-sm-4">
</div><!-- col-sm-4 -->
</div><!-- row -->
{% endblock %}
{% block extra_etc %}
<script src="{% static "js/record-create.js" %}"></script>
<script src="{% static "js/record.js" %}"></script>
{% endblock %}
~
......@@ -6,12 +6,17 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>{{ fqdn }} <small>details of record</small></h1>
</div>
{% crispy form %}
<div class="row">
<div class="col-sm-6">
{% crispy form %}
</div>
</div>
{% endblock %}
{% block extra_etc %}
<script src="{% static "js/record-create.js" %}"></script>
<script src="{% static "js/record.js" %}"></script>
{% endblock %}
......@@ -5,7 +5,7 @@
{% load staticfiles %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>
Records
<small>
......
......@@ -6,9 +6,17 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<h1>{{ form.hostname.value }} <small>details of rule</small></h1>
<div class="page-header">
<h3>
{% with rule as record %}
{% include "network/columns/host-rule.html" %}
{% endwith %}
</h3>
</div>
{% crispy form %}
<div class="row">
<div class="col-sm-7">
{% crispy form %}
</div>
</div>
{% endblock %}
......@@ -5,7 +5,7 @@
{% load staticfiles %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>Rules <small>list of all rules</small></h1>
</div>
......
......@@ -6,16 +6,16 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>{{ form.name.value }} <small>details of vlan</small></h1>
</div>
<div class="row">
<div class="span8">
{% crispy form %}
</div>
<div class="span4">
{% render_table host_list %}
</div>
<div class="col-sm-8">
{% crispy form %}
</div>
<div class="col-sm-4">
{% render_table host_list %}
</div>
</div>
{% endblock %}
......@@ -6,9 +6,13 @@
{% load crispy_forms_tags %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>{{ form.name.value }} <small>details of vlan group</small></h1>
</div>
{% crispy form %}
<div class="row">
<div class="col-sm-6">
{% crispy form %}
</div>
</div>
{% endblock %}
......@@ -5,7 +5,7 @@
{% load staticfiles %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>Vlan groups <small>list of all vlan groups</small></h1>
</div>
......
......@@ -5,7 +5,7 @@
{% load staticfiles %}
{% block content %}
<div class="page-heading">
<div class="page-header">
<h1>Vlans <small>list of all vlans</small></h1>
</div>
......
......@@ -143,6 +143,18 @@ class HostDetail(UpdateView):
self.object = self.get_object()
return super(HostDetail, self).get(request, *args, **kwargs)
def post(self, request, *args, **kwargs):
pk = self.kwargs.get('pk')
# this is usually not None (well, with curl and whatnot it can be)
if pk:
groups = Host.objects.get(pk=pk).groups.all()
groups = [i.pk for i in groups]
# request.POST is immutable
post_copy = request.POST.copy()
post_copy.setlist('groups', groups)
request.POST = post_copy
return super(HostDetail, self).post(request, *args, **kwargs)
def get_context_data(self, **kwargs):
context = super(HostDetail, self).get_context_data(**kwargs)
# own rules
......@@ -225,6 +237,15 @@ class RuleDetail(UpdateView):
if 'pk' in self.kwargs:
return reverse_lazy('network.rule', kwargs=self.kwargs)
def get_context_data(self, **kwargs):
context = super(RuleDetail, self).get_context_data(**kwargs)
pk = self.kwargs.get('pk')
rule = Rule.objects.get(pk=pk)
context['rule'] = rule
return context
class RuleDelete(DeleteView):
model = Rule
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment