[Monitor Dashboard | Trunk]: Add how on methodology page

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@60798 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
Konstantinos Triantafyllou 2021-04-05 13:40:40 +00:00
parent 6eede03187
commit 867e79536b
6 changed files with 288 additions and 240 deletions

View File

@ -273,8 +273,13 @@ export class AppComponent implements OnInit, OnDestroy {
"", "/" + this.stakeholder.alias, false, [], null, {}), items: []
});
this.menuItems.push({
rootItem: new MenuItem("terminology", "Terminology",
"", "/" + this.stakeholder.alias + "/terminology", false, [], null, {}), items: []
rootItem: new MenuItem("methodology", "Methodology",
"/" + this.stakeholder.alias + "/methodology", "", false, [], null, {}), items: [
new MenuItem("methodology", "Overview",
"/" + this.stakeholder.alias + "/methodology", "", false, [], null, {}),
new MenuItem("methodology", "Terminology and construction",
"/" + this.stakeholder.alias + "/methodology#terminology", "", false, [], null, {}),
]
});
if(this.stakeholder.type === "funder") {
this.menuItems.push({
@ -301,8 +306,13 @@ export class AppComponent implements OnInit, OnDestroy {
stickyAnimation: false
};
this.menuItems.push({
rootItem: new MenuItem("terminology", "Terminology",
"", "/" + this.stakeholder.alias + "/terminology", false, [], null, {}), items: []
rootItem: new MenuItem("methodology", "Methodology",
"/" + this.stakeholder.alias + "/methodology", "", false, [], null, {}), items: [
new MenuItem("methodology", "Overview",
"/" + this.stakeholder.alias + "/methodology", "", false, [], null, {}),
new MenuItem("methodology", "Terminology and construction",
"/" + this.stakeholder.alias + "/methodology#terminology", "", false, [], null, {}),
]
});
if(this.stakeholder.type === "funder") {
this.menuItems.push({

View File

@ -10,6 +10,10 @@ table th, table td {
text-align: start;
}
table th.important {
background-color: #eff6e6;
}
ul.portal-circle {
list-style: none;
padding-left: 40px;

View File

@ -0,0 +1,260 @@
import {Component, OnDestroy, OnInit} from "@angular/core";
import {StakeholderService} from "../openaireLibrary/monitor/services/stakeholder.service";
import {Stakeholder} from "../openaireLibrary/monitor/entities/stakeholder";
import {Subscription} from "rxjs";
import {Meta, Title} from "@angular/platform-browser";
import {SEOService} from "../openaireLibrary/sharedComponents/SEO/SEO.service";
import {properties} from "../../environments/environment";
import {ActivatedRoute, Router} from "@angular/router";
@Component({
selector: 'methodology',
template: `
<div page-content>
<div inner>
<div *ngIf="loading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!loading">
<div class="uk-container uk-container-large uk-section-small">
<h2 class="uk-text-center">
Overview
</h2>
<div class="uk-margin-large-top">
<how></how>
</div>
</div>
<div id="terminology" class="uk-container uk-container-large uk-section-small">
<h2 class="uk-text-center">
Terminology and construction
</h2>
<div class="uk-margin-large-top">
<ul class="uk-tab admin customTabs uk-margin-medium-bottom" uk-tab>
<li [class.uk-active]="tab === 'entities'"><a (click)="tab = 'entities'"><span
class="title">Entities</span></a></li>
<li [class.uk-active]="tab === 'attributes'"><a (click)="tab = 'attributes'"><span class="title">Attributes of Entities</span></a>
</li>
</ul>
<table *ngIf="tab === 'entities'">
<tr>
<th class="important">Research Outcomes</th>
<td>
<div>There are currently four different types of research outcomes in the OpenAIRE Research
Graph:
</div>
<ul class="portal-circle">
<li>Publication</li>
<li>Dataset</li>
<li>Software</li>
<li>Other Research Product</li>
</ul>
<div class="uk-margin-small-top">
OpenAIRE deduplicates (merges) different records of research outcomes and keeps the metadata of all
instances.
</div>
</td>
</tr>
<tr>
<th>Publication</th>
<td>Research outcomes intended for human reading (published articles, pre-prints, conference papers,
presentations, technical reports, etc.)
</td>
</tr>
<tr>
<th>Dataset</th>
<td>
<p>Research data</p>
<p>Granularity is not defined by OpenAIRE, it reflects the granularity supported by
the sources from which the description of the dataset has been collected.</p>
</td>
</tr>
<tr>
<th>Software</th>
<td>Source code or software package developed and/or used in a research context.</td>
</tr>
<tr>
<th>Other Research Product</th>
<td>Anything that does not fall in the previous categories (e.g. workflow, methods, protocols).</td>
</tr>
</table>
<table *ngIf="tab === 'attributes'">
<tr>
<th>Organization & Country</th>
<td>
<p><span class="uk-text-bold">For research outcomes:</span> the affiliated organizations of its
authors (and their country)</p>
<p><span class="uk-text-bold">For projects:</span> the organizations participating in the project
(i.e. beneficiaries of the grant) and
their countries
</p>
<p>
<span class="uk-text-bold">Country code mapping: </span>
<a href="https://api.openaire.eu/vocabularies/dnet:countries" target="_blank">
https://api.openaire.eu/vocabularies/dnet:countries</a>
</p>
</td>
</tr>
<tr>
<th>Type</th>
<td>
<p>The sub-type of a research outcome (e.g., a publication can be a pre-print, conference proceeding,
article,
etc.)</p>
<p><span class="uk-text-bold">Resource type mapping: </span>
<a href="https://api.openaire.eu/vocabularies/dnet:result_typologies" target="_blank">https://api.openaire.eu/vocabularies/dnet:result_typologies</a>
(click on the code to see the specific types for each result type)
</p>
</td>
</tr>
<tr>
<th>Access mode</th>
<td>
<p>The best available (across all instances) access rights of a research outcome.</p>
<p>Types: open, restricted, closed, embargo (= closed for a specific period of time, then open)</p>
<p><span class="uk-text-bold">Note:</span> definition of <span class="uk-text-bold">restricted</span>
may vary by data source.</p>
</td>
</tr>
<tr>
<th>PID (persistent identifier)</th>
<td>
<p>A long-lasting reference to a resource</p>
<p><span class="uk-text-bold">Types: </span> <a
href="http://api.openaire.eu/vocabularies/dnet:pid_types" target="_blank">http://api.openaire.eu/vocabularies/dnet:pid_types</a>
</p>
</td>
</tr>
<tr>
<th>Context</th>
<td>Related research community, initiative or infrastructure</td>
</tr>
<tr>
<th>Journal</th>
<td>The scientific journal an article is published in.</td>
</tr>
<tr>
<th>Publisher</th>
<td>The publisher of the venue (journal, book, etc.) of a research outcome</td>
</tr>
<tr>
<th class="important">Content Providers (Datasources)</th>
<td>
<p>The different data sources ingested in the OpenAIRE Research Graph.</p>
<div class="uk-text-bold">Content Provider Types:</div>
<ul class="portal-circle">
<li>Repositories</li>
<li>Open Access Publishers & Journals</li>
<li>Aggregators</li>
<li>Entity Registries</li>
<li>Journal Aggregators</li>
<li>CRIS (Current Research Information System)</li>
</ul>
</td>
</tr>
<tr>
<th>Repository</th>
<td>Information systems where scientists upload the bibliographic metadata and payloads of their
research outcomes (e.g. PDFs of their scientific articles, CSVs of their data, archive with their
software), due to obligations from their organizations, their funders, or due to community practices
(e.g. ArXiv, Europe PMC, Zenodo).
</td>
</tr>
<tr>
<th>Open Access Publishers & Journals</th>
<td>Information systems of open access publishers or relative journals, which offer bibliographic
metadata and PDFs of their published articles.
</td>
</tr>
<tr>
<th>Aggregators</th>
<td>Information systems that collect descriptive metadata about research products from multiple sources
in order to enable cross-data source discovery of given research products (e,g, DataCite,
BASE, DOAJ).
</td>
</tr>
<tr>
<th>Entity Registries</th>
<td>Information systems created with the intent of maintaining authoritative registries of given
entities in the scholarly communication, such as OpenDOAR for the institutional repositories, re3data
for the data repositories, CORDA and other funder databases for projects and funding information.
</td>
</tr>
<tr>
<th>CRIS (Current Research Information System)</th>
<td>Information systems adopted by research and academic organizations to keep track of their research
administration records and relative results; examples of CRIS content are articles or datasets funded
by projects, their principal investigators, facilities acquired thanks to funding, etc.
</td>
</tr>
</table>
<div class="uk-text-small uk-margin-small-top">
<img src="assets/common-assets/graph.svg" style="opacity: 0.4">
<span class="uk-margin-small-left uk-text-baseline uk-text-muted">More information for <a
href="https://graph.openaire.eu" class="graph-color">OpenAIRE Research Graph</a>.</span>
</div>
</div>
</div>
</div>
</div>
</div>
`,
styleUrls: ['methodology.component.css']
})
export class MethodologyComponent implements OnInit, OnDestroy {
public loading = true;
public stakeholder: Stakeholder;
public tab: 'entities' | 'attributes' = 'entities';
private subscriptions: any[] = [];
constructor(private stakeholderService: StakeholderService,
private seoService: SEOService,
private _meta: Meta,
private _router: Router,
private route: ActivatedRoute,
private _title: Title) {
}
ngOnInit() {
this.loading = true;
this.subscriptions.push(this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
this.stakeholder = stakeholder;
if (this.stakeholder) {
/* Metadata */
const url = properties.domain + properties.baseLink + this._router.url;
this.seoService.createLinkForCanonicalURL(url, false);
this._meta.updateTag({content: url}, "property='og:url'");
const description = "Methodology | " + this.stakeholder.name;
const title = "Methodology | " + this.stakeholder.name;
this._meta.updateTag({content: description}, "name='description'");
this._meta.updateTag({content: description}, "property='og:description'");
this._meta.updateTag({content: title}, "property='og:title'");
this._title.setTitle(title);
setTimeout(() => {
this.loading = false;
this.subscriptions.push(this.route.fragment.subscribe(fragment => {
setTimeout(() => {
this.goTo(fragment);
}, 100);
}));
}, 500)
}
}));
}
goTo(id: string) {
const yOffset = -100;
const element = document.getElementById(id);
if(element) {
const y = element.getBoundingClientRect().top + window.pageYOffset + yOffset;
window.scrollTo({top: y, behavior: 'smooth'});
}
}
ngOnDestroy() {
this.subscriptions.forEach(subscription => {
if (subscription instanceof Subscription) {
subscription.unsubscribe();
}
});
}
}

View File

@ -1,21 +1,23 @@
import {NgModule} from "@angular/core";
import {CommonModule} from "@angular/common";
import {TerminologyComponent} from "./terminology.component";
import {MethodologyComponent} from "./methodology.component";
import {RouterModule} from "@angular/router";
import {PreviousRouteRecorder} from "../openaireLibrary/utils/piwik/previousRouteRecorder.guard";
import {PageContentModule} from "../openaireLibrary/dashboard/sharedComponents/page-content/page-content.module";
import {HowModule} from "../openaireLibrary/monitor/how/how.module";
import {LoadingModule} from "../openaireLibrary/utils/loading/loading.module";
@NgModule({
declarations: [TerminologyComponent],
declarations: [MethodologyComponent],
imports: [CommonModule, RouterModule.forChild([
{
path: '',
component: TerminologyComponent,
component: MethodologyComponent,
canDeactivate: [PreviousRouteRecorder]
},
]), PageContentModule],
exports: [TerminologyComponent]
]), PageContentModule, HowModule, LoadingModule],
exports: [MethodologyComponent]
})
export class TerminologyModule {
export class MethodologyModule {
}

View File

@ -22,8 +22,8 @@ import {MonitorComponent} from "./monitor.component";
}
},
{
path: ':stakeholder/terminology',
loadChildren: '../terminology/terminology.module#TerminologyModule',
path: ':stakeholder/methodology',
loadChildren: '../methodology/methodology.module#MethodologyModule',
canDeactivate: [PreviousRouteRecorder],
data: {
hasSidebar: false,

View File

@ -1,228 +0,0 @@
import {Component, OnDestroy, OnInit} from "@angular/core";
import {StakeholderService} from "../openaireLibrary/monitor/services/stakeholder.service";
import {Stakeholder} from "../openaireLibrary/monitor/entities/stakeholder";
import {Subscription} from "rxjs";
import {Meta, Title} from "@angular/platform-browser";
import {SEOService} from "../openaireLibrary/sharedComponents/SEO/SEO.service";
import {properties} from "../../environments/environment";
import {ActivatedRoute, Router} from "@angular/router";
@Component({
selector: 'terminology',
template: `
<div page-content>
<div inner>
<div *ngIf="stakeholder" class="uk-container uk-container-large uk-section-small">
<h1 class="uk-text-center uk-h2">
Terminology and construction
</h1>
<div class="uk-margin-large-top">
<ul class="uk-tab admin customTabs uk-margin-medium-bottom" uk-tab>
<li [class.uk-active]="tab === 'entities'"><a (click)="tab = 'entities'"><span
class="title">Entities</span></a></li>
<li [class.uk-active]="tab === 'attributes'"><a (click)="tab = 'attributes'"><span class="title">Attributes of Research Results</span></a>
</li>
</ul>
<table *ngIf="tab === 'entities'">
<tr>
<th>Research Outcomes</th>
<td>
<div>There are currently four different types of research outcomes types in the OpenAIRE Research
Graph:
</div>
<ul class="portal-circle">
<li>Publication</li>
<li>Dataset</li>
<li>Software</li>
<li>Other Research Products</li>
</ul>
<div class="uk-margin-small-top">
OpenAIRE deduplicates (merges) different records or research outcomes and keeps the metadata of all
instances.
</div>
</td>
</tr>
<tr>
<th>Publication</th>
<td>Research outcomes intended for human reading (published articles, pre-prints, conference papers,
presentations, technical reports, etc.)
</td>
</tr>
<tr>
<th>Dataset</th>
<td>Research data (granularity is not defined by OpenAIRE, which reflects the granularity supported by
the sources from which the description of the dataset has been collected)
</td>
</tr>
<tr>
<th>Software</th>
<td>Source code or software package developed and/or used in a research context.</td>
</tr>
<tr>
<th>Other Research Product</th>
<td>Anything that does not fall in the previous categories (e.g. workflow, methods, protocols).</td>
</tr>
</table>
<table *ngIf="tab === 'attributes'">
<tr>
<th>Organization & Country</th>
<td>
<p><span class="uk-text-bold">For research outcomes:</span> The affiliated organizations of its authors (and their country).</p>
<p><span class="uk-text-bold">For projects:</span> The organizations participating in the project (i.e. beneficiaries of the grant), and
their countries (when available).
</p>
<p>
<span class="uk-text-bold">Country code mapping: </span>
<a href="https://api.openaire.eu/vocabularies/dnet:countries" target="_blank">
https://api.openaire.eu/vocabularies/dnet:countries</a>
</p>
</td>
</tr>
<tr>
<th>Type</th>
<td>
<p>The type of research output (e.g. a publication can be a pre-print, conference proceeding, article,
etc.)</p>
<p><span class="uk-text-bold">Resource type mapping: </span>
<a href="https://api.openaire.eu/vocabularies/dnet:result_typologies" target="_blank">https://api.openaire.eu/vocabularies/dnet:result_typologies</a>
(click on the code to see the specific types for each result type)
</p>
</td>
</tr>
<tr>
<th>Access mode</th>
<td>
<p>The best available (across all instances) access rights of a research output.</p>
<p>Types: open, restricted, closed, embargo (= closed for a specific period of time, then open)</p>
</td>
</tr>
<tr>
<th>PID (persistent identifier)</th>
<td>
<p>A long-lasting reference to a resource</p>
<p><span class="uk-text-bold">Types: </span> <a href="http://api.openaire.eu/vocabularies/dnet:pid_types" target="_blank">http://api.openaire.eu/vocabularies/dnet:pid_types</a>
</p>
</td>
</tr>
<tr>
<th>Context</th>
<td>Related research community/initiative/infrastructure</td>
</tr>
<tr>
<th>Journal</th>
<td>The scientific journal an article is published in.</td>
</tr>
<tr>
<th>Publisher</th>
<td>The publisher of the venue (journal, book, etc.) of a research output</td>
</tr>
<tr>
<th>Content Provider (Datasources)</th>
<td>
<p>The different data sources ingested in the OpenAIRE Research Graph.</p>
<div class="uk-text-bold">Content Provider Types:</div>
<ul class="portal-circle">
<li>Repositories</li>
<li>Open Access Publishers & Journals</li>
<li>Aggregators</li>
<li>Entity Registries</li>
<li>Journal Aggregators</li>
<li>CRIS (Current Research Information System)</li>
</ul>
</td>
</tr>
<tr>
<th>Repository</th>
<td>Information systems where scientists upload the bibliographic metadata and payloads of their
research outcomes (e.g. PDFs of their scientific articles, CSVs of their data, archive with their
software), due to obligations from their organizations, their funders, or due to community practices
(e.g. ArXiv, Europe PMC, Zenodo).
</td>
</tr>
<tr>
<th>Open Access Publishers & Journals</th>
<td>Information systems of open access publishers or relative journals, which offer bibliographic
metadata and PDFs of their published articles.
</td>
</tr>
<tr>
<th>Aggregators</th>
<td>Information systems that collect descriptive metadata about research products from multiple sources
in order to enable cross-data source discovery of given research products. Examples are DataCite,
BASE, DOAJ.
</td>
</tr>
<tr>
<th>Entity Registries</th>
<td>Information systems created with the intent of maintaining authoritative registries of given
entities in the scholarly communication, such as OpenDOAR for the institutional repositories, re3data
for the data repositories, CORDA and other funder databases for projects and funding information.
</td>
</tr>
<tr>
<th>CRIS (Current Research Information System)</th>
<td>Information systems adopted by research and academic organizations to keep track of their research
administration records and relative results; examples of CRIS content are articles or datasets funded
by projects, their principal investigators, facilities acquired thanks to funding, etc.
</td>
</tr>
</table>
<div class="uk-text-small uk-margin-small-top">
<img src="assets/common-assets/graph.svg" style="opacity: 0.4">
<span class="uk-margin-small-left uk-text-baseline uk-text-muted">More information for <a
href="https://graph.openaire.eu" class="graph-color">OpenAIRE Research Graph</a>.</span>
</div>
</div>
</div>
</div>
</div>
`,
styleUrls: ['terminology.component.css']
})
export class TerminologyComponent implements OnInit, OnDestroy {
public stakeholder: Stakeholder;
public tab: 'entities' | 'attributes' = 'entities';
private subscriptions: any[] = [];
constructor(private stakeholderService: StakeholderService,
private seoService: SEOService,
private _meta: Meta,
private _router: Router,
private route: ActivatedRoute,
private _title: Title) {
}
ngOnInit() {
this.subscriptions.push(this.route.fragment.subscribe(tab => {
if (tab === 'attributes') {
this.tab = tab;
} else {
this.tab = 'entities';
}
}));
this.subscriptions.push(this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
this.stakeholder = stakeholder;
if (this.stakeholder) {
/* Metadata */
const url = properties.domain + properties.baseLink + this._router.url;
this.seoService.createLinkForCanonicalURL(url, false);
this._meta.updateTag({content: url}, "property='og:url'");
const description = "Terminology | " + this.stakeholder.name;
const title = "Terminology | " + this.stakeholder.name;
this._meta.updateTag({content: description}, "name='description'");
this._meta.updateTag({content: description}, "property='og:description'");
this._meta.updateTag({content: title}, "property='og:title'");
this._title.setTitle(title);
}
}));
}
ngOnDestroy() {
this.subscriptions.forEach(subscription => {
if (subscription instanceof Subscription) {
subscription.unsubscribe();
}
});
}
}