aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/videos
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-07-24 11:40:04 +0200
committerChocobozzz <me@florianbigard.com>2018-07-24 14:04:05 +0200
commit4278710d5b48546709720fac46657b84bba52a18 (patch)
tree625adb1ca2701b6b2dd02044a8fbe68eac2dda18 /client/src/app/videos
parentd411245096b7c9ec06e6fa2ceff7aa7b0fc0c3b7 (diff)
downloadPeerTube-4278710d5b48546709720fac46657b84bba52a18.tar.gz
PeerTube-4278710d5b48546709720fac46657b84bba52a18.tar.zst
PeerTube-4278710d5b48546709720fac46657b84bba52a18.zip
Add ability to click on category/licence/language/tags in watch page
Diffstat (limited to 'client/src/app/videos')
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.html58
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.scss17
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.ts2
3 files changed, 44 insertions, 33 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 e7e9f367c..8764d38c7 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.html
+++ b/client/src/app/videos/+video-watch/video-watch.component.html
@@ -135,49 +135,43 @@
135 135
136 <div class="video-attributes"> 136 <div class="video-attributes">
137 <div class="video-attribute"> 137 <div class="video-attribute">
138 <span i18n class="video-attribute-label"> 138 <span i18n class="video-attribute-label">Privacy</span>
139 Privacy 139 <span class="video-attribute-value">{{ video.privacy.label }}</span>
140 </span>
141 <span class="video-attribute-value">
142 {{ video.privacy.label }}
143 </span>
144 </div> 140 </div>
145 141
146 <div class="video-attribute"> 142 <div class="video-attribute">
147 <span i18n class="video-attribute-label"> 143 <span i18n class="video-attribute-label">Category</span>
148 Category 144 <span *ngIf="!video.category.id" class="video-attribute-value">{{ video.category.label }}</span>
149 </span> 145 <a
150 <span class="video-attribute-value"> 146 *ngIf="video.category.id" class="video-attribute-value"
151 {{ video.category.label }} 147 [routerLink]="[ '/search' ]" [queryParams]="{ categoryOneOf: [ video.category.id ] }"
152 </span> 148 >{{ video.category.label }}</a>
153 </div> 149 </div>
154 150
155 <div class="video-attribute"> 151 <div class="video-attribute">
156 <span i18n class="video-attribute-label"> 152 <span i18n class="video-attribute-label">Licence</span>
157 Licence 153 <span *ngIf="!video.licence.id" class="video-attribute-value">{{ video.licence.label }}</span>
158 </span> 154 <a
159 <span class="video-attribute-value"> 155 *ngIf="video.licence.id" class="video-attribute-value"
160 {{ video.licence.label }} 156 [routerLink]="[ '/search' ]" [queryParams]="{ licenceOneOf: [ video.licence.id ] }"
161 </span> 157 >{{ video.licence.label }}</a>
162 </div> 158 </div>
163 159
164 <div class="video-attribute"> 160 <div class="video-attribute">
165 <span i18n class="video-attribute-label"> 161 <span i18n class="video-attribute-label">Language</span>
166 Language 162 <span *ngIf="!video.language.id" class="video-attribute-value">{{ video.language.label }}</span>
167 </span> 163 <a
168 <span class="video-attribute-value"> 164 *ngIf="video.language.id" class="video-attribute-value"
169 {{ video.language.label }} 165 [routerLink]="[ '/search' ]" [queryParams]="{ languageOneOf: [ video.language.id ] }"
170 </span> 166 >{{ video.language.label }}</a>
171 </div> 167 </div>
172 168
173 <div class="video-attribute"> 169 <div class="video-attribute video-attribute-tags">
174 <span i18n class="video-attribute-label"> 170 <span i18n class="video-attribute-label">Tags</span>
175 Tags 171 <a
176 </span> 172 *ngFor="let tag of getVideoTags()"
177 173 class="video-attribute-value" [routerLink]="[ '/search' ]" [queryParams]="{ tagsOneOf: [ tag ] }"
178 <span class="video-attribute-value"> 174 >{{ tag }}</a>
179 {{ getVideoTags() }}
180 </span>
181 </div> 175 </div>
182 </div> 176 </div>
183 177
diff --git a/client/src/app/videos/+video-watch/video-watch.component.scss b/client/src/app/videos/+video-watch/video-watch.component.scss
index a2d56bd39..7bc2cae02 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.scss
+++ b/client/src/app/videos/+video-watch/video-watch.component.scss
@@ -306,6 +306,23 @@
306 color: #585858; 306 color: #585858;
307 font-weight: $font-bold; 307 font-weight: $font-bold;
308 } 308 }
309
310 a.video-attribute-value {
311 @include disable-default-a-behaviour;
312 color: #000;
313
314 &:hover {
315 opacity: 0.9;
316 }
317 }
318
319 &.video-attribute-tags {
320 .video-attribute-value:not(:nth-child(2)) {
321 &::before {
322 content: ', '
323 }
324 }
325 }
309 } 326 }
310 } 327 }
311 328
diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts
index ff8baaeb3..afbb0c596 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -252,7 +252,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
252 getVideoTags () { 252 getVideoTags () {
253 if (!this.video || Array.isArray(this.video.tags) === false) return [] 253 if (!this.video || Array.isArray(this.video.tags) === false) return []
254 254
255 return this.video.tags.join(', ') 255 return this.video.tags
256 } 256 }
257 257
258 isVideoRemovable () { 258 isVideoRemovable () {