<div class="container">
  <h1 id="header">{{'admin.batch-import.page.header' | translate}}</h1>
  <p>{{'admin.batch-import.page.help' | translate}}</p>
  <p *ngIf="dso">
    selected collection: <b>{{getDspaceObjectName()}}</b>&nbsp;
    <a href="javascript:void(0)" (click)="removeDspaceObject()">{{'admin.batch-import.page.remove' | translate}}</a>
  </p>
  <p>
    <button class="btn btn-primary" (click)="this.selectCollection();">{{'admin.metadata-import.page.button.select-collection' | translate}}</button>
  </p>
  <div class="form-group">
    <div class="form-check">
      <input class="form-check-input" type="checkbox" id="validateOnly" [(ngModel)]="validateOnly">
      <label class="form-check-label" for="validateOnly">
        {{'admin.metadata-import.page.validateOnly' | translate}}
      </label>
    </div>
    <small id="validateOnlyHelpBlock" class="form-text text-muted">
      {{'admin.batch-import.page.validateOnly.hint' | translate}}
    </small>
  </div>

  <ui-switch color="#ebebeb"
             [checkedLabel]="'admin.metadata-import.page.toggle.upload' | translate"
             [uncheckedLabel]="'admin.metadata-import.page.toggle.url' | translate"
             [checked]="isUpload"
             (change)="toggleUpload()" ></ui-switch>
  <small class="form-text text-muted">
    {{'admin.batch-import.page.toggle.help' | translate}}
  </small>


  <ds-file-dropzone-no-uploader
    *ngIf="isUpload"
    data-test="file-dropzone"
    (onFileAdded)="setFile($event)"
    [dropMessageLabel]="'admin.batch-import.page.dropMsg'"
    [dropMessageLabelReplacement]="'admin.batch-import.page.dropMsgReplace'">
  </ds-file-dropzone-no-uploader>

  <div class="form-group mt-2" *ngIf="!isUpload">
    <input class="form-control" type="text" placeholder="{{'admin.metadata-import.page.urlMsg' | translate}}"
           data-test="file-url-input" [(ngModel)]="fileURL">
  </div>

  <div class="space-children-mr">
    <button class="btn btn-secondary" id="backButton"
            (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
    <button class="btn btn-primary" id="proceedButton"
            (click)="this.importMetadata();">{{'admin.metadata-import.page.button.proceed' | translate}}</button>
  </div>
</div>
