2019-06-24 16:11:27 +02:00
import { Component } from '@angular/core' ;
import { ActivatedRoute , Router } from '@angular/router' ;
import { Title } from '@angular/platform-browser' ;
import { PiwikService } from '../openaireLibrary/utils/piwik/piwik.service' ;
import { EnvProperties } from '../openaireLibrary/utils/properties/env-properties' ;
import { FAQ } from "../openaireLibrary/utils/entities/FAQ" ;
@Component ( {
selector : 'learn-how' ,
template : `
2019-06-27 12:25:02 +02:00
< div class = "image-front-topbar" uk - scrollspy = "{"target":"[uk-scrollspy-class]","cls":"uk-animation-fade","delay":false}" tm - header - transparent = "light" tm - header - transparent - placeholder = "" >
2019-06-24 16:11:27 +02:00
< div style = " min-height: calc(7.89999px + 60vh);"
2019-06-27 12:25:02 +02:00
class = "uk-padding-remove-bottom cloud-background uk-background-norepeat uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color" >
< div class = "uk-section uk-margin-large-top" >
2019-06-25 13:48:15 +02:00
< div class = "uk-container uk-container-large" >
2019-06-27 12:25:02 +02:00
< div class = "uk-margin-large-top" uk - grid >
< h1 class = "uk-width-1-1" style = "font-size: 41px" > Learn the process < / h1 >
< div class = "uk-width-1-2@l uk-width-1-1@s uk-text-large" > Build a < b > Gateway to your community ' s < / b > open and linked research outcomes . Customized to your needs . < / div >
< / div >
2019-06-27 20:45:33 +02:00
< div class = "uk-margin-large-top uk-flex-middle uk-flex uk-child-width-1-3@m uk-child-width-1-1@s uk-flex-center" uk - grid >
2019-06-27 12:25:02 +02:00
< div class = "uk-flex uk-flex-middle uk-child-width-1-1@m uk-child-width-1-2@s uk-text-center" uk - grid >
< div >
< h5 class = "uk-text-bold" > 1 . Understanding your needs < / h5 >
< div >
First , we learn about your requirements and challenges . We help you understand Open Science practices within EOSC and together we ’ ll talk about how OpenAIRE RCD fits as a solution .
< / div >
< / div >
< div class = "uk-visible@m" >
< h5 class = " uk-text-bold" > 4 . Roll out the service < / h5 >
< div >
We jointly roll out your new Science Gateway . You take over the business operations and start engaging your researchers , we take care of the smooth operation of the e - service .
< / div >
< / div >
< div class = "uk-hidden@m" >
< h5 class = " uk-text-bold" > 2 . Develop a pilot < / h5 >
< div >
How do you work today , and how would you like to work tomorrow ? We tranlate your needs into rules and processes and we configure operational OpenAIRE services . By the end of this phase , we ’ ll have defined the basic configuration of your Community Gateway . < / div >
< / div >
< / div >
< div >
< img src = "../../assets/about/cicle.png" >
< / div >
< div class = "uk-flex uk-flex-middle uk-child-width-1-1@m uk-child-width-1-2@s uk-text-center" uk - grid >
< div class = "uk-visible@m" >
< h5 class = " uk-text-bold" > 2 . Develop a pilot < / h5 >
< div >
How do you work today , and how would you like to work tomorrow ? We tranlate your needs into rules and processes and we configure operational OpenAIRE services . By the end of this phase , we ’ ll have defined the basic configuration of your Community Gateway . < / div >
< / div >
< div class = "uk-hidden@m" >
< h5 class = " uk-text-bold" > 4 . Roll out the service < / h5 >
< div >
We jointly roll out your new Science Gateway . You take over the business operations and start engaging your researchers , we take care of the smooth operation of the e - service . < / div >
< / div >
< div >
< h5 class = "uk-text-bold" > 3 . Test and Validate < / h5 >
< div >
You validate and test your new Science Gateway ( portal ) with your experts and community to ensure all workflows are in place and quality of data meets your standards . If needed , we work together in another iteration to further refine and adapt to your needs .
< / div >
< / div >
< / div >
< / div >
2019-06-27 13:54:04 +02:00
< div class = "uk-width-1-1 uk-text-center uk-text-large uk-margin-large-top" >
< a class = "uk-button portal-button uk-text-uppercase" routerLinkActive = "router-link-active" routerLink = "/learn-in-depth" > Learn more details < / a >
2019-06-27 13:30:00 +02:00
< / div >
2019-06-24 16:11:27 +02:00
< / div >
< / div >
2019-06-27 12:25:02 +02:00
< / div >
< div class = "uk-section" >
< div class = "uk-container uk-container-large" >
2019-06-27 13:54:04 +02:00
< gif - slider [ gifs ] = " gifs " > < / g i f - s l i d e r >
2019-06-27 12:25:02 +02:00
< / div >
< / div >
< div class = "contact-background uk-background-norepeat uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color" >
< div class = "uk-container uk-container-large uk-section" >
2019-06-26 14:25:46 +02:00
< div class = "uk-flex uk-flex-middle uk-child-width-1-1@s uk-child-width-1-2@m" uk - grid >
< div >
2019-06-24 16:11:27 +02:00
< h1 > We look forward to working together and helping you unlock the full potential of your research community through open science . < / h1 >
2019-06-26 14:25:46 +02:00
< div > Get in touch with our team to find out how . < / div >
< div class = "uk-inline uk-margin-large-top" >
2019-06-25 16:27:27 +02:00
< a class = "uk-button portal-button" routerLinkActive = "router-link-active" routerLink = "/contact-us" > CONTACT US < / a >
2019-06-24 16:11:27 +02:00
< / div >
< / div >
2019-06-27 13:30:00 +02:00
< div class = "uk-text-center" >
< img width = "263" height = "250" src = "../../assets/contact/4.png" >
2019-06-24 16:11:27 +02:00
< / div >
< / div >
< / div >
< / div >
2019-06-27 12:25:02 +02:00
< div * ngIf = "questions.length > 0 else comingSoon" class = "uk-container" >
2019-06-24 16:11:27 +02:00
< h1 class = "uk-margin-remove-bottom uk-margin-large-top uk-width-1-1" > Frequently Asked Questions < / h1 >
< div class = "uk-width-1-1 uk-section" >
< ul uk - accordion >
< li * ngFor = "let question of questions; let i=index" [ ngClass ] = " ( i = = = 0 ) ? ' uk - open ' : ' ' " >
< a class = "uk-accordion-title" > { { question . question } } < / a >
< div class = "uk-accordion-content uk-height-max-small uk-overflow-auto" >
< p > { { question . answer } }
< / p >
< / div >
< / li >
< / ul >
< / div >
< / div >
2019-06-27 12:25:02 +02:00
< ng - template # comingSoon >
< div class = "uk-container" >
< h1 class = "uk-margin-remove-bottom uk-margin-large-top uk-width-1-1" > Frequently Asked Questions < / h1 >
2019-06-27 13:30:00 +02:00
< div class = "uk-width-1-1 uk-section uk-text-center uk-text-large" >
Coming Soon . . .
2019-06-27 12:25:02 +02:00
< / div >
< / div >
< / n g - t e m p l a t e >
2019-06-24 16:11:27 +02:00
< / div >
`
} )
export class LearnHowComponent {
public piwiksub : any ;
questions : FAQ [ ] = [
2019-06-27 12:25:02 +02:00
/ * {
2019-06-26 16:40:07 +02:00
question : 'Coming soon?' ,
answer : 'Yes'
} ,
2019-06-24 16:11:27 +02:00
{
2019-06-27 12:25:02 +02:00
question : 'Could you be more specific?' ,
answer : 'No'
2019-06-26 16:40:07 +02:00
} * /
2019-06-24 16:11:27 +02:00
] ;
2019-06-27 13:54:04 +02:00
public gifs : { "gif" : string , "header" : string , "text" } [ ] = [ ] ;
2019-06-24 16:11:27 +02:00
private pageTitle = "OpenAIRE - Connect | Learn How" ;
properties :EnvProperties ;
constructor (
private route : ActivatedRoute ,
private _router : Router ,
private _title : Title ,
private _piwikService : PiwikService ) {
var description = "OpenAIRE - Connect, Community Dashboard, research community" ;
this . _title . setTitle ( this . pageTitle ) ;
}
public ngOnInit() {
this . route . data
. subscribe ( ( data : { envSpecific : EnvProperties } ) = > {
this . properties = data . envSpecific ;
if ( this . properties . enablePiwikTrack && ( typeof document !== 'undefined' ) ) {
this . piwiksub = this . _piwikService . trackView ( this . properties , "OpenAIRE Connect | Create and manage your community page" , this . properties . piwikSiteId ) . subscribe ( ) ;
}
} ) ;
2019-06-25 13:48:15 +02:00
this . createGifs ( ) ;
2019-06-24 16:11:27 +02:00
}
public ngOnDestroy() {
if ( this . piwiksub ) {
this . piwiksub . unsubscribe ( ) ;
}
}
2019-06-25 13:48:15 +02:00
private createGifs() {
2019-06-27 13:54:04 +02:00
this . gifs . push ( {
2019-06-27 16:43:17 +02:00
gif : "../../../../assets/about/gifs/profile.gif" ,
header : "Profile" ,
text : "Edit community information, change logo url, add community managers or organizations related to community."
2019-06-25 13:48:15 +02:00
} ) ;
2019-06-27 13:54:04 +02:00
this . gifs . push ( {
2019-06-27 16:43:17 +02:00
gif : "../../../../assets/about/gifs/content.gif" ,
header : "Content" ,
text : "Manage projects, content providers, subjects and zenodo communities that are related to the research community."
2019-06-25 13:48:15 +02:00
} ) ;
2019-06-27 13:54:04 +02:00
this . gifs . push ( {
2019-06-27 16:43:17 +02:00
gif : "../../../../assets/about/gifs/statistics.gif" ,
header : "Statistics & Charts" ,
text : "Manage statistical numbers & charts that will be displayed in the community overview and graph analysis views."
} ) ;
this . gifs . push ( {
gif : "../../../../assets/about/gifs/links.gif" ,
header : "Links" ,
text : " Manage user claims related to the research community."
} ) ;
this . gifs . push ( {
gif : "../../../../assets/about/gifs/help.gif" ,
header : " Help texts" ,
text : "Add or edit help text in research community pages."
} ) ;
this . gifs . push ( {
gif : "../../../../assets/about/gifs/users.gif" ,
header : "Users" ,
text : "Invite more users to subscribe, manage community subscribers, your personal info and notification settings."
2019-06-25 13:48:15 +02:00
} ) ;
}
2019-06-24 16:11:27 +02:00
}