aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorRigel Kent <sendmemail@rigelk.eu>2020-01-10 14:01:13 +0100
committerRigel Kent <sendmemail@rigelk.eu>2020-01-10 14:01:23 +0100
commit000eb0e40d74e914f6691305511c44e89cd8bf07 (patch)
tree8745c9f15041fc04b3f02dd087ecce330d3b9428 /client
parentab4d4db44a4f943056b856cbdc7b8d157cabf9af (diff)
downloadPeerTube-000eb0e40d74e914f6691305511c44e89cd8bf07.tar.gz
PeerTube-000eb0e40d74e914f6691305511c44e89cd8bf07.tar.zst
PeerTube-000eb0e40d74e914f6691305511c44e89cd8bf07.zip
Add informational message at login for visitors coming from upload button
resolves #1880
Diffstat (limited to 'client')
-rw-r--r--client/src/app/header/header.component.html2
-rw-r--r--client/src/app/header/header.component.scss1
-rw-r--r--client/src/app/header/header.component.ts36
-rw-r--r--client/src/app/login/login.component.html12
-rw-r--r--client/src/app/login/login.component.scss4
-rw-r--r--client/src/app/login/login.component.ts14
-rw-r--r--client/src/app/menu/menu.component.ts1
-rw-r--r--client/src/sass/bootstrap.scss6
8 files changed, 67 insertions, 9 deletions
diff --git a/client/src/app/header/header.component.html b/client/src/app/header/header.component.html
index 8ee41c4de..4b3d5e105 100644
--- a/client/src/app/header/header.component.html
+++ b/client/src/app/header/header.component.html
@@ -4,7 +4,7 @@
4> 4>
5<span (click)="doSearch()" class="icon icon-search"></span> 5<span (click)="doSearch()" class="icon icon-search"></span>
6 6
7<a class="upload-button" routerLink="/videos/upload"> 7<a class="upload-button" (click)="goToUpload()">
8 <my-global-icon iconName="upload"></my-global-icon> 8 <my-global-icon iconName="upload"></my-global-icon>
9 <span i18n class="upload-button-label">Upload</span> 9 <span i18n class="upload-button-label">Upload</span>
10</a> 10</a>
diff --git a/client/src/app/header/header.component.scss b/client/src/app/header/header.component.scss
index 736035b72..2bbde74bc 100644
--- a/client/src/app/header/header.component.scss
+++ b/client/src/app/header/header.component.scss
@@ -53,6 +53,7 @@
53 @include orange-button; 53 @include orange-button;
54 @include button-with-icon(22px, 3px, -1px); 54 @include button-with-icon(22px, 3px, -1px);
55 55
56 color: var(--mainBackgroundColor) !important;
56 margin-right: 25px; 57 margin-right: 25px;
57 58
58 @media screen and (max-width: 800px) { 59 @media screen and (max-width: 800px) {
diff --git a/client/src/app/header/header.component.ts b/client/src/app/header/header.component.ts
index c6e942e0e..192d6945b 100644
--- a/client/src/app/header/header.component.ts
+++ b/client/src/app/header/header.component.ts
@@ -2,8 +2,9 @@ import { filter, first, map, tap } from 'rxjs/operators'
2import { Component, OnInit } from '@angular/core' 2import { Component, OnInit } from '@angular/core'
3import { ActivatedRoute, NavigationEnd, Params, Router } from '@angular/router' 3import { ActivatedRoute, NavigationEnd, Params, Router } from '@angular/router'
4import { getParameterByName } from '../shared/misc/utils' 4import { getParameterByName } from '../shared/misc/utils'
5import { AuthService } from '@app/core' 5import { AuthService, ServerService, Notifier } from '@app/core'
6import { of } from 'rxjs' 6import { of } from 'rxjs'
7import { ServerConfig } from '@shared/models'
7 8
8@Component({ 9@Component({
9 selector: 'my-header', 10 selector: 'my-header',
@@ -14,10 +15,15 @@ import { of } from 'rxjs'
14export class HeaderComponent implements OnInit { 15export class HeaderComponent implements OnInit {
15 searchValue = '' 16 searchValue = ''
16 17
18 private serverConfig: ServerConfig
19
17 constructor ( 20 constructor (
18 private router: Router, 21 private router: Router,
19 private route: ActivatedRoute, 22 private route: ActivatedRoute,
20 private auth: AuthService 23 private auth: AuthService,
24 private serverService: ServerService,
25 private authService: AuthService,
26 private notifier: Notifier
21 ) {} 27 ) {}
22 28
23 ngOnInit () { 29 ngOnInit () {
@@ -27,6 +33,13 @@ export class HeaderComponent implements OnInit {
27 map(() => getParameterByName('search', window.location.href)) 33 map(() => getParameterByName('search', window.location.href))
28 ) 34 )
29 .subscribe(searchQuery => this.searchValue = searchQuery || '') 35 .subscribe(searchQuery => this.searchValue = searchQuery || '')
36
37 this.serverConfig = this.serverService.getTmpConfig()
38 this.serverService.getConfig().subscribe(
39 config => this.serverConfig = config,
40
41 err => this.notifier.error(err.message)
42 )
30 } 43 }
31 44
32 doSearch () { 45 doSearch () {
@@ -45,6 +58,25 @@ export class HeaderComponent implements OnInit {
45 o.subscribe(() => this.router.navigate([ '/search' ], { queryParams })) 58 o.subscribe(() => this.router.navigate([ '/search' ], { queryParams }))
46 } 59 }
47 60
61 isUserLoggedIn () {
62 return this.authService.isLoggedIn()
63 }
64
65 isRegistrationAllowed () {
66 return this.serverConfig.signup.allowed &&
67 this.serverConfig.signup.allowedForCurrentIP
68 }
69
70 goToUpload () {
71 if (this.isUserLoggedIn()) {
72 this.router.navigate([ '/videos/upload' ])
73 } else if (this.isRegistrationAllowed()) {
74 this.router.navigate([ '/signup' ])
75 } else {
76 this.router.navigate([ '/login', { fromUpload: true } ])
77 }
78 }
79
48 private loadUserLanguagesIfNeeded (queryParams: any) { 80 private loadUserLanguagesIfNeeded (queryParams: any) {
49 if (queryParams && queryParams.languageOneOf) return of(queryParams) 81 if (queryParams && queryParams.languageOneOf) return of(queryParams)
50 82
diff --git a/client/src/app/login/login.component.html b/client/src/app/login/login.component.html
index 9bbeab3be..162f44ded 100644
--- a/client/src/app/login/login.component.html
+++ b/client/src/app/login/login.component.html
@@ -3,6 +3,18 @@
3 Login 3 Login
4 </div> 4 </div>
5 5
6 <div class="alert alert-warning" *ngIf="from.upload" role="alert">
7 <h6 class="alert-heading" i18n>
8 If you are looking for an account…
9 </h6>
10 <div i18n>
11 Currently this instance doesn't allow for user registration, but you can find an instance
12 that gives you the possibility to sign up for an account and upload your videos there.
13 Find yours among multiple instances at <a class="alert-link" [href]="instancesIndexUrl" target="_blank" rel="noopener noreferrer">{{ instancesIndexUrl }}</a>
14 , a directory of instances recommended by this instance.
15 </div>
16 </div>
17
6 <div *ngIf="error" class="alert alert-danger">{{ error }} 18 <div *ngIf="error" class="alert alert-danger">{{ error }}
7 <span *ngIf="error === 'User email is not verified.'"> <a i18n routerLink="/verify-account/ask-send-email">Request new verification email.</a></span> 19 <span *ngIf="error === 'User email is not verified.'"> <a i18n routerLink="/verify-account/ask-send-email">Request new verification email.</a></span>
8 </div> 20 </div>
diff --git a/client/src/app/login/login.component.scss b/client/src/app/login/login.component.scss
index 8541a2681..8ac231475 100644
--- a/client/src/app/login/login.component.scss
+++ b/client/src/app/login/login.component.scss
@@ -20,8 +20,10 @@ input[type=submit] {
20.create-an-account, .forgot-password-button { 20.create-an-account, .forgot-password-button {
21 color: var(--mainForegroundColor); 21 color: var(--mainForegroundColor);
22 cursor: pointer; 22 cursor: pointer;
23 transition: opacity cubic-bezier(0.39, 0.575, 0.565, 1);
23 24
24 &:hover { 25 &:hover {
25 text-decoration: underline !important; 26 text-decoration: none !important;
27 opacity: .7 !important;
26 } 28 }
27} 29}
diff --git a/client/src/app/login/login.component.ts b/client/src/app/login/login.component.ts
index ffadc9aa4..1394d6b58 100644
--- a/client/src/app/login/login.component.ts
+++ b/client/src/app/login/login.component.ts
@@ -1,5 +1,5 @@
1import { Component, ElementRef, OnInit, ViewChild } from '@angular/core' 1import { Component, ElementRef, OnInit, ViewChild } from '@angular/core'
2import { Notifier, RedirectService, ServerService } from '@app/core' 2import { Notifier, RedirectService } from '@app/core'
3import { UserService } from '@app/shared' 3import { UserService } from '@app/shared'
4import { AuthService } from '../core' 4import { AuthService } from '../core'
5import { FormReactive } from '../shared' 5import { FormReactive } from '../shared'
@@ -7,8 +7,8 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
7import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service' 7import { FormValidatorService } from '@app/shared/forms/form-validators/form-validator.service'
8import { LoginValidatorsService } from '@app/shared/forms/form-validators/login-validators.service' 8import { LoginValidatorsService } from '@app/shared/forms/form-validators/login-validators.service'
9import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap' 9import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'
10import { ActivatedRoute, Router } from '@angular/router' 10import { ActivatedRoute } from '@angular/router'
11import { ServerConfig } from '@shared/models' 11import { ServerConfig } from '@shared/models/server/server-config.model'
12 12
13@Component({ 13@Component({
14 selector: 'my-login', 14 selector: 'my-login',
@@ -22,6 +22,9 @@ export class LoginComponent extends FormReactive implements OnInit {
22 22
23 error: string = null 23 error: string = null
24 forgotPasswordEmail = '' 24 forgotPasswordEmail = ''
25 from = {
26 upload: false
27 }
25 28
26 private openedForgotPasswordModal: NgbModalRef 29 private openedForgotPasswordModal: NgbModalRef
27 private serverConfig: ServerConfig 30 private serverConfig: ServerConfig
@@ -44,12 +47,17 @@ export class LoginComponent extends FormReactive implements OnInit {
44 return this.serverConfig.signup.allowed === true 47 return this.serverConfig.signup.allowed === true
45 } 48 }
46 49
50 get instancesIndexUrl () {
51 return this.serverConfig.followings.instance.autoFollowIndex.indexUrl || 'https://instances.joinpeertube.org'
52 }
53
47 isEmailDisabled () { 54 isEmailDisabled () {
48 return this.serverConfig.email.enabled === false 55 return this.serverConfig.email.enabled === false
49 } 56 }
50 57
51 ngOnInit () { 58 ngOnInit () {
52 this.serverConfig = this.route.snapshot.data.serverConfig 59 this.serverConfig = this.route.snapshot.data.serverConfig
60 this.from.upload = Boolean(this.route.snapshot.paramMap.get('fromUpload'))
53 61
54 this.buildForm({ 62 this.buildForm({
55 username: this.loginValidatorsService.LOGIN_USERNAME, 63 username: this.loginValidatorsService.LOGIN_USERNAME,
diff --git a/client/src/app/menu/menu.component.ts b/client/src/app/menu/menu.component.ts
index 2d522b521..1d7651e78 100644
--- a/client/src/app/menu/menu.component.ts
+++ b/client/src/app/menu/menu.component.ts
@@ -33,7 +33,6 @@ export class MenuComponent implements OnInit {
33 private authService: AuthService, 33 private authService: AuthService,
34 private serverService: ServerService, 34 private serverService: ServerService,
35 private redirectService: RedirectService, 35 private redirectService: RedirectService,
36 private themeService: ThemeService,
37 private hotkeysService: HotkeysService 36 private hotkeysService: HotkeysService
38 ) {} 37 ) {}
39 38
diff --git a/client/src/sass/bootstrap.scss b/client/src/sass/bootstrap.scss
index a3261a8a6..dc0d075c9 100644
--- a/client/src/sass/bootstrap.scss
+++ b/client/src/sass/bootstrap.scss
@@ -165,4 +165,8 @@ ngb-tabset.bootstrap {
165 165
166.dropdown-divider { 166.dropdown-divider {
167 margin: 0.3rem 0; 167 margin: 0.3rem 0;
168} \ No newline at end of file 168}
169
170ngb-modal-backdrop {
171 z-index: 10000 !important;
172}