]>
Commit | Line | Data |
---|---|---|
1 | <ng-template #modal> | |
2 | <div class="modal-header"> | |
3 | <h4 i18n class="modal-title">Report video "{{ video.name }}"</h4> | |
4 | <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon> | |
5 | </div> | |
6 | ||
7 | <div class="modal-body"> | |
8 | <form novalidate [formGroup]="form" (ngSubmit)="report()"> | |
9 | ||
10 | <div class="row"> | |
11 | <div class="col-5 form-group"> | |
12 | ||
13 | <label i18n for="reportPredefinedReasons">What is the issue?</label> | |
14 | ||
15 | <div class="ml-2 mt-2 d-flex flex-column"> | |
16 | <ng-container formGroupName="predefinedReasons"> | |
17 | ||
18 | <div class="form-group" *ngFor="let reason of predefinedReasons"> | |
19 | <my-peertube-checkbox [inputName]="reason.id" [formControlName]="reason.id" [labelText]="reason.label"> | |
20 | <ng-template *ngIf="reason.help" ptTemplate="help"> | |
21 | <div [innerHTML]="reason.help"></div> | |
22 | </ng-template> | |
23 | ||
24 | <ng-container *ngIf="reason.description" ngProjectAs="description"> | |
25 | <div [innerHTML]="reason.description"></div> | |
26 | </ng-container> | |
27 | </my-peertube-checkbox> | |
28 | </div> | |
29 | ||
30 | </ng-container> | |
31 | </div> | |
32 | ||
33 | </div> | |
34 | ||
35 | <div class="col-7"> | |
36 | <div class="row justify-content-center"> | |
37 | <div class="col-12 col-lg-9 mb-2"> | |
38 | <div class="screenratio"> | |
39 | <div [innerHTML]="embedHtml"></div> | |
40 | </div> | |
41 | </div> | |
42 | </div> | |
43 | ||
44 | <div class="mb-1 start-at" formGroupName="timestamp"> | |
45 | <my-peertube-checkbox | |
46 | formControlName="hasStart" | |
47 | i18n-labelText labelText="Start at" | |
48 | ></my-peertube-checkbox> | |
49 | ||
50 | <my-timestamp-input | |
51 | [timestamp]="timestamp.startAt" | |
52 | [maxTimestamp]="video.duration" | |
53 | formControlName="startAt" | |
54 | inputName="startAt" | |
55 | > | |
56 | </my-timestamp-input> | |
57 | </div> | |
58 | ||
59 | <div class="mb-3 stop-at" formGroupName="timestamp" *ngIf="timestamp.hasStart"> | |
60 | <my-peertube-checkbox | |
61 | formControlName="hasEnd" | |
62 | i18n-labelText labelText="Stop at" | |
63 | ></my-peertube-checkbox> | |
64 | ||
65 | <my-timestamp-input | |
66 | [timestamp]="timestamp.endAt" | |
67 | [maxTimestamp]="video.duration" | |
68 | formControlName="endAt" | |
69 | inputName="endAt" | |
70 | > | |
71 | </my-timestamp-input> | |
72 | </div> | |
73 | ||
74 | <div i18n class="information"> | |
75 | Your report will be sent to moderators of {{ currentHost }}<ng-container *ngIf="isRemoteVideo()"> and will be forwarded to the video origin ({{ originHost }}) too</ng-container>. | |
76 | </div> | |
77 | ||
78 | <div class="form-group"> | |
79 | <textarea | |
80 | i18n-placeholder placeholder="Please describe the issue..." formControlName="reason" ngbAutofocus | |
81 | [ngClass]="{ 'input-error': formErrors['reason'] }" class="form-control" | |
82 | ></textarea> | |
83 | <div *ngIf="formErrors.reason" class="form-error"> | |
84 | {{ formErrors.reason }} | |
85 | </div> | |
86 | </div> | |
87 | </div> | |
88 | </div> | |
89 | ||
90 | <div class="form-group inputs"> | |
91 | <input | |
92 | type="button" role="button" i18n-value value="Cancel" class="action-button action-button-cancel" | |
93 | (click)="hide()" (key.enter)="hide()" | |
94 | > | |
95 | <input type="submit" i18n-value value="Submit" class="action-button-submit" [disabled]="!form.valid"> | |
96 | </div> | |
97 | ||
98 | </form> | |
99 | </div> | |
100 | </ng-template> |