--- /dev/null
+<section class="container">
+ <header>
+ <ng-container *ngFor="let step of steps; let i = index; let isLast = last;">
+ <div
+ class="step-info" [ngClass]="{ active: selectedIndex === i, completed: isCompleted(step) }"
+ (click)="onClick(i)"
+ >
+ <div class="step-index">
+ <ng-container *ngIf="!isCompleted(step)">{{ i + 1 }}</ng-container>
+ <my-global-icon *ngIf="isCompleted(step)" iconName="tick"></my-global-icon>
+ </div>
+
+ <div class="step-label">{{ step.label }}</div>
+ </div>
+
+ <!-- Do no display if this is the last child -->
+ <div *ngIf="!isLast" class="connector"></div>
+ </ng-container>
+ </header>
+
+ <div [style.display]="selected ? 'block' : 'none'">
+ <ng-container [ngTemplateOutlet]="selected.content"></ng-container>
+ </div>
+
+</section>
--- /dev/null
+@import '_variables';
+@import '_mixins';
+
+$grey-color: #9CA3AB;
+$index-block-height: 32px;
+
+header {
+ display: flex;
+ justify-content: space-between;
+ font-size: 15px;
+ margin-bottom: 30px;
+
+ .step-info {
+ color: $grey-color;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ width: $index-block-height;
+
+ .step-index {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: $index-block-height;
+ height: $index-block-height;
+ border-radius: 100px;
+ border: 2px solid $grey-color;
+ margin-bottom: 10px;
+
+ my-global-icon {
+ @include apply-svg-color(var(--mainBackgroundColor));
+
+ width: 22px;
+ height: 22px;
+ }
+ }
+
+ .step-label {
+ width: max-content;
+ }
+
+ &.active,
+ &.completed {
+ .step-index {
+ border-color: var(--mainColor);
+ background-color: var(--mainColor);
+ color: var(--mainBackgroundColor);
+ }
+
+ .step-label {
+ color: var(--mainColor);
+ }
+ }
+
+ &.completed {
+ cursor: pointer;
+ }
+ }
+
+ .connector {
+ flex: auto;
+ margin: $index-block-height/2 10px 0 10px;
+ height: 2px;
+ background-color: $grey-color;
+ }
+}
--- /dev/null
+import { Component } from '@angular/core'
+import { CdkStep, CdkStepper } from '@angular/cdk/stepper'
+
+@Component({
+ selector: 'my-custom-stepper',
+ templateUrl: './custom-stepper.component.html',
+ styleUrls: [ './custom-stepper.component.scss' ],
+ providers: [ { provide: CdkStepper, useExisting: CustomStepperComponent } ]
+})
+export class CustomStepperComponent extends CdkStepper {
+
+ onClick (index: number): void {
+ this.selectedIndex = index
+ }
+
+ isCompleted (step: CdkStep) {
+ return step.stepControl && step.stepControl.dirty && step.stepControl.valid
+ }
+}
--- /dev/null
+import { NgModule } from '@angular/core'
+import { RouterModule, Routes } from '@angular/router'
+import { MetaGuard } from '@ngx-meta/core'
+import { RegisterComponent } from './register.component'
+import { ServerConfigResolver } from '@app/core/routing/server-config-resolver.service'
+import { UnloggedGuard } from '@app/core/routing/unlogged-guard.service'
+
+const registerRoutes: Routes = [
+ {
+ path: '',
+ component: RegisterComponent,
+ canActivate: [ MetaGuard, UnloggedGuard ],
+ data: {
+ meta: {
+ title: 'Register'
+ }
+ },
+ resolve: {
+ serverConfigLoaded: ServerConfigResolver
+ }
+ }
+]
+
+@NgModule({
+ imports: [ RouterModule.forChild(registerRoutes) ],
+ exports: [ RouterModule ]
+})
+export class RegisterRoutingModule {}
--- /dev/null
+<form role="form" [formGroup]="form">
+
+ <div class="channel-explanations">
+ <p i18n>
+ A channel is an entity in which you upload your videos. Creating several of them helps you to organize and separate your content.<br />
+ For example, you could decide to have a channel to publish your piano concerts, and another channel in which you publish your videos talking about ecology.
+ </p>
+
+ <p>
+ Other users can decide to subscribe any channel they want, to be notified when you publish a new video.
+ </p>
+ </div>
+
+ <div class="form-group">
+ <label for="name" i18n>Channel name</label>
+
+ <div class="input-group">
+ <input
+ type="text" id="name" i18n-placeholder placeholder="Example: my_super_channel"
+ formControlName="name" [ngClass]="{ 'input-error': formErrors['name'] }"
+ >
+ <div class="input-group-append">
+ <span class="input-group-text">@{{ instanceHost }}</span>
+ </div>
+ </div>
+
+ <div *ngIf="formErrors.name" class="form-error">
+ {{ formErrors.name }}
+ </div>
+
+ <div *ngIf="isSameThanUsername()" class="form-error" i18n>
+ Channel name cannot be the same than your account name. You can click on the first step to update your account name.
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="displayName" i18n>Channel display name</label>
+
+ <div class="input-group">
+ <input
+ type="text" id="displayName"
+ formControlName="displayName" [ngClass]="{ 'input-error': formErrors['displayName'] }"
+ >
+ </div>
+
+ <div *ngIf="formErrors.displayName" class="form-error">
+ {{ formErrors.displayName }}
+ </div>
+ </div>
+</form>
--- /dev/null
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import { AuthService } from '@app/core'
+import { FormReactive, VideoChannelValidatorsService } from '@app/shared'
+import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { FormGroup } from '@angular/forms'
+
+@Component({
+ selector: 'my-register-step-channel',
+ templateUrl: './register-step-channel.component.html',
+ styleUrls: [ './register.component.scss' ]
+})
+export class RegisterStepChannelComponent extends FormReactive implements OnInit {
+ @Input() username: string
+ @Output() formBuilt = new EventEmitter<FormGroup>()
+
+ constructor (
+ protected formValidatorService: FormValidatorService,
+ private authService: AuthService,
+ private videoChannelValidatorsService: VideoChannelValidatorsService
+ ) {
+ super()
+ }
+
+ get instanceHost () {
+ return window.location.host
+ }
+
+ isSameThanUsername () {
+ return this.username && this.username === this.form.value['name']
+ }
+
+ ngOnInit () {
+ this.buildForm({
+ name: this.videoChannelValidatorsService.VIDEO_CHANNEL_NAME,
+ displayName: this.videoChannelValidatorsService.VIDEO_CHANNEL_DISPLAY_NAME
+ })
+
+ setTimeout(() => this.formBuilt.emit(this.form))
+ }
+}
--- /dev/null
+<form role="form" [formGroup]="form">
+
+ <div class="form-group">
+ <label for="username" i18n>Username</label>
+
+ <div class="input-group">
+ <input
+ type="text" id="username" i18n-placeholder placeholder="Example: jane_doe"
+ formControlName="username" [ngClass]="{ 'input-error': formErrors['username'] }"
+ >
+ <div class="input-group-append">
+ <span class="input-group-text">@{{ instanceHost }}</span>
+ </div>
+ </div>
+
+ <div *ngIf="formErrors.username" class="form-error">
+ {{ formErrors.username }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="email" i18n>Email</label>
+ <input
+ type="text" id="email" i18n-placeholder placeholder="Email"
+ formControlName="email" [ngClass]="{ 'input-error': formErrors['email'] }"
+ >
+ <div *ngIf="formErrors.email" class="form-error">
+ {{ formErrors.email }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="password" i18n>Password</label>
+ <input
+ type="password" id="password" i18n-placeholder placeholder="Password"
+ formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }"
+ >
+ <div *ngIf="formErrors.password" class="form-error">
+ {{ formErrors.password }}
+ </div>
+ </div>
+
+ <div class="form-group form-group-terms">
+ <my-peertube-checkbox
+ inputName="terms" formControlName="terms"
+ i18n-labelHtml
+ labelHtml="I am at least 16 years old and agree to the <a href='/about/instance#terms-section' target='_blank'rel='noopener noreferrer'>Terms</a> of this instance"
+ ></my-peertube-checkbox>
+
+ <div *ngIf="formErrors.terms" class="form-error">
+ {{ formErrors.terms }}
+ </div>
+ </div>
+</form>
--- /dev/null
+import { Component, EventEmitter, OnInit, Output } from '@angular/core'
+import { AuthService } from '@app/core'
+import { FormReactive, UserValidatorsService } from '@app/shared'
+import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { FormGroup } from '@angular/forms'
+
+@Component({
+ selector: 'my-register-step-user',
+ templateUrl: './register-step-user.component.html',
+ styleUrls: [ './register.component.scss' ]
+})
+export class RegisterStepUserComponent extends FormReactive implements OnInit {
+ @Output() formBuilt = new EventEmitter<FormGroup>()
+
+ constructor (
+ protected formValidatorService: FormValidatorService,
+ private authService: AuthService,
+ private userValidatorsService: UserValidatorsService
+ ) {
+ super()
+ }
+
+ get instanceHost () {
+ return window.location.host
+ }
+
+ ngOnInit () {
+ this.buildForm({
+ username: this.userValidatorsService.USER_USERNAME,
+ password: this.userValidatorsService.USER_PASSWORD,
+ email: this.userValidatorsService.USER_EMAIL,
+ terms: this.userValidatorsService.USER_TERMS
+ })
+
+ setTimeout(() => this.formBuilt.emit(this.form))
+ }
+}
--- /dev/null
+<div class="margin-content">
+
+ <div i18n class="title-page title-page-single">
+ Create an account
+ </div>
+
+ <my-signup-success *ngIf="signupDone" [message]="success"></my-signup-success>
+ <div *ngIf="info" class="alert alert-info">{{ info }}</div>
+
+ <div class="wrapper" *ngIf="!signupDone">
+ <div>
+ <my-custom-stepper linear *ngIf="!signupDone">
+ <cdk-step [stepControl]="formStepUser" i18n-label label="User information">
+ <my-register-step-user (formBuilt)="onUserFormBuilt($event)"></my-register-step-user>
+
+ <button i18n cdkStepperNext [disabled]="!formStepUser || !formStepUser.valid">Next</button>
+ </cdk-step>
+
+ <cdk-step [stepControl]="formStepChannel" i18n-label label="Channel information">
+ <my-register-step-channel (formBuilt)="onChannelFormBuilt($event)" [username]="getUsername()"></my-register-step-channel>
+
+ <button i18n cdkStepperNext (click)="signup()"
+ [disabled]="!formStepChannel || !formStepChannel.valid || hasSameChannelAndAccountNames()"
+ >
+ Create my account
+ </button>
+ </cdk-step>
+
+ <cdk-step i18n-label label="Done" editable="false">
+ <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+ </cdk-step>
+ </my-custom-stepper>
+ </div>
+
+ <div>
+ <label i18n>Features found on this instance</label>
+ <my-instance-features-table></my-instance-features-table>
+ </div>
+ </div>
+
+</div>
--- /dev/null
+@import '_variables';
+@import '_mixins';
+
+.alert {
+ font-size: 15px;
+ text-align: center;
+}
+
+.wrapper {
+ display: flex;
+ justify-content: space-between;
+ flex-wrap: wrap;
+
+ & > div {
+ margin-bottom: 40px;
+ width: 450px;
+
+ @media screen and (max-width: 500px) {
+ width: auto;
+ }
+ }
+}
+
+my-instance-features-table {
+ display: block;
+
+ margin-bottom: 40px;
+}
+
+.form-group-terms {
+ margin: 30px 0;
+}
+
+.input-group {
+ @include peertube-input-group(400px);
+}
+
+.input-group-append {
+ height: 30px;
+}
+
+input:not([type=submit]) {
+ @include peertube-input-text(400px);
+
+ display: block;
+
+ &#username,
+ &#name {
+ width: auto !important;
+ flex-grow: 1;
+ }
+}
+
+input[type=submit],
+button {
+ @include peertube-button;
+ @include orange-button;
+}
--- /dev/null
+import { Component } from '@angular/core'
+import { AuthService, Notifier, RedirectService, ServerService } from '@app/core'
+import { UserService, UserValidatorsService } from '@app/shared'
+import { I18n } from '@ngx-translate/i18n-polyfill'
+import { UserRegister } from '@shared/models/users/user-register.model'
+import { FormGroup } from '@angular/forms'
+
+@Component({
+ selector: 'my-register',
+ templateUrl: './register.component.html',
+ styleUrls: [ './register.component.scss' ]
+})
+export class RegisterComponent {
+ info: string = null
+ error: string = null
+ success: string = null
+ signupDone = false
+
+ formStepUser: FormGroup
+ formStepChannel: FormGroup
+
+ constructor (
+ private authService: AuthService,
+ private userValidatorsService: UserValidatorsService,
+ private notifier: Notifier,
+ private userService: UserService,
+ private serverService: ServerService,
+ private redirectService: RedirectService,
+ private i18n: I18n
+ ) {
+ }
+
+ get requiresEmailVerification () {
+ return this.serverService.getConfig().signup.requiresEmailVerification
+ }
+
+ hasSameChannelAndAccountNames () {
+ return this.getUsername() === this.getChannelName()
+ }
+
+ getUsername () {
+ if (!this.formStepUser) return undefined
+
+ return this.formStepUser.value['username']
+ }
+
+ getChannelName () {
+ if (!this.formStepChannel) return undefined
+
+ return this.formStepChannel.value['name']
+ }
+
+ onUserFormBuilt (form: FormGroup) {
+ this.formStepUser = form
+ }
+
+ onChannelFormBuilt (form: FormGroup) {
+ this.formStepChannel = form
+ }
+
+ signup () {
+ this.error = null
+
+ const body: UserRegister = Object.assign(this.formStepUser.value, { channel: this.formStepChannel.value })
+
+ this.userService.signup(body).subscribe(
+ () => {
+ this.signupDone = true
+
+ if (this.requiresEmailVerification) {
+ this.info = this.i18n('Now please check your emails to verify your account and complete signup.')
+ return
+ }
+
+ // Auto login
+ this.authService.login(body.username, body.password)
+ .subscribe(
+ () => {
+ this.success = this.i18n('You are now logged in as {{username}}!', { username: body.username })
+ },
+
+ err => this.error = err.message
+ )
+ },
+
+ err => this.error = err.message
+ )
+ }
+}
--- /dev/null
+import { NgModule } from '@angular/core'
+import { RegisterRoutingModule } from './register-routing.module'
+import { RegisterComponent } from './register.component'
+import { SharedModule } from '@app/shared'
+import { CdkStepperModule } from '@angular/cdk/stepper'
+import { RegisterStepChannelComponent } from './register-step-channel.component'
+import { RegisterStepUserComponent } from './register-step-user.component'
+import { CustomStepperComponent } from './custom-stepper.component'
+import { SignupSharedModule } from '@app/+signup/shared/signup-shared.module'
+
+@NgModule({
+ imports: [
+ RegisterRoutingModule,
+ SharedModule,
+ CdkStepperModule,
+ SignupSharedModule
+ ],
+
+ declarations: [
+ RegisterComponent,
+ CustomStepperComponent,
+ RegisterStepChannelComponent,
+ RegisterStepUserComponent
+ ],
+
+ exports: [
+ RegisterComponent
+ ],
+
+ providers: [
+ ]
+})
+export class RegisterModule { }
--- /dev/null
+<div class="margin-content">
+ <div i18n class="title-page title-page-single">
+ Request email for account verification
+ </div>
+
+ <form *ngIf="requiresEmailVerification; else emailVerificationNotRequired" role="form" (ngSubmit)="askSendVerifyEmail()" [formGroup]="form">
+ <div class="form-group">
+ <label i18n for="verify-email-email">Email</label>
+ <input
+ type="email" id="verify-email-email" i18n-placeholder placeholder="Email address" required
+ formControlName="verify-email-email" [ngClass]="{ 'input-error': formErrors['verify-email-email'] }"
+ >
+ <div *ngIf="formErrors['verify-email-email']" class="form-error">
+ {{ formErrors['verify-email-email'] }}
+ </div>
+ </div>
+ <input type="submit" i18n-value value="Send verification email" [disabled]="!form.valid">
+ </form>
+ <ng-template #emailVerificationNotRequired>
+ <div i18n>This instance does not require email verification.</div>
+ </ng-template>
+</div>
--- /dev/null
+@import '_variables';
+@import '_mixins';
+
+input:not([type=submit]) {
+ @include peertube-input-text(340px);
+ display: block;
+}
+
+input[type=submit] {
+ @include peertube-button;
+ @include orange-button;
+}
--- /dev/null
+import { Component, OnInit } from '@angular/core'
+import { I18n } from '@ngx-translate/i18n-polyfill'
+import { Notifier, RedirectService } from '@app/core'
+import { ServerService } from '@app/core/server'
+import { FormReactive, UserService } from '@app/shared'
+import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
+import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
+
+@Component({
+ selector: 'my-verify-account-ask-send-email',
+ templateUrl: './verify-account-ask-send-email.component.html',
+ styleUrls: [ './verify-account-ask-send-email.component.scss' ]
+})
+
+export class VerifyAccountAskSendEmailComponent extends FormReactive implements OnInit {
+
+ constructor (
+ protected formValidatorService: FormValidatorService,
+ private userValidatorsService: UserValidatorsService,
+ private userService: UserService,
+ private serverService: ServerService,
+ private notifier: Notifier,
+ private redirectService: RedirectService,
+ private i18n: I18n
+ ) {
+ super()
+ }
+
+ get requiresEmailVerification () {
+ return this.serverService.getConfig().signup.requiresEmailVerification
+ }
+
+ ngOnInit () {
+ this.buildForm({
+ 'verify-email-email': this.userValidatorsService.USER_EMAIL
+ })
+ }
+
+ askSendVerifyEmail () {
+ const email = this.form.value['verify-email-email']
+ this.userService.askSendVerifyEmail(email)
+ .subscribe(
+ () => {
+ const message = this.i18n(
+ 'An email with verification link will be sent to {{email}}.',
+ { email }
+ )
+ this.notifier.success(message)
+ this.redirectService.redirectToHomepage()
+ },
+
+ err => {
+ this.notifier.error(err.message)
+ }
+ )
+ }
+}
--- /dev/null
+<div class="margin-content">
+ <div i18n class="title-page title-page-single">
+ Verify account email confirmation
+ </div>
+
+ <my-signup-success i18n *ngIf="success; else verificationError" message="Your email has been verified and you may now login.">
+ </my-signup-success>
+
+ <ng-template #verificationError>
+ <div>
+ <span i18n>An error occurred. </span>
+ <a i18n routerLink="/verify-account/ask-send-email">Request new verification email.</a>
+ </div>
+ </ng-template>
+</div>
--- /dev/null
+import { Component, OnInit } from '@angular/core'
+import { ActivatedRoute, Router } from '@angular/router'
+import { I18n } from '@ngx-translate/i18n-polyfill'
+import { Notifier } from '@app/core'
+import { UserService } from '@app/shared'
+
+@Component({
+ selector: 'my-verify-account-email',
+ templateUrl: './verify-account-email.component.html'
+})
+
+export class VerifyAccountEmailComponent implements OnInit {
+ success = false
+
+ private userId: number
+ private verificationString: string
+
+ constructor (
+ private userService: UserService,
+ private notifier: Notifier,
+ private router: Router,
+ private route: ActivatedRoute,
+ private i18n: I18n
+ ) {
+ }
+
+ ngOnInit () {
+ this.userId = this.route.snapshot.queryParams['userId']
+ this.verificationString = this.route.snapshot.queryParams['verificationString']
+
+ if (!this.userId || !this.verificationString) {
+ this.notifier.error(this.i18n('Unable to find user id or verification string.'))
+ } else {
+ this.verifyEmail()
+ }
+ }
+
+ verifyEmail () {
+ this.userService.verifyEmail(this.userId, this.verificationString)
+ .subscribe(
+ () => {
+ this.success = true
+ },
+
+ err => {
+ this.notifier.error(err.message)
+ }
+ )
+ }
+}
--- /dev/null
+import { NgModule } from '@angular/core'
+import { RouterModule, Routes } from '@angular/router'
+import { MetaGuard } from '@ngx-meta/core'
+import { VerifyAccountEmailComponent } from './verify-account-email/verify-account-email.component'
+import { VerifyAccountAskSendEmailComponent } from './verify-account-ask-send-email/verify-account-ask-send-email.component'
+
+const verifyAccountRoutes: Routes = [
+ {
+ path: '',
+ canActivateChild: [ MetaGuard ],
+ children: [
+ {
+ path: 'email',
+ component: VerifyAccountEmailComponent,
+ data: {
+ meta: {
+ title: 'Verify account email'
+ }
+ }
+ },
+ {
+ path: 'ask-send-email',
+ component: VerifyAccountAskSendEmailComponent,
+ data: {
+ meta: {
+ title: 'Verify account ask send email'
+ }
+ }
+ }
+ ]
+ }
+]
+
+@NgModule({
+ imports: [ RouterModule.forChild(verifyAccountRoutes) ],
+ exports: [ RouterModule ]
+})
+export class VerifyAccountRoutingModule {}
--- /dev/null
+import { NgModule } from '@angular/core'
+import { VerifyAccountRoutingModule } from './verify-account-routing.module'
+import { VerifyAccountEmailComponent } from './verify-account-email/verify-account-email.component'
+import { VerifyAccountAskSendEmailComponent } from './verify-account-ask-send-email/verify-account-ask-send-email.component'
+import { SharedModule } from '@app/shared'
+import { SignupSharedModule } from '@app/+signup/shared/signup-shared.module'
+
+@NgModule({
+ imports: [
+ VerifyAccountRoutingModule,
+ SharedModule,
+ SignupSharedModule
+ ],
+
+ declarations: [
+ VerifyAccountEmailComponent,
+ VerifyAccountAskSendEmailComponent
+ ],
+
+ exports: [],
+
+ providers: []
+})
+export class VerifyAccountModule {
+}
--- /dev/null
+import { NgModule } from '@angular/core'
+import { SignupSuccessComponent } from '../shared/signup-success.component'
+import { SharedModule } from '@app/shared'
+
+@NgModule({
+ imports: [
+ SharedModule
+ ],
+
+ declarations: [
+ SignupSuccessComponent
+ ],
+
+ exports: [
+ SignupSuccessComponent
+ ],
+
+ providers: [
+ ]
+})
+export class SignupSharedModule { }
--- /dev/null
+<!-- Thanks: Amit Singh Sansoya from https://codepen.io/amit3200/pen/zWMJOO -->
+
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 130.2 130.2">
+ <circle class="path circle" fill="none" stroke="#73AF55" stroke-width="6" stroke-miterlimit="10" cx="65.1" cy="65.1" r="62.1"/>
+ <polyline class="path check" fill="none" stroke="#73AF55" stroke-width="6" stroke-linecap="round" stroke-miterlimit="10" points="100.2,40.2 51.5,88.8 29.8,67.5 "/>
+</svg>
+
+<p class="bottom-message">Welcome on PeerTube!</p>
+
+<div *ngIf="message" class="alert alert-success">
+ <p>{{ message }}</p>
+
+ <p i18n>
+ If you need help to use PeerTube, you can take a look to the <a href="https://docs.joinpeertube.org/#/use-setup-account" target="_blank" rel="noopener noreferrer">documentation</a>.
+ </p>
+</div>
--- /dev/null
+svg {
+ width: 100px;
+ display: block;
+ margin: 40px auto 0;
+}
+
+.path {
+ stroke-dasharray: 1000;
+ stroke-dashoffset: 0;
+
+ &.circle {
+ -webkit-animation: dash .9s ease-in-out;
+ animation: dash .9s ease-in-out;
+ }
+
+ &.line {
+ stroke-dashoffset: 1000;
+ -webkit-animation: dash .9s .35s ease-in-out forwards;
+ animation: dash .9s .35s ease-in-out forwards;
+ }
+
+ &.check {
+ stroke-dashoffset: -100;
+ -webkit-animation: dash-check .9s .35s ease-in-out forwards;
+ animation: dash-check .9s .35s ease-in-out forwards;
+ }
+}
+
+.bottom-message {
+ text-align: center;
+ margin: 20px 0 60px;
+ font-size: 1.25em;
+ color: #73AF55;
+}
+
+.alert {
+ font-size: 15px;
+ text-align: center;
+}
+
+
+@-webkit-keyframes dash {
+ 0% {
+ stroke-dashoffset: 1000;
+ }
+ 100% {
+ stroke-dashoffset: 0;
+ }
+}
+
+@keyframes dash {
+ 0% {
+ stroke-dashoffset: 1000;
+ }
+ 100% {
+ stroke-dashoffset: 0;
+ }
+}
+
+@-webkit-keyframes dash-check {
+ 0% {
+ stroke-dashoffset: -100;
+ }
+ 100% {
+ stroke-dashoffset: 900;
+ }
+}
+
+@keyframes dash-check {
+ 0% {
+ stroke-dashoffset: -100;
+ }
+ 100% {
+ stroke-dashoffset: 900;
+ }
+}
--- /dev/null
+import { Component, Input } from '@angular/core'
+
+@Component({
+ selector: 'my-signup-success',
+ templateUrl: './signup-success.component.html',
+ styleUrls: [ './signup-success.component.scss' ]
+})
+export class SignupSuccessComponent {
+ @Input() message: string
+}
+++ /dev/null
-export * from '@app/+verify-account/verify-account-routing.module'
-export * from '@app/+verify-account/verify-account.module'
+++ /dev/null
-<div class="margin-content">
- <div i18n class="title-page title-page-single">
- Request email for account verification
- </div>
-
- <form *ngIf="requiresEmailVerification; else emailVerificationNotRequired" role="form" (ngSubmit)="askSendVerifyEmail()" [formGroup]="form">
- <div class="form-group">
- <label i18n for="verify-email-email">Email</label>
- <input
- type="email" id="verify-email-email" i18n-placeholder placeholder="Email address" required
- formControlName="verify-email-email" [ngClass]="{ 'input-error': formErrors['verify-email-email'] }"
- >
- <div *ngIf="formErrors['verify-email-email']" class="form-error">
- {{ formErrors['verify-email-email'] }}
- </div>
- </div>
- <input type="submit" i18n-value value="Send verification email" [disabled]="!form.valid">
- </form>
- <ng-template #emailVerificationNotRequired>
- <div i18n>This instance does not require email verification.</div>
- </ng-template>
-</div>
+++ /dev/null
-@import '_variables';
-@import '_mixins';
-
-input:not([type=submit]) {
- @include peertube-input-text(340px);
- display: block;
-}
-
-input[type=submit] {
- @include peertube-button;
- @include orange-button;
-}
+++ /dev/null
-import { Component, OnInit } from '@angular/core'
-import { I18n } from '@ngx-translate/i18n-polyfill'
-import { Notifier, RedirectService } from '@app/core'
-import { ServerService } from '@app/core/server'
-import { FormReactive, UserService } from '@app/shared'
-import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
-import { UserValidatorsService } from '@app/shared/forms/form-validators/user-validators.service'
-
-@Component({
- selector: 'my-verify-account-ask-send-email',
- templateUrl: './verify-account-ask-send-email.component.html',
- styleUrls: [ './verify-account-ask-send-email.component.scss' ]
-})
-
-export class VerifyAccountAskSendEmailComponent extends FormReactive implements OnInit {
-
- constructor (
- protected formValidatorService: FormValidatorService,
- private userValidatorsService: UserValidatorsService,
- private userService: UserService,
- private serverService: ServerService,
- private notifier: Notifier,
- private redirectService: RedirectService,
- private i18n: I18n
- ) {
- super()
- }
-
- get requiresEmailVerification () {
- return this.serverService.getConfig().signup.requiresEmailVerification
- }
-
- ngOnInit () {
- this.buildForm({
- 'verify-email-email': this.userValidatorsService.USER_EMAIL
- })
- }
-
- askSendVerifyEmail () {
- const email = this.form.value['verify-email-email']
- this.userService.askSendVerifyEmail(email)
- .subscribe(
- () => {
- const message = this.i18n(
- 'An email with verification link will be sent to {{email}}.',
- { email }
- )
- this.notifier.success(message)
- this.redirectService.redirectToHomepage()
- },
-
- err => {
- this.notifier.error(err.message)
- }
- )
- }
-}
+++ /dev/null
-<div class="margin-content">
- <div i18n class="title-page title-page-single">
- Verify account email confirmation
- </div>
-
- <div i18n *ngIf="success; else verificationError">
- Your email has been verified and you may now login. Redirecting...
- </div>
- <ng-template #verificationError>
- <div>
- <span i18n>An error occurred. </span>
- <a i18n routerLink="/verify-account/ask-send-email">Request new verification email.</a>
- </div>
- </ng-template>
-</div>
+++ /dev/null
-import { Component, OnInit } from '@angular/core'
-import { ActivatedRoute, Router } from '@angular/router'
-import { I18n } from '@ngx-translate/i18n-polyfill'
-import { Notifier } from '@app/core'
-import { UserService } from '@app/shared'
-
-@Component({
- selector: 'my-verify-account-email',
- templateUrl: './verify-account-email.component.html'
-})
-
-export class VerifyAccountEmailComponent implements OnInit {
- success = false
-
- private userId: number
- private verificationString: string
-
- constructor (
- private userService: UserService,
- private notifier: Notifier,
- private router: Router,
- private route: ActivatedRoute,
- private i18n: I18n
- ) {
- }
-
- ngOnInit () {
- this.userId = this.route.snapshot.queryParams['userId']
- this.verificationString = this.route.snapshot.queryParams['verificationString']
-
- if (!this.userId || !this.verificationString) {
- this.notifier.error(this.i18n('Unable to find user id or verification string.'))
- } else {
- this.verifyEmail()
- }
- }
-
- verifyEmail () {
- this.userService.verifyEmail(this.userId, this.verificationString)
- .subscribe(
- () => {
- this.success = true
- setTimeout(() => {
- this.router.navigate([ '/login' ])
- }, 2000)
- },
-
- err => {
- this.notifier.error(err.message)
- }
- )
- }
-}
+++ /dev/null
-import { NgModule } from '@angular/core'
-import { RouterModule, Routes } from '@angular/router'
-
-import { MetaGuard } from '@ngx-meta/core'
-
-import { VerifyAccountEmailComponent } from '@app/+verify-account/verify-account-email/verify-account-email.component'
-import {
- VerifyAccountAskSendEmailComponent
-} from '@app/+verify-account/verify-account-ask-send-email/verify-account-ask-send-email.component'
-
-const verifyAccountRoutes: Routes = [
- {
- path: '',
- canActivateChild: [ MetaGuard ],
- children: [
- {
- path: 'email',
- component: VerifyAccountEmailComponent,
- data: {
- meta: {
- title: 'Verify account email'
- }
- }
- },
- {
- path: 'ask-send-email',
- component: VerifyAccountAskSendEmailComponent,
- data: {
- meta: {
- title: 'Verify account ask send email'
- }
- }
- }
- ]
- }
-]
-
-@NgModule({
- imports: [ RouterModule.forChild(verifyAccountRoutes) ],
- exports: [ RouterModule ]
-})
-export class VerifyAccountRoutingModule {}
+++ /dev/null
-import { NgModule } from '@angular/core'
-
-import { VerifyAccountRoutingModule } from '@app/+verify-account/verify-account-routing.module'
-import { VerifyAccountEmailComponent } from '@app/+verify-account/verify-account-email/verify-account-email.component'
-import {
- VerifyAccountAskSendEmailComponent
-} from '@app/+verify-account/verify-account-ask-send-email/verify-account-ask-send-email.component'
-import { SharedModule } from '@app/shared'
-
-@NgModule({
- imports: [
- VerifyAccountRoutingModule,
- SharedModule
- ],
-
- declarations: [
- VerifyAccountEmailComponent,
- VerifyAccountAskSendEmailComponent
- ],
-
- exports: [
- ],
-
- providers: [
- ]
-})
-export class VerifyAccountModule { }
},
{
path: 'verify-account',
- loadChildren: './+verify-account/verify-account.module#VerifyAccountModule'
+ loadChildren: './+signup/+verify-account/verify-account.module#VerifyAccountModule'
},
{
path: 'accounts',
path: 'about',
loadChildren: './+about/about.module#AboutModule'
},
+ {
+ path: 'signup',
+ loadChildren: './+signup/+register/register.module#RegisterModule'
+ },
{
path: '',
component: AppComponent // Avoid 404, app component will redirect dynamically
import { LoginModule } from './login'
import { AvatarNotificationComponent, LanguageChooserComponent, MenuComponent } from './menu'
import { SharedModule } from './shared'
-import { SignupModule } from './signup'
import { VideosModule } from './videos'
import { buildFileLocale, getCompleteLocale, isDefaultLocale } from '../../../shared/models/i18n'
import { getDevLocale, isOnDevLocale } from '@app/shared/i18n/i18n-utils'
CoreModule,
LoginModule,
ResetPasswordModule,
- SignupModule,
SearchModule,
SharedModule,
VideosModule,
import { MessageService } from 'primeng/api'
import { UserNotificationSocket } from '@app/core/notification/user-notification-socket.service'
import { ServerConfigResolver } from './routing/server-config-resolver.service'
+import { UnloggedGuard } from '@app/core/routing/unlogged-guard.service'
@NgModule({
imports: [
ThemeService,
LoginGuard,
UserRightGuard,
+ UnloggedGuard,
+
RedirectService,
Notifier,
MessageService,
}
redirectToPreviousRoute () {
- if (this.previousUrl) return this.router.navigateByUrl(this.previousUrl)
+ const exceptions = [
+ '/verify-account'
+ ]
+
+ if (this.previousUrl) {
+ const isException = exceptions.find(e => this.previousUrl.startsWith(e))
+ if (!isException) return this.router.navigateByUrl(this.previousUrl)
+ }
return this.redirectToHomepage()
}
--- /dev/null
+import { Injectable } from '@angular/core'
+import { ActivatedRouteSnapshot, CanActivate, CanActivateChild, Router, RouterStateSnapshot } from '@angular/router'
+import { AuthService } from '../auth/auth.service'
+import { RedirectService } from './redirect.service'
+
+@Injectable()
+export class UnloggedGuard implements CanActivate, CanActivateChild {
+
+ constructor (
+ private router: Router,
+ private auth: AuthService,
+ private redirectService: RedirectService
+ ) {}
+
+ canActivate (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
+ if (this.auth.isLoggedIn() === false) return true
+
+ this.redirectService.redirectToHomepage()
+ return false
+ }
+
+ canActivateChild (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
+ return this.canActivate(route, state)
+ }
+}
+++ /dev/null
-<section class="container">
- <header>
- <ng-container *ngFor="let step of steps; let i = index; let isLast = last;">
- <div
- class="step-info" [ngClass]="{ active: selectedIndex === i, completed: isCompleted(step) }"
- (click)="onClick(i)"
- >
- <div class="step-index">
- <ng-container *ngIf="!isCompleted(step)">{{ i + 1 }}</ng-container>
- <my-global-icon *ngIf="isCompleted(step)" iconName="tick"></my-global-icon>
- </div>
-
- <div class="step-label">{{ step.label }}</div>
- </div>
-
- <!-- Do no display if this is the last child -->
- <div *ngIf="!isLast" class="connector"></div>
- </ng-container>
- </header>
-
- <div [style.display]="selected ? 'block' : 'none'">
- <ng-container [ngTemplateOutlet]="selected.content"></ng-container>
- </div>
-
-</section>
+++ /dev/null
-@import '_variables';
-@import '_mixins';
-
-$grey-color: #9CA3AB;
-$index-block-height: 32px;
-
-header {
- display: flex;
- justify-content: space-between;
- font-size: 15px;
- margin-bottom: 30px;
-
- .step-info {
- color: $grey-color;
- display: flex;
- flex-direction: column;
- align-items: center;
- width: $index-block-height;
-
- .step-index {
- display: flex;
- justify-content: center;
- align-items: center;
- width: $index-block-height;
- height: $index-block-height;
- border-radius: 100px;
- border: 2px solid $grey-color;
- margin-bottom: 10px;
-
- my-global-icon {
- @include apply-svg-color(var(--mainBackgroundColor));
-
- width: 22px;
- height: 22px;
- }
- }
-
- .step-label {
- width: max-content;
- }
-
- &.active,
- &.completed {
- .step-index {
- border-color: var(--mainColor);
- background-color: var(--mainColor);
- color: var(--mainBackgroundColor);
- }
-
- .step-label {
- color: var(--mainColor);
- }
- }
-
- &.completed {
- cursor: pointer;
- }
- }
-
- .connector {
- flex: auto;
- margin: $index-block-height/2 10px 0 10px;
- height: 2px;
- background-color: $grey-color;
- }
-}
+++ /dev/null
-import { Component } from '@angular/core'
-import { CdkStep, CdkStepper } from '@angular/cdk/stepper'
-
-@Component({
- selector: 'my-custom-stepper',
- templateUrl: './custom-stepper.component.html',
- styleUrls: [ './custom-stepper.component.scss' ],
- providers: [ { provide: CdkStepper, useExisting: CustomStepperComponent } ]
-})
-export class CustomStepperComponent extends CdkStepper {
-
- onClick (index: number): void {
- this.selectedIndex = index
- }
-
- isCompleted (step: CdkStep) {
- return step.stepControl && step.stepControl.dirty && step.stepControl.valid
- }
-}
+++ /dev/null
-export * from './signup-routing.module'
-export * from './signup.component'
-export * from './signup.module'
+++ /dev/null
-import { NgModule } from '@angular/core'
-import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
-import { SignupComponent } from './signup.component'
-import { ServerConfigResolver } from '@app/core/routing/server-config-resolver.service'
-
-const signupRoutes: Routes = [
- {
- path: 'signup',
- component: SignupComponent,
- canActivate: [ MetaGuard ],
- data: {
- meta: {
- title: 'Signup'
- }
- },
- resolve: {
- serverConfigLoaded: ServerConfigResolver
- }
- }
-]
-
-@NgModule({
- imports: [ RouterModule.forChild(signupRoutes) ],
- exports: [ RouterModule ]
-})
-export class SignupRoutingModule {}
+++ /dev/null
-<form role="form" [formGroup]="form">
-
- <div class="channel-explanations">
- <p i18n>
- A channel is an entity in which you upload your videos. Creating several of them helps you to organize and separate your content.<br />
- For example, you could decide to have a channel to publish your piano concerts, and another channel in which you publish your videos talking about ecology.
- </p>
-
- <p>
- Other users can decide to subscribe any channel they want, to be notified when you publish a new video.
- </p>
- </div>
-
- <div class="form-group">
- <label for="name" i18n>Channel name</label>
-
- <div class="input-group">
- <input
- type="text" id="name" i18n-placeholder placeholder="Example: my_super_channel"
- formControlName="name" [ngClass]="{ 'input-error': formErrors['name'] }"
- >
- <div class="input-group-append">
- <span class="input-group-text">@{{ instanceHost }}</span>
- </div>
- </div>
-
- <div *ngIf="formErrors.name" class="form-error">
- {{ formErrors.name }}
- </div>
-
- <div *ngIf="isSameThanUsername()" class="form-error" i18n>
- Channel name cannot be the same than your account name. You can click on the first step to update your account name.
- </div>
- </div>
-
- <div class="form-group">
- <label for="displayName" i18n>Channel display name</label>
-
- <div class="input-group">
- <input
- type="text" id="displayName"
- formControlName="displayName" [ngClass]="{ 'input-error': formErrors['displayName'] }"
- >
- </div>
-
- <div *ngIf="formErrors.displayName" class="form-error">
- {{ formErrors.displayName }}
- </div>
- </div>
-</form>
+++ /dev/null
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
-import { AuthService } from '@app/core'
-import { FormReactive, VideoChannelValidatorsService } from '../shared'
-import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
-import { FormGroup } from '@angular/forms'
-
-@Component({
- selector: 'my-signup-step-channel',
- templateUrl: './signup-step-channel.component.html',
- styleUrls: [ './signup.component.scss' ]
-})
-export class SignupStepChannelComponent extends FormReactive implements OnInit {
- @Input() username: string
- @Output() formBuilt = new EventEmitter<FormGroup>()
-
- constructor (
- protected formValidatorService: FormValidatorService,
- private authService: AuthService,
- private videoChannelValidatorsService: VideoChannelValidatorsService
- ) {
- super()
- }
-
- get instanceHost () {
- return window.location.host
- }
-
- isSameThanUsername () {
- return this.username && this.username === this.form.value['name']
- }
-
- ngOnInit () {
- this.buildForm({
- name: this.videoChannelValidatorsService.VIDEO_CHANNEL_NAME,
- displayName: this.videoChannelValidatorsService.VIDEO_CHANNEL_DISPLAY_NAME
- })
-
- setTimeout(() => this.formBuilt.emit(this.form))
- }
-}
+++ /dev/null
-<form role="form" [formGroup]="form">
-
- <div class="form-group">
- <label for="username" i18n>Username</label>
-
- <div class="input-group">
- <input
- type="text" id="username" i18n-placeholder placeholder="Example: jane_doe"
- formControlName="username" [ngClass]="{ 'input-error': formErrors['username'] }"
- >
- <div class="input-group-append">
- <span class="input-group-text">@{{ instanceHost }}</span>
- </div>
- </div>
-
- <div *ngIf="formErrors.username" class="form-error">
- {{ formErrors.username }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="email" i18n>Email</label>
- <input
- type="text" id="email" i18n-placeholder placeholder="Email"
- formControlName="email" [ngClass]="{ 'input-error': formErrors['email'] }"
- >
- <div *ngIf="formErrors.email" class="form-error">
- {{ formErrors.email }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="password" i18n>Password</label>
- <input
- type="password" id="password" i18n-placeholder placeholder="Password"
- formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }"
- >
- <div *ngIf="formErrors.password" class="form-error">
- {{ formErrors.password }}
- </div>
- </div>
-
- <div class="form-group form-group-terms">
- <my-peertube-checkbox
- inputName="terms" formControlName="terms"
- i18n-labelHtml
- labelHtml="I am at least 16 years old and agree to the <a href='/about/instance#terms-section' target='_blank'rel='noopener noreferrer'>Terms</a> of this instance"
- ></my-peertube-checkbox>
-
- <div *ngIf="formErrors.terms" class="form-error">
- {{ formErrors.terms }}
- </div>
- </div>
-</form>
+++ /dev/null
-import { Component, EventEmitter, OnInit, Output } from '@angular/core'
-import { AuthService } from '@app/core'
-import { FormReactive, UserValidatorsService } from '../shared'
-import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
-import { FormGroup } from '@angular/forms'
-
-@Component({
- selector: 'my-signup-step-user',
- templateUrl: './signup-step-user.component.html',
- styleUrls: [ './signup.component.scss' ]
-})
-export class SignupStepUserComponent extends FormReactive implements OnInit {
- @Output() formBuilt = new EventEmitter<FormGroup>()
-
- constructor (
- protected formValidatorService: FormValidatorService,
- private authService: AuthService,
- private userValidatorsService: UserValidatorsService
- ) {
- super()
- }
-
- get instanceHost () {
- return window.location.host
- }
-
- ngOnInit () {
- this.buildForm({
- username: this.userValidatorsService.USER_USERNAME,
- password: this.userValidatorsService.USER_PASSWORD,
- email: this.userValidatorsService.USER_EMAIL,
- terms: this.userValidatorsService.USER_TERMS
- })
-
- setTimeout(() => this.formBuilt.emit(this.form))
- }
-}
+++ /dev/null
-<div class="margin-content">
-
- <div i18n class="title-page title-page-single">
- Create an account
- </div>
-
-
- <my-success *ngIf="signupDone"></my-success>
- <div *ngIf="info" class="alert alert-info">{{ info }}</div>
- <div *ngIf="success" class="alert alert-success">{{ success }}</div>
-
- <div class="wrapper" *ngIf="!signupDone">
- <div>
- <my-custom-stepper linear *ngIf="!signupDone">
- <cdk-step [stepControl]="formStepUser" i18n-label label="User information">
- <my-signup-step-user (formBuilt)="onUserFormBuilt($event)"></my-signup-step-user>
-
- <button i18n cdkStepperNext [disabled]="!formStepUser || !formStepUser.valid">Next</button>
- </cdk-step>
-
- <cdk-step [stepControl]="formStepChannel" i18n-label label="Channel information">
- <my-signup-step-channel (formBuilt)="onChannelFormBuilt($event)" [username]="getUsername()"></my-signup-step-channel>
-
- <button i18n cdkStepperNext (click)="signup()"
- [disabled]="!formStepChannel || !formStepChannel.valid || hasSameChannelAndAccountNames()"
- >
- Create my account
- </button>
- </cdk-step>
-
- <cdk-step i18n-label label="Done" editable="false">
- <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
- </cdk-step>
- </my-custom-stepper>
- </div>
-
- <div>
- <label i18n>Features found on this instance</label>
- <my-instance-features-table></my-instance-features-table>
- </div>
- </div>
-
-</div>
+++ /dev/null
-@import '_variables';
-@import '_mixins';
-
-.alert {
- font-size: 15px;
- text-align: center;
-}
-
-.wrapper {
- display: flex;
- justify-content: space-between;
- flex-wrap: wrap;
-
- & > div {
- margin-bottom: 40px;
- width: 450px;
-
- @media screen and (max-width: 500px) {
- width: auto;
- }
- }
-}
-
-my-instance-features-table {
- display: block;
-
- margin-bottom: 40px;
-}
-
-.form-group-terms {
- margin: 30px 0;
-}
-
-.input-group {
- @include peertube-input-group(400px);
-}
-
-.input-group-append {
- height: 30px;
-}
-
-input:not([type=submit]) {
- @include peertube-input-text(400px);
-
- display: block;
-
- &#username,
- &#name {
- width: auto !important;
- flex-grow: 1;
- }
-}
-
-input[type=submit],
-button {
- @include peertube-button;
- @include orange-button;
-}
+++ /dev/null
-import { Component } from '@angular/core'
-import { AuthService, Notifier, RedirectService, ServerService } from '@app/core'
-import { UserService, UserValidatorsService } from '../shared'
-import { I18n } from '@ngx-translate/i18n-polyfill'
-import { UserRegister } from '@shared/models/users/user-register.model'
-import { FormGroup } from '@angular/forms'
-
-@Component({
- selector: 'my-signup',
- templateUrl: './signup.component.html',
- styleUrls: [ './signup.component.scss' ]
-})
-export class SignupComponent {
- info: string = null
- error: string = null
- success: string = null
- signupDone = false
-
- formStepUser: FormGroup
- formStepChannel: FormGroup
-
- constructor (
- private authService: AuthService,
- private userValidatorsService: UserValidatorsService,
- private notifier: Notifier,
- private userService: UserService,
- private serverService: ServerService,
- private redirectService: RedirectService,
- private i18n: I18n
- ) {
- }
-
- get requiresEmailVerification () {
- return this.serverService.getConfig().signup.requiresEmailVerification
- }
-
- hasSameChannelAndAccountNames () {
- return this.getUsername() === this.getChannelName()
- }
-
- getUsername () {
- if (!this.formStepUser) return undefined
-
- return this.formStepUser.value['username']
- }
-
- getChannelName () {
- if (!this.formStepChannel) return undefined
-
- return this.formStepChannel.value['name']
- }
-
- onUserFormBuilt (form: FormGroup) {
- this.formStepUser = form
- }
-
- onChannelFormBuilt (form: FormGroup) {
- this.formStepChannel = form
- }
-
- signup () {
- this.error = null
-
- const body: UserRegister = Object.assign(this.formStepUser.value, this.formStepChannel.value)
-
- this.userService.signup(body).subscribe(
- () => {
- this.signupDone = true
-
- if (this.requiresEmailVerification) {
- this.info = this.i18n('Now please check your emails to verify your account and complete signup.')
- return
- }
-
- // Auto login
- this.authService.login(body.username, body.password)
- .subscribe(
- () => {
- this.success = this.i18n('You are now logged in as {{username}}!', { username: body.username })
- },
-
- err => this.error = err.message
- )
- },
-
- err => this.error = err.message
- )
- }
-}
+++ /dev/null
-import { NgModule } from '@angular/core'
-import { SignupRoutingModule } from './signup-routing.module'
-import { SignupComponent } from './signup.component'
-import { SharedModule } from '../shared'
-import { CdkStepperModule } from '@angular/cdk/stepper'
-import { SignupStepChannelComponent } from '@app/signup/signup-step-channel.component'
-import { SignupStepUserComponent } from '@app/signup/signup-step-user.component'
-import { CustomStepperComponent } from '@app/signup/custom-stepper.component'
-import { SuccessComponent } from '@app/signup/success.component'
-
-@NgModule({
- imports: [
- SignupRoutingModule,
- SharedModule,
- CdkStepperModule
- ],
-
- declarations: [
- SignupComponent,
- CustomStepperComponent,
- SuccessComponent,
- SignupStepChannelComponent,
- SignupStepUserComponent
- ],
-
- exports: [
- SignupComponent
- ],
-
- providers: [
- ]
-})
-export class SignupModule { }
+++ /dev/null
-<!-- Thanks: Amit Singh Sansoya from https://codepen.io/amit3200/pen/zWMJOO -->
-
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 130.2 130.2">
- <circle class="path circle" fill="none" stroke="#73AF55" stroke-width="6" stroke-miterlimit="10" cx="65.1" cy="65.1" r="62.1"/>
- <polyline class="path check" fill="none" stroke="#73AF55" stroke-width="6" stroke-linecap="round" stroke-miterlimit="10" points="100.2,40.2 51.5,88.8 29.8,67.5 "/>
-</svg>
-
-<p class="success">Welcome on PeerTube!</p>
+++ /dev/null
-svg {
- width: 100px;
- display: block;
- margin: 40px auto 0;
-}
-
-.path {
- stroke-dasharray: 1000;
- stroke-dashoffset: 0;
-
- &.circle {
- -webkit-animation: dash .9s ease-in-out;
- animation: dash .9s ease-in-out;
- }
-
- &.line {
- stroke-dashoffset: 1000;
- -webkit-animation: dash .9s .35s ease-in-out forwards;
- animation: dash .9s .35s ease-in-out forwards;
- }
-
- &.check {
- stroke-dashoffset: -100;
- -webkit-animation: dash-check .9s .35s ease-in-out forwards;
- animation: dash-check .9s .35s ease-in-out forwards;
- }
-}
-
-p {
- text-align: center;
- margin: 20px 0 60px;
- font-size: 1.25em;
-
- &.success {
- color: #73AF55;
- }
-}
-
-
-@-webkit-keyframes dash {
- 0% {
- stroke-dashoffset: 1000;
- }
- 100% {
- stroke-dashoffset: 0;
- }
-}
-
-@keyframes dash {
- 0% {
- stroke-dashoffset: 1000;
- }
- 100% {
- stroke-dashoffset: 0;
- }
-}
-
-@-webkit-keyframes dash-check {
- 0% {
- stroke-dashoffset: -100;
- }
- 100% {
- stroke-dashoffset: 900;
- }
-}
-
-@keyframes dash-check {
- 0% {
- stroke-dashoffset: -100;
- }
- 100% {
- stroke-dashoffset: 900;
- }
-}
+++ /dev/null
-import { Component } from '@angular/core'
-
-@Component({
- selector: 'my-success',
- templateUrl: './success.component.html',
- styleUrls: [ './success.component.scss' ]
-})
-export class SuccessComponent {
-
-}
projects / oweals / peertube.git / commitdiff