]>
Commit | Line | Data |
---|---|---|
63347a0f C |
1 | <ng-template #modal let-hide="close"> |
2 | <div class="modal-header"> | |
3 | <h4 i18n class="modal-title">Share</h4> | |
457bb213 | 4 | <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hide()"></my-global-icon> |
63347a0f | 5 | </div> |
cf02fbfb | 6 | |
3a1fed11 | 7 | |
63347a0f | 8 | <div class="modal-body"> |
3a1fed11 C |
9 | <div class="playlist" *ngIf="hasPlaylist()"> |
10 | <div class="title-page title-page-single" i18n>Share the playlist</div> | |
2f4c784a | 11 | |
3a1fed11 | 12 | <my-input-readonly-copy [value]="getPlaylistUrl()"></my-input-readonly-copy> |
2f4c784a | 13 | |
3a1fed11 | 14 | <div class="filters"> |
2f4c784a | 15 | |
3a1fed11 | 16 | <div class="form-group"> |
2f4c784a | 17 | <my-peertube-checkbox |
3a1fed11 C |
18 | inputName="includeVideoInPlaylist" [(ngModel)]="includeVideoInPlaylist" |
19 | i18n-labelText labelText="Share the playlist at this video position" | |
2f4c784a | 20 | ></my-peertube-checkbox> |
cf02fbfb | 21 | </div> |
2c8d4697 | 22 | |
63347a0f | 23 | </div> |
3a1fed11 | 24 | </div> |
5f0805d3 | 25 | |
2f4c784a | 26 | |
3a1fed11 C |
27 | <div class="video"> |
28 | <div class="title-page title-page-single" *ngIf="hasPlaylist()" i18n>Share the video</div> | |
2f4c784a | 29 | |
45c6bcf3 | 30 | <div ngbNav #nav="ngbNav" class="nav-tabs" [(activeId)]="activeId"> |
2f4c784a | 31 | |
45c6bcf3 C |
32 | <ng-container ngbNavItem="url"> |
33 | <a ngbNavLink i18n>URL</a> | |
2f4c784a | 34 | |
45c6bcf3 C |
35 | <ng-template ngbNavContent> |
36 | <div class="nav-content"> | |
3a1fed11 C |
37 | <my-input-readonly-copy [value]="getVideoUrl()"></my-input-readonly-copy> |
38 | </div> | |
3a1fed11 | 39 | </ng-template> |
45c6bcf3 C |
40 | </ng-container> |
41 | ||
42 | <ng-container ngbNavItem="qrcode"> | |
43 | <a ngbNavLink i18n>QR-Code</a> | |
3a1fed11 | 44 | |
45c6bcf3 C |
45 | <ng-template ngbNavContent> |
46 | <div class="nav-content"> | |
be27ef3b | 47 | <qrcode [qrdata]="getVideoUrl()" [size]="256" level="Q"></qrcode> |
3a1fed11 C |
48 | </div> |
49 | </ng-template> | |
45c6bcf3 C |
50 | </ng-container> |
51 | ||
52 | <ng-container ngbNavItem="embed"> | |
53 | <a ngbNavLink i18n>Embed</a> | |
2f4c784a | 54 | |
45c6bcf3 C |
55 | <ng-template ngbNavContent> |
56 | <div class="nav-content"> | |
3a1fed11 C |
57 | <my-input-readonly-copy [value]="getVideoIframeCode()"></my-input-readonly-copy> |
58 | ||
59 | <div i18n *ngIf="notSecure()" class="alert alert-warning"> | |
60 | The url is not secured (no HTTPS), so the embed video won't work on HTTPS websites (web browsers block non secured HTTP requests on HTTPS websites). | |
61 | </div> | |
62 | </div> | |
63 | </ng-template> | |
45c6bcf3 C |
64 | </ng-container> |
65 | ||
66 | </div> | |
3a1fed11 | 67 | |
45c6bcf3 | 68 | <div [ngbNavOutlet]="nav"></div> |
3a1fed11 C |
69 | |
70 | <div class="filters"> | |
2f4c784a | 71 | <div> |
3a1fed11 | 72 | <div class="form-group start-at"> |
2f4c784a | 73 | <my-peertube-checkbox |
3a1fed11 C |
74 | inputName="startAt" [(ngModel)]="customizations.startAtCheckbox" |
75 | i18n-labelText labelText="Start at" | |
2f4c784a C |
76 | ></my-peertube-checkbox> |
77 | ||
78 | <my-timestamp-input | |
3a1fed11 | 79 | [timestamp]="customizations.startAt" |
2f4c784a | 80 | [maxTimestamp]="video.duration" |
3a1fed11 C |
81 | [disabled]="!customizations.startAtCheckbox" |
82 | [(ngModel)]="customizations.startAt" | |
2f4c784a C |
83 | > |
84 | </my-timestamp-input> | |
85 | </div> | |
86 | ||
3a1fed11 | 87 | <div *ngIf="videoCaptions.length !== 0" class="form-group video-caption-block"> |
2f4c784a | 88 | <my-peertube-checkbox |
3a1fed11 C |
89 | inputName="subtitleCheckbox" [(ngModel)]="customizations.subtitleCheckbox" |
90 | i18n-labelText labelText="Auto select subtitle" | |
2f4c784a | 91 | ></my-peertube-checkbox> |
2f4c784a | 92 | |
3a1fed11 C |
93 | <div class="peertube-select-container" [ngClass]="{ disabled: !customizations.subtitleCheckbox }"> |
94 | <select [(ngModel)]="customizations.subtitle" [disabled]="!customizations.subtitleCheckbox"> | |
95 | <option *ngFor="let caption of videoCaptions" [value]="caption.language.id">{{ caption.language.label }}</option> | |
96 | </select> | |
97 | </div> | |
2f4c784a | 98 | </div> |
3a1fed11 | 99 | </div> |
2f4c784a | 100 | |
3a1fed11 C |
101 | <div class="advanced-filters collapse-transition" [ngbCollapse]="isAdvancedCustomizationCollapsed"> |
102 | <div> | |
103 | <div class="form-group stop-at"> | |
104 | <my-peertube-checkbox | |
105 | inputName="stopAt" [(ngModel)]="customizations.stopAtCheckbox" | |
106 | i18n-labelText labelText="Stop at" | |
107 | ></my-peertube-checkbox> | |
108 | ||
109 | <my-timestamp-input | |
110 | [timestamp]="customizations.stopAt" | |
111 | [maxTimestamp]="video.duration" | |
112 | [disabled]="!customizations.stopAtCheckbox" | |
113 | [(ngModel)]="customizations.stopAt" | |
114 | > | |
115 | </my-timestamp-input> | |
116 | </div> | |
2f4c784a | 117 | |
3a1fed11 C |
118 | <div class="form-group"> |
119 | <my-peertube-checkbox | |
120 | inputName="autoplay" [(ngModel)]="customizations.autoplay" | |
121 | i18n-labelText labelText="Autoplay" | |
122 | ></my-peertube-checkbox> | |
123 | </div> | |
2f4c784a | 124 | |
3a1fed11 C |
125 | <div class="form-group"> |
126 | <my-peertube-checkbox | |
127 | inputName="muted" [(ngModel)]="customizations.muted" | |
128 | i18n-labelText labelText="Muted" | |
129 | ></my-peertube-checkbox> | |
130 | </div> | |
131 | ||
132 | <div class="form-group"> | |
133 | <my-peertube-checkbox | |
134 | inputName="loop" [(ngModel)]="customizations.loop" | |
135 | i18n-labelText labelText="Loop" | |
136 | ></my-peertube-checkbox> | |
137 | </div> | |
2f4c784a | 138 | </div> |
3a1fed11 C |
139 | |
140 | <ng-container *ngIf="isInEmbedTab()"> | |
141 | <div class="form-group"> | |
142 | <my-peertube-checkbox | |
143 | inputName="title" [(ngModel)]="customizations.title" | |
144 | i18n-labelText labelText="Display video title" | |
145 | ></my-peertube-checkbox> | |
146 | </div> | |
147 | ||
148 | <div class="form-group"> | |
149 | <my-peertube-checkbox | |
150 | inputName="warningTitle" [(ngModel)]="customizations.warningTitle" | |
151 | i18n-labelText labelText="Display privacy warning" | |
152 | ></my-peertube-checkbox> | |
153 | </div> | |
154 | ||
155 | <div class="form-group"> | |
156 | <my-peertube-checkbox | |
157 | inputName="controls" [(ngModel)]="customizations.controls" | |
158 | i18n-labelText labelText="Display player controls" | |
159 | ></my-peertube-checkbox> | |
160 | </div> | |
161 | </ng-container> | |
162 | </div> | |
de702865 RK |
163 | |
164 | <div (click)="isAdvancedCustomizationCollapsed = !isAdvancedCustomizationCollapsed" role="button" class="advanced-filters-button" | |
165 | [attr.aria-expanded]="!isAdvancedCustomizationCollapsed" aria-controls="collapseBasic"> | |
166 | ||
167 | <ng-container *ngIf="isAdvancedCustomizationCollapsed"> | |
168 | <span class="glyphicon glyphicon-menu-down"></span> | |
169 | ||
170 | <ng-container i18n> | |
171 | More customization | |
172 | </ng-container> | |
173 | </ng-container> | |
174 | ||
175 | <ng-container *ngIf="!isAdvancedCustomizationCollapsed"> | |
176 | <span class="glyphicon glyphicon-menu-up"></span> | |
177 | ||
178 | <ng-container i18n> | |
179 | Less customization | |
180 | </ng-container> | |
181 | </ng-container> | |
182 | </div> | |
2f4c784a | 183 | </div> |
63347a0f | 184 | </div> |
11b8762f | 185 | </div> |
4503cb2a | 186 | |
63347a0f | 187 | </ng-template> |