Change private overlay image and content. Hide categories in manage indicators on server

2022-12-23 17:37:42 +02:00 · 2022-12-23 17:37:42 +02:00 · b308e07e1a
parent 2f70686638
commit b308e07e1a
12 changed files with 59 additions and 27 deletions
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@ -2,11 +2,11 @@
  <loading [full]="true"></loading>
 </div>
 <div *ngIf="!loading" [class.monitor]="isFrontPage">
-  <div id="container" class="sidebar_main_swipe uk-background-default" [class.sidebar_main_active]="open && (hasSidebar || hasAdminMenu || hasInternalSidebar)"
+  <div *ngIf="!isHidden" class="sidebar_main_swipe uk-background-default" [class.sidebar_main_active]="open && (hasSidebar || hasAdminMenu || hasInternalSidebar)"
       [class.sidebar_mini]="!open &&  (hasSidebar || hasAdminMenu || hasInternalSidebar)">
    <div id="modal-container"></div>
    <navbar *ngIf="hasHeader" portal="monitor_dashboard" [header]="menuHeader" [userMenuItems]=userMenuItems [menuItems]="menuItems" [user]="user"></navbar>
-    <div *ngIf="!isHidden">
+    <div>
      <dashboard-sidebar *ngIf="stakeholder && isFrontPage && hasSidebar && !hasInternalSidebar" queryParamsHandling="merge" [items]="sideBarItems"
                         [activeItem]="activeTopic?activeTopic.alias:null" [activeSubItem]="activeCategory?activeCategory.alias:null"></dashboard-sidebar>
      <dashboard-sidebar *ngIf="hasAdminMenu && !hasInternalSidebar" [items]="adminMenuItems" [specialMenuItem]="specialSideBarMenuItem"></dashboard-sidebar>
@ -18,13 +18,32 @@
      <notification-sidebar *ngIf="user && notificationGroupsInitialized" [entities]="entities"
                            [user]="user" [availableGroups]="notificationGroups" service="monitor"></notification-sidebar>
    </div>
-    <div *ngIf="isHidden" class="private-data uk-light">
-      <h3 class="uk-position-center">
-        You are not authorized to see the content of this dashboard.
-      </h3>
-    </div>
    <div *ngIf="view" class="preview uk-text-small uk-flex uk-flex-middle">
      <span>You are currently in a <span class="uk-text-bold">"Preview"</span> mode. <span class="uk-visible@m"><a (click)="removeView()">The current view</a> of this dashboard may differ.</span></span>
    </div>
  </div>
+  <div *ngIf="isHidden" class="private-data uk-light dark">
+    <div class="uk-section uk-container uk-container-small uk-text-center">
+      <img src="assets/common-assets/logo-services/monitor/inverted.svg" style="height: 80px;">
+      <h1 class="uk-h4 uk-margin-large-top">Private Content</h1>
+      <div class="uk-text-large">
+        The contents of this dashboard are only visible to invited members.
+      </div>
+      <div class="uk-margin-large-top uk-margin-large-bottom">
+        <icon name="incognito" ratio="9"></icon>
+      </div>
+      <div class="uk-margin-medium-bottom">
+        <div *ngIf="!user">
+          If you have been already a member of this dashboard - Sign in in order to enter the dashboard
+        </div>
+        <div>
+          If you want to be a member of this dashboard - Contact us.
+        </div>
+      </div>
+      <div class="uk-flex uk-flex-center uk-flex-middle">
+        <a *ngIf="!user" class="uk-button uk-button-primary uk-margin-right" (click)="login()">Sign in</a>
+        <a class="uk-button uk-button-secondary" [href]="monitorLink + '/contact-us'">Contact us</a>
+      </div>
+    </div>
+  </div>
 </div>
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@ -253,6 +253,10 @@ export class AppComponent implements OnInit, OnDestroy {
    this.router.navigate([], {relativeTo: this.route});
  }
  
+  public login() {
+    this.userManagementService.login();
+  }
+  
  public get open() {
    return this.layoutService.open;
  }
@ -261,6 +265,10 @@ export class AppComponent implements OnInit, OnDestroy {
    return this.stakeholder && !this.hasPermission(this.view?this.view:this.stakeholder.visibility);
  }
  
+  get monitorLink() {
+    return "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu';
+  }
+  
  private setSideBar() {
    let items: MenuItem[] = [];
    if (this.hasPermission(this.view?this.view:this.stakeholder.visibility)) {
@ -366,7 +374,7 @@ export class AppComponent implements OnInit, OnDestroy {
        };
      }
    } else {
-      this.userMenuItems.push(new MenuItem("", "User information", "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu/user-info', '', false, [], [], {}, null, null, null, null, "_self"));
+      this.userMenuItems.push(new MenuItem("", "User information", this.monitorLink + '/user-info', '', false, [], [], {}, null, null, null, null, "_self"));
      this.menuHeader = {
        route: null,
        url: "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu',
@ -379,13 +387,13 @@ export class AppComponent implements OnInit, OnDestroy {
      };
      this.menuItems.push(
        new MenuItem("stakeholders", "Browse " + this.stakeholderEntities.STAKEHOLDERS,
-          "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu/browse', "", false, [], null, {}, null, null, null, null, "_self")
+          this.monitorLink + '/browse', "", false, [], null, {}, null, null, null, null, "_self")
      );
-      this.resourcesService.setResources(this.menuItems, '', "https://" + (this.properties.environment === 'beta' ? 'beta.' : '') + 'monitor.openaire.eu');
+      this.resourcesService.setResources(this.menuItems, '', this.monitorLink);
      let about = new MenuItem("about", "About", "", "", false, [], null, {});
      about.items = [
-        new MenuItem("how-it-works", "How it works", "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu/about/how-it-works', "", false, [], null, {}, null, null, null, null, "_self"),
-        new MenuItem("faqs", "FAQs", "https://" + (this.properties.environment == 'beta' ? 'beta.' : '') + 'monitor.openaire.eu/about/faqs',"", false, [], null, {}, null, null, null, null, "_self")
+        new MenuItem("how-it-works", "How it works", this.monitorLink + '/about/how-it-works', "", false, [], null, {}, null, null, null, null, "_self"),
+        new MenuItem("faqs", "FAQs", this.monitorLink + '/about/faqs',"", false, [], null, {}, null, null, null, null, "_self")
      ]
      this.menuItems.push(about);
      if (this.hasAdminMenu) {
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@ -25,6 +25,8 @@ import {AdminDashboardGuard} from "./utils/adminDashboard.guard";
 import {NotificationsSidebarModule} from "./openaireLibrary/notifications/notifications-sidebar/notifications-sidebar.module";
 import {LoginGuard} from "./openaireLibrary/login/loginGuard.guard";
 import {IconsModule} from "./openaireLibrary/utils/icons/icons.module";
+import {IconsService} from "./openaireLibrary/utils/icons/icons.service";
+import {incognito} from "./openaireLibrary/utils/icons/icons";

@NgModule({
  
@ -64,4 +66,7 @@ import {IconsModule} from "./openaireLibrary/utils/icons/icons.module";
 })
 //
 export class AppModule {
+  constructor(private iconsService: IconsService) {
+    this.iconsService.registerIcons([incognito])
+  }
 }
--- a/src/app/monitor/monitor.component.html
+++ b/src/app/monitor/monitor.component.html
@ -102,7 +102,7 @@
                       [class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
                    <div *ngIf="!showDescriptionOverlay[j]">
                      <div class="uk-text-small uk-text-truncate uk-margin-xsmall-bottom uk-margin-right">{{indicator.name}}</div>
-                      <div class="number uk-text-small uk-text-bold">
+                      <div class="number uk-text-small uk-text-bold uk-text-lowercase">
                        <span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | numberRound}}</span>
                        <span *ngIf="!numberResults.get(i + '-' + j)">--</span>
                      </div>
--- a/src/app/openaireLibrary
+++ b/src/app/openaireLibrary
@ -1 +1 @@
-Subproject commit 328198b6a56c3f3ecb38c7928073914a9609ddc0
+Subproject commit 789a0225faced2d0f37c33c9e35b5827580d9beb
--- a/src/app/topic/indicators.component.html
+++ b/src/app/topic/indicators.component.html
@ -67,7 +67,7 @@
                    </div>
                  </div>
                  <div class="uk-text-small uk-text-truncate uk-margin-xsmall-bottom uk-margin-right">{{indicator.name}}</div>
-                  <div class="number uk-text-small uk-text-bold">
+                  <div class="number uk-text-small uk-text-bold uk-text-lowercase">
                    <span *ngIf="numberResults.get(i + '-' + j)">{{numberResults.get(i + '-' + j) | numberRound}}</span>
                    <span *ngIf="!numberResults.get(i + '-' + j)">--</span>
                  </div>
--- a/src/app/topic/topic.component.html
+++ b/src/app/topic/topic.component.html
@ -93,7 +93,7 @@
              </span>
            </span>
          </a>
-          <ul class="uk-nav-sub" [id]="'categories-' + i.toString()" transition-group>
+          <ul *ngIf="isBrowser || topicIndex === i" class="uk-nav-sub" [id]="'categories-' + i.toString()" transition-group>
            <li *ngFor="let category of topic.categories; let j=index"  transition-group-item  class="uk-visible-toggle" [class.uk-active]="categoryIndex == j">
              <a (click)="chooseCategory(j)" [title]="category.name">
                <div class="uk-flex uk-flex-middle uk-flex-center uk-width-1-1">
--- a/src/app/topic/topic.component.ts
+++ b/src/app/topic/topic.component.ts
@ -1,9 +1,9 @@
 import {
  AfterViewInit,
  ChangeDetectorRef,
-  Component,
+  Component, Inject,
  OnDestroy,
-  OnInit,
+  OnInit, PLATFORM_ID,
  QueryList,
  ViewChild,
  ViewChildren
@ -90,7 +90,8 @@ export class TopicComponent implements OnInit, OnDestroy, AfterViewInit, IDeacti
    private stakeholderService: StakeholderService,
    private userManagementService: UserManagementService,
    private layoutService: LayoutService,
-    private cdr: ChangeDetectorRef) {
+    private cdr: ChangeDetectorRef,
+    @Inject(PLATFORM_ID) private platformId) {
  }
  
  public ngOnInit() {
@ -153,6 +154,10 @@ export class TopicComponent implements OnInit, OnDestroy, AfterViewInit, IDeacti
    }
  }
  
+  get isBrowser() {
+    return this.platformId === 'browser';
+  }
+  
  public ngOnDestroy() {
    this.topicSubscriptions.forEach(value => {
      if (value instanceof Subscriber) {
--- a/src/assets/common-assets
+++ b/src/assets/common-assets
@ -1 +1 @@
-Subproject commit b0e59ae244c03ccf06d1512efdef3a77d6cd195c
+Subproject commit 0c6b2ac12b4796e41bf4cc8de93c157efa866543
--- a/src/assets/monitor-dashboard-custom.less
+++ b/src/assets/monitor-dashboard-custom.less
@ -66,15 +66,10 @@
  }

  .private-data {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
    background-image: url("private-overlay.png");
    background-repeat: no-repeat;
    background-size: cover;
-    z-index: 0;
+    min-height: 100vh;
  }

  .preview {
--- a/src/assets/openaire-theme
+++ b/src/assets/openaire-theme
@ -1 +1 @@
-Subproject commit 5c7af220c1de2c87d393e2636cdf18805a97e6a1
+Subproject commit 996b48573c7cc42a8c50ac447f1fd84c7f0836c4
--- a/src/assets/private-overlay.png
+++ b/src/assets/private-overlay.png