mixin filtersButton
  button.btn.btn-default.navbar-btn(type='button', data-toggle='modal', data-target='#filters') Filters

mixin filtersDialog
  #filters.modal.fade(role='dialog', aria-hidden='true')
    form(method='GET', action=current)
      .modal-dialog
        .modal-content
          .modal-header
            button.close(type='button', data-dismiss='modal', aria-label='Close')
              span(aria-hidden='true') ×
            h2.modal-title Filters
          .modal-body
            p.input-group
              label.input-group-addon(for='filter-searchTerm') Keywords
              input#filter-searchTerm.form-control(name='searchTerm', value=filters.searchTerm || '', placeholder='Terms to be searched')
            div.panel.panel-default
              div.panel-heading(role='tab')
                h3.panel-title
                  a#filter-actors-container-toggler(data-toggle='collapse',
                                                    href='#filter-actors-container',
                                                    aria-controls='filter-actors-container')
                    | Actors
              div#filter-actors-container.panel-collapse.collapse(role='tabpanel',
                                                                  aria-labelledby='filter-actors-container-toggler')
                div.panel-body#filter-actors-fields
                  input(type='hidden', id='filter-actors', name='actors', value=filters.actors.join(','))
            div.panel.panel-default
              div.panel-heading(role='tab')
                h3.panel-title
                  a#filter-tags-container-toggler(data-toggle='collapse',
                                                  href='#filter-tags-container',
                                                  aria-controls='filter-tags-container')
                    | Tags
              div#filter-tags-container.panel-collapse.collapse(role='tabpanel',
                                                                aria-labelledby='filter-tags-container-toggler')
                div.panel-body#filter-tags-fields
                  input(type='hidden', id='filter-tags', name='tags', value=filters.tags.join(','))
            input#filter-after(type='hidden', name='after', value=filters.after)
            input#filter-before(type='hidden', name='before', value=filters.before)
            p#datetimepicker-after.input-group.date
              label.input-group-addon(for='filter-after-format') After (oldest timestamp)
              input#filter-after-format.form-control(type='text', placeholder='YYYY-MM-DD hh:mm:ss')
              span.input-group-addon
                span.glyphicon.glyphicon-calendar
            p#datetimepicker-before.input-group.date
              label.input-group-addon(for='filter-before-format') Before (latest timestamp)
              input#filter-before-format.form-control(type='text', placeholder='YYYY-MM-DD hh:mm:ss')
              span.input-group-addon
                span.glyphicon.glyphicon-calendar
          .modal-footer
            .row
              .col-md-6.text-left
                a.btn.btn-default(href=current) Clear All
              .col-md-6.text-right
                button.btn.btn-default(type='button', data-dismiss='modal') Cancel
                input.btn.btn-primary(type='submit', value='Apply')