Merge from Develop for Monitor production release #3

Merged
k.triantafyllou merged 25 commits from develop into master 2023-04-19 15:04:36 +02:00
42 changed files with 470 additions and 392 deletions

View File

@ -1,11 +1,5 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<div>
<div class="uk-text-background uk-text-bold uk-text-small">Manage Classes</div>
<h1 class="uk-h6 uk-margin-remove">Super Admin</h1>
</div>
</div>
<admin-tabs tab="class"></admin-tabs>
<ul class="uk-subnav uk-subnav-pill uk-margin-medium-top">
<li [class.uk-active]="filterForm.get('type').value === 'all'" class="uk-margin-small-bottom"><a

View File

@ -1,27 +1,27 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<a routerLink="../" [queryParams]=" { 'pageId': pageId }" class="uk-button uk-button-link uk-margin-medium-right">
<icon name="west" ratio="2" [flex]="true"></icon>
</a>
<div>
<div class="uk-text-background uk-text-bold uk-text-small">
Admin Dashboard - {{pageHelpContent ? 'Update ' : 'Add new '}} class help text
<div class="uk-section-xsmall uk-margin-top uk-container">
<div class="uk-flex-middle uk-grid" uk-grid>
<div class="uk-width-expand">
<a routerLink="../" [queryParams]=" { 'pageId': pageId }" class="uk-flex uk-flex-middle uk-h5 uk-link-reset">
<span class="uk-margin-right">
<icon name="west" ratio="1.7" [flex]="true"></icon>
</span>
<h1 *ngIf="page" class="uk-h5 uk-margin-remove">
{{page.name}} - {{pageHelpContent ? 'Update ' : 'Add new '}} class help text
<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span>
</h1>
</a>
</div>
<div class="uk-width-auto">
<button class="uk-button uk-button-default uk-margin-right"
(click)="resetCustom()" [class.uk-disabled]="!myForm.dirty"
[disabled]="!myForm.dirty || showLoading">Reset
</button>
<button class="uk-button uk-button-primary" [class.uk-disabled]="myForm.invalid || !myForm.dirty || myForm.disabled"
(click)="saveCustom()" [disabled]="myForm.invalid ||!myForm.dirty || myForm.disabled || showLoading">Save
</button>
</div>
<h1 *ngIf="page" class="uk-h6 uk-margin-remove">{{page.name}}<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span></h1>
</div>
</div>
</div>
<div actions>
<div class="uk-section-xsmall uk-container">
<div class="uk-flex uk-flex-center uk-flex-right@m">
<button class="uk-button uk-button-default uk-margin-right"
(click)="resetCustom()" [class.uk-disabled]="!myForm.dirty"
[disabled]="!myForm.dirty || showLoading">Reset
</button>
<button class="uk-button uk-button-primary" [class.uk-disabled]="myForm.invalid || !myForm.dirty || myForm.disabled"
(click)="saveCustom()" [disabled]="myForm.invalid ||!myForm.dirty || myForm.disabled || showLoading">Save
</button>
</div>
</div>
</div>
@ -58,7 +58,7 @@
</div>
</div>
<div [ngClass]="parentClass">
<ckeditor (change)="contentChanged()"
<ckeditor #ckEditor (change)="contentChanged()"
[readonly]="false"
debounce="500"
[formControl]="myForm.get('content')"

View File

@ -1,4 +1,4 @@
import {Component, OnInit} from '@angular/core';
import {ChangeDetectorRef, Component, OnInit, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {UntypedFormBuilder, UntypedFormGroup, Validators} from '@angular/forms';
import {Page} from '../../utils/entities/adminTool/page';
@ -9,13 +9,14 @@ import {Subscriber, Subscription, zip} from 'rxjs';
import {DivHelpContent} from '../../utils/entities/adminTool/div-help-content';
import {NotificationHandler} from "../../utils/notification-handler";
import {ClearCacheService} from "../../services/clear-cache.service";
import {CKEditorComponent} from "ng2-ckeditor";
@Component({
selector: 'class-content-form',
templateUrl: './class-help-content-form.component.html',
})
export class ClassContentFormComponent implements OnInit {
myForm: UntypedFormGroup;
portal: string;
parentClass: string;
@ -27,25 +28,27 @@ export class ClassContentFormComponent implements OnInit {
public showLoading: boolean = true;
private subs: Subscription[] = [];
public pageHelpContent: DivHelpContent;
@ViewChild('ckEditor') ckEditor: CKEditorComponent;
constructor(private route: ActivatedRoute, private _router: Router, private _fb: UntypedFormBuilder,
private _helpContentService: HelpContentService, private _clearCacheService: ClearCacheService) {
private cdr: ChangeDetectorRef, private _helpContentService: HelpContentService,
private _clearCacheService: ClearCacheService) {
}
ngOnInit() {
this.portal = (this.route.snapshot.data.portal) ? this.route.snapshot.data.portal : this.route.snapshot.params[this.route.snapshot.data.param];
this.parentClass = this.route.snapshot.data.parentClass;
this.subs.push(this.route.queryParams.subscribe(params => {
this.pageId = params['pageId'];
this.myForm = this.form;
this.pageContentId = params['pageContentId'];
if (!this.pageId) {
this._router.navigate(['../'], {relativeTo: this.route});
}
this.getInfo(this.pageId);
}));
this.pageId = params['pageId'];
this.myForm = this.form;
this.pageContentId = params['pageContentId'];
if (!this.pageId) {
this._router.navigate(['../'], {relativeTo: this.route});
}
this.getInfo(this.pageId);
}));
}
ngOnDestroy() {
this.subs.forEach(value => {
if (value instanceof Subscriber) {
@ -53,7 +56,7 @@ export class ClassContentFormComponent implements OnInit {
}
});
}
getInfo(pageId: string) {
this.showLoading = true;
let obs = zip(this._helpContentService.getPageByPortal(pageId, this.properties.adminToolsAPIURL, this.portal),
@ -66,25 +69,44 @@ export class ClassContentFormComponent implements OnInit {
}
this.setOptions(results[1]);
if (!this.pageContentId) {
this.updateForm(null);
this.updateForm(null);
this.showLoading = false;
this.initCKEditor();
} else {
this.subs.push(this._helpContentService.getDivHelpContent( this.pageContentId, this.properties.adminToolsAPIURL, this.portal).subscribe(pageHelpContent=>{
this.pageHelpContent = pageHelpContent;
if (this.properties.adminToolsPortalType != this.page.portalType) {
this._router.navigate(['../'], {relativeTo: this.route});
}
this.updateForm(this.pageHelpContent);
this.showLoading = false;
},
this.subs.push(this._helpContentService.getDivHelpContent(this.pageContentId, this.properties.adminToolsAPIURL, this.portal).subscribe(pageHelpContent => {
this.pageHelpContent = pageHelpContent;
if (this.properties.adminToolsPortalType != this.page.portalType) {
this._router.navigate(['../'], {relativeTo: this.route});
}
this.updateForm(this.pageHelpContent);
this.showLoading = false;
this.initCKEditor();
},
error => {
this.handleError('System error retrieving content by id '+ this.pageContentId, error)
}));
this.handleError('System error retrieving content by id ' + this.pageContentId, error)
}));
}
}));
}
private initCKEditor() {
this.cdr.detectChanges();
if (this.ckEditor) {
this.ckEditor.instance.on('mode', () => {
let editor = this.ckEditor.instance;
if (editor.mode === 'source') {
let editable = editor.editable();
editable.attachListener(editable, 'input', () => {
this.myForm.get('content').setValue(editor.getData());
this.myForm.get('content').markAsDirty();
this.cdr.detectChanges();
});
}
});
}
}
private updateForm(pageHelpContent: DivHelpContent) {
this.pageHelpContent = pageHelpContent;
this.myForm = this.form;
@ -93,48 +115,48 @@ export class ClassContentFormComponent implements OnInit {
this.myForm.get('divId').disable();
}
this.myForm.markAsPristine();
}
public setOptions(divIds) {
this.classOptions = [];
for(let divid of divIds){
this.classOptions.push({label:divid.name, value:divid._id});
for (let divid of divIds) {
this.classOptions.push({label: divid.name, value: divid._id});
}
}
public get form() {
return this._fb.group({
divId: ['', Validators.required],
content: ['', Validators.required],
isActive: true,
portal: this.portal,
_id : '',
_id: '',
});
}
public reset() {
this.myForm.patchValue({
divId: ['', Validators.required],
content: ['', Validators.required],
isActive: true,
portal: '',
_id : '',
_id: '',
});
this.myForm.markAsPristine();
}
handleError(message: string, error = null) {
if(error) {
if (error) {
console.error('Server responded: ' + error);
}
NotificationHandler.rise(message, 'danger');
this.showLoading = false;
}
public saveCustom() {
if (this.myForm.valid) {
this.showLoading = true;
@ -159,13 +181,13 @@ export class ClassContentFormComponent implements OnInit {
this.updateForm(this.pageHelpContent);
this.showLoading = false;
}
handleUpdateError(message: string, error) {
console.error('Server responded: ' + error);
NotificationHandler.rise(message, 'danger');
this.showLoading = false;
}
changeStatus() {
this.myForm.get('isActive').setValue(!this.myForm.get('isActive').value);
if (this.pageHelpContent && this.myForm.get('isActive').value != this.pageHelpContent.isActive || !this.pageHelpContent && !this.myForm.get('isActive').value) {
@ -174,7 +196,7 @@ export class ClassContentFormComponent implements OnInit {
this.myForm.get('isActive').markAsPristine()
}
}
contentChanged() {
if (this.pageHelpContent && this.myForm.get('content').value != this.pageHelpContent.content || !this.pageHelpContent && this.myForm.get('content').value != '') {
this.myForm.get('content').markAsDirty();

View File

@ -1,20 +1,15 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<a routerLink="../pages" class="uk-button uk-button-link uk-margin-medium-right">
<icon name="west" ratio="2" [flex]="true"></icon>
</a>
<div>
<div class="uk-text-background uk-text-bold uk-text-small">
Admin Dashboard - Manage class help texts
<div class="uk-section-xsmall uk-margin-top">
<div class="uk-flex-middle uk-grid" uk-grid>
<div class="uk-width-expand">
<a routerLink="../pages" class="uk-flex uk-flex-middle uk-h5 uk-link-reset">
<span class="uk-margin-right">
<icon name="west" ratio="1.7" [flex]="true"></icon>
</span>
<h1 *ngIf="page" class="uk-h5 uk-margin-remove">{{page.name}}</h1>
</a>
</div>
<h1 *ngIf="page" class="uk-h6 uk-margin-remove">{{page.name}}</h1>
</div>
</div>
</div>
<div actions>
<div class="uk-section-xsmall">
<div class="uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<div search-input [disabled]="showLoading" [expandable]="true" [searchControl]="filterForm" searchInputClass="outer" placeholder="Search helptext" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1">
</div>
<div>

View File

@ -1,11 +1,5 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<div>
<div class="uk-text-background uk-text-bold uk-text-small">Manage Entities</div>
<h1 class="uk-h6 uk-margin-remove">{{name?name:'Super Admin'}}</h1>
</div>
</div>
<admin-tabs tab="entity" [portal]="portal" [type]="type"></admin-tabs>
<ul *ngIf="!isPortalAdministrator" class="uk-subnav uk-subnav-pill uk-margin-medium-top">
<li [class.uk-active]="filterForm.get('status').value === 'all'"><a

View File

@ -1,27 +1,27 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<a routerLink="../" [queryParams]=" { 'pageId': pageId }" class="uk-button uk-button-link uk-margin-right">
<icon name="west" ratio="2" [flex]="true"></icon>
</a>
<div>
<div class="uk-text-background uk-text-bold uk-text-small">
Admin Dashboard - {{pageHelpContent ? 'Update ' : 'Add new '}} page help text
<div class="uk-section-xsmall uk-margin-top uk-container">
<div class="uk-flex-middle uk-grid" uk-grid>
<div class="uk-width-expand">
<a routerLink="../" [queryParams]=" { 'pageId': pageId }" class="uk-flex uk-flex-middle uk-h5 uk-link-reset">
<span class="uk-margin-right">
<icon name="west" ratio="1.7" [flex]="true"></icon>
</span>
<h1 *ngIf="page" class="uk-h5 uk-margin-remove">
{{page.name}} - {{pageHelpContent ? 'Update ' : 'Add new '}} page help text
<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span>
</h1>
</a>
</div>
<div class="uk-width-auto">
<button class="uk-button uk-button-default uk-margin-right"
(click)="resetCustom()" [class.uk-disabled]="!myForm.dirty"
[disabled]="!myForm.dirty || showLoading">Reset
</button>
<button class="uk-button uk-button-primary" [class.uk-disabled]="myForm.invalid || !myForm.dirty || myForm.disabled"
(click)="saveCustom()" [disabled]="myForm.invalid ||!myForm.dirty || myForm.disabled || showLoading">Save
</button>
</div>
<h1 *ngIf="page" class="uk-h6 uk-margin-remove">{{page.name}}<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span></h1>
</div>
</div>
</div>
<div actions>
<div class="uk-section-xsmall uk-container">
<div class="uk-flex uk-flex-center uk-flex-right@m">
<button class="uk-button uk-button-default uk-margin-right"
(click)="resetCustom()" [class.uk-disabled]="!myForm.dirty"
[disabled]="!myForm.dirty || showLoading">Reset
</button>
<button class="uk-button uk-button-primary" [class.uk-disabled]="myForm.invalid || !myForm.dirty || myForm.disabled"
(click)="saveCustom()" [disabled]="myForm.invalid || !myForm.dirty || myForm.disabled || showLoading">Save
</button>
</div>
</div>
</div>
@ -62,7 +62,7 @@
</div>
</div>
<div [ngClass]="parentClass">
<ckeditor (change)="contentChanged()"
<ckeditor #ckEditor (change)="contentChanged()"
[readonly]="false"
debounce="500"
[formControl]="myForm.get('content')"

View File

@ -1,4 +1,4 @@
import {Component, OnInit} from '@angular/core';
import {ChangeDetectorRef, Component, OnInit, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {UntypedFormBuilder, UntypedFormGroup, Validators} from '@angular/forms';
import {Page} from '../../utils/entities/adminTool/page';
@ -10,6 +10,7 @@ import {HelperFunctions} from '../../utils/HelperFunctions.class';
import {PageHelpContent} from '../../utils/entities/adminTool/page-help-content';
import {ClearCacheService} from "../../services/clear-cache.service";
import {NotificationHandler} from "../../utils/notification-handler";
import {CKEditorComponent} from "ng2-ckeditor";
@Component({
selector: 'page-content-form',
@ -29,9 +30,11 @@ export class PageContentFormComponent implements OnInit {
public showLoading: boolean = true;
private subs: Subscription[] = [];
public pageHelpContent: PageHelpContent;
@ViewChild('ckEditor') ckEditor: CKEditorComponent;
constructor(private route: ActivatedRoute, private _router: Router, private _fb: UntypedFormBuilder,
private _helpContentService: HelpContentService, private _clearCacheService: ClearCacheService) {
private cdr: ChangeDetectorRef, private _helpContentService: HelpContentService,
private _clearCacheService: ClearCacheService) {
}
ngOnInit() {
@ -80,12 +83,30 @@ export class PageContentFormComponent implements OnInit {
this.updateForm(this.pageHelpContent);
}
this.showLoading = false;
this.initCKEditor();
},
error => this.handleError('System error retrieving page with id: ' + pageId, error)
));
}
private initCKEditor() {
this.cdr.detectChanges();
if(this.ckEditor) {
this.ckEditor.instance.on('mode', () => {
let editor = this.ckEditor.instance;
if (editor.mode === 'source') {
let editable = editor.editable();
editable.attachListener(editable, 'input', () => {
this.myForm.get('content').setValue(editor.getData());
this.myForm.get('content').markAsDirty();
this.cdr.detectChanges();
});
}
});
}
}
private updateForm(pageHelpContent: PageHelpContent) {
this.pageHelpContent = pageHelpContent;
this.myForm = this.form;

View File

@ -1,20 +1,15 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<a routerLink="../pages" class="uk-button uk-button-link uk-margin-medium-right">
<icon name="west" ratio="2" [flex]="true"></icon>
</a>
<div>
<div class="uk-text-background uk-text-bold uk-text-small">
Admin Dashboard - Manage page help texts
<div class="uk-section-xsmall uk-margin-top">
<div class="uk-flex-middle uk-grid" uk-grid>
<div class="uk-width-expand">
<a routerLink="../pages" class="uk-flex uk-flex-middle uk-h5 uk-link-reset">
<span class="uk-margin-right">
<icon name="west" ratio="1.7" [flex]="true"></icon>
</span>
<h1 *ngIf="page" class="uk-h5 uk-margin-remove">{{page.name}}</h1>
</a>
</div>
<h1 *ngIf="page" class="uk-h6 uk-margin-remove">{{page.name}}</h1>
</div>
</div>
</div>
<div actions>
<div class="uk-section-xsmall">
<div class="uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<div search-input [disabled]="showLoading" [expandable]="true" [searchControl]="filterForm" searchInputClass="outer" placeholder="Search helptext" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1">
</div>
<div>

View File

@ -1,14 +1,5 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<ng-container *ngIf="showLogo">
<img [src]="entity | logoUrl" class="uk-margin-right uk-blend-multiply">
</ng-container>
<div>
<div class="uk-text-background uk-text-bold uk-text-small">Admin Dashboard - Manage Menus</div>
<h1 class="uk-h6 uk-margin-remove">{{name ? name : 'Super Admin'}}</h1>
</div>
</div>
<admin-tabs tab="menu" [portal]="portal" [type]="type"></admin-tabs>
</div>
<div actions>

View File

@ -1,11 +1,5 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<div>
<div class="uk-text-background uk-text-bold uk-text-small">Manage Pages</div>
<h1 class="uk-h6 uk-margin-remove">{{name ? name : 'Super Admin'}}</h1>
</div>
</div>
<admin-tabs tab="page" [portal]="portal" [type]="type"></admin-tabs>
<ul class="uk-subnav uk-subnav-pill uk-margin-medium-top">
<li [class.uk-active]="filterForm.get('type').value === 'all'"><a

View File

@ -1,11 +1,5 @@
<div page-content>
<div header>
<div class="uk-flex uk-flex-middle uk-margin-medium-top info">
<div>
<div class="uk-text-background uk-text-bold uk-text-small">Manage Portals</div>
<h1 class="uk-h6 uk-margin-remove">Super Admin</h1>
</div>
</div>
<admin-tabs tab="portal"></admin-tabs>
<ul class="uk-subnav uk-subnav-pill uk-margin-medium-top">
<li [class.uk-active]="filterForm.get('type').value === 'all'" class="uk-margin-small-bottom"><a

View File

@ -122,7 +122,9 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy {
ngOnDestroy() {
this.subscriptions.forEach(subscription => {
if (subscription instanceof (ResizeObserver || IntersectionObserver)) {
if (typeof ResizeObserver !== "undefined" && subscription instanceof ResizeObserver) {
subscription.disconnect();
} else if (typeof ResizeObserver !== "undefined" && subscription instanceof IntersectionObserver) {
subscription.disconnect();
}
});

View File

@ -85,7 +85,7 @@ export class LayoutService {
this.subscriptions.forEach(subscription => {
if (subscription instanceof Subscriber) {
subscription.unsubscribe();
} else if (subscription instanceof ResizeObserver) {
} else if (typeof ResizeObserver !== "undefined" && subscription instanceof ResizeObserver) {
subscription.disconnect();
}
})

View File

@ -5,10 +5,14 @@
</aside>
<div class="uk-hidden@m">
<div id="sidebar_offcanvas" #sidebar_offcanvas [attr.uk-offcanvas]="'overlay: true'">
<div class="uk-offcanvas-bar uk-padding-remove-horizontal">
<button class="uk-offcanvas-close uk-icon uk-close">
<icon name="close" ratio="1.5" visuallyHidden="close menu"></icon>
</button>
<div class="uk-offcanvas-bar uk-padding-remove">
<nav class="uk-navbar uk-background-default" uk-sticky>
<div class="uk-navbar-right">
<button class="uk-navbar-toggle uk-icon uk-close" (click)="closeOffcanvas()">
<icon name="close" ratio="1.5" visuallyHidden="close menu"></icon>
</button>
</div>
</nav>
<ng-container *ngTemplateOutlet="menu; context: {mobile: true}"></ng-container>
</div>
</div>
@ -25,10 +29,10 @@
</a>
</div>
<div *ngIf="items.length > 0" class="menu_section uk-margin-large-top" [class.mobile]="mobile" style="min-height: 30vh">
<ul #nav class="uk-list uk-nav uk-nav-parent-icon"
<ul #nav class="uk-list uk-nav uk-nav-parent-icon" [class.uk-list-large]="mobile"
[class.uk-nav-default]="!mobile" [class.uk-nav-primary]="mobile" uk-nav="duration: 400">
<ng-template ngFor [ngForOf]="items" let-item>
<li [class.uk-active]="item.isActive"
<li [class.uk-active]="item.isActive" [ngClass]="item.customClass"
[class.uk-parent]="item.items.length > 0">
<a [routerLink]="getItemRoute(item)" [title]="item.title" (click)="item.items.length === 0?closeOffcanvas():null"
[queryParams]="item.route?item.params:null" [queryParamsHandling]="item.route?queryParamsHandling:null" class="uk-flex uk-flex-middle">
@ -38,7 +42,7 @@
<span [class.hide-on-close]="item.icon" class="uk-width-expand@l uk-text-truncate uk-margin-small-left">{{item.title}}</span>
</a>
<ul *ngIf="item.items?.length > 0 && (isBrowser || item.isActive)" class="uk-nav-sub">
<li *ngFor="let subItem of item.items"
<li *ngFor="let subItem of item.items" [ngClass]="subItem.customClass"
[class.uk-active]="subItem.isActive">
<a [routerLink]="subItem.route?subItem.route:null" [title]="subItem.title" (click)="closeOffcanvas()"
[queryParams]="subItem.route?subItem.params:null" [queryParamsHandling]="subItem.route?queryParamsHandling:null">

View File

@ -32,6 +32,7 @@ export class SideBarComponent implements OnInit, AfterViewInit, OnDestroy, OnCha
@ViewChild("sidebar_offcanvas") sidebar_offcanvas: ElementRef;
public properties = properties;
private subscriptions: any[] = [];
private init: boolean = false;
constructor(private route: ActivatedRoute, private router: Router,
private sanitizer: DomSanitizer, private layoutService: LayoutService,
@ -48,18 +49,15 @@ export class SideBarComponent implements OnInit, AfterViewInit, OnDestroy, OnCha
}
ngAfterViewInit() {
if(this.nav && typeof UIkit !== "undefined") {
setTimeout(() => {
if(this.items[this.activeIndex]?.items?.length > 0) {
UIkit.nav(this.nav.nativeElement).toggle(this.activeIndex, true);
}
});
}
this.toggle(true);
}
ngOnChanges(changes: SimpleChanges) {
if(changes.activeItem || changes.activeSubItem || changes.items) {
this.setActiveMenuItem();
if(this.init && changes.items) {
this.toggle();
}
}
}
@ -72,6 +70,17 @@ export class SideBarComponent implements OnInit, AfterViewInit, OnDestroy, OnCha
});
}
toggle(init: boolean = false) {
this.init = this.init || init;
if(this.nav && typeof UIkit !== "undefined") {
setTimeout(() => {
if(this.items[this.activeIndex]?.items?.length > 0) {
UIkit.nav(this.nav.nativeElement).toggle(this.activeIndex, true);
}
});
}
}
get isBrowser() {
return this.platformId === 'browser';
}
@ -143,10 +152,6 @@ export class SideBarComponent implements OnInit, AfterViewInit, OnDestroy, OnCha
}
}
isTheActiveUrl(menuItemURL): boolean {
return (menuItemURL == this.router.url.split('?')[0])
}
public get open() {
return this.layoutService.open;
}

View File

@ -5,16 +5,16 @@ import {Subscription} from "rxjs";
@Component({
selector: 'sidebar-mobile-toggle',
template: `
<a *ngIf="activeSidebarItem" href="#sidebar_offcanvas" class="sidebar_mobile_toggle uk-link-reset uk-width-2-3 uk-flex uk-flex-middle" uk-toggle>
<a *ngIf="activeSidebarItem" href="#sidebar_offcanvas" class="sidebar_mobile_toggle uk-link-reset uk-width-3-5 uk-flex uk-flex-middle" uk-toggle>
<div *ngIf="activeSidebarItem.icon && (activeSidebarItem.icon.svg || activeSidebarItem.icon.name)" class="uk-width-auto">
<icon class="menu-icon" [customClass]="activeSidebarItem.icon.class" [name]="activeSidebarItem.icon.name" ratio="0.9" [svg]="activeSidebarItem.icon.svg" [flex]="true"></icon>
<icon class="menu-icon" [customClass]="activeSidebarItem.icon.class" [name]="activeSidebarItem.icon.name" ratio="0.8" [svg]="activeSidebarItem.icon.svg" [flex]="true"></icon>
</div>
<span class="uk-width-expand uk-text-truncate uk-margin-small-left uk-text-bolder">
{{activeSidebarItem.name}}
<span *ngIf="activeSidebarItem.subItem">- {{activeSidebarItem.subItem.name}}</span>
</span>
<div class="uk-width-auto uk-margin-small-left">
<icon name="arrow_drop_down" ratio="1.5" [flex]="true"></icon>
<icon name="arrow_right" ratio="1.4" [flex]="true"></icon>
</div>
</a>
`

View File

@ -77,7 +77,6 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
this.updateLists();
this.userManagementService.getUserInfo().subscribe(user => {
this.user = user;
console.log(this.canDelete)
});
}

View File

@ -1,4 +1,3 @@
import {HttpClient} from "@angular/common/http";
import {ChangeDetectorRef, Component, ElementRef, Input, ViewChild} from "@angular/core";
import {FormBuilder, FormControl, UntypedFormArray} from "@angular/forms";
import {ActivatedRoute, Router} from "@angular/router";
@ -8,6 +7,7 @@ import {properties} from "../../../../environments/environment";
import {StringUtils} from "../../utils/string-utils.class";
import {debounceTime, distinctUntilChanged} from "rxjs/operators";
import {HelperFunctions} from "../../utils/HelperFunctions.class";
import {ISVocabulariesService} from "../../utils/staticAutoComplete/ISVocabularies.service";
import Timeout = NodeJS.Timeout;
declare var UIkit;
@ -44,7 +44,7 @@ export class FosSelectionComponent {
public sliderInit: boolean = false;
constructor(
private httpClient: HttpClient,
private vocabulariesService: ISVocabulariesService,
private fb: FormBuilder,
private cdr: ChangeDetectorRef,
private route: ActivatedRoute,
@ -53,7 +53,7 @@ export class FosSelectionComponent {
ngOnInit() {
this.loading = true;
this.httpClient.get(this.properties.domain+'/assets/common-assets/vocabulary/fos.json').subscribe(data => {
this.vocabulariesService.getFos(properties).subscribe(data => {
this.fos = data['fos'];
this.convertFosToOptions();
if (typeof document !== 'undefined') {
@ -240,4 +240,4 @@ export class FosSelectionComponent {
return this.contentHeight - this.searchElement.nativeElement.offsetHeight - 100;
}
}
}
}

View File

@ -14,6 +14,7 @@ import {SEOService} from "../sharedComponents/SEO/SEO.service";
import {PiwikService} from "../utils/piwik/piwik.service";
import {debounceTime, distinctUntilChanged} from "rxjs/operators";
import Timeout = NodeJS.Timeout;
import {ISVocabulariesService} from "../utils/staticAutoComplete/ISVocabularies.service";
declare var UIkit;
@ -49,7 +50,7 @@ export class FosComponent implements OnInit, OnDestroy {
public sliderInit: boolean = false;
constructor(
private httpClient: HttpClient,
private vocabulariesService: ISVocabulariesService,
private fb: FormBuilder,
private location: Location,
private route: ActivatedRoute,
@ -70,7 +71,7 @@ export class FosComponent implements OnInit, OnDestroy {
this.updateUrl(this.url);
this.updateTitle(this.pageTitle);
this.updateDescription(this.pageDescription);
this.httpClient.get(properties.domain+'/assets/common-assets/vocabulary/fos.json').subscribe(data => {
this.vocabulariesService.getFos(properties).subscribe(data => {
this.fos = data['fos'];
this.convertFosToOptions();
if (typeof document !== 'undefined') {

View File

@ -55,22 +55,19 @@
</div>
<ng-template #graph_and_feedback_template>
<div class="uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!dataProviderInfo">
<div class="uk-flex uk-flex-between uk-flex-wrap uk-margin-small-bottom uk-margin-small-top" [class.uk-invisible]="!dataProviderInfo">
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2">
<icon name="graph" customClass="text-graph"></icon>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span>
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
</div>
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
</a>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta uk-width-1-1 uk-width-auto@l">
Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
<!--Feedback-->
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-expand uk-text-right">
<span class="uk-text-meta uk-text-xsmall">See an issue?</span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall"> Report it here</a>
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-1-1 uk-width-auto@l">
<span class="uk-text-meta uk-text-xsmall">Found an issue? </span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a>
</div>
</div>
</ng-template>

View File

@ -54,22 +54,19 @@
<!-- Graph and feedback -->
<ng-template #graph_and_feedback_template>
<div class="uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!organizationInfo">
<div class="uk-flex uk-flex-between uk-flex-wrap uk-margin-small-bottom uk-margin-small-top" [class.uk-invisible]="!organizationInfo">
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2">
<icon name="graph" customClass="text-graph"></icon>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span>
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
</div>
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
</a>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta uk-width-1-1 uk-width-auto@l">
Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
<!--Feedback-->
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-expand uk-text-right">
<span class="uk-text-meta uk-text-xsmall">See an issue?</span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall"> Report it here</a>
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-1-1 uk-width-auto@l">
<span class="uk-text-meta uk-text-xsmall">Found an issue? </span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a>
</div>
</div>
</ng-template>

View File

@ -94,22 +94,19 @@
</div>
<ng-template #graph_and_feedback_template>
<div class="uk-flex uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!projectInfo">
<div class="uk-flex uk-flex-between uk-flex-wrap uk-margin-small-bottom uk-margin-small-top" [class.uk-invisible]="!projectInfo">
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2">
<icon name="graph" customClass="text-graph"></icon>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span>
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
</div>
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
</a>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta uk-width-1-1 uk-width-auto@l">
Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
<!--Feedback-->
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-expand uk-text-right">
<span class="uk-text-meta uk-text-xsmall">See an issue?</span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall"> Report it here</a>
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-1-1 uk-width-auto@l">
<span class="uk-text-meta uk-text-xsmall">Found an issue? </span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a>
</div>
</div>
</ng-template>

View File

@ -91,21 +91,18 @@
</div>
<ng-template #graph_and_feedback_template>
<div class="uk-flex uk-margin-small-bottom uk-margin-small-top" [class.uk-invisible]="!resultLandingInfo">
<div class="uk-flex uk-flex-between uk-flex-wrap uk-margin-small-bottom uk-margin-small-top" [class.uk-invisible]="!resultLandingInfo">
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2">
<icon name="graph" customClass="text-graph"></icon>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span>
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
</div>
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
</a>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta uk-width-1-1 uk-width-auto@l">
Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
<!--Feedback-->
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-expand uk-text-right">
<span class="uk-text-meta uk-text-xsmall">See an issue? </span>
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-1-1 uk-width-auto@l">
<span class="uk-text-meta uk-text-xsmall">Found an issue? </span>
<a (click)="feedbackClicked()" class="uk-text-xsmall">Give us feedback</a>
</div>
</div>

View File

@ -43,8 +43,8 @@ export class UserComponent {
this.loginUrl = this.properties.loginUrl;
if (typeof document !== 'undefined') {
this.server = false;
this.userManagementsService.getUserInfo().subscribe( user => {
this.user = user;
this.userManagementsService.updateUserInfo( () => {
this.user = this.userManagementsService.user;
this.loggedIn = !!this.user;
this.errorMessage = "";
this.loading = true;

View File

@ -1,10 +1,16 @@
import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges} from '@angular/core';
import {Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {Session, User} from './utils/helper.class';
import {RouterHelper} from '../utils/routerHelper.class';
import {Subscriber} from "rxjs";
import {MenuItem} from "../sharedComponents/menu";
import {UserManagementService} from "../services/user-management.service";
import {
NotificationConfiguration,
NotificationsSidebarComponent
} from "../notifications/notifications-sidebar/notifications-sidebar.component";
declare var UIkit;
@Component({
selector: 'user-mini',
@ -25,6 +31,7 @@ import {UserManagementService} from "../services/user-management.service";
<ul class="uk-nav uk-navbar-dropdown-nav">
<ng-container *ngFor="let item of userMenuItems ">
<li *ngIf="item.needsAuthorization && isAuthorized || !item.needsAuthorization"
[ngClass]="item.customClass"
[class.uk-active]="isTheActiveSubMenu(item)">
<a *ngIf="item.route" [routerLink]="item.route"
[queryParams]="item.params">{{item.title}}</a>
@ -41,42 +48,67 @@ import {UserManagementService} from "../services/user-management.service";
<icon name="login" ratio="1.5" [flex]="true"></icon>
</a>
<a *ngIf="loggedIn && mobileView" href="#account" class="login uk-icon" uk-toggle>
<svg height="30" width="30">
<circle cx="15" cy="15" r="15" stroke-width="2"></circle>
<text x="50%" y="50%" text-anchor="middle" dy=".35em" font-size="14">
{{firstLetters ? firstLetters : 'AN'}}
</text>
</svg>
<span class="uk-position-relative">
<svg height="30" width="30">
<circle cx="15" cy="15" r="15" stroke-width="2"></circle>
<text x="50%" y="50%" text-anchor="middle" dy=".35em" font-size="14">
{{firstLetters ? firstLetters : 'AN'}}
</text>
</svg>
<span *ngIf="notificationsSidebar?.unreadCount > 0" class="uk-text-secondary notification">
<icon name="circle" ratio="0.8"></icon>
</span>
</span>
</a>
<div *ngIf="loggedIn" id="account" class="uk-offcanvas" uk-offcanvas="flip: true; overlay: true">
<div class="uk-offcanvas-bar uk-padding-remove-horizontal">
<button class="uk-offcanvas-close uk-icon uk-close">
<icon name="close" ratio="1.5" visuallyHidden="close menu"></icon>
</button>
<div class="uk-padding uk-flex uk-flex-middle">
<div class="login">
<svg height="60" width="60" style="max-width: 60px; height: 60px;">
<circle cx="30" cy="30" r="20" stroke-width="2"></circle>
<text x="50%" y="50%" text-anchor="middle" dy=".4em" font-size="16">
{{firstLetters ? firstLetters : 'AN'}}
</text>
</svg>
<div *ngIf="loggedIn" #account id="account" class="uk-offcanvas" uk-offcanvas="flip: true; overlay: true;">
<div class="uk-offcanvas-bar uk-padding-remove">
<nav class="uk-navbar uk-background-default" uk-sticky>
<div class="uk-navbar-right">
<button class="uk-navbar-toggle uk-icon uk-close" (click)="closeCanvas(account)">
<icon name="close" ratio="1.5" visuallyHidden="close account"></icon>
</button>
</div>
<h5 class="uk-margin-small-left uk-margin-remove-bottom uk-margin-remove-top uk-text-truncate">
{{user.fullname}}
</h5>
</div>
<ul class="uk-nav uk-nav-primary uk-list uk-margin-top uk-nav-parent-icon" uk-nav>
<ng-container *ngFor="let item of userMenuItems ">
<li *ngIf="item.needsAuthorization && isAuthorized || !item.needsAuthorization">
<a *ngIf="item.route" [routerLink]="item.route" (click)="closeCanvas()">{{item.title}}</a>
<a *ngIf="!item.route && item.url" (click)="closeCanvas()" [href]="item.url" [class.custom-external]="item.target != '_self'"
[target]="item.target">{{item.title}}</a>
</li>
</ng-container>
<li *ngIf="userMenuItems.length > 0" class="uk-nav-divider"></li>
<li><a (click)="logOut()">Log out</a></li>
</ul>
</nav>
<ng-container *ngIf="!showNotifications">
<div class="uk-padding uk-padding-remove-top uk-flex uk-flex-middle">
<div class="login">
<svg height="60" width="60" style="max-width: 60px; height: 60px;">
<circle cx="30" cy="30" r="20" stroke-width="2"></circle>
<text x="50%" y="50%" text-anchor="middle" dy=".4em" font-size="16">
{{firstLetters ? firstLetters : 'AN'}}
</text>
</svg>
</div>
<h5 class="uk-margin-small-left uk-margin-remove-bottom uk-margin-remove-top uk-text-truncate">
{{user.fullname}}
</h5>
</div>
<ul class="uk-nav uk-nav-primary uk-list uk-margin-top uk-nav-parent-icon" uk-nav>
<ng-container *ngFor="let item of userMenuItems ">
<li *ngIf="item.needsAuthorization && isAuthorized || !item.needsAuthorization" [ngClass]="item.customClass">
<a *ngIf="item.route" [routerLink]="item.route" (click)="closeCanvas(account)">{{item.title}}</a>
<a *ngIf="!item.route && item.url" (click)="closeCanvas(account)" [href]="item.url" [class.custom-external]="item.target != '_self'"
[target]="item.target">{{item.title}}</a>
</li>
</ng-container>
<ng-container *ngIf="notificationConfiguration">
<li *ngIf="userMenuItems.length > 0" class="uk-nav-divider"></li>
<li *ngIf="notificationConfiguration">
<a (click)="toggleNotifications()">
<div class="uk-flex uk-flex-middle uk-width-1-1">
<span class="uk-width-expand">Notifications</span>
<icon *ngIf="notificationsSidebar?.unreadCount > 0" class="uk-margin-small-left uk-text-secondary uk-margin-right" name="circle" [flex]="true" ratio="0.8"></icon>
</div>
</a>
</li>
</ng-container>
<li *ngIf="userMenuItems.length > 0" class="uk-nav-divider"></li>
<li><a (click)="logOut()">Log out</a></li>
</ul>
</ng-container>
<notification-sidebar [class.uk-hidden]="!showNotifications" #notificationsSidebar *ngIf="notificationConfiguration" [mobile]="true"
(showNotificationsEmitter)="showNotifications = $event"
[configuration]="notificationConfiguration" [user]="user"></notification-sidebar>
</div>
</div>
</li>
@ -95,7 +127,9 @@ export class UserMiniComponent implements OnInit, OnChanges {
@Input() logInUrl;
@Input() logOutUrl;
@Input() cookieDomain;
@Output() closeCanvasEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();
@Input() notificationConfiguration: NotificationConfiguration;
@ViewChild('notificationsSidebar') notificationsSidebar: NotificationsSidebarComponent;
public showNotifications = false;
private subscriptions = [];
constructor(private router: Router, private route: ActivatedRoute, private userManagementService: UserManagementService) {
@ -122,8 +156,8 @@ export class UserMiniComponent implements OnInit, OnChanges {
});
}
closeCanvas() {
this.closeCanvasEmitter.emit(true);
closeCanvas(canvas) {
UIkit.offcanvas(canvas).hide();
}
initUser() {
@ -166,4 +200,8 @@ export class UserMiniComponent implements OnInit, OnChanges {
this.firstLetters += matches.join('');
}
}
toggleNotifications() {
this.showNotifications = !this.showNotifications;
}
}

View File

@ -7,10 +7,11 @@ import {UserMiniComponent} from "./userMini.component";
import {IconsModule} from "../utils/icons/icons.module";
import {IconsService} from "../utils/icons/icons.service";
import {login} from "../utils/icons/icons";
import {NotificationsSidebarModule} from "../notifications/notifications-sidebar/notifications-sidebar.module";
@NgModule({
imports: [
CommonModule, FormsModule, RouterModule, IconsModule
CommonModule, FormsModule, RouterModule, IconsModule, NotificationsSidebarModule
],
declarations: [
UserMiniComponent

View File

@ -165,6 +165,7 @@ export class Indicator {
visibility: Visibility;
defaultId: string;
indicatorPaths: IndicatorPath[];
descriptionOverlay: boolean = false;
constructor(name: string, description: string, additionalDescription:string, type: IndicatorType, width: IndicatorSize,height: IndicatorSize, visibility: Visibility, indicatorPaths: IndicatorPath[], defaultId: string = null) {
this._id = null;

View File

@ -5,7 +5,7 @@
}
#notifications .notification-list {
padding: @global-medium-gutter 0 @global-medium-gutter @global-medium-gutter;
padding: 0 @global-medium-gutter;
}
#notifications .notification-list:not(:last-child) {
@ -17,7 +17,7 @@
#notifications .notification-list ul {
overflow: auto;
padding: 20px @global-medium-gutter 20px 0;
height: calc(100% - 104px);
height: calc(100% - 150px);
}
#notifications .notification-list ul > li:nth-child(n+2){
@ -29,6 +29,6 @@
}
#notifications .notification {
padding: @global-medium-gutter @global-medium-gutter;
padding: 0 @global-medium-gutter @global-medium-gutter @global-medium-gutter;
overflow: auto;
}

View File

@ -1,4 +1,14 @@
import {Component, Input, OnDestroy, OnInit, ViewEncapsulation} from "@angular/core";
import {
Component,
ElementRef,
EventEmitter,
Input,
OnDestroy,
OnInit,
Output,
ViewChild,
ViewEncapsulation
} from "@angular/core";
import {Notification} from "../notifications";
import {NotificationService} from "../notification.service";
import {Subscription} from "rxjs";
@ -8,71 +18,92 @@ import {Option} from "../../sharedComponents/input/input.component";
declare var UIkit;
export class NotificationConfiguration {
availableGroups: Option[] = [];
entities: string[] = [];
service: string;
}
@Component({
selector: 'notification-sidebar',
template: `
<div id="notifications-switcher" uk-toggle="" href="#notifications" class="uk-offcanvas-switcher uk-flex uk-flex-middle uk-flex-center">
<div *ngIf="!mobile" id="notifications-switcher" uk-toggle="" href="#notifications" class="uk-offcanvas-switcher uk-flex uk-flex-middle uk-flex-center">
<icon name="mail" ratio="1.5" customClass="uk-text-background" flex="true" visuallyHidden="Notifications"></icon>
<span [class.uk-hidden]="unreadCount === 0" class="uk-offcanvas-count uk-flex uk-flex-middle uk-flex-center">
{{unreadCount}}
</span>
</div>
<div id="notifications" class="uk-offcanvas" uk-offcanvas="flip: true; overlay: true;">
<div class="uk-offcanvas-bar uk-padding-remove">
<button class="uk-offcanvas-close uk-close uk-icon" type="button">
<icon name="close" ratio="1.5" visuallyHidden="close"></icon>
</button>
<ng-template [ngIf]="!notification">
<div class="notification-list uk-position-relative">
<h4>Notifications</h4>
<div class="uk-flex uk-flex-right@m uk-flex-center uk-padding uk-padding-remove-vertical">
<button [disabled]="unreadCount === 0" (click)="readAll()" class="uk-button uk-button-link">Mark As Read ({{unreadCount}})</button>
</div>
<h6 *ngIf="notifications.length == 0" class="uk-position-center uk-margin-remove">No notifications</h6>
<ul *ngIf="notifications.length > 0" class="uk-list">
<li *ngFor="let notification of notifications; let i=index" class="clickable" (click)="select(notification)">
<div class="uk-grid uk-grid-small" uk-grid>
<notification-user [name]="notification.name" [surname]="notification.surname" [outline]="true"
colorClass="uk-text-secondary"></notification-user>
<div class="uk-width-expand">
<div class="uk-width-1-1 uk-flex uk-flex-middle">
<div class="uk-width-expand multi-line-ellipsis lines-2">
<p class="uk-margin-remove" [class.uk-text-light-grey]="notification.read">
{{notification.preview}}
</p>
</div>
<div class="uk-margin-left uk-flex uk-flex-center uk-text-secondary">
<icon *ngIf="!notification.read" name="circle" ratio="0.6" visuallyHidden="unread"></icon>
</div>
</div>
<span class="uk-text-secondary uk-text-small">{{getDate(notification.date)}}</span>
</div>
</div>
</li>
</ul>
</div>
<div *ngIf="availableGroups.length > 0" [availableGroups]="availableGroups" [entities]="entities" [service]="service" notify-form class="notify"></div>
</ng-template>
<div *ngIf="notification" class="notification">
<div class="uk-flex uk-flex-middle uk-margin-medium-bottom">
<span class="uk-text-secondary clickable" (click)="back($event)">
<icon ratio="1.5" name="west" visuallyHidden="back"></icon>
<ng-template #main>
<ng-container *ngIf="!notification">
<div class="notification-list uk-position-relative">
<h4 class="uk-flex uk-flex-middle clickable uk-margin-remove-top uk-margin-medium-bottom" (click)="showNotificationsEmitter.emit(false)">
<span *ngIf="mobile" class="uk-margin-right">
<icon ratio="1.5" name="west" visuallyHidden="back" [flex]="true"></icon>
</span>
<h4 *ngIf="notification.title" class="uk-text-bold uk-margin-left">{{notification.title}}</h4>
<div class="uk-text-bold">Notifications</div>
</h4>
<div class="uk-flex uk-flex-right@m uk-flex-center uk-padding uk-padding-remove-vertical">
<button [disabled]="unreadCount === 0" (click)="readAll()" class="uk-button uk-button-link">Mark As Read ({{unreadCount}})</button>
</div>
<div class="uk-flex uk-flex-middle uk-margin-medium-bottom">
<notification-user [name]="notification.name" [surname]="notification.surname" colorClass="uk-text-secondary" [outline]="true"></notification-user>
<div class="uk-margin-left">
{{notification.name + ' ' + notification.surname}}<br>
<span style="opacity: 0.8;" class="uk-text-small uk-margin-small-top">
<h6 *ngIf="notifications.length == 0" class="uk-position-center uk-margin-remove">No notifications</h6>
<ul *ngIf="notifications.length > 0" class="uk-list">
<li *ngFor="let notification of notifications; let i=index" class="clickable" (click)="select(notification)">
<div class="uk-grid uk-grid-small" uk-grid>
<notification-user [name]="notification.name" [surname]="notification.surname" [outline]="true"
colorClass="uk-text-secondary"></notification-user>
<div class="uk-width-expand">
<div class="uk-width-1-1 uk-flex uk-flex-middle">
<div class="uk-width-expand multi-line-ellipsis lines-2">
<p class="uk-margin-remove" [class.uk-text-light-grey]="notification.read">
{{notification.preview}}
</p>
</div>
<div class="uk-margin-left uk-flex uk-flex-center uk-text-secondary">
<icon *ngIf="!notification.read" name="circle" ratio="0.6" visuallyHidden="unread"></icon>
</div>
</div>
<span class="uk-text-secondary uk-text-small">{{getDate(notification.date)}}</span>
</div>
</div>
</li>
</ul>
</div>
<div *ngIf="configuration.availableGroups.length > 0" [availableGroups]="configuration.availableGroups" [entities]="configuration.entities" [service]="configuration.service" notify-form class="notify"></div>
</ng-container>
<div *ngIf="notification" class="notification">
<h4 class="uk-flex uk-flex-middle clickable uk-margin-remove-top uk-margin-medium-bottom" (click)="back($event)">
<span class="uk-margin-right">
<icon ratio="1.5" name="west" visuallyHidden="back" [flex]="true"></icon>
</span>
<div *ngIf="notification.title" class="uk-text-bold">{{notification.title}}</div>
</h4>
<div class="uk-flex uk-flex-middle uk-margin-medium-bottom">
<notification-user [name]="notification.name" [surname]="notification.surname" colorClass="uk-text-secondary" [outline]="true"></notification-user>
<div class="uk-margin-left">
{{notification.name + ' ' + notification.surname}}<br>
<span style="opacity: 0.8;" class="uk-text-small uk-margin-small-top">
{{notification.date | date:'medium'}} ({{getDate(notification.date)}})
</span>
</div>
</div>
<div [innerHTML]="notification.message | safeHtml">
</div>
</div>
<div [innerHTML]="notification.message | safeHtml">
</div>
</div>
</ng-template>
<div *ngIf="!mobile" #canvas id="notifications" class="uk-offcanvas" uk-offcanvas="flip: true; overlay: true;">
<div class="uk-offcanvas-bar uk-padding-remove">
<nav class="uk-navbar uk-background-default" uk-sticky>
<div class="uk-navbar-right">
<button class="uk-navbar-toggle uk-icon uk-close" (click)="closeCanvas(canvas)">
<icon name="close" ratio="1.5" visuallyHidden="close account"></icon>
</button>
</div>
</nav>
<ng-container *ngTemplateOutlet="main"></ng-container>
</div>
</div>
<div *ngIf="mobile" id="notifications">
<ng-container *ngTemplateOutlet="main"></ng-container>
</div>
`,
styleUrls: ['notification-sidebar.component.less'],
@ -81,21 +112,21 @@ declare var UIkit;
export class NotificationsSidebarComponent implements OnInit, OnDestroy {
@Input()
public user: User;
@Input()
public mobile: boolean = false;
@Input()
public configuration: NotificationConfiguration;
@Output()
public showNotificationsEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();
public notifications: Notification[] = [];
@Input()
public availableGroups: Option[] = [];
@Input()
public entities: string[] = [];
@Input()
public service: string;
public notification: Notification;
private subscriptions: any[] = [];
constructor(private notificationService: NotificationService) {
}
ngOnInit() {
this.subscriptions.push(this.notificationService.getNotifications(this.service).subscribe(notifications => {
this.subscriptions.push(this.notificationService.getNotifications(this.configuration.service).subscribe(notifications => {
this.notifications = notifications;
}, error => {
this.notifications = [];
@ -141,8 +172,12 @@ export class NotificationsSidebarComponent implements OnInit, OnDestroy {
this.notification = null;
}
closeCanvas(canvas) {
UIkit.offcanvas(canvas).hide();
}
readAll() {
this.notificationService.markAllAsRead(this.service).subscribe(() => {
this.notificationService.markAllAsRead(this.configuration.service).subscribe(() => {
this.notifications.forEach(notification => {
notification.read = true;
});

View File

@ -4,6 +4,7 @@ import {UntypedFormArray, UntypedFormBuilder} from "@angular/forms";
import {properties} from "../../../../environments/environment";
import {EnvProperties} from "../../utils/properties/env-properties";
import {StringUtils} from "../../utils/string-utils.class";
import {ISVocabulariesService} from "../../utils/staticAutoComplete/ISVocabularies.service";
@Component({
selector: 'sdg-selection',
@ -20,14 +21,14 @@ export class SdgSelectionComponent {
public sdgs: UntypedFormArray;
constructor(
private httpClient: HttpClient,
private vocabulariesService: ISVocabulariesService,
private fb: UntypedFormBuilder
) {}
ngOnInit() {
this.loading = true;
this.sdgs = this.fb.array([]);
this.httpClient.get(this.properties.domain+'/assets/common-assets/vocabulary/sdg.json').subscribe(data => {
this.vocabulariesService.getSDGs(properties).subscribe(data => {
data['sdg'].forEach(element => {
// this.sdgs.push({code: element.code, id: element.id, label: element.label, html: element.html, checked: this.subjects?.includes(element.id)});
this.sdgs.push(this.fb.group({
@ -80,4 +81,4 @@ export class SdgSelectionComponent {
private getEntityName (entityType:string) {
return StringUtils.getEntityName(entityType, false);
}
}
}

View File

@ -11,6 +11,7 @@ import {Router} from '@angular/router';
import {Meta, Title} from "@angular/platform-browser";
import {SEOService} from "../sharedComponents/SEO/SEO.service";
import {PiwikService} from "../utils/piwik/piwik.service";
import {ISVocabulariesService} from "../utils/staticAutoComplete/ISVocabularies.service";
@Component({
selector: 'sdg',
@ -36,7 +37,7 @@ export class SdgComponent implements OnInit, OnDestroy {
subscriptions: Subscription[] = [];
constructor(
private httpClient: HttpClient, private refineFieldResultsService: RefineFieldResultsService,
private vocabulariesService: ISVocabulariesService, private refineFieldResultsService: RefineFieldResultsService,
private _router: Router,
private _meta: Meta,
private _title: Title,
@ -54,7 +55,7 @@ export class SdgComponent implements OnInit, OnDestroy {
this.updateUrl(this.url);
this.updateTitle(this.pageTitle);
this.updateDescription(this.pageDescription);
this.httpClient.get(properties.domain+'/assets/common-assets/vocabulary/sdg.json').subscribe(data => {
this.vocabulariesService.getSDGs(properties).subscribe(data => {
this.sdgs = data['sdg'];
});
let refineParams = null;

View File

@ -326,16 +326,12 @@
[isDisabled]="disabled" [isMobile]="mobile">
</search-paging>
</div>
<div *ngIf="showIndexInfo && searchUtils.status !== errorCodes.LOADING" class="uk-margin-large-top uk-grid uk-child-width-1-2 uk-text-small">
<div *ngIf="showIndexInfo && searchUtils.status !== errorCodes.LOADING" class="uk-margin-large-top uk-flex uk-flex-between uk-flex-wrap uk-text-small">
<!-- Last Index Info-->
<div>
<icon name="graph" customClass="text-graph"></icon>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span>
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a>
</span>
</div>
<div class="uk-text-right">
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 17px;">
</a>
<div class="uk-width-1-1 uk-width-auto@m">
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
<a *ngIf="properties.showLastIndexInformationLink" class="uk-link" [href]="properties.lastIndexInformationLink" target="_blank">Last update</a>
<span *ngIf="!(properties.showLastIndexInformationLink)">Last update</span>

View File

@ -219,7 +219,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
public searchControl: UntypedFormControl;
public activeElement: BehaviorSubject<ElementRef> = new BehaviorSubject<ElementRef>(null);
/** Use modifier's class(es) to change view of your Input */
@Input() inputClass: string = 'inner';
@Input() inputClass: string = 'flat';
/** Icon on the input */
@Input() icon: string = null;
/** Chip options */

View File

@ -12,8 +12,8 @@
</div>
<div *ngIf="!onlyTop || userMenu" class="uk-navbar-right" [class.uk-light]='activeHeader.darkBg'>
<ng-container *ngIf="userMenu">
<user-mini [user]="user" mobileView=true (closeCanvasEmitter)="closeCanvas(canvas)"
[userMenuItems]=userMenuItems [logInUrl]=properties.loginUrl
<user-mini [user]="user" mobileView=true
[userMenuItems]=userMenuItems [logInUrl]=properties.loginUrl [notificationConfiguration]="notificationConfiguration"
[logOutUrl]=properties.logoutUrl [cookieDomain]=properties.cookieDomain></user-mini>
</ng-container>
</div>

View File

@ -8,6 +8,7 @@ import {Subscription} from 'rxjs';
import {HelpContentService} from '../services/help-content.service';
import {properties} from "../../../environments/environment";
import {LayoutService} from "../dashboard/sharedComponents/sidebar/layout.service";
import {NotificationConfiguration} from "../notifications/notifications-sidebar/notifications-sidebar.component";
declare var UIkit;
@ -48,6 +49,7 @@ export class NavigationBarComponent implements OnInit, OnDestroy, OnChanges {
@Input() searchRoute: string = '/search/find';
@Input() searchPlaceHolder: string = 'Search for research results';
@Input() showLogo: boolean = true;
@Input() notificationConfiguration: NotificationConfiguration;
replaceHeader: boolean = false;
public activeHeader: Header;
keyword: string = '';

View File

@ -27,21 +27,21 @@ declare var UIkit;
[attr.uk-switcher]="type === 'static'?('connect:' + connect):null"
[ngClass]="'uk-flex-' + flexPosition + ' ' + tabsClass">
<ng-container *ngIf="type === 'static'">
<li *ngFor="let tab of leftTabs" style="max-width: 50%" class="uk-text-capitalize uk-text-truncate uk-display-block">
<li *ngFor="let tab of leftTabs" [ngStyle]="" [style.max-width]="(position === 'horizontal')?'50%':null" class="uk-text-capitalize uk-text-truncate uk-display-block">
<a>{{tab.title}}</a>
</li>
<li *ngFor="let tab of rightTabs; let i=index;" style="max-width: 50%" [ngClass]="i === 0?'uk-flex-1 uk-flex uk-flex-right':''"
<li *ngFor="let tab of rightTabs; let i=index;" [style.max-width]="(position === 'horizontal')?'50%':null" [ngClass]="i === 0?'uk-flex-1 uk-flex uk-flex-right':''"
class="uk-text-capitalize uk-text-truncate uk-display-block">
<a [ngClass]="tab.customClass">{{tab.title}}</a>
</li>
</ng-container>
<ng-container *ngIf="type === 'dynamic'">
<li *ngFor="let tab of leftTabs; let i=index;" [class.uk-active]="tab.active" style="max-width: 50%">
<li *ngFor="let tab of leftTabs; let i=index;" [class.uk-active]="tab.active" [style.max-width]="(position === 'horizontal')?'50%':null">
<a [routerLink]="tab.routerLink" [queryParams]="tab.queryParams" [ngClass]="tab.customClass"
(click)="showActive(i)"
class="uk-text-capitalize uk-text-truncate uk-display-block">{{tab.title}}</a>
</li>
<li *ngFor="let tab of rightTabs; let i=index;" style="max-width: 50%" [class.uk-active]="tab.active"
<li *ngFor="let tab of rightTabs; let i=index;" [style.max-width]="(position === 'horizontal')?'50%':null" [class.uk-active]="tab.active"
[ngClass]="i === 0?'uk-flex-1 uk-flex uk-flex-right':''">
<a [routerLink]="tab.routerLink" [queryParams]="tab.queryParams" [ngClass]="tab.customClass"
(click)="showActive(i)"
@ -49,10 +49,10 @@ declare var UIkit;
</li>
</ng-container>
<ng-container *ngIf="type === 'scrollable'">
<li *ngFor="let tab of leftTabs" style="max-width: 50%" class="uk-text-capitalize uk-text-truncate uk-display-block" [class.uk-active]="tab.active">
<li *ngFor="let tab of leftTabs" [style.max-width]="(position === 'horizontal')?'50%':null" class="uk-text-capitalize uk-text-truncate uk-display-block" [class.uk-active]="tab.active">
<a routerLink="./" [fragment]="tab.id" queryParamsHandling="merge" [ngClass]="tab.customClass">{{tab.title}}</a>
</li>
<li *ngFor="let tab of rightTabs; let i=index;" style="max-width: 50%" class="uk-text-capitalize uk-text-truncate uk-display-block"
<li *ngFor="let tab of rightTabs; let i=index;" [style.max-width]="(position === 'horizontal')?'50%':null" class="uk-text-capitalize uk-text-truncate uk-display-block"
[ngClass]="i === 0?'uk-flex-1 uk-flex uk-flex-right':''"
[class.uk-active]="tab.active">
<a routerLink="./" [fragment]="tab.id" queryParamsHandling="merge" [ngClass]="tab.customClass">{{tab.title}}</a>
@ -206,6 +206,7 @@ export class SliderTabsComponent implements AfterViewInit, OnDestroy {
public showActive(index) {
this.activeIndex = index;
this.activeEmitter.emit(this.tabs.get(this.activeIndex).id);
if(this.slider) {
this.slider.show(this.activeIndex);
}

View File

@ -4,16 +4,10 @@ import {FullPageSliderComponent} from "./full-page-slider.component";
import {SlideComponent} from "./slide.component";
import {BottomModule} from '../../sharedComponents/bottom.module';
import {IconsModule} from '../icons/icons.module';
import {IconsService} from '../icons/icons.service';
import {arrow_down, arrow_up} from '../icons/icons';
@NgModule({
imports: [CommonModule, BottomModule, IconsModule],
declarations: [FullPageSliderComponent, SlideComponent],
exports: [FullPageSliderComponent, SlideComponent],
})
export class FullPageSliderModule {
constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([arrow_up, arrow_down]);
}
}
export class FullPageSliderModule {}

View File

@ -157,7 +157,7 @@ export class AlertModal implements OnInit, AfterViewInit, OnDestroy {
}
ngAfterViewInit() {
if(this.element) {
if(this.element && typeof document !== "undefined") {
this.subscriptions.push(UIkit.util.on(document, 'hide', '#' + this.id, () => {
this.cancelOutput.emit(true);
}));

View File

@ -1,5 +1,5 @@
export enum Level {
NONE,
ALL,
K,
M,
B
@ -14,7 +14,8 @@ export interface NumberSize {
export class NumberUtils {
public static roundNumber(num: number, level: Level = Level.NONE, decimal = 0): any {
public static roundNumber(num: number | string, level: Level = Level.ALL, decimal = 0): any {
num = Number.parseFloat(num.toString());
let roundNum: NumberSize;
let initialNum = num;
let variance = Math.pow(10, decimal);
@ -30,11 +31,6 @@ export class NumberUtils {
num = num / 1000;
num = Math.round(num * variance) / variance;
roundNum = {number: num, size: "K", count: initialNum};
} else if (num >= 100) {
num = num / 100;
num = Math.round(num * variance) / variance;
num = num * 100;
roundNum = {number: num, size: "", count: initialNum};
} else {
roundNum = {number: num, size: "", count: initialNum};
}

View File

@ -5,19 +5,24 @@ import {DecimalPipe} from "@angular/common";
@Pipe({name: 'numberRound'})
export class NumberRoundPipe implements PipeTransform {
decimalPipe: DecimalPipe = new DecimalPipe("en");
constructor() {}
transform(value: number, ...args: any[]): any {
let level = Level.NONE;
constructor() {
}
/**
* Args: Level: 0 (default): ALL, 1: K, 2: M, 3:B
* Decimal: how many decimals should be shown (e.g 1 -> 62.1)
* */
transform(value: number | string, ...args: any[]): any {
let level = Level.ALL;
let decimal = 0;
if(args[0]) {
if (args[0]) {
level = args[0];
}
if(args[1]) {
if (args[1]) {
decimal = args[1];
}
let size: NumberSize = NumberUtils.roundNumber(value, level, decimal);
return this.decimalPipe.transform(size.number) + (size.size?'<span class="number-size">' + size.size + '</span>':'');
return this.decimalPipe.transform(size.number) + (size.size ? '<span class="number-size">' + size.size + '</span>' : '');
}
}

View File

@ -107,21 +107,28 @@ export class ISVocabulariesService {
getLocalVocabularyFromService(vocabularyName: string, properties: EnvProperties): Observable<AutoCompleteValue[]> {
if(vocabularyName == "sdg"){
let url = properties.domain+"/assets/common-assets/vocabulary/sdg.json";
return this.http.get((properties.useLongCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url)
//.map(res => <any> res.json())
return this.getSDGs(properties)
.pipe(map(res => res['sdg']))
.pipe(map(res => this.parseSDGs(res)))
.pipe(catchError(this.handleError));
}else if( vocabularyName == "fos"){
let url = properties.domain+"/assets/common-assets/vocabulary/fos.json";
return this.http.get((properties.useLongCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url)
//.map(res => <any> res.json())
return this.getFos(properties)
.pipe(map(res => res['fos']))
.pipe(map(res => this.parseFOS(res)))
.pipe(catchError(this.handleError));
}
}
getFos(properties: EnvProperties): Observable<any> {
let url = "/assets/common-assets/vocabulary/fos.json";
return this.http.get((properties.useLongCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url)
}
getSDGs(properties: EnvProperties): Observable<any> {
let url = "/assets/common-assets/vocabulary/sdg.json";
return this.http.get((properties.useLongCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url)
}
parseSDGs(data: any): AutoCompleteValue[] {
var array: AutoCompleteValue[] = []
@ -160,6 +167,7 @@ export class ISVocabulariesService {
}
return array;
}
parse(data: any, vocabularyName: string): AutoCompleteValue[] {
var array: AutoCompleteValue[] = []
for (var i = 0; i < data.length; i++) {

View File

@ -261,9 +261,9 @@ export class Identifier {
export class StringUtils {
public static urlRegex = 'https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.' +
'[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.' +
'[a-zA-Z0-9]+\.[^\s]{2,}';
public static urlRegex = 'https?:\\/\\/(?:www(2?)\\.|(?!www(2?)))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\\.[^\\s]{2,}|www(2?)\\.' +
'[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\\.[^\\s]{2,}|https?:\\/\\/(?:www(2?)\\.|(?!www(2?)))[a-zA-Z0-9]+\\.[^\\s]{2,}|www(2?)\\.' +
'[a-zA-Z0-9]+\\.[^\\s]{2,}';
public static routeRegex = '^[a-zA-Z0-9\/][a-zA-Z0-9\/-]*$';