aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-07-25 11:01:53 +0200
committerChocobozzz <me@florianbigard.com>2018-07-25 11:01:53 +0200
commitb4a929accf576edc733fde75a81dfad9a3d288ed (patch)
treedbf7e0acca829b5fed3a363fe7b8e3f80041558f /client/src/app
parentb2c60abe6e1637d8f55688ffcbf99cf553ed52ea (diff)
downloadPeerTube-b4a929accf576edc733fde75a81dfad9a3d288ed.tar.gz
PeerTube-b4a929accf576edc733fde75a81dfad9a3d288ed.tar.zst
PeerTube-b4a929accf576edc733fde75a81dfad9a3d288ed.zip
Add "agree to the terms" checkbox in registration form
Diffstat (limited to 'client/src/app')
-rw-r--r--client/src/app/+about/about-instance/about-instance.component.html2
-rw-r--r--client/src/app/shared/forms/form-reactive.ts2
-rw-r--r--client/src/app/shared/forms/form-validators/form-validator.service.ts4
-rw-r--r--client/src/app/shared/forms/form-validators/user-validators.service.ts10
-rw-r--r--client/src/app/shared/forms/peertube-checkbox.component.html1
-rw-r--r--client/src/app/shared/forms/peertube-checkbox.component.ts1
-rw-r--r--client/src/app/signup/signup.component.html11
-rw-r--r--client/src/app/signup/signup.component.scss3
-rw-r--r--client/src/app/signup/signup.component.ts3
9 files changed, 31 insertions, 6 deletions
diff --git a/client/src/app/+about/about-instance/about-instance.component.html b/client/src/app/+about/about-instance/about-instance.component.html
index e433b0016..5970cac01 100644
--- a/client/src/app/+about/about-instance/about-instance.component.html
+++ b/client/src/app/+about/about-instance/about-instance.component.html
@@ -12,7 +12,7 @@
12 <div [innerHTML]="descriptionHTML"></div> 12 <div [innerHTML]="descriptionHTML"></div>
13</div> 13</div>
14 14
15<div class="terms"> 15<div class="terms" id="terms-section">
16 <div i18n class="section-title">Terms</div> 16 <div i18n class="section-title">Terms</div>
17 17
18 <div [innerHTML]="termsHTML"></div> 18 <div [innerHTML]="termsHTML"></div>
diff --git a/client/src/app/shared/forms/form-reactive.ts b/client/src/app/shared/forms/form-reactive.ts
index e4f7481b5..0bb7d25e6 100644
--- a/client/src/app/shared/forms/form-reactive.ts
+++ b/client/src/app/shared/forms/form-reactive.ts
@@ -23,7 +23,7 @@ export abstract class FormReactive {
23 this.formErrors = formErrors 23 this.formErrors = formErrors
24 this.validationMessages = validationMessages 24 this.validationMessages = validationMessages
25 25
26 this.form.valueChanges.subscribe(data => this.onValueChanged(false)) 26 this.form.valueChanges.subscribe(() => this.onValueChanged(false))
27 } 27 }
28 28
29 protected onValueChanged (forceCheck = false) { 29 protected onValueChanged (forceCheck = false) {
diff --git a/client/src/app/shared/forms/form-validators/form-validator.service.ts b/client/src/app/shared/forms/form-validators/form-validator.service.ts
index d10e17ca7..19a8bef25 100644
--- a/client/src/app/shared/forms/form-validators/form-validator.service.ts
+++ b/client/src/app/shared/forms/form-validators/form-validator.service.ts
@@ -1,7 +1,6 @@
1import { FormBuilder, FormControl, FormGroup, ValidatorFn } from '@angular/forms' 1import { FormBuilder, FormControl, FormGroup, ValidatorFn } from '@angular/forms'
2import { Injectable } from '@angular/core' 2import { Injectable } from '@angular/core'
3import { FormReactiveErrors, FormReactiveValidationMessages } from '@app/shared/forms/form-reactive' 3import { FormReactiveErrors, FormReactiveValidationMessages } from '@app/shared/forms/form-reactive'
4import { I18n } from '@ngx-translate/i18n-polyfill'
5 4
6export type BuildFormValidator = { 5export type BuildFormValidator = {
7 VALIDATORS: ValidatorFn[], 6 VALIDATORS: ValidatorFn[],
@@ -18,8 +17,7 @@ export type BuildFormDefaultValues = {
18export class FormValidatorService { 17export class FormValidatorService {
19 18
20 constructor ( 19 constructor (
21 private formBuilder: FormBuilder, 20 private formBuilder: FormBuilder
22 private i18n: I18n
23 ) {} 21 ) {}
24 22
25 buildForm (obj: BuildFormArgument, defaultValues: BuildFormDefaultValues = {}) { 23 buildForm (obj: BuildFormArgument, defaultValues: BuildFormDefaultValues = {}) {
diff --git a/client/src/app/shared/forms/form-validators/user-validators.service.ts b/client/src/app/shared/forms/form-validators/user-validators.service.ts
index bb6ff2068..5edae2e38 100644
--- a/client/src/app/shared/forms/form-validators/user-validators.service.ts
+++ b/client/src/app/shared/forms/form-validators/user-validators.service.ts
@@ -12,6 +12,7 @@ export class UserValidatorsService {
12 readonly USER_ROLE: BuildFormValidator 12 readonly USER_ROLE: BuildFormValidator
13 readonly USER_DISPLAY_NAME: BuildFormValidator 13 readonly USER_DISPLAY_NAME: BuildFormValidator
14 readonly USER_DESCRIPTION: BuildFormValidator 14 readonly USER_DESCRIPTION: BuildFormValidator
15 readonly USER_TERMS: BuildFormValidator
15 16
16 constructor (private i18n: I18n) { 17 constructor (private i18n: I18n) {
17 18
@@ -89,5 +90,14 @@ export class UserValidatorsService {
89 'maxlength': this.i18n('Description cannot be more than 250 characters long.') 90 'maxlength': this.i18n('Description cannot be more than 250 characters long.')
90 } 91 }
91 } 92 }
93
94 this.USER_TERMS = {
95 VALIDATORS: [
96 Validators.requiredTrue
97 ],
98 MESSAGES: {
99 'required': this.i18n('You must to agree with the instance terms in order to registering on it.')
100 }
101 }
92 } 102 }
93} 103}
diff --git a/client/src/app/shared/forms/peertube-checkbox.component.html b/client/src/app/shared/forms/peertube-checkbox.component.html
index 820e7a621..38691f050 100644
--- a/client/src/app/shared/forms/peertube-checkbox.component.html
+++ b/client/src/app/shared/forms/peertube-checkbox.component.html
@@ -3,6 +3,7 @@
3 <input type="checkbox" [(ngModel)]="checked" (ngModelChange)="onModelChange()" [id]="inputName" [disabled]="isDisabled" /> 3 <input type="checkbox" [(ngModel)]="checked" (ngModelChange)="onModelChange()" [id]="inputName" [disabled]="isDisabled" />
4 <span role="checkbox" [attr.aria-checked]="checked"></span> 4 <span role="checkbox" [attr.aria-checked]="checked"></span>
5 <span *ngIf="labelText">{{ labelText }}</span> 5 <span *ngIf="labelText">{{ labelText }}</span>
6 <span *ngIf="labelHtml" [innerHTML]="labelHtml"></span>
6 </label> 7 </label>
7 8
8 <my-help *ngIf="helpHtml" tooltipPlacement="top" helpType="custom" i18n-customHtml [customHtml]="helpHtml"></my-help> 9 <my-help *ngIf="helpHtml" tooltipPlacement="top" helpType="custom" i18n-customHtml [customHtml]="helpHtml"></my-help>
diff --git a/client/src/app/shared/forms/peertube-checkbox.component.ts b/client/src/app/shared/forms/peertube-checkbox.component.ts
index c626c4c5d..bbc9904df 100644
--- a/client/src/app/shared/forms/peertube-checkbox.component.ts
+++ b/client/src/app/shared/forms/peertube-checkbox.component.ts
@@ -17,6 +17,7 @@ export class PeertubeCheckboxComponent implements ControlValueAccessor {
17 @Input() checked = false 17 @Input() checked = false
18 @Input() inputName: string 18 @Input() inputName: string
19 @Input() labelText: string 19 @Input() labelText: string
20 @Input() labelHtml: string
20 @Input() helpHtml: string 21 @Input() helpHtml: string
21 22
22 isDisabled = false 23 isDisabled = false
diff --git a/client/src/app/signup/signup.component.html b/client/src/app/signup/signup.component.html
index 2fe9a4281..565b695d9 100644
--- a/client/src/app/signup/signup.component.html
+++ b/client/src/app/signup/signup.component.html
@@ -54,6 +54,17 @@
54 </div> 54 </div>
55 </div> 55 </div>
56 56
57 <div class="form-group form-group-terms">
58 <my-peertube-checkbox
59 inputName="terms" formControlName="terms"
60 i18n-labelHtml labelHtml="I have read and agree to the <a href='/about/instance#terms-section' target='_blank'rel='noopener noreferrer'>Terms</a> of this instance"
61 ></my-peertube-checkbox>
62
63 <div *ngIf="formErrors.terms" class="form-error">
64 {{ formErrors.terms }}
65 </div>
66 </div>
67
57 <input type="submit" i18n-value value="Signup" [disabled]="!form.valid"> 68 <input type="submit" i18n-value value="Signup" [disabled]="!form.valid">
58 </form> 69 </form>
59 70
diff --git a/client/src/app/signup/signup.component.scss b/client/src/app/signup/signup.component.scss
index 8ea4ec997..e6d484297 100644
--- a/client/src/app/signup/signup.component.scss
+++ b/client/src/app/signup/signup.component.scss
@@ -10,6 +10,9 @@
10 } 10 }
11} 11}
12 12
13.form-group-terms {
14 margin: 30px 0;
15}
13 16
14input:not([type=submit]) { 17input:not([type=submit]) {
15 @include peertube-input-text(340px); 18 @include peertube-input-text(340px);
diff --git a/client/src/app/signup/signup.component.ts b/client/src/app/signup/signup.component.ts
index 53d144572..076dac454 100644
--- a/client/src/app/signup/signup.component.ts
+++ b/client/src/app/signup/signup.component.ts
@@ -38,7 +38,8 @@ export class SignupComponent extends FormReactive implements OnInit {
38 this.buildForm({ 38 this.buildForm({
39 username: this.userValidatorsService.USER_USERNAME, 39 username: this.userValidatorsService.USER_USERNAME,
40 password: this.userValidatorsService.USER_PASSWORD, 40 password: this.userValidatorsService.USER_PASSWORD,
41 email: this.userValidatorsService.USER_EMAIL 41 email: this.userValidatorsService.USER_EMAIL,
42 terms: this.userValidatorsService.USER_TERMS
42 }) 43 })
43 44
44 this.serverService.configLoaded 45 this.serverService.configLoaded