|
|
|
|
@ -13,6 +13,7 @@ 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;
|
|
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
|
selector: 'fos',
|
|
|
|
|
@ -37,8 +38,10 @@ 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;
|
|
|
|
|
|
|
|
|
|
constructor(
|
|
|
|
|
private httpClient: HttpClient,
|
|
|
|
|
@ -75,6 +78,9 @@ export class FosComponent implements OnInit, OnDestroy {
|
|
|
|
|
this.subscriptions.push(this.keywordControl.valueChanges.pipe(debounceTime(500), distinctUntilChanged()).subscribe(value => {
|
|
|
|
|
this.keyword = value;
|
|
|
|
|
this.findMatches(this.keyword);
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.setObserver();
|
|
|
|
|
});
|
|
|
|
|
}));
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
@ -83,8 +89,35 @@ export class FosComponent implements OnInit, OnDestroy {
|
|
|
|
|
for (let sub of this.subscriptions) {
|
|
|
|
|
sub.unsubscribe();
|
|
|
|
|
}
|
|
|
|
|
if(this.observer) {
|
|
|
|
|
this.observer.disconnect();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
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() {
|
|
|
|
|
this.fosOptions = [];
|
|
|
|
|
this.fos.forEach(fos => {
|
|
|
|
|
@ -109,19 +142,11 @@ export class FosComponent implements OnInit, OnDestroy {
|
|
|
|
|
// 1st level search
|
|
|
|
|
if(this.viewResults.length) {
|
|
|
|
|
this.viewResults = this.viewResults.filter(item => {
|
|
|
|
|
if(item.id.includes(value?.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(value?.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(value?.toLowerCase()));
|
|
|
|
|
|
