[Graph | Trunk]: Add explore and cases section in home page
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-graph-portal/trunk@60869 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
a362ddb8af
commit
065a546e3b
|
|
@ -65,3 +65,23 @@
|
|||
.uk-list.target > li:nth-child(n+2) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.case {
|
||||
background-color: white;
|
||||
height: 250px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.case img {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.explore {
|
||||
background-color: #F9DBD1;
|
||||
--portal-main-color: var(--explore-color);
|
||||
--portal-dark-color: var(--explore-dark-color);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -115,19 +115,100 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
Explore
|
||||
<div id="explore" class="explore">
|
||||
<div class="uk-section uk-text-small uk-container uk-container-large">
|
||||
<div class="uk-text-center uk-margin-large-top">
|
||||
<img class="uk-width-medium" src="assets/common-assets/logo-large-explore.png">
|
||||
<h2 class="uk-margin-remove-bottom">Discover the content of the graph with EXPLORE</h2>
|
||||
<h6 class="uk-margin-top"><span class="portal-color">Explore</span> all open access <span class="portal-color">research outcomes</span>.</h6>
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-center uk-margin-large-top uk-margin-xlarge-bottom">
|
||||
<form class="uk-flex uk-flex-wrap">
|
||||
<div class="uk-margin-small-top">
|
||||
<entities-selection [simpleView]="true" currentEntity="all" [selectedEntity]="selectedEntity"
|
||||
[properties]="properties" [onChangeNavigate]="false" [allEnable]="true"
|
||||
(selectionChange)="entityChanged($event)"
|
||||
></entities-selection>
|
||||
</div>
|
||||
<div class="uk-margin-small-top uk-width-expand">
|
||||
<div class="uk-inline">
|
||||
<a *ngIf="keyword.length > 0" class="uk-form-icon uk-form-icon-flip" (click)="keyword = ''" uk-icon="icon: close"></a>
|
||||
<input type="text" class="uk-input uk-width-xlarge@l uk-width-large@m uk-width-medium"
|
||||
placeholder="Search by title, author, doi, abstract, content..."
|
||||
[(ngModel)]="keyword"
|
||||
name="keyword">
|
||||
</div>
|
||||
<div class=" quickSelectionsBox uk-width-xlarge@l uk-width-large@m uk-width-medium">
|
||||
<quick-selections *ngIf="selectedEntity == 'result'" [resultTypes]="resultTypes"
|
||||
[quickFilter]="resultsQuickFilter"
|
||||
[properties]="properties">
|
||||
</quick-selections>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin-small-top">
|
||||
<button (click)="goTo()" type="submit" class="uk-button portal-button uk-text-bold uk-margin-small-left">
|
||||
Search
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="cases">
|
||||
<div>
|
||||
<div class="uk-section uk-container uk-container-large">
|
||||
<div class="uk-text-center">
|
||||
<h2 class="uk-margin-remove-bottom">Use Cases</h2>
|
||||
<h6 class="uk-margin-small-top">Brief presentations of our success stories</h6>
|
||||
</div>
|
||||
<div class="uk-padding-small">
|
||||
<div class="uk-text-center">
|
||||
<h2 class="uk-margin-remove-bottom">Use Cases</h2>
|
||||
<h6 class="uk-margin-small-top">Brief presentations of our success stories</h6>
|
||||
</div>
|
||||
<div class="uk-grid uk-child-width-1-3@m uk-child-width-1-1" uk-grid>
|
||||
<div class="">
|
||||
|
||||
<div class="uk-grid uk-child-width-1-3@m uk-child-width-1-1 uk-margin-large-top" uk-height-match="target: .uk-text-justify" uk-grid>
|
||||
<div>
|
||||
<div class="case">
|
||||
<img src="assets/graph-assets/home/cases/open-maps.png">
|
||||
</div>
|
||||
<h4 class="uk-text-bold uk-text-center uk-margin-top">Open Knowledge maps</h4>
|
||||
<div class="uk-text-justify">
|
||||
VIPER, the Visual Project Explorer enables funders, institutions and researchers to systematically explore a
|
||||
project’s output, and to understand its reception in different areas.
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-top">
|
||||
<a class="uk-text-uppercase uk-text-bold uk-text-small" href="https://www.openaire.eu/viper-the-visual-project-explorer" target="_blank">
|
||||
<span>Read More</span>
|
||||
<icon name="arrow_right" class="uk-margin-small-left"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="case">
|
||||
<img src="assets/graph-assets/home/cases/ec.png">
|
||||
</div>
|
||||
<h4 class="uk-text-bold uk-text-center uk-margin-top">European Commission</h4>
|
||||
<div class="uk-text-justify">
|
||||
The EC Participant Portal is using the OpenAIRE Research Graph to collect information about publications and
|
||||
datasets resulting from H2020 funded projects.
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-top">
|
||||
<a class="uk-text-uppercase uk-text-bold uk-text-small" href="https://www.openaire.eu/reporting-research-outputs-to-the-ec-using-the-openaire-api" target="_blank">
|
||||
<span>Read More</span>
|
||||
<icon name="arrow_right" class="uk-margin-small-left"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="case">
|
||||
<img src="assets/graph-assets/home/cases/orcid.png">
|
||||
</div>
|
||||
<h4 class="uk-text-bold uk-text-center uk-margin-top">ORCID</h4>
|
||||
<div class="uk-text-justify">
|
||||
ORCID data is used to enrich the research product records of the OpenAIRE Research Graph. Through EXPLORE,
|
||||
ORCID users can instantly identify their works, enrich the OpenAIRE Research Graph and their ORCID profiles.
|
||||
</div>
|
||||
<div class="uk-text-center uk-margin-top">
|
||||
<a class="uk-text-uppercase uk-text-bold uk-text-small" href="https://www.openaire.eu/openaire-explore-integration-with-the-orcid-search-and-link-wizard" target="_blank">
|
||||
<span>Read More</span>
|
||||
<icon name="arrow_right" class="uk-margin-small-left"></icon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,23 +2,16 @@ import {Component} from '@angular/core';
|
|||
import {Subscription} from 'rxjs';
|
||||
import {ActivatedRoute, Router} from '@angular/router';
|
||||
import {Location} from '@angular/common';
|
||||
import "rxjs/add/observable/zip";
|
||||
import {Title, Meta} from '@angular/platform-browser';
|
||||
import 'rxjs/add/observable/zip';
|
||||
import {Meta, Title} from '@angular/platform-browser';
|
||||
import {ConfigurationService} from '../openaireLibrary/utils/configuration/configuration.service';
|
||||
import {SearchDataprovidersService} from '../openaireLibrary/services/searchDataproviders.service';
|
||||
import {SearchProjectsService} from '../openaireLibrary/services/searchProjects.service';
|
||||
import {SearchOrganizationsService} from '../openaireLibrary/services/searchOrganizations.service';
|
||||
import {RefineFieldResultsService} from '../openaireLibrary/services/refineFieldResults.service';
|
||||
import {NumberUtils} from '../openaireLibrary/utils/number-utils.class';
|
||||
|
||||
import {RouterHelper} from '../openaireLibrary/utils/routerHelper.class';
|
||||
import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties';
|
||||
import {ErrorCodes} from '../openaireLibrary/utils/properties/errorCodes';
|
||||
import {PiwikService} from '../openaireLibrary/utils/piwik/piwik.service';
|
||||
import {SEOService} from '../openaireLibrary/sharedComponents/SEO/SEO.service';
|
||||
import {SearchResearchResultsService} from "../openaireLibrary/services/searchResearchResults.service";
|
||||
import {properties} from "../../environments/environment";
|
||||
import {portals} from "./portals";
|
||||
import {properties} from '../../environments/environment';
|
||||
import {portals} from './portals';
|
||||
import {Filter} from '../openaireLibrary/searchPages/searchUtils/searchHelperClasses.class';
|
||||
import {RouterHelper} from '../openaireLibrary/utils/routerHelper.class';
|
||||
|
||||
@Component({
|
||||
selector: 'home',
|
||||
|
|
@ -26,10 +19,35 @@ import {portals} from "./portals";
|
|||
styleUrls: ['home.component.css']
|
||||
})
|
||||
export class HomeComponent {
|
||||
public pageTitle = "OpenAIRE - Research Graph";
|
||||
public pageTitle = 'OpenAIRE - Research Graph';
|
||||
public portals: any[] = portals;
|
||||
public state: number = 0;
|
||||
public properties: EnvProperties = properties;
|
||||
public selectedEntity = 'all';
|
||||
public url: string;
|
||||
public routerHelper: RouterHelper = new RouterHelper();
|
||||
public resultTypes: Filter = {
|
||||
values: [
|
||||
{name: 'Publications', id: 'publications', selected: true, number: 0},
|
||||
{name: "Research data", id: "datasets", selected: true, number: 0},
|
||||
{name: "Software", id: "software", selected: true, number: 0},
|
||||
{name: "Other research products", id: "other", selected: true, number: 0}
|
||||
],
|
||||
filterId: 'type',
|
||||
countSelectedValues: 0,
|
||||
filterType: 'checkbox',
|
||||
originalFilterId: '',
|
||||
valueIsExact: true,
|
||||
title: 'Result Types',
|
||||
filterOperator: 'or'
|
||||
};
|
||||
public resultsQuickFilter: { filter: Filter, selected: boolean, filterId: string, value: string } = {
|
||||
filter: null,
|
||||
selected: true,
|
||||
filterId: 'resultbestaccessright',
|
||||
value: 'Open Access'
|
||||
};
|
||||
public keyword: string = '';
|
||||
private timeouts: any[] = [];
|
||||
private subs: Subscription[] = [];
|
||||
|
||||
|
|
@ -40,19 +58,19 @@ export class HomeComponent {
|
|||
private config: ConfigurationService, private _meta: Meta, private _title: Title, private seoService: SEOService
|
||||
) {
|
||||
|
||||
let description = "OpenAIRE Research Graph is an open resource that aggregates a collection of research data properties (metadata, links) available within the OpenAIRE Open Science infrastructure for funders, organizations, researchers, research communities and publishers to interlink information by using a semantic graph database approach.";
|
||||
let description = 'OpenAIRE Research Graph is an open resource that aggregates a collection of research data properties (metadata, links) available within the OpenAIRE Open Science infrastructure for funders, organizations, researchers, research communities and publishers to interlink information by using a semantic graph database approach.';
|
||||
|
||||
this._title.setTitle(this.pageTitle);
|
||||
this._meta.updateTag({content: description}, "name='description'");
|
||||
this._meta.updateTag({content: description}, "property='og:description'");
|
||||
this._meta.updateTag({content: this.pageTitle}, "property='og:title'");
|
||||
this._meta.updateTag({content: description}, 'name=\'description\'');
|
||||
this._meta.updateTag({content: description}, 'property=\'og:description\'');
|
||||
this._meta.updateTag({content: this.pageTitle}, 'property=\'og:title\'');
|
||||
}
|
||||
|
||||
public ngOnInit() {
|
||||
if (this.properties) {
|
||||
let url = this.properties.domain + this.properties.baseLink + this._router.url;
|
||||
this.seoService.createLinkForCanonicalURL(url, false);
|
||||
this._meta.updateTag({content: url}, "property='og:url'");
|
||||
this._meta.updateTag({content: url}, 'property=\'og:url\'');
|
||||
if (this.properties.enablePiwikTrack && (typeof document !== 'undefined')) {
|
||||
this.subs.push(this._piwikService.trackView(this.properties, this.pageTitle).subscribe());
|
||||
}
|
||||
|
|
@ -70,14 +88,19 @@ export class HomeComponent {
|
|||
private animation() {
|
||||
this.timeouts.push(setTimeout(() => {
|
||||
this.animation();
|
||||
if (this.state === (this.portals.length -1)) {
|
||||
this.state = 0
|
||||
if (this.state === (this.portals.length - 1)) {
|
||||
this.state = 0;
|
||||
} else {
|
||||
this.state++;
|
||||
}
|
||||
}, 4000));
|
||||
}
|
||||
|
||||
entityChanged($event) {
|
||||
this.selectedEntity = $event.entity;
|
||||
this.url = $event.simpleUrl;
|
||||
}
|
||||
|
||||
private changeSlide(slide: number) {
|
||||
this.clearTimeouts();
|
||||
this.state = slide;
|
||||
|
|
@ -90,4 +113,40 @@ export class HomeComponent {
|
|||
});
|
||||
this.state = 0;
|
||||
}
|
||||
|
||||
goTo() {
|
||||
let url = 'https://explore.openaire.eu' + this.url;
|
||||
let parameterNames = [];
|
||||
let parameterValues = [];
|
||||
if (this.selectedEntity == 'result') {
|
||||
if (this.resultTypes) {
|
||||
let values = [];
|
||||
for (let value of this.resultTypes.values) {
|
||||
if (value.selected) {
|
||||
values.push(value.id);
|
||||
}
|
||||
}
|
||||
if (values.length > 0 && values.length != 4) {
|
||||
parameterNames.push('type');
|
||||
parameterValues.push(values.join(','));
|
||||
}
|
||||
if (this.resultsQuickFilter) {
|
||||
parameterNames.push('qf');
|
||||
parameterValues.push('' + this.resultsQuickFilter.selected);
|
||||
}
|
||||
}
|
||||
} else if (this.selectedEntity == 'all') {
|
||||
if (this.resultsQuickFilter) {
|
||||
parameterNames.push('qf');
|
||||
parameterValues.push('true');
|
||||
}
|
||||
}
|
||||
if (this.keyword.length > 0) {
|
||||
parameterNames.push('fv0');
|
||||
parameterValues.push(this.keyword);
|
||||
parameterNames.push('f0');
|
||||
parameterValues.push('q');
|
||||
}
|
||||
window.open(url + this.routerHelper.createQueryParamsString(parameterNames, parameterValues), '_blank').focus();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.0 KiB |
|
|
@ -12,4 +12,33 @@ export let properties: EnvProperties = {
|
|||
admins: ["graph@openaire.eu"],
|
||||
cookieDomain: ".openaire.eu",
|
||||
reCaptchaSiteKey: "6LezhVIUAAAAAOb4nHDd87sckLhMXFDcHuKyS76P",
|
||||
searchLinkToResult: "/search/result?id=",
|
||||
searchLinkToPublication: "/search/publication?articleId=",
|
||||
searchLinkToProject: "/search/project?projectId=",
|
||||
searchLinkToDataProvider: "/search/dataprovider?datasourceId=",
|
||||
searchLinkToDataset: "/search/dataset?datasetId=",
|
||||
searchLinkToSoftwareLanding: "/search/software?softwareId=",
|
||||
searchLinkToOrp: "/search/other?orpId=",
|
||||
searchLinkToOrganization: "/search/organization?organizationId=",
|
||||
searchLinkToPublications: "/search/find/publications",
|
||||
searchLinkToDataProviders: "/search/find/dataproviders",
|
||||
searchLinkToProjects: "/search/find/projects",
|
||||
searchLinkToDatasets: "/search/find/datasets",
|
||||
searchLinkToSoftware: "/search/find/software",
|
||||
searchLinkToOrps: "/search/find/other",
|
||||
searchLinkToOrganizations: "/search/find/organizations",
|
||||
searchLinkToCompatibleDataProviders: "/search/content-providers",
|
||||
searchLinkToEntityRegistriesDataProviders: "/search/entity-registries",
|
||||
searchLinkToEntityRegistriesDataProvidersTable: "/search/entity-registries-table",
|
||||
searchLinkToJournals: "/search/journals",
|
||||
searchLinkToJournalsTable: "/search/journals-table",
|
||||
searchLinkToResults: "/search/find/research-outcomes",
|
||||
searchLinkToAdvancedPublications: "/search/advanced/publications",
|
||||
searchLinkToAdvancedProjects: "/search/advanced/projects",
|
||||
searchLinkToAdvancedDatasets: "/search/advanced/datasets",
|
||||
searchLinkToAdvancedSoftware: "/search/advanced/software",
|
||||
searchLinkToAdvancedOrps: "/search/advanced/other",
|
||||
searchLinkToAdvancedDataProviders: "/search/advanced/dataproviders",
|
||||
searchLinkToAdvancedOrganizations: "/search/advanced/organizations",
|
||||
searchLinkToAdvancedResults: "/search/advanced/research-outcomes"
|
||||
};
|
||||
|
|
|
|||
|
|
@ -12,4 +12,33 @@ export let properties: EnvProperties = {
|
|||
admins: ["graph@openaire.eu"],
|
||||
cookieDomain: ".openaire.eu",
|
||||
reCaptchaSiteKey: "6LezhVIUAAAAAOb4nHDd87sckLhMXFDcHuKyS76P",
|
||||
searchLinkToResult: "/search/result?id=",
|
||||
searchLinkToPublication: "/search/publication?articleId=",
|
||||
searchLinkToProject: "/search/project?projectId=",
|
||||
searchLinkToDataProvider: "/search/dataprovider?datasourceId=",
|
||||
searchLinkToDataset: "/search/dataset?datasetId=",
|
||||
searchLinkToSoftwareLanding: "/search/software?softwareId=",
|
||||
searchLinkToOrp: "/search/other?orpId=",
|
||||
searchLinkToOrganization: "/search/organization?organizationId=",
|
||||
searchLinkToPublications: "/search/find/publications",
|
||||
searchLinkToDataProviders: "/search/find/dataproviders",
|
||||
searchLinkToProjects: "/search/find/projects",
|
||||
searchLinkToDatasets: "/search/find/datasets",
|
||||
searchLinkToSoftware: "/search/find/software",
|
||||
searchLinkToOrps: "/search/find/other",
|
||||
searchLinkToOrganizations: "/search/find/organizations",
|
||||
searchLinkToCompatibleDataProviders: "/search/content-providers",
|
||||
searchLinkToEntityRegistriesDataProviders: "/search/entity-registries",
|
||||
searchLinkToEntityRegistriesDataProvidersTable: "/search/entity-registries-table",
|
||||
searchLinkToJournals: "/search/journals",
|
||||
searchLinkToJournalsTable: "/search/journals-table",
|
||||
searchLinkToResults: "/search/find/research-outcomes",
|
||||
searchLinkToAdvancedPublications: "/search/advanced/publications",
|
||||
searchLinkToAdvancedProjects: "/search/advanced/projects",
|
||||
searchLinkToAdvancedDatasets: "/search/advanced/datasets",
|
||||
searchLinkToAdvancedSoftware: "/search/advanced/software",
|
||||
searchLinkToAdvancedOrps: "/search/advanced/other",
|
||||
searchLinkToAdvancedDataProviders: "/search/advanced/dataproviders",
|
||||
searchLinkToAdvancedOrganizations: "/search/advanced/organizations",
|
||||
searchLinkToAdvancedResults: "/search/advanced/research-outcomes"
|
||||
};
|
||||
|
|
|
|||
|
|
@ -17,4 +17,33 @@ export let properties: EnvProperties = {
|
|||
admins: ["kostis30fylloy@gmail.com"],
|
||||
cookieDomain: ".di.uoa.gr",
|
||||
reCaptchaSiteKey: "6LcVtFIUAAAAAB2ac6xYivHxYXKoUvYRPi-6_rLu",
|
||||
searchLinkToResult: "/search/result?id=",
|
||||
searchLinkToPublication: "/search/publication?articleId=",
|
||||
searchLinkToProject: "/search/project?projectId=",
|
||||
searchLinkToDataProvider: "/search/dataprovider?datasourceId=",
|
||||
searchLinkToDataset: "/search/dataset?datasetId=",
|
||||
searchLinkToSoftwareLanding: "/search/software?softwareId=",
|
||||
searchLinkToOrp: "/search/other?orpId=",
|
||||
searchLinkToOrganization: "/search/organization?organizationId=",
|
||||
searchLinkToPublications: "/search/find/publications",
|
||||
searchLinkToDataProviders: "/search/find/dataproviders",
|
||||
searchLinkToProjects: "/search/find/projects",
|
||||
searchLinkToDatasets: "/search/find/datasets",
|
||||
searchLinkToSoftware: "/search/find/software",
|
||||
searchLinkToOrps: "/search/find/other",
|
||||
searchLinkToOrganizations: "/search/find/organizations",
|
||||
searchLinkToCompatibleDataProviders: "/search/content-providers",
|
||||
searchLinkToEntityRegistriesDataProviders: "/search/entity-registries",
|
||||
searchLinkToEntityRegistriesDataProvidersTable: "/search/entity-registries-table",
|
||||
searchLinkToJournals: "/search/journals",
|
||||
searchLinkToJournalsTable: "/search/journals-table",
|
||||
searchLinkToResults: "/search/find/research-outcomes",
|
||||
searchLinkToAdvancedPublications: "/search/advanced/publications",
|
||||
searchLinkToAdvancedProjects: "/search/advanced/projects",
|
||||
searchLinkToAdvancedDatasets: "/search/advanced/datasets",
|
||||
searchLinkToAdvancedSoftware: "/search/advanced/software",
|
||||
searchLinkToAdvancedOrps: "/search/advanced/other",
|
||||
searchLinkToAdvancedDataProviders: "/search/advanced/dataproviders",
|
||||
searchLinkToAdvancedOrganizations: "/search/advanced/organizations",
|
||||
searchLinkToAdvancedResults: "/search/advanced/research-outcomes"
|
||||
};
|
||||
|
|
|
|||
|
|
@ -7,6 +7,8 @@
|
|||
--portal-main-color: #EE2540;
|
||||
--portal-main-contrast: white;
|
||||
--portal-dark-color: #E63946;
|
||||
--explore-color: #D95F2D;
|
||||
--explore-dark-color: #a0462c;
|
||||
}
|
||||
|
||||
.graphApp {
|
||||
|
|
|
|||
Loading…
Reference in New Issue