[master | DONE | ADDED]: about.component.ts & about.component.html & about.component.less: Added content in about page.

This commit is contained in:
Konstantina Galouni 2024-01-09 16:17:47 +02:00
parent e3d01f4dd6
commit e44ab6bf33
3 changed files with 262 additions and 7 deletions

View File

@ -0,0 +1,204 @@
<ng-template #about>
<h1 [ngClass]="isMobile ? 'uk-heading-small' : 'uk-h2'">About</h1>
<div class="uk-margin-top">
Welcome to the National Open Access Monitor, Ireland, a dynamic and innovative platform
designed to chart and foster the transition of Irelands scholarly output to 100% Open Access.
This project has been entrusted to <a target="_blank" href="https://www.openaire.eu/" class="custom-external">OpenAIRE</a>,
following a contract awarded through a
<a target="_blank" href="https://irl.eu-supply.com/ctm/Supplier/PublicPurchase/238957/0/0?returnUrl=ctm/Supplier/publictenders&b=ETENDERS_SIMPLE" class="custom-external">competitive tendering process</a>
by the <a target="_blank" href="https://irel.ie/" class="custom-external">Irish Research eLibrary</a> (IReL) in collaboration with
<a target="_blank" href="https://www.educationprocurementservice.ie/" class="custom-external">Education Procurement Services</a>.
</div>
</ng-template>
<ng-template #pilot>
This platform is currently in its <span class="uk-text-bold">pilot</span> phase.
Over the next few months, we are dedicatedly working on enhancing data quality and expanding functionalities.
Our goal is to deliver the final product by June 2024.
This period is crucial for refining our services and ensuring that the platform meets the highest standards of excellence
and user satisfaction, please <a routerLink="/contact-us">contact us</a> with any questions or comments.
</ng-template>
<ng-template #mission>
<h4>Our Mission</h4>
<div class="uk-margin-medium-top">
At the heart of this platform is the mission to provide transparent, comprehensive insights into the state of Open Access in Ireland.
It serves as a key instrument for analyzing trends, identifying challenges,
and guiding policy development towards achieving an open, accessible, and sustainable research environment.
</div>
</ng-template>
<ng-template #context>
<h4>Context</h4>
<div class="uk-margin-medium-top">
In 2022, the National Open Research Forum (NORF) awarded funding to six collaborative projects
to implement priority actions in Irelands <a target="_blank" href="https://norf.ie/national-action-plan/" class="custom-external">National Action Plan for Open Research 2022-2030</a>.
By building national capacity and infrastructure for open research, these projects support the visibility and impact
of Irish research and help progress Irelands strategic goals for research and innovation under Impact 2030.
Development of the National Open Access Monitor is one of the priority actions
and the funding for management of the project was awarded to IReL.
The tender requirements for the National Open Access Monitor and a definition for open access in this context were
both defined following <a target="_blank" href="https://irel.ie/oamonitor-february2023survey-update/" class="custom-external">consultation</a> with national stakeholders.
The impact of the project will be to enable both point-in-time and longitudinal monitoring
of the open access status of Irish research publications as part of national implementation
and monitoring of open research practices.
</div>
</ng-template>
<ng-template #norf>
<h4>About NORF</h4>
<div class="uk-margin-medium-top">
Irelands <a target="_blank" href="https://norf.ie/" class="custom-external">National Open Research Forum</a> (NORF) was established in 2017 to drive the Irish agenda for open research.
NORF provides a space for communication, consultation and cooperation among key stakeholders
in the research system regarding strategic issues and overarching policies and procedures in open research.
NORF developed Irelands <a target="_blank" href="https://doi.org/10.7486/DRI.0287dj04d" class="custom-external">National Framework on the Transition to an Open Research Environment</a> (2019)
and the <a target="_blank" href="https://norf.ie/national-action-plan/" class="custom-external">National Action Plan for Open Research 2022-2030</a>.
</div>
</ng-template>
<ng-template #irel>
<h4>About IReL</h4>
<div class="uk-margin-medium-top">
IReL is the e-resource licensing consortium for Irish publicly funded higher education institutions
and the lead organisation for the Irish ORCID Consortium.
Since 2004, the IReL service (hosted by Maynooth University) has expanded from providing access
to quality peer-reviewed online research publications and index & abstracting services,
to facilitating open access publishing agreements, and managing the Irish ORCID Consortium.
</div>
</ng-template>
<ng-template #openaire>
<h4>About OpenAIRE</h4>
<div class="uk-margin-medium-top">
OpenAIRE AMKE is a non-profit organization established in 2018 to create a European-wide national policy
and open scholarly communication infrastructure.
OpenAIRE started as a series of European Commission projects in 2010 before incorporating
and has built extensive experience in both technical infrastructure and working within the Open Science community.
Its mission is to establish, maintain, and operate an open and sustainable scholarly communication infrastructure
and provide the necessary services, resources, and network for supporting a common European open e-research and e-science environment.
OpenAIRE modus operandi includes applying and contributing to international best practices
to meet the needs of the research community and promote Open Science. In particular, OpenAIRE
<ul class="uk-list uk-list-bullet uk-list-primary uk-margin-top">
<li>Adheres to and promotes key standards like the FAIR principles.</li>
<li>Provides the <a target="_blank" href="https://guidelines.openaire.eu/en/latest/" class="custom-external">OpenAIRE Guidelines</a>
for literature repositories, data archives, and Current Research Information Systems (CRIS) managers,
which (a) adapt global standards and schemas from RDA, COUNTER, COAR, DataCite, etc.,
and (b) are adopted by organisations around the world.</li>
<li>As a key partner in delivering the EOSC CORE and the EOSC Interoperability Framework,
OpenAIRE ensures interoperability with the European Open Science Cloud (EOSC).</li>
<li>Supports Open Access policies and advocacy.</li>
<li>Provides capacity building and training for the Open Science community.</li>
</ul>
<div class="uk-margin-medium-top">
As Ireland moves towards an open research environment, this platform signifies a commitment to transparency,
access, and the advancement of scientific communication.
It is a crucial step in supporting Ireland's alignment with broader European and global movements towards accessible and open scientific research.
</div>
<div class="uk-margin-top">
Discover more about this initiative in our Zenodo community, including related reports, presentations, and datasets.
</div>
<div class="uk-margin-top">Thank you for joining us!</div>
</div>
</ng-template>
<div *ngIf="!isMobile" class="uk-visible@m">
<div class="uk-banner">
<div class="uk-container uk-container-large">
<div class="uk-margin-medium-top uk-margin-medium-bottom uk-margin-remove-left uk-grid uk-grid-large uk-child-width-1-2@m uk-width-1-1"
uk-grid uk-scrollspy-class>
<div class="uk-padding-remove-horizontal">
<ng-container *ngTemplateOutlet="about"></ng-container>
</div>
<div>
<div class="uk-card uk-card-body uk-card-default pilot">
<ng-container *ngTemplateOutlet="pilot"></ng-container>
</div>
</div>
</div>
</div>
</div>
<div uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 250">
<div class="uk-section uk-container uk-container-large" uk-scrollspy-class>
<div id="parentContainer" class="uk-grid uk-grid-large" uk-grid>
<div class="uk-width-medium uk-margin-top">
<div class="uk-sticky" uk-sticky="end: !#parentContainer; offset: 100;">
<slider-tabs type="scrollable" position="left">
<slider-tab tabId="mission" tabTitle="Our Mission"></slider-tab>
<slider-tab tabId="context" tabTitle="Context"></slider-tab>
<slider-tab tabId="norf" tabTitle="About NORF"></slider-tab>
<slider-tab tabId="irel" tabTitle="About IReL"></slider-tab>
<slider-tab tabId="openaire" tabTitle="About OpenAIRE"></slider-tab>
</slider-tabs>
</div>
</div>
<div class="uk-width-expand uk-margin-top">
<div id="mission" class="uk-margin-large-bottom">
<ng-container *ngTemplateOutlet="mission"></ng-container>
</div>
<div id="context" class="uk-margin-large-bottom">
<ng-container *ngTemplateOutlet="context"></ng-container>
</div>
<div id="norf" class="uk-margin-large-bottom">
<ng-container *ngTemplateOutlet="norf"></ng-container>
</div>
<div id="irel" class="uk-margin-large-bottom">
<ng-container *ngTemplateOutlet="irel"></ng-container>
</div>
<div id="openaire" class="uk-margin-large-bottom">
<ng-container *ngTemplateOutlet="openaire"></ng-container>
</div>
</div>
</div>
</div>
</div>
</div>
<div *ngIf="isMobile || isServer" class="uk-hidden@m">
<div class="uk-banner">
<div class="uk-container uk-container-large">
<div class="uk-margin-medium-top uk-margin-medium-bottom uk-text-center" uk-scrollspy-class>
<div class="uk-padding-remove-horizontal">
<ng-container *ngTemplateOutlet="about"></ng-container>
</div>
<div>
<div class="uk-card uk-card-body uk-card-default pilot uk-margin-medium-top">
<ng-container *ngTemplateOutlet="pilot"></ng-container>
</div>
</div>
</div>
</div>
</div>
<div uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 250">
<div>
<div class="uk-sticky uk-background-default uk-padding-small uk-padding-remove-right" uk-sticky>
<slider-tabs type="scrollable" position="horizontal">
<slider-tab tabId="mission_m" tabTitle="Our Mission"></slider-tab>
<slider-tab tabId="context_m" tabTitle="Context"></slider-tab>
<slider-tab tabId="norf_m" tabTitle="About NORF"></slider-tab>
<slider-tab tabId="irel_m" tabTitle="About IReL"></slider-tab>
<slider-tab tabId="openaire_m" tabTitle="About OpenAIRE"></slider-tab>
</slider-tabs>
</div>
</div>
<div class="uk-container uk-container-large uk-section uk-section-small uk-text-break">
<div id="mission_m" class="uk-margin-xlarge-bottom">
<ng-container *ngTemplateOutlet="mission"></ng-container>
</div>
<div id="context_m" class="uk-margin-xlarge-bottom">
<ng-container *ngTemplateOutlet="context"></ng-container>
</div>
<div id="norf_m" class="uk-margin-xlarge-bottom">
<ng-container *ngTemplateOutlet="norf"></ng-container>
</div>
<div id="irel_m" class="uk-margin-xlarge-bottom">
<ng-container *ngTemplateOutlet="irel"></ng-container>
</div>
<div id="openaire_m" class="uk-margin-xlarge-bottom">
<ng-container *ngTemplateOutlet="openaire"></ng-container>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,12 @@
@import (reference) "~src/assets/openaire-theme/less/color.less";
.uk-width-medium {
width: 350px;
}
@pilot-card-border-color: @info-border-color;
.uk-card.pilot {
border: 1px solid @pilot-card-border-color;
box-shadow: none;
}

View File

@ -1,13 +1,52 @@
import {Component} from "@angular/core";
import {ChangeDetectorRef, Component} from "@angular/core";
import {BaseComponent} from "../../openaireLibrary/sharedComponents/base/base.component";
import {ActivatedRoute, Router} from "@angular/router";
import {PiwikService} from "../../openaireLibrary/utils/piwik/piwik.service";
import {Meta, Title} from "@angular/platform-browser";
import {SEOService} from "../../openaireLibrary/sharedComponents/SEO/SEO.service";
import {LayoutService} from "../../openaireLibrary/dashboard/sharedComponents/sidebar/layout.service";
import {HelperService} from "../../openaireLibrary/utils/helper/helper.service";
@Component({
selector: 'about',
template: `
<div>about page</div>
`
templateUrl: 'about.component.html',
styleUrls: ['about.component.less']
})
export class AboutComponent {
constructor() {
export class AboutComponent extends BaseComponent {
title = 'About';
description = 'About';
tab: 'mission' | 'context' | 'norf' | 'irel' | 'openaire' = 'mission';
contentSections: string[] = ['entities', 'inherited-and-inferred-attributes', 'constructed-attributes'];
activeSection: string;
divContents: any;
isMobile: boolean = false;
isServer: boolean;
constructor(protected _route: ActivatedRoute,
protected _piwikService: PiwikService,
protected _meta: Meta,
protected seoService: SEOService,
protected _title: Title,
protected _router: Router,
private cdr: ChangeDetectorRef,
private layoutService: LayoutService,
private helper: HelperService) {
super();
}
ngOnInit() {
this.setMetadata();
this.subscriptions.push(this._route.fragment.subscribe(fragment => {
if(fragment) {
this.activeSection = fragment;
} else {
this.activeSection = 'mission';
}
}));
this.layoutService.isMobile.subscribe(isMobile => {
this.isMobile = isMobile;
this.cdr.detectChanges();
});
}
}