2022-04-12 14:15:04 +02:00
|
|
|
import {Component, EventEmitter, Input, Output} from '@angular/core';
|
2020-07-01 14:11:57 +02:00
|
|
|
import {HostedByCollectedFrom} from "../../utils/result-preview/result-preview";
|
2020-07-13 16:42:34 +02:00
|
|
|
import {properties} from "../../../../environments/environment";
|
2017-12-19 13:53:46 +01:00
|
|
|
|
|
|
|
@Component({
|
2020-03-16 14:09:46 +01:00
|
|
|
selector: 'availableOn',
|
|
|
|
template: `
|
2022-04-12 14:15:04 +02:00
|
|
|
<div class="uk-margin-small-bottom uk-flex uk-flex-between">
|
|
|
|
<span *ngIf="viewAll && !lessBtn" class="clickable uk-h6 uk-flex uk-flex-middle" (click)="viewLessClick()">
|
|
|
|
<icon class="uk-margin-small-right" name="arrow_back" flex="true" ratio="1.2"></icon>
|
|
|
|
{{title}}
|
|
|
|
</span>
|
|
|
|
<span *ngIf="!viewAll || lessBtn" class="uk-margin-small-bottom uk-flex uk-flex-middle">
|
2022-04-16 09:47:30 +02:00
|
|
|
<span class="uk-text-light-grey uk-margin-small-right">Download from</span>
|
2022-04-12 14:15:04 +02:00
|
|
|
</span>
|
2022-06-09 15:45:39 +02:00
|
|
|
<a *ngIf="viewAll && lessBtn" (click)="viewAll = !viewAll; lessBtn=false;" class="view-more-less-link">View less</a>
|
|
|
|
<a *ngIf="availableOn && availableOn.length > threshold && !viewAll" class="view-more-less-link"
|
2022-04-12 14:15:04 +02:00
|
|
|
(click)="viewAllClick();">View all {{availableOn.length}} sources</a>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div *ngIf="availableOn" class="download-from uk-margin-small-bottom">
|
|
|
|
<div *ngFor="let instance of availableOn.slice(0, viewAll?availableOn.length:threshold) let i=index"
|
2022-04-16 09:47:30 +02:00
|
|
|
class="uk-flex uk-flex-top uk-padding-small uk-margin-small-bottom"
|
2022-06-09 16:51:58 +02:00
|
|
|
uk-tooltip [title]="instance.accessRight ? instance.accessRight : 'Not available'">
|
|
|
|
<span [class]="'uk-margin-small-right ' + (instance.accessRightIcon == 'lock_open' ? 'uk-text-success' : 'uk-text-meta')"
|
|
|
|
uk-tooltip [title]="instance.accessRight ? instance.accessRight : 'Not available'">
|
2022-04-16 09:47:30 +02:00
|
|
|
<icon [name]="instance.accessRightIcon" flex="true" type="outlined"></icon>
|
2020-03-16 14:09:46 +01:00
|
|
|
</span>
|
2020-05-20 22:34:29 +02:00
|
|
|
<div class="uk-width-expand uk-padding-small uk-padding-remove-left uk-padding-remove-vertical">
|
2022-04-16 09:47:30 +02:00
|
|
|
<span class="uk-text-emphasis">
|
|
|
|
<a *ngIf="instance.downloadUrl" [href]="instance.downloadUrl" target="_blank"
|
|
|
|
class="title uk-link-text uk-text-bold custom-external uk-display-inline-block">
|
|
|
|
{{instance.downloadNames.join("; ")}}
|
|
|
|
</a>
|
|
|
|
</span>
|
2022-04-12 14:15:04 +02:00
|
|
|
<div *ngIf="instance.types?.length > 0 || instance.years?.length > 0" class="uk-text-meta">
|
2022-01-07 11:01:22 +01:00
|
|
|
<span *ngIf="instance.types?.length > 0" class="uk-text-capitalize">{{instance.types.join(" . ")}}</span>
|
|
|
|
<span *ngIf="instance.types?.length > 0 && instance.years?.length > 0"> . </span>
|
|
|
|
<span *ngIf="instance.years?.length > 0">{{instance.years.join(" . ")}}</span>
|
2020-03-16 14:09:46 +01:00
|
|
|
</div>
|
2022-06-09 16:51:58 +02:00
|
|
|
<div *ngIf="instance.license" class="uk-text-meta uk-text-truncate" uk-tooltip [title]="instance.license">
|
2022-06-09 15:45:39 +02:00
|
|
|
License:
|
|
|
|
<a *ngIf="isUrl(instance.license); else elseBlock"
|
2022-06-29 12:56:19 +02:00
|
|
|
[href]="instance.license" target="_blank" class="custom-external uk-link-text">
|
2022-06-09 15:45:39 +02:00
|
|
|
{{instance.license}}
|
|
|
|
</a>
|
|
|
|
<ng-template #elseBlock> {{instance.license}}</ng-template>
|
|
|
|
</div>
|
2022-04-12 14:15:04 +02:00
|
|
|
<div *ngIf="instance.collectedNamesAndIds?.size > 0" class="uk-text-meta">
|
2022-01-07 11:01:22 +01:00
|
|
|
<span>Providers: </span>
|
2022-02-14 15:24:10 +01:00
|
|
|
<a *ngFor="let collectedName of getKeys(instance.collectedNamesAndIds); let i=index" [routerLink]="dataProviderUrl"
|
2022-06-29 12:56:19 +02:00
|
|
|
[queryParams]="{datasourceId: instance.collectedNamesAndIds.get(collectedName)}" class="uk-link-text">
|
2022-01-07 11:01:22 +01:00
|
|
|
{{collectedName}}<ng-container *ngIf="(i !== (instance.collectedNamesAndIds.size - 1))">; </ng-container>
|
2020-07-27 12:48:05 +02:00
|
|
|
</a>
|
2020-03-16 14:09:46 +01:00
|
|
|
</div>
|
|
|
|
</div>
|
2020-07-27 12:48:05 +02:00
|
|
|
</div>
|
2020-03-16 14:09:46 +01:00
|
|
|
</div>
|
2022-04-12 14:15:04 +02:00
|
|
|
<!-- <div *ngIf="showNum > threshold" class="uk-margin-bottom">-->
|
|
|
|
<!-- <a (click)="showNum = threshold;" class="uk-flex uk-flex-middle uk-flex-center">-->
|
|
|
|
<!-- <span>View less</span>-->
|
|
|
|
<!-- <span class="space uk-icon">-->
|
|
|
|
<!-- <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="chevron-up">-->
|
|
|
|
<!-- <polyline fill="none" stroke="#000" stroke-width="1.03" points="4 13 10 7 16 13"></polyline>-->
|
|
|
|
<!-- </svg>-->
|
|
|
|
<!-- </span>-->
|
|
|
|
<!-- </a>-->
|
|
|
|
<!-- </div>-->
|
|
|
|
<!-- <div *ngIf="showNum == threshold && availableOn && availableOn.length > 5" class="uk-margin-bottom">-->
|
|
|
|
<!-- <a (click)="showNum = availableOn.length;" class="uk-flex uk-flex-middle uk-flex-center">-->
|
|
|
|
<!-- <span>View more</span>-->
|
|
|
|
<!-- <span class="space uk-icon">-->
|
|
|
|
<!-- <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="chevron-down">-->
|
|
|
|
<!-- <polyline fill="none" stroke="#000" stroke-width="1.03" points="16 7 10 13 4 7"></polyline>-->
|
|
|
|
<!-- </svg>-->
|
|
|
|
<!-- </span>-->
|
|
|
|
<!-- </a>-->
|
|
|
|
<!-- </div>-->
|
2020-03-16 14:09:46 +01:00
|
|
|
`
|
|
|
|
})
|
2017-12-19 13:53:46 +01:00
|
|
|
|
|
|
|
export class AvailableOnComponent {
|
2020-07-01 14:11:57 +02:00
|
|
|
@Input() availableOn: HostedByCollectedFrom[];
|
2022-04-12 14:15:04 +02:00
|
|
|
@Input() viewAll: boolean = false;
|
|
|
|
@Output() viewAllClicked = new EventEmitter();
|
|
|
|
public lessBtn: boolean = false;
|
2022-04-16 09:47:30 +02:00
|
|
|
public threshold: number = 1;
|
2020-07-13 16:42:34 +02:00
|
|
|
public dataProviderUrl = properties.searchLinkToDataProvider.split('?')[0];
|
2022-04-12 14:15:04 +02:00
|
|
|
public title: string = "Download from";
|
2020-03-16 14:09:46 +01:00
|
|
|
|
|
|
|
constructor() {
|
|
|
|
}
|
|
|
|
|
2021-04-20 17:18:15 +02:00
|
|
|
ngOnInit() {}
|
2020-03-16 14:09:46 +01:00
|
|
|
|
|
|
|
public removeUnknown(value: string): string {
|
2021-03-31 11:34:41 +02:00
|
|
|
if (value.toLowerCase() === 'unknown') {
|
|
|
|
return null;
|
2017-12-19 13:53:46 +01:00
|
|
|
}
|
2020-03-16 14:09:46 +01:00
|
|
|
return value;
|
|
|
|
}
|
2022-02-14 15:24:10 +01:00
|
|
|
|
|
|
|
public getKeys( map) {
|
|
|
|
return Array.from(map.keys());
|
|
|
|
}
|
2022-04-12 14:15:04 +02:00
|
|
|
|
|
|
|
public viewAllClick() {
|
|
|
|
if(this.availableOn.length <= this.threshold*2) {
|
|
|
|
this.viewAll = true;
|
|
|
|
this.lessBtn = true;
|
|
|
|
} else {
|
|
|
|
this.viewAll = true;
|
|
|
|
this.viewAllClicked.emit('availableOn');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
public viewLessClick() {
|
|
|
|
this.viewAll = false;
|
|
|
|
this.viewAllClicked.emit("");
|
|
|
|
}
|
2022-06-09 15:45:39 +02:00
|
|
|
|
|
|
|
public isUrl(str: string): boolean {
|
|
|
|
return str.startsWith('http://') || str.startsWith('https://') || str.startsWith('//') || str.startsWith('www.');
|
|
|
|
}
|
2017-12-19 13:53:46 +01:00
|
|
|
}
|