[Trunk | Monitor Dashboard]:

1. app.module.ts: Import UserMiniModule.
2. app.component.html: Pass parameter [colors]="'light'" to <user-mini> component.
3. monitor.module.ts: Import UserMiniModule.
4. monitor.component: Add view and functionality for login/logout in non-administrator pages.
5. monitor-custom.css: Classes used by <user-mini> component added ('dark' on light background - 'light' on dark background).
	'loginLink.light', 'circle.userBox.light', 'text.userBox.light', 'svg .icon.userBox.light', 'svg .loginLink.userBox.light', 
	'.loginLink.dark', 'circle.userBox.dark', 'svg .icon.userBox.dark', 'svg .loginLink.userBox.dark', 'text.userBox.dark'


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

src/app/app.component.html

@@ -14,7 +14,7 @@
           <ul class="uk-navbar-nav user_actions uk-padding uk-padding-remove-vertical">
             <li>
               <user-mini *ngIf="properties"
-                         [user]="user" [dashboard]="true"
+                         [user]="user" [dashboard]="true" [colors]="'light'"
                          [redirectUrl]="properties.afterLoginRedirectLink"
                          [logInUrl]=properties.loginUrl [logOutUrl]=properties.logoutUrl [cookieDomain]=properties.cookieDomain
                          [userMenuItems]=userMenuItems>

src/app/app.module.ts

@@ -20,6 +20,7 @@ import {CommunitiesService} from './openaireLibrary/connect/communities/communit
 import {LayoutService} from "./openaireLibrary/services/layout.service";
 import {SubscribeModule} from './utils/subscribe/subscribe.module';
 import {StakeholderService} from "./services/stakeholder.service";
+import {UserMiniModule} from "./openaireLibrary/login/userMiniModule.module";
 
 @NgModule({
 
@@ -35,7 +36,8 @@ import {StakeholderService} from "./services/stakeholder.service";
     CookieLawModule,
     SubscribeModule.forRoot(),
     BrowserModule.withServerTransition({appId: 'my-app'}),
-    AppRoutingModule
+    AppRoutingModule,
+    UserMiniModule
   ],
   declarations: [ AppComponent, OpenaireErrorPageComponent],
   exports: [ AppComponent ],

src/app/monitor/monitor.component.html

@@ -25,8 +25,8 @@
         </div>
 
         <div *ngIf="stakeholder && status === errorCodes.DONE && activeTopic" class="uk-navbar-right uk-margin-right">
-          <!--<ul class="uk-navbar-nav">
+          <ul class="uk-navbar-nav user_actions uk-padding uk-padding-remove-vertical">
-            <li class="uk-active">
+            <!--li class="uk-active">
               <a class="uk-margin-remove-bottom "><span>Monitor</span></a>
             </li>
             <li>
@@ -34,9 +34,16 @@
             </li>
             <li>
               <a class="uk-margin-remove-bottom ">Help</a>
+            </li-->
+            <li>
+              <user-mini *ngIf="properties"
+                         [user]="user" [dashboard]="true" [colors]="'dark'"
+                         [redirectUrl]="properties.afterLoginRedirectLink"
+                         [logInUrl]=properties.loginUrl [logOutUrl]=properties.logoutUrl [cookieDomain]=properties.cookieDomain
+                         [userMenuItems]=userMenuItems>
+              </user-mini>
             </li>
-
+          </ul>
-          </ul>-->
         </div>
       </nav>
     </div>

src/app/monitor/monitor.component.ts

@@ -20,6 +20,9 @@ import {LayoutService} from "../library/sharedComponents/sidebar/layout.service"
 import {FormBuilder, FormControl} from "@angular/forms";
 import {IDeactivateComponent} from "../openaireLibrary/utils/can-exit.guard";
 import {Subscription} from "rxjs";
+import {Session, User} from "../openaireLibrary/login/utils/helper.class";
+import {MenuItem} from "../openaireLibrary/sharedComponents/menu";
+import {UserManagementService} from "../openaireLibrary/services/user-management.service";
 
 @Component({
     selector: 'monitor',
@@ -30,6 +33,8 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
         id;
         status;
     };
+    public user: User;
+    public userMenuItems: MenuItem[] = [new MenuItem("", "My profile", "", "", false, [], [], {})];
     public subscriptions: any[] = [];
     public piwiksub: any;
     public pageContents = null;
@@ -62,6 +67,7 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
       private _piwikService: PiwikService,
       private helper: HelperService,
       private stakeholderService: StakeholderService,
+      private userManagementService: UserManagementService,
       private statisticsService: StatisticsService,
       private layoutService: LayoutService,
       private seoService: SEOService,
@@ -136,6 +142,13 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
                     } else {
                         this.setView(params);
                     }
+                  this.subscriptions.push(this.userManagementService.getUserInfo(this.properties.userInfoUrl).subscribe(user => {
+                    this.user = user;
+                    this.buildMenu();
+                  }, error => {
+                    console.log("App couldn't fetch properties");
+                    console.log(error);
+                  }));
                 });
             });
     }
@@ -345,4 +358,15 @@ export class MonitorComponent implements OnInit, OnDestroy, IDeactivateComponent
             this.piwiksub.unsubscribe();
         }
     }
+
+  buildMenu() {
+    if (Session.isPortalAdministrator(this.user)) {
+      this.userMenuItems.push(new MenuItem("", "Manage helptexts",
+        ((this.properties.environment == "beta") ? "https://beta.admin.connect.openaire.eu" : "https://admin.explore.openaire.eu") + "/dashboard?communityId=openaire", "", true, [], [], {}))
+
+    }
+    if(this.user) {
+      this.userMenuItems.push(new MenuItem("", "User information", "", "/user-info", false, [], [], {}));
+    }
+  }
 }

src/app/monitor/monitor.module.ts

@@ -17,11 +17,13 @@ import {StatisticsService} from "../utils/services/statistics.service";
 import {SideBarModule} from "../library/sharedComponents/sidebar/sideBar.module";
 import {ModalModule} from "../openaireLibrary/utils/modal/modal.module";
 import {InputModule} from "../library/sharedComponents/input/input.module";
+import {UserMiniModule} from "../openaireLibrary/login/userMiniModule.module";
 
 @NgModule({
   imports: [
     CommonModule, FormsModule, RouterModule, ErrorMessagesModule,
-    HelperModule, Schema2jsonldModule, SEOServiceModule, MonitorRoutingModule, SideBarModule, ModalModule, InputModule
+    HelperModule, Schema2jsonldModule, SEOServiceModule, MonitorRoutingModule, SideBarModule, ModalModule, InputModule,
+    UserMiniModule
   ],
   declarations: [
     MonitorComponent

src/assets/env-properties.json

@@ -39,7 +39,7 @@
   "piwikSiteId" : "80",
   "loginUrl" :"http://dl170.madgik.di.uoa.gr:8180/dnet-login/openid_connect_login",
 
-  "userInfoUrl" : "http://scoobydoo.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/api/users/getUserInfo?accessToken=",
+  "userInfoUrl" : "http://dl170.madgik.di.uoa.gr:8180/dnet-openaire-users-1.0.0-SNAPSHOT/api/users/getUserInfo?accessToken=",
 
   "logoutUrl" :"https://aai.openaire.eu/proxy/saml2/idp/SingleLogoutService.php?ReturnTo=",
 

src/assets/monitor-custom.css

@@ -101,7 +101,42 @@
     top:200px;
 }
 
-.loginLink, .loginLink:hover{
+.loginLink.light{
-    color: white;
+    color: white !important;
     font-weight: bold;
 }
+
+circle.userBox.light{
+    stroke: white;
+    fill: white;
+}
+
+text.userBox.light {
+    stroke: #0d47a1;
+    fill: #0d47a1;
+}
+
+svg .icon.userBox.light{
+    stroke: #0d47a1;
+    fill: none;
+}
+
+svg .loginLink.userBox.light{
+    stroke: white;
+    fill: none;
+}
+
+.loginLink.dark{
+    color: rgba(0,0,0,.54) !important;
+    font-weight: bold;
+}
+
+circle.userBox.dark, svg .icon.userBox.dark, svg .loginLink.userBox.dark{
+    stroke: rgba(0,0,0,.54);
+    fill: none;
+}
+
+text.userBox.dark {
+    stroke: rgba(0,0,0,.54);
+    fill: rgba(0,0,0,.54);
+}