code.grnet.gr Git - flowspy/blob - templates/apply.html

   1 {% extends "b3theme/base.html" %}
   2 {% load widget_tweaks %}
   3 {% load i18n %}
   4
   5 {% block title %}
   6         {% if edit %}
   7                 {% trans "Edit Rule" %} {{form.data.name}}
   8         {% else %}
   9                 {% trans "Create new Rule" %}
  10         {% endif %}
  11 {% endblock %}
  12
  13 {% block breadcrumbs %}
  14  <li class="active"><span class="divider">/</span>
  15         {% if edit %}
  16                 {% trans "Edit rule" %} {{form.data.name}}
  17         {% else %}
  18         {% trans "Create rule" %}
  19         {% endif %}
  20 </li>
  21 {% endblock %}
  22 {% block extrahead %}
  23     <link href="{{STATIC_URL}}b3theme/css/plugins/morris/morris-0.4.3.min.css" rel="stylesheet">
  24     <link href="{{STATIC_URL}}b3theme/css/plugins/timeline/timeline.css" rel="stylesheet">
  25     <link href="{{STATIC_URL}}datepicker/css/datepicker.css" rel="stylesheet">
  26 {% endblock %}
  27
  28 {% block extraheadbottom %}
  29 <style type="text/css">
  30
  31
  32
  33 #rule_form_container input:not([type="submit"]), #rule_form_container select {
  34     background: none repeat scroll 0 0 #FFFFFF;
  35     border: 1px solid #DDDDDD;
  36         -moz-border-radius: 3px; border-radius:3px; -webkit-border-radius: 3px;
  37     float: left;
  38     font-family: "Century Gothic",Helvetica,sans-serif;
  39     font-size: 13px;
  40     outline: medium none;
  41     padding: 5px;
  42     width: 180px;
  43 }
  44
  45
  46 #rule_form_container{
  47         -moz-border-radius: 10px 10px 10px 10px; border-radius:10px; -webkit-border-radius: 10px;
  48         -moz-box-shadow: 0 0 3px #AAAAAA; box-shadow: 0 0 3px #AAAAAA; -webkit-box-shadow: 0 0 3px #AAAAAA;
  49         background-color: #F9F9F9;
  50         border: 2px solid #FFFFFF;
  51         overflow: hidden;
  52     width: 800px;
  53         }
  54 #rule_form_container div label {
  55     color: #666666;
  56     float: left;
  57     font-family: "Century Gothic",Helvetica,sans-serif;
  58     font-size: 15px;
  59     font-weight: bold;
  60     line-height: 26px;
  61     margin-right: 15px;
  62     text-align: right;
  63     text-shadow: 1px 1px 1px #FFFFFF;
  64     width: 180px;
  65 }
  66 #rule_form_container p.submit {
  67     background: none repeat scroll 0 0 transparent;
  68     border: medium none;
  69     box-shadow: none;
  70 }
  71
  72 .errorlist{
  73         list-style: none outside none;
  74 }
  75
  76 </style>
  77 {% endblock %}
  78
  79 {% block pagejsbottom %}
  80 <script type="text/javascript" src="{{STATIC_URL}}datepicker/js/bootstrap-datepicker.js"></script>
  81 <script>
  82         $(document).ready( function(){
  83
  84                 $('#id_expires').datepicker({
  85                         startDate: '+1d',
  86                         endDate: '+10d'
  87                 })
  88                 $('#setFromAll').click(function(){
  89                         $("#id_source").val('0.0.0.0/0');
  90                 });
  91
  92
  93                 /*$('#id_then').attr("multiple", "");*/
  94                 /*
  95                 $( "#id_expires" ).datepicker({ dateFormat: 'yy-mm-dd' , maxDate: '+10d', minDate: '+1d', changeMonth: false, changeYear: false }).datepicker( $.datepicker.regional[ "el" ] );
  96                 */
  97                 {% comment %}
  98                 $('#then_diag').dialog({
  99                         height: 220,
 100             width: 340,
 101                         modal: true,
 102                         autoOpen: false,
 103                         buttons: {
 104                 '{% trans "Add" %}': function() {
 105                         $.ajax({
 106                         url:"{% url add-rate-limit %}",
 107                         data:$("#add_rl_form").serialize(),
 108                         type: "POST",
 109                         cache: false,
 110                         success:function(data){
 111                                         try {
 112                                                 value = data.pk;
 113                                                 text = data.value;
 114                                                 $('#id_then').append($("<option></option>").attr("value",value).text(text));
 115                                                 $('#then_diag').dialog('close');
 116                                         }
 117                                         catch (exception) {
 118                                                 $('#then_diag').html(data);
 119                                         }
 120                                 }
 121                                 });
 122                 },
 123                 '{% trans "Cancel" %}': function() {
 124                         $('#then_diag').dialog('close');
 125                 }
 126         }
 127                 });
 128                 {% endcomment %}
 129
 130                 {% comment %}
 131                 $("#new_then_actions").button({
 132             icons: {
 133                 primary: "ui-icon-plusthick"
 134             },
 135                         })
 136                         .click(function(){
 137                                 $.ajax({
 138                                         url: "{% url add-rate-limit %}",
 139                                         cache: false,
 140                                         success: function(data){
 141                                                 $("#then_diag").html(data);
 142                                         }
 143                                 });
 144                                 $('#then_diag').dialog('open');
 145                                 return false;
 146                         });
 147
 148                         {% endcomment %}
 149                         $(".new_port").click(function(){
 150                                 $(".new_port").hide();
 151                                 $("#addnewport").show()
 152                                 $.ajax({
 153                                         url: "{% url add-port %}",
 154                                         cache: false,
 155                                         success: function(data){
 156                                                 $("#port_diag").html(data);
 157                                         }
 158                                 });
 159                                 // $('#port_diag').dialog('open');
 160                                 return false;
 161                         });
 162
 163                         $('body').on('click', "#addportbtn", function(){
 164                         $.ajax({
 165                         url:"{% url add-port %}",
 166                         data:$("#add_port_form").serialize(),
 167                         type: "POST",
 168                         cache: false,
 169                         success:function(data){
 170                                         try {
 171                                                 value = data.value;
 172                                                 text = data.text;
 173                                                 if (typeof value === 'undefined' && typeof text === 'undefined'){
 174                                                         $('#port_diag').html(data);
 175                                                 }
 176                                                 else{
 177                                                         $('#id_port').append($("<option></option>").attr("value",value).text(text));
 178                                                         $('#id_destinationport').append($("<option></option>").attr("value",value).text(text));
 179                                                         $('#id_sourceport').append($("<option></option>").attr("value",value).text(text));
 180                                                         $('#port_diag').html('');
 181                                                         $('#addnewport').hide();
 182                                                         $(".new_port").show();
 183                                                 }
 184                                         }
 185                                         catch (exception) {
 186                                                 $('#port_diag').html(data);
 187                                         }
 188                                 }
 189                                 });
 190
 191                         });
 192                         $('body').on('click', "#canceladdportbtn", function(){
 193                                 $('#port_diag').html('');
 194                                 $('#addnewport').hide();
 195                                 $(".new_port").show();
 196                         });
 197                         {% comment %}
 198                         function reArrangeSelect(elementId) {
 199                            $("#"+elementId).html($("#"+elementId+" option").sort(function(a, b) {
 200                                 return int(a.text) == int(b.text) ? 0 : int(a.text) < int(b.text) ? -1 : 1
 201                         }));
 202                         }
 203                         {% endcomment %}
 204         });
 205
 206 </script>
 207 {% endblock %}
 208 {% block contentplaceholder %}
 209
 210             <div class="row">
 211                 <div class="col-lg-12">
 212                     <h1 class="page-header"> {% if edit %}{% trans "Edit rule" %}: {{form.data.name}}
 213     {% else %}{% trans "Apply for a new rule" %}
 214     {% endif %}</h1>
 215                 </div>
 216                 <!-- /.col-lg-12 -->
 217             </div>
 218
 219 <div class="row">
 220                 <div class="col-lg-8">
 221                         <div class="panel panel-primary">
 222                         <div class="panel-heading">
 223                             <i class="fa fa-shield fa-fw"></i> Firewall Rule
 224                         </div>
 225                         <!-- /.panel-heading -->
 226                         <div class="panel-body">
 227     <form method="POST" role="form" class="form-horizontal">
 228
 229             {% csrf_token %}
 230             {% load unescape %}
 231             {% if form.non_field_errors %}
 232             <div class="form-group {% if form.non_field_errors %} has-error {% endif %}" style="color: #A94442;">
 233                 {{ form.non_field_errors|unescape}}
 234                 </div>
 235             {% endif %}
 236             <fieldset {%  if edit %}  style="display:none;" {%  endif %}>
 237
 238                  <div class="form-group {% if form.name.errors %} has-error {% endif %}">
 239         <label for="id_name" class="col-md-2 control-label"><b>{% trans "Name" %}</b></label>
 240         <div class="col-md-8">
 241             {% render_field form.name class+="form-control" placeholder="Eg. ntpattack. A unique identifier will be added as a suffix" %}
 242             {% if form.name.errors %} <span class="help-block"> {{ form.name.errors|join:", " }} </span>
 243             {% endif %}
 244         </div>
 245         </div>
 246             </fieldset>
 247             {% if user.is_superuser %}
 248             <fieldset>
 249                 <hr>
 250                    <div class="form-group {% if form.applier.errors %} has-error {% endif %}">
 251                         <label for="id_name" class="col-md-2 control-label"><b>{% trans "Applier" %}</b></label>
 252                         <div class="col-md-8">
 253                             {% render_field form.applier class+="form-control" %}
 254                             {% if form.applier.errors %} <span class="help-block"> {{ form.applier.errors|join:", " }} </span>
 255                             {% endif %}
 256                         </div>
 257                         </div>
 258                 </fieldset>
 259                 {% else %}
 260                  <input type="hidden" id="id_applier" name="applier" value="{{applier}}"/>
 261                 {% endif %}
 262             <fieldset>
 263                 <hr>
 264                 <div class="form-group {% if form.source.errors %} has-error {% endif %}">
 265                         <label for="id_source" class="col-md-2 control-label"><b>{% trans "Source Address" %}</b></label>
 266                         <div class="col-md-6">
 267                             {% render_field form.source class+="form-control" placeholder=form.source.help_text %}
 268                             {% if form.source.errors %} <span class="help-block"> {{ form.source.errors|join:", " }} </span>
 269                             {% endif %}
 270                         </div>
 271                         <div class="col-md-2">
 272                             <img src="{{STATIC_URL}}threat_source.png" style="height: 30px;"/> &nbsp;&nbsp;<button type="button" class="btn btn-md btn-info btn-outline" id="setFromAll">Any</button>
 273                         </div>
 274                         </div>
 275
 276                                 <div class="form-group {% if form.destination.errors %} has-error {% endif %}">
 277                         <label for="id_destination" class="col-md-2 control-label"><b>{% trans "Destination Address" %}</b></label>
 278                         <div class="col-md-6">
 279                             {% render_field form.destination class+="form-control" placeholder=form.destination.help_text %}
 280                             {% if form.destination.errors %} <span class="help-block"> {{ form.destination.errors|join:", " }} </span>
 281                             {% endif %}
 282                         </div>
 283                         <div class="col-md-2">
 284                             <img src="{{STATIC_URL}}secure_destination.png" style="height: 30px;"/>
 285                         </div>
 286                         </div>
 287
 288                                 <div class="form-group {% if form.protocol.errors %} has-error {% endif %}">
 289                         <label for="id_protocol" class="col-md-2 control-label" style="font-weight: normal;">{% trans "Protocol(s)" %}</label>
 290                         <div class="col-md-8">
 291                             {% render_field form.protocol class+="form-control" %}
 292                             {% if form.protocol.errors %} <span class="help-block"> {{ form.protocol.errors|join:", " }} </span>
 293                             {% endif %}
 294                         </div>
 295                         </div>
 296
 297                         <div class="form-group {% if form.fragmenttype.errors %} has-error {% endif %}">
 298                         <label for="id_fragmenttype" class="col-md-2 control-label" style="font-weight: normal;">{% trans "Fragment Type" %}</label>
 299                         <div class="col-md-8">
 300                             {% render_field form.fragmenttype class+="form-control" %}
 301                             {% if form.fragmenttype.errors %} <span class="help-block"> {{ form.fragmenttype.errors|join:", " }} </span>
 302                             {% endif %}
 303                         </div>
 304                         </div>
 305                         </fieldset>
 306                         <!--  PORTS -->
 307                         <fieldset>
 308                 <hr>
 309                         <div class="form-group ">
 310                                 <label class="col-md-10" style="font-weight: normal;"><small>{% trans "Select source/destination port(s), or select common port(s) for both source/destination" %}. {{ form.sourceport.help_text }}</small></label>
 311                         </div>
 312                         <div class="form-group {% if form.sourceport.errors %} has-error {% endif %} {% if form.destinationport.errors %} has-error {% endif %} {% if form.port.errors %} has-error {% endif %}">
 313                         <label for="id_sourceport" class="col-md-2 control-label" style="font-weight: normal;">{% trans "Src. Port(s)" %}</label>
 314                         <div class="col-md-2">
 315                             {% render_field form.sourceport class+="form-control"  %}
 316                             {% if form.sourceport.errors %} <span class="help-block"> {{ form.sourceport.errors|join:", " }} </span>
 317                             {% endif %}
 318                         </div>
 319                                 <label for="id_destinationport" class="col-md-1 control-label" style="font-weight: normal;">{% trans "Dest. Port(s)" %}</label>
 320                         <div class="col-md-2">
 321                             {% render_field form.destinationport class+="form-control"  %}
 322                             {% if form.destinationport.errors %} <span class="help-block"> {{ form.destinationport.errors|join:", " }} </span>
 323                             {% endif %}
 324                         </div>
 325                         <label for="id_port" class="col-md-1 control-label" style="font-weight: normal;">{% trans "Port(s)" %}</label>
 326                         <div class="col-md-2">
 327                             {% render_field form.port class+="form-control"  %}
 328                             {% if form.port.errors %} <span class="help-block"> {{ form.port.errors|join:", " }} </span>
 329                             {% endif %}
 330                         </div>
 331                         </div>
 332                                 <div class="form-group ">
 333                                 <label class="col-md-2" style="font-weight: normal;"></label>
 334                                 <div class="col-md-8">
 335                                         <button class="new_port btn-info btn btn-md btn-outline" type="button">{% trans "Add Port" %}</button>
 336                                 </div>
 337                         </div>
 338                         <div class="form-group " id="addnewport" style="display:none">
 339                                 <label class="col-md-2  control-label" style="font-weight: normal;">{% trans "Add New Port" %}</label>
 340                                 <div class="col-md-8">
 341                                         <div id="port_diag" title="{% trans "Add new port" %}">
 342                                 </div>
 343                         </div>
 344                                 </fieldset>
 345
 346                         <!--  END OF PORTS -->
 347
 348             <fieldset>
 349                                 <hr>
 350
 351                 <div class="form-group {% if form.then.errors %} has-error {% endif %}">
 352                         <label for="id_then" class="col-md-2 control-label">{% trans "Then Actions" %}</label>
 353                         <div class="col-md-8">
 354                             {% render_field form.then class+="form-control" %}
 355                             {% if form.then.errors %} <span class="help-block"> {{ form.then.errors|join:", " }} </span>
 356                             {% endif %}
 357                         </div>
 358                         </div>
 359
 360             </fieldset>
 361             <fieldset>
 362                                 <hr>
 363                 <div class="form-group {% if form.expires.errors %} has-error {% endif %}">
 364                         <label for="id_then" class="col-md-2 control-label">{% trans "Expires" %}</label>
 365                         <div class="col-md-8">
 366                             {% render_field form.expires class+="form-control datepicker" data-date-format="yyyy-mm-dd"  %}
 367                             {% if form.expires.errors %} <span class="help-block"> {{ form.expires.errors|join:", " }} </span>
 368                             {% endif %}
 369                         </div>
 370                         </div>
 371             </fieldset>
 372
 373
 374             <fieldset>
 375                         <hr>
 376
 377                                 <div class="form-group {% if form.comments.errors %} has-error {% endif %}">
 378                         <label for="id_comments" class="col-md-2 control-label">{% trans "Comments" %}</label>
 379                         <div class="col-md-8">
 380                             {% render_field form.comments class+="form-control" placeholder="Give a short description of the intended use of this rule, that justifies the parameter selection above. Feel free to include any additional comments." %}
 381                             {% if form.comments.errors %} <span class="help-block"> {{ form.comments.errors|join:", " }} </span>
 382                             {% endif %}
 383                         </div>
 384                         </div>
 385
 386
 387             </fieldset>
 388                          <div class="form-group">
 389                                 <div class="col-md-2"></div>
 390                                  <div class="col-md-8">
 391                         <button type="submit" id="applybutton" value="{% trans 'Apply' %}" class="btn btn-md btn-primary">Apply</button>
 392                                 </div>
 393                         </div>
 394
 395
 396     </form>
 397 </div></div></div></div>
 398 <div id="then_diag" title="Add new rate-limit value">
 399 </div>
 400 <!-- <div id="port_diag" title="{% trans "Add new port" %}">
 401 </div> -->
 402
 403 {% endblock %}