[develop | DONE | CHANGED]: showSubjects.components.ts: Removed subjects by Vocabulary for BETA & DEV environments & Updated how EOSC subjects are displayed | resultLanding.component: Added get method "hasSubjects" and updated checks to show subjects depending on environment.

landingPages/landing-utils/showSubjects.component.ts

@@ -13,7 +13,7 @@ import {properties} from "../../../../environments/environment";
 @Component({
   selector: 'showSubjects',
   template: `     
-    <ng-container *ngIf="!viewAllSubjects && ((classifiedSubjects && classifiedSubjects.size > 0) || (eoscSubjects && eoscSubjects.length > 0))">
+    <ng-container *ngIf="properties.environment == 'production' && !viewAllSubjects && ((classifiedSubjects && classifiedSubjects.size > 0) || (eoscSubjects && eoscSubjects.length > 0))">
       <div *ngIf="!viewAllClassifiedSubjects" class="uk-text-meta">
         Subjects by Vocabulary
       </div>
@@ -22,10 +22,11 @@ import {properties} from "../../../../environments/environment";
       <div *ngIf="isClassifiedLarge && !viewAllClassifiedSubjects" class="uk-text-right">
         <a (click)="viewAllSubjectsByVocabularyClicked()" class="view-more-less-link">View all</a>
       </div>
-        
     </ng-container>
+    
     <ng-container  *ngIf="!viewAllClassifiedSubjects && ((subjects && subjects.length > 0) || (otherSubjects && otherSubjects.size > 0))">
-      <div *ngIf="!viewAllSubjects" class="uk-text-meta uk-margin-small-bottom" [class.uk-margin-medium-top]="classifiedSubjects && classifiedSubjects.size > 0">
+      <div *ngIf="!viewAllSubjects" class="uk-text-meta uk-margin-small-bottom" 
+           [class.uk-margin-medium-top]="properties.environment == 'production' && ((classifiedSubjects && classifiedSubjects.size > 0) || (eoscSubjects && eoscSubjects.length > 0))">
         Keywords
       </div>
       <ng-container *ngTemplateOutlet="subjects_template; context: {customClasses: (isMobile && viewAllSubjects) ? '' : 'multi-line-ellipsis lines-2', id: 'content'}"></ng-container>
@@ -34,6 +35,16 @@ import {properties} from "../../../../environments/environment";
       </div>
     </ng-container>
     
+    <ng-container *ngIf="properties.environment != 'production' && !viewAllSubjects && ((eoscSubjects && eoscSubjects.length > 0))">
+      <div class="uk-text-meta uk-margin-small-bottom"
+           [class.uk-margin-medium-top]="(subjects && subjects.length > 0) || (otherSubjects && otherSubjects.size > 0)">
+        EOSC Subjects
+      </div>
+      <div *ngIf="eoscSubjects && eoscSubjects.length > 0">
+        <ng-container *ngTemplateOutlet="eosc_subjects_template; context: {id: 'content'}"></ng-container>
+      </div>
+    </ng-container>
+
     <ng-template #subjects_template let-customClasses="customClasses" let-id="id">
       <div class="uk-text-break" [ngClass]="customClasses">
         <p *ngIf="subjects && subjects.length > 0"><span #content [id]="id">{{subjects.join(', ')}}</span></p>
@@ -78,7 +89,7 @@ import {properties} from "../../../../environments/environment";
     <ng-template #eosc_subjects_template let-customClasses="customClasses" let-id="id">
       <div class="uk-flex-wrap uk-margin-medium-right"
            [ngClass]="customClasses">
-        <p class="uk-flex uk-flex-middle uk-margin-bottom">
+        <p *ngIf="properties.environment == 'production'" class="uk-flex uk-flex-middle uk-margin-bottom">
           <span  #classifiedContent [id]="id+'_eosc'">
             <span class="uk-margin-small-top uk-display-inline-block">
               <span uk-icon="tag"></span>
@@ -91,13 +102,17 @@ import {properties} from "../../../../environments/environment";
             </span>
           </span>
         </p>
+
+        <p *ngIf="properties.environment != 'production' && eoscSubjects && eoscSubjects.length > 0">
+          <span #classifiedContent [id]="id+'_eosc'">{{getValue(eoscSubjects).join(', ')}}</span>
+        </p>
       </div>
     </ng-template>
     
     <modal-alert #subjectsByVocabularyModal *ngIf="!isMobile && ((classifiedSubjects && classifiedSubjects.size > 0) || (eoscSubjects && eoscSubjects.length > 0))" large="true">
       <div class="uk-text-small">
         <ng-container *ngTemplateOutlet="subjects_by_vocabulary_template"></ng-container>
-        <ng-container *ngIf="eoscSubjects && eoscSubjects.length > 0"><ng-container *ngTemplateOutlet="eosc_subjects_template"></ng-container></ng-container>
+        <ng-container *ngIf="eoscSubjects && eoscSubjects.length > 0"><ng-container *ngTemplateOutlet="eosc_subjects_template; context: {id: 'content'}"></ng-container></ng-container>
       </div>
     </modal-alert>
   `
@@ -234,4 +249,8 @@ export class ShowSubjectsComponent {
       this.openSubjectsByVocabularyModal();
     }
   }
+
+  getValue(eosSubjects) {
+    return eosSubjects.map(res => res.value);
+  }
 }

landingPages/result/resultLanding.component.html

@@ -283,7 +283,7 @@
                     <!-- <showTitle *ngIf="stickyHeader" [titleName]="resultLandingInfo.title" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
                     <my-tabs (selectedActiveTab)="onSelectActiveTab($event)" [offsetForSticky]="offset" [(isSticky)]="stickyHeader">
                       <my-tab tabTitle="Summary" [tabId]="'summary'" [active]="true"></my-tab>
-                      <my-tab *ngIf="resultLandingInfo.subjects || resultLandingInfo.otherSubjects || resultLandingInfo.classifiedSubjects"
+                      <my-tab *ngIf="hasSubjects"
                               [tabTitle]="'Subjects'" [tabId]="'subjects'">
                       </my-tab>
                       <my-tab *ngIf="resultLandingInfo.references && resultLandingInfo.references.length > 0"
@@ -312,7 +312,7 @@
                   <ng-container>
                     <ng-container *ngTemplateOutlet="summary_content"></ng-container>
                   </ng-container>
-                  <ng-container *ngIf="resultLandingInfo.subjects || resultLandingInfo.otherSubjects || resultLandingInfo.classifiedSubjects">
+                  <ng-container *ngIf="hasSubjects">
                     <ng-container *ngTemplateOutlet="subjects_content"></ng-container>
                   </ng-container>
                   <ng-container *ngIf="resultLandingInfo.references && resultLandingInfo.references.length > 0">
@@ -549,7 +549,7 @@
           </div>
           <hr>
         </ng-container>
-        <ng-container *ngIf="resultLandingInfo.subjects || resultLandingInfo.otherSubjects || resultLandingInfo.classifiedSubjects">
+        <ng-container *ngIf="hasSubjects">
           <div class="clickable uk-flex uk-flex-middle uk-flex-between" (click)="openFsModal(subjectsFsModal, 'Subjects'); onSelectActiveTab('subjects')">
             <span>Subjects</span>
             <icon name="chevron_right" [ratio]="1.5" [flex]="true"></icon>
@@ -736,7 +736,7 @@
     </fs-modal>
 
     <fs-modal #subjectsFsModal classTitle="uk-tile-default uk-border-bottom" (cancelEmitter)="cancelSubjectsClicked()"
-              *ngIf="resultLandingInfo.subjects || resultLandingInfo.otherSubjects || resultLandingInfo.classifiedSubjects">
+              *ngIf="hasSubjects">
       <ng-container *ngIf="activeTab == 'subjects'">
         <ng-container *ngTemplateOutlet="subjects_content"></ng-container>
       </ng-container>

landingPages/result/resultLanding.component.ts

@@ -1171,6 +1171,10 @@ export class ResultLandingComponent {
     return "Not available access";
   }
 
+  public get hasSubjects(): boolean {
+    return !!(this.resultLandingInfo.subjects || this.resultLandingInfo.otherSubjects || (this.resultLandingInfo.classifiedSubjects && this.properties.environment == 'production') || this.resultLandingInfo.eoscSubjects);
+  }
+
   public getEoscParams() {
     let params = "";
     if(this.prevPath) {