diff options
author | Chocobozzz <me@florianbigard.com> | 2020-11-26 15:09:57 +0100 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2020-11-26 15:09:57 +0100 |
commit | 7fd03a2c8f9d342927db8fcfa84c96e14a7740a2 (patch) | |
tree | 28b43a8f2bb6019992795a22b47c19aa15ee1026 /client | |
parent | ce4a50b99b6aa9f0a6c4ff1023b36bd47ebe8f71 (diff) | |
download | PeerTube-7fd03a2c8f9d342927db8fcfa84c96e14a7740a2.tar.gz PeerTube-7fd03a2c8f9d342927db8fcfa84c96e14a7740a2.tar.zst PeerTube-7fd03a2c8f9d342927db8fcfa84c96e14a7740a2.zip |
Create a dedicated transcoding tab in admin config
Diffstat (limited to 'client')
-rw-r--r-- | client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html | 268 |
1 files changed, 133 insertions, 135 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 e73a9f8a8..0927523f1 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 | |||
@@ -647,15 +647,7 @@ | |||
647 | </div> | 647 | </div> |
648 | </div> | 648 | </div> |
649 | 649 | ||
650 | </ng-template> | 650 | <div class="form-row mt-4"> <!-- Twitter grid --> |
651 | </ng-container> | ||
652 | |||
653 | <ng-container ngbNavItem="services"> | ||
654 | <a ngbNavLink i18n>Services</a> | ||
655 | |||
656 | <ng-template ngbNavContent> | ||
657 | |||
658 | <div class="form-row mt-5"> <!-- twitter grid --> | ||
659 | <div class="form-group col-12 col-lg-4 col-xl-3"> | 651 | <div class="form-group col-12 col-lg-4 col-xl-3"> |
660 | <div i18n class="inner-form-title">TWITTER</div> | 652 | <div i18n class="inner-form-title">TWITTER</div> |
661 | <div i18n class="inner-form-description"> | 653 | <div i18n class="inner-form-description"> |
@@ -704,130 +696,8 @@ | |||
704 | </ng-template> | 696 | </ng-template> |
705 | </ng-container> | 697 | </ng-container> |
706 | 698 | ||
707 | <div ngbNavItem="live"> | 699 | <ng-container ngbNavItem="transcoding"> |
708 | <a ngbNavLink i18n>Live streaming</a> | 700 | <a ngbNavLink i18n>Transcoding</a> |
709 | |||
710 | <ng-template ngbNavContent> | ||
711 | |||
712 | <div class="form-row mt-5"> | ||
713 | <div class="form-group col-12 col-lg-4 col-xl-3"> | ||
714 | <div i18n class="inner-form-title">LIVE</div> | ||
715 | <div i18n class="inner-form-description"> | ||
716 | Enable users of your instance to stream live. | ||
717 | </div> | ||
718 | </div> | ||
719 | |||
720 | <div class="form-group form-group-right col-12 col-lg-8 col-xl-9"> | ||
721 | |||
722 | <ng-container formGroupName="live"> | ||
723 | |||
724 | <div class="form-group"> | ||
725 | <my-peertube-checkbox inputName="liveEnabled" formControlName="enabled"> | ||
726 | <ng-template ptTemplate="label"> | ||
727 | <ng-container i18n>Allow live streaming</ng-container> | ||
728 | </ng-template> | ||
729 | |||
730 | <ng-container ngProjectAs="description" i18n> | ||
731 | ⚠️ Enabling live streaming requires trust in your users and extra moderation work | ||
732 | </ng-container> | ||
733 | |||
734 | <ng-container ngProjectAs="extra"> | ||
735 | |||
736 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
737 | <my-peertube-checkbox | ||
738 | inputName="liveAllowReplay" formControlName="allowReplay" | ||
739 | i18n-labelText labelText="Allow your users to automatically publish a replay of their live" | ||
740 | > | ||
741 | <ng-container ngProjectAs="description" i18n> | ||
742 | If the user quota is reached, PeerTube will automatically terminate the live streaming | ||
743 | </ng-container> | ||
744 | </my-peertube-checkbox> | ||
745 | </div> | ||
746 | |||
747 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
748 | <label i18n for="liveMaxInstanceLives">Max lives created on your instance (-1 for "unlimited")</label> | ||
749 | <div class="number-with-unit"> | ||
750 | <input type="number" name="liveMaxInstanceLives" formControlName="maxInstanceLives" /> | ||
751 | <span i18n>{form.value['live']['maxInstanceLives'], plural, =1 {live} other {lives}}</span> | ||
752 | </div> | ||
753 | </div> | ||
754 | |||
755 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
756 | <label i18n for="liveMaxUserLives">Max lives created per user (-1 for "unlimited")</label> | ||
757 | <div class="number-with-unit"> | ||
758 | <input type="number" name="liveMaxUserLives" formControlName="maxUserLives" /> | ||
759 | <span i18n>{form.value['live']['maxUserLives'], plural, =1 {live} other {lives}}</span> | ||
760 | </div> | ||
761 | </div> | ||
762 | |||
763 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
764 | <label i18n for="liveMaxDuration">Max live duration</label> | ||
765 | <div class="peertube-select-container"> | ||
766 | <ng-select | ||
767 | labelForId="liveMaxDuration" [items]="liveMaxDurationOptions" formControlName="maxDuration" | ||
768 | bindLabel="label" bindValue="value" | ||
769 | [clearable]="false" | ||
770 | [searchable]="false" | ||
771 | ></ng-select> | ||
772 | </div> | ||
773 | </div> | ||
774 | |||
775 | <ng-container formGroupName="transcoding"> | ||
776 | |||
777 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
778 | <my-peertube-checkbox | ||
779 | inputName="liveTranscodingEnabled" formControlName="enabled" | ||
780 | i18n-labelText labelText="Enable live transcoding" | ||
781 | > | ||
782 | <ng-container ngProjectAs="description" i18n> | ||
783 | Requires a lot of CPU! | ||
784 | </ng-container> | ||
785 | </my-peertube-checkbox> | ||
786 | </div> | ||
787 | |||
788 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() || !isLiveTranscodingEnabled() }"> | ||
789 | <label i18n for="liveTranscodingThreads">Live transcoding threads</label> | ||
790 | <div class="peertube-select-container"> | ||
791 | <select id="liveTranscodingThreads" formControlName="threads" class="form-control"> | ||
792 | <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value"> | ||
793 | {{ transcodingThreadOption.label }} {transcodingThreadOption.value, plural, =0 {} =1 {thread} other {threads}} | ||
794 | </option> | ||
795 | </select> | ||
796 | </div> | ||
797 | <div *ngIf="formErrors.live.transcoding.threads" class="form-error">{{ formErrors.live.transcoding.threads }}</div> | ||
798 | </div> | ||
799 | |||
800 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() || !isLiveTranscodingEnabled() }"> | ||
801 | <label i18n for="liveTranscodingThreads">Live resolutions to generate</label> | ||
802 | |||
803 | <div class="ml-2 mt-2 d-flex flex-column"> | ||
804 | <ng-container formGroupName="resolutions"> | ||
805 | <div class="form-group" *ngFor="let resolution of liveResolutions"> | ||
806 | <my-peertube-checkbox | ||
807 | [inputName]="getResolutionKey(resolution.id)" [formControlName]="resolution.id" | ||
808 | labelText="{{resolution.label}}" | ||
809 | > | ||
810 | <ng-template *ngIf="resolution.description" ptTemplate="help"> | ||
811 | <div [innerHTML]="resolution.description"></div> | ||
812 | </ng-template> | ||
813 | </my-peertube-checkbox> | ||
814 | </div> | ||
815 | </ng-container> | ||
816 | </div> | ||
817 | </div> | ||
818 | </ng-container> | ||
819 | </ng-container> | ||
820 | </my-peertube-checkbox> | ||
821 | </div> | ||
822 | </ng-container> | ||
823 | </div> | ||
824 | </div> | ||
825 | |||
826 | </ng-template> | ||
827 | </div> | ||
828 | |||
829 | <ng-container ngbNavItem="advanced-configuration"> | ||
830 | <a ngbNavLink i18n>Advanced configuration</a> | ||
831 | 701 | ||
832 | <ng-template ngbNavContent> | 702 | <ng-template ngbNavContent> |
833 | 703 | ||
@@ -886,8 +756,6 @@ | |||
886 | > | 756 | > |
887 | <ng-template ptTemplate="help"> | 757 | <ng-template ptTemplate="help"> |
888 | <ng-container i18n> | 758 | <ng-container i18n> |
889 | <strong>Experimental, we suggest you to not disable webtorrent support for now</strong> | ||
890 | |||
891 | <p>If you also enabled HLS support, it will multiply videos storage by 2</p> | 759 | <p>If you also enabled HLS support, it will multiply videos storage by 2</p> |
892 | 760 | ||
893 | <br /> | 761 | <br /> |
@@ -965,6 +833,136 @@ | |||
965 | </div> | 833 | </div> |
966 | </div> | 834 | </div> |
967 | 835 | ||
836 | </ng-template> | ||
837 | </ng-container> | ||
838 | |||
839 | <ng-container ngbNavItem="live"> | ||
840 | <a ngbNavLink i18n>Live streaming</a> | ||
841 | |||
842 | <ng-template ngbNavContent> | ||
843 | |||
844 | <div class="form-row mt-5"> | ||
845 | <div class="form-group col-12 col-lg-4 col-xl-3"> | ||
846 | <div i18n class="inner-form-title">LIVE</div> | ||
847 | <div i18n class="inner-form-description"> | ||
848 | Enable users of your instance to stream live. | ||
849 | </div> | ||
850 | </div> | ||
851 | |||
852 | <div class="form-group form-group-right col-12 col-lg-8 col-xl-9"> | ||
853 | |||
854 | <ng-container formGroupName="live"> | ||
855 | |||
856 | <div class="form-group"> | ||
857 | <my-peertube-checkbox inputName="liveEnabled" formControlName="enabled"> | ||
858 | <ng-template ptTemplate="label"> | ||
859 | <ng-container i18n>Allow live streaming</ng-container> | ||
860 | </ng-template> | ||
861 | |||
862 | <ng-container ngProjectAs="description" i18n> | ||
863 | ⚠️ Enabling live streaming requires trust in your users and extra moderation work | ||
864 | </ng-container> | ||
865 | |||
866 | <ng-container ngProjectAs="extra"> | ||
867 | |||
868 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
869 | <my-peertube-checkbox | ||
870 | inputName="liveAllowReplay" formControlName="allowReplay" | ||
871 | i18n-labelText labelText="Allow your users to automatically publish a replay of their live" | ||
872 | > | ||
873 | <ng-container ngProjectAs="description" i18n> | ||
874 | If the user quota is reached, PeerTube will automatically terminate the live streaming | ||
875 | </ng-container> | ||
876 | </my-peertube-checkbox> | ||
877 | </div> | ||
878 | |||
879 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
880 | <label i18n for="liveMaxInstanceLives">Max lives created on your instance (-1 for "unlimited")</label> | ||
881 | <div class="number-with-unit"> | ||
882 | <input type="number" name="liveMaxInstanceLives" formControlName="maxInstanceLives" /> | ||
883 | <span i18n>{form.value['live']['maxInstanceLives'], plural, =1 {live} other {lives}}</span> | ||
884 | </div> | ||
885 | </div> | ||
886 | |||
887 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
888 | <label i18n for="liveMaxUserLives">Max lives created per user (-1 for "unlimited")</label> | ||
889 | <div class="number-with-unit"> | ||
890 | <input type="number" name="liveMaxUserLives" formControlName="maxUserLives" /> | ||
891 | <span i18n>{form.value['live']['maxUserLives'], plural, =1 {live} other {lives}}</span> | ||
892 | </div> | ||
893 | </div> | ||
894 | |||
895 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
896 | <label i18n for="liveMaxDuration">Max live duration</label> | ||
897 | <div class="peertube-select-container"> | ||
898 | <ng-select | ||
899 | labelForId="liveMaxDuration" [items]="liveMaxDurationOptions" formControlName="maxDuration" | ||
900 | bindLabel="label" bindValue="value" | ||
901 | [clearable]="false" | ||
902 | [searchable]="false" | ||
903 | ></ng-select> | ||
904 | </div> | ||
905 | </div> | ||
906 | |||
907 | <ng-container formGroupName="transcoding"> | ||
908 | |||
909 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> | ||
910 | <my-peertube-checkbox | ||
911 | inputName="liveTranscodingEnabled" formControlName="enabled" | ||
912 | i18n-labelText labelText="Enable live transcoding" | ||
913 | > | ||
914 | <ng-container ngProjectAs="description" i18n> | ||
915 | Requires a lot of CPU! | ||
916 | </ng-container> | ||
917 | </my-peertube-checkbox> | ||
918 | </div> | ||
919 | |||
920 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() || !isLiveTranscodingEnabled() }"> | ||
921 | <label i18n for="liveTranscodingThreads">Live transcoding threads</label> | ||
922 | <div class="peertube-select-container"> | ||
923 | <select id="liveTranscodingThreads" formControlName="threads" class="form-control"> | ||
924 | <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value"> | ||
925 | {{ transcodingThreadOption.label }} {transcodingThreadOption.value, plural, =0 {} =1 {thread} other {threads}} | ||
926 | </option> | ||
927 | </select> | ||
928 | </div> | ||
929 | <div *ngIf="formErrors.live.transcoding.threads" class="form-error">{{ formErrors.live.transcoding.threads }}</div> | ||
930 | </div> | ||
931 | |||
932 | <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() || !isLiveTranscodingEnabled() }"> | ||
933 | <label i18n for="liveTranscodingThreads">Live resolutions to generate</label> | ||
934 | |||
935 | <div class="ml-2 mt-2 d-flex flex-column"> | ||
936 | <ng-container formGroupName="resolutions"> | ||
937 | <div class="form-group" *ngFor="let resolution of liveResolutions"> | ||
938 | <my-peertube-checkbox | ||
939 | [inputName]="getResolutionKey(resolution.id)" [formControlName]="resolution.id" | ||
940 | labelText="{{resolution.label}}" | ||
941 | > | ||
942 | <ng-template *ngIf="resolution.description" ptTemplate="help"> | ||
943 | <div [innerHTML]="resolution.description"></div> | ||
944 | </ng-template> | ||
945 | </my-peertube-checkbox> | ||
946 | </div> | ||
947 | </ng-container> | ||
948 | </div> | ||
949 | </div> | ||
950 | </ng-container> | ||
951 | </ng-container> | ||
952 | </my-peertube-checkbox> | ||
953 | </div> | ||
954 | </ng-container> | ||
955 | </div> | ||
956 | </div> | ||
957 | |||
958 | </ng-template> | ||
959 | </ng-container> | ||
960 | |||
961 | <ng-container ngbNavItem="advanced-configuration"> | ||
962 | <a ngbNavLink i18n>Advanced configuration</a> | ||
963 | |||
964 | <ng-template ngbNavContent> | ||
965 | |||
968 | <div class="form-row mt-4"> <!-- cache grid --> | 966 | <div class="form-row mt-4"> <!-- cache grid --> |
969 | <div class="form-group col-12 col-lg-4 col-xl-3"> | 967 | <div class="form-group col-12 col-lg-4 col-xl-3"> |
970 | <div i18n class="inner-form-title">CACHE</div> | 968 | <div i18n class="inner-form-title">CACHE</div> |