Add ability to hide plugin form fields
This commit is contained in:
parent
87e0b71d36
commit
0f31933406
|
@ -3,7 +3,6 @@ import { PrimeNGConfig } from 'primeng/api'
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class I18nPrimengCalendarService {
|
export class I18nPrimengCalendarService {
|
||||||
private readonly calendarLocale: any = {}
|
|
||||||
|
|
||||||
constructor (private config: PrimeNGConfig) {
|
constructor (private config: PrimeNGConfig) {
|
||||||
this.config.setTranslation({
|
this.config.setTranslation({
|
||||||
|
@ -73,10 +72,6 @@ export class I18nPrimengCalendarService {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
getCalendarLocale () {
|
|
||||||
return this.calendarLocale
|
|
||||||
}
|
|
||||||
|
|
||||||
getTimezone () {
|
getTimezone () {
|
||||||
const gmt = new Date().toString().match(/([A-Z]+[\+-][0-9]+)/)[1]
|
const gmt = new Date().toString().match(/([A-Z]+[\+-][0-9]+)/)[1]
|
||||||
const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone
|
const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone
|
||||||
|
|
|
@ -333,7 +333,7 @@
|
||||||
<div class="row plugin-settings">
|
<div class="row plugin-settings">
|
||||||
|
|
||||||
<div class="col-md-12 col-xl-8">
|
<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>
|
<my-dynamic-form-field [form]="pluginDataFormGroup" [formErrors]="formErrors" [setting]="pluginSetting.commonOptions"></my-dynamic-form-field>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -2,7 +2,7 @@ import { forkJoin } from 'rxjs'
|
||||||
import { map } from 'rxjs/operators'
|
import { map } from 'rxjs/operators'
|
||||||
import { SelectChannelItem } from 'src/types/select-options-item.model'
|
import { SelectChannelItem } from 'src/types/select-options-item.model'
|
||||||
import { Component, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output, ViewChild } from '@angular/core'
|
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 { HooksService, PluginService, ServerService } from '@app/core'
|
||||||
import { removeElementFromArray } from '@app/helpers'
|
import { removeElementFromArray } from '@app/helpers'
|
||||||
import {
|
import {
|
||||||
|
@ -21,13 +21,17 @@ import {
|
||||||
import { FormReactiveValidationMessages, FormValidatorService } from '@app/shared/shared-forms'
|
import { FormReactiveValidationMessages, FormValidatorService } from '@app/shared/shared-forms'
|
||||||
import { InstanceService } from '@app/shared/shared-instance'
|
import { InstanceService } from '@app/shared/shared-instance'
|
||||||
import { VideoCaptionEdit, VideoEdit, VideoService } from '@app/shared/shared-main'
|
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 { RegisterClientFormFieldOptions, RegisterClientVideoFieldOptions } from '@shared/models/plugins/register-client-form-field.model'
|
||||||
import { I18nPrimengCalendarService } from './i18n-primeng-calendar.service'
|
import { I18nPrimengCalendarService } from './i18n-primeng-calendar.service'
|
||||||
import { VideoCaptionAddModalComponent } from './video-caption-add-modal.component'
|
import { VideoCaptionAddModalComponent } from './video-caption-add-modal.component'
|
||||||
import { VideoEditType } from './video-edit.type'
|
import { VideoEditType } from './video-edit.type'
|
||||||
|
|
||||||
type VideoLanguages = VideoConstant<string> & { group?: string }
|
type VideoLanguages = VideoConstant<string> & { group?: string }
|
||||||
|
type PluginField = {
|
||||||
|
commonOptions: RegisterClientFormFieldOptions
|
||||||
|
videoFormOptions: RegisterClientVideoFieldOptions
|
||||||
|
}
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'my-video-edit',
|
selector: 'my-video-edit',
|
||||||
|
@ -38,9 +42,14 @@ export class VideoEditComponent implements OnInit, OnDestroy {
|
||||||
@Input() form: FormGroup
|
@Input() form: FormGroup
|
||||||
@Input() formErrors: { [ id: string ]: string } = {}
|
@Input() formErrors: { [ id: string ]: string } = {}
|
||||||
@Input() validationMessages: FormReactiveValidationMessages = {}
|
@Input() validationMessages: FormReactiveValidationMessages = {}
|
||||||
|
|
||||||
|
@Input() videoToUpdate: VideoDetails
|
||||||
|
|
||||||
@Input() userVideoChannels: SelectChannelItem[] = []
|
@Input() userVideoChannels: SelectChannelItem[] = []
|
||||||
@Input() schedulePublicationPossible = true
|
@Input() schedulePublicationPossible = true
|
||||||
|
|
||||||
@Input() videoCaptions: (VideoCaptionEdit & { captionPath?: string })[] = []
|
@Input() videoCaptions: (VideoCaptionEdit & { captionPath?: string })[] = []
|
||||||
|
|
||||||
@Input() waitTranscodingEnabled = true
|
@Input() waitTranscodingEnabled = true
|
||||||
@Input() type: VideoEditType
|
@Input() type: VideoEditType
|
||||||
@Input() liveVideo: LiveVideo
|
@Input() liveVideo: LiveVideo
|
||||||
|
@ -57,9 +66,6 @@ export class VideoEditComponent implements OnInit, OnDestroy {
|
||||||
videoLicences: VideoConstant<number>[] = []
|
videoLicences: VideoConstant<number>[] = []
|
||||||
videoLanguages: VideoLanguages[] = []
|
videoLanguages: VideoLanguages[] = []
|
||||||
|
|
||||||
tagValidators: ValidatorFn[]
|
|
||||||
tagValidatorsMessages: { [ name: string ]: string }
|
|
||||||
|
|
||||||
pluginDataFormGroup: FormGroup
|
pluginDataFormGroup: FormGroup
|
||||||
|
|
||||||
schedulePublicationEnabled = false
|
schedulePublicationEnabled = false
|
||||||
|
@ -73,10 +79,7 @@ export class VideoEditComponent implements OnInit, OnDestroy {
|
||||||
|
|
||||||
serverConfig: ServerConfig
|
serverConfig: ServerConfig
|
||||||
|
|
||||||
pluginFields: {
|
pluginFields: PluginField[] = []
|
||||||
commonOptions: RegisterClientFormFieldOptions
|
|
||||||
videoFormOptions: RegisterClientVideoFieldOptions
|
|
||||||
}[] = []
|
|
||||||
|
|
||||||
private schedulerInterval: any
|
private schedulerInterval: any
|
||||||
private firstPatchDone = false
|
private firstPatchDone = false
|
||||||
|
@ -92,7 +95,6 @@ export class VideoEditComponent implements OnInit, OnDestroy {
|
||||||
private ngZone: NgZone,
|
private ngZone: NgZone,
|
||||||
private hooks: HooksService
|
private hooks: HooksService
|
||||||
) {
|
) {
|
||||||
this.calendarLocale = this.i18nPrimengCalendarService.getCalendarLocale()
|
|
||||||
this.calendarTimezone = this.i18nPrimengCalendarService.getTimezone()
|
this.calendarTimezone = this.i18nPrimengCalendarService.getTimezone()
|
||||||
this.calendarDateFormat = this.i18nPrimengCalendarService.getDateFormat()
|
this.calendarDateFormat = this.i18nPrimengCalendarService.getDateFormat()
|
||||||
}
|
}
|
||||||
|
@ -251,6 +253,16 @@ export class VideoEditComponent implements OnInit, OnDestroy {
|
||||||
return this.form.value['permanentLive'] === true
|
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 () {
|
private sortVideoCaptions () {
|
||||||
this.videoCaptions.sort((v1, v2) => {
|
this.videoCaptions.sort((v1, v2) => {
|
||||||
if (v1.language.label < v2.language.label) return -1
|
if (v1.language.label < v2.language.label) return -1
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
[validationMessages]="validationMessages" [userVideoChannels]="userVideoChannels"
|
[validationMessages]="validationMessages" [userVideoChannels]="userVideoChannels"
|
||||||
[videoCaptions]="videoCaptions" [waitTranscodingEnabled]="isWaitTranscodingEnabled()"
|
[videoCaptions]="videoCaptions" [waitTranscodingEnabled]="isWaitTranscodingEnabled()"
|
||||||
type="update" (pluginFieldsAdded)="hydratePluginFieldsFromVideo()"
|
type="update" (pluginFieldsAdded)="hydratePluginFieldsFromVideo()"
|
||||||
[liveVideo]="liveVideo"
|
[liveVideo]="liveVideo" [videoToUpdate]="videoDetails"
|
||||||
></my-video-edit>
|
></my-video-edit>
|
||||||
|
|
||||||
<div class="submit-container">
|
<div class="submit-container">
|
||||||
|
|
|
@ -777,6 +777,7 @@ export class PeerTubeEmbed {
|
||||||
getSettings: unimplemented,
|
getSettings: unimplemented,
|
||||||
|
|
||||||
isLoggedIn: unimplemented,
|
isLoggedIn: unimplemented,
|
||||||
|
getAuthHeader: unimplemented,
|
||||||
|
|
||||||
notifier: {
|
notifier: {
|
||||||
info: unimplemented,
|
info: unimplemented,
|
||||||
|
|
|
@ -13,6 +13,9 @@ export type RegisterClientFormFieldOptions = {
|
||||||
|
|
||||||
// Default setting value
|
// Default setting value
|
||||||
default?: string | boolean
|
default?: string | boolean
|
||||||
|
|
||||||
|
// Not supported by plugin setting registration, use registerSettingsScript instead
|
||||||
|
hidden?: (options: any) => boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface RegisterClientVideoFieldOptions {
|
export interface RegisterClientVideoFieldOptions {
|
||||||
|
|
|
@ -623,7 +623,13 @@ async function register ({ registerVideoField, peertubeHelpers }) {
|
||||||
label: 'My added field',
|
label: 'My added field',
|
||||||
descriptionHTML: 'Optional description',
|
descriptionHTML: 'Optional description',
|
||||||
type: 'input-textarea',
|
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' ]) {
|
for (const type of [ 'upload', 'import-url', 'import-torrent', 'update', 'go-live' ]) {
|
||||||
|
|
Loading…
Reference in New Issue