Force live type specification in first step

8 files changed, 63 insertions, 7 deletions

diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.html b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.html
index fddb08e0b..fce5a1ee5 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.html
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.html
@@ -16,7 +16,24 @@
       ></my-select-options>
     </div>
 
+    <div class="form-group live-type">
+      <div class="peertube-radio-container">
+        <input type="radio" id="permanentLiveFalse" [(ngModel)]="firstStepPermanentLive" [value]="false">
+        <label i18n for="permanentLiveFalse" class="radio">Normal live</label>
+
+        <span class="form-group-description">{{ getNormalLiveDescription() }}</span>
+      </div>
+
+      <div class="peertube-radio-container">
+        <input type="radio" id="permanentLiveTrue" [(ngModel)]="firstStepPermanentLive" [value]="true">
+        <label i18n for="permanentLiveTrue" class="radio">Permanent/recurring live</label>
+
+        <span class="form-group-description" i18n>{{ getPermanentLiveDescription() }}</span>
+      </div>
+    </div>
+
     <input
+      [disabled]="firstStepPermanentLive !== true && firstStepPermanentLive !== false"
       type="button" i18n-value value="Go Live" (click)="goLive()"
     />
   </div>
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.scss b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.scss
new file mode 100644
index 000000000..09b71018f
--- /dev/null
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.scss
@@ -0,0 +1,12 @@
+.live-type {
+  margin-top: 15px;
+}
+
+.peertube-radio-container {
+  width: 250px;
+
+  .form-group-description {
+    white-space: nowrap;
+  }
+}
+
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts
index ee7011b4c..01eabb0d7 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-go-live.component.ts
@@ -1,4 +1,3 @@
-
 import { forkJoin } from 'rxjs'
 import { AfterViewInit, Component, EventEmitter, OnInit, Output } from '@angular/core'
 import { Router } from '@angular/router'
@@ -16,6 +15,7 @@ import { VideoSend } from './video-send'
   templateUrl: './video-go-live.component.html',
   styleUrls: [
     '../shared/video-edit.component.scss',
+    './video-go-live.component.scss',
     './video-send.scss'
   ]
 })
@@ -23,6 +23,8 @@ export class VideoGoLiveComponent extends VideoSend implements OnInit, AfterView
   @Output() firstStepDone = new EventEmitter<string>()
   @Output() firstStepError = new EventEmitter<void>()
 
+  firstStepPermanentLive: boolean
+
   isInUpdateForm = false
 
   liveVideo: LiveVideo
@@ -70,8 +72,8 @@ export class VideoGoLiveComponent extends VideoSend implements OnInit, AfterView
       waitTranscoding: true,
       commentsEnabled: true,
       downloadEnabled: true,
-      permanentLive: false,
-      saveReplay: false,
+      permanentLive: this.firstStepPermanentLive,
+      saveReplay: this.firstStepPermanentLive === false && this.isReplayAllowed(),
       channelId: this.firstStepChannelId
     }
 
@@ -154,6 +156,26 @@ export class VideoGoLiveComponent extends VideoSend implements OnInit, AfterView
     return this.form.value['saveReplay'] === true
   }
 
+  getNormalLiveDescription () {
+    if (this.isReplayAllowed()) {
+      return $localize`Stream only once and save a replay of your live`
+    }
+
+    return $localize`Stream only once`
+  }
+
+  getPermanentLiveDescription () {
+    if (this.isReplayAllowed()) {
+      return $localize`Stream multiple times, replays can't be saved`
+    }
+
+    return $localize`Stream multiple times using the same URL`
+  }
+
+  private isReplayAllowed () {
+    return this.serverConfig.live.allowReplay
+  }
+
   private fetchVideoLive () {
     this.liveVideoService.getVideoLive(this.videoId)
       .subscribe({
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-send.scss b/client/src/app/+videos/+video-edit/video-add-components/video-send.scss
index e601c3dff..7284ad00f 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-send.scss
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-send.scss
@@ -1,7 +1,7 @@
 @use '_variables' as *;
 @use '_mixins' as *;
 
-$width-size: 190px;
+$width-size: 250px;
 
 .alert.alert-danger {
   text-align: center;
@@ -29,6 +29,7 @@ $width-size: 190px;
   my-select-options ::ng-deep ng-select,
   my-select-channel ::ng-deep ng-select {
     width: $width-size;
+
     @media screen and (max-width: $width-size) {
       width: 100%;
     }
diff --git a/client/src/app/shared/form-validators/video-validators.ts b/client/src/app/shared/form-validators/video-validators.ts
index f96189aa2..ab6f21a35 100644
--- a/client/src/app/shared/form-validators/video-validators.ts
+++ b/client/src/app/shared/form-validators/video-validators.ts
@@ -86,7 +86,7 @@ export const VIDEO_SUPPORT_VALIDATOR: BuildFormValidator = {
 }
 
 export const VIDEO_SCHEDULE_PUBLICATION_AT_VALIDATOR: BuildFormValidator = {
-  VALIDATORS: [ ],
+  VALIDATORS: [ ], // Required is set dynamically
   MESSAGES: {
     required: $localize`A date is required to schedule video update.`
   }
diff --git a/client/src/app/shared/shared-forms/select/select-shared.component.scss b/client/src/app/shared/shared-forms/select/select-shared.component.scss
index 1e9b60fec..f7b001fe8 100644
--- a/client/src/app/shared/shared-forms/select/select-shared.component.scss
+++ b/client/src/app/shared/shared-forms/select/select-shared.component.scss
@@ -3,6 +3,10 @@
 
 $form-base-input-width: auto;
 
+.text-muted {
+  font-size: 90%;
+}
+
 ng-select {
   width: $form-base-input-width;
 
diff --git a/client/src/app/shared/shared-video-live/live-stream-information.component.html b/client/src/app/shared/shared-video-live/live-stream-information.component.html
index d6ee67ba9..7df1e5bc2 100644
--- a/client/src/app/shared/shared-video-live/live-stream-information.component.html
+++ b/client/src/app/shared/shared-video-live/live-stream-information.component.html
@@ -7,7 +7,7 @@
 
   <div class="modal-body" *ngIf="live">
     <div>
-      <div class="badge badge-info" *ngIf="live.permanentLive" i18n>Permanent live</div>
+      <div class="badge badge-info" *ngIf="live.permanentLive" i18n>Permanent/Recurring live</div>
       <div class="badge badge-info" *ngIf="live.saveReplay" i18n>Replay will be saved</div>
     </div>
 
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss
index 0634f4677..9e510771e 100644
--- a/client/src/sass/include/_mixins.scss
+++ b/client/src/sass/include/_mixins.scss
@@ -478,7 +478,7 @@
 
   .form-group-description {
     display: block;
-    margin-top: -10px;
+    margin-top: -7px;
     margin-bottom: 10px;
     margin-left: 29px;
   }