From 2186386cca113506791583cb07d6ccacba7af4e0 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Tue, 12 Jun 2018 20:04:58 +0200 Subject: Add concept of video state, and add ability to wait transcoding before publishing a video --- .../videos/+video-watch/video-watch.component.ts | 147 +++++++++++---------- 1 file changed, 75 insertions(+), 72 deletions(-) (limited to 'client/src/app/videos/+video-watch/video-watch.component.ts') 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 eefa43a73..498542fff 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 @@ import { catchError } from 'rxjs/operators' -import { Component, ElementRef, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild, Inject } from '@angular/core' +import { Component, ElementRef, Inject, LOCALE_ID, NgZone, OnDestroy, OnInit, ViewChild } from '@angular/core' import { ActivatedRoute, Router } from '@angular/router' import { RedirectService } from '@app/core/routing/redirect.service' import { peertubeLocalStorage } from '@app/shared/misc/peertube-local-storage' @@ -10,7 +10,7 @@ import { Subscription } from 'rxjs' import * as videojs from 'video.js' import 'videojs-hotkeys' import * as WebTorrent from 'webtorrent' -import { UserVideoRateType, VideoRateType } from '../../../../../shared' +import { UserVideoRateType, VideoRateType, VideoState } from '../../../../../shared' import '../../../assets/player/peertube-videojs-plugin' import { AuthService, ConfirmService } from '../../core' import { RestExtractor, VideoBlacklistService } from '../../shared' @@ -21,7 +21,7 @@ import { MarkdownService } from '../shared' import { VideoDownloadComponent } from './modal/video-download.component' import { VideoReportComponent } from './modal/video-report.component' import { VideoShareComponent } from './modal/video-share.component' -import { getVideojsOptions, loadLocale, addContextMenu } from '../../../assets/player/peertube-player' +import { addContextMenu, getVideojsOptions, loadLocale } from '../../../assets/player/peertube-player' import { ServerService } from '@app/core' import { I18n } from '@ngx-translate/i18n-polyfill' import { environment } from '../../../environments/environment' @@ -91,21 +91,21 @@ export class VideoWatchComponent implements OnInit, OnDestroy { } this.videoService.getVideos({ currentPage: 1, itemsPerPage: 5 }, '-createdAt') - .subscribe( - data => { - this.otherVideos = data.videos - this.updateOtherVideosDisplayed() - }, + .subscribe( + data => { + this.otherVideos = data.videos + this.updateOtherVideosDisplayed() + }, - err => console.error(err) - ) + err => console.error(err) + ) this.paramsSub = this.route.params.subscribe(routeParams => { if (this.player) { this.player.pause() } - const uuid = routeParams['uuid'] + const uuid = routeParams[ 'uuid' ] // Video did not change if (this.video && this.video.uuid === uuid) return @@ -113,13 +113,11 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.videoService .getVideo(uuid) .pipe(catchError(err => this.restExtractor.redirectTo404IfNotFound(err, [ 400, 404 ]))) - .subscribe( - video => { - const startTime = this.route.snapshot.queryParams.start - this.onVideoFetched(video, startTime) - .catch(err => this.handleError(err)) - } - ) + .subscribe(video => { + const startTime = this.route.snapshot.queryParams.start + this.onVideoFetched(video, startTime) + .catch(err => this.handleError(err)) + }) }) } @@ -157,17 +155,17 @@ export class VideoWatchComponent implements OnInit, OnDestroy { if (res === false) return this.videoBlacklistService.blacklistVideo(this.video.id) - .subscribe( - status => { - this.notificationsService.success( - this.i18n('Success'), - this.i18n('Video {{videoName}} had been blacklisted.', { videoName: this.video.name }) - ) - this.redirectService.redirectToHomepage() - }, + .subscribe( + () => { + this.notificationsService.success( + this.i18n('Success'), + this.i18n('Video {{videoName}} had been blacklisted.', { videoName: this.video.name }) + ) + this.redirectService.redirectToHomepage() + }, - error => this.notificationsService.error(this.i18n('Error'), error.message) - ) + error => this.notificationsService.error(this.i18n('Error'), error.message) + ) } showMoreDescription () { @@ -188,22 +186,22 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.descriptionLoading = true this.videoService.loadCompleteDescription(this.video.descriptionPath) - .subscribe( - description => { - this.completeDescriptionShown = true - this.descriptionLoading = false + .subscribe( + description => { + this.completeDescriptionShown = true + this.descriptionLoading = false - this.shortVideoDescription = this.video.description - this.completeVideoDescription = description + this.shortVideoDescription = this.video.description + this.completeVideoDescription = description - this.updateVideoDescription(this.completeVideoDescription) - }, + this.updateVideoDescription(this.completeVideoDescription) + }, - error => { - this.descriptionLoading = false - this.notificationsService.error(this.i18n('Error'), error.message) - } - ) + error => { + this.descriptionLoading = false + this.notificationsService.error(this.i18n('Error'), error.message) + } + ) } showReportModal (event: Event) { @@ -259,19 +257,19 @@ export class VideoWatchComponent implements OnInit, OnDestroy { if (res === false) return this.videoService.removeVideo(this.video.id) - .subscribe( - status => { - this.notificationsService.success( - this.i18n('Success'), - this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }) - ) + .subscribe( + status => { + this.notificationsService.success( + this.i18n('Success'), + this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }) + ) - // Go back to the video-list. - this.redirectService.redirectToHomepage() - }, + // Go back to the video-list. + this.redirectService.redirectToHomepage() + }, - error => this.notificationsService.error(this.i18n('Error'), error.message) - ) + error => this.notificationsService.error(this.i18n('Error'), error.message) + ) } acceptedPrivacyConcern () { @@ -279,6 +277,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy { this.hasAlreadyAcceptedPrivacyConcern = true } + isVideoToTranscode () { + return this.video && this.video.state.id === VideoState.TO_TRANSCODE + } + private updateVideoDescription (description: string) { this.video.description = description this.setVideoDescriptionHTML() @@ -294,10 +296,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy { } private setVideoLikesBarTooltipText () { - this.likesBarTooltipText = this.i18n( - '{{likesNumber}} likes / {{dislikesNumber}} dislikes', - { likesNumber: this.video.likes, dislikesNumber: this.video.dislikes } - ) + this.likesBarTooltipText = this.i18n('{{likesNumber}} likes / {{dislikesNumber}} dislikes', { + likesNumber: this.video.likes, + dislikesNumber: this.video.dislikes + }) } private handleError (err: any) { @@ -320,15 +322,15 @@ export class VideoWatchComponent implements OnInit, OnDestroy { if (this.isUserLoggedIn() === false) return this.videoService.getUserVideoRating(this.video.id) - .subscribe( - ratingObject => { - if (ratingObject) { - this.userRating = ratingObject.rating - } - }, + .subscribe( + ratingObject => { + if (ratingObject) { + this.userRating = ratingObject.rating + } + }, - err => this.notificationsService.error(this.i18n('Error'), err.message) - ) + err => this.notificationsService.error(this.i18n('Error'), err.message) + ) } private async onVideoFetched (video: VideoDetails, startTime = 0) { @@ -409,14 +411,15 @@ export class VideoWatchComponent implements OnInit, OnDestroy { } method.call(this.videoService, this.video.id) - .subscribe( - () => { - // Update the video like attribute - this.updateVideoRating(this.userRating, nextRating) - this.userRating = nextRating - }, - err => this.notificationsService.error(this.i18n('Error'), err.message) - ) + .subscribe( + () => { + // Update the video like attribute + this.updateVideoRating(this.userRating, nextRating) + this.userRating = nextRating + }, + + err => this.notificationsService.error(this.i18n('Error'), err.message) + ) } private updateVideoRating (oldRating: UserVideoRateType, newRating: VideoRateType) { -- cgit v1.2.3