2023-10-12 13:01:17 +00:00
< h1 class = "title-page-v2" >
2022-06-15 12:29:28 +00:00
< strong class = "underline-orange" > {{ instanceName }}< / strong >
2023-10-12 13:01:17 +00:00
2023-11-06 10:20:23 +00:00
>
2023-10-12 13:01:17 +00:00
< ng-container i18n > Login< / ng-container >
2022-06-15 12:29:28 +00:00
< / h1 >
2016-06-04 11:31:23 +00:00
2022-06-15 12:29:28 +00:00
< div class = "margin-content" >
2020-04-30 13:03:09 +00:00
< ng-container * ngIf = "!externalAuthError && !isAuthenticatedWithExternalAuth" >
2022-06-15 12:29:28 +00:00
< div class = "alert pt-alert-primary" role = "alert" >
< h5 class = "alert-heading" i18n >
Logging into an account lets you publish content
< / h5 >
< p * ngIf = "signupAllowed" i18n >
2023-02-17 13:41:17 +00:00
This instance allows registration. However, be careful to check the < a class = "link-orange terms-anchor d-inline" ( click ) = " onTermsClick ( $ event , instanceInformation ) " href = '#' > Terms< / a > < a class = "terms-link" target = "_blank" routerLink = "/about/instance" fragment = "terms" > Terms< / a > before creating an account.
2022-06-15 12:29:28 +00:00
You may also search for another instance to match your exact needs at: < a class = "link-orange" href = "https://joinpeertube.org/instances" target = "_blank" rel = "noopener noreferrer" > https://joinpeertube.org/instances< / a > .
< / p >
< p * ngIf = "!signupAllowed" i18n >
2022-06-21 09:28:46 +00:00
Currently this instance doesn't allow for user registration, you may check the < a class = "link-orange" ( click ) = " onTermsClick ( $ event , instanceInformation ) " href = '#' > Terms< / a > for more details or find an instance that gives you the possibility to sign up for an account and upload your videos there.
2022-06-15 12:29:28 +00:00
Find yours among multiple instances at: < a class = "link-orange" href = "https://joinpeertube.org/instances" target = "_blank" rel = "noopener noreferrer" > https://joinpeertube.org/instances< / a > .
< / p >
2020-04-28 12:49:03 +00:00
< / div >
2016-03-22 14:51:54 +00:00
2022-06-16 14:10:12 +00:00
< div class = "alert alert-danger" i18n * ngIf = "externalAuthError" >
Sorry but there was an issue with the external login process. Please < a class = "link-orange" routerLink = "/about" > contact an administrator< / a > .
< / div >
< div * ngIf = "error" class = "alert alert-danger" >
{{ error }}
< a * ngIf = "error === 'User email is not verified.'" class = "ms-1 link-orange" i18n routerLink = "/verify-account/ask-send-email" >
Request new verification email
< / a >
< / div >
2020-12-07 15:34:07 +00:00
< div class = "wrapper" >
< div class = "login-form-and-externals" >
2023-02-17 13:41:17 +00:00
< form class = "w-100 m-0" myPluginSelector pluginSelectorId = "login-form" role = "form" ( ngSubmit ) = " login ( ) " [ formGroup ] = " form " >
2022-10-07 09:06:28 +00:00
< ng-container * ngIf = "!otpStep" >
< div class = "form-group" >
< div >
< label i18n for = "username" > Username or email address< / label >
< input
type="text" id="username" i18n-placeholder placeholder="Example: john@example.com" required tabindex="1"
formControlName="username" class="form-control" [ngClass]="{ 'input-error': formErrors['username'] }" myAutofocus
2023-10-09 07:50:59 +00:00
autocomplete="username"
2022-10-07 09:06:28 +00:00
>
< / div >
2023-10-06 08:19:20 +00:00
< div * ngIf = "formErrors.username" class = "form-error" role = "alert" > {{ formErrors.username }}< / div >
2022-10-07 09:06:28 +00:00
< div * ngIf = "hasUsernameUppercase()" i18n class = "form-warning" >
⚠️ Most email addresses do not include capital letters.
< / div >
2020-12-07 15:34:07 +00:00
< / div >
2022-10-07 09:06:28 +00:00
< div class = "form-group" >
< label i18n for = "password" > Password< / label >
2021-07-20 11:47:49 +00:00
2022-10-07 09:06:28 +00:00
< my-input-text
formControlName="password" inputId="password" i18n-placeholder placeholder="Password"
[formError]="formErrors['password']" autocomplete="current-password" [tabindex]="2"
>< / my-input-text >
2021-07-20 11:47:49 +00:00
< / div >
2022-10-07 09:06:28 +00:00
< / ng-container >
< div * ngIf = "otpStep" class = "form-group" >
< p i18n > Enter the two-factor code generated by your phone app:< / p >
2018-03-28 16:22:59 +00:00
2022-10-07 09:06:28 +00:00
< label i18n for = "otp-token" > Two factor authentication token< / label >
2022-06-15 12:29:28 +00:00
2022-06-20 14:42:21 +00:00
< my-input-text
2022-10-07 09:06:28 +00:00
#otpTokenInput
[show]="true" formControlName="otp-token" inputId="otp-token"
[formError]="formErrors['otp-token']" autocomplete="otp-token"
2022-06-20 14:42:21 +00:00
>< / my-input-text >
2020-04-29 08:42:35 +00:00
< / div >
2020-12-07 15:34:07 +00:00
2023-02-17 13:41:17 +00:00
< input type = "submit" class = "peertube-button orange-button w-100" i18n-value value = "Login" [ disabled ] = " ! form . valid " >
2020-12-22 11:05:32 +00:00
2023-02-17 13:41:17 +00:00
< div * ngIf = "!otpStep" class = "additional-links d-flex justify-content-center mt-4 mb-5" >
2023-05-24 13:27:15 +00:00
< button i18n class = "button-unstyle link-orange mx-3" ( click ) = " openForgotPasswordModal ( ) " i18n-title title = "Click here to reset your password" >
I forgot my password
< / button >
2021-12-02 13:34:00 +00:00
2022-06-15 12:29:28 +00:00
< ng-container * ngIf = "signupAllowed" >
2023-05-24 13:27:15 +00:00
< span class = "lh-1" > ·< / span >
2023-02-17 13:41:17 +00:00
< a i18n routerLink = "/signup" class = "link-orange mx-3" > Create an account< / a >
2022-06-15 12:29:28 +00:00
< / ng-container >
2020-12-07 15:34:07 +00:00
< / div >
< / form >
2020-04-29 08:42:35 +00:00
2020-12-07 15:34:07 +00:00
< div class = "external-login-blocks" * ngIf = "getExternalLogins().length !== 0" >
2023-02-17 13:41:17 +00:00
< div class = "fw-semibold" i18n > Or sign in with< / div >
2020-04-29 08:42:35 +00:00
2020-12-07 15:34:07 +00:00
< div >
< a class = "external-login-block" * ngFor = "let auth of getExternalLogins()" [ href ] = " getAuthHref ( auth ) " role = "button" >
{{ auth.authDisplayName }}
< / a >
< / div >
2020-04-28 12:49:03 +00:00
< / div >
2018-01-30 12:27:07 +00:00
< / div >
2017-04-21 16:26:09 +00:00
2020-12-07 15:34:07 +00:00
< div # instanceInformation class = "instance-information" >
2022-01-20 08:35:06 +00:00
< my-instance-about-accordion
2023-07-12 08:22:43 +00:00
#instanceAboutAccordion
2022-06-15 12:29:28 +00:00
[displayInstanceName]="false"
2022-01-20 08:35:06 +00:00
(init)="onInstanceAboutAccordionInit($event)" [panels]="instanceInformationPanels"
pluginScope="login" pluginHook="filter:login.instance-about-plugin-panels.create.result"
>< / my-instance-about-accordion >
2020-12-07 15:34:07 +00:00
< / div >
< / div >
2020-04-28 12:49:03 +00:00
< / ng-container >
2017-04-21 16:26:09 +00:00
< / div >
2018-01-30 12:27:07 +00:00
2018-08-09 12:55:06 +00:00
< ng-template # forgotPasswordModal >
< div class = "modal-header" >
< h4 i18n class = "modal-title" > Forgot your password< / h4 >
2019-01-16 15:05:40 +00:00
2023-10-12 13:01:17 +00:00
< button class = "border-0 p-0" title = "Close this modal" i18n-title ( click ) = " hideForgotPasswordModal ( ) " >
< my-global-icon iconName = "cross" > < / my-global-icon >
< / button >
2018-08-09 12:55:06 +00:00
< / div >
2018-01-30 12:27:07 +00:00
2023-02-17 13:41:17 +00:00
< div class = "modal-body text-start" >
2018-12-05 14:10:45 +00:00
< div * ngIf = "isEmailDisabled()" class = "alert alert-danger" i18n >
2019-09-23 06:17:42 +00:00
We are sorry, you cannot recover your password because your instance administrator did not configure the PeerTube email system.
2018-12-05 14:10:45 +00:00
< / div >
2023-02-17 13:41:17 +00:00
< div * ngIf = "!isEmailDisabled()" class = "mb-4" i18n >
2020-11-24 12:47:24 +00:00
Enter your email address and we will send you a link to reset your password.
< / div >
2018-12-05 14:10:45 +00:00
< div class = "form-group" [ hidden ] = " isEmailDisabled ( ) " >
2018-08-09 12:55:06 +00:00
< label i18n for = "forgot-password-email" > Email< / label >
< input
type="email" id="forgot-password-email" i18n-placeholder placeholder="Email address" required
[(ngModel)]="forgotPasswordEmail" #forgotPasswordEmailInput
>
< / div >
< / div >
2018-01-30 12:27:07 +00:00
2018-08-09 12:55:06 +00:00
< div class = "modal-footer inputs" >
2020-04-02 09:39:14 +00:00
< input
2023-02-17 13:41:17 +00:00
type="button" role="button" i18n-value value="Cancel" class="peertube-button d-none d-sm-block"
2020-04-02 09:39:14 +00:00
(click)="hideForgotPasswordModal()" (key.enter)="hideForgotPasswordModal()"
>
2018-01-30 12:27:07 +00:00
2018-08-09 12:55:06 +00:00
< input
2021-04-14 14:39:37 +00:00
type="submit" i18n-value="Password reset button" value="Reset" class="peertube-button orange-button"
2018-08-09 12:55:06 +00:00
(click)="askResetPassword()" [disabled]="!forgotPasswordEmailInput.validity.valid"
>
2018-01-30 12:27:07 +00:00
< / div >
2018-08-09 12:55:06 +00:00
< / ng-template >