File
Implements
Constructor
constructor(navParams: NavParams, platform: Platform, popOverCtrl: PopoverController, telemetrygeneratorService: TelemetryGeneratorService)
|
|
|
Parameters :
| Name |
Type |
Optional |
| navParams |
NavParams
|
No
|
| platform |
Platform
|
No
|
| popOverCtrl |
PopoverController
|
No
|
| telemetrygeneratorService |
TelemetryGeneratorService
|
No
|
|
Methods
|
ionViewDidLoad
|
ionViewDidLoad()
|
|
|
|
|
|
mergeProperties
|
mergeProperties(mergeProp)
|
|
|
Parameters :
| Name |
Optional |
| mergeProp |
No
|
|
|
backButtonFunc
|
Default value : undefined
|
|
|
|
pageId
|
Type : string
|
Default value : ''
|
|
|
|
userId
|
Type : string
|
Default value : ''
|
|
|
import { Component, OnInit } from '@angular/core';
import { NavParams, Platform, PopoverController } from '@ionic/angular';
import { TelemetryGeneratorService } from '@app/services/telemetry-generator.service';
import { Environment, InteractType, InteractSubtype } from '@app/services/telemetry-constants';
import { ContentUtil } from '@app/util/content-util';
@Component({
selector: 'app-view-credits',
templateUrl: './view-credits.component.html',
styleUrls: ['./view-credits.component.scss'],
})
export class ViewCreditsComponent implements OnInit {
userId = '';
backButtonFunc = undefined;
content: any;
rollUp: any;
correlation: any;
pageId = '';
constructor(
private navParams: NavParams,
private platform: Platform,
private popOverCtrl: PopoverController,
private telemetrygeneratorService: TelemetryGeneratorService
) {}
ngOnInit(): void {
this.backButtonFunc = this.platform.backButton.subscribeWithPriority(11, () => {
this.popOverCtrl.dismiss();
this.backButtonFunc.unsubscribe();
});
}
ionViewDidLoad(): void {
this.content = this.navParams.get('content');
this.pageId = this.navParams.get('pageId');
this.rollUp = this.navParams.get('rollUp');
this.correlation = this.navParams.get('correlation');
const telemetryObject = ContentUtil.getTelemetryObject(this.content);
this.telemetrygeneratorService.generateInteractTelemetry(InteractType.TOUCH,
InteractSubtype.CREDITS_CLICKED,
Environment.HOME,
this.pageId,
telemetryObject,
undefined,
this.rollUp,
this.correlation
);
}
mergeProperties(mergeProp) {
return ContentUtil.mergeProperties(this.content, mergeProp);
}
cancel() {
this.popOverCtrl.dismiss();
if (this.backButtonFunc) {
this.backButtonFunc.unsubscribe();
}
}
}
<ion-header>
<ion-row class="display-inline">
<div class="ion-float-start" style="margin-left : 10px;">
<p class="title heading1">{{ 'CREDITS' | translate }}</p>
</div>
<div class="ion-float-end" (click)="cancel()">
<img src="assets/imgs/ic_action_close.png" alt="" class="tool-icon ion-float-end" />
</div>
</ion-row>
<br />
</ion-header>
<ion-content>
<ion-grid class="ion-padding">
<div *ngIf="content?.creators || content?.creator">
<ion-row class="text-gray-color">
{{ 'CREATORS' | translate }}
</ion-row>
<ion-row class="content">
{{mergeProperties(['creators', 'creator'])}}
</ion-row>
</div>
<div *ngIf="content?.contributors || content?.owner">
<ion-row class="text-gray-color">
{{ 'CONTRIBUTORS' | translate }}
</ion-row>
<ion-row class="content">
{{mergeProperties(['contributors', 'owner'])}}
</ion-row>
</div>
<div *ngIf="content?.attributions">
<ion-row class="text-gray-color">
{{ 'ATTRIBUTIONS' | translate }}
</ion-row>
<ion-row class="content">
{{content?.attributions}}
</ion-row>
</div>
</ion-grid>
</ion-content>
@import "src/assets/styles/_custom-mixins.scss";
@import "src/assets/styles/_variables.scss";
:host {
.display-inline {
display: inline;
}
.heading1 {
color: map-get($colors, dark);
margin-bottom: 3%;
font-size: 1.8rem;
padding: 0;
margin-left: 0;
font-weight: bolder !important;
}
.heading2 {
margin-top: 5px;
}
.text-gray-color {
color: gray;
margin-top: 6px;
font-size: 1.3rem;
margin-bottom: 5px;
}
.subtitle {
text-transform: capitalize;
font-size: 1.3rem;
font-weight: 700 !important;
margin-bottom: 10px;
color: map-get($colors, primary_black);
}
.content {
margin-bottom: 10px;
color: map-get($colors, primary_black);
}
.subheader {
margin-bottom: 5px;
}
.feedback {
border-top: 0px;
@include ltr() {
border-left: 0px;
border-right: 0px;
}
@include rtl() {
border-left: 0px;
border-right: 0px;
}
border-bottom: 2px solid gray;
padding-top: 12px;
}
}
Legend
Html element with directive