]>
Commit | Line | Data |
---|---|---|
1 | import { Component, OnInit } from '@angular/core' | |
2 | import { Notifier, ServerService } from '@app/core' | |
3 | import { SortMeta } from 'primeng/api' | |
4 | import { ConfirmService } from '../../../core/confirm/confirm.service' | |
5 | import { RestPagination, RestTable } from '../../../shared' | |
6 | import { I18n } from '@ngx-translate/i18n-polyfill' | |
7 | import { VideoRedundanciesTarget, VideoRedundancy } from '@shared/models' | |
8 | import { peertubeLocalStorage } from '@app/shared/misc/peertube-web-storage' | |
9 | import { VideosRedundancyStats } from '@shared/models/server' | |
10 | import { BytesPipe } from 'ngx-pipes' | |
11 | import { RedundancyService } from '@app/shared/video/redundancy.service' | |
12 | ||
13 | @Component({ | |
14 | selector: 'my-video-redundancies-list', | |
15 | templateUrl: './video-redundancies-list.component.html', | |
16 | styleUrls: [ '../follows.component.scss', './video-redundancies-list.component.scss' ] | |
17 | }) | |
18 | export class VideoRedundanciesListComponent extends RestTable implements OnInit { | |
19 | private static LOCAL_STORAGE_DISPLAY_TYPE = 'video-redundancies-list-display-type' | |
20 | ||
21 | videoRedundancies: VideoRedundancy[] = [] | |
22 | totalRecords = 0 | |
23 | ||
24 | sort: SortMeta = { field: 'name', order: 1 } | |
25 | pagination: RestPagination = { count: this.rowsPerPage, start: 0 } | |
26 | displayType: VideoRedundanciesTarget = 'my-videos' | |
27 | ||
28 | redundanciesGraphsData: { stats: VideosRedundancyStats, graphData: object, options: object }[] = [] | |
29 | ||
30 | noRedundancies = false | |
31 | ||
32 | private bytesPipe: BytesPipe | |
33 | ||
34 | constructor ( | |
35 | private notifier: Notifier, | |
36 | private confirmService: ConfirmService, | |
37 | private redundancyService: RedundancyService, | |
38 | private serverService: ServerService, | |
39 | private i18n: I18n | |
40 | ) { | |
41 | super() | |
42 | ||
43 | this.bytesPipe = new BytesPipe() | |
44 | } | |
45 | ||
46 | getIdentifier () { | |
47 | return 'VideoRedundanciesListComponent' | |
48 | } | |
49 | ||
50 | ngOnInit () { | |
51 | this.loadSelectLocalStorage() | |
52 | ||
53 | this.initialize() | |
54 | ||
55 | this.serverService.getServerStats() | |
56 | .subscribe(res => { | |
57 | const redundancies = res.videosRedundancy | |
58 | ||
59 | if (redundancies.length === 0) this.noRedundancies = true | |
60 | ||
61 | for (const r of redundancies) { | |
62 | this.buildPieData(r) | |
63 | } | |
64 | }) | |
65 | } | |
66 | ||
67 | getColspan () { | |
68 | if (this.isDisplayingRemoteVideos()) return 5 | |
69 | ||
70 | return 4 | |
71 | } | |
72 | ||
73 | isDisplayingRemoteVideos () { | |
74 | return this.displayType === 'remote-videos' | |
75 | } | |
76 | ||
77 | getTotalSize (redundancy: VideoRedundancy) { | |
78 | return redundancy.redundancies.files.reduce((a, b) => a + b.size, 0) + | |
79 | redundancy.redundancies.streamingPlaylists.reduce((a, b) => a + b.size, 0) | |
80 | } | |
81 | ||
82 | onDisplayTypeChanged () { | |
83 | this.pagination.start = 0 | |
84 | this.saveSelectLocalStorage() | |
85 | ||
86 | this.loadData() | |
87 | } | |
88 | ||
89 | getRedundancyStrategy (redundancy: VideoRedundancy) { | |
90 | if (redundancy.redundancies.files.length !== 0) return redundancy.redundancies.files[0].strategy | |
91 | if (redundancy.redundancies.streamingPlaylists.length !== 0) return redundancy.redundancies.streamingPlaylists[0].strategy | |
92 | ||
93 | return '' | |
94 | } | |
95 | ||
96 | buildPieData (stats: VideosRedundancyStats) { | |
97 | const totalSize = stats.totalSize | |
98 | ? stats.totalSize - stats.totalUsed | |
99 | : stats.totalUsed | |
100 | ||
101 | if (totalSize === 0) return | |
102 | ||
103 | this.redundanciesGraphsData.push({ | |
104 | stats, | |
105 | graphData: { | |
106 | labels: [ this.i18n('Used'), this.i18n('Available') ], | |
107 | datasets: [ | |
108 | { | |
109 | data: [ stats.totalUsed, totalSize ], | |
110 | backgroundColor: [ | |
111 | '#FF6384', | |
112 | '#36A2EB' | |
113 | ], | |
114 | hoverBackgroundColor: [ | |
115 | '#FF6384', | |
116 | '#36A2EB' | |
117 | ] | |
118 | } | |
119 | ] | |
120 | }, | |
121 | options: { | |
122 | title: { | |
123 | display: true, | |
124 | text: stats.strategy | |
125 | }, | |
126 | ||
127 | tooltips: { | |
128 | callbacks: { | |
129 | label: (tooltipItem: any, data: any) => { | |
130 | const dataset = data.datasets[tooltipItem.datasetIndex] | |
131 | let label = data.labels[tooltipItem.index] | |
132 | if (label) label += ': ' | |
133 | else label = '' | |
134 | ||
135 | label += this.bytesPipe.transform(dataset.data[tooltipItem.index], 1) | |
136 | return label | |
137 | } | |
138 | } | |
139 | } | |
140 | } | |
141 | }) | |
142 | } | |
143 | ||
144 | async removeRedundancy (redundancy: VideoRedundancy) { | |
145 | const message = this.i18n('Do you really want to remove this video redundancy?') | |
146 | const res = await this.confirmService.confirm(message, this.i18n('Remove redundancy')) | |
147 | if (res === false) return | |
148 | ||
149 | this.redundancyService.removeVideoRedundancies(redundancy) | |
150 | .subscribe( | |
151 | () => { | |
152 | this.notifier.success(this.i18n('Video redundancies removed!')) | |
153 | this.loadData() | |
154 | }, | |
155 | ||
156 | err => this.notifier.error(err.message) | |
157 | ) | |
158 | ||
159 | } | |
160 | ||
161 | protected loadData () { | |
162 | const options = { | |
163 | pagination: this.pagination, | |
164 | sort: this.sort, | |
165 | target: this.displayType | |
166 | } | |
167 | ||
168 | this.redundancyService.listVideoRedundancies(options) | |
169 | .subscribe( | |
170 | resultList => { | |
171 | this.videoRedundancies = resultList.data | |
172 | this.totalRecords = resultList.total | |
173 | }, | |
174 | ||
175 | err => this.notifier.error(err.message) | |
176 | ) | |
177 | } | |
178 | ||
179 | private loadSelectLocalStorage () { | |
180 | const displayType = peertubeLocalStorage.getItem(VideoRedundanciesListComponent.LOCAL_STORAGE_DISPLAY_TYPE) | |
181 | if (displayType) this.displayType = displayType as VideoRedundanciesTarget | |
182 | } | |
183 | ||
184 | private saveSelectLocalStorage () { | |
185 | peertubeLocalStorage.setItem(VideoRedundanciesListComponent.LOCAL_STORAGE_DISPLAY_TYPE, this.displayType) | |
186 | } | |
187 | } |