From ead614facced9ce78e596876a1adbeef716fa726 Mon Sep 17 00:00:00 2001 From: "argiro.kokogiannaki" Date: Mon, 8 Mar 2021 15:40:49 +0000 Subject: [PATCH] [Connect|Trunk] remove datatables update search pages for projects/ data providers: use search page component remove tablesearch view Search Communities: remove graph info (add the new variable) git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@60606 d315682c-612b-4755-9ff5-7f18f6832af3 --- angular.json | 10 +- package.json | 4 - src/app/community/community.component.html | 28 +-- src/app/community/community.component.ts | 3 + .../searchCommunities.component.ts | 2 +- .../simple/searchDataProviders.module.ts | 8 +- .../simple/searchDataproviders.component.ts | 126 +++++++---- .../simple/searchProjects.component.ts | 198 +++++++++++------- .../simple/searchProjects.module.ts | 17 +- .../customization/customization.component.ts | 64 +++--- src/assets/connect-custom.css | 1 + src/assets/customization.css | 126 +++++------ src/index.beta.html | 7 +- src/index.html | 5 +- src/index.prod.html | 5 +- 15 files changed, 334 insertions(+), 270 deletions(-) diff --git a/angular.json b/angular.json index e90ffb6..7be801f 100644 --- a/angular.json +++ b/angular.json @@ -21,12 +21,10 @@ ], "styles": [ "src/styles.css", - "src/material.scss", - "node_modules/datatables.net-dt/css/jquery.dataTables.css" + "src/material.scss" ], "scripts": [ "node_modules/jquery/dist/jquery.js", - "node_modules/datatables.net/js/jquery.dataTables.js" ] }, "configurations": { @@ -116,13 +114,11 @@ "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.spec.json", "scripts": [ - "node_modules/jquery/dist/jquery.js", - "node_modules/datatables.net/js/jquery.dataTables.js" + "node_modules/jquery/dist/jquery.js" ], "styles": [ "src/styles.css", - "src/material.scss", - "node_modules/datatables.net-dt/css/jquery.dataTables.css" + "src/material.scss" ], "assets": [ "src/assets" diff --git a/package.json b/package.json index 6451e7c..ab6bc8a 100644 --- a/package.json +++ b/package.json @@ -48,11 +48,8 @@ "@nguniversal/express-engine": "^6.0.0", "@nguniversal/module-map-ngfactory-loader": "^6.0.0", "@types/express": "^4.16.1", - "angular-datatables": "^4.4.1", "clipboard": "^1.5.16", "core-js": "^2.4.1", - "datatables.net": "^1.10.19", - "datatables.net-dt": "^1.10.19", "jquery": "^3.4.1", "ngx-json-ld": "0.1.6", "prom-client": "^11.3.0", @@ -67,7 +64,6 @@ "@angular/cli": "^7.3.9", "@angular/compiler-cli": "7.2.14", "@angular/language-service": "7.2.14", - "@types/datatables.net": "^1.10.17", "@types/jquery": "^3.3.29", "@types/node": "^8.0.30", "cpy-cli": "^1.0.1", diff --git a/src/app/community/community.component.html b/src/app/community/community.component.html index 9c8749b..1c2d3d8 100644 --- a/src/app/community/community.component.html +++ b/src/app/community/community.component.html @@ -499,20 +499,22 @@ - - - -
- Browse OpenAIRE Research Graph through a map of the main concepts linked to Coronavirus +
+ + + +
+ Browse OpenAIRE Research Graph through a map of the main concepts linked to Coronavirus +
+ +
Powered by Opscidia and OpenAIRE Research Graph
- -
Powered by Opscidia and OpenAIRE Research Graph
diff --git a/src/app/searchPages/simple/searchDataProviders.module.ts b/src/app/searchPages/simple/searchDataProviders.module.ts index 948cc50..76b9d24 100644 --- a/src/app/searchPages/simple/searchDataProviders.module.ts +++ b/src/app/searchPages/simple/searchDataProviders.module.ts @@ -4,17 +4,13 @@ import {FormsModule} from '@angular/forms'; import {OpenaireSearchDataprovidersComponent} from './searchDataproviders.component'; import {SearchDataProvidersRoutingModule} from './searchDataProviders-routing.module'; import {PreviousRouteRecorder} from '../../openaireLibrary/utils/piwik/previousRouteRecorder.guard'; - -import {SearchPageTableViewModule} from '../../openaireLibrary/searchPages/searchUtils/searchPageTableView.module'; -import {SearchFormModule} from '../../openaireLibrary/searchPages/searchUtils/searchForm.module'; import {SearchDataprovidersServiceModule} from '../../openaireLibrary/connect/contentProviders/searchDataprovidersService.module'; -import {SearchDataProvidersModule} from "../../openaireLibrary/searchPages/searchDataProviders.module"; +import {NewSearchPageModule} from "../../openaireLibrary/searchPages/searchUtils/newSearchPage.module"; @NgModule({ imports: [ CommonModule, FormsModule, - SearchDataProvidersModule, SearchDataProvidersRoutingModule, - SearchPageTableViewModule, SearchFormModule, SearchDataprovidersServiceModule + SearchDataProvidersRoutingModule, SearchDataprovidersServiceModule, NewSearchPageModule ], declarations: [ diff --git a/src/app/searchPages/simple/searchDataproviders.component.ts b/src/app/searchPages/simple/searchDataproviders.component.ts index 80a815b..08bf2f0 100644 --- a/src/app/searchPages/simple/searchDataproviders.component.ts +++ b/src/app/searchPages/simple/searchDataproviders.component.ts @@ -4,34 +4,47 @@ import { ActivatedRoute} from '@angular/router'; import {ErrorCodes} from '../../openaireLibrary/utils/properties/errorCodes'; import {ErrorMessagesComponent} from '../../openaireLibrary/utils/errorMessages.component'; import {SearchFields} from '../../openaireLibrary/utils/properties/searchFields'; -import {SearchPageTableViewComponent } from '../../openaireLibrary/searchPages/searchUtils/searchPageTableView.component'; import {SearchCustomFilter, SearchUtilsClass} from '../../openaireLibrary/searchPages/searchUtils/searchUtils.class'; import {EnvProperties} from '../../openaireLibrary/utils/properties/env-properties'; import {SearchCommunityDataprovidersService} from '../../openaireLibrary/connect/contentProviders/searchDataproviders.service'; -import {ConnectHelper} from '../../openaireLibrary/connect/connectHelper'; import {PiwikHelper} from '../../utils/piwikHelper'; import {properties} from "../../../environments/environment"; import {CommunitiesService} from "../../openaireLibrary/connect/communities/communities.service"; import {CommunityService} from "../../openaireLibrary/connect/community/community.service"; import {Subscriber} from "rxjs"; +import {AdvancedField} from "../../openaireLibrary/searchPages/searchUtils/searchHelperClasses.class"; +import {NewSearchPageComponent} from "../../openaireLibrary/searchPages/searchUtils/newSearchPage.component"; +import {SearchResult} from "../../openaireLibrary/utils/entities/searchResult"; @Component({ selector: 'openaire-search-dataproviders', template: ` + + + [customFilter]=customFilter + - - ` }) @@ -51,10 +64,18 @@ export class OpenaireSearchDataprovidersComponent { private communityId: string = ''; subscriptions = []; - @ViewChild (SearchPageTableViewComponent) searchPage : SearchPageTableViewComponent ; piwikSiteId = null; customFilter: SearchCustomFilter = null; initialLoad = true; + public allResults =[]; + @ViewChild(NewSearchPageComponent) searchPage: NewSearchPageComponent; + public fieldIds: string[] = this.searchFields.DATASOURCE_ADVANCED_FIELDS; + public fieldIdsMap= this.searchFields.DATASOURCE_FIELDS; + public selectedFields:AdvancedField[] = []; + public disableRefineForms: boolean = false; + public loadPaging: boolean = true; + public oldTotalResults: number = 0; + keyword; constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchCommunityDataprovidersService, private _communitiesService: CommunitiesService, private _communityService: CommunityService) { this.errorCodes = new ErrorCodes(); this.errorMessages = new ErrorMessagesComponent(); @@ -63,26 +84,30 @@ export class OpenaireSearchDataprovidersComponent { } public ngOnInit() { - this.subscriptions.push(this.route.queryParams.subscribe(params => { + this.searchUtils.baseUrl = this.properties.searchLinkToDataProviders; this.subscriptions.push(this._communityService.getCommunityAsObservable().subscribe(community =>{ if(community != null) { this.communityId = community.communityId; this.customFilter = new SearchCustomFilter("Community", "communityId", this.communityId, community.shortTitle); - this.piwikSiteId = PiwikHelper.getSiteId(this.communityId,this.properties.environment); - this.searchUtils.keyword = (params['fv0']?params['fv0']:(params['keyword']?params['keyword']:'')); - //this.filters = this.createFilters(); - //this.searchPage.getParametersFromUrl(params); - if(this.initialLoad) { - this.initialLoad = false; - console.log("Init get results") - this._getResults(params); - } else { - // this.searchPage.transform(this.results); - this.searchPage.goTo(1); - console.log("Init transfrm " + this.searchUtils.keyword) - } + this.piwikSiteId = PiwikHelper.getSiteId(this.communityId, this.properties.environment); + this.subscriptions.push(this.route.queryParams.subscribe(params => { + let page = (params['page'] === undefined) ? 1 : +params['page']; + this.searchUtils.page = (page <= 0) ? 1 : page; + this.searchUtils.size = (params['size']=== undefined)?10:+params['size']; + if(this.searchUtils.size != 5 && this.searchUtils.size != 10 && this.searchUtils.size != 20 && this.searchUtils.size != 50) { + this.searchUtils.size = 10; + } + this.keyword = (params['fv0']?params['fv0']:(params['keyword']?params['keyword']:'')); + this.selectedFields = []; + this.searchPage.prepareSearchPage(this.fieldIds, this.selectedFields, [], [], this.fieldIdsMap, this.customFilter, params, "dataprovider"); + if (this.initialLoad) { + this.initialLoad = false; + this._getResults(); + } else { + this.filterResults(); + } + })); } - })); })); } @@ -94,28 +119,17 @@ export class OpenaireSearchDataprovidersComponent { } }); } - private _getResults(params){ + private _getResults(){ this.searchUtils.status = this.errorCodes.LOADING; this.disableForms = true; this.enableSearchView = false; this.results = []; this.searchUtils.totalResults = 0; - - let size: number = 0; - this.subscriptions.push(this._searchDataprovidersService.searchDataproviders(this.properties, this.communityId).subscribe( data => { - this.searchUtils.totalResults = data.length; - this.results = data; + this.allResults = this.parseResults(data); this.searchUtils.status = this.errorCodes.DONE; - if(this.searchUtils.totalResults == 0 ){ - this.searchUtils.status = this.errorCodes.NONE; - } else { - this.searchPage.triggerInitialLoad(); - this.searchPage.transform(this.results, this.searchUtils); - this.disableForms = false; - } - this.enableSearchView = true; + this.filterResults(); }, err => { /* @@ -137,7 +151,27 @@ export class OpenaireSearchDataprovidersComponent { } )); } - + parseResults(data){ + let results:SearchResult[]=[]; + for(let result of data){ + let sResult:SearchResult = new SearchResult(); + sResult.id = result.openaireId; + sResult.title = {name:"", accessMode: null, sc39: null}; + sResult.title.name = result.officialname?result.officialname:result.name; + results.push(sResult); + } + return results; + } + filterResults(){ + let results = this.allResults.filter(value => { return value.title.name.toLowerCase().indexOf(this.keyword.toLowerCase()) !=-1 }) + // this.oldTotalResults = results.length; + this.searchUtils.totalResults = results.length; + this.results = results.slice((this.searchUtils.page - 1) * this.searchUtils.size, this.searchUtils.page *this.searchUtils.size ); + this.searchUtils.status = this.results.length == 0 ? this.errorCodes.NONE: this.errorCodes.DONE; + this.searchPage.buildPageURLParameters(this.filters, [], false); + this.disableForms = false; + this.enableSearchView = true; + } private handleError(message: string, error) { console.error("Content Providers simple Search Page: "+message, error); } diff --git a/src/app/searchPages/simple/searchProjects.component.ts b/src/app/searchPages/simple/searchProjects.component.ts index c8ba54a..03eb746 100644 --- a/src/app/searchPages/simple/searchProjects.component.ts +++ b/src/app/searchPages/simple/searchProjects.component.ts @@ -1,39 +1,48 @@ import {Component, ViewChild} from '@angular/core'; -import { ActivatedRoute} from '@angular/router'; +import {ActivatedRoute} from '@angular/router'; -import { Filter, Value} from '../../openaireLibrary/searchPages/searchUtils/searchHelperClasses.class'; +import {AdvancedField, Filter, Value} from '../../openaireLibrary/searchPages/searchUtils/searchHelperClasses.class'; import {ErrorCodes} from '../../openaireLibrary/utils/properties/errorCodes'; -import {ErrorMessagesComponent} from '../../openaireLibrary/utils/errorMessages.component'; +import {ErrorMessagesComponent} from '../../openaireLibrary/utils/errorMessages.component'; import {SearchFields} from '../../openaireLibrary/utils/properties/searchFields'; -import {SearchPageTableViewComponent } from '../../openaireLibrary/searchPages/searchUtils/searchPageTableView.component'; import {SearchCustomFilter, SearchUtilsClass} from '../../openaireLibrary/searchPages/searchUtils/searchUtils.class'; import {EnvProperties} from '../../openaireLibrary/utils/properties/env-properties'; import {SearchCommunityProjectsService} from '../../openaireLibrary/connect/projects/searchProjects.service'; import {PiwikHelper} from '../../utils/piwikHelper'; -import {ConnectHelper} from '../../openaireLibrary/connect/connectHelper'; import {properties} from "../../../environments/environment"; -import {CommunitiesService} from "../../openaireLibrary/connect/communities/communities.service"; import {CommunityService} from "../../openaireLibrary/connect/community/community.service"; import {Subscriber} from "rxjs"; +import {NewSearchPageComponent} from "../../openaireLibrary/searchPages/searchUtils/newSearchPage.component"; +import {SearchResult} from "../../openaireLibrary/utils/entities/searchResult"; @Component({ selector: 'openaire-search-projects', template: ` + - + [simpleSearchLink]="properties.searchLinkToProjects" + [disableForms]="disableForms" + [disableRefineForms]="disableRefineForms" + [loadPaging]="loadPaging" + [oldTotalResults]="oldTotalResults" + [openaireLink]="'https://' + (properties.environment == 'production'?'':'beta.') + 'explore.openaire.eu/search/find/projects'" + [includeOnlyResultsAndFilter]="false" + [piwikSiteId]=piwikSiteId [hasPrefix]="false" + searchFormClass="datasourcesTableSearchForm" [entitiesSelection]="true" [showSwitchSearchLink]="false" + [filters]="filters" + [simpleView]="true" formPlaceholderText="Search by name..." + [showResultCount]="false" [showIndexInfo]="false" [showDownload]="false" + [sort]="false" [showBreadcrumb]="true"> + [customFilter]=customFilter + ` }) @@ -42,12 +51,12 @@ export class OpenaireSearchProjectsComponent { private errorMessages: ErrorMessagesComponent; public columnNames = ['Project', 'GrantId', 'Funder']; public results =[]; + public originalFilters =[]; public filters =[]; public searchUtils:SearchUtilsClass = new SearchUtilsClass(); subscriptions = []; - public _location:Location; public searchFields:SearchFields = new SearchFields(); - public refineFields: string[] = [];// = this.searchFields.JOURNAL_FIELDS; + public refineFields: string[] = ["funder"]; properties:EnvProperties = properties; public disableForms: boolean = false; @@ -55,32 +64,51 @@ export class OpenaireSearchProjectsComponent { private communityId: string = ''; - @ViewChild (SearchPageTableViewComponent) searchPage : SearchPageTableViewComponent ; piwikSiteId = null; customFilter: SearchCustomFilter = null; initialLoad = true; - constructor (private route: ActivatedRoute, private _searchProjectsService: SearchCommunityProjectsService, private _communitiesService: CommunitiesService, private _communityService: CommunityService) { + public allResults =[]; + @ViewChild(NewSearchPageComponent) searchPage: NewSearchPageComponent; + public fieldIds: string[] = this.searchFields.PROJECT_ADVANCED_FIELDS; + public fieldIdsMap= this.searchFields.PROJECT_FIELDS; + public selectedFields:AdvancedField[] = []; + public disableRefineForms: boolean = false; + public loadPaging: boolean = true; + public oldTotalResults: number = 0; + keyword; + constructor (private route: ActivatedRoute, private _searchProjectsService: SearchCommunityProjectsService, private _communityService: CommunityService) { this.errorCodes = new ErrorCodes(); this.errorMessages = new ErrorMessagesComponent(); this.searchUtils.status = this.errorCodes.LOADING; } public ngOnInit() { - this.subscriptions.push(this.route.queryParams.subscribe(params => { + this.searchUtils.baseUrl = this.properties.searchLinkToProjects; this.subscriptions.push(this._communityService.getCommunityAsObservable().subscribe(community =>{ if(community != null){ this.communityId = community.communityId; this.customFilter = new SearchCustomFilter("Community", "communityId", this.communityId, community.shortTitle); this.piwikSiteId = PiwikHelper.getSiteId(this.communityId,this.properties.environment); - this.searchUtils.keyword = (params['fv0']?params['fv0']:(params['keyword']?params['keyword']:'')); - if(this.initialLoad) { - this.initialLoad = false; - this._getResults(params); - }else{ - this.searchPage.goTo(1); - } + this.subscriptions.push(this.route.queryParams.subscribe(params => { + let page = (params['page'] === undefined) ? 1 : +params['page']; + this.searchUtils.page = (page <= 0) ? 1 : page; + this.searchUtils.size = (params['size']=== undefined)?10:+params['size']; + if(this.searchUtils.size != 5 && this.searchUtils.size != 10 && this.searchUtils.size != 20 && this.searchUtils.size != 50) { + this.searchUtils.size = 10; + } + this.keyword = (params['fv0']?params['fv0']:(params['keyword']?params['keyword']:'')); + this.selectedFields = []; + this.searchPage.prepareSearchPage(this.fieldIds, this.selectedFields, this.refineFields, [], this.fieldIdsMap, this.customFilter, params, "project"); + this.filters = []; + this.searchPage.prepareFiltersToShow(this.filters, 0); + if(this.initialLoad) { + this.initialLoad = false; + this._getResults(); + }else{ + this.filterResults(); + } + })); } - })); })); } @@ -91,50 +119,20 @@ export class OpenaireSearchProjectsComponent { } }); } - private _getResults(params){ + private _getResults(){ this.searchUtils.status = this.errorCodes.LOADING; this.disableForms = true; this.enableSearchView = false; this.results = []; this.searchUtils.totalResults = 0; - - let size: number = 0; - this.subscriptions.push(this._searchProjectsService.searchProjects(this.properties, this.communityId).subscribe( data => { - // data=data.slice(0,150) - this.filters = this.createFilters(data, params); - - this.searchUtils.totalResults = data.length; - //console.info("search Projects [total results:"+this.searchUtils.totalResults+"]"); - this.results = data; - - this.searchPage.checkSelectedFilters(this.filters); - - //var errorCodes:ErrorCodes = new ErrorCodes(); - this.searchUtils.status = this.errorCodes.DONE; - if(this.searchUtils.totalResults == 0 ){ - this.searchUtils.status = this.errorCodes.NONE; - } else { - this.searchPage.triggerInitialLoad(); - this.searchPage.transform(this.results, this.searchUtils); - this.disableForms = false; - } - this.enableSearchView = true; + this.originalFilters = this.createFilters(data); + this.allResults = this.parseResults(data); + this.filterResults(); }, err => { - /* - console.log(err); - //TODO check erros (service not available, bad request) - if(err.status == '404') { - this.searchUtils.status = this.errorCodes.NOT_FOUND; - } else if(err.status == '500') { - this.searchUtils.status = this.errorCodes.ERROR; - } else { - this.searchUtils.status = this.errorCodes.NOT_AVAILABLE; - } - */ this.handleError("Error getting projects for community with id: "+this.communityId, err); this.searchUtils.status = this.errorMessages.getErrorCode(err.status); @@ -142,24 +140,17 @@ export class OpenaireSearchProjectsComponent { } )); } - private setFilters(){ - //TODO set filters from - } - private createFilters(data, params):Filter[] { + + private createFilters(data):Filter[] { let length = Array.isArray(data) ? data.length : 1; var filter_names=["Funder"]; - var filter_ids=["relfunder"]; - var searchFields = new SearchFields(); - var filter_original_ids = ["relfunder"];//searchFields.JOURNAL_FIELDS; + var filter_ids=["funder"]; + var filter_original_ids = ["funder"]; - this.refineFields = ["relfunder"]; - this.searchPage.refineFields = this.refineFields; - this.searchPage.getParametersFromUrl(params); - - var value_names=[/*["Journal", "Journal Aggregator\/Publisher"]*/]; - var value_original_ids=[/*["pubsrepository::journal", "aggregator::pubsrepository::journals"]*/]; + var value_names=[]; + var value_original_ids=[]; var funders = new Set(); var value_name = []; @@ -200,6 +191,55 @@ export class OpenaireSearchProjectsComponent { return filters; } + parseResults(data){ + let results:SearchResult[]=[]; + for(let result of data){ + let sResult:SearchResult = new SearchResult(); + sResult.id = result.openaireId; + sResult.title = {name:"", accessMode: null, sc39: null}; + sResult.title.name = result.name; + sResult.acronym = result['acronym']; + sResult.code = result['grantId']; + sResult['funderShortname'] = result['funder']; + results.push(sResult); + } + return results; + } + filterResults(){ + this.searchUtils.refineStatus = this.errorCodes.LOADING; + this.searchUtils.status = this.errorCodes.LOADING; + this.disableForms = true; + this.disableRefineForms = true; + this.enableSearchView = false; + let results = this.allResults.filter(value => { return value.title.name.toLowerCase().indexOf(this.keyword.toLowerCase()) !=-1 }); + let funderFilterValues = []; + for(let filter of this.filters){ + if(filter.countSelectedValues > 0){ + for(let value of filter.values){ + if(value.selected) { + funderFilterValues.push(value.name); + } + } + } + } + if(funderFilterValues.length > 0) { + results = results.filter(value => { + return funderFilterValues.indexOf(value.funderShortname) != -1 + }); + } + this.oldTotalResults = results.length; + this.searchUtils.totalResults = results.length; + this.subscriptions.push(setTimeout(() => { + this.filters = this.searchPage.prepareFiltersToShow(this.originalFilters, this.allResults.length); + this.results = results.slice((this.searchUtils.page - 1) * this.searchUtils.size, this.searchUtils.page *this.searchUtils.size ); + this.searchUtils.status = this.results.length == 0 ? this.errorCodes.NONE: this.errorCodes.DONE; + this.disableForms = false; + this.disableRefineForms = false; + this.enableSearchView = true; + this.searchUtils.refineStatus = this.errorCodes.DONE; + }, 300)); + + } private handleError(message: string, error) { console.error("Projects simple Search Page: "+message, error); } diff --git a/src/app/searchPages/simple/searchProjects.module.ts b/src/app/searchPages/simple/searchProjects.module.ts index 58d98d9..6238567 100644 --- a/src/app/searchPages/simple/searchProjects.module.ts +++ b/src/app/searchPages/simple/searchProjects.module.ts @@ -1,20 +1,19 @@ -import { NgModule} from '@angular/core'; -import { CommonModule } from '@angular/common'; -import { FormsModule } from '@angular/forms'; +import {NgModule} from '@angular/core'; +import {CommonModule} from '@angular/common'; +import {FormsModule} from '@angular/forms'; -import{ SearchProjectsRoutingModule} from './searchProjects-routing.module'; -import{OpenaireSearchProjectsComponent} from './searchProjects.component'; +import {SearchProjectsRoutingModule} from './searchProjects-routing.module'; +import {OpenaireSearchProjectsComponent} from './searchProjects.component'; import {PreviousRouteRecorder} from '../../openaireLibrary/utils/piwik/previousRouteRecorder.guard'; -import { SearchPageTableViewModule} from '../../openaireLibrary/searchPages/searchUtils/searchPageTableView.module'; import {DataProvidersServiceModule} from '../../openaireLibrary/services/dataProvidersService.module'; -import {SearchFormModule} from '../../openaireLibrary/searchPages/searchUtils/searchForm.module'; import {SearchProjectsServiceModule} from '../../openaireLibrary/connect/projects/searchProjectsService.module'; +import {NewSearchPageModule} from "../../openaireLibrary/searchPages/searchUtils/newSearchPage.module"; @NgModule({ imports: [ - CommonModule, FormsModule, SearchProjectsRoutingModule, SearchPageTableViewModule, - DataProvidersServiceModule, SearchFormModule, SearchProjectsServiceModule + CommonModule, FormsModule, SearchProjectsRoutingModule, + DataProvidersServiceModule, SearchProjectsServiceModule, NewSearchPageModule ], declarations: [ diff --git a/src/app/utils/customization/customization.component.ts b/src/app/utils/customization/customization.component.ts index 995bfd2..e273e7e 100644 --- a/src/app/utils/customization/customization.component.ts +++ b/src/app/utils/customization/customization.component.ts @@ -58,7 +58,7 @@ export class CustomizationComponent { let secondaryColor = "#FFC400"; // TODO When customization is updated remove the following and build the css - this.document.getElementById('customCss').setAttribute('href', "/assets/customization.css?v=0"); + this.document.getElementById('customCssfile').setAttribute('href', "/assets/customization.css?v=0"); if(this.communityId === 'covid-19') { mainColor = "#03ADEE"; @@ -73,7 +73,9 @@ export class CustomizationComponent { --portal-dark-color: `+secondaryColor+`; } `; - + // this.layout = new CustomizationOptions(); + // + // this.buildCss(); try { if( this.document.getElementById('customStyle')){ try { @@ -104,7 +106,7 @@ export class CustomizationComponent { } } - /*private buildCss() { + private buildCss() { if(typeof document === 'undefined') { return; } @@ -115,18 +117,19 @@ export class CustomizationComponent { //Panel background css = css.concat(' .communityPanelBackground:not(bottom) { '); css = css.concat(' border-style: ' + (this.layout.panel.background.borderStyle != null ? this.layout.panel.background.borderStyle : 'solid') + ';'); - css = css.concat(' border-color: ' + (this.layout.panel.background.borderColor != null ? this.layout.panel.background.borderColor : 'transparent') + ';'); - css = css.concat(' border-width: ' + (this.layout.panel.background.borderWidth != null ? this.layout.panel.background.borderWidth : '1') + 'px;'); + css = css.concat(' border-color: ' + (this.layout.panel.background.borderColor != null ? this.layout.panel.background.borderColor : this.layout.mainColor) + ';'); + css = css.concat(' border-width: ' + (this.layout.panel.background.borderWidth != null ? this.layout.panel.background.borderWidth : '0') + 'px;'); css = css.concat(' }'); css = css.concat(' .communityPanelBackground, .communityPanelBackground .uk-section-primary {'); css = css.concat(' background-color: '+ (this.layout.panel.background.color?this.layout.panel.background.color:this.layout.mainColor) + ';}') //PAnel fonts + //TODO changed based on panel for dark or light css = css.concat(' .communityPanelBackground {'); css = css.concat(' color:' + (this.layout.panel.fonts.color != null ? this.layout.panel.fonts.color : 'white') + ' !important;'); - css = css.concat(this.layout.panel.fonts.family != null ? ('font-family: ' + this.layout.panel.fonts.family + ' !important;') : ''); - css = css.concat((this.layout.panel.fonts.size != null ? ('font-size: ' + this.layout.panel.fonts.size + 'px !important;') : '')); - css = css.concat(this.layout.panel.fonts.weight != null ? ('font-weight: ' + this.layout.panel.fonts.weight + '!important;') : ''); + // css = css.concat(this.layout.panel.fonts.family != null ? ('font-family: ' + this.layout.panel.fonts.family + ' !important;') : ''); + // css = css.concat((this.layout.panel.fonts.size != null ? ('font-size: ' + this.layout.panel.fonts.size + 'px !important;') : '')); + // css = css.concat(this.layout.panel.fonts.weight != null ? ('font-weight: ' + this.layout.panel.fonts.weight + '!important;') : ''); css = css.concat(' }'); css = css.concat(' .communityPanelBackground svg .stroke_line {'); @@ -138,24 +141,37 @@ export class CustomizationComponent { css = css.concat(' }'); - css = css.concat(' .communityPanelBackground div.uk-modal{color:#666 !important;}'); + // css = css.concat(' .communityPanelBackground div.uk-modal{color:#666 !important;}'); + //TODO changed based on panel for dark or light - css = css.concat(' .communityPanelBackground .uk-h6:not(.ignoreCommunityPanelBackground),.communityPanelBackground .uk-h5:not(.ignoreCommunityPanelBackground),.communityPanelBackground .uk-h4:not(.ignoreCommunityPanelBackground),.communityPanelBackground .uk-h3:not(.ignoreCommunityPanelBackground), .communityPanelBackground .uk-h2:not(.ignoreCommunityPanelBackground),.communityPanelBackground .uk-h1:not(.ignoreCommunityPanelBackground) {') + css = css.concat(` + .communityPanelBackground .uk-h6:not(.ignoreCommunityPanelBackground), +.communityPanelBackground .uk-h5:not(.ignoreCommunityPanelBackground), +.communityPanelBackground .uk-h4:not(.ignoreCommunityPanelBackground), +.communityPanelBackground .uk-h3:not(.ignoreCommunityPanelBackground), +.communityPanelBackground .uk-h2:not(.ignoreCommunityPanelBackground), +.communityPanelBackground .uk-h1:not(.ignoreCommunityPanelBackground), +.communityPanelBackground h6:not(.ignoreCommunityPanelBackground), +.communityPanelBackground h5:not(.ignoreCommunityPanelBackground), +.communityPanelBackground h4:not(.ignoreCommunityPanelBackground), +.communityPanelBackground h3:not(.ignoreCommunityPanelBackground), +.communityPanelBackground h2:not(.ignoreCommunityPanelBackground), +.communityPanelBackground h1:not(.ignoreCommunityPanelBackground){`) css = css.concat(' color: ' + (this.layout.panel.title.color != null ? this.layout.panel.title.color : 'white') + ' !important;' ); css = css.concat(' }'); - css = css.concat(' .communityPanelBackground .uk-h5:not(.ignoreCommunityPanelBackground){'); + /*css = css.concat(' .communityPanelBackground .uk-h5:not(.ignoreCommunityPanelBackground){'); css = css.concat((this.layout.panel.title.family != null ? ('font-family: ' + this.layout.panel.title.family + ' !important;') : '')); css = css.concat((this.layout.panel.title.size != null ? ('font-size: ' + this.layout.panel.title.size + 'px !important;') : '')); css = css.concat((this.layout.panel.title.weight != null ? ('font-weight: ' + this.layout.panel.title.weight + '!important;') : '')); - css = css.concat(' }'); + css = css.concat(' }');*/ //Panel links css = css.concat(' .communityPanelBackground .uk-link:not(.ignoreCommunityPanelBackground), .communityPanelBackground a:not(.uk-button):not(.uk-button-text):not(.ignoreCommunityPanelBackground), .portal-card a {'); css = css.concat(' color:'+(this.layout.panel.onDarkBackground ? (this.layout.links.darkBackground.color?this.layout.links.darkBackground.color:'white') :(this.layout.links.lightBackground.color?this.layout.links.lightBackground.color:'var(--portal-main-color)') ) + ' !important;'); - css = css.concat((this.layout.panel.onDarkBackground ? (this.layout.links.darkBackground.family?('font-family: ' + this.layout.links.darkBackground.family + ' !important;') : '') :'' )); - css = css.concat((this.layout.panel.onDarkBackground ? (this.layout.links.darkBackground.size?('font-size: ' + this.layout.links.darkBackground.size + 'px !important;') : '') :'' )); + // css = css.concat((this.layout.panel.onDarkBackground ? (this.layout.links.darkBackground.family?('font-family: ' + this.layout.links.darkBackground.family + ' !important;') : '') :'' )); + // css = css.concat((this.layout.panel.onDarkBackground ? (this.layout.links.darkBackground.size?('font-size: ' + this.layout.links.darkBackground.size + 'px !important;') : '') :'' )); css = css.concat(' }'); //Panel links - hover @@ -175,15 +191,15 @@ export class CustomizationComponent { css = css.concat(' }'); - css = css.concat(' .communityBorder {'); +/* css = css.concat(' .communityBorder {'); css = css.concat(' border-color: ' + (this.layout.box.borderColor != null ? this.layout.box.borderColor : 'var(--portal-main-color)') + ';'); css = css.concat(' border-style: ' + (this.layout.box.borderStyle != null ? this.layout.box.borderStyle : 'solid') + ';'); css = css.concat(' border-width: ' + (this.layout.box.borderWidth != null ? this.layout.box.borderWidth : '2') + 'px;'); css = css.concat(' border-radius: ' + (this.layout.box.borderRadius != null ? this.layout.box.borderRadius : '6') + 'px;'); - css = css.concat(' }'); + css = css.concat(' }');*/ /!*Panel Elements & cards*!/ - css = css.concat(' .communityPanelBackground .uk-card:not(.ignoreCommunityPanelBackground), .communityPanelBackground .uk-label:not(.ignoreCommunityPanelBackground) {'); +/* css = css.concat(' .communityPanelBackground .uk-card:not(.ignoreCommunityPanelBackground), .communityPanelBackground .uk-label:not(.ignoreCommunityPanelBackground) {'); css = css.concat(' background-color: ' + (this.layout.panel.panelElements.backgroundColor != null ? this.layout.panel.panelElements.backgroundColor : 'rgba(255, 255, 255, 0.5)') + ';'); css = css.concat( 'border-color: ' + (this.layout.panel.panelElements.borderColor != null ? this.layout.panel.panelElements.borderColor : 'rgba(255, 255, 255, 0.5)') + ';'); css = css.concat(' }'); @@ -201,7 +217,7 @@ export class CustomizationComponent { css = css.concat(' .communityPanelBackground .uk-card:not(.ignoreCommunityPanelBackground), .communityPanelBackground .uk-label:not(.ignoreCommunityPanelBackground) {'); css = css.concat(' color:'+(this.layout.panel.panelElements.color != null ? this.layout.panel.panelElements.color : 'rgba(255, 255, 255, 0.5)')+';'); css = css.concat(); - css = css.concat(' }'); + css = css.concat(' }');*/ css = css.concat(' .uk-button:not(.uk-button-text){'); css = css.concat(' border-radius:' + (this.layout.buttons.lightBackground.borderRadius != null ? this.layout.buttons.lightBackground.borderRadius : '4') + 'px;'); @@ -220,7 +236,7 @@ export class CustomizationComponent { css = css.concat(' .uk-button:not(.uk-button-text):not(.uk-button-default):not(.uk-button-primary):hover, .portal-button:hover {'); css = css.concat(' background-color:' + (this.layout.buttons.lightBackground.onHover.backgroundColor != null ? this.layout.buttons.lightBackground.onHover.backgroundColor : '#154B71') + ';'); css = css.concat(' color: '+ (this.layout.buttons.lightBackground.onHover.color != null ? this.layout.buttons.lightBackground.onHover.color : 'white') + ';'); - css = css.concat(' border-color: ' + (this.layout.buttons.lightBackground.onHover.color != null ? this.layout.buttons.lightBackground.onHover.color : 'transparent') + ';'); + css = css.concat(' border-color: ' + (this.layout.buttons.lightBackground.onHover.borderColor != null ? this.layout.buttons.lightBackground.onHover.borderColor : 'transparent') + ';'); css = css.concat(' }'); /!*Buttons*!/ css = css.concat(' .communityPanelBackground .uk-button:not(.ignoreCommunityPanelBackground) {'); @@ -257,7 +273,7 @@ export class CustomizationComponent { +(this.layout.panel.onDarkBackground ? (this.layout.buttons.darkBackground.onHover.borderColor?this.layout.buttons.darkBackground.onHover.borderColor:' #eeeeee ') :(this.layout.buttons.lightBackground.onHover.borderColor?this.layout.buttons.lightBackground.onHover.borderColor:'var(--portal-dark-color)') ) + ' !important;'); css = css.concat(' }'); - +// console.debug(css) let css1 = ` .uk-navbar-dropdown { @@ -281,8 +297,8 @@ export class CustomizationComponent { `; - css = css.concat(css1); - console.log(css); - appendCss(css); - }*/ + // css = css.concat(css1); + // console.log(css); + // appendCss(css); + } } diff --git a/src/assets/connect-custom.css b/src/assets/connect-custom.css index b34689d..f6a550b 100644 --- a/src/assets/connect-custom.css +++ b/src/assets/connect-custom.css @@ -133,6 +133,7 @@ div:not(.connect_App) bottom .uk-totop { /*border-bottom-right-radius: 0;*/ border-radius: 4px 0px 0px 4px; box-shadow: 0px 2px 6px #00000038; + border-width: 0px; } .subscribed-button { diff --git a/src/assets/customization.css b/src/assets/customization.css index fde8c93..7f6de8d 100644 --- a/src/assets/customization.css +++ b/src/assets/customization.css @@ -1,3 +1,4 @@ + .communityPanelBackground:not(bottom) { border-style: solid; border-color: var(--portal-main-color); @@ -11,9 +12,7 @@ .communityPanelBackground { color: #ffffff !important; - font-family: Open Sans !important; - font-size: 14px !important; - font-weight: 400!important; + } .communityPanelBackground svg .stroke_line { @@ -24,9 +23,6 @@ fill: #ffffff !important; } -.communityPanelBackground div.uk-modal { - color: #666 !important; -} .communityPanelBackground .uk-h6:not(.ignoreCommunityPanelBackground), .communityPanelBackground .uk-h5:not(.ignoreCommunityPanelBackground), @@ -63,7 +59,7 @@ .uk-link, a:not(.uk-button), -.uk-navbar-dropdown-nav>li>a, +/*.uk-navbar-dropdown-nav>li>a,*/ .uk-navbar-nav>li>a, .loginLink, .uk-tab>.uk-active>a, @@ -72,68 +68,6 @@ a:not(.uk-button), color: var(--portal-main-color); } -.uk-link:hover, -a:not(.uk-button):hover, -.uk-navbar-dropdown-nav>li>a:focus, -.uk-navbar-dropdown-nav>li>a:hover, -.uk-navbar-nav>li>a:hover, -.uk-navbar-nav>li>a:focus, -.uk-navbar-nav>li>a:active, -.uk-navbar-nav>li:hover>a, -.uk-navbar-dropdown-nav>li.uk-active>a, -.uk-tab>.uk-active>a, -.uk-navbar-nav>li.uk-active>a, -.uk-navbar-container:not(.uk-navbar-transparent) .uk-navbar-nav>li.uk-active>a { - color: var(--portal-dark-color); -} - -.communityBorder { - border-color: var(--portal-main-color); - border-style: solid; - border-width: 2px; - border-radius: 6px; -} - -.communityPanelBackground .uk-card:not(.ignoreCommunityPanelBackground), -.communityPanelBackground .uk-label:not(.ignoreCommunityPanelBackground) { - background-color: rgba(255, 255, 255, 0.5); - border-color: rgba(255, 255, 255, 0.5); -} - -.communityPanelBackground .uk-label:not(.ignoreCommunityPanelBackground) a { - border-color: rgba(255, 255, 255, 0.98); - border-bottom: 1px solid; -} - -.communityPanelBackground .uk-label:not(.ignoreCommunityPanelBackground) a:hover { - border-color: rgba(255, 255, 255, 0.5); -} - -.communityPanelBackground .uk-card:not(.ignoreCommunityPanelBackground), -.communityPanelBackground .uk-label:not(.ignoreCommunityPanelBackground) { - color: #ffffff; -} - -.uk-button:not(.uk-button-text) { - /*border-radius: 4px;*/ -} - -/*.uk-button:not(.uk-button-text):not(.uk-button-default):not(.uk-button-primary), -.portal-button { - background-color: #003052; - color: #ffffff; - border-color:#003052; - border-style: solid; - border-width: 1px; -} - -/*.uk-button:not(.uk-button-text):not(.uk-button-default):not(.uk-button-primary):hover,*/ -/*.portal-button:hover {*/ -/* background-color: #154B71;*/ -/* color: #ffffff;*/ -/* border-color: #ffffff;*/ -/*}*/ - .communityPanelBackground .uk-button:not(.ignoreCommunityPanelBackground) { background-color: #ffffff !important; @@ -152,13 +86,32 @@ a:not(.uk-button):hover, border-color: #eeeeee !important; } -.uk-navbar-dropdown { - background-color: white; +.uk-navbar-dropdown-nav>li>a:focus, +.uk-navbar-dropdown-nav>li>a:hover, +.uk-navbar-nav>li>a:hover, +.uk-navbar-nav>li>a:focus, +.uk-navbar-nav>li>a:active, +.uk-navbar-nav>li:hover>a, +.uk-navbar-dropdown-nav>li.uk-active>a, +.uk-tab>.uk-active>a, +.uk-navbar-nav>li.uk-active>a, +.uk-navbar-container:not(.uk-navbar-transparent) .uk-navbar-nav>li.uk-active>a +{ + color: var(--portal-main-color) !important; +} +.uk-link:hover, a:not(.uk-button):hover{ + color: var(--portal-dark-color) ; +} +.navbar .nav > li > .dropdown-menu, .uk-navbar-dropdown { + background-color: white !important; color: #666; box-shadow: 0 5px 12px rgba(0, 0, 0, .15); + /*border:var(--portal-main-color) 1px solid;*/ } - +.uk-navbar-dropdown-nav > li > a{ + color: #666 !important; +} .customTabs .uk-tab>.uk-active>a { border-color: var(--portal-main-color); } @@ -173,7 +126,7 @@ a:not(.uk-button):hover, } .portal-link:hover { - text-decoration: none !important; + /*text-decoration: none !important;*/ color: var(--portal-dark-color) !important; } @@ -184,3 +137,30 @@ a:not(.uk-button):hover, #stickyNavbar{ box-shadow: 0 1px 1px #0000004D; } +.uk-button-primary{ + color: white !important; + background-color: var(--portal-main-color) !important; + border-color: var(--portal-main-color) !important; +} +.uk-button-primary:hover{ + background-color: var(--portal-dark-color) !important; + border-color: var(--portal-dark-color) !important; +} +.uk-button-secondary, .uk-button-default{ + color: var(--portal-main-color) !important; + background-color: white !important; + border-color: var(--portal-main-color) !important; +} +.uk-button-secondary:hover, .uk-button-default:hover{ + color: white !important; + background-color: var(--portal-main-color) !important; + border-color: var(--portal-main-color) !important; +} +.uk-alert-primary{ + color: var(--portal-main-color); + border-color: var(--portal-main-color); +} + +.uk-text-primary{ + color: var(--portal-main-color) !important; +} diff --git a/src/index.beta.html b/src/index.beta.html index afc7af0..7bed92d 100644 --- a/src/index.beta.html +++ b/src/index.beta.html @@ -53,10 +53,9 @@ - - - - + + diff --git a/src/index.html b/src/index.html index c9420e2..e4680d0 100644 --- a/src/index.html +++ b/src/index.html @@ -51,8 +51,9 @@ - - + + diff --git a/src/index.prod.html b/src/index.prod.html index ec6e3df..6f0b50e 100644 --- a/src/index.prod.html +++ b/src/index.prod.html @@ -51,8 +51,9 @@ - - + +