]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/commitdiff
Add ability to hide plugin form fields
authorChocobozzz <me@florianbigard.com>
Thu, 22 Apr 2021 12:25:32 +0000 (14:25 +0200)
committerChocobozzz <me@florianbigard.com>
Thu, 22 Apr 2021 12:35:49 +0000 (14:35 +0200)
client/src/app/+videos/+video-edit/shared/i18n-primeng-calendar.service.ts
client/src/app/+videos/+video-edit/shared/video-edit.component.html
client/src/app/+videos/+video-edit/shared/video-edit.component.ts
client/src/app/+videos/+video-edit/video-update.component.html
client/src/standalone/videos/embed.ts
shared/models/plugins/register-client-form-field.model.ts
support/doc/plugins/guide.md

index 6ef4dbc68d9b3538e93fe0c8c3752b8027c865a7..34848b0362c19a9e40822184670f966ec188c384 100644 (file)
@@ -3,7 +3,6 @@ import { PrimeNGConfig } from 'primeng/api'
 
 @Injectable()
 export class I18nPrimengCalendarService {
-  private readonly calendarLocale: any = {}
 
   constructor (private config: PrimeNGConfig) {
     this.config.setTranslation({
@@ -73,10 +72,6 @@ export class I18nPrimengCalendarService {
     })
   }
 
-  getCalendarLocale () {
-    return this.calendarLocale
-  }
-
   getTimezone () {
     const gmt = new Date().toString().match(/([A-Z]+[\+-][0-9]+)/)[1]
     const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone
index 6208ab69bf5daa98d996100179f26adbb02d3d76..6fe52af677f4480bc54d29b75419d76d84ee4171 100644 (file)
         <div class="row plugin-settings">
 
           <div class="col-md-12 col-xl-8">
-            <div *ngFor="let pluginSetting of pluginFields" class="form-group">
+            <div *ngFor="let pluginSetting of pluginFields" class="form-group" [hidden]="isPluginFieldHidden(pluginSetting)">
               <my-dynamic-form-field [form]="pluginDataFormGroup" [formErrors]="formErrors" [setting]="pluginSetting.commonOptions"></my-dynamic-form-field>
             </div>
           </div>
index f51f521606ef3c1a8b33d88df98b648ebcbcb118..34119f7abc5dd35ac620ffc19fe249704bf512d0 100644 (file)
@@ -2,7 +2,7 @@ import { forkJoin } from 'rxjs'
 import { map } from 'rxjs/operators'
 import { SelectChannelItem } from 'src/types/select-options-item.model'
 import { Component, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output, ViewChild } from '@angular/core'
-import { FormArray, FormControl, FormGroup, ValidatorFn, Validators } from '@angular/forms'
+import { FormArray, FormControl, FormGroup, Validators } from '@angular/forms'
 import { HooksService, PluginService, ServerService } from '@app/core'
 import { removeElementFromArray } from '@app/helpers'
 import {
@@ -21,13 +21,17 @@ import {
 import { FormReactiveValidationMessages, FormValidatorService } from '@app/shared/shared-forms'
 import { InstanceService } from '@app/shared/shared-instance'
 import { VideoCaptionEdit, VideoEdit, VideoService } from '@app/shared/shared-main'
-import { LiveVideo, ServerConfig, VideoConstant, VideoPrivacy } from '@shared/models'
+import { LiveVideo, ServerConfig, VideoConstant, VideoDetails, VideoPrivacy } from '@shared/models'
 import { RegisterClientFormFieldOptions, RegisterClientVideoFieldOptions } from '@shared/models/plugins/register-client-form-field.model'
 import { I18nPrimengCalendarService } from './i18n-primeng-calendar.service'
 import { VideoCaptionAddModalComponent } from './video-caption-add-modal.component'
 import { VideoEditType } from './video-edit.type'
 
 type VideoLanguages = VideoConstant<string> & { group?: string }
+type PluginField = {
+  commonOptions: RegisterClientFormFieldOptions
+  videoFormOptions: RegisterClientVideoFieldOptions
+}
 
 @Component({
   selector: 'my-video-edit',
@@ -38,9 +42,14 @@ export class VideoEditComponent implements OnInit, OnDestroy {
   @Input() form: FormGroup
   @Input() formErrors: { [ id: string ]: string } = {}
   @Input() validationMessages: FormReactiveValidationMessages = {}
+
+  @Input() videoToUpdate: VideoDetails
+
   @Input() userVideoChannels: SelectChannelItem[] = []
   @Input() schedulePublicationPossible = true
+
   @Input() videoCaptions: (VideoCaptionEdit & { captionPath?: string })[] = []
+
   @Input() waitTranscodingEnabled = true
   @Input() type: VideoEditType
   @Input() liveVideo: LiveVideo
@@ -57,9 +66,6 @@ export class VideoEditComponent implements OnInit, OnDestroy {
   videoLicences: VideoConstant<number>[] = []
   videoLanguages: VideoLanguages[] = []
 
-  tagValidators: ValidatorFn[]
-  tagValidatorsMessages: { [ name: string ]: string }
-
   pluginDataFormGroup: FormGroup
 
   schedulePublicationEnabled = false
@@ -73,10 +79,7 @@ export class VideoEditComponent implements OnInit, OnDestroy {
 
   serverConfig: ServerConfig
 
-  pluginFields: {
-    commonOptions: RegisterClientFormFieldOptions
-    videoFormOptions: RegisterClientVideoFieldOptions
-  }[] = []
+  pluginFields: PluginField[] = []
 
   private schedulerInterval: any
   private firstPatchDone = false
@@ -92,7 +95,6 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     private ngZone: NgZone,
     private hooks: HooksService
   ) {
-    this.calendarLocale = this.i18nPrimengCalendarService.getCalendarLocale()
     this.calendarTimezone = this.i18nPrimengCalendarService.getTimezone()
     this.calendarDateFormat = this.i18nPrimengCalendarService.getDateFormat()
   }
@@ -251,6 +253,16 @@ export class VideoEditComponent implements OnInit, OnDestroy {
     return this.form.value['permanentLive'] === true
   }
 
+  isPluginFieldHidden (pluginField: PluginField) {
+    if (typeof pluginField.commonOptions.hidden !== 'function') return false
+
+    return pluginField.commonOptions.hidden({
+      formValues: this.form.value,
+      videoToUpdate: this.videoToUpdate,
+      liveVideo: this.liveVideo
+    })
+  }
+
   private sortVideoCaptions () {
     this.videoCaptions.sort((v1, v2) => {
       if (v1.language.label < v2.language.label) return -1
index 41501714f68a04c10ee085de4641de3c0c38adb9..3ce3e623e87d46e8bab43ffcd05fdc9d709726de 100644 (file)
@@ -11,7 +11,7 @@
       [validationMessages]="validationMessages" [userVideoChannels]="userVideoChannels"
       [videoCaptions]="videoCaptions" [waitTranscodingEnabled]="isWaitTranscodingEnabled()"
       type="update" (pluginFieldsAdded)="hydratePluginFieldsFromVideo()"
-      [liveVideo]="liveVideo"
+      [liveVideo]="liveVideo" [videoToUpdate]="videoDetails"
     ></my-video-edit>
 
     <div class="submit-container">
index 103014bb08dd3c7c23bd58c6a88e79da405fc2c0..3a90fdc5801b2493c66be1c1ce11d514e0e1adf9 100644 (file)
@@ -777,6 +777,7 @@ export class PeerTubeEmbed {
       getSettings: unimplemented,
 
       isLoggedIn: unimplemented,
+      getAuthHeader: unimplemented,
 
       notifier: {
         info: unimplemented,
index db61dbc886966ae8f098307e43f6080a641ad382..2df071337a1c5ee347eb33cabb9e56c3eb604ec0 100644 (file)
@@ -13,6 +13,9 @@ export type RegisterClientFormFieldOptions = {
 
   // Default setting value
   default?: string | boolean
+
+  // Not supported by plugin setting registration, use registerSettingsScript instead
+  hidden?: (options: any) => boolean
 }
 
 export interface RegisterClientVideoFieldOptions {
index ca951c781d0ed0552a1fdf98cb535793f2284041..8d85092e79e401dc25fa411a8975bb4e1b231fb4 100644 (file)
@@ -623,7 +623,13 @@ async function register ({ registerVideoField, peertubeHelpers }) {
     label: 'My added field',
     descriptionHTML: 'Optional description',
     type: 'input-textarea',
-    default: ''
+    default: '',
+    // Optional, to hide a field depending on the current form state
+    // liveVideo is in the options object when the user is creating/updating a live
+    // videoToUpdate is in the options object when the user is updating a video
+    hidden: ({ formValues, videoToUpdate, liveVideo }) => {
+      return formValues.pluginData['other-field'] === 'toto'
+    }
   }
 
   for (const type of [ 'upload', 'import-url', 'import-torrent', 'update', 'go-live' ]) {