WIP : Indicate to users how "trending" works (#1458)
* Get the INTERVAL_DAYS const in the video-trending component * Change Trending section title * Add a tooltip to explain how trending section works * Minor CSS fix for the my-feed popover next to the titlepage
This commit is contained in:
parent
e902e03f0f
commit
9b4b15f91c
|
@ -87,6 +87,11 @@ export class ServerService {
|
|||
enabled: false
|
||||
}
|
||||
}
|
||||
},
|
||||
trending: {
|
||||
videos: {
|
||||
intervalDays: 0
|
||||
}
|
||||
}
|
||||
}
|
||||
private videoCategories: Array<VideoConstant<number>> = []
|
||||
|
|
|
@ -1,8 +1,11 @@
|
|||
<div [ngClass]="{ 'margin-content': marginContent }">
|
||||
<div class="videos-header">
|
||||
<div *ngIf="titlePage" class="title-page title-page-single">
|
||||
{{ titlePage }}
|
||||
<div placement="bottom" [ngbTooltip]="titleTooltip" container="body">
|
||||
{{ titlePage }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<my-feed [syndicationItems]="syndicationItems"></my-feed>
|
||||
|
||||
<div class="moderation-block" *ngIf="displayModerationBlock">
|
||||
|
|
|
@ -19,8 +19,8 @@
|
|||
|
||||
my-feed {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
min-width: 60px;
|
||||
}
|
||||
|
||||
.moderation-block {
|
||||
|
|
|
@ -39,6 +39,8 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy {
|
|||
ownerDisplayType: OwnerDisplayType = 'account'
|
||||
firstLoadedPage: number
|
||||
displayModerationBlock = false
|
||||
trendingDays: number
|
||||
titleTooltip: string
|
||||
|
||||
protected baseVideoWidth = 215
|
||||
protected baseVideoHeight = 205
|
||||
|
|
|
@ -8,7 +8,7 @@ import { VideoSortField } from '../../shared/video/sort-field.type'
|
|||
import { VideoService } from '../../shared/video/video.service'
|
||||
import { I18n } from '@ngx-translate/i18n-polyfill'
|
||||
import { ScreenService } from '@app/shared/misc/screen.service'
|
||||
import { Notifier } from '@app/core'
|
||||
import { Notifier, ServerService } from '@app/core'
|
||||
|
||||
@Component({
|
||||
selector: 'my-videos-trending',
|
||||
|
@ -19,6 +19,7 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit,
|
|||
titlePage: string
|
||||
currentRoute = '/videos/trending'
|
||||
defaultSort: VideoSortField = '-trending'
|
||||
trendingDays: number
|
||||
|
||||
constructor (
|
||||
protected router: Router,
|
||||
|
@ -27,12 +28,19 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit,
|
|||
protected authService: AuthService,
|
||||
protected location: Location,
|
||||
protected screenService: ScreenService,
|
||||
private serverService: ServerService,
|
||||
protected i18n: I18n,
|
||||
private videoService: VideoService
|
||||
) {
|
||||
super()
|
||||
|
||||
this.titlePage = i18n('Trending')
|
||||
this.trendingDays = this.serverService.getConfig().trending.videos.intervalDays
|
||||
|
||||
this.titlePage = this.i18n('Trending for the last ')
|
||||
this.trendingDays === 1 ? this.titlePage += '24 hours' : this.titlePage += this.trendingDays + ' days'
|
||||
|
||||
this.titleTooltip = this.i18n('trending videos are those totalizing the greatest number of views during the last ')
|
||||
this.trendingDays === 1 ? this.titleTooltip += '24 hours.' : this.titleTooltip += this.trendingDays + ' days.'
|
||||
}
|
||||
|
||||
ngOnInit () {
|
||||
|
|
|
@ -120,6 +120,11 @@ async function getConfig (req: express.Request, res: express.Response) {
|
|||
user: {
|
||||
videoQuota: CONFIG.USER.VIDEO_QUOTA,
|
||||
videoQuotaDaily: CONFIG.USER.VIDEO_QUOTA_DAILY
|
||||
},
|
||||
trending: {
|
||||
videos: {
|
||||
intervalDays: CONFIG.TRENDING.VIDEOS.INTERVAL_DAYS
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -78,4 +78,10 @@ export interface ServerConfig {
|
|||
videoQuota: number
|
||||
videoQuotaDaily: number
|
||||
}
|
||||
|
||||
trending: {
|
||||
videos: {
|
||||
intervalDays: number
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue