[Connect Trunk]

Search Projects/Dataproviders: fix server side error (pass searchUtils in transform() method)

Customization: make it work in server side! 
	 avoid color flickering	

	


git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@58667 d315682c-612b-4755-9ff5-7f18f6832af3

src/app/searchPages/simple/searchDataproviders.component.ts

@@ -121,7 +121,7 @@ export class OpenaireSearchDataprovidersComponent {
               this.searchUtils.status = this.errorCodes.NONE;
             } else {
               this.searchPage.triggerInitialLoad();
-              this.searchPage.transform(this.results);
+              this.searchPage.transform(this.results, this.searchUtils);
               this.disableForms = false;
             }
             this.enableSearchView = true;

src/app/searchPages/simple/searchProjects.component.ts

@@ -123,7 +123,7 @@ export class OpenaireSearchProjectsComponent {
               this.searchUtils.status = this.errorCodes.NONE;
             } else {
               this.searchPage.triggerInitialLoad();
-              this.searchPage.transform(this.results);
+              this.searchPage.transform(this.results, this.searchUtils);
               this.disableForms = false;
             }
             this.enableSearchView = true;

src/app/utils/customization/customization.component.ts

@@ -1,9 +1,9 @@
-import {Component, Input} from '@angular/core';
+import {Component, Inject, Input, RendererFactory2, ViewEncapsulation} from '@angular/core';
 import {ActivatedRoute, Router} from '@angular/router';
 import {EnvProperties} from '../../openaireLibrary/utils/properties/env-properties';
 import {LayoutService} from "../../openaireLibrary/services/layout.service";
 import {CustomizationOptions} from "../../openaireLibrary/connect/community/CustomizationOptions";
-import {StringUtils} from "../../openaireLibrary/utils/string-utils.class";
+import {DOCUMENT} from "@angular/common";
 
 declare var appendCss: any;
 
@@ -21,7 +21,7 @@ export class CustomizationComponent {
   @Input() properties:EnvProperties;
 
   constructor(private route: ActivatedRoute,
-              private router: Router, private _layoutService: LayoutService
+              private router: Router, private _layoutService: LayoutService, @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2
   ) {
   }
 
@@ -53,21 +53,55 @@ export class CustomizationComponent {
 
 
       });*/
+//connect default colors
+    let mainColor = "#FECA1D";
+    let secondaryColor = "#FFC400";
+
+     // TODO When customization is updated remove the following and build the css
+    this.document.getElementById('customCss').setAttribute('href', "/assets/customization.css?v=0");
 
-     // TODO When customization is updated remove the following and update appendCss in index.html
-    appendCss("");
-    if(typeof document === 'undefined') {
-      return;
-    }
     if(this.communityId === 'covid-19') {
-      document.documentElement.style.setProperty('--portal-main-color',  '#03ADEE');
-      document.documentElement.style.setProperty('--portal-dark-color', '#F15157');
+      mainColor = "#03ADEE";
+      secondaryColor = "#F15157";
     } else {
-      document.documentElement.style.setProperty('--portal-main-color',  '#4687E6');
-      document.documentElement.style.setProperty('--portal-dark-color', '#2D72D6');
+      mainColor = "#4687E6";
+      secondaryColor = "#2D72D6";
     }
+    let css = `
+    :root {
+      --portal-main-color: `+mainColor+`;
+      --portal-dark-color: `+secondaryColor+`;
+    }
+    `;
 
+    try {
+      if( this.document.getElementById('customStyle')){
+        try {
+          this.document.getElementById('customStyle').append(css);
+        }catch(e){
+          console.log("error with append style")
+        }
+      }else {
+        const renderer = this.rendererFactory.createRenderer(this.document, {
+          id: '-1',
+          encapsulation: ViewEncapsulation.None,
+          styles: [],
+          data: {}
+        });
 
+        const head = this.document.head;
+        if (head === null) {
+          throw new Error('<head> not found within DOCUMENT.');
+        }
+        const style = renderer.createElement('style');
+        renderer.setAttribute(style, "id", "customStyle");
+        let CSSElement = renderer.createText(css);
+        renderer.appendChild(head, style);
+        renderer.appendChild(style, CSSElement);
+      }
+    } catch (e) {
+      console.error('Renderrer Error to append style ', e);
+    }
   }
 
   private buildCss() {

src/assets/env-properties.json

@@ -118,7 +118,7 @@
 
   "admins" : ["kostis30fylloy@gmail.com"],
   "lastIndexUpdate": "2019-11-01",
-  "indexInfoAPI": "http://beta.services.openaire.eu/openaire/info/",
+  "indexInfoAPI": "https://dev-openaire.d4science.org/openaire/info/",
   "altMetricsAPIURL": "https://api.altmetric.com/v1/doi/",
   "b2noteAPIURL": "http://b2note-dev.bsc.es/api/",
   "adminPortalURL": "https://beta.admin.connect.openaire.eu"

src/index.html

@@ -73,8 +73,7 @@ $(document).ready(function(){
       <link rel="stylesheet" href="assets/common-assets/common/custom.css?v=1">
       <link rel="stylesheet" href="assets/common-assets/library.css?v=4">
       <link rel="stylesheet" href="assets/connect-custom.css?v=7">
-
-
+     <link id="customCss" rel="stylesheet" href="">
       <script src="assets/common-assets/clipboard.min.js"></script>