src/app/modules/workspace/components/flag-conentplayer/flag-conentplayer.component.ts
OnInit
selector | app-flag-conentplayer |
styleUrls | ./flag-conentplayer.component.scss |
templateUrl | ./flag-conentplayer.component.html |
Properties |
|
Methods |
constructor(resourceService: ResourceService, activatedRoute: ActivatedRoute, playerService: PlayerService, windowScrollService: WindowScrollService, toasterService: ToasterService, navigationHelperService: NavigationHelperService, configService: ConfigService, contentService: ContentService, routerNavigationService: RouterNavigationService, permissionService: PermissionService, userService: UserService)
|
||||||||||||||||||||||||||||||||||||||||||||||||
Constructor to create injected service(s) object Default method of Draft Component class
Parameters :
|
acceptContentFlag |
acceptContentFlag()
|
acceptContentFlag api call
Returns :
void
|
close |
close()
|
closes conent player and revert to previous url
Returns :
void
|
discardContentFlag |
discardContentFlag()
|
discardContentFlag api call
Returns :
void
|
getContent |
getContent()
|
used to fetch content details and player config. On success launches player.
Returns :
void
|
ngOnInit |
ngOnInit()
|
Returns :
void
|
tryAgain |
tryAgain()
|
retry launching player with same content details
Returns :
void
|
Public activatedRoute |
Type : ActivatedRoute
|
Public configService |
Type : ConfigService
|
reference of ConfigService. |
contentData |
Type : ContentData
|
contain contentData |
contentId |
Type : string
|
content id |
Public contentService |
Type : ContentService
|
reference of ContentService. |
errorMessage |
Type : string
|
contain error message |
flagActionButton |
Default value : false
|
isShowFlagActionButton to show button |
loaderMessage |
Type : ILoaderMessage
|
loader message |
Public navigationHelperService |
Type : NavigationHelperService
|
Public permissionService |
Type : PermissionService
|
reference of permissionService service. |
playerConfig |
Type : PlayerConfig
|
contains player configuration |
Public playerService |
Type : PlayerService
|
To call PlayerService service |
Public resourceService |
Type : ResourceService
|
To call resource service which helps to use language constant |
Public routerNavigationService |
Type : RouterNavigationService
|
To navigate back to parent component |
showError |
Default value : false
|
Flag to show error |
showLoader |
Default value : true
|
To show / hide loader |
Private toasterService |
Type : ToasterService
|
To show toaster(error, success etc) after any API calls |
Private userService |
Type : UserService
|
Refrence of UserService |
Public windowScrollService |
Type : WindowScrollService
|
To call PlayerService service |
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import {
ResourceService, ILoaderMessage, PlayerConfig, ContentData,
WindowScrollService, ToasterService, NavigationHelperService,
ConfigService, RouterNavigationService
} from '@sunbird/shared';
import { PlayerService, ContentService, PermissionService, UserService } from '@sunbird/core';
@Component({
selector: 'app-flag-conentplayer',
templateUrl: './flag-conentplayer.component.html',
styleUrls: ['./flag-conentplayer.component.scss']
})
export class FlagConentplayerComponent implements OnInit {
/**
* loader message
*/
loaderMessage: ILoaderMessage;
/**
* To show / hide loader
*/
showLoader = true;
/**
* Flag to show error
*/
showError = false;
/**
* isShowFlagActionButton to show button
*/
flagActionButton = false;
/**
* content id
*/
contentId: string;
/**
* contain error message
*/
errorMessage: string;
/**
* To call resource service which helps to use language constant
*/
public resourceService: ResourceService;
/**
* To call PlayerService service
*/
public playerService: PlayerService;
/**
* To call PlayerService service
*/
public windowScrollService: WindowScrollService;
/**
* contains player configuration
*/
playerConfig: PlayerConfig;
/**
* contain contentData
*/
contentData: ContentData;
/**
* To show toaster(error, success etc) after any API calls
*/
private toasterService: ToasterService;
/**
* reference of ConfigService.
*/
public configService: ConfigService;
/**
* reference of ContentService.
*/
public contentService: ContentService;
/**
* Refrence of UserService
*/
private userService: UserService;
/**
* To navigate back to parent component
*/
public routerNavigationService: RouterNavigationService;
/**
* reference of permissionService service.
*/
public permissionService: PermissionService;
/**
* Constructor to create injected service(s) object
Default method of Draft Component class
* @param {ResourceService} resourceService Reference of resourceService
* @param {ToasterService} toasterService Reference of ToasterService
* @param {ContentService} contentService Reference of contentService
* @param {configService} configService Reference of configService
* @param {PermissionService} permissionService Reference of PermissionService
* @param {UserService} UserService Reference of UserService
*/
constructor(resourceService: ResourceService, public activatedRoute: ActivatedRoute,
playerService: PlayerService, windowScrollService: WindowScrollService,
toasterService: ToasterService, public navigationHelperService: NavigationHelperService,
configService: ConfigService, contentService: ContentService,
routerNavigationService: RouterNavigationService,
permissionService: PermissionService,
userService: UserService) {
this.resourceService = resourceService;
this.playerService = playerService;
this.windowScrollService = windowScrollService;
this.toasterService = toasterService;
this.configService = configService;
this.contentService = contentService;
this.routerNavigationService = routerNavigationService;
this.permissionService = permissionService;
this.userService = userService;
this.loaderMessage = {
'loaderMessage': this.resourceService.messages.stmsg.m0025,
};
}
ngOnInit() {
this.activatedRoute.params.subscribe((params) => {
this.contentId = params.contentId;
this.getContent();
});
}
/**
* used to fetch content details and player config. On success launches player.
*/
getContent() {
this.showLoader = true;
this.playerService.getContent(this.contentId).subscribe(
(response) => {
const contentDetails = {
contentId: this.contentId,
contentData: response.result.content
};
this.playerConfig = this.playerService.getConfig(contentDetails);
this.contentData = response.result.content;
this.showLoader = false;
},
(err) => {
this.showError = true;
this.errorMessage = this.resourceService.messages.stmsg.m0009;
this.toasterService.error(this.resourceService.messages.fmsg.m0015);
});
}
/**
* retry launching player with same content details
* @memberof ContentPlayerComponent
*/
tryAgain() {
this.showError = false;
this.getContent();
}
/**
* closes conent player and revert to previous url
* @memberof ContentPlayerComponent
*/
close() {
this.navigationHelperService.navigateToPreviousUrl('/workspace/content/flagged/1');
}
/**
* acceptContentFlag api call
*/
acceptContentFlag() {
const option = {
url: `${this.configService.urlConFig.URLS.CONTENT.ACCEPT_FLAG}/${this.contentId}`,
data: { 'request': { versionKey: this.contentData.versionKey} }
};
this.contentService.post(option).subscribe(response => {
this.toasterService.success(this.resourceService.messages.smsg.m0007);
this.close();
}, (err) => {
this.toasterService.error(this.resourceService.messages.fmsg.m0024);
});
}
/**
* discardContentFlag api call
*/
discardContentFlag() {
const option = {
url: `${this.configService.urlConFig.URLS.CONTENT.DISCARD_FLAG}/${this.contentId}`,
data: { 'request': { } }
};
this.contentService.post(option).subscribe(response => {
this.toasterService.success(this.resourceService.messages.smsg.m0008);
this.close();
}, (err) => {
this.toasterService.error(this.resourceService.messages.fmsg.m0025);
});
}
}
<div class="ui grid relative9">
<div class="one wide column"></div>
<div class="ten wide column">
<div class="row" *ngIf="showLoader">
<app-loader [data]="loaderMessage"></app-loader>
</div>
<div class="row mt-10" *ngIf="!showLoader && contentData">
<div class="videosegment ui clearing segment">
<div class="ten wide column">
<span class="ui HomeAccordianHeading left floated header">
{{contentData.name}}
</span>
</div>
<div class="two wide column">
<h5 class="ui right floated basic icon circular button mouse-pointer" tabindex="0" (click)="close()">
<i class="ui remove icon" tabindex="0" (click)="close()"></i>
</h5>
</div>
</div>
<div class="aspectratio sbt-shadow-radius" data-ratio="16:9" id="help-video-aspect-ratio" #aspectRatio>
<app-player class="content-player" [playerConfig]="playerConfig"></app-player>
</div>
</div>
<div class="row mt-10" *ngIf="!showLoader">
<div class="mt-5 videosegment ui clearing segment">
<div class="d-flex flex-ai-center flex-jc-flex-end" *ngIf="userService.userid !== contentData.createdBy && permissionService.permissionAvailable && contentData && contentData.status === 'Flagged'"
appPermission [permission]="['FLAG_REVIEWER']">
<button class="sb-btn sb-btn-normal sb-btn-outline-primary mr-8" tabindex="0" (click)="discardContentFlag()">
{{resourceService?.frmelmnts?.btn?.discard}}
</button>
<button class="sb-btn sb-btn-normal sb-btn-primary" tabindex="0" (click)="acceptContentFlag()">
{{resourceService?.frmelmnts?.btn?.accept}}
</button>
</div>
</div>
</div>
<div class="ui grid" *ngIf="!showLoader && contentData">
<div class="eight wide column">
<app-content-player-metadata [contentData]="contentData"></app-content-player-metadata>
</div>
<div class="four wide column">
</div>
</div>
<div *ngIf="showError">
<div class="ui active dimmer inverted">
<div class="content">
<div class="center">
<h2 class="ui header red">
{{errorMessage}}
</h2>
<span>
<button class="ui button" tabindex="0" (click)="tryAgain()">{{resourceService.frmelmnts.btn.tryagain}}</button>
</span>
<span>
<button class="ui red button" tabindex="0" (click)="close()">{{resourceService.frmelmnts.btn.close}}</button>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
./flag-conentplayer.component.scss
@use "@project-sunbird/sb-styles/assets/mixins/mixins"as *;
@use 'pages/player-fullScreen'as *;