Revision 58904
Added by Stefania Martziou almost 4 years ago
home.component.html | ||
---|---|---|
1 |
<!--MAP AND OVERVIEW NUMBERS SECTION--> |
|
2 |
<section class="section greySection" id="sect-overview"> |
|
3 |
<div class="uk-container uk-container-large uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove uk-margin-bottom" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}"> |
|
1 |
<!--LAPTOP & PAD LANDSCAPE--> |
|
2 |
<div class="uk-visible@m"> |
|
3 |
<!--MAP AND OVERVIEW NUMBERS SECTION--> |
|
4 |
<section class="section greySection" id="sect-overview"> |
|
5 |
<div class="uk-container uk-container-large uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up uk-padding-remove uk-margin-bottom" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}"> |
|
4 | 6 |
|
5 |
<div class="uk-grid uk-grid-small uk-margin-bottom uk-grid-match" uk-height-viewport="offset-bottom: 25"> |
|
7 |
<div class="uk-grid uk-grid-small uk-margin-bottom uk-grid-match" uk-height-viewport="offset-bottom: 25">
|
|
6 | 8 |
|
7 |
<div class="uk-width-4-5"> |
|
9 |
<div class="uk-width-4-5">
|
|
8 | 10 |
|
9 |
<!--Map Container--> |
|
10 |
<app-europe-map-overview (emitSelectedCountry)="countrySelected($event)"></app-europe-map-overview> |
|
11 |
<!--<app-map-overview *ngIf="overviewData?.countries" (emitSelectedCountry)="selectedCountry($event)"></app-map-overview>--> |
|
11 |
<!--Map Container-->
|
|
12 |
<app-europe-map-overview (emitSelectedCountry)="countrySelected($event)"></app-europe-map-overview>
|
|
13 |
<!--<app-map-overview *ngIf="overviewData?.countries" (emitSelectedCountry)="selectedCountry($event)"></app-map-overview>-->
|
|
12 | 14 |
|
13 | 15 |
|
14 | 16 |
|
15 |
</div> |
|
17 |
</div>
|
|
16 | 18 |
|
17 |
<div class="uk-width-1-5"> |
|
18 |
<div class="md-card infoBox"> |
|
19 |
<ng-container *ngIf="!selectedCountry"> |
|
20 |
<div class="md-card-toolbar"> |
|
21 |
<h3 class="uk-text-center">OPENAIRE MONITOR OBSERVATORY</h3> |
|
22 |
</div> |
|
23 |
<div *ngIf="!selectedCountry" class="md-card-content"> |
|
24 |
<div>An OpenAIRE service to:</div> |
|
25 |
<ul> |
|
26 |
<li> |
|
27 |
Better understand the European open research landscape |
|
28 |
</li> |
|
29 |
<li> |
|
30 |
Track trends for open access to publications, data, software |
|
31 |
</li> |
|
32 |
<li> |
|
33 |
Reveal hidden potential on existing resources |
|
34 |
</li> |
|
35 |
<li> |
|
36 |
View open collaboration patterns |
|
37 |
</li> |
|
38 |
</ul> |
|
39 |
<div class="uk-text-center uk-margin-medium-top uk-margin-medium-bottom"> |
|
40 |
<button class="md-btn md-btn-primary">Learn More</button> |
|
19 |
<div class="uk-width-1-5"> |
|
20 |
<div class="md-card infoBox"> |
|
21 |
<ng-container *ngIf="!selectedCountry"> |
|
22 |
<div class="md-card-toolbar"> |
|
23 |
<h3 class="uk-text-center">OPENAIRE MONITOR OBSERVATORY</h3> |
|
41 | 24 |
</div> |
25 |
<div *ngIf="!selectedCountry" class="md-card-content"> |
|
26 |
<div>An OpenAIRE service to:</div> |
|
27 |
<ul> |
|
28 |
<li> |
|
29 |
Better understand the European open research landscape |
|
30 |
</li> |
|
31 |
<li> |
|
32 |
Track trends for open access to publications, data, software |
|
33 |
</li> |
|
34 |
<li> |
|
35 |
Reveal hidden potential on existing resources |
|
36 |
</li> |
|
37 |
<li> |
|
38 |
View open collaboration patterns |
|
39 |
</li> |
|
40 |
</ul> |
|
41 |
<div class="uk-text-center uk-margin-medium-top uk-margin-medium-bottom"> |
|
42 |
<button class="md-btn md-btn-primary">Learn More</button> |
|
43 |
</div> |
|
42 | 44 |
|
43 |
</div> |
|
44 |
<div></div> |
|
45 |
</ng-container> |
|
45 |
</div>
|
|
46 |
<div></div>
|
|
47 |
</ng-container>
|
|
46 | 48 |
|
47 |
<ng-container *ngIf="selectedCountry"> |
|
48 |
<div class="md-card-toolbar"> |
|
49 |
<h3 class="uk-text-center uk-margin-small-top"> |
|
50 |
<a class="backToOriginalInfoBox uk-float-left" (click)="deselectCountry()"><i class="fas fa-angle-left"></i></a> |
|
51 |
<img src="../../../assets/img/flags/{{selectedCountry.code | lowercase}}-flag-round.png" class="small-flag-image uk-margin-small-right" width="24" style="margin-top: -3px"> |
|
52 |
<span>{{selectedCountry.name | uppercase}}</span> |
|
53 |
</h3> |
|
54 |
</div> |
|
55 |
<div *ngIf="!selectedCountryData" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-5x loader" aria-hidden="true"></i></div> |
|
56 |
<!--<div *ngIf="!selectedCountryData" class="loading-big">--> |
|
49 |
<ng-container *ngIf="selectedCountry">
|
|
50 |
<div class="md-card-toolbar">
|
|
51 |
<h3 class="uk-text-center uk-margin-small-top">
|
|
52 |
<a class="backToOriginalInfoBox uk-float-left" (click)="deselectCountry()"><i class="fas fa-angle-left"></i></a>
|
|
53 |
<img src="../../../assets/img/flags/{{selectedCountry.code | lowercase}}-flag-round.png" class="small-flag-image uk-margin-small-right" width="24" style="margin-top: -3px">
|
|
54 |
<span>{{selectedCountry.name | uppercase}}</span>
|
|
55 |
</h3>
|
|
56 |
</div>
|
|
57 |
<div *ngIf="!selectedCountryData" class="whiteFilm"><i class="fa fa-spinner fa-spin fa-5x loader" aria-hidden="true"></i></div>
|
|
58 |
<!--<div *ngIf="!selectedCountryData" class="loading-big">-->
|
|
57 | 59 |
<!--<div uk-spinner="ratio: 2" class="uk-overlay uk-position-center uk-dark" style="margin: auto"></div>--> |
58 | 60 |
<!--<!–<div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">–>--> |
59 |
<!--<!–{{ loadingMessage }}–>-->
|
|
61 |
<!--<!–{{ loadingMessage }}–>--> |
|
60 | 62 |
<!--<!–</div>–>--> |
61 | 63 |
<!--<div class="transparentFilm"></div>--> |
62 |
<!--</div>--> |
|
63 |
<div *ngIf="selectedCountryData" class="md-card-content"> |
|
64 |
<div class="numbers"> |
|
65 |
<div class="uk-margin-small-top"> |
|
64 |
<!--</div>-->
|
|
65 |
<div *ngIf="selectedCountryData" class="md-card-content">
|
|
66 |
<div class="numbers">
|
|
67 |
<div class="uk-margin-small-top">
|
|
66 | 68 |
|
67 |
<div class="indicator"> |
|
68 |
<span class="number publications" *ngIf="selectedCountryData.publicationsAffiliated!=null">{{selectedCountryData.publicationsAffiliated | number}}</span> |
|
69 |
<span class="number publications" *ngIf="selectedCountryData.publicationsAffiliated===null">--</span> |
|
70 |
<span><i>OA publications</i> affiliated to an organization in the country</span> |
|
71 |
</div> |
|
69 |
<div class="indicator">
|
|
70 |
<span class="number publications" *ngIf="selectedCountryData.publicationsAffiliated!=null">{{selectedCountryData.publicationsAffiliated | number}}</span>
|
|
71 |
<span class="number publications" *ngIf="selectedCountryData.publicationsAffiliated===null">--</span>
|
|
72 |
<span><i>OA publications</i> affiliated to an organization in the country</span>
|
|
73 |
</div>
|
|
72 | 74 |
|
73 |
<div class="indicator uk-margin-small-top"> |
|
74 |
<span class="number publications" *ngIf="selectedCountryData.publicationsDeposited!=null">{{selectedCountryData.publicationsDeposited | number}}</span> |
|
75 |
<span class="number publications" *ngIf="selectedCountryData.publicationsDeposited===null">--</span> |
|
76 |
<span><i>OA publications</i> from institutional repositories</span> |
|
77 |
</div> |
|
75 |
<div class="indicator uk-margin-small-top">
|
|
76 |
<span class="number publications" *ngIf="selectedCountryData.publicationsDeposited!=null">{{selectedCountryData.publicationsDeposited | number}}</span>
|
|
77 |
<span class="number publications" *ngIf="selectedCountryData.publicationsDeposited===null">--</span>
|
|
78 |
<span><i>OA publications</i> from institutional repositories</span>
|
|
79 |
</div>
|
|
78 | 80 |
|
79 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom"> |
|
81 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
|
|
80 | 82 |
|
81 |
<div class="indicator"> |
|
82 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsAffiliated!=null">{{selectedCountryData.datasetsAffiliated | number}}</span> |
|
83 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsAffiliated===null">--</span> |
|
84 |
<span><i>OA datasets</i> affiliated to an organization in the country</span> |
|
85 |
</div> |
|
83 |
<div class="indicator">
|
|
84 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsAffiliated!=null">{{selectedCountryData.datasetsAffiliated | number}}</span>
|
|
85 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsAffiliated===null">--</span>
|
|
86 |
<span><i>OA datasets</i> affiliated to an organization in the country</span>
|
|
87 |
</div>
|
|
86 | 88 |
|
87 |
<div class="indicator uk-margin-small-top"> |
|
88 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsDeposited!=null">{{selectedCountryData.datasetsDeposited | number}}</span> |
|
89 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsDeposited===null">--</span> |
|
90 |
<span><i>OA datasets</i> from institutional repositories</span> |
|
91 |
</div> |
|
89 |
<div class="indicator uk-margin-small-top">
|
|
90 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsDeposited!=null">{{selectedCountryData.datasetsDeposited | number}}</span>
|
|
91 |
<span class="number datasets" *ngIf="selectedCountryData.datasetsDeposited===null">--</span>
|
|
92 |
<span><i>OA datasets</i> from institutional repositories</span>
|
|
93 |
</div>
|
|
92 | 94 |
|
93 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom"> |
|
95 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
|
|
94 | 96 |
|
95 |
<div class="indicator"> |
|
96 |
<span class="number repositories" *ngIf="selectedCountryData.repositories!=null">{{selectedCountryData.repositories | number}}</span> |
|
97 |
<span class="number repositories" *ngIf="selectedCountryData.repositories===null">--</span> |
|
98 |
<span><i>repositories</i> from openDOAR & re3data</span> |
|
99 |
</div> |
|
97 |
<div class="indicator">
|
|
98 |
<span class="number repositories" *ngIf="selectedCountryData.repositories!=null">{{selectedCountryData.repositories | number}}</span>
|
|
99 |
<span class="number repositories" *ngIf="selectedCountryData.repositories===null">--</span>
|
|
100 |
<span><i>repositories</i> from openDOAR & re3data</span>
|
|
101 |
</div>
|
|
100 | 102 |
|
101 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom"> |
|
103 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
|
|
102 | 104 |
|
103 |
<div class="indicator"> |
|
104 |
<span class="number journals" *ngIf="selectedCountryData.journals!=null">{{selectedCountryData.journals | number}}</span> |
|
105 |
<span class="number journals" *ngIf="selectedCountryData.journals===null">--</span> |
|
106 |
<span><i>journals</i> from DOAJ</span> |
|
107 |
</div> |
|
105 |
<div class="indicator">
|
|
106 |
<span class="number journals" *ngIf="selectedCountryData.journals!=null">{{selectedCountryData.journals | number}}</span>
|
|
107 |
<span class="number journals" *ngIf="selectedCountryData.journals===null">--</span>
|
|
108 |
<span><i>journals</i> from DOAJ</span>
|
|
109 |
</div>
|
|
108 | 110 |
|
109 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom"> |
|
111 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom">
|
|
110 | 112 |
|
111 |
<div class="indicator"> |
|
112 |
<span class="number policies" *ngIf="selectedCountryData.policies!=null">{{selectedCountryData.policies | number}}</span> |
|
113 |
<span class="number policies" *ngIf="selectedCountryData.policies===null">--</span> |
|
114 |
<span>organisations with <i>OA policies</i></span> |
|
113 |
<div class="indicator"> |
|
114 |
<span class="number policies" *ngIf="selectedCountryData.policies!=null">{{selectedCountryData.policies | number}}</span> |
|
115 |
<span class="number policies" *ngIf="selectedCountryData.policies===null">--</span> |
|
116 |
<span>organisations with <i>OA policies</i></span> |
|
117 |
</div> |
|
118 |
|
|
115 | 119 |
</div> |
116 | 120 |
|
117 | 121 |
</div> |
118 | 122 |
|
119 |
</div> |
|
123 |
<div class="uk-text-center uk-margin-medium-top"> |
|
124 |
<!--<button [routerLink]="['/countryDashboard/' + countrySelectedName]" class="md-btn md-btn-primary">View Details</button>--> |
|
125 |
<button [routerLink]="['/countryDashboard/' + selectedCountry.code]" class="md-btn md-btn-primary">View Details</button> |
|
126 |
<!--<a class="" [routerLink]="['/countryDashboard/' + countrySelectedName]">Detailed View <i class="fas fa-arrow-right uk-margin-small-left"></i></a>--> |
|
127 |
</div> |
|
120 | 128 |
|
121 |
<div class="uk-text-center uk-margin-medium-top"> |
|
122 |
<!--<button [routerLink]="['/countryDashboard/' + countrySelectedName]" class="md-btn md-btn-primary">View Details</button>--> |
|
123 |
<button [routerLink]="['/countryDashboard/' + selectedCountry.code]" class="md-btn md-btn-primary">View Details</button> |
|
124 |
<!--<a class="" [routerLink]="['/countryDashboard/' + countrySelectedName]">Detailed View <i class="fas fa-arrow-right uk-margin-small-left"></i></a>--> |
|
125 | 129 |
</div> |
126 |
|
|
127 |
</div> |
|
128 |
<div></div> |
|
129 |
</ng-container> |
|
130 |
<div></div> |
|
131 |
</ng-container> |
|
132 |
</div> |
|
130 | 133 |
</div> |
131 |
</div> |
|
132 | 134 |
|
133 | 135 |
|
134 |
<!--<div class="uk-width-large-3-5 uk-container-center uk-text-center">--> |
|
136 |
<!--<div class="uk-width-large-3-5 uk-container-center uk-text-center">-->
|
|
135 | 137 |
<!--<h2 class="heading_b">--> |
136 |
<!--Our Team-->
|
|
137 |
<!--<span class="sub-heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</span>-->
|
|
138 |
<!--Our Team--> |
|
139 |
<!--<span class="sub-heading">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</span>--> |
|
138 | 140 |
<!--</h2>--> |
139 |
<!--</div>--> |
|
141 |
<!--</div>--> |
|
142 |
</div> |
|
143 |
|
|
140 | 144 |
</div> |
145 |
<div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}"> |
|
141 | 146 |
|
142 |
</div> |
|
143 |
<div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}"> |
|
144 |
|
|
145 |
<div class=""> |
|
146 |
<!--Overview cards--> |
|
147 |
<div *ngIf="europeOverviewData" class="uk-width-1-1 indicatorCards"> |
|
148 |
<div class="uk-grid uk-grid-small uk-child-width-1-2@s uk-child-width-1-3@m uk-child-width-1-5@l uk-margin-top uk-grid-match" data-uk-grid-margin=""> |
|
149 |
<div class="uk-row-first"> |
|
150 |
<div class="md-card"> |
|
151 |
<div class="md-card-content"> |
|
152 |
<div class="uk-margin-top"> |
|
153 |
<div class="uk-float-right uk-margin-small-right"> |
|
154 |
<img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40"> |
|
147 |
<div class=""> |
|
148 |
<!--Overview cards--> |
|
149 |
<div *ngIf="europeOverviewData" class="uk-width-1-1 indicatorCards"> |
|
150 |
<div class="uk-grid uk-grid-small uk-child-width-1-2@s uk-child-width-1-3@m uk-child-width-1-5@l uk-margin-top uk-grid-match" data-uk-grid-margin=""> |
|
151 |
<div class="uk-row-first"> |
|
152 |
<div class="md-card"> |
|
153 |
<div class="md-card-content"> |
|
154 |
<div class="uk-margin-top"> |
|
155 |
<div class="uk-float-right uk-margin-small-right"> |
|
156 |
<img src="../../../assets/img/icons/publications-icon.svg" width="40" height="40"> |
|
157 |
</div> |
|
158 |
<h3 class="uk-margin-remove"> |
|
159 |
<span *ngIf="europeOverviewData.publications?.oa" class="number">{{europeOverviewData.publications.oa | number}}</span> |
|
160 |
<span *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.oa" class="number">--</span> |
|
161 |
</h3> |
|
155 | 162 |
</div> |
156 |
<h3 class="uk-margin-remove"> |
|
157 |
<span *ngIf="europeOverviewData.publications?.oa" class="number">{{europeOverviewData.publications.oa | number}}</span> |
|
158 |
<span *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.oa" class="number">--</span> |
|
159 |
</h3> |
|
160 |
</div> |
|
161 |
<div class="uk-margin-top"> |
|
162 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
|
163 |
<span class=""><i>OA publications</i></span> |
|
164 |
</div> |
|
165 |
<div *ngIf="europeOverviewData.publications?.percentage" class="uk-margin-top"> |
|
166 |
<span class="number">{{europeOverviewData.publications.percentage | number :'1.0-1'}}%</span> OA |
|
167 |
<div class="progress uk-margin-small-top"> |
|
168 |
<div [ngStyle]="{'width': europeOverviewData.publications.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div> |
|
163 |
<div class="uk-margin-top"> |
|
164 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
|
165 |
<span class=""><i>OA publications</i></span> |
|
169 | 166 |
</div> |
167 |
<div *ngIf="europeOverviewData.publications?.percentage" class="uk-margin-top"> |
|
168 |
<span class="number">{{europeOverviewData.publications.percentage | number :'1.0-1'}}%</span> OA |
|
169 |
<div class="progress uk-margin-small-top"> |
|
170 |
<div [ngStyle]="{'width': europeOverviewData.publications.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div> |
|
171 |
</div> |
|
172 |
</div> |
|
170 | 173 |
</div> |
171 | 174 |
</div> |
172 | 175 |
</div> |
173 |
</div> |
|
174 |
<div class=""> |
|
175 |
<div class="md-card"> |
|
176 |
<div class="md-card-content"> |
|
177 |
<div class="uk-margin-top"> |
|
178 |
<div class="uk-float-right uk-margin-small-right"> |
|
179 |
<img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40"> |
|
176 |
<div class=""> |
|
177 |
<div class="md-card"> |
|
178 |
<div class="md-card-content"> |
|
179 |
<div class="uk-margin-top"> |
|
180 |
<div class="uk-float-right uk-margin-small-right"> |
|
181 |
<img src="../../../assets/img/icons/datasets-icon.svg" width="33" height="40"> |
|
182 |
</div> |
|
183 |
<h3 class="uk-margin-remove"> |
|
184 |
<span *ngIf="europeOverviewData.datasets?.oa" class="number">{{europeOverviewData.datasets.oa | number}}</span> |
|
185 |
<span *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.oa" class="number">--</span> |
|
186 |
</h3> |
|
180 | 187 |
</div> |
181 |
<h3 class="uk-margin-remove"> |
|
182 |
<span *ngIf="europeOverviewData.datasets?.oa" class="number">{{europeOverviewData.datasets.oa | number}}</span> |
|
183 |
<span *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.oa" class="number">--</span> |
|
184 |
</h3> |
|
185 |
</div> |
|
186 |
<div class="uk-margin-top"> |
|
187 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
|
188 |
<span class=""><i>OA datasets</i></span> |
|
189 |
</div> |
|
190 |
<div *ngIf="europeOverviewData.datasets?.percentage" class="uk-margin-top"> |
|
191 |
<span class="number">{{europeOverviewData.datasets.percentage | number :'1.0-1'}}%</span> OA |
|
192 |
<div class="progress uk-margin-small-top"> |
|
193 |
<div [ngStyle]="{'width': europeOverviewData.datasets.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div> |
|
188 |
<div class="uk-margin-top"> |
|
189 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
|
190 |
<span class=""><i>OA datasets</i></span> |
|
194 | 191 |
</div> |
192 |
<div *ngIf="europeOverviewData.datasets?.percentage" class="uk-margin-top"> |
|
193 |
<span class="number">{{europeOverviewData.datasets.percentage | number :'1.0-1'}}%</span> OA |
|
194 |
<div class="progress uk-margin-small-top"> |
|
195 |
<div [ngStyle]="{'width': europeOverviewData.datasets.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div> |
|
196 |
</div> |
|
197 |
</div> |
|
195 | 198 |
</div> |
196 | 199 |
</div> |
197 | 200 |
</div> |
198 |
</div> |
|
199 |
<div class=""> |
|
200 |
<div class="md-card"> |
|
201 |
<div class="md-card-content"> |
|
202 |
<div class="uk-margin-top"> |
|
203 |
<div class="uk-float-right uk-margin-small-right"> |
|
204 |
<img src="../../../assets/img/icons/repositories-icon.svg" width="43" height="40"> |
|
201 |
<div class=""> |
|
202 |
<div class="md-card"> |
|
203 |
<div class="md-card-content"> |
|
204 |
<div class="uk-margin-top"> |
|
205 |
<div class="uk-float-right uk-margin-small-right"> |
|
206 |
<img src="../../../assets/img/icons/repositories-icon.svg" width="43" height="40"> |
|
207 |
</div> |
|
208 |
<h3 class="uk-margin-remove"> |
|
209 |
<span *ngIf="europeOverviewData.repositories?.oa" class="number">{{europeOverviewData.repositories.oa | number}}</span> |
|
210 |
<span *ngIf="!europeOverviewData.repositories || !europeOverviewData.repositories.oa" class="number">--</span> |
|
211 |
</h3> |
|
205 | 212 |
</div> |
206 |
<h3 class="uk-margin-remove"> |
|
207 |
<span *ngIf="europeOverviewData.repositories?.oa" class="number">{{europeOverviewData.repositories.oa | number}}</span> |
|
208 |
<span *ngIf="!europeOverviewData.repositories || !europeOverviewData.repositories.oa" class="number">--</span> |
|
209 |
</h3> |
|
210 |
</div> |
|
211 |
<div class="uk-margin-top"> |
|
212 |
<span class="">validated <i>repositories</i></span> |
|
213 |
</div> |
|
214 |
<div *ngIf="europeOverviewData.repositories?.percentage" class="uk-margin-top"> |
|
215 |
<span class="number">{{europeOverviewData.repositories.percentage | number : '1.0-1'}}%</span> Validated |
|
216 |
<div class="progress uk-margin-small-top"> |
|
217 |
<div [ngStyle]="{'width': europeOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div> |
|
213 |
<div class="uk-margin-top"> |
|
214 |
<span class="">validated <i>repositories</i></span> |
|
218 | 215 |
</div> |
216 |
<div *ngIf="europeOverviewData.repositories?.percentage" class="uk-margin-top"> |
|
217 |
<span class="number">{{europeOverviewData.repositories.percentage | number : '1.0-1'}}%</span> Validated |
|
218 |
<div class="progress uk-margin-small-top"> |
|
219 |
<div [ngStyle]="{'width': europeOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div> |
|
220 |
</div> |
|
221 |
</div> |
|
219 | 222 |
</div> |
220 | 223 |
</div> |
221 | 224 |
</div> |
222 |
</div> |
|
223 |
<div class=""> |
|
224 |
<div class="md-card"> |
|
225 |
<div class="md-card-content"> |
|
226 |
<div class="uk-margin-top"> |
|
227 |
<div class="uk-float-right uk-margin-small-right"> |
|
228 |
<img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40"> |
|
225 |
<div class=""> |
|
226 |
<div class="md-card"> |
|
227 |
<div class="md-card-content"> |
|
228 |
<div class="uk-margin-top"> |
|
229 |
<div class="uk-float-right uk-margin-small-right"> |
|
230 |
<img src="../../../assets/img/icons/journals-icon.svg" width="43" height="40"> |
|
231 |
</div> |
|
232 |
<h3 class="uk-margin-remove"> |
|
233 |
<span *ngIf="europeOverviewData.journals?.oa" class="number">{{europeOverviewData.journals.oa | number}}</span> |
|
234 |
<span *ngIf="!europeOverviewData.journals || !europeOverviewData.journals.oa" class="number">--</span> |
|
235 |
</h3> |
|
229 | 236 |
</div> |
230 |
<h3 class="uk-margin-remove"> |
|
231 |
<span *ngIf="europeOverviewData.journals?.oa" class="number">{{europeOverviewData.journals.oa | number}}</span> |
|
232 |
<span *ngIf="!europeOverviewData.journals || !europeOverviewData.journals.oa" class="number">--</span> |
|
233 |
</h3> |
|
234 |
</div> |
|
235 |
<div class="uk-margin-top"> |
|
236 |
<span class="">validated <i>OA journals</i></span> |
|
237 |
</div> |
|
238 |
<div *ngIf="europeOverviewData.journals?.percentage" class="uk-margin-top"> |
|
239 |
<span class="number">{{europeOverviewData.journals.percentage | number : '1.0-1'}}%</span> Validated |
|
240 |
<div class="progress uk-margin-small-top"> |
|
241 |
<div [ngStyle]="{'width': europeOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div> |
|
237 |
<div class="uk-margin-top"> |
|
238 |
<span class="">validated <i>OA journals</i></span> |
|
242 | 239 |
</div> |
240 |
<div *ngIf="europeOverviewData.journals?.percentage" class="uk-margin-top"> |
|
241 |
<span class="number">{{europeOverviewData.journals.percentage | number : '1.0-1'}}%</span> Validated |
|
242 |
<div class="progress uk-margin-small-top"> |
|
243 |
<div [ngStyle]="{'width': europeOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div> |
|
244 |
</div> |
|
245 |
</div> |
|
243 | 246 |
</div> |
244 | 247 |
</div> |
245 | 248 |
</div> |
246 |
</div> |
|
247 |
<div class=""> |
|
248 |
<div class="md-card"> |
|
249 |
<div class="md-card-content"> |
|
250 |
<div class="uk-margin-top"> |
|
251 |
<div class="uk-float-right uk-margin-small-right"> |
|
252 |
<img src="../../../assets/img/icons/policies-icon.svg" width="36" height="40"> |
|
249 |
<div class=""> |
|
250 |
<div class="md-card"> |
|
251 |
<div class="md-card-content"> |
|
252 |
<div class="uk-margin-top"> |
|
253 |
<div class="uk-float-right uk-margin-small-right"> |
|
254 |
<img src="../../../assets/img/icons/policies-icon.svg" width="36" height="40"> |
|
255 |
</div> |
|
256 |
<h3 class="uk-margin-remove"> |
|
257 |
<span *ngIf="europeOverviewData.policies?.oa" class="number">{{europeOverviewData.policies.oa | number}}</span> |
|
258 |
<span *ngIf="!europeOverviewData.policies || !europeOverviewData.policies.oa" class="number">--</span> |
|
259 |
</h3> |
|
253 | 260 |
</div> |
254 |
<h3 class="uk-margin-remove"> |
|
255 |
<span *ngIf="europeOverviewData.policies?.oa" class="number">{{europeOverviewData.policies.oa | number}}</span> |
|
256 |
<span *ngIf="!europeOverviewData.policies || !europeOverviewData.policies.oa" class="number">--</span> |
|
257 |
</h3> |
|
261 |
<div class="uk-margin-top"> |
|
262 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
|
263 |
<span class="">organizations with <i>OA policies</i></span> |
|
264 |
</div> |
|
265 |
<!--<div *ngIf="overviewData.overview.policies?.percentage" class="uk-margin-top">--> |
|
266 |
<!--<span class="number">{{overviewData.overview.policies.percentage | number}}%</span> are OA--> |
|
267 |
<!--</div>--> |
|
258 | 268 |
</div> |
259 |
<div class="uk-margin-top"> |
|
260 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
|
261 |
<span class="">organizations with <i>OA policies</i></span> |
|
262 |
</div> |
|
263 |
<!--<div *ngIf="overviewData.overview.policies?.percentage" class="uk-margin-top">--> |
|
264 |
<!--<span class="number">{{overviewData.overview.policies.percentage | number}}%</span> are OA--> |
|
265 |
<!--</div>--> |
|
266 | 269 |
</div> |
267 | 270 |
</div> |
268 | 271 |
</div> |
269 | 272 |
</div> |
270 | 273 |
</div> |
274 |
|
|
271 | 275 |
</div> |
276 |
</section> |
|
272 | 277 |
|
273 |
</div> |
|
274 |
</section> |
|
275 | 278 |
|
279 |
<!--OA IN EUROPE SECTION--> |
|
280 |
<section class="section greySection" id="sect-tabs"> |
|
281 |
<div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}"> |
|
276 | 282 |
|
277 |
<!--OA IN EUROPE SECTION--> |
|
278 |
<section class="section greySection" id="sect-tabs"> |
|
279 |
<div class="uk-container uk-container-expand uk-container-center uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-scale-up" data-uk-scrollspy="{cls:'uk-animation-scale-up uk-invisible',delay:300,topoffset:-100}"> |
|
283 |
<h3>OA in Europe</h3> |
|
280 | 284 |
|
281 |
<h3>OA in Europe</h3> |
|
285 |
<div class="dataContainer"> |
|
286 |
<div class="uk-margin tabContent"> |
|
287 |
<app-data-view></app-data-view> |
|
288 |
<!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>--> |
|
289 |
</div> |
|
290 |
</div> |
|
282 | 291 |
|
283 |
<div class="dataContainer"> |
|
284 |
<div class="uk-margin tabContent"> |
|
285 |
<app-data-view></app-data-view> |
|
286 |
<!--<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>--> |
|
292 |
</div> |
|
293 |
</section> |
|
294 |
</div> |
|
295 |
|
|
296 |
|
|
297 |
<!--MOBILE & PAD PORTRAIT--> |
|
298 |
<div class="uk-hidden@m"> |
|
299 |
|
|
300 |
<section class="section"> |
|
301 |
<div class="uk-container uk-container-expand uk-container-center "> |
|
302 |
|
|
303 |
<!--<div class="uk-margin-top">--> |
|
304 |
<!--<form class="uk-search uk-search-default searchForCountry">--> |
|
305 |
<!--<span uk-search-icon></span>--> |
|
306 |
<!--<input class="uk-search-input" type="search" placeholder="Search for a country...">--> |
|
307 |
<!--</form>--> |
|
308 |
<!--</div>--> |
|
309 |
|
|
310 |
<div class="uk-margin-top"> |
|
311 |
<div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry" data-uk-autocomplete="{source:'https://getuikit.com/v2/tests/components/_autocomplete.json'}"> |
|
312 |
<span uk-search-icon></span> |
|
313 |
<input class="uk-search-input" type="search" placeholder="Search for a country..."> |
|
314 |
<!--<input type="text">--> |
|
315 |
</div> |
|
287 | 316 |
</div> |
317 |
|
|
318 |
|
|
288 | 319 |
</div> |
320 |
</section> |
|
289 | 321 |
|
290 |
<!--<div class="">--> |
|
291 |
<!--<ul class="uk-tab uk-tab-large uk-flex-center" data-uk-tab="{connect:'#team_tabbed',animation: 'slide-bottom'}">--> |
|
292 |
<!--<li class="uk-active" aria-expanded="true"><a href="#">Overview</a></li>--> |
|
293 |
<!--<li aria-expanded="false"><a href="#">Open Science</a></li>--> |
|
294 |
<!--<li class="uk-disabled" aria-expanded="false"><a href="#" data-uk-tooltip="{title: Stay tuned..; pos: top-left}">Collaboration</a></li>--> |
|
295 |
<!--<li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Impact</a></li>--> |
|
296 |
<!--<li class="uk-disabled" aria-expanded="false" data-uk-tooltip="Stay tuned.."><a href="#">Innovation</a></li>--> |
|
297 |
<!--<!–<li class="uk-tab-responsive uk-active uk-hidden" aria-haspopup="true" aria-expanded="false"><a>Developers</a><div class="uk-dropdown uk-dropdown-small" aria-hidden="true"><ul class="uk-nav uk-nav-dropdown"></ul><div></div></div></li>–>--> |
|
298 |
<!--</ul>--> |
|
322 |
<section class="section"> |
|
323 |
<div class="uk-container uk-container-expand uk-container-center "> |
|
299 | 324 |
|
300 |
<!--<ul *ngIf="overviewData?.countries" id="team_tabbed" class="uk-switcher dataContainer">--> |
|
301 |
<!--<!–OVERVIEW tab–>--> |
|
302 |
<!--<li aria-hidden="false" class="uk-active" style="animation-duration: 200ms;">--> |
|
303 |
<!--<div class="uk-margin tabContent">--> |
|
304 |
<!--<app-data-view [type]="'overview'" [countries]="overviewData.countries"></app-data-view>--> |
|
305 |
<!--<!–<app-countries-table [isPercentage]="false" [type]="'overview'" [countries]="overviewData.countries"></app-countries-table>–>--> |
|
306 |
<!--</div>--> |
|
307 |
<!--</li>--> |
|
308 |
<!--<!–OPEN SCIENCE tab–>--> |
|
309 |
<!--<li aria-hidden="true" style="animation-duration: 200ms;">--> |
|
310 |
<!--<div class="uk-margin tabContent">--> |
|
311 |
<!--<app-data-view [type]="'openScience'" [countries]="overviewData.countries"></app-data-view>--> |
|
312 |
<!--<!–<app-countries-table [isPercentage]="false" [type]="'openScience'" [countries]="overviewData.countries"></app-countries-table>–>--> |
|
313 |
<!--</div>--> |
|
314 |
<!--</li>--> |
|
315 |
<!--<li aria-hidden="true">--> |
|
316 |
<!--<div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">--> |
|
317 |
<!--</div>--> |
|
318 |
<!--</li>--> |
|
319 |
<!--<li aria-hidden="true">--> |
|
320 |
<!--<div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">--> |
|
321 |
<!--</div>--> |
|
322 |
<!--</li>--> |
|
323 |
<!--<li aria-hidden="true">--> |
|
324 |
<!--<div class="uk-grid uk-grid-medium uk-grid-width-small-1-2 uk-grid-width-medium-1-3 uk-grid-width-large-1-4" data-uk-grid-margin="">--> |
|
325 |
<!--</div>--> |
|
326 |
<!--</li>--> |
|
327 |
<!--</ul>--> |
|
328 |
<!--</div>--> |
|
325 |
<h3>OA in Europe</h3> |
|
329 | 326 |
|
330 |
</div> |
|
331 |
</section> |
|
327 |
<div *ngIf="europeOverviewData" class="md-card chartCard overviewMobile"> |
|
328 |
<div class="md-card-content"> |
|
329 |
|
|
330 |
|
|
331 |
<div class="uk-grid uk-margin-top"> |
|
332 |
<div class="uk-width-1-5"> |
|
333 |
<img src="../../../assets/img/icons/publications-icon.svg" width="30" height="30"> |
|
334 |
</div> |
|
335 |
<div class="uk-width-2-5"> |
|
336 |
<div *ngIf="europeOverviewData.publications?.oa" class="number big">{{europeOverviewData.publications.oa | number}}</div> |
|
337 |
<div *ngIf="!europeOverviewData.publications || !europeOverviewData.publications.oa" class="number big">--</div> |
|
338 |
<div class="uk-margin-small-top">OA PUBLICATIONS</div> |
|
339 |
</div> |
|
340 |
<div *ngIf="europeOverviewData.publications?.percentage" class="uk-width-2-5"> |
|
341 |
<div class="progress"> |
|
342 |
<div [ngStyle]="{'width': europeOverviewData.publications.percentage+'%'}" class="progress-bar progress-bar-publications animate-progress-bar"></div> |
|
343 |
</div> |
|
344 |
<div class="uk-margin-small-top"> |
|
345 |
<span class="number">{{europeOverviewData.publications.percentage | number :'1.0-1'}}%</span> OA |
|
346 |
</div> |
|
347 |
</div> |
|
348 |
</div> |
|
349 |
|
|
350 |
<div class="uk-grid uk-margin-medium-top"> |
|
351 |
<div class="uk-width-1-5"> |
|
352 |
<img src="../../../assets/img/icons/datasets-icon.svg" width="30" height="30"> |
|
353 |
</div> |
|
354 |
<div class="uk-width-2-5"> |
|
355 |
<div *ngIf="europeOverviewData.datasets?.oa" class="number big">{{europeOverviewData.datasets.oa | number}}</div> |
|
356 |
<div *ngIf="!europeOverviewData.datasets || !europeOverviewData.datasets.oa" class="number big">--</div> |
|
357 |
<div class="uk-margin-small-top">OA DATASETS</div> |
|
358 |
</div> |
|
359 |
<div *ngIf="europeOverviewData.datasets?.percentage" class="uk-width-2-5"> |
|
360 |
<div class="progress"> |
|
361 |
<div [ngStyle]="{'width': europeOverviewData.datasets.percentage+'%'}" class="progress-bar progress-bar-datasets animate-progress-bar"></div> |
|
362 |
</div> |
|
363 |
<div class="uk-margin-small-top"> |
|
364 |
<span class="number">{{europeOverviewData.datasets.percentage | number :'1.0-1'}}%</span> OA |
|
365 |
</div> |
|
366 |
</div> |
|
367 |
</div> |
|
368 |
|
|
369 |
<div class="uk-grid uk-margin-medium-top"> |
|
370 |
<div class="uk-width-1-5"> |
|
371 |
<img src="../../../assets/img/icons/repositories-icon.svg" width="30" height="30"> |
|
372 |
</div> |
|
373 |
<div class="uk-width-2-5"> |
|
374 |
<div *ngIf="europeOverviewData.repositories?.oa" class="number big">{{europeOverviewData.repositories.oa | number}}</div> |
|
375 |
<div *ngIf="!europeOverviewData.repositories || !europeOverviewData.repositories.oa" class="number big">--</div> |
|
376 |
<div class="uk-margin-small-top">VALIDATED REPOSITORIES</div> |
|
377 |
</div> |
|
378 |
<div *ngIf="europeOverviewData.repositories?.percentage" class="uk-width-2-5"> |
|
379 |
<div class="progress"> |
|
380 |
<div [ngStyle]="{'width': europeOverviewData.repositories.percentage+'%'}" class="progress-bar progress-bar-repositories animate-progress-bar"></div> |
|
381 |
</div> |
|
382 |
<div class="uk-margin-small-top"> |
|
383 |
<span class="number">{{europeOverviewData.repositories.percentage | number :'1.0-1'}}%</span> VALIDATED |
|
384 |
</div> |
|
385 |
</div> |
|
386 |
</div> |
|
387 |
|
|
388 |
<div class="uk-grid uk-margin-medium-top"> |
|
389 |
<div class="uk-width-1-5"> |
|
390 |
<img src="../../../assets/img/icons/journals-icon.svg" width="30" height="30"> |
|
391 |
</div> |
|
392 |
<div class="uk-width-2-5"> |
|
393 |
<div *ngIf="europeOverviewData.journals?.oa" class="number big">{{europeOverviewData.journals.oa | number}}</div> |
|
394 |
<div *ngIf="!europeOverviewData.journals || !europeOverviewData.journals.oa" class="number big">--</div> |
|
395 |
<div class="uk-margin-small-top">VALIDATED JOURNALS</div> |
|
396 |
</div> |
|
397 |
<div *ngIf="europeOverviewData.journals?.percentage" class="uk-width-2-5"> |
|
398 |
<div class="progress"> |
|
399 |
<div [ngStyle]="{'width': europeOverviewData.journals.percentage+'%'}" class="progress-bar progress-bar-journals animate-progress-bar"></div> |
|
400 |
</div> |
|
401 |
<div class="uk-margin-small-top"> |
|
402 |
<span class="number">{{europeOverviewData.journals.percentage | number : '1.0-1'}}%</span> Validated |
|
403 |
</div> |
|
404 |
</div> |
|
405 |
</div> |
|
406 |
|
|
407 |
<div class="uk-grid uk-margin-medium-top uk-margin-bottom"> |
|
408 |
<div class="uk-width-1-5"> |
|
409 |
<img src="../../../assets/img/icons/policies-icon.svg" width="30" height="30"> |
|
410 |
</div> |
|
411 |
<div class="uk-width-2-5"> |
|
412 |
<div *ngIf="europeOverviewData.policies?.oa" class="number big">{{europeOverviewData.policies.oa | number}}</div> |
|
413 |
<div *ngIf="!europeOverviewData.policies || !europeOverviewData.policies.oa" class="number big">--</div> |
|
414 |
<div class="uk-margin-small-top">OA POLICIES</div> |
|
415 |
</div> |
|
416 |
<div class="uk-width-2-5"> |
|
417 |
|
|
418 |
</div> |
|
419 |
</div> |
|
420 |
|
|
421 |
</div> |
|
422 |
</div> |
|
423 |
|
|
424 |
</div> |
|
425 |
</section> |
|
426 |
|
|
427 |
<section class="section"> |
|
428 |
<div class="uk-container uk-container-expand uk-container-center "> |
|
429 |
|
|
430 |
<h3>Leading Open Science</h3> |
|
431 |
|
|
432 |
<div *ngIf="leadingOpenScienceData" class="uk-grid uk-grid-small uk-grid-match uk-child-width-1-2"> |
|
433 |
|
|
434 |
<div *ngFor="let data of leadingOpenScienceData" class="uk-margin-small-top"> |
|
435 |
<div class="md-card leadingOpenScienceCard"> |
|
436 |
<a [routerLink]="['/countryDashboard/' + data.code]" class="el-link uk-position-cover uk-margin-remove-adjacent"></a> |
|
437 |
<div class="md-card-content"> |
|
438 |
<div class="uk-flex"> |
|
439 |
<img src="../../../assets/img/flags/{{data.code | lowercase}}-flag.svg" width="15"> |
|
440 |
<span class="countryName uk-margin-small-left">{{data.name}}</span> |
|
441 |
</div> |
|
442 |
<div class="indicator uk-margin-top"> |
|
443 |
<!--<span class="number publications">18,165</span>--> |
|
444 |
<span class="number publications" *ngIf="data.publicationsAffiliated!=null">{{data.publicationsAffiliated | number}}</span> |
|
445 |
<span class="number publications" *ngIf="data.publicationsAffiliated===null">--</span> |
|
446 |
<span><i>OA publications</i> affiliated to an organization in the country</span> |
|
447 |
</div> |
|
448 |
<div class="indicator uk-margin-top"> |
|
449 |
<!--<span class="number publications">18,165</span>--> |
|
450 |
<span class="number publications" *ngIf="data.publicationsDeposited!=null">{{data.publicationsDeposited | number}}</span> |
|
451 |
<span class="number publications" *ngIf="data.publicationsDeposited===null">--</span> |
|
452 |
<span><i>OA publications</i> from institutional repositories</span> |
|
453 |
</div> |
|
454 |
</div> |
|
455 |
</div> |
|
456 |
</div> |
|
457 |
|
|
458 |
</div> |
|
459 |
|
|
460 |
</div> |
|
461 |
</section> |
|
462 |
|
|
463 |
<section class="section"> |
|
464 |
<div class="uk-container uk-container-expand uk-container-center "> |
|
465 |
<div class="goToDetailedViewLink"> |
|
466 |
<a class="" [routerLink]="['/overview/' + 'europe']">Detailed View of OA in Europe<i class="fas fa-arrow-right uk-margin-small-left"></i></a> |
|
467 |
</div> |
|
468 |
</div> |
|
469 |
</section> |
|
470 |
</div> |
|
471 |
|
|
472 |
|
|
473 |
|
Also available in: Unified diff
Working on the new version of the oso - almost done with tha mobile version of the pages