[WIP] Search researcher: work on the page layout - add banner, basic component functionalities
This commit is contained in:
argirok
parent
c6f46a3143
commit
6082e483ba
|
|
@ -1,64 +1,60 @@
|
|||
<div search-input [(value)]="keyword" [placeholder]="'Search for author or ORCID...'"
|
||||
[searchInputClass]="'inner background'" (searchEmitter)="search()"></div>
|
||||
<div class="uk-margin-top">
|
||||
<div style="background: royalblue; height: 200px">
|
||||
|
||||
</div>
|
||||
<div class="uk-section uk-container">
|
||||
<div class=" uk-flex uk-flex-center ">
|
||||
<div search-input [(value)]="keyword" [placeholder]="'Search for author or ORCID...'"
|
||||
[searchInputClass]="'inner background'" (searchEmitter)="search()" class="uk-width-xlarge@l uk-width-large@m"></div>
|
||||
</div>
|
||||
|
||||
<div class="uk-margin-top">
|
||||
<div *ngIf="orcidStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert">
|
||||
<loading></loading>
|
||||
</div>
|
||||
<div *ngIf="orcidStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
|
||||
<div *ngIf="orcidStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger"
|
||||
role="alert">Service not available
|
||||
</div>
|
||||
<div *ngIf="orcidStatus == errorCodes.NONE "
|
||||
class="uk-alert uk-alert-primary "> No results found
|
||||
</div>
|
||||
<div *ngIf="!(orcidStatus == errorCodes.NONE ||
|
||||
orcidStatus == errorCodes.ERROR || orcidStatus == errorCodes.NOT_AVAILABLE)">
|
||||
|
||||
<!-- Debug info -->
|
||||
<!--<div>
|
||||
Orcid found:{{authors.length}} <br>
|
||||
check for results: {{authorsRendered}} <br>
|
||||
Authors found (with OpenAIRE results):{{authorsToShow.length}} <br>
|
||||
page: {{page}}<br>
|
||||
<ng-container *ngFor=" let author of authorsToShow.slice(0,page*size>authorsToShow.length?authorsToShow.length:page*size)">
|
||||
<div *ngIf="author.resultsCount > 0" class="uk-margin-top">{{author.authorGivenName}} {{author.authorFamilyName}} : {{author.id}} <br>
|
||||
<div>Research outcomes:{{author.resultsCount}}</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
<button *ngIf="authorsToShow.length > page*size || authors.length > authorsRendered" class="uk-button uk-button-primary" (click)="loadMore()" >Load more</button>
|
||||
|
||||
<div *ngIf="orcidStatus == errorCodes.NONE "
|
||||
class="uk-alert uk-alert-primary "> No results found
|
||||
</div>
|
||||
|
||||
<!--<div *ngIf="orcidResultsNum >= 0" class="panel-body">
|
||||
<span><span class="uk-text-bold">Showing results for</span>
|
||||
<a target="_blank" href="http://orcid.org/{{authorId}}"> <span
|
||||
class="custom-external"></span> {{authorGivenName}} {{authorFamilyName}} - {{authorId}} </a> :
|
||||
</span>
|
||||
<div *ngIf="authors.length > 1" class=""> In Orcid you can search only by Author. Not the
|
||||
author you are looking for?
|
||||
|
||||
<div class="dropdown">
|
||||
|
||||
<mat-select [(ngModel)]="selectAuthorId" name="select_author"
|
||||
(ngModelChange)="getOrcidResultsById(selectAuthorId)" class="matSelection"
|
||||
[disableOptionCentering]="true"
|
||||
panelClass="matSelectionPanel">
|
||||
<mat-option value="0">Choose another one:</mat-option>
|
||||
<mat-option *ngFor=" let item of authors let i = index"
|
||||
[value]="authors[i].id">{{authors[i].authorGivenName}} {{authors[i].authorFamilyName}} : {{authors[i].id}} </mat-option>
|
||||
</mat-select>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
<div *ngIf="orcidResultsNum == 0" class="uk-alert uk-alert-primary uk-margin-top"> No results found</div>
|
||||
</div>
|
||||
<div *ngIf=" ((orcidResultsNum >0) && (totalPages > 1) && ( 0 < page && page <= totalPages )) "
|
||||
class="uk uk-flex uk-flex-center">
|
||||
|
||||
<!–
|
||||
<paging-no-load [currentPage]="orcidPage" [totalResults]="orcidResultsNum"
|
||||
[term]="keyword" [size]="size"
|
||||
(pageChange)="orcidPageChange($event)"></paging-no-load>
|
||||
|
||||
–>
|
||||
|
||||
</div>
|
||||
</div>-->
|
||||
<div *ngIf="orcidStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert">
|
||||
<span class="loading-gif uk-align-center"></span></div>
|
||||
<div class="uk-grid uk-child-width-1-3">
|
||||
<div *ngFor=" let author of authorsToShow.slice(0,page*size>authorsToShow.length?authorsToShow.length:page*size)" class="uk-padding-small">
|
||||
<div *ngIf="author.resultsCount > 0" class="uk-card uk-card-default uk-card-hover uk-padding-small">
|
||||
<a [routerLink]="['./',author.id]" class="uk-link-reset">
|
||||
<div class="uk-margin-top uk-margin-bottom">
|
||||
|
||||
<span class="uk-border uk-border-circle uk-padding-small uk-text-meta uk-margin-small-right" width="16px" height="16px">
|
||||
<span uk-icon="user"></span></span>
|
||||
{{author.authorGivenName}} {{author.authorFamilyName}}
|
||||
</div>
|
||||
|
||||
<div class="uk-text-xsmall uk-text-secondary uk-margin-medium-top">
|
||||
<img src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="orcid"
|
||||
loading="lazy" style="width:16px; height:16px; margin-right: 3px;">
|
||||
<a [href]="properties.orcidURL + author.id" target="_blank" class="uk-link uk-text-primary">
|
||||
|
||||
{{properties.orcidURL + author.id}}</a></div>
|
||||
<!-- <div>Research outcomes:{{author.resultsCount}}</div>-->
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="uk-flex uk-flex-center">
|
||||
<button *ngIf="authorsToShow.length > page*size || authors.length > authorsRendered" class="uk-button uk-button-default" [class.uk-disabled]="orcidStatus == errorCodes.LOADING" (click)="loadMore()" >Load more</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -6,13 +6,18 @@ import {SearchOrcidService} from "../../openaireLibrary/claims/claim-utils/servi
|
|||
import {SearchResearchResultsService} from "../../openaireLibrary/services/searchResearchResults.service";
|
||||
import {forkJoin, Subscriber} from "rxjs";
|
||||
import {properties} from "../../../environments/environment";
|
||||
import {BaseComponent} from "../../openaireLibrary/sharedComponents/base/base.component";
|
||||
import {Router} from "@angular/router";
|
||||
import {SEOService} from "../../openaireLibrary/sharedComponents/SEO/SEO.service";
|
||||
import {PiwikService} from "../../openaireLibrary/utils/piwik/piwik.service";
|
||||
import {Meta, Title} from "@angular/platform-browser";
|
||||
import {map} from "rxjs/operators";
|
||||
|
||||
@Component({
|
||||
selector: 'search-researcher',
|
||||
templateUrl: './search-researcher.component.html',
|
||||
})
|
||||
export class SearchResearcherComponent implements OnInit {
|
||||
export class SearchResearcherComponent extends BaseComponent implements OnInit {
|
||||
page: number = 1;
|
||||
size: number = 10;
|
||||
public keyword: string = "";//"paolo manghi";//'0000-0001-7291-3210';
|
||||
|
|
@ -20,17 +25,25 @@ export class SearchResearcherComponent implements OnInit {
|
|||
public errorCodes: ErrorCodes = new ErrorCodes();
|
||||
public warningMessage = "";
|
||||
public infoMessage = "";
|
||||
orcidStatus: number = this.errorCodes.NONE;
|
||||
orcidStatus: number = null;
|
||||
authors = [];
|
||||
authorsToShow = [];
|
||||
authorsRendered = 0;
|
||||
subscriptions = [];
|
||||
constructor(private _searchOrcidService: SearchOrcidService,
|
||||
private _searchResearchResultsService: SearchResearchResultsService) {
|
||||
|
||||
}
|
||||
|
||||
private _searchResearchResultsService: SearchResearchResultsService,
|
||||
protected _router: Router,
|
||||
protected seoService: SEOService,
|
||||
protected _piwikService: PiwikService,
|
||||
protected _title: Title,
|
||||
protected _meta: Meta) {
|
||||
super();
|
||||
}
|
||||
ngOnInit() {
|
||||
this.title = 'Researcher Monitors';
|
||||
this.description = 'Researcher Monitors';
|
||||
this.setMetadata();
|
||||
|
||||
if (this.keyword != null && this.keyword.length > 0) {
|
||||
this.search();
|
||||
}
|
||||
|
|
@ -135,6 +148,8 @@ private getOpenaireResultsFor(start, end){
|
|||
|
||||
if (this.authorsToShow.length < this.page * this.size) {
|
||||
this.getOpenaireResultsFor(end, end + (this.size));
|
||||
}else{
|
||||
this.orcidStatus = this.errorCodes.DONE;
|
||||
}
|
||||
}));
|
||||
}else{
|
||||
|
|
@ -154,6 +169,7 @@ private getOpenaireResultsFor(start, end){
|
|||
}
|
||||
|
||||
loadMore(){
|
||||
this.orcidStatus = this.errorCodes.LOADING;
|
||||
let page = this.page + 1;
|
||||
if(page*this.size>this.authorsToShow.length) {
|
||||
if (this.authorsRendered < this.authors.length) {
|
||||
|
|
|
|||
|
|
@ -6,13 +6,14 @@ import {SearchInputModule} from "../../openaireLibrary/sharedComponents/search-i
|
|||
import {MatSelectModule} from "@angular/material/select";
|
||||
import {SearchOrcidServiceModule} from "../../openaireLibrary/claims/claim-utils/service/searchOrcidService.module";
|
||||
import {SearchResearchResultsServiceModule} from "../../openaireLibrary/services/searchResearchResultsService.module";
|
||||
import {LoadingModule} from "../../openaireLibrary/utils/loading/loading.module";
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [SearchResearcherComponent],
|
||||
imports: [
|
||||
CommonModule, SearchResearcherRoutingModule, SearchInputModule, MatSelectModule, SearchOrcidServiceModule, SearchResearchResultsServiceModule
|
||||
CommonModule, SearchResearcherRoutingModule, SearchInputModule, MatSelectModule, SearchOrcidServiceModule, SearchResearchResultsServiceModule, LoadingModule
|
||||
|
||||
]
|
||||
})
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import {common, commonDev} from "../app/openaireLibrary/utils/properties/environ
|
|||
|
||||
let props: EnvProperties = {
|
||||
environment: "development",
|
||||
searchAPIURLLAst: "http://beta.services.openaire.eu/search/v2/api/ 19680",
|
||||
searchAPIURLLAst: "http://beta.services.openaire.eu/search/v2/api/",
|
||||
searchResourcesAPIURL: "https://beta.services.openaire.eu/search/v2/api/resources",
|
||||
monitorServiceAPIURL: "http://duffy.di.uoa.gr:19680/uoa-monitor-service",
|
||||
// monitorServiceAPIURL: "http://duffy.di.uoa.gr:19680/uoa-irish-monitor-service/",
|
||||
|
|
@ -17,7 +17,8 @@ let props: EnvProperties = {
|
|||
piwikSiteId: "407",
|
||||
enablePiwikTrack:false,
|
||||
piwikBaseUrl: 'https://beta.analytics.openaire.eu/piwik.php?idsite=',
|
||||
utilsService: 'http://mpagasas.di.uoa.gr:8000'
|
||||
utilsService: 'http://mpagasas.di.uoa.gr:8000',
|
||||
orcidURL: 'https://orcid.org/'
|
||||
|
||||
}
|
||||
export let properties: EnvProperties = {
|
||||
|
|
|
|||
Loading…
Reference in New Issue