]>
Commit | Line | Data |
---|---|---|
1 | <div class="margin-content"> | |
2 | <h1 class="title-page" i18n>Studio for {{ video.name }}</h1> | |
3 | ||
4 | <div class="columns"> | |
5 | <form role="form" [formGroup]="form"> | |
6 | ||
7 | <div class="section cut" formGroupName="cut"> | |
8 | <h2 i18n>CUT VIDEO</h2> | |
9 | ||
10 | <div i18n class="description">Set a new start/end.</div> | |
11 | ||
12 | <div class="form-group"> | |
13 | <label i18n for="cutStart">New start</label> | |
14 | <my-timestamp-input inputName="cutStart" [disableBorder]="false" [maxTimestamp]="video.duration" formControlName="start"></my-timestamp-input> | |
15 | </div> | |
16 | ||
17 | <div class="form-group"> | |
18 | <label i18n for="cutEnd">New end</label> | |
19 | <my-timestamp-input inputName="cutEnd" [disableBorder]="false" [maxTimestamp]="video.duration" formControlName="end"></my-timestamp-input> | |
20 | </div> | |
21 | </div> | |
22 | ||
23 | <div class="section" formGroupName="add-intro"> | |
24 | <h2 i18n>ADD INTRO</h2> | |
25 | ||
26 | <div i18n class="description">Concatenate a file at the beginning of the video.</div> | |
27 | ||
28 | <div class="form-group"> | |
29 | <my-reactive-file | |
30 | formControlName="file" inputName="addIntroFile" i18n-inputLabel inputLabel="Select the intro video file" | |
31 | [extensions]="videoExtensions" [displayFilename]="true" [displayReset]="true" | |
32 | [buttonTooltip]="getIntroOutroTooltip()" | |
33 | ></my-reactive-file> | |
34 | </div> | |
35 | </div> | |
36 | ||
37 | <div class="section" formGroupName="add-outro"> | |
38 | <h2 i18n>ADD OUTRO</h2> | |
39 | ||
40 | <div i18n class="description">Concatenate a file at the end of the video.</div> | |
41 | ||
42 | <div class="form-group"> | |
43 | <my-reactive-file | |
44 | formControlName="file" inputName="addOutroFile" i18n-inputLabel inputLabel="Select the outro video file" | |
45 | [extensions]="videoExtensions" [displayFilename]="true" [displayReset]="true" | |
46 | [buttonTooltip]="getIntroOutroTooltip()" | |
47 | ></my-reactive-file> | |
48 | </div> | |
49 | </div> | |
50 | ||
51 | <div class="section" formGroupName="add-watermark"> | |
52 | <h2 i18n>ADD WATERMARK</h2> | |
53 | ||
54 | <div i18n class="description">Add a watermark image to the video.</div> | |
55 | ||
56 | <div class="form-group"> | |
57 | <my-reactive-file | |
58 | formControlName="file" inputName="addWatermarkFile" i18n-inputLabel inputLabel="Select watermark image file" | |
59 | [extensions]="imageExtensions" [displayFilename]="true" [displayReset]="true" | |
60 | [buttonTooltip]="getWatermarkTooltip()" | |
61 | ></my-reactive-file> | |
62 | </div> | |
63 | </div> | |
64 | ||
65 | <my-button | |
66 | className="orange-button" i18n-label label="Run video edition" icon="circle-tick" | |
67 | (click)="runEdition()" (keydown.enter)="runEdition()" | |
68 | [disabled]="!form.valid || isRunningEdition || noEdition()" | |
69 | ></my-button> | |
70 | </form> | |
71 | ||
72 | ||
73 | <div class="information"> | |
74 | <div> | |
75 | <div class="mb-1 fw-bold" i18n>Video before edition</div> | |
76 | <my-embed [video]="video"></my-embed> | |
77 | </div> | |
78 | ||
79 | <div *ngIf="!noEdition()"> | |
80 | <div class="mb-1 fw-bold" i18n>Edition tasks:</div> | |
81 | ||
82 | <ol> | |
83 | <li *ngFor="let task of getTasksSummary()">{{ task }}</li> | |
84 | </ol> | |
85 | </div> | |
86 | </div> | |
87 | </div> | |
88 | </div> |