File
Implements
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
Methods
|
showContentCreditsPopup
|
showContentCreditsPopup()
|
|
|
|
|
|
validateContent
|
validateContent()
|
|
|
|
|
|
contentFieldData
|
Type : any
|
|
|
|
fieldData
|
Type : []
|
Default value : []
|
|
|
|
readMore
|
Default value : false
|
|
|
|
showContentCreditsModal
|
Type : boolean
|
|
|
import { Component, OnInit, Input } from '@angular/core';
import * as _ from 'lodash-es';
import { ContentData, ResourceService } from '@sunbird/shared';
@Component({
selector: 'app-content-player-metadata',
templateUrl: './content-player-metadata.component.html',
styleUrls: ['./content-player-metadata.component.scss']
})
export class ContentPlayerMetadataComponent implements OnInit {
readMore = false;
metadata: any;
contentFieldData: any;
fieldData = [];
instance: string;
// conceptNames: any;
// filteredConcepts: any;
showContentCreditsModal: boolean;
@Input() contentData: ContentData;
constructor(public resourceService: ResourceService) { }
ngOnInit() {
this.metadata = { ...this.contentData };
this.validateContent();
this.instance = _.upperCase(this.resourceService.instance);
}
validateContent() {
this.fieldData = ['language', 'gradeLevel', 'subject', 'flagReasons', 'flaggedBy', 'flags', 'keywords',
'resourceTypes', 'attributions', 'primaryCategory', 'additionalCategories'];
_.forEach(this.metadata, (value, key) => {
if (_.compact(key) && _.includes(this.fieldData, key)) {
if (_.isString(value)) {
this.contentFieldData = [value];
this.metadata[key] = (_.isArray(this.contentFieldData)) ? (_.compact(this.contentFieldData).join(', ')) : '';
} else {
this.metadata[key] = (_.isArray(value)) ? (_.compact(value).join(', ')) : '';
}
}
});
}
showContentCreditsPopup () {
this.showContentCreditsModal = true;
}
}
<div class="sb-meta-data-container sb-meta-data-row-facing mt-24 content-player-metadata">
<ng-container *ngIf="metadata.description">
<h4 class="sb-section-title text-capitalize mb-16 d-block">
{{resourceService.frmelmnts.lbl.description}}
</h4>
<div *ngIf="!readMore">
<span class="overflow-word-wrap">{{metadata.description | slice:0:150 }} </span>
<span class="ui expand-or-minimize mouse-pointer" tabindex="0" (click)="readMore = !readMore" *ngIf="metadata.description.length > 150 && readMore === false">
{{resourceService.frmelmnts.lbl.readmore}}
</span>
</div>
<div *ngIf="readMore">
<span class="overflow-word-wrap">{{metadata.description}} </span>
<span class="ui expand-or-minimize mouse-pointer" tabindex="0" (click)="readMore = false">
{{resourceService.frmelmnts.lbl.readless}}
</span>
</div>
<div class="ui divider mt-24 mb-24"></div>
</ng-container>
<h4 class="sb-section-title text-capitalize mb-16 d-block">
{{resourceService.frmelmnts.lbl.contentinformation}}
</h4>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.title}}</dt>
<dd *ngIf="metadata.name">{{metadata.name}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts?.lbl?.createdInstanceName | interpolate:'{instance}': instance}}</dt>
<dd *ngIf="metadata.creator">{{metadata.creator}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl?.originalAuthor}}</dt>
<dd *ngIf="metadata.author">{{metadata.author}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl?.licenseTerms}}</dt>
<dd *ngIf="metadata && !(metadata.licenseDetails && metadata.licenseDetails['name']) && metadata.license">{{metadata.license}}‎</dd>
<dd *ngIf="metadata && metadata.licenseDetails && metadata.licenseDetails['name']">{{metadata.licenseDetails['name']}} {{metadata.licenseDetails['description']}}‎ <br /><a href="{{metadata.licenseDetails['url']}}" target="_blank">{{metadata.licenseDetails['url']}}</a></dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.orgDetails && metadata.orgDetails.orgName">
<dt>{{resourceService.frmelmnts.lbl?.publishedOnInstanceName | interpolate:'{instance}': instance}}</dt>
<dd>
<span class="d-inline-block">{{metadata?.organisation?.join(', ')}}</span>
<a ng-if="metadata.orgDetails?.email" href="mailto:{{metadata.orgDetails?.email}}?subject={{metadata.name}}">{{metadata.orgDetails?.email}}</a>
</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl?.copyRight}}</dt>
<dd>
<span *ngIf="metadata.copyright" class="d-inline-block mr-20">{{metadata.copyright}}
<span *ngIf="metadata.copyrightYear">, {{metadata.copyrightYear}}</span></span>
<a tabindex="0" (click)="showContentCreditsPopup()" title="{{resourceService.frmelmnts.lbl.contentCredits}}" class="cursor-pointer">
{{resourceService.frmelmnts.lbl.contentCredits}}
</a>
</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.medium | transposeTerms: 'frmelmnts.lbl.medium' : resourceService?.selectedLang}}</dt>
<dd *ngIf="metadata.medium">{{metadata.medium}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.board | transposeTerms: 'frmelmnts.lbl.board' : resourceService?.selectedLang}}</dt>
<dd *ngIf="metadata.board">{{metadata.board}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.class | transposeTerms: 'frmelmnts.lbl.class' : resourceService?.selectedLang}}</dt>
<dd *ngIf="metadata.gradeLevel">{{metadata.gradeLevel}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.subject | transposeTerms: 'frmelmnts.lbl.subject' : resourceService?.selectedLang}}</dt>
<dd *ngIf="metadata.subject">{{metadata.subject}}</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.createdOn">
<dt>{{resourceService.frmelmnts.lbl.createdon}}</dt>
<dd>{{metadata.createdOn | dateFormat }}</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.lastUpdatedOn">
<dt>{{resourceService.frmelmnts.lbl.lastupdate}}</dt>
<dd>{{metadata.lastUpdatedOn | dateFormat }}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.keywords}}</dt>
<dd *ngIf="metadata.keywords">{{metadata.keywords}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.contentType}}</dt>
<dd *ngIf="metadata.primaryCategory">{{metadata.primaryCategory}}</dd>
</dl>
<dl class="sb-meta-data">
<dt>{{resourceService.frmelmnts.lbl.additionalCategory}}</dt>
<dd *ngIf="metadata.additionalCategories">{{metadata.additionalCategories}}</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.status === 'Flagged' && metadata.flagReasons">
<dt>{{resourceService.frmelmnts.lbl.flaggedreason}}</dt>
<dd>{{metadata.flagReasons}}</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.status === 'Flagged' && metadata.flaggedBy">
<dt>{{resourceService.frmelmnts.lbl.flaggedby}}</dt>
<dd>{{metadata.flaggedBy}}</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.status === 'Flagged' && metadata.flags">
<dt>{{resourceService.frmelmnts.lbl.flaggeddescription}}</dt>
<dd>{{metadata.flags}}</dd>
</dl>
</div>
<div *ngIf="metadata && metadata.originData">
<div class="ui divider my-24"></div>
<h4 class="sb-section-title mb-16 d-block">{{resourceService.frmelmnts?.lbl?.contentcopiedtitle}}</h4>
<div class="sb-meta-data-container sb-meta-data-row-facing mt-24">
<dl class="sb-meta-data" *ngIf="metadata.originData.name">
<dt>{{resourceService.frmelmnts?.lbl?.contenttype}}</dt>
<dd>{{metadata.originData.name}}</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.originData.author">
<dt>{{resourceService.frmelmnts.lbl?.originalAuthor}}</dt>
<dd *ngIf="metadata.creator">{{metadata.originData.author}}</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.originData.license">
<dt>{{resourceService.frmelmnts.lbl?.licenseTerms}}</dt>
<dd *ngIf="metadata.creator">{{metadata.originData.license}}‎</dd>
</dl>
<dl class="sb-meta-data" *ngIf="metadata.originData.organisation">
<dt>{{resourceService.frmelmnts.lbl?.publishedOnInstanceName | interpolate:'{instance}': instance}}</dt>
<dd>
<span class="d-inline-block">{{metadata.originData.organisation.join(', ')}}</span>
<a ng-if="metadata.orgDetails?.email" href="mailto:{{metadata.orgDetails?.email}}?subject={{metadata.name}}">{{metadata.originData.orgDetails?.email}}</a>
</dd>
</dl>
</div>
</div>
<app-content-credits [contentData]="metadata" *ngIf="showContentCreditsModal" (close)="showContentCreditsModal = false"></app-content-credits>
@use "@project-sunbird/sb-styles/assets/mixins/mixins" as *;
@use 'components/metadata' as *;
Legend
Html element with directive