EVOLUTION-MANAGER

Edit File: traffic_extraction_dialog.html

<div id="{{dialog.id}}" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="{{dialog.id}}_label" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h3>{{dialog.title}}</h3>
	<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      </div>

<div class="modal-body {{dialog.custom_dialog_class}}" style="padding-bottom:0">
        <div id="{{dialog.id}}_notice" class="{{dialog.custom_alert_class or "alert alert-info"}}">{*dialog.message*}<span id="{{dialog.id}}_note"></span></div>
        <form id="{{dialog.id}}Form" style="height:95%;" onkeypress="return event.keyCode != 13;" method="{{dialog.form_method or "post"}}" {% if dialog.form_action ~= nil then %} action="{{dialog.form_action}} {% end %}" {% if dialog.form_onsubmit ~= nil then %} onsubmit="return {{dialog.form_onsubmit}}(this)" {% end %}>
          <input id="{{dialog.id}}_csrf" name="csrf" type="hidden" value="{{ ntop.getRandomCSRFValue() }}" />
          <input id="{{dialog.id}}_epoch_begin" name="epoch_begin" type="hidden" value="" />
          <input id="{{dialog.id}}_epoch_end" name="epoch_end" type="hidden" value="" />
	  <input id="{{dialog.id}}_chart_link" name="url" type="hidden" value="" />
          <div class="tab-content" style="height:100%;">

<div class="row">
              <div class="form-group col-md-3 has-feedback">
                <button class="btn btn-sm btn-secondary" type="button" data-toggle="collapse" data-target="#{{dialog.id}}_advanced" aria-expanded="false" aria-controls="{{dialog.id}}_advanced" id="{{dialog.id}}_advanced_btn">{{i18n("advanced")}} <i class="fas fa-caret-down"></i></button>
              </div>

<div class="form-group col-md-9 text-right asd {{dialog.extract_now_class}}">
		<label class="radio-inline"><input type="radio" name="extract_now" value="1" checked>{{i18n("traffic_recording.extract_now")}}</label>
		<label class="radio-inline"><input type="radio" name="extract_now" value="0">{{i18n("traffic_recording.queue_as_job")}}</label>
	      </div>
            </div>

<div class="row collapse" id="{{dialog.id}}_advanced">
              <div class="form-group col-md-12 has-feedback">
		<br />
                <label class="form-label">{{i18n("traffic_recording.filter_bpf")}} <a href="https://www.ntop.org/guides/n2disk/filters.html"><i class="fas fa-external-link-alt"></i></a></label>
                <div class="input-group">
                  <span class="input-group-addon"><span class="glyphicon glyphicon-filter"></span></span>
                  <input id="{{dialog.id}}_bpf_filter" name="bpf_filter" class="form-control input-sm" data-bpf="bpf" autocomplete="off" spellcheck="false" />
                </div>
	        <br />
	        <label class="form-label">{{i18n("traffic_recording.filter_examples")}}:</label>
	        <br />
	        <ul>
	          <li>{{i18n("traffic_profiles.host_traffic")}}: <i>host 192.168.1.2</i></li>
	          <li>{{i18n("traffic_profiles.http_traffic")}}: <i>tcp and port 80</i></li>
	          <li>{{i18n("traffic_profiles.traffic_between")}}: <i>ip host 192.168.1.1 and 192.168.1.2</i></li>
	          <li>{{i18n("traffic_profiles.traffic_from_to")}}: <i>ip src 192.168.1.1 and dst 192.168.1.2</i></li>
	        </ul>
              </div>
            </div>

</div>
        </form>

</div>
      <div class="modal-footer" style="margin-top:0">
        <button class="btn btn-secondary" data-dismiss="modal" aria-hidden="true">{{i18n("cancel")}}</button>
        <button id="{{dialog.id}}SubmitBtn" class="btn btn-primary" onClick="$('#{{dialog.id}}Form').submit();">{{i18n("traffic_recording.extract_action")}}</button>
      </div>
    </div>
  </div>
</div>