[plugins-functionality | WIP] move affiliations component to be used in library - plugins
This commit is contained in:
parent
25629733e9
commit
82f2baf865
|
@ -1,69 +0,0 @@
|
||||||
<ng-template #card let-organization="organization" let-fullView="fullView">
|
|
||||||
<div [class]="fullView?'uk-card-body uk-height-1-1 uk-flex uk-flex-column uk-flex-around':''">
|
|
||||||
<div class="affiliation-logo">
|
|
||||||
<img *ngIf="organization.logo_url"
|
|
||||||
[src]="organization.logo_url | urlPrefix"
|
|
||||||
alt="{{(organization.name)?organization.name:''}} logo"
|
|
||||||
class="uk-blend-multiply uk-height-max-xsmall" loading="lazy">
|
|
||||||
</div>
|
|
||||||
<div class="affiliation-name multi-line-ellipsis lines-3" *ngIf="organization.name && fullView">
|
|
||||||
<p class="uk-text-emphasis uk-text-bold uk-margin-remove">
|
|
||||||
{{organization.name}}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<ng-container *ngIf="affiliations.length > 0">
|
|
||||||
<div *ngIf="showLoading" class="uk-animation-fade uk-width-1-1" role="alert">
|
|
||||||
<span class="loading-gif uk-align-center"></span>
|
|
||||||
</div>
|
|
||||||
<div *ngIf="longView"
|
|
||||||
class="uk-child-width-1-5@xl uk-child-width-1-4@l uk-child-width-1-3@m uk-child-width-1-2@s uk-text-center uk-grid"
|
|
||||||
uk-height-match="target: .affiliation-logo, .affiliation-name"
|
|
||||||
uk-scrollspy="cls: uk-animation-fade; target: .uk-card; repeat: false"
|
|
||||||
uk-grid>
|
|
||||||
<div *ngFor="let affiliation of affiliations;">
|
|
||||||
<div>
|
|
||||||
<div class="uk-card uk-card-default uk-card-hover affiliationCard">
|
|
||||||
<a *ngIf="affiliation.website_url" target="_blank" [href]="affiliation.website_url | urlPrefix" class="uk-link-reset">
|
|
||||||
<ng-container *ngTemplateOutlet="card; context: { organization: affiliation, fullView: true}"></ng-container>
|
|
||||||
</a>
|
|
||||||
<span *ngIf="!affiliation.website_url" class="uk-link-reset">
|
|
||||||
<ng-container *ngTemplateOutlet="card; context: { organization: affiliation, fullView: true}"></ng-container>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div *ngIf="affiliations.length > 0 && communityFirstPage && !longView" class="uk-grid uk-grid-large" uk-grid>
|
|
||||||
<div class="uk-width-1-3@m">
|
|
||||||
<h2 class="uk-h1">
|
|
||||||
Supporting Organizations
|
|
||||||
</h2>
|
|
||||||
<a class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text uk-text-default uk-margin-top"
|
|
||||||
routerLinkActive="router-link-active" routerLink="/organizations">
|
|
||||||
<span class="uk-flex uk-flex-middle">
|
|
||||||
<span>Browse all</span>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="uk-width-2-3@m">
|
|
||||||
<div class="uk-grid uk-grid-large uk-child-width-1-3@m uk-child-width-1-2@s supportingOrganizations" uk-grid>
|
|
||||||
<div *ngFor="let affiliation of affiliations.slice(0,9);">
|
|
||||||
<a *ngIf="affiliation.website_url" target="_blank" [href]="affiliation.website_url | urlPrefix" class="uk-link-reset">
|
|
||||||
<ng-container *ngTemplateOutlet="card; context: {organization: affiliation, fullView: false}"></ng-container>
|
|
||||||
</a>
|
|
||||||
<span *ngIf="!affiliation.website_url" class="uk-link-reset">
|
|
||||||
<ng-container *ngTemplateOutlet="card; context: {organization: affiliation, fullView: false}"></ng-container>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-container>
|
|
||||||
|
|
||||||
<!--<div *ngIf="affiliations.length == 0 && longView" class="uk-animation-fade uk-alert uk-alert-primary" role="alert">-->
|
|
||||||
<!-- No affiliations available-->
|
|
||||||
<!--</div>-->
|
|
|
@ -1,18 +0,0 @@
|
||||||
.affiliationCard {
|
|
||||||
width: 260px !important;
|
|
||||||
height: 260px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.supportingOrganizations a {
|
|
||||||
img, svg {
|
|
||||||
-webkit-filter: grayscale(1);
|
|
||||||
filter: grayscale(1);
|
|
||||||
transition-duration: 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover img, svg {
|
|
||||||
-webkit-filter: grayscale(0);
|
|
||||||
filter: grayscale(0);
|
|
||||||
transition-duration: 0.3s;
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,58 +0,0 @@
|
||||||
import {Component, Input} from '@angular/core';
|
|
||||||
import {ActivatedRoute} from '@angular/router';
|
|
||||||
import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties';
|
|
||||||
import {AffiliationService} from "../openaireLibrary/connect/affiliations/affiliation.service";
|
|
||||||
import {Affiliation} from "../openaireLibrary/utils/entities/CuratorInfo";
|
|
||||||
import {ConnectHelper} from "../openaireLibrary/connect/connectHelper";
|
|
||||||
import {Subscriber} from "rxjs";
|
|
||||||
import {properties} from "../../environments/environment";
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'affiliations',
|
|
||||||
templateUrl: './affiliations.component.html',
|
|
||||||
styleUrls: ['./affiliations.component.less']
|
|
||||||
})
|
|
||||||
export class AffiliationsComponent {
|
|
||||||
@Input() getAffiliationsFromAPI: boolean = false;
|
|
||||||
@Input() longView: boolean = false;
|
|
||||||
@Input() communityFirstPage: boolean = false;
|
|
||||||
@Input() affiliationsInSlider: number = 5;
|
|
||||||
@Input() affiliations: Affiliation[] = [];
|
|
||||||
@Input() sliderOptions = '';
|
|
||||||
@Input() arrows = true;
|
|
||||||
|
|
||||||
public showLoading: boolean = false;
|
|
||||||
public communityId: string;
|
|
||||||
public properties: EnvProperties = properties;
|
|
||||||
private subscriptions = [];
|
|
||||||
|
|
||||||
constructor(private route: ActivatedRoute, private affiliationService: AffiliationService) {
|
|
||||||
}
|
|
||||||
|
|
||||||
public ngOnInit() {
|
|
||||||
this.communityId = ConnectHelper.getCommunityFromDomain(properties.domain);
|
|
||||||
if (this.getAffiliationsFromAPI) {
|
|
||||||
this.showLoading = true;
|
|
||||||
this.affiliationService.initAffiliations(this.communityId);
|
|
||||||
this.subscriptions.push(this.affiliationService.affiliations.subscribe(
|
|
||||||
affiliations => {
|
|
||||||
this.affiliations = affiliations.filter((affiliation) => this.longView || !!affiliation['logo_url']);
|
|
||||||
this.showLoading = false;
|
|
||||||
},
|
|
||||||
error => {
|
|
||||||
console.error("Affiliations Component: Error getting affiliations for community with id: " + this.communityId, error);
|
|
||||||
this.showLoading = false;
|
|
||||||
}
|
|
||||||
));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnDestroy() {
|
|
||||||
this.subscriptions.forEach(subscription => {
|
|
||||||
if (subscription instanceof Subscriber) {
|
|
||||||
subscription.unsubscribe();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.affiliationService.clearSubscriptions();
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,26 +0,0 @@
|
||||||
import {NgModule} from '@angular/core';
|
|
||||||
|
|
||||||
import {PreviousRouteRecorder} from '../openaireLibrary/utils/piwik/previousRouteRecorder.guard';
|
|
||||||
import {IsRouteEnabled} from '../openaireLibrary/error/isRouteEnabled.guard'
|
|
||||||
import {RouterModule} from '@angular/router';
|
|
||||||
|
|
||||||
import {AffiliationsComponent} from './affiliations.component';
|
|
||||||
import {AffiliationService} from "../openaireLibrary/connect/affiliations/affiliation.service";
|
|
||||||
import {CommonModule} from "@angular/common";
|
|
||||||
import {UrlPrefixModule} from "../openaireLibrary/utils/pipes/url-prefix.module";
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule, RouterModule, UrlPrefixModule
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
AffiliationsComponent
|
|
||||||
],
|
|
||||||
providers:[PreviousRouteRecorder, IsRouteEnabled, AffiliationService],
|
|
||||||
exports: [
|
|
||||||
AffiliationsComponent
|
|
||||||
]
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
export class AffiliationsModule{}
|
|
|
@ -24,7 +24,7 @@ import {SearchProjectsServiceModule} from '../openaireLibrary/connect/projects/s
|
||||||
import {SearchResearchResultsServiceModule} from "../openaireLibrary/services/searchResearchResultsService.module";
|
import {SearchResearchResultsServiceModule} from "../openaireLibrary/services/searchResearchResultsService.module";
|
||||||
import {SearchResultsModule} from "../openaireLibrary/searchPages/searchUtils/searchResults.module";
|
import {SearchResultsModule} from "../openaireLibrary/searchPages/searchUtils/searchResults.module";
|
||||||
import {CuratorsModule} from "../openaireLibrary/connect/components/curators/curators.module";
|
import {CuratorsModule} from "../openaireLibrary/connect/components/curators/curators.module";
|
||||||
import {AffiliationsModule} from "../affiliations/affiliations.module";
|
import {AffiliationsModule} from "../openaireLibrary/connect/affiliations/affiliations.module";
|
||||||
import {SEOServiceModule} from "../openaireLibrary/sharedComponents/SEO/SEOService.module";
|
import {SEOServiceModule} from "../openaireLibrary/sharedComponents/SEO/SEOService.module";
|
||||||
import {MatSelectModule} from "@angular/material/select";
|
import {MatSelectModule} from "@angular/material/select";
|
||||||
import {EntitiesSelectionModule} from "../openaireLibrary/searchPages/searchUtils/entitiesSelection.module";
|
import {EntitiesSelectionModule} from "../openaireLibrary/searchPages/searchUtils/entitiesSelection.module";
|
||||||
|
|
|
@ -6,7 +6,7 @@ import {IsRouteEnabled} from '../../openaireLibrary/error/isRouteEnabled.guard'
|
||||||
import {OrganizationsPageComponent} from './organizationsPage.component';
|
import {OrganizationsPageComponent} from './organizationsPage.component';
|
||||||
import {OrganizationsPageRoutingModule} from './organizationsPage-routing.module';
|
import {OrganizationsPageRoutingModule} from './organizationsPage-routing.module';
|
||||||
|
|
||||||
import {AffiliationsModule} from "../../affiliations/affiliations.module";
|
import {AffiliationsModule} from "../../openaireLibrary/connect/affiliations/affiliations.module";
|
||||||
import {HelperModule} from "../../openaireLibrary/utils/helper/helper.module";
|
import {HelperModule} from "../../openaireLibrary/utils/helper/helper.module";
|
||||||
import {CommonModule} from "@angular/common";
|
import {CommonModule} from "@angular/common";
|
||||||
import {HtmlPagesModule} from "../htmlPages.module";
|
import {HtmlPagesModule} from "../htmlPages.module";
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
Subproject commit 6cef9ebed0db7ecbcca023bae824239106907960
|
Subproject commit 651102a5ba049b71bed8eb6a85a8d02cefcb24cc
|
|
@ -1 +1 @@
|
||||||
Subproject commit 52eca9abe84c941a7e78a5690f273d8c8e3194f9
|
Subproject commit 37639eab68c63a506b7df10c42e3379c4a05d94d
|
Loading…
Reference in New Issue