Merging 'develop' branch into explore-redesign.

This commit is contained in:
Konstantina Galouni 2023-07-05 11:40:43 +03:00
commit a6dee41979
50 changed files with 1375 additions and 709 deletions

200
LICENSE.txt Normal file
View File

@ -0,0 +1,200 @@
Apache License
Version 2.0, January 2004
http://www.apache.org/licenses/
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
1. Definitions.
"License" shall mean the terms and conditions for use, reproduction,
and distribution as defined by Sections 1 through 9 of this document.
"Licensor" shall mean the copyright owner or entity authorized by
the copyright owner that is granting the License.
"Legal Entity" shall mean the union of the acting entity and all
other entities that control, are controlled by, or are under common
control with that entity. For the purposes of this definition,
"control" means (i) the power, direct or indirect, to cause the
direction or management of such entity, whether by contract or
otherwise, or (ii) ownership of fifty percent (50%) or more of the
outstanding shares, or (iii) beneficial ownership of such entity.
"You" (or "Your") shall mean an individual or Legal Entity
exercising permissions granted by this License.
"Source" form shall mean the preferred form for making modifications,
including but not limited to software source code, documentation
source, and configuration files.
"Object" form shall mean any form resulting from mechanical
transformation or translation of a Source form, including but
not limited to compiled object code, generated documentation,
and conversions to other media types.
"Work" shall mean the work of authorship, whether in Source or
Object form, made available under the License, as indicated by a
copyright notice that is included in or attached to the work
(an example is provided in the Appendix below).
"Derivative Works" shall mean any work, whether in Source or Object
form, that is based on (or derived from) the Work and for which the
editorial revisions, annotations, elaborations, or other modifications
represent, as a whole, an original work of authorship. For the purposes
of this License, Derivative Works shall not include works that remain
separable from, or merely link (or bind by name) to the interfaces of,
the Work and Derivative Works thereof.
"Contribution" shall mean any work of authorship, including
the original version of the Work and any modifications or additions
to that Work or Derivative Works thereof, that is intentionally
submitted to Licensor for inclusion in the Work by the copyright owner
or by an individual or Legal Entity authorized to submit on behalf of
the copyright owner. For the purposes of this definition, "submitted"
means any form of electronic, verbal, or written communication sent
to the Licensor or its representatives, including but not limited to
communication on electronic mailing lists, source code control systems,
and issue tracking systems that are managed by, or on behalf of, the
Licensor for the purpose of discussing and improving the Work, but
excluding communication that is conspicuously marked or otherwise
designated in writing by the copyright owner as "Not a Contribution."
"Contributor" shall mean Licensor and any individual or Legal Entity
on behalf of whom a Contribution has been received by Licensor and
subsequently incorporated within the Work.
2. Grant of Copyright License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
copyright license to reproduce, prepare Derivative Works of,
publicly display, publicly perform, sublicense, and distribute the
Work and such Derivative Works in Source or Object form.
3. Grant of Patent License. Subject to the terms and conditions of
this License, each Contributor hereby grants to You a perpetual,
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
(except as stated in this section) patent license to make, have made,
use, offer to sell, sell, import, and otherwise transfer the Work,
where such license applies only to those patent claims licensable
by such Contributor that are necessarily infringed by their
Contribution(s) alone or by combination of their Contribution(s)
with the Work to which such Contribution(s) was submitted. If You
institute patent litigation against any entity (including a
cross-claim or counterclaim in a lawsuit) alleging that the Work
or a Contribution incorporated within the Work constitutes direct
or contributory patent infringement, then any patent licenses
granted to You under this License for that Work shall terminate
as of the date such litigation is filed.
4. Redistribution. You may reproduce and distribute copies of the
Work or Derivative Works thereof in any medium, with or without
modifications, and in Source or Object form, provided that You
meet the following conditions:
(a) You must give any other recipients of the Work or
Derivative Works a copy of this License; and
(b) You must cause any modified files to carry prominent notices
stating that You changed the files; and
(c) You must retain, in the Source form of any Derivative Works
that You distribute, all copyright, patent, trademark, and
attribution notices from the Source form of the Work,
excluding those notices that do not pertain to any part of
the Derivative Works; and
(d) If the Work includes a "NOTICE" text file as part of its
distribution, then any Derivative Works that You distribute must
include a readable copy of the attribution notices contained
within such NOTICE file, excluding those notices that do not
pertain to any part of the Derivative Works, in at least one
of the following places: within a NOTICE text file distributed
as part of the Derivative Works; within the Source form or
documentation, if provided along with the Derivative Works; or,
within a display generated by the Derivative Works, if and
wherever such third-party notices normally appear. The contents
of the NOTICE file are for informational purposes only and
do not modify the License. You may add Your own attribution
notices within Derivative Works that You distribute, alongside
or as an addendum to the NOTICE text from the Work, provided
that such additional attribution notices cannot be construed
as modifying the License.
You may add Your own copyright statement to Your modifications and
may provide additional or different license terms and conditions
for use, reproduction, or distribution of Your modifications, or
for any such Derivative Works as a whole, provided Your use,
reproduction, and distribution of the Work otherwise complies with
the conditions stated in this License.
5. Submission of Contributions. Unless You explicitly state otherwise,
any Contribution intentionally submitted for inclusion in the Work
by You to the Licensor shall be under the terms and conditions of
this License, without any additional terms or conditions.
Notwithstanding the above, nothing herein shall supersede or modify
the terms of any separate license agreement you may have executed
with Licensor regarding such Contributions.
6. Trademarks. This License does not grant permission to use the trade
names, trademarks, service marks, or product names of the Licensor,
except as required for reasonable and customary use in describing the
origin of the Work and reproducing the content of the NOTICE file.
7. Disclaimer of Warranty. Unless required by applicable law or
agreed to in writing, Licensor provides the Work (and each
Contributor provides its Contributions) on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied, including, without limitation, any warranties or conditions
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
PARTICULAR PURPOSE. You are solely responsible for determining the
appropriateness of using or redistributing the Work and assume any
risks associated with Your exercise of permissions under this License.
8. Limitation of Liability. In no event and under no legal theory,
whether in tort (including negligence), contract, or otherwise,
unless required by applicable law (such as deliberate and grossly
negligent acts) or agreed to in writing, shall any Contributor be
liable to You for damages, including any direct, indirect, special,
incidental, or consequential damages of any character arising as a
result of this License or out of the use or inability to use the
Work (including but not limited to damages for loss of goodwill,
work stoppage, computer failure or malfunction, or any and all
other commercial damages or losses), even if such Contributor
has been advised of the possibility of such damages.
9. Accepting Warranty or Additional Liability. While redistributing
the Work or Derivative Works thereof, You may choose to offer,
and charge a fee for, acceptance of support, warranty, indemnity,
or other liability obligations and/or rights consistent with this
License. However, in accepting such obligations, You may act only
on Your own behalf and on Your sole responsibility, not on behalf
of any other Contributor, and only if You agree to indemnify,
defend, and hold each Contributor harmless for any liability
incurred by, or claims asserted against, such Contributor by reason
of your accepting any such warranty or additional liability.
END OF TERMS AND CONDITIONS
APPENDIX: How to apply the Apache License to your work.
To apply the Apache License to your work, attach the following
boilerplate notice, with the fields enclosed by brackets "[]"
replaced with your own identifying information. (Don't include
the brackets!) The text should be enclosed in the appropriate
comment syntax for the file format. We also recommend that a
file or class name and description of purpose be included on the
same "printed page" as the copyright notice for easier
identification within third-party archives.
Copyright [yyyy] [name of copyright owner]
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

View File

@ -1,86 +1,103 @@
import {properties} from "../../../../environments/environment";
export class Layout {
_id:string;
portalPid:string;
layoutOptions:CustomizationOptions;
_id: string;
portalPid: string;
layoutOptions: CustomizationOptions;
date;
constructor(community, options:CustomizationOptions){
constructor(community, options: CustomizationOptions) {
this.portalPid = community;
this.layoutOptions = options;
}
public static getVariables(options: CustomizationOptions): {} | null {
if(options) {
if (options) {
let variables = {};
if(options.identity) {
variables['@global-primary-background'] = options.identity.mainColor;
variables['@global-secondary-background'] = options.identity.secondaryColor;
if (options.identity) {
variables['@global-primary-background'] = Layout.convertRGBAtoRGB(options.identity.mainColor);
variables['@global-secondary-background'] = Layout.convertRGBAtoRGB(options.identity.secondaryColor);
}
if(options.backgrounds){
variables['@general-search-form-background'] = options.backgrounds.form.color;
variables['@base-body-background'] = options.backgrounds.light.color;
variables['@hero-background-image'] = (options.backgrounds.form.imageFile?(this.getUrl(properties.utilsService + '/download/' +options.backgrounds.form.imageFile)): 'none') ;
if (options.backgrounds) {
variables['@general-search-form-background'] = Layout.convertRGBAtoRGB(options.backgrounds.form.color);
variables['@global-background'] = Layout.convertRGBAtoRGB(options.backgrounds.light.color);
variables['@hero-background-image'] = (options.backgrounds.form.imageFile ? (this.getUrl(properties.utilsService + '/download/' + options.backgrounds.form.imageFile)) : 'none');
variables['@hero-background-position'] = options.backgrounds.form.position;
variables['@hero-fonts-mode'] = options.backgrounds.form.fontsDarkMode == true ?'dark':'light';
}
if(options.buttons){
if (options.buttons) {
//general
variables['@button-border-width'] = options.buttons.lightBackground.borderWidth + "px";
variables['@button-border-radius'] = options.buttons.lightBackground.borderRadius + "px";
// default -> on dark background todo check again when we have sucj=h buttons
variables['@button-default-background'] = options.buttons.darkBackground.backgroundColor;
variables['@button-default-color'] = options.buttons.darkBackground.color;
variables['@button-default-border'] = options.buttons.darkBackground.borderColor;
variables['@button-default-hover-background'] = options.buttons.darkBackground.onHover.backgroundColor;
variables['@button-default-hover-color'] = options.buttons.darkBackground.onHover.color;
variables['@button-default-hover-border'] = options.buttons.darkBackground.onHover.borderColor;
variables['@button-default-active-background'] = options.buttons.darkBackground.onHover.backgroundColor;
variables['@button-default-active-color'] = options.buttons.darkBackground.onHover.color;
variables['@button-default-active-border'] = options.buttons.darkBackground.onHover.borderColor;
variables['@button-default-background'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.backgroundColor);
variables['@button-default-color'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.color);
variables['@button-default-border'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.borderColor);
variables['@button-default-hover-background'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.onHover.backgroundColor);
variables['@button-default-hover-color'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.onHover.color);
variables['@button-default-hover-border'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.onHover.borderColor);
variables['@button-default-active-background'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.onHover.backgroundColor);
variables['@button-default-active-color'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.onHover.color);
variables['@button-default-active-border'] = Layout.convertRGBAtoRGB(options.buttons.darkBackground.onHover.borderColor);
// primary
variables['@button-primary-background'] = options.buttons.lightBackground.backgroundColor;
variables['@button-primary-color'] = options.buttons.lightBackground.color;
variables['@button-primary-border'] = options.buttons.lightBackground.borderColor;
variables['@button-primary-hover-background'] = options.buttons.lightBackground.onHover.backgroundColor;
variables['@button-primary-hover-color'] = options.buttons.lightBackground.onHover.color;
variables['@button-primary-hover-border'] = options.buttons.lightBackground.onHover.borderColor;
variables['@button-primary-active-background'] = options.buttons.lightBackground.onHover.backgroundColor;
variables['@button-primary-active-color'] = options.buttons.lightBackground.onHover.color;
variables['@button-primary-active-border'] = options.buttons.lightBackground.onHover.borderColor;
variables['@button-primary-background'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.backgroundColor);
variables['@button-primary-color'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.color);
variables['@button-primary-border'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.borderColor);
variables['@button-primary-hover-background'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.onHover.backgroundColor);
variables['@button-primary-hover-color'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.onHover.color);
variables['@button-primary-hover-border'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.onHover.borderColor);
variables['@button-primary-active-background'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.onHover.backgroundColor);
variables['@button-primary-active-color'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.onHover.color);
variables['@button-primary-active-border'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.onHover.borderColor);
// secondary
variables['@button-secondary-background'] = options.buttons.lightBackground.color;
variables['@button-secondary-color'] = options.buttons.lightBackground.backgroundColor;
variables['@button-secondary-border'] = options.buttons.lightBackground.backgroundColor;
variables['@button-secondary-hover-background'] = options.buttons.lightBackground.backgroundColor;
variables['@button-secondary-hover-color'] = options.buttons.lightBackground.color;
variables['@button-secondary-hover-border'] = options.buttons.lightBackground.borderColor;
variables['@button-secondary-active-background'] = options.buttons.lightBackground.backgroundColor;
variables['@button-secondary-active-color'] = options.buttons.lightBackground.color;
variables['@button-secondary-active-border'] = options.buttons.lightBackground.borderColor;
variables['@button-secondary-background'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.color);
variables['@button-secondary-color'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.backgroundColor);
variables['@button-secondary-border'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.backgroundColor);
variables['@button-secondary-hover-background'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.backgroundColor);
variables['@button-secondary-hover-color'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.color);
variables['@button-secondary-hover-border'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.borderColor);
variables['@button-secondary-active-background'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.backgroundColor);
variables['@button-secondary-active-color'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.color);
variables['@button-secondary-active-border'] = Layout.convertRGBAtoRGB(options.buttons.lightBackground.borderColor);
}
return variables;
}
return null;
}
public static getUrl(url){
public static getUrl(url) {
return 'url("' + url + '")';
}
public static convertRGBAtoRGB(color: string): string {
if(color.includes('rgba')) {
const regexPattern = /rgba\((\d+),\s*(\d+),\s*(\d+),\s*([\d.]+)\)/;
const matches = color.match(regexPattern);
const [, r, g, b, a] = matches;
let R = parseInt(r)*parseFloat(a) + (1 - parseFloat(a))*255;
let G = parseInt(g)*parseFloat(a) + (1 - parseFloat(a))*255;
let B = parseInt(b)*parseFloat(a) + (1 - parseFloat(a))*255;
return 'rgb(' + R + ',' + G + ',' + B + ',' + ')';
} else {
return color;
}
}
}
export class CustomizationOptions {
identity: {
mainColor: string;
secondaryColor: string;
};
identityIsCustom:boolean;
backgroundsIsCustom:boolean;
buttonsIsCustom:boolean;
identityIsCustom: boolean;
backgroundsIsCustom: boolean;
buttonsIsCustom: boolean;
backgrounds: {
dark: {
color: string; //background
color: string; //background
}
light: {
color: string; //background
@ -89,41 +106,43 @@ export class CustomizationOptions {
color: string; //background
imageUrl: string;
imageFile: string;
position:string;
position: string;
fontsDarkMode:boolean;
}
};
buttons: {
darkBackground: ButtonsCustomization;
lightBackground: ButtonsCustomization;
};
constructor(mainColor: string = null, secondaryColor: string = null) {
this.identity= {
this.identity = {
mainColor: mainColor ? mainColor : CustomizationOptions.getIdentity().mainColor,
secondaryColor : secondaryColor ? secondaryColor : CustomizationOptions.getIdentity().secondaryColor,
secondaryColor: secondaryColor ? secondaryColor : CustomizationOptions.getIdentity().secondaryColor,
};
this.identityIsCustom = false;
this.backgroundsIsCustom = false;
this.buttonsIsCustom = false;
this.backgrounds={
dark : {
this.backgrounds = {
dark: {
color: this.identity.mainColor,
},
light : {
light: {
color: "#f9f9f9" //CustomizationOptions.getRGBA(this.identity.mainColor,0.05),
},
form : {
color: CustomizationOptions.getRGBA(this.identity.mainColor,0.15),
imageUrl : null,
imageFile : null,
position: null
form: {
color: CustomizationOptions.getRGBA(this.identity.mainColor, 0.15),
imageUrl: null,
imageFile: null,
position: null,
fontsDarkMode: true
}
};
this.buttons = {
darkBackground: {
isDefault:true,
isDefault: true,
backgroundColor: "#ffffff",
color: "#000000",
borderStyle: "solid",
@ -137,7 +156,7 @@ export class CustomizationOptions {
}
},
lightBackground: {
isDefault:true,
isDefault: true,
backgroundColor: this.identity.mainColor,
color: '#ffffff',
borderStyle: "solid",
@ -150,15 +169,19 @@ export class CustomizationOptions {
borderColor: this.identity.secondaryColor,
}
}
};
}
public static checkForObsoleteVersion(current:CustomizationOptions, communityId:string){
let defaultCO = new CustomizationOptions(CustomizationOptions.getIdentity(communityId).mainColor,CustomizationOptions.getIdentity(communityId).secondaryColor);
public static checkForObsoleteVersion(current: CustomizationOptions, communityId: string) {
if(communityId === 'connect') {
return null;
}
let defaultCO = new CustomizationOptions(CustomizationOptions.getIdentity(communityId).mainColor, CustomizationOptions.getIdentity(communityId).secondaryColor);
let updated = Object.assign({}, defaultCO);
if(!current){
if (!current) {
current = Object.assign({}, defaultCO);
}else {
} else {
if (current.identity && current.identity.mainColor && current.identity.secondaryColor) {
updated = new CustomizationOptions(current.identity.mainColor, current.identity.secondaryColor);
}
@ -177,6 +200,9 @@ export class CustomizationOptions {
if (!current.backgrounds.form.position) {
current.backgrounds.form.position = "center bottom"
}
if (current.backgrounds.form.fontsDarkMode == undefined) {
current.backgrounds.form.fontsDarkMode = true;
}
if (!current.buttons) {
current.buttons = Object.assign({}, updated.buttons);
}
@ -195,53 +221,55 @@ export class CustomizationOptions {
}
}
return current;
}
public static getIdentity(community:string=null){
let COLORS= {
default:{
mainColor:'#4687E6',
public static getIdentity(community: string = null) {
let COLORS = {
default: {
mainColor: '#4687E6',
secondaryColor: '#2D72D6'
},
"covid-19":{
mainColor:"#03ADEE",
"covid-19": {
mainColor: "#03ADEE",
secondaryColor: "#F15157"
}
};
if(community && COLORS[community]){
if (community && COLORS[community]) {
return COLORS[community];
}
return COLORS.default;
}
public static getRGBA(color, A){
if(color.indexOf("#")!=-1){
return 'rgba('+parseInt(color.substring(1,3),16)+','+parseInt(color.substring(3,5),16)+','+parseInt(color.substring(5,7),16)+','+A+')';
public static getRGBA(color, A) {
if (color.indexOf("#") != -1) {
return 'rgba(' + parseInt(color.substring(1, 3), 16) + ',' + parseInt(color.substring(3, 5), 16) + ',' + parseInt(color.substring(5, 7), 16) + ',' + A + ')';
}
return color;
}
public static isForLightBackground(color:string){
public static isForLightBackground(color: string) {
let L, r, g, b, a = 1;
if(color.length == 7 || color.length == 9) {
if (color.length == 7 || color.length == 9) {
r = parseInt(color.substring(1, 3), 16);
g = parseInt(color.substring(3, 5), 16);
b = parseInt(color.substring(5, 7), 16);
if(color.length == 9) {
a = parseInt(color.substring(7, 9), 16);
if (color.length == 9) {
a = parseInt(color.substring(7, 9), 16);
}
}else if(color.length > 9){
} else if (color.length > 9) {
let array = color.split("rgba(")[1].split(")")[0].split(",");
r = parseInt(array[0]);
g = parseInt(array[1]);
b = parseInt(array[2]);
a = +array[3];
}
const brightness = r* 0.299 + g * 0.587 + b * 0.114 + (1 - a) * 255;
const brightness = r * 0.299 + g * 0.587 + b * 0.114 + (1 - a) * 255;
return (brightness < 186)
// return !(r*0.299 + g*0.587 + b*0.114 > 186);
/*for(let c of [r,g,b]){
c = c / 255.0;
@ -255,11 +283,12 @@ export class CustomizationOptions {
return L > 0.179// (L + 0.05) / (0.05) > (1.0 + 0.05) / (L + 0.05); //use #000000 else use #ffffff
*/
}
}
export class ButtonsCustomization{
isDefault:boolean;
export class ButtonsCustomization {
isDefault: boolean;
backgroundColor: string;
color: string;
borderStyle: string;

View File

@ -11,9 +11,9 @@ import {ActivatedRoute} from "@angular/router";
<li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'portal'"><a routerLink="../portals">Portals</a></li>
<li [class.uk-active]="tab === 'page'"><a routerLink="../pages">Pages</a></li>
<li [class.uk-active]="tab === 'entity'"><a routerLink="../entities">Entities</a></li>
<li *ngIf="portal && type === 'community'" [class.uk-active]="tab === 'menu'"><a routerLink="../menu">Menus</a></li>
<li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'class'"><a routerLink="../classes">Classes</a></li>
<li *ngIf="isPortalAdmin && portal=='connect'" [class.uk-active]="tab === 'customization'"><a routerLink="../customization">Customization</a></li>
<li *ngIf="portal && type === 'community'" [class.uk-active]="tab === 'menu'"><a routerLink="../menu">Menus</a></li>
<li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'class'"><a routerLink="../classes">Classes</a></li>
<li *ngIf="isPortalAdmin && portal=='connect'" [class.uk-active]="tab === 'customization'"><a routerLink="../customization">Customization</a></li>
</ul>
`
})
@ -25,7 +25,7 @@ export class AdminTabsComponent implements OnInit {
@Input()
public user: User;
@Input()
public tab: "portal" | "page" | "entity" | "menu" | "class" | "customization"= 'page';
public tab: "portal" | "page" | "entity" | "menu" | "class" | "customization" = 'page';
private subscriptions: any[] = [];
constructor(private route: ActivatedRoute, private userManagementService: UserManagementService) {

View File

@ -95,13 +95,16 @@
</div>
</div>
<modal-alert #inviteModal (alertOutput)="invite()" [overflowBody]="false" classTitle="uk-background-primary uk-light"
[okDisabled]="invited && invited.invalid">
[okDisabled]="!valid">
<div *ngIf="message" class="uk-margin-medium-bottom uk-text-small">
<div [innerHTML]="message | safeHtml"></div>
</div>
<div *ngIf="invited">
<div input [formInput]="invited"
placeholder="Email"></div>
<div *ngIf="emailsForm">
<div #emailInput input [formInput]="emailsForm" type="chips"
placeholder="Recipients" hint="Add a recipient" [visibleChips]="3"
[addExtraChips]="true" [validators]="validators" [separators]="[',']">
<div note>Separate emails with commas</div>
</div>
</div>
</modal-alert>
<modal-alert #deleteModal [overflowBody]="false" (alertOutput)="deleteActive()" classTitle="uk-background-primary uk-light">

View File

@ -1,5 +1,21 @@
import {Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild} from '@angular/core';
import {UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators} from '@angular/forms';
import {
ChangeDetectorRef,
Component,
Input,
OnChanges,
OnDestroy,
OnInit,
SimpleChanges,
ViewChild
} from '@angular/core';
import {
UntypedFormArray,
UntypedFormBuilder,
UntypedFormControl,
UntypedFormGroup,
ValidatorFn,
Validators
} from '@angular/forms';
import {AlertModal} from "../../../utils/modal/alert";
import {UserRegistryService} from "../../../services/user-registry.service";
import {EnvProperties} from "../../../utils/properties/env-properties";
@ -9,9 +25,22 @@ import {UserManagementService} from "../../../services/user-management.service";
import {Router} from "@angular/router";
import {StringUtils} from "../../../utils/string-utils.class";
import {NotificationService} from "../../../notifications/notification.service";
import {Subscription} from "rxjs";
import {forkJoin, of, Subscription} from "rxjs";
import {NotificationHandler} from "../../../utils/notification-handler";
import {ClearCacheService} from "../../../services/clear-cache.service";
import {catchError, map, tap} from "rxjs/operators";
import notification = CKEDITOR.plugins.notification;
import {InputComponent} from "../../../sharedComponents/input/input.component";
class InvitationResponse {
email: string;
invitation: any;
constructor(email, invitation) {
this.email = email;
this.invitation = invitation;
}
}
@Component({
selector: 'role-users',
@ -49,7 +78,8 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
public loadActive: boolean = true;
public loadPending: boolean = true;
public selectedUser: string = null;
public invited: UntypedFormControl;
public emailsForm: UntypedFormArray;
public validators: ValidatorFn[] = [Validators.email];
public properties: EnvProperties = properties;
public exists: boolean = true;
public roleFb: UntypedFormGroup;
@ -60,6 +90,7 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
/** Search */
filterForm: UntypedFormGroup;
@ViewChild('inviteModal') inviteModal: AlertModal;
@ViewChild('emailInput') emailInput: InputComponent;
@ViewChild('deleteModal') deleteModal: AlertModal;
@ViewChild('deletePendingModal') deletePendingModal: AlertModal;
@ViewChild('createRoleModal') createRoleModal: AlertModal;
@ -69,6 +100,7 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
private clearCacheService: ClearCacheService,
private notificationService: NotificationService,
private router: Router,
private cdr: ChangeDetectorRef,
private fb: UntypedFormBuilder) {
}
@ -172,7 +204,8 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
this.inviteModal.alertTitle = 'Invite ' + this.role;
this.inviteModal.okButtonLeft = false;
this.inviteModal.okButtonText = 'Send';
this.invited = this.fb.control('', [Validators.required, Validators.email]);
this.emailsForm = this.fb.array([], Validators.required);
this.cdr.detectChanges();
this.inviteModal.open();
}
@ -224,33 +257,56 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
this.loadPending = false;
}));
}
get valid() {
return this.emailsForm && this.emailsForm.valid || (this.emailInput && this.emailInput.searchControl.getRawValue() && this.emailInput.searchControl.valid);
}
invite() {
if(this.emailInput.searchControl.getRawValue() && this.emailInput.searchControl.valid) {
this.emailInput.add(null,true);
}
this.showCurrent = false;
this.loadPending = true;
this.selectedUser = this.invited.value;
let details = {
link: this.link,
email: this.emailComposer(this.name, this.invited.value, this.role)
}
this.subs.push(this.userRegistryService.invite(this.type, this.id, details, this.role).subscribe(invitation => {
if (!this.pending.includes(this.invited.value)) {
this.pending.push(this.invited.value);
let current = null;
let invitations = (<Array<any>>this.emailsForm.value).map(email => {
current = email;
return this.userRegistryService.invite(this.type, this.id, {
link: this.link,
email: this.emailComposer(this.name, email, this.role)
}, this.role).pipe(map(invitation => new InvitationResponse(email, invitation), catchError(error => {
return of(new InvitationResponse(current, null));
})));
});
this.subs.push(forkJoin(invitations).subscribe(responses => {
let notifications = responses.map(response => {
if(response.invitation) {
NotificationHandler.rise(StringUtils.capitalize(this.role) + ' invitation to ' + response.email + ' has been <b>sent</b>');
if (!this.pending.includes(response.email)) {
this.pending.push(response.email);
}
if(this.notificationFn) {
return this.notificationService.sendNotification(this.notificationFn(this.name, response.email, this.role, response.invitation)).pipe(map(notification => {
return notification;
}), tap(() => {
NotificationHandler.rise('A notification has been <b>sent</b> successfully to ' + response.email);
}), catchError( error => {
NotificationHandler.rise('An error has occurred while sending a notification to ' + response.email + '. Please try again later', 'danger');
return of(null);
}));
} else {
return of(null);
}
} else {
NotificationHandler.rise('An error has occurred while sending the invitation mail to ' + response.email + '.Please try again later', 'danger');
return of(null);
}
});
this.subs.push(forkJoin(notifications).subscribe(() => {
this.pendingPage = Math.ceil(this.pending.length / this.pageSize);
this.filterPendingBySearch(this.filterForm.value.pending);
}
if (this.notificationFn) {
this.subs.push(this.notificationService.sendNotification(this.notificationFn(this.name, this.invited.value, this.role, invitation)).subscribe(notification => {
NotificationHandler.rise('A notification has been <b>sent</b> successfully');
}, error => {
NotificationHandler.rise('An error has occurred. Please try again later', 'danger');
}));
}
NotificationHandler.rise(StringUtils.capitalize(this.role) + ' invitation to ' + this.selectedUser + ' has been <b>sent</b>');
this.loadPending = false;
}, error => {
NotificationHandler.rise('An error has occurred. Please try again later', 'danger');
this.loadPending = false;
this.loadPending = false;
}))
}));
}

View File

@ -3,15 +3,25 @@ import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from "@angular/com
import {Observable, throwError, TimeoutError} from "rxjs";
import {catchError} from "rxjs/operators";
import {Session} from "./login/utils/helper.class";
import {Router} from "@angular/router";
import {GuardsCheckEnd, GuardsCheckStart, Router} from "@angular/router";
import {LoginErrorCodes} from "./login/utils/guardHelper.class";
import {properties} from "../../environments/environment";
import * as url from "url";
@Injectable()
export class ErrorInterceptorService implements HttpInterceptor {
private static UNAUTHORIZED_WHITELIST = [properties.userInfoUrl, properties.orcidAPIURL, properties.registryUrl? (properties.registryUrl + 'verification/'):null, properties.eoscDataTransferAPI].filter(value => !!value);
private url: string = null;
constructor(private router: Router) {
this.router.events.forEach(event => {
if(event instanceof GuardsCheckStart) {
this.url = event.url;
} else if(event instanceof GuardsCheckEnd) {
this.url = null;
}
})
}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
@ -42,7 +52,7 @@ export class ErrorInterceptorService implements HttpInterceptor {
this.router.navigate(['/user-info'], {
queryParams: {
'errorCode': LoginErrorCodes.NOT_LOGIN,
'redirectUrl': this.router.url
'redirectUrl': this.url?this.url:this.router.url
}
});
}
@ -51,7 +61,7 @@ export class ErrorInterceptorService implements HttpInterceptor {
this.router.navigate(['/user-info'], {
queryParams: {
'errorCode': LoginErrorCodes.NOT_AUTHORIZED,
'redirectUrl': this.router.url
'redirectUrl': this.url?this.url:this.router.url
}
});
}

View File

@ -35,8 +35,11 @@ export class HttpInterceptorService implements HttpInterceptor {
return of(response);
} else {
if (isPlatformServer(this.platformId)) {
if(request.url.startsWith('/assets') || request.url.startsWith('assets')) {
return of(null);
}
let headers = new HttpHeaders();
if(request.withCredentials) {
if(request.withCredentials && !properties.hasMachineCache) {
headers = headers.set('Cookie', this.req.get('Cookie'));
}
const authReq = request.clone({

View File

@ -215,8 +215,8 @@ export class DataProviderComponent {
this.stickyHeader = false;
this.updateDescription("");
if(data["pv"]) {
this.prevPath = data["pv"];
if(data["return_path"]) {
this.prevPath = data["return_path"] + (data["search_params"] ? ("?"+data["search_params"]) : "");
}
if((typeof document !== 'undefined') && document.referrer) {
this.referrer = document.referrer;
@ -984,7 +984,11 @@ export class DataProviderComponent {
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
return this.routerHelper.addQueryParam("pv", this.prevPath, obj);
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}

View File

@ -141,7 +141,11 @@ export class RelatedDatasourcesTabComponent {
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
return this.routerHelper.addQueryParam("pv", this.prevPath, obj);
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}

View File

@ -140,7 +140,11 @@ export class AvailableOnComponent {
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
return this.routerHelper.addQueryParam("pv", this.prevPath, obj);
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}

View File

@ -132,7 +132,11 @@ export class FundedByComponent {
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
return this.routerHelper.addQueryParam("pv", this.prevPath, obj);
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}

View File

@ -8,6 +8,9 @@ import {EnvProperties} from '../../../utils/properties/env-properties';
import {ClickEvent} from "../../../utils/click/click-outside-or-esc.directive";
import {NumberUtils} from "../../../utils/number-utils.class";
import {OpenaireEntities} from "../../../utils/properties/searchFields";
import {StringUtils} from "../../../utils/string-utils.class";
import {properties} from "../../../../../environments/environment";
import {RouterHelper} from "../../../utils/routerHelper.class";
@Component({
selector: 'metrics',
@ -77,7 +80,7 @@ import {OpenaireEntities} from "../../../utils/properties/searchFields";
<tbody>
<tr *ngFor="let key of getKeys(metrics.infos)">
<td class="uk-width-1-3 uk-text-center uk-text-truncate" uk-tooltip [title]="metrics.infos.get(key).name">
<a [href]="metrics.infos.get(key).url + (prevPath ? ('&pv='+prevPath) : '')">
<a [queryParams]="addEoscPrevInParams({datasourceId: metrics.infos.get(key).url})" [routerLink]="properties.searchLinkToDataProvider.split('?')[0]">
{{metrics.infos.get(key).name}}
</a>
</td>
@ -151,6 +154,7 @@ export class MetricsComponent {
public status: number;
public state: number = -1;
public openaireEntities = OpenaireEntities;
public routerHelper:RouterHelper = new RouterHelper();
constructor(private metricsService: MetricsService, private cdr: ChangeDetectorRef) {
}
@ -313,4 +317,15 @@ export class MetricsComponent {
let formatted = NumberUtils.roundNumber(+num);
return formatted.number + formatted.size;
}
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}
}

View File

@ -10,10 +10,11 @@ import {MetricsService} from '../../../services/metrics.service';
import {ErrorMessagesModule} from '../../../utils/errorMessages.module';
import {IFrameModule} from "../../../utils/iframe.module";
import {IconsModule} from "../../../utils/icons/icons.module";
import {RouterModule} from "@angular/router";
@NgModule({
imports: [
CommonModule, FormsModule, ErrorMessagesModule, IFrameModule, IconsModule
CommonModule, FormsModule, RouterModule, ErrorMessagesModule, IFrameModule, IconsModule
],
declarations: [
MetricsComponent

View File

@ -8,29 +8,13 @@ import {StringUtils} from "../../utils/string-utils.class";
providedIn: 'root'
})
export class ParsingFunctions {
public eoscSubjects = [
{
label: 'EOSC::Jupyter Notebook',
link: 'https://' + (properties.environment != 'production' ? 'beta.' : '') + 'marketplace.eosc-portal.eu/services?tag=EOSC%3A%3AJupyter+Notebook',
value: 'Jupyter Notebook'
},
{
label: 'EOSC::RO-crate',
link: 'https://' + (properties.environment != 'production' ? 'beta.' : '') + 'marketplace.eosc-portal.eu/datasources/eosc.psnc.6f0470e3bb9203ec3a7553f3a72a7a1f?q=ROHub',
value: 'RO-crate'
},
{
label: 'EOSC::Galaxy Workflow',
link: 'https://' + (properties.environment != 'production' ? 'beta.' : '') + 'marketplace.eosc-portal.eu/services?tag=EOSC%3A%3AGalaxy+Workflow',
value: 'Galaxy Workflow'
},
{
label: 'EOSC::Twitter Data',
link: 'https://' + (properties.environment != 'production' ? 'beta.' : '') + 'marketplace.eosc-portal.eu/services?tag=EOSC%3A%3ATwitter+Data',
value: 'Twitter Data'
}
]
public eoscSubjects = [
{label: 'EOSC::Jupyter Notebook', link: 'https://' + (properties.environment != 'production'?'beta.':'') + 'search.marketplace.eosc-portal.eu/search/service?q=*&fq=tag_list:"EOSC%5C:%5C:Jupyter%20Notebook"', value: 'Jupyter Notebook'},
{label: 'EOSC::RO-crate', link: 'https://' + (properties.environment != 'production'?'beta.':'') + 'search.marketplace.eosc-portal.eu/search/data-source?q=*&fq=tag_list:%22eosc%5C:%5C:ro%5C-crate%22', value: 'RO-crate'},
{label: 'EOSC::Galaxy Workflow', link: 'https://' + (properties.environment != 'production'?'beta.':'') + 'search.marketplace.eosc-portal.eu/search/service?q=*&fq=tag_list:%22eosc%5C:%5C:galaxy%20workflow%22', value: 'Galaxy Workflow'},
{label: 'EOSC::Twitter Data', link: 'https://' + (properties.environment != 'production'?'beta.':'') + 'search.marketplace.eosc-portal.eu/search/service?q=*&fq=tag_list:%22EOSC%5C:%5C:Twitter%20Data%22', value: 'Twitter Data'},
{label: 'EOSC::Data Cube', link: 'https://' + (properties.environment != 'production'?'beta.':'') + 'search.marketplace.eosc-portal.eu/search/service?q=*&fq=tag_list:%22EOSC%5C:%5C:Data%20Cube%22', value: 'Data Cube'}
]
public notebookInSubjects: boolean = false;
private notebookKeyword: string = "eosc jupyter notebook";
private notebook_label: string = "EOSC";

View File

@ -184,8 +184,8 @@ export class OrganizationComponent {
this.updateTitle("Organization");
this.updateDescription("");
if(params["pv"]) {
this.prevPath = params["pv"];
if(params["return_path"]) {
this.prevPath = params["return_path"] + (params["search_params"] ? ("?"+params["search_params"]) : "");
}
if((typeof document !== 'undefined') && document.referrer) {
this.referrer = document.referrer;

View File

@ -241,8 +241,8 @@ export class ProjectComponent {
this.updateTitle(title);
this.updateDescription(description);
if(params["pv"]) {
this.prevPath = params["pv"];
if(params["return_path"]) {
this.prevPath = params["return_path"] + (params["search_params"] ? ("?"+params["search_params"]) : "");
}
if((typeof document !== 'undefined') && document.referrer) {
this.referrer = document.referrer;
@ -1099,7 +1099,11 @@ export class ProjectComponent {
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
return this.routerHelper.addQueryParam("pv", this.prevPath, obj);
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}

View File

@ -68,8 +68,7 @@
</orcid-work>
</li>
<li *ngIf=" properties.enableEoscDataTransfer && resultLandingInfo.resultType == 'dataset' &&
resultLandingInfo.identifiers && resultLandingInfo.identifiers.get('doi') &&
resultLandingInfo.identifiers.get('doi').join('').indexOf('zenodo.')!=-1"
resultLandingInfo.identifiers && resultLandingInfo.identifiers.get('doi')"
class="uk-text-center">
<egi-transfer-data [dois]="resultLandingInfo.identifiers.get('doi')" [isOpen]="egiTransferModalOpen"></egi-transfer-data>
</li>
@ -120,7 +119,8 @@
<div class="uk-grid uk-grid-small uk-flex-between uk-text-xsmall uk-flex-middle uk-grid-divider" uk-grid>
<div class="uk-width-auto">
<div class="uk-grid uk-grid-small uk-child-width-auto" uk-grid>
<availableOn *ngIf="resultLandingInfo?.hostedBy_collectedFrom?.length" [availableOn]="resultLandingInfo.hostedBy_collectedFrom"></availableOn>
<availableOn *ngIf="resultLandingInfo?.hostedBy_collectedFrom?.length"
[availableOn]="resultLandingInfo.hostedBy_collectedFrom" [prevPath]="prevPath"></availableOn>
<!-- Versions -->
<a *ngIf="resultLandingInfo?.deletedByInferenceIds" (click)="openDeletedByInference()"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
@ -596,7 +596,7 @@
<div class="clickable uk-button-link uk-flex uk-flex-middle uk-h6 uk-margin-remove uk-padding-small uk-padding-remove-horizontal"
(click)=" onSelectActiveTab('availableOn')">
<availableOn [availableOn]="resultLandingInfo.hostedBy_collectedFrom" (viewAllClicked)="viewAll=$event"
[isMobile]="true" [usedBy]="'landing'" class="uk-width-1-1"></availableOn>
[isMobile]="true" [usedBy]="'landing'" class="uk-width-1-1" [prevPath]="prevPath"></availableOn>
</div>
<hr class="uk-margin-remove">
</ng-container>
@ -990,7 +990,8 @@
<img src="assets/common-assets/eosc-logo.png"
loading="lazy" alt="eosc_logo" style="width:27px; height:27px">
<div class="uk-margin-small-left uk-flex uk-flex-column uk-flex-center">
<div *ngFor="let subject of resultLandingInfo.eoscSubjects; let i=index" class="uk-text-truncate">
<div *ngFor="let subject of resultLandingInfo.eoscSubjects; let i=index" class="uk-text-truncate"
uk-tooltip="This interoperability link will provide you with a list of services able to process it in EOSC.">
<a [href]="subject.link" target="_blank" class="custom-external">{{subject.value}}</a>
</div>
</div>

View File

@ -242,9 +242,8 @@ export class ResultLandingComponent {
this.egiTransferModalOpen = true;
}
this.updateDescription("");
if(data["pv"]) {
this.prevPath = data["pv"];
if(data["return_path"]) {
this.prevPath = data["return_path"] + (data["search_params"] ? ("?"+data["search_params"]) : "");
}
if((typeof document !== 'undefined') && document.referrer) {
this.referrer = document.referrer;
@ -772,7 +771,7 @@ export class ResultLandingComponent {
}
if(!this.identifier) {
this._location.go(( pid ? (this.linkToLandingPage.split("?")[0] + "?pid=" + pid.id):
(this.linkToLandingPage + this.id)) + (this.prevPath ? ("&pv="+this.prevPath) : ""));
(this.linkToLandingPage + this.id)) + this.getEoscParams());
}
// else {
// this._location.go(this.linkToLandingPage.split("?")[0] + "?pid=" + this.identifier.id);
@ -1126,15 +1125,31 @@ export class ResultLandingComponent {
}
public getAccessLabel(accessRight) : string {
if(accessRight) {
if (accessRight) {
return (accessRight + (accessRight.toLowerCase().endsWith(" access") ? "" : " access"));
}
return "Not available access";
}
public getEoscParams() {
let params = "";
if(this.prevPath) {
let splitted: string[] = this.prevPath.split("?");
params = "&return_path="+StringUtils.URIEncode(splitted[0]);
if(splitted.length > 0) {
params += "&search_params="+StringUtils.URIEncode(splitted[1]);
}
}
return params;
}
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
return this.routerHelper.addQueryParam("pv", this.prevPath, obj);
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}

View File

@ -13,7 +13,9 @@ import {LoginErrorCodes} from './utils/guardHelper.class';
import {UserManagementService} from "../services/user-management.service";
import {map, tap} from "rxjs/operators";
@Injectable()
@Injectable({
providedIn: 'root'
})
export class AdminLoginGuard implements CanActivate, CanActivateChild {
constructor(private router: Router,

View File

@ -6,15 +6,17 @@ import {
CanLoad,
Route,
Router,
RouterStateSnapshot, UrlTree
RouterStateSnapshot,
UrlTree
} from '@angular/router';
import {Observable} from 'rxjs';
import {Session} from './utils/helper.class';
import {LoginErrorCodes} from './utils/guardHelper.class';
import {map, tap} from "rxjs/operators";
import {UserManagementService} from "../services/user-management.service";
@Injectable()
@Injectable({
providedIn: 'root'
})
export class LoginGuard implements CanActivate, CanLoad, CanActivateChild {
constructor(private router: Router,

View File

@ -6,8 +6,44 @@ export class User {
fullname: string;
expirationDate: number;
role: string[];
jwt: string;
accessToken?: string;
refreshToken?: string;
constructor(info: any) {
this.id = (info.sub && info.sub.indexOf('@')) ? info.sub.substring(0, info.sub.indexOf('@')) : info.sub;
this.firstname = (info.given_name) ? info.given_name : "";
this.lastname = (info.family_name) ? info.family_name : "";
this.email = info.email.toLowerCase(); // TODO remove, is a quick fix
if(info.accessToken) {
this.accessToken = info.accessToken;
}
if(info.refreshToken) {
this.refreshToken = info.refreshToken;
}
this.fullname = (info.name) ? info.name : "";
if (this.fullname == "") {
if (this.firstname != "") {
this.fullname += this.firstname;
}
if (this.lastname != "") {
this.fullname += this.lastname;
}
if (this.fullname == "") { //fullname is still empty set a default
this.fullname = "Anonymous user";
}
}
this.role = [];
if (info.roles) {
info.roles.forEach(role => {
this.role.push(role);
});
} else {
if (info.edu_person_entitlements) {
this.role = info.edu_person_entitlements;
}
}
this.expirationDate = info.exp_date;
}
}
export class Session {

View File

@ -12,6 +12,7 @@ export type IndicatorType = 'number' | 'chart';
export type IndicatorSize = 'small' | 'medium' | 'large';
export type IndicatorPathType = 'table' | 'bar' | 'column' | 'pie' | 'line' | 'other';
export type SourceType = 'statistics' | 'search' |'stats-tool' | 'old' | 'image';
export type Format = 'NUMBER' | 'PERCENTAGE';
export type Visibility = 'PUBLIC' | 'PRIVATE' | 'RESTRICTED';
export class Stakeholder {
@ -21,6 +22,8 @@ export class Stakeholder {
index_id;
index_name: string;
index_shortName: string;
statsProfile: string = "monitor";
locale: string = 'eu';
alias: string;
defaultId: string;
visibility: Visibility;
@ -192,8 +195,9 @@ export class IndicatorPath {
parameters: any;
filters: any;
filtersApplied: number = 0;
format: Format;
constructor(type: IndicatorPathType, source: SourceType, url: string, chartObject: string, jsonPath: string[]) {
constructor(type: IndicatorPathType, source: SourceType, url: string, chartObject: string, jsonPath: string[], format: Format = 'NUMBER') {
this.type = type;
this.url = url;
this.source = source;
@ -202,6 +206,7 @@ export class IndicatorPath {
this.parameters = {};
this.filters = {};
this.filtersApplied = 0;
this.format = format;
}
static createParameters(funderName: string = null, title: string = null, chartType: string = null): any {
@ -213,8 +218,10 @@ export class IndicatorPath {
}
}
export type FilterType = "fundingL0"|"start_year" | "end_year" | "co-funded";
export class IndicatorFilterUtils{
export class IndicatorFilterUtils {
static getFilter(fieldPath: string, filterType:FilterType) {
if((filterType == "start_year" || filterType == "end_year") && (fieldPath.indexOf(".year") != -1 || fieldPath.indexOf(".start year") != -1)

View File

@ -184,6 +184,8 @@ export class TerminologyComponent implements OnInit, OnDestroy, AfterViewInit, A
this.subscriptions.forEach(subscription => {
if (subscription instanceof Subscription) {
subscription.unsubscribe();
} else if(typeof ResizeObserver != 'undefined' && subscription instanceof ResizeObserver) {
subscription.disconnect();
}
});
}

View File

@ -26,27 +26,27 @@ export class ResourcesService {
constructor(private http: HttpClient) {
}
private async getResourcesItemsAsync(prefix = '', portal: string = null): Promise<MenuItem[]> {
private async getResourcesItemsAsync(prefix = '', portal: string = null, target = '_self'): Promise<MenuItem[]> {
let items = [
new MenuItem("methodology", "Methodology", "", "", false, [],
null, {}, null, null, null, null, '_self'),
ResourcesService.setLink(new MenuItem("methodological-approach", "Methodological Approach",
"", "", false, [], null, {}, null, null, null, null, '_self'),
"", "", false, [], null, {}, null, null, null, null, target),
prefix + "/methodology/methodological-approach", portal),
ResourcesService.setLink(new MenuItem("terminology", "Terminology and construction",
"", "", false, [], null, {}, null, null, null, null, '_self'),
"", "", false, [], null, {}, null, null, null, null, target),
prefix + "/methodology/terminology", portal)];
items.push(new MenuItem("indicators-page", "Indicators",
"", "", false, [], null, {}));
items.push(ResourcesService.setLink(new MenuItem("indicator-themes", "Indicator Themes",
"", "", false, [], null, {}, null, null, null, null, '_self'), prefix + "/indicators/themes", portal));
"", "", false, [], null, {}, null, null, null, null, target), prefix + "/indicators/themes", portal));
let promise = new Promise<void>(resolve => {
this.isPagesEnabled().subscribe(status => {
ResourcesService.types.forEach((type, index) => {
if (status[index]) {
items.push(ResourcesService.setLink(
new MenuItem("indicators-" + type.value, type.label,
"", "", false, [], null, {}, null, null, null, null, '_self'),
"", "", false, [], null, {}, null, null, null, null, target),
prefix + "/indicators/" + type.value, portal)
);
}
@ -61,13 +61,13 @@ export class ResourcesService {
return items;
}
setResources(items: MenuItem[], prefix = '', portal: string = null) {
setResources(items: MenuItem[], prefix = '', portal: string = null, target = '_self') {
if (this.subscription) {
this.subscription.unsubscribe();
}
let resources = new MenuItem('resources', 'Resources', "", "", false, [], null, {});
let index = items.push(resources) - 1;
this.subscription = from(this.getResourcesItemsAsync(prefix, portal)).subscribe(resourcesItems => {
this.subscription = from(this.getResourcesItemsAsync(prefix, portal, target)).subscribe(resourcesItems => {
items[index].items = resourcesItems;
});
}

View File

@ -4,13 +4,10 @@ import {BehaviorSubject, from, Observable, Subscriber} from "rxjs";
import {Indicator, Section, Stakeholder, StakeholderInfo, Visibility} from "../entities/stakeholder";
import {HelperFunctions} from "../../utils/HelperFunctions.class";
import {map} from "rxjs/operators";
import {ActivatedRoute} from "@angular/router";
import {properties} from "../../../../environments/environment";
import {CustomOptions} from "../../services/servicesUtils/customOptions.class";
import {StringUtils} from "../../utils/string-utils.class";
let maps: string[] = ['parameters', 'filters'];
export interface Reorder {
action: 'moved' | 'added' | 'removed',
target: string,
@ -21,25 +18,25 @@ export interface Reorder {
providedIn: "root"
})
export class StakeholderService {
private stakeholderSubject: BehaviorSubject<Stakeholder> = null;
private promise: Promise<void>;
private sub;
constructor(private http: HttpClient) {
this.stakeholderSubject = new BehaviorSubject<Stakeholder>(null);
}
ngOnDestroy() {
this.clearSubscriptions();
}
clearSubscriptions() {
if (this.sub instanceof Subscriber) {
this.sub.unsubscribe();
}
}
getStakeholder(alias: string, shouldUpdate: boolean = false): Observable<Stakeholder> {
if (!this.stakeholderSubject.value || this.stakeholderSubject.value.alias !== alias || shouldUpdate) {
this.promise = new Promise<void>((resolve, reject) => {
@ -56,78 +53,80 @@ export class StakeholderService {
}
return from(this.getStakeholderAsync());
}
async getStakeholderAsync() {
if(this.promise) {
if (this.promise) {
await this.promise;
this.promise = null;
}
this.clearSubscriptions();
return this.stakeholderSubject.getValue();
}
getAlias(url: string): Observable<string[]> {
return this.http.get<Stakeholder[]>(url + '/stakeholder/alias', CustomOptions.registryOptions()).pipe(map(stakeholders => {
return this.formalize(stakeholders);
}));
}
getStakeholders(url: string, type: string = null, defaultId: string = null): Observable<(Stakeholder & StakeholderInfo)[]> {
return this.http.get<Stakeholder[]>(url + '/stakeholder' + ((type) ? ('?type=' + type) : '') + ((!type && defaultId)? ('?defaultId=' + defaultId):''), CustomOptions.registryOptions()).pipe(map(stakeholders => {
return this.http.get<Stakeholder[]>(url + '/stakeholder' + ((type) ? ('?type=' + type) : '') + ((!type && defaultId) ? ('?defaultId=' + defaultId) : ''), CustomOptions.registryOptions()).pipe(map(stakeholders => {
return this.formalize(this.checkIsUpload(stakeholders));
}));
}
getMyStakeholders(url: string, type: string = null): Observable<(Stakeholder & StakeholderInfo)[]> {
return this.http.get<Stakeholder[]>(url + '/my-stakeholder' + ((type) ? ('?type=' + type) : ''), CustomOptions.registryOptions()).pipe(map(stakeholders => {
return this.formalize(this.checkIsUpload(stakeholders));
}));
}
getDefaultStakeholders(url: string, type: string = null): Observable<Stakeholder[]> {
return this.http.get<Stakeholder[]>(url + '/stakeholder/default' + ((type) ? ('?type=' + type) : ''), CustomOptions.registryOptions()).pipe(map(stakeholders => {
return this.formalize(this.checkIsUpload(stakeholders));
}));
}
buildStakeholder(url: string, stakeholder: Stakeholder): Observable<Stakeholder> {
if(stakeholder.alias && stakeholder.alias.startsWith('/')) {
stakeholder.alias = stakeholder.alias.slice(1);
}
if (stakeholder.alias && stakeholder.alias.startsWith('/')) {
stakeholder.alias = stakeholder.alias.slice(1);
}
return this.http.post<Stakeholder>(url + '/build-stakeholder', stakeholder, CustomOptions.registryOptions()).pipe(map(stakeholder => {
return this.formalize(this.checkIsUpload(stakeholder));
}));
}
changeVisibility(url: string, path: string[], visibility: Visibility, propagate: boolean = false): Observable<any> {
return this.http.post<Visibility>(url + '/' + path.join('/') + '/change-visibility' + '?visibility=' + visibility + (propagate?'&propagate=true':''), null, CustomOptions.registryOptions());
return this.http.post<Visibility>(url + '/' + path.join('/') + '/change-visibility' + '?visibility=' + visibility + (propagate ? '&propagate=true' : ''), null, CustomOptions.registryOptions());
}
saveElement(url: string, element: any, path: string[] = []): Observable<any> {
if(element.alias && element.alias.startsWith('/')) {
element.alias = element.alias.slice(1);
}
if (element.alias && element.alias.startsWith('/')) {
element.alias = element.alias.slice(1);
}
path = HelperFunctions.encodeArray(path);
return this.http.post<any>(url + ((path.length > 0) ? '/' : '') + path.join('/') +
'/save', element, CustomOptions.registryOptions()).pipe(map(element => {
if(path.length === 0) {
return this.formalize(this.checkIsUpload(element));
} else {
return this.formalize(element);
}
}));
}
saveBulkElements(url: string, indicators, path: string[] = []): Observable<any> {
path = HelperFunctions.encodeArray(path);
return this.http.post<any>(url + ((path.length > 0) ? '/' : '') + path.join('/') +
'/save-bulk', indicators, CustomOptions.registryOptions()).pipe(map(element => {
if(path.length === 0) {
if (path.length === 0) {
return this.formalize(this.checkIsUpload(element));
} else {
return this.formalize(element);
}
}));
}
saveBulkElements(url: string, indicators, path: string[] = []): Observable<any> {
path = HelperFunctions.encodeArray(path);
return this.http.post<any>(url + ((path.length > 0) ? '/' : '') + path.join('/') +
'/save-bulk', indicators, CustomOptions.registryOptions()).pipe(map(element => {
if (path.length === 0) {
return this.formalize(this.checkIsUpload(element));
} else {
return this.formalize(element);
}
}));
}
saveSection(url: string, element: any, path: string[] = [], index: number = -1): Observable<Section> {
path = HelperFunctions.encodeArray(path);
return this.http.post<Section>(url + ((path.length > 0) ? '/' : '') + path.join('/') +
@ -135,7 +134,7 @@ export class StakeholderService {
return this.formalize(element);
}));
}
deleteElement(url: string, path: string[], childrenAction: string = null): Observable<any> {
path = HelperFunctions.encodeArray(path);
let params: string = "";
@ -144,29 +143,29 @@ export class StakeholderService {
}
return this.http.delete<any>(url + '/' + path.join('/') + '/delete' + params, CustomOptions.registryOptions());
}
reorderElements(url: string, path: string[], ids: string[]): Observable<any> {
path = HelperFunctions.encodeArray(path);
return this.http.post<any>(url + '/' + path.join('/') + '/reorder', ids, CustomOptions.registryOptions());
}
reorderIndicators(url: string, path: string[], reorder: Reorder, type: string = 'chart'): Observable<Indicator[]> {
path = HelperFunctions.encodeArray(path);
return this.http.post<Indicator[]>(url + '/' + path.join('/') + '/' + type + '/reorder', reorder, CustomOptions.registryOptions()).pipe(map(indicators => {
return this.formalize(indicators);
}));
}
getStakeholderAsObservable(): Observable<Stakeholder> {
return this.stakeholderSubject.asObservable();
}
setStakeholder(stakeholder: Stakeholder) {
this.stakeholderSubject.next(stakeholder);
}
private checkIsUpload(response: Stakeholder | Stakeholder[]): any | any[] {
if(Array.isArray(response)) {
if (Array.isArray(response)) {
response.forEach(value => {
value.isUpload = value.logoUrl && !StringUtils.isValidUrl(value.logoUrl);
});
@ -175,7 +174,7 @@ export class StakeholderService {
}
return response;
}
private formalize(element: any) {
return HelperFunctions.copy(element);
}

View File

@ -55,26 +55,26 @@ export class SdgComponent implements OnInit, OnDestroy {
this.updateUrl(this.url);
this.updateTitle(this.pageTitle);
this.updateDescription(this.pageDescription);
this.vocabulariesService.getSDGs(properties).subscribe(data => {
this.subscriptions.push(this.vocabulariesService.getSDGs(properties).subscribe(data => {
this.sdgs = data['sdg'];
});
this.subscriptions.push(this.refineFieldResultsService.getRefineFieldsResultsByEntityName(['sdg'], 'result', this.properties, refineParams).subscribe(data => {
this.sdgsResearchOutcomes = data[1][0].values;
let merged =[];
for(let i=0; i<this.sdgs.length; i++){
merged.push({
...this.sdgs[i],
...(this.sdgsResearchOutcomes.find((innerItem) => innerItem.id === this.sdgs[i].id))
});
}
this.displayedSdgs = merged;
this.loading = false;
}));
}));
let refineParams = null;
if(this.customFilter) {
let refineValue = StringUtils.URIEncode(this.customFilter.queryFieldName + " exact " + StringUtils.quote((this.customFilter.valueId)));
refineParams = '&fq=' + refineValue;
}
this.refineFieldResultsService.getRefineFieldsResultsByEntityName(['sdg'], 'result', this.properties, refineParams).subscribe(data => {
this.sdgsResearchOutcomes = data[1][0].values;
let merged =[];
for(let i=0; i<this.sdgs.length; i++){
merged.push({
...this.sdgs[i],
...(this.sdgsResearchOutcomes.find((innerItem) => innerItem.id === this.sdgs[i].id))
});
}
this.displayedSdgs = merged;
this.loading = false;
});
}
public ngOnDestroy() {

View File

@ -56,6 +56,7 @@ export class EntitiesSelectionComponent {
showPage["" + data['pages'][i]["route"] + ""] = data['pages'][i]["isEnabled"];
}
}
this.entities = [];
if(this.onlyresults) {
if(this.simpleView) {
this.entities.push({label: 'All ' + OpenaireEntities.RESULTS.toLowerCase(), value: 'all'});

View File

@ -3,7 +3,7 @@
<errorMessages [status]="[status]" [type]="'results'"></errorMessages>
<li *ngFor="let result of results">
<div class="uk-card uk-card-default uk-position-relative uk-flex uk-flex-column uk-flex-center"
[ngClass]="result.type" [class.uk-disabled]="!hasPermission(result)">
[ngClass]="result.type" [class.noColor]="properties.adminToolsPortalType == 'connect'" [class.uk-disabled]="!hasPermission(result)">
<div *ngIf="type === 'community' && result.isSubscribed" [class.uk-position-top-left]="!isMobile" [class.uk-position-top-right]="isMobile" class="uk-text-background uk-text-center uk-padding-small uk-text-uppercase uk-text-bold">
<span>Member</span>
</div>
@ -49,7 +49,7 @@
</div>
</div>
<div *ngIf="result.description && !isMobile" class="uk-margin-top uk-text-small multi-line-ellipsis lines-3">
<p class="uk-text-meta" [innerHTML]="result.description"></p>
<p class="uk-text-meta" >{{result.description | htmlToString}}</p>
</div>
</div>
<div class="uk-width-1-5@m uk-width-1-3 uk-flex-first@m">

View File

@ -11,15 +11,15 @@
@media(min-width: @breakpoint-medium) {
.uk-card {
&.funder {
&.funder:not(.noColor) {
.setType(@funder-color);
}
&.ri {
&.ri:not(.noColor) {
.setType(@ri-color);
}
&.organization {
&.organization:not(.noColor) {
.setType(@organization-color);
}
}
@ -27,15 +27,15 @@
@media(max-width: @breakpoint-small-max) {
.uk-card {
&.funder {
&.funder:not(.noColor) {
.setType(@funder-color, bottom);
}
&.ri {
&.ri:not(.noColor) {
.setType(@ri-color, bottom);
}
&.organization {
&.organization:not(.noColor) {
.setType(@organization-color, bottom);
}
}

View File

@ -11,12 +11,13 @@ import {UrlPrefixModule} from "../../utils/pipes/url-prefix.module";
import {IconsService} from "../../utils/icons/icons.service";
import {incognito, restricted} from "../../utils/icons/icons";
import {LogoUrlPipeModule} from "../../utils/pipes/logoUrlPipe.module";
import {HTMLToStringPipeModule} from "../../utils/pipes/HTMLToStringPipe.module";
@NgModule({
imports: [
CommonModule, FormsModule,
RouterModule, ErrorMessagesModule,
AlertModalModule, ManageModule, IconsModule, UrlPrefixModule, LogoUrlPipeModule
AlertModalModule, ManageModule, IconsModule, UrlPrefixModule, LogoUrlPipeModule, HTMLToStringPipeModule
],
declarations: [
PortalSearchResultComponent

View File

@ -58,7 +58,7 @@ export class MetricsService {
info = {};
info.name = result[2];
info.url = properties.searchLinkToDataProvider+id;
info.url = id;
info.numOfDownloads = "0";
info.openaireDownloads = "0";
info.numOfViews = "0";

View File

@ -41,7 +41,7 @@ export class UserManagementService {
public updateUserInfo(resolve: Function = null) {
this.subscription = this.http.get<User>(properties.userInfoUrl, CustomOptions.registryOptions()).pipe(map(userInfo => {
return this.parseUserInfo(userInfo);
return new User(userInfo);
})).subscribe(user => {
this.getUserInfoSubject.next(user);
if (resolve) {
@ -54,39 +54,7 @@ export class UserManagementService {
}
});
}
private parseUserInfo(info: any) {
const user: User = new User();
user.id = (info.sub && info.sub.indexOf('@')) ? info.sub.substring(0, info.sub.indexOf('@')) : info.sub;
user.firstname = (info.given_name) ? info.given_name : "";
user.lastname = (info.family_name) ? info.family_name : "";
user.email = info.email.toLowerCase(); // TODO remove, is a quick fix
user.fullname = (info.name) ? info.name : "";
if (user.fullname == "") {
if (user.firstname != "") {
user.fullname += user.firstname;
}
if (user.lastname != "") {
user.fullname += user.lastname;
}
if (user.fullname == "") { //fullname is still empty set a default
user.fullname = "Anonymous user";
}
}
user.role = [];
if (info.roles) {
info.roles.forEach(role => {
user.role.push(role);
});
} else {
if (info.edu_person_entitlements) {
user.role = info.edu_person_entitlements;
}
}
user.expirationDate = info.exp_date;
return user;
}
public setRedirectUrl(url: string = null) {
if (url) {
let parts = url.split('?');

View File

@ -113,7 +113,7 @@
<li><a target="_blank" href="https://www.openaire.eu/guides">Guides</a></li>
<li><a target="_blank" href="https://www.openaire.eu/faqs">FAQs</a></li>
<li><a target="_blank" href="https://www.openaire.eu/frontpage/webinars">Webinars</a></li>
<li><a target="_blank" href="https://www.openaire.eu/support/helpdesk">Ask a question</a></li>
<li><a target="_blank" href="https://www.openaire.eu/helpdesk">Ask a question</a></li>
</ul>
</div>
</div>

View File

@ -23,15 +23,15 @@ import {properties} from "../../../../environments/environment";
import {ClickEvent} from "../../utils/click/click-outside-or-esc.directive";
export type InputType =
'text'
| 'URL'
| 'logoURL'
| 'autocomplete'
| 'autocomplete_soft'
| 'textarea'
| 'select'
| 'chips'
| 'year-range';
'text'
| 'URL'
| 'logoURL'
| 'autocomplete'
| 'autocomplete_soft'
| 'textarea'
| 'select'
| 'chips'
| 'year-range';
export interface Option {
icon?: string,
@ -70,144 +70,144 @@ declare var UIkit;
@Component({
selector: '[dashboard-input], [input]',
template: `
<div *ngIf="formControl" [id]="id">
<div class="input-wrapper" [class.disabled]="formControl.disabled" [class.opened]="opened"
[class.focused]="focused" [ngClass]="inputClass" [class.hint]="hint"
[class.active]="!focused && (formAsControl?.value || selectable || formAsArray?.length > 0 || getLabel(formAsControl?.value) || yearRangeActive)"
[class.danger]="(formControl.invalid && (formControl.touched || !!searchControl?.touched)) || (!!searchControl?.invalid && !!searchControl?.touched)">
<div #inputBox class="input-box" [class.select]="selectable" click-outside-or-esc
[class.static]="placeholderInfo?.static" (clickOutside)="click($event)">
<div *ngIf="!placeholderInfo?.static && placeholderInfo?.label" class="placeholder">
<label>{{placeholderInfo.label}} <sup *ngIf="required">*</sup></label>
</div>
<div class="uk-flex" [class.uk-flex-middle]="type !== 'textarea'"
[attr.uk-tooltip]="(tooltip && !focused && type !== 'chips' && type !== 'textarea' && (formControl.value || hint || placeholderInfo?.label))?('title: ' + (formControl.value ?getTooltip(formControl.value):(hint?hint:placeholderInfo?.label)) + '; delay: 500; pos: bottom-left'):null">
<ng-template [ngIf]="type === 'text' || type === 'URL' || type === 'logoURL'">
<input #input class="input" [attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
[type]="password?'password':'text'" [formControl]="formAsControl"
[class.uk-text-truncate]="!focused">
</ng-template>
<ng-template [ngIf]="type === 'textarea'">
<div *ngIf="formControl" [id]="id">
<div class="input-wrapper" [class.disabled]="formControl.disabled" [class.opened]="opened"
[class.focused]="focused" [ngClass]="inputClass" [class.hint]="hint"
[class.active]="!focused && (formAsControl?.value || selectable || formAsArray?.length > 0 || getLabel(formAsControl?.value) || yearRangeActive)"
[class.danger]="(formControl.invalid && (formControl.touched || !!searchControl?.touched)) || (!!searchControl?.invalid && !!searchControl?.touched)">
<div #inputBox class="input-box" [class.select]="selectable" click-outside-or-esc
[class.static]="placeholderInfo?.static" (clickOutside)="click($event)">
<div *ngIf="!placeholderInfo?.static && placeholderInfo?.label" class="placeholder">
<label>{{placeholderInfo.label}} <sup *ngIf="required">*</sup></label>
</div>
<div class="uk-flex" [class.uk-flex-middle]="type !== 'textarea'"
[attr.uk-tooltip]="(tooltip && !focused && type !== 'chips' && type !== 'textarea' && (formControl.value || hint || placeholderInfo?.label))?('title: ' + (formControl.value ?getTooltip(formControl.value):(hint?hint:placeholderInfo?.label)) + '; delay: 500; pos: bottom-left'):null">
<ng-template [ngIf]="type === 'text' || type === 'URL' || type === 'logoURL'">
<input #input class="input" [attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
[type]="password?'password':'text'" [formControl]="formAsControl"
[class.uk-text-truncate]="!focused">
</ng-template>
<ng-template [ngIf]="type === 'textarea'">
<textarea #textArea class="input" [attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
[rows]="rows" [formControl]="formAsControl"></textarea>
</ng-template>
<ng-template [ngIf]="type === 'select'">
<ng-container *ngIf="placeholderInfo?.static">
<div *ngIf="!getLabel(formControl.value)"
class="input placeholder uk-width-expand uk-text-truncate">{{placeholderInfo.label}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-width-expand uk-text-truncate">{{getLabel(formControl.value)}}</div>
</ng-container>
<ng-container *ngIf="!placeholderInfo?.static">
<div *ngIf="!getLabel(formControl.value)"
class="input uk-width-expand uk-text-truncate">{{noValueSelected}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-width-expand uk-text-truncate">{{getLabel(formControl.value)}}</div>
</ng-container>
</ng-template>
<ng-template [ngIf]="type === 'autocomplete'">
<input *ngIf="focused" [attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
#searchInput class="input" [formControl]="searchControl" [class.uk-text-truncate]="!focused">
<ng-container *ngIf="!focused && !selectable">
<div *ngIf="!getLabel(formControl.value)"
class="input placeholder uk-text-truncate">{{placeholderInfo?.static ? placeholderInfo.label : getLabel(formAsControl.value)}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-text-truncate">{{getLabel(formAsControl.value)}}</div>
</ng-container>
<ng-container *ngIf="!focused && selectable">
<div *ngIf="!getLabel(formControl.value)" class="input uk-text-truncate">{{noValueSelected}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-text-truncate">{{getLabel(formControl.value)}}</div>
</ng-container>
</ng-template>
<ng-template [ngIf]="type === 'autocomplete_soft'">
<input #input class="input" [attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
[formControl]="formAsControl" [class.uk-text-truncate]="!focused">
</ng-template>
<ng-template [ngIf]="type === 'chips'">
<div class="uk-grid uk-grid-small uk-grid-row-collapse uk-overflow-auto uk-width-expand"
[class.uk-flex-nowrap]="noWrap" [class.uk-overflow-auto]="noWrap" uk-grid>
<div *ngFor="let chip of formAsArray.controls; let i=index" #chip
[class.uk-hidden]="!focused && i > visibleChips - 1"
class="chip">
<div class="uk-label uk-label-small uk-text-transform-none uk-flex uk-flex-middle"
[attr.uk-tooltip]="(tooltip)?('title: ' + getLabel(chip.value) + '; delay: 500; pos: bottom-left'):null">
<span class="uk-text-truncate uk-width-expand">{{getLabel(chip.value)}}</span>
<icon *ngIf="focused" (click)="remove(i, $event)"
class="uk-link-text uk-margin-small-left clickable" [flex]="true"
name="close" ratio="0.7"></icon>
</ng-template>
<ng-template [ngIf]="type === 'select'">
<ng-container *ngIf="placeholderInfo?.static">
<div *ngIf="!getLabel(formControl.value)"
class="input placeholder uk-width-expand uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{placeholderInfo.label}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-width-expand uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{getLabel(formControl.value)}}</div>
</ng-container>
<ng-container *ngIf="!placeholderInfo?.static">
<div *ngIf="!getLabel(formControl.value)"
class="input uk-width-expand uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{noValueSelected}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-width-expand uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{getLabel(formControl.value)}}</div>
</ng-container>
</ng-template>
<ng-template [ngIf]="type === 'autocomplete'">
<input *ngIf="focused" [attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
#searchInput class="input" [formControl]="searchControl" [class.uk-text-truncate]="!focused">
<ng-container *ngIf="!focused && !selectable">
<div *ngIf="!getLabel(formControl.value)"
class="input placeholder uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{placeholderInfo?.static ? placeholderInfo.label : getLabel(formAsControl.value)}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{getLabel(formAsControl.value)}}</div>
</ng-container>
<ng-container *ngIf="!focused && selectable">
<div *ngIf="!getLabel(formControl.value)" class="input uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{noValueSelected}}</div>
<div *ngIf="getLabel(formControl.value)"
class="input uk-text-truncate" [class.uk-disabled]="formControl.disabled">{{getLabel(formControl.value)}}</div>
</ng-container>
</ng-template>
<ng-template [ngIf]="type === 'autocomplete_soft'">
<input #input class="input" [attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
[formControl]="formAsControl" [class.uk-text-truncate]="!focused">
</ng-template>
<ng-template [ngIf]="type === 'chips'">
<div class="uk-grid uk-grid-small uk-grid-row-collapse uk-overflow-auto uk-width-expand"
[class.uk-flex-nowrap]="noWrap" [class.uk-overflow-auto]="noWrap" uk-grid>
<div *ngFor="let chip of formAsArray.controls; let i=index" #chip
[class.uk-hidden]="!focused && i > visibleChips - 1"
class="chip">
<div class="uk-label uk-label-small uk-text-transform-none uk-flex uk-flex-middle"
[attr.uk-tooltip]="(tooltip)?('title: ' + getLabel(chip.value) + '; delay: 500; pos: bottom-left'):null">
<span class="uk-text-truncate uk-width-expand">{{getLabel(chip.value)}}</span>
<icon *ngIf="focused" (click)="remove(i, $event)"
class="uk-link-text uk-margin-small-left clickable" [flex]="true"
name="close" ratio="0.7"></icon>
</div>
</div>
<div *ngIf="searchControl && (focused || formAsArray.length === 0)" #chip
class="uk-width-expand search-input uk-flex uk-flex-column uk-flex-center">
<input #searchInput class="input" [class.search]="searchControl.value"
[attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
[formControl]="searchControl" [class.uk-text-truncate]="!focused">
</div>
<div *ngIf="!focused && formAsArray.length > visibleChips"
class="uk-width-expand uk-flex uk-flex-column uk-flex-center more">
+ {{(formAsArray.length - visibleChips)}} more
</div>
</div>
</ng-template>
<ng-template [ngIf]="type === 'year-range' && yearRange && formAsGroup">
<div class="uk-width-2-5">
<input #input class="input uk-text-center uk-text-truncate" [attr.placeholder]="yearRange.from.placeholder"
maxlength="4" (click)="activeIndex = 0;$event.preventDefault()" [formControl]="getFormByName(yearRange.from.control)">
</div>
<div class="uk-width-1-5 uk-text-center">-</div>
<div class="uk-width-2-5">
<input #input class="input uk-text-center uk-text-truncate" [attr.placeholder]="yearRange.to.placeholder"
maxlength="4" (click)="activeIndex = 1;$event.preventDefault()" [formControl]="getFormByName(yearRange.to.control)">
</div>
</ng-template>
<div
*ngIf="(formControl.disabled && disabledIcon) || icon || (selectable && selectArrow) || type === 'autocomplete' || searchable"
class="uk-margin-small-left icon">
<icon *ngIf="formControl.disabled && disabledIcon" [name]="disabledIcon" [flex]="true"></icon>
<ng-template [ngIf]="formControl.enabled">
<icon *ngIf="!searchControl?.value && icon" [name]="icon" [flex]="true"></icon>
<icon *ngIf="!icon && selectable && selectArrow" [name]="selectArrow" [flex]="true"></icon>
<button *ngIf="focused && type === 'autocomplete'" class="uk-close uk-icon"
(click)="resetSearch($event)">
<icon [flex]="true" name="close"></icon>
</button>
<button *ngIf="(!focused && type === 'autocomplete') || (type !== 'autocomplete' && !searchControl?.value && !!formControl?.value && (searchable || !selectable))"
class="uk-close uk-icon" (click)="resetValue($event)">
<icon [flex]="true" name="close"></icon>
</button>
</ng-template>
</div>
<!-- use action-icon class in order to apply css in your icon button-->
<ng-content select="[action]"></ng-content>
</div>
<div class="tools">
<ng-content select="[tools]"></ng-content>
</div>
</div>
<div *ngIf="searchControl && (focused || formAsArray.length === 0)" #chip
class="uk-width-expand search-input uk-flex uk-flex-column uk-flex-center">
<input #searchInput class="input" [class.search]="searchControl.value"
[attr.placeholder]="placeholderInfo?.static?placeholderInfo.label:hint"
[formControl]="searchControl" [class.uk-text-truncate]="!focused">
</div>
<div *ngIf="!focused && formAsArray.length > visibleChips"
class="uk-width-expand uk-flex uk-flex-column uk-flex-center more">
+ {{(formAsArray.length - visibleChips)}} more
</div>
</div>
</ng-template>
<ng-template [ngIf]="type === 'year-range' && yearRange && formAsGroup">
<div class="uk-width-2-5">
<input #input class="input uk-text-center uk-text-truncate" [attr.placeholder]="yearRange.from.placeholder"
maxlength="4" (click)="activeIndex = 0;$event.preventDefault()" [formControl]="getFormByName(yearRange.from.control)">
</div>
<div class="uk-width-1-5 uk-text-center">-</div>
<div class="uk-width-2-5">
<input #input class="input uk-text-center uk-text-truncate" [attr.placeholder]="yearRange.to.placeholder"
maxlength="4" (click)="activeIndex = 1;$event.preventDefault()" [formControl]="getFormByName(yearRange.to.control)">
</div>
</ng-template>
<div
*ngIf="(formControl.disabled && disabledIcon) || icon || (selectable && selectArrow) || type === 'autocomplete' || searchable"
class="uk-margin-small-left icon">
<icon *ngIf="formControl.disabled && disabledIcon" [name]="disabledIcon" [flex]="true"></icon>
<ng-template [ngIf]="formControl.enabled">
<icon *ngIf="!searchControl?.value && icon" [name]="icon" [flex]="true"></icon>
<icon *ngIf="!icon && selectable && selectArrow" [name]="selectArrow" [flex]="true"></icon>
<button *ngIf="!!searchControl?.value && type === 'autocomplete'" class="uk-close uk-icon"
(click)="resetSearch($event)">
<icon [flex]="true" name="close"></icon>
</button>
<button *ngIf="!searchControl?.value && !!formControl?.value && (searchable || !selectable)"
class="uk-close uk-icon" (click)="resetValue($event)">
<icon [flex]="true" name="close"></icon>
</button>
</ng-template>
</div>
<!-- use action-icon class in order to apply css in your icon button-->
<ng-content select="[action]"></ng-content>
</div>
<div class="tools">
<ng-content select="[tools]"></ng-content>
</div>
</div>
</div>
<div class="options uk-dropdown" *ngIf="filteredOptions && filteredOptions.length > 0 && opened" #optionBox
uk-dropdown="pos: bottom-justify; mode: none; offset: 15; boundary-align: true;" [attr.boundary]="'#' + id">
<ul class="uk-nav uk-dropdown-nav">
<li *ngFor="let option of filteredOptions; let i=index" [class.uk-hidden]="option.hidden"
[class.uk-active]="(formControl.value === option.value) || selectedIndex === i">
<a (click)="selectOption(option, $event)"
[class]="option.disabled ? 'uk-disabled uk-text-muted' : ''">
<div class="options uk-dropdown" *ngIf="filteredOptions && filteredOptions.length > 0 && opened" #optionBox
uk-dropdown="pos: bottom-justify; mode: none; offset: 15; boundary-align: true;" [attr.boundary]="'#' + id">
<ul class="uk-nav uk-dropdown-nav">
<li *ngFor="let option of filteredOptions; let i=index" [class.uk-hidden]="option.hidden"
[class.uk-active]="(formControl.value === option.value) || selectedIndex === i">
<a (click)="selectOption(option, $event)"
[class]="option.disabled ? 'uk-disabled uk-text-muted' : ''">
<span
[attr.uk-tooltip]="(tooltip)?('title: ' + (option.tooltip ? option.tooltip : option.label) + '; delay: 500; pos:bottom-left'):null">{{option.label}}</span>
</a>
</li>
</ul>
[attr.uk-tooltip]="(tooltip)?('title: ' + (option.tooltip ? option.tooltip : option.label) + '; delay: 500; pos:bottom-left'):null">{{option.label}}</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<span *ngIf="formControl?.invalid && formControl?.touched" class="uk-text-danger">
<span *ngIf="formControl?.invalid && formControl?.touched" class="uk-text-danger">
<span *ngIf="errors?.error">{{errors?.error}}</span>
<span *ngIf="type === 'URL' || type === 'logoURL'">Please provide a valid URL (e.g. https://example.com)</span>
</span>
<span class="uk-text-small uk-text-danger">
<span class="uk-text-small uk-text-danger">
<ng-content select="[error]"></ng-content>
</span>
<span *ngIf="formControl?.valid" class="uk-text-small uk-text-warning uk-margin-xsmall-top">
<span *ngIf="formControl?.valid" class="uk-text-small uk-text-warning uk-margin-xsmall-top">
<ng-content select="[warning]"></ng-content>
<span *ngIf="!secure">
<span class="uk-text-bold">Note:</span> Prefer urls like "<span class="uk-text-bold">https://</span>example.com/my-secure-image.png"
@ -215,9 +215,9 @@ declare var UIkit;
<span class="uk-text-bold">Browsers may not load non secure content.</span>
</span>
</span>
<i class="uk-text-small uk-text-meta uk-margin-xsmall-top">
<ng-content select="[note]"></ng-content>
</i>
<i class="uk-text-small uk-text-meta uk-margin-xsmall-top">
<ng-content select="[note]"></ng-content>
</i>
`
})
export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChanges {
@ -261,7 +261,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
/** Year Range Configuration */
@Input() yearRange: YearRange;
public activeIndex: 0 | 1 | null = null;
@Input() visibleRows: number = -1;
@Input() extendEnter: () => void = null;
@Output() focusEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();
@ -282,7 +282,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
@ViewChild('optionBox') optionBox: ElementRef;
@ViewChild('searchInput') searchInput: ElementRef;
@ViewChildren('chip') chips: QueryList<ElementRef>;
@Input()
set placeholder(placeholder: string | Placeholder) {
if(this.type === 'year-range') {
@ -297,7 +297,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.placeholderInfo = placeholder;
}
}
@Input()
set options(options: (Option | string | number) []) {
this.optionsArray = options.map(option => {
@ -322,13 +322,13 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.selectable = true;
}
}
constructor(private elementRef: ElementRef, private cdr: ChangeDetectorRef) {
if (elementRef.nativeElement.hasAttribute('dashboard-input') && this.properties.environment === "development") {
console.warn("'dashboard-input' selector is deprecated; use 'input' instead.");
}
}
@HostListener('window:keydown.arrowUp', ['$event'])
arrowUp(event: KeyboardEvent) {
if (this.opened) {
@ -339,7 +339,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
}
}
@HostListener('window:keydown.arrowDown', ['$event'])
arrowDown(event: KeyboardEvent) {
if (this.opened) {
@ -350,7 +350,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
}
}
@HostListener('window:keydown.arrowLeft', ['$event'])
arrowLeft(event: KeyboardEvent) {
if (this.type === 'chips' && this.focused) {
@ -364,7 +364,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
}
}
@HostListener('window:keydown.arrowRight', ['$event'])
arrowRight(event: KeyboardEvent) {
if (this.type === 'chips' && this.focused) {
@ -378,7 +378,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
}
}
@HostListener('window:keydown.enter', ['$event'])
enter(event: KeyboardEvent) {
if (this.extendEnter) {
@ -395,7 +395,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.focus(false, event);
}
}
@HostListener('keydown', ['$event'])
onKeyDown(event: KeyboardEvent) {
if (this.separators.includes(event.key) || this.separators.includes(event.key.toLowerCase())) {
@ -403,11 +403,11 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.add(event, true);
}
}
click(event: ClickEvent) {
this.focus(!event.clicked, event);
this.focus(!event.clicked);
}
ngOnInit() {
InputComponent.INPUT_COUNTER++;
this.id = 'input-' + InputComponent.INPUT_COUNTER;
@ -430,11 +430,11 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
})
}
ngAfterViewInit() {
this.reset();
}
ngOnChanges(changes: SimpleChanges) {
if (this.formControl) {
if (changes.value) {
@ -455,11 +455,11 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
}
}
ngOnDestroy(): void {
this.unsubscribe();
}
getFormByName(name: string): UntypedFormControl {
if (this.formControl instanceof UntypedFormGroup) {
return <UntypedFormControl>this.formControl.get(name);
@ -467,7 +467,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
return null;
}
}
get formAsGroup(): UntypedFormGroup {
if (this.formControl instanceof UntypedFormGroup) {
return this.formControl;
@ -475,7 +475,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
return null;
}
}
get formAsControl(): UntypedFormControl {
if (this.formControl instanceof UntypedFormControl) {
return this.formControl;
@ -483,7 +483,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
return null;
}
}
get formAsArray(): UntypedFormArray {
if (this.formControl instanceof UntypedFormArray) {
return this.formControl;
@ -491,26 +491,26 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
return null;
}
}
get yearRangeActive(): boolean {
if(this.yearRange) {
return this.formAsGroup && (this.getFormByName(this.yearRange.from.control)?.value || this.getFormByName(this.yearRange.to.control)?.value);
}
return false;
}
get errors(): any {
if(this.formAsGroup) {
return (this.formAsGroup.errors
?this.formAsGroup.errors:(this.getFormByName(this.yearRange.from.control).errors
?this.getFormByName(this.yearRange.from.control).errors:this.getFormByName(this.yearRange.to.control).errors));
?this.formAsGroup.errors:(this.getFormByName(this.yearRange.from.control).errors
?this.getFormByName(this.yearRange.from.control).errors:this.getFormByName(this.yearRange.to.control).errors));
} else if(this.formAsControl) {
return this.formAsControl.errors;
} else {
return this.searchControl.errors;
}
}
reset() {
this.secure = true;
this.unsubscribe();
@ -532,8 +532,10 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
if (this.focused) {
this.open(true);
setTimeout(() => {
this.searchInput.nativeElement.focus();
this.searchInput.nativeElement.value = value;
if(this.searchInput) {
this.searchInput.nativeElement.focus();
this.searchInput.nativeElement.value = value;
}
}, 0);
}
}));
@ -599,7 +601,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
});
}
}
unsubscribe() {
this.subscriptions.forEach(subscription => {
if (subscription instanceof Subscription) {
@ -607,7 +609,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
});
}
updateValidators() {
if (this.formAsArray) {
this.formAsArray.controls.forEach(control => {
@ -619,7 +621,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.formControl.updateValueAndValidity();
}
}
remove(index: number, event) {
if (this.focused) {
this.formAsArray.removeAt(index);
@ -629,7 +631,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
event.stopPropagation();
}
}
private filter(value: string): Option[] {
let options = this.optionsArray.filter(option => !option.hidden);
if (this.type === "chips") {
@ -647,7 +649,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
return options;
}
add(event, addChips = false) {
if (addChips && this.searchControl.value) {
this.splitSearchControl();
@ -655,7 +657,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.searchControl.setValue('');
}
}
splitSearchControl() {
let values = [this.searchControl.value];
this.separators.forEach(separator => {
@ -679,17 +681,17 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.searchControl.setValue('');
}
}
getLabel(value: any): string {
let option = this.optionsArray.find(option => HelperFunctions.equals(option.value, value));
return (option) ? option.label : (value);
}
getTooltip(value: any): string {
let option = this.optionsArray.find(option => HelperFunctions.equals(option.value, value));
return (option) ? (option.tooltip ? option.tooltip : option.label) : (value);
}
focus(value: boolean, event = null) {
if(!this.activeIndex) {
this.activeIndex = 0;
@ -697,41 +699,43 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
if (this.focused) {
this.formControl.markAsTouched();
}
this.focused = value;
this.cdr.detectChanges();
if (this.focused) {
if (this.input?.length > 0) {
this.input.get(this.activeIndex).nativeElement.focus();
} else if (this.textArea) {
this.textArea.nativeElement.focus();
} else if (this.searchInput) {
this.searchInput.nativeElement.focus();
this.activeElement.next(this.chips.last);
}
if (this.selectArrow) {
this.open(!this.opened);
} else if (this.type !== 'autocomplete' || this.showOptionsOnEmpty || !this.formControl.value) {
this.open(true);
}
} else {
this.activeIndex = null;
this.open(false);
if (this.input) {
this.input.forEach(input => {
input.nativeElement.blur();
})
} else if (this.textArea) {
this.textArea.nativeElement.blur();
} else if (this.searchInput) {
this.searchInput.nativeElement.blur();
}
if (this.searchControl) {
this.add(event, this.addExtraChips);
if(this.formControl.enabled) {
this.focused = value;
this.cdr.detectChanges();
if (this.focused) {
if (this.input?.length > 0) {
this.input.get(this.activeIndex).nativeElement.focus();
} else if (this.textArea) {
this.textArea.nativeElement.focus();
} else if (this.searchInput) {
this.searchInput.nativeElement.focus();
this.activeElement.next(this.chips.last);
}
if (this.selectArrow) {
this.open(!this.opened);
} else if (this.type !== 'autocomplete' || this.showOptionsOnEmpty || !this.formControl.value) {
this.open(true);
}
} else {
this.activeIndex = null;
this.open(false);
if (this.input) {
this.input.forEach(input => {
input.nativeElement.blur();
})
} else if (this.textArea) {
this.textArea.nativeElement.blur();
} else if (this.searchInput) {
this.searchInput.nativeElement.blur();
}
if (this.searchControl) {
this.add(event, this.addExtraChips);
}
}
this.focusEmitter.emit(this.focused);
}
this.focusEmitter.emit(this.focused);
}
open(value: boolean) {
this.opened = value && this.formControl.enabled;
this.cdr.detectChanges();
@ -748,19 +752,19 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
}
}
}
resetSearch(event: any) {
event.stopPropagation();
this.searchControl.setValue('');
this.focus(true, event);
}
resetValue(event: any) {
event.stopPropagation();
this.formControl.setValue('');
this.focus(true, event);
}
selectOption(option: Option, event) {
if (this.formControl.enabled) {
if (this.formAsControl) {

View File

@ -333,7 +333,7 @@
</div>
<ng-template #header_template let-mobile="mobile">
<a *ngIf="!activeHeader.url" [routerLink]="activeHeader.route" [class.uk-padding-remove]="!isHeaderLeft"
class="uk-logo uk-navbar-item uk-flex uk-flex-middle">
class="uk-logo uk-navbar-item uk-flex uk-flex-middle" [class.small]="activeHeader.logoInfo">
<img *ngIf="(mobile && activeHeader.logoSmallUrl) || (!mobile && activeHeader.logoUrl)"
[src]="!mobile?activeHeader.logoUrl:activeHeader.logoSmallUrl"
[alt]="activeHeader.title">
@ -345,7 +345,7 @@
</ng-container>
</a>
<a *ngIf="activeHeader.url" [href]="activeHeader.url" [class.uk-padding-remove]="!isHeaderLeft"
class="uk-logo uk-navbar-item uk-flex uk-flex-middle">
class="uk-logo uk-navbar-item uk-flex uk-flex-middle" [class.small]="activeHeader.logoInfo">
<img *ngIf="(mobile && activeHeader.logoSmallUrl) || (!mobile && activeHeader.logoUrl)"
[src]="!mobile?activeHeader.logoUrl:activeHeader.logoSmallUrl"
[alt]="activeHeader.title">

View File

@ -1,4 +1,4 @@
import {Component, Input, OnDestroy, OnInit} from "@angular/core";
import {Component, Input, OnDestroy, OnInit, ViewChild} from "@angular/core";
import {AbstractControl, FormBuilder, FormGroup, ValidationErrors, ValidatorFn, Validators} from "@angular/forms";
import {Subscriber} from "rxjs";
import {StringUtils} from "../../utils/string-utils.class";
@ -11,13 +11,14 @@ import {EmailService} from "../../utils/email/email.service";
import {properties} from "../../../../environments/environment";
import {CommunityInfo} from "../../connect/community/communityInfo";
import {NotificationHandler} from "../../utils/notification-handler";
import {InputComponent} from "../input/input.component";
@Component({
selector: 'subscriber-invite',
template: `
<div *ngIf="body" class="uk-grid uk-child-width-1-1" uk-grid [formGroup]="inviteForm">
<div input [formInput]="inviteForm.get('name')" placeholder="From"></div>
<div input [formInput]="inviteForm.get('recipients')" type="chips"
<div #emailInput input [formInput]="inviteForm.get('recipients')" type="chips"
placeholder="Recipients" hint="Add a recipient" [visibleChips]="3"
[addExtraChips]="true" [validators]="validators" [separators]="[',']">
<div note>Separate emails with commas</div>
@ -61,7 +62,8 @@ export class SubscriberInviteComponent implements OnInit, OnDestroy {
public validators: ValidatorFn[] = [Validators.email];
public loading: boolean = true;
private subscriptions: any[] = [];
@ViewChild('emailInput') emailInput: InputComponent;
constructor(private fb: FormBuilder,
private emailService: EmailService,
private communityService: CommunityService) {
@ -105,6 +107,9 @@ export class SubscriberInviteComponent implements OnInit, OnDestroy {
}
invite() {
if(this.emailInput.searchControl.getRawValue() && this.emailInput.searchControl.valid) {
this.emailInput.add(null,true);
}
this.loading = true;
this.body.paragraphs = this.inviteForm.getRawValue().message;
this.email.body = Composer.formatEmailBodyForInvitation(this.body);
@ -129,6 +134,6 @@ export class SubscriberInviteComponent implements OnInit, OnDestroy {
}
get valid() {
return !this.loading && this.inviteForm && this.inviteForm.valid;
return !this.loading && this.inviteForm && this.inviteForm.valid || (this.emailInput && this.emailInput.searchControl.getRawValue() && this.emailInput.searchControl.valid);
}
}

View File

@ -1,7 +1,7 @@
import {Inject, Injectable, InjectionToken, PLATFORM_ID} from '@angular/core';
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Observable } from 'rxjs';
import { timeout } from 'rxjs/operators';
import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
import {Observable} from 'rxjs';
import {timeout} from 'rxjs/operators';
import {isPlatformServer} from "@angular/common";
import {properties} from "../../environments/environment";
@ -9,30 +9,32 @@ export const DEFAULT_TIMEOUT = new InjectionToken<number>('defaultTimeout');
@Injectable()
export class TimeoutInterceptor implements HttpInterceptor {
// timeout inside services for: properties.searchCrossrefAPIURL, properties.searchDataciteAPIURL
private static TIMEOUT_WHITELIST = [properties.csvAPIURL, properties.registryUrl, properties.claimsAPIURL,
properties.searchCrossrefAPIURL, properties.searchDataciteAPIURL];
constructor(@Inject(DEFAULT_TIMEOUT) protected defaultTimeout: number, @Inject(PLATFORM_ID) private platformId: any) {
}
private static TIMEOUT_WHITELIST = [
properties.csvAPIURL, properties.registryUrl, properties.claimsAPIURL,
properties.searchCrossrefAPIURL, properties.searchDataciteAPIURL,
properties.statisticsAPIURL, properties.searchAPIURLLAst, properties.monitorStatsFrameUrl];
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
if (req.method !== 'GET' || this.isService(req, TimeoutInterceptor.TIMEOUT_WHITELIST)) {
return next.handle(req);
constructor(@Inject(DEFAULT_TIMEOUT) protected defaultTimeout: number, @Inject(PLATFORM_ID) private platformId: any) {
}
let serverTime = properties.environment == "production" ? 3000 : 4000;
let clientTime = properties.environment == "production" ? 6000 : 12000;
const timeoutValue = isPlatformServer(this.platformId)?serverTime:clientTime;//req.headers.get('timeout') || this.defaultTimeout;
const timeoutValueNumeric = Number(timeoutValue);
return next.handle(req).pipe(timeout(timeoutValueNumeric));
}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
if (req.method !== 'GET' || this.isService(req, TimeoutInterceptor.TIMEOUT_WHITELIST)) {
return next.handle(req);
}
isService(req: HttpRequest<any>, service: string | string[]):boolean {
if(Array.isArray(service)) {
return !!service.find(element => req.url.indexOf(element) !== -1);
} else {
return req.url.indexOf(service) !== -1;
let serverTime = properties.environment == "production" ? 3000 : 4000;
let clientTime = properties.environment == "production" ? 6000 : 12000;
const timeoutValue = isPlatformServer(this.platformId) ? serverTime : clientTime;//req.headers.get('timeout') || this.defaultTimeout;
const timeoutValueNumeric = Number(timeoutValue);
return next.handle(req).pipe(timeout(timeoutValueNumeric));
}
isService(req: HttpRequest<any>, service: string | string[]): boolean {
if (Array.isArray(service)) {
return !!service.find(element => req.url.indexOf(element) !== -1);
} else {
return req.url.indexOf(service) !== -1;
}
}
}
}

View File

@ -1,5 +1,5 @@
<a (click)="open()"
[title]="'Send data to cloud storage [demo]'"
[title]="'Send data to cloud storage'"
[attr.uk-tooltip]="'pos: bottom; cls: uk-active uk-text-small uk-padding-small'"
class="uk-flex uk-flex-middle uk-flex-center uk-button-link uk-text-bolder">
<icon flex="true" ratio="0.8" name="cloud_upload" visuallyHidden="upload"></icon>
@ -8,11 +8,11 @@
<!-- This is the modal -->
<modal-alert #egiTransferModal large="true" [okDisabled]="destinationPath.length == 0 || status == 'success'
||status == 'loading' || !validatePath() || (!this.downloadElements || this.downloadElements.length == 0)"
(alertOutput)="transfer()" >
<fs-modal #egiTransferModal classBody="uk-container-xlarge" [okButtonDisabled]="destinationPath.length == 0 || status == 'succeeded'
|| (requests > 0) || !validatePath() || !validateDestinationUrl() || (!this.downloadElements || this.downloadElements.length == 0)"
(okEmitter)="transfer()" (cancelEmitter)="init()">
<div *ngIf="!accessToken" class="">
<div class="uk-width-1-1 uk-margin-top uk-margin-bottom uk-text-center">
<div class="uk-width-1-1 uk-margin-bottom uk-text-center">
In order to send data to a Cloud Storage, you would need to be authenticated, please login via EGI check-in.
</div>
<div class="uk-text-center">
@ -21,18 +21,18 @@
</div>
</div>
<div *ngIf="accessToken" class="">
<div class="uk-width-1-1 uk-margin-top uk-margin-bottom uk-text-center">
<div class="uk-width-1-1 uk-margin-bottom uk-text-center">
You have requested to send the data corresponding to the DOI <a [href]="selectedSourceUrl" target="_blank">{{selectedSourceUrl.split(doiPrefix)[1]}}</a> to a cloud storage using the EOSC Data Transfer service
</div>
<div class="uk-grid uk-child-width-1-2 uk-grid-divider">
<div class="uk-grid uk-grid-small uk-child-width-1-2 uk-grid-divider">
<!-- Source -->
<div class="uk-first-column source">
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Available Zenodo DOI URLs:</p>
<div input type="select" [(value)]="selectedSourceUrl" placeholder="Zenodo DOI URL" hint="Select..."
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Available DOI URLs:</p>
<div input type="select" [(value)]="selectedSourceUrl" hint="Select..." [inputClass]="'flat'"
[options]="sourceUrls" (valueChange)="this.parse()"></div>
<div *ngIf="status!='loading'" class="uk-margin-top">
<div *ngIf="status!='active'" class="uk-margin-top">
<div>{{this.downloadElements.length}} files found:</div>
<div class="uk-overflow-auto" style="max-height: 135px">
<div class="uk-margin-small-top uk-height-max-medium uk-overflow-auto">
<ul>
<li *ngFor=" let element of this.downloadElements">{{ element.name}}
</li>
@ -42,53 +42,100 @@
</div>
</div>
<!-- Destination -->
<div class="destination">
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Please select the Destination Storage type:</p>
<div input type="select" [(value)]="selectedDestination" placeholder="Destination Storage" hint="Select..."
[options]="destinationOptions"></div>
<ng-container *ngIf="selectedDestination.id == 'dcache'">
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Provide the corresponding storage destination path:</p>
<div input [(value)]="destinationPath" placeholder="Give a destination path..."
[validators]="validators" class=""></div>
<div *ngIf="selectedDestination.hasBrowse">
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom"> or <a
class="uk-text-primary" (click)="browseFolder(selectedDestination.defaultFolder)">browse</a> to
select a folder.</p>
<div *ngIf="folders[selectedDestination.defaultFolder]" class="uk-height-small uk-overflow-auto">
<ng-container *ngTemplateOutlet="folderListTmpl; context: { folder : folders[selectedDestination.defaultFolder], folderPath: selectedDestination.defaultFolder}"></ng-container>
<div *ngIf="destinationOptions" class="destination">
<!-- -->
<!-- Testing:<br>-->
<!-- https://dcache-demo.desy.de:2443-->
<!-- <br>-->
<!-- /Demonstrators/EOSC-Future/EGI/-->
<!-- <br>-->
<!-- -->
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Destination storage type:</p>
<div input type="select" [(value)]="selectedDestination" hint="Select..." [inputClass]="'flat'"
[options]="destinationOptions" (valueChange)="folders = {}"></div>
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Destination system (e.g. hostname:8080):</p>
<div input [(value)]="destinationUrl" [inputClass]="'flat'"
[validators]="URLValidators" class=""></div>
<ng-container
*ngIf="selectedDestination.authType == 'password' || selectedDestination.authType == 'keys'">
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Authentication:</p>
<div class="uk-grid uk-child-width-1-2">
<div input [(value)]="destinationAuthUser" [placeholder]="'Give ' + (selectedDestination.authType ==
'password'? 'username':'access key') " [inputClass]="'flat x-small'"
class=""></div>
<div input password=true [(value)]="destinationAuthPass" [placeholder]="'Give ' + (selectedDestination.authType ==
'password'? 'password':'secret key') " [inputClass]="'flat x-small'"
class=""></div>
</div>
</div>
</ng-container>
<ng-container *ngIf="selectedDestination.id == 'ftp'">
<p>Comming soon!</p>
<!-- <div class="uk-text-xsmall">You can check our data protection policy <a class="custom-external" href="https://www.openaire.eu/data-protection-policy" target="_blank">here</a>.</div>-->
</ng-container>
<p class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom uk-margin-top">Destination path (e.g. /folder1/folder2):</p>
<div input [(value)]="destinationPath" [inputClass]="'flat'"
[validators]="pathValidators" class=""></div>
<!-- <div *ngIf="selectedDestination.hasBrowse">-->
<p *ngIf="selectedDestination.canBrowse" class="uk-text-meta uk-text-xsmall uk-margin-remove-bottom"> or <a
[ngClass]="!validateDestinationUrl() ? 'uk-text-muted uk-disabled' : 'uk-text-primary'" [attr.disabled]="!destinationUrl"
(click)="browseFolder('/')">browse</a> to
select a folder.</p>
<div *ngIf="folders['/']" class="uk-height-max-medium uk-overflow-auto">
<ng-container *ngTemplateOutlet="folderListTmpl; context: { folder : folders['/'], folderPath: '/'}"></ng-container>
</div>
<!-- </div>-->
<ng-container *ngIf="selectedDestination.destination == 'ftp'">
<p>Comming soon!</p>
</ng-container>
<div class="uk-margin-top">
<!-- (ngModelChange)="filterChange(value.selected)"-->
<input type="checkbox" class="uk-checkbox"
[(ngModel)]="privacyAccepted"/>
<span class="uk-margin-small-left uk-text-small">*I have read and accepted the data protection policy <a class="custom-external" href="https://www.openaire.eu/data-protection-policy" target="_blank">here</a>.</span>
</div>
<div class="uk-align-right uk-margin-medium-top uk-margin-bottom">
<button class="uk-button uk-button-primary"
[disabled]="!privacyAccepted || destinationPath.length == 0 || status == 'succeeded'
|| (requests > 0) || !validatePath() || !validateDestinationUrl() || (!this.downloadElements || this.downloadElements.length == 0)"
[class.uk-disabled]="!privacyAccepted || destinationPath.length == 0 || status == 'succeeded'
|| (requests > 0) || !validatePath() || !validateDestinationUrl() || (!this.downloadElements || this.downloadElements.length == 0)"
(click)="transfer()">
>> Transfer
</button>
</div>
</div>
</div>
<div *ngIf="status == 'loading'" class="uk-flex uk-flex-center uk-text-muted">
<div>
<span class="uk-icon uk-spinner">
<svg width="60" height="60" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
data-svg="spinner"><circle
fill="none" stroke="#000" cx="15" cy="15" r="14" style="stroke-width: 2px;"></circle></svg>
</span>
<!-- [class.uk-alert-success]="status && status.indexOf('error')==-1"-->
<!-- [class.uk-alert-error]="status && status.indexOf('error')!=-1">-->
<div id="transferAlert" *ngIf="message" class="uk-width-1-1 uk-alert uk-margin-medium-top" [ngClass]="'uk-alert-'+statusMessage" uk-alert>
<div [innerHTML]="message"></div>
<!-- <a *ngIf="status != 'succeeded' && status != 'active'" (click)="transfer()">-->
<!-- Try again!-->
<!-- </a>-->
<div *ngIf="requests > 0" class="uk-flex uk-flex-center uk-text-muted">
<div>
<span class="uk-icon uk-spinner">
<svg width="60" height="60" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
data-svg="spinner"><circle
fill="none" stroke="#000" cx="15" cy="15" r="14" style="stroke-width: 2px;"></circle></svg>
</span>
</div>
</div>
</div>
<div *ngIf="message" class="uk-width-1-1 uk-alert"
[class.uk-alert-success]="status && status.indexOf('error')==-1"
[class.uk-alert-error]="status && status.indexOf('error')!=-1"
[innerHTML]="message">
<a *ngIf="requests <= 0" class="uk-alert-close" uk-close></a>
</div>
<!-- <div *ngIf="jobId || status == 'canceled'">
<button *ngIf=" status != 'canceled'" class="uk-button uk-button-default" (click)="getStatus()">Check status</button>
<button *ngIf=" status != 'canceled'" class="uk-button uk-button-default" (click)="cancel()">Cancel</button>
<div>{{statusMessage}}</div>
</div>-->
<div *ngIf=" status != 'canceled'" class="uk-width-1-1 uk-text-right "
[class.uk-invisible]="!(status == 'success' || status.indexOf('error')!=-1)">
<button class="uk-button uk-button-default uk-margin-top " (click)="close()">Close</button>
</div>
<!-- <div *ngIf=" status != 'canceled'" class="uk-width-1-1 uk-text-right "-->
<!-- [class.uk-invisible]="!(status == 'succeeded' || status.indexOf('error')!=-1)">-->
<!-- <button class="uk-button uk-button-default uk-margin-top " (click)="close()">Close</button>-->
<!-- </div>-->
<!-- TESTS -->
<!-- <button (click)="hasBrowse()"
@ -108,7 +155,7 @@
</button>-->
<!-- End of TESTS-->
</div>
</modal-alert>
</fs-modal>
<!-- Browse Templates -->
<ng-template #folderListTmpl let-folder="folder" let-folderPath="folderPath" >
@ -116,7 +163,8 @@
<ul *ngIf="folders[folderPath] && folders[folderPath].isOpen" class="uk-list uk-list-divider uk-margin-small-left folder " style="border-left: 1px solid #e3e3e3; padding-left: 5px;">
<li *ngFor=" let file of files[folderPath]">
<ng-container *ngIf="file.isFolder else itsFile">
<ng-container *ngTemplateOutlet = "folderListTmpl; context:{ folder: file, folderPath:file.accessUrl.split(selectedDestination.url)[1]}"></ng-container>
<ng-container *ngTemplateOutlet = "folderListTmpl; context:{ folder: file,
folderPath:file.accessUrl.split(destinationUrl)[1]}"></ng-container>
</ng-container>
<ng-template #itsFile>
<ng-container *ngTemplateOutlet="fileTmpl; context: { file: file}"></ng-container>
@ -143,7 +191,7 @@
title="Expand/ Collapse"></span>
<span (click)="destinationPath = folderPath" title="Select folder">
<span uk-icon="folder"></span> <span
class="uk-width-expand uk-text-truncate uk-margin-small-left">{{folder.name?folder.name:folder.accessUrl.split(selectedDestination.url)[1]}}</span>
class="uk-width-expand uk-text-truncate uk-margin-small-left">{{folder.name?folder.name:folder.accessUrl.split(destinationUrl)[1]}}</span>
<!--<span class="uk-width-auto uk-text-truncate">{{(folder.createdAt?folder.createdAt:folder.modifiedAt) |date : 'medium'}}</span>-->
</span>
</div>

View File

@ -1,12 +1,15 @@
import {Component, Input, ViewChild} from '@angular/core';
import {Subscriber} from "rxjs";
import {ChangeDetectorRef, Component, Input, ViewChild} from '@angular/core';
import {interval, Subscriber, Subscription} from "rxjs";
import {HttpClient, HttpHeaders} from "@angular/common/http";
import {AbstractControl, ValidatorFn, Validators} from "@angular/forms";
import {Location} from '@angular/common';
import {COOKIE} from "../../login/utils/helper.class";
import {Router} from "@angular/router";
import {properties} from "../../../../environments/environment";
import {delay, repeat} from "rxjs/operators";
import {delay, repeat, startWith, switchMap} from "rxjs/operators";
import {StringUtils} from "../string-utils.class";
import {HelperFunctions} from "../HelperFunctions.class";
import {FullScreenModalComponent} from "../modal/full-screen-modal/full-screen-modal.component";
declare var UIkit;
@Component({
@ -33,30 +36,58 @@ declare var UIkit;
})
export class EGIDataTransferComponent {
subscriptions = [];
statusSub: Subscription[] = [];
accessToken = null;
@Input() dois;
loginURL = properties.environment == "development"? "http://rudie.di.uoa.gr:8580/openid_connect_login":"https://explore.eosc-portal.eu/egi-login-service/openid_connect_login"
loginURL = properties.eoscDataTransferLoginUrl;
sourceUrls = [];
selectedSourceUrl = null;
destinationUrl = "";
destinationAuthUser = "";
destinationAuthPass = "";
destinationPath = "";
destinationOptions = properties.eoscDataTransferDestinations;
selectedDestination = null;
destinationOptions = null;//properties.eoscDataTransferDestinations.map(dest => {return {"label": dest.destination, "value": dest}});
selectedDestination:{ kind: string, destination: string, description: string, authType: 'token' | 'password' | 'keys',
protocol: string, canBrowse: boolean, transferWith: string} = null;
folders = {};
files = {};
requests: number = 0;
downloadElements = null;
@Input() isOpen = false;
@Input() selectedDestinationId = "dcache";
@ViewChild('egiTransferModal') egiTransferModal;
// @Input() selectedDestinationId = "dcache";
@ViewChild('egiTransferModal') egiTransferModal: FullScreenModalComponent;
APIURL = properties.eoscDataTransferAPI;
status: "loading" | "success" | "errorParser" | "errorUser" | "errorTransfer" | "init" | "canceled" = "init";
// status: "loading" | "success" | "errorParser" | "errorUser" | "errorTransfer" | "init" | "canceled" = "init";
status: "unused" | "staging" | "submitted" | "active" | "succeeded" | "partial" | "failed" | "canceled" | "errorParser" | "errorUser" | "init" = "init";
// unused("unused"),
// active("active"),
// succeeded("succeeded"),
// failed("failed"),
// canceled("canceled");
message;
doiPrefix = properties.doiURL;
validators = [Validators.required, this.pathValidator() /*StringUtils.urlValidator()*/];
pathValidators = [Validators.required, this.pathValidator() /*StringUtils.urlValidator()*/];
// URLValidators = [Validators.required, StringUtils.urlValidator()];
URLValidators = [Validators.required];
jobId = null;
statusMessage = null;
jobStatus;
constructor(private http: HttpClient, private location: Location, private _router: Router) {
privacyAccepted: boolean = false;
public hostnameRegex = '[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|' +
'[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|' +
'[a-zA-Z0-9]+\.[^\s]{2,}|' +
'[a-zA-Z0-9]+\.[^\s]{2,}'
constructor(private http: HttpClient, private location: Location, private _router: Router, private cdr: ChangeDetectorRef) {
}
ngOnInit() {
this.URLValidators = [Validators.required, Validators.pattern(this.hostnameRegex)];
}
ngAfterViewInit() {
@ -71,25 +102,37 @@ export class EGIDataTransferComponent {
subscription.unsubscribe();
}
});
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
}
open(){
this.accessToken = COOKIE.getCookie("EGIAccessToken");
if(this.accessToken) {
if (this.selectedDestinationId) {
for (let option of this.destinationOptions) {
if (this.selectedDestinationId == option.value.id) {
this.selectedDestination = option.value;
}
// if (this.selectedDestinationId) {
// for (let option of this.destinationOptions) {
// if (this.selectedDestinationId == option.value.destination) {
// this.selectedDestination = option.value;
// }
// }
// } else {
// this.selectedDestination = this.destinationOptions[0].value;
// }
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.get(this.APIURL + "/storage/types", {headers: headers}).subscribe(
(res: Array<any>) => {
this.destinationOptions = res.map(dest => {return {"label": dest.description, "value": dest}});
this.selectedDestination = res[0];
}
} else {
this.selectedDestination = this.destinationOptions[0].value;
}
));
for (let doi of this.dois) {
if (doi.indexOf("zenodo.") != -1) {
this.sourceUrls.push(this.doiPrefix + doi);
}
}
try {
this.sourceUrls.sort(function (a, b) {
@ -103,13 +146,15 @@ export class EGIDataTransferComponent {
this.parse();
}
this.isOpen = true;
this.egiTransferModal.back = true;
this.egiTransferModal.cancelButton = false;
this.egiTransferModal.okButton = true;
this.egiTransferModal.okButton = false;
this.egiTransferModal.okButtonText = ">> Transfer";
this.egiTransferModal.alertTitle = "EOSC data transfer service [demo]";
this.egiTransferModal.stayOpen = true;
this.egiTransferModal.title = "EOSC Data Transfer";
this.init();
this.egiTransferModal.open();
if(typeof document !== 'undefined') {
this.egiTransferModal.open();
}
}
close(){
if(this.isOpen) {
@ -125,34 +170,52 @@ export class EGIDataTransferComponent {
}
init(){
this.destinationPath = "";
this.selectedDestination = this.destinationOptions[0].value;
// this.selectedDestination = this.destinationOptions[0].value;
this.selectedSourceUrl = this.sourceUrls[0];
this.message = null;
this.status = "init";
this.jobId = null;
this.statusMessage = null;
// this.statusMessage = null;
this.statusMessage = "primary";
this.requests = 0;
this.folders = {};
this.files = {};
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
}
checkin(){
window.location.href = this.loginURL+"?redirect="+ encodeURIComponent(window.location.href + (window.location.href.indexOf("&egiTransfer=t")!=-1?"":"&egiTransfer=t"));
}
parse(){
this.status = "loading";
this.status = "active";
this.message = null;
this.downloadElements = [];
this.subscriptions.push(this.http.get(this.APIURL + "/parser?doi=" + encodeURIComponent(this.selectedSourceUrl)).subscribe(
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.get(this.APIURL + "/parser?doi=" + encodeURIComponent(this.selectedSourceUrl), {headers: headers}).subscribe(
res => {
// res['elements'].forEach(element => {
// if(element.downloadUrl && element.name) {
// this.downloadElements.push(element);
// }
// })
this.downloadElements= res['elements']
// console.log(this.downloadElements)
this.status = "init";
this.status = "init";
}, error => {
this.status = "errorParser";
this.message = "Couldn't get download URLs from zenodo";
UIkit.notification("Couldn't get download URLs from zenodo", {
this.message = error.error && error.error.id && error.error.id == 'doiNotSupported'?'DOI not supported.':( error.error && error.error.description && error.error.description? (error.error.description+'.'):'Error parsing information.') ;
this.statusMessage = "danger";
this.cdr.detectChanges();
HelperFunctions.scrollToId("transferAlert");
/* UIkit.notification(this.message, {
status: 'error',
timeout: 3000,
pos: 'bottom-right'
});
});*/
}
));
@ -161,9 +224,11 @@ export class EGIDataTransferComponent {
transfer() {
// console.log(this.selectedDestination)
this.status = "loading";
this.status = "active";
this.message = "";
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.get(this.APIURL + "/user/info?dest="+this.selectedDestination.id, {headers: headers}).subscribe(
this.subscriptions.push(this.http.get(this.APIURL + "/user/info?dest="+this.selectedDestination.destination, {headers: headers}).subscribe(
res => {
// console.log(res)
let body = {
@ -177,10 +242,9 @@ export class EGIDataTransferComponent {
// console.log(this.selectedDestination)
for (let element of this.downloadElements) {
let file = {
"sources": [element['downloadUrl']],
"destinations": [this.selectedDestination.url + this.destinationPath + element.name],
"destinations": [(this.selectedDestination.protocol+"://") + this.destinationUrl + this.destinationPath + (this.destinationPath.endsWith("/") ? "" : "/") + ((element.path && element.path != "/") ? element.path : "") + element.name],
};
//TODO priority? checksum? filesize?
@ -189,20 +253,28 @@ export class EGIDataTransferComponent {
}
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
if(this.selectedDestination.authType != "token" && this.destinationAuthPass.length > 0 && this.destinationAuthUser.length > 0){
headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken,
'Authorization-Storage': btoa(this.destinationAuthUser + ':' + this.destinationAuthPass)});
}
this.subscriptions.push(this.http.post(this.APIURL + "/transfers" ,body, {headers: headers}).subscribe(
res => {
// console.log(res)
UIkit.notification('Data transfer has began! ', {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
// UIkit.notification('Data transfer has began! ', {
// status: 'success',
// timeout: 6000,
// pos: 'bottom-right'
// });
this.jobId = res['jobId'];
this.status = "success";
this.egiTransferModal.okButton = false;
this.getStatus();
this.status = "active";
this.statusMessage = "primary";
// this.egiTransferModal.okButton = false;
this.message = `
<!--div class="uk-text-large uk-margin-bottom">Data transfer has began!</div-->
<div>Transfer of ` + this.downloadElements.length + ` files to <a href="`+ this.selectedDestination.webpage + `" target=_blank>`+this.selectedDestination.label+`</a> has began.`;
<div>Transfer of ` + this.downloadElements.length + ` files to `+this.selectedDestination.description+` has began.`;
/*this.message += ` <div class=" uk-overflow-auto uk-height-xsmall" >
<ul>
`;
@ -219,27 +291,37 @@ export class EGIDataTransferComponent {
this.message += `
</div>`
// this.getStatus(true)
this.cdr.detectChanges();
HelperFunctions.scrollToId("transferAlert");
// this.getStatus(true)
}, error => {
this.status = "errorTransfer";
this.message = "Couldn't transfer files";
UIkit.notification("Couldn't transfer files", {
status: 'error',
timeout: 6000,
pos: 'bottom-right'
});
this.status = "failed";
this.message = "Files could not be transfered.";
this.statusMessage = "danger";
this.cdr.detectChanges();
HelperFunctions.scrollToId("transferAlert");
// UIkit.notification("Couldn't transfer files", {
// status: 'error',
// timeout: 6000,
// pos: 'bottom-right'
// });
}
));
}, error => {
this.status = "errorUser";
this.message = "User can't be authenticated!";
UIkit.notification("User can't be authenticated!", {
status: 'error',
timeout: 6000,
pos: 'bottom-right'
});
this.message = "User cannot be authenticated.";
this.statusMessage = "danger";
this.cdr.detectChanges();
HelperFunctions.scrollToId("transferAlert");
// UIkit.notification("User can't be authenticated!", {
// status: 'error',
// timeout: 6000,
// pos: 'bottom-right'
// });
}
));
@ -247,50 +329,131 @@ export class EGIDataTransferComponent {
getStatus(updateTransferMessage:boolean = false){
if(this.jobId){
this.requests = 10;
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
let source = this.http.get(this.APIURL + "/transfer/" +this.jobId , {headers: headers}).pipe(delay(5000));
this.subscriptions.push(source.pipe(repeat(3)).subscribe(
res => {
this.jobStatus = res;
this.message = `
<!--div class="uk-text-large uk-margin-bottom">Data transfer has began!</div-->
<div>Transfer of ` + this.downloadElements.length + ` files to <a href="`+ this.selectedDestination.webpage + `" target=_blank>`+this.selectedDestination.label+`</a> has began.`;
/*this.message += ` <div class=" uk-overflow-auto uk-height-xsmall" >
<ul>
`;
// TODO LATER we can call status for each file and see if the transfer has been complete
for(let element of this.downloadElements){
// console.log(element)
// this.message += ` <li> <a href="`+ this.selectedDestination.webpage + this.destinationPath + element.name + `" target="_blank">`+ element.name+ `</a></li> `;
this.message += ` <li>`+ element.name+ `</li> `;
}
this.message += `
</ul>
</div>
</div>`*/
this.message += `
</div>`;
console.log(res)
this.statusMessage = res['jobState'] + (res['reason']?(" :" + res['reason']):"");
UIkit.notification('got status! ', {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
let source2 = interval(5000) // request status every 5 secs
.pipe(
startWith(2000), // first call after 2 secs
switchMap(() => this.http.get(this.APIURL + "/transfer/" +this.jobId , {headers: headers}))
);
this.statusSub.push(source2.subscribe((res: any) => {
this.requests--;
if(this.status != res.jobState) {
this.status = res.jobState;
this.jobStatus = res;
this.message = `
<!--div class="uk-text-large uk-margin-bottom">Data transfer has began!</div-->
<div>Transfer of ` + this.downloadElements.length + ` files to ` + this.selectedDestination.description + ` has began.`;
/*this.message += ` <div class=" uk-overflow-auto uk-height-xsmall" >
<ul>
`;
// TODO LATER we can call status for each file and see if the transfer has been complete
for(let element of this.downloadElements){
// console.log(element)
// this.message += ` <li> <a href="`+ this.selectedDestination.webpage + this.destinationPath + element.name + `" target="_blank">`+ element.name+ `</a></li> `;
this.message += ` <li>`+ element.name+ `</li> `;
}
this.message += `
</ul>
</div>
</div>`*/
this.message += `
</div>`;
this.message += "<div>Transfer status: <b>"+res.jobState+"</b>.</div>";
this.statusMessage = "primary";
//this.statusMessage = res['jobState'] + (res['reason'] ? (" :" + res['reason']) : "");
if(this.status == "partial") {
this.message = "At least one of the selected files was successfully transfered.";
this.statusMessage = "success";
//this.statusSub.unsubscribe();
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
this.requests = 0;
} else if(this.status == "succeeded") {
this.message = "Transfer successfully completed!";
this.statusMessage = "success";
//this.statusSub.unsubscribe();
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
this.requests = 0;
// UIkit.notification('Transfer successfully completed! ', {
// status: 'success',
// timeout: 6000,
// pos: 'bottom-right'
// });
} else if(this.status == "failed") {
this.message = "Transfer failed.";
this.statusMessage = "danger";
//this.statusSub.unsubscribe();
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
this.requests = 0;
// UIkit.notification('Transfer failed', {
// status: 'danger',
// timeout: 6000,
// pos: 'bottom-right'
// });
} else if(this.requests <= 0 || (this.status != "active" && this.status != "submitted" && this.status != "staging")) {
this.message = "Transfer status: <b>"+this.status+"</b>.";
this.statusMessage = "warning";
//this.statusSub.unsubscribe();
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
this.requests = 0;
// UIkit.notification('Transfer completed with status: '+this.status, {
// status: 'warning',
// timeout: 6000,
// pos: 'bottom-right'
// });
}
}
if(this.requests <= 0) {
this.message = "Transfer status: <b>"+this.status+"</b>.";
this.statusMessage = "warning";
//this.statusSub.unsubscribe();
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
}
}, error => {
this.status = "errorTransfer";
this.message = "Couldn't get status ";
UIkit.notification("Couldn't get status", {
status: 'error',
timeout: 6000,
pos: 'bottom-right'
});
this.status = "failed";
this.message = "Status of the transfer could not be retrieved.";
this.statusMessage = "danger";
this.statusSub.forEach(sub => {
if(sub instanceof Subscriber) {
sub.unsubscribe();
}
});
this.requests = 0;
// UIkit.notification("Couldn't get status", {
// status: 'error',
// timeout: 6000,
// pos: 'bottom-right'
// });
}
));
@ -303,7 +466,6 @@ export class EGIDataTransferComponent {
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.delete(this.APIURL + "/transfer/" +this.jobId , {headers: headers}).subscribe(
res => {
console.log(res);
this.jobStatus = res;
this.statusMessage = res['jobState'] + (res['reason']?(" :" + res['reason']):"");
this.jobId = null;
@ -314,7 +476,7 @@ export class EGIDataTransferComponent {
}
hasBrowse(){
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.get(this.APIURL + "/storage/info?dest="+this.selectedDestination.id+"&seUrl="+encodeURIComponent(this.selectedDestination.url + this.destinationPath) , {headers: headers}).subscribe(
this.subscriptions.push(this.http.get(this.APIURL + "/storage/info?dest="+this.selectedDestination.destination+"&seUrl="+encodeURIComponent((this.selectedDestination.protocol+'://') + this.destinationUrl + this.destinationPath) , {headers: headers}).subscribe(
res => {
console.log(res);
}
@ -324,7 +486,7 @@ export class EGIDataTransferComponent {
getFolder(folderPath){
//TODO is this necessary?
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.get(this.APIURL + "/storage/folder?dest="+this.selectedDestination.id+"&seUrl="+encodeURIComponent(this.selectedDestination.url + folderPath) , {headers: headers}).subscribe(
this.subscriptions.push(this.http.get(this.APIURL + "/storage/folder?dest="+this.selectedDestination.destination+"&seUrl="+encodeURIComponent((this.selectedDestination.protocol + '://') + this.destinationUrl + folderPath) , {headers: headers}).subscribe(
res => {
this.folders[folderPath]= res;
this.folders[folderPath]['isOpen'] = true;
@ -339,7 +501,7 @@ export class EGIDataTransferComponent {
}
this.getFolder(folderPath);
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.get(this.APIURL + "/storage/folder/list?dest="+this.selectedDestination.id+"&folderUrl="+encodeURIComponent(this.selectedDestination.url + folderPath) , {headers: headers}).subscribe(
this.subscriptions.push(this.http.get(this.APIURL + "/storage/folder/list?dest="+this.selectedDestination.destination+"&folderUrl="+encodeURIComponent((this.selectedDestination.protocol + '://') + this.destinationUrl + folderPath) , {headers: headers}).subscribe(
res => {
this.files[folderPath]= res['elements'];
}
@ -348,8 +510,8 @@ export class EGIDataTransferComponent {
}
createFolder(){
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.post(this.APIURL + "/storage/folder?dest="+this.selectedDestination.id+"&seUrl="+
encodeURIComponent(this.selectedDestination.url + this.destinationPath + "test1/") , {headers: headers}).subscribe(
this.subscriptions.push(this.http.post(this.APIURL + "/storage/folder?dest="+this.selectedDestination.destination+"&seUrl="+
encodeURIComponent(this.destinationUrl + this.destinationPath + "test1/") , {headers: headers}).subscribe(
res => {
console.log(res);
}
@ -359,7 +521,7 @@ export class EGIDataTransferComponent {
deleteFolder(){
let headers = new HttpHeaders({'Authorization': 'Bearer '+this.accessToken});
this.subscriptions.push(this.http.delete(this.APIURL + "/storage/folder?dest="+this.selectedDestination.id+"&seUrl="+encodeURIComponent(this.selectedDestination.url + this.destinationPath + "test1/") , {headers: headers}).subscribe(
this.subscriptions.push(this.http.delete(this.APIURL + "/storage/folder?dest="+this.selectedDestination.destination+"&seUrl="+encodeURIComponent(this.destinationUrl + this.destinationPath + "test1/") , {headers: headers}).subscribe(
res => {
console.log(res);
}
@ -373,14 +535,23 @@ export class EGIDataTransferComponent {
pathValidator(): ValidatorFn {
return (control: AbstractControl): { [key: string]: string } | null => {
if (!this.validatePath()) {
return {'error': 'Path should start and end with "/" e.g /path/'};
return {'error': 'Path should start with "/"'};
}
return null;
}
}
validatePath():boolean {
let exp1 = /^\/([A-z0-9-_+]+\/)*$/g;
let exp1 = /^\/([A-z0-9-_+]+\/?)*$/g;
return (this.destinationPath.length > 0 && this.destinationPath.match(exp1) != null)
}
validateDestinationUrl():boolean {
return (this.destinationUrl.length > 0 && new RegExp(this.hostnameRegex).test(this.destinationUrl));
}
// public sourceUrlValidators() {
// this.URLValidators = [];
// this.URLValidators = [Validators.required, Validators.pattern(this.hostnameRegex)];
// }
}

View File

@ -4,11 +4,12 @@ import {FormsModule} from '@angular/forms';
import {EGIDataTransferComponent} from "./transferData.component";
import {InputModule} from "../../sharedComponents/input/input.module";
import {AlertModalModule} from "../modal/alertModal.module";
import {FullScreenModalModule} from "../modal/full-screen-modal/full-screen-modal.module";
import {IconsModule} from '../icons/icons.module';
@NgModule({
imports: [
CommonModule, FormsModule, InputModule, AlertModalModule, IconsModule
CommonModule, FormsModule, InputModule, AlertModalModule, FullScreenModalModule, IconsModule
],
declarations: [
EGIDataTransferComponent

View File

@ -2,6 +2,9 @@ import {Email} from "./email";
import {Body} from "./body";
import {FormArray} from "@angular/forms";
import {properties} from "../../../../environments/environment";
import {Stakeholder} from "../../monitor/entities/stakeholder";
import {Report} from "../../../../cache-indicators";
import {error} from "protractor";
export class Composer {
private static noteBodySize = "14px";
@ -32,13 +35,14 @@ export class Composer {
email.subject = this.subjectPrefix + communityName + ": Welcome new manager";
email.body = "<div style='font-size:" + this.noteBodySize + "'><p>Welcome to OpenAIRE Connect!</p>"
+ "<p>You are receiving this e-mail as you were assigned as manager of the community <a href='https://beta."
+ communityId + ".openaire.eu/'>" + communityName + "</a> dashboard. "
+ "<p>You are receiving this e-mail as you were assigned as manager of the <a href='https://beta."
+ communityId + ".openaire.eu/'>" + communityName + "</a> gateway. "
+ "In order to access the administration section of your community you must first login using one of the available options. "
+ "<br>The administrative rights are associated to the e-mail address, that was used to send you this message."
+ "<br>The administrative rights are associated with the e-mail address that was used to send you this message."
+ " If you login with an account associated to a different email, please <a href='mailto:helpdesk@openaire.eu'>contact us</a>"
+ " or your colleagues, that already have access to the administration tool, to update your e-mail. <br>"
+ "You can access the administration tool by clicking the \"Manage\" button that will be available in the top right corner of the dashboard."
+ "If you do not know which is the email associated with your OpenAIRE account, you can follow the instructions of <a href='https://youtu.be/Z3ePc4ltJ4M?t=30'>this video (from 00:30 to 1:00).</a><br>"
+ "Once logged in, you can access the administration tool by clicking the \"Manage\" button that will be available in the top right corner of the gateway."
+ "</p>"
+ this.signature
+ "<p style='font-size:" + this.noteFontSize + "'>" + this.ifYouAreNotResponsible(properties.admins[0]) + "<p>"
@ -89,7 +93,7 @@ export class Composer {
+ "<span><b>Affiliation</b>: " + (contactForm.affiliation ? contactForm.affiliation : '-') + "</span><br>"
+ "<p>" + contactForm.message + "</p>"
+ "</div>";
email.recipients = admins;
email.recipients = admins;
return email;
}
@ -209,6 +213,19 @@ export class Composer {
return email;
}
public static composeEmailToReportCachingProcess(report: Report) {
let email: Email = new Email();
email.recipients = [report.creator];
email.subject = 'OpenAIRE | Monitor Dashboard - ' + report.name + '\'s caching process has been finished';
email.body = "<div style='font-size" + this.noteBodySize + "'>"
+ "<p>"
+ "<div>Success: " + report.success + "/" + report.total + "</div>"
+ "<div>Errors: " + report.errors.map(error => error.url + ' - ' + error.status).join('<br>') + "</div>"
+ "</p>"
+ "</div>";
return email;
}
public static formatEmailBodyForInvitation(body: Body): string {
let fromMessageAndName = "";

View File

@ -24,7 +24,7 @@ declare var ResizeObserver;
<div class="uk-modal-dialog">
<div #header class="uk-modal-header uk-flex uk-flex-middle" [ngClass]="classTitle">
<div [class.uk-invisible]="!back" class="uk-width-medium@l uk-width-auto uk-flex uk-flex-center">
<button class="uk-button uk-button-link" [disabled]="!back" (click)="backClicked()">
<button class="uk-button uk-button-link" [class.uk-disabled]="!back" [disabled]="!back" (click)="backClicked()">
<icon name="west" [flex]="true" [ratio]="isMobile?2:3"></icon>
</button>
</div>
@ -33,13 +33,14 @@ declare var ResizeObserver;
<h4 *ngIf="isMobile" class="uk-margin-remove">{{title}}</h4>
<h2 *ngIf="!isMobile" class="uk-margin-remove">{{title}}</h2>
</div>
<div class="uk-width-medium@l uk-width-auto uk-flex" [class.uk-flex-center]="okButton" [class.uk-flex-right]="!okButton">
<div class="uk-width-medium@l uk-width-auto uk-flex"
[class.uk-flex-center]="okButton" [class.uk-flex-right]="!okButton">
<button *ngIf="okButton" class="uk-button uk-button-default" [disabled]="okButtonDisabled"
[class.uk-disabled]="okButtonDisabled" (click)="ok()">
{{okButtonText}}
</button>
<button *ngIf="!okButton" class="uk-close uk-icon" (click)="cancel()">
<icon name="close" [ratio]="2"></icon>
<button *ngIf="!okButton && cancelButton" class="uk-close uk-icon" (click)="cancel()">
<icon name="close" ratio="2"></icon>
</button>
</div>
</div>
@ -64,6 +65,7 @@ export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
*/
public stayOpenInBack: boolean = false;
title: string;
cancelButton: boolean = true;
okButton: boolean = false;
okButtonText = 'OK';
isMobile: boolean = false;

View File

@ -0,0 +1,25 @@
import {Pipe, PipeTransform} from "@angular/core";
import {Level, NumberSize, NumberUtils} from "../number-utils.class";
import {DecimalPipe} from "@angular/common";
@Pipe({name: 'numberPercentage'})
export class NumberPercentagePipe implements PipeTransform {
decimalPipe: DecimalPipe = new DecimalPipe("en");
constructor() {
}
/**
* */
transform(value: number | string, ...args: any[]): any {
let locale: string = 'en';
if (args[0]) {
locale = args[0];
this.decimalPipe = new DecimalPipe(locale);
} else {
this.decimalPipe = new DecimalPipe('en');
}
value = Number.parseFloat(value.toString()) * 100;
return this.decimalPipe.transform(value) + '<span class="number-size">%</span>';
}
}

View File

@ -1,9 +1,10 @@
import {NgModule} from "@angular/core";
import {NumberRoundPipe} from "./number-round.pipe";
import {NumberPercentagePipe} from "./number-percentage.pipe";
@NgModule({
declarations: [NumberRoundPipe],
exports: [NumberRoundPipe]
declarations: [NumberRoundPipe, NumberPercentagePipe],
exports: [NumberRoundPipe, NumberPercentagePipe]
})
export class NumberRoundModule {

View File

@ -1,12 +1,15 @@
import {Pipe, PipeTransform} from "@angular/core";
import {Level, NumberSize, NumberUtils} from "../number-utils.class";
import {DecimalPipe} from "@angular/common";
import {DecimalPipe, registerLocaleData} from "@angular/common";
import l from '@angular/common/locales/eu';
import e from '@angular/common/locales/extra/eu';
@Pipe({name: 'numberRound'})
export class NumberRoundPipe implements PipeTransform {
decimalPipe: DecimalPipe = new DecimalPipe("en");
constructor() {
registerLocaleData(l, 'eu', e);
}
/**
@ -16,12 +19,19 @@ export class NumberRoundPipe implements PipeTransform {
transform(value: number | string, ...args: any[]): any {
let level = Level.ALL;
let decimal = 0;
let locale: string = 'en';
if (args[0]) {
level = args[0];
}
if (args[1]) {
decimal = args[1];
}
if (args[2]) {
locale = args[2];
this.decimalPipe = new DecimalPipe(locale);
} else {
this.decimalPipe = new DecimalPipe('en');
}
let size: NumberSize = NumberUtils.roundNumber(value, level, decimal);
return this.decimalPipe.transform(size.number) + (size.size ? '<span class="number-size">' + size.size + '</span>' : '');
}

View File

@ -1,5 +1,5 @@
export type Environment = "development" | "test" | "beta" | "production";
export type Dashboard = "explore" | "connect" | "monitor" | "aggregator" | "eosc";
export type Dashboard = "explore" | "connect" | "monitor" | "aggregator" | "eosc" | "client-management-portal";
export type PortalType = "explore" | "connect" | "community" | "monitor" | "funder" | "ri" | "project" | "organization" | "aggregator" | "eosc";
export interface EnvProperties {
@ -65,6 +65,7 @@ export interface EnvProperties {
registryUrl?: string;
logoutUrl?: string;
userInfoUrl?: string;
clientManagementUrl?: string,
cookieDomain?: string;
feedbackmail?: string;
feedbackmailForMissingEntities?: string;
@ -145,5 +146,7 @@ export interface EnvProperties {
egiNotebookLink?: string;
connectPortalUrl?;
eoscDataTransferAPI?;
eoscDataTransferLoginUrl?;
eoscDataTransferDestinations?;
hasMachineCache?: boolean;
}

View File

@ -232,7 +232,11 @@ export class ResultPreviewComponent implements OnInit, OnChanges {
public addEoscPrevInParams(obj) {
if(properties.adminToolsPortalType == "eosc" && this.prevPath) {
return this.routerHelper.addQueryParam("pv", this.prevPath, obj);
let splitted: string[] = this.prevPath.split("?");
obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj);
if(splitted.length > 0) {
obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj);
}
}
return obj;
}

View File

@ -122,12 +122,12 @@ export class ISVocabulariesService {
getFos(properties: EnvProperties): Observable<any> {
let url = "/assets/common-assets/vocabulary/fos.json";
return this.http.get(url);
return this.http.get(url).pipe(map(res => (res && res['fos']) ? res : {fos: []}));
}
getSDGs(properties: EnvProperties): Observable<any> {
let url = "/assets/common-assets/vocabulary/sdg.json";
return this.http.get(url);
return this.http.get(url).pipe(map(res => (res && res['sdg'])?res:{sdg: []}));
}
parseSDGs(data: any): AutoCompleteValue[] {

View File

@ -266,6 +266,8 @@ export class StringUtils {
'[a-zA-Z0-9]+\\.[^\\s]{2,}';
public static routeRegex = '^[a-zA-Z0-9\/][a-zA-Z0-9\/-]*$';
public static jsonRegex = /^[\],:{}\s]*$/;
public static urlPrefix(url: string): string {
if (url.startsWith("http://") || url.startsWith("https://") || url.startsWith("//")) {
@ -325,6 +327,19 @@ export class StringUtils {
public static urlValidator(): ValidatorFn {
return Validators.pattern(StringUtils.urlRegex);
}
public static jsonValidator(error: string = ''): ValidatorFn {
return (control: AbstractControl): ValidationErrors | null => {
if(control.value) {
let test = control.getRawValue().replace(/\\["\\\/bfnrtu]/g, '@').replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').replace(/(?:^|:|,)(?:\s*\[)+/g, '');
console.log('test')
if(!new RegExp(this.jsonRegex).test(test)) {
return {error: 'Please provide a valid JSON.' + error}
}
}
return null;
};
}
public static validatorType(options: string[]): ValidatorFn {
return (control: AbstractControl): { [key: string]: boolean } | null => {

View File

@ -558,6 +558,9 @@
<progress class="uk-progress" value="45" max="100">45%</progress>
</div>
<div class="uk-width-expand@m">
<div class="uk-progress-circle" percentage="45" style="--percentage: 45"></div>
</div>
<div>
<button type="button" class="uk-icon uk-close">