Revision 57732
Added by Stefania Martziou over 4 years ago
| home.component.html | ||
|---|---|---|
| 4 | 4 |
|
| 5 | 5 |
<div class="uk-grid uk-grid-small uk-margin-bottom uk-grid-match" uk-height-viewport="offset-bottom: 25"> |
| 6 | 6 |
|
| 7 |
<div class="uk-width-large-4-5 uk-width-medium-3-4">
|
|
| 7 |
<div class="uk-width-4-5">
|
|
| 8 | 8 |
|
| 9 | 9 |
<!--Map Container--> |
| 10 | 10 |
<app-map-overview *ngIf="overviewData?.countries" (emitSelectedCountry)="countrySelected($event)"></app-map-overview> |
| ... | ... | |
| 13 | 13 |
|
| 14 | 14 |
</div> |
| 15 | 15 |
|
| 16 |
<div class="uk-width-large-1-5 uk-width-medium-1-4">
|
|
| 16 |
<div class="uk-width-1-5">
|
|
| 17 | 17 |
<div class="md-card dark-blue-box infoBox"> |
| 18 | 18 |
<div *ngIf="!countrySelectedName" class="md-card-content"> |
| 19 | 19 |
<h3 class="uk-text-center">OPENAIRE MONITOR OBSERVATORY</h3> |
| ... | ... | |
| 40 | 40 |
<h3 class="uk-text-center"><a class="backToOriginalInfoBox uk-float-left" (click)="deselectCountry()"><i class="fas fa-angle-left"></i></a>{{countrySelectedName | uppercase}}</h3>
|
| 41 | 41 |
<div class="numbers"> |
| 42 | 42 |
<div class="uk-margin-medium-top"> |
| 43 |
<div class="number">18,165</div> |
|
| 43 |
<div class="number"> |
|
| 44 |
<ng-container *ngIf="countrySelectedOverview.repositories?.oa !=null">{{countrySelectedOverview.repositories.oa | number}}</ng-container>
|
|
| 45 |
<ng-container *ngIf="countrySelectedOverview.repositories===null || countrySelectedOverview.repositories.oa===null">--</ng-container> |
|
| 46 |
</div> |
|
| 47 |
<div class="uk-margin-top">number of OA repositories</div> |
|
| 48 |
</div> |
|
| 49 |
<div class="uk-margin-medium-top"> |
|
| 50 |
<div class="number"> |
|
| 51 |
<ng-container *ngIf="countrySelectedOverview.journals?.oa !=null">{{countrySelectedOverview.journals.oa | number}}</ng-container>
|
|
| 52 |
<ng-container *ngIf="countrySelectedOverview.journals===null || countrySelectedOverview.journals.oa===null">--</ng-container> |
|
| 53 |
</div> |
|
| 44 | 54 |
<div class="uk-margin-top">number of OA journals</div> |
| 45 | 55 |
</div> |
| 46 | 56 |
<div class="uk-margin-medium-top"> |
| 47 |
<div class="number">327</div> |
|
| 48 |
<div class="uk-margin-top">number of providers</div> |
|
| 57 |
<div class="number"> |
|
| 58 |
<ng-container *ngIf="countrySelectedOverview.policies?.oa !=null">{{countrySelectedOverview.policies.oa | number}}</ng-container>
|
|
| 59 |
<ng-container *ngIf="countrySelectedOverview.policies===null || countrySelectedOverview.policies.oa===null">--</ng-container> |
|
| 60 |
</div> |
|
| 61 |
<div class="uk-margin-top">number of organizations with OA policies</div> |
|
| 49 | 62 |
</div> |
| 50 | 63 |
</div> |
| 51 | 64 |
<hr class="greyBoldDivider uk-margin-medium-top uk-margin-medium-bottom"> |
| 52 | 65 |
<div class="graphs"> |
| 53 | 66 |
<div class="uk-grid"> |
| 54 | 67 |
<div class="uk-width-1-2"> |
| 55 |
<div class="epc_chart" data-percent="65" data-bar-color="#009688"> |
|
| 56 |
<span class="epc_chart_text"><span class="countUpMe">65</span>%</span> |
|
| 57 |
<canvas height="220" width="220" style="height: 110px; width: 110px;"></canvas> |
|
| 58 |
</div> |
|
| 59 |
<div class="uk-text-center">Open Licences</div> |
|
| 68 |
<ng-container *ngIf="countrySelectedOverview.publications?.percentage !=null"> |
|
| 69 |
<app-gauge-chart [chartData]="countrySelectedOverview.publications.percentage" [color]="'#5086BA'"></app-gauge-chart> |
|
| 70 |
</ng-container> |
|
| 71 |
<ng-container *ngIf="countrySelectedOverview.publications===null || countrySelectedOverview.publications.percentage===null"> |
|
| 72 |
<app-gauge-chart [chartData]="0" [color]="'#5086BA'"></app-gauge-chart> |
|
| 73 |
</ng-container> |
|
| 74 |
<!--<div class="epc_chart" data-percent="65" data-bar-color="#009688">--> |
|
| 75 |
<!--<span class="epc_chart_text"><span class="countUpMe">65</span>%</span>--> |
|
| 76 |
<!--<canvas height="220" width="220" style="height: 110px; width: 110px;"></canvas>--> |
|
| 77 |
<!--</div>--> |
|
| 78 |
<div class="uk-text-center">OA publications</div> |
|
| 60 | 79 |
</div> |
| 61 | 80 |
<div class="uk-width-1-2"> |
| 62 |
<div class="epc_chart" data-percent="43" data-bar-color="#009688"> |
|
| 63 |
<span class="epc_chart_text"><span class="countUpMe">43</span>%</span> |
|
| 64 |
<canvas height="220" width="220" style="height: 110px; width: 110px;"></canvas> |
|
| 65 |
</div> |
|
| 66 |
<div class="uk-text-center">Restricted</div> |
|
| 81 |
<ng-container *ngIf="countrySelectedOverview.datasets?.percentage !=null"> |
|
| 82 |
<app-gauge-chart [chartData]="countrySelectedOverview.datasets.percentage" [color]="'#44653D'"></app-gauge-chart> |
|
| 83 |
</ng-container> |
|
| 84 |
<ng-container *ngIf="countrySelectedOverview.datasets===null || countrySelectedOverview.datasets.percentage===null"> |
|
| 85 |
<app-gauge-chart [chartData]="0" [color]="'#44653D'"></app-gauge-chart> |
|
| 86 |
</ng-container> |
|
| 87 |
<!--<div class="epc_chart" data-percent="43" data-bar-color="#009688">--> |
|
| 88 |
<!--<span class="epc_chart_text"><span class="countUpMe">43</span>%</span>--> |
|
| 89 |
<!--<canvas height="220" width="220" style="height: 110px; width: 110px;"></canvas>--> |
|
| 90 |
<!--</div>--> |
|
| 91 |
<div class="uk-text-center">OA datasets</div> |
|
| 67 | 92 |
</div> |
| 68 | 93 |
</div> |
| 69 | 94 |
</div> |
| ... | ... | |
| 154 | 179 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
| 155 | 180 |
<span class="">Number of OA repositories</span> |
| 156 | 181 |
</div> |
| 157 |
<div *ngIf="overviewData.overview.repositories?.percentage" class="uk-margin-top">
|
|
| 158 |
<span class="number">{{overviewData.overview.repositories.percentage | number}}%</span> are OA
|
|
| 159 |
</div>
|
|
| 182 |
<!--<div *ngIf="overviewData.overview.repositories?.percentage" class="uk-margin-top">-->
|
|
| 183 |
<!--<span class="number">{{overviewData.overview.repositories.percentage | number}}%</span> are OA-->
|
|
| 184 |
<!--</div>-->
|
|
| 160 | 185 |
</div> |
| 161 | 186 |
</div> |
| 162 | 187 |
</div> |
| ... | ... | |
| 177 | 202 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
| 178 | 203 |
<span class="">Number of OA journals</span> |
| 179 | 204 |
</div> |
| 180 |
<div *ngIf="overviewData.overview.journals?.percentage" class="uk-margin-top">
|
|
| 181 |
<span class="number">{{overviewData.overview.journals.percentage | number}}%</span> are OA
|
|
| 182 |
</div>
|
|
| 205 |
<!--<div *ngIf="overviewData.overview.journals?.percentage" class="uk-margin-top">-->
|
|
| 206 |
<!--<span class="number">{{overviewData.overview.journals.percentage | number}}%</span> are OA-->
|
|
| 207 |
<!--</div>-->
|
|
| 183 | 208 |
</div> |
| 184 | 209 |
</div> |
| 185 | 210 |
</div> |
| ... | ... | |
| 198 | 223 |
</div> |
| 199 | 224 |
<div class="uk-margin-top"> |
| 200 | 225 |
<!--<span class="uk-text-muted uk-text-small">Number of OA publications</span>--> |
| 201 |
<span class="">Number of OA policies</span> |
|
| 226 |
<span class="">Number of organizations with OA policies</span>
|
|
| 202 | 227 |
</div> |
| 203 |
<div *ngIf="overviewData.overview.policies?.percentage" class="uk-margin-top">
|
|
| 204 |
<span class="number">{{overviewData.overview.policies.percentage | number}}%</span> are OA
|
|
| 205 |
</div>
|
|
| 228 |
<!--<div *ngIf="overviewData.overview.policies?.percentage" class="uk-margin-top">-->
|
|
| 229 |
<!--<span class="number">{{overviewData.overview.policies.percentage | number}}%</span> are OA-->
|
|
| 230 |
<!--</div>-->
|
|
| 206 | 231 |
</div> |
| 207 | 232 |
</div> |
| 208 | 233 |
</div> |
Also available in: Unified diff
Functionality for the country box in the home page