[Trunk|Connect]: Add Biography on curators page.

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

src/app/curators/curators.component.html

@@ -12,7 +12,7 @@
                 <span class="uk-text-bold">Curators</span>
                 <span> ({{curators.length}})</span>
               </h4>
-              <div *ngFor="let curator of curators" class="uk-width-1-1 uk-card uk-card-default uk-card-body uk-margin-top uk-height-max-large uk-overflow-auto">
+              <div *ngFor="let curator of curators let i=index;" class="uk-width-1-1 uk-card uk-card-default uk-card-body uk-margin-top uk-height-max-large uk-overflow-auto">
                 <div [class]="(curator.affiliations.length <= 2)?'uk-grid-divider':''" uk-grid>
                   <div class="uk-width-1-2 uk-first-column">
                     <div class="uk-flex uk-flex-middle">
@@ -75,6 +75,14 @@
                     <div class="uk-text-meta uk-margin-small-bottom">
                       Biography
                     </div>
+                    <div class="uk-margin-top">
+                      <span *ngIf="showMore[i]">
+                          {{curator.bio}}
+                      </span>
+                      <span *ngIf="!showMore[i]">
+                          {{_format(curator.bio)}}
+                      </span>
+                    </div>
                   </div>
                 </div>
 

src/app/curators/curators.component.ts

@@ -21,6 +21,9 @@ export class CuratorsComponent {
 
   public curators: Curator[];
 
+  public showMore = [];
+  public maxCharacters = 500;
+
   public properties: EnvProperties;
 
   constructor (private route: ActivatedRoute,
@@ -39,6 +42,9 @@ export class CuratorsComponent {
         this.curatorsService.getCurators(this.properties,
           this.properties.adminToolsAPIURL + 'curator?emails=' + emails).subscribe(curators => {
           this.curators = curators;
+          for(let i = 0; i < this.curators.length; i++) {
+            this.showMore[i]= false;
+          }
           this.showLoading = false;
         })
       } else {
@@ -52,7 +58,9 @@ export class CuratorsComponent {
                 this.curatorsService.getCurators(this.properties,
                   this.properties.adminToolsAPIURL + '/curator?emails=' + emails).subscribe(curators => {
                   this.curators = curators;
-                  console.log(this.curators);
+                  for(let i = 0; i < this.curators.length; i++) {
+                    this.showMore[i]= false;
+                  }
                   this.showLoading = false;
                 })
             })
@@ -66,6 +74,9 @@ export class CuratorsComponent {
             this.curatorsService.getCurators(this.properties,
               this.properties.adminToolsAPIURL + 'curator?emails=' + emails).subscribe(curators => {
               this.curators = curators;
+              for(let i = 0; i < this.curators.length; i++) {
+                this.showMore[i]= false;
+              }
               this.showLoading = false;
             })
           })
@@ -74,4 +85,16 @@ export class CuratorsComponent {
     });
 
   }
+
+  public toggle(index: number) {
+    this.showMore[index] = !this.showMore[index];
+  }
+
+  _format(name: string){
+    if(name) {
+      return (((name).length > this.maxCharacters) ? (name.substring(0, (this.maxCharacters - ('...').length)) + '...') : name);
+    } else {
+      return null;
+    }
+  }
 }