Move original publication date in advanced settings

3 files changed, 50 insertions, 46 deletions

diff --git a/client/src/app/shared/video/video-edit.model.ts b/client/src/app/shared/video/video-edit.model.ts
index c5d5bb406..1f633d427 100644
--- a/client/src/app/shared/video/video-edit.model.ts
+++ b/client/src/app/shared/video/video-edit.model.ts
@@ -57,7 +57,7 @@ export class VideoEdit implements VideoUpdate {
       this.previewUrl = video.previewUrl
 
       this.scheduleUpdate = video.scheduledUpdate
-      this.originallyPublishedAt = new Date(video.originallyPublishedAt)
+      this.originallyPublishedAt = video.originallyPublishedAt ? new Date(video.originallyPublishedAt) : null
     }
   }
 
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.html b/client/src/app/videos/+video-edit/shared/video-edit.component.html
index 2fb540170..1be1084ad 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.html
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.html
@@ -114,20 +114,6 @@
               </div>
             </div>
 
-            <div class="form-group">
-              <label i18n for="originallyPublishedAt">Original publication date</label>
-              <my-help i18n-preHtml preHtml="This is the date when the content was originally published (e.g. the release date for a film)"></my-help>
-              <p-calendar
-                id="originallyPublishedAt" formControlName="originallyPublishedAt" [dateFormat]="calendarDateFormat"
-                [locale]="calendarLocale" [showTime]="true" [hideOnDateTimeSelect]="true" [monthNavigator]="true" [yearNavigator]="true" [yearRange]="myYearRange"
-              >
-              </p-calendar>
-
-              <div *ngIf="formErrors.originallyPublishedAt" class="form-error">
-                {{ formErrors.originallyPublishedAt }}
-              </div>
-            </div>
-
             <my-peertube-checkbox
               inputName="nsfw" formControlName="nsfw"
               i18n-labelText labelText="This video contains mature or explicit content"
@@ -199,42 +185,60 @@
 
     <ngb-tab i18n-title title="Advanced settings">
       <ng-template ngbTabContent>
-        <div class="advanced-settings">
-          <div class="form-group">
-            <my-video-image
-              i18n-inputLabel inputLabel="Upload thumbnail" inputName="thumbnailfile" formControlName="thumbnailfile"
-              previewWidth="200px" previewHeight="110px"
-            ></my-video-image>
-          </div>
+        <div class="row advanced-settings">
+          <div class="col-md-12 col-xl-8">
+            <div class="form-group">
+              <my-video-image
+                i18n-inputLabel inputLabel="Upload thumbnail" inputName="thumbnailfile" formControlName="thumbnailfile"
+                previewWidth="200px" previewHeight="110px"
+              ></my-video-image>
+            </div>
 
-          <div class="form-group">
-            <my-video-image
-              i18n-inputLabel inputLabel="Upload preview" inputName="previewfile" formControlName="previewfile"
-              previewWidth="360px" previewHeight="200px"
-            ></my-video-image>
-          </div>
+            <div class="form-group">
+              <my-video-image
+                i18n-inputLabel inputLabel="Upload preview" inputName="previewfile" formControlName="previewfile"
+                previewWidth="360px" previewHeight="200px"
+              ></my-video-image>
+            </div>
 
-          <div class="form-group">
-            <label i18n for="support">Support</label>
-            <my-help helpType="markdownEnhanced" i18n-preHtml preHtml="Short text to tell people how they can support you (membership platform...)."></my-help>
-            <my-markdown-textarea
-              id="support" formControlName="support" textareaWidth="500px" [previewColumn]="true" markdownType="enhanced"
-              [classes]="{ 'input-error': formErrors['support'] }"
-            ></my-markdown-textarea>
-            <div *ngIf="formErrors.support" class="form-error">
-              {{ formErrors.support }}
+            <div class="form-group">
+              <label i18n for="support">Support</label>
+              <my-help helpType="markdownEnhanced" i18n-preHtml preHtml="Short text to tell people how they can support you (membership platform...)."></my-help>
+              <my-markdown-textarea
+                id="support" formControlName="support" textareaWidth="500px" [previewColumn]="true" markdownType="enhanced"
+                [classes]="{ 'input-error': formErrors['support'] }"
+              ></my-markdown-textarea>
+              <div *ngIf="formErrors.support" class="form-error">
+                {{ formErrors.support }}
+              </div>
             </div>
           </div>
 
-          <my-peertube-checkbox
-            inputName="commentsEnabled" formControlName="commentsEnabled"
-            i18n-labelText labelText="Enable video comments"
-          ></my-peertube-checkbox>
+          <div class="col-md-12 col-xl-4">
+            <div class="form-group originally-published-at">
+              <label i18n for="originallyPublishedAt">Original publication date</label>
+              <my-help i18n-preHtml preHtml="This is the date when the content was originally published (e.g. the release date for a film)"></my-help>
+              <p-calendar
+                id="originallyPublishedAt" formControlName="originallyPublishedAt" [dateFormat]="calendarDateFormat"
+                [locale]="calendarLocale" [showTime]="true" [hideOnDateTimeSelect]="true" [monthNavigator]="true" [yearNavigator]="true" [yearRange]="myYearRange"
+              >
+              </p-calendar>
+
+              <div *ngIf="formErrors.originallyPublishedAt" class="form-error">
+                {{ formErrors.originallyPublishedAt }}
+              </div>
+            </div>
+
+            <my-peertube-checkbox
+              inputName="commentsEnabled" formControlName="commentsEnabled"
+              i18n-labelText labelText="Enable video comments"
+            ></my-peertube-checkbox>
 
-          <my-peertube-checkbox
-            inputName="downloadEnabled" formControlName="downloadEnabled"
-            i18n-labelText labelText="Enable download"
-          ></my-peertube-checkbox>
+            <my-peertube-checkbox
+              inputName="downloadEnabled" formControlName="downloadEnabled"
+              i18n-labelText labelText="Enable download"
+            ></my-peertube-checkbox>
+          </div>
         </div>
       </ng-template>
     </ngb-tab>
diff --git a/client/src/app/videos/+video-edit/shared/video-edit.component.ts b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
index 836452948..c7ebcec25 100644
--- a/client/src/app/videos/+video-edit/shared/video-edit.component.ts
+++ b/client/src/app/videos/+video-edit/shared/video-edit.component.ts
@@ -26,7 +26,7 @@ export class VideoEditComponent implements OnInit, OnDestroy {
   @Input() videoPrivacies: VideoConstant<VideoPrivacy>[] = []
   @Input() userVideoChannels: { id: number, label: string, support: string }[] = []
   @Input() schedulePublicationPossible = true
-  @Input() videoCaptions: VideoCaptionEdit[] = []
+  @Input() videoCaptions: (VideoCaptionEdit & { captionPath?: string })[] = []
   @Input() waitTranscodingEnabled = true
 
   @ViewChild('videoCaptionAddModal') videoCaptionAddModal: VideoCaptionAddModalComponent