aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/account/account-settings
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2017-12-29 19:10:13 +0100
committerChocobozzz <me@florianbigard.com>2017-12-29 19:10:13 +0100
commitc5911fd347c76e8bdc05ea9f3ee9efed4a58c236 (patch)
treeb8d287daca6c45305090cbec9da97d1155f275bd /client/src/app/account/account-settings
parent8b0d42ee372de6589796be26b83e5bffb1b69cdf (diff)
downloadPeerTube-c5911fd347c76e8bdc05ea9f3ee9efed4a58c236.tar.gz
PeerTube-c5911fd347c76e8bdc05ea9f3ee9efed4a58c236.tar.zst
PeerTube-c5911fd347c76e8bdc05ea9f3ee9efed4a58c236.zip
Begin to add avatar to actors
Diffstat (limited to 'client/src/app/account/account-settings')
-rw-r--r--client/src/app/account/account-settings/account-settings.component.html6
-rw-r--r--client/src/app/account/account-settings/account-settings.component.scss6
-rw-r--r--client/src/app/account/account-settings/account-settings.component.ts36
3 files changed, 43 insertions, 5 deletions
diff --git a/client/src/app/account/account-settings/account-settings.component.html b/client/src/app/account/account-settings/account-settings.component.html
index f14eadd49..fe345207a 100644
--- a/client/src/app/account/account-settings/account-settings.component.html
+++ b/client/src/app/account/account-settings/account-settings.component.html
@@ -1,5 +1,5 @@
1<div class="user"> 1<div class="user">
2 <img [src]="getAvatarPath()" alt="Avatar" /> 2 <img [src]="getAvatarUrl()" alt="Avatar" />
3 3
4 <div class="user-info"> 4 <div class="user-info">
5 <div class="user-info-username">{{ user.username }}</div> 5 <div class="user-info-username">{{ user.username }}</div>
@@ -7,6 +7,10 @@
7 </div> 7 </div>
8</div> 8</div>
9 9
10<div class="button-file">
11 <span>Change your avatar</span>
12 <input #avatarfileInput type="file" name="avatarfile" id="avatarfile" (change)="changeAvatar()" />
13</div>
10 14
11<div class="account-title">Account settings</div> 15<div class="account-title">Account settings</div>
12<my-account-change-password></my-account-change-password> 16<my-account-change-password></my-account-change-password>
diff --git a/client/src/app/account/account-settings/account-settings.component.scss b/client/src/app/account/account-settings/account-settings.component.scss
index 7f1ade377..accd65214 100644
--- a/client/src/app/account/account-settings/account-settings.component.scss
+++ b/client/src/app/account/account-settings/account-settings.component.scss
@@ -21,6 +21,12 @@
21 } 21 }
22} 22}
23 23
24.button-file {
25 @include peertube-button-file(auto);
26
27 margin-top: 10px;
28}
29
24.account-title { 30.account-title {
25 text-transform: uppercase; 31 text-transform: uppercase;
26 color: $orange-color; 32 color: $orange-color;
diff --git a/client/src/app/account/account-settings/account-settings.component.ts b/client/src/app/account/account-settings/account-settings.component.ts
index cba251000..3e03085ce 100644
--- a/client/src/app/account/account-settings/account-settings.component.ts
+++ b/client/src/app/account/account-settings/account-settings.component.ts
@@ -1,6 +1,10 @@
1import { Component, OnInit } from '@angular/core' 1import { HttpEventType, HttpResponse } from '@angular/common/http'
2import { Component, OnInit, ViewChild } from '@angular/core'
3import { NotificationsService } from 'angular2-notifications'
4import { VideoPrivacy } from '../../../../../shared/models/videos'
2import { User } from '../../shared' 5import { User } from '../../shared'
3import { AuthService } from '../../core' 6import { AuthService } from '../../core'
7import { UserService } from '../../shared/users'
4 8
5@Component({ 9@Component({
6 selector: 'my-account-settings', 10 selector: 'my-account-settings',
@@ -8,15 +12,39 @@ import { AuthService } from '../../core'
8 styleUrls: [ './account-settings.component.scss' ] 12 styleUrls: [ './account-settings.component.scss' ]
9}) 13})
10export class AccountSettingsComponent implements OnInit { 14export class AccountSettingsComponent implements OnInit {
15 @ViewChild('avatarfileInput') avatarfileInput
16
11 user: User = null 17 user: User = null
12 18
13 constructor (private authService: AuthService) {} 19 constructor (
20 private userService: UserService,
21 private authService: AuthService,
22 private notificationsService: NotificationsService
23 ) {}
14 24
15 ngOnInit () { 25 ngOnInit () {
16 this.user = this.authService.getUser() 26 this.user = this.authService.getUser()
17 } 27 }
18 28
19 getAvatarPath () { 29 getAvatarUrl () {
20 return this.user.getAvatarPath() 30 return this.user.getAvatarUrl()
31 }
32
33 changeAvatar () {
34 const avatarfile = this.avatarfileInput.nativeElement.files[ 0 ]
35
36 const formData = new FormData()
37 formData.append('avatarfile', avatarfile)
38
39 this.userService.changeAvatar(formData)
40 .subscribe(
41 data => {
42 this.notificationsService.success('Success', 'Avatar changed.')
43
44 this.user.account.avatar = data.avatar
45 },
46
47 err => this.notificationsService.error('Error', err.message)
48 )
21 } 49 }
22} 50}