diff options
Diffstat (limited to 'client/src/app/videos/+video-watch/video-watch.component.html')
-rw-r--r-- | client/src/app/videos/+video-watch/video-watch.component.html | 66 |
1 files changed, 34 insertions, 32 deletions
diff --git a/client/src/app/videos/+video-watch/video-watch.component.html b/client/src/app/videos/+video-watch/video-watch.component.html index 583a97562..202a12fb0 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.html +++ b/client/src/app/videos/+video-watch/video-watch.component.html | |||
@@ -3,7 +3,7 @@ | |||
3 | <div [hidden]="videoNotFound" id="video-element-wrapper"> | 3 | <div [hidden]="videoNotFound" id="video-element-wrapper"> |
4 | </div> | 4 | </div> |
5 | 5 | ||
6 | <div *ngIf="videoNotFound" id="video-not-found">Video not found :'(</div> | 6 | <div i18n *ngIf="videoNotFound" id="video-not-found">Video not found :'(</div> |
7 | 7 | ||
8 | <!-- Video information --> | 8 | <!-- Video information --> |
9 | <div *ngIf="video" class="margin-content video-bottom"> | 9 | <div *ngIf="video" class="margin-content video-bottom"> |
@@ -12,21 +12,21 @@ | |||
12 | <div> | 12 | <div> |
13 | <div class="video-info-name">{{ video.name }}</div> | 13 | <div class="video-info-name">{{ video.name }}</div> |
14 | 14 | ||
15 | <div class="video-info-date-views"> | 15 | <div i18n class="video-info-date-views"> |
16 | {{ video.publishedAt | myFromNow }} - {{ video.views | myNumberFormatter }} views | 16 | {{ video.publishedAt | myFromNow }} - {{ video.views | myNumberFormatter }} views |
17 | </div> | 17 | </div> |
18 | 18 | ||
19 | <div class="video-info-channel"> | 19 | <div class="video-info-channel"> |
20 | <a [routerLink]="[ '/video-channels', video.channel.id ]" title="Go the channel page"> | 20 | <a [routerLink]="[ '/video-channels', video.channel.id ]" i18n-title title="Go the channel page"> |
21 | {{ video.channel.displayName }} | 21 | {{ video.channel.displayName }} |
22 | </a> | 22 | </a> |
23 | <!-- Here will be the subscribe button --> | 23 | <!-- Here will be the subscribe button --> |
24 | <my-help helpType="custom" customHtml="You can subscribe to this account via any ActivityPub-capable fediverse instance. For instance with Mastodon or Pleroma you can type in the search box <strong>@{{video.account.displayName}}@{{video.account.host}}</strong> and subscribe there. Subscription as a PeerTube user is being worked on in <a href='https://github.com/Chocobozzz/PeerTube/issues/470'>#470</a>."></my-help> | 24 | <my-help helpType="custom" i18n-customHtml customHtml="You can subscribe to this account via any ActivityPub-capable fediverse instance. For instance with Mastodon or Pleroma you can type in the search box <strong>@{{video.account.displayName}}@{{video.account.host}}</strong> and subscribe there. Subscription as a PeerTube user is being worked on in <a href='https://github.com/Chocobozzz/PeerTube/issues/470'>#470</a>."></my-help> |
25 | </div> | 25 | </div> |
26 | 26 | ||
27 | <div class="video-info-by"> | 27 | <div class="video-info-by"> |
28 | <a [routerLink]="[ '/accounts', video.by ]" title="Go the account page"> | 28 | <a [routerLink]="[ '/accounts', video.by ]" i18n-title title="Go the account page"> |
29 | <span>By {{ video.by }}</span> | 29 | <span i18n>By {{ video.by }}</span> |
30 | <img [src]="video.accountAvatarUrl" alt="Account avatar" /> | 30 | <img [src]="video.accountAvatarUrl" alt="Account avatar" /> |
31 | </a> | 31 | </a> |
32 | </div> | 32 | </div> |
@@ -38,24 +38,24 @@ | |||
38 | *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'like' }" (click)="setLike()" | 38 | *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'like' }" (click)="setLike()" |
39 | class="action-button action-button-like" | 39 | class="action-button action-button-like" |
40 | > | 40 | > |
41 | <span class="icon icon-like" title="Like this video" ></span> | 41 | <span class="icon icon-like" i18n-title title="Like this video" ></span> |
42 | </div> | 42 | </div> |
43 | 43 | ||
44 | <div | 44 | <div |
45 | *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'dislike' }" (click)="setDislike()" | 45 | *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'dislike' }" (click)="setDislike()" |
46 | class="action-button action-button-dislike" | 46 | class="action-button action-button-dislike" |
47 | > | 47 | > |
48 | <span class="icon icon-dislike" title="Dislike this video"></span> | 48 | <span class="icon icon-dislike" i18n-title title="Dislike this video"></span> |
49 | </div> | 49 | </div> |
50 | 50 | ||
51 | <div *ngIf="video.support" (click)="showSupportModal()" class="action-button action-button-support"> | 51 | <div *ngIf="video.support" (click)="showSupportModal()" class="action-button action-button-support"> |
52 | <span class="icon icon-support"></span> | 52 | <span class="icon icon-support"></span> |
53 | <span class="icon-text">Support</span> | 53 | <span class="icon-text" i18n>Support</span> |
54 | </div> | 54 | </div> |
55 | 55 | ||
56 | <div (click)="showShareModal()" class="action-button action-button-share"> | 56 | <div (click)="showShareModal()" class="action-button action-button-share"> |
57 | <span class="icon icon-share"></span> | 57 | <span class="icon icon-share"></span> |
58 | <span class="icon-text">Share</span> | 58 | <span class="icon-text" i18n>Share</span> |
59 | </div> | 59 | </div> |
60 | 60 | ||
61 | <div class="action-more" dropdown dropup="true" placement="right"> | 61 | <div class="action-more" dropdown dropup="true" placement="right"> |
@@ -65,32 +65,32 @@ | |||
65 | 65 | ||
66 | <ul *dropdownMenu class="dropdown-menu" id="more-menu" role="menu" aria-labelledby="single-button"> | 66 | <ul *dropdownMenu class="dropdown-menu" id="more-menu" role="menu" aria-labelledby="single-button"> |
67 | <li role="menuitem"> | 67 | <li role="menuitem"> |
68 | <a class="dropdown-item" title="Download the video" href="#" (click)="showDownloadModal($event)"> | 68 | <a class="dropdown-item" i18n-title title="Download the video" href="#" (click)="showDownloadModal($event)"> |
69 | <span class="icon icon-download"></span> Download | 69 | <span class="icon icon-download"></span> <ng-container i18n>Download</ng-container> |
70 | </a> | 70 | </a> |
71 | </li> | 71 | </li> |
72 | 72 | ||
73 | <li *ngIf="isUserLoggedIn()" role="menuitem"> | 73 | <li *ngIf="isUserLoggedIn()" role="menuitem"> |
74 | <a class="dropdown-item" title="Report this video" href="#" (click)="showReportModal($event)"> | 74 | <a class="dropdown-item" i18n-title title="Report this video" href="#" (click)="showReportModal($event)"> |
75 | <span class="icon icon-alert"></span> Report | 75 | <span class="icon icon-alert"></span> <ng-container i18n>Report</ng-container> |
76 | </a> | 76 | </a> |
77 | </li> | 77 | </li> |
78 | 78 | ||
79 | <li *ngIf="isVideoBlacklistable()" role="menuitem"> | 79 | <li *ngIf="isVideoBlacklistable()" role="menuitem"> |
80 | <a class="dropdown-item" title="Blacklist this video" href="#" (click)="blacklistVideo($event)"> | 80 | <a class="dropdown-item" i18n-title title="Blacklist this video" href="#" (click)="blacklistVideo($event)"> |
81 | <span class="icon icon-blacklist"></span> Blacklist | 81 | <span class="icon icon-blacklist"></span> <ng-container i18n>Blacklist</ng-container> |
82 | </a> | 82 | </a> |
83 | </li> | 83 | </li> |
84 | 84 | ||
85 | <li *ngIf="isVideoUpdatable()" role="menuitem"> | 85 | <li *ngIf="isVideoUpdatable()" role="menuitem"> |
86 | <a class="dropdown-item" title="Update this video" href="#" [routerLink]="[ '/videos/update', video.uuid ]"> | 86 | <a class="dropdown-item" i18n-title title="Update this video" href="#" [routerLink]="[ '/videos/update', video.uuid ]"> |
87 | <span class="icon icon-edit"></span> Update | 87 | <span class="icon icon-edit"></span> <ng-container i18n>Update</ng-container> |
88 | </a> | 88 | </a> |
89 | </li> | 89 | </li> |
90 | 90 | ||
91 | <li *ngIf="isVideoRemovable()" role="menuitem"> | 91 | <li *ngIf="isVideoRemovable()" role="menuitem"> |
92 | <a class="dropdown-item" title="Delete this video" href="#" (click)="removeVideo($event)"> | 92 | <a class="dropdown-item" i18n-title title="Delete this video" href="#" (click)="removeVideo($event)"> |
93 | <span class="icon icon-blacklist"></span> Delete | 93 | <span class="icon icon-blacklist"></span> <ng-container i18n>Delete</ng-container> |
94 | </a> | 94 | </a> |
95 | </li> | 95 | </li> |
96 | </ul> | 96 | </ul> |
@@ -109,20 +109,20 @@ | |||
109 | <div class="video-info-description-html" [innerHTML]="videoHTMLDescription"></div> | 109 | <div class="video-info-description-html" [innerHTML]="videoHTMLDescription"></div> |
110 | 110 | ||
111 | <div class="video-info-description-more" *ngIf="completeDescriptionShown === false && video.description?.length >= 250" (click)="showMoreDescription()"> | 111 | <div class="video-info-description-more" *ngIf="completeDescriptionShown === false && video.description?.length >= 250" (click)="showMoreDescription()"> |
112 | Show more | 112 | <ng-container i18n>Show more</ng-container> |
113 | <span *ngIf="descriptionLoading === false" class="glyphicon glyphicon-menu-down"></span> | 113 | <span *ngIf="descriptionLoading === false" class="glyphicon glyphicon-menu-down"></span> |
114 | <my-loader class="description-loading" [loading]="descriptionLoading"></my-loader> | 114 | <my-loader class="description-loading" [loading]="descriptionLoading"></my-loader> |
115 | </div> | 115 | </div> |
116 | 116 | ||
117 | <div *ngIf="completeDescriptionShown === true" (click)="showLessDescription()" class="video-info-description-more"> | 117 | <div *ngIf="completeDescriptionShown === true" (click)="showLessDescription()" class="video-info-description-more"> |
118 | Show less | 118 | <ng-container i18n>Show less</ng-container> |
119 | <span *ngIf="descriptionLoading === false" class="glyphicon glyphicon-menu-up"></span> | 119 | <span *ngIf="descriptionLoading === false" class="glyphicon glyphicon-menu-up"></span> |
120 | </div> | 120 | </div> |
121 | </div> | 121 | </div> |
122 | 122 | ||
123 | <div class="video-attributes"> | 123 | <div class="video-attributes"> |
124 | <div class="video-attribute"> | 124 | <div class="video-attribute"> |
125 | <span class="video-attribute-label"> | 125 | <span i18n class="video-attribute-label"> |
126 | Privacy | 126 | Privacy |
127 | </span> | 127 | </span> |
128 | <span class="video-attribute-value"> | 128 | <span class="video-attribute-value"> |
@@ -131,7 +131,7 @@ | |||
131 | </div> | 131 | </div> |
132 | 132 | ||
133 | <div class="video-attribute"> | 133 | <div class="video-attribute"> |
134 | <span class="video-attribute-label"> | 134 | <span i18n class="video-attribute-label"> |
135 | Category | 135 | Category |
136 | </span> | 136 | </span> |
137 | <span class="video-attribute-value"> | 137 | <span class="video-attribute-value"> |
@@ -140,7 +140,7 @@ | |||
140 | </div> | 140 | </div> |
141 | 141 | ||
142 | <div class="video-attribute"> | 142 | <div class="video-attribute"> |
143 | <span class="video-attribute-label"> | 143 | <span i18n class="video-attribute-label"> |
144 | Licence | 144 | Licence |
145 | </span> | 145 | </span> |
146 | <span class="video-attribute-value"> | 146 | <span class="video-attribute-value"> |
@@ -149,7 +149,7 @@ | |||
149 | </div> | 149 | </div> |
150 | 150 | ||
151 | <div class="video-attribute"> | 151 | <div class="video-attribute"> |
152 | <span class="video-attribute-label"> | 152 | <span i18n class="video-attribute-label"> |
153 | Language | 153 | Language |
154 | </span> | 154 | </span> |
155 | <span class="video-attribute-value"> | 155 | <span class="video-attribute-value"> |
@@ -158,7 +158,7 @@ | |||
158 | </div> | 158 | </div> |
159 | 159 | ||
160 | <div class="video-attribute"> | 160 | <div class="video-attribute"> |
161 | <span class="video-attribute-label"> | 161 | <span i18n class="video-attribute-label"> |
162 | Tags | 162 | Tags |
163 | </span> | 163 | </span> |
164 | 164 | ||
@@ -172,7 +172,7 @@ | |||
172 | </div> | 172 | </div> |
173 | 173 | ||
174 | <div class="other-videos"> | 174 | <div class="other-videos"> |
175 | <div class="title-page title-page-single"> | 175 | <div i18n class="title-page title-page-single"> |
176 | Other videos | 176 | Other videos |
177 | </div> | 177 | </div> |
178 | 178 | ||
@@ -184,13 +184,15 @@ | |||
184 | 184 | ||
185 | 185 | ||
186 | <div class="privacy-concerns" *ngIf="hasAlreadyAcceptedPrivacyConcern === false"> | 186 | <div class="privacy-concerns" *ngIf="hasAlreadyAcceptedPrivacyConcern === false"> |
187 | <strong>Friendly Reminder:</strong> | 187 | <strong i18n>Friendly Reminder:</strong> |
188 | <div class="privacy-concerns-text"> | 188 | <div class="privacy-concerns-text"> |
189 | The sharing system used by this video implies that some technical information about your system (such as a public IP address) can be accessed publicly. | 189 | <ng-container i18n> |
190 | <a title="Get more information" target="_blank" rel="noopener noreferrer" href="/about#p2p-privacy">More information</a> | 190 | The sharing system used by this video implies that some technical information about your system (such as a public IP address) can be accessed publicly. |
191 | </ng-container> | ||
192 | <a i18n i18n-title title="Get more information" target="_blank" rel="noopener noreferrer" href="/about#p2p-privacy">More information</a> | ||
191 | </div> | 193 | </div> |
192 | 194 | ||
193 | <div class="privacy-concerns-okay" (click)="acceptedPrivacyConcern()"> | 195 | <div i18n class="privacy-concerns-okay" (click)="acceptedPrivacyConcern()"> |
194 | OK | 196 | OK |
195 | </div> | 197 | </div> |
196 | </div> | 198 | </div> |