aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src
diff options
context:
space:
mode:
authorJelle Besseling <jelle@pingiun.com>2021-10-12 13:33:44 +0200
committerGitHub <noreply@github.com>2021-10-12 13:33:44 +0200
commit8d8a037e3fe9b1d2ccbc4169ce59b13000b59cb0 (patch)
tree755ba56bc3acbd82ec195974545581c1e49aae5e /client/src
parentbadacdbb4a3e4a1aae4d324abc496be8e261b2ef (diff)
downloadPeerTube-8d8a037e3fe9b1d2ccbc4169ce59b13000b59cb0.tar.gz
PeerTube-8d8a037e3fe9b1d2ccbc4169ce59b13000b59cb0.tar.zst
PeerTube-8d8a037e3fe9b1d2ccbc4169ce59b13000b59cb0.zip
Allow configuration to be static/readonly (#4315)
* Allow configuration to be static/readonly * Make all components disableable * Improve disabled component styling * Rename edits allowed field in configuration * Fix CI
Diffstat (limited to 'client/src')
-rw-r--r--client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html8
-rw-r--r--client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss10
-rw-r--r--client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts3
-rw-r--r--client/src/app/shared/shared-forms/markdown-textarea.component.html5
-rw-r--r--client/src/app/shared/shared-forms/markdown-textarea.component.ts5
-rw-r--r--client/src/app/shared/shared-forms/select/select-checkbox.component.html1
-rw-r--r--client/src/app/shared/shared-forms/select/select-checkbox.component.ts6
-rw-r--r--client/src/app/shared/shared-forms/select/select-custom-value.component.html1
-rw-r--r--client/src/app/shared/shared-forms/select/select-custom-value.component.ts5
-rw-r--r--client/src/app/shared/shared-forms/select/select-options.component.html1
-rw-r--r--client/src/app/shared/shared-forms/select/select-options.component.ts5
-rw-r--r--client/src/sass/include/_mixins.scss3
12 files changed, 49 insertions, 4 deletions
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
index 3ceea02ca..6ae7b1b79 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
@@ -63,7 +63,7 @@
63 <div class="col-md-7 col-xl-5"></div> 63 <div class="col-md-7 col-xl-5"></div>
64 <div class="col-md-5 col-xl-5"> 64 <div class="col-md-5 col-xl-5">
65 65
66 <div class="form-error submit-error" i18n *ngIf="!form.valid"> 66 <div class="form-error submit-error" i18n *ngIf="!form.valid && serverConfig.allowEdits">
67 There are errors in the form: 67 There are errors in the form:
68 68
69 <ul> 69 <ul>
@@ -77,7 +77,11 @@
77 You cannot allow live replay if you don't enable transcoding. 77 You cannot allow live replay if you don't enable transcoding.
78 </span> 78 </span>
79 79
80 <input (click)="formValidated()" type="submit" i18n-value value="Update configuration" [disabled]="!form.valid || !hasConsistentOptions()"> 80 <span i18n *ngIf="!serverConfig.allowEdits">
81 You cannot change the server configuration because it's managed externally.
82 </span>
83
84 <input (click)="formValidated()" type="submit" i18n-value value="Update configuration" [disabled]="!form.valid || !hasConsistentOptions() || !serverConfig.allowEdits">
81 </div> 85 </div>
82 </div> 86 </div>
83</form> 87</form>
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss
index 5951d0aaa..0458d257f 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss
@@ -33,6 +33,11 @@ input[type=number] {
33 top: 5px; 33 top: 5px;
34 right: 2.5rem; 34 right: 2.5rem;
35 } 35 }
36
37 input[disabled] {
38 background-color: #f9f9f9;
39 pointer-events: none;
40 }
36} 41}
37 42
38input[type=checkbox] { 43input[type=checkbox] {
@@ -93,6 +98,11 @@ textarea {
93 } 98 }
94} 99}
95 100
101input[disabled] {
102 opacity: 0.5;
103}
104
105
96.form-group-right { 106.form-group-right {
97 padding-top: 2px; 107 padding-top: 2px;
98} 108}
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
index f13fe4bf9..04b0175a7 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
@@ -258,6 +258,9 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
258 258
259 this.loadConfigAndUpdateForm() 259 this.loadConfigAndUpdateForm()
260 this.loadCategoriesAndLanguages() 260 this.loadCategoriesAndLanguages()
261 if (!this.serverConfig.allowEdits) {
262 this.form.disable()
263 }
261 } 264 }
262 265
263 formValidated () { 266 formValidated () {
diff --git a/client/src/app/shared/shared-forms/markdown-textarea.component.html b/client/src/app/shared/shared-forms/markdown-textarea.component.html
index 6e70e2f37..a460cb9b7 100644
--- a/client/src/app/shared/shared-forms/markdown-textarea.component.html
+++ b/client/src/app/shared/shared-forms/markdown-textarea.component.html
@@ -2,6 +2,7 @@
2 <textarea #textarea 2 <textarea #textarea
3 [(ngModel)]="content" (ngModelChange)="onModelChange()" 3 [(ngModel)]="content" (ngModelChange)="onModelChange()"
4 class="form-control" [ngClass]="classes" 4 class="form-control" [ngClass]="classes"
5 [attr.disabled]="disabled"
5 [ngStyle]="{ height: textareaHeight }" 6 [ngStyle]="{ height: textareaHeight }"
6 [id]="name" [name]="name"> 7 [id]="name" [name]="name">
7 </textarea> 8 </textarea>
@@ -25,11 +26,11 @@
25 </ng-container> 26 </ng-container>
26 27
27 <my-button 28 <my-button
28 *ngIf="!isMaximized" [title]="maximizeInText" className="maximize-button" icon="fullscreen" (click)="onMaximizeClick()" 29 *ngIf="!isMaximized" [title]="maximizeInText" className="maximize-button" icon="fullscreen" (click)="onMaximizeClick()" [disabled]="disabled"
29 ></my-button> 30 ></my-button>
30 31
31 <my-button 32 <my-button
32 *ngIf="isMaximized" [title]="maximizeOutText" className="maximize-button" icon="exit-fullscreen" (click)="onMaximizeClick()" 33 *ngIf="isMaximized" [title]="maximizeOutText" className="maximize-button" icon="exit-fullscreen" (click)="onMaximizeClick()" [disabled]="disabled"
33 ></my-button> 34 ></my-button>
34 </div> 35 </div>
35 36
diff --git a/client/src/app/shared/shared-forms/markdown-textarea.component.ts b/client/src/app/shared/shared-forms/markdown-textarea.component.ts
index 80ca6690f..dcb5d20da 100644
--- a/client/src/app/shared/shared-forms/markdown-textarea.component.ts
+++ b/client/src/app/shared/shared-forms/markdown-textarea.component.ts
@@ -45,6 +45,7 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit {
45 previewHTML: SafeHtml | string = '' 45 previewHTML: SafeHtml | string = ''
46 46
47 isMaximized = false 47 isMaximized = false
48 disabled = false
48 49
49 maximizeInText = $localize`Maximize editor` 50 maximizeInText = $localize`Maximize editor`
50 maximizeOutText = $localize`Exit maximized editor` 51 maximizeOutText = $localize`Exit maximized editor`
@@ -108,6 +109,10 @@ export class MarkdownTextareaComponent implements ControlValueAccessor, OnInit {
108 } 109 }
109 } 110 }
110 111
112 setDisabledState (isDisabled: boolean) {
113 this.disabled = isDisabled
114 }
115
111 private lockBodyScroll () { 116 private lockBodyScroll () {
112 this.scrollPosition = this.viewportScroller.getScrollPosition() 117 this.scrollPosition = this.viewportScroller.getScrollPosition()
113 document.getElementById('content').classList.add('lock-scroll') 118 document.getElementById('content').classList.add('lock-scroll')
diff --git a/client/src/app/shared/shared-forms/select/select-checkbox.component.html b/client/src/app/shared/shared-forms/select/select-checkbox.component.html
index 7b49a0c01..03db2875b 100644
--- a/client/src/app/shared/shared-forms/select/select-checkbox.component.html
+++ b/client/src/app/shared/shared-forms/select/select-checkbox.component.html
@@ -7,6 +7,7 @@
7 [multiple]="true" 7 [multiple]="true"
8 [searchable]="true" 8 [searchable]="true"
9 [closeOnSelect]="false" 9 [closeOnSelect]="false"
10 [disabled]="disabled"
10 11
11 bindValue="id" 12 bindValue="id"
12 bindLabel="label" 13 bindLabel="label"
diff --git a/client/src/app/shared/shared-forms/select/select-checkbox.component.ts b/client/src/app/shared/shared-forms/select/select-checkbox.component.ts
index 12f697628..c9a500324 100644
--- a/client/src/app/shared/shared-forms/select/select-checkbox.component.ts
+++ b/client/src/app/shared/shared-forms/select/select-checkbox.component.ts
@@ -23,6 +23,8 @@ export class SelectCheckboxComponent implements OnInit, ControlValueAccessor {
23 @Input() selectableGroupAsModel: boolean 23 @Input() selectableGroupAsModel: boolean
24 @Input() placeholder: string 24 @Input() placeholder: string
25 25
26 disabled = false
27
26 ngOnInit () { 28 ngOnInit () {
27 if (!this.placeholder) this.placeholder = $localize`Add a new option` 29 if (!this.placeholder) this.placeholder = $localize`Add a new option`
28 } 30 }
@@ -59,6 +61,10 @@ export class SelectCheckboxComponent implements OnInit, ControlValueAccessor {
59 this.propagateChange(this.selectedItems) 61 this.propagateChange(this.selectedItems)
60 } 62 }
61 63
64 setDisabledState (isDisabled: boolean) {
65 this.disabled = isDisabled
66 }
67
62 compareFn (item: SelectOptionsItem, selected: ItemSelectCheckboxValue) { 68 compareFn (item: SelectOptionsItem, selected: ItemSelectCheckboxValue) {
63 if (typeof selected === 'string' || typeof selected === 'number') { 69 if (typeof selected === 'string' || typeof selected === 'number') {
64 return item.id === selected 70 return item.id === selected
diff --git a/client/src/app/shared/shared-forms/select/select-custom-value.component.html b/client/src/app/shared/shared-forms/select/select-custom-value.component.html
index 9dc8c2ec2..69fdedc10 100644
--- a/client/src/app/shared/shared-forms/select/select-custom-value.component.html
+++ b/client/src/app/shared/shared-forms/select/select-custom-value.component.html
@@ -5,6 +5,7 @@
5 [searchable]="searchable" 5 [searchable]="searchable"
6 [groupBy]="groupBy" 6 [groupBy]="groupBy"
7 [labelForId]="labelForId" 7 [labelForId]="labelForId"
8 [disabled]="disabled"
8 9
9 [(ngModel)]="selectedId" 10 [(ngModel)]="selectedId"
10 (ngModelChange)="onModelChange()" 11 (ngModelChange)="onModelChange()"
diff --git a/client/src/app/shared/shared-forms/select/select-custom-value.component.ts b/client/src/app/shared/shared-forms/select/select-custom-value.component.ts
index bc6b863c7..636bd6101 100644
--- a/client/src/app/shared/shared-forms/select/select-custom-value.component.ts
+++ b/client/src/app/shared/shared-forms/select/select-custom-value.component.ts
@@ -25,6 +25,7 @@ export class SelectCustomValueComponent implements ControlValueAccessor, OnChang
25 25
26 customValue: number | string = '' 26 customValue: number | string = ''
27 selectedId: number | string 27 selectedId: number | string
28 disabled = false
28 29
29 itemsWithCustom: SelectOptionsItem[] = [] 30 itemsWithCustom: SelectOptionsItem[] = []
30 31
@@ -75,4 +76,8 @@ export class SelectCustomValueComponent implements ControlValueAccessor, OnChang
75 isCustomValue () { 76 isCustomValue () {
76 return this.selectedId === 'other' 77 return this.selectedId === 'other'
77 } 78 }
79
80 setDisabledState (isDisabled: boolean) {
81 this.disabled = isDisabled
82 }
78} 83}
diff --git a/client/src/app/shared/shared-forms/select/select-options.component.html b/client/src/app/shared/shared-forms/select/select-options.component.html
index 3b1761255..83c7de9f5 100644
--- a/client/src/app/shared/shared-forms/select/select-options.component.html
+++ b/client/src/app/shared/shared-forms/select/select-options.component.html
@@ -7,6 +7,7 @@
7 [labelForId]="labelForId" 7 [labelForId]="labelForId"
8 [searchable]="searchable" 8 [searchable]="searchable"
9 [searchFn]="searchFn" 9 [searchFn]="searchFn"
10 [disabled]="disabled"
10 11
11 bindLabel="label" 12 bindLabel="label"
12 bindValue="id" 13 bindValue="id"
diff --git a/client/src/app/shared/shared-forms/select/select-options.component.ts b/client/src/app/shared/shared-forms/select/select-options.component.ts
index 8482b9dea..820a82c24 100644
--- a/client/src/app/shared/shared-forms/select/select-options.component.ts
+++ b/client/src/app/shared/shared-forms/select/select-options.component.ts
@@ -23,6 +23,7 @@ export class SelectOptionsComponent implements ControlValueAccessor {
23 @Input() searchFn: any 23 @Input() searchFn: any
24 24
25 selectedId: number | string 25 selectedId: number | string
26 disabled = false
26 27
27 propagateChange = (_: any) => { /* empty */ } 28 propagateChange = (_: any) => { /* empty */ }
28 29
@@ -48,4 +49,8 @@ export class SelectOptionsComponent implements ControlValueAccessor {
48 onModelChange () { 49 onModelChange () {
49 this.propagateChange(this.selectedId) 50 this.propagateChange(this.selectedId)
50 } 51 }
52
53 setDisabledState (isDisabled: boolean) {
54 this.disabled = isDisabled
55 }
51} 56}
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss
index 9f6d69131..679c235a6 100644
--- a/client/src/sass/include/_mixins.scss
+++ b/client/src/sass/include/_mixins.scss
@@ -364,6 +364,9 @@
364 cursor: default; 364 cursor: default;
365 } 365 }
366 } 366 }
367 select[disabled] {
368 background-color: #f9f9f9;
369 }
367 370
368 @media screen and (max-width: $width) { 371 @media screen and (max-width: $width) {
369 width: 100%; 372 width: 100%;