import { Validators } from '@angular/forms'
+export type ValidatorMessage = {
+ [ id: string ]: {
+ [ error: string ]: string
+ }
+}
+
export const VIDEO_NAME = {
VALIDATORS: [ Validators.required, Validators.minLength(3), Validators.maxLength(120) ],
MESSAGES: {
--- /dev/null
+<div [formGroup]="form">
+ <div class="form-group">
+ <label for="name">Name</label>
+ <input
+ type="text" class="form-control" id="name"
+ formControlName="name"
+ >
+ <div *ngIf="formErrors.name" class="alert alert-danger">
+ {{ formErrors.name }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="privacy">Privacy</label>
+ <select class="form-control" id="privacy" formControlName="privacy">
+ <option></option>
+ <option *ngFor="let privacy of videoPrivacies" [value]="privacy.id">{{ privacy.label }}</option>
+ </select>
+
+ <div *ngIf="formErrors.privacy" class="alert alert-danger">
+ {{ formErrors.privacy }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <input
+ type="checkbox" id="nsfw"
+ formControlName="nsfw"
+ >
+ <label for="nsfw">This video contains mature or explicit content</label>
+ </div>
+
+ <div class="form-group">
+ <label for="category">Category</label>
+ <select class="form-control" id="category" formControlName="category">
+ <option></option>
+ <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
+ </select>
+
+ <div *ngIf="formErrors.category" class="alert alert-danger">
+ {{ formErrors.category }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="licence">Licence</label>
+ <select class="form-control" id="licence" formControlName="licence">
+ <option></option>
+ <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
+ </select>
+
+ <div *ngIf="formErrors.licence" class="alert alert-danger">
+ {{ formErrors.licence }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="language">Language</label>
+ <select class="form-control" id="language" formControlName="language">
+ <option></option>
+ <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
+ </select>
+
+ <div *ngIf="formErrors.language" class="alert alert-danger">
+ {{ formErrors.language }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
+ <tag-input
+ [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
+ formControlName="tags" maxItems="5" modelAsStrings="true"
+ ></tag-input>
+ </div>
+
+ <div class="form-group">
+ <label for="description">Description</label>
+ <my-video-description formControlName="description"></my-video-description>
+
+ <div *ngIf="formErrors.description" class="alert alert-danger">
+ {{ formErrors.description }}
+ </div>
+ </div>
+</div>
--- /dev/null
+import { Component, Input, OnInit } from '@angular/core'
+import { FormBuilder, FormControl, FormGroup } from '@angular/forms'
+import { ActivatedRoute, Router } from '@angular/router'
+import { NotificationsService } from 'angular2-notifications'
+import { ServerService } from 'app/core'
+import { VideoEdit } from 'app/shared/video/video-edit.model'
+import 'rxjs/add/observable/forkJoin'
+import { VideoPrivacy } from '../../../../../shared/models/videos/video-privacy.enum'
+import {
+ ValidatorMessage,
+ VIDEO_CATEGORY,
+ VIDEO_DESCRIPTION,
+ VIDEO_LANGUAGE,
+ VIDEO_LICENCE,
+ VIDEO_NAME,
+ VIDEO_PRIVACY,
+ VIDEO_TAGS
+} from '../../../shared/forms/form-validators'
+
+@Component({
+ selector: 'my-video-edit',
+ styleUrls: [ './video-edit.component.scss' ],
+ templateUrl: './video-edit.component.html'
+})
+
+export class VideoEditComponent implements OnInit {
+ @Input() form: FormGroup
+ @Input() formErrors: { [ id: string ]: string } = {}
+ @Input() validationMessages: ValidatorMessage = {}
+ @Input() videoPrivacies = []
+
+ tags: string[] = []
+ videoCategories = []
+ videoLicences = []
+ videoLanguages = []
+ video: VideoEdit
+
+ tagValidators = VIDEO_TAGS.VALIDATORS
+ tagValidatorsMessages = VIDEO_TAGS.MESSAGES
+
+ error: string = null
+
+ constructor (
+ private formBuilder: FormBuilder,
+ private route: ActivatedRoute,
+ private router: Router,
+ private notificationsService: NotificationsService,
+ private serverService: ServerService
+ ) { }
+
+ updateForm () {
+ this.formErrors['name'] = ''
+ this.formErrors['privacy'] = ''
+ this.formErrors['category'] = ''
+ this.formErrors['licence'] = ''
+ this.formErrors['language'] = ''
+ this.formErrors['description'] = ''
+
+ this.validationMessages['name'] = VIDEO_NAME.MESSAGES
+ this.validationMessages['privacy'] = VIDEO_PRIVACY.MESSAGES
+ this.validationMessages['category'] = VIDEO_CATEGORY.MESSAGES
+ this.validationMessages['licence'] = VIDEO_LICENCE.MESSAGES
+ this.validationMessages['language'] = VIDEO_LANGUAGE.MESSAGES
+ this.validationMessages['description'] = VIDEO_DESCRIPTION.MESSAGES
+
+ this.form.addControl('name', new FormControl('', VIDEO_NAME.VALIDATORS))
+ this.form.addControl('privacy', new FormControl('', VIDEO_PRIVACY.VALIDATORS))
+ this.form.addControl('nsfw', new FormControl(false))
+ this.form.addControl('category', new FormControl('', VIDEO_CATEGORY.VALIDATORS))
+ this.form.addControl('licence', new FormControl('', VIDEO_LICENCE.VALIDATORS))
+ this.form.addControl('language', new FormControl('', VIDEO_LANGUAGE.VALIDATORS))
+ this.form.addControl('description', new FormControl('', VIDEO_DESCRIPTION.VALIDATORS))
+ this.form.addControl('tags', new FormControl(''))
+ }
+
+ ngOnInit () {
+ this.updateForm()
+
+ this.videoCategories = this.serverService.getVideoCategories()
+ this.videoLicences = this.serverService.getVideoLicences()
+ this.videoLanguages = this.serverService.getVideoLanguages()
+ }
+}
import { MarkdownService, VideoDescriptionComponent } from '../../shared'
import { SharedModule } from '../../../shared'
+import { VideoEditComponent } from './video-edit.component'
@NgModule({
imports: [
],
declarations: [
- VideoDescriptionComponent
+ VideoDescriptionComponent,
+ VideoEditComponent
],
exports: [
TagInputModule,
TabsModule,
- VideoDescriptionComponent
+ VideoDescriptionComponent,
+ VideoEditComponent
],
providers: [
<h3>Update {{ video?.name }}</h3>
- <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
-
<form novalidate [formGroup]="form">
- <div class="form-group">
- <label for="name">Name</label>
- <input
- type="text" class="form-control" id="name"
- formControlName="name"
- >
- <div *ngIf="formErrors.name" class="alert alert-danger">
- {{ formErrors.name }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="privacy">Privacy</label>
- <select class="form-control" id="privacy" formControlName="privacy">
- <option></option>
- <option *ngFor="let privacy of videoPrivacies" [value]="privacy.id">{{ privacy.label }}</option>
- </select>
-
- <div *ngIf="formErrors.privacy" class="alert alert-danger">
- {{ formErrors.privacy }}
- </div>
- </div>
-
- <div class="form-group">
- <input
- type="checkbox" id="nsfw"
- formControlName="nsfw"
- >
- <label for="nsfw">This video contains mature or explicit content</label>
- </div>
-
- <div class="form-group">
- <label for="category">Category</label>
- <select class="form-control" id="category" formControlName="category">
- <option></option>
- <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
- </select>
- <div *ngIf="formErrors.category" class="alert alert-danger">
- {{ formErrors.category }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="licence">Licence</label>
- <select class="form-control" id="licence" formControlName="licence">
- <option></option>
- <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
- </select>
-
- <div *ngIf="formErrors.licence" class="alert alert-danger">
- {{ formErrors.licence }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="language">Language</label>
- <select class="form-control" id="language" formControlName="language">
- <option></option>
- <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
- </select>
-
- <div *ngIf="formErrors.language" class="alert alert-danger">
- {{ formErrors.language }}
- </div>
- </div>
-
- <div class="form-group">
- <label class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
- <tag-input
- [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
- formControlName="tags" maxItems="5" modelAsStrings="true"
- ></tag-input>
- </div>
-
- <div class="form-group">
- <label for="description">Description</label>
- <my-video-description formControlName="description"></my-video-description>
-
- <div *ngIf="formErrors.description" class="alert alert-danger">
- {{ formErrors.description }}
- </div>
- </div>
+ <my-video-edit
+ [form]="form" [formErrors]="formErrors"
+ [validationMessages]="validationMessages" [videoPrivacies]="videoPrivacies"
+ ></my-video-edit>
<div class="form-group">
<input
VIDEO_PRIVACY,
VIDEO_TAGS
} from '../../shared'
+import { ValidatorMessage } from '../../shared/forms/form-validators'
import { VideoService } from '../../shared/video/video.service'
import { VideoEdit } from '../../shared/video/video-edit.model'
})
export class VideoUpdateComponent extends FormReactive implements OnInit {
- tags: string[] = []
- videoCategories = []
- videoLicences = []
- videoLanguages = []
- videoPrivacies = []
video: VideoEdit
- tagValidators = VIDEO_TAGS.VALIDATORS
- tagValidatorsMessages = VIDEO_TAGS.MESSAGES
-
error: string = null
form: FormGroup
- formErrors = {
- name: '',
- privacy: '',
- category: '',
- licence: '',
- language: '',
- description: ''
- }
- validationMessages = {
- name: VIDEO_NAME.MESSAGES,
- privacy: VIDEO_PRIVACY.MESSAGES,
- category: VIDEO_CATEGORY.MESSAGES,
- licence: VIDEO_LICENCE.MESSAGES,
- language: VIDEO_LANGUAGE.MESSAGES,
- description: VIDEO_DESCRIPTION.MESSAGES
- }
+ formErrors: { [ id: string ]: string } = {}
+ validationMessages: ValidatorMessage = {}
+ videoPrivacies = []
fileError = ''
}
buildForm () {
- this.form = this.formBuilder.group({
- name: [ '', VIDEO_NAME.VALIDATORS ],
- privacy: [ '', VIDEO_PRIVACY.VALIDATORS ],
- nsfw: [ false ],
- category: [ '', VIDEO_CATEGORY.VALIDATORS ],
- licence: [ '', VIDEO_LICENCE.VALIDATORS ],
- language: [ '', VIDEO_LANGUAGE.VALIDATORS ],
- description: [ '', VIDEO_DESCRIPTION.VALIDATORS ],
- tags: [ '' ]
- })
-
+ this.form = this.formBuilder.group({})
this.form.valueChanges.subscribe(data => this.onValueChanged(data))
}
ngOnInit () {
this.buildForm()
- this.videoCategories = this.serverService.getVideoCategories()
- this.videoLicences = this.serverService.getVideoLicences()
- this.videoLanguages = this.serverService.getVideoLanguages()
this.videoPrivacies = this.serverService.getVideoPrivacies()
const uuid: string = this.route.snapshot.params['uuid']
-
this.videoService.getVideo(uuid)
.switchMap(video => {
return this.videoService
video => {
this.video = new VideoEdit(video)
- // We cannot set private a video that was not private anymore
+ // We cannot set private a video that was not private
if (video.privacy !== VideoPrivacy.PRIVATE) {
const newVideoPrivacies = []
for (const p of this.videoPrivacies) {
import { AuthService, ConfirmService } from '../../core'
import { VideoBlacklistService } from '../../shared'
import { Account } from '../../shared/account/account.model'
+import { VideoDetails } from '../../shared/video/video-details.model'
import { Video } from '../../shared/video/video.model'
import { MarkdownService } from '../shared'
import { VideoDownloadComponent } from './video-download.component'
import { VideoReportComponent } from './video-report.component'
import { VideoShareComponent } from './video-share.component'
-import { VideoDetails } from '../../shared/video/video-details.model'
@Component({
selector: 'my-video-watch',
return this.authService.isLoggedIn()
}
- canUserUpdateVideo () {
- return this.video.isUpdatableBy(this.authService.getUser())
- }
-
- isVideoRemovable () {
- return this.video.isRemovableBy(this.authService.getUser())
- }
-
isVideoBlacklistable () {
return this.video.isBlackistableBy(this.authService.getUser())
}
projects / github / Chocobozzz / PeerTube.git / commitdiff
