Revision 60892
Added by Argiro Kokogiannaki about 3 years ago
| modules/uoa-connect-portal/trunk/src/app/demo/demo.component.html | ||
|---|---|---|
| 1 |
<customization *ngIf="layout" [properties]="properties" |
|
| 2 |
[layout]="layout" ></customization> |
|
| 1 | 3 |
<div class=""> |
| 2 | 4 |
<div |
| 3 |
class="uk-padding uk-text-center generalSearchForm uk-width-1-1 uk-height-small midBackground uk-flex uk-flex-center uk-flex-middle"> |
|
| 4 |
<div class="uk-margin-large-top uk-margin-large-bottom uk-padding"> |
|
| 5 |
<div> |
|
| 6 |
<input class="uk-input uk-input-small uk-width-medium uk-margin-small-bottom" placeholder="Search... "> |
|
| 7 |
<button class="uk-button uk-margin-small-left">Button</button> |
|
| 8 |
</div> |
|
| 9 |
<div> |
|
| 10 |
<a class="portal-link">Link</a> |
|
| 11 |
</div> |
|
| 5 |
class="uk-padding generalSearchForm midBackground "> |
|
| 6 |
<div class="uk-container uk-container-large"> |
|
| 7 |
<div class="uk-margin-large-top"> |
|
| 8 |
<h1 class="title uk-margin-remove"> |
|
| 9 |
Lorem ipsum dolor sit amet |
|
| 10 |
</h1> |
|
| 11 |
<div class="subtitle uk-margin-remove"> |
|
| 12 |
Lorem ipsum dolor sit amet, consectetur adipiscing elit |
|
| 13 |
</div> |
|
| 14 |
</div> |
|
| 15 |
</div> |
|
| 16 |
<div |
|
| 17 |
class=" uk-flex uk-flex-center uk-flex-middle"> |
|
| 18 |
<form class="uk-margin-large uk-margin-large-top "> |
|
| 19 |
<input class="uk-input uk-input uk-width-xlarge@l uk-width-large@m uk-width-medium uk-margin-small-bottom" placeholder="Search... "> |
|
| 20 |
<button class="uk-button uk-margin-small-left uktext-bold">Search</button> |
|
| 21 |
<div class="uk-text-right uk-margin-small-top"><a class="portal-link">Advanced search</a></div> |
|
| 22 |
</form> |
|
| 12 | 23 |
</div> |
| 13 | 24 |
</div> |
| 14 | 25 |
</div> |
| 26 |
<!--Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.--> |
|
| 15 | 27 |
<div class="uk-container uk-container-large uk-margin-top"> |
| 16 | 28 |
<my-tabs class="uk-padding"> |
| 17 | 29 |
<my-tab |
| 18 | 30 |
[tabTitle]="'Summary'" [tabId]="'summary'" class="uk-active"> |
| 19 |
<div class="uk-padding-small uk-text-center uk-width-1-1 uk-height-medium lightBackground uk-flex uk-flex-center uk-flex-middle"> |
|
| 20 |
Summary tab |
|
| 21 |
</div> |
|
| 31 |
<div class="uk-padding uk-width-1-1"> |
|
| 32 |
<div class="uk-margin-bottom"> |
|
| 33 |
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. |
|
| 34 |
</div> |
|
| 35 |
<div class="uk-margin-small-bottom"> |
|
| 36 |
<span class="uk-margin-right "><span class="lowOpacityColor uk-text-muted">Created: </span> 01-Jan-2020 |
|
| 37 |
</span> |
|
| 38 |
<span><span class="uk-display-inline-block "><span class="lowOpacityColor uk-text-muted">Members: </span> |
|
| 39 |
1024 </span></span> |
|
| 40 |
</div> |
|
| 41 |
<div class="uk-margin-small-bottom"> |
|
| 42 |
<span class="uk-margin-right "><span class="lowOpacityColor uk-text-muted">Projects: </span> <a |
|
| 43 |
class="portal-link">567 |
|
| 44 |
</a> |
|
| 45 |
</span> |
|
| 46 |
<span><span class="uk-display-inline-block "><span class="lowOpacityColor uk-text-muted">Content providers: |
|
| 47 |
</span> |
|
| 48 |
<a class="portal-link">123</a></span></span> |
|
| 49 |
</div> |
|
| 50 |
<hr> |
|
| 51 |
<div> |
|
| 52 |
<div class="tab-header"> <span class=""> Recent publications </span></div> |
|
| 53 |
<div class="uk-text-right "><a class=" uk-button uk-button-text" > View all </a></div> |
|
| 54 |
<result-preview [properties]="properties" [result]="result"></result-preview> |
|
| 55 |
</div> |
|
| 56 |
</div> |
|
| 22 | 57 |
</my-tab> |
| 23 | 58 |
|
| 24 | 59 |
<my-tab customClass="portalTab" |
| ... | ... | |
| 28 | 63 |
</div> |
| 29 | 64 |
</my-tab> |
| 30 | 65 |
</my-tabs> |
| 66 |
<div> |
|
| 67 |
<result-landing [resultFromInput]="true" [resultLandingInfo]="resultLanding"></result-landing> |
|
| 68 |
|
|
| 69 |
</div> |
|
| 31 | 70 |
<div class="uk-margin-top uk-margin-small-bottom uk-text-bold uk-text-large">Dark background</div> |
| 32 | 71 |
|
| 33 | 72 |
<div class="uk-padding-small uk-text-center communityPanelBackground uk-height-medium uk-light uk-flex uk-flex-center uk-flex-middle" > |
| ... | ... | |
| 35 | 74 |
<h1 >Heading</h1> |
| 36 | 75 |
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent mollis velit ornare, auctor lectus at, rutrum magna. Aenean vehicula elementum lacinia.</div> |
| 37 | 76 |
<a class="">Link</a> |
| 38 |
<button class="uk-button">Button</button> |
|
| 77 |
<br> |
|
| 78 |
<button class="uk-button">Button</button> |
|
| 39 | 79 |
</div> |
| 40 | 80 |
</div> |
| 41 | 81 |
|
| modules/uoa-connect-portal/trunk/src/app/demo/demo.component.ts | ||
|---|---|---|
| 1 | 1 |
import {Component, OnInit} from '@angular/core';
|
| 2 | 2 |
import {EnvProperties} from "../openaireLibrary/utils/properties/env-properties";
|
| 3 |
import {ActivatedRoute, Router} from "@angular/router";
|
|
| 4 |
import {HelperService} from "../openaireLibrary/utils/helper/helper.service";
|
|
| 3 |
import {ActivatedRoute} from "@angular/router";
|
|
| 4 |
import {CustomizationOptions} from "../openaireLibrary/connect/community/CustomizationOptions";
|
|
| 5 |
import {StringUtils} from "../openaireLibrary/utils/string-utils.class";
|
|
| 6 |
import {ResultPreview} from "../openaireLibrary/utils/result-preview/result-preview";
|
|
| 7 |
import {properties} from "../../environments/environment";
|
|
| 8 |
import {ResultLandingInfo} from "../openaireLibrary/utils/entities/resultLandingInfo";
|
|
| 5 | 9 |
|
| 6 | 10 |
|
| 7 | 11 |
@Component({
|
| ... | ... | |
| 11 | 15 |
|
| 12 | 16 |
export class DemoComponent implements OnInit{
|
| 13 | 17 |
|
| 14 |
properties:EnvProperties; |
|
| 18 |
properties:EnvProperties; |
|
| 19 |
layout: CustomizationOptions = null; |
|
| 20 |
result: ResultPreview; |
|
| 21 |
resultLanding:ResultLandingInfo; |
|
| 22 |
constructor(private route: ActivatedRoute) {
|
|
| 15 | 23 |
|
| 16 |
constructor(private route: ActivatedRoute, |
|
| 17 |
private _router: Router, |
|
| 18 |
private helper: HelperService) {
|
|
| 19 |
|
|
| 20 | 24 |
} |
| 21 | 25 |
|
| 22 | 26 |
ngOnInit(): void {
|
| 27 |
this.properties = properties; |
|
| 28 |
this.route.queryParams.subscribe(params => {
|
|
| 29 |
if (params['layout']) {
|
|
| 30 |
this.layout = JSON.parse(StringUtils.URIDecode(params['layout'])); |
|
| 31 |
} |
|
| 32 |
}); |
|
| 33 |
this.result = new ResultPreview(); |
|
| 34 |
this.resultLanding = new ResultLandingInfo(); |
|
| 35 |
this.result.resultType = "Publication"; |
|
| 36 |
this.resultLanding.types = this.result.types = ["Article"]; |
|
| 37 |
this.resultLanding.accessMode = this.result.accessMode = "Open Access"; |
|
| 38 |
this.resultLanding.description = this.result.description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." |
|
| 39 |
this.resultLanding.authors = this.result.authors = [{fullName: "Lorem ipsum", orcid: "0000-1111-2222-3333", orcid_pending: null}, {fullName: "Lorem ipsum", orcid: null, orcid_pending: "0000-1111-2222-3333"},{fullName: "Lorem ipsum", orcid: null, orcid_pending: null}];
|
|
| 40 |
this.resultLanding.title = this.result.title = "Lorem ipsum dolor sit amet, consectetur adipiscing elit"; |
|
| 41 |
this.resultLanding.fundedByProjects = this.result.projects = [{id: "XYZ", acronym: "Project acronym", title: "Project name", funderShortname: "Funder acronym", funderName: "Funder name", code:" project code"}]
|
|
| 42 |
this.resultLanding.countries = this.result.countries = ["Greece"]; |
|
| 43 |
this.resultLanding.languages = this.result.languages = ["GR"]; |
|
| 44 |
this.resultLanding.identifiers = this.result.identifiers = new Map<string, string[]>(); |
|
| 45 |
this.result.identifiers.set("doi",["DOI/1","DOI/2"]);
|
|
| 46 |
this.resultLanding.date = this.result.year = "2020"; |
|
| 47 |
this.resultLanding.publisher = "Publisher name"; |
|
| 48 |
this.resultLanding.journal = {journal: "Journal name", lissn: null};
|
|
| 49 |
this.resultLanding.subjects = ["Subject 1", "Subject 2"]; |
|
| 50 |
this.resultLanding.contexts = [{ "labelContext": "Research Community", "idContext": "",
|
|
| 51 |
"labelCategory":"", "idCategory": "", |
|
| 52 |
"labelConcept": "", "idConcept": "", "inline" :true }] |
|
| 53 |
this.resultLanding.objIdentifier ="re3data_____::db814dc656a911b556dba42a331cebe9"; |
|
| 23 | 54 |
|
| 55 |
|
|
| 24 | 56 |
} |
| 25 | 57 |
|
| 26 | 58 |
|
| modules/uoa-connect-portal/trunk/src/app/demo/demo.module.ts | ||
|---|---|---|
| 4 | 4 |
import {CommonModule} from "@angular/common";
|
| 5 | 5 |
import {RouterModule} from "@angular/router";
|
| 6 | 6 |
import {TabsModule} from "../openaireLibrary/utils/tabs/tabs.module";
|
| 7 |
import {CustomizationModule} from "../utils/customization/customization.module";
|
|
| 8 |
import {ResultPreviewModule} from "../openaireLibrary/utils/result-preview/result-preview.module";
|
|
| 9 |
import {ResultLandingModule} from "../openaireLibrary/landingPages/result/resultLanding.module";
|
|
| 7 | 10 |
|
| 8 | 11 |
@NgModule({
|
| 9 | 12 |
imports: [ |
| ... | ... | |
| 12 | 15 |
RouterModule.forChild([ |
| 13 | 16 |
{path: '', component: DemoComponent}
|
| 14 | 17 |
]), |
| 15 |
TabsModule |
|
| 18 |
TabsModule, |
|
| 19 |
CustomizationModule, |
|
| 20 |
ResultPreviewModule, |
|
| 21 |
ResultLandingModule |
|
| 16 | 22 |
], |
| 17 | 23 |
declarations: [ |
| 18 | 24 |
DemoComponent |
| modules/uoa-connect-portal/trunk/src/app/community/community.component.html | ||
|---|---|---|
| 13 | 13 |
</search-tab> |
| 14 | 14 |
</div> |
| 15 | 15 |
|
| 16 |
<div |
|
| 16 |
<!--<div
|
|
| 17 | 17 |
*ngIf="statistics.statisticsSum && statistics.statisticsDisplay && statistics.statisticsSum[type].total>0 |
| 18 | 18 |
&& |
| 19 | 19 |
( statistics.statisticsDisplay.entities[type].numbers.map['total']['showInDashboard'] |
| ... | ... | |
| 38 | 38 |
chartsInfoMap:statistics.chartsInfoMap, showIn:'showInDashboard'}"> |
| 39 | 39 |
</ng-container> |
| 40 | 40 |
</div> |
| 41 |
</div> |
|
| 41 |
</div>-->
|
|
| 42 | 42 |
</div> |
| 43 | 43 |
</ng-template> |
| 44 | 44 |
|
| ... | ... | |
| 293 | 293 |
? 'uk-margin-small-bottom' : ''"> |
| 294 | 294 |
<span |
| 295 | 295 |
*ngIf="projectTotal && projectTotal > 0 && isEntityEnabled('project') && isRouteEnabled(searchLinkToProjects)">
|
| 296 |
<span class="uk-text-muted">Projects:</span> |
|
| 296 |
<span class="uk-text-muted">Projects: </span>
|
|
| 297 | 297 |
<a class="uk-margin-auto-vertical uk-margin-auto portal-link" [queryParams]=params |
| 298 |
routerLinkActive="router-link-active" [routerLink]="searchLinkToProjects">
|
|
| 299 |
{{projectTotal|number}}
|
|
| 298 |
routerLinkActive="router-link-active" |
|
| 299 |
[routerLink]="searchLinkToProjects">{{projectTotal|number}}
|
|
| 300 | 300 |
</a> |
| 301 | 301 |
</span> |
| 302 | 302 |
<span |
| ... | ... | |
| 304 | 304 |
[class]="'uk-display-inline-block '+((projectTotal && projectTotal > 0 && isEntityEnabled('project') && isRouteEnabled(searchLinkToProjects)) ? 'uk-margin-left' : '')">
|
| 305 | 305 |
<span class="uk-text-muted">Content Providers: </span> |
| 306 | 306 |
<a class="uk-margin-auto-vertical uk-margin-auto portal-link" [queryParams]=params |
| 307 |
routerLinkActive="router-link-active" [routerLink]="searchLinkToDataProviders">
|
|
| 308 |
{{contentProviderTotal|number}}
|
|
| 307 |
routerLinkActive="router-link-active" |
|
| 308 |
[routerLink]="searchLinkToDataProviders">{{contentProviderTotal|number}}
|
|
| 309 | 309 |
</a> |
| 310 | 310 |
</span> |
| 311 | 311 |
<span *ngIf="projectsCalculated && contentProvidersCalculated && |
| ... | ... | |
| 554 | 554 |
[tabTitle]="'Other Research'" [tabNumber]="fetchOrps.searchUtils.totalResults" [tabId]="'other'"> |
| 555 | 555 |
<ng-container *ngTemplateOutlet="other_tab;"></ng-container> |
| 556 | 556 |
</my-tab> |
| 557 |
<my-tab *ngIf="showAnalyticsTab()" |
|
| 557 |
<!-- <my-tab *ngIf="showAnalyticsTab()"
|
|
| 558 | 558 |
[tabTitle]="'Analytics'" customClass="statistics" [tabId]="'analytics'"> |
| 559 | 559 |
<ng-container *ngTemplateOutlet="analytics_tab;"></ng-container> |
| 560 |
</my-tab> |
|
| 560 |
</my-tab>-->
|
|
| 561 | 561 |
<my-tab *ngIf="properties.environment != 'production' && communityId == 'covid-19'" |
| 562 | 562 |
[tabTitle]="'Ontology Mapping'" [tabId]="'mapping'" customClass="portalTab"> |
| 563 | 563 |
<ng-container *ngTemplateOutlet="mapping_tab;"></ng-container> |
| ... | ... | |
| 592 | 592 |
[tabTitle]="'Other Research'" [tabNumber]="fetchOrps.searchUtils.totalResults" [tabId]="'other'"> |
| 593 | 593 |
<ng-container *ngTemplateOutlet="other_tab;"></ng-container> |
| 594 | 594 |
</my-tab> |
| 595 |
<my-tab *ngIf="showAnalyticsTab()" |
|
| 595 |
<!--<my-tab *ngIf="showAnalyticsTab()"
|
|
| 596 | 596 |
[tabTitle]="'Analytics'" customClass="statistics" [tabId]="'analytics'"> |
| 597 | 597 |
<ng-container *ngTemplateOutlet="analytics_tab;"></ng-container> |
| 598 |
</my-tab> |
|
| 598 |
</my-tab>-->
|
|
| 599 | 599 |
<my-tab *ngIf="properties.environment != 'production' && communityId == 'covid-19'" |
| 600 | 600 |
[tabTitle]="'Ontology Mapping'" [tabId]="'mapping'" customClass="portalTab"> |
| 601 | 601 |
<ng-container *ngTemplateOutlet="mapping_tab;"></ng-container> |
| ... | ... | |
| 611 | 611 |
</div> |
| 612 | 612 |
</div> |
| 613 | 613 |
</div> |
| 614 |
<statistics-for-dashboard [currentMode]="'showInDashboard'"></statistics-for-dashboard>
|
|
| 614 |
<!--<statistics-for-dashboard [currentMode]="'showInDashboard'"></statistics-for-dashboard>-->
|
|
| 615 | 615 |
<div class="uk-section tm-middle uk-container uk-margin-top uk-padding-remove-top" id="" |
| 616 | 616 |
*ngIf="communityId && communityInfo"> |
| 617 | 617 |
<ng-container *ngIf=" isRouteEnabled('/organizations')">
|
| 618 |
<div class="uk-container uk-margin-bottom uk-grid">
|
|
| 618 |
<div class="uk-container uk-margin-bottom"> |
|
| 619 | 619 |
<div class="uk-width-expand uk-padding-remove"> |
| 620 | 620 |
<affiliations [longView]="false" [getAffiliationsFromAPI]="true" [communityFirstPage]="true"></affiliations> |
| 621 | 621 |
</div> |
| modules/uoa-connect-portal/trunk/src/app/community/community.component.ts | ||
|---|---|---|
| 75 | 75 |
|
| 76 | 76 |
subscribers: number = 0; |
| 77 | 77 |
|
| 78 |
// TODO Unsubscribe |
|
| 79 | 78 |
subs: Subscription[] = []; |
| 80 | 79 |
|
| 81 | 80 |
@ViewChild(StatisticsForDashboardComponent) statistics: StatisticsForDashboardComponent = null; |
| modules/uoa-connect-portal/trunk/src/app/utils/customization/customization.component.ts | ||
|---|---|---|
| 4 | 4 |
import {LayoutService} from "../../openaireLibrary/services/layout.service";
|
| 5 | 5 |
import {CustomizationOptions} from "../../openaireLibrary/connect/community/CustomizationOptions";
|
| 6 | 6 |
import {DOCUMENT} from "@angular/common";
|
| 7 |
import {DomSanitizer} from "@angular/platform-browser";
|
|
| 8 |
import {StringUtils} from "../../openaireLibrary/utils/string-utils.class";
|
|
| 9 | 7 |
|
| 10 | 8 |
@Component({
|
| 11 | 9 |
selector: 'customization', |
| ... | ... | |
| 19 | 17 |
customizationCss:string = ""; |
| 20 | 18 |
|
| 21 | 19 |
|
| 22 |
constructor(private route: ActivatedRoute, |
|
| 23 |
private router: Router, private _layoutService: LayoutService, @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2, private sanitizer: DomSanitizer |
|
| 24 |
) {
|
|
| 25 |
|
|
| 20 |
constructor(private route: ActivatedRoute,private router: Router, private _layoutService: LayoutService, @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2) {
|
|
| 26 | 21 |
} |
| 27 | 22 |
|
| 28 | 23 |
public ngOnInit() {
|
| 29 |
console.log("cust init")
|
|
| 30 |
this._layoutService.getLayout(this.properties, this.communityId).subscribe( |
|
| 31 |
layout => {
|
|
| 32 |
if (layout) {
|
|
| 33 |
console.debug("service");
|
|
| 34 |
this.layout = CustomizationOptions.checkForObsoleteVersion(layout.layoutOptions,this.communityId); |
|
| 35 |
} else {
|
|
| 36 |
this.layout = new CustomizationOptions(CustomizationOptions.getIdentity(this.communityId).mainColor, CustomizationOptions.getIdentity(this.communityId).secondaryColor); |
|
| 37 |
console.debug("default");
|
|
| 38 |
} |
|
| 39 |
this.privateAppendCss(); |
|
| 40 |
}, |
|
| 41 |
error => {
|
|
| 42 |
console.log(" Layout not found - use default");
|
|
| 43 |
this.layout = new CustomizationOptions(); |
|
| 44 |
this.privateAppendCss(); |
|
| 45 |
} |
|
| 46 |
); |
|
| 47 |
this.route.queryParams.subscribe(params => {
|
|
| 48 |
if(params['layout']) {
|
|
| 49 |
this.layout = JSON.parse(StringUtils.URIDecode(params['layout'])); |
|
| 50 |
this.privateAppendCss(); |
|
| 51 |
}else{
|
|
| 52 | 24 |
|
| 53 |
} |
|
| 54 |
}); |
|
| 55 |
// this.privateAppendCss(); |
|
| 56 |
} |
|
| 57 |
privateAppendCss(){
|
|
| 58 |
|
|
| 59 | 25 |
this.buildCss(); |
| 60 | 26 |
try {
|
| 61 | 27 |
const head = this.document.getElementsByTagName('head')[0];
|
| ... | ... | |
| 105 | 71 |
this.customizationCss = this.customizationCss.concat('.generalSearchForm,.publicationsSearchForm,.projectsSearchForm, .projectsTableSearchForm,.organizationsSearchForm,.datasourcesSearchForm {');
|
| 106 | 72 |
this.customizationCss = this.customizationCss.concat(' background: ' + "url('" + svg + "') transparent no-repeat center bottom }");
|
| 107 | 73 |
|
| 74 |
//Button link SVG |
|
| 75 |
let arrow = `<svg width="23" height="11" viewBox="0 0 23 11" xmlns="http://www.w3.org/2000/svg"><polyline fill="none" stroke="{{color}}" points="17 1 22 5.5 17 10 " /><line fill="none" stroke="{{color}}" x1="0" y1="5.5" x2="22.4" y2="5.5" /></svg>`;;
|
|
| 76 |
let svg_arrow = 'data:image/svg+xml,' + encodeURIComponent(arrow.split('{{color}}').join(this.layout.identity.mainColor));
|
|
| 77 |
this.customizationCss = this.customizationCss.concat('.uk-button-text::before {');
|
|
| 78 |
this.customizationCss = this.customizationCss.concat(' background-image: ' + "url('" + svg_arrow + "') !important}");
|
|
| 79 |
|
|
| 108 | 80 |
this.customizationCss = this.customizationCss.concat(' .communityPanelBackground, .communityPanelBackground .uk-section-primary {');
|
| 109 | 81 |
this.customizationCss = this.customizationCss.concat(' background-color: ' + this.layout.backgrounds.dark.color + ';}');
|
| 110 | 82 |
this.customizationCss = this.customizationCss.concat(' .uk-button:not(.uk-button-text){');
|
| modules/uoa-connect-portal/trunk/src/app/utils/piwikHelper.ts | ||
|---|---|---|
| 22 | 22 |
"enermaps":318, |
| 23 | 23 |
"galaxy":453 |
| 24 | 24 |
}; |
| 25 |
public static siteIDsProduction={
|
|
| 26 |
"dh-ch":198, |
|
| 27 |
"sdsn-gr":200, |
|
| 28 |
"fam":197, |
|
| 29 |
"mes":196, |
|
| 30 |
"ni":199 |
|
| 31 |
}; |
|
| 32 | 25 |
public static getSiteId(communityId:string, environment:string){
|
| 33 |
// if(environment == 'production' && this.siteIDsProduction[communityId]){
|
|
| 34 |
// return this.siteIDsProduction[communityId]; |
|
| 35 |
// } |
|
| 36 | 26 |
return this.siteIDs[communityId]; |
| 37 | 27 |
} |
| 38 | 28 |
|
| modules/uoa-connect-portal/trunk/src/app/app.component.ts | ||
|---|---|---|
| 36 | 36 |
[showMenu]=showMenu [properties]="properties" [enableSearch]="false" |
| 37 | 37 |
searchRoute="/search/find/research-outcomes" |
| 38 | 38 |
[showHomeMenuItem]="false"></navbar> |
| 39 |
<!-- <customization *ngIf="properties && showMenu && communityId && communityId.length > 0 && layout" [properties]="properties"--> |
|
| 40 |
<!-- [communityId]="communityId" [layout]="layout" ></customization>--> |
|
| 41 |
<customization *ngIf="properties && showMenu && communityId && communityId.length > 0" [properties]="properties" |
|
| 42 |
[communityId]="communityId" ></customization> |
|
| 39 |
<customization *ngIf="properties && showMenu && communityId && communityId.length > 0 && layout" [properties]="properties" |
|
| 40 |
[communityId]="communityId" [layout]="layout" ></customization> |
|
| 43 | 41 |
<schema2jsonld *ngIf="properties && showMenu && !community" [URL]="properties.domain + properties.baseLink" |
| 44 | 42 |
[logoURL]="properties.domain + properties.baseLink+'/assets/common-assets/logo-small-connect.png'" |
| 45 | 43 |
type="home" |
| ... | ... | |
| 139 | 137 |
this.user = user; |
| 140 | 138 |
this.init(); |
| 141 | 139 |
}, error => this.init())); |
| 142 |
/* this.subscriptions.push(this.route.queryParams.subscribe(params => {
|
|
| 143 |
console.log(" params changed!" + params['layout'])
|
|
| 144 |
if(params['layout']) {
|
|
| 145 |
this.layout = JSON.parse(StringUtils.URIDecode(params['layout'])); |
|
| 146 |
} |
|
| 147 |
}));*/ |
|
| 148 | 140 |
} |
| 149 | 141 |
|
| 150 | 142 |
get isManager() {
|
| ... | ... | |
| 168 | 160 |
initAdminToolCommunity(communityId) {
|
| 169 | 161 |
if (communityId) {
|
| 170 | 162 |
this.properties.adminToolsPortalType = "community"; |
| 171 |
// this.initLayout(communityId);
|
|
| 163 |
this.initLayout(communityId); |
|
| 172 | 164 |
} |
| 173 | 165 |
this.configurationService.initCommunityInformation(this.properties, (communityId) ? communityId : this.properties.adminToolsPortalType); |
| 174 | 166 |
} |
| 175 | 167 |
initLayout(communityId){
|
| 176 |
if(!this.layout) {
|
|
| 168 |
if(!this.layout && this.properties.environment == "development") {
|
|
| 177 | 169 |
this._layoutService.getLayout(this.properties, communityId).subscribe( |
| 178 | 170 |
layout => {
|
| 179 |
console.debug(layout); |
|
| 180 |
|
|
| 181 | 171 |
if (layout) {
|
| 182 |
console.debug("service");
|
|
| 183 |
this.layout = layout.layoutOptions; |
|
| 172 |
this.layout = CustomizationOptions.checkForObsoleteVersion(layout.layoutOptions,this.communityId); |
|
| 184 | 173 |
} else {
|
| 185 | 174 |
this.layout = new CustomizationOptions(CustomizationOptions.getIdentity(communityId).mainColor, CustomizationOptions.getIdentity(communityId).secondaryColor); |
| 186 |
console.debug("default");
|
|
| 187 | 175 |
} |
| 188 | 176 |
|
| 189 | 177 |
}, |
| 190 | 178 |
error => {
|
| 191 |
console.log(" Layout not found - use default");
|
|
| 192 | 179 |
this.layout = new CustomizationOptions(CustomizationOptions.getIdentity(communityId).mainColor, CustomizationOptions.getIdentity(communityId).secondaryColor); |
| 193 |
console.debug("error - default");
|
|
| 194 |
|
|
| 195 | 180 |
} |
| 196 | 181 |
); |
| 182 |
}else{
|
|
| 183 |
this.layout = new CustomizationOptions(CustomizationOptions.getIdentity(communityId).mainColor, CustomizationOptions.getIdentity(communityId).secondaryColor); |
|
| 197 | 184 |
} |
| 198 | 185 |
} |
| 199 | 186 |
public buildMenu(communityId: string) {
|
| modules/uoa-connect-portal/trunk/src/app/affiliations/affiliations.component.html | ||
|---|---|---|
| 2 | 2 |
|
| 3 | 3 |
<ng-template #card let-organization="organization" let-fullView="fullView"> |
| 4 | 4 |
<div class="affiliation-logo uk-flex uk-flex-middle uk-flex-center uk-padding-remove-horizontal" |
| 5 |
[ngClass]="(!fullView)?'uk-card-body':'uk-card-media-top uk-padding-small'">
|
|
| 6 |
<div class="uk-align-center"> |
|
| 5 |
[ngClass]="(!fullView)?'':'uk-card-media-top uk-padding-small'"> |
|
| 6 |
<div class="uk-align-center uk-margin-remove-bottom">
|
|
| 7 | 7 |
<img *ngIf="organization.logo_url != null && organization.logo_url != '' " |
| 8 | 8 |
[src]="organization.logo_url | urlPrefix" |
| 9 | 9 |
alt="{{(organization.name)?organization.name:''}} logo">
|
| ... | ... | |
| 52 | 52 |
<!-- ({{affiliations.length}})-->
|
| 53 | 53 |
</h3> |
| 54 | 54 |
|
| 55 |
<div *ngIf="!longView" [class]="'uk-position-relative uk-visible-toggle'" tabindex="-1"
|
|
| 55 |
<div *ngIf="!longView" |
|
| 56 | 56 |
[attr.uk-slider]="sliderOptions"> |
| 57 |
<div |
|
| 58 |
[class]="'uk-align-center uk-width-'+(affiliations.length >= affiliationsInSlider ? affiliationsInSlider : affiliations.length)+'-'+affiliationsInSlider"> |
|
| 59 |
<ul class="uk-slider-items uk-grid-small" uk-height-match="target: > li > .affiliation" uk-grid> |
|
| 60 |
<li *ngFor="let affiliation of affiliations" |
|
| 61 |
[class]="'affiliation-element uk-width-1-'+(affiliations.length >= affiliationsInSlider ? affiliationsInSlider : affiliations.length)"> |
|
| 62 |
<div class="affiliation uk-flex uk-flex-middle uk-flex-center uk-padding-small" |
|
| 63 |
[attr.uk-tooltip]="(affiliation.name) ? affiliation.name : 'cls: uk-invisible'"> |
|
| 64 |
<a *ngIf="affiliation.website_url" target="_blank" [href]="affiliation.website_url | urlPrefix" |
|
| 65 |
class="affiliation-content"> |
|
| 66 |
<ng-container |
|
| 67 |
*ngTemplateOutlet="card; context: { organization: affiliation, fullView: false}"></ng-container>
|
|
| 68 |
</a> |
|
| 69 |
<span *ngIf="!affiliation.website_url" class="affiliation-content"> |
|
| 70 |
<ng-container *ngTemplateOutlet="card; context: { organization: affiliation}"></ng-container>
|
|
| 71 |
</span> |
|
| 72 |
</div> |
|
| 73 |
</li> |
|
| 74 |
</ul> |
|
| 57 |
<div [class]="'uk-position-relative uk-visible-toggle'" tabindex="-1"> |
|
| 58 |
<div class="uk-slider-container uk-padding-small uk-margin-remove-bottom uk-align-center uk-width-1-1 "> |
|
| 59 |
<ul class="uk-slider-items uk-grid-small uk-flex uk-flex-center" uk-height-match="target: > li > .affiliation" uk-grid> |
|
| 60 |
<li *ngFor="let affiliation of affiliations" |
|
| 61 |
[class]="'affiliation-element ' + |
|
| 62 |
(affiliationsInSlider == 2?'uk-width-1-2':'uk-width-small')"> |
|
| 63 |
<div |
|
| 64 |
class="uk-card portalSearchCard affiliation uk-flex uk-flex-middle uk-flex-center uk-padding-small" |
|
| 65 |
[attr.uk-tooltip]="(affiliation.name) ? affiliation.name : 'cls: uk-invisible'"> |
|
| 66 |
<a *ngIf="affiliation.website_url" target="_blank" [href]="affiliation.website_url | urlPrefix" |
|
| 67 |
class="affiliation-content"> |
|
| 68 |
<ng-container |
|
| 69 |
*ngTemplateOutlet="card; context: { organization: affiliation, fullView: false}"></ng-container>
|
|
| 70 |
</a> |
|
| 71 |
<span *ngIf="!affiliation.website_url" class="affiliation-content"> |
|
| 72 |
<ng-container *ngTemplateOutlet="card; context: { organization: affiliation}"></ng-container>
|
|
| 73 |
</span> |
|
| 74 |
</div> |
|
| 75 |
</li> |
|
| 76 |
</ul> |
|
| 77 |
</div> |
|
| 78 |
<a *ngIf="arrows" |
|
| 79 |
class="uk-position-center-left-out " [class.coloredBackground]="communityFirstPage" |
|
| 80 |
href="#" uk-slidenav-previous uk-slider-item="previous"></a> |
|
| 81 |
<a *ngIf=" arrows" |
|
| 82 |
class="uk-position-center-right-out " |
|
| 83 |
[class.coloredBackground]="communityFirstPage" |
|
| 84 |
href="#" uk-slidenav-next uk-slider-item="next"></a> |
|
| 75 | 85 |
</div> |
| 76 |
<!-- [class]="'uk-hidden-hover uk-position-center-left uk-padding uk-height-1-1 uk-flex uk-width-1-'+(affiliations.length >= affiliationsInSlider ? affiliationsInSlider : affiliations.length)"--> |
|
| 77 |
<!-- class="uk-position-center-right uk-padding uk-height-1-1 uk-flex"--> |
|
| 78 |
<a *ngIf="(affiliations.length > affiliationsInSlider) && arrows" |
|
| 79 |
class="uk-position-center-left uk-padding uk-height-1-1 uk-flex" [class.coloredBackground]="communityFirstPage" |
|
| 80 |
href="#" uk-slidenav-previous uk-slider-item="previous"></a> |
|
| 81 |
<a *ngIf="(affiliations.length > affiliationsInSlider) && arrows" |
|
| 82 |
class="uk-position-center-right uk-padding uk-height-1-1 uk-flex" [class.coloredBackground]="communityFirstPage" |
|
| 83 |
href="#" uk-slidenav-next uk-slider-item="next"></a> |
|
| 84 | 86 |
</div> |
| 85 | 87 |
<div *ngIf="communityFirstPage"> |
| 86 |
<a routerLink="/organizations" class="uk-align-right portal-link uk-flex uk-flex-middle"> |
|
| 88 |
<a routerLink="/organizations" class="uk-align-right portal-link uk-flex uk-flex-middle uk-margin-top">
|
|
| 87 | 89 |
<span>See Details</span> |
| 88 | 90 |
<span uk-icon="chevron-right"></span> |
| 89 | 91 |
</a> |
| modules/uoa-connect-portal/trunk/src/assets/connect-custom.css | ||
|---|---|---|
| 162 | 162 |
} |
| 163 | 163 |
|
| 164 | 164 |
.coloredBackground, .coloredBackground:focus, .coloredBackground:hover {
|
| 165 |
background-color: var(--background-light-color);
|
|
| 165 |
background-color: transparent;
|
|
| 166 | 166 |
} |
| 167 | 167 |
|
| 168 |
.coloredBackground:hover {
|
|
| 169 |
opacity: 0.9; |
|
| 170 |
} |
|
| 171 |
|
|
| 172 | 168 |
.generalSearchForm .subtitle{
|
| 173 | 169 |
color: #000000 !important; |
| 174 | 170 |
opacity: 0.6; |
| modules/uoa-connect-portal/trunk/src/assets/customization.css | ||
|---|---|---|
| 85 | 85 |
.uk-navbar-dropdown-nav>li.uk-active>a, |
| 86 | 86 |
.uk-tab>.uk-active>a, |
| 87 | 87 |
.uk-navbar-nav>li.uk-active>a, |
| 88 |
.uk-navbar-container:not(.uk-navbar-transparent) .uk-navbar-nav>li.uk-active>a |
|
| 88 |
.uk-navbar-container:not(.uk-navbar-transparent) .uk-navbar-nav>li.uk-active>a, |
|
| 89 |
.uk-button-text |
|
| 89 | 90 |
{
|
| 90 | 91 |
color: var(--portal-main-color) !important; |
| 91 | 92 |
} |
| ... | ... | |
| 120 | 121 |
color: var(--portal-dark-color) !important; |
| 121 | 122 |
} |
| 122 | 123 |
|
| 123 |
.uk-slidenav {
|
|
| 124 |
background: none; |
|
| 125 |
} |
|
| 126 |
|
|
| 127 | 124 |
#stickyNavbar{
|
| 128 | 125 |
box-shadow: 0 1px 1px #0000004D; |
| 129 | 126 |
} |
| modules/uoa-connect-portal/trunk/server.ts | ||
|---|---|---|
| 66 | 66 |
app.set('views', join(DIST_FOLDER, 'browser'));
|
| 67 | 67 |
// Allow frames from specific domains |
| 68 | 68 |
app.use(function (req, res, next) {
|
| 69 |
var XFRAME_WHITELIST = [ 'http://scoobydoo.di.uoa.gr:5000/customize-layout', 'https://beta.admin.connect.openaire.eu/customize-layout','https://admin.connect.openaire.eu/customize-layout' ];
|
|
| 69 |
var XFRAME_WHITELIST = [ 'http://spitoo.di.uoa.gr:5000/','http://scoobydoo.di.uoa.gr:5000/', 'https://beta.admin.connect.openaire.eu/','https://admin.connect.openaire.eu/' ];
|
|
| 70 | 70 |
let referer: string; |
| 71 | 71 |
if(req.headers.referer){
|
| 72 | 72 |
referer = isArray(req.headers.referer)?req.headers.referer[0]:(<string>req.headers.referer); |
| 73 | 73 |
referer = referer.split("?")[0];
|
| 74 | 74 |
} |
| 75 |
if ( referer && (XFRAME_WHITELIST.indexOf(referer) != -1 || referer.indexOf(".d4science.org") != -1)) {
|
|
| 75 |
if ( referer && (XFRAME_WHITELIST.indexOf(referer) != -1 || referer.indexOf("/customize-layout") !=-1 || referer.indexOf(".d4science.org") != -1)) {
|
|
| 76 | 76 |
// res.header('X-FRAME-OPTIONS', 'allow from ' +req.headers.referer);
|
| 77 | 77 |
}else {
|
| 78 | 78 |
res.header('X-FRAME-OPTIONS', 'SAMEORIGIN');
|
Also available in: Unified diff
[Connect | Trunk]
- Update affiliations layout
- Use customization class to create the css
- Create preview/ demo component
- Clean up piwik helper file
- updates on customization css