Add ability to schedule video publication

11 files changed, 178 insertions, 24 deletions

diff --git a/client/src/app/shared/forms/form-validators/video-validators.service.ts b/client/src/app/shared/forms/form-validators/video-validators.service.ts
index 76fc5cf04..396be6f3b 100644
--- a/client/src/app/shared/forms/form-validators/video-validators.service.ts
+++ b/client/src/app/shared/forms/form-validators/video-validators.service.ts
@@ -15,6 +15,7 @@ export class VideoValidatorsService {
   readonly VIDEO_DESCRIPTION: BuildFormValidator
   readonly VIDEO_TAGS: BuildFormValidator
   readonly VIDEO_SUPPORT: BuildFormValidator
+  readonly VIDEO_SCHEDULE_PUBLICATION_AT: BuildFormValidator
 
   constructor (private i18n: I18n) {
 
@@ -84,5 +85,12 @@ export class VideoValidatorsService {
         'maxlength': this.i18n('Video support cannot be more than 500 characters long.')
       }
     }
+
+    this.VIDEO_SCHEDULE_PUBLICATION_AT = {
+      VALIDATORS: [ ],
+      MESSAGES: {
+        'required': this.i18n('A date is required to schedule video update.')
+      }
+    }
   }
 }
diff --git a/client/src/app/shared/forms/markdown-textarea.component.ts b/client/src/app/shared/forms/markdown-textarea.component.ts
index 8b932cd15..db6f9e5c8 100644
--- a/client/src/app/shared/forms/markdown-textarea.component.ts
+++ b/client/src/app/shared/forms/markdown-textarea.component.ts
@@ -1,10 +1,10 @@
 import { debounceTime, distinctUntilChanged } from 'rxjs/operators'
 import { Component, forwardRef, Input, OnInit } from '@angular/core'
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
-import { isInSmallView } from '@app/shared/misc/utils'
 import { MarkdownService } from '@app/videos/shared'
 import { Subject } from 'rxjs/Subject'
 import truncate from 'lodash-es/truncate'
+import { ScreenService } from '@app/shared/misc/screen.service'
 
 @Component({
   selector: 'my-markdown-textarea',
@@ -35,7 +35,10 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit {
 
   private contentChanged = new Subject<string>()
 
-  constructor (private markdownService: MarkdownService) {}
+  constructor (
+    private screenService: ScreenService,
+    private markdownService: MarkdownService
+) {}
 
   ngOnInit () {
     this.contentChanged
@@ -76,7 +79,7 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit {
   }
 
   arePreviewsDisplayed () {
-    return isInSmallView() === false
+    return this.screenService.isInSmallView() === false
   }
 
   private updatePreviews () {
diff --git a/client/src/app/shared/i18n/i18n-primeng-calendar.ts b/client/src/app/shared/i18n/i18n-primeng-calendar.ts
new file mode 100644
index 000000000..b05852ff8
--- /dev/null
+++ b/client/src/app/shared/i18n/i18n-primeng-calendar.ts
@@ -0,0 +1,94 @@
+import { I18n } from '@ngx-translate/i18n-polyfill'
+import { Injectable } from '@angular/core'
+
+@Injectable()
+export class I18nPrimengCalendarService {
+  private readonly calendarLocale: any = {}
+
+  constructor (private i18n: I18n) {
+    this.calendarLocale = {
+      firstDayOfWeek: 0,
+      dayNames: [
+        this.i18n('Sunday'),
+        this.i18n('Monday'),
+        this.i18n('Tuesday'),
+        this.i18n('Wednesday'),
+        this.i18n('Thursday'),
+        this.i18n('Friday'),
+        this.i18n('Saturday')
+      ],
+
+      dayNamesShort: [
+        this.i18n({ value: 'Sun', description: 'Day name short' }),
+        this.i18n({ value: 'Mon', description: 'Day name short' }),
+        this.i18n({ value: 'Tue', description: 'Day name short' }),
+        this.i18n({ value: 'Wed', description: 'Day name short' }),
+        this.i18n({ value: 'Thu', description: 'Day name short' }),
+        this.i18n({ value: 'Fri', description: 'Day name short' }),
+        this.i18n({ value: 'Sat', description: 'Day name short' })
+      ],
+
+      dayNamesMin: [
+        this.i18n({ value: 'Su', description: 'Day name min' }),
+        this.i18n({ value: 'Mo', description: 'Day name min' }),
+        this.i18n({ value: 'Tu', description: 'Day name min' }),
+        this.i18n({ value: 'We', description: 'Day name min' }),
+        this.i18n({ value: 'Th', description: 'Day name min' }),
+        this.i18n({ value: 'Fr', description: 'Day name min' }),
+        this.i18n({ value: 'Sa', description: 'Day name min' })
+      ],
+
+      monthNames: [
+        this.i18n('January'),
+        this.i18n('February'),
+        this.i18n('March'),
+        this.i18n('April'),
+        this.i18n('May'),
+        this.i18n('June'),
+        this.i18n('July'),
+        this.i18n('August'),
+        this.i18n('September'),
+        this.i18n('October'),
+        this.i18n('November'),
+        this.i18n('December')
+      ],
+
+      monthNamesShort: [
+        this.i18n({ value: 'Jan', description: 'Month name short' }),
+        this.i18n({ value: 'Feb', description: 'Month name short' }),
+        this.i18n({ value: 'Mar', description: 'Month name short' }),
+        this.i18n({ value: 'Apr', description: 'Month name short' }),
+        this.i18n({ value: 'May', description: 'Month name short' }),
+        this.i18n({ value: 'Jun', description: 'Month name short' }),
+        this.i18n({ value: 'Jul', description: 'Month name short' }),
+        this.i18n({ value: 'Aug', description: 'Month name short' }),
+        this.i18n({ value: 'Sep', description: 'Month name short' }),
+        this.i18n({ value: 'Oct', description: 'Month name short' }),
+        this.i18n({ value: 'Nov', description: 'Month name short' }),
+        this.i18n({ value: 'Dec', description: 'Month name short' })
+      ],
+
+      today: this.i18n('Today'),
+
+      clear: this.i18n('Clear')
+    }
+  }
+
+  getCalendarLocale () {
+    return this.calendarLocale
+  }
+
+  getTimezone () {
+    const gmt = new Date().toString().match(/([A-Z]+[\+-][0-9]+)/)[1]
+    const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone
+
+    return `${timezone} - ${gmt}`
+  }
+
+  getDateFormat () {
+    return this.i18n({
+      value: 'yy-mm-dd ',
+      description: 'Date format in this locale.'
+    })
+  }
+}
diff --git a/client/src/app/shared/misc/screen.service.ts b/client/src/app/shared/misc/screen.service.ts
new file mode 100644
index 000000000..5b17a914a
--- /dev/null
+++ b/client/src/app/shared/misc/screen.service.ts
@@ -0,0 +1,23 @@
+import { Injectable, NgZone } from '@angular/core'
+
+@Injectable()
+export class ScreenService {
+  private windowInnerWidth: number
+
+  constructor (private zone: NgZone) {
+    this.windowInnerWidth = window.innerWidth
+
+    // Try to cache a little bit window.innerWidth
+    this.zone.runOutsideAngular(() => {
+      setInterval(() => this.windowInnerWidth = window.innerWidth, 500)
+    })
+  }
+
+  isInSmallView () {
+    return this.windowInnerWidth < 600
+  }
+
+  isInMobileView () {
+    return this.windowInnerWidth < 500
+  }
+}
diff --git a/client/src/app/shared/misc/utils.ts b/client/src/app/shared/misc/utils.ts
index 2219ac802..53aff1b24 100644
--- a/client/src/app/shared/misc/utils.ts
+++ b/client/src/app/shared/misc/utils.ts
@@ -96,26 +96,12 @@ function lineFeedToHtml (obj: object, keyToNormalize: string) {
   })
 }
 
-// Try to cache a little bit window.innerWidth
-let windowInnerWidth = window.innerWidth
-setInterval(() => windowInnerWidth = window.innerWidth, 500)
-
-function isInSmallView () {
-  return windowInnerWidth < 600
-}
-
-function isInMobileView () {
-  return windowInnerWidth < 500
-}
-
 export {
   objectToUrlEncoded,
   getParameterByName,
   populateAsyncUserVideoChannels,
   getAbsoluteAPIUrl,
   dateToHuman,
-  isInSmallView,
-  isInMobileView,
   immutableAssign,
   objectToFormData,
   lineFeedToHtml
diff --git a/client/src/app/shared/shared.module.ts b/client/src/app/shared/shared.module.ts
index b85445ef5..97e49e7ab 100644
--- a/client/src/app/shared/shared.module.ts
+++ b/client/src/app/shared/shared.module.ts
@@ -41,6 +41,8 @@ import {
   ResetPasswordValidatorsService,
   UserValidatorsService, VideoAbuseValidatorsService, VideoChannelValidatorsService, VideoCommentValidatorsService, VideoValidatorsService
 } from '@app/shared/forms'
+import { I18nPrimengCalendarService } from '@app/shared/i18n/i18n-primeng-calendar'
+import { ScreenService } from '@app/shared/misc/screen.service'
 
 @NgModule({
   imports: [
@@ -128,6 +130,9 @@ import {
     VideoCommentValidatorsService,
     VideoValidatorsService,
 
+    I18nPrimengCalendarService,
+    ScreenService,
+
     I18n
   ]
 })
diff --git a/client/src/app/shared/video/abstract-video-list.ts b/client/src/app/shared/video/abstract-video-list.ts
index 1c84573da..a468d3231 100644
--- a/client/src/app/shared/video/abstract-video-list.ts
+++ b/client/src/app/shared/video/abstract-video-list.ts
@@ -2,7 +2,6 @@ import { debounceTime } from 'rxjs/operators'
 import { ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { Location } from '@angular/common'
-import { isInMobileView } from '@app/shared/misc/utils'
 import { InfiniteScrollerDirective } from '@app/shared/video/infinite-scroller.directive'
 import { NotificationsService } from 'angular2-notifications'
 import { fromEvent, Observable, Subscription } from 'rxjs'
@@ -11,6 +10,7 @@ import { ComponentPagination } from '../rest/component-pagination.model'
 import { VideoSortField } from './sort-field.type'
 import { Video } from './video.model'
 import { I18n } from '@ngx-translate/i18n-polyfill'
+import { ScreenService } from '@app/shared/misc/screen.service'
 
 export abstract class AbstractVideoList implements OnInit, OnDestroy {
   private static LINES_PER_PAGE = 4
@@ -41,6 +41,7 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy {
   protected abstract authService: AuthService
   protected abstract router: Router
   protected abstract route: ActivatedRoute
+  protected abstract screenService: ScreenService
   protected abstract i18n: I18n
   protected abstract location: Location
   protected abstract currentRoute: string
@@ -199,7 +200,7 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy {
   }
 
   private calcPageSizes () {
-    if (isInMobileView() || this.baseVideoWidth === -1) {
+    if (this.screenService.isInMobileView() || this.baseVideoWidth === -1) {
       this.pagination.itemsPerPage = 5
 
       // Video takes all the width
diff --git a/client/src/app/shared/video/video-edit.model.ts b/client/src/app/shared/video/video-edit.model.ts
index f045a3acd..78aed4f9f 100644
--- a/client/src/app/shared/video/video-edit.model.ts
+++ b/client/src/app/shared/video/video-edit.model.ts
@@ -1,8 +1,11 @@
 import { VideoDetails } from './video-details.model'
 import { VideoPrivacy } from '../../../../../shared/models/videos/video-privacy.enum'
 import { VideoUpdate } from '../../../../../shared/models/videos'
+import { VideoScheduleUpdate } from '../../../../../shared/models/videos/video-schedule-update.model'
 
 export class VideoEdit implements VideoUpdate {
+  static readonly SPECIAL_SCHEDULED_PRIVACY = -1
+
   category: number
   licence: number
   language: string
@@ -21,6 +24,7 @@ export class VideoEdit implements VideoUpdate {
   previewUrl: string
   uuid?: string
   id?: number
+  scheduleUpdate?: VideoScheduleUpdate
 
   constructor (videoDetails?: VideoDetails) {
     if (videoDetails) {
@@ -40,6 +44,8 @@ export class VideoEdit implements VideoUpdate {
       this.support = videoDetails.support
       this.thumbnailUrl = videoDetails.thumbnailUrl
       this.previewUrl = videoDetails.previewUrl
+
+      this.scheduleUpdate = videoDetails.scheduledUpdate
     }
   }
 
@@ -47,10 +53,22 @@ export class VideoEdit implements VideoUpdate {
     Object.keys(values).forEach((key) => {
       this[ key ] = values[ key ]
     })
+
+    // If schedule publication, the video is private and will be changed to public privacy
+    if (values['schedulePublicationAt']) {
+      const updateAt = (values['schedulePublicationAt'] as Date)
+      updateAt.setSeconds(0)
+
+      this.privacy = VideoPrivacy.PRIVATE
+      this.scheduleUpdate = {
+        updateAt: updateAt.toISOString(),
+        privacy: VideoPrivacy.PUBLIC
+      }
+    }
   }
 
-  toJSON () {
-    return {
+  toFormPatch () {
+    const json = {
       category: this.category,
       licence: this.licence,
       language: this.language,
@@ -64,5 +82,15 @@ export class VideoEdit implements VideoUpdate {
       channelId: this.channelId,
       privacy: this.privacy
     }
+
+    // Special case if we scheduled an update
+    if (this.scheduleUpdate) {
+      Object.assign(json, {
+        privacy: VideoEdit.SPECIAL_SCHEDULED_PRIVACY,
+        schedulePublicationAt: new Date(this.scheduleUpdate.updateAt.toString())
+      })
+    }
+
+    return json
   }
 }
diff --git a/client/src/app/shared/video/video-thumbnail.component.ts b/client/src/app/shared/video/video-thumbnail.component.ts
index e52f7dfb0..86d8f6f74 100644
--- a/client/src/app/shared/video/video-thumbnail.component.ts
+++ b/client/src/app/shared/video/video-thumbnail.component.ts
@@ -1,6 +1,6 @@
 import { Component, Input } from '@angular/core'
-import { isInMobileView } from '@app/shared/misc/utils'
 import { Video } from './video.model'
+import { ScreenService } from '@app/shared/misc/screen.service'
 
 @Component({
   selector: 'my-video-thumbnail',
@@ -11,10 +11,12 @@ export class VideoThumbnailComponent {
   @Input() video: Video
   @Input() nsfw = false
 
+  constructor (private screenService: ScreenService) {}
+
   getImageUrl () {
     if (!this.video) return ''
 
-    if (isInMobileView()) {
+    if (this.screenService.isInMobileView()) {
       return this.video.previewUrl
     }
 
diff --git a/client/src/app/shared/video/video.model.ts b/client/src/app/shared/video/video.model.ts
index 48a4b4260..7f421dbbb 100644
--- a/client/src/app/shared/video/video.model.ts
+++ b/client/src/app/shared/video/video.model.ts
@@ -6,6 +6,7 @@ import { getAbsoluteAPIUrl } from '../misc/utils'
 import { ServerConfig } from '../../../../../shared/models'
 import { Actor } from '@app/shared/actor/actor.model'
 import { peertubeTranslate } from '@app/shared/i18n/i18n-utils'
+import { VideoScheduleUpdate } from '../../../../../shared/models/videos/video-schedule-update.model'
 
 export class Video implements VideoServerModel {
   by: string
@@ -38,6 +39,7 @@ export class Video implements VideoServerModel {
 
   waitTranscoding?: boolean
   state?: VideoConstant<VideoState>
+  scheduledUpdate?: VideoScheduleUpdate
 
   account: {
     id: number
@@ -109,6 +111,7 @@ export class Video implements VideoServerModel {
     this.language.label = peertubeTranslate(this.language.label, translations)
     this.privacy.label = peertubeTranslate(this.privacy.label, translations)
 
+    this.scheduledUpdate = hash.scheduledUpdate
     if (this.state) this.state.label = peertubeTranslate(this.state.label, translations)
   }
 
diff --git a/client/src/app/shared/video/video.service.ts b/client/src/app/shared/video/video.service.ts
index d63915ad2..3af90e7ad 100644
--- a/client/src/app/shared/video/video.service.ts
+++ b/client/src/app/shared/video/video.service.ts
@@ -83,7 +83,8 @@ export class VideoService {
       waitTranscoding: video.waitTranscoding,
       commentsEnabled: video.commentsEnabled,
       thumbnailfile: video.thumbnailfile,
-      previewfile: video.previewfile
+      previewfile: video.previewfile,
+      scheduleUpdate: video.scheduleUpdate || undefined
     }
 
     const data = objectToFormData(body)