progress for landing pages redesign
This commit is contained in:
parent
57eac1b08b
commit
beebd6c6d7
|
@ -34,19 +34,10 @@
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
||||||
<!-- center box-->
|
<!-- center box-->
|
||||||
<div class="uk-width-expand uk-padding-remove uk-background-default">
|
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
|
||||||
<!-- uk-container uk-container-large -->
|
|
||||||
<div class="">
|
|
||||||
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
|
||||||
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
|
||||||
role="alert">{{errorMessage}}</div>
|
|
||||||
<div *ngIf="showLoading" class="uk-position-center">
|
|
||||||
<loading></loading>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ng-template #graph_and_feedback_template>
|
<ng-template #graph_and_feedback_template>
|
||||||
<div class="uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!dataProviderInfo">
|
<div class="uk-container uk-container-xlarge uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!dataProviderInfo">
|
||||||
<!-- Last Index Info-->
|
<!-- Last Index Info-->
|
||||||
<div class="uk-width-2-3@m uk-width-1-2">
|
<div class="uk-width-2-3@m uk-width-1-2">
|
||||||
<icon name="graph" customClass="text-graph"></icon>
|
<icon name="graph" customClass="text-graph"></icon>
|
||||||
|
@ -66,12 +57,22 @@
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
||||||
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
|
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
|
||||||
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
||||||
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="uk-margin-top uk-margin-bottom">
|
<div class="uk-container uk-container-xlarge">
|
||||||
|
|
||||||
|
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
||||||
|
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
||||||
|
role="alert">{{errorMessage}}</div>
|
||||||
|
<div *ngIf="showLoading" class="uk-position-center">
|
||||||
|
<loading></loading>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf="!showLoading" class="uk-margin-top uk-margin-bottom">
|
||||||
<div class="uk-flex uk-flex-middle uk-flex-center">
|
<div class="uk-flex uk-flex-middle uk-flex-center">
|
||||||
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
||||||
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
||||||
|
@ -86,7 +87,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="uk-margin-large-left uk-margin-large-right" [style]="'margin-bottom: '+graph_height+'px'">
|
<div class="uk-margin-left uk-margin-right" [style]="'margin-bottom: '+graph_height+'px'">
|
||||||
<ng-container *ngIf="dataProviderInfo">
|
<ng-container *ngIf="dataProviderInfo">
|
||||||
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
||||||
<!-- schema.org-->
|
<!-- schema.org-->
|
||||||
|
@ -184,8 +185,7 @@
|
||||||
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
|
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
|
||||||
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
||||||
[properties]="properties" [title]="dataProviderInfo.title.name"
|
[properties]="properties" [title]="dataProviderInfo.title.name"
|
||||||
[subTitle]="(dataProviderInfo.officialName
|
[entityType]="getTypeName()"
|
||||||
&& dataProviderInfo.title.name !== dataProviderInfo.officialName)?dataProviderInfo.officialName:null"
|
|
||||||
[types]="dataProviderInfo.type ? [dataProviderInfo.type] : null"
|
[types]="dataProviderInfo.type ? [dataProviderInfo.type] : null"
|
||||||
isSticky="true">
|
isSticky="true">
|
||||||
</landing-header>
|
</landing-header>
|
||||||
|
|
|
@ -32,18 +32,11 @@
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
||||||
<!-- center/right column -->
|
<!-- center/right column -->
|
||||||
<div class="uk-width-expand uk-padding-remove uk-background-default">
|
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
|
||||||
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
|
||||||
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
|
||||||
role="alert">{{errorMessage}}</div>
|
|
||||||
<div *ngIf="showLoading" class="uk-position-center">
|
|
||||||
<loading></loading>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Graph and feedback -->
|
<!-- Graph and feedback -->
|
||||||
<ng-template #graph_and_feedback_template>
|
<ng-template #graph_and_feedback_template>
|
||||||
<div class="uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!organizationInfo">
|
<div class="uk-container uk-container-xlarge uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!organizationInfo">
|
||||||
<!-- Last Index Info-->
|
<!-- Last Index Info-->
|
||||||
<div class="uk-width-2-3@m uk-width-1-2">
|
<div class="uk-width-2-3@m uk-width-1-2">
|
||||||
<icon name="graph" customClass="text-graph"></icon>
|
<icon name="graph" customClass="text-graph"></icon>
|
||||||
|
@ -63,13 +56,23 @@
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
||||||
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
|
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
|
||||||
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
||||||
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="uk-container uk-container-xlarge">
|
||||||
|
|
||||||
|
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
||||||
|
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
||||||
|
role="alert">{{errorMessage}}</div>
|
||||||
|
<div *ngIf="showLoading" class="uk-position-center">
|
||||||
|
<loading></loading>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- new action bar -->
|
<!-- new action bar -->
|
||||||
<div class="uk-margin-top uk-margin-bottom">
|
<div *ngIf="!showLoading" class="uk-margin-top uk-margin-bottom">
|
||||||
<div class="uk-flex uk-flex-middle uk-flex-center">
|
<div class="uk-flex uk-flex-middle uk-flex-center">
|
||||||
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
||||||
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
||||||
|
@ -99,7 +102,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="uk-margin-large-left uk-margin-large-right" [style]="'margin-bottom: '+graph_height+'px'">
|
<div class="uk-margin-left uk-margin-right" [style]="'margin-bottom: '+graph_height+'px'">
|
||||||
<ng-container *ngIf="organizationInfo">
|
<ng-container *ngIf="organizationInfo">
|
||||||
<!-- Main content -->
|
<!-- Main content -->
|
||||||
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
||||||
|
@ -165,8 +168,6 @@
|
||||||
<!-- <showTitle *ngIf="stickyHeader" [titleName]="organizationInfo.title.name" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
|
<!-- <showTitle *ngIf="stickyHeader" [titleName]="organizationInfo.title.name" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
|
||||||
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
||||||
[properties]="properties" [title]="organizationInfo.title.name"
|
[properties]="properties" [title]="organizationInfo.title.name"
|
||||||
[subTitle]="(organizationInfo.name
|
|
||||||
&& organizationInfo.title.name !== organizationInfo.name)?organizationInfo.name:null"
|
|
||||||
[entityType]="'organization'" isSticky="true">
|
[entityType]="'organization'" isSticky="true">
|
||||||
</landing-header>
|
</landing-header>
|
||||||
<my-tabs (selectedActiveTab)="onSelectActiveTab($event)" [offsetForSticky]="offset" [(isSticky)]="stickyHeader">
|
<my-tabs (selectedActiveTab)="onSelectActiveTab($event)" [offsetForSticky]="offset" [(isSticky)]="stickyHeader">
|
||||||
|
@ -254,6 +255,8 @@
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -71,17 +71,10 @@
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
||||||
<!-- center box-->
|
<!-- center box-->
|
||||||
<div class="uk-width-expand uk-padding-remove uk-background-default">
|
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
|
||||||
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
|
||||||
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
|
||||||
role="alert">{{errorMessage}}</div>
|
|
||||||
<div *ngIf="showLoading" class="uk-position-center">
|
|
||||||
<loading></loading>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ng-template #graph_and_feedback_template>
|
<ng-template #graph_and_feedback_template>
|
||||||
<div class="uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!projectInfo">
|
<div class="uk-container uk-container-xlarge uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!projectInfo">
|
||||||
<!-- Last Index Info-->
|
<!-- Last Index Info-->
|
||||||
<div class="uk-width-2-3@m uk-width-1-2">
|
<div class="uk-width-2-3@m uk-width-1-2">
|
||||||
<icon name="graph" customClass="text-graph"></icon>
|
<icon name="graph" customClass="text-graph"></icon>
|
||||||
|
@ -101,13 +94,23 @@
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
||||||
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
|
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
|
||||||
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
||||||
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="uk-container uk-container-xlarge">
|
||||||
|
|
||||||
|
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
||||||
|
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
||||||
|
role="alert">{{errorMessage}}</div>
|
||||||
|
<div *ngIf="showLoading" class="uk-position-center">
|
||||||
|
<loading></loading>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- new action bar -->
|
<!-- new action bar -->
|
||||||
<div class="uk-margin-top uk-margin-bottom">
|
<div *ngIf="!showLoading" class="uk-margin-top uk-margin-bottom">
|
||||||
<div class="uk-flex uk-flex-middle uk-flex-center">
|
<div class="uk-flex uk-flex-middle uk-flex-center">
|
||||||
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
||||||
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
||||||
|
@ -145,9 +148,11 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="uk-margin-large-left uk-margin-large-right" [style]="'margin-bottom: '+graph_height+'px'">
|
<div class="uk-margin-left uk-margin-right" [style]="'margin-bottom: '+graph_height+'px'">
|
||||||
<ng-container *ngIf="projectInfo">
|
<ng-container *ngIf="projectInfo">
|
||||||
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
<div [attr.style]="'margin-top: '+(graph_height? 'calc(40px + 20px - '+graph_height+'px)': '40px')">
|
||||||
|
<div class="uk-grid" uk-grid>
|
||||||
|
<div class="info uk-width-expand">
|
||||||
<!-- schema.org-->
|
<!-- schema.org-->
|
||||||
<schema2jsonld [data]=projectInfo
|
<schema2jsonld [data]=projectInfo
|
||||||
[URL]="properties.domain+properties.baseLink+properties.searchLinkToProject+projectId"
|
[URL]="properties.domain+properties.baseLink+properties.searchLinkToProject+projectId"
|
||||||
|
@ -326,6 +331,33 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="metrics-box">
|
||||||
|
<!-- <div *ngIf="projectInfo">
|
||||||
|
<div class="uk-card uk-card-secondary uk-flex uk-padding-small metrics-background">
|
||||||
|
<div class="uk-width-expand">
|
||||||
|
<div class="uk-grid uk-grid-small" uk-grid uk-height-match="target: > div > .cell">
|
||||||
|
<div>
|
||||||
|
<div class="cell uk-margin-xsmall-bottom uk-flex uk-flex-middle"><icon name="download" ratio="0.8" [flex]="true"></icon></div>
|
||||||
|
<div class="cell uk-flex uk-flex-middle"><icon name="visibility" ratio="0.8" [flex]="true"></icon></div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div class="cell uk-margin-xsmall-bottom">Downloads</div>
|
||||||
|
<div class="cell">Views</div>
|
||||||
|
</div>
|
||||||
|
<div class="uk-text-uppercase uk-text-bolder">
|
||||||
|
<div class="cell uk-margin-xsmall-bottom"> - </div>
|
||||||
|
<div class="cell"> - </div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="uk-width-1-5 uk-flex uk-flex-bottom">
|
||||||
|
<img src="assets/common-assets/metrics-badge.svg" loading="lazy" alt="Metrics badge">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="main-tabs-div" class="uk-sticky uk-blur-background"
|
<div id="main-tabs-div" class="uk-sticky uk-blur-background"
|
||||||
uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
|
uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
|
||||||
|
@ -333,7 +365,6 @@
|
||||||
<!-- <showTitle *ngIf="stickyHeader" [titleName]="projectName" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
|
<!-- <showTitle *ngIf="stickyHeader" [titleName]="projectName" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
|
||||||
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
||||||
[properties]="properties" [title]="projectName"
|
[properties]="properties" [title]="projectName"
|
||||||
[subTitle]="projectInfo.acronym ? projectInfo.title : ''"
|
|
||||||
[entityType]="'project'"
|
[entityType]="'project'"
|
||||||
[startDate]="projectInfo.startDate"
|
[startDate]="projectInfo.startDate"
|
||||||
[endDate]="projectInfo.endDate"
|
[endDate]="projectInfo.endDate"
|
||||||
|
@ -521,6 +552,8 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -68,17 +68,10 @@
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
||||||
<!-- center box-->
|
<!-- center box-->
|
||||||
<div class="uk-width-expand uk-padding-remove uk-background-default">
|
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
|
||||||
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
|
||||||
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
|
||||||
role="alert">{{errorMessage}}</div>
|
|
||||||
<div *ngIf="showLoading" class="uk-position-center">
|
|
||||||
<loading></loading>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ng-template #graph_and_feedback_template>
|
<ng-template #graph_and_feedback_template>
|
||||||
<div class="uk-flex uk-margin-small-bottom uk-margin-small-top" [class.uk-invisible]="!resultLandingInfo">
|
<div class="uk-container uk-container-xlarge uk-flex uk-margin-small-bottom uk-margin-small-top" [class.uk-invisible]="!resultLandingInfo">
|
||||||
<!-- Last Index Info-->
|
<!-- Last Index Info-->
|
||||||
<div class="uk-width-2-3@m uk-width-1-2">
|
<div class="uk-width-2-3@m uk-width-1-2">
|
||||||
<icon name="graph" customClass="text-graph"></icon>
|
<icon name="graph" customClass="text-graph"></icon>
|
||||||
|
@ -98,13 +91,22 @@
|
||||||
</div>
|
</div>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
|
|
||||||
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
|
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
|
||||||
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
uk-sticky="bottom: true;" [attr.offset]="graph_offset">
|
||||||
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- new action bar -->
|
<div class="uk-container uk-container-xlarge">
|
||||||
<div class="uk-margin-top uk-margin-bottom">
|
|
||||||
|
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
|
||||||
|
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
|
||||||
|
role="alert">{{errorMessage}}</div>
|
||||||
|
<div *ngIf="showLoading" class="uk-position-center">
|
||||||
|
<loading></loading>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf="!showLoading" class="uk-margin-top uk-margin-bottom">
|
||||||
<div class="uk-flex uk-flex-middle uk-flex-center">
|
<div class="uk-flex uk-flex-middle uk-flex-center">
|
||||||
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
<div class="landing-action-bar uk-box-shadow-small uk-margin-bottom">
|
||||||
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
<div class="uk-flex uk-text-xsmall" style="grid-gap: 20px;">
|
||||||
|
@ -153,7 +155,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="uk-margin-large-left uk-margin-large-right" [style]="'margin-bottom: '+graph_height+'px'">
|
<div class="uk-margin-left uk-margin-right" [style]="'margin-bottom: '+graph_height+'px'">
|
||||||
<ng-container *ngIf="resultLandingInfo">
|
<ng-container *ngIf="resultLandingInfo">
|
||||||
<!-- in small screens there is no sticky #graph_and_feedback so margin-top is medium (40px) -->
|
<!-- in small screens there is no sticky #graph_and_feedback so margin-top is medium (40px) -->
|
||||||
<!-- else margin is medium (40px) - the actual height of uk-sticky-placeholder (graph_height - 20px -> margins of #graph_and_feedback) -->
|
<!-- else margin is medium (40px) - the actual height of uk-sticky-placeholder (graph_height - 20px -> margins of #graph_and_feedback) -->
|
||||||
|
@ -267,8 +269,6 @@
|
||||||
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
|
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
|
||||||
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
<landing-header *ngIf="stickyHeader" class="uk-visible@m"
|
||||||
[properties]="properties" [title]="resultLandingInfo.title"
|
[properties]="properties" [title]="resultLandingInfo.title"
|
||||||
[subTitle]="resultLandingInfo.subtitle"
|
|
||||||
[authors]="resultLandingInfo.authors"
|
|
||||||
[underCuration]="resultLandingInfo.underCurationMessage"
|
[underCuration]="resultLandingInfo.underCurationMessage"
|
||||||
[entityType]="getTypeName()" [types]="resultLandingInfo.types"
|
[entityType]="getTypeName()" [types]="resultLandingInfo.types"
|
||||||
[date]="resultLandingInfo.dateofacceptance" [embargoEndDate]="resultLandingInfo.embargoEndDate"
|
[date]="resultLandingInfo.dateofacceptance" [embargoEndDate]="resultLandingInfo.embargoEndDate"
|
||||||
|
@ -475,7 +475,8 @@
|
||||||
<div class="uk-grid-divider" uk-grid>
|
<div class="uk-grid-divider" uk-grid>
|
||||||
<div>
|
<div>
|
||||||
<div class="uk-text-center uk-margin-small-bottom">
|
<div class="uk-text-center uk-margin-small-bottom">
|
||||||
<img src="assets/common-assets/logo-bip.png" loading="lazy" alt="BIP!">
|
<img src="assets/common-assets/bip-minimal.svg" loading="lazy" alt="BIP!"
|
||||||
|
style="width: 61px; height: 43px;">
|
||||||
</div>
|
</div>
|
||||||
<span class="uk-text-uppercase uk-text-xsmall">Impact by</span>
|
<span class="uk-text-uppercase uk-text-xsmall">Impact by</span>
|
||||||
<span class="uk-display-block uk-text-bolder">BIP!</span>
|
<span class="uk-display-block uk-text-bolder">BIP!</span>
|
||||||
|
@ -630,12 +631,14 @@
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
<div class="uk-margin-large-left">
|
<div class="uk-margin-large-left">
|
||||||
Chart
|
<i-frame [height]="300" [url]=bipFrameUrl [addClass]="false"
|
||||||
|
customContainerClass="uk-background-default" customIframeClass="uk-blend-multiply uk-height-1-1"></i-frame>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="uk-text-center uk-margin-medium-top">
|
<div class="uk-text-center uk-margin-top">
|
||||||
<span class="uk-text-meta">Powered by</span>
|
<span class="uk-text-meta">Powered by</span>
|
||||||
<img class="uk-margin-small-left uk-margin-small-right" src="assets/common-assets/logo-bip.png" loading="lazy" alt="BIP!">
|
<img class="uk-margin-small-left uk-margin-small-right" src="assets/common-assets/bip-minimal.svg" loading="lazy" alt="BIP!"
|
||||||
|
style="width: 61px; height: 43px;">
|
||||||
<span class="uk-text-bolder">BIP!</span>
|
<span class="uk-text-bolder">BIP!</span>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
|
@ -677,6 +680,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<!-- right box/ sidebar-->
|
<!-- right box/ sidebar-->
|
||||||
<ng-container *ngIf="resultLandingInfo && hasRightSidebarInfo">
|
<ng-container *ngIf="resultLandingInfo && hasRightSidebarInfo">
|
||||||
|
|
|
@ -72,6 +72,7 @@ export class ResultLandingComponent {
|
||||||
public totalViews: number = null;
|
public totalViews: number = null;
|
||||||
public totalDownloads: number = null;
|
public totalDownloads: number = null;
|
||||||
public pageViews: number = null;
|
public pageViews: number = null;
|
||||||
|
public bipFrameUrl: string;
|
||||||
|
|
||||||
// Custom tab paging variables
|
// Custom tab paging variables
|
||||||
public referencesPage: number = 1;
|
public referencesPage: number = 1;
|
||||||
|
@ -456,6 +457,7 @@ export class ResultLandingComponent {
|
||||||
this.viewsFrameUrl = this.properties.statisticsFrameNewAPIURL + 'chart?json=' + encodeURIComponent('{"library":"HighCharts","chartDescription":{"queries":[{"name":"Monthly views","type":"column","query":{"name":"usagestats.results.views.monthly", "parameters":["' + this.id + '"], "profile":"OpenAIRE All-inclusive" }}],"chart":{"backgroundColor":"#FFFFFFFF","borderColor":"#335cadff","borderRadius":0,"borderWidth":0,"plotBorderColor":"#ccccccff","plotBorderWidth":0},"title":{"text":"Monthly views"},"subtitle":{},"yAxis":{"title":{"text":""}},"xAxis":{"title":{}},"lang":{"noData":"No Data available for the Query"},"exporting":{"enabled":false},"plotOptions":{"series":{"dataLabels":{"enabled":false}}},"legend":{"enabled":false},"credits":{"href":null,"enabled":true,"text":""}}}');
|
this.viewsFrameUrl = this.properties.statisticsFrameNewAPIURL + 'chart?json=' + encodeURIComponent('{"library":"HighCharts","chartDescription":{"queries":[{"name":"Monthly views","type":"column","query":{"name":"usagestats.results.views.monthly", "parameters":["' + this.id + '"], "profile":"OpenAIRE All-inclusive" }}],"chart":{"backgroundColor":"#FFFFFFFF","borderColor":"#335cadff","borderRadius":0,"borderWidth":0,"plotBorderColor":"#ccccccff","plotBorderWidth":0},"title":{"text":"Monthly views"},"subtitle":{},"yAxis":{"title":{"text":""}},"xAxis":{"title":{}},"lang":{"noData":"No Data available for the Query"},"exporting":{"enabled":false},"plotOptions":{"series":{"dataLabels":{"enabled":false}}},"legend":{"enabled":false},"credits":{"href":null,"enabled":true,"text":""}}}');
|
||||||
this.downloadsFrameUrl = this.properties.statisticsFrameNewAPIURL + 'chart?json=' +
|
this.downloadsFrameUrl = this.properties.statisticsFrameNewAPIURL + 'chart?json=' +
|
||||||
encodeURIComponent('{"library":"HighCharts","chartDescription":{"queries":[{"name":"Monthly downloads","type":"column","query":{"name":"usagestats.results.downloads.monthly", "parameters":["' + this.id + '"], "profile":"OpenAIRE All-inclusive" }}],"chart":{"backgroundColor":"#FFFFFFFF","borderColor":"#335cadff","borderRadius":0,"borderWidth":0,"plotBorderColor":"#ccccccff","plotBorderWidth":0},"title":{"text":"Monthly downloads"},"subtitle":{},"yAxis":{"title":{"text":""}},"xAxis":{"title":{}},"lang":{"noData":"No Data available for the Query"},"exporting":{"enabled":false},"plotOptions":{"series":{"dataLabels":{"enabled":false}}},"legend":{"enabled":false},"credits":{"href":null,"enabled":true,"text":""}}}');
|
encodeURIComponent('{"library":"HighCharts","chartDescription":{"queries":[{"name":"Monthly downloads","type":"column","query":{"name":"usagestats.results.downloads.monthly", "parameters":["' + this.id + '"], "profile":"OpenAIRE All-inclusive" }}],"chart":{"backgroundColor":"#FFFFFFFF","borderColor":"#335cadff","borderRadius":0,"borderWidth":0,"plotBorderColor":"#ccccccff","plotBorderWidth":0},"title":{"text":"Monthly downloads"},"subtitle":{},"yAxis":{"title":{"text":""}},"xAxis":{"title":{}},"lang":{"noData":"No Data available for the Query"},"exporting":{"enabled":false},"plotOptions":{"series":{"dataLabels":{"enabled":false}}},"legend":{"enabled":false},"credits":{"href":null,"enabled":true,"text":""}}}');
|
||||||
|
this.bipFrameUrl = this.properties.bipFrameAPIURL + this.id;
|
||||||
let pid:Identifier = Identifier.getPIDFromIdentifiers(this.resultLandingInfo.identifiers);
|
let pid:Identifier = Identifier.getPIDFromIdentifiers(this.resultLandingInfo.identifiers);
|
||||||
if (this.type == "result") { // no type was specified - update URL based this.resultLandingInfo.resultType
|
if (this.type == "result") { // no type was specified - update URL based this.resultLandingInfo.resultType
|
||||||
this.updateUrlWithType(pid);
|
this.updateUrlWithType(pid);
|
||||||
|
|
|
@ -428,8 +428,6 @@ export class ResultLandingService {
|
||||||
this.resultLandingInfo.measure['influence'] = 'Top 1%';
|
this.resultLandingInfo.measure['influence'] = 'Top 1%';
|
||||||
} else if (data[0].measure[i].class == 'C4') {
|
} else if (data[0].measure[i].class == 'C4') {
|
||||||
this.resultLandingInfo.measure['influence'] = 'Top 10%';
|
this.resultLandingInfo.measure['influence'] = 'Top 10%';
|
||||||
} else if (data[0].measure[i].class == 'C5') {
|
|
||||||
this.resultLandingInfo.measure['influence'] = 'Average/low';
|
|
||||||
} else if (data[0].measure[i].class == 'A') {
|
} else if (data[0].measure[i].class == 'A') {
|
||||||
this.resultLandingInfo.measure['influence'] = 'Exceptional';
|
this.resultLandingInfo.measure['influence'] = 'Exceptional';
|
||||||
} else if (data[0].measure[i].class == 'B') {
|
} else if (data[0].measure[i].class == 'B') {
|
||||||
|
@ -447,8 +445,6 @@ export class ResultLandingService {
|
||||||
this.resultLandingInfo.measure['popularity'] = 'Top 1%';
|
this.resultLandingInfo.measure['popularity'] = 'Top 1%';
|
||||||
} else if (data[0].measure[i].class == 'C4') {
|
} else if (data[0].measure[i].class == 'C4') {
|
||||||
this.resultLandingInfo.measure['popularity'] = 'Top 10%';
|
this.resultLandingInfo.measure['popularity'] = 'Top 10%';
|
||||||
} else if (data[0].measure[i].class == 'C5') {
|
|
||||||
this.resultLandingInfo.measure['popularity'] = 'Average/low';
|
|
||||||
} else if (data[0].measure[i].class == 'A') {
|
} else if (data[0].measure[i].class == 'A') {
|
||||||
this.resultLandingInfo.measure['popularity'] = 'Exceptional';
|
this.resultLandingInfo.measure['popularity'] = 'Exceptional';
|
||||||
} else if (data[0].measure[i].class == 'B') {
|
} else if (data[0].measure[i].class == 'B') {
|
||||||
|
@ -469,8 +465,6 @@ export class ResultLandingService {
|
||||||
this.resultLandingInfo.measure['impulse'] = 'Top 1%';
|
this.resultLandingInfo.measure['impulse'] = 'Top 1%';
|
||||||
} else if (data[0].measure[i].class == 'C4') {
|
} else if (data[0].measure[i].class == 'C4') {
|
||||||
this.resultLandingInfo.measure['impulse'] = 'Top 10%';
|
this.resultLandingInfo.measure['impulse'] = 'Top 10%';
|
||||||
} else if (data[0].measure[i].class == 'C5') {
|
|
||||||
this.resultLandingInfo.measure['impulse'] = 'Average/low';
|
|
||||||
} else if (data[0].measure[i].class == 'A') {
|
} else if (data[0].measure[i].class == 'A') {
|
||||||
this.resultLandingInfo.measure['impulse'] = 'Exceptional';
|
this.resultLandingInfo.measure['impulse'] = 'Exceptional';
|
||||||
} else if (data[0].measure[i].class == 'B') {
|
} else if (data[0].measure[i].class == 'B') {
|
||||||
|
|
|
@ -213,8 +213,6 @@ export class SearchResearchResultsService {
|
||||||
result.measure[3] = 'Top 1% in';
|
result.measure[3] = 'Top 1% in';
|
||||||
} else if (resData['measure'][i].class == 'C4') {
|
} else if (resData['measure'][i].class == 'C4') {
|
||||||
result.measure[3] = 'Top 10% in';
|
result.measure[3] = 'Top 10% in';
|
||||||
} else if (resData['measure'][i].class == 'C5') {
|
|
||||||
result.measure[3] = 'Average/low';
|
|
||||||
} else if (resData['measure'][i].class == 'A') {
|
} else if (resData['measure'][i].class == 'A') {
|
||||||
result.measure[3] = 'Exceptional';
|
result.measure[3] = 'Exceptional';
|
||||||
} else if (resData['measure'][i].class == 'B') {
|
} else if (resData['measure'][i].class == 'B') {
|
||||||
|
@ -233,8 +231,6 @@ export class SearchResearchResultsService {
|
||||||
result.measure[2] = 'Top 1% in';
|
result.measure[2] = 'Top 1% in';
|
||||||
} else if (resData['measure'][i].class == 'C4') {
|
} else if (resData['measure'][i].class == 'C4') {
|
||||||
result.measure[2] = 'Top 10% in';
|
result.measure[2] = 'Top 10% in';
|
||||||
} else if (resData['measure'][i].class == 'C5') {
|
|
||||||
result.measure[2] = 'Average/low';
|
|
||||||
} else if (resData['measure'][i].class == 'A') {
|
} else if (resData['measure'][i].class == 'A') {
|
||||||
result.measure[2] = 'Exceptional';
|
result.measure[2] = 'Exceptional';
|
||||||
} else if (resData['measure'][i].class == 'B') {
|
} else if (resData['measure'][i].class == 'B') {
|
||||||
|
|
|
@ -17,6 +17,7 @@ export interface EnvProperties {
|
||||||
framesAPIURL?: string;
|
framesAPIURL?: string;
|
||||||
statisticsFrameAPIURL?: string;
|
statisticsFrameAPIURL?: string;
|
||||||
statisticsFrameNewAPIURL?: string;
|
statisticsFrameNewAPIURL?: string;
|
||||||
|
bipFrameAPIURL?: string;
|
||||||
useNewStatistisTool?: boolean;
|
useNewStatistisTool?: boolean;
|
||||||
useOldStatisticsSchema?: boolean;
|
useOldStatisticsSchema?: boolean;
|
||||||
monitorStatsFrameUrl?:string;
|
monitorStatsFrameUrl?:string;
|
||||||
|
|
Loading…
Reference in New Issue