diff options
author | Chocobozzz <me@florianbigard.com> | 2021-02-09 16:35:48 +0100 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2021-02-10 11:36:40 +0100 |
commit | ead64cdf8d917fa0d6a20271e42378f38e5f2407 (patch) | |
tree | 681e9dba853107edab45d8185688dadde4850efb /client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html | |
parent | b9c9fefe820fb0b3aaa3c2b5af73bafb29d890d0 (diff) | |
download | PeerTube-ead64cdf8d917fa0d6a20271e42378f38e5f2407.tar.gz PeerTube-ead64cdf8d917fa0d6a20271e42378f38e5f2407.tar.zst PeerTube-ead64cdf8d917fa0d6a20271e42378f38e5f2407.zip |
Support custom value in ng-select
Diffstat (limited to 'client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html')
-rw-r--r-- | client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html | 61 |
1 files changed, 28 insertions, 33 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 5f0a5ff6c..844620ca2 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 | |||
@@ -445,13 +445,11 @@ | |||
445 | <span i18n>allows to import multiple videos in parallel. ⚠️ Requires a PeerTube restart.</span> | 445 | <span i18n>allows to import multiple videos in parallel. ⚠️ Requires a PeerTube restart.</span> |
446 | </span> | 446 | </span> |
447 | 447 | ||
448 | <div class="peertube-select-container"> | 448 | <div class="number-with-unit"> |
449 | <select id="importConcurrency" formControlName="concurrency" class="form-control"> | 449 | <input type="number" name="importConcurrency" formControlName="concurrency" /> |
450 | <option *ngFor="let option of concurrencyOptions" [value]="option"> | 450 | <span i18n>jobs in parallel</span> |
451 | {{ option }} | ||
452 | </option> | ||
453 | </select> | ||
454 | </div> | 451 | </div> |
452 | |||
455 | <div *ngIf="formErrors.import.concurrency" class="form-error">{{ formErrors.import.concurrency }}</div> | 453 | <div *ngIf="formErrors.import.concurrency" class="form-error">{{ formErrors.import.concurrency }}</div> |
456 | </div> | 454 | </div> |
457 | 455 | ||
@@ -892,13 +890,13 @@ | |||
892 | <ng-container *ngIf="!getTotalTranscodingThreads().atMost" i18n>will claim at least {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with live transcoding</ng-container> | 890 | <ng-container *ngIf="!getTotalTranscodingThreads().atMost" i18n>will claim at least {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with live transcoding</ng-container> |
893 | </span> | 891 | </span> |
894 | 892 | ||
895 | <div class="peertube-select-container"> | 893 | <my-select-custom-value |
896 | <select id="transcodingThreads" formControlName="threads" class="form-control"> | 894 | id="transcodingThreads" |
897 | <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value"> | 895 | [items]="transcodingThreadOptions" |
898 | {{ transcodingThreadOption.label }} {transcodingThreadOption.value, plural, =0 {} =1 {thread} other {threads}} | 896 | formControlName="threads" |
899 | </option> | 897 | [clearable]="false" |
900 | </select> | 898 | ></my-select-custom-value> |
901 | </div> | 899 | |
902 | <div *ngIf="formErrors.transcoding.threads" class="form-error">{{ formErrors.transcoding.threads }}</div> | 900 | <div *ngIf="formErrors.transcoding.threads" class="form-error">{{ formErrors.transcoding.threads }}</div> |
903 | </div> | 901 | </div> |
904 | 902 | ||
@@ -908,13 +906,11 @@ | |||
908 | <span i18n>allows to transcode multiple files in parallel. ⚠️ Requires a PeerTube restart.</span> | 906 | <span i18n>allows to transcode multiple files in parallel. ⚠️ Requires a PeerTube restart.</span> |
909 | </span> | 907 | </span> |
910 | 908 | ||
911 | <div class="peertube-select-container"> | 909 | <div class="number-with-unit"> |
912 | <select id="transcodingConcurrency" formControlName="concurrency" class="form-control"> | 910 | <input type="number" name="transcodingConcurrency" formControlName="concurrency" /> |
913 | <option *ngFor="let option of concurrencyOptions" [value]="option"> | 911 | <span i18n>jobs in parallel</span> |
914 | {{ option }} | ||
915 | </option> | ||
916 | </select> | ||
917 | </div> | 912 | </div> |
913 | |||
918 | <div *ngIf="formErrors.transcoding.concurrency" class="form-error">{{ formErrors.transcoding.concurrency }}</div> | 914 | <div *ngIf="formErrors.transcoding.concurrency" class="form-error">{{ formErrors.transcoding.concurrency }}</div> |
919 | </div> | 915 | </div> |
920 | 916 | ||
@@ -922,7 +918,7 @@ | |||
922 | <label i18n for="transcodingProfile">Transcoding profile</label> | 918 | <label i18n for="transcodingProfile">Transcoding profile</label> |
923 | <span class="text-muted ml-1" i18n>new transcoding profiles can be added by PeerTube plugins</span> | 919 | <span class="text-muted ml-1" i18n>new transcoding profiles can be added by PeerTube plugins</span> |
924 | 920 | ||
925 | <ng-select | 921 | <my-select-options |
926 | id="transcodingProfile" | 922 | id="transcodingProfile" |
927 | formControlName="profile" | 923 | formControlName="profile" |
928 | [items]="getAvailableTranscodingProfile('vod')" | 924 | [items]="getAvailableTranscodingProfile('vod')" |
@@ -935,7 +931,7 @@ | |||
935 | <span class="text-muted" i18n>x264, targeting maximum device compatibility</span> | 931 | <span class="text-muted" i18n>x264, targeting maximum device compatibility</span> |
936 | </ng-container> | 932 | </ng-container> |
937 | </ng-template> | 933 | </ng-template> |
938 | </ng-select> | 934 | </my-select-options> |
939 | <div *ngIf="formErrors.transcoding.profile" class="form-error">{{ formErrors.transcoding.profile }}</div> | 935 | <div *ngIf="formErrors.transcoding.profile" class="form-error">{{ formErrors.transcoding.profile }}</div> |
940 | </div> | 936 | </div> |
941 | 937 | ||
@@ -1007,10 +1003,10 @@ | |||
1007 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | 1003 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> |
1008 | <label i18n for="liveMaxDuration">Max live duration</label> | 1004 | <label i18n for="liveMaxDuration">Max live duration</label> |
1009 | 1005 | ||
1010 | <ng-select | 1006 | <my-select-options |
1011 | labelForId="liveMaxDuration" [items]="liveMaxDurationOptions" formControlName="maxDuration" | 1007 | labelForId="liveMaxDuration" [items]="liveMaxDurationOptions" formControlName="maxDuration" |
1012 | bindLabel="label" bindValue="value" [clearable]="false" [searchable]="false" | 1008 | bindLabel="label" bindValue="value" [clearable]="false" [searchable]="true" |
1013 | ></ng-select> | 1009 | ></my-select-options> |
1014 | </div> | 1010 | </div> |
1015 | 1011 | ||
1016 | </ng-container> | 1012 | </ng-container> |
@@ -1069,13 +1065,12 @@ | |||
1069 | <ng-container *ngIf="!getTotalTranscodingThreads().atMost" i18n>will claim at least {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with VOD transcoding</ng-container> | 1065 | <ng-container *ngIf="!getTotalTranscodingThreads().atMost" i18n>will claim at least {{ getTotalTranscodingThreads().value }} {{ getTotalTranscodingThreads().unit }} with VOD transcoding</ng-container> |
1070 | </span> | 1066 | </span> |
1071 | 1067 | ||
1072 | <div class="peertube-select-container"> | 1068 | <my-select-custom-value |
1073 | <select id="liveTranscodingThreads" formControlName="threads" class="form-control"> | 1069 | id="liveTranscodingThreads" |
1074 | <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value"> | 1070 | [items]="transcodingThreadOptions" |
1075 | {{ transcodingThreadOption.label }} {transcodingThreadOption.value, plural, =0 {} =1 {thread} other {threads}} | 1071 | formControlName="threads" |
1076 | </option> | 1072 | [clearable]="false" |
1077 | </select> | 1073 | ></my-select-custom-value> |
1078 | </div> | ||
1079 | <div *ngIf="formErrors.live.transcoding.threads" class="form-error">{{ formErrors.live.transcoding.threads }}</div> | 1074 | <div *ngIf="formErrors.live.transcoding.threads" class="form-error">{{ formErrors.live.transcoding.threads }}</div> |
1080 | </div> | 1075 | </div> |
1081 | 1076 | ||
@@ -1083,7 +1078,7 @@ | |||
1083 | <label i18n for="liveTranscodingProfile">Live transcoding profile</label> | 1078 | <label i18n for="liveTranscodingProfile">Live transcoding profile</label> |
1084 | <span class="text-muted ml-1" i18n>new live transcoding profiles can be added by PeerTube plugins</span> | 1079 | <span class="text-muted ml-1" i18n>new live transcoding profiles can be added by PeerTube plugins</span> |
1085 | 1080 | ||
1086 | <ng-select | 1081 | <my-select-options |
1087 | id="liveTranscodingProfile" | 1082 | id="liveTranscodingProfile" |
1088 | formControlName="profile" | 1083 | formControlName="profile" |
1089 | [items]="getAvailableTranscodingProfile('live')" | 1084 | [items]="getAvailableTranscodingProfile('live')" |
@@ -1096,7 +1091,7 @@ | |||
1096 | <span class="text-muted" i18n>x264, targeting maximum device compatibility</span> | 1091 | <span class="text-muted" i18n>x264, targeting maximum device compatibility</span> |
1097 | </ng-container> | 1092 | </ng-container> |
1098 | </ng-template> | 1093 | </ng-template> |
1099 | </ng-select> | 1094 | </my-select-options> |
1100 | <div *ngIf="formErrors.live.transcoding.profile" class="form-error">{{ formErrors.live.transcoding.profile }}</div> | 1095 | <div *ngIf="formErrors.live.transcoding.profile" class="form-error">{{ formErrors.live.transcoding.profile }}</div> |
1101 | </div> | 1096 | </div> |
1102 | 1097 | ||