{{!-- File selector --}}
<div aria-hidden="true" class="modal" id="fileSelectorFormModal">
  <div class="modal-dialog modal-lg file-selector-modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
        <h4 class="modal-title">{{t 'file.selector'}}</h4>
      </div>
      <div class="modal-body">
        <div class="file-uploader-messages"></div>

<div>
  <!-- Nav tabs -->
  <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#fileUploadTab" aria-controls="fileUploadTab" role="tab" data-toggle="tab">{{t 'file.uploader.title'}}</a></li>
  </ul>
  <!-- Tab panes -->
  <div class="tab-content">
    <br>
    <div role="tabpanel" class="tab-pane active" id="fileUploadTab">.
      <!-- The fileinput-button span is used to style the file input field as button -->
      <span class="btn btn-success fileinput-button">
        <span class="glyphicon glyphicon-plus"></span>
        <label for="file-upload-file-field">{{t 'file.upload.selector.btn'}}</label>
        <!-- The file input field used as target for the file upload widget -->
        <input id="file-upload-file-field" class="fileupload" type="file" data-url="/api/v1/file" name="file">
      </span>
      <br>
      <br>
      <!-- The global progress bar -->
      <div class="progress" style="display:none;">
        <div class="progress-bar progress-bar-success"></div>
      </div>
    </div>
  </div>
</div>
      </div>
    </div>
  </div>
</div>
