MaDgIK
/
usage-counts
13
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

[UsageCounts | Trunk]: Add mobilde rules

This commit is contained in:
k.triantafyllou 2020-11-30 11:02:20 +00:00
parent fb14b3e144
commit 5f409a74b1
9 changed files with 59 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/about/about.component.css
View File

@ -7,7 +7,6 @@
@media only screen and (max-width: 1199px) and (min-width: 960px) {
.about > div:first-child {
min-height: calc(50vh - 100px);
overflow: visible;
}
}

6
src/app/about/about.component.html
View File

@ -58,7 +58,7 @@
</div>
<div>
<h3 class="uk-text-bold portal-color">Architecture functionalities</h3>
<div class="uk-margin-large-left uk-margin-medium-top">
<div [class.uk-margin-large-left]="large" class="uk-margin-medium-top">
<ol class="light-blue">
<li>Constant tracking of views and downloads of open science content providers registered on OpenAIRE
PROVIDE.
@ -81,7 +81,7 @@
<span class="uk-text-normal portal-color">Push</span>
Usage Statistics Tracking Workflow
</h5>
<ul class="light-blue-circle uk-margin-medium-top uk-margin-medium-left">
<ul [class.uk-margin-medium-left]="large" class="light-blue-circle uk-margin-medium-top uk-margin-left">
<li>An institutional repository is registered in OpenAIRE.</li>
<li>Server side tracking: Plugins (Dspace) or patches (Eprints) using Matomo’s Web Analytics HTTP API.
</li>
@ -94,7 +94,7 @@
<h5 class="uk-text-primary uk-text-bold uk-width-2-3@m">
Collecting <span class="uk-text-normal portal-color">(Pull)</span> Consolidated Usage Statistics Reports
</h5>
<ul class="light-blue-circle uk-margin-medium-top uk-margin-medium-left">
<ul [class.uk-margin-medium-left]="large" class="light-blue-circle uk-margin-medium-top uk-margin-left">
<li>Gathering of consolidated statistics reports from aggregation services, such as IRUS-UK, using
protocols such as SUSHI-Lite.
</li>

13
src/app/about/about.component.ts
View File

@ -1,4 +1,4 @@
import {Component, OnInit} from '@angular/core';
import {Component, HostListener, OnInit} from '@angular/core';
import {faqs} from './faqs';
import {ActivatedRoute, Router} from '@angular/router';
import {Meta, Title} from '@angular/platform-browser';
@ -19,12 +19,23 @@ export class AboutComponent implements OnInit {
description = "UsageCounts service is an OpenAIRE service built after the development of the Usage Statistics Service within OpenAIRE. UsageCounts forms metrics of usage activity of Open Access Repositories categorizing the data retrieved by country, number of downloads, number of views, number of repositories and all derivative quantitative open metrics, in a comprehensive way for all stakeholders. Architecture. ";
title = "OpenAIRE - UsageCounts | About";
subs: Subscription[] = [];
large: boolean = false;
constructor(private route: ActivatedRoute,
private router: Router,
private _title: Title, private _piwikService: PiwikService,
private _meta: Meta, private seoService: SEOService) {
}
@HostListener('window:resize', ['$event'])
onResize(event) {
if(event.target.innerWidth > 959 && this.large === false) {
this.large = true;
} else if(event.target.innerWidth < 960 && this.large === true){
this.large = false;
}
}
ngOnInit() {
this._title.setTitle(this.title);
this._meta.updateTag({content: this.description}, "name='description'");

8
src/app/analytics/analytics.component.html
View File

@ -13,7 +13,7 @@
<h2 class="uk-margin-medium-bottom portal-color uk-text-bold">Track Countries Usage Activity</h2>
<div class="uk-container uk-text-bold">
<div class="uk-flex uk-flex-middle uk-flex-center uk-align-center uk-margin-medium-bottom">
<div class="uk-width-3-5">
<div class="uk-width-3-5@m">
<form [formGroup]="countryFb" (ngSubmit)="search()">
<input #input type="text" class="uk-width-1-1"
[class.uk-animation-slide-right-medium]="showSearch && !countryFb.get('country').value"
@ -41,11 +41,15 @@
</span>
</div>
</div>
<button [disabled]="loading" class="uk-width-1-6 uk-margin-medium-left search"
<button [disabled]="loading" class="uk-width-1-6@m uk-margin-medium-left uk-visible@m search"
(mousedown)="$event.preventDefault()" (click)="toggle()">
<img src="assets/usage-statistics-assets/analytics/search.svg">
<span class="uk-text-uppercase space">search</span>
</button>
<button [disabled]="loading" class="uk-width-1-5 uk-margin-small-left uk-hidden@m search"
(mousedown)="$event.preventDefault()" (click)="toggle()">
<img src="assets/usage-statistics-assets/analytics/search.svg">
</button>
</div>
<div class="uk-margin-medium-bottom">
<div class="uk-text-uppercase">{{(country) ? country : 'worldwide'}}</div>

12
src/app/home/home.component.html
View File

@ -14,7 +14,7 @@
</div>
<a routerLink="/about" class="uk-button uk-button-primary">Learn More</a>
</div>
<div class="uk-hidden@m uk-flex uk-flex-center uk-width-1-1">
<div class="uk-hidden@m uk-flex uk-flex-center uk-width-1-1 uk-margin-medium-top">
<img src="assets/usage-statistics-assets/home/1-static.svg"/>
</div>
</div>
@ -107,7 +107,7 @@
<ng-template #fourth>
<div class="uk-container">
<div class="uk-grid uk-grid-large uk-flex uk-flex-middle uk-flex-center" uk-grid>
<div class="uk-width-expand@m uk-width-1-2 uk-flex uk-flex-right uk-flex-last@m">
<div class="uk-width-expand@m uk-flex uk-flex-right uk-flex-last@m">
<div class="features uk-width-4-5 uk-margin-auto">
<h1 class="uk-text-bold portal-color">Features</h1>
</div>
@ -146,16 +146,16 @@
</slide>
</fp-slider>
<div class="uk-hidden@l uk-margin-left uk-margin-right">
<div class="uk-section uk-section-large">
<div class="uk-section">
<ng-container *ngTemplateOutlet="first; context: {small: true}"></ng-container>
</div>
<div class="uk-section uk-section-large">
<div class="uk-section">
<ng-container *ngTemplateOutlet="second"></ng-container>
</div>
<div class="uk-section uk-section-large">
<div class="uk-section">
<ng-container *ngTemplateOutlet="third"></ng-container>
</div>
<div class="uk-section uk-section-large">
<div class="uk-section">
<ng-container *ngTemplateOutlet="fourth"></ng-container>
</div>
</div>

9
src/app/resources/resources.component.css
View File

@ -50,6 +50,13 @@
fill: var(--portal-dark-color);
}
@media only screen and (min-width: 960px) {
.provide-definition {
margin-left: 20px;
width: 85%;
}
}
.provide-definition {
padding: 20px;
background: #E7F0FA 0 0 no-repeat padding-box;
@ -57,6 +64,4 @@
border-radius: 5px;
font-style: italic;
font-size: 14px;
margin-left: 20px;
width: 85%;
}

14
src/app/resources/resources.component.html
View File

@ -7,7 +7,7 @@
<div class="uk-container uk-section uk-section-small uk-padding-remove-bottom">
<div class="uk-padding-small uk-padding-remove-vertical">
<h2 class="uk-margin-remove-vertical uk-text-bold">OpenAIRE <span class="provide-color">PROVIDE</span></h2>
<div class="uk-padding uk-width-3-4@l">
<div [class.uk-padding]="large" class="uk-width-3-4@l">
<p>
The <span class="uk-text-bold">resources</span> of the OpenAIRE UsageCounts Service are
available through the OpenAIRE PROVIDE product, which is serving the content providers.
@ -50,10 +50,10 @@
<div id="apis" class="uk-container uk-section">
<div class="uk-padding-small uk-padding-remove-vertical">
<div class="uk-flex uk-flex-middle">
<img src="assets/usage-statistics-assets/resources/2.svg">
<h2 class="uk-text-bold uk-margin-medium-left uk-margin-remove-vertical">APIs and Reports</h2>
<img class="uk-visible@m" src="assets/usage-statistics-assets/resources/2.svg">
<h2 [class.uk-margin-medium-left]="large" class="uk-text-bold uk-margin-remove-vertical">APIs and Reports</h2>
</div>
<div class="uk-padding uk-margin-top uk-width-3-4@l">
<div [class.uk-padding]="large" class="uk-margin-top uk-width-3-4@l">
<p>
A variety of reports generated via OpenAIRE UsageCounts Service are available via a SUSHI-Lite Endpoint. The
reports comply with
@ -103,10 +103,10 @@
<div class="uk-container uk-section">
<div class="uk-padding-small uk-padding-remove-vertical">
<div class="uk-flex uk-flex-top">
<img src="assets/usage-statistics-assets/resources/3.svg">
<div class="uk-margin-medium-left">
<img class="uk-visible@m" src="assets/usage-statistics-assets/resources/3.svg">
<div [class.uk-margin-medium-left]="large">
<h2 class="uk-text-bold">OpenAIRE UsageCounts Guidelines</h2>
<div class="uk-padding uk-padding-remove-vertical uk-margin-top">
<div [class.uk-padding]="large" class="uk-padding-remove-vertical uk-margin-top">
<div class="uk-margin-small-bottom">Please read carefully the OpenAIRE usage statistics guidelines before
submitting content.
</div>

13
src/app/resources/resources.component.ts
View File

@ -1,4 +1,4 @@
import { Component, OnInit} from '@angular/core';
import {Component, HostListener, OnInit} from '@angular/core';
import {Meta, Title} from '@angular/platform-browser';
import {ActivatedRoute, Router} from '@angular/router';
import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties';
@ -17,12 +17,23 @@ export class ResourcesComponent implements OnInit {
description = "OpenAIRE Provide. The resources of the OpenAIRE UsageCounts Service are available through the OpenAIRE PROVIDE product, which is serving the content providers. APIs and Reports.";
title = "OpenAIRE - UsageCounts | Resources";
subs: Subscription[] = [];
large: boolean = false;
constructor(private router: Router,
private _title: Title, private _piwikService: PiwikService,
private _meta: Meta, private seoService: SEOService,
private route: ActivatedRoute) {
}
@HostListener('window:resize', ['$event'])
onResize(event) {
if(event.target.innerWidth > 959 && this.large === false) {
this.large = true;
} else if(event.target.innerWidth < 960 && this.large === true){
this.large = false;
}
}
ngOnInit() {
this._title.setTitle(this.title);
this._meta.updateTag({content: this.description}, "name='description'");

6
src/styles.css
View File

@ -133,6 +133,12 @@ ul.portal-circle {
padding-left: 40px;
}
@media only screen and (max-width: 959px) {
ul.portal-circle {
padding-left: 20px;
}
}
ul.portal-circle li {
margin: 0 0 20px 0;
position: relative;