<ng-container [formGroup]="form">
- <div class="form-row mt-5"> <!-- appearance grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-5"> <!-- appearance grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">APPEARANCE</div>
<div i18n class="inner-form-description">
Use <a routerLink="/admin/plugins">plugins & themes</a> for more involved changes, or <a routerLink="/admin/config/edit-custom" fragment="advanced-configuration">add slight customizations</a>.
</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<ng-container formGroupName="theme">
<div class="form-group">
<div class="form-group" formGroupName="instance">
<label i18n for="instanceDefaultClientRoute">Landing page</label>
- <div class="peertube-select-container">
- <select id="instanceDefaultClientRoute" formControlName="defaultClientRoute" class="form-control">
- <option i18n value="/videos/overview">Discover videos</option>
-
- <optgroup i18n-label label="Trending pages">
- <option i18n value="/videos/trending">Default trending page</option>
- <option i18n value="/videos/trending?alg=best" [disabled]="!doesTrendingVideosAlgorithmsEnabledInclude('best')">Best videos</option>
- <option i18n value="/videos/trending?alg=hot" [disabled]="!doesTrendingVideosAlgorithmsEnabledInclude('hot')">Hot videos</option>
- <option i18n value="/videos/trending?alg=most-viewed" [disabled]="!doesTrendingVideosAlgorithmsEnabledInclude('most-viewed')">Most viewed videos</option>
- <option i18n value="/videos/trending?alg=most-liked" [disabled]="!doesTrendingVideosAlgorithmsEnabledInclude('most-liked')">Most liked videos</option>
- </optgroup>
-
- <option i18n value="/videos/recently-added">Recently added videos</option>
- <option i18n value="/videos/local">Local videos</option>
- </select>
- </div>
+
+ <my-select-custom-value
+ id="instanceDefaultClientRoute"
+ [items]="defaultLandingPageOptions"
+ formControlName="defaultClientRoute"
+ inputType="text"
+ [clearable]="false"
+ ></my-select-custom-value>
+
<div *ngIf="formErrors.instance.defaultClientRoute" class="form-error">{{ formErrors.instance.defaultClientRoute }}</div>
</div>
<ng-container formGroupName="videos">
<ng-container formGroupName="algorithms">
<label i18n for="trendingVideosAlgorithmsDefault">Default trending page</label>
+
<div class="peertube-select-container">
<select id="trendingVideosAlgorithmsDefault" formControlName="default" class="form-control">
- <option i18n value="best">Best videos</option>
<option i18n value="hot">Hot videos</option>
<option i18n value="most-viewed">Most viewed videos</option>
<option i18n value="most-liked">Most liked videos</option>
</select>
</div>
+
<div *ngIf="formErrors.trending.videos.algorithms.default" class="form-error">{{ formErrors.trending.videos.algorithms.default }}</div>
</ng-container>
</ng-container>
</div>
+ <ng-container formGroupName="client">
+
+ <ng-container formGroupName="videos">
+ <ng-container formGroupName="miniature">
+ <div class="form-group">
+ <my-peertube-checkbox
+ inputName="clientVideosMiniaturePreferAuthorDisplayName" formControlName="preferAuthorDisplayName"
+ i18n-labelText labelText="Prefer author display name in video miniature"
+ ></my-peertube-checkbox>
+ </div>
+ </ng-container>
+ </ng-container>
+
+ <ng-container formGroupName="menu">
+ <ng-container formGroupName="login">
+ <div class="form-group">
+ <my-peertube-checkbox
+ inputName="clientMenuLoginRedirectOnSingleExternalAuth" formControlName="redirectOnSingleExternalAuth"
+ i18n-labelText labelText="Redirect users on single external auth when users click on the login button in menu"
+ >
+ <ng-container ngProjectAs="description">
+ <span *ngIf="countExternalAuth() === 0" i18n>⚠️ You don't have any external auth plugin enabled.</span>
+ <span *ngIf="countExternalAuth() > 1" i18n>⚠️ You have multiple external auth plugins enabled.</span>
+ </ng-container>
+ </my-peertube-checkbox>
+ </div>
+ </ng-container>
+ </ng-container>
+ </ng-container>
+
</div>
</div>
- <div class="form-row mt-4"> <!-- broadcast grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-4"> <!-- broadcast grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">BROADCAST MESSAGE</div>
<div i18n class="inner-for-description">
Display a message on your instance
</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<ng-container formGroupName="broadcastMessage">
<div class="form-group">
<label i18n for="broadcastMessageLevel">Broadcast message level</label>
+
<div class="peertube-select-container">
<select id="broadcastMessageLevel" formControlName="level" class="form-control">
<option value="info">info</option>
<option value="error">error</option>
</select>
</div>
+
<div *ngIf="formErrors.broadcastMessage.level" class="form-error">{{ formErrors.broadcastMessage.level }}</div>
</div>
<div class="form-group">
<label i18n for="broadcastMessageMessage">Message</label><my-help helpType="markdownText"></my-help>
+
<my-markdown-textarea
name="broadcastMessageMessage" formControlName="message" textareaMaxWidth="500px"
[classes]="{ 'input-error': formErrors['broadcastMessage.message'] }"
></my-markdown-textarea>
+
<div *ngIf="formErrors.broadcastMessage.message" class="form-error">{{ formErrors.broadcastMessage.message }}</div>
</div>
</div>
</div>
- <div class="form-row mt-4"> <!-- new users grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-4"> <!-- new users grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">NEW USERS</div>
<div i18n class="inner-for-description">
Manage <a routerLink="/admin/users">users</a> to set their quota individually.
</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<ng-container formGroupName="signup">
<div class="form-group">
<ng-container ngProjectAs="description">
<span i18n>⚠️ This functionality requires a lot of attention and extra moderation.</span>
- <div class="alert alert-info alert-signup" *ngIf="signupAlertMessage">{{ signupAlertMessage }}</div>
+ <div class="alert pt-alert-primary alert-signup" *ngIf="signupAlertMessage">{{ signupAlertMessage }}</div>
</ng-container>
<ng-container ngProjectAs="extra">
- <my-peertube-checkbox [ngClass]="{ 'disabled-checkbox-extra': !isSignupEnabled() }"
+ <my-peertube-checkbox [ngClass]="getDisabledSignupClass()"
inputName="signupRequiresEmailVerification" formControlName="requiresEmailVerification"
i18n-labelText labelText="Signup requires email verification"
></my-peertube-checkbox>
- <div [ngClass]="{ 'disabled-checkbox-extra': !isSignupEnabled() }" class="mt-3">
+ <div [ngClass]="getDisabledSignupClass()" class="mt-3">
<label i18n for="signupLimit">Signup limit</label>
+
<div class="number-with-unit">
<input
type="number" min="-1" id="signupLimit" class="form-control"
>
<span i18n>{form.value['signup']['limit'], plural, =1 {user} other {users}}</span>
</div>
+
<div *ngIf="formErrors.signup.limit" class="form-error">{{ formErrors.signup.limit }}</div>
- <small *ngIf="form.value['signup']['limit'] === -1" class="text-muted">Signup won't be limited to a fixed number of users.</small>
+
+ <small i18n *ngIf="hasUnlimitedSignup()" class="muted">Signup won't be limited to a fixed number of users.</small>
+ </div>
+
+ <div [ngClass]="getDisabledSignupClass()" class="mt-3">
+ <label i18n for="signupMinimumAge">Minimum required age to create an account</label>
+
+ <div class="number-with-unit">
+ <input
+ type="number" min="1" id="signupMinimumAge" class="form-control"
+ formControlName="minimumAge" [ngClass]="{ 'input-error': formErrors['signup.minimumAge'] }"
+ >
+ <span i18n>{form.value['signup']['minimumAge'], plural, =1 {year old} other {years old}}</span>
+ </div>
+
+ <div *ngIf="formErrors.signup.minimumAge" class="form-error">{{ formErrors.signup.minimumAge }}</div>
</div>
</ng-container>
</my-peertube-checkbox>
</div>
</div>
- <div class="form-row mt-4"> <!-- videos grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-4"> <!-- videos grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">VIDEOS</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<ng-container formGroupName="import">
<ng-container formGroupName="videos">
- <div class="form-group mt-4">
+ <div class="form-group">
<label i18n for="importConcurrency">Import jobs concurrency</label>
- <span class="text-muted ml-1">
- <span i18n>allows to import multiple videos in parallel. ⚠️ Requires a PeerTube restart.</span>
- </span>
+ <span i18n class="muted ms-1">allows to import multiple videos in parallel. ⚠️ Requires a PeerTube restart.</span>
<div class="number-with-unit">
<input type="number" name="importConcurrency" formControlName="concurrency" />
<my-peertube-checkbox
inputName="importVideosHttpEnabled" formControlName="enabled"
i18n-labelText labelText="Allow import with HTTP URL (e.g. YouTube)"
- ></my-peertube-checkbox>
+ >
+ <ng-container ngProjectAs="description">
+ <span i18n>⚠️ If enabled, we recommend to use <a href="https://docs.joinpeertube.org/maintain-configuration?id=security">a HTTP proxy</a> to prevent private URL access from your PeerTube server</span>
+ </ng-container>
+ </my-peertube-checkbox>
</div>
<div class="form-group" formGroupName="torrent">
<my-peertube-checkbox
inputName="importVideosTorrentEnabled" formControlName="enabled"
i18n-labelText labelText="Allow import with a torrent file or a magnet URI"
- ></my-peertube-checkbox>
+ >
+ <ng-container ngProjectAs="description">
+ <span i18n>⚠️ We don't recommend to enable this feature if you don't trust your users</span>
+ </ng-container>
+ </my-peertube-checkbox>
</div>
</ng-container>
</div>
</div>
- <div class="form-row mt-4"> <!-- search grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-4"> <!-- video channels grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
+ <div i18n class="inner-form-title">VIDEO CHANNELS</div>
+ </div>
+
+ <div class="col-12 col-lg-8 col-xl-9">
+ <div class="form-group" formGroupName="videoChannels">
+ <label i18n for="videoChannelsMaxPerUser">Max video channels per user</label>
+
+ <div class="number-with-unit">
+ <input
+ type="number" min="1" id="videoChannelsMaxPerUser" class="form-control"
+ formControlName="maxPerUser" [ngClass]="{ 'input-error': formErrors['videoChannels.maxPerUser'] }"
+ >
+ <span i18n>{form.value['videoChannels']['maxPerUser'], plural, =1 {channel} other {channels}}</span>
+ </div>
+
+ <div *ngIf="formErrors.videoChannels.maxPerUser" class="form-error">{{ formErrors.videoChannels.maxPerUser }}</div>
+ </div>
+ </div>
+ </div>
+
+ <div class="row mt-4"> <!-- search grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">SEARCH</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<ng-container formGroupName="search">
<ng-container formGroupName="remoteUri">
</ng-container>
<ng-container ngProjectAs="extra">
- <div [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }">
+ <div [ngClass]="getDisabledSearchIndexClass()">
<label i18n for="searchIndexUrl">Search index URL</label>
+
<input
type="text" id="searchIndexUrl" class="form-control"
formControlName="url" [ngClass]="{ 'input-error': formErrors['search.searchIndex.url'] }"
>
+
<div *ngIf="formErrors.search.searchIndex.url" class="form-error">{{ formErrors.search.searchIndex.url }}</div>
</div>
<div class="mt-3">
- <my-peertube-checkbox [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }"
+ <my-peertube-checkbox [ngClass]="getDisabledSearchIndexClass()"
inputName="searchIndexDisableLocalSearch" formControlName="disableLocalSearch"
i18n-labelText labelText="Disable local search in search bar"
></my-peertube-checkbox>
</div>
<div class="mt-3">
- <my-peertube-checkbox [ngClass]="{ 'disabled-checkbox-extra': !isSearchIndexEnabled() }"
+ <my-peertube-checkbox [ngClass]="getDisabledSearchIndexClass()"
inputName="searchIndexIsDefaultSearch" formControlName="isDefaultSearch"
i18n-labelText labelText="Search bar uses the global search index by default"
>
</div>
</div>
- <div class="form-row mt-4"> <!-- federation grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-4"> <!-- federation grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">FEDERATION</div>
<div i18n class="inner-form-description">
Manage <a routerLink="/admin/follows">relations</a> with other instances.
</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<ng-container formGroupName="followers">
<ng-container formGroupName="instance">
<p i18n>⚠️ This functionality requires a lot of attention and extra moderation.</p>
<span i18n>
- You should only follow moderated indexes in production, or <a href="https://framagit.org/framasoft/peertube/instances-peertube#peertube-auto-follow">host your own</a>.
+ See <a href="https://docs.joinpeertube.org/admin-following-instances?id=automatically-follow-other-instances" rel="noopener noreferrer" target="_blank">the documentation</a> for more information about the expected URL
</span>
</ng-container>
</div>
</div>
- <div class="form-row mt-4"> <!-- administrators grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-4"> <!-- administrators grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">ADMINISTRATORS</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<div class="form-group" formGroupName="admin">
<label i18n for="adminEmail">Admin email</label>
+
<input
type="text" id="adminEmail" class="form-control"
formControlName="email" [ngClass]="{ 'input-error': formErrors['admin.email'] }"
>
+
<div *ngIf="formErrors.admin.email" class="form-error">{{ formErrors.admin.email }}</div>
</div>
</div>
</div>
- <div class="form-row mt-4"> <!-- Twitter grid -->
- <div class="form-group col-12 col-lg-4 col-xl-3">
+ <div class="row mt-4"> <!-- Twitter grid -->
+ <div class="col-12 col-lg-4 col-xl-3">
<div i18n class="inner-form-title">TWITTER</div>
<div i18n class="inner-form-description">
Provide the Twitter account representing your instance to improve link previews.
</div>
</div>
- <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
+ <div class="col-12 col-lg-8 col-xl-9">
<ng-container formGroupName="services">
<ng-container formGroupName="twitter">
<div class="form-group">
- <label i18n for="signupLimit">Your Twitter username</label>
+ <label for="servicesTwitterUsername" i18n>Your Twitter username</label>
<input
type="text" id="servicesTwitterUsername" class="form-control"
formControlName="username" [ngClass]="{ 'input-error': formErrors['services.twitter.username'] }"
>
+
<div *ngIf="formErrors.services.twitter.username" class="form-error">{{ formErrors.services.twitter.username }}</div>
</div>
<ng-container i18n>
If your instance is explicitly allowed by Twitter, a video player will be embedded in the Twitter feed on PeerTube video share.<br />
If the instance is not, we use an image link card that will redirect to your PeerTube instance.<br /><br />
- Check this checkbox, save the configuration and test with a video URL of your instance (https://example.com/videos/watch/blabla) on
+ Check this checkbox, save the configuration and test with a video URL of your instance (https://example.com/w/blabla) on
<a target='_blank' rel='noopener noreferrer' href='https://cards-dev.twitter.com/validator'>https://cards-dev.twitter.com/validator</a>
to see if you instance is allowed.
</ng-container>
projects / github / Chocobozzz / PeerTube.git / blobdiff