Merge branch 'new-theme' of code-repo.d4science.org:MaDgIK/openaire-library into new-theme
This commit is contained in:
commit
1d541ba121
|
@ -1,5 +1,6 @@
|
|||
import {SafeResourceUrl} from "@angular/platform-browser";
|
||||
import {properties} from "../../../../environments/environment";
|
||||
import {Session, User} from "../../login/utils/helper.class";
|
||||
|
||||
export const ChartHelper = {
|
||||
prefix: "((__",
|
||||
|
@ -49,6 +50,14 @@ export class Stakeholder {
|
|||
export class StakeholderInfo extends Stakeholder {
|
||||
isManager: boolean = false;
|
||||
isMember: boolean = false;
|
||||
|
||||
public static toStakeholderInfo(stakeholders: (Stakeholder & StakeholderInfo)[], user: User): StakeholderInfo[] {
|
||||
return stakeholders.map(stakeholder => {
|
||||
stakeholder.isManager = Session.isPortalAdministrator(user) || Session.isMonitorCurator(user) || Session.isManager(stakeholder.type, stakeholder.alias, user);
|
||||
stakeholder.isMember = Session.isMember(stakeholder.type, stakeholder.alias, user);
|
||||
return stakeholder;
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
export class Topic {
|
||||
|
|
|
@ -3,22 +3,22 @@ import {Component} from "@angular/core";
|
|||
@Component({
|
||||
selector: 'how',
|
||||
template: `
|
||||
<div class="how uk-h6">
|
||||
<div class="how">
|
||||
<div class="uk-flex uk-flex-wrap">
|
||||
<div class="uk-width-1-3@s first uk-text-muted">
|
||||
<div class="uk-width-1-3@s first">
|
||||
<div>
|
||||
<img src="assets/common-assets/monitor-assets/how/1.png" loading="lazy">
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
<span class="uk-text-bold uk-text-uppercase">Starting</span> from existing<br>research-related data sources
|
||||
<span class="uk-text-uppercase uk-text-bold">Starting</span> from existing<br>research-related data sources
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-3@s second uk-text-muted">
|
||||
<div class="uk-width-1-3@s second">
|
||||
<div>
|
||||
<img src="assets/common-assets/monitor-assets/how/2.png" loading="lazy">
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-3@s third uk-text-muted">
|
||||
<div class="uk-width-1-3@s third">
|
||||
<div>
|
||||
<img src="assets/common-assets/monitor-assets/how/3.png" loading="lazy">
|
||||
</div>
|
||||
|
@ -28,37 +28,37 @@ import {Component} from "@angular/core";
|
|||
</div>
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-wrap">
|
||||
<div class="uk-width-1-3@s fourth uk-flex-last@s uk-text-muted">
|
||||
<div class="uk-width-1-3@s fourth uk-flex-last@s">
|
||||
<div>
|
||||
<img src="assets/common-assets/monitor-assets/how/4.png" loading="lazy">
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
we perform <span class="uk-text-bold uk-text-uppercase">Statistical Analysis</span> and produce
|
||||
<span class="portal-color">Open Science Indicators</span>
|
||||
we perform <span class="uk-text-uppercase uk-text-bold">Statistical <br> Analysis</span> and produce <br>
|
||||
<span class="uk-text-primary">Open Science Indicators</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-3@s fifth uk-text-muted">
|
||||
<div class="uk-width-1-3@s fifth">
|
||||
<div>
|
||||
<img src="assets/common-assets/monitor-assets/how/5.png" loading="lazy">
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
furthermore <span class="uk-text-bold uk-text-uppercase">Network<br>Analysis</span> producing
|
||||
<span class="portal-color">Collaboration Indicators</span>
|
||||
furthermore <span class="uk-text-uppercase uk-text-bold">Network<br>Analysis</span> producing <br>
|
||||
<span class="uk-text-primary">Collaboration Indicators</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-3@s sixth uk-flex-first@s uk-text-muted">
|
||||
<div class="uk-width-1-3@s sixth uk-flex-first@s">
|
||||
<div>
|
||||
<img src="assets/common-assets/monitor-assets/how/6.png" loading="lazy">
|
||||
</div>
|
||||
<div class="uk-text-center">
|
||||
Often combine with external data
|
||||
Often combine with external data <br>
|
||||
(patents, social, company) and
|
||||
perform <span class="uk-text-bold uk-text-uppercase">Impact Analysis</span> to
|
||||
produce <span class="portal-color">Innovation Indicators</span>
|
||||
perform <br><span class="uk-text-uppercase uk-text-bold">Impact Analysis</span> to
|
||||
produce <br><span class="uk-text-primary">Innovation Indicators</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="final uk-text-muted">
|
||||
<div class="final">
|
||||
<div>
|
||||
<img src="assets/common-assets/monitor-assets/how/7.png" loading="lazy">
|
||||
</div>
|
||||
|
|
|
@ -79,7 +79,7 @@ export class StakeholderService {
|
|||
}));
|
||||
}
|
||||
|
||||
getMyStakeholders(url: string, type: string = null): Observable<Stakeholder[]> {
|
||||
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));
|
||||
}));
|
||||
|
|
|
@ -140,11 +140,8 @@
|
|||
(selectionChange)=" simpleEntityChanged($event)"
|
||||
[onChangeNavigate]="true" [customFilter]="customFilter"></entities-selection>
|
||||
</div>
|
||||
<div *ngIf="selectedFields[0]" class="uk-inline">
|
||||
<!--<a *ngIf="selectedFields[0].value.length > 0" class="uk-form-icon uk-form-icon-flip"
|
||||
(click)="selectedFields[0].value = ''"
|
||||
uk-icon="icon: close"></a>-->
|
||||
<a class="uk-form-icon uk-form-icon-flip"
|
||||
<div *ngIf="selectedFields[0]" class="uk-inline uk-link">
|
||||
<a class="uk-form-icon uk-form-icon-flip uk-link-reset"
|
||||
(click)="simpleKeywordChanged(null)" type="submit">
|
||||
<icon name="search" flex="true"></icon>
|
||||
</a>
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
refineFields.indexOf(customFilter.queryFieldName) ==
|
||||
-1) ||customFilter.isHiddenFilter)">
|
||||
<span class="uk-width-auto">
|
||||
<span class="uk-label uk-flex uk-flex-middle">
|
||||
<span class="filter-tag uk-flex uk-flex-middle">
|
||||
<span class="uk-margin-small-right uk-width-expand">{{customFilter.valueName}}</span>
|
||||
</span>
|
||||
</span>
|
||||
|
@ -14,9 +14,9 @@
|
|||
<ng-container *ngIf="type.selected">
|
||||
<span class="uk-width-auto">
|
||||
<a [attr.uk-tooltip]="'Remove ' + type.name" (click)="removeResultType(type.id)" [class.uk-disabled]="disabled">
|
||||
<span class="uk-label uk-flex uk-flex-middle">
|
||||
<span class="filter-tag uk-flex uk-flex-middle">
|
||||
<span class="uk-margin-small-right uk-width-expand">{{type.name}}</span>
|
||||
<icon name="close" ratio="0.5" flex="true"></icon>
|
||||
<icon name="close" flex="true" ratio="0.7"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</span>
|
||||
|
@ -29,9 +29,9 @@
|
|||
<span class="uk-width-auto">
|
||||
<a [attr.uk-tooltip]="'Remove ' + filter.selectedFromAndToValues" (click)="removeRangeFilter(filter)"
|
||||
[class.uk-disabled]="disabled">
|
||||
<span class="uk-label uk-flex uk-flex-middle">
|
||||
<span class="filter-tag uk-flex uk-flex-middle">
|
||||
<span class="uk-margin-small-right uk-width-expand">{{filter.selectedFromAndToValues}}</span>
|
||||
<icon name="close" ratio="0.5" flex="true"></icon>
|
||||
<icon name="close" flex="true" ratio="0.7"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</span>
|
||||
|
@ -43,9 +43,9 @@
|
|||
<ng-container *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; ">
|
||||
<span *ngIf="!customFilter || (customFilter.isHiddenFilter && customFilter.valueId != value.id)" class="uk-width-auto">
|
||||
<a [attr.uk-tooltip]="'Remove ' + value.name" (click)="removeFilter(value, filter)" [class.uk-disabled]="disabled">
|
||||
<span class="uk-label uk-flex uk-flex-middle">
|
||||
<span class="filter-tag uk-flex uk-flex-middle">
|
||||
<span class="uk-margin-small-right uk-width-expand">{{value.name}}</span>
|
||||
<icon name="close" ratio="0.5" flex="true"></icon>
|
||||
<icon name="close" flex="true" ratio="0.7"></icon>
|
||||
</span>
|
||||
</a>
|
||||
</span>
|
||||
|
@ -73,7 +73,7 @@
|
|||
<span *ngIf="searchUtils.refineStatus == errorCodes.NONE">No filters available</span>
|
||||
<span *ngIf="searchUtils.refineStatus != errorCodes.NONE" class="uk-text-warning">Filters temporarily unavailable. Please try again later.</span>
|
||||
</div>
|
||||
<ul *ngIf="!showUnknownFilters" class="uk-list uk-list-large">
|
||||
<ul *ngIf="!showUnknownFilters" class="uk-list uk-list-xlarge">
|
||||
<li *ngIf="filters.length > 0 && filters[0].values.length >0 && filters[0].filterId == 'resultbestaccessright'">
|
||||
<search-filter [filterValuesNum]="filterValuesNum" [showMoreInline]="showMoreFilterValuesInline"
|
||||
[isDisabled]="disabled"
|
||||
|
@ -110,19 +110,18 @@
|
|||
[attr.uk-sticky]="(stickyForm?'{animation:false;offset:100;top:90;cls-active:uk-active uk-sticky-below;cls-inactive:uk-sticky '+
|
||||
(usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
|
||||
' uk-position-relative ' :(' uk-section ' ))+'}':null)">
|
||||
<div style="box-sizing: border-box; "
|
||||
[class]="' uk-background-norepeat uk-background-bottom-center uk-padding-remove-bottom uk-flex uk-flex-middle uk-background-fixed '+searchFormClass
|
||||
<div [class]="' uk-background-norepeat uk-background-bottom-center uk-padding-remove-bottom uk-flex uk-flex-middle uk-background-fixed '+searchFormClass
|
||||
+ (usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') && !dashboard ?
|
||||
' image-front-topbar searchFormMinHeight uk-padding-remove-bottom uk-section' : '')
|
||||
+(simpleView?'':' advancedSearchFormBackground ')">
|
||||
<!-- TODO - Kostis until here-->
|
||||
<div class="uk-width-1-1">
|
||||
<div class="uk-container uk-container-large">
|
||||
<div class="uk-padding-small">
|
||||
<div class="uk-padding-small uk-padding-remove-bottom">
|
||||
<breadcrumbs *ngIf="showBreadcrumb" [breadcrumbs]="breadcrumbs"></breadcrumbs>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-position-relative uk-margin-medium-bottom">
|
||||
<div class="uk-position-relative">
|
||||
<div class="uk-container uk-container-large uk-section" id="searchForm">
|
||||
<advanced-search-form
|
||||
[entityType]="entityType"
|
||||
|
@ -147,7 +146,7 @@
|
|||
</div>
|
||||
<schema2jsonld *ngIf="url" [URL]="url" type="search" [name]=pageTitleWithFilters
|
||||
[searchAction]=false [description]="metaDescription" ></schema2jsonld>
|
||||
<div id="tm-main" class=" tm-middle" [class.uk-margin-top]="stickyForm">
|
||||
<div id="tm-main" class="uk-margin-medium-top" [class.uk-margin-top]="stickyForm">
|
||||
<div uk-grid>
|
||||
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first ">
|
||||
<div class="uk-container uk-container-large">
|
||||
|
@ -235,7 +234,7 @@
|
|||
target="_blank"> OpenAIRE - Explore</a>.
|
||||
</div>
|
||||
<!-- Total results, number of pages -->
|
||||
<h5 class="uk-margin-bottom">
|
||||
<h6 class="uk-margin-bottom">
|
||||
<ng-container *ngIf="results && searchUtils.totalResults > 0">
|
||||
<span>{{searchUtils.totalResults|number}}</span>
|
||||
<span class="uk-text-muted uk-text-capitalize"> {{type}}, page </span>
|
||||
|
@ -248,7 +247,7 @@
|
|||
<span>{{searchUtils.page | number}}</span>
|
||||
<span class="uk-text-muted"> of {{(totalPages(oldTotalResults)|number)}}</span>
|
||||
</ng-container>
|
||||
</h5>
|
||||
</h6>
|
||||
<!-- TODO Download results position-->
|
||||
<div *ngIf="showDownload" class="uk-width-auto@m uk-margin-small-bottom">
|
||||
<search-download
|
||||
|
@ -309,7 +308,7 @@
|
|||
[results]="results"
|
||||
[status]="searchUtils.status"
|
||||
[type]="entityType"
|
||||
[showType]="false"
|
||||
[showType]="entityType == 'stakeholder'"
|
||||
[showLoading]="true" [properties]=properties>
|
||||
</portal-search-result>
|
||||
</div>
|
||||
|
|
|
@ -58,7 +58,7 @@ export class NewSearchPageComponent {
|
|||
@Input() customFilter: SearchCustomFilter;
|
||||
@Input() sort: boolean = true;
|
||||
@Input() sortedByChanged: string = "";
|
||||
@Input() searchFormClass: string = "searchForm";
|
||||
@Input() searchFormClass: string = "uk-background-muted";
|
||||
//From simple:
|
||||
@Input() rangeFilters: RangeFilter[] = [];
|
||||
@Input() rangeFields: string[][] = [];
|
||||
|
|
|
@ -1,30 +1,33 @@
|
|||
<ul class="uk-list uk-list-large" [class]="'uk-list uk-margin ' + custom_class" uk-height-match="target: .uk-card-default; row: false">
|
||||
<ul class="uk-list uk-list-xlarge" [class]="'uk-list uk-margin ' + custom_class"
|
||||
uk-height-match="target: .uk-card-default; row: false">
|
||||
<errorMessages [status]="[status]" [type]="'results'"></errorMessages>
|
||||
<li *ngFor="let result of results" class="uk-animation-fade">
|
||||
<div class="uk-card uk-card-default uk-card-body uk-card-hover uk-position-relative uk-flex uk-flex-column uk-flex-center" [class.uk-disabled]="!hasPermission(result)">
|
||||
<div class="uk-card uk-card-default uk-card-body uk-card-hover uk-position-relative uk-flex uk-flex-column uk-flex-center"
|
||||
[class.uk-disabled]="!hasPermission(result)">
|
||||
<div>
|
||||
<div *ngIf="type === 'community' && result.isSubscribed"
|
||||
class="uk-alert-primary uk-padding-small uk-position-top-left uk-text-center">
|
||||
<span>Subscribed</span>
|
||||
</div>
|
||||
<div *ngIf="type === 'community' && result.status === 'manager'"
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get('RESTRICTED')"></icon>
|
||||
<span class="space uk-text-small uk-text-capitalize">restricted</span>
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-column uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get('RESTRICTED')" ratio="1.5" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize">restricted</span>
|
||||
</div>
|
||||
<div *ngIf="type === 'community' && result.status === 'hidden'"
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get('PRIVATE')"></icon>
|
||||
<span class="space uk-text-small uk-text-capitalize">private</span>
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-column uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get('PRIVATE')" ratio="1.5" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize">private</span>
|
||||
</div>
|
||||
<div *ngIf="result.visibility && result.visibility !== 'PUBLIC'"
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get(result.visibility)"></icon>
|
||||
<span class="space uk-text-small uk-text-capitalize">{{result.visibility.toLowerCase()}}</span>
|
||||
class="uk-position-top-right uk-margin-top uk-margin-right uk-flex uk-flex-column uk-flex-middle">
|
||||
<icon [name]="visibilityIcon.get(result.visibility)" ratio="1.5" [flex]="true"></icon>
|
||||
<span class="uk-text-small uk-text-capitalize">{{result.visibility.toLowerCase()}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-grid uk-flex uk-flex-middle" uk-grid>
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="(type === 'community')?getCommunityPageUrl(result):getStakeholderPageUrl(result)"
|
||||
<a *ngIf="directLink && hasPermission(result)"
|
||||
[href]="(type === 'community')?getCommunityPageUrl(result):getStakeholderPageUrl(result)"
|
||||
target="_blank" class="uk-width-1-5@s">
|
||||
<ng-container *ngTemplateOutlet="resultPreview; context: {result: result}"></ng-container>
|
||||
</a>
|
||||
|
@ -38,10 +41,12 @@
|
|||
</div>
|
||||
<div class="uk-width-expand">
|
||||
<div *ngIf="type === 'community'" [title]="result.shortTitle" class="uk-margin-bottom">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getCommunityPageUrl(result)" class="uk-h5 uk-link-heading" target="_blank">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getCommunityPageUrl(result)"
|
||||
class="uk-h5 uk-link-heading" target="_blank">
|
||||
{{(result.title) ? result.title : result.shortTitle}}
|
||||
</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)" class="uk-h5 uk-link-heading">
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)"
|
||||
class="uk-h5 uk-link-heading">
|
||||
{{(result.title) ? result.title : result.shortTitle}}
|
||||
</a>
|
||||
<h5 *ngIf="!hasPermission(result)">
|
||||
|
@ -49,10 +54,12 @@
|
|||
</h5>
|
||||
</div>
|
||||
<div *ngIf="type === 'stakeholder'" [title]="result.index_shortName" class="uk-margin-bottom">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getStakeholderPageUrl(result)" class="uk-h5 uk-link-heading" target="_blank">
|
||||
<a *ngIf="directLink && hasPermission(result)" [href]="getStakeholderPageUrl(result)"
|
||||
class="uk-h5 uk-link-heading" target="_blank">
|
||||
{{(result.name) ? result.name : result.index_shortName}}
|
||||
</a>
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)" class="uk-h5 uk-link-heading">
|
||||
<a *ngIf="!directLink && hasPermission(result)" (click)="confirmModalOpen(result)"
|
||||
class="uk-h5 uk-link-heading">
|
||||
{{(result.name) ? result.name : result.index_shortName}}
|
||||
</a>
|
||||
<h5 *ngIf="!hasPermission(result)">
|
||||
|
@ -64,18 +71,17 @@
|
|||
{{result.description}}
|
||||
</p>
|
||||
</div>
|
||||
<div class="uk-text-small uk-flex uk-flex-middle">
|
||||
<span class="uk-text-muted" *ngIf="result.date || result.creationDate">Creation Date: </span>
|
||||
<div class="uk-text-small">
|
||||
<div *ngIf="result.date || result.creationDate" class="uk-flex uk-flex-middle uk-margin-small-bottom">
|
||||
<span class="uk-text-muted">Creation Date: </span>
|
||||
<span class="uk-margin-small-left" *ngIf="result.date">{{result.date | date:'dd-MM-yyyy'}}</span>
|
||||
<span class="uk-margin-small-left" *ngIf="result.creationDate">{{result.creationDate | date:'dd-MM-yyyy'}}</span>
|
||||
<span *ngIf="type === 'community' && showType && result.type" class="uk-margin-left">
|
||||
<span class="uk-margin-small-left"
|
||||
*ngIf="result.creationDate">{{result.creationDate | date:'dd-MM-yyyy'}}</span>
|
||||
</div>
|
||||
<div *ngIf="showType && result.type" class="uk-flex uk-flex-middle">
|
||||
<span class="uk-text-muted">Type:</span>
|
||||
<span class="uk-margin-small-left uk-text-capitalize">{{mapType(result.type)}}</span>
|
||||
</span>
|
||||
<span *ngIf="type === 'stakeholder' && result.type" class="uk-margin-left">
|
||||
<span class="uk-text-muted">Type:</span>
|
||||
<span class="uk-margin-small-left uk-text-capitalize">{{mapType(result.type)}}</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -92,6 +98,7 @@
|
|||
</modal-alert>
|
||||
<ng-template #resultPreview let-result="result">
|
||||
<div class="uk-flex uk-flex-center">
|
||||
<img *ngIf="result.logoUrl" [src]="result | logoUrl" [alt]="((result.title)?result.title:result.shortTitle) + ' logo'" loading="lazy">
|
||||
<img *ngIf="result.logoUrl" [src]="result | logoUrl"
|
||||
[alt]="((result.title)?result.title:result.shortTitle) + ' logo'" loading="lazy">
|
||||
</div>
|
||||
</ng-template>
|
||||
|
|
|
@ -22,7 +22,7 @@ export class PortalSearchResultComponent implements OnInit{
|
|||
@Input() properties: EnvProperties;
|
||||
@ViewChild('AlertModal') modal;
|
||||
visibilityIcon: Map<Visibility, string> = new Map<Visibility, string> ([
|
||||
["PRIVATE", 'lock'],
|
||||
["PRIVATE", 'incognito'],
|
||||
["RESTRICTED", 'group']
|
||||
]);
|
||||
public urlParam: string;
|
||||
|
@ -64,7 +64,7 @@ export class PortalSearchResultComponent implements OnInit{
|
|||
return result.status === "all" || (result.status === "manager" && result.isManager);
|
||||
} else if(this.type === "stakeholder") {
|
||||
return result.visibility === "PUBLIC" || (result.visibility === "RESTRICTED" && (result.isManager || result.isMember)) ||
|
||||
(result.visibility === "PRIVATE" || result.isManager);
|
||||
(result.visibility === "PRIVATE" && result.isManager);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import { NgModule} from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import {NgModule} from '@angular/core';
|
||||
import {CommonModule} from '@angular/common';
|
||||
import {FormsModule} from '@angular/forms';
|
||||
import {RouterModule} from '@angular/router';
|
||||
import {ErrorMessagesModule} from '../../utils/errorMessages.module';
|
||||
import {PortalSearchResultComponent} from "./portal-search-result.component";
|
||||
import {AlertModalModule} from "../../utils/modal/alertModal.module";
|
||||
|
@ -9,10 +9,8 @@ import {ManageModule} from "../../utils/manage/manage.module";
|
|||
import {IconsModule} from "../../utils/icons/icons.module";
|
||||
import {UrlPrefixModule} from "../../utils/pipes/url-prefix.module";
|
||||
import {IconsService} from "../../utils/icons/icons.service";
|
||||
import {group, lock} from "../../utils/icons/icons";
|
||||
import {incognito} from "../../utils/icons/icons";
|
||||
import {LogoUrlPipeModule} from "../../utils/pipes/logoUrlPipe.module";
|
||||
// import {IconsService} from "../../utils/icons/icons.service";
|
||||
// import {group, lock} from "../../utils/icons/icons";
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
|
@ -31,6 +29,6 @@ import {LogoUrlPipeModule} from "../../utils/pipes/logoUrlPipe.module";
|
|||
})
|
||||
export class PortalSearchResultModule {
|
||||
constructor(private iconsService: IconsService) {
|
||||
this.iconsService.registerIcons([group, lock])
|
||||
this.iconsService.registerIcons([incognito])
|
||||
}
|
||||
}
|
||||
|
|
|
@ -86,7 +86,7 @@
|
|||
</ng-template>
|
||||
<ng-template #input_label_wrapper let-filter="filter" let-value="value">
|
||||
<a *ngIf="actionRoute" [routerLink]="getRoute()"
|
||||
[queryParams]="getParams(filter,value)" class="uk-link-muted"
|
||||
[queryParams]="getParams(filter,value)" class="uk-link-muted uk-display-inline-block"
|
||||
[class.uk-disabled]="disabled(value.number)" [class.uk-link-text]="!disabled(value.number)">
|
||||
<ng-container *ngTemplateOutlet="input_label; context: {filter: filter, value: value}"></ng-container>
|
||||
</a>
|
||||
|
|
|
@ -11,12 +11,9 @@ export class HelperFunctions {
|
|||
|
||||
public static scrollToId(elementId:string) {
|
||||
if (typeof document !== 'undefined' && document.getElementById(elementId)) {
|
||||
document.getElementById(elementId).scrollIntoView();
|
||||
document.getElementById(elementId).scrollIntoView({behavior: "smooth"});
|
||||
}
|
||||
}
|
||||
public static isTiny(url: string) {
|
||||
return (url.indexOf('tinyurl.com') !== -1);
|
||||
}
|
||||
|
||||
public static copy(obj: any): any {
|
||||
let copy;
|
||||
|
|
|
@ -8,7 +8,7 @@ export interface Breadcrumb {
|
|||
@Component({
|
||||
selector: 'breadcrumbs',
|
||||
template: `
|
||||
<ul class="uk-breadcrumb" [ngClass]="addClass" [class.uk-light]="light">
|
||||
<ul class="uk-breadcrumb uk-margin-remove-bottom" [ngClass]="addClass" [class.uk-light]="light">
|
||||
<li *ngFor="let breadcrumb of breadcrumbs">
|
||||
<a class="uk-text-capitalize" *ngIf="breadcrumb.route" [routerLink]="breadcrumb.route">{{breadcrumb.name}}</a>
|
||||
<span class="uk-text-capitalize" *ngIf="!breadcrumb.route">{{breadcrumb.name}}</span>
|
||||
|
|
|
@ -1,6 +1,11 @@
|
|||
import {AfterViewInit, ChangeDetectorRef, Component, ElementRef, Input, OnInit, ViewChild} from "@angular/core";
|
||||
import {IconsService} from "./icons.service";
|
||||
|
||||
export interface StopRule {
|
||||
class: string,
|
||||
offset: number
|
||||
}
|
||||
|
||||
/**
|
||||
* By default this component uses Material Icons Library to render an icon with
|
||||
* a specific @name. For custom icons you should:
|
||||
|
@ -17,12 +22,23 @@ import {IconsService} from "./icons.service";
|
|||
*
|
||||
* - Custom SVG Icon. Define a variable in your component with an SVG and give it as Input @svg.
|
||||
*
|
||||
* In case of SVGs, there is an opportunity to add gradient color by define at least a start and end stop-color rules
|
||||
* and an id to support them. This option is enabled by giving id as input in @gradient (Optional @degrees for gradient direction)
|
||||
*
|
||||
* e.g #gradient .start {
|
||||
* stop-color: red;
|
||||
* }
|
||||
*
|
||||
* e.g #gradient .end {
|
||||
* stop-color: orange;
|
||||
* }
|
||||
*
|
||||
* */
|
||||
@Component({
|
||||
selector: 'icon',
|
||||
template: `
|
||||
<span #icon *ngIf="svg" class="uk-icon" [class.uk-flex]="flex" [ngClass]="customClass" [ngStyle]="style" [innerHTML]="svg | safeHtml"></span>
|
||||
<span [class.uk-flex]="flex" [ngClass]="customClass">
|
||||
<span #icon *ngIf="svg" class="uk-icon" [class.uk-preserve]="gradient" [class.uk-flex]="flex" [ngClass]="customClass" [ngStyle]="style" [innerHTML]="svg | safeHtml"></span>
|
||||
<span [class.uk-flex]="flex" [ngClass]="customClass" [class.uk-display-inline-block]="!flex">
|
||||
<span *ngIf="!svg && iconName" class="material-icons" [ngClass]="type" [ngStyle]="style">{{iconName}}</span>
|
||||
</span>
|
||||
<span *ngIf="visuallyHidden" class="visually-hidden">{{visuallyHidden}}</span>
|
||||
|
@ -37,6 +53,8 @@ export class IconsComponent implements AfterViewInit {
|
|||
*/
|
||||
@Input()
|
||||
public svg;
|
||||
@Input()
|
||||
public defaultSize = false;
|
||||
/**
|
||||
* True if this icon should have display flex (Optional, Default: false)
|
||||
*
|
||||
|
@ -61,6 +79,8 @@ export class IconsComponent implements AfterViewInit {
|
|||
public stroke;
|
||||
/**
|
||||
* Size of icon (Default: 1)
|
||||
*
|
||||
* Disabled if defaultSize = true
|
||||
* */
|
||||
@Input()
|
||||
public ratio = 1;
|
||||
|
@ -78,10 +98,22 @@ export class IconsComponent implements AfterViewInit {
|
|||
this.svg = this.iconsService.getIcon(iconName);
|
||||
}
|
||||
/**
|
||||
*
|
||||
* Set visually hidden name for accessibility
|
||||
* */
|
||||
@Input()
|
||||
public visuallyHidden: string = null;
|
||||
/**
|
||||
* Gradient rules
|
||||
* Available only for SVG!
|
||||
*
|
||||
* Define your css rules for stop-colors
|
||||
* */
|
||||
@Input()
|
||||
public gradient: string = null;
|
||||
@Input()
|
||||
public degrees: number = 0;
|
||||
@Input()
|
||||
public stopRules: StopRule[]= [{class: 'start', offset: 0}, {class: 'end', offset: 100}];
|
||||
@ViewChild("icon")
|
||||
public icon: ElementRef;
|
||||
|
||||
|
@ -90,13 +122,19 @@ export class IconsComponent implements AfterViewInit {
|
|||
|
||||
ngAfterViewInit() {
|
||||
if(this.svg) {
|
||||
let svg = this.icon.nativeElement.getElementsByTagName('svg').item(0);
|
||||
svg.setAttribute("width", (this.ratio*IconsComponent.DEFAULT_ICON_SIZE).toString());
|
||||
svg.setAttribute("height", (this.ratio*IconsComponent.DEFAULT_ICON_SIZE).toString());
|
||||
let svg: Element = this.icon.nativeElement.getElementsByTagName('svg').item(0);
|
||||
if(!this.defaultSize) {
|
||||
svg.setAttribute("width", (this.ratio * IconsComponent.DEFAULT_ICON_SIZE).toString());
|
||||
svg.setAttribute("height", (this.ratio * IconsComponent.DEFAULT_ICON_SIZE).toString());
|
||||
}
|
||||
if(this.gradient) {
|
||||
this.addGradient(svg);
|
||||
} else {
|
||||
this.style = {
|
||||
fill: this.fill,
|
||||
stroke: this.stroke
|
||||
};
|
||||
}
|
||||
} else {
|
||||
this.style = {
|
||||
"font-size.px": this.ratio*IconsComponent.DEFAULT_ICON_SIZE
|
||||
|
@ -104,4 +142,33 @@ export class IconsComponent implements AfterViewInit {
|
|||
}
|
||||
this.cdr.detectChanges();
|
||||
}
|
||||
|
||||
addGradient(svg: Element) {
|
||||
if(svg.children.length > 0 && typeof document !== "undefined") {
|
||||
let gradientDefinition = document.createElementNS('http://www.w3.org/2000/svg', 'linearGradient');
|
||||
gradientDefinition.setAttribute('id', this.gradient);
|
||||
if(this.degrees !== 0) {
|
||||
let angle = (this.degrees) * (Math.PI / 180);
|
||||
gradientDefinition.setAttribute('x1', Math.round(50 + Math.sin(angle + Math.PI) * 50) + '%');
|
||||
gradientDefinition.setAttribute('y1', Math.round(50 + Math.cos(angle + Math.PI) * 50) + '%');
|
||||
gradientDefinition.setAttribute('x2', Math.round(50 + Math.sin(angle) * 50) + '%');
|
||||
gradientDefinition.setAttribute('y2', Math.round(50 + Math.cos(angle) * 50) + '%');
|
||||
}
|
||||
for(let rule of this.stopRules) {
|
||||
let item = document.createElementNS('http://www.w3.org/2000/svg','stop');
|
||||
item.setAttribute('class', rule.class);
|
||||
item.setAttribute('offset', rule.offset + '%');
|
||||
gradientDefinition.appendChild(item);
|
||||
}
|
||||
let defs = document.createElementNS('http://www.w3.org/2000/svg','defs');
|
||||
defs.appendChild(gradientDefinition);
|
||||
for(let i = 0; i < svg.children.length; i++) {
|
||||
let item = svg.children.item(i);
|
||||
if(!item.hasAttribute('fill')) {
|
||||
item.setAttribute('fill', "url('#" + this.gradient + "')");
|
||||
}
|
||||
}
|
||||
svg.insertBefore(defs, svg.childNodes[0]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -148,3 +148,8 @@ export const print = {
|
|||
}
|
||||
|
||||
/** Add new icon under this line to be sure that it will be added on preview */
|
||||
|
||||
export const incognito = {
|
||||
name: 'incognito',
|
||||
data: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24.51 19.525"><g id="Group_13376" data-name="Group 13376" transform="translate(-428.81 -3863.018)"><path id="Path_104500" data-name="Path 104500" d="M44.68,105.185H43.024a23.507,23.507,0,0,0-9.194-.158V106a3.909,3.909,0,0,1,1.264,1.668c.455,1.119.2,3.05,4.148,3.289s4-4.041,4.034-4.438.577-.372.577-.372.541-.021.579.372.09,4.673,4.034,4.438,3.693-2.17,4.146-3.289A3.9,3.9,0,0,1,53.879,106v-.969A23.686,23.686,0,0,0,44.68,105.185Z" transform="translate(397.218 3771.582)" fill="#2c2c2c"/><path id="Path_104501" data-name="Path 104501" d="M41.867,35.784H40.326s-1.95-6.217-2.207-6.735a2.8,2.8,0,0,0-2.591-2.061c-1.92-.266-2.138,1.225-3.544,1.268-1.406-.049-1.617-1.546-3.542-1.268a2.817,2.817,0,0,0-2.592,2.061c-.246.518-2.205,6.735-2.205,6.735H22.1a2.31,2.31,0,0,0-2.371,2.245H44.24A2.311,2.311,0,0,0,41.867,35.784Z" transform="translate(409.08 3836.064)" fill="#2c2c2c"/></g></svg>'
|
||||
}
|
||||
|
|
|
@ -13,10 +13,10 @@ import {Component, HostListener, Input, OnInit, ViewEncapsulation} from "@angula
|
|||
@Component({
|
||||
selector: 'section-scroll',
|
||||
template: `
|
||||
<div class="section" [ngClass]="customClass">
|
||||
<div [ngClass]="customClass">
|
||||
<ng-content select="[top]"></ng-content>
|
||||
<div class="content" [ngClass]="childrenCustomClass">
|
||||
<div class="uk-grid">
|
||||
<div [ngClass]="childrenCustomClass">
|
||||
<div class="uk-grid" uk-grid>
|
||||
<ng-content select="[left]"></ng-content>
|
||||
<ng-content select="[scroll]"></ng-content>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue