github.com/readium/readium-lcp-server@v0.0.0-20240101192032-6e95190e99f1/frontend/manage/app/publication/publication-form.component.html (about)

     1  <form [formGroup]="form" >
     2    <div *ngIf="!publication" class="form-group">
     3  
     4      <label>Origin of the file</label>
     5      <div class="form-check">
     6        <label class="form-check-label">
     7          <input type="radio" class="form-check-input" checked="form.value['type'] == 'UPLOAD'"
     8            value="UPLOAD" [formControl]="form.controls['type']">
     9          Drag & drop 
    10        </label>
    11      </div>
    12      <div class="form-check">
    13        <label class="form-check-label">
    14          <input type="radio" class="form-check-input"
    15            value="FOLDER" [formControl]="form.controls['type']" >
    16          Pick from the master repository
    17        </label>
    18      </div>
    19      <br/>
    20      <label for="publication-filename">EPUB, PDF, LPF or Readium Package file</label>
    21      <div *ngIf="form.value['type'] == 'UPLOAD'">
    22        <div ng2FileDrop
    23                        [ngClass]="{'nv-file-over': hasBaseDropZoneOver, 'nv-bad-file':notAPublication}"
    24                        (fileOver)="fileOverBase($event)"
    25                        [uploader]="uploader"
    26                        class="drop-zone">
    27            <div *ngIf="droppedItem&&!notAPublication">{{droppedItem.file.name}}</div>
    28            <div *ngIf="!droppedItem&&!notAPublication">Drop a publication here</div>
    29            <div *ngIf="droppedItem&&notAPublication">The file must have an .epub, .pdf, .lpf, .webpub, .audiobook or .divina extension.</div>
    30        </div>
    31      </div>
    32      <div *ngIf="form.value['type'] != 'UPLOAD'">
    33        <select
    34          id="publication-filename" class="form-control"
    35          [formControl]="form.controls['filename']">
    36          <option value="">Select a publication</option>
    37          <option *ngFor="let file of masterFiles">
    38            {{file.name}}
    39          </option>
    40        </select>
    41      </div>
    42    </div>
    43    <div class="form-group">
    44      <label for="publication-title">Title of the publication</label>
    45      <input
    46          id="publication-title" class="form-control" placeholder="Enter a title"
    47          [formControl]="form.controls['title']">
    48    </div>
    49    <button type="submit" (click)="onSubmit(true)"[disabled]="(((!uploader.getNotUploadedItems().length && !this.form.value['filename']) || !this.form.value['title'] || (!this.form.value['filename'] && notAPublication)) && !hideFilename) || (hideFilename && !this.form.value['title'])" class="btn btn-primary">{{submitButtonLabel}}</button>
    50    <button type="button" (click)="onCancel()" class="btn btn-secondary">Cancel</button>
    51  </form>
    52  
    53  <div id="snackbar">
    54    <div *ngIf="uploadConfirmation">
    55      <p>A publication with this name already exists. Shall we replace it with this new file?</p>
    56      <button (click)="hideSnackBar();onSubmit(false)">Yes</button><button (click)="hideSnackBar()">No</button>
    57    </div>
    58    <div *ngIf="!uploadConfirmation">
    59      {{errorMessage}}
    60    </div>
    61  </div>