MaDgIK
/
explore-services
13
0
Fork 0
Code Issues Pull Requests Projects Releases 17 Wiki Activity

Merged with origin/master

Browse Source
angular-14
Konstantina Galouni 2 years ago
parent cbdfada293 4d35658d05
commit 578b79b1c2
9 changed files with 334 additions and 159 deletions
Show Stats Download Patch File Download Diff File

25
explore/src/app/app-routing.module.ts
Unescape Escape View File

@ -1,34 +1,35 @@
import {NgModule} from '@angular/core';
import {PreloadAllModules, RouterModule, Routes} from '@angular/router';
import {RouterModule, Routes} from '@angular/router';
import {OpenaireErrorPageComponent} from './error/errorPage.component';
import {PageURLResolverComponent} from "./openaireLibrary/utils/pageURLResolver.component";
const routes: Routes = [
// Other Pages
{path: '', loadChildren: () => import('./home/home.module').then(m => m.HomeModule)},
//{ path: 'home', loadChildren: './home/home.module#HomeModule'},
{path: 'home', redirectTo: '', pathMatch: 'full'},
{path: 'mail-preferences', loadChildren: () => import('./userEmailPreferences/mailPrefs.module').then(m => m.LibMailPrefsModule)},
{path: 'sdgs', loadChildren: () => import('./sdg/sdg.module').then(m => m.SdgModule)},
{path: 'fields-of-science', loadChildren: () => import('./fos/fos.module').then(m => m.FosModule)},
{path: 'contact-us', loadChildren: () => import('./contact/contact.module').then(m => m.ContactModule)},
{path: 'fields-of-science', loadChildren: () => import('./fos/fos.module').then(m => m.FosModule), data: {extraOffset: 100}},
{path: 'contact-us', loadChildren: () => import('./contact/contact.module').then(m => m.ContactModule), data: {hasQuickContact: false}},
// ORCID Pages
{path: 'orcid', loadChildren: () => import('./orcid/orcid.module').then(m => m.LibOrcidModule)},
{path: 'my-orcid-links', loadChildren: () => import('./orcid/my-orcid-links/myOrcidLinks.module').then(m => m.LibMyOrcidLinksModule)},
// Landing Pages
{path: 'search/result', loadChildren: () => import('./landingPages/result/libResult.module').then(m => m.LibResultModule)},
{path: 'search/publication', loadChildren: () => import('./landingPages/publication/libPublication.module').then(m => m.LibPublicationModule)},
{path: 'search/dataset', loadChildren: () => import('./landingPages/dataset/libDataset.module').then(m => m.LibDatasetModule)},
{path: 'search/software', loadChildren: () => import('./landingPages/software/libSoftware.module').then(m => m.LibSoftwareModule)},
{path: 'search/other', loadChildren: () => import('./landingPages/orp/libOrp.module').then(m => m.LibOrpModule)},
{path: 'search/project', loadChildren: () => import('./landingPages/project/libProject.module').then(m => m.LibProjectModule)},
{path: 'search/result', loadChildren: () => import('./landingPages/result/libResult.module').then(m => m.LibResultModule), data: {hasQuickContact: false}},
{path: 'search/publication', loadChildren: () => import('./landingPages/publication/libPublication.module').then(m => m.LibPublicationModule), data: {hasQuickContact: false}},
{path: 'search/dataset', loadChildren: () => import('./landingPages/dataset/libDataset.module').then(m => m.LibDatasetModule), data: {hasQuickContact: false}},
{path: 'search/software', loadChildren: () => import('./landingPages/software/libSoftware.module').then(m => m.LibSoftwareModule), data: {hasQuickContact: false}},
{path: 'search/other', loadChildren: () => import('./landingPages/orp/libOrp.module').then(m => m.LibOrpModule), data: {hasQuickContact: false}},
{path: 'search/project', loadChildren: () => import('./landingPages/project/libProject.module').then(m => m.LibProjectModule), data: {hasQuickContact: false}},
{
path: 'search/dataprovider',
loadChildren: () => import('././landingPages/dataProvider/libDataProvider.module').then(m => m.LibDataProviderModule)
loadChildren: () => import('././landingPages/dataProvider/libDataProvider.module').then(m => m.LibDataProviderModule),
data: {hasQuickContact: false}
},
{
path: 'search/organization',
loadChildren: () => import('./landingPages/organization/libOrganization.module').then(m => m.LibOrganizationModule)
loadChildren: () => import('./landingPages/organization/libOrganization.module').then(m => m.LibOrganizationModule),
data: {hasQuickContact: false}
},
{
path: 'project-report',

94
explore/src/app/app.component.ts
Unescape Escape View File

@ -1,10 +1,8 @@
import {Component} from '@angular/core';
import {ChangeDetectorRef, Component, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {EnvProperties} from './openaireLibrary/utils/properties/env-properties';
import {MenuItem} from './openaireLibrary/sharedComponents/menu';
import {EnvironmentSpecificService} from './openaireLibrary/utils/properties/environment-specific.service';
import {Session, User} from './openaireLibrary/login/utils/helper.class';
import {UserManagementService} from "./openaireLibrary/services/user-management.service";
import {ConfigurationService} from "./openaireLibrary/utils/configuration/configuration.service";
@ -15,6 +13,14 @@ import {properties} from "../environments/environment";
import {SmoothScroll} from "./openaireLibrary/utils/smooth-scroll";
import {SEOService} from "./openaireLibrary/sharedComponents/SEO/SEO.service";
import {OpenaireEntities} from "./openaireLibrary/utils/properties/searchFields";
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {QuickContactComponent} from './openaireLibrary/sharedComponents/quick-contact/quick-contact.component';
import {EmailService} from './openaireLibrary/utils/email/email.service';
import {Composer} from "./openaireLibrary/utils/email/composer";
import {AlertModal} from './openaireLibrary/utils/modal/alert';
import {NotificationHandler} from "./openaireLibrary/utils/notification-handler";
import {QuickContactService} from './openaireLibrary/sharedComponents/quick-contact/quick-contact.service';
import {LayoutService} from './openaireLibrary/dashboard/sharedComponents/sidebar/layout.service';
@Component({
//changeDetection: ChangeDetectionStrategy.Default,
@ -46,6 +52,9 @@ import {OpenaireEntities} from "./openaireLibrary/utils/properties/searchFields"
</span></a>
</cookie-law>
<bottom id="bottom" *ngIf="isClient && properties" [properties]="properties"></bottom>
<quick-contact #quickContact *ngIf="showQuickContact && contactForm" (sendEmitter)="send($event)"
[contactForm]="contactForm" [sending]="sending" [contact]="'Help'"></quick-contact>
<modal-alert #modal [overflowBody]="false"></modal-alert>
`
})
export class AppComponent {
@ -56,17 +65,29 @@ export class AppComponent {
properties: EnvProperties = properties;
user: User;
header: Header;
public showQuickContact: boolean;
public contactForm: FormGroup;
public sending: boolean = false;
@ViewChild('quickContact') quickContact: QuickContactComponent;
@ViewChild('modal') modal: AlertModal;
subscriptions = [];
constructor(private route: ActivatedRoute, private propertiesService: EnvironmentSpecificService,
private router: Router, private userManagementService: UserManagementService, private smoothScroll: SmoothScroll,
private configurationService: ConfigurationService, private _meta: Meta, private seoService: SEOService,) {
private configurationService: ConfigurationService, private _meta: Meta, private seoService: SEOService,
private emailService: EmailService, private fb: FormBuilder, private quickContactService: QuickContactService,
private layoutService: LayoutService, private cdr: ChangeDetectorRef) {
}
ngOnInit() {
if (typeof document !== 'undefined') {
this.isClient = true;
}
this.subscriptions.push(this.layoutService.hasQuickContact.subscribe(hasQuickContact => {
this.showQuickContact = hasQuickContact;
this.cdr.detectChanges();
}));
this.configurationService.initCommunityInformation(this.properties, this.properties.adminToolsCommunity);
this.feedbackmail = this.properties.feedbackmail;
if (this.properties.environment == "production" || this.properties.environment == "development") {
@ -88,6 +109,10 @@ export class AppComponent {
position: 'left',
badge: true
};
this.reset();
}));
this.subscriptions.push(this.quickContactService.isDisplayed.subscribe(display => {
this.showQuickContact = display;
}));
}
@ -138,7 +163,6 @@ export class AppComponent {
new MenuItem("", "Registries", "", "/search/entity-registries", false, ["datasource"], ["/search/entity-registries"], {}),
new MenuItem("", "Browse all", "", "/search/find/dataproviders", false, ["datasource"], ["/search/find/dataproviders"], {})]
),
new MenuItem("contact", "Contact us", "", "/contact-us", false, [], ["/contact-us"], {}),
];
if (Session.isPortalAdministrator(this.user)) {
this.userMenuItems.push(new MenuItem("", "Manage all links", "", "/claims", false, [], ["/claims"], {}));
@ -150,6 +174,66 @@ export class AppComponent {
if (this.user) {
this.userMenuItems.push(new MenuItem("", "User information", "", "/user-info", false, [], [], {}));
}
}
public send(event) {
if (event.valid === true) {
this.sendMail(this.properties.admins);
}
}
private sendMail(admins: string[]) {
this.sending = true;
this.subscriptions.push(this.emailService.contact(this.properties,
Composer.composeEmailForExplore(this.contactForm.value, admins),
this.contactForm.value.recaptcha).subscribe(
res => {
if (res) {
this.sending = false;
this.reset();
this.modalOpen();
} else {
this.handleError('Email <b>sent failed!</b> Please try again.');
}
},
error => {
this.handleError('Email <b>sent failed!</b> Please try again.', error);
}
));
}
public reset() {
if (this.quickContact) {
this.quickContact.close();
}
this.contactForm = this.fb.group({
name: this.fb.control('', Validators.required),
surname: this.fb.control('', Validators.required),
email: this.fb.control('', [Validators.required, Validators.email]),
affiliation: this.fb.control(''),
message: this.fb.control('', Validators.required),
recaptcha: this.fb.control('', Validators.required),
});
}
public modalOpen() {
this.modal.okButton = true;
this.modal.alertTitle = 'Your request has been successfully submitted';
this.modal.message = 'Our team will respond to your submission soon.';
this.modal.cancelButton = false;
this.modal.okButtonLeft = false;
this.modal.okButtonText = 'OK';
this.modal.open();
}
handleError(message: string, error = null) {
if (error) {
console.error(error);
}
this.sending = false;
this.quickContact.close();
NotificationHandler.rise(message, 'danger');
this.contactForm.get('recaptcha').setValue('');
}
}

7
explore/src/app/app.module.ts
Unescape Escape View File

@ -17,6 +17,8 @@ import {Schema2jsonldModule} from "./openaireLibrary/sharedComponents/schema2jso
import {CacheInterceptorService} from "./openaireLibrary/cache-interceptor.service";
import {DEFAULT_TIMEOUT, TimeoutInterceptor} from "./openaireLibrary/timeout-interceptor.service";
import {ErrorInterceptorService} from "./openaireLibrary/error-interceptor.service";
import {QuickContactModule} from './openaireLibrary/sharedComponents/quick-contact/quick-contact.module';
import {AlertModalModule} from './openaireLibrary/utils/modal/alertModal.module';
@NgModule({
imports: [
@ -29,7 +31,10 @@ import {ErrorInterceptorService} from "./openaireLibrary/error-interceptor.servi
BrowserModule.withServerTransition({ appId: 'explore' }),
AppRoutingModule,
BrowserTransferStateModule,
BrowserAnimationsModule, PageURLResolverModule, Schema2jsonldModule
BrowserAnimationsModule, PageURLResolverModule,
Schema2jsonldModule,
QuickContactModule,
AlertModalModule
],
declarations: [AppComponent, OpenaireErrorPageComponent],
exports: [AppComponent],

192
explore/src/app/fos/fos.component.html
Unescape Escape View File

@ -18,7 +18,7 @@
We have integrated a Field-of-Science (FoS) taxonomy into our dataset to organize and discover research more effectively. Using the full capabilities of the OpenAIRE Research Graph (full-texts, citations, references, venues) we apply AI and bring forward any multidisciplinarity potential.
</div>
<div class="uk-text-meta uk-margin-top" uk-scrollspy-class>
Our work is based on the work from our partner Athena Research Center: SciNoBo : A Hierarchical Multi-Label Classifier of Scientific Publications - <a href="https://arxiv.org/abs/2204.00880" target="_blank">https://arxiv.org/abs/2204.00880</a>
Our work is based on the work from our partner Athena Research Center: SciNoBo : A Hierarchical Multi-Label Classifier of Scientific Publications - <a href="https://doi.org/10.1145/3487553.3524677" target="_blank">https://doi.org/10.1145/3487553.3524677</a>
</div>
<!-- TODO: We need a page for the button link -->
<!-- <div>
@ -36,107 +36,121 @@
</div>
</div>
</div>
<div class="uk-container uk-container-large uk-section" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
<div class="uk-grid uk-flex uk-flex-middle uk-flex-center uk-padding-small" uk-grid>
<div class="uk-margin-large-bottom">
<div search-input [searchControl]="keywordControl" [options]="fosOptions" placeholder="Search" (searchEmitter)="onSubmit()"
class="uk-width-large"></div>
<div *ngIf="fos?.length" class="uk-container uk-container-large uk-section" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
<div class="uk-visible@m">
<div uk-sticky="offset: 50;" class="uk-sticky uk-background-default uk-padding uk-padding-remove-bottom uk-padding-remove-horizontal">
<div class="uk-flex uk-flex-right uk-margin-small-bottom">
<div search-input [searchControl]="keywordControl" [options]="fosOptions" iconPosition="left" placeholder="Write a key word to filter the content"
searchInputClass="border-bottom" class="uk-width-large"></div>
</div>
</div>
</div>
<ng-container *ngIf="keyword && keyword.length">
<div class="uk-padding-small">
<div class="uk-margin-small-bottom">Search results for:</div>
<span class="uk-display-inline-block">
<span class="uk-label uk-label-primary uk-flex uk-flex-middle">
<span class="uk-margin-small-right uk-width-expand uk-text-truncate">{{keyword}}</span>
<!-- <icon class="uk-text-muted" name="close" flex="true" ratio="0.7"></icon> -->
<button class="uk-close uk-icon" [attr.uk-tooltip]="'Remove'" (click)="clearKeyword()">
<icon name="close" flex="true" ratio="0.7"></icon>
</button>
</span>
<!-- <a [attr.uk-tooltip]="'Remove'" (click)="clearKeyword()" class="uk-link-reset">
<span class="uk-label uk-label-primary uk-flex uk-flex-middle">
<span class="uk-margin-small-right uk-width-expand">{{keyword}}</span>
<button class="uk-close uk-icon">
<icon name="close" flex="true" ratio="0.7"></icon>
</button>
</span>
</a> -->
</span>
</div>
</ng-container>
<ng-container *ngIf="!keyword">
<ng-container>
<div class="uk-margin-top uk-padding-small">
<div class="uk-grid uk-grid-large" uk-grid>
<div class="uk-width-1-4">
<ul class="uk-nav uk-nav-default">
<li *ngFor="let item of fos; index as i"
class="uk-margin-small-bottom uk-text-capitalize"
[class]="index == i ? 'uk-active':''"
(click)="changeDisplayedFos(i)">
<a class="uk-padding-remove">{{item.id}}</a>
</li>
</ul>
<div id="parentContainer" class="uk-grid uk-grid-large" uk-grid>
<div class="uk-width-1-4@m uk-visible@m">
<div class="uk-sticky" uk-sticky="bottom: !#parentContainer; offset: 200;">
<ul *ngIf="!keyword" class="uk-tab uk-tab-left">
<li *ngFor="let item of fos; index as i" [class.uk-active]="activeSection === item.id"
class="uk-margin-small-bottom uk-text-capitalize">
<a routerLink="./" [fragment]="item.id">{{item.id}}</a>
</li>
</ul>
<ul *ngIf="keyword?.length" class="uk-tab uk-tab-left">
<li *ngFor="let item of viewResults; index as i"
class="uk-margin-small-bottom uk-text-capitalize" [class.uk-active]="activeSection === item.id">
<a routerLink="./" [fragment]="item.id">{{item.id}}</a>
</li>
</ul>
</div>
</div>
<div *ngIf="fos[index]" class="uk-width-3-4">
<div class="uk-text-capitalize">
<h2 class="uk-h4 uk-margin-remove">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(fos[index].id)}"
class="uk-link-text">
{{fos[index].id}}
</a>
</h2>
<div class="uk-width-1-1 uk-hidden@m">
<div class="uk-sticky uk-blur-background" uk-sticky>
<div class="uk-flex uk-flex-center uk-margin-small-bottom">
<div search-input [searchControl]="keywordControl" [options]="fosOptions" iconPosition="left" placeholder="Write a key word to filter the content"
searchInputClass="border-bottom" class="uk-width-large"></div>
</div>
<div #tabs class="uk-slider uk-position-relative" uk-slider="finite: true">
<div class="uk-slider-container">
<ul *ngIf="!keyword" class="uk-tab uk-flex-nowrap uk-slider-items">
<li *ngFor="let item of fos; index as i" [class.uk-active]="activeSection === item.id && sliderInit"
class="uk-text-capitalize">
<a routerLink="./" [fragment]="item.id">{{item.id}}</a>
</li>
</ul>
<ul *ngIf="keyword?.length" class="uk-tab uk-flex-nowrap uk-slider-items">
<li *ngFor="let item of viewResults; index as i"
class="uk-text-capitalize" [class.uk-active]="activeSection === item.id && sliderInit">
<a routerLink="./" [fragment]="item.id">{{item.id}}</a>
</li>
</ul>
</div>
<a class="uk-position-center-left uk-blur-background" uk-slider-item="previous"><span uk-icon="chevron-left"></span></a>
<a class="uk-position-center-right uk-blur-background" uk-slider-item="next"><span uk-icon="chevron-right"></span></a>
</div>
</div>
<div class="uk-grid uk-child-width-1-3 uk-margin-large-top uk-margin-medium-bottom" uk-grid="masonry: false">
<div *ngFor="let child of fos[index].children">
<div class="whole-child uk-text-capitalize">
<h3 class="uk-h6 uk-margin-small-bottom">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(child.id)}"
</div>
<div class="uk-width-expand@m">
<ng-container *ngIf="!keyword">
<div [id]="item.id" *ngFor="let item of fos; index as i">
<div class="uk-text-capitalize">
<h2 class="uk-h4 uk-margin-remove">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(item.id)}"
class="uk-link-text">
{{child.id}}
{{item.id}}
</a>
</h3>
<div *ngFor="let subChild of child.children" style="margin-bottom: 5px;">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(subChild.id)}"
class="uk-link-text">
{{subChild.id}}
</h2>
</div>
<div class="uk-grid uk-child-width-1-3 uk-margin-large-top uk-margin-xlarge-bottom" uk-grid="masonry: false">
<div *ngFor="let child of item.children">
<div class="uk-text-capitalize">
<h3 class="uk-h6 uk-margin-small-bottom">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(child.id)}"
class="uk-link-text">
{{child.id}}
</a>
</h3>
<div *ngFor="let subChild of child.children" style="margin-bottom: 5px;">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(subChild.id)}"
class="uk-link-text">
{{subChild.id}}
</a>
</div>
</div>
</div>
</div>
</div>
</ng-container>
<ng-container *ngIf="keyword?.length">
<div [id]="item.id" *ngFor="let item of viewResults; index as i">
<div
class="uk-margin-large-bottom uk-padding uk-padding-remove-top uk-padding-remove-horizontal uk-text-capitalize" [class.custom-bottom-border]="i < viewResults.length - 1">
<h2 class="uk-h4 uk-margin-remove">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(item.id)}"
class="uk-link-text" [innerHTML]="highlightKeyword(item.id)">
</a>
</h2>
<div class="uk-grid uk-child-width-1-3 uk-margin-large-top uk-margin-medium-bottom" uk-grid="masonry: false">
<div *ngFor="let subItem of item.children">
<h3 class="uk-h6 uk-margin-small-bottom">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(subItem.id)}"
class="uk-link-text" [innerHTML]="highlightKeyword(subItem.id)">
</a>
</h3>
<div *ngFor="let subSubItem of subItem.children" style="margin-bottom: 5px;">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(subSubItem.id)}"
class="uk-link-text" [innerHTML]="highlightKeyword(subSubItem.id)">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</ng-container>
</div>
</div>
</div>
</ng-container>
<ng-container *ngIf="keyword && keyword.length">
<div class="uk-margin-medium-top uk-padding-small">
<ng-container *ngFor="let item of viewResults; let i=index">
<div
class="uk-margin-large-bottom uk-padding uk-padding-remove-top uk-padding-remove-horizontal uk-text-capitalize" [class.custom-bottom-border]="i < viewResults.length - 1">
<h2 class="uk-h4 uk-margin-remove">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(item.id)}"
class="uk-link-text" [innerHTML]="highlightKeyword(item.id)">
</a>
</h2>
<div class="uk-grid uk-child-width-1-3 uk-margin-large-top uk-margin-medium-bottom" uk-grid="masonry: false">
<div *ngFor="let subItem of item.children">
<h3 class="uk-h6 uk-margin-small-bottom">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(subItem.id)}"
class="uk-link-text" [innerHTML]="highlightKeyword(subItem.id)">
</a>
</h3>
<div *ngFor="let subSubItem of subItem.children" style="margin-bottom: 5px;">
<a [routerLink]="properties.searchLinkToResults" [queryParams]="{'fos': urlEncodeAndQuote(subSubItem.id)}"
class="uk-link-text" [innerHTML]="highlightKeyword(subSubItem.id)">
</a>
</div>
</div>
</div>
</div>
</ng-container>
<ng-container *ngIf="!viewResults?.length">
<div class="uk-padding uk-text-center">
<ng-container *ngIf="keyword && viewResults?.length == 0">
<div class="uk-padding-large uk-text-center">
<h2 class="uk-h3">No results were found.</h2>
</div>
</ng-container>

122
explore/src/app/fos/fos.component.ts
Unescape Escape View File

@ -1,5 +1,5 @@
import {HttpClient} from "@angular/common/http";
import {Component, OnDestroy, OnInit} from "@angular/core";
import {ChangeDetectorRef, Component, ElementRef, OnDestroy, OnInit, ViewChild} from "@angular/core";
import {Subscription} from "rxjs";
import {Breadcrumb} from "../openaireLibrary/utils/breadcrumbs/breadcrumbs.component";
@ -12,6 +12,10 @@ import {Location} from "@angular/common";
import {StringUtils} from "../openaireLibrary/utils/string-utils.class";
import {SEOService} from "../openaireLibrary/sharedComponents/SEO/SEO.service";
import {PiwikService} from "../openaireLibrary/utils/piwik/piwik.service";
import {debounceTime, distinctUntilChanged} from "rxjs/operators";
import Timeout = NodeJS.Timeout;
declare var UIkit;
@Component({
selector: 'fos',
@ -25,7 +29,7 @@ export class FosComponent implements OnInit, OnDestroy {
public fos: any[] = [];
public fosOptions: string[] = [];
public index: number = 0;
public activeSection: string;
public keywordControl: UntypedFormControl;
public keyword: string = null;
@ -36,8 +40,12 @@ export class FosComponent implements OnInit, OnDestroy {
properties: EnvProperties = properties;
public breadcrumbs: Breadcrumb[] = [{name: 'home', route: '/'}, {name: 'Fields of Science'}];
subscriptions: Subscription[] = [];
private subscriptions: Subscription[] = [];
private observer: IntersectionObserver;
private timeout: Timeout;
@ViewChild('tabs') tabs: ElementRef;
public sliderInit: boolean = false;
constructor(
private httpClient: HttpClient,
@ -48,7 +56,8 @@ export class FosComponent implements OnInit, OnDestroy {
private _meta: Meta,
private _title: Title,
private seoService: SEOService,
private _piwikService: PiwikService
private _piwikService: PiwikService,
private cdr: ChangeDetectorRef
) {}
ngOnInit() {
@ -60,15 +69,48 @@ export class FosComponent implements OnInit, OnDestroy {
this.updateUrl(this.url);
this.updateTitle(this.pageTitle);
this.updateDescription(this.pageDescription);
this.keywordControl = this.fb.control('');
this.httpClient.get(properties.domain+'/assets/vocabulary/fos.json').subscribe(data => {
this.fos = data['fos'];
this.convertFosToOptions();
this.subscriptions.push(this.route.queryParams.subscribe(params => {
if(params.keyword) {
this.keywordControl.setValue(params.keyword);
this.keyword = this.keywordControl.value;
this.findMatches();
if (typeof document !== 'undefined') {
setTimeout(()=> {
let slider = UIkit.slider(this.tabs.nativeElement);
slider.clsActive = 'uk-slider-active';
slider.updateActiveClasses();
this.sliderInit = true;
slider.slides.forEach(item => {
item.classList.remove('uk-active');
});
if (this.route.snapshot.fragment) {
this.activeSection = this.route.snapshot.fragment;
let i = this.fos.findIndex(item => item.id == this.route.snapshot.fragment);
slider.show(i);
} else {
this.activeSection = this.fos[0].id;
}
this.cdr.detectChanges();
});
}
this.subscriptions.push(this.route.fragment.subscribe(fragment => {
if(fragment) {
this.activeSection = fragment;
if(this.tabs) {
let slider = UIkit.slider(this.tabs.nativeElement);
let i = this.fos.findIndex(item => item.id == fragment);
slider.show(i);
}
} else {
this.activeSection = this.fos[0].id;
}
}));
this.keywordControl = this.fb.control('');
this.subscriptions.push(this.keywordControl.valueChanges.pipe(debounceTime(500), distinctUntilChanged()).subscribe(value => {
this.keyword = value;
this.findMatches(this.keyword);
if (typeof document !== 'undefined') {
setTimeout(() => {
this.setObserver();
});
}
}));
});
@ -78,19 +120,33 @@ export class FosComponent implements OnInit, OnDestroy {
for (let sub of this.subscriptions) {
sub.unsubscribe();
}
if(this.observer) {
this.observer.disconnect();
}
}
changeDisplayedFos(i) {
this.index = i;
}
onSubmit() {
if(this.keywordControl.value) {
this.keyword = this.keywordControl.value;
// TODO: router.navigate();
this.location.go(window.location.pathname + '?keyword=' + this.keyword);
this.findMatches();
private setObserver() {
if(this.observer) {
this.observer.disconnect();
}
this.observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if(entry.isIntersecting) {
if(this.timeout) {
clearTimeout(this.timeout);
}
this.timeout = setTimeout(() => {
this._router.navigate(['./'], {fragment: entry.target.id, relativeTo: this.route, state: {disableScroll: true}});
}, 200);
}
});
}, {threshold: 0.25, rootMargin: '-100px'});
this.fos.forEach(fos => {
let element = document.getElementById(fos.id);
if(element) {
this.observer.observe(element);
}
});
}
convertFosToOptions() {
@ -110,29 +166,21 @@ export class FosComponent implements OnInit, OnDestroy {
});
}
findMatches() {
findMatches(value: string) {
this.viewResults = JSON.parse(JSON.stringify(this.fos));
let matchLevel1: boolean = false;
let matchLevel2: boolean = false;
// 1st level search
if(this.viewResults.length) {
this.viewResults = this.viewResults.filter(item => {
if(item.id.includes(this.keyword.toLowerCase())) {
matchLevel1 = true;
} else {
matchLevel1 = false;
}
matchLevel1 = !!item.id.includes(value?.toLowerCase());
// // 2nd level search
if(item.children?.length && !matchLevel1) {
item.children = item.children.filter(subItem => {
if(subItem.id.includes(this.keyword.toLowerCase())) {
matchLevel2 = true;
} else {
matchLevel2 = false;
}
matchLevel2 = !!subItem.id.includes(value?.toLowerCase());
// 3rd level search
if(subItem.children?.length && !matchLevel2) {
subItem.children = subItem.children.filter(subSubItem => subSubItem.id.includes(this.keyword.toLowerCase()));
subItem.children = subItem.children.filter(subSubItem => subSubItem.id.includes(value?.toLowerCase()));
}
return subItem.children?.length > 0 || matchLevel2;
});
@ -150,12 +198,6 @@ export class FosComponent implements OnInit, OnDestroy {
}
}
clearKeyword() {
this.keyword = null;
this.keywordControl.setValue('');
this.location.go(window.location.pathname);
}
public urlEncodeAndQuote(str: string): string {
return StringUtils.quote(StringUtils.URIEncode(str));
}

8
explore/src/app/home/home.component.html
Unescape Escape View File

@ -26,12 +26,12 @@
</div>
<div class="uk-text-primary">All linked together through citations and semantics.</div>
</div>
<div [class.uk-invisible]="disableSelect" class="uk-margin-medium-top uk-width-4-5@l uk-width-3-5@xl">
<div [class.uk-invisible]="disableSelect" class="uk-margin-medium-top uk-width-3-4@xl">
<advanced-search-input #advanced (searchEmitter)="goTo(true)">
<entities-selection [simpleView]="true" currentEntity="all" [selectedEntity]="selectedEntity"
(selectionChange)="entityChanged($event);advanced.focusNext(input, $event)" (disableSelectEmitter)="disableSelectChange($event)"
[onChangeNavigate]="false"></entities-selection>
<div input #input placeholder="Scholary works" [searchable]="true" [hint]="'Search in OpenAIRE'" [(value)]="keyword"></div>
[onChangeNavigate]="false" class="uk-width-2-5"></entities-selection>
<div class="uk-width-expand" input #input placeholder="Scholary works" [searchable]="true" [hint]="'Search in OpenAIRE'" [(value)]="keyword"></div>
</advanced-search-input>
<div *ngIf="selectedEntity === 'result' && input.focused" (click)="$event.stopPropagation();advanced.focusNext(input, $event)" class="uk-dropdown uk-display-block uk-margin-small-top uk-width-auto">
<div class="uk-padding-small">
@ -324,7 +324,7 @@
</div>
</div>
<div class="uk-section">
<div #contact class="uk-section">
<div class="uk-container uk-container-large uk-margin-large-bottom uk-text-center">
<h3 class="uk-h2 uk-margin-remove">
Need more information?

30
explore/src/app/home/home.component.ts
Unescape Escape View File

@ -19,7 +19,6 @@ import {SearchProjectsService} from '../openaireLibrary/services/searchProjects.
import {SearchOrganizationsService} from '../openaireLibrary/services/searchOrganizations.service';
import {RefineFieldResultsService} from '../openaireLibrary/services/refineFieldResults.service';
import {OpenaireEntities, SearchFields} from '../openaireLibrary/utils/properties/searchFields';
import {RouterHelper} from '../openaireLibrary/utils/routerHelper.class';
import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties';
import {ErrorCodes} from '../openaireLibrary/utils/properties/errorCodes';
@ -32,6 +31,7 @@ import {properties} from "../../environments/environment";
import {Numbers, NumbersComponent} from "../openaireLibrary/sharedComponents/numbers/numbers.component";
import {StringUtils} from "../openaireLibrary/utils/string-utils.class";
import {NumberUtils} from '../openaireLibrary/utils/number-utils.class';
import {QuickContactService} from '../openaireLibrary/sharedComponents/quick-contact/quick-contact.service';
@Component({
selector: 'home',
@ -138,7 +138,8 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit {
properties: EnvProperties = properties;
public openaireEntities = OpenaireEntities;
public readMore: boolean = false;
public showQuickContact: boolean;
@ViewChild('contact') contact: ElementRef;
subscriptions: any[] = [];
@ViewChildren('scrolling_element') elements: QueryList<ElementRef>;
@ -195,7 +196,8 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit {
private location: Location, private _piwikService: PiwikService,
private config: ConfigurationService, private _meta: Meta, private _title: Title, private seoService: SEOService,
private helper: HelperService,
private cdr: ChangeDetectorRef
private cdr: ChangeDetectorRef,
private quickContactService: QuickContactService
) {
let description = "OpenAIRE Explore: Over 100M of research deduplicated, 170K research software, 11M research data. One of the largest open scholarly records collection worldwide.";
let title = "OpenAIRE | Find and Share research";
@ -304,11 +306,28 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit {
ngAfterViewInit() {
if (typeof window !== "undefined") {
this.createObserver();
this.createObservers();
}
}
createObserver() {
createObservers() {
let options = {
root: null,
rootMargin: '200px',
threshold: 1.0
};
let intersectionObserver = new IntersectionObserver(entries => {
entries.forEach(entry => {
if (entry.isIntersecting && this.showQuickContact) {
this.showQuickContact = false;
this.quickContactService.setDisplay(this.showQuickContact);
} else if (!entry.isIntersecting && !this.showQuickContact) {
this.showQuickContact = true;
this.quickContactService.setDisplay(this.showQuickContact);
}
});
}, options);
intersectionObserver.observe(this.contact.nativeElement);
let mutationObserver = new MutationObserver(entries => {
entries.forEach(entry => {
if (entry.attributeName === 'style') {
@ -327,6 +346,7 @@ export class HomeComponent implements OnInit, OnDestroy, AfterViewInit {
this.elements.forEach(element => {
mutationObserver.observe(element.nativeElement, {attributes: true});
});
this.subscriptions.push(intersectionObserver);
this.subscriptions.push(mutationObserver);
}

11
explore/src/assets/explore-custom.less
Unescape Escape View File

@ -3,13 +3,22 @@
/* Button */
@button-primary-background: @explore-color;
@inverse-button-primary-background: @explore-color;
@button-secondary-border: @explore-color;
@button-secondary-color: @explore-color;
@button-secondary-hover-background: @global-secondary-background;
@button-secondary-hover-background-gradient: none;
@button-secondary-active-background: @global-secondary-background;
@button-secondary-active-background-gradient: none;
/* Background */
@background-primary-background: @explore-color;
@background-primary-background-gradient: none;
/* Text */
/** Text */
@text-primary-color: @explore-color;
@text-background-color: @explore-color;
@inverse-text-primary-color: @explore-color;
/* Label */
@label-secondary-color: @explore-color;

4
explore/src/environments/environment.ts
Unescape Escape View File

@ -28,7 +28,7 @@ export let properties: EnvProperties = {
searchDataciteAPIURL: "https://api.datacite.org/works",
searchOrcidURL: "https://pub.orcid.org/v2.1/",
orcidURL: "https://orcid.org/",
orcidAPIURL: "http://duffy.di.uoa.gr:8080/uoa-orcid-service/",
orcidAPIURL: "http://duffy.di.uoa.gr:19480/uoa-orcid-service/",
orcidTokenURL : "https://sandbox.orcid.org/oauth/authorize?",
orcidClientId: "APP-A5M3KTX6NCN67L91",
doiURL: "https://doi.org/",
@ -65,7 +65,7 @@ export let properties: EnvProperties = {
cacheUrl: "http://dl170.madgik.di.uoa.gr:3000/get?url=",
adminToolsAPIURL: "http://duffy.di.uoa.gr:8080/uoa-admin-tools/",
adminToolsAPIURL: "http://duffy.di.uoa.gr:19280/uoa-admin-tools/",
adminToolsCommunity: "openaire",
datasourcesAPI: "https://beta.services.openaire.eu/openaire/ds/api/",

Write Preview
Loading…
Cancel
Save