Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg-metrics.component.html
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg-metrics.component.html	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg-metrics.component.html	(revision 50239)
@@ -7,6 +7,11 @@
       <div class="alert alert-danger" style="display:none;" aria-hidden="true"></div>
       <div class="uk-width-1-1@m uk-first-column uk-margin-medium-bottom">
         <div class="uk-overflow-auto uk-scrollspy-inview uk-animation-slide-top-medium">
+          <div *ngIf="errorMessage" class="alert alert-danger">{{ errorMessage }}</div>
+          <div style="text-align: center; margin-top: 100px;" *ngIf="showSpinner">
+            <span>{{ loadingMessage }}</span><br>
+            <img src="/assets/imgs/loader-big.gif">
+          </div>
           <div>
             <table class="uk-table uk-table-striped uk-table-middle" style="font-size: 12px">
               <thead>
@@ -20,13 +25,18 @@
                 </tr>
               </thead>
               <tbody>
-                <tr class="el-item">
-                  <td class="uk-table-shrink"></td>
-                  <td class="uk-table-shrink"></td>
-                  <td class="uk-text-nowrap uk-table-shrink"></td>
-                  <td class="uk-text-nowrap uk-table-shrink"></td>
-                  <td class="uk-text-nowrap uk-table-shrink"></td>
-                  <td class="uk-text-nowrap uk-table-shrink"></td>
+                <tr class="el-item" *ngFor="let piwik of piwiks">
+                  <td class="uk-table-shrink">{{ piwik.repositoryName }}<br>(ID: {{ piwik.repositoryId }})</td>
+                  <td class="uk-table-shrink">ID: {{ piwik.siteId }}<br>Authentication Token: {{ piwik.authenticationToken }}</td>
+                  <td class="uk-text-nowrap uk-table-shrink">{{ piwik.creationDate | date : "yyyy-mm-dd" }}</td>
+                  <td class="uk-text-nowrap uk-table-shrink">{{ piwik.requestorName }}<br>{{ piwik.requestorEmail }}</td>
+                  <td class="uk-text-nowrap uk-table-shrink">
+                    <span *ngIf="piwik.validated">YES<br>on {{ piwik.validationDate | date : "yyyy-mm-dd" }}</span>
+                    <span *ngIf="!piwik.validated">NO</span>
+                  </td>
+                  <td class="uk-text-nowrap uk-table-shrink">
+                    <button id="{{ piwik.repositoryId }}" *ngIf="!piwik.validated" class="uk-button uk-button-primary validate" (click)="confirmApproval(piwik.repositoryId)">Validate</button>
+                  </td>
                 </tr>
               </tbody>
             </table>
@@ -36,3 +46,8 @@
     </div>
   </div>
 </div>
+
+<confirmation-dialog #confirmApprovalModal [title]="modalTitle" [isModalShown]="isModalShown"
+                     [confirmActionButton]="modalButton" (emmitObject)="confirmedApproval($event)">
+  Are you sure you want to validate the selected piwik site(s)?
+</confirmation-dialog>
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg.module.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg.module.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg.module.ts	(revision 50239)
@@ -5,13 +5,14 @@
 import {AdminPgHelpTextsComponent} from "./adminPg-help-texts.component";
 import {AdminPgRouting} from "./adminPg.routing";
 import {AdminPgMetricsComponent} from './adminPg-metrics.component';
-import {ConfirmationDialogComponent} from '../../shared/reusablecomponents/confirmation-dialog.component';
+import { ReusableComponentsModule } from '../../shared/reusablecomponents/reusable-components.module';
 
 @NgModule ({
   imports: [
     CommonModule,
     TabsModule.forRoot(),
-    AdminPgRouting
+    AdminPgRouting,
+    ReusableComponentsModule
   ],
   declarations: [
     AdminPgComponent,
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg-metrics.component.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg-metrics.component.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg-metrics.component.ts	(revision 50239)
@@ -1,4 +1,9 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { RepositoryService } from '../../services/repository.service';
+import { PiwikInfo } from '../../domain/typeScriptClasses';
+import { AuthenticationService } from '../../services/authentication.service';
+import { loadingReposMessage, reposRetrievalError } from '../../domain/shared-messages';
+import { ConfirmationDialogComponent } from '../../shared/reusablecomponents/confirmation-dialog.component';
 
 @Component ({
   selector: 'app-admin-metrics',
@@ -6,7 +11,110 @@
 })
 
 export class AdminPgMetricsComponent implements OnInit {
-  constructor() {}
+  piwiks: PiwikInfo[] = [];
+  showSpinner: boolean;
+  errorMessage: string;
+  loadingMessage: string;
 
-  ngOnInit() {}
+  modalTitle = "Approval Confirmation";
+  modalButton = "Yes, validate";
+  isModalShown: boolean;
+
+  @ViewChild('confirmApprovalModal')
+  public confirmApprovalModal: ConfirmationDialogComponent;
+
+  constructor(private authService: AuthenticationService,
+              private repoService: RepositoryService) {}
+
+  ngOnInit() {
+    this.getPiwiks();
+    this.isModalShown = false;
+  }
+
+
+  /* NEEDS TO CALL GET PIWIK INFO INSTEAD!! */
+  getPiwiks(){
+    this.piwiks = [
+      {
+        'repositoryId': 'repo_id',
+        'openaireId': 'oa_id',
+        'repositoryName': 'the repo name',
+        'country': 'Greece',
+        'siteId': '123',
+        'authenticationToken': '32846584f571be9b57488bf4088f30ea',
+        'creationDate':  new Date(2018, 1, 3),
+        'requestorName': 'Bla blabla',
+        'requestorEmail': 'blabla@gmail.com',
+        'validated': false,
+        'validationDate':  new Date(2018, 1, 3),
+        'comment' : ''
+      },
+      {
+        'repositoryId': 'repo_id2',
+        'openaireId': 'oa_id2',
+        'repositoryName': 'the repo name2',
+        'country': 'Greece',
+        'siteId': '123',
+        'authenticationToken': '32846584f88f30easdfasdfa',
+        'creationDate':  new Date(2018, 1, 4),
+        'requestorName': 'Bla blabla',
+        'requestorEmail': 'blabla2@gmail.com',
+        'validated': true,
+        'validationDate':  new Date(2018, 1, 4),
+        'comment' : ''
+      },
+      {
+        'repositoryId': 'repo_id3',
+        'openaireId': 'oa_id',
+        'repositoryName': 'the repo name',
+        'country': 'Greece',
+        'siteId': '123',
+        'authenticationToken': '32846584f571be9b57488bf4088f30ea',
+        'creationDate': new Date(2018, 1, 3),
+        'requestorName': 'Bla blabla',
+        'requestorEmail': 'blabla2@gmail.com',
+        'validated': false,
+        'validationDate': new Date(2018, 1, 3),
+        'comment' : ''
+      }
+    ]
+/*
+    this.showSpinner = true;
+    this.loadingMessage = loadingReposMessage;
+    this.repoService.getPiwikSitesForRepos()
+      .subscribe(
+        piwiks => this.piwiks = piwiks.sort( function(a,b){
+          if(a.repositoryName<b.repositoryName){
+            return -1;
+          } else if(a.repositoryName>b.repositoryName){
+            return 1;
+          } else {
+            return 0;
+          }
+        } ),
+        error => {
+          console.log(error);
+          this.showSpinner = false;
+          this.loadingMessage = '';
+          this.errorMessage = reposRetrievalError;
+        },
+        () => {
+          this.showSpinner = false;
+          this.loadingMessage = '';
+        }
+      );
+*/
+  }
+
+  /*NOT SURE IF THESE PARAMETERS ARE THE CORRECT ONES*/
+  confirmApproval(repoId: string) {
+    this.confirmApprovalModal.ids = [repoId];
+    this.confirmApprovalModal.showModal();
+  }
+
+  confirmedApproval(ids: string[]){
+    let id = ids[0];
+    console.log(`approved validation of piwik for repo with id: ${id}`);
+  }
+
 }
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg.routing.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg.routing.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/adminPg/adminPg.routing.ts	(revision 50239)
@@ -9,7 +9,7 @@
   {
     path: 'admin',
     component: AdminPgComponent,
-    canActivate: [AuthGuardService],
+//    canActivate: [AuthGuardService],
     children: [
       {
         path: '',
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-register/sr-literature.component.html
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-register/sr-literature.component.html	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-register/sr-literature.component.html	(revision 50239)
@@ -60,7 +60,7 @@
                 </div>
                 <div class="form-group">
                   <label class="control-label">Start typing in the name of your repository to narrow down the view</label>
-                  <input #searchBox id="searchBox" class="form-control" type="text" />
+                  <input #searchBox id="searchBox" class="form-control" type="text" (keyup)="refreshSearch($event.target.value)" />
                 </div>
               </div>
               <div *ngIf="hasSelectedCountry">
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-register/sr-literature.component.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-register/sr-literature.component.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources-register/sr-literature.component.ts	(revision 50239)
@@ -83,7 +83,8 @@
   }
 
   refreshSearch(term: string): void {
-    this.searchString.next(term);
+    /*this.searchString.next(term);*/
+    console.log(`read ${term}`)
   }
 /*
   searchRepo(): void {
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources.routing.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources.routing.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/sources/sources.routing.ts	(revision 50239)
@@ -15,7 +15,7 @@
   {
     path: 'sources',
     component: SourcesComponent,
-//    canActivate: [AuthGuardService],
+    canActivate: [AuthGuardService],
     children: [
       {
         path: '',
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.module.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.module.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.module.ts	(revision 50239)
@@ -9,10 +9,12 @@
 import { MetricsRouting } from './metrics.routing';
 import { ReusableComponentsModule } from '../../shared/reusablecomponents/reusable-components.module';
 import { MetricsShowComponent } from './metrics-show.component';
+import { TabsModule } from 'ngx-bootstrap';
 
 @NgModule ({
   imports: [
     CommonModule,
+    TabsModule.forRoot(),
     MetricsRouting,
     ReusableComponentsModule
   ],
Index: modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.component.html
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.component.html	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/pages/metrics/metrics.component.html	(revision 50239)
@@ -13,6 +13,7 @@
           <div class="gwt-HTML uk-margin-medium-bottom">
             <h1 class="uk-article-title">Metrics</h1>
           </div>
+          <a [routerLink]="['enable/2']" class="btn btn-primary">BOOM</a>
           <repository-tiles [parent]="parent_id">
             Choose the Datasource for which you would like to view or enable metrics
           </repository-tiles>
Index: modules/uoa-repository-dashboard-gui/trunk/app/services/authentication.service.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/services/authentication.service.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/services/authentication.service.ts	(revision 50239)
@@ -1,10 +1,11 @@
 import {Injectable} from "@angular/core";
+import { Repository } from '../domain/typeScriptClasses';
 
 @Injectable()
 export class AuthenticationService {
-  userName: string;
-  userEmail: string;
-  isLoggedIn: boolean;
+  isLoggedIn: boolean = false;
+  userName: string = '';
+  userEmail: string = '';
 
   login(){
     this.isLoggedIn = true;
@@ -21,4 +22,8 @@
   register(){
 
   }
+
+  getUserEmail() {
+    return this.userEmail;
+  }
 }
Index: modules/uoa-repository-dashboard-gui/trunk/app/services/repository.service.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/services/repository.service.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/services/repository.service.ts	(revision 50239)
@@ -14,6 +14,7 @@
 import { Country, PiwikInfo, Repository, Topic } from '../domain/typeScriptClasses';
 import 'rxjs/add/operator/map';
 import { Http, Response } from '@angular/http';
+import { AuthenticationService } from './authentication.service';
 
 const httpOptions = {
   headers: new HttpHeaders().set('Content-Type', 'application/json')
@@ -24,11 +25,9 @@
 /*  private apiUrl = 'http://195.134.66.230:8380/uoa-repository-manager-service';*/
   private apiUrl = 'http://194.177.192.121:8380/uoa-repository-manager-service';
 
-  userEmail: string = 'ant.lebesis@gmail.com';
-
   constructor(private http: Http) { }
 
-  getRepositoriesOfCountry (country: string, mode: string): Observable<Repository[]> {
+  getRepositoriesOfCountry(country: string, mode: string): Observable<Repository[]> {
     let url = `${this.apiUrl}/repository/getRepositoriesByCountry/${country}/${mode}`;
     console.log(`knocking on: ${url}`);
     return this.http.get(url)
@@ -36,8 +35,8 @@
       .catch(this.handleError);
   }
 
-  getRepositoriesOfUser (): Observable<Repository[]> {
-    let url = `${this.apiUrl}/repository/getRepositoriesOfUser/${this.userEmail}/0/100`;
+  getRepositoriesOfUser(userEmail: string): Observable<Repository[]> {
+    let url = `${this.apiUrl}/repository/getRepositoriesOfUser/${userEmail}/0/100`;
     console.log(`knocking on: ${url}`);
     return this.http.get(url)
       .map( res => <Repository[]>res.json())
@@ -45,7 +44,7 @@
       .catch(this.handleError);
   }
 
-  getPiwikInfo (id: string): Observable<PiwikInfo> {
+  getPiwikInfo(id: string): Observable<PiwikInfo> {
     let url = `${this.apiUrl}/piwik/getPiwikSiteForRepo/${id}`;
     console.log(`knocking on: ${url}`);
     return this.http.get(url)
@@ -61,7 +60,7 @@
       .catch(this.handleError);
   }
 
-  getCountries (): Observable<Country[]> {
+  getCountries(): Observable<Country[]> {
     let url = `${this.apiUrl}/repository/getCountries`;
     console.log(`knocking on: ${url}`);
     return this.http.get(url)
@@ -69,6 +68,14 @@
       .catch(this.handleError);
   }
 
+  getPiwikSitesForRepos(): Observable<PiwikInfo[]> {
+    let url = `${this.apiUrl}/piwik/getPiwikSitesForRepos`;
+    console.log(`knocking on: ${url}`);
+    return this.http.get(url)
+      .map( res => <PiwikInfo[]>res.json())
+      .catch(this.handleError);
+  }
+
   private handleError(error: Response | any) {
     // In a real world app, we might use a remote logging infrastructure
     // We'd also dig deeper into the error to get a better message
Index: modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/repository-tiles.component.html
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/repository-tiles.component.html	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/repository-tiles.component.html	(revision 50239)
@@ -18,7 +18,7 @@
     <div>
       <div *ngIf="errorMessage" class="alert alert-danger">{{ errorMessage }}</div>
       <div style="text-align: center; margin-top: 100px;" *ngIf="showSpinner">
-        <span>Retrieving repositories ...</span><br>
+        <span>{{ loadingMessage }}</span><br>
         <img src="/assets/imgs/loader-big.gif">
       </div>
 
Index: modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/repository-tiles.component.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/repository-tiles.component.ts	(revision 50238)
+++ modules/uoa-repository-dashboard-gui/trunk/app/shared/reusablecomponents/repository-tiles.component.ts	(revision 50239)
@@ -1,6 +1,8 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { PiwikInfo, Repository } from '../../domain/typeScriptClasses';
 import { RepositoryService } from '../../services/repository.service';
+import { AuthenticationService } from '../../services/authentication.service';
+import { loadingReposMessage, reposRetrievalError } from '../../domain/shared-messages';
 
 @Component ({
   selector: 'repository-tiles',
@@ -14,11 +16,13 @@
   badgeCSS: string;
   badgeText: string;
   linkToNext: string;
-  errorMessage: string = '';
+  errorMessage: string;
+  loadingMessage: string;
 
   @Input() parent: string = '';
 
-  constructor(private repoService: RepositoryService) {}
+  constructor(private authService: AuthenticationService,
+              private repoService: RepositoryService) {}
 
   ngOnInit() {
     this.getReposOfUser();
@@ -27,7 +31,8 @@
 
   getReposOfUser(): void {
     this.showSpinner = true;
-    this.repoService.getRepositoriesOfUser()
+    this.loadingMessage = loadingReposMessage;
+    this.repoService.getRepositoriesOfUser(this.authService.getUserEmail())
       .subscribe(
         repos => this.reposOfUser = repos.sort( function(a,b){
           if(a.officialName<b.officialName){
@@ -41,10 +46,12 @@
         error => {
           console.log(error);
           this.showSpinner = false;
-          this.errorMessage = 'An error occured and the repositories could not be retrieved!';
+          this.loadingMessage = '';
+          this.errorMessage = reposRetrievalError;
           },
         () => {
           this.showSpinner = false;
+          this.loadingMessage = '';
         }
       );
   }
Index: modules/uoa-repository-dashboard-gui/trunk/app/domain/shared-messages.ts
===================================================================
--- modules/uoa-repository-dashboard-gui/trunk/app/domain/shared-messages.ts	(nonexistent)
+++ modules/uoa-repository-dashboard-gui/trunk/app/domain/shared-messages.ts	(revision 50239)
@@ -0,0 +1,3 @@
+
+export const reposRetrievalError = 'An error occured and the repositories could not be retrieved!';
+export const loadingReposMessage = 'Retrieving repositories ...';
