aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.scss24
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.ts5
2 files changed, 17 insertions, 12 deletions
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 4ce17209f..a2d56bd39 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.scss
+++ b/client/src/app/videos/+video-watch/video-watch.component.scss
@@ -5,12 +5,6 @@
5 background-color: #000; 5 background-color: #000;
6 display: flex; 6 display: flex;
7 justify-content: center; 7 justify-content: center;
8 height: 500px;
9
10 @media screen and (max-width: 600px) {
11 width: 100vw;
12 height: calc(100vw / 1.7); // 16/9
13 }
14 8
15 .remote-server-down { 9 .remote-server-down {
16 color: #fff; 10 color: #fff;
@@ -21,8 +15,8 @@
21 justify-content: center; 15 justify-content: center;
22 background-color: #141313; 16 background-color: #141313;
23 width: 100%; 17 width: 100%;
24 height: 100%;
25 font-size: 24px; 18 font-size: 24px;
19 height: 500px;
26 20
27 @media screen and (max-width: 1000px) { 21 @media screen and (max-width: 1000px) {
28 font-size: 20px; 22 font-size: 20px;
@@ -35,7 +29,12 @@
35 29
36 /deep/ .video-js { 30 /deep/ .video-js {
37 width: 888px; 31 width: 888px;
38 height: 100%; 32 height: 500px;
33
34 &.vjs-theater-enabled {
35 height: calc(100vh - #{$header-height} - #{$theater-bottom-space});
36 width: 100%;
37 }
39 38
40 // VideoJS create an inner video player 39 // VideoJS create an inner video player
41 video { 40 video {
@@ -44,9 +43,12 @@
44 } 43 }
45 } 44 }
46 45
47 /deep/ .video-js.vjs-theater-enabled { 46 @media screen and (max-width: 600px) {
48 width: 100%; 47 .remote-server-down,
49 height: calc(100vh - #{$header-height} - #{$theater-bottom-space}); 48 /deep/ .video-js {
49 width: 100vw;
50 height: calc(100vw / 1.7); // 16/9
51 }
50 } 52 }
51} 53}
52 54
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 4f8549e8f..ff8baaeb3 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -1,5 +1,5 @@
1import { catchError } from 'rxjs/operators' 1import { catchError } from 'rxjs/operators'
2import { Component, ElementRef, Inject, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core' 2import { ChangeDetectorRef, Component, ElementRef, Inject, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core'
3import { ActivatedRoute, Router } from '@angular/router' 3import { ActivatedRoute, Router } from '@angular/router'
4import { RedirectService } from '@app/core/routing/redirect.service' 4import { RedirectService } from '@app/core/routing/redirect.service'
5import { peertubeLocalStorage } from '@app/shared/misc/peertube-local-storage' 5import { peertubeLocalStorage } from '@app/shared/misc/peertube-local-storage'
@@ -65,6 +65,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
65 65
66 constructor ( 66 constructor (
67 private elementRef: ElementRef, 67 private elementRef: ElementRef,
68 private changeDetector: ChangeDetectorRef,
68 private route: ActivatedRoute, 69 private route: ActivatedRoute,
69 private router: Router, 70 private router: Router,
70 private videoService: VideoService, 71 private videoService: VideoService,
@@ -317,6 +318,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
317 if (errorMessage.indexOf('from xs param') !== -1) { 318 if (errorMessage.indexOf('from xs param') !== -1) {
318 this.flushPlayer() 319 this.flushPlayer()
319 this.remoteServerDown = true 320 this.remoteServerDown = true
321 this.changeDetector.detectChanges()
322
320 return 323 return
321 } 324 }
322 325