Revision 52836
Added by Myrto Koukouli about 6 years ago
| modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg-metrics.component.ts | ||
|---|---|---|
| 35 | 35 |
getPiwiks() {
|
| 36 | 36 |
this.loadingMessage = loadingReposMessage; |
| 37 | 37 |
this.piwikService.getPiwikSitesForRepos() |
| 38 |
.subscribe( |
|
| 39 |
piwiks => this.piwiks = piwiks.sort( function(a,b){
|
|
| 40 |
if(a.repositoryName<b.repositoryName){
|
|
| 38 |
.subscribe (
|
|
| 39 |
piwiks => this.piwiks = piwiks.sort( function(a,b) {
|
|
| 40 |
if (a.repositoryName<b.repositoryName) {
|
|
| 41 | 41 |
return -1; |
| 42 |
} else if(a.repositoryName>b.repositoryName){
|
|
| 42 |
} else if (a.repositoryName>b.repositoryName) {
|
|
| 43 | 43 |
return 1; |
| 44 | 44 |
} else {
|
| 45 | 45 |
return 0; |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-update.component.html | ||
|---|---|---|
| 27 | 27 |
<h2 class="openAIRECompliantLogoMessage"> |
| 28 | 28 |
Congratulations! Your repository was successfully registered in OpenAIRE. You can download this logo to use in your site. |
| 29 | 29 |
</h2> |
| 30 |
<img src="assets/imgs/3_0ValidatedLogo.png" alt="OpenAireCompliant">
|
|
| 30 |
<img src="assets/imgs/OpenAIRE_validated_icon_medium.png" alt="OpenAireCompliant">
|
|
| 31 | 31 |
</div> |
| 32 | 32 |
</div> |
| 33 | 33 |
<a (click)="downloadLogo()"> |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-update.component.ts | ||
|---|---|---|
| 12 | 12 |
ngOnInit() {}
|
| 13 | 13 |
|
| 14 | 14 |
downloadLogo() {
|
| 15 |
window.open("../../../assets/imgs/3_0ValidatedLogo.png","_blank", "enabledstatus=0,toolbar=0,menubar=0,location=0");
|
|
| 15 |
window.open("../../../assets/imgs/OpenAIRE_validated_icon_medium.png","_blank", "enabledstatus=0,toolbar=0,menubar=0,location=0");
|
|
| 16 | 16 |
} |
| 17 | 17 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/app.module.ts | ||
|---|---|---|
| 24 | 24 |
import { PiwikService } from './services/piwik.service';
|
| 25 | 25 |
import { BrokerService } from './services/broker.service';
|
| 26 | 26 |
import { MonitorService } from './services/monitor.service';
|
| 27 |
import {LandingComponent} from "./pages/landing/landing.component";
|
|
| 28 |
import {DashboardComponent} from "./pages/dashboard/dashboard.component";
|
|
| 27 |
import { LandingComponent } from "./pages/landing/landing.component";
|
|
| 28 |
import { DashboardComponent } from "./pages/dashboard/dashboard.component";
|
|
| 29 | 29 |
import { UsagestatsService } from './services/usagestats.service';
|
| 30 |
import {AuthenticationInterceptor} from "./services/authentication-interceptor";
|
|
| 31 |
import {HTTP_INTERCEPTORS, HttpClientModule} from "@angular/common/http";
|
|
| 30 |
import { AuthenticationInterceptor } from "./services/authentication-interceptor";
|
|
| 31 |
import { HTTP_INTERCEPTORS, HttpClientModule } from "@angular/common/http";
|
|
| 32 |
import { CookieLawModule } from "./shared/reusablecomponents/cookie-law/cookie-law.module";
|
|
| 33 |
import { NoopAnimationsModule } from "@angular/platform-browser/animations";
|
|
| 32 | 34 |
|
| 33 | 35 |
|
| 34 | 36 |
@NgModule({
|
| 35 | 37 |
imports: [ |
| 36 | 38 |
BrowserModule, |
| 39 |
NoopAnimationsModule, |
|
| 37 | 40 |
FormsModule, |
| 38 | 41 |
ReactiveFormsModule, |
| 39 | 42 |
HttpModule, |
| ... | ... | |
| 47 | 50 |
SourcesModule, |
| 48 | 51 |
CompatibilityModule, |
| 49 | 52 |
ContentModule, |
| 50 |
AdminPgModule |
|
| 53 |
AdminPgModule, |
|
| 54 |
CookieLawModule |
|
| 51 | 55 |
], |
| 52 | 56 |
declarations: [ |
| 53 | 57 |
AppComponent, |
| modules/uoa-repository-dashboard-gui/trunk/package.json | ||
|---|---|---|
| 23 | 23 |
"@angular/platform-browser-dynamic": "~4.4.3", |
| 24 | 24 |
"@angular/router": "~4.4.3", |
| 25 | 25 |
"@angular/upgrade": "~4.4.3", |
| 26 |
"@angular/animations": "^4.2.4", |
|
| 26 | 27 |
"angular-in-memory-web-api": "~0.3.2", |
| 27 | 28 |
"angular-oauth2-oidc": "^1.0.20", |
| 28 | 29 |
"bootstrap": "^3.3.7", |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-update-repo.component.ts | ||
|---|---|---|
| 3 | 3 |
import { DatasourceInterfaceFormComponent } from './sources-forms/datasource-interface-form.component';
|
| 4 | 4 |
import { Repository, RepositoryInterface } from '../../domain/typeScriptClasses';
|
| 5 | 5 |
import { RepositoryService } from '../../services/repository.service';
|
| 6 |
import { ActivatedRoute } from '@angular/router';
|
|
| 6 |
import {ActivatedRoute, Router} from '@angular/router';
|
|
| 7 | 7 |
import {
|
| 8 | 8 |
Description, |
| 9 | 9 |
interfaceFormDesc, |
| ... | ... | |
| 11 | 11 |
import { formInfoLoading, loadingRepoError } from '../../domain/shared-messages';
|
| 12 | 12 |
import { DatasourceUpdateFormComponent } from './sources-forms/datasource-update-form.component';
|
| 13 | 13 |
import {ConfirmationDialogComponent} from "../../shared/reusablecomponents/confirmation-dialog.component";
|
| 14 |
import {AuthenticationService} from "../../services/authentication.service";
|
|
| 14 | 15 |
|
| 15 | 16 |
|
| 16 | 17 |
|
| ... | ... | |
| 41 | 42 |
constructor ( |
| 42 | 43 |
private fb: FormBuilder, |
| 43 | 44 |
private repoService: RepositoryService, |
| 44 |
private route: ActivatedRoute ) |
|
| 45 |
private authService: AuthenticationService, |
|
| 46 |
private route: ActivatedRoute, |
|
| 47 |
private router: Router) |
|
| 45 | 48 |
{}
|
| 46 | 49 |
|
| 47 | 50 |
|
| ... | ... | |
| 71 | 74 |
() => {
|
| 72 | 75 |
this.loadingMessage = ''; |
| 73 | 76 |
this.logoURL = this.repo.logoUrl; |
| 77 |
if ( this.authService.getUserEmail() !== this.repo.registeredBy ) {
|
|
| 78 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 79 |
} |
|
| 74 | 80 |
} |
| 75 | 81 |
); |
| 76 | 82 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.module.ts | ||
|---|---|---|
| 12 | 12 |
import { TabsModule } from 'ngx-bootstrap';
|
| 13 | 13 |
import {MetricsUsagestatsComponent} from "./metrics-usagestats.component";
|
| 14 | 14 |
import { MetricsUsagestatsReportResultsComponent } from './metrics-usagestats-report-results.component';
|
| 15 |
import {MetricsUsagestatsReportComponent} from "./metrics-usagestats-report.component";
|
|
| 15 | 16 |
|
| 16 | 17 |
@NgModule ({
|
| 17 | 18 |
imports: [ |
| ... | ... | |
| 26 | 27 |
MetricsInstructionsComponent, |
| 27 | 28 |
MetricsShowComponent, |
| 28 | 29 |
MetricsUsagestatsComponent, |
| 30 |
MetricsUsagestatsReportComponent, |
|
| 29 | 31 |
MetricsUsagestatsReportResultsComponent |
| 30 | 32 |
] |
| 31 | 33 |
}) |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-enable.component.ts | ||
|---|---|---|
| 62 | 62 |
this.getOAid(); |
| 63 | 63 |
} |
| 64 | 64 |
this.loadingMessage = ''; |
| 65 |
if ( this.authService.getUserEmail() !== this.repo.registeredBy ) {
|
|
| 66 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 67 |
} |
|
| 65 | 68 |
} |
| 66 | 69 |
); |
| 67 | 70 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.routing.ts | ||
|---|---|---|
| 10 | 10 |
import { MetricsShowComponent } from './metrics-show.component';
|
| 11 | 11 |
import {MetricsUsagestatsComponent} from "./metrics-usagestats.component";
|
| 12 | 12 |
import { MetricsUsagestatsReportResultsComponent } from './metrics-usagestats-report-results.component';
|
| 13 |
import {MetricsUsagestatsReportComponent} from "./metrics-usagestats-report.component";
|
|
| 13 | 14 |
|
| 14 | 15 |
const metricsRoutes: Routes = [ |
| 15 | 16 |
{
|
| ... | ... | |
| 33 | 34 |
component: MetricsUsagestatsComponent |
| 34 | 35 |
}, |
| 35 | 36 |
{
|
| 37 |
path: 'usagestats/:id/:reportID', |
|
| 38 |
component: MetricsUsagestatsReportComponent |
|
| 39 |
}, |
|
| 40 |
{
|
|
| 36 | 41 |
path: 'usagestats-report-results', |
| 37 | 42 |
component: MetricsUsagestatsReportResultsComponent |
| 38 | 43 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-usagestats-report.component.ts | ||
|---|---|---|
| 1 |
import {Component, OnInit} from "@angular/core";
|
|
| 2 |
import {RepositoryService} from "../../services/repository.service";
|
|
| 3 |
import {ActivatedRoute, Router} from "@angular/router";
|
|
| 4 |
import {AuthenticationService} from "../../services/authentication.service";
|
|
| 5 |
import {Repository} from "../../domain/typeScriptClasses";
|
|
| 6 |
import {Observable} from "rxjs/Observable";
|
|
| 7 |
import {ReportResponseWrapper} from "../../domain/usageStatsClasses";
|
|
| 8 |
import {loadingRepoMessage} from "../../domain/shared-messages";
|
|
| 9 |
|
|
| 10 |
|
|
| 11 |
@Component({
|
|
| 12 |
selector: 'metrics-usagestats-report', |
|
| 13 |
templateUrl: 'metrics-usagestats-report.component.html' |
|
| 14 |
}) |
|
| 15 |
|
|
| 16 |
export class MetricsUsagestatsReportComponent implements OnInit {
|
|
| 17 |
|
|
| 18 |
errorMessage: string; |
|
| 19 |
loadingMessage: string; |
|
| 20 |
title: string; |
|
| 21 |
|
|
| 22 |
repo: Repository; |
|
| 23 |
repoId: string; |
|
| 24 |
shownRepoId: string; |
|
| 25 |
shownOpenaireId: string; |
|
| 26 |
issnToShow: string = ''; |
|
| 27 |
chosen_report: string; |
|
| 28 |
|
|
| 29 |
userEmail: string; |
|
| 30 |
beginDate: string = ''; |
|
| 31 |
endDate: string = ''; |
|
| 32 |
itemIdentifier: string = ''; |
|
| 33 |
itemDataType: string = ''; |
|
| 34 |
granularity: string = 'Monthly'; |
|
| 35 |
pretty: boolean = true; |
|
| 36 |
|
|
| 37 |
constructor(private repoService: RepositoryService, |
|
| 38 |
private route: ActivatedRoute, |
|
| 39 |
private router: Router, |
|
| 40 |
private authService: AuthenticationService) {}
|
|
| 41 |
|
|
| 42 |
ngOnInit() {
|
|
| 43 |
this.getParams(); |
|
| 44 |
this.getUserEmail(); |
|
| 45 |
this.getRepo(); |
|
| 46 |
} |
|
| 47 |
|
|
| 48 |
getParams() {
|
|
| 49 |
this.repoId = this.route.snapshot.paramMap.get('id');
|
|
| 50 |
this.chosen_report = this.route.snapshot.paramMap.get('reportID');
|
|
| 51 |
this.shownRepoId = this.convertToDisplayedFormat(this.repoId); |
|
| 52 |
console.log(`shownRepoId is ${this.repoId}`);
|
|
| 53 |
this.title = `${this.chosen_report} report`;
|
|
| 54 |
} |
|
| 55 |
|
|
| 56 |
convertToDisplayedFormat(input: string) {
|
|
| 57 |
const tempArray = this.repoId.split('____::');
|
|
| 58 |
return tempArray[0] + ':' + tempArray[1]; |
|
| 59 |
} |
|
| 60 |
|
|
| 61 |
getUserEmail() {
|
|
| 62 |
this.userEmail = this.authService.getUserEmail(); |
|
| 63 |
} |
|
| 64 |
|
|
| 65 |
getRepo() {
|
|
| 66 |
this.loadingMessage = loadingRepoMessage; |
|
| 67 |
this.repoService.getRepositoryById(this.repoId).subscribe( |
|
| 68 |
repo => this.repo = repo, |
|
| 69 |
error => {
|
|
| 70 |
console.log(error); |
|
| 71 |
this.loadingMessage = ''; |
|
| 72 |
this.errorMessage = 'The repository could not be retrieved'; |
|
| 73 |
}, |
|
| 74 |
() => {
|
|
| 75 |
this.loadingMessage = ''; |
|
| 76 |
if (this.repo.piwikInfo) {
|
|
| 77 |
this.shownOpenaireId = this.convertToDisplayedFormat(this.repo.piwikInfo.openaireId); |
|
| 78 |
} |
|
| 79 |
if (this.repo.issn){
|
|
| 80 |
this.issnToShow = this.repo.issn.slice(0, 4)+ '-' + this.repo.issn.toString().slice(4); |
|
| 81 |
} |
|
| 82 |
this.title = `${this.chosen_report} report for ${this.repo.officialName}`;
|
|
| 83 |
if ( this.authService.getUserEmail() !== this.repo.registeredBy ) {
|
|
| 84 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 85 |
} |
|
| 86 |
} |
|
| 87 |
); |
|
| 88 |
} |
|
| 89 |
|
|
| 90 |
updateBeginDate(event: any) {
|
|
| 91 |
this.beginDate = event.target.value; |
|
| 92 |
} |
|
| 93 |
|
|
| 94 |
updateEndDate(event: any) {
|
|
| 95 |
this.endDate = event.target.value; |
|
| 96 |
} |
|
| 97 |
|
|
| 98 |
updateItemDataType(event: any) {
|
|
| 99 |
this.itemDataType = event.target.value; |
|
| 100 |
} |
|
| 101 |
|
|
| 102 |
updateItemIdentifier(event: any) {
|
|
| 103 |
this.itemIdentifier = event.target.value; |
|
| 104 |
} |
|
| 105 |
|
|
| 106 |
updateGranularity(event: any) {
|
|
| 107 |
this.granularity = event.target.value; |
|
| 108 |
} |
|
| 109 |
|
|
| 110 |
updatePretty(event: any) {
|
|
| 111 |
this.pretty = !this.pretty; |
|
| 112 |
} |
|
| 113 |
|
|
| 114 |
goToReport() {
|
|
| 115 |
/* additional field: */ |
|
| 116 |
/*itemIdentifier: this.repo.piwikInfo.openaireId,*/ |
|
| 117 |
/*this.router.navigate([`/getImpact/${this.repoId}/${this.chosen_report}/results'], {
|
|
| 118 |
queryParams: {
|
|
| 119 |
report: this.chosen_report, |
|
| 120 |
beginDate: this.beginDate, |
|
| 121 |
endDate: this.endDate, |
|
| 122 |
repoId: this.shownRepoId, |
|
| 123 |
itemDataType: this.itemDataType, |
|
| 124 |
itemIdentifier: this.itemIdentifier, |
|
| 125 |
granularity: this.granularity, |
|
| 126 |
pretty: this.pretty |
|
| 127 |
} |
|
| 128 |
});*/ |
|
| 129 |
|
|
| 130 |
const params = new URLSearchParams(); |
|
| 131 |
|
|
| 132 |
params.append('Report', this.chosen_report);
|
|
| 133 |
params.append('Release', '4');
|
|
| 134 |
params.append('RequestorID', this.authService.getUserEmail());
|
|
| 135 |
params.append('BeginDate', this.beginDate);
|
|
| 136 |
params.append('EndDate', this.endDate);
|
|
| 137 |
params.append('RepositoryIdentifier', this.shownRepoId);
|
|
| 138 |
if (this.itemIdentifier) {
|
|
| 139 |
params.append('ItemIdentifier', this.itemIdentifier);
|
|
| 140 |
} |
|
| 141 |
if (this.itemDataType) {
|
|
| 142 |
params.append('ItemDataType', this.itemDataType);
|
|
| 143 |
} |
|
| 144 |
params.append('Granularity', this.granularity);
|
|
| 145 |
if (this.pretty && this.pretty === true) {
|
|
| 146 |
params.append('Pretty', 'Pretty');
|
|
| 147 |
} |
|
| 148 |
|
|
| 149 |
let url = `http://beta.services.openaire.eu/usagestats/sushilite/GetReport/?${params}`;
|
|
| 150 |
console.log(`going to: ${url}`);
|
|
| 151 |
|
|
| 152 |
window.location.href = url; |
|
| 153 |
} |
|
| 154 |
|
|
| 155 |
} |
|
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-usagestats.component.html | ||
|---|---|---|
| 7 | 7 |
<div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid=""> |
| 8 | 8 |
<div class="uk-width-1-1@m uk-first-column"> |
| 9 | 9 |
|
| 10 |
<h1 class="uk-h2">Get usage statistics report</h1>
|
|
| 10 |
<h1 class="uk-h2">{{ title }}</h1>
|
|
| 11 | 11 |
|
| 12 | 12 |
<!-- TOP HELP CONTENT --> |
| 13 | 13 |
<help-content #topHelperContent [position]="'top'" |
| ... | ... | |
| 25 | 25 |
<!-- MIDDLE --> |
| 26 | 26 |
<div class=" uk-width-expand@m" style="min-height:500px;"> |
| 27 | 27 |
|
| 28 |
<div *ngIf="errorMessage" class="uk-alert uk-alert-warning">{{errorMessage}}</div>
|
|
| 28 |
<div *ngIf="errorMessage" class="uk-alert uk-alert-warning">{{ errorMessage }}</div>
|
|
| 29 | 29 |
<div *ngIf="repo"> |
| 30 |
<label class="control-label">Supported Reports</label> |
|
| 31 |
<select class="form-control" (change)="onChooseReport($event)" [disabled]="disable_report_choice"> |
|
| 32 |
<option value="">-- none selected --</option> |
|
| 33 |
<option value="AR1">AR1 Report</option> |
|
| 34 |
<option value="IR1">IR1 Report</option> |
|
| 35 |
<option value="RR1">RR1 Report</option> |
|
| 36 |
<option *ngIf="repo && repo.issn && repo.issn !== 'null' " value="JR1">JR1 Report</option> |
|
| 37 |
<option value="BR1">BR1 Report</option> |
|
| 38 |
<option value="BR2">BR2 Report</option> |
|
| 39 |
</select> |
|
| 40 |
</div> |
|
| 41 |
<div *ngIf="chosen_report" class="uk-margin-top"> |
|
| 30 |
<h3>Supported Reports</h3> |
|
| 42 | 31 |
|
| 43 |
<div class="uk-forml uk-width-1-1@s uk-width-2-3@m uk-container"> |
|
| 44 |
<h3>Report Request</h3> |
|
| 45 |
<div class="uk-grid"> |
|
| 46 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 47 |
Report Name: |
|
| 32 |
<div class="uk-margin uk-grid repositoryTypeSelection"> |
|
| 33 |
<div class="uk-width-1-3 uk-grid-item-match uk-first-column"> |
|
| 34 |
<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium"> |
|
| 35 |
<a [routerLink]="['AR1']" class="uk-position-cover uk-margin-remove-adjacent"></a> |
|
| 36 |
<div class="uk-card-media-top"> |
|
| 37 |
<img src="../../../assets/imgs/Icons_Reports_wide_AR1.png" alt="" style="width: 100%;"> |
|
| 38 |
</div> |
|
| 39 |
<div class="uk-card-body"> |
|
| 40 |
<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom"> |
|
| 41 |
Article Report 1, number of successful article download requests by month and repository. |
|
| 42 |
</h3> |
|
| 43 |
</div> |
|
| 48 | 44 |
</div> |
| 49 |
<div class="uk-width-2-3"> |
|
| 50 |
{{ chosen_report }}
|
|
| 51 |
</div> |
|
| 52 | 45 |
</div> |
| 53 |
<div class="uk-grid"> |
|
| 54 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 55 |
Release: |
|
| 46 |
<div class="uk-width-1-3 uk-grid-item-match uk-first-column"> |
|
| 47 |
<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium"> |
|
| 48 |
<a [routerLink]="['IR1']" class="uk-position-cover uk-margin-remove-adjacent"></a> |
|
| 49 |
<div class="uk-card-media-top"> |
|
| 50 |
<img class="el-image" src="../../../assets/imgs/Icons_Reports_wide_IR1.png" alt="" style="width:100%;"> |
|
| 51 |
</div> |
|
| 52 |
<div class="uk-card-body"> |
|
| 53 |
<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom"> |
|
| 54 |
Item Report 1, number of successful item download requests by month and repository. |
|
| 55 |
</h3> |
|
| 56 |
</div> |
|
| 56 | 57 |
</div> |
| 57 |
<div class="uk-width-2-3"> |
|
| 58 |
4 |
|
| 59 |
</div> |
|
| 60 | 58 |
</div> |
| 61 |
<div class="uk-grid"> |
|
| 62 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 63 |
Requestor: |
|
| 59 |
<div class="uk-width-1-3 uk-grid-item-match uk-first-column"> |
|
| 60 |
<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium"> |
|
| 61 |
<a [routerLink]="['RR1']" class="uk-position-cover uk-margin-remove-adjacent"></a> |
|
| 62 |
<div class="uk-card-media-top"> |
|
| 63 |
<img class="el-image" src="../../../assets/imgs/Icons_Reports_wide_RR1.png" alt="" style="width:100%;"> |
|
| 64 |
</div> |
|
| 65 |
<div class="uk-card-body"> |
|
| 66 |
<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom"> |
|
| 67 |
Repository Report 1, number of successful item downloads for all repositories participating in the usage statistics service. |
|
| 68 |
</h3> |
|
| 69 |
</div> |
|
| 64 | 70 |
</div> |
| 65 |
<div class="uk-width-2-3"> |
|
| 66 |
{{ userEmail }}
|
|
| 67 |
</div> |
|
| 68 | 71 |
</div> |
| 69 |
<h3>Report Filters</h3> |
|
| 70 |
<h5>Date range</h5> |
|
| 71 |
<p>Valid date formats are yyyy-mm-dd or yyyy-mm. Default range is the last available month. |
|
| 72 |
</p> |
|
| 73 |
<div class="uk-grid"> |
|
| 74 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 75 |
Begin Date: |
|
| 72 |
<div *ngIf="repo.datasourceType === 'journal'" class="uk-width-1-3 uk-grid-item-match uk-first-column"> |
|
| 73 |
<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium"> |
|
| 74 |
<a [routerLink]="['JR1']" class="uk-position-cover uk-margin-remove-adjacent"></a> |
|
| 75 |
<div class="uk-card-media-top"> |
|
| 76 |
<img class="el-image" src="../../../assets/imgs/Icons_Reports_wide_JR1.png" alt="" style="width:100%;"> |
|
| 77 |
</div> |
|
| 78 |
<div class="uk-card-body"> |
|
| 79 |
<h2 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom"> |
|
| 80 |
Journal Report 1, number of successful full-text article requests by month and journal. |
|
| 81 |
</h2> |
|
| 82 |
</div> |
|
| 76 | 83 |
</div> |
| 77 |
<div class="uk-width-2-3"> |
|
| 78 |
<input name="BeginDate" placeholder="2016-03" type="text" (blur)="updateBeginDate($event)"> |
|
| 79 |
</div> |
|
| 80 | 84 |
</div> |
| 81 |
<div class="uk-grid"> |
|
| 82 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 83 |
End Date: |
|
| 85 |
<div class="uk-width-1-3 uk-grid-item-match uk-first-column"> |
|
| 86 |
<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium"> |
|
| 87 |
<a [routerLink]="['BR1']" class="uk-position-cover uk-margin-remove-adjacent"></a> |
|
| 88 |
<div class="uk-card-media-top"> |
|
| 89 |
<img class="el-image" src="../../../assets/imgs/Icons_Reports_wide_BR1.png" alt="" style="width:100%;"> |
|
| 90 |
</div> |
|
| 91 |
<div class="uk-card-body"> |
|
| 92 |
<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom"> |
|
| 93 |
Book Report 1, number of successful title requests by month and title. |
|
| 94 |
</h3> |
|
| 95 |
</div> |
|
| 84 | 96 |
</div> |
| 85 |
<div class="uk-width-2-3"> |
|
| 86 |
<input name="EndDate" placeholder="2016-06" type="text" (blur)="updateEndDate($event)"> |
|
| 87 |
</div> |
|
| 88 | 97 |
</div> |
| 89 |
<h5><span *ngIf="chosen_report == 'RR1' || chosen_report == 'JR1'">Optional </span>Filters</h5> |
|
| 90 |
<p>Provide either a Repository Identifier or an Item Identifier<br> |
|
| 91 |
Identifier format: <b>namespace:value</b><br> |
|
| 92 |
Valid namespace for Repository Identifier: <b>openaire</b> or <b>opendoar</b>.<br> |
|
| 93 |
Valid namespace for Item Identifier: <b>openaire</b>, <b>doi</b> or <b>oid</b>(for OAI-PMH). |
|
| 94 |
</p> |
|
| 95 |
<div *ngIf="chosen_report != 'JR1'" class="uk-grid"> |
|
| 96 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 97 |
Repository Identifier: |
|
| 98 |
</div> |
|
| 99 |
<div class="uk-width-2-3"> |
|
| 100 |
{{ shownRepoId }}
|
|
| 101 |
</div> |
|
| 102 |
</div> |
|
| 103 |
<div *ngIf="repo.issn && chosen_report == 'JR1'" class="uk-grid"> |
|
| 104 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 105 |
Journal Identifier: |
|
| 106 |
</div> |
|
| 107 |
<div class="uk-width-2-3"> |
|
| 108 |
{{ issnToShow }}
|
|
| 109 |
</div> |
|
| 110 |
</div> |
|
| 111 |
<div *ngIf="chosen_report != 'JR1' && chosen_report != 'RR1'" class="uk-grid"> |
|
| 112 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 113 |
Item Identifier: |
|
| 114 |
</div> |
|
| 115 |
<div class="uk-width-2-3"> |
|
| 116 |
<input name="ItemIdentifier" placeholder="e.g. openaire:od_________::fb90de6f20d79783d05749d8f60417d5" |
|
| 117 |
type="text" (blur)="updateItemIdentifier($event)"> |
|
| 118 |
</div> |
|
| 119 |
</div> |
|
| 120 |
|
|
| 121 |
<div *ngIf="chosen_report == 'IR1' || chosen_report == 'RR1' || chosen_report == 'JR1'"> |
|
| 122 |
<p>Optional filter to only show results for a single item type, e.g. article, book, etc.</p> |
|
| 123 |
<div class="uk-grid"> |
|
| 124 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 125 |
Item Data Type: |
|
| 98 |
<div class="uk-width-1-3 uk-grid-item-match uk-first-column"> |
|
| 99 |
<div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium"> |
|
| 100 |
<a [routerLink]="['BR2']" class="uk-position-cover uk-margin-remove-adjacent"></a> |
|
| 101 |
<div class="uk-card-media-top"> |
|
| 102 |
<img class="el-image" src="../../../assets/imgs/Icons_Reports_wide_BR2.png" alt="" style="width:100%;"> |
|
| 126 | 103 |
</div> |
| 127 |
<div class="uk-width-2-3"> |
|
| 128 |
<select name="ItemDataType" (change)="updateItemDataType($event)"> |
|
| 129 |
<option value="">--- Select ItemDataType ---</option> |
|
| 130 |
<option value="Annotation">Annotation</option> |
|
| 131 |
<option value="Article">Article</option> |
|
| 132 |
<option value="Bachelor thesis">Bachelor thesis</option> |
|
| 133 |
<option value="Book">Book</option> |
|
| 134 |
<option value="clinical trial">clinical trial</option> |
|
| 135 |
<option value="Collection">Collection</option> |
|
| 136 |
<option value="Conference object">Conference object</option> |
|
| 137 |
<option value="Contribution for newspaper or weekly magazine">Contribution for newspaper or weekly magazine</option> |
|
| 138 |
<option value="Dataset">Dataset</option> |
|
| 139 |
<option value="Doctoral thesis">Doctoral thesis</option> |
|
| 140 |
<option value="Event">Event</option> |
|
| 141 |
<option value="External research report">External research report</option> |
|
| 142 |
<option value="Film">Film</option> |
|
| 143 |
<option value="Image">Image</option> |
|
| 144 |
<option value="InteractiveResource">InteractiveResource</option> |
|
| 145 |
<option value="Internal report">Internal report</option> |
|
| 146 |
<option value="Lecture">Lecture</option> |
|
| 147 |
<option value="Master thesis">Master thesis</option> |
|
| 148 |
<option value="Newsletter">Newsletter</option> |
|
| 149 |
<option value="Other">Other</option> |
|
| 150 |
<option value="Part of book or chapter of book">Part of book or chapter of book</option> |
|
| 151 |
<option value="Patent">Patent</option> |
|
| 152 |
<option value="PhysicalObject">PhysicalObject</option> |
|
| 153 |
<option value="Preprint">Preprint</option> |
|
| 154 |
<option value="Report">Report</option> |
|
| 155 |
<option value="Research">Research</option> |
|
| 156 |
<option value="Review">Review</option> |
|
| 157 |
<option value="Software">Software</option> |
|
| 158 |
<option value="Sound">Sound</option> |
|
| 159 |
<option value="Unknown">Unknown</option> |
|
| 160 |
</select> |
|
| 104 |
<div class="uk-card-body"> |
|
| 105 |
<h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom"> |
|
| 106 |
Book Report 2, number of successful section requests by month and title. |
|
| 107 |
</h3> |
|
| 161 | 108 |
</div> |
| 162 | 109 |
</div> |
| 163 | 110 |
</div> |
| 164 |
<h3>Report Attributes</h3> |
|
| 165 |
<p>Valid Granularity values: Monthly or Totals</p> |
|
| 166 |
<div class="uk-grid"> |
|
| 167 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 168 |
Granularity: |
|
| 169 |
</div> |
|
| 170 |
<div class="uk-width-2-3"> |
|
| 171 |
<select name="Granularity" (change)="updateGranularity($event)"> |
|
| 172 |
<option value="Monthly">Monthly</option> |
|
| 173 |
<option value="Totals">Totals</option> |
|
| 174 |
</select> |
|
| 175 |
</div> |
|
| 176 |
</div> |
|
| 177 |
<p>The Pretty attribute is just for humans playing with the API and looking at results in a browser.</p> |
|
| 178 |
<p><input name="Pretty" value="Pretty" checked="checked" type="checkbox" (change)="updatePretty($event)">Pretty print json(p) for humans</p> |
|
| 179 |
<a class="uk-button uk-button-primary" (click)="goToReport()">Get Report</a> |
|
| 180 | 111 |
</div> |
| 181 | 112 |
|
| 182 | 113 |
</div> |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-instructions.component.ts | ||
|---|---|---|
| 4 | 4 |
|
| 5 | 5 |
import {Component, OnInit} from '@angular/core';
|
| 6 | 6 |
import {PiwikInfo} from '../../domain/typeScriptClasses';
|
| 7 |
import {ActivatedRoute} from '@angular/router';
|
|
| 7 |
import {ActivatedRoute, Router} from '@angular/router';
|
|
| 8 | 8 |
import { PiwikService } from '../../services/piwik.service';
|
| 9 |
import {AuthenticationService} from "../../services/authentication.service";
|
|
| 9 | 10 |
|
| 10 | 11 |
@Component ({
|
| 11 | 12 |
selector: 'app-metrics-instructions', |
| ... | ... | |
| 18 | 19 |
|
| 19 | 20 |
constructor( |
| 20 | 21 |
private route: ActivatedRoute, |
| 21 |
private piwikService: PiwikService |
|
| 22 |
) {}
|
|
| 22 |
private router: Router, |
|
| 23 |
private piwikService: PiwikService, |
|
| 24 |
private authService: AuthenticationService) {}
|
|
| 23 | 25 |
|
| 24 | 26 |
ngOnInit() {
|
| 25 | 27 |
this.getPiwik(); |
| ... | ... | |
| 29 | 31 |
let id = this.route.snapshot.paramMap.get('id');
|
| 30 | 32 |
this.piwikService.getPiwikInfo(id).subscribe( |
| 31 | 33 |
piwik => this.piwik = piwik, |
| 32 |
error => console.log(error) |
|
| 34 |
error => console.log(error), |
|
| 35 |
() => {
|
|
| 36 |
/*if ( this.authService.getUserEmail() !== this.piwik.requestorEmail ) {
|
|
| 37 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 38 |
}*/ |
|
| 39 |
} |
|
| 33 | 40 |
); |
| 34 | 41 |
} |
| 35 | 42 |
|
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-usagestats-report.component.html | ||
|---|---|---|
| 1 |
<div class="uk-section-default uk-section uk-section-small uk-padding-remove-bottom" style="min-height: 325px"> |
|
| 2 |
|
|
| 3 |
<!-- MARGIN-TOP --> |
|
| 4 |
<div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" aria-hidden="true"></div> |
|
| 5 |
<div class="uk-container"> |
|
| 6 |
|
|
| 7 |
<div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid=""> |
|
| 8 |
<div class="uk-width-1-1@m uk-first-column"> |
|
| 9 |
|
|
| 10 |
<h1 class="uk-h2">{{ title }}</h1>
|
|
| 11 |
|
|
| 12 |
<!-- TOP HELP CONTENT --> |
|
| 13 |
<help-content #topHelperContent [position]="'top'" |
|
| 14 |
[ngClass]="topHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'"> |
|
| 15 |
</help-content> |
|
| 16 |
|
|
| 17 |
<div class="uk-container uk-margin-medium-top uk-margin-medium-bottom"> |
|
| 18 |
<div class="uk-grid"> |
|
| 19 |
|
|
| 20 |
<!-- LEFT HELP CONTENT --> |
|
| 21 |
<aside-help-content #leftHelperContent [position]="'left'" |
|
| 22 |
[ngClass]="leftHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'"> |
|
| 23 |
</aside-help-content> |
|
| 24 |
|
|
| 25 |
<!-- MIDDLE --> |
|
| 26 |
<div class=" uk-width-expand@m" style="min-height:500px;"> |
|
| 27 |
|
|
| 28 |
<div *ngIf="errorMessage" class="uk-alert uk-alert-warning">{{errorMessage}}</div>
|
|
| 29 |
<div *ngIf="loadingMessage" class="loading-big"> |
|
| 30 |
<div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;"> |
|
| 31 |
{{ loadingMessage }}
|
|
| 32 |
</div> |
|
| 33 |
<div class="whiteFilm"></div> |
|
| 34 |
</div> |
|
| 35 |
<div *ngIf="repo && chosen_report" class="uk-margin-top"> |
|
| 36 |
|
|
| 37 |
<div class="uk-forml uk-width-1-1@s uk-width-2-3@m uk-container"> |
|
| 38 |
<h3>Report Request</h3> |
|
| 39 |
<div class="uk-grid"> |
|
| 40 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 41 |
Report Name: |
|
| 42 |
</div> |
|
| 43 |
<div class="uk-width-2-3"> |
|
| 44 |
{{ chosen_report }}
|
|
| 45 |
</div> |
|
| 46 |
</div> |
|
| 47 |
<div class="uk-grid"> |
|
| 48 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 49 |
Release: |
|
| 50 |
</div> |
|
| 51 |
<div class="uk-width-2-3"> |
|
| 52 |
4 |
|
| 53 |
</div> |
|
| 54 |
</div> |
|
| 55 |
<div class="uk-grid"> |
|
| 56 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 57 |
Requestor: |
|
| 58 |
</div> |
|
| 59 |
<div class="uk-width-2-3"> |
|
| 60 |
{{ userEmail }}
|
|
| 61 |
</div> |
|
| 62 |
</div> |
|
| 63 |
<h3>Report Filters</h3> |
|
| 64 |
<h5>Date range</h5> |
|
| 65 |
<p>Valid date formats are yyyy-mm-dd or yyyy-mm. Default range is the last available month. |
|
| 66 |
</p> |
|
| 67 |
<div class="uk-grid"> |
|
| 68 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 69 |
Begin Date: |
|
| 70 |
</div> |
|
| 71 |
<div class="uk-width-2-3"> |
|
| 72 |
<input name="BeginDate" placeholder="2016-03" type="text" (blur)="updateBeginDate($event)"> |
|
| 73 |
</div> |
|
| 74 |
</div> |
|
| 75 |
<div class="uk-grid"> |
|
| 76 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 77 |
End Date: |
|
| 78 |
</div> |
|
| 79 |
<div class="uk-width-2-3"> |
|
| 80 |
<input name="EndDate" placeholder="2016-06" type="text" (blur)="updateEndDate($event)"> |
|
| 81 |
</div> |
|
| 82 |
</div> |
|
| 83 |
<h5><span *ngIf="chosen_report == 'RR1' || chosen_report == 'JR1'">Optional </span>Filters</h5> |
|
| 84 |
<p>Provide either a Repository Identifier or an Item Identifier<br> |
|
| 85 |
Identifier format: <b>namespace:value</b><br> |
|
| 86 |
Valid namespace for Repository Identifier: <b>openaire</b> or <b>opendoar</b>.<br> |
|
| 87 |
Valid namespace for Item Identifier: <b>openaire</b>, <b>doi</b> or <b>oid</b>(for OAI-PMH). |
|
| 88 |
</p> |
|
| 89 |
<div *ngIf="chosen_report != 'JR1'" class="uk-grid"> |
|
| 90 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 91 |
Repository Identifier: |
|
| 92 |
</div> |
|
| 93 |
<div class="uk-width-2-3"> |
|
| 94 |
{{ shownRepoId }}
|
|
| 95 |
</div> |
|
| 96 |
</div> |
|
| 97 |
<div *ngIf="repo.issn && chosen_report == 'JR1'" class="uk-grid"> |
|
| 98 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 99 |
Journal Identifier: |
|
| 100 |
</div> |
|
| 101 |
<div class="uk-width-2-3"> |
|
| 102 |
{{ issnToShow }}
|
|
| 103 |
</div> |
|
| 104 |
</div> |
|
| 105 |
<div *ngIf="chosen_report != 'JR1' && chosen_report != 'RR1'" class="uk-grid"> |
|
| 106 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 107 |
Item Identifier: |
|
| 108 |
</div> |
|
| 109 |
<div class="uk-width-2-3"> |
|
| 110 |
<input name="ItemIdentifier" placeholder="e.g. openaire:od_________::fb90de6f20d79783d05749d8f60417d5" |
|
| 111 |
type="text" (blur)="updateItemIdentifier($event)"> |
|
| 112 |
</div> |
|
| 113 |
</div> |
|
| 114 |
|
|
| 115 |
<div *ngIf="chosen_report == 'IR1' || chosen_report == 'RR1' || chosen_report == 'JR1'"> |
|
| 116 |
<p>Optional filter to only show results for a single item type, e.g. article, book, etc.</p> |
|
| 117 |
<div class="uk-grid"> |
|
| 118 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 119 |
Item Data Type: |
|
| 120 |
</div> |
|
| 121 |
<div class="uk-width-2-3"> |
|
| 122 |
<select name="ItemDataType" (change)="updateItemDataType($event)"> |
|
| 123 |
<option value="">--- Select ItemDataType ---</option> |
|
| 124 |
<option value="Annotation">Annotation</option> |
|
| 125 |
<option value="Article">Article</option> |
|
| 126 |
<option value="Bachelor thesis">Bachelor thesis</option> |
|
| 127 |
<option value="Book">Book</option> |
|
| 128 |
<option value="clinical trial">clinical trial</option> |
|
| 129 |
<option value="Collection">Collection</option> |
|
| 130 |
<option value="Conference object">Conference object</option> |
|
| 131 |
<option value="Contribution for newspaper or weekly magazine">Contribution for newspaper or weekly magazine</option> |
|
| 132 |
<option value="Dataset">Dataset</option> |
|
| 133 |
<option value="Doctoral thesis">Doctoral thesis</option> |
|
| 134 |
<option value="Event">Event</option> |
|
| 135 |
<option value="External research report">External research report</option> |
|
| 136 |
<option value="Film">Film</option> |
|
| 137 |
<option value="Image">Image</option> |
|
| 138 |
<option value="InteractiveResource">InteractiveResource</option> |
|
| 139 |
<option value="Internal report">Internal report</option> |
|
| 140 |
<option value="Lecture">Lecture</option> |
|
| 141 |
<option value="Master thesis">Master thesis</option> |
|
| 142 |
<option value="Newsletter">Newsletter</option> |
|
| 143 |
<option value="Other">Other</option> |
|
| 144 |
<option value="Part of book or chapter of book">Part of book or chapter of book</option> |
|
| 145 |
<option value="Patent">Patent</option> |
|
| 146 |
<option value="PhysicalObject">PhysicalObject</option> |
|
| 147 |
<option value="Preprint">Preprint</option> |
|
| 148 |
<option value="Report">Report</option> |
|
| 149 |
<option value="Research">Research</option> |
|
| 150 |
<option value="Review">Review</option> |
|
| 151 |
<option value="Software">Software</option> |
|
| 152 |
<option value="Sound">Sound</option> |
|
| 153 |
<option value="Unknown">Unknown</option> |
|
| 154 |
</select> |
|
| 155 |
</div> |
|
| 156 |
</div> |
|
| 157 |
</div> |
|
| 158 |
<h3>Report Attributes</h3> |
|
| 159 |
<p>Valid Granularity values: Monthly or Totals</p> |
|
| 160 |
<div class="uk-grid"> |
|
| 161 |
<div class=" uk-width-1-3 uk-text-right"> |
|
| 162 |
Granularity: |
|
| 163 |
</div> |
|
| 164 |
<div class="uk-width-2-3"> |
|
| 165 |
<select name="Granularity" (change)="updateGranularity($event)"> |
|
| 166 |
<option value="Monthly">Monthly</option> |
|
| 167 |
<option value="Totals">Totals</option> |
|
| 168 |
</select> |
|
| 169 |
</div> |
|
| 170 |
</div> |
|
| 171 |
<p>The Pretty attribute is just for humans playing with the API and looking at results in a browser.</p> |
|
| 172 |
<p><input name="Pretty" value="Pretty" checked="checked" type="checkbox" (change)="updatePretty($event)">Pretty print json(p) for humans</p> |
|
| 173 |
<a class="uk-button uk-button-primary" (click)="goToReport()">Get Report</a> |
|
| 174 |
</div> |
|
| 175 |
|
|
| 176 |
</div> |
|
| 177 |
|
|
| 178 |
</div> |
|
| 179 |
|
|
| 180 |
<!-- RIGHT HELP CONTENT --> |
|
| 181 |
<aside-help-content #rightHelperContent [position]="'right'" |
|
| 182 |
[ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'"> |
|
| 183 |
</aside-help-content> |
|
| 184 |
|
|
| 185 |
</div> |
|
| 186 |
</div> |
|
| 187 |
|
|
| 188 |
|
|
| 189 |
<!-- BOTTOM HELP CONTENT --> |
|
| 190 |
<help-content #bottomHelperContent [position]="'bottom'" |
|
| 191 |
[ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'"> |
|
| 192 |
</help-content> |
|
| 193 |
|
|
| 194 |
|
|
| 195 |
</div> |
|
| 196 |
</div> |
|
| 197 |
</div> |
|
| 198 |
</div> |
|
| 199 |
|
|
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-show.component.ts | ||
|---|---|---|
| 1 | 1 |
import { Component, OnInit } from '@angular/core';
|
| 2 |
import { ActivatedRoute } from '@angular/router';
|
|
| 2 |
import {ActivatedRoute, Router} from '@angular/router';
|
|
| 3 | 3 |
import { MetricsInfo, PiwikInfo } from '../../domain/typeScriptClasses';
|
| 4 | 4 |
import { PiwikService } from '../../services/piwik.service';
|
| 5 | 5 |
import { RepositoryService } from '../../services/repository.service';
|
| 6 | 6 |
import { loadingMetrics, loadingMetricsError } from '../../domain/shared-messages';
|
| 7 | 7 |
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
|
| 8 |
import {AuthenticationService} from "../../services/authentication.service";
|
|
| 8 | 9 |
|
| 9 | 10 |
@Component ({
|
| 10 | 11 |
selector: 'metrics-show', |
| ... | ... | |
| 26 | 27 |
|
| 27 | 28 |
constructor( |
| 28 | 29 |
private route: ActivatedRoute, |
| 30 |
private router: Router, |
|
| 29 | 31 |
private sanitizer: DomSanitizer, |
| 30 | 32 |
private piwikService: PiwikService, |
| 31 |
private repoService: RepositoryService |
|
| 32 |
) {}
|
|
| 33 |
private repoService: RepositoryService,
|
|
| 34 |
private authService: AuthenticationService) {}
|
|
| 33 | 35 |
|
| 34 | 36 |
ngOnInit() {
|
| 35 | 37 |
this.repoId = this.route.snapshot.paramMap.get('id');
|
| ... | ... | |
| 51 | 53 |
() => {
|
| 52 | 54 |
this.loadingMessage = ''; |
| 53 | 55 |
this.errorMessage = ''; |
| 54 |
this.getMetrics(); |
|
| 56 |
/*if ( this.authService.getUserEmail() !== this.piwik.requestorEmail ) {
|
|
| 57 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 58 |
} else {*/
|
|
| 59 |
this.getMetrics(); |
|
| 60 |
/*}*/ |
|
| 55 | 61 |
} |
| 56 | 62 |
); |
| 57 | 63 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-instructions.component.html | ||
|---|---|---|
| 37 | 37 |
</p> |
| 38 | 38 |
<ul> |
| 39 | 39 |
<li>as a patch for various versions of DSpace |
| 40 |
(<a href="https://github.com/openaire/OpenAIRE-Piwik-DSpace">https://github.com/dimitrispie/OpenAIRE-Piwik-DSpace</a>)</li>
|
|
| 40 |
(<a target="_blank" href="https://github.com/openaire/OpenAIRE-Piwik-DSpace">https://github.com/openaire/OpenAIRE-Piwik-DSpace</a>)</li>
|
|
| 41 | 41 |
<li>as an Eprints plugin for version 3 |
| 42 |
(<a href="https://github.com/openaire/EPrints-OAPiwik">https://github.com/dimitrispie/EPrints-OAPiwik</a>)</li>
|
|
| 42 |
(<a target="_blank" href="https://github.com/openaire/EPrints-OAPiwik">https://github.com/openaire/EPrints-OAPiwik</a>)</li>
|
|
| 43 | 43 |
</ul> |
| 44 | 44 |
<p> |
| 45 | 45 |
To configure your repository to allow tracking in Piwik platform, please change the configuration files with the following parameters and values, generated for your site: |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics-usagestats.component.ts | ||
|---|---|---|
| 15 | 15 |
export class MetricsUsagestatsComponent implements OnInit {
|
| 16 | 16 |
|
| 17 | 17 |
errorMessage: string; |
| 18 |
title: string = 'Get usage statistics report'; |
|
| 18 | 19 |
|
| 19 | 20 |
repo: Repository; |
| 20 | 21 |
repoId: string; |
| 21 |
shownRepoId: string; |
|
| 22 |
shownOpenaireId: string; |
|
| 23 |
issnToShow: string = ''; |
|
| 24 |
chosen_report: string; |
|
| 25 |
disable_report_choice: boolean; |
|
| 26 | 22 |
|
| 27 |
userEmail: string; |
|
| 28 |
beginDate: string = ''; |
|
| 29 |
endDate: string = ''; |
|
| 30 |
itemIdentifier: string = ''; |
|
| 31 |
itemDataType: string = ''; |
|
| 32 |
granularity: string = 'Monthly'; |
|
| 33 |
pretty: boolean = true; |
|
| 23 |
constructor(private repoService: RepositoryService, |
|
| 24 |
private authService: AuthenticationService, |
|
| 25 |
private route: ActivatedRoute, |
|
| 26 |
private router: Router) {}
|
|
| 34 | 27 |
|
| 35 |
constructor(private repoService: RepositoryService, private route: ActivatedRoute, private router: Router, private authService: AuthenticationService) {}
|
|
| 36 |
|
|
| 37 | 28 |
ngOnInit() {
|
| 38 |
this.getRepoId(); |
|
| 39 |
this.getUserEmail(); |
|
| 40 | 29 |
this.getRepo(); |
| 41 | 30 |
} |
| 42 | 31 |
|
| 43 |
getRepoId() {
|
|
| 32 |
getRepo() {
|
|
| 44 | 33 |
this.repoId = this.route.snapshot.paramMap.get('id');
|
| 45 |
this.shownRepoId = this.convertToDisplayedFormat(this.repoId); |
|
| 46 |
console.log(`shownRepoId is ${this.repoId}`);
|
|
| 47 |
} |
|
| 48 | 34 |
|
| 49 |
convertToDisplayedFormat(input: string) {
|
|
| 50 |
const tempArray = this.repoId.split('____::');
|
|
| 51 |
return tempArray[0] + ':' + tempArray[1]; |
|
| 52 |
} |
|
| 53 |
|
|
| 54 |
onChooseReport(event: any) {
|
|
| 55 |
this.chosen_report = event.target.value; |
|
| 56 |
console.log('chosen report is', this.chosen_report);
|
|
| 57 |
this.disable_report_choice = true; |
|
| 58 |
} |
|
| 59 |
|
|
| 60 |
getUserEmail() {
|
|
| 61 |
this.userEmail = this.authService.getUserEmail(); |
|
| 62 |
} |
|
| 63 |
|
|
| 64 |
getRepo() {
|
|
| 65 |
this.repoService.getRepositoryById(this.repoId).subscribe( |
|
| 66 |
repo => this.repo = repo, |
|
| 67 |
error => {
|
|
| 68 |
console.log(error); |
|
| 69 |
this.errorMessage = 'The repository could not be retrieved'; |
|
| 70 |
}, |
|
| 71 |
() => {
|
|
| 72 |
this.shownOpenaireId = this.convertToDisplayedFormat(this.repo.piwikInfo.openaireId); |
|
| 73 |
if (this.repo.issn){
|
|
| 74 |
this.issnToShow = this.repo.issn.slice(0, 4)+ '-' + this.repo.issn.toString().slice(4); |
|
| 35 |
if (this.repoId) {
|
|
| 36 |
this.repoService.getRepositoryById(this.repoId).subscribe( |
|
| 37 |
repo => this.repo = repo, |
|
| 38 |
error => {
|
|
| 39 |
console.log(error); |
|
| 40 |
this.errorMessage = 'The repository could not be retrieved'; |
|
| 41 |
}, |
|
| 42 |
() => {
|
|
| 43 |
this.title = this.title + ' for ' + this.repo.officialName; |
|
| 44 |
if ( this.authService.getUserEmail() !== this.repo.registeredBy ) {
|
|
| 45 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 46 |
} |
|
| 75 | 47 |
} |
| 76 |
}
|
|
| 77 |
);
|
|
| 48 |
);
|
|
| 49 |
}
|
|
| 78 | 50 |
} |
| 79 | 51 |
|
| 80 |
updateBeginDate(event: any) {
|
|
| 81 |
this.beginDate = event.target.value; |
|
| 82 |
} |
|
| 83 |
|
|
| 84 |
updateEndDate(event: any) {
|
|
| 85 |
this.endDate = event.target.value; |
|
| 86 |
} |
|
| 87 |
|
|
| 88 |
updateItemDataType(event: any) {
|
|
| 89 |
this.itemDataType = event.target.value; |
|
| 90 |
} |
|
| 91 |
|
|
| 92 |
updateItemIdentifier(event: any) {
|
|
| 93 |
this.itemIdentifier = event.target.value; |
|
| 94 |
} |
|
| 95 |
|
|
| 96 |
updateGranularity(event: any) {
|
|
| 97 |
this.granularity = event.target.value; |
|
| 98 |
} |
|
| 99 |
|
|
| 100 |
updatePretty(event: any) {
|
|
| 101 |
this.pretty = !this.pretty; |
|
| 102 |
} |
|
| 103 |
|
|
| 104 |
goToReport() {
|
|
| 105 |
/* additional field: */ |
|
| 106 |
/*itemIdentifier: this.repo.piwikInfo.openaireId,*/ |
|
| 107 |
/*this.router.navigate(['/getImpact/usagestats-report-results'], {
|
|
| 108 |
queryParams: {
|
|
| 109 |
report: this.chosen_report, |
|
| 110 |
beginDate: this.beginDate, |
|
| 111 |
endDate: this.endDate, |
|
| 112 |
repoId: this.shownRepoId, |
|
| 113 |
itemDataType: this.itemDataType, |
|
| 114 |
itemIdentifier: this.itemIdentifier, |
|
| 115 |
granularity: this.granularity, |
|
| 116 |
pretty: this.pretty |
|
| 117 |
} |
|
| 118 |
});*/ |
|
| 119 |
|
|
| 120 |
const params = new URLSearchParams(); |
|
| 121 |
|
|
| 122 |
params.append('Report', this.chosen_report);
|
|
| 123 |
params.append('Release', '4');
|
|
| 124 |
params.append('RequestorID', this.authService.getUserEmail());
|
|
| 125 |
params.append('BeginDate', this.beginDate);
|
|
| 126 |
params.append('EndDate', this.endDate);
|
|
| 127 |
params.append('RepositoryIdentifier', this.shownRepoId);
|
|
| 128 |
if (this.itemIdentifier) {
|
|
| 129 |
params.append('ItemIdentifier', this.itemIdentifier);
|
|
| 130 |
} |
|
| 131 |
if (this.itemDataType) {
|
|
| 132 |
params.append('ItemDataType', this.itemDataType);
|
|
| 133 |
} |
|
| 134 |
params.append('Granularity', this.granularity);
|
|
| 135 |
if (this.pretty && this.pretty === true) {
|
|
| 136 |
params.append('Pretty', 'Pretty');
|
|
| 137 |
} |
|
| 138 |
|
|
| 139 |
let url = `http://beta.services.openaire.eu/usagestats/sushilite/GetReport/?${params}`;
|
|
| 140 |
console.log(`going to: ${url}`);
|
|
| 141 |
|
|
| 142 |
window.location.href = url; |
|
| 143 |
} |
|
| 144 |
|
|
| 145 | 52 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/compatibility/compatibility-validation-results.component.ts | ||
|---|---|---|
| 1 | 1 |
import { Component, OnInit, ViewChild } from '@angular/core';
|
| 2 |
import { ActivatedRoute } from '@angular/router';
|
|
| 2 |
import {ActivatedRoute, Router} from '@angular/router';
|
|
| 3 | 3 |
import { JobResultEntry, StoredJob } from '../../domain/typeScriptClasses';
|
| 4 | 4 |
import { MonitorService } from '../../services/monitor.service';
|
| 5 | 5 |
import {
|
| ... | ... | |
| 7 | 7 |
noUsageRulesResults |
| 8 | 8 |
} from '../../domain/shared-messages'; |
| 9 | 9 |
import { ConfirmationDialogComponent } from '../../shared/reusablecomponents/confirmation-dialog.component';
|
| 10 |
import {AuthenticationService} from "../../services/authentication.service";
|
|
| 10 | 11 |
|
| 11 | 12 |
@Component({
|
| 12 | 13 |
selector: 'app-compatibility-validation-results', |
| ... | ... | |
| 32 | 33 |
public checkErrors: ConfirmationDialogComponent; |
| 33 | 34 |
|
| 34 | 35 |
constructor (private route: ActivatedRoute, |
| 35 |
private monitorService: MonitorService) {}
|
|
| 36 |
private router: Router, |
|
| 37 |
private monitorService: MonitorService, |
|
| 38 |
private authService: AuthenticationService) {}
|
|
| 36 | 39 |
|
| 37 | 40 |
ngOnInit () {
|
| 38 | 41 |
setTimeout(() => {
|
| ... | ... | |
| 71 | 74 |
if (!this.usageResults.length) {
|
| 72 | 75 |
this.noUsage = noUsageRulesResults; |
| 73 | 76 |
} |
| 77 |
if ( this.authService.getUserEmail() !== this.jobSummary.userEmail ) {
|
|
| 78 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 79 |
} |
|
| 74 | 80 |
} |
| 75 | 81 |
); |
| 76 | 82 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/compatibility/compatibility-monitor-repo.component.ts | ||
|---|---|---|
| 1 | 1 |
import { Component, OnInit } from '@angular/core';
|
| 2 |
import { ActivatedRoute } from '@angular/router';
|
|
| 2 |
import {ActivatedRoute, Router} from '@angular/router';
|
|
| 3 | 3 |
import {AggregationDetails, Aggregations, Repository} from '../../domain/typeScriptClasses';
|
| 4 | 4 |
import { RepositoryService } from '../../services/repository.service';
|
| 5 | 5 |
import {
|
| ... | ... | |
| 9 | 9 |
loadingRepoMessage, |
| 10 | 10 |
noAggregationHistory |
| 11 | 11 |
} from '../../domain/shared-messages'; |
| 12 |
import {AuthenticationService} from "../../services/authentication.service";
|
|
| 12 | 13 |
|
| 13 | 14 |
@Component ({
|
| 14 | 15 |
selector: 'app-compatibility-monitor-repo', |
| ... | ... | |
| 27 | 28 |
latestAggregations: AggregationDetails[] = []; |
| 28 | 29 |
|
| 29 | 30 |
constructor(private route: ActivatedRoute, |
| 30 |
private repoService: RepositoryService) {}
|
|
| 31 |
private router: Router, |
|
| 32 |
private repoService: RepositoryService, |
|
| 33 |
private authService: AuthenticationService) {}
|
|
| 31 | 34 |
|
| 32 | 35 |
ngOnInit() {
|
| 33 | 36 |
this.readRepoId(); |
| ... | ... | |
| 55 | 58 |
this.loadingMessage = ''; |
| 56 | 59 |
if (this.repo) {
|
| 57 | 60 |
this.repoName = this.repo.officialName; |
| 58 |
this.getLatestAggregationHistory(); |
|
| 61 |
if ( this.authService.getUserEmail() !== this.repo.registeredBy ) {
|
|
| 62 |
this.router.navigateByUrl('/403-forbidden', { skipLocationChange: true });
|
|
| 63 |
} else {
|
|
| 64 |
this.getLatestAggregationHistory(); |
|
| 65 |
} |
|
| 59 | 66 |
} else {
|
| 60 | 67 |
this.errorMessage = loadingRepoError; |
| 61 | 68 |
} |
| modules/uoa-repository-dashboard-gui/trunk/app/pages/compatibility/compatibility-monitor-fullHistory-repo.component.html | ||
|---|---|---|
| 2 | 2 |
<div class="uk-width-1-1@m uk-first-column"> |
| 3 | 3 |
|
| 4 | 4 |
<h1 class="uk-h2">Aggregation history for {{ repoName }}</h1>
|
| 5 |
<div *ngIf="repo"> |
|
| 6 |
<a [routerLink]="['/compatibility/monitor', repo.id]" class="uk-h3 uk-link">Go back</a> |
|
| 7 |
</div> |
|
| 8 | 5 |
|
| 9 | 6 |
<!-- TOP HELP CONTENT --> |
| 10 | 7 |
<help-content #topHelperContent [position]="'top'" |
| ... | ... | |
| 32 | 29 |
<div *ngIf="noAggregations">{{ noAggregations }}</div>
|
| 33 | 30 |
<div *ngIf="aggregationsMap && years && (years.length > 0) && !noAggregations"> |
| 34 | 31 |
<div *ngFor="let year of years" class="uk-width-1-1@m"> |
| 35 |
<h4>{{ year }}</h4>
|
|
| 36 |
<div class="section md-bg-blue-grey-700"> |
|
| 32 |
<div> |
|
| 33 |
<h4>{{ year }}</h4>
|
|
| 34 |
<div *ngFor="let aggr of aggregationsMap[year]"> |
|
| 35 |
<div class="uk-grid uk-child-width-1-4"> |
|
| 36 |
<div><span *ngIf="aggr.date">{{ aggr.date | date : "yyyy-MM-dd" }}</span></div>
|
|
| 37 |
<div><span *ngIf="aggr.aggregationStage">Aggregation stage: {{ aggr.aggregationStage }}</span></div>
|
|
| 38 |
<div><span *ngIf="aggr.collectionMode">CollectionMode: {{ aggr.collectionMode }}</span></div>
|
|
| 39 |
<div><span *ngIf="aggr.numberOfRecords">Number of records: {{ aggr.numberOfRecords }}</span></div>
|
|
| 40 |
</div> |
|
| 41 |
</div> |
|
| 42 |
</div> |
|
| 43 |
<!--<div class="section md-bg-blue-grey-700"> |
|
| 37 | 44 |
<div class="uk-container uk-container-center"> |
| 38 | 45 |
<div class="al_timeline"> |
| 39 | 46 |
<div *ngFor="let aggr of aggregationsMap[year]" class="al_timeline_block versionChange"> |
| ... | ... | |
| 47 | 54 |
</div> |
| 48 | 55 |
</div> |
| 49 | 56 |
</div> |
| 50 |
</div> |
|
| 57 |
</div>-->
|
|
| 51 | 58 |
<hr> |
| 52 | 59 |
</div> |
| 53 | 60 |
</div> |
| 61 |
|
|
| 62 |
<div *ngIf="repo" class="uk-inline"> |
|
| 63 |
<div class="uk-float-right" style="z-index: 100; bottom: 30px; position: fixed; right: 30px;"> |
|
| 64 |
<button [routerLink]="['/compatibility/monitor', repo.id]" |
|
| 65 |
style="box-shadow: 0 1px 10px #444444" |
|
| 66 |
class="uk-button uk-button-primary"> |
|
| 67 |
Go back |
|
| 68 |
</button> |
|
| 69 |
</div> |
|
| 70 |
</div> |
|
| 71 |
|
|
| 54 | 72 |
</div> |
| 55 | 73 |
|
| 56 | 74 |
<!-- RIGHT HELP CONTENT --> |
| modules/uoa-repository-dashboard-gui/trunk/package-lock.json | ||
|---|---|---|
| 110 | 110 |
"integrity": "sha1-Qpai/324TdwuZ8KhB+J29yRj/40=", |
| 111 | 111 |
"dev": true |
| 112 | 112 |
}, |
| 113 |
"@angular/animations": {
|
|
| 114 |
"version": "4.4.7", |
|
| 115 |
"resolved": "https://registry.npmjs.org/@angular/animations/-/animations-4.4.7.tgz", |
|
| 116 |
"integrity": "sha512-clP1xZw3KCfdj5rGDies5L5iwLgXzVFQ/B66Yj9oc24mJyK9oZARmuXdHfu+y8YtlW2b3wNSK2JH3qygaxbNLA==", |
|
| 117 |
"requires": {
|
|
| 118 |
"tslib": "^1.7.1" |
|
| 119 |
} |
|
| 120 |
}, |
|
| 113 | 121 |
"@angular/common": {
|
| 114 | 122 |
"version": "4.4.7", |
| 115 | 123 |
"resolved": "https://registry.npmjs.org/@angular/common/-/common-4.4.7.tgz", |
| modules/uoa-repository-dashboard-gui/trunk/app/services/authentication.service.ts | ||
|---|---|---|
| 86 | 86 |
deleteCookie('openAIREUser');
|
| 87 | 87 |
deleteCookie('AccessToken');
|
| 88 | 88 |
this.isLoggedIn = false; |
| 89 |
this.router.navigate(['/landing']); |
|
| 90 |
}, |
|
| 91 |
() => {
|
|
| 92 |
if ( sessionStorage.getItem("state.location") ) {
|
|
| 93 |
let state = sessionStorage.getItem("state.location");
|
|
| 94 |
sessionStorage.removeItem("state.location");
|
|
| 95 |
console.log(`tried to login - returning to state: ${state}`);
|
|
| 96 |
if ( !this.getIsUserLoggedIn() ) {
|
|
| 97 |
console.log('user hasn\'t logged in yet -- going to landing');
|
|
| 98 |
this.router.navigate(['/landing']); |
|
| 99 |
} else if (this.redirectUrl) {
|
|
| 100 |
this.router.navigate([this.redirectUrl]); |
|
| 101 |
} else {
|
|
| 102 |
this.router.navigate([state]); |
|
| 103 |
} |
|
| 104 |
} |
|
| 89 | 105 |
} |
| 90 | 106 |
); |
| 91 | 107 |
} else {
|
| 92 | 108 |
this.isLoggedIn = true; |
| 93 | 109 |
console.log(`the current user is: ${sessionStorage.getItem('name')}, ${sessionStorage.getItem('email')}, ${sessionStorage.getItem('role')}`);
|
| 94 | 110 |
} |
| 95 |
if ( sessionStorage.getItem("state.location") ) {
|
|
| 96 |
let state = sessionStorage.getItem("state.location");
|
|
| 97 |
sessionStorage.removeItem("state.location");
|
|
| 98 |
console.log(`tried to login - returning to state: ${state}`);
|
|
| 99 |
if ( !this.getIsUserLoggedIn() ) {
|
|
| 100 |
this.router.navigate(['/landing']); |
|
| 101 |
} else if (this.redirectUrl) {
|
|
| 102 |
this.router.navigate([this.redirectUrl]); |
|
| 103 |
} else {
|
|
| 104 |
this.router.navigate([state]); |
|
| 105 |
} |
|
| 106 |
} |
|
| 107 | 111 |
} |
| 108 | 112 |
} |
| 109 | 113 |
|
| modules/uoa-repository-dashboard-gui/trunk/app/app.component.html | ||
|---|---|---|
| 26 | 26 |
|
| 27 | 27 |
|
| 28 | 28 |
<footer></footer> |
| 29 |
<cookie-law position="bottom"> |
|
| 30 |
OpenAIRE uses cookies in order to function properly.<br> |
|
| 31 |
Cookies are small pieces of data that websites store in your browser to allow us to give you the best browsing experience possible. |
|
| 32 |
By using the OpenAIRE portal you accept our use of cookies. <a href="//ec.europa.eu/ipg/basics/legal/cookies/index_en.htm" target="_blank"> Read more <span class="uk-icon"> |
|
| 33 |
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg> |
|
| 34 |
</span></a> |
|
| 35 |
</cookie-law> |
|
| 29 | 36 |
</div> |
| modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/cookie-law/cookie-law.component.ts | ||
|---|---|---|
| 1 |
/** |
|
| 2 |
* angular2-cookie-law |
|
| 3 |
* |
|
| 4 |
* Copyright 2016-2017, @andreasonny83, All rights reserved. |
|
| 5 |
* |
|
| 6 |
* @author: @andreasonny83 <andreasonny83@gmail.com> |
|
| 7 |
*/ |
|
| 8 |
|
|
| 9 |
import {
|
|
| 10 |
Component, |
|
| 11 |
OnInit, |
|
| 12 |
ViewEncapsulation, |
|
| 13 |
HostBinding, |
|
| 14 |
Input, |
|
| 15 |
Output, |
|
| 16 |
EventEmitter, |
|
| 17 |
animate, |
|
| 18 |
state, |
|
| 19 |
trigger, |
|
| 20 |
style, |
|
| 21 |
transition, |
|
| 22 |
AnimationTransitionEvent, |
|
| 23 |
} from '@angular/core'; |
|
| 24 |
|
|
| 25 |
import {
|
|
| 26 |
DomSanitizer, |
|
| 27 |
SafeHtml, |
|
| 28 |
} from '@angular/platform-browser'; |
|
| 29 |
|
|
| 30 |
import {
|
|
| 31 |
CookieLawService, |
|
| 32 |
} from './cookie-law.service'; |
|
| 33 |
|
|
| 34 |
// import {
|
|
| 35 |
// closeIcon, |
|
| 36 |
// } from './icons'; |
|
| 37 |
|
|
| 38 |
export type CookieLawPosition = 'top' | 'bottom'; |
|
| 39 |
export type CookieLawAnimation = 'topIn' | 'bottomIn' | 'topOut' | 'bottomOut'; |
|
| 40 |
export type CookieLawTarget = '_blank' | '_self'; |
|
| 41 |
|
|
| 42 |
@Component({
|
|
| 43 |
selector: 'cookie-law', |
|
| 44 |
// encapsulation: ViewEncapsulation.None, |
|
| 45 |
animations: [ |
|
| 46 |
trigger('state', [
|
|
| 47 |
state('bottomOut', style({ transform: 'translateY(100%)' })),
|
|
| 48 |
state('topOut', style({ transform: 'translateY(-100%)' })),
|
|
| 49 |
state('*', style({ transform: 'translateY(0)' })),
|
|
| 50 |
|
|
| 51 |
transition('void => topIn', [
|
|
| 52 |
style({ transform: 'translateY(-100%)' }),
|
|
| 53 |
animate('1000ms ease-in-out'),
|
|
| 54 |
]), |
|
| 55 |
|
|
| 56 |
transition('void => bottomIn', [
|
|
| 57 |
style({ transform: 'translateY(100%)' }),
|
|
| 58 |
animate('1000ms ease-in-out'),
|
|
| 59 |
]), |
|
| 60 |
|
|
| 61 |
transition('* => *', animate('1000ms ease-out')),
|
|
| 62 |
]) |
|
| 63 |
], |
|
| 64 |
styleUrls: [ './cookie-law.css' ], |
|
| 65 |
templateUrl: './cookie-law.html', |
|
| 66 |
}) |
|
| 67 |
export class CookieLawComponent implements OnInit {
|
|
| 68 |
public cookieLawSeen: boolean; |
|
| 69 |
|
|
| 70 |
@Input('learnMore')
|
|
| 71 |
get learnMore() { return this._learnMore; }
|
|
| 72 |
set learnMore(value: string) {
|
|
| 73 |
this._learnMore = (value !== null && `${value}` !== 'false') ? value : null;
|
|
| 74 |
} |
|
| 75 |
|
|
| 76 |
@Input('target')
|
|
| 77 |
get target() { return this._target; }
|
|
| 78 |
set target(value: CookieLawTarget) {
|
|
| 79 |
this._target = (value !== null && `${value}` !== 'false' &&
|
|
| 80 |
(`${value}` === '_blank' || `${value}` === '_self')
|
|
| 81 |
) ? value : '_blank'; |
|
| 82 |
} |
|
| 83 |
|
|
| 84 |
@Input('position')
|
|
| 85 |
get position() { return this._position; }
|
|
| 86 |
set position(value: CookieLawPosition) {
|
|
| 87 |
this._position = (value !== null && `${value}` !== 'false' &&
|
|
| 88 |
(`${value}` === 'top' || `${value}` === 'bottom')
|
|
| 89 |
) ? value : 'bottom'; |
|
| 90 |
} |
|
| 91 |
|
|
| 92 |
@Output('isSeen')
|
|
| 93 |
private isSeenEvt: EventEmitter<boolean>; |
|
| 94 |
|
|
| 95 |
@HostBinding('attr.seen')
|
|
| 96 |
public isSeen: boolean; |
|
| 97 |
|
|
| 98 |
private animation: CookieLawAnimation; |
|
| 99 |
private closeSvg: SafeHtml; |
|
| 100 |
private currentStyles: {};
|
|
| 101 |
private _learnMore: string; |
|
| 102 |
private _target: CookieLawTarget; |
|
| 103 |
private _position: CookieLawPosition; |
|
| 104 |
|
|
| 105 |
constructor( |
|
| 106 |
private _service: CookieLawService, |
|
| 107 |
private domSanitizer: DomSanitizer, |
|
| 108 |
) {
|
|
| 109 |
this.isSeenEvt = new EventEmitter<boolean>(); |
|
| 110 |
this.animation = 'topIn'; |
|
| 111 |
this._position = 'bottom'; |
|
| 112 |
this.cookieLawSeen = this._service.seen(); |
|
| 113 |
} |
|
| 114 |
|
|
| 115 |
ngOnInit(): void {
|
|
| 116 |
if (typeof document !== 'undefined') {
|
|
| 117 |
this.animation = this.position === 'bottom' ? 'bottomIn' : 'topIn'; |
|
| 118 |
|
|
| 119 |
this.closeSvg = '<span class="clickable uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg></span> ' ; |
|
| 120 |
|
|
| 121 |
if (this.cookieLawSeen) {
|
|
| 122 |
this.isSeen = true; |
|
| 123 |
} |
|
| 124 |
|
|
| 125 |
this.currentStyles = {
|
|
| 126 |
'top': this.position === 'top' ? '0' : null, |
|
| 127 |
'bottom': this.position === 'top' ? 'initial' : null, |
|
| 128 |
}; |
|
| 129 |
} |
|
| 130 |
} |
|
| 131 |
|
|
| 132 |
afterDismissAnimation(evt: AnimationTransitionEvent) {
|
|
| 133 |
if (evt.toState === 'topOut' || |
|
| 134 |
evt.toState === 'bottomOut') {
|
|
| 135 |
this.isSeen = true; |
|
| 136 |
this.isSeenEvt.emit(this.isSeen); |
|
| 137 |
} |
|
| 138 |
} |
|
| 139 |
|
|
| 140 |
public dismiss(evt?: MouseEvent): void {
|
|
| 141 |
if (evt) {
|
|
| 142 |
evt.preventDefault(); |
|
| 143 |
} |
|
| 144 |
|
|
| 145 |
this._service.storeCookie(); |
|
| 146 |
this.animation = this.position === 'top' ? 'topOut' : 'bottomOut'; |
|
| 147 |
} |
|
| 148 |
} |
|
| modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/cookie-law/icons.ts | ||
|---|---|---|
| 1 |
/** |
|
| 2 |
* angular2-cookie-law |
|
| 3 |
* |
|
| 4 |
* Copyright 2016-2017, @andreasonny83, All rights reserved. |
|
| 5 |
* |
|
| 6 |
* @author: @andreasonny83 <andreasonny83@gmail.com> |
|
| 7 |
*/ |
|
| 8 |
|
|
| 9 |
export const closeIcon: string = ` |
|
| 10 |
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> |
|
| 11 |
<path d="M377.047 184.198q0 8.26-6.037 14.297L313.505 256l57.505 57.505q6.037 6.037 6.037 14.297 0 8.578-6.037 14.615l-28.593 28.593q-6.037 6.037-14.615 6.037-8.26 0-14.297-6.037L256 313.505l-57.505 57.505q-6.037 6.037-14.297 6.037-8.578 0-14.615-6.037l-28.593-28.593q-6.037-6.037-6.037-14.615 0-8.26 6.037-14.297L198.495 256l-57.505-57.505q-6.037-6.037-6.037-14.297 0-8.578 6.037-14.615l28.593-28.593q6.037-6.037 14.615-6.037 8.26 0 14.297 6.037L256 198.495l57.505-57.505q6.037-6.037 14.297-6.037 8.578 0 14.615 6.037l28.593 28.593q6.037 6.037 6.037 14.615zM500 256q0-66.401-32.724-122.477-32.724-56.075-88.799-88.799Q322.401 12 256 12q-66.401 0-122.477 32.724-56.075 32.724-88.799 88.799Q12 189.599 12 256q0 66.401 32.724 122.477 32.724 56.075 88.799 88.799Q189.599 500 256 500q66.401 0 122.477-32.724 56.075-32.724 88.799-88.799Q500 322.401 500 256z"></path> |
|
| 12 |
</svg> |
|
| 13 |
`; |
|
| modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/cookie-law/cookie-law.css | ||
|---|---|---|
| 1 |
.cookie-law-wrapper a {
|
|
| 2 |
color: #bbb; |
|
| 3 |
-webkit-transition: color .2s; |
|
| 4 |
transition: color .2s; |
|
Also available in: Unified diff
added cookie-law banner - 403 authorization via ui and new usage-stats pages