574 lines
18 KiB
TypeScript
574 lines
18 KiB
TypeScript
import {Component, Input} from '@angular/core';
|
|
import {ViewChild, Output} from '@angular/core';
|
|
import {EventEmitter, ViewEncapsulation} from '@angular/core';
|
|
import {OnInit, AfterViewInit} from '@angular/core';
|
|
import {Location} from '@angular/common';
|
|
import {ActivatedRoute, Router} from '@angular/router';
|
|
import {Title, Meta} from '@angular/platform-browser';
|
|
|
|
import {Observable} from 'rxjs/Observable';
|
|
import {Subject} from 'rxjs/Subject';
|
|
|
|
import {DataTableDirective } from 'angular-datatables';
|
|
|
|
import {EnvProperties} from '../../utils/properties/env-properties';
|
|
|
|
import {Filter, Value} from './searchHelperClasses.class';
|
|
import {SearchResult} from '../../utils/entities/searchResult';
|
|
import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
|
|
import {SearchUtilsClass} from './searchUtils.class';
|
|
import {DOI, StringUtils} from '../../utils/string-utils.class';
|
|
import {ModalLoading} from '../../utils/modal/loading.component';
|
|
import {SearchFilterComponent} from './searchFilter.component';
|
|
import {SearchFilterModalComponent} from './searchFilterModal.component';
|
|
import {ErrorCodes} from '../../utils/properties/errorCodes';
|
|
import {PiwikService} from '../../utils/piwik/piwik.service';
|
|
//import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
|
|
import { SEOService } from '../../sharedComponents/SEO/SEO.service';
|
|
|
|
@Component({
|
|
selector: 'search-page-table',
|
|
templateUrl:'searchPageTableView.component.html',
|
|
styles: [`
|
|
#dpTable_info, #dpTable_paginate, #dpTable_length, #dpTable_filter{
|
|
display: none;
|
|
}
|
|
|
|
`],
|
|
encapsulation: ViewEncapsulation.None // this used in order styles to work
|
|
|
|
})
|
|
export class SearchPageTableViewComponent implements OnInit, AfterViewInit {
|
|
@Input() piwikSiteId = null;
|
|
@Input() pageTitle = "";
|
|
@Input() results;
|
|
@Input() filters = [];
|
|
@Input() columnNames = [];
|
|
@Input() type:string = "";
|
|
@Input() entityType: string = "";
|
|
@Input() searchUtils:SearchUtilsClass;// = new SearchUtilsClass();
|
|
//@Output() downloadClick = new EventEmitter();
|
|
@Input() showResultCount:boolean = true;
|
|
@Input() showRefine:boolean = true;
|
|
@Input() refineFields = [];
|
|
//@Input() csvParams: string;
|
|
//@Input() csvPath: string;
|
|
@Input() openaireLink: string;
|
|
@Input() searchViewLink: string;
|
|
@Input() disableForms: boolean = false;
|
|
@Input() enableSearchView: boolean = true;
|
|
@Input() searchFormClass: string = "searchForm";
|
|
@Input() formPlaceholderText = "Type Keywords...";
|
|
@Input() mapUrl: string = "";
|
|
@Input() mapTooltipType: string ="content providers";
|
|
@ViewChild (ModalLoading) loading : ModalLoading ;
|
|
private searchFieldsHelper:SearchFields = new SearchFields();
|
|
private queryParameters: Map<string, string> = new Map<string,string>();
|
|
public parameterNames:string[] =[];
|
|
public parameterValues:string[] =[];
|
|
|
|
public isPiwikEnabled;
|
|
|
|
|
|
@ViewChild (SearchFilterModalComponent) searchFilterModal : SearchFilterModalComponent ;
|
|
public currentFilter: Filter;
|
|
public errorCodes:ErrorCodes = new ErrorCodes();
|
|
piwiksub: any;
|
|
dtOptions: DataTables.Settings = {};
|
|
showTable = false; filteringAdded = false;
|
|
@ViewChild(DataTableDirective) datatableElement: DataTableDirective;
|
|
dtTrigger: Subject<any> = new Subject(); //necessary
|
|
properties:EnvProperties;
|
|
url = null;
|
|
constructor (private route: ActivatedRoute,
|
|
private router: Router,
|
|
private location: Location,
|
|
private _meta: Meta,
|
|
private _title: Title,
|
|
private _piwikService:PiwikService,
|
|
private seoService: SEOService) { }
|
|
|
|
ngOnInit() {
|
|
this.route.data
|
|
.subscribe((data: { envSpecific: EnvProperties }) => {
|
|
this.properties = data.envSpecific;
|
|
|
|
this.isPiwikEnabled = data.envSpecific.enablePiwikTrack;
|
|
if(typeof window !== 'undefined') {
|
|
this.updateUrl(data.envSpecific.baseLink+location.pathname);
|
|
this.url =data.envSpecific.baseLink+location.pathname;
|
|
}
|
|
if(typeof document !== 'undefined' && this.isPiwikEnabled){
|
|
this.piwiksub = this._piwikService.trackView(data.envSpecific, this.pageTitle, this.piwikSiteId).subscribe();
|
|
}
|
|
});
|
|
this.dtOptions = {
|
|
"paging": true,
|
|
"searching": false,
|
|
"lengthChange": false,
|
|
"pageLength": this.searchUtils.size
|
|
};
|
|
this.updateTitle(this.pageTitle);
|
|
var description = "Openaire, search, repositories, open access, type, content provider, funder, project, " + this.type + "," +this.pageTitle;
|
|
this.updateDescription(description);
|
|
this.seoService.createLinkForCanonicalURL(this.properties.baseLink+this.router.url,false);
|
|
|
|
|
|
}
|
|
ngOnDestroy() {
|
|
if(this.piwiksub){
|
|
this.piwiksub.unsubscribe();
|
|
}
|
|
try{
|
|
$.fn['dataTable'].ext.search.pop();
|
|
}catch(e){
|
|
console.error("An error occured in ngOnDestroy of SearchPageTableViewComponent ", e)
|
|
}
|
|
}
|
|
ngAfterViewInit(): void {
|
|
try{
|
|
$.fn['dataTable'].ext.search.push((settings, data, dataIndex) => {
|
|
//console.info(dataIndex+": "+data);
|
|
//console.info(this.results);
|
|
//if (this.filterData(this.results[dataIndex], this.searchUtils.keyword, this.filters)) {
|
|
if(this.filterAll(this.results[dataIndex], this.searchUtils.keyword.toLowerCase(),this.filters)) {
|
|
// console.info("filter true (keyword:"+this.searchUtils.keyword+")");
|
|
|
|
return true;
|
|
}
|
|
// console.info("filter false (keyword:"+this.searchUtils.keyword+")");
|
|
|
|
return false;
|
|
});
|
|
}catch(e){
|
|
console.error("An error occured in ngAfterViewInit of SearchPageTableViewComponent ", e)
|
|
}
|
|
|
|
}
|
|
|
|
|
|
totalPages(): number {
|
|
let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
|
|
if(!(Number.isInteger(totalPages))) {
|
|
totalPages = (parseInt(totalPages, 10) + 1);
|
|
}
|
|
return totalPages;
|
|
}
|
|
|
|
toggleModal($event) {
|
|
this.currentFilter = $event.value;
|
|
this.searchFilterModal.open();
|
|
|
|
}
|
|
|
|
updateDescription(description:string) {
|
|
this._meta.updateTag({content:description},"name='description'");
|
|
this._meta.updateTag({content:description},"property='og:description'");
|
|
}
|
|
updateTitle(title:string) {
|
|
var _prefix ="OpenAIRE | ";
|
|
var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
|
|
this._title.setTitle(_title);
|
|
this._meta.updateTag({content:_title},"property='og:title'");
|
|
}
|
|
updateUrl(url:string) {
|
|
this._meta.updateTag({content:url},"property='og:url'");
|
|
}
|
|
|
|
public getParametersFromUrl(params) {
|
|
for(var i=0; i< this.refineFields.length ; i++) {
|
|
var filterId = this.refineFields[i];
|
|
if(params[filterId] != undefined) {
|
|
if(this.queryParameters == undefined){
|
|
this.queryParameters = new Map<string,string>();
|
|
}
|
|
this.queryParameters[filterId]=decodeURIComponent(params[filterId]);
|
|
}
|
|
}
|
|
}
|
|
/*
|
|
* Mark as check the new filters that are selected, when you get them from search
|
|
*/
|
|
public checkSelectedFilters(filters:Filter[]){
|
|
|
|
this.filters = filters;
|
|
for(var i=0; i< filters.length ; i++){
|
|
var filter:Filter = filters[i];
|
|
filter.countSelectedValues = 0;
|
|
|
|
if(this.queryParameters[filter.filterId] != undefined) {
|
|
let values = (decodeURIComponent(this.queryParameters[filter.filterId])).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
|
|
for(let filterValue of filter.values) {
|
|
if(values.indexOf(StringUtils.quote(filterValue.id)) > -1) {
|
|
filterValue.selected = true;
|
|
filter.countSelectedValues++;
|
|
}else{
|
|
filterValue.selected = false;
|
|
}
|
|
}
|
|
}else{
|
|
for(let filterValue of filter.values) {
|
|
filterValue.selected = false;
|
|
}
|
|
}
|
|
}
|
|
|
|
return filters;
|
|
}
|
|
|
|
/*
|
|
*
|
|
*/
|
|
private createUrlParameters(filters:Filter[], includePage:boolean){
|
|
var allLimits="";//location.search.slice(1);
|
|
this.parameterNames.splice(0,this.parameterNames.length);
|
|
this.parameterValues.splice(0,this.parameterValues.length);
|
|
|
|
for (let filter of filters){
|
|
var filterLimits="";
|
|
if(filter.countSelectedValues > 0){
|
|
for (let value of filter.values){
|
|
if(value.selected == true){
|
|
filterLimits+=((filterLimits.length == 0)?'':',') +'"'+ StringUtils.URIEncode(value.id)+'"';
|
|
}
|
|
}
|
|
this.queryParameters[filter.filterId]=filterLimits;
|
|
if(filterLimits.length > 0){
|
|
this.parameterNames.push(filter.filterId);
|
|
this.parameterValues.push(filterLimits);
|
|
}
|
|
allLimits+=(allLimits.length==0?"?":"&")+((filterLimits.length == 0 )?'':filter.filterId + '='+ filterLimits) ;
|
|
}
|
|
}
|
|
if(this.searchUtils.keyword.length > 0 ){
|
|
allLimits+=(allLimits.length==0?"?":"&")+'keyword=' + this.searchUtils.keyword;
|
|
this.parameterNames.push("keyword");
|
|
this.parameterValues.push(this.searchUtils.keyword);
|
|
}
|
|
|
|
return allLimits;
|
|
}
|
|
|
|
public isFiltered(){
|
|
var filtered=false;
|
|
for (let filter of this.filters){
|
|
if(filter.countSelectedValues > 0){
|
|
filtered = true;
|
|
break;
|
|
}
|
|
}
|
|
if(this.searchUtils.keyword.length > 0 ){
|
|
filtered = true;
|
|
}
|
|
return filtered;
|
|
}
|
|
private clearKeywords(){
|
|
if(this.searchUtils.keyword.length > 0 ){
|
|
this.searchUtils.keyword ='';
|
|
}
|
|
this.goTo(1);
|
|
}
|
|
private clearFilters(){
|
|
for (var i =0 ; i < this.filters.length; i++) {
|
|
for (var j=0; j < this.filters[i].values.length; j++) {
|
|
if(this.filters[i].values[j].selected) {
|
|
this.filters[i].values[j].selected = false;
|
|
}
|
|
}
|
|
this.filters[i].countSelectedValues = 0;
|
|
}
|
|
this.clearKeywords();
|
|
}
|
|
|
|
private removeFilter(value:Value,filter:Filter){
|
|
filter.countSelectedValues--;
|
|
if(value.selected == true){
|
|
value.selected = false;
|
|
}
|
|
this.goTo(1);
|
|
}
|
|
goTo(page:number = 1){
|
|
|
|
this.searchUtils.page=page;
|
|
var table = $('#dpTable').DataTable();
|
|
|
|
table.page( page - 1 ).draw( false );
|
|
|
|
// Object { page: 0, pages: 3, start: 0, end: 10, length: 10, recordsTotal: 28, recordsDisplay: 21, serverSide: false }
|
|
var info = table.page.info();
|
|
this.searchUtils.totalResults = info.recordsDisplay;
|
|
|
|
var urlParameters = this.createUrlParameters(this.filters,true);
|
|
this.location.go(location.pathname,urlParameters);
|
|
}
|
|
|
|
filterChanged($event){
|
|
this.goTo(1);
|
|
}
|
|
keywordChanged($event) {
|
|
this.searchUtils.keyword = $event.value;
|
|
this.goTo(1);
|
|
}
|
|
|
|
sizeChanged($event) {
|
|
this.searchUtils.size = $event.value;
|
|
var table = $('#dpTable').DataTable();
|
|
table.page.len( this.searchUtils.size ).draw();
|
|
this.goTo(1);
|
|
}
|
|
/*
|
|
downloadClicked($event) {
|
|
if($event.value == true) {
|
|
var queryParameters = this.createSearchQueryParameters(this.filters);
|
|
|
|
this.downloadClick.emit({
|
|
value: queryParameters
|
|
});
|
|
}
|
|
}
|
|
*/
|
|
|
|
|
|
getSelectedValues(filter):any{
|
|
var selected = [];
|
|
if(filter.countSelectedValues >0){
|
|
for (var i=0; i < filter.values.length; i++){
|
|
if(filter.values[i].selected){
|
|
selected.push(filter.values[i]);
|
|
}
|
|
}
|
|
}
|
|
return selected;
|
|
|
|
}
|
|
/*
|
|
Trigger a table draw in order to get the initial filtering
|
|
*/
|
|
triggerInitialLoad(){
|
|
setTimeout(function(){
|
|
var table = $('#dpTable').DataTable();
|
|
table.page( 0 ).draw( false );
|
|
|
|
}, 500);
|
|
}
|
|
|
|
/*
|
|
Transform initial - not filtered results to get the filtered number
|
|
*/
|
|
transform(results): any {
|
|
if(results.length > 0) {
|
|
var errorCodes:ErrorCodes = new ErrorCodes();
|
|
this.searchUtils.status = errorCodes.LOADING;
|
|
|
|
var result = results.filter(row=>this.filterAll(row, this.searchUtils.keyword.toLowerCase(),this.filters));
|
|
|
|
let oldTotal = this.searchUtils.totalResults;
|
|
//console.info(result);
|
|
this.searchUtils.totalResults = result.length;
|
|
|
|
var errorCodes:ErrorCodes = new ErrorCodes();
|
|
this.searchUtils.status = errorCodes.DONE;
|
|
if(this.searchUtils.totalResults == 0 ){
|
|
//this.searchUtils.status = errorCodes.NONE;
|
|
}
|
|
|
|
// if(oldTotal != this.searchUtils.totalResults) {
|
|
// args[3].detectChanges();
|
|
// }
|
|
return result;
|
|
}
|
|
return [];
|
|
}
|
|
|
|
filterAll(row: any, query: string, filters:Filter[]) {
|
|
let returnValue: boolean = false;
|
|
|
|
if(query) {
|
|
if(row.title && row.title.name.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
}
|
|
|
|
if(row.type && row.type.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
}
|
|
|
|
if(row.countries && row.countries.length > 0) {
|
|
for(let country of row.countries) {
|
|
if(country.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
if(row.compatibility && row.compatibility.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
}
|
|
|
|
if(row.organizations && row.organizations.length > 0) {
|
|
for(let organization of row.organizations) {
|
|
if(organization.name.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
if(row.name && row.name.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
}
|
|
|
|
if(row.acronym && row.acronym.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
}
|
|
|
|
if(row.grantId && row.grantId.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
}
|
|
|
|
if(row.funder && row.funder.toLowerCase().indexOf(query) > -1) {
|
|
returnValue = true;
|
|
}
|
|
|
|
if(!returnValue) {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
for (let filter of filters){
|
|
if(filter.countSelectedValues > 0){
|
|
for (let value of filter.values){
|
|
if(value.selected == true){
|
|
|
|
// make it generic in future commit
|
|
let field:string = "";
|
|
/*
|
|
let index: number = -1;
|
|
for(let i=0; i<this.columnNames.length; i++) {
|
|
if(filter.title == this.columnNames[i]) {
|
|
index = i;
|
|
}
|
|
}
|
|
*/
|
|
if(filter.title == "Type") {
|
|
field = "type";
|
|
} else if(filter.title == "Compatibility") {
|
|
field = "compatibility";
|
|
} else if(filter.title == "Funder") {
|
|
field = "funder";
|
|
} else if(filter.title == "Country") {
|
|
field = "countries";
|
|
}
|
|
//console.info(row);
|
|
console.info("|"+row[field]+"|"+" "+"|"+value.name+"|");
|
|
//if(row[field] == value.name) {
|
|
if(row[field] &&
|
|
((filter.valueIsExact && (row[field].trim() == value.name.trim()))
|
|
|| (!filter.valueIsExact && (row[field].includes(value.name))))){
|
|
|
|
returnValue = true;
|
|
if(filter.filterOperator == "or") {
|
|
break;
|
|
}
|
|
} else {
|
|
if(filter.filterOperator == "and") {
|
|
return false;
|
|
}
|
|
returnValue = false;
|
|
}
|
|
}
|
|
}
|
|
if(!returnValue) {
|
|
return false;
|
|
}
|
|
}
|
|
}
|
|
|
|
return true;
|
|
}
|
|
filterQuery(data, query){
|
|
if(data.toLowerCase().indexOf(query.toLowerCase()) > -1){
|
|
return true;
|
|
}else{
|
|
return false;
|
|
}
|
|
}
|
|
filterData(row: any, query: string, filters:Filter[]) {
|
|
|
|
|
|
let returnValue: boolean = false;
|
|
|
|
if(query) {
|
|
for(var i=0; i <this.columnNames.length; i++){
|
|
var r= this.filterQuery(row[i], query);
|
|
// console.log(query+" "+ row+" "+r);
|
|
if(r) {
|
|
returnValue = true;
|
|
break;
|
|
}
|
|
}
|
|
|
|
if(!returnValue) {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
for (let filter of filters){
|
|
if(filter.countSelectedValues > 0){
|
|
for (let value of filter.values){
|
|
if(value.selected == true){
|
|
let field = 1;
|
|
/*if(filter.title == "Type") {
|
|
field = 1;
|
|
} else if(filter.title == "Compatibility Level") {
|
|
field = 4;
|
|
} else if(filter.title == "Funder") {
|
|
field = 3
|
|
}*/
|
|
for(let i=0; i<this.columnNames.length; i++) {
|
|
if(filter.title == this.columnNames[i]) {
|
|
field = i;
|
|
}
|
|
}
|
|
|
|
//if(row[field].trim() == value.name.trim()) {
|
|
if((filter.valueIsExact && (row[field].trim() == value.name.trim()))
|
|
|| (!filter.valueIsExact && (row[field].includes(value.name)))){
|
|
returnValue = true;
|
|
if(filter.filterOperator == "or") {
|
|
break;
|
|
}
|
|
} else {
|
|
if(filter.filterOperator == "and") {
|
|
return false;
|
|
}
|
|
returnValue = false;
|
|
}
|
|
}
|
|
}
|
|
if(!returnValue) {
|
|
return false;
|
|
}
|
|
}
|
|
}
|
|
|
|
return true;
|
|
}
|
|
|
|
public encode(param: string): string {
|
|
return StringUtils.URIEncode(param);
|
|
}
|
|
public countFilters():number{
|
|
var filters=0;
|
|
for (let filter of this.filters){
|
|
if(filter.countSelectedValues > 0){
|
|
filters+=filter.countSelectedValues;
|
|
}
|
|
}
|
|
if(this.searchUtils.keyword.length > 0 ){
|
|
filters++;
|
|
}
|
|
return filters;
|
|
}
|
|
}
|