Add form validator translations

client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html

@@ -207,7 +207,7 @@
       <div i18n class="inner-form-title">Cache</div>
 
       <div class="form-group">
-        <label i18n for="cachePreviewsSize">Preview cache size</label>
+        <label i18n for="cachePreviewsSize">Previews cache size</label>
         <my-help
           helpType="custom" i18n-customHtml
           customHtml="Previews are not federated. We fetch them directly from the origin instance and cache them."

client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts

@@ -1,19 +1,9 @@
 import { Component, OnInit } from '@angular/core'
-import { FormBuilder, FormGroup } from '@angular/forms'
 import { Router } from '@angular/router'
 import { ConfigService } from '@app/+admin/config/shared/config.service'
 import { ConfirmService } from '@app/core'
 import { ServerService } from '@app/core/server/server.service'
-import { FormReactive, USER_VIDEO_QUOTA } from '@app/shared'
-import {
-  ADMIN_EMAIL,
-  CACHE_PREVIEWS_SIZE,
-  INSTANCE_NAME,
-  INSTANCE_SHORT_DESCRIPTION,
-  SERVICES_TWITTER_USERNAME,
-  SIGNUP_LIMIT,
-  TRANSCODING_THREADS
-} from '@app/shared/forms/form-validators/custom-config'
+import { CustomConfigValidatorsService, FormReactive, UserValidatorsService } from '@app/shared'
 import { NotificationsService } from 'angular2-notifications'
 import { CustomConfig } from '../../../../../../shared/models/server/custom-config.model'
 import { I18n } from '@ngx-translate/i18n-polyfill'
@@ -50,6 +40,8 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
 
   constructor (
     protected formValidatorService: FormValidatorService,
+    private customConfigValidatorsService: CustomConfigValidatorsService,
+    private userValidatorsService: UserValidatorsService,
     private router: Router,
     private notificationsService: NotificationsService,
     private configService: ConfigService,
@@ -66,20 +58,20 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
 
   ngOnInit () {
     const formGroupData = {
-      instanceName: INSTANCE_NAME,
-      instanceShortDescription: INSTANCE_SHORT_DESCRIPTION,
+      instanceName: this.customConfigValidatorsService.INSTANCE_NAME,
+      instanceShortDescription: this.customConfigValidatorsService.INSTANCE_SHORT_DESCRIPTION,
       instanceDescription: null,
       instanceTerms: null,
       instanceDefaultClientRoute: null,
       instanceDefaultNSFWPolicy: null,
-      servicesTwitterUsername: SERVICES_TWITTER_USERNAME,
+      servicesTwitterUsername: this.customConfigValidatorsService.SERVICES_TWITTER_USERNAME,
       servicesTwitterWhitelisted: null,
-      cachePreviewsSize: CACHE_PREVIEWS_SIZE,
+      cachePreviewsSize: this.customConfigValidatorsService.CACHE_PREVIEWS_SIZE,
       signupEnabled: null,
-      signupLimit: SIGNUP_LIMIT,
-      adminEmail: ADMIN_EMAIL,
-      userVideoQuota: USER_VIDEO_QUOTA,
-      transcodingThreads: TRANSCODING_THREADS,
+      signupLimit: this.customConfigValidatorsService.SIGNUP_LIMIT,
+      adminEmail: this.customConfigValidatorsService.ADMIN_EMAIL,
+      userVideoQuota: this.userValidatorsService.USER_VIDEO_QUOTA,
+      transcodingThreads: this.customConfigValidatorsService.TRANSCODING_THREADS,
       transcodingEnabled: null,
       customizationJavascript: null,
       customizationCSS: null
@@ -134,11 +126,9 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
       const message = this.i18n('You set custom {{customizationsText}}. ', { customizationsText }) +
         this.i18n('This could lead to security issues or bugs if you do not understand it. ') +
         this.i18n('Are you sure you want to update the configuration?')
-      const label = this.i18n(
-        'Please type "I understand the {{customizationsText}} I set" to confirm.',
-        { customizationsText }
-      )
-      const expectedInputValue = this.i18n('I understand the {{customizationsText}} I set', { customizationsText })
+
+      const label = this.i18n('Please type') + ` "I understand the ${customizationsText} I set" ` + this.i18n('to confirm.')
+      const expectedInputValue = `I understand the ${customizationsText} I set`
 
       const confirmRes = await this.confirmService.confirmWithInput(message, label, expectedInputValue)
       if (confirmRes === false) return

client/src/app/+admin/users/user-edit/user-create.component.ts

@@ -2,12 +2,12 @@ import { Component, OnInit } from '@angular/core'
 import { Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
 import { UserService } from '../shared'
-import { USER_EMAIL, USER_PASSWORD, USER_ROLE, USER_USERNAME, USER_VIDEO_QUOTA } from '../../../shared'
 import { ServerService } from '../../../core'
 import { UserCreate, UserRole } from '../../../../../../shared'
 import { UserEdit } from './user-edit'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
 
 @Component({
   selector: 'my-user-create',
@@ -20,6 +20,7 @@ export class UserCreateComponent extends UserEdit implements OnInit {
   constructor (
     protected serverService: ServerService,
     protected formValidatorService: FormValidatorService,
+    private userValidatorsService: UserValidatorsService,
     private router: Router,
     private notificationsService: NotificationsService,
     private userService: UserService,
@@ -35,11 +36,11 @@ export class UserCreateComponent extends UserEdit implements OnInit {
     }
 
     this.buildForm({
-      username: USER_USERNAME,
-      email: USER_EMAIL,
-      password: USER_PASSWORD,
-      role: USER_ROLE,
-      videoQuota: USER_VIDEO_QUOTA
+      username: this.userValidatorsService.USER_USERNAME,
+      email: this.userValidatorsService.USER_EMAIL,
+      password: this.userValidatorsService.USER_PASSWORD,
+      role: this.userValidatorsService.USER_ROLE,
+      videoQuota: this.userValidatorsService.USER_VIDEO_QUOTA
     }, defaultValues)
   }
 

client/src/app/+admin/users/user-edit/user-update.component.ts

@@ -3,12 +3,13 @@ import { ActivatedRoute, Router } from '@angular/router'
 import { Subscription } from 'rxjs'
 import { NotificationsService } from 'angular2-notifications'
 import { UserService } from '../shared'
-import { User, USER_EMAIL, USER_ROLE, USER_VIDEO_QUOTA } from '../../../shared'
+import { User } from '../../../shared'
 import { ServerService } from '../../../core'
 import { UserEdit } from './user-edit'
 import { UserUpdate } from '../../../../../../shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
 
 @Component({
   selector: 'my-user-update',
@@ -25,6 +26,7 @@ export class UserUpdateComponent extends UserEdit implements OnInit, OnDestroy {
   constructor (
     protected formValidatorService: FormValidatorService,
     protected serverService: ServerService,
+    private userValidatorsService: UserValidatorsService,
     private route: ActivatedRoute,
     private router: Router,
     private notificationsService: NotificationsService,
@@ -37,9 +39,9 @@ export class UserUpdateComponent extends UserEdit implements OnInit, OnDestroy {
   ngOnInit () {
     const defaultValues = { videoQuota: '-1' }
     this.buildForm({
-      email: USER_EMAIL,
-      role: USER_ROLE,
-      videoQuota: USER_VIDEO_QUOTA
+      email: this.userValidatorsService.USER_EMAIL,
+      role: this.userValidatorsService.USER_ROLE,
+      videoQuota: this.userValidatorsService.USER_VIDEO_QUOTA
     }, defaultValues)
 
     this.paramsSub = this.route.params.subscribe(routeParams => {

client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts

@@ -1,8 +1,9 @@
 import { Component, OnInit } from '@angular/core'
 import { NotificationsService } from 'angular2-notifications'
-import { FormReactive, USER_PASSWORD, UserService } from '../../../shared'
+import { FormReactive, UserService } from '../../../shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
 
 @Component({
   selector: 'my-account-change-password',
@@ -14,6 +15,7 @@ export class MyAccountChangePasswordComponent extends FormReactive implements On
 
   constructor (
     protected formValidatorService: FormValidatorService,
+    private userValidatorsService: UserValidatorsService,
     private notificationsService: NotificationsService,
     private userService: UserService,
     private i18n: I18n
@@ -23,8 +25,8 @@ export class MyAccountChangePasswordComponent extends FormReactive implements On
 
   ngOnInit () {
     this.buildForm({
-      'new-password': USER_PASSWORD,
-      'new-confirmed-password': USER_PASSWORD
+      'new-password': this.userValidatorsService.USER_PASSWORD,
+      'new-confirmed-password': this.userValidatorsService.USER_PASSWORD
     })
   }
 

client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.html

@@ -2,22 +2,26 @@
 
 <form role="form" (ngSubmit)="updateMyProfile()" [formGroup]="form">
 
-  <label i18n for="display-name">Display name</label>
-  <input
-    type="text" id="display-name"
-    formControlName="display-name" [ngClass]="{ 'input-error': formErrors['display-name'] }"
-  >
-  <div *ngIf="formErrors['display-name']" class="form-error">
-    {{ formErrors['display-name'] }}
+  <div class="form-group">
+    <label i18n for="display-name">Display name</label>
+    <input
+      type="text" id="display-name"
+      formControlName="display-name" [ngClass]="{ 'input-error': formErrors['display-name'] }"
+    >
+    <div *ngIf="formErrors['display-name']" class="form-error">
+      {{ formErrors['display-name'] }}
+    </div>
   </div>
 
-  <label i18n for="description">Description</label>
-  <textarea
-    id="description" formControlName="description"
-    [ngClass]="{ 'input-error': formErrors['description'] }"
-  ></textarea>
-  <div *ngIf="formErrors.description" class="form-error">
-    {{ formErrors.description }}
+  <div class="form-group">
+    <label i18n for="description">Description</label>
+    <textarea
+      id="description" formControlName="description"
+      [ngClass]="{ 'input-error': formErrors['description'] }"
+    ></textarea>
+    <div *ngIf="formErrors.description" class="form-error">
+      {{ formErrors.description }}
+    </div>
   </div>
 
   <input type="submit" i18n-value value="Update my profile" [disabled]="!form.valid">

client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.scss

@@ -1,11 +1,14 @@
 @import '_variables';
 @import '_mixins';
 
+.form-group:first-child {
+  margin-bottom: 15px;
+}
+
 input[type=text] {
   @include peertube-input-text(340px);
 
   display: block;
-  margin-bottom: 15px;
 }
 
 textarea {

client/src/app/+my-account/my-account-settings/my-account-profile/my-account-profile.component.ts

@@ -1,10 +1,11 @@
 import { Component, Input, OnInit } from '@angular/core'
 import { NotificationsService } from 'angular2-notifications'
-import { FormReactive, USER_DESCRIPTION, USER_DISPLAY_NAME, UserService } from '../../../shared'
+import { FormReactive, UserService } from '../../../shared'
 import { User } from '@app/shared'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
 import { Subject } from 'rxjs/Subject'
+import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
 
 @Component({
   selector: 'my-account-profile',
@@ -19,6 +20,7 @@ export class MyAccountProfileComponent extends FormReactive implements OnInit {
 
   constructor (
     protected formValidatorService: FormValidatorService,
+    private userValidatorsService: UserValidatorsService,
     private notificationsService: NotificationsService,
     private userService: UserService,
     private i18n: I18n
@@ -28,8 +30,8 @@ export class MyAccountProfileComponent extends FormReactive implements OnInit {
 
   ngOnInit () {
     this.buildForm({
-      'display-name': USER_DISPLAY_NAME,
-      description: USER_DESCRIPTION
+      'display-name': this.userValidatorsService.USER_DISPLAY_NAME,
+      description: this.userValidatorsService.USER_DESCRIPTION
     })
 
     this.userInformationLoaded.subscribe(() => {

client/src/app/+my-account/my-account-video-channels/my-account-video-channel-create.component.ts

@@ -3,15 +3,11 @@ import { Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
 import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit'
 import { VideoChannelCreate } from '../../../../../shared/models/videos'
-import {
-  VIDEO_CHANNEL_DESCRIPTION,
-  VIDEO_CHANNEL_DISPLAY_NAME,
-  VIDEO_CHANNEL_SUPPORT
-} from '@app/shared/forms/form-validators/video-channel'
 import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
 import { AuthService } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { VideoChannelValidatorsService } from '@app/shared/forms/form-validators/video-channel-validators.service'
 
 @Component({
   selector: 'my-account-video-channel-create',
@@ -24,6 +20,7 @@ export class MyAccountVideoChannelCreateComponent extends MyAccountVideoChannelE
   constructor (
     protected formValidatorService: FormValidatorService,
     private authService: AuthService,
+    private videoChannelValidatorsService: VideoChannelValidatorsService,
     private notificationsService: NotificationsService,
     private router: Router,
     private videoChannelService: VideoChannelService,
@@ -34,9 +31,9 @@ export class MyAccountVideoChannelCreateComponent extends MyAccountVideoChannelE
 
   ngOnInit () {
     this.buildForm({
-      'display-name': VIDEO_CHANNEL_DISPLAY_NAME,
-      description: VIDEO_CHANNEL_DESCRIPTION,
-      support: VIDEO_CHANNEL_SUPPORT
+      'display-name': this.videoChannelValidatorsService.VIDEO_CHANNEL_DISPLAY_NAME,
+      description: this.videoChannelValidatorsService.VIDEO_CHANNEL_DESCRIPTION,
+      support: this.videoChannelValidatorsService.VIDEO_CHANNEL_SUPPORT
     })
   }
 

client/src/app/+my-account/my-account-video-channels/my-account-video-channel-update.component.ts

@@ -3,17 +3,13 @@ import { ActivatedRoute, Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
 import { MyAccountVideoChannelEdit } from './my-account-video-channel-edit'
 import { VideoChannelUpdate } from '../../../../../shared/models/videos'
-import {
-  VIDEO_CHANNEL_DESCRIPTION,
-  VIDEO_CHANNEL_DISPLAY_NAME,
-  VIDEO_CHANNEL_SUPPORT
-} from '@app/shared/forms/form-validators/video-channel'
 import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
 import { Subscription } from 'rxjs'
 import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
 import { AuthService } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { VideoChannelValidatorsService } from '@app/shared/forms/form-validators/video-channel-validators.service'
 
 @Component({
   selector: 'my-account-video-channel-update',
@@ -29,6 +25,7 @@ export class MyAccountVideoChannelUpdateComponent extends MyAccountVideoChannelE
   constructor (
     protected formValidatorService: FormValidatorService,
     private authService: AuthService,
+    private videoChannelValidatorsService: VideoChannelValidatorsService,
     private notificationsService: NotificationsService,
     private router: Router,
     private route: ActivatedRoute,
@@ -40,9 +37,9 @@ export class MyAccountVideoChannelUpdateComponent extends MyAccountVideoChannelE
 
   ngOnInit () {
     this.buildForm({
-      'display-name': VIDEO_CHANNEL_DISPLAY_NAME,
-      description: VIDEO_CHANNEL_DESCRIPTION,
-      support: VIDEO_CHANNEL_SUPPORT
+      'display-name': this.videoChannelValidatorsService.VIDEO_CHANNEL_DISPLAY_NAME,
+      description: this.videoChannelValidatorsService.VIDEO_CHANNEL_DESCRIPTION,
+      support: this.videoChannelValidatorsService.VIDEO_CHANNEL_SUPPORT
     })
 
     this.paramsSub = this.route.params.subscribe(routeParams => {

client/src/app/app.module.ts

@@ -17,6 +17,7 @@ import { SharedModule } from './shared'
 import { SignupModule } from './signup'
 import { VideosModule } from './videos'
 import { buildFileLocale, getDefaultLocale } from '../../../shared/models/i18n'
+import { environment } from '../environments/environment'
 
 export function metaFactory (serverService: ServerService): MetaLoader {
   return new MetaStaticLoader({
@@ -66,6 +67,11 @@ export function metaFactory (serverService: ServerService): MetaLoader {
     {
       provide: TRANSLATIONS,
       useFactory: (locale) => {
+        // On dev mode, test locales
+        if (environment.production === false && window.location.search === '?lang=fr') {
+          return require(`raw-loader!../locale/target/messages_fr.xml`)
+        }
+
         const fileLocale = buildFileLocale(locale)
 
         // Default locale, nothing to translate