aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/account
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/account')
-rw-r--r--client/src/app/account/account-videos/account-videos.component.html7
-rw-r--r--client/src/app/account/account-videos/account-videos.component.scss18
-rw-r--r--client/src/app/account/account-videos/account-videos.component.ts22
3 files changed, 43 insertions, 4 deletions
diff --git a/client/src/app/account/account-videos/account-videos.component.html b/client/src/app/account/account-videos/account-videos.component.html
index 81bda9477..30db69429 100644
--- a/client/src/app/account/account-videos/account-videos.component.html
+++ b/client/src/app/account/account-videos/account-videos.component.html
@@ -13,7 +13,12 @@
13 <span class="video-info-date-views">{{ video.createdAt | myFromNow }} - {{ video.views | myNumberFormatter }} views</span> 13 <span class="video-info-date-views">{{ video.createdAt | myFromNow }} - {{ video.views | myNumberFormatter }} views</span>
14 </div> 14 </div>
15 15
16 <a class="edit-button" [routerLink]="[ '/videos', video.id, '/edit' ]"> 16 <a class="action-button action-button-delete" (click)="deleteVideo(video)">
17 <span class="icon icon-delete"></span>
18 Delete
19 </a>
20
21 <a class="action-button" [routerLink]="[ '/videos', video.id, '/edit' ]">
17 <span class="icon icon-edit"></span> 22 <span class="icon icon-edit"></span>
18 Edit 23 Edit
19 </a> 24 </a>
diff --git a/client/src/app/account/account-videos/account-videos.component.scss b/client/src/app/account/account-videos/account-videos.component.scss
index c31497350..7ac25afc3 100644
--- a/client/src/app/account/account-videos/account-videos.component.scss
+++ b/client/src/app/account/account-videos/account-videos.component.scss
@@ -25,7 +25,7 @@
25 } 25 }
26 } 26 }
27 27
28 .edit-button { 28 .action-button {
29 @include peertube-button-link; 29 @include peertube-button-link;
30 30
31 font-size: 15px; 31 font-size: 15px;
@@ -33,15 +33,27 @@
33 color: #585858; 33 color: #585858;
34 background-color: #E5E5E5; 34 background-color: #E5E5E5;
35 35
36 .icon.icon-edit { 36 &.action-button-delete {
37 margin-right: 10px;
38 }
39
40 .icon.icon-edit, .icon.icon-delete {
37 display: inline-block; 41 display: inline-block;
38 background: url('../../../assets/images/account/edit.svg') no-repeat; 42 background-repeat: no-repeat;
39 background-size: contain; 43 background-size: contain;
40 width: 21px; 44 width: 21px;
41 height: 21px; 45 height: 21px;
42 vertical-align: middle; 46 vertical-align: middle;
43 position: relative; 47 position: relative;
44 top: -2px; 48 top: -2px;
49
50 &.icon-edit {
51 background-image: url('../../../assets/images/account/edit.svg');
52 }
53
54 &.icon-delete {
55 background-image: url('../../../assets/images/account/delete.svg');
56 }
45 } 57 }
46 } 58 }
47} 59}
diff --git a/client/src/app/account/account-videos/account-videos.component.ts b/client/src/app/account/account-videos/account-videos.component.ts
index 1bc6c0a35..9c2cc2404 100644
--- a/client/src/app/account/account-videos/account-videos.component.ts
+++ b/client/src/app/account/account-videos/account-videos.component.ts
@@ -1,7 +1,9 @@
1import { Component, OnInit } from '@angular/core' 1import { Component, OnInit } from '@angular/core'
2import { ActivatedRoute, Router } from '@angular/router' 2import { ActivatedRoute, Router } from '@angular/router'
3import { NotificationsService } from 'angular2-notifications' 3import { NotificationsService } from 'angular2-notifications'
4import { ConfirmService } from '../../core/confirm'
4import { AbstractVideoList } from '../../shared/video/abstract-video-list' 5import { AbstractVideoList } from '../../shared/video/abstract-video-list'
6import { Video } from '../../shared/video/video.model'
5import { VideoService } from '../../shared/video/video.service' 7import { VideoService } from '../../shared/video/video.service'
6 8
7@Component({ 9@Component({
@@ -16,6 +18,7 @@ export class AccountVideosComponent extends AbstractVideoList implements OnInit
16 constructor (protected router: Router, 18 constructor (protected router: Router,
17 protected route: ActivatedRoute, 19 protected route: ActivatedRoute,
18 protected notificationsService: NotificationsService, 20 protected notificationsService: NotificationsService,
21 protected confirmService: ConfirmService,
19 private videoService: VideoService) { 22 private videoService: VideoService) {
20 super() 23 super()
21 } 24 }
@@ -27,4 +30,23 @@ export class AccountVideosComponent extends AbstractVideoList implements OnInit
27 getVideosObservable () { 30 getVideosObservable () {
28 return this.videoService.getMyVideos(this.pagination, this.sort) 31 return this.videoService.getMyVideos(this.pagination, this.sort)
29 } 32 }
33
34 deleteVideo (video: Video) {
35 this.confirmService.confirm(`Do you really want to delete ${video.name}?`, 'Delete').subscribe(
36 res => {
37 if (res === false) return
38
39 this.videoService.removeVideo(video.id)
40 .subscribe(
41 status => {
42 this.notificationsService.success('Success', `Video ${video.name} deleted.`)
43 const index = this.videos.findIndex(v => v.id === video.id)
44 this.videos.splice(index, 1)
45 },
46
47 error => this.notificationsService.error('Error', error.text)
48 )
49 }
50 )
51 }
30} 52}