commiting a more complete version of the project

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

portal-2/.editorconfig

@@ -0,0 +1,15 @@
+# http://editorconfig.org
+
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+insert_final_newline = false
+trim_trailing_whitespace = false

portal-2/.gitignore

@@ -0,0 +1,12 @@
+/__build__
+/__server_build__
+/node_modules
+/typings
+/tsd_typings/
+npm-debug.log
+
+/dist/
+
+.idea
+
+.DS_Store

portal-2/README.md

@@ -0,0 +1,23 @@
+# Angular 2 Universal Starter [![Universal Angular 2](https://img.shields.io/badge/universal-angular2-brightgreen.svg?style=flat)](https://github.com/angular/universal) 
+> Server-Side Rendering for Angular 2
+
+A minimal Angular 2 starter for Universal JavaScript using TypeScript 2 and Webpack 2
+
+> If you're looking for the Angular Universal repo go to [angular/universal](https://github.com/angular/universal)  
+
+[![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy)
+
+## Installation
+
+* `npm install`
+
+## Serve
+
+* `npm start` to build your client app and start a web server
+* `npm run build` to prepare a distributable bundle
+
+## Development
+* run `npm start` and `npm run watch` in two separate terminals to build your client app, start a web server, and allow file changes to update in realtime
+
+## Watch files
+* `npm run watch` to build your client app and start a web server

portal-2/app.json

@@ -0,0 +1,12 @@
+{
+  "name": "Angular 2 Universal Starter",
+  "description": "Angular 2 Universal starter kit by @AngularClass",
+  "repository": "https://github.com/angular/universal-starter",
+  "logo": "https://cloud.githubusercontent.com/assets/1016365/10639063/138338bc-7806-11e5-8057-d34c75f3cafc.png",
+  "env": {
+    "NPM_CONFIG_PRODUCTION": {
+      "description": "Install `webpack` and other development modules when deploying to allow full builds.",
+      "value": "false"
+    }
+  }
+}

portal-2/nodemon.json

@@ -0,0 +1,7 @@
+{
+  "watch": [
+    "dist",
+    "src/index.html"
+  ],
+  "ext" : "js ts json html"
+}

portal-2/package.json

@@ -0,0 +1,78 @@
+{
+  "name": "universal-starter",
+  "version": "2.0.0",
+  "description": "Angular 2 Universal starter kit by @AngularClass",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/angular/universal-starter.git"
+  },
+  "scripts": {
+    "watch": "webpack --watch",
+    "prebuild": "rimraf dist",
+    "build": "webpack",
+    "build:prod": "webpack --progress -p",
+    "prestart": "npm run build",
+    "server": "nodemon dist/server/index.js",
+    "debug:server": "node-nightly --inspect --debug-brk dist/server/index.js",
+    "start": "npm run server",
+    "debug:start": "npm run build && npm run debug:server",
+    "predebug": "npm run build",
+    "debug:build": "node-nightly --inspect --debug-brk node_modules/webpack/bin/webpack.js",
+    "debug": "node --debug-brk dist/server/index.js"
+  },
+  "license": "MIT",
+  "contributors": [
+    "AngularClass <hello@angularclass.com>",
+    "PatrickJS <patrick@angularclass.com>",
+    "Jeff Whelpley <jeff@gethuman.com>",
+    "Jeff Cross <crossj@google.com>",
+    "Mark Pieszak <mpieszak84@gmail.com>"
+  ],
+  "dependencies": {
+    "@angular/common": "2.0.0",
+    "@angular/compiler": "2.0.0",
+    "@angular/core": "2.0.0",
+    "@angular/forms": "2.0.0",
+    "@angular/http": "2.0.0",
+    "@angular/platform-browser": "2.0.0",
+    "@angular/platform-browser-dynamic": "2.0.0",
+    "@angular/platform-server": "2.0.0",
+    "@angular/router": "3.0.0",
+    "angular2-platform-node": "~2.0.11",
+    "angular2-universal": "~2.0.11",
+    "angular2-universal-polyfills": "~2.0.11",
+    "angular2-express-engine": "~2.0.11",
+    "body-parser": "^1.15.2",
+    "express": "^4.14.0",
+    "methods": "~1.1.2",
+    "rxjs": "5.0.0-beta.12",
+    "zone.js": "0.6.21"
+  },
+  "devDependencies": {
+    "@angularclass/resolve-angular-routes": "^1.0.9",
+    "@types/body-parser": "0.0.29",
+    "@types/compression": "0.0.29",
+    "@types/cookie-parser": "^1.3.29",
+    "@types/express": "^4.0.32",
+    "@types/express-serve-static-core": "^4.0.33",
+    "@types/hammerjs": "^2.0.32",
+    "@types/mime": "0.0.28",
+    "@types/node": "^6.0.38",
+    "@types/serve-static": "^1.7.27",
+    "angular2-template-loader": "^0.4.0",
+    "cookie-parser": "^1.4.3",
+    "imports-loader": "^0.6.5",
+    "json-loader": "^0.5.4",
+    "nodemon": "^1.10.0",
+    "raw-loader": "^0.5.1",
+    "rimraf": "^2.5.4",
+    "string-replace-loader": "github:gdi2290/string-replace-loader",
+    "ts-loader": "^0.8.2",
+    "ts-node": "^1.3.0",
+    "typescript": "2.0.0",
+    "webpack": "2.1.0-beta.22",
+    "webpack-dev-middleware": "^1.6.1",
+    "webpack-dev-server": "^2.1.0-beta.0",
+    "webpack-merge": "^0.13.0"
+  }
+}

portal-2/src/app/app.routing.ts

@@ -0,0 +1,64 @@
+import { ModuleWithProviders } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import {ClaimsAdminComponent} from './claimPages/claims/claimsAdmin.component';
+import {ClaimComponent} from './claimPages/claim/claim.component';
+import {MyClaimsComponent} from './claimPages/myClaims/myClaims.component';
+import {HomeComponent} from './home/home.component';
+import { LinkingComponent } from './claimPages/linking/linking.component';
+import { BulkLinkingComponent } from './claimPages/linking/bulkLinking.component';
+import { PersonComponent } from './landingPages/person/person.component';
+import { ProjectComponent } from './landingPages/project/project.component';
+import { OrganizationComponent } from './landingPages/organization/organization.component';
+import { DatasetComponent } from './landingPages/dataset/dataset.component';
+import { PublicationComponent } from './landingPages/publication/publication.component';
+import { SearchAllComponent } from './searchAll/searchAll.component';
+import { SearchPublicationsComponent } from './searchPages/searchPublications.component';
+import { AdvancedSearchPublicationsComponent } from './searchPages/advancedSearchPublications.component';
+ import { DepositComponent } from './deposit/deposit.component';
+
+const appRoutes: Routes = [
+	{ path: '', component: HomeComponent, pathMatch: 'full' },
+  { path: 'claims', component: ClaimsAdminComponent },
+  { path: 'home', component: HomeComponent },
+  { path: 'claim', component: ClaimComponent },
+  { path: 'myclaims', component: MyClaimsComponent },
+	{ path: 'person', component: PersonComponent },
+	{ path: 'project', component: ProjectComponent },
+	{ path: 'organization', component: OrganizationComponent },
+	{ path: 'dataset', component: DatasetComponent },
+	{ path: 'publication', component: PublicationComponent },
+	{ path: 'search', component: SearchAllComponent },
+	{ path: 'linking', component: LinkingComponent },
+	{ path: 'bulk-linking', component: BulkLinkingComponent},
+	{ path: 'search-publications', component: SearchPublicationsComponent },
+  { path: 'advanced-search-publications', component: AdvancedSearchPublicationsComponent },
+	{ path: 'deposit', component: DepositComponent}
+];
+
+//  { path: 'search', component: SearchComponent },
+// { path: 'my-claims', component: MyClaimsComponent },
+// { path: 'demo', component: MyClaimsDemoComponent },
+// { path: 'project', component: ProjectComponent},
+// { path: 'publication', component: PublicationComponent },
+// { path: 'dataset', component: DatasetComponent},
+// { path: 'person', component: PersonComponent },
+// { path: 'organization', component: OrganizationComponent },
+// { path: 'up', component: UploadComponent},
+// { path: 'search-publications', component: SearchPublicationsComponent },
+// { path: 'advanced-search-publications', component: AdvancedSearchPublicationsComponent },
+// { path: 'deposit', component: DepositComponent}
+// ,
+// {
+//   path: 'heroes',
+//   component: HeroListComponent,
+//   data: {
+//     title: 'Heroes List'
+//   }
+// },
+// { path: 'hero/:id', component: HeroDetailComponent },
+// { path: '**', component: PageNotFoundComponent }
+// export const appRoutingProviders: any[] = [
+//
+// ];
+
+export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

portal-2/src/app/app.ts

@@ -0,0 +1,46 @@
+import { Component } from '@angular/core';
+
+import 'rxjs/Rx';
+@Component({
+  selector: 'app',
+  template: `
+  <div>
+  <nav class="navbar navbar-default" id="top">
+  <div class="container-fluid">
+    <!-- Brand and toggle get grouped for better mobile display -->
+    <div class="navbar-header">
+      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+      <a class="navbar-brand" href="#">OpenAire</a>
+    </div>
+
+    <!-- Collect the nav links, forms, and other content for toggling -->
+    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+      <ul class="nav navbar-nav">
+      <li><a  routerLinkActive="active" routerLink="/claims">Claims Admin</a></li>
+      <li><a   routerLink="/myclaims">My Claims</a></li>
+      <li><a   routerLink="/linking">Linking</a></li>
+      <li><a   routerLink="/bulk-linking">Bulk Linking</a></li>
+      <li><a   routerLink="/deposit">Deposit</a></li>
+      <li><a   routerLink="/search-publications">Search Publications</a></li>
+      <li><a   routerLink="/advanced-search-publications">Advanced Search Publications</a></li>
+      <li><a   routerLink="/deposit">Deposit</a></li>
+      </ul>
+
+    </div><!-- /.navbar-collapse -->
+  </div><!-- /.container-fluid -->
+</nav>
+
+    <main>
+      <router-outlet></router-outlet>
+    </main>
+
+  </div>`
+})
+export class App {
+
+}

portal-2/src/app/claimPages/claim.module.ts

@@ -0,0 +1,63 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SharedComponentsModule} from '../common/sharedComponents.module';
+
+import { ClaimsService} from '../services/claims.service';
+//main
+import {ClaimComponent} from './claim/claim.component';
+import {ClaimsAdminComponent} from './claims/claimsAdmin.component';
+import {MyClaimsComponent} from './myClaims/myClaims.component';
+import {LinkingHomeComponent} from './linking/linkingHome.component';
+import {LinkingComponent} from './linking/linking.component';
+import { BulkLinkingComponent } from './linking/bulkLinking.component';
+
+import {BulkClaimComponent} from './linking/bulkClaim/bulkClaim.component';
+import {ClaimsComponent} from './claims/claims.component';
+
+import {ClaimContextComponent} from './linking/claimContext/claimContext.component';
+import {ClaimProjectsComponent} from './linking/claimProject/claimProject.component';
+import {ClaimResultComponent} from './linking/claimResult/claimResult.component';
+import {ClaimPublicationComponent} from './linking/claimResult/claimPublication/claimPublication.component';
+import {ClaimDatasetComponent} from './linking/claimResult/claimDataset/claimDataset.component';
+
+import {ClaimInsertComponent} from './linking/insertClaim/insertClaim.component';
+
+import {ClaimSelectedContextsComponent} from './linking/selected/selectedContexts.component';
+import {ClaimSelectedComponent} from './linking/selected/selected.component';
+import {ClaimSelectedDatasetsComponent} from './linking/selected/selectedDatasets.component';
+import {ClaimSelectedResultsComponent} from './linking/selected/selectedResults.component';
+import {ClaimSelectedProjectsComponent} from './linking/selected/selectedProjects.component';
+import {ClaimSelectedPublicationsComponent} from './linking/selected/selectedPublications.component';
+
+import {LinkingGenericComponent} from './linking/linkingGeneric.component';
+
+import {InlineClaimContextComponent} from './inlineClaimContext/inlineClaimContext.component';
+import {InlineClaimProjectComponent} from './inlineClaimProject/inlineClaimProject.component';
+import {InlineClaimResultComponent} from './inlineClaimResult/inlineClaimResult.component';
+ import {ClaimEntityFormatter} from '../common/claimEntityFormatter.component';
+import { Claim } from '../entities/claim';
+
+//helpers
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    SharedComponentsModule
+  ],
+  declarations: [
+    ClaimsAdminComponent, MyClaimsComponent, ClaimComponent, ClaimsComponent,
+    BulkLinkingComponent, LinkingComponent,  LinkingHomeComponent, LinkingGenericComponent,
+    InlineClaimContextComponent, InlineClaimProjectComponent, InlineClaimResultComponent, ClaimSelectedComponent,
+    ClaimContextComponent, ClaimContextComponent, ClaimSelectedContextsComponent, ClaimInsertComponent, ClaimProjectsComponent, ClaimSelectedProjectsComponent,
+    ClaimResultComponent,  ClaimSelectedPublicationsComponent, ClaimSelectedDatasetsComponent, ClaimSelectedResultsComponent,  ClaimPublicationComponent,
+    ClaimDatasetComponent, BulkClaimComponent,
+     ClaimEntityFormatter
+  ],
+  providers:    [ ClaimsService ],
+  exports: [
+    InlineClaimContextComponent, InlineClaimProjectComponent, InlineClaimResultComponent
+  ]
+})
+export class ClaimModule { }

portal-2/src/app/claimPages/claim/claim.component.html

@@ -0,0 +1,10 @@
+<div *ngIf="id">
+  <p>Here is the claim with id : {{id}}</p>
+  <div *ngIf="claim">
+    {{claim.id }} || {{claim.userMail }} ||
+    {{claim | json}}      {{claim | json}}
+  </div>
+</div>
+<div *ngIf="!id">
+  <p>No proper id...</p> 
+</div>

portal-2/src/app/claimPages/claim/claim.component.ts

@@ -0,0 +1,43 @@
+import {Component} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+
+import {ClaimsService} from '../../services/claims.service';
+// import {Claim} from '../../entities/claim';
+
+@Component({
+    selector: 'claim',
+    templateUrl: 'claim.component.html',
+
+})
+export class ClaimComponent {
+  constructor (private _claimService: ClaimsService,
+  private route: ActivatedRoute, private _router:Router) {}
+  ngOnInit() {
+      this.sub = this.route.queryParams.subscribe(params => {
+
+      this.id = params['id'];
+      console.info("Claim id:"+this.id +"   " +params['id']);
+      if(this.id!=null){
+        this.getClaim(this.id);
+      }
+    });
+
+
+}
+ngOnDestroy() {
+  this.sub.unsubscribe();
+}
+  sub: any;
+  id : string;
+  claim : any;
+   getClaim (id: string) {
+     this._claimService.getClaim(id)
+       .then(data => {
+         this.claim = data;
+         console.log(data);
+       }) ;
+    }
+
+
+}

portal-2/src/app/claimPages/claims/claims.component.html

@@ -0,0 +1,105 @@
+<div class="container">
+<div class="row row-offcanvas row-offcanvas-right">
+  <div class="col-xs-12 col-sm-3">
+<div class="panel panel-default">
+  <!-- Default panel contents -->
+  <div class="panel-heading">Claims related to</div>
+  <!-- List group -->
+  <div class="panel-body">
+    <p>
+      <label> <input [(ngModel)]="projectCB" type="checkbox" (ngModelChange)="changeType()" /> Project </label>
+    </p>
+    <p>
+      <label> <input [(ngModel)]="publicationCB" type="checkbox"  (ngModelChange)="changeType()" /> Publication </label>
+    </p>
+    <p>
+      <label> <input [(ngModel)]="datasetCB" type="checkbox" (ngModelChange)="changeType()" /> Dataset </label>
+    </p>
+    <p>
+      <label> <input [(ngModel)]="contextCB" type="checkbox" (ngModelChange)="changeType()"  /> Context </label>
+    </p>
+    <p class="align-right">
+      <button  class="btn btn-primary"  (click)="clearFilters()">Clear filters</button>
+    </p>
+  </div>
+</div>
+</div>
+
+<div class="col-xs-6 col-sm-9 sidebar-offcanvas" id="sidebar">
+<h4 *ngIf="resultsNum>0" >Showing {{(size*page - size +1)}} to {{(size*page>resultsNum)?resultsNum:(size*page)}} of {{resultsNum}} claims</h4>
+<div *ngIf="resultsNum>size*page " class="text-right">
+  <span class="dropdown">
+    Show <button class="btn btn-default dropdown-toggle" type="button" id="pagingDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+     {{size}}
+      </button>
+     <ul class="dropdown-menu" aria-labelledby="pagingDropdown">
+        <li *ngIf="resultsNum > 10" ><a  (click)="size=10  " >10 </a></li>
+        <li *ngIf="resultsNum > 20" ><a  (click)="size = 20 " >20 </a></li>
+        <li *ngIf="resultsNum > 30" ><a  (click)="size = 30 " >30 </a></li>
+        <li *ngIf="resultsNum > 50" ><a  (click)="size = 50 " >50 </a></li>
+     </ul>
+   </span>
+ </div>
+ <div *ngIf="showErrorMessage " class = "alert alert-danger " >
+     An Error occured.
+ </div>
+
+<div class="text-right" *ngIf="resultsNum">
+  <!--<paging  [currentPage]="page" [totalResults]="resultsNum"  [navigateTo]="navigateTo" [size]="size" [params]="getParameters()" > </paging>-->
+  <paging-no-load [currentPage]="page" [totalResults]="resultsNum" [navigateTo]="navigateTo"  [params]="getParameters()" [size]="size"  (pageChange)="pageChange($event)"> </paging-no-load>
+</div>
+
+<!--  Buttons for selecting and Delete Claims -->
+<div *ngIf="enableDelete">
+  <div *ngIf="selected.length>0 && resultsNum > 0 ">
+    <div class = "alert alert-info " >
+      You have selected {{selected.length}} claim(s)
+    </div>
+  </div>
+  <div *ngIf="deleteMessage.length>0 " [innerHTML]="deleteMessage">
+
+  </div>
+  <button class="btn btn-default" (click)="selectAll()">Select All</button> <button class="btn btn-default" (click)="deselectAll()">Deselect All</button> <button class="btn btn-default" (click)="confirmOpen()">Delete</button>
+</div>
+<br>
+<div class="input-group col-lg-6">
+  <span class="input-group-addon" id="sizing-addon2">Filter</span>
+  <input type="text" class="form-control" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="inputkeyword"  (keyup)="changekeyword()" >
+</div>
+
+<div *ngIf=" claims && claims.length == 0" >
+  <div class = "alert alert-info " >No entries found.</div>
+</div>
+
+<div class="">
+<table *ngIf="claims && claims.length > 0" class="table table-striped">
+  <thead>
+     <tr>
+        <th *ngIf="enableDelete"></th>
+        <!--<th>Id</th>
+        <!--  <th>Target Type</th> -->
+          <th><a (click)="changeOrderby('target')" >Research Result</a> </th>
+        <!--<th>Source type</th> -->
+        <th><a (click)="changeOrderby('source')" >Link to</a> </th>
+
+        <th><a (click)="changeOrderby('user')" >Claimed by</a> </th>
+        <th><a (click)="changeOrderby('date')"> Claimed Date</a></th>
+     </tr>
+  </thead>
+  <tbody>
+      <tr *ngFor="let claim of claims " >
+       <td *ngIf="enableDelete"><input [id]="claim.id" type="checkbox" (click)="select(claim,$event)"  [ngModel]="isSelected(claim.id)"/></td>
+
+        <td><claim-entity [entity]="claim.target" [type]="claim.targetType" > </claim-entity></td>
+         <td><claim-entity [entity]="claim.source" [type]="claim.sourceType" > </claim-entity></td>
+        <td>{{claim.userMail}}</td>
+        <td>{{claim.date}}</td>
+     </tr>
+  </tbody>
+</table>
+</div>
+</div>
+</div>
+<modal-alert (alertOutput)="confirmClose($event)">
+</modal-alert>
+<modal-loading [message]= "'Please wait...'"></modal-loading>

portal-2/src/app/claimPages/claims/claims.component.ts

@@ -0,0 +1,488 @@
+import {Component, ViewChild, Input} from '@angular/core';
+import {Location} from '@angular/common';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {ClaimsService} from '../../services/claims.service';
+import {ModalLoading} from '../../common/modal/loading.component';
+import {AlertModal} from '../../common/modal/alert';
+
+
+@Component({
+    selector: 'claims',
+    templateUrl: 'claims.component.html',
+    providers:[ ClaimsService]
+
+})
+export class ClaimsComponent {
+  constructor (private _claimService: ClaimsService,  private route: ActivatedRoute, private _router:Router, private location: Location) {
+   }
+
+  ngOnInit() {
+     this.sub = this.route.queryParams.subscribe(params => {
+      if( this.myClaims == 'true' ){
+          this.fetchBy = "User";
+      }else{
+
+        this.fetchBy = params['fetchBy'];
+        this.fetchBy = (this.types.indexOf(this.fetchBy) != -1)? this.fetchBy:'All';
+        this.fetchId = params['fetchId'];
+        this.fetchId=this.fetchId?this.fetchId:'';
+
+      }
+
+      let page = (params['page']=== undefined)?1:+params['page'];
+      let size = (params['size']=== undefined)?10:+params['size'];
+
+      this.keyword = (params['keyword']?params['keyword']:"");
+      this.inputkeyword = this.keyword;
+      this.page = ( page <= 0 ) ? 1 : page;
+      this.size = ( size <= 0 ) ? 10 : size;
+      this.entityTypes = []//(params['types']?params['types']:[]);
+      this.setTypes(params['types']); // check the appropriate checkboxes
+      this.setSortby(params['sort']);
+      this.getClaims();
+
+    });
+    // this.sub = this.route.params.subscribe(params => {
+    //   console.info(this.isAdmin+"  "+this.myClaims+" Fetch by: "+this.fetchBy+" Fetch id: "+this.fetchId);
+    //   if( this.myClaims == 'true' ){
+    //     console.info("Is myclaims");
+    //       this.fetchBy = "User";
+    //   }else{
+    //     console.info("Is admin");
+    //
+    //     console.info(this.isAdmin);
+    //
+    //     this.fetchBy = params['fetchBy'];
+    //     this.fetchBy = (this.types.indexOf(this.fetchBy) != -1)? this.fetchBy:'All';
+    //     this.fetchId = params['fetchId'];
+    //     console.info("Fetch by:"+this.fetchBy+"Fetch id:"+this.fetchId);
+    //     this.fetchId=this.fetchId?this.fetchId:'';
+    //
+    //   }
+    //
+    //   console.info(this.isAdmin+"  "+this.myClaims+" Fetch by: "+this.fetchBy+" Fetch id: "+this.fetchId);
+    //   let page = (params['page']=== undefined)?1:+params['page'];
+    //   let size = (params['size']=== undefined)?10:+params['size'];
+    //
+    //   this.keyword = (params['keyword']?params['keyword']:"");
+    //   this.inputkeyword = this.keyword;
+    //   this.page = ( page <= 0 ) ? 1 : page;
+    //   this.size = ( size <= 0 ) ? 10 : size;
+    //   this.entityTypes = []//(params['types']?params['types']:[]);
+    //   this.setTypes(params['types']); // check the appropriate checkboxes
+    //   this.setSortby(params['sort']);
+    //   this.getClaims();
+    //   console.info("params: "+params['page']+"   page "+page +" this.page: "+this.page );
+    // });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+    sub: any;
+  //string because comes as input from component directive
+  @Input() enableDelete: string = 'false';
+  @Input() myClaims: string= 'false' ;
+  @Input() isAdmin:string = 'false';
+  page : number;
+  size:number;
+  keyword:string; // the keyword string to give to the request as parameter
+  inputkeyword:string; // the string written in the input field (keyword=inputkeyword when its length is bigger than 3 and the user stops typing)
+  lengths = [10,20,30,50];
+  types = ["All","Project","Context","Result","User"];
+  @Input() fetchBy:string;
+  @Input() fetchId:string;
+
+  navigateTo: string = "Claims";
+  resultsNum: number ;
+  claims: string[];
+
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+
+  //checkboxes:
+  publicationCB = false;
+  datasetCB = false;
+  contextCB = false;
+  projectCB = false;
+  entityTypes : string[] =[] ;
+
+  descending = true;
+  sortby = "date";
+
+  selected=[];
+  deleteMessage:string = "";
+  showErrorMessage:boolean = false;
+
+  //params for pagingFormatter to use when navigate to page
+  params;
+  @ViewChild(AlertModal) alert;
+
+  claimsDeleted:number = 0;
+
+  getClaims () {
+    this.selected=[];
+    var types = '';
+    this.showErrorMessage = false;
+    for (var type of this.entityTypes){
+      types+=(types.length>0?'&':'')+"types="+type;
+    }
+    if(this.fetchBy =="Project" ){
+      this._claimService.getClaimsByProject(this.size,this.page,this.fetchId,this.keyword,this.sortby,this.descending, types).subscribe(
+        data => {
+          this.claims = data.data;
+          this.resultsNum= data.total;
+          },
+        err => {
+          console.error(err);
+          this.showErrorMessage = true;
+        }
+      );
+    }else if(this.fetchBy =="User"){
+      this._claimService.getClaimsByUser(this.size,this.page,this.fetchId,this.keyword,this.sortby,this.descending, types).subscribe(
+        data => {
+          this.claims = data.data;
+          this.resultsNum= data.total;
+          },
+          err => {
+            console.error(err);
+            this.showErrorMessage = true;
+          }
+      );
+    }else if(this.fetchBy =="Result"){
+      this._claimService.getClaimsByResult(this.size,this.page,this.fetchId,this.keyword,this.sortby,this.descending, types).subscribe(
+        data => {
+          this.claims = data.data;
+          this.resultsNum= data.total;
+          },
+          err => {
+            console.error(err);
+            this.showErrorMessage = true;
+          }
+      );
+    }else if(this.fetchBy =="Context"){
+      this._claimService.getClaimsBycontext(this.size,this.page,this.fetchId,this.keyword,this.sortby,this.descending, types).subscribe(
+        data => {
+          this.claims = data.data;
+          this.resultsNum= null;
+          this.resultsNum= data.total;//data.length; //TODO get the total results num
+          },
+          err => {
+            console.error(err);
+            this.showErrorMessage = true;
+          }
+      );
+    }else{
+      this._claimService.getClaims(this.size,this.page,this.keyword,this.sortby,this.descending, types).subscribe(
+        data => {
+          this.claims = data.data;
+          this.resultsNum = null;
+          this.resultsNum= data.total;//data.length; //TODO get the total results num
+          },
+          err => {
+            console.error(err);
+            this.showErrorMessage = true;
+          }
+      );
+    }
+  }
+
+  goToClaim(claimId: number){
+    this._router.navigate( ['Claim', { id: claimId}] );
+  }
+  goTo(page:number = 1){
+
+    this.page = page;
+
+    this.location.go(location.pathname,this.getParametersString());
+    this.getClaims();
+  }
+  getParameters(){
+    let params={ page: this.page, size: this.size, types: this.entityTypes, fetchBy: this.fetchBy, fetchId:this.fetchId, keyword : this.keyword, sort: this.getSortby()  };
+    return params;
+  }
+  getParametersString(){
+    var params='';
+    params+=(this.page==1?"":(params.length>0?'&':'')+"page="+this.page);
+    params+=(this.size==10?"":(params.length>0?'&':'')+"size="+this.size);
+    // params+=(this.entityTypes==''?"":(params.length>0?'&':'')+"types="+this.entityTypes);
+    var types="";
+    for (var type of this.entityTypes){
+         types+=(types.length>0?',':'')+type;
+    }
+    params+=(types.length>0)?"types="+types:"";
+
+    if(this.isAdmin === 'true'){
+      params+=(this.fetchBy=='All'?"":(params.length>0?'&':'')+"fetchBy="+this.fetchBy);
+      params+=(this.fetchId==''?"":(params.length>0?'&':'')+"fetchId="+this.fetchId);
+    }
+    params+=(this. getSortby()=='datedesc'?"":(params.length>0?'&':'')+"sort="+this. getSortby());
+    params+=(this.keyword==''?"":(params.length>0?'&':'')+"keyword="+this.keyword);
+    return params;
+  }
+  changeLength(){
+    this.goTo();
+  }
+  clearFilters(){
+    this.keyword = '';
+    this.inputkeyword = '';
+    this.publicationCB = false;
+    this.projectCB = false;
+    this.datasetCB = false;
+    this.contextCB = false;
+    this.entityTypes = [];
+    this.goTo();
+   }
+   changeOrderby(sortby:string){
+     if(sortby==this.sortby){
+       this.descending = !this.descending;
+     }else{
+       this.sortby = sortby;
+       this.descending = false;
+     }
+     this.goTo();
+   }
+   setSortby(sortby:string){
+     if(!sortby|| sortby == "datedesc"){
+       this.descending = true;
+       this.sortby = "date";
+     }else if(sortby == "dateasc"){
+       this.descending = false;
+       this.sortby = "date";
+     }else if(sortby == "userasc"){
+       this.descending = false;
+       this.sortby = "user";
+     }else if(sortby == "userdesc"){
+       this.descending = true;
+       this.sortby = "user";
+     }if(sortby =="sourceasc"){
+       this.descending = false;
+       this.sortby = "source";
+     }else if(sortby == "sourcedesc"){
+       this.descending = true;
+       this.sortby = "source";
+     }else if(sortby == "targetasc"){
+       this.descending = false;
+       this.sortby = "target";
+     }else if(sortby == "targetdesc"){
+       this.descending = true;
+       this.sortby = "target";
+     }
+   }
+   getSortby():string{
+     if(this.descending){
+       return this.sortby+"desc";
+     }else{
+       return this.sortby+"asc";
+     }
+
+   }
+   changeType(){
+     this.entityTypes = [];
+     if(this.publicationCB){
+       this.entityTypes.push('publication');
+     }
+     if(this.datasetCB){
+       this.entityTypes.push('dataset');
+     }
+     if(this.projectCB){
+       this.entityTypes.push('project');
+     }
+     if(this.contextCB){
+       this.entityTypes.push('context');
+     }
+
+    //  if(this.publicationCB  == true && this.datasetCB  == true && this.contextCB  == true && this.projectCB  == true ){
+    //    this.entityTypes="";
+    //  }else{
+    //    this.entityTypes = "";
+    //    if(this.publicationCB == true){
+    //      this.entityTypes = "publication";
+    //    }
+    //    if(this.datasetCB  == true){
+    //      this.entityTypes += (this.entityTypes.length > 0?",":"")+"dataset";
+    //    }
+    //    if(this.contextCB  == true){
+    //      this.entityTypes += (this.entityTypes.length > 0?",":"")+"context";
+    //    }
+    //    if(this.projectCB  == true){
+    //      this.entityTypes += (this.entityTypes.length > 0?",":"")+"project";
+    //    }
+    //  }
+    //  console.debug("Type changed: "+this.entityTypes+"   "+this.publicationCB+ this.datasetCB + this.contextCB  + this.projectCB);
+     this.goTo();
+   }
+   setTypes(types:string){
+     if(!types){
+       return;
+     }
+     if(types.length > 0){
+       this.entityTypes = [];
+       if(types.indexOf("publication")!=-1){
+         this.publicationCB = true;
+         this.entityTypes.push("publication");
+       }
+       if(types.indexOf("dataset")!=-1){
+         this.datasetCB = true;
+         this.entityTypes.push("dataset");
+       }
+       if(types.indexOf("project")!=-1){
+         this.projectCB = true;
+         this.entityTypes.push("project");
+       }
+       if(types.indexOf("context")!=-1){
+         this.contextCB = true;
+         this.entityTypes.push("context");
+       }
+     }
+     if(this.publicationCB && this.datasetCB && this.contextCB && this.projectCB){
+       this.entityTypes=[];
+     }
+   }
+   changekeyword(){
+
+     if(this.inputkeyword.length >= 3 || this.inputkeyword.length == 0 ){
+       this.keyword = this.inputkeyword;
+       this.page = 1;
+       this.goTo();
+     }
+
+   }
+   select(item:any,event){
+     this.deleteMessage="";
+     var value = event.currentTarget.checked;
+     if(value){
+       this.selected.push(item);
+     }else{
+       for (var _i = 0; _i < this.selected.length; _i++) {
+           let claim = this.selected[_i];
+           if(claim['id'] == item.id){
+                 this.selected.splice(_i, 1);
+           }
+        }
+
+
+     }
+   }
+   selectAll(){
+     this.selected = [];
+    for (var _i = 0; _i < this.claims.length; _i++) {
+       let claim = this.claims[_i];
+       this.selected.push(claim);
+     }
+      this.deleteMessage = "";
+   }
+   deselectAll(){
+     this.selected = [];
+     this.deleteMessage="";
+   }
+   isSelected(id:string){
+     for (var _i = 0; _i < this.selected.length; _i++) {
+         let claim = this.selected[_i];
+         if(claim['id'] == id){
+              return true;
+         }
+      }
+      return false;
+   }
+
+
+     confirmOpen(){
+       if(this.selected.length <= 0){
+
+       }else{
+         this.alert.cancelButton = true;
+         this.alert.okButton = true;
+         this.alert.alertTitle = "Delete "+this.selected.length+" claim(s)";
+         this.alert.message = this.selected.length+" claims will be deleted. Do you want to proceed? ";
+         this.alert.okButtonText = "Yes";
+         this.alert.cancelButtonText = "No";
+         this.alert.open();
+       }
+     }
+      confirmClose(data){
+       this.delete();
+     }
+   delete(){
+     this.deleteMessage="";
+     this.loading.open();
+     this.claimsDeleted = 0;
+     var ids = [];
+     for (var i = 0; i < this.selected.length; i++){
+        var id  =this.selected[i].id;
+        ids.push(id);
+        // var selected  =this.selected[i].id;
+        // console.warn("Deleting claim with id:"+id);
+        //  this.deleteById(id);
+         //TODO for multiple concurrent
+        }
+         this.batchDeleteById(ids);
+    }
+
+    deleteById(id:string){
+
+         console.warn("Deleting claim with id:"+id);
+         // this._claimService.deleteClaimById(id);
+         this._claimService.deleteClaimById(id).subscribe(
+            res =>  {
+              console.info('Delete response'+res.code );
+              console.warn("Deleted claim with id:"+ id);
+              //remove this claim from the
+             let newClaims=this.claims;
+             for (var _i = 0; _i < this.claims.length; _i++) {
+                 let claim = this.claims[_i];
+                 if(claim['id'] == id){
+                       newClaims.splice(_i, 1);
+                 }
+              }
+              //TODO should call getClaims???
+              this.claimsDeleted++;
+              this.claims = newClaims;
+              if(this.claimsDeleted == this.selected.length){
+                this.resultsNum = this.resultsNum - this.selected.length;
+                this.loading.close();
+                this.selected = [];
+              }
+
+
+           });
+    }
+    batchDeleteById(ids:string[]){
+
+         console.warn("Deleting claim with ids:"+ids);
+         this._claimService.deleteBulk(ids).subscribe(
+            res =>  {
+              console.info('Delete response'+res.code );
+              console.warn("Deleted ids:"+ res.deletedIds);
+              console.warn("Not found ids:"+ res.notFoundIds);
+              //remove this claim from the
+             let newClaims=this.claims;
+             for(var id of res.deletedIds){
+               for (var _i = 0; _i < this.claims.length; _i++) {
+                   let claim = this.claims[_i];
+                   if(claim['id'] == id){
+                         newClaims.splice(_i, 1);
+                   }
+                }
+                for (var _i = 0; _i < this.selected.length; _i++) {
+                    let claim = this.selected[_i];
+                    if(claim['id'] == id){
+                          this.selected.splice(_i, 1);
+                    }
+                 }
+              }
+              this.claims = newClaims;
+              this.resultsNum = this.resultsNum - res.deletedIds.length;
+              this.loading.close();
+              if(res.deletedIds.length>0){
+                  this.deleteMessage=this.deleteMessage+'<div class = "alert alert-success " >'+res.deletedIds.length+' claim(s) successfully deleted.</div>';
+              }
+              if(res.notFoundIds.length>0){
+                  this.deleteMessage=this.deleteMessage+'<div class = "alert alert-warning " >'+res.notFoundIds.length+' claim(s) couldn\'t be deleted.</div>';
+              }
+           });
+    }
+    pageChange($event) {
+      var page:number = +$event.value
+      this.goTo(page);
+    }
+}

portal-2/src/app/claimPages/claims/claimsAdmin.component.ts

@@ -0,0 +1,36 @@
+import {Component, ViewChild, Input} from '@angular/core';
+import {Location} from '@angular/common';
+import {Observable}       from 'rxjs/Observable';
+
+@Component({
+    selector: 'claims-admin',
+    template: `
+    <div *ngIf="user" class="container">
+      <div class="page-header">
+          <h1> Claims Administrator </h1>
+      </div>
+      <div>
+        <div class="text-right"><a  routerLink="/linking">Add more Links?</a></div>
+        <claims enableDelete="true" myClaims="false" isAdim="true"></claims>
+      </div>
+    </div>
+
+
+    <div *ngIf="!user" class="container">
+      TODO login
+    </div>
+    `,
+
+})
+export class ClaimsAdminComponent {
+  constructor ( ) {
+
+  }
+user:string="argirok@di.uoa.gr";
+  ngOnInit() {
+
+
+  }
+
+
+}

portal-2/src/app/claimPages/inlineClaimContext/inlineClaimContext.component.ts

@@ -0,0 +1,98 @@
+import {Component, Input, ViewChild, Output, EventEmitter} from '@angular/core';
+ import {Observable}       from 'rxjs/Observable';
+
+// import {ClaimContextComponent} from '../linking/claimContext/claimContext.component';
+// import {ClaimSelectedContextsComponent} from '../linking/selected/selectedContexts.component';
+import {ClaimInsertComponent} from '../linking/insertClaim/insertClaim.component';
+
+@Component({
+    selector: 'inline-claim-context',
+    template: `
+
+
+     <div *ngIf="showComp" class="panel-body well well-lg">
+       <div class="row" >
+            <claim-contexts   [selectedList]="contexts" (contextsChange)="contextsChange($event)"  inline=true  [showComponent]="showComp" > </claim-contexts>
+
+          <claim-selected-contexts   [contexts]="contexts"
+              (showChange)="showChange($event)"  inline=true [hideType]="inlineType"  > </claim-selected-contexts>
+       </div>
+       <claim-insert (showChange)="showChange($event)" inline=true  [contexts]="contexts" [publications]="publications"  [datasets]="datasets"   showButton=false     ></claim-insert>
+       <button     (click)="insert()"  [class]="(enableButton)?'btn btn-xs btn-primary':'btn btn-primary btn-xs disabled'" style="float:right">Finish </button>
+       <button     (click)="cancel()"  [class]="(enableButton)?'btn btn-xs btn-default ':'btn btn-xs btn-default disabled'" style="float:left">Cancel </button>
+
+  </div>
+`
+
+})
+ export class InlineClaimContextComponent {
+  constructor (  ) {
+
+   }
+
+  @Input() public inlineEntity:any;
+  @Input() public inlineType:string;
+
+
+  contexts=[];
+  publications;
+  datasets;
+  private show = 'context';
+  private showComp:boolean = false;
+  private enableButton:boolean=true;
+  keyword: string = "";
+
+  @Output() contextAdded = new EventEmitter();
+
+@ViewChild (ClaimInsertComponent) claimInsert : ClaimInsertComponent ;
+  ngOnInit() {
+
+  }
+  showChange($event) {
+    this.show=$event.value;
+    if(this.show == "end"){
+      //TODO
+      this.contextAdded.emit({
+        value: this.contexts
+      });
+      this.contexts = [];
+      this.showComponent();
+
+    }else if(this.show == "error"){
+        this.showComponent();
+    }
+  }
+  public toggle(){
+     if(!this.showComp){
+       this.showComponent();
+    }else{
+       this.hideComponent();
+    }
+  }
+  private showComponent(){
+    this.showComp=true;
+    this.enableButton = true;
+
+  }
+  private hideComponent(){
+    this.showComp=false;
+  }
+  private insert(){
+    this.claimInsert.publications = [];
+    this.claimInsert.publications.push(this.inlineEntity);
+    this.publications = [];
+    this.publications.push(this.inlineEntity);
+    console.info(" result: :targetId: " +this.publications[0].id + "targetType :"+ this.publications[0].type+" targetCollectedFrom:"+ this.publications[0].source+ "targetAccessRights :"+this.publications[0].accessRights+ " targetEmbargoEndDate:"+this.publications[0].embargoEndDate);
+    this.enableButton = false;
+    if (!this.claimInsert.validateInsertions()){
+      this.enableButton = true;
+    }
+
+
+  }
+  private cancel(){
+    this.contexts = [];
+
+    this.hideComponent();
+   }
+}

portal-2/src/app/claimPages/inlineClaimProject/inlineClaimProject.component.ts

@@ -0,0 +1,107 @@
+import {Component, Input, ViewChild, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ClaimInsertComponent} from '../linking/insertClaim/insertClaim.component';
+
+@Component({
+    selector: 'inline-claim-project',
+     template: `
+
+
+     <div *ngIf="showComp" class="panel-body well well-lg">
+       <div class="row" >
+            <claim-projects   [selectedProjects]="projects" (projectsChange)="projectsChange($event)"  inline=true > </claim-projects>
+
+          <claim-selected-projects [projects]="projects"
+               (showChange)="showChange($event)"   inline=true [hideType]="inlineType"   > </claim-selected-projects>
+       </div>
+       <claim-insert (showChange)="showChange($event)" inline=true  [projects]="projects" [publications]="publications"  [datasets]="datasets"   showButton=false  ></claim-insert>
+       <button     (click)="insert()"  [class]="(enableButton)?'btn btn-xs btn-primary':'btn btn-primary btn-xs disabled'" style="float:right">Finish </button>
+       <button     (click)="cancel()"  [class]="(enableButton)?'btn btn-xs btn-default ':'btn btn-xs btn-default disabled'" style="float:left">Cancel </button>
+    </div>
+
+
+
+`
+
+})
+ export class InlineClaimProjectComponent {
+  constructor () {
+
+   }
+
+  @Input() public inlineEntity:any;
+  @Input() public inlineType:string;
+
+
+  projects=[];
+  publications;
+  datasets;
+  private show = 'project';
+  private showComp:boolean = false;
+  private enableButton:boolean=true;
+  keyword: string = "";
+
+  @Output() projectAdded = new EventEmitter();
+
+@ViewChild (ClaimInsertComponent) claimInsert : ClaimInsertComponent ;
+  ngOnInit() {
+
+  }
+
+   showChange($event) {
+    this.show=$event.value;
+    if(this.show == "end"){
+      //TODO
+      this.projectAdded.emit({
+        value: this.projects
+      });
+      this.projects = [];
+      this.showComponent();
+    }else if(this.show == "error"){
+        this.showComponent();
+    }
+  }
+  public toggle(){
+    console.info("TOOGLE pr ");
+    if(!this.showComp){
+      console.info("TOOGLE show ");
+      this.showComponent();
+    }else{
+      console.info("TOOGLE hide ");
+      this.hideComponent();
+    }
+  }
+  private showComponent(){
+    this.showComp=true;
+    this.enableButton = true;
+
+  }
+  private hideComponent(){
+    this.showComp=false;
+  }
+  private insert(){
+    if(this.inlineType === 'dataset'){
+        this.datasets = [];
+        this.datasets.push(this.inlineEntity);
+        this.claimInsert.datasets = [];
+        this.claimInsert.datasets.push(this.inlineEntity);
+    }else if(this.inlineType === 'publication'){
+        this.claimInsert.publications = [];
+        this.claimInsert.publications.push(this.inlineEntity);
+        this.publications = [];
+        this.publications.push(this.inlineEntity);
+        console.info(" result: :targetId: " +this.publications[0].id + "targetType :"+ this.publications[0].type+" targetCollectedFrom:"+ this.publications[0].source+ "targetAccessRights :"+this.publications[0].accessRights+ " targetEmbargoEndDate:"+this.publications[0].embargoEndDate);
+    }
+    this.enableButton = false;
+    if (!this.claimInsert.validateInsertions()){
+      this.enableButton = true;
+    }
+
+
+  }
+  private cancel(){
+    this.projects = [];
+
+    this.hideComponent();
+   }
+}

portal-2/src/app/claimPages/inlineClaimResult/inlineClaimResult.component.ts

@@ -0,0 +1,117 @@
+import {Component, Input, ViewChild, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ClaimInsertComponent} from '../linking/insertClaim/insertClaim.component';
+// import {ClaimResultComponent} from '../linking/claimResult/claimResult.component';
+// import {ClaimSelectedResultsComponent} from '../linking/selected/selectedResults.component';
+
+@Component({
+    selector: 'inline-claim-result',
+    template: `
+
+
+     <div *ngIf="showComp" class="panel-body well well-lg">
+       <div class="row" >
+            <claim-result   [selectedDatasets]="datasets" [selectedPublications]="publications" (datasetsChange)="datasetsChange($event)" (publicationsChange)="publicationsChange($event)"   inline=true  > </claim-result>
+
+<!-- ClaimSelectedResultsComponent -->
+          <claim-selected-results   [publications]="publications"  [datasets]="datasets"
+           (datasetsChange)="datasetsChange($event)" (publicationsChange)="publicationsChange($event)"
+              (showChange)="showChange($event)"   inline=true [hideType]="hideType"  [showAccessRights]=true  > </claim-selected-results>
+       </div>
+       <claim-insert (showChange)="showChange($event)" inline=true [publications]="publications"  [datasets]="datasets"   showButton=false [inlineEntity]="inlineEntity" ></claim-insert>
+       <button     (click)="insert()"  [class]="(enableButton)?'btn btn-xs btn-primary':'btn btn-primary btn-xs disabled'" style="float:right">Finish </button>
+       <button     (click)="cancel()"  [class]="(enableButton)?'btn btn-xs btn-default ':'btn btn-xs btn-default disabled'" style="float:left">Cancel </button>
+    </div>
+
+
+
+`
+
+})
+ export class InlineClaimResultComponent {
+  constructor () {
+
+   }
+  // This is the component from the landing page
+  @Input() public inlineEntity:any;
+  @Input() public inlineType:string;
+  private hideType:string;
+
+
+
+  publications = [];
+  datasets = [];
+  private show = 'project';
+  private showComp:boolean = false;
+  private enableButton:boolean=true;
+  keyword: string = "";
+
+@Output() datasetAdded = new EventEmitter();
+@Output() publicationAdded = new EventEmitter();
+
+@ViewChild (ClaimInsertComponent) claimInsert : ClaimInsertComponent ;
+  ngOnInit() {
+    console.info("Inline entity:"+this.inlineEntity.id);
+    this.hideType = this.inlineType;
+    if(this.inlineType == 'dataset' || this.inlineType == 'publication' ){
+      this.hideType = "";
+    }
+  }
+
+ datasetsChange($event) {
+   this.datasets=$event.value;
+   console.log($event.value);
+  }
+  publicationsChange($event) {
+    this.publications=$event.value;
+    console.log($event.value);
+   }
+  showChange($event) {
+    this.show=$event.value;
+    if(this.show == "end"){
+      this.datasetAdded.emit({
+        value: this.datasets
+      });
+      this.publicationAdded.emit({
+        value: this.publications
+      });
+      this.datasets = [];
+      this.publications = [];
+      this.showComponent();
+    }else if(this.show == "error"){
+        this.showComponent();
+    }
+  }
+  public toggle(){
+    if(!this.showComp){
+      this.showComponent();
+    }else{
+      this.hideComponent();
+    }
+  }
+  private showComponent(){
+    this.showComp=true;
+    this.enableButton = true;
+
+  }
+  private hideComponent(){
+    this.showComp=false;
+  }
+  private insert(){
+   if(this.inlineType === 'project'){ //TODO check if neccessary
+      this.claimInsert.projects = [];
+      this.claimInsert.projects.push(this.inlineEntity);
+    }
+
+    this.enableButton = false;
+    if (!this.claimInsert.validateInsertions()){
+      this.enableButton = true;
+    }
+
+  }
+  private cancel(){
+    this.datasets = [];
+    this.publications = [];
+    this.hideComponent();
+   }
+}

portal-2/src/app/claimPages/linking/bulkClaim/bulkClaim.component.ts

@@ -0,0 +1,171 @@
+import {Component, Input, Output, EventEmitter,ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {SearchCrossrefService} from '../../../services/searchCrossref.service';
+import {ModalLoading} from '../../../common/modal/loading.component';
+
+
+
+@Component({
+    selector: 'bulk-claim',
+    template: `
+    <form class="form-inline">
+      <div class="form-group">
+        <label for="exampleInputFile">File input</label>
+        <input id="exampleInputFile"  type="file"  (change)="fileChangeEvent($event)" placeholder="Upload file..." />
+      </div>
+      <div class="form-group">
+        <button class="btn btn-success" type="button" (click)="upload()">Upload</button>
+      </div>
+    </form>
+    <p class="help-block">Upload a csv file with DOIs. For each DOI, metadata will be fetched from CrossRef. Available Results can be linked with the selected Projects and Contexts</p>
+    <div *ngIf="showReport" class="alert alert-info" role="alert" >
+    {{all}} DOIs found in . {{found}} fetched from CrossRef, {{duplicate}} were duplicates and {{notFound}} not found in crossref.
+
+    </div>
+      <div *ngIf="errorMessage.length > 0 "> <div class="alert alert-danger" role="alert">{{errorMessage}}</div></div>
+    <modal-loading [message]= "'Please wait...'"></modal-loading>
+    `
+
+})
+//[(ngModel)]="date"
+export class BulkClaimComponent {
+  filesToUpload: Array<File>;
+  navigateTo: string = "Search";
+  source: string = "crossref";
+  type : string = "publication";
+  resultsFromSearch:number;
+  @Input() public select:boolean = true ;
+  @Input() public publications;
+  // @Output() publicationsChange = new EventEmitter();
+  all:number = 0;
+  allIds:string[] = [];
+  found:number = 0;
+  foundIds:string[] = [];
+  duplicate:number = 0;
+  duplicateIds:string[] = [];
+  notFound:number = 0;
+  notFoundIds:string[] = [];
+  todayDate = '';
+  nextDate = '';
+  showReport:boolean = false;
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  errorMessage = "";
+  infoMEssage = "";
+  constructor(private _searchCrossrefService: SearchCrossrefService) {
+      this.filesToUpload = [];
+      var myDate = new Date();
+      this.todayDate = myDate.getFullYear()+ "-" +(myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+      this.nextDate =  (myDate.getFullYear()+100)+ "-" +(myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+
+  }
+  ngOnInit() {}
+
+  upload() {
+    this.showReport = false;
+    this.errorMessage = "";
+    if(this.filesToUpload.length == 0){
+      this.errorMessage = "There is no selected file to upload.";
+      return ;
+    }
+    this.makeFileRequest("http://localhost:8000/upload", [], this.filesToUpload).then((result) => {
+          var k = (result as any).split('\n');  // I have used space, you can use any thing.
+          var i = 0;
+          this.all = 0;
+          this.duplicate = 0;
+          this.duplicateIds = [];
+          this.allIds = [];
+          this.found = 0;
+          this.foundIds = [];
+          this.publications.slice(0,this.publications.length);
+          this.notFound = 0;
+          this.notFoundIds = [];
+
+          for(i=0;i<k.length;i++){
+            if(k[i] && k[i] != null ){
+
+              this.all++;
+              var id=k[i];
+              if(this.allIds.indexOf(id)>-1){
+                this.duplicate++;
+                this.duplicateIds.push(id);
+              }else{
+                this.allIds.push(id);
+                this.fetchResult(id);
+              }
+             }
+
+         }
+
+       }, (error) => {
+          console.error(error);
+          // this.loading.close();
+          this.errorMessage = "An error occured while uploading...";
+      });
+  }
+
+
+  fileChangeEvent(fileInput: any){
+      this.filesToUpload = <Array<File>> fileInput.target.files;
+  }
+
+  makeFileRequest(url: string, params: Array<string>, files: Array<File>) {
+      return new Promise((resolve, reject) => {
+          var formData: any = new FormData();
+          var xhr = new XMLHttpRequest();
+          for(var i = 0; i < files.length; i++) {
+              formData.append("uploads[]", files[i], files[i].name);
+          }
+          xhr.onreadystatechange = function () {
+              if (xhr.readyState == 4) {
+                  if (xhr.status == 200) {
+                      resolve(xhr.response);
+                  } else {
+                      reject(xhr.response);
+                  }
+              }
+          }
+          xhr.open("POST", url, true);
+          xhr.send(formData);
+      });
+  }
+
+  fetchResult(id:string){
+        this._searchCrossrefService.searchCrossrefByDOI(id).subscribe(
+          data => {
+
+            var crossrefResult = data.items[0];
+            if(data.items.length > 0){
+               this.found++;
+              this.foundIds.push(id);
+              var result = {id: id, type :'publication', source : 'crossref',
+              title: crossrefResult.title,url: crossrefResult.URL, result: crossrefResult, accessRights: 'OPEN', embargoEndDate: this.nextDate, date : crossrefResult.created['date-time']};
+              this.publications.push(result);
+              // this.publicationsChange.emit({
+              //    value: this.publications
+              //  });
+
+            }else{
+               this.notFound++;
+              this.notFoundIds.push(id);
+            }
+            this.endOfFetching();
+           },
+          err => {
+            console.error(err);
+            this.notFound++;
+            this.notFoundIds.push(id);
+            this.endOfFetching();
+          }
+        );
+  }
+
+  endOfFetching(){
+    console.info("here");
+    if(this.all == this.found+this.notFound+ this.duplicate ){
+      this.showReport = true;
+      // this.loading.close();
+      console.debug("theeere");
+    }
+
+  }
+}

portal-2/src/app/claimPages/linking/bulkLinking.component.ts

@@ -0,0 +1,16 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+@Component({
+    selector: 'bulk-linking',
+    //providers: [MdRadioDispatcher],
+        template: `
+         <linking-generic [bulkMode]=true> </linking-generic>
+    `
+
+})
+//[(ngModel)]="date"
+export class BulkLinkingComponent {
+  constructor () {
+   }
+}

portal-2/src/app/claimPages/linking/claimContext/claimContext.component.ts

@@ -0,0 +1,240 @@
+import {Component, Input,Output, ElementRef, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ContextsService} from '../../../services/contexts.service';
+
+
+@Component({
+    selector: 'claim-contexts',
+    template: `
+        <div class="panel-body" >
+
+        <div class="input-group" *ngIf="!inline">
+          <div class=" input-group-btn">
+              <button class="btn btn-success dropdown-toggle" type="button" id="communityDropDown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                {{selectedCommunityLabel}}
+
+              </button>
+              <ul class="dropdown-menu" aria-labelledby="communityDropDown">
+                <li  (click)="communityChanged('0','Community:')"><a  >Community:</a></li>
+                <li *ngIf="communities"  (click)="communityChanged(communities.id, communities.label)"  ><a  >{{communities.label}}</a></li>
+
+              </ul>
+            </div>
+            <div class="input-group-btn ">
+              <button class="btn btn-success dropdown-toggle" type="button" id="categoryDropDown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                {{selectedCategoryLabel}}
+
+              </button>
+              <ul class="dropdown-menu" aria-labelledby="categoryDropDown">
+                <li  (click)="categoryChanged('0','Category:')"><a  >Category:</a></li>
+                <li *ngFor="let category of categories"  (click)="categoryChanged(category.id, category.label)"  ><a  >{{category.label}}</a></li>
+
+              </ul>
+            </div>
+
+          <input id="community" type="text" class="validate filter-input form-control" placeholder="Search for contexts" [(ngModel)]=query (keyup)=filter() >
+        </div>
+        <div class=" form-horizontal" *ngIf=" inline && showComponent ">
+        <div    class=" form-group ">
+            <button class="btn btn-xs btn-success dropdown-toggle" type="button" id="communityDropDown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+              {{selectedCommunityLabel}}
+
+            </button>
+            <ul   class="dropdown-menu custom-hidden-dropdown-menu" aria-labelledby="communityDropDown">
+              <li  (click)="communityChanged('0','Community:')"><a  >Community:</a></li>
+              <li *ngIf="communities"  (click)="communityChanged(communities.id, communities.label)"  ><a  >{{communities.label}}</a></li>
+
+            </ul>
+          </div>
+          <div    class="form-group ">
+            <button class="btn btn-xs btn-success dropdown-toggle" type="button" id="categoryDropDown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+              {{selectedCategoryLabel}}
+
+            </button>
+            <ul class="dropdown-menu custom-hidden-dropdown-menu" aria-labelledby="categoryDropDown">
+              <li  (click)="categoryChanged('0','Category:')"><a  >Category:</a></li>
+              <li *ngFor="let category of categories"  (click)="categoryChanged(category.id, category.label)"  ><a  >{{category.label}}</a></li>
+
+            </ul>
+          </div>
+          <div class="form-group">
+            <input id="community" type="text" class="validate filter-input input-sm form-control" placeholder="Search for contexts" [(ngModel)]=query (keyup)=filter()   >
+          </div>
+      </div>
+      <div class="suggestions" *ngIf="filteredList.length > 0">
+                <ul class="list-group" >
+                    <li  class="list-group-item"   *ngFor=" let item of filteredList">
+                        <a (click)="select(item)">{{item.label}}</a>
+                    </li>
+                </ul>
+      </div>
+     </div>
+     <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+     <div *ngIf="infoMessage.length > 0" class="alert alert-info" role="alert">{{infoMessage}}</div>
+        `
+
+})
+export class ClaimContextComponent {
+   ngOnInit() {
+this.getCommunities();
+
+}
+@Input() public inline:boolean = false ; // for claimed started from landing pages
+@Input() public showComponent:boolean = true ; // for claimed started from landing pages
+
+public query = '';
+public filteredList = [];
+@Input() public selectedList ;
+public elementRef;
+// @Output() contextsChange = new EventEmitter();
+
+public communities:string[];
+@Input() public selectedCommunityId:string = "0";
+ selectedCommunityLabel:string = "Community:";
+@Output() cselectedCommunityChange = new EventEmitter();
+
+public categories:string[];
+@Input() public selectedCategoryId:string ="0";
+selectedCategoryLabel:string ="Category:";
+@Output() selectedCategoryChange = new EventEmitter();
+public concepts:string[];
+public warningMessage = "";
+public infoMessage = "";
+
+constructor(private _contextService: ContextsService,myElement: ElementRef) {
+    this.elementRef = myElement;
+}
+
+filter() {
+  this.warningMessage = "";
+  this.infoMessage = "";
+  if(this.selectedCommunityId == "0"){
+    this.warningMessage = "Please select Community";
+  }else if (this.query !== ""){
+    this.warningMessage = "";
+    this.infoMessage = "";
+    if(this.selectedCategoryId == "0"){
+      this.warningMessage = "Specify category for more concepts";
+    }
+    this.filteredList = this.concepts.filter(function(el){
+          return el.label.toLowerCase().indexOf(this.query.toLowerCase()) > -1;
+      }.bind(this));
+      if(this.filteredList.length == 0 ){
+        this.infoMessage = "No results found";
+      }
+  }else{
+      this.filteredList = [];
+  }
+}
+
+select(item){
+    this.query = "";
+    this.filteredList = [];
+    var context= { community: this.selectedCommunityLabel, category: this.selectedCategoryLabel, concept: item };
+    var found:boolean = false;
+    this.warningMessage = "";
+    for (var _i = 0; _i < this.selectedList.length; _i++) {
+        let item = this.selectedList[_i];
+        if(item.concept.id == context.concept.id){
+              found=true;
+              this.warningMessage = "Concept already in selected list";
+        }
+     }
+    if (!found) {
+      this.selectedList.push(context);
+      // this.contextsChange.emit({
+      //    value: this.selectedList
+      //  });
+    }
+    // var index:number =this.selectedList.indexOf(context);
+    // if (index == -1) {
+    //   this.selectedList.push(context);
+    //   this.contextsChange.emit({
+    //      value: this.selectedList
+    //    });
+    // }
+
+}
+// remove(item){
+//   var index:number =this.selectedList.indexOf(item);
+//    if (index > -1) {
+//       this.selectedList.splice(index, 1);
+//   }
+//   this.contextsChange.emit({
+//     value: this.selectedList
+//   });
+// }
+handleClick(event){
+ var clickedComponent = event.target;
+ var inside = false;
+ do {
+     if (clickedComponent === this.elementRef.nativeElement) {
+         inside = true;
+     }
+    clickedComponent = clickedComponent.parentNode;
+ } while (clickedComponent);
+  if(!inside){
+      this.filteredList = [];
+  }
+}
+getCommunities ()  {
+  this._contextService.getCommunities().subscribe(
+    data => {
+      this.communities = data.communities;
+      // var concept= ["{id: this.communities['id'], label: this.communities['label']  }"];
+      //  this.filteredList.push(concept);
+      //  this.concepts.push(concept);
+     },
+    err => console.error(err)
+  );
+ }
+ getCategories ()  {
+   this.categories=[];
+   if(this.selectedCommunityId != '0'){
+     this._contextService.getCategories(this.selectedCommunityId).subscribe(
+       data => {
+         this.categories = data.category;
+         this.concepts = [];
+         this.filteredList = [];
+         if (this.query !== ""){
+           this.filter();
+         }
+
+        },
+       err => console.error(err)
+     );
+   }
+  }
+  getConcepts ()  {
+    if(this.selectedCategoryId != '0'){
+      this._contextService.getConcepts(this.selectedCategoryId, "").subscribe(
+        data => {
+          this.concepts = data.concept;
+          if (this.query !== ""){
+            this.filter();
+          }
+         },
+        err => console.error(err)
+      );
+    }else{
+      this.concepts=[];
+    }
+   }
+communityChanged(communityId:string, communityLabel:string){
+  this.warningMessage = "";
+  this.infoMessage = "";
+  this.selectedCommunityId= communityId;
+  this.selectedCommunityLabel= communityLabel;
+  this.getCategories();
+
+}
+categoryChanged(categoryId:string, categoryLabel:string){
+  this.warningMessage = "";
+  this.infoMessage = "";
+  this.selectedCategoryId = categoryId;
+  this.selectedCategoryLabel = categoryLabel;
+  this.getConcepts();
+
+}
+
+}

portal-2/src/app/claimPages/linking/claimProject/claimProject.component.ts

@@ -0,0 +1,201 @@
+import {Component, Input,Output, ElementRef, EventEmitter, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {OpenaireProjectsService} from '../../../services/openaireProjects.service';
+import {ProjectService} from '../../../services/project.service';
+import {ModalLoading} from '../../../common/modal/loading.component';
+import { Subject } from 'rxjs/Subject';
+
+
+@Component({
+    selector: 'claim-projects',
+    template: `
+        <div class="panel-body" >
+
+          <!--  <select  [(ngModel)]="selectedFunderId" (ngModelChange)="funderChanged()" >
+              <option   [ngValue]="'0'">Funder:</option>
+              <option *ngFor="let funder of funders" [ngValue]="funder.field.field[1]['@value_original']">{{funder.field.field[1]['@value']}}</option>
+            </select> -->
+
+            <form *ngIf=" !inline ">
+               <div class="input-group">
+                <div  class="input-group-btn"  >
+                   <button type="button"  class="btn btn-info dropdown-toggle" id="dropdownFunder" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                    {{selectedFunderName}}
+                   </button>
+                  <ul class="dropdown-menu " aria-labelledby="dropdownFunder">
+                    <li  (click)="funderChanged('0','Select funder:')"><a  >Select funder:</a></li>
+                    <li *ngFor="let funder of funders"  (click)="funderChanged(funder.field.field[1]['@value_original'],funder.field.field[1]['@value'])"  ><a  >{{funder.field.field[1]['@value']}}</a></li>
+
+                  </ul>
+                </div>
+                <input  id="community" type="text" class="form-control"   placeholder="Search for Projects" [(ngModel)]=query  name="query"  (keyup)="search()" >
+              </div>
+            </form>
+            <form *ngIf=" inline " class="form-horizontal">
+               <div class="">
+                <div class="form-group"  >
+                   <button type="button"  class="btn btn-xs btn-info dropdown-toggle" id="dropdownFunder" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                    {{selectedFunderName}}
+                   </button>
+                  <ul class="dropdown-menu custom-hidden-dropdown-menu" aria-labelledby="dropdownFunder">
+                    <li  (click)="funderChanged('0','Select funder:')"><a  >Select funder:</a></li>
+                    <li *ngFor="let funder of funders"  (click)="funderChanged(funder.field.field[1]['@value_original'],funder.field.field[1]['@value'])"  ><a  >{{funder.field.field[1]['@value']}}</a></li>
+
+                  </ul>
+                </div>
+                <div class="form-group">  <input  id="community" type="text" class="form-control input-sm"  (keyup)="search(query)"  placeholder="Search for Projects" [(ngModel)]=query   name="query" ></div>
+              </div>
+            </form>
+            <div class="suggestions" >
+                    <ul class="list-group"  >
+                        <li  *ngFor=" let item of filteredList | async " class="list-group-item" >
+                            <a (click)="select(item)"> {{(item.field[1]['@value'])?item.field[1]['@value']+" - ":""}} {{item.field[3]['@value']}}</a>
+                        </li>
+                    </ul>
+            </div>
+
+
+        </div>
+        <modal-loading [message]= "'Loading...'"></modal-loading>
+        <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+        <div *ngIf="infoMessage.length > 0" class="alert alert-info" role="alert">{{infoMessage}}</div>
+        `
+
+})
+export class ClaimProjectsComponent {
+   ngOnInit() {
+     this.getFunders();
+   }
+   @ViewChild (ModalLoading) loading : ModalLoading ;
+
+  @Input() public inline: boolean = false ; // for claimed started from landing pages
+  public query = '';
+  // public filteredList = [];
+  @Input() public selectedProjects=[] ;
+  public elementRef;
+
+  public funders:string[];
+  @Input() public selectedFunderId:string ="0";
+  selectedFunderName:string ="Select funder:";
+  @Output() cselectedFunderChange = new EventEmitter();
+
+  public projects:string[];
+  public warningMessage = "";
+  public infoMessage = "";
+
+  private searchTermStream = new Subject<string>();
+search() {
+  console.info("term changed!!!");
+  this.searchTermStream.next(this.query); }
+filteredList: Observable<{}> = this.searchTermStream
+  .debounceTime(300).
+  distinctUntilChanged()
+  .switchMap((term: string) =>   this._projectService.searchForProjectsObs(term, this.selectedFunderId));
+
+
+constructor(private _service: ProjectService,private _projectService: OpenaireProjectsService,myElement: ElementRef) {
+    this.elementRef = myElement;
+}
+
+filter() {
+  console.info("Search projects");
+  if (this.selectedFunderId == '0' ){
+    this.warningMessage = "Please select a funder first";
+    this.infoMessage = "";
+  }else if ( this.query == "" || this.query.length < 3){
+    this.warningMessage = "Please type a keyword, containing at least 3 characters"
+    this.infoMessage = "";
+  }else{
+    this.warningMessage = "";
+    this.infoMessage = "";
+    this.loading.open();
+    this._projectService.searchForProjects(this.query, this.selectedFunderId).subscribe(
+      data => {
+        this.filteredList =(data == null)?[]:data;
+        this.infoMessage = (data == null)?"No Results found":"";
+        this.loading.close();
+       },
+      err => {
+        console.error(err);
+        this.loading.close();
+        this.warningMessage = "An error occured";
+
+      }
+    );
+  }
+}
+
+select(item){
+    this.query = "";
+    var project= { funderId: this.selectedFunderId,funderName: this.selectedFunderName, projectId: item.field[0]['@value'], projectName: item.field[3]['@value'] , projectAcronym: item.field[1]['@value'], startDate: null, endDate: null };
+    this._service.getProjectDates(project.projectId).subscribe(
+      data => {
+          project.startDate = data.startDate;
+          project.endDate = data.endDate;
+      },
+      err => console.error(err)
+    );
+    var index:number =this.selectedProjects.indexOf(project);
+    var found:boolean = false;
+    this.warningMessage = "";
+
+    for (var _i = 0; _i < this.selectedProjects.length; _i++) {
+        let item = this.selectedProjects[_i];
+        if(item.projectId == project.projectId){
+              found=true;
+              this.warningMessage = "Project already in selected list";
+        }
+     }
+    if (!found) {
+      this.selectedProjects.push(project);
+
+    }
+
+}
+remove(item){
+  var index:number =this.selectedProjects.indexOf(item);
+   if (index > -1) {
+      this.selectedProjects.splice(index, 1);
+  }
+
+}
+handleClick(event){
+ var clickedComponent = event.target;
+ var inside = false;
+ do {
+     if (clickedComponent === this.elementRef.nativeElement) {
+         inside = true;
+     }
+    clickedComponent = clickedComponent.parentNode;
+ } while (clickedComponent);
+  // if(!inside){
+  //   this.query = "";
+  //   this.filteredList = this.searchTermStream
+  //     .debounceTime(300).
+  //     distinctUntilChanged()
+  //     .switchMap((term: string) =>  this._projectService.searchForProjectsObs(term, this.selectedFunderId));
+  // }
+}
+getFunders ()  {
+  console.info("Getting Funders....");
+  this._projectService.getFunders().subscribe(
+    data => {
+      this.funders = data;
+     },
+    err => console.error(err)
+  );
+ }
+
+  getProjects ()  {
+    if(this.selectedFunderId != '0'){
+
+    }
+   }
+funderChanged(funderId:string, funderName:string){
+  this.selectedFunderId = funderId;
+  this.selectedFunderName = funderName;
+  console.info("Selected funder:"+this.selectedFunderId+ ' name:'+funderName );
+
+}
+
+}

portal-2/src/app/claimPages/linking/claimResult/claimDataset/claimDataset.component.ts

@@ -0,0 +1,156 @@
+import { Component, Input, Output, EventEmitter} from '@angular/core';
+import { Observable }       from 'rxjs/Observable';
+import { SearchDataciteService } from '../../../../services/searchDatacite.service';
+
+
+@Component({
+    selector: 'claim-dataset',
+     template: `
+
+  <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+  <div *ngIf="infoMessage.length > 0" class="alert alert-info" role="alert">{{infoMessage}}</div>
+
+    <div class="panel ">
+      <div class="">
+
+        <ul class="nav nav-tabs">
+           <li class="active"><a data-toggle="tab" href="#datacite">Datacite ({{(dataciteResultsNum==null)?'0':dataciteResultsNum}})</a></li>
+           <li><a data-toggle="tab" href="#openaire">Openaire  ({{(openaireResultsNum==null)?'0':openaireResultsNum}})</a></li>
+        </ul>
+        <div class="tab-content">
+           <div id="datacite" class="tab-pane fade in active">
+              <div class = "panel-body">
+                 <div *ngIf="dataciteResultsNum != null && dataciteResultsNum > 0">
+                    <p > {{dataciteResultsNum   }} Total Results </p>
+                    <paging-no-load [currentPage]="page" [totalResults]="dataciteResultsNum" [navigateTo]="navigateTo" [term]="keyword" [size]="size"  (pageChange)="pageChange($event)"> </paging-no-load>
+                 </div>
+                 <div *ngIf="dataciteResultsNum == null || dataciteResultsNum == 0" class="alert alert-info" role="alert">No results found</div>
+                 <div >
+                  <!--  <p *ngFor=" let item of dataciteResults ">
+                    <publication-title [title]="item.title" [url]="'http://dx.doi.org/'+item.doi" > </publication-title>
+                     <button (click)="add(item, item.doi,'dataset','datacite',item.title,'http://dx.doi.org/'+item.doi)"   type="button" class="btn btn-default">Select</button>
+                     </p>
+-->
+                     <ul *ngIf="dataciteResults.length > 0 "  class="list-group">
+                        <li *ngFor=" let item of dataciteResults "  [class]="(isSelected(item.doi))?'list-group-item panel-footer':'list-group-item'" >
+                         <span >
+                          <a *ngIf="item.doi" target="_blank" href="{{'http://dx.doi.org/'+item.doi}}" >{{item.title}}</a>
+                          <span *ngIf="!item.doi" >{{item.title}}</span>
+                        </span>
+                         <span  *ngIf="!isSelected(item.doi)" (click)="add(item, item.doi,'dataset','datacite',item.title,'http://dx.doi.org/'+item.doi, null)" aria-hidden="true" class= " btn glyphicon glyphicon-plus"></span>
+                       </li>
+                   </ul>
+
+                 </div>
+              </div>
+            </div>
+            <div id="openaire" class="tab-pane fade">
+              <div class = "panel-body">
+                <div class = "alert alert-info " >  Under Development....
+              </div>
+               <div *ngIf="openaireResultsNum == null || openaireResultsNum == 0" class="alert alert-info" role="alert">No results found</div>
+            </div>
+        </div>
+      </div>
+    </div>
+
+    `
+})
+export class ClaimDatasetComponent {
+  constructor (private _searchDataciteService: SearchDataciteService) {
+    var myDate = new Date();
+    this.todayDate = myDate.getFullYear()+ "-" +(myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+    this.nextDate =  (myDate.getFullYear()+100)+ "-" +(myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+
+  }
+  ngOnInit() {
+    if(this.keyword !=null && this.keyword.length > 0){
+     this.searchDatacite(this.keyword,this.size,this.page);
+   }
+}
+
+  private page : number = 1;
+  private size:number = 10;
+  private navigateTo: string = "Search";
+  private source: string = "datacite";
+  private type : string = "dataset";
+  @Input() public select:boolean = true ;
+  @Input() public keyword:string = '';
+  @Input() public selectedDatasets = [] ;
+  @Output() datasetsChange = new EventEmitter();
+
+  dataciteResults=[];
+  dataciteResultsNum : Observable<number> = null;
+  openaireResults=[];
+  openaireResultsNum : Observable<number> = null ;
+
+  public warningMessage = "";
+  public infoMessage = "";
+
+  private todayDate = '';
+   private nextDate = '';
+   public search(term: string, size : number, page : number){
+     this.searchDatacite(term,10,1);
+     //TODO add openaire search
+   }
+    private searchDatacite (term: string, size : number, page : number) {
+      this.getDataciteResults(term,size,page);
+      this.warningMessage = "";
+      this.infoMessage = "";
+
+     }
+
+   getDataciteResults (term: string, size : number, page : number)  {
+       this._searchDataciteService.searchDataciteResults(term, size, page).subscribe(
+        data => {
+          this.dataciteResults = data.docs;
+          this.page=page;
+          this.dataciteResultsNum = data.numFound;
+        },
+        err => console.error(err)
+      );
+      }
+
+   add(item, itemId,itemType,itemSource,itemTitle, itemUrl, date){
+     var result ;
+      if(itemSource == 'datacite'){
+        result = {id: itemId, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: 'OPEN', embargoEndDate: this.nextDate, date : date};
+      }else if (itemSource == 'openaire'){
+
+      }
+      var found:boolean = this.isSelected( result.id);
+      this.warningMessage = "";
+       if (!found) {
+        this.selectedDatasets.push(result);
+        this.datasetsChange.emit({
+           value: this.selectedDatasets
+         });
+      }else{
+        this.warningMessage = "Dataset already in selected list";
+      }
+
+   }
+
+
+   pageChange($event) {
+     this.page=$event.value;
+     this.dataciteResults=[];
+     this.searchDatacite(this.keyword,10,this.page);
+     this.warningMessage = "";
+     this.infoMessage = "";
+
+   }
+   isSelected(id:string){
+
+     var found:boolean = false;
+     this.warningMessage = "";
+     for (var _i = 0; _i < this.selectedDatasets.length; _i++) {
+         let item = this.selectedDatasets[_i];
+         if(item.id == id){
+               found=true;
+               break;
+          }
+      }
+      return found;
+   }
+}

portal-2/src/app/claimPages/linking/claimResult/claimPublication/claimPublication.component.html

@@ -0,0 +1,76 @@
+
+<div class="panel">
+  <ul class="nav nav-tabs">
+  <li class="active"><a data-toggle="tab" href="#crossref">Crossref ({{(crossrefResultsNum)?crossrefResultsNum:0}})</a></li>
+  <li><a data-toggle="tab" href="#openaire">Openaire  ({{   (openaireResultsNum)?openaireResultsNum:0 }})</a></li>
+  <li><a data-toggle="tab" href="#orcid">Orcid  ({{  (orcidResultsNum)?orcidResultsNum:0}})</a></li>
+  </ul>
+  <div class="tab-content">
+    <div id="crossref" class="tab-pane fade in active">
+      <div  class="panel-body" >
+         <div *ngIf="crossrefResultsNum != null && crossrefResultsNum > 0">
+           <paging-no-load [currentPage]="page" [totalResults]="crossrefResultsNum" [navigateTo]="navigateTo" [term]="keyword" [size]="size"  (pageChange)="pageChange($event)"> </paging-no-load>
+         </div>
+         <div >
+           <ul *ngIf="crossrefResults.length > 0 "  class="list-group">
+              <li *ngFor=" let item of crossrefResults " [class]="(isSelected(item.DOI))?'list-group-item panel-footer':'list-group-item'">
+               <span >
+              <a *ngIf="item.URL" target="_blank" href="{{item.URL}}" >{{item.title}}</a>
+              <span *ngIf="!item.URL" >{{item.title}}</span>
+              </span>
+               <span *ngIf="!isSelected(item.DOI)" (click)="add(item, item.DOI, 'crossref', 'publication', item.URL, item.title, item.created['date-time'])" aria-hidden="true" class= " btn glyphicon glyphicon-plus"></span>
+             </li>
+         </ul>
+         <div *ngIf="crossrefResults.length == 0" class = "alert alert-info " > No results found  </div>
+        </div>
+      </div>
+    </div>
+    <div id="openaire" class="tab-pane fade">
+      <div class = "panel-body">
+        <div class = "alert alert-info " >  Under Development....
+        </div>
+    </div>
+    </div>
+    <div id="orcid" class="tab-pane fade">
+      <div class="panel-body" >
+        <div *ngIf="orcidResultsNum == null" class = "alert alert-info " > No results found  </div>
+
+         <div *ngIf="orcidResultsNum != null" class="panel-body">
+           <div class = "alert alert-warning " >  Not the right author? Choose one of these:
+
+             <span class="dropdown">
+               <button  class=" btn btn-default dropdown-toggle" type= "button" data-toggle="dropdown" id="orcidDropDown"  data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                 Selected: {{authorGivenName}} {{authorFamilyName}}
+               </button>
+               <ul class="dropdown-menu " aria-labelledby="orcidDropDown">
+                 <li *ngFor=" let item of authorIds let i = index" > <a (click)="getOrcidResultsById(i)" >
+                     {{authorGivenNames[i]}} {{authorFamilyNames[i]}} : {{item}} </a>
+                 </li>
+
+               </ul>
+             </span>
+
+
+           </div>
+             <span>Results for
+               <a target="_blank" href="http://orcid.org/{{authorId}}"> {{authorGivenName}} {{authorFamilyName}} - {{authorId}}  </a> :
+             </span>
+
+             <div *ngIf=" ((orcidResultsNum >0) && (totalPages > 1) && ( 0 < page &&  page <= totalPages )) " >
+             <paging-no-load [currentPage]="page" [totalResults]="orcidResultsNum" [navigateTo]="navigateTo" [term]="keyword" [size]="size"  (pageChange)="orcidPageChange($event)"> </paging-no-load>
+
+             </div>
+                   <div >
+                    <ul *ngIf="orcidResultsNum >0  && orcidResultsToShow.length > 0 "  class="list-group">
+                       <li *ngFor=" let item of orcidResultsToShow "  [class]="(isSelected(authorId+'-'+item['put-code']))?'list-group-item panel-footer':'list-group-item'">
+                        <span *ngIf="!item.URL" >{{item['work-title']['title'].value}}</span>
+                         <span *ngIf="!isSelected(authorId+item['put-code'])" (click)="add(item,authorId+'-'+item['put-code'],'orcid', 'publication', '', item['work-title']['title'].value, item['publication-date']?item['publication-date'].year.value :null)" aria-hidden="true" class= " btn glyphicon glyphicon-plus"></span>
+                      </li>
+                    </ul>
+                    <div *ngIf="orcidResultsNum == 0" class = "alert alert-info " > No results found  </div>
+                  </div>
+         </div>
+       </div>
+     </div>
+  </div>
+</div>

portal-2/src/app/claimPages/linking/claimResult/claimPublication/claimPublication.component.ts

@@ -0,0 +1,292 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { ActivatedRoute } from '@angular/router';
+import {SearchCrossrefService} from '../../../../services/searchCrossref.service';
+import {SearchOrcidService} from '../../../../services/searchOrcid.service';
+
+
+@Component({
+    selector: 'claim-publication',
+    templateUrl: 'claimPublication.component.html',
+
+})
+export class ClaimPublicationComponent {
+  constructor (private _searchCrossrefService: SearchCrossrefService,private _searchOrcidService: SearchOrcidService,
+  private route: ActivatedRoute) {
+    var myDate = new Date();
+    this.todayDate = myDate.getFullYear()+ "-" +(myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+    this.nextDate =  (myDate.getFullYear()+100)+ "-01-01" ;
+
+  }
+  ngOnInit() {
+    this.sub = this.route.params.subscribe(params => {
+      let page = +params['page'];
+      let size = +params['size'];
+      this.page = ( page <= 0 ) ? 1 : page;
+      this.size = ( size <= 0 ) ? 10 : size;
+       if(this.keyword !=null && this.keyword.length > 0){
+        this.search(this.keyword,this.size,this.page);
+      }
+    });
+
+}
+ngOnDestroy() {
+  this.sub.unsubscribe();
+}
+  sub: any;
+  page : number = 1;
+  size:number = 10;
+  @Input() public keyword:string = "";
+  navigateTo: string = "Search";
+  source: string = "crossref";
+  type : string = "publication";
+  @Input() public select:boolean = true ;
+  @Input() public selectedPublications = [] ;
+  @Output() publicationsChange = new EventEmitter();
+
+  crossrefResults=[];
+  crossrefResultsNum : Observable<number> ;
+
+  orcidResults: string[];
+  orcidResultsNum: number ;
+  totalPages: number;
+  orcidResultsToShow: string[];
+
+  authorId: string;
+  authorGivenName: string;
+  authorFamilyName: string;
+
+  authorIds: string[];
+  authorGivenNames: string[];
+  authorFamilyNames: string[];
+
+  authorsNum : number ;
+
+  public warningMessage = "";
+  public infoMessage = "";
+
+    todayDate = '';
+    nextDate = '';
+
+  private searchOrcid (term: string) {
+    this.authorIds = new Array<string>();
+    this.authorGivenNames = new Array<string>();
+    this.authorFamilyNames = new Array<string>();
+
+    this.getOrcidAuthor(term);
+
+    console.info('searchOrcid in searchOrcid file');
+   }
+
+private readData(data: any) {
+     this.authorIds.push(data[2].path);
+
+     if(data[0] != null) {
+       this.authorGivenNames.push(data[0].value);
+     } else {
+       this.authorGivenNames.push("");
+     }
+     if(data[1] != null) {
+       this.authorFamilyNames.push(data[1].value);
+     } else {
+       this.authorFamilyNames.push("");
+     }
+   }
+
+  private  getOrcidAuthor (term: string)  {
+     this.orcidResultsNum = null;
+
+     //passing structures in order to fill them in service
+     this._searchOrcidService.searchOrcidAuthor(term, this.authorIds,
+         this.authorGivenNames, this.authorFamilyNames).subscribe(
+       data => {
+         if(data != null && data == true) {
+             this.getOrcidResultsById(0);
+         }
+       },
+       err => this.errorHandler(err, term)
+     );
+   }
+
+  private  errorHandler(err: any, term: string) {
+     if(err.status == 404){
+        this.getOrcidAuthors(term);
+     } else {
+       console.error(err.status);
+     }
+   }
+
+  private  getOrcidAuthors (term: string)  {
+    this.orcidResultsNum = null;
+
+    //passing structures in order to fill them in service
+     this._searchOrcidService.searchOrcidAuthors(term, this.authorIds,
+         this.authorGivenNames, this.authorFamilyNames).subscribe(
+       data => {
+         if(data != null && data == true) {
+             this.getOrcidResultsById(0);
+         }
+       },
+       err => console.error(err.status)
+     );
+   }
+
+
+private    getOrcidResultsById (index:number) {
+    if(this.authorIds.length > index) {
+     let id = this.authorIds[index];
+
+     console.info("getOrcidResultsById: "+id);
+      this._searchOrcidService.searchOrcidPublications(id).subscribe(
+        data => {
+           if(data != null) {
+             this.orcidResults=data['orcid-work'];
+             this.orcidResultsNum = data['orcid-work'].length;
+             this.page = 1;
+             if((this.orcidResultsNum % this.size) == 0){
+               this.totalPages=parseInt(''+(this.orcidResultsNum/this.size));
+             } else{
+               this.totalPages=parseInt(''+(this.orcidResultsNum/this.size+1));
+             }
+
+             this.orcidResultsToShow = this.orcidResults.slice(0,10);
+           } else {
+             this.orcidResultsNum = 0;
+             this.totalPages=0;
+           }
+           this.authorGivenName = this.authorGivenNames[index];
+           this.authorFamilyName = this.authorFamilyNames[index];
+           this.authorId = id;
+        },
+        err => console.error(err.status)
+      );
+
+      console.info("totalPages = " +this.totalPages);
+  }
+    }
+
+public search(term: string, size : number, page : number){
+  this.warningMessage = "";
+  this.infoMessage = "";
+  this.getCrossrefResults(term,size,page);
+  this.searchOrcid(term);
+
+}
+
+
+private   getCrossrefResults (term: string, size : number, page : number)  {
+    if(term.split(' ').length == 1 ){
+      this._searchCrossrefService.searchCrossrefByDOI(term).subscribe(
+        data => {
+            if(data != null) {
+                this.crossrefResults = data.items;
+                this.page=page;
+                this.crossrefResultsNum = data['total-results'];
+                if(data.items == 0){
+                    this._searchCrossrefService.searchCrossrefResults(term, size, page).subscribe(
+                        data => {
+                            if(data != null) {
+                                this.crossrefResults = data.items;
+                                this.page=page;
+                                this.crossrefResultsNum = data['total-results'];
+                            }
+                        },
+                        err => console.error(err.status)
+                    );
+                }
+            }
+         },
+        err => {
+          //console.error(err);
+          this._searchCrossrefService.searchCrossrefResults(term, size, page).subscribe(
+            data => {
+              this.crossrefResults = data.items;
+              this.page=page;
+              this.crossrefResultsNum = data['total-results'];
+             },
+            err => console.error(err.status)
+          );
+        }
+      );
+
+    }else{
+
+
+      this._searchCrossrefService.searchCrossrefResults(term, size, page).subscribe(
+        data => {
+            if(data != null) {
+                this.crossrefResults = data.items;
+                this.page=page;
+                this.crossrefResultsNum = data['total-results'];
+            }
+         },
+        err => console.error(err.status)
+      );
+    }
+  }
+
+
+  private  add(item, id, itemSource, itemType, itemUrl, itemTitle, date){
+     var result ;
+      if(itemSource == 'crossref'){
+        date = (date == null) ? null : date.substring(0,10);
+        result = {id: id, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: 'OPEN', embargoEndDate: this.nextDate, date};
+      }else if (itemSource == 'orcid'){
+        date = (date == null) ? null : date + "-01.-01"
+          result = {id:id, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: 'OPEN', embargoEndDate: this.nextDate, date};
+      }else if (itemSource == 'openaire'){
+
+      }
+      console.info("Added result:"+result.date);
+        var found:boolean = this.isSelected(result.id);
+        this.warningMessage = "";
+        if (!found) {
+          this.selectedPublications.push(result);
+          this.publicationsChange.emit({
+             value: this.selectedPublications
+           });
+        }else{
+            this.warningMessage = "Publication already in selected list";
+        }
+
+   }
+  private  remove(item){
+     this.warningMessage = "";
+     this.infoMessage = "";
+        var index:number =this.selectedPublications.indexOf(item);
+        item.selected=false;
+         if (index > -1) {
+            this.selectedPublications.splice(index, 1);
+            this.publicationsChange.emit({
+              value: this.selectedPublications
+            });
+        }
+
+   }
+private    pageChange($event) {
+     this.page=$event.value;
+     this.crossrefResults=[];
+     this.getCrossrefResults(this.keyword,this.size,this.page);
+   }
+private    orcidPageChange($event) {
+     this.page=$event.value;
+     this.orcidResultsToShow=[];
+     this.orcidResultsToShow = this.orcidResults.slice(($event.value-1)*this.size, $event.value*this.size);
+    }
+
+  private   isSelected(id:string){
+
+      var found:boolean = false;
+      this.warningMessage = "";
+      for (var _i = 0; _i < this.selectedPublications.length; _i++) {
+          let item = this.selectedPublications[_i];
+          if(item.id == id){
+                found=true;
+                this.warningMessage = "Publication already in selected list";
+          }
+       }
+       return found;
+
+
+    }
+}

portal-2/src/app/claimPages/linking/claimResult/claimResult.component.ts

@@ -0,0 +1,109 @@
+import {Component, Input, Output, EventEmitter, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ClaimPublicationComponent} from './claimPublication/claimPublication.component';
+import {ClaimDatasetComponent} from './claimDataset/claimDataset.component';
+import {SearchDataciteService} from '../../../services/searchDatacite.service';
+
+@Component({
+    selector: 'claim-result',
+    template: `
+
+
+    <div class="panel">
+      <div class="">
+      <form>
+
+        <!--<md-input class="demo-full-width default" placeholder="Search for Research Results"  [(ngModel)]="keyword"></md-input>
+
+        <md-radio-group class="default" [(value)]="searchType">
+          <md-radio-button   [value]="publication" [checked]="searchType === 'publication'" >Publication</md-radio-button>
+          <md-radio-button   [value]="dataset" [checked]="searchType != 'publication'">Dataset</md-radio-button>
+        </md-radio-group> -->
+        <div class="input-group">
+          <span class="input-group-addon">
+            <input #publication name="searchType" type="radio"  [checked]="searchType === 'publication'" value="publication" (click)="searchType = publication.value" />Publication
+            <input #dataset name="searchType"  [checked]="searchType === 'dataset'" type="radio"  value="dataset" (click)="searchType = dataset.value" />Dataset
+          </span>
+          <!--<div class="input-group-btn">
+            <button type="button" class="btn  dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{(searchType === 'publication')?"Publication":"Dataset"}} </button>
+            <ul class="dropdown-menu">
+              <li (click)="typeChanged('publication')"  ><a  >Publication</a></li>
+              <li (click)="typeChanged('dataset')"  ><a  >Dataset</a></li>
+            </ul>
+          </div> -->
+
+          <input class=" form-control" [(ngModel)]="keyword" name="keyword"/>
+
+          <span class="input-group-btn">
+            <button (click)="search()"  type="submit" class="btn btn-default">Search</button>
+          </span>
+        </div>
+       </form>
+    </div>
+  </div>
+    <div class="panel ">
+      <div *ngIf=" searchType=='publication' ">
+            <claim-publication [(keyword)]="keyword" [selectedPublications]="selectedPublications" (publicationsChange)="publicationsChanged($event)"  > </claim-publication>
+      </div>
+      <div  *ngIf=" searchType=='dataset' " >
+              <claim-dataset  [(keyword)]="keyword"  [(selectedDatasets)]="selectedDatasets" (datasetsChange)="datasetsChanged($event)"  > </claim-dataset>
+      </div>
+    </div>
+
+    `,
+})
+export class ClaimResultComponent {
+  constructor (private _searchDataciteService: SearchDataciteService) {
+    var myDate = new Date();
+    this.todayDate = myDate.getFullYear()+ "-" +(myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+    this.nextDate =  (myDate.getFullYear()+100)+ "-" +(myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+
+  }
+  ngOnInit() {
+  //   if(this.keyword !=null && this.keyword.length > 0){
+  //    this.searchDatacite(this.keyword,this.size,this.page);
+  //  }
+}
+  @ViewChild (ClaimPublicationComponent) claimPublicationComponent : ClaimPublicationComponent ;
+  @ViewChild (ClaimDatasetComponent) claimDatasetComponent : ClaimDatasetComponent ;
+
+  page : number = 1;
+  size:number = 10;
+  navigateTo: string = "Search";
+  source: string = "datacite";
+  type : string = "dataset";
+  searchType ="publication";
+  @Input() public select:boolean = true ;
+  @Input() public keyword:string = '';
+  @Input() public selectedDatasets = [] ;
+  @Input() public selectedPublications = [] ;
+  @Output() datasetsChange = new EventEmitter();
+  @Output() publicationsChange = new EventEmitter();
+
+  todayDate = '';
+  nextDate = '';
+  search(){
+    if(this.searchType=='dataset'){
+      this.claimDatasetComponent.search(this.keyword,10,1);
+    }else{
+      this.claimPublicationComponent.search(this.keyword,10,1);
+    }
+  }
+
+   typeChanged(type:string) {
+     this.searchType = type;
+   }
+   publicationsChanged($event) {
+     this.selectedPublications=$event.value;
+     this.publicationsChange.emit({
+              value: this.selectedPublications
+            });
+
+   }
+   datasetsChanged($event) {
+     this.selectedDatasets=$event.value;
+     this.datasetsChange.emit({
+              value: this.selectedDatasets
+            });
+   }
+}

portal-2/src/app/claimPages/linking/insertClaim/insertClaim.component.ts

@@ -0,0 +1,264 @@
+import {Component, Input, Output, EventEmitter, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Router} from '@angular/router';
+import {ClaimsService} from '../../../services/claims.service';
+import {ModalLoading} from '../../../common/modal/loading.component';
+import {AlertModal} from '../../../common/modal/alert';
+
+
+@Component({
+    selector: 'claim-insert',
+    template: `
+
+    <button  *ngIf="claiming == false && showButton == true" (click)="validateInsertions()"  class="btn btn-primary" style="float:right">Finish</button>
+    <div *ngIf="errorMessage.length > 0">
+      <div class="alert alert-danger" role="alert">{{errorMessage}}</div>
+    </div>
+    <div *ngIf="warningMessage.length > 0">
+      <div class="alert alert-warning" role="alert">{{warningMessage}}</div>
+    </div>
+    <modal-loading [message]= "'Please wait...'"></modal-loading>
+    <modal-alert (alertOutput)="confirmClose($event)">
+    </modal-alert>
+    `
+})
+export class ClaimInsertComponent {
+  constructor (private claimService: ClaimsService, private _router:Router) {}
+  ngOnInit() {
+    // console.info("Inlineentity:" +(this.inlineEntity)?this.inlineEntity+(this.inlineEntity.id)?this.inlineEntity.id:"no id":"null"+ + " show "+ (!this.claiming  && this.showButton) );
+  }
+
+
+  @Input() public contexts;
+  @Input() public projects;
+  @Input() public publications;
+  @Input() public datasets;
+  @Input() public showButton:boolean = true;
+  @Input() show='claim';
+  @Input() inline: boolean = false; // link from landing page?
+  @Input() inlineEntity; // the entity from the landing page
+  @Output() showChange = new EventEmitter();
+
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  @ViewChild(AlertModal) alert;
+
+  private claiming =false;
+  private error = false;
+  private errorMessage = "";
+  private warningMessage = "";
+  private claimsTODO:number = 0;
+  private claims:number = 0;
+  private errorclaims:number = 0;
+
+public validateInsertions(){
+  // console.info("Inlineentity:" +(this.inlineEntity)?this.inlineEntity+(this.inlineEntity.id)?this.inlineEntity.id:"no id":"null"+ + " show "+ (!this.claiming  && this.showButton) );
+    if(this.validate()){
+      if(this.validateDates()){
+        this.insert();
+        return true;
+      }
+    }
+    return
+}
+private insert(){
+  this.claiming = true;
+  var user="argirok@di.uoa.gr"
+  this.loading.open();
+  var claims = [];
+  if(this.publications){
+    console.info("publications: "+this.publications.length);
+
+      for (var i = 0; i < this.publications.length; i++) {
+
+          var result=this.publications[i];
+          if(this.contexts){
+            for (var j = 0; j < this.contexts.length; j++) {
+              var context = this.contexts[j];
+              var claim = this.createContextClaim(result, context, user);
+              claims.push(claim);
+            }
+          }
+          if(this.projects){
+            for (var k = 0; k < this.projects.length; k++) {
+              var project = this.projects[k];
+              var projectClaim = this.createProjectClaim(result, project, user);
+              claims.push(projectClaim);
+            }
+          }
+           if(this.inline && this.inlineEntity){
+            var resultClaim = this.createResultClaim(this.inlineEntity, result, user);
+            claims.push(resultClaim);
+          }
+
+      }
+    }
+    if(this.datasets){
+       for (var i = 0; i < this.datasets.length; i++) {
+        var result=this.datasets[i];
+        if(this.contexts){
+          for (var j = 0; j < this.contexts.length; j++) {
+            var context = this.contexts[j];
+            var claim = this.createContextClaim(result, context, user);
+            claims.push(claim);
+          }
+        }
+        if(this.projects){
+          for (var k = 0; k < this.projects.length; k++) {
+            var project = this.projects[k];
+            var projectClaim = this.createProjectClaim(result, project, user);
+            claims.push(projectClaim);
+          }
+        }
+        if(this.inline  && this.inlineEntity){
+          var resultClaim = this.createResultClaim(this.inlineEntity, result, user);
+          claims.push(resultClaim);
+        }
+
+      }
+    }
+    console.info("try to insert "+claims.length+" claims");
+    this.claimService.insertBulkClaims(claims).subscribe(
+      data => {
+        var inserted = data.insertedIds.length;
+
+        var inserted = data.insertedIds.length;
+        this.afterclaimsInsertion(data.insertedIds,data.errorInClaims);
+      },
+      err =>  {
+        console.error(err);
+        this.errorsInClaimsInsertion(err.insertedIds,err.errorInClaims);
+      }
+    );
+}
+private validate(){
+  this.warningMessage = "";
+  this.errorMessage = "";
+  if(this.datasets && this.datasets.length == 0 && this.publications && this.publications.length == 0){
+   this.warningMessage = "There are no publications or datasets selected.";
+ }else if((!this.contexts|| this.contexts.length==0 )&&(!this.projects|| this.projects.length==0 )&&  ( !this.inlineEntity)){
+   this.warningMessage = "There are no projects or concepts to link.";
+ // }else if (this.inline && !this.inlineEntity){
+ //   this.errorMessage = "No inline entity";
+ //   console.log(this.inline + "   "+ this.inlineEntity);
+ }else{
+   return true;
+ }
+ return false;
+}
+private validateDates(){
+  if(this.projects){
+    for (var k = 0; k < this.projects.length; k++) {
+      var project = this.projects[k];
+      console.info(project.startDate+" "+project.endDate + " "+project.projectAcronym);
+      if(this.publications){
+        for (var i = 0; i < this.publications.length; i++) {
+          var result = this.publications[i];
+          if(result.date && result.date != null){
+            console.info("Date :"+ result.date + " & embargoEndDate :" +result.embargoEndDate );
+            if((project.startDate && result.date < project.startDate) || ( project.endDate && result.date > project.endDate) ){
+              this.confirmOpen();
+              return false;
+            }
+          }
+        }
+      }
+      if(this.datasets){
+        for (var i = 0; i < this.datasets.length; i++) {
+          var result = this.datasets[i];
+          if(result.date && result.date != null){
+            console.info("Date :"+ result.date + " & embargoEndDate :" +result.embargoEndDate );
+            if((project.startDate && result.date < project.startDate) || ( project.endDate && result.date > project.endDate) ){
+              this.confirmOpen();
+              return false;
+            }
+          }
+        }
+      }
+
+
+    }
+  }
+  if(this.publications){
+    for (var i = 0; i < this.publications.length; i++) {
+      var result = this.publications[i];
+      if(result.date && result.date != null){
+        console.info("Date :"+ result.date + " & embargoEndDate :" +result.embargoEndDate );
+         if((result.embargoEndDate && result.embargoEndDate != null) && result.date >result.embargoEndDate ){
+          this.confirmOpen();
+          return false;
+        }
+      }
+    }
+  }
+  if(this.datasets){
+    for (var i = 0; i < this.datasets.length; i++) {
+      var result = this.datasets[i];
+      if(result.date && result.date != null){
+        console.info("Date :"+ result.date + " & embargoEndDate :" +result.embargoEndDate );
+        if((result.embargoEndDate && result.embargoEndDate != null) && result.date >result.embargoEndDate ){
+          this.confirmOpen();
+          return false;
+        }
+      }
+    }
+  }
+ return true;
+}
+private afterclaimsInsertion(insertedIds, errorInClaims){
+  this.loading.close();
+  if(errorInClaims.length == 0){
+    if(this.inline){
+      this.show = "end";
+    }else{
+      this._router.navigate( ['/my-claims'] );
+    }
+    this.showChange.emit({
+      value: this.show
+    });
+  }else{
+    this.errorsInClaimsInsertion(insertedIds, errorInClaims);
+  }
+}
+private errorsInClaimsInsertion(insertedIds, errorInClaims){
+  this.errorMessage = "An Error Occured.";
+  this.loading.close();
+  this.error =  true;
+    if(this.inline){
+      this.show = "error";
+      this.showChange.emit({
+        value: this.show
+      });
+  }
+
+}
+
+
+
+  private createContextClaim(result:any, context:any, user:any){
+    var claim =  { claimedBy : user, sourceId : context.concept.id, sourceType : "context", sourceCollectedFrom:"openaire", sourceAccessRights:"OPEN", sourceEmbargoEndDate:"no", targetId :  result.id , targetType : result.type, targetCollectedFrom: result.source, targetAccessRights:result.accessRights, targetEmbargoEndDate:result.embargoEndDate};
+    return claim;
+  }
+  private createProjectClaim(result:any, project:any, user:any){
+    //project.projectId
+    // var dummyID = "dummyID";
+    var claim =  { claimedBy : user, sourceId : project.projectId, sourceType : "project", sourceCollectedFrom:"openaire", sourceAccessRights:"OPEN", sourceEmbargoEndDate:"", targetId :  result.id , targetType : result.type, targetCollectedFrom: result.source, targetAccessRights:result.accessRights, targetEmbargoEndDate:result.embargoEndDate};
+    return claim;
+  }
+  private createResultClaim(inlineResult:any, result:any, user:any){
+    var claim =  { claimedBy : user, sourceId : result.id, sourceType : result.type, sourceCollectedFrom: result.source, sourceAccessRights: result.accessRights, sourceEmbargoEndDate: result.embargoEndDate, targetId :  inlineResult.id , targetType : inlineResult.type, targetCollectedFrom: inlineResult.source, targetAccessRights: inlineResult.accessRights, targetEmbargoEndDate: inlineResult.embargoEndDate};
+    return claim;
+  }
+
+  confirmOpen(){
+    this.alert.cancelButton = true;
+    this.alert.okButton = true;
+    this.alert.alertTitle = "Invalid dates";
+    this.alert.message = "There is a research result whose  publication date  is after project end date or before project start date. Or embargo end date of a research result is before research result's publication date.";
+    this.alert.okButtonText = "Procceed anyway";
+    this.alert.cancelButtonText = "Cancel";
+    this.alert.open();
+  }
+   confirmClose(data){
+    this.insert();
+  }
+}

portal-2/src/app/claimPages/linking/linking.component.ts

@@ -0,0 +1,16 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {LinkingGenericComponent} from './linkingGeneric.component';
+
+@Component({
+    selector: 'linking',
+    template: `
+     <linking-generic [bulkMode]=false> </linking-generic>
+`
+
+})
+export class LinkingComponent {
+  constructor () {
+   }
+
+}

portal-2/src/app/claimPages/linking/linkingGeneric.component.ts

@@ -0,0 +1,191 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {  Router } from '@angular/router';
+
+@Component({
+    selector: 'linking-generic',
+    //providers: [MdRadioDispatcher],
+    template: `
+    <div class="container">
+      <div class="page-header">
+        <div   *ngIf=" bulkMode "  class="pull-right"><span class="badge"><h5>Bulk mode</h5></span></div>
+        <h1>Link research resutls</h1>
+      </div>
+      <linking-home *ngIf="  show == 'home' " [bulkMode]="bulkMode" (linkTypeChange)="linkTypeChange($event)"  ></linking-home>
+      <div  *ngIf="  show != 'home' &&  show != 'myclaims' " >
+        <ol  *ngIf="    show != 'myclaims' " class="breadcrumb">
+          <li *ngIf="linkType == 'project'" [class]="(show == 'project' )?'active':''"><a *ngIf="show != 'project'" (click)="showChangedType('project')" >Project</a><span *ngIf="show == 'project'">Project</span></li>
+          <li *ngIf="linkType == 'context'" [class]="(show == 'context' )?'active':''"><a *ngIf="show != 'context'" (click)="showChangedType('context')" >Context</a><span *ngIf="show == 'context'">Context</span></li>
+          <li *ngIf="linkType == 'software'" [class]="(show == 'software' )?'active':''"><a *ngIf="show != 'software'"  (click)="showChangedType('software')" >Software</a><span *ngIf="show == 'software'">Software</span> </li>
+          <li  *ngIf="!bulkMode " [class]="(show == 'result' || show == 'publication' || show == 'dataset')?'active':''"><a *ngIf="show != 'result' && show != 'publication' && show != 'dataset'" (click)="showChangedType('result')" >Research Result</a><span *ngIf="show == 'result' || show == 'publication' || show == 'dataset'">Research Result</span></li>
+          <li  *ngIf="!bulkMode " [class]="(show == 'claim')?'active':''"><span *ngIf="show == 'claim'">Link</span><a *ngIf="show != 'claim'" (click)="showChangedType('claim')">Link</a> </li>
+          <li  *ngIf="bulkMode  " [class]="(show == 'claim' )?'active':''"><span *ngIf="show == 'claim'">Upload & Link</span><a *ngIf="show != 'claim'" (click)="showChangedType('claim')">Upload & Link</a> </li>
+        </ol>
+
+      <div  *ngIf="  show != 'claim'  && show != 'myclaims' " class="row" >
+        <div class="col-sm-6">
+
+          <div  *ngIf=" show=='result' &&  !bulkMode  " >
+              <claim-result   [selectedDatasets]="datasets" [selectedPublications]="publications" (datasetsChange)="datasetsChange($event)" (publicationsChange)="publicationsChange($event)"   > </claim-result>
+
+
+          </div>
+
+        <div  *ngIf=" show=='project' " >
+               <claim-projects     [selectedProjects]="projects"  > </claim-projects>
+        </div>
+        <div  *ngIf=" show=='software' " >
+               <p>TODO software</p>
+        </div>
+          <div  *ngIf="  show == 'context'" >
+             <claim-contexts   [selectedList]="contexts"   > </claim-contexts>
+          </div>
+        <!--  <div  *ngIf="  show == 'claim'" >
+             <claim-insert   [contexts]="contexts" [publications]="publications" [datasets]="datasets" [projects]="projects"  ></claim-insert>
+          </div>-->
+        </div>
+        <div class="col-sm-6">
+          <claim-selected-contexts   [contexts]="contexts"  [show]="show"
+             (showChange)="showChange($event)"  > </claim-selected-contexts>
+           <claim-selected-projects    [projects]="projects" [show]="show"
+             (showChange)="showChange($event)"  > </claim-selected-projects>
+             <claim-selected-results    [datasets]="datasets" [publications]="publications"   [show]="show"
+               (showChange)="showChange($event)"  [linkToResults]="(bulkMode)?false:true" > </claim-selected-results>
+
+      </div>
+      </div>
+      <div  *ngIf="  show == 'claim'  "  >
+         <claim-selected   [contexts]="contexts" [publications]="publications" [datasets]="datasets" [projects]="projects"   [show]="show"
+         (showChange)="showChange($event)"  (publicationsChange)="publicationsChange($event)" [showAccessRights]="'true'" [bulkMode]="bulkMode"
+          [linkToResults]="(bulkMode)?false:true" > </claim-selected>
+
+          <claim-selected-contexts   [contexts]="contexts"  [show]="show"
+             (showChange)="showChange($event)"  > </claim-selected-contexts>
+           <claim-selected-projects    [projects]="projects" [show]="show"
+             (showChange)="showChange($event)"  > </claim-selected-projects>
+            <!-- Bulk Mode Results  (publicationsChange)="publicationsChanged($event)" -->
+            <bulk-claim *ngIf=" bulkMode " [publications]="publications" > </bulk-claim>
+            <claim-selected-results    [datasets]="datasets" [publications]="publications"   [show]="show"
+               (showChange)="showChange($event)"  [linkToResults]="(bulkMode)?false:true" [showAccessRights]=true [bulkMode]="bulkMode" >
+               </claim-selected-results>
+        <claim-insert   [contexts]="contexts" [publications]="publications" [datasets]="datasets" [projects]="projects" [show] = "show"
+         (showChange)="showChange($event)" ></claim-insert>
+      </div>
+      <nav>
+        <ul *ngIf="show != 'home'" class="pager">
+          <li class="previous" (click)="prev()"><a ><span aria-hidden="true">&larr;</span> Previous</a></li>
+          <li class="next" *ngIf="show != 'claim'" (click)="next()" ><a >Next <span aria-hidden="true">&rarr;</span></a></li>
+        </ul>
+      </nav>
+
+  </div>
+</div>
+
+
+`
+
+})
+//[(ngModel)]="date"
+export class LinkingGenericComponent {
+  constructor ( private _router: Router) {
+   }
+  @Input() bulkMode: boolean = false;
+  sourceType:string;
+  targetType:string;
+  step:number = 1;
+  contexts=[];
+  projects=[];
+  publications=[];
+  datasets=[];
+  show = "home";
+  searchType="publication"; //publication or dataset
+  date='8-6-2016';
+  keyword: string = "";
+  linkType:string ="project"; // link type (selected in home page) : project, context, software, etc
+   ngOnInit() {
+
+  }
+  next(){
+
+    if((this.show == 'project' || this.show == 'context' || this.show == 'software')){
+        if(!this.bulkMode){
+          this.show='result';
+        }else{
+          this.show='claim';
+        }
+    }else if((this.show == 'result' && this.keyword == '')||(this.show == 'dataset' || this.show == 'publication')){
+        this.show='claim';
+
+    }
+  }
+  prev(){
+    if(this.show == 'result'){
+        this.show =  this.linkType;
+   }else if(this.show == 'context' || this.show == 'project' || this.show == 'software' ){
+        this.show='home';
+     } else if(this.show == 'claim'){
+        // this.show='result';
+        if(!this.bulkMode){
+          this.show='result';
+        }else{
+          this.show =  this.linkType;
+        }
+    }
+  }
+  goto(term: string) {
+     this._router.navigate( ['Search', { keyword: term }] );
+  }
+
+  search() {
+      if(this.searchType == 'publication' ){
+          this.show="publication";
+      }else{
+          this.show="dataset";
+      }
+
+  }
+
+   sourceTypeChange($event) {
+     this.sourceType=$event.value;
+    console.log($event.value);
+  }
+  targetTypeChange($event) {
+    this.targetType=$event.value;
+   console.log($event.value);
+ }
+ // contextsChange($event) {
+ //   this.contexts=$event.value;
+ //   console.log($event.value);
+ //  }
+  publicationsChange($event) {
+    this.publications=$event.value;
+  }
+  datasetsChange($event) {
+    this.datasets=$event.value;
+  }
+  projectsChange($event) {
+    this.projects=$event.value;
+  }
+  typeChanged(type:string) {
+    this.searchType = type;
+  }
+  linkTypeChange($event) {
+    this.linkType =$event.value;
+    this.show=$event.value;
+
+  }
+  showChange($event) {
+    this.show=$event.value;
+    this.showChangedType($event.value);
+
+
+  }
+  showChangedType(type:string) {
+    this.show=type;
+     if(this.show == 'project' || this.show == 'context' || this.show == 'software'){
+        this.linkType = this.show;
+    }
+
+
+  }
+}

portal-2/src/app/claimPages/linking/linkingHome.component.ts

@@ -0,0 +1,58 @@
+import {Component, Output, EventEmitter, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+@Component({
+    selector: 'linking-home',
+    template: `
+          <div class="card-deck-wrapper">
+          <div class="card-deck">
+            <div class="card card-inverse card-info text-xs-center">
+              <!--<img class="card-img-top" data-src="images/funders.png" alt="Card image cap"> -->
+              <div class="card-block">
+                <h4 class="card-title">Link with project</h4>
+                <p class="card-text">Link your research result with funded projects.</p>
+                <a  (click)="select('project')" class="btn btn-primary">Link with project</a>
+                <!--<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>-->
+              </div>
+            </div>
+            <div class="card card-inverse card-success text-xs-center" >
+              <div class="card-block">
+                <h4 class="card-title">Link with Community</h4>
+                <p class="card-text">Link your research result with research communities.</p>
+                <a  (click)="select('context')" class="btn btn-primary">Link with community</a>
+                <!--<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
+              </div>
+            </div>
+            <div class="card card-inverse text-xs-center" style="background-color:pink;">
+              <div class="card-block">
+                <h4 class="card-title">Link with Software</h4>
+                <p class="card-text">....</p>
+                <a  (click)="select('software')" class="btn btn-primary">Link with software</a>
+                <!--<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p> -->
+              </div>
+            </div>
+
+          </div>
+          <div *ngIf=" !bulkMode " class="card-block">
+            <h4 class="card-title">Bulk mode linking</h4>
+            <p class="card-text">Link Research Results to projects,contects, etc, providing a CSV file with research results' DOIs</p>
+            <a  href="/bulk-linking" class="btn btn-primary">Bulk mode linking</a>
+          </div>
+          </div>
+
+        `
+
+})
+
+export class LinkingHomeComponent {
+  @Output() linkTypeChange = new EventEmitter();
+  @Input() bulkMode:boolean = false;
+  linkType:string = "project";
+  select(type:string){
+    this.linkType = type;
+    this.linkTypeChange.emit({
+       value: this.linkType
+     });
+  }
+
+}

portal-2/src/app/claimPages/linking/selected/selected.component.ts

@@ -0,0 +1,208 @@
+import {Component, Input,Output, EventEmitter} from '@angular/core';
+
+@Component({
+    selector: 'claim-selected',
+    template: `
+
+      <div   [class]="(showAccessRights== 'true' )?'row':''" >
+
+        <div   [class]="(showAccessRights== 'true' )?'col-sm-6':''" >
+        <!-- Contexts -->
+          <div   *ngIf=" !(inline  && hideType == 'context') && contexts"  class="concepts" >
+          <ul class="list-group">
+            <li class="list-group-item list-group-item-success">Selected Concepts  ({{(contexts.length)}})
+               <span *ngIf=" !inline"  title="Add More Concepts" (click)="showType('context')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+            <li class="list-group-item" *ngFor="let context of contexts" >
+              <span >{{context.community }} > {{context.category}} > {{context.concept.label}} </span>
+              <span (click)="removeContext(context)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+
+            </li>
+            <li  *ngIf="contexts.length == 0 " class="list-group-item">There are no contexts</li>
+          </ul>
+          </div>
+
+        </div>
+        <div   [class]="(showAccessRights== 'true' )?'col-sm-6':''" >
+          <!-- Projects -->
+          <div   *ngIf=" !(inline  && hideType == 'project') && projects "  class="projects" >
+                <ul class="list-group">
+                <li class="list-group-item list-group-item-info">Selected Projects  ({{(projects.length)}})
+                   <span  *ngIf=" !inline " title="Add More Projects" (click)="showType('project')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+                </li>
+                  <li class="list-group-item" *ngFor="let project of projects">
+
+                    <span >{{project.funderName}} | {{project.projectName}} {{(project.projectAcronym)?'('+project.projectAcronym+')':''}} <!--[{{project.startDate}} - {{project.endDate}}]--></span>
+                    <span  (click)="removeProject(project)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+                  </li>
+                  <li *ngIf="projects.length == 0 " class="list-group-item">There are no projects</li>
+                </ul>
+          </div>
+
+        </div>
+      </div>
+      <!-- Results -->
+
+        <div *ngIf=" !(inline && (hideType == 'publication' || hideType == 'dataset' )) && (datasets || publications)"  class="publications" >
+          <ul class="list-group">
+            <li class="list-group-item panel-footer "> Research Results ({{(datasets.length+publications.length)}})
+               <span *ngIf=" !inline  && linkToResults "  title="Add More Research Results" (click)="showType('result')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+            <li *ngIf="publications && datasets && publications.length == 0 && datasets.length == 0"  class="list-group-item">There are no Research Results </li>
+            <li  *ngIf="(publications &&  publications.length > 0) ||(datasets &&  datasets.length > 0 ) "  class="list-group-item  list-group-item-warning ">{{publications. length }} Selected Publications:
+               <span  *ngIf=" !inline && linkToResults " title="Add More Publications" (click)="showType('publication')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+            <li  *ngFor="let pub of publications" class="list-group-item">
+              <span *ngIf="showAccessRights == 'true'" (click)="removePublication(pub)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+              <span >
+                <a *ngIf="pub.url" target="_blank" href="{{pub.url}}" >{{pub.title}}</a>
+                <span *ngIf="!pub.url" >{{pub.title}}</span><span *ngIf="pub.date" >({{pub.date.substring(0,4)}})</span>
+              </span>
+              <span *ngIf="showAccessRights== 'true'  && pub.source != 'openaire' " class="dropdown">
+                   <button class="btn btn-default dropdown-toggle" type="button" id="{{'dropdown'+pub.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                   {{pub.accessRights}}
+                    </button>
+                   <ul class="dropdown-menu" [attr.aria-labelledby]="'dropdown'+pub.id">
+                      <li *ngFor="let type of accessTypes" ><a  (click)="pub.accessRights = type " >{{type}} </a></li>
+                   </ul>
+                   <input *ngIf="pub.accessRights== 'EMBARGO'" type="date" id="{{'date'+pub.id}}" name="" [min]="todayDate" (keyup)="dateChanged($event, pub)" [value]="pub.embargoEndDate">
+              </span>
+              <span *ngIf="showAccessRights== 'true'  && pub.source == 'openaire' " >
+                   <button class="btn btn-default disabled " type="button" >
+                   {{pub.accessRights}}
+                    </button>
+              </span>
+             <span *ngIf="showAccessRights != 'true'" (click)="removePublication(pub)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+            </li>
+            <li *ngIf="publications.length > 0 || datasets.length > 0" class="list-group-item  list-group-item-warning "> {{datasets.length}} Selected Research Data:
+              <span  *ngIf=" !inline  && linkToResults " title="Add More  Research Data" (click)="showType('dataset')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+            <li  *ngFor="let dataset of datasets" class="list-group-item">
+              <span *ngIf="showAccessRights == 'true'" (click)="removeDataset(dataset)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+              <span >
+              <a *ngIf="dataset.url" target="_blank" href="{{dataset.url}}" >{{dataset.title}}</a>
+              <span *ngIf="!dataset.url" >{{dataset.title}}</span>
+              <span *ngIf="dataset.date" >({{dataset.date.substring(0,4)}})</span>
+              </span>
+              <span  *ngIf="showAccessRights== 'true' && dataset.source != 'openaire'"  class="dropdown">
+                   <button class="btn btn-default dropdown-toggle" type="button" id="{{'dropdown'+dataset.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                   {{dataset.accessRights}}
+                    </button>
+                   <ul class="dropdown-menu" [attr.aria-labelledby]="'dropdown'+dataset.id">
+                      <li *ngFor="let type of accessTypes" ><a  (click)="dataset.accessRights = type " >{{type}} </a></li>
+                   </ul>
+                   <input *ngIf="dataset.accessRights== 'EMBARGO'" type="date" id="{{'date'+dataset.id}}" name="" [min]="todayDate" (keyup)="dateChanged($event,dataset)" [value]="dataset.embargoEndDate">
+              </span>
+              <span *ngIf="showAccessRights== 'true'  && dataset.source == 'openaire' "  >
+                   <button class="btn btn-default disabled " type="button" >
+                   {{dataset.accessRights}}
+                    </button>
+              </span>
+              <span *ngIf="showAccessRights != 'true'" (click)="removeDataset(dataset)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+            </li>
+
+          </ul>
+          </div>
+          <!-- Bulk Mode Results  (publicationsChange)="publicationsChanged($event)" -->
+          <div *ngIf="bulkMode">
+            <bulk-claim *ngIf=" bulkMode " [(publications)]="publications" (publicationsChange)="publicationsChanged($event)" > </bulk-claim>
+          </div>
+          `
+
+
+})
+export class ClaimSelectedComponent {
+   ngOnInit() {
+     console.info("Show accessRights selection? :"+this.showAccessRights);
+     var myDate = new Date();
+     this.todayDate=( myDate.getFullYear()+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+     this.nextDate= ( (myDate.getFullYear()+100)+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+     //2015-05-01
+}
+
+
+  @Input() contexts;
+  @Input() projects;
+  @Input() publications;
+  @Input() datasets;
+  @Input() showAccessRights:boolean = false;
+  @Input() show='home';
+  @Input() inline:boolean = false;
+  @Input() hideType;
+  @Input() bulkMode:boolean = false;
+  @Input() linkToResults:boolean = true;
+  @Output() projectsChange = new EventEmitter();
+  @Output()publicationsChange = new EventEmitter();
+  @Output() datasetsChange = new EventEmitter();
+  @Output() contextsChange = new EventEmitter();
+
+  @Output() showChange = new EventEmitter();
+
+  todayDate = '';
+  nextDate = '';
+  removeContext(item:any){
+    var index:number =this.contexts.indexOf(item);
+     if (index > -1) {
+        this.contexts.splice(index, 1);
+    }
+    this.contextsChange.emit({
+      value: this.contexts
+    });
+  }
+  removePublication(item:any){
+    var index:number =this.publications.indexOf(item);
+     if (index > -1) {
+        this.publications.splice(index, 1);
+    }
+    this.publicationsChange.emit({
+      value: this.publications
+    });
+  }
+  removeDataset(item:any){
+    var index:number =this.datasets.indexOf(item);
+     if (index > -1) {
+        this.datasets.splice(index, 1);
+    }
+    this.datasetsChange.emit({
+      value: this.datasets
+    });
+  }
+  removeProject(item:any){
+    var index:number =this.projects.indexOf(item);
+     if (index > -1) {
+        this.projects.splice(index, 1);
+    }
+    this.projectsChange.emit({
+      value: this.projects
+    });
+  }
+  showType(type){
+   if(type != this.show){
+     this.show = type;
+     this.showChange.emit({
+       value: this.show
+     });
+   }
+  }
+  accessTypes = ["OPEN","CLOSED","EMBARGO","RESTRICTED"];
+
+  dateChanged (event:any, item:any) {
+      item.embargoEndDate = event.target.value ;
+    }
+    publicationsChanged($event) {
+      this.publications=$event.value;
+      this.publicationsChange.emit({
+        value: this.publications
+      });
+    }
+}
+
+
+
+@Component({
+    selector: 'add-more',
+    template: ``
+})
+export class Addmore {
+    @Input() type = 'publication';
+}

portal-2/src/app/claimPages/linking/selected/selectedContexts.component.ts

@@ -0,0 +1,63 @@
+import {Component, Input,Output, EventEmitter} from '@angular/core';
+  
+@Component({
+    selector: 'claim-selected-contexts',
+    template: `
+        <div   [class]="componentClass" >
+        <!-- Contexts -->
+          <!--div   *ngIf=" !(inline  && hideType == 'context') && contexts"  class="concepts" -->
+          <div>
+          <ul class="list-group">
+            <li class="list-group-item list-group-item-success">Selected Concepts  ({{(contexts.length)}})
+               <span *ngIf=" !inline"  title="Add More Concepts" (click)="showType('context')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+            <li class="list-group-item" *ngFor="let context of contexts" >
+              <span >{{context.community }} > {{context.category}} > {{context.concept.label}} </span>
+              <span (click)="removeContext(context)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+
+            </li>
+            <li  *ngIf="contexts.length == 0 " class="list-group-item">There are no contexts</li>
+          </ul>
+          </div>
+        </div>
+       `
+})
+export class ClaimSelectedContextsComponent {
+   ngOnInit() {
+     var myDate = new Date();
+     this.todayDate=( myDate.getFullYear()+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+     this.nextDate= ( (myDate.getFullYear()+100)+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+     //2015-05-01
+}
+
+
+  @Input() contexts;
+  @Input() componentClass:string = ""; //"" or "col-sm-6" for horizontal display (besides projects)
+  @Input() show='home';
+  @Input() inline:boolean = false;
+  @Input() hideType;
+  @Input() bulkMode:boolean = false;
+  @Output() showChange = new EventEmitter();
+
+  todayDate = '';
+  nextDate = '';
+
+  showType(type){
+     if(type != this.show){
+       this.show = type;
+       this.showChange.emit({
+         value: this.show
+       });
+     }
+    }
+
+
+  removeContext(item:any){
+    var index:number =this.contexts.indexOf(item);
+     if (index > -1) {
+        this.contexts.splice(index, 1);
+    }
+
+  }
+
+}

portal-2/src/app/claimPages/linking/selected/selectedDatasets.component.ts

@@ -0,0 +1,119 @@
+import {Component, Input,Output, EventEmitter,ViewChild} from '@angular/core';
+import {AlertModal} from '../../../common/modal/alert';
+
+@Component({
+    selector: 'claim-selected-datasets',
+    template: `
+
+        <li  *ngFor="let dataset of datasets" class="list-group-item">
+          <div class="row">
+
+            <div  [ngClass]="showAccessRights?'col-md-8':'col-md-12'">
+              <span *ngIf="showAccessRights" (click)="removeDataset(dataset)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+              <a *ngIf="dataset.url" target="_blank" href="{{dataset.url}}" >{{dataset.title}}</a>
+              <span *ngIf="!dataset.url" >{{dataset.title}}</span>
+              <span *ngIf="dataset.date" >({{dataset.date.substring(0,4)}})</span>
+              <span *ngIf="!showAccessRights" (click)="removeDataset(dataset)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+            </div>
+            <div class = "col-md-4">
+              <span  *ngIf="showAccessRights && dataset.source != 'openaire'"  class="dropdown">
+                   <button class="btn btn-default dropdown-toggle" type="button" id="{{'dropdown'+dataset.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                   {{dataset.accessRights}}
+                    </button>
+                   <ul class="dropdown-menu" [attr.aria-labelledby]="'dropdown'+dataset.id">
+                      <li *ngFor="let type of accessTypes" ><a  (click)="accessRightsTypeChanged(type,dataset) " >{{type}} </a></li>
+                   </ul>
+                   <input *ngIf="dataset.accessRights== 'EMBARGO'" type="date" id="{{'date'+dataset.id}}" name="" [min]="todayDate" (keyup)="dateChanged($event,dataset)" [value]="dataset.embargoEndDate">
+              </span>
+              <span *ngIf="showAccessRights  && dataset.source == 'openaire' "  >
+                   <button class="btn btn-default disabled " type="button" >
+                   {{dataset.accessRights}}
+                    </button>
+              </span>
+            </div>
+
+          </div>
+        </li>
+        <modal-alert (alertOutput)="confirmClose($event)">
+        </modal-alert>
+
+
+          `
+})
+export class ClaimSelectedDatasetsComponent {
+  ngOnInit() {
+    var myDate = new Date();
+    this.todayDate=( myDate.getFullYear()+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+    this.nextDate= ( (myDate.getFullYear()+100)+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+    //2015-05-01
+}
+
+
+
+
+ @Input() datasets;
+ @Input() showAccessRights:boolean = false;
+ @Input() inline:boolean = false;
+ @Input() hideType;
+ @Input() bulkMode:boolean = false;
+ @Input() linkToResults:boolean = true;
+ @Output() datasetsChange = new EventEmitter();
+
+ todayDate = '';
+ nextDate = '';
+ @ViewChild(AlertModal) alertApplyAll;
+ private commonAccessRights = "OPEN"; // for access rights- changes when user apply a change to every result
+ private commonEmbargoEndDate; // for access rights: embargoEndDate - changes when user apply a change to every result
+
+ removeDataset(item:any){
+   var index:number =this.datasets.indexOf(item);
+    if (index > -1) {
+       this.datasets.splice(index, 1);
+   }
+   this.datasetsChange.emit({
+     value: this.datasets
+   });
+ }
+
+ accessTypes = ["OPEN","CLOSED","EMBARGO","RESTRICTED"];
+
+ dateChanged (event:any, item:any) {
+     item.embargoEndDate = event.target.value ;
+
+     this.confirmOpen();
+   }
+   /* The following methods:
+      *typeChanged
+      *confirmOpen
+      *confirmClose
+    implement the functionality: change accessRights of a publication - apply to all if asked */
+   accessRightsTypeChanged (type:any, item:any) {
+       item.accessRights = type;
+       if(this.datasets.length > 1 ){
+         this.commonAccessRights = type;
+         if(this.commonAccessRights == "EMBARGO"){
+           this.commonEmbargoEndDate = item.embargoEndDate;
+         }
+         this.confirmOpen();
+       }
+
+   }
+   confirmOpen(){
+     this.alertApplyAll.cancelButton = true;
+     this.alertApplyAll.okButton = true;
+     this.alertApplyAll.alertTitle = "Change access rights";
+     this.alertApplyAll.message = "Do you wish to apply the change to every dataset?";
+     this.alertApplyAll.okButtonText = "Yes";
+     this.alertApplyAll.cancelButtonText = "No";
+     this.alertApplyAll.open();
+   }
+    confirmClose(data){
+      for (var i = 0; i < this.datasets.length; i++) {
+        this.datasets[i].accessRights = this.commonAccessRights;
+        if(this.commonAccessRights == "EMBARGO"){
+          this.datasets[i].embargoEndDate = this.commonEmbargoEndDate;
+        }
+      }
+   }
+
+}

portal-2/src/app/claimPages/linking/selected/selectedProjects.component.ts

@@ -0,0 +1,67 @@
+import {Component, Input,Output, EventEmitter} from '@angular/core';
+
+@Component({
+    selector: 'claim-selected-projects',
+    template: `
+        <div   [class]="componentClass" >
+          <!-- Projects -->
+          <div   *ngIf=" !(inline  && hideType == 'project') && projects "  class="projects" >
+                <ul class="list-group">
+                <li class="list-group-item list-group-item-info">Selected Projects  ({{(projects.length)}})
+                   <span  *ngIf=" !inline " title="Add More Projects" (click)="showType('project')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+                </li>
+                  <li class="list-group-item" *ngFor="let project of projects">
+
+                    <span >{{project.funderName}} | {{project.projectName}} {{(project.projectAcronym)?'('+project.projectAcronym+')':''}} <!--[{{project.startDate}} - {{project.endDate}}]--></span>
+                    <span  (click)="removeProject(project)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+                  </li>
+                  <li *ngIf="projects.length == 0 " class="list-group-item">There are no projects</li>
+                </ul>
+          </div>
+        </div>
+
+          `
+})
+export class ClaimSelectedProjectsComponent {
+
+
+ngOnInit() {
+   var myDate = new Date();
+  this.todayDate=( myDate.getFullYear()+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+  this.nextDate= ( (myDate.getFullYear()+100)+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+  //2015-05-01
+}
+
+
+@Input() projects;
+@Input() show='home';
+@Input() inline:boolean = false;
+@Input() hideType;
+@Input() bulkMode:boolean = false;
+@Input() linkToResults:boolean = true;
+@Output() projectsChange = new EventEmitter();
+
+@Output() showChange = new EventEmitter();
+
+todayDate = '';
+nextDate = '';
+
+removeProject(item:any){
+ var index:number =this.projects.indexOf(item);
+  if (index > -1) {
+     this.projects.splice(index, 1);
+ }
+ this.projectsChange.emit({
+   value: this.projects
+ });
+}
+showType(type){
+if(type != this.show){
+  this.show = type;
+  this.showChange.emit({
+    value: this.show
+  });
+}
+}
+
+}

portal-2/src/app/claimPages/linking/selected/selectedPublications.component.ts

@@ -0,0 +1,123 @@
+import {Component, Input,Output, EventEmitter, ViewChild} from '@angular/core';
+import {AlertModal} from '../../../common/modal/alert';
+
+@Component({
+    selector: 'claim-selected-publications',
+    template: `
+
+        <li  *ngFor="let pub of publications" class="list-group-item">
+          <div class="row">
+            <div [ngClass]="showAccessRights?'col-md-8':'col-md-12'" >
+                <span *ngIf="showAccessRights" (click)="removePublication(pub)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+                <a *ngIf="pub.url" target="_blank" href="{{pub.url}}" >{{pub.title}}</a>
+                <span *ngIf="!pub.url" >{{pub.title}}</span><span *ngIf="pub.date" >({{pub.date.substring(0,4)}})</span>
+                <span *ngIf="!showAccessRights" (click)="removePublication(pub)" aria-hidden="true" class="btn glyphicon glyphicon-remove"></span>
+            </div>
+            <div *ngIf="showAccessRights  && pub.source != 'openaire' "  class = "col-md-4">
+              <span *ngIf="showAccessRights  && pub.source != 'openaire' " class="dropdown">
+                   <button class="btn btn-default dropdown-toggle" type="button" id="{{'dropdown'+pub.id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                   {{pub.accessRights}}
+                    </button>
+                   <ul class="dropdown-menu" [attr.aria-labelledby]="'dropdown'+pub.id">
+                      <li *ngFor="let type of accessTypes" ><a  (click)="accessRightsTypeChanged(type,pub) " >{{type}} </a></li>
+                   </ul>
+                   <input *ngIf="pub.accessRights== 'EMBARGO'" type="date" id="{{'date'+pub.id}}" name="" [min]="todayDate" (keyup)="dateChanged($event, pub)" [value]="pub.embargoEndDate">
+              </span>
+
+            </div>
+            <div *ngIf="showAccessRights  && pub.source == 'openaire' "  class = "col-md-4">
+              <span   >
+                   <button class="btn btn-default disabled " type="button" >
+                   {{pub.accessRights}}
+                    </button>
+              </span>
+           </div>
+         </div>
+        </li>
+        <modal-alert (alertOutput)="confirmClose($event)">
+        </modal-alert>
+
+          `
+
+})
+export class ClaimSelectedPublicationsComponent {
+  ngOnInit() {
+    var myDate = new Date();
+    this.todayDate=( myDate.getFullYear()+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+    this.nextDate= ( (myDate.getFullYear()+100)+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+    //2015-05-01
+}
+
+ @Input() publications;
+ @Input() showAccessRights:boolean = false;
+ @Input() inline:boolean = false;
+ @Input() hideType;
+ @Input() bulkMode:boolean = false;
+ @Input() linkToResults:boolean = true;
+ @Output()publicationsChange = new EventEmitter();
+
+ @Output() showChange = new EventEmitter();
+
+ todayDate = '';
+ nextDate = '';
+ @ViewChild(AlertModal) alertApplyAll;
+
+private commonAccessRights = "OPEN"; // for access rights- changes when user apply a change to every result
+private commonEmbargoEndDate; // for access rights: embargoEndDate - changes when user apply a change to every result
+
+ removePublication(item:any){
+   var index:number =this.publications.indexOf(item);
+    if (index > -1) {
+       this.publications.splice(index, 1);
+   }
+   this.publicationsChange.emit({
+     value: this.publications
+   });
+ }
+
+
+ accessTypes = ["OPEN","CLOSED","EMBARGO","RESTRICTED"];
+
+ dateChanged (event:any, item:any) {
+     item.embargoEndDate = event.target.value ;
+   }
+   publicationsChanged($event) {
+     this.publications=$event.value;
+     this.publicationsChange.emit({
+       value: this.publications
+     });
+   }
+   /* The following methods:
+      *typeChanged
+      *confirmOpen
+      *confirmClose
+    implement the functionality: change accessRights of a publication - apply to all if asked */
+   accessRightsTypeChanged (type:any, item:any) {
+       item.accessRights = type;
+       if(this.publications.length > 1 ){
+         this.commonAccessRights = type;
+         if(this.commonAccessRights == "EMBARGO"){
+           this.commonEmbargoEndDate = item.embargoEndDate;
+         }
+         this.confirmOpen();
+       }
+
+   }
+   confirmOpen(){
+     this.alertApplyAll.cancelButton = true;
+     this.alertApplyAll.okButton = true;
+     this.alertApplyAll.alertTitle = "Change access rights";
+     this.alertApplyAll.message = "Do you wish to apply the change to every publication?";
+     this.alertApplyAll.okButtonText = "Yes";
+     this.alertApplyAll.cancelButtonText = "No";
+     this.alertApplyAll.open();
+   }
+    confirmClose(data){
+      for (var i = 0; i < this.publications.length; i++) {
+        this.publications[i].accessRights = this.commonAccessRights;
+        if(this.commonAccessRights == "EMBARGO"){
+          this.publications[i].embargoEndDate = this.commonEmbargoEndDate;
+        }
+      }
+   }
+}

portal-2/src/app/claimPages/linking/selected/selectedResults.component.ts

@@ -0,0 +1,80 @@
+import {Component, Input,Output, EventEmitter} from '@angular/core';
+
+@Component({
+    selector: 'claim-selected-results',
+    template: `
+
+
+      <!-- Results -->
+
+        <div *ngIf=" !(inline && (hideType == 'publication' || hideType == 'dataset' )) && (datasets || publications)"  class="publications" >
+          <ul class="list-group">
+            <li class="list-group-item panel-footer "> Research Results ({{(datasets.length+publications.length)}})
+               <span *ngIf=" !inline  && linkToResults "  title="Add More Research Results" (click)="showType('result')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+            <li *ngIf="publications && datasets && publications.length == 0 && datasets.length == 0"  class="list-group-item">There are no Research Results </li>
+            <li  *ngIf="(publications &&  publications.length > 0) ||(datasets &&  datasets.length > 0 ) "  class="list-group-item  list-group-item-warning ">{{publications. length }} Selected Publications:
+               <span  *ngIf=" !inline && linkToResults " title="Add More Publications" (click)="showType('result')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+
+
+
+             <claim-selected-publications    [publications]="publications"    [showAccessRights]="showAccessRights"
+               [linkToResults]="(bulkMode)?false:true" >
+               </claim-selected-publications>
+            <li *ngIf="publications.length > 0 || datasets.length > 0" class="list-group-item  list-group-item-warning "> {{datasets.length}} Selected Research Data:
+              <span  *ngIf=" !inline  && linkToResults " title="Add More  Research Data" (click)="showType('result')" aria-hidden="true" class="glyphicon glyphicon-plus "  style="float:right;cursor: pointer;"></span>
+            </li>
+
+
+            <claim-selected-datasets    [datasets]="datasets"    [showAccessRights]="showAccessRights"
+                 [linkToResults]="(bulkMode)?false:true" >
+                </claim-selected-datasets>
+
+          </ul>
+          </div>
+
+          `
+
+})
+export class ClaimSelectedResultsComponent {
+   ngOnInit() {
+     var myDate = new Date();
+     this.todayDate=( myDate.getFullYear()+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+     this.nextDate= ( (myDate.getFullYear()+100)+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;
+     //2015-05-01
+}
+
+
+
+  @Input() publications;
+  @Input() datasets;
+  @Input() showAccessRights:boolean = false;
+  @Input() show='home';
+  @Input() inline:boolean = false;
+  @Input() hideType;
+  @Input() bulkMode:boolean = false;
+  @Input() linkToResults:boolean = true;
+   @Output() showChange = new EventEmitter();
+
+  todayDate = '';
+  nextDate = '';
+  showType(type){
+   if(type != this.show){
+     this.show = type;
+     this.showChange.emit({
+       value: this.show
+     });
+   }
+  }
+  showChanged($event) {
+    this.show=$event.value;
+
+      this.showChange.emit({
+       value: this.show
+     });
+
+  }
+
+
+}

portal-2/src/app/claimPages/myClaims/myClaims.component.ts

@@ -0,0 +1,34 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+
+
+@Component({
+    selector: 'my-claims',
+    template: `
+    <div *ngIf="user" class="container">
+      <div class="page-header">
+          <h1> My Linked research resutls</h1>
+      </div>
+      <div>
+        <div class="text-right"><a  routerLink="/linking">Add more Links?</a></div>
+        <claims enableDelete="true"  myClaims="true" isAdmin="false" [fetchId]="user" ></claims>
+      </div>
+    </div>
+
+
+    <div *ngIf="!user" class="container">
+      TODO login
+    </div>
+`
+
+})
+ export class MyClaimsComponent {
+  constructor () {
+   }
+  user:string="argirok@di.uoa.gr";
+   ngOnInit() {
+
+  }
+
+}

portal-2/src/app/claimPages/myClaimsDemo.component.ts

@@ -0,0 +1,51 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router } from '@angular/router';
+
+
+
+@Component({
+    selector: 'my-claims-demo',
+    template: `
+    <div *ngIf="user" class="container">
+      <div class="page-header">
+          <h1> My Claims Demo</h1>
+      </div>
+      <div>
+        <div class=""><a  routerLink="/Linking">Linking</a></div>
+        <div class=""><a  routerLink]="/MyClaims">MyClaims</a></div>
+        <div class=""><a  routerLink="/Claims">Claims Admin</a></div>
+        <p> Extra parameters for claims admin</p>
+        <div class=""><a  href="claims?fetchBy=User&fetchId=amelie.baecker@uni-bielefeld.de">Claims By user</a></div>
+        <div class=""><a  href="claims?fetchBy=Project&fetchId=corda_______::2c37878a0cede85dbbd1081bb9b4a2f8">Claims By project</a></div>
+        <div class=""><a  href="claims?fetchBy=Context&fetchId=egi::country::gr">Claims By context</a></div>
+
+<!--        <p>Orcid
+          <p>N.M.
+          0000-0002-3477-3082
+          </p>
+        </p> -->
+         <div class=""><a href="publication?articleId=od_______908::3a5b2885656a91307156325644e73b92"  >Publication od_______908::3a5b2885656a91307156325644e73b92</a></div>
+         <!--<div class=""><a href="publication?articleId=od_______908::3a5b2885656a91307156325644e73b92"  >Publication od_______908::3a5b2885656a91307156325644e73b92</a></div>
+         <div class=""><a href="publication?articleId=od_______908::3a5b2885656a91307156325644e73b92"  >Publication od_______908::3a5b2885656a91307156325644e73b92</a></div>-->
+       </div>
+    </div>
+
+
+
+`
+//(click)="changeOrderby('target')"
+//od_______908::3a5b2885656a91307156325644e73b92
+
+})
+ export class MyClaimsDemoComponent {
+  constructor ( private _router: Router  ) {
+   }
+  user:string="argirok@di.uoa.gr";
+   ngOnInit() {
+
+  }
+  goToPub(id: number){
+    this._router.navigate( ['Publication', { articleId: id}] );
+  }
+}

portal-2/src/app/common/autoComplete.component.ts

@@ -0,0 +1,91 @@
+import {Component, ElementRef} from '@angular/core';
+
+
+@Component({
+    selector: 'autocomplete',
+    template: `
+        <div class="container" >
+            <div class="input-field col s12">
+
+          </div>
+          <label for="country">Country</label>
+              <input id="country" type="text" class="validate filter-input" [(ngModel)]=query (keyup)=filter()   >
+
+
+
+            <div class="suggestions" *ngIf="filteredList.length > 0">
+                <ul class="list-group"  *ngFor=" let item of filteredList" >
+                    <li  class="list-group-item" >
+                        <a (click)="select(item)">{{item}}</a>
+                    </li>
+                </ul>
+            </div>
+            <div class="selections"  *ngIf="selectedList.length > 0">
+              <label for="selecteditems">Selected: </label>
+                <ul id ="selecteditems" class="nav nav-pills" *ngFor="let item of selectedList" >
+                    <li   role="presentation"  (click)="remove(item)">{{item}} <span class="badge">X</span>
+                    </li>
+                </ul>
+            </div>
+        </div>
+        `
+})
+export class AutocompleteComponent {
+    public query = '';
+    public countries = [ "Albania","Andorra","Armenia","Austria","Azerbaijan","Belarus",
+                        "Belgium","Bosnia & Herzegovina","Bulgaria","Croatia","Cyprus",
+                        "Czech Republic","Denmark","Estonia","Finland","France","Georgia",
+                        "Germany","Greece","Hungary","Iceland","Ireland","Italy","Kosovo",
+                        "Latvia","Liechtenstein","Lithuania","Luxembourg","Macedonia","Malta",
+                        "Moldova","Monaco","Montenegro","Netherlands","Norway","Poland",
+                        "Portugal","Romania","Russia","San Marino","Serbia","Slovakia","Slovenia",
+                        "Spain","Sweden","Switzerland","Turkey","Ukraine","United Kingdom","Vatican City"];
+    public filteredList = [];
+    public selectedList = [];
+    public elementRef;
+
+    constructor(myElement: ElementRef) {
+        this.elementRef = myElement;
+    }
+
+    filter() {
+      if (this.query !== ""){
+          this.filteredList = this.countries.filter(function(el){
+              return el.toLowerCase().indexOf(this.query.toLowerCase()) > -1;
+          }.bind(this));
+      }else{
+          this.filteredList = [];
+      }
+    }
+
+    select(item){
+        this.query = "";
+        this.filteredList = [];
+        this.selectedList.push(item);
+          console.info("Select:"+this.selectedList);
+          for (var i = 0; i < this.selectedList.length; i++) {
+              console.log(this.selectedList[i]);
+          }
+    }
+    remove(item){
+      var index:number =this.selectedList.indexOf(item);
+      console.info("Try to remove item from  :"+this.selectedList.indexOf(item));
+      if (index > -1) {
+          this.selectedList.splice(index, 1);
+      }
+          console.info("Item removed "+this.selectedList.indexOf(item));
+    }
+  handleClick(event){
+     var clickedComponent = event.target;
+     var inside = false;
+     do {
+         if (clickedComponent === this.elementRef.nativeElement) {
+             inside = true;
+         }
+        clickedComponent = clickedComponent.parentNode;
+     } while (clickedComponent);
+      if(!inside){
+          this.filteredList = [];
+      }
+  }
+}

portal-2/src/app/common/claimEntityFormatter.component.ts

@@ -0,0 +1,36 @@
+import {Component, Input} from '@angular/core';
+
+//Usage Example "<claim-entity [entity]="" [type]="" > </claim-entity>"
+
+//externalUrl
+@Component({
+  selector: 'claim-entity',
+  template: `
+
+  <div *ngIf="type == 'publication' || type == 'dataset'">
+  <i>({{type}}) </i>
+      <publication-title [title]="entity.title" [url]="entity.externalUrl" ></publication-title>
+  </div>
+  <div *ngIf="type == 'project'  ">
+  <i>(Project)</i>
+  <project-title [project]="entity"></project-title>
+  </div>
+  <div *ngIf="type == 'context'  ">
+    <i>(Context)</i>
+    <h5>{{entity.title}}</h5>
+  </div>
+  `
+})
+
+export class ClaimEntityFormatter {
+  @Input() entity: string[];
+  @Input() type: string;
+
+  constructor () {}
+
+  ngOnInit() {
+
+  }
+
+
+}

portal-2/src/app/common/modal/alert.ts

@@ -0,0 +1,110 @@
+import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmitter, Output} from '@angular/core';
+// import { DynamicComponentLoader} from '@angular/core';
+
+import {Open} from './open.component';
+
+@Component({
+  selector: 'modal-alert',
+  template: `
+  <div class="modal fade" [open]="!isOpen" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+    <div class="modal-dialog" role="">
+      <div class="modal-content">
+        <div class="modal-header" [hidden]=!alertHeader>
+          <button type="button" class="close" data-dismiss="modal" (click)='cancel()' aria-label="Close"><span aria-hidden="true">&times;</span></button>
+          <h4 class="modal-title text-center" id="myModalLabel">{{alertTitle}}</h4>
+        </div>
+        <div class="modal-body">
+          <div [hidden]=!alertMessage>
+          {{message}}
+          </div>
+        </div>
+        <div class="modal-footer" [hidden]=!alertFooter>
+        <span [hidden]=!okButton >
+          <button class="btn btn-primary" (click)="ok()">{{okButtonText}}</button>
+          </span>
+          <span [hidden]=!cancelButton>
+          <button class="btn btn-primary" (click)="cancel()">{{cancelButtonText}}</button>
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+  `,
+  encapsulation: ViewEncapsulation.None,
+})
+/**
+  * API to an open alert window.
+  */
+export class AlertModal{
+  /**
+     * Caption for the title.
+     */
+  public alertTitle:string;
+  /**
+     * Describes if the alert contains Ok Button.
+     * The default Ok button will close the alert and emit the callback.
+     * Defaults to true.
+     */
+  public okButton:boolean = true;
+  /**
+     * Caption for the OK button.
+     * Default: Ok
+     */
+  public okButtonText:string= 'Ok';
+  /**
+     * Describes if the alert contains cancel Button.
+     * The default Cancelbutton will close the alert.
+     * Defaults to true.
+     */
+  public cancelButton:boolean = true;
+  /**
+     * Caption for the Cancel button.
+     * Default: Cancel
+     */
+  public cancelButtonText:string = 'Cancel';
+  /**
+     * if the alertMessage is true it will show the contentString inside alert body.
+     */
+  public alertMessage:boolean = true;
+  /**
+     * Some message/content can be set in message which will be shown in alert body.
+     */
+  public message:string;
+  /**
+    * if the value is true alert footer will be visible or else it will be hidden.
+    */
+  public alertFooter:boolean= true;
+  /**
+    * shows alert header if the value is true.
+    */
+  public alertHeader:boolean = true;
+  /**
+    * if the value is true alert will be visible or else it will be hidden.
+    */
+  public isOpen:boolean=false;
+  /**
+    * Emitted when a ok button was clicked
+    * or when Ok method is called.
+    */
+  @Output() public alertOutput:EventEmitter<any> = new EventEmitter();
+  constructor( public _elementRef: ElementRef){}
+  /**
+       * Opens a alert window creating backdrop.
+       */
+  open(){
+    this.isOpen= true;
+  }
+  /**
+     *  ok method closes the modal and emits modalOutput.
+     */
+  ok(){
+    this.isOpen = false;
+    this.alertOutput.emit(true);
+  }
+  /**
+     *  cancel method closes the moda.
+     */
+  cancel(){
+    this.isOpen = false;
+  }
+}

portal-2/src/app/common/modal/loading.component.ts

@@ -0,0 +1,49 @@
+import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmitter, Output} from '@angular/core';
+
+@Component({
+  selector: 'modal-loading',
+  template: `
+  <div class="modal fade" [open]="!isOpen" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+    <div class="modal-dialog" role="">
+      <div class="modal-content">
+
+        <div class="modal-body">
+          <div >
+          <h3 class="text-center" >{{message}}</h3>
+          </div>
+        </div>
+
+      </div>
+    </div>
+  </div>
+  `,
+  encapsulation: ViewEncapsulation.None,
+})
+/**
+  * API to an open alert window.
+  */
+export class ModalLoading{
+
+@Input() public message:string ="Loading";
+
+  /**
+    * if the value is true alert will be visible or else it will be hidden.
+    */
+  public isOpen:boolean=false;
+  /**
+    * Emitted when a ok button was clicked
+    * or when Ok method is called.
+    */
+  @Output() public alertOutput:EventEmitter<any> = new EventEmitter();
+  constructor( public _elementRef: ElementRef){}
+  /**
+       * Opens a alert window creating backdrop.
+       */
+  open(){
+    this.isOpen= true;
+  }
+
+  close(){
+    this.isOpen = false;
+  }
+}

portal-2/src/app/common/modal/modal.module.ts

@@ -0,0 +1,20 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {AlertModal} from './alert';
+import {ModalLoading} from './loading.component';
+import {Open} from './open.component';
+
+//helpers
+
+@NgModule({
+  imports: [ CommonModule, FormsModule ],
+  declarations: [
+    AlertModal, ModalLoading, Open
+  ],
+  exports: [
+    AlertModal, ModalLoading
+  ]
+})
+export class ModalModule { }

portal-2/src/app/common/modal/open.component.ts

@@ -0,0 +1,55 @@
+import {Directive, Input, HostBinding} from '@angular/core';
+
+// todo: add animate
+// todo: add init and on change
+@Directive({selector: '[open]'})
+export class Open {
+  @HostBinding('style.display')
+  private display:string;
+  @HostBinding('class.in')
+  @HostBinding('attr.aria-expanded')
+  private isExpanded:boolean = true;
+
+  @Input()
+  private set open(value:boolean) {
+    this.isExpanded = value;
+    this.toggle();
+  }
+
+  private get open():boolean {
+    return this.isExpanded;
+  }
+
+  constructor() {
+  }
+  init() {
+    this.isExpanded = false;
+    this.display = 'none';
+  }
+  toggle() {
+    if (this.isExpanded) {
+      this.hide();
+    } else {
+      this.show();
+    }
+  }
+
+  hide() {
+    this.isExpanded = false;
+    this.display = 'none';
+    if (typeof document !== 'undefined') {
+      let backDrop = document.getElementsByClassName("modal-backdrop");
+      if(backDrop.length>0){
+        document.body.removeChild(backDrop[0]);
+      }
+    }
+  }
+
+  show() {
+    let backDrop = document.createElement('div');
+    backDrop.className="modal-backdrop fade in";
+    document.body.appendChild(backDrop);
+    this.isExpanded = true;
+    this.display = 'block';
+  }
+}

portal-2/src/app/common/pagingFormatter.component.ts

@@ -0,0 +1,82 @@
+import {Component, Input} from '@angular/core';
+import {Router} from '@angular/router';
+
+//Usage Example <paging [currentPage]="page" [totalResults]="resultsNum"  [navigateTo]="Search" [term]="keyword"> </paging>
+
+@Component({
+  selector: 'paging',
+  template: `
+  <div *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage &&  currentPage <= getTotalPages() ) " >
+  <ul class="pagination pagination-sm">
+
+  <li *ngIf=" currentPage  > 1" ><a (click)="onPage((1))" aria-label="Previous">
+       <span aria-hidden="true">&laquo;</span></a></li>
+  <!--<li *ngIf=" currentPage  > 1"><a (click)="onPage((currentPage -1))">\<</a></li>-->
+
+   <li *ngIf=" currentPage -2 > 0"><a (click)="onPage((currentPage -2))">{{currentPage -2}}</a></li>
+   <li *ngIf=" currentPage -1 > 0 "><a (click)="onPage((currentPage -1))">{{currentPage -1}}</a></li>
+   <li class="active"><a >{{currentPage}}</a></li>
+   <li *ngIf=" currentPage +1 <= getTotalPages() "><a (click)="onPage((currentPage +1))">{{currentPage +1}}</a></li>
+   <li *ngIf=" currentPage +2 <= getTotalPages() "><a (click)="onPage((currentPage +2))">{{currentPage +2}}</a></li>
+   <li *ngIf=" (currentPage -2 <= 0)&&(currentPage +3 <= getTotalPages()) "><a (click)="onPage((currentPage +3))">{{currentPage +3}}</a></li>
+   <li *ngIf=" (currentPage -1 <= 0)&&(currentPage +4 <= getTotalPages()) "><a (click)="onPage((currentPage +4))">{{currentPage +4}}</a></li>
+
+    <li *ngIf="getTotalPages()  > currentPage"><a (click)="onPage((getTotalPages()))" aria-label="Next">
+        <span aria-hidden="true">&raquo;</span>
+      </a></li>
+
+
+ </ul>
+  </div>
+  `
+})
+
+export class PagingFormatter {
+  @Input() currentPage: number = 1;
+  @Input() navigateTo: string;
+  @Input() term: string='';
+  @Input() size: number=10;
+  @Input() totalResults: number = 10;
+  @Input() params;
+
+  constructor ( private _router: Router) {
+   }
+
+  ngOnInit() {
+      console.info("In paging -- CurrentPage:"+this.currentPage+" "+"total Pages = "+this.getTotalPages()  +" Results num:"+this.totalResults);
+  }
+  getTotalPages(){
+    var i:number =parseInt(''+(this.totalResults/this.size));
+     return (((this.totalResults/this.size) == i )? i :(i+1)) ;
+  }
+  onPrev(){
+    if(this.params){
+      let pageparams= this.params;
+      pageparams.page=this.currentPage -1
+      this._router.navigate( [this.navigateTo, pageparams] );
+    }else{
+      this._router.navigate( [this.navigateTo, { keyword: this.term, page: (this.currentPage -1) }] );
+    }
+  }
+
+  onNext(){
+    if(this.params){
+      let pageparams= this.params;
+      pageparams.page=this.currentPage +1;
+      this._router.navigate( [this.navigateTo, pageparams] );
+    }else{
+      this._router.navigate( [this.navigateTo, { keyword: this.term, page: (this.currentPage +1) }] );
+    }
+  }
+  onPage(pageNum: number){
+    if(this.params){
+      let pageparams= this.params;
+      pageparams.page=pageNum;
+      this._router.navigate( [this.navigateTo, pageparams] );
+    }else if(this.term!=''){
+       this._router.navigate( [this.navigateTo, { keyword: this.term, page: pageNum, size: this.size }] );
+     }else{
+       this._router.navigate( [this.navigateTo, { page: pageNum, size: this.size }] );
+     }
+  }
+}

portal-2/src/app/common/pagingFormatterNoLoad.component.ts

@@ -0,0 +1,75 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+
+
+//Usage Example <paging [currentPage]="page" [totalResults]="resultsNum"  [navigateTo]="Search" [term]="keyword"> </paging>
+
+@Component({
+  selector: 'paging-no-load',
+  template: `
+  <div *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage &&  currentPage <= getTotalPages() ) " >
+  <ul class="pagination pagination-sm">
+
+   <li *ngIf=" currentPage  > 1" ><a (click)="onPage((1))" aria-label="Previous">
+       <span aria-hidden="true">&laquo;</span></a></li>
+   <li *ngIf=" currentPage -2 > 0"><a (click)="onPage((currentPage -2))">{{currentPage -2}}</a></li>
+   <li *ngIf=" currentPage -1 > 0 "><a (click)="onPage((currentPage -1))">{{currentPage -1}}</a></li>
+   <li class="active"><a >{{currentPage}}</a></li>
+   <li *ngIf=" currentPage +1 <= getTotalPages() "><a (click)="onPage((currentPage +1))">{{currentPage +1}}</a></li>
+   <li *ngIf=" currentPage +2 <= getTotalPages() "><a (click)="onPage((currentPage +2))">{{currentPage +2}}</a></li>
+   <li *ngIf=" (currentPage -2 <= 0)&&(currentPage +3 <= getTotalPages()) "><a (click)="onPage((currentPage +3))">{{currentPage +3}}</a></li>
+   <li *ngIf=" (currentPage -1 <= 0)&&(currentPage +4 <= getTotalPages()) "><a (click)="onPage((currentPage +4))">{{currentPage +4}}</a></li>
+   <li *ngIf="getTotalPages()  > currentPage"><a (click)="onPage((getTotalPages()))" aria-label="Next">
+        <span aria-hidden="true">&raquo;</span>
+      </a>
+  </li>
+
+
+ </ul>
+  </div>
+  `
+})
+
+export class pagingFormatterNoLoad {
+  @Input() public currentPage: number = 1;
+  @Input() public navigateTo: string;
+  @Input() public term: string='';
+  @Input() public size: number=10;
+  @Input() public totalResults: number = 10;
+  @Input() public params;
+
+  @Output() pageChange  = new EventEmitter();
+
+  constructor () {
+   }
+
+  ngOnInit() {
+      console.info("In paging -- CurrentPage:"+this.currentPage+" "+"total Pages = "+this.getTotalPages()  +" Results num:"+this.totalResults);
+  }
+  getTotalPages(){
+    var i= this.totalResults/this.size;
+    var integerI=parseInt(''+i);
+    return parseInt(''+((i==integerI)?i:i+1));
+  }
+  onPrev(){
+    this.currentPage=this.currentPage-1;
+    this.pageChange.emit({
+     value: this.currentPage
+   });
+
+  }
+
+  onNext(){
+
+    this.currentPage=this.currentPage+1;
+    this.pageChange.emit({
+     value: this.currentPage
+   });
+  }
+  onPage(pageNum: number){
+
+     this.currentPage=pageNum;
+     this.pageChange.emit({
+      value: this.currentPage
+    });
+  }
+}

portal-2/src/app/common/projectTitleFormatter.component.ts

@@ -0,0 +1,23 @@
+import {Component, Input} from '@angular/core';
+import {OpenaireProperties} from '../openaireProperties';
+
+//Usage Example "<project-title [project]="X" > </project-title>"
+
+@Component({
+  selector: 'project-title',
+  template: `
+  <div class="project-title">
+    <h5  ><a target="_blank" [href]="url" >{{project.name}} ({{project.funderName}})</a></h5>
+  </div>
+  `
+})
+
+export class ProjectTitleFormatter {
+  @Input() project: string[];
+  private url:string;
+  constructor () {}
+
+  ngOnInit() {
+    this.url = OpenaireProperties.getsearchLinkToProject() + "?projectId=" + this.project["openaireId"];
+  }
+}

portal-2/src/app/common/publicationTitleFormatter.component.ts

@@ -0,0 +1,26 @@
+import {Component, Input} from '@angular/core';
+
+//Usage Example "<publication-title [title]="X" [url]="X" > </publication-title>"
+
+@Component({
+  selector: 'publication-title',
+  template: `
+  <div class="publication-title">
+    <h5 *ngIf="url" ><a target="_blank" href="{{url}}" >{{title}}</a></h5>
+    <h5 *ngIf="!url" >{{title}}</h5>
+  </div>
+  `
+})
+
+export class PublicationTitleFormatter {
+  @Input() title: string[];
+  @Input() url: string[];
+
+  constructor () {}
+
+  ngOnInit() {
+
+  }
+
+
+}

portal-2/src/app/common/sharedComponents.module.ts

@@ -0,0 +1,40 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {ModalModule}  from './modal/modal.module';
+
+import {pagingFormatterNoLoad} from './pagingFormatterNoLoad.component';
+import {ProjectTitleFormatter} from './projectTitleFormatter.component';
+import {PublicationTitleFormatter} from './publicationTitleFormatter.component';
+import {PagingFormatter} from './pagingFormatter.component';
+import {AutocompleteComponent} from './autoComplete.component';
+
+import {AlertModal} from './modal/alert';
+import {ModalLoading} from './modal/loading.component';
+
+//helpers
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, ModalModule
+  ],
+  declarations: [
+    pagingFormatterNoLoad,
+    ProjectTitleFormatter,
+    PublicationTitleFormatter,
+    PagingFormatter,
+    AutocompleteComponent
+
+  ],
+  exports: [
+      pagingFormatterNoLoad,
+      ProjectTitleFormatter,
+      PublicationTitleFormatter,
+      PagingFormatter,
+      AlertModal, ModalLoading,
+      AutocompleteComponent
+
+    ]
+})
+export class SharedComponentsModule { }

portal-2/src/app/deposit/deposit.component.ts

@@ -0,0 +1,18 @@
+import {Component} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+@Component({
+    selector: 'deposit',
+    template: `
+    <div class="container">
+    <h1>Deposit</h1>
+     <span>Under construction</span>
+    </div>`
+
+})
+
+export class DepositComponent {
+  constructor () {}
+
+
+}

portal-2/src/app/deposit/deposit.module.ts

@@ -0,0 +1,22 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { DepositComponent } from './deposit.component';
+
+
+//helpers
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+    DepositComponent
+
+  ],
+  exports: [
+    DepositComponent
+
+    ]
+})
+export class DepoditModule { }

portal-2/src/app/entities/claim.ts

@@ -0,0 +1,15 @@
+export class Claim {
+  id: string;
+  sourceType: string;
+  targetType: string;
+  sourceId: string;
+  targetId: string;
+  date: string;
+  DOI: string;
+  project: Project
+  userMail: string;
+
+}
+export class Project{
+
+}

portal-2/src/app/entities/datasetInfo.ts

@@ -0,0 +1,26 @@
+export class DatasetInfo {
+    title: { "name": string, "url": string, "accessMode": string};
+    authors: { "name": string, "url": string}[];
+    date: string;
+    embargoEndDate: string;
+    type: string;
+    downloadFrom: Map<string, {"url": string[], "accessMode": string[]}>;   //key is name
+    publishedIn: Map<string, {"url": string[], "accessMode": string[]}>;    //key is name
+    identifiers: Map<string, string[]>;
+    publisher: string;
+    subjects: string[];
+    classifiedSubjects: Map<string, string[]>;
+    description: string;
+    bestlicense: string;
+    collectedFrom: { "name": string, "url": string}[];
+    fundedByProjects: { "url": string, "acronym": string, "title": string,
+                        "funderShortname": string, "funderName": string,
+                        "funding": string, "inline": boolean}[];
+    //relatedPublications: { "name": string, "url": string, "date": string, "trust": string}[];
+    //relatedResearchData: { "name": string, "url": string, "date": string, "trust": string}[];
+    //similarPublications: { "name": string, "url": string, "date": string, "trust": string}[];
+    //similarDatasets: { "name": string, "url": string, "date": string, "trust": string}[];
+    relatedResearchResults: { "name": string, "url": string, "date": string, "trust": string, "class": string}[];
+    similarResearchResults: {"name": string, "url": string, "date": string, "trust": string, "class": string}[];
+    contexts: { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}[];
+}

portal-2/src/app/entities/organizationInfo.ts

@@ -0,0 +1,11 @@
+export class OrganizationInfo {
+    title: { "name": string, "url": string };
+    name: string;
+    country: string;
+
+    projects: Map<string, { "name": string, "url": string, "code": string,
+                            "acronym": string, "funder": string, "fundingStream": string,
+                            "fundingLevel1": string, "fundingLevel2": string,
+                            "sc39": string, "startDate": string, "endDate": string }[]>;
+    dataProviders: { "name": string, "url": string, "type": string, "websiteUrl": string }[];
+}

portal-2/src/app/entities/personInfo.ts

@@ -0,0 +1,9 @@
+export class PersonInfo {
+    fullname: string;
+    firstname: string;
+    secondnames: string;
+    country: string;
+
+    publications: any;
+    researchData: any;
+}

portal-2/src/app/entities/projectInfo.ts

@@ -0,0 +1,19 @@
+export class ProjectInfo {
+    acronym: string;
+    title: string;
+    callIdentifier: string;
+    funder: string;
+    funding: string;
+    contractNum: string;
+    startDate: string;
+    endDate: string;
+    openAccessMandate: string;
+    specialClause39: string;
+    organizations: Map<string, string>;
+    url: string;
+    urlInfo: string;
+
+    publications: any;
+    researchData: any;
+    statistics: any;
+}

portal-2/src/app/entities/publication.ts

@@ -0,0 +1,7 @@
+export class Publication {
+  title: string;
+  publisher: string;
+  DOI: string;
+  source: string;
+  type: string;
+}

portal-2/src/app/entities/publicationInfo.ts

@@ -0,0 +1,30 @@
+export class PublicationInfo {
+    title: { "name": string, "url": string, "accessMode": string};
+    authors: { "name": string, "url": string}[];
+    date: string;
+    embargoEndDate: string;
+    types: string[];
+    downloadFrom: Map<string, {"url": string[], "accessMode": string[]}>;   //key is name
+    publishedIn: Map<string, {"url": string[], "accessMode": string[]}>;    //key is name
+    bioentities: Map<string, Map<string, string>>;      //<site name, <>>
+    identifiers: Map<string, string[]>;     //key is the classname
+    publisher: string;
+    journal: {"journal": string, "issn": string, "lissn": string};
+    languages: string[];
+    subjects: string[];
+    classifiedSubjects: Map<string, string[]>;          //<class of subject, subjects>
+    description: string;
+    bestlicense: string;
+    collectedFrom: { "name": string, "url": string}[];
+    fundedByProjects: { "url": string, "acronym": string, "title": string,
+                        "funderShortname": string, "funderName": string,
+                        "funding": string, inline: boolean}[];
+    //relatedPublications: { "name": string, "url": string, "date": string, "trust": string}[];
+    //relatedResearchData: { "name": string, "url": string, "date": string, "trust": string}[];
+    //similarPublications: {"name": string, "url": string, "date": string, "trust": string}[];
+    //similarDatasets: {"name": string, "url": string, "date": string, "trust": string}[];
+    relatedResearchResults: { "name": string, "url": string, "date": string, "trust": string, "class": string}[];
+    similarResearchResults: {"name": string, "url": string, "date": string, "trust": string, "class": string}[];
+    references: { "name": string, "url": string}[];
+    contexts: { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}[];
+}

portal-2/src/app/entities/searchResult.ts

@@ -0,0 +1,22 @@
+export class SearchResult {
+    title: { "name": string, "url": string, "accessMode": string};
+
+    //publications & organizations:
+    projects: { "name": string, "url": string};
+    //datasets & publications
+    description: string;
+    year: string;
+    authors: { "name": string, "url": string}[];
+    //datasets:
+    publisher: string;
+    //dataproviders & projects:
+    organizations: { "name": string, "url": string};
+    //projects:
+    funders: string;
+    //organizations:
+    country: string;
+    //dataproviders:
+    type: string;
+    websiteURL: string;
+    OAIPMHURL: string;
+}

portal-2/src/app/exportCSV.component.ts

@@ -0,0 +1,110 @@
+import {Component, Input} from '@angular/core';
+
+@Component({
+    selector: 'export',
+    template: `
+        <a *ngIf="data != undefined && data != null && data.export != undefined && data.export != null"
+            (click)="downloadCSV()">
+                {{linkname}}
+        </a>
+
+        <p *ngIf="data == undefined || data == null || data.export == undefined || data.export == null">
+            {{linkname}}
+        </p>
+    `
+
+    })
+
+export class ExportCSVComponent {
+    stockData : any =
+        {
+            "export":
+            [
+                {
+                    Symbol: "AAPL",
+                    Company: "Apple Inc.",
+                    Price: "132.54"
+                },
+                {
+                    Symbol: "INTC",
+                    Company: "Intel Corporation",
+                    Price: "33.45"
+                },
+                {
+                    Symbol: "GOOG",
+                    Company: "Google Inc",
+                    Price: "554.52"
+                },
+            ],
+
+            "columnDelimiter": ',',
+            "lineDelimiter": '\n'
+        };
+
+    @Input() data: any = this.stockData;
+    @Input() filename: string;
+    @Input() linkname: string = "Download CSV";
+
+    constructor () {
+        console.info('export constructor');
+    }
+
+    ngOnInit() {
+    }
+
+    convertArrayOfObjectsToCSV(args) {
+        console.info("convertArrayOfObjectsToCSV");
+
+        var result, ctr, keys, columnDelimiter, lineDelimiter, data;
+
+        data = args.export || null;
+        if (data == null || !data.length) {
+            return null;
+        }
+
+        columnDelimiter = args.columnDelimiter || ',';
+        lineDelimiter = args.lineDelimiter || '\n';
+
+        keys = Object.keys(data[0]);
+
+        result = '';
+        result += keys.join(columnDelimiter);
+        result += lineDelimiter;
+
+        data.forEach(function(item) {
+            ctr = 0;
+            keys.forEach(function(key) {
+                if (ctr > 0) result += columnDelimiter;
+                result += item[key];
+                ctr++;
+            });
+            result += lineDelimiter;
+        });
+
+        return result;
+    }
+
+    downloadCSV() {
+        console.info("downloadCSV");
+
+        var data, filename, link;
+
+        var csv = this.convertArrayOfObjectsToCSV(this.data);
+        if (csv == null) return;
+
+        filename = this.filename || 'export.csv';
+
+        if (!csv.match(/^data:text\/csv/i)) {
+            csv = 'data:text/csv;charset=utf-8,' + csv;
+        }
+        data = encodeURI(csv);
+
+        //link = document.createElement('a');
+        link = document.getElementsByTagName('a');
+        link[0].setAttribute('href', data);
+        link[0].setAttribute('download', filename);
+        //document.body.appendChild(link);
+        link[0].click();
+        //document.body.removeChild(link);
+    }
+}

portal-2/src/app/home/home.component.html

@@ -0,0 +1,15 @@
+
+<div class="container">
+  <div class="row">
+    <form>
+      <div class="col-lg-6">
+        <div class="input-group">
+          <input #term type="text" class="form-control col-xs-5" placeholder="Search for..."  name="keyword" >
+          <span class="input-group-btn">
+            <button class="btn btn-default" type="submit" (click)="searchTerm(term.value)" >GO</button>
+          </span>
+        </div>
+      </div>
+    </form>
+  </div>
+</div>

portal-2/src/app/home/home.component.ts

@@ -0,0 +1,17 @@
+import {Component} from '@angular/core';
+import {Router} from '@angular/router';
+import {Observable}       from 'rxjs/Observable';
+import {Location} from '@angular/common';
+
+@Component({
+    selector: 'home',
+    templateUrl: 'home.component.html',
+ })
+
+export class HomeComponent {
+  constructor ( private _router: Router, private location: Location) {}
+
+  searchTerm(term: string) {
+        window.location.href="/search?keyword="+term;
+  }
+}

portal-2/src/app/landingPages/dataset/dataset.component.html

@@ -0,0 +1,183 @@
+<div class="container dataset">
+    <div class="container-header" >
+        <div *ngIf="datasetInfo != null" >
+            <showTitle [title]="datasetInfo.title"></showTitle>
+        </div>
+        <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+        <div *ngIf="errorMessage.length > 0" class="alert alert-danger" role="alert">{{errorMessage}}</div>
+    </div>
+
+    <div class="row row-offcanvas row-offcanvas-right" >
+
+        <div class="col-xs-6 col-sm-9 sidebar-offcanvas" *ngIf="datasetInfo != null">
+            <div>
+                <showAuthors [authors]="datasetInfo.authors"></showAuthors>
+                <span *ngIf="datasetInfo.date != ''">({{datasetInfo.date}})</span>
+            </div>
+
+            <dl class="dl-horizontal">
+                <dt *ngIf="datasetInfo.publisher != undefined && datasetInfo.publisher != ''">Publisher: </dt>
+                <dd *ngIf="datasetInfo.publisher != undefined && datasetInfo.publisher != ''">{{datasetInfo.publisher}}</dd>
+                <dt *ngIf="datasetInfo.type != undefined"> Type: </dt>
+                <dd *ngIf="datasetInfo.type != undefined">{{datasetInfo.type}}</dd>
+                <dt *ngIf="datasetInfo.embargoEndDate != undefined && datasetInfo.embargoEndDate != ''">Embargo end date: </dt>
+                <dd *ngIf="datasetInfo.embargoEndDate != undefined && datasetInfo.embargoEndDate != ''">{{datasetInfo.embargoEndDate}}</dd>
+
+                <showIdentifiers [identifiers]="datasetInfo.identifiers"></showIdentifiers>
+                <showSubjects [subjects]="datasetInfo.subjects" [classifiedSubjects]="datasetInfo.classifiedSubjects"></showSubjects>
+            </dl>
+
+            <blockquote *ngIf="datasetInfo.description != ''">
+                <div class="text-justify" [innerHTML]="datasetInfo.description"></div>
+            </blockquote>
+
+			<div class="text-right">
+            	<button (click)=" toggleClaimResult()" class = "btn btn-primary   btn-xs" >Add Research Results</button>
+            </div>
+            <inline-claim-result inlineType ="dataset" [inlineEntity]="result"  (datasetAdded)="resultsAdded($event,false)"  (publicationAdded)="resultsAdded($event,true)"   ></inline-claim-result>
+
+            <ul class="nav nav-tabs">
+                <li class="active">
+                     <a data-toggle="tab" href="#relatedTab">
+                         Related Research Results
+                         <span *ngIf="datasetInfo.relatedResearchResults == undefined" class="badge">0</span>
+                         <span *ngIf="datasetInfo.relatedResearchResults != undefined" class="badge">
+                             {{datasetInfo.relatedResearchResults.length}}
+                         </span>
+                     </a>
+                 </li>
+
+                <li role="presentation">
+                    <a data-toggle="tab" href="#similarTab">
+                        Similar Research Results
+                        <span *ngIf="datasetInfo.similarResearchResults == undefined" class="badge">0</span>
+                        <span *ngIf="datasetInfo.similarResearchResults != undefined" class="badge">
+                            {{datasetInfo.similarResearchResults.length}}
+                        </span>
+                    </a>
+                </li>
+            </ul>
+
+            <div class="tab-content">
+                <div id="relatedTab" class="tab-pane fade in active panel-body">
+                    <div *ngIf="datasetInfo.relatedResearchResults == undefined" class = "alert alert-info " >
+                        There are no related research results
+                    </div>
+                    <div *ngIf="datasetInfo.relatedResearchResults != undefined">
+                        <p>
+                            The results below are discovered through our pilot algorithms.
+                            <a href="mailto:">Let us know how we are doing!</a>
+                        </p>
+                        <tabTable [info]="datasetInfo.relatedResearchResults"></tabTable>
+                    </div>
+                </div>
+
+                <div id="similarTab" class="tab-pane fade panel-body">
+                    <div  *ngIf="datasetInfo.similarResearchResults == undefined"  class = "alert alert-info " >
+                        There are no similar research results
+                    </div>
+                    <div *ngIf="datasetInfo.similarResearchResults != undefined">
+                        <p>
+                            The results below are discovered through our pilot algorithms.
+                            <a href="mailto:">Let us know how we are doing!</a>
+                        </p>
+
+                        <tabTable [info]="datasetInfo.similarResearchResults"></tabTable>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="col-xs-12 col-sm-3" *ngIf="datasetInfo != null">
+            <ul class="list-group mainFunctionsBlock">
+                <li class="list-group-item">
+                    <dl class="functionsSection">
+                        <dt  >Share - Bookmark</dt>
+                        <dd>
+                        </dd>
+                    </dl>
+                </li>
+                <li class="list-group-item" *ngIf="datasetInfo.collectedFrom != undefined">
+                    <dl class="functionsSection">
+                        <dt>Collected from</dt>
+                        <dd  *ngFor="let item of datasetInfo.collectedFrom">
+                            <a href="{{item['url']}}">
+                                {{item['name']}}
+                            </a>
+                        </dd>
+                    </dl>
+                </li>
+                <li class="list-group-item" *ngIf="datasetInfo.downloadFrom != undefined && datasetInfo.downloadFrom.size > 0">
+                    <dl class="functionsSection">
+                        <dt class="title">Download from</dt>
+                        <dd class="line" *ngFor="let key of datasetInfo.downloadFrom.keys()">
+                            <div *ngIf="datasetInfo.downloadFrom.get(key)['url'].length > 1">
+                                {{key}}
+                                <span *ngFor="let url of datasetInfo.downloadFrom.get(key)['url']; let i=index;">
+                                    <a href="{{url}}">
+                                        [{{i+1}}]
+                                    </a>
+                                </span>
+                            </div>
+                            <a *ngIf="datasetInfo.downloadFrom.get(key)['url'].length == 1" href="{{datasetInfo.downloadFrom.get(key)['url']}}">
+                                {{key}}
+                            </a>
+                        </dd>
+                    </dl>
+                </li>
+
+
+                <li class="list-group-item">
+                    <dl class="functionsSection" *ngIf="datasetInfo.fundedByProjects != undefined">
+                        <dt class="title">Funded By</dt>
+                        <dd
+                            title="{{item['title']}}
+                            |   Project Code: {{item['acronym']}}
+                            |   Funder: {{item['funderName']}} ({{item['funderShortname']}})
+                            |   Funding: {{item['funding']}}"
+                            class="line" *ngFor="let item of datasetInfo.fundedByProjects">
+                                <a *ngIf="!item['inline']" href="{{item['url']}}">
+                                    {{item['funderShortname']?item['funderShortname']:item['funderName']}}
+                                    | {{ item['acronym']?item['acronym']:item['title']}}
+                                </a>
+
+                                <a *ngIf="item['inline']" href="{{item['url']}}">
+                                    <mark>
+                                        {{item['funderShortname']?item['funderShortname']:item['funderName']}}
+                                        | {{ item['acronym']?item['acronym']:item['title']}}
+                                    </mark>
+                                </a>
+                        </dd>
+                    </dl>
+                    <dl class="functionsSection" *ngIf="datasetInfo.fundedByProjects == undefined">
+                        <dt class="title">Funded By</dt>
+                    </dl>
+                    <button (click)="toggleClaimProject()"  class = "btn btn-primary   btn-xs" >Add Projects</button>
+                    <inline-claim-project *ngIf="result "   inlineType ="dataset" [inlineEntity]="result"  (projectAdded)="projectAdded($event)" ></inline-claim-project>
+                </li>
+                <li class="list-group-item">
+                    <dl class="functionsSection" *ngIf="datasetInfo.contexts != undefined">
+                        <dt class="title">Related to </dt>
+                        <dd class="line" *ngFor="let item of datasetInfo.contexts">
+                          <span *ngIf = "!item['inline']" >
+                            <span>{{item['labelContext']}}</span>
+                            <span *ngIf="item['labelCategory'] != null">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept'] != null">: {{item['labelConcept']}}</span>
+                          </span>
+                          <mark *ngIf = "item['inline']" >
+                            <span>{{item['labelContext']}}</span>
+                            <span *ngIf="item['labelCategory'] != null">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept'] != null">: {{item['labelConcept']}}</span>
+                          </mark>
+                        </dd>
+                    </dl>
+                    <dl class="functionsSection" *ngIf="datasetInfo.contexts == undefined">
+                        <dt class="title">Related to </dt>
+                    </dl>
+					<button (click)=" toggleClaimContext()" class = "btn btn-primary   btn-xs" >Add Concepts</button>
+                    <inline-claim-context inlineType ="dataset" [inlineEntity]="result"  (contextAdded)="contextAdded($event)"   ></inline-claim-context>
+                </li>
+            </ul>
+        </div>
+    </div>
+</div>

portal-2/src/app/landingPages/dataset/dataset.component.ts

@@ -0,0 +1,143 @@
+import {Component, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {DatasetService} from '../../services/dataset.service';
+import {DatasetInfo} from '../../entities/datasetInfo';
+import {ActivatedRoute} from '@angular/router';
+import { OpenaireProperties} from '../../openaireProperties'
+import {InlineClaimContextComponent} from '../../claimPages/inlineClaimContext/inlineClaimContext.component';
+import {InlineClaimProjectComponent} from '../../claimPages/inlineClaimProject/inlineClaimProject.component';
+import {InlineClaimResultComponent} from '../../claimPages/inlineClaimResult/inlineClaimResult.component';
+@Component({
+    selector: 'dataset',
+    templateUrl: 'dataset.component.html',
+})
+
+export class DatasetComponent {
+    constructor (private _datasetService: DatasetService, private  route: ActivatedRoute) {
+        console.info('dataset constructor');
+    }
+    ngOnInit() {
+      this.sub =  this.route.queryParams.subscribe(params => {
+        this.datasetId = params['datasetId'];
+         console.info("Id is :"+this.datasetId);
+         if(this.datasetId){
+            this.getDatasetInfo(this.datasetId);
+        }else{
+  		      this.warningMessage="No valid dataset id";
+        }
+      });
+
+    }
+
+    private datasetInfo: DatasetInfo;
+
+    private showStyle: boolean = false;
+    private showAllReferences: boolean = false;
+    private showAllRelResData: boolean = false;
+    private showAllSimilPubl: boolean = false;
+    private showAllBioentities: boolean = false;
+    private datasetId : string ;
+    private result ;
+
+
+    @ViewChild (InlineClaimProjectComponent) inlineClaimProject : InlineClaimProjectComponent ;
+    @ViewChild (InlineClaimContextComponent) inlineClaimContext : InlineClaimContextComponent ;
+    @ViewChild (InlineClaimResultComponent) inlineClaimResult : InlineClaimResultComponent ;
+
+    public warningMessage = "";
+    public errorMessage = "";
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+    }
+      sub: any;
+    getDatasetInfo(id:string) {
+        this.warningMessage = '';
+        this.errorMessage=""
+        console.info("do request");
+        this._datasetService.getDatasetInfo(id).subscribe(
+                data => {
+                    this.datasetInfo = data;
+
+                    this.result = []
+                    this.result = {id: id, type :"dataset", source : "openaire", title: this.datasetInfo.title,url: '', result: '', accessRights: this.datasetInfo.bestlicense, embargoEndDate: ''};
+
+                },
+                err => {
+                    console.error(err)
+                    console.info("error");
+
+                    this.errorMessage = 'No dataset found';
+                }
+            );
+
+    }
+
+    /********** Methods for Inline Claim  of project / dataset ******/
+    toggleClaimProject(){
+        this.inlineClaimProject.toggle();
+    }
+    projectAdded($event){
+        var projects =$event.value;
+        if(projects){
+            for(var i=0; i < projects.length; i++){
+
+                if(this.datasetInfo.fundedByProjects == undefined) {
+                    this.datasetInfo.fundedByProjects = new Array<
+                        { "url": string, "acronym": string, "title": string,
+                          "funderShortname": string, "funderName": string,
+                          "funding": string, "inline": boolean
+                        }>();
+                }
+                var project =projects[i];
+
+                let counter = this.datasetInfo.fundedByProjects.length;
+                this.datasetInfo.fundedByProjects[counter] = {
+                    "url": "", "acronym": "", "title": "",
+                    "funderShortname": "", "funderName": "",
+                    "funding": "", "inline": true
+                }
+                this.datasetInfo.fundedByProjects[counter]['url'] =
+                    OpenaireProperties.getsearchLinkToProject()+project.projectId;
+                this.datasetInfo.fundedByProjects[counter]['acronym'] = project.projectAcronym;
+                this.datasetInfo.fundedByProjects[counter]['title'] = project.projectName;
+                this.datasetInfo.fundedByProjects[counter]['funderShortname'] = project.funderName;
+            }
+        }
+    }
+    toggleClaimContext(){
+        this.inlineClaimContext.toggle();
+    }
+    contextAdded($event){
+      var contexts =$event.value;
+
+      if(contexts){
+         for(var i=0; i < contexts.length; i++){
+           var context = contexts[i];
+           if(!this.datasetInfo.contexts){
+             this.datasetInfo.contexts =  new Array<
+                 { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}>();
+
+           }
+           var position:number = this.datasetInfo.contexts.length;
+
+           this.datasetInfo.contexts[ position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", "inline": true };
+           this.datasetInfo.contexts[position]['labelContext'] = context.community;
+           this.datasetInfo.contexts[position]['labelCategory'] = context.category;
+           this.datasetInfo.contexts[position]['labelConcept'] = context.concept.label;
+
+
+         }
+       }
+     }
+     toggleClaimResult(){
+        this.inlineClaimResult.toggle();
+     }
+     resultsAdded($event, isPublication:boolean){
+       var results =$event.value;
+
+      //TODO
+      }
+    showChange($event) {
+        this.showAllReferences=$event.value;
+    }
+}

portal-2/src/app/landingPages/organization/organization.component.html

@@ -0,0 +1,166 @@
+<div>
+    <div class="container organization">
+        <div class="container-header" >
+            <div *ngIf="organizationInfo != null">
+                <h3 *ngIf="organizationInfo.title != null">
+                    <a *ngIf="organizationInfo.title['url'] != undefined && organizationInfo.title['url'] != null"
+                        href="{{organizationInfo.title['url']}}" target="_blank">
+                        {{organizationInfo.title['name']}}
+                    </a>
+                    <p *ngIf="organizationInfo.title['url'] == undefined || organizationInfo.title['url'] == null">
+                        {{organizationInfo.title['name']}}
+                    </p>
+                </h3>
+            </div>
+            <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+            <div *ngIf="errorMessage.length > 0" class="alert alert-danger" role="alert">{{errorMessage}}</div>
+        </div>
+
+        <div class="row row-offcanvas row-offcanvas-right" >
+
+            <div class="col-xs-6 col-sm-9 sidebar-offcanvas" *ngIf="organizationInfo != null">
+                <dl class="dl-horizontal">
+                    <dt *ngIf="organizationInfo.name != undefined && organizationInfo.name != ''">Name: </dt>
+                    <dd *ngIf="organizationInfo.name != undefined && organizationInfo.name != ''">{{organizationInfo.name}}</dd>
+                    <dt *ngIf="organizationInfo.country != undefined && organizationInfo.country != ''">Country: </dt>
+                    <dd *ngIf="organizationInfo.country != undefined && organizationInfo.country != ''">{{organizationInfo.country}}</dd>
+                </dl>
+
+                <ul class="nav nav-tabs">
+                    <li class="active">
+                        <a data-toggle="tab" href="#projectsTab">
+                            Projects
+                            <span class="badge">{{projectsNum}}</span>
+                        </a>
+                    </li>
+                    <li role="presentation">
+                        <a data-toggle="tab" href="#dataProvidersTab">
+                            Data Providers
+                            <span *ngIf="organizationInfo.dataProviders == undefined" class="badge">0</span>
+                            <span *ngIf="organizationInfo.dataProviders != undefined" class="badge">
+                                {{organizationInfo.dataProviders.length}}
+                            </span>
+                        </a>
+                    </li>
+                </ul>
+
+                <div class="tab-content">
+                    <div id="projectsTab" class="tab-pane fade in active panel-body">
+
+                        <div *ngIf="organizationInfo.projects == undefined" class = "alert alert-info " >
+                            There are no projects
+                        </div>
+
+                        <div *ngIf="organizationInfo.projects != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+
+                            <div *ngIf="organizationInfo.projects.size == 1">
+                                <div *ngFor="let key of organizationInfo.projects.keys()">
+                                    <strong>Projects funded by {{key}}</strong>
+                                </div>
+                            </div>
+
+                            <div *ngIf="organizationInfo.projects.size > 1">
+                                <strong>Filter by Funder</strong>
+
+                                <ul class="list-inline">
+                                    <li *ngFor="let key of organizationInfo.projects.keys()" class="checkbox">
+                                        <label>
+                                            <!--input type="checkbox" (ngModelChange)="changeType(key)"-->
+                                            <input type="checkbox" (click)='handleClick(key)'>
+                                                {{key}}
+                                        </label>
+                                    </li>
+                                </ul>
+                            </div>
+
+                            <table class="table table-striped">
+                                <thead>
+                                    <tr>
+                                        <th class="text-center">Funder</th>
+                                        <th class="text-center">Project Name</th>
+                                    </tr>
+                                </thead>
+                                <tbody *ngFor="let key of organizationInfo.projects.keys()">
+                                    <tr *ngFor="let item of organizationInfo.projects.get(key)">
+                                        <td *ngIf="fundersSet.has(key)">
+                                            {{key}}
+                                        </td>
+                                        <td *ngIf="fundersSet.has(key)">
+                                            <a *ngIf="item['url'] != '' && item['name'] != ''" class="custom-external" href="{{item['url']}}" target="_blank">
+                                                {{item['name']}}
+                                            </a>
+                                            <p *ngIf="item['url'] == '' && item['name'] != ''">{{item['name']}}</p>
+                                            <span *ngIf="item['code'] != null && item['code'] != ''"> ({{item['code']}}) </span>
+                                        </td>
+                                    </tr>
+                                </tbody>
+                            </table>
+
+                        </div>
+                    </div>
+
+                    <div id="dataProvidersTab" class="tab-pane fade panel-body">
+                        <div *ngIf="organizationInfo.dataProviders == undefined" class = "alert alert-info ">
+                            There are no data providers
+                        </div>
+                        <div *ngIf="organizationInfo.dataProviders != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+
+                            <div role="separator" class="divider" *ngFor="let item of organizationInfo.dataProviders">
+                                <p *ngIf="item['url'] != undefined && item['url']">
+                                    <a href="{{item['url']}}" target="_blank">
+                                        {{item['name']}}
+                                    </a>
+                                </p>
+                                <p *ngIf="item['url'] == undefined || item['url'] == ''">
+                                    {{item['name']}}
+                                </p>
+
+                                <p *ngIf="item['type'] != undefined && item['type'] != ''">
+                                    Type: {{item['type']}}
+                                </p>
+
+                                <p *ngIf="item['websiteUrl'] != null && item['websiteUrl'] != ''">
+                                    Website URL:
+                                    <a href="{{item['websiteUrl']}}" target="_blank">
+                                        {{item['websiteUrl']}}
+                                    </a>
+                                </p>
+                                <hr>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xs-12 col-sm-3" *ngIf="organizationInfo != null">
+                <ul class="list-group">
+                    <li class="list-group-item">
+                        Share - Bookmark
+                    </li>
+                    <li role="separator" class="list-group-item divider"></li>
+                    <li class="list-group-item">
+                        <export
+                            [linkname]="'Download projects report (CSV) for National Science Foundation'"
+                            [filename]="'projects.csv'"
+                            [data]="data">
+                        </export>
+                    </li>
+                    <li class="list-group-item">
+                        <export
+                            [linkname]="'Download publications report (CSV) for National Science Foundation'"
+                            [filename]="'publications.csv'">
+                        </export>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>

portal-2/src/app/landingPages/organization/organization.component.ts

@@ -0,0 +1,117 @@
+import {Component} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute} from '@angular/router';
+import {OrganizationService} from '../../services/organization.service';
+import {OrganizationInfo} from '../../entities/organizationInfo';
+
+@Component({
+    selector: 'organization',
+    templateUrl: 'organization.component.html',
+})
+
+export class OrganizationComponent {
+    constructor (private _organizationService: OrganizationService,
+    private  route: ActivatedRoute) {
+            console.info('organization constructor');
+    }
+
+    ngOnInit() {
+        console.info('organization init');
+        this.sub =  this.route.queryParams.subscribe(params => {
+            this.organizationId = params['organizationId'];
+            console.info("Id is :"+this.organizationId);
+            if(this.organizationId){
+                this.getOrganizationInfo();
+            }else{
+                this.warningMessage="No valid project id";
+            }
+        });
+    }
+
+    organizationInfo: OrganizationInfo;
+    private organizationId: string;
+    private projectsNum : number = 0;
+    private fundersSet: Set<string>;
+    private emptyFundersSet: boolean = true;
+    public warningMessage = "";
+    public errorMessage = "";
+    private data : any = { "export":[] };
+
+
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+    }
+      sub: any;
+
+    private getOrganizationInfo ()  {
+        console.info("inside getProjectInfo of component");
+
+        this.warningMessage = '';
+        this.errorMessage=""
+        console.info("do request");
+
+            this._organizationService.getOrganizationInfo(this.organizationId).subscribe(
+                data => {
+                    this.organizationInfo = data;
+
+                    let projectsNum = 0;
+                    if(this.organizationInfo.projects != undefined) {
+                        this.fundersSet = new Set<string>();
+                        this.organizationInfo.projects.forEach(function (value, key, map) {
+                            projectsNum += value.length;
+                            this.fundersSet.add(key);
+
+                            for(let project of value) {
+                                this.data.export[this.data.export.length] =
+                                    {
+                                        'Project title': this.quote(project.name),
+                                        'Project Acronym': this.quote(project.acronym),
+                                        'Project ID': this.quote(project.code),
+                                        'Funder': this.quote(project.funder),
+                                        'Funding Stream':this.quote(project.fundingStream),
+                                        'Funding Substream level 1': this.quote(project.fundingLevel1),
+                                        'Funding Substream level 2': this.quote(project.fundingLevel2),
+                                        'SC39': this.quote(project.sc39),
+                                        'Start Date': this.quote(project.startDate),
+                                        'End Date': this.quote(project.endDate)
+                                    };
+                            }
+                        }.bind(this));
+                    }
+                    this.projectsNum = projectsNum;
+                },
+                err => {
+                    console.error(err)
+                    console.info("error");
+
+                    this.errorMessage = 'No organization found';
+                }
+            );
+        }
+
+         handleClick(funder: string) {
+             if(this.emptyFundersSet) {
+                 this.fundersSet.clear();
+                 this.emptyFundersSet = false;
+             }
+
+             if(this.fundersSet.has(funder)) {
+                 this.fundersSet.delete(funder);
+
+                 if(this.fundersSet.size == 0) {
+                     this.organizationInfo.projects.forEach(function (value, key, map) {
+                         this.fundersSet.add(key);
+                     }.bind(this));
+                     this.emptyFundersSet = true;
+                 }
+                 console.info(funder+" funder deleted");
+             } else {
+                 this.fundersSet.add(funder);
+                 console.info(funder+" funder added");
+             }
+         }
+
+         quote(word: string): string {
+             return '"'+word+'"';
+         }
+}

portal-2/src/app/landingPages/person/person.component.html

@@ -0,0 +1,74 @@
+<div>
+    <div class="container person">
+        <div class="container-header" >
+            <div *ngIf="personInfo != null">
+                <h3>{{personInfo.fullname}}</h3>
+            </div>
+            <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+            <div *ngIf="errorMessage.length > 0" class="alert alert-danger" role="alert">{{errorMessage}}</div>
+        </div>
+
+        <div class="row row-offcanvas row-offcanvas-right" >
+
+            <div class="col-xs-6 col-sm-9 sidebar-offcanvas" *ngIf="personInfo != null">
+                <dl class="dl-horizontal">
+                    <dt *ngIf="personInfo.secondnames != undefined && personInfo.secondnames != ''">Last name: </dt>
+                    <dd *ngIf="personInfo.secondnames != undefined && personInfo.secondnames != ''">{{personInfo.secondnames}}</dd>
+                    <dt *ngIf="personInfo.firstname != undefined && personInfo.firstname != ''">First name: </dt>
+                    <dd *ngIf="personInfo.firstname != undefined && personInfo.firstname != ''">{{personInfo.firstname}}</dd>
+                    <dt *ngIf="personInfo.country != undefined && personInfo.country != ''">Country: </dt>
+                    <dd *ngIf="personInfo.country != undefined && personInfo.country != ''">{{personInfo.country}}</dd>
+                </dl>
+
+                <ul class="nav nav-tabs">
+                    <li class="active">
+                        <a data-toggle="tab" href="#publicationsTab">
+                            Publications
+                        </a>
+                    </li>
+                    <li role="presentation">
+                        <a data-toggle="tab" href="#researchDataTab">
+                            Research Data
+                        </a>
+                    </li>
+                </ul>
+
+                <div class="tab-content">
+                    <div id="publicationsTab" class="tab-pane fade in active panel-body">
+
+                        <div *ngIf="personInfo.publications == undefined" class = "alert alert-info " >
+                            There are no publications
+                        </div>
+
+                        <div *ngIf="personInfo.publications != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+                        </div>
+                    </div>
+
+                    <div id="researchDataTab" class="tab-pane fade panel-body">
+                        <div *ngIf="personInfo.researchData == undefined" class = "alert alert-info ">
+                            There are no research data
+                        </div>
+                        <div *ngIf="personInfo.researchData != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xs-12 col-sm-3" *ngIf="personInfo != null">
+                <ul class="list-group">
+                    <li class="list-group-item">
+                        Share - Bookmark
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>

portal-2/src/app/landingPages/person/person.component.ts

@@ -0,0 +1,60 @@
+import {Component} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { ActivatedRoute } from '@angular/router';
+import {PersonService} from '../../services/person.service';
+import { PersonInfo } from '../../entities/personInfo';
+@Component({
+    selector: 'person',
+    templateUrl: 'person.component.html',
+})
+
+export class PersonComponent {
+    constructor (private _personService: PersonService,
+    private  route: ActivatedRoute) {
+            console.info('person constructor');
+        }
+
+    ngOnInit() {
+        console.info('person init');
+        this.sub =  this.route.queryParams.subscribe(params => {
+          this.personId = params['personId'];
+           console.info("Id is :"+this.personId);
+           if(this.personId){
+              this.getPersonInfo();
+          }else{
+    		      this.warningMessage="No valid project id";
+          }
+
+       });
+    }
+
+    personInfo: PersonInfo;
+    private personId: string;
+    public warningMessage = "";
+    public errorMessage = "";
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+    }
+      sub: any;
+
+    private getPersonInfo ()  {
+        console.info("inside getProjectInfo of component");
+
+        this.warningMessage = '';
+        this.errorMessage=""
+        console.info("do request");
+
+            this._personService.getPersonInfo(this.personId).subscribe(
+                data => {
+                    this.personInfo = data;
+                },
+                err => {
+                    console.error(err)
+                    console.info("error");
+
+                    this.errorMessage = 'No person found';
+                }
+            );
+        }
+
+}

portal-2/src/app/landingPages/project/project.component.html

@@ -0,0 +1,162 @@
+<div>
+    <div class="container person">
+        <div class="container-header" >
+            <div *ngIf="projectInfo != null">
+                <h3 class="sc39" title="Special Clause 39">{{projectInfo.acronym}}</h3>
+            </div>
+            <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+            <div *ngIf="errorMessage.length > 0" class="alert alert-danger" role="alert">{{errorMessage}}</div>
+        </div>
+
+        <div class="row row-offcanvas row-offcanvas-right" >
+
+            <div class="col-xs-6 col-sm-9 sidebar-offcanvas" *ngIf="projectInfo != null">
+
+                <dl class="dl-horizontal">
+                    <dt *ngIf="projectInfo.title != undefined && projectInfo.title != ''">Title: </dt>
+                    <dd *ngIf="projectInfo.title != undefined && projectInfo.title != ''">{{projectInfo.title}}</dd>
+                    <dt *ngIf="projectInfo.funding != undefined && projectInfo.funding != ''">Funding: </dt>
+                    <dd *ngIf="projectInfo.funding != undefined && projectInfo.funding != ''">{{projectInfo.funding}}</dd>
+                    <dt *ngIf="projectInfo.callIdentifier != undefined && projectInfo.callIdentifier != ''">Call: </dt>
+                    <dd *ngIf="projectInfo.callIdentifier != undefined && projectInfo.callIdentifier != ''">{{projectInfo.callIdentifier}}</dd>
+                    <dt *ngIf="projectInfo.contractNum != undefined && projectInfo.contractNum != ''">Contract (GA) number: </dt>
+                    <dd *ngIf="projectInfo.contractNum != undefined && projectInfo.contractNum != ''">{{projectInfo.contractNum}}</dd>
+                    <dt *ngIf="projectInfo.startDate != undefined && projectInfo.startDate != ''">Start Date: </dt>
+                    <dd *ngIf="projectInfo.startDate != undefined && projectInfo.startDate != ''">{{projectInfo.startDate}}</dd>
+                    <dt *ngIf="projectInfo.endDate != undefined && projectInfo.endDate != ''">End Date: </dt>
+                    <dd *ngIf="projectInfo.endDate != undefined && projectInfo.endDate != ''">{{projectInfo.endDate}}</dd>
+                    <dt *ngIf="projectInfo.openAccessMandate != undefined && projectInfo.openAccessMandate != ''">Open Access mandate: </dt>
+                    <dd *ngIf="projectInfo.openAccessMandate != undefined && projectInfo.openAccessMandate != ''">{{projectInfo.openAccessMandate}}</dd>
+                    <dt *ngIf="projectInfo.specialClause39 != undefined && projectInfo.specialClause39 != ''">Special Clause 39: </dt>
+                    <dd *ngIf="projectInfo.specialClause39 != undefined && projectInfo.specialClause39 != ''">{{projectInfo.specialClause39}}</dd>
+                    <dt *ngIf="projectInfo.organizations != undefined">Organizations: </dt>
+                    <dd *ngIf="projectInfo.organizations != undefined">
+                        <ul class="list-inline">
+                            <li *ngFor="let key of projectInfo.organizations.keys()">
+                        <a *ngIf="projectInfo.organizations.get(key) != null &&
+                            projectInfo.organizations.get(key) != ''"
+                            href="{{(projectInfo.organizations.get(key))}}" target="_blank">
+                                {{key}}
+                        </a>
+                        <span *ngIf="projectInfo.organizations.get(key) == null ||
+                            projectInfo.organizations.get(key) == ''">
+                                {{key}}
+                        </span>
+                        <span>;</span>
+                            </li>
+                        </ul>
+                    </dd>
+                    <dt *ngIf="projectInfo.urlInfo != undefined && projectInfo.urlInfo != ''">More information:</dt>
+                    <dd *ngIf="projectInfo.urlInfo != undefined && projectInfo.urlInfo != ''">
+                        <a target="_blank" href="{{projectInfo.url}}">
+                            {{projectInfo.urlInfo}}
+                        </a>
+                    </dd>
+                </dl>
+
+                <ul class="nav nav-tabs">
+                    <li class="active">
+                        <a data-toggle="tab" href="#publicationsTab">
+                            Publications
+                        </a>
+                    </li>
+                    <li>
+                        <a data-toggle="tab" href="#researchDataTab">
+                            Research Data
+                        </a>
+                    </li>
+                    <li>
+                        <a data-toggle="tab" href="#statisticsTab">
+                            Statistics
+                        </a>
+                    </li>
+                </ul>
+
+                <div class="tab-content">
+                    <div id="publicationsTab" class="tab-pane fade in active panel-body">
+
+                        <div *ngIf="projectInfo.publications == undefined" class = "alert alert-info " >
+                            There are no publications
+                        </div>
+
+                        <div *ngIf="projectInfo.publications != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+                        </div>
+                    </div>
+
+                    <div id="researchDataTab" class="tab-pane fade panel-body">
+                        <div *ngIf="projectInfo.researchData == undefined" class = "alert alert-info ">
+                            There are no research data
+                        </div>
+                        <div *ngIf="projectInfo.researchData != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+                        </div>
+                    </div>
+
+                    <div id="statisticsTab" class="tab-pane fade panel-body">
+                        <div *ngIf="projectInfo.statistics == undefined" class = "alert alert-info ">
+                            There are no statistics
+                        </div>
+                        <div *ngIf="projectInfo.statistics != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-xs-12 col-sm-3" *ngIf="projectInfo != null">
+                <ul class="list-group">
+                    <li class="list-group-item">
+                        Share - Bookmark
+                    </li>
+                    <li role="separator" class="list-group-item divider"></li>
+                    <li class="list-group-item">
+                        <a data-toggle="tab" href="">
+                            Publication details
+                        </a>
+                    </li>
+                    <li class="list-group-item">
+                        <a data-toggle="tab" href="">
+                            Dynamically incorporate publications in your site (HTML)
+                        </a>
+                    </li>
+
+                    <li class="list-group-item">
+                        <a data-toggle="tab" href="">
+                            View EC progress report (HTML)
+                        </a>
+                    </li>
+                    <li class="list-group-item">
+                        <export
+                            [linkname]="'Download EC progress report (CSV)'"
+                            [filename]="'publications.csv'">
+                        </export>
+                    </li>
+                    <li class="list-group-item">
+                        <div class="text-center">
+                            <a class="btn btn-primary" href="/linking">
+                                Link Research Results
+                            </a>
+                        </div>
+                    </li>
+                    <li class="list-group-item">
+                        <div class="text-center">
+                            <a class="btn btn-primary" href="/deposit">
+                                Deposit Publications
+                            </a>
+                        </div>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>

portal-2/src/app/landingPages/project/project.component.ts

@@ -0,0 +1,98 @@
+import {Component, ViewChild} from '@angular/core';
+import {Observable} from 'rxjs/Observable';
+import {ActivatedRoute} from '@angular/router';
+import {ProjectService} from '../../services/project.service';
+import {ProjectInfo} from '../../entities/projectInfo';
+import {InlineClaimResultComponent} from '../../claimPages/inlineClaimResult/inlineClaimResult.component';
+
+@Component({
+    selector: 'project',
+    templateUrl: 'project.component.html',
+ })
+export class ProjectComponent {
+  constructor (private _projectService: ProjectService,
+  private  route: ActivatedRoute) {
+    console.info('project constructor');
+
+  }
+  ngOnInit() {
+    // this.sub = this.route.params.subscribe(params => {
+    //   this.projectId = params['projectId'];
+    //   console.info('project init');
+    //   this.getProjectInfo(this.projectId);
+    // });
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.projectId = params['projectId'];
+       console.info("Id is :"+this.projectId);
+       if(this.projectId){
+          this.getProjectInfo(this.projectId);
+      }else{
+		      this.warningMessage="No valid project id";
+      }
+
+   });
+
+}
+
+  private projectId : string ;
+  private projectInfo: ProjectInfo;
+
+  private project ;
+
+   @ViewChild (InlineClaimResultComponent) inlineClaimResult : InlineClaimResultComponent ;
+
+
+  public warningMessage = "";
+  public errorMessage = "";
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+    sub: any;
+
+  getProjectInfo (id:string)  {
+    console.info("inside getProjectInfo of component");
+	this.warningMessage = '';
+    this.errorMessage=""
+    this._projectService.getProjectInfo(id).subscribe(
+      data => {
+          this.projectInfo = data;
+          /*
+          <dt *ngIf="projectInfo.title != undefined && projectInfo.title != ''">Title: </dt>
+          <dd *ngIf="projectInfo.title != undefined && projectInfo.title != ''">{{projectInfo.title}}</dd>
+          <dt *ngIf="projectInfo.funding != undefined && projectInfo.funding != ''">Funding: </dt>
+          <dd *ngIf="projectInfo.funding != undefined && projectInfo.funding != ''">{{projectInfo.funding}}</dd>
+          <dt *ngIf="projectInfo.callIdentifier != undefined && projectInfo.callIdentifier != ''">Call: </dt>
+          <dd *ngIf="projectInfo.callIdentifier != undefined && projectInfo.callIdentifier != ''">{{projectInfo.callIdentifier}}</dd>
+          <dt *ngIf="projectInfo.contractNum != undefined && projectInfo.contractNum != ''">Contract (GA) number: </dt>
+          <dd *ngIf="projectInfo.contractNum != undefined && projectInfo.contractNum != ''">{{projectInfo.contractNum}}</dd>
+          <dt *ngIf="projectInfo.startDate != undefined && projectInfo.startDate != ''">Start Date: </dt>
+          <dd *ngIf="projectInfo.startDate != undefined && projectInfo.startDate != ''">{{projectInfo.startDate}}</dd>
+          <dt *ngIf="projectInfo.endDate != undefined && projectInfo.endDate != ''">End Date: </dt>
+          <dd *ngIf="projectInfo.endDate != undefined && projectInfo.endDate != ''">{{projectInfo.endDate}}</dd>
+          */
+          this.project= { funderId: "", funderName: this.projectInfo.funder, projectId: this.projectId, projectName: this.projectInfo.title, projectAcronym: this.projectInfo.acronym, startDate: this.projectInfo.startDate, endDate: this.projectInfo.endDate };
+      },
+      err => {
+		console.error(err);
+		this.errorMessage = 'No project found';
+		}
+    );
+   }
+
+      /*
+      ********* Methods for Inline Claim  of results *****
+        */
+      toggleClaimResult(){
+          this.inlineClaimResult.toggle();
+      }
+      publicationAdded($event){
+       //TODO
+       }
+
+       datasetAdded($event){
+         var contexts =$event.value;
+
+ //TODO
+        }
+
+}

portal-2/src/app/landingPages/publication/publication.component.html

@@ -0,0 +1,293 @@
+<div>
+    <div class="container publication">
+        <div class="container-header" >
+            <div *ngIf="publicationInfo != null">
+                <showTitle [title]="publicationInfo.title"></showTitle>
+            </div>
+            <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
+            <div *ngIf="errorMessage.length > 0" class="alert alert-danger" role="alert">{{errorMessage}}</div>
+        </div>
+
+        <div class="row row-offcanvas row-offcanvas-right" >
+
+            <div class="col-xs-6 col-sm-9 sidebar-offcanvas" *ngIf="publicationInfo != null">
+                <div>
+                    <showAuthors [authors]="publicationInfo.authors"></showAuthors>
+                    <span *ngIf="publicationInfo.date != ''">({{publicationInfo.date}})</span>
+                </div>
+
+                <dl class="dl-horizontal">
+                    <dt *ngIf="publicationInfo.publisher != undefined && publicationInfo.publisher != ''">Publisher: </dt>
+                    <dd *ngIf="publicationInfo.publisher != undefined && publicationInfo.publisher != ''">{{publicationInfo.publisher}}</dd>
+                    <dt *ngIf="publicationInfo.journal != undefined && publicationInfo.journal['journal'] != ''">Journal: </dt>
+                    <dd *ngIf="publicationInfo.journal != undefined && publicationInfo.journal != ''">
+                        {{publicationInfo.journal['journal']}}
+                        <span *ngIf="publicationInfo.journal['issn'] != ''">
+                            <mark>issn:</mark> {{publicationInfo.journal['issn']}}
+                        </span>
+                        <span *ngIf="publicationInfo.journal['lissn'] != ''">
+                            <mark>lissn:</mark> {{publicationInfo.journal['lissn']}}
+                        </span>
+                    </dd>
+                    <dt *ngIf="publicationInfo.languages != undefined && publicationInfo.languages != 'Undetermined' && publicationInfo.languages != ''"> Languages: </dt>
+                    <dd *ngIf="publicationInfo.languages != undefined && publicationInfo.languages != 'Undetermined' && publicationInfo.languages != ''">{{publicationInfo.languages}}</dd>
+                    <dt *ngIf="publicationInfo.types != undefined && publicationInfo.types.length > 0"> Types: </dt>
+                    <dd *ngIf="publicationInfo.types != undefined && publicationInfo.types.length > 0">{{publicationInfo.types}}</dd>
+                    <dt *ngIf="publicationInfo.embargoEndDate != undefined && publicationInfo.embargoEndDate != ''">Embargo end date: </dt>
+                    <dd *ngIf="publicationInfo.embargoEndDate != undefined && publicationInfo.embargoEndDate != ''">{{publicationInfo.embargoEndDate}}</dd>
+
+                    <showIdentifiers [identifiers]="publicationInfo.identifiers"></showIdentifiers>
+                    <showSubjects [subjects]="publicationInfo.subjects" [classifiedSubjects]="publicationInfo.classifiedSubjects"></showSubjects>
+                </dl>
+
+                <blockquote *ngIf="publicationInfo.description != ''">
+                    <div class="text-justify" [innerHTML]="publicationInfo.description"></div>
+                </blockquote>
+
+                <ul class="nav nav-tabs">
+                    <li class="active">
+                        <a data-toggle="tab" href="#citationsTab">
+                            References
+                            <span *ngIf="publicationInfo.references == undefined" class="badge">0</span>
+                            <span *ngIf="publicationInfo.references != undefined" class="badge">
+                                {{publicationInfo.references.length}}
+                            </span>
+                        </a>
+                    </li>
+                    <li role="presentation">
+                        <a data-toggle="tab" href="#relatedTab">
+                            Related Research Results
+                            <span *ngIf="publicationInfo.relatedResearchResults == undefined" class="badge">0</span>
+                            <span *ngIf="publicationInfo.relatedResearchResults != undefined" class="badge">
+                                {{publicationInfo.relatedResearchResults.length}}
+                            </span>
+                        </a>
+                    </li>
+                    <li role="presentation">
+                        <a data-toggle="tab" href="#similarTab">
+                            Similar Research Results
+                            <span *ngIf="publicationInfo.similarResearchResults == undefined" class="badge">0</span>
+                            <span *ngIf="publicationInfo.similarResearchResults != undefined" class="badge">
+                                {{publicationInfo.similarResearchResults.length}}
+                            </span>
+                        </a>
+                    </li>
+                    <li role="presentation" *ngIf="publicationInfo.bioentities != undefined">
+                        <a data-toggle="tab" href="#bioentitiesTab">
+                            Bioentities
+                            <span class="badge">{{bioentitiesNum}}</span>
+                        </a>
+                    </li>
+                </ul>
+
+                <div class="tab-content">
+                    <div id="citationsTab" class="tab-pane fade in active panel-body">
+
+                        <div *ngIf="publicationInfo.references == undefined" class = "alert alert-info " >
+                            There are no references
+                        </div>
+
+                        <div *ngIf="publicationInfo.references != undefined">
+                            <tabPaging [showAll]="showAllReferences" [length]="publicationInfo.references.length" (changeShowAll)="showChange($event)"></tabPaging>
+
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+
+                            <div *ngFor="let item of publicationInfo.references.slice(0,10)">
+                                <p *ngIf=" item != undefined && item['url'] != undefined">
+                                    <a href="{{item['url']}}" target="_blank">
+                                        {{item['name']}}
+                                    </a>
+                                </p>
+                                <p *ngIf="item['url'] == undefined">
+                                    {{item['name']}}
+                                </p>
+                            </div>
+
+                            <div *ngIf="showAllReferences">
+                                <div *ngFor="let item of publicationInfo.references.slice(10)">
+                                    <p *ngIf=" item != undefined && item['url'] != undefined">
+                                        <a href="{{item['url']}}" target="_blank">
+                                            {{item['name']}}
+                                        </a>
+                                    </p>
+                                    <p *ngIf="item['url'] == undefined">
+                                        {{item['name']}}
+                                    </p>
+                               </div>
+                            </div>
+
+                            <tabPaging [showAll]="showAllReferences" [length]="publicationInfo.references.length" (changeShowAll)="showChange($event)"></tabPaging>
+
+                        </div>
+                    </div>
+
+                    <div id="relatedTab" class="tab-pane fade panel-body">
+                        <div *ngIf="publicationInfo.relatedResearchResults == undefined" class = "alert alert-info ">
+                            There are no related research results
+                        </div>
+                        <div *ngIf="publicationInfo.relatedResearchResults != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+
+                            <tabTable [info]="publicationInfo.relatedResearchResults"></tabTable>
+                        </div>
+                    </div>
+
+
+                    <div id="similarTab" class="tab-pane fade panel-body">
+                        <div *ngIf="publicationInfo.similarResearchResults == undefined" class = "alert alert-info ">
+                            There are no similar research results
+                        </div>
+                        <div *ngIf="publicationInfo.similarResearchResults != undefined">
+                            <p>
+                                The results below are discovered through our pilot algorithms.
+                                <a href="mailto:">Let us know how we are doing!</a>
+                            </p>
+
+                            <tabTable [info]="publicationInfo.similarResearchResults"></tabTable>
+                        </div>
+                    </div>
+                    <div *ngIf="publicationInfo.bioentities != undefined" id="bioentitiesTab" class="tab-pane fade panel-body">
+                        <p>
+                            The results below are discovered through our pilot algorithms.
+                            <a href="mailto:">Let us know how we are doing!</a>
+                        </p>
+                        <table id="bioentitiesTable" class="table table-striped">
+                            <thead>
+                                <tr>
+                                    <th class="text-center">Bio Entity</th>
+                                    <th class="text-center">Site Name</th>
+                                </tr>
+                            </thead>
+                            <tbody *ngFor="let key of publicationInfo.bioentities.keys()">
+                                <tr *ngFor="let keyIn of publicationInfo.bioentities.get(key).keys()">
+                                    <td class="text-center" *ngIf="keyIn != undefined">
+                                        <a href="{{publicationInfo.bioentities.get(key).get(keyIn)}}" target="_blank">
+                                            {{keyIn}}
+                                        </a>
+                                    </td>
+                                    <td class="text-center">
+                                        {{key}}
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+            <div class="col-xs-12 col-sm-3" *ngIf="publicationInfo != null">
+
+                <ul class="list-group mainFunctionsBlock">
+                    <li class="list-group-item">
+                        <dl class="functionsSection">
+                            <dt  >Share - Bookmark</dt>
+                            <dd>
+                            </dd>
+                        </dl>
+                    </li>
+                    <li class="list-group-item" *ngIf="publicationInfo.collectedFrom != undefined">
+                        <dl class="functionsSection">
+                            <dt  >Collected from</dt>
+                            <dd  *ngFor="let item of publicationInfo.collectedFrom">
+                                <a href="{{item['url']}}">
+                                    {{item['name']}}
+                                </a>
+                            </dd>
+                        </dl>
+                    </li>
+                    <li class="list-group-item" *ngIf="publicationInfo.downloadFrom != undefined && publicationInfo.downloadFrom.size > 0">
+                        <dl class="functionsSection">
+                            <dt class="title">Download from</dt>
+                            <dd class="line" *ngFor="let key of publicationInfo.downloadFrom.keys()">
+                                <div *ngIf="publicationInfo.downloadFrom.get(key)['url'].length > 1">
+                                    {{key}}
+                                    <span *ngFor="let url of publicationInfo.downloadFrom.get(key)['url']; let i=index;">
+                                        <a href="{{url}}">
+                                            [{{i+1}}]
+                                        </a>
+                                    </span>
+                                </div>
+                                <a *ngIf="publicationInfo.downloadFrom.get(key)['url'].length == 1" href="{{publicationInfo.downloadFrom.get(key)['url']}}">
+                                    {{key}}
+                                </a>
+                            </dd>
+                        </dl>
+                    </li>
+                    <li class="list-group-item" *ngIf="publicationInfo.publishedIn != undefined && publicationInfo.publishedIn.length > 0">
+                        <dl class="functionsSection">
+                            <dt class="title">Published in</dt>
+                            <dd class="line" *ngFor="let key of publicationInfo.publishedIn.keys()">
+                                <div *ngIf="publicationInfo.publishedIn.get(key)['url'].length > 1">
+                                    {{key}}
+                                    <span *ngFor="let url of publicationInfo.publishedIn.get(key)['url']; let i=index">
+                                        <a href="{{url}}">
+                                            [{{i+1}}]
+                                        </a>
+                                    </span>
+                                </div>
+                                <a *ngIf="publicationInfo.publishedIn.get(key)['url'].length == 1" href="{{publicationInfo.publishedIn.get(key)['url']}}">
+                                    {{key}}
+                                </a>
+                            </dd>
+                        </dl>
+                    </li>
+
+                    <li class="list-group-item">
+                        <dl class="functionsSection" *ngIf="publicationInfo.fundedByProjects != undefined">
+                            <dt class="title">Funded By</dt>
+                            <dd
+                                title="{{item['title']}}
+                                |   Project Code: {{item['acronym']}}
+                                |   Funder: {{item['funderName']}} ({{item['funderShortname']}})
+                                |   Funding: {{item['funding']}}"
+                                class="line" *ngFor="let item of publicationInfo.fundedByProjects">
+                                    <a *ngIf="!item['inline']" href="{{item['url']}}">
+                                        {{item['funderShortname']?item['funderShortname']:item['funderName']}}
+                                        | {{ item['acronym']?item['acronym']:item['title']}}
+                                    </a>
+
+                                    <a *ngIf="item['inline']" href="{{item['url']}}">
+                                        <mark>
+                                            {{item['funderShortname']?item['funderShortname']:item['funderName']}}
+                                            | {{ item['acronym']?item['acronym']:item['title']}}
+                                        </mark>
+                                    </a>
+                            </dd>
+                        </dl>
+
+                        <button (click)="toggleClaimProject()"  class = "btn btn-primary   btn-xs" >Add Projects</button>
+                        <inline-claim-project *ngIf="result "  inlineType ="publication" [inlineEntity]="result"  (projectAdded)="projectAdded($event)" ></inline-claim-project>
+                    </li>
+                    <li class="list-group-item">
+                        <dl class="functionsSection" *ngIf="publicationInfo.contexts != undefined">
+                            <dt class="title">Related to </dt>
+                            <dd class="line" *ngFor="let item of publicationInfo.contexts">
+                              <span *ngIf = "!item['inline']" >
+                                <span>{{item['labelContext']}}</span>
+                                <span *ngIf="item['labelCategory'] != null">-> {{item['labelCategory']}}</span>
+                                <span *ngIf="item['labelConcept'] != null">: {{item['labelConcept']}}</span>
+                              </span>
+                              <mark *ngIf = "item['inline']" >
+                                <span>{{item['labelContext']}}</span>
+                                <span *ngIf="item['labelCategory'] != null">-> {{item['labelCategory']}}</span>
+                                <span *ngIf="item['labelConcept'] != null">: {{item['labelConcept']}}</span>
+                              </mark>
+                            </dd>
+                        </dl>
+                        <dl class="functionsSection" *ngIf="publicationInfo.contexts == undefined">
+                            <dt class="title">Related to </dt>
+
+                        </dl>
+                        <button (click)=" toggleClaimContext()" class = "btn btn-primary   btn-xs" >Add Concepts</button>
+                        <inline-claim-context   inlineType ="publication" [inlineEntity]="result" (contextAdded)="contextAdded($event)" ></inline-claim-context>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>

portal-2/src/app/landingPages/publication/publication.component.ts

@@ -0,0 +1,163 @@
+import {Component, ViewChild} from '@angular/core';
+import {Observable} from 'rxjs/Observable';
+import {PublicationService} from '../../services/publication.service';
+import {PublicationInfo} from '../../entities/publicationInfo';
+import {ActivatedRoute} from '@angular/router';
+import {OpenaireProperties} from '../../openaireProperties';
+import {InlineClaimContextComponent} from '../../claimPages/inlineClaimContext/inlineClaimContext.component';
+import {InlineClaimProjectComponent} from '../../claimPages/inlineClaimProject/inlineClaimProject.component';
+import {InlineClaimResultComponent} from '../../claimPages/inlineClaimResult/inlineClaimResult.component';
+@Component({
+    selector: 'publication',
+    templateUrl: 'publication.component.html',
+
+})
+
+export class PublicationComponent {
+  constructor (private _publicationService: PublicationService, private route: ActivatedRoute) {
+  }
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(data => {
+      this.articleId = data['articleId'];
+      console.info("Article id is :"+this.articleId);
+       if(this.articleId){
+        this.getPublicationInfo(this.articleId);
+      }else{
+        console.info("Article id not found");
+      }
+
+  });
+
+
+}
+
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  articleId: string;
+  private publicationInfo: PublicationInfo;
+
+  private showAllReferences: boolean = false;
+  private showAllRelResData: boolean = false;
+  private showAllSimilPubl: boolean = false;
+  private showAllBioentities: boolean = false;
+  private showFundingDetails: boolean = false;
+
+  private bioentitiesNum: number = 0;
+
+  private result ;
+
+  @ViewChild (InlineClaimProjectComponent) inlineClaimProject : InlineClaimProjectComponent ;
+  @ViewChild (InlineClaimContextComponent) inlineClaimContext : InlineClaimContextComponent ;
+  @ViewChild (InlineClaimResultComponent) inlineClaimResult : InlineClaimResultComponent ;
+
+  public warningMessage = "";
+  public errorMessage = "";
+
+  getPublicationInfo(id:string) {
+    this.warningMessage = '';
+    this.errorMessage=""
+    if(this.articleId==null || this.articleId==''){
+      this.warningMessage="No valid publication id";
+      console.info("novalid");
+    }else{
+console.info("do request");
+      this._publicationService.getPublicationInfo(this.articleId).subscribe(
+        data => {
+            this.publicationInfo = data;
+
+                    let bioentitiesNum = 0;
+                    if(this.publicationInfo.bioentities != undefined) {
+                        this.publicationInfo.bioentities.forEach(function (value, key, map) {
+                            bioentitiesNum += value.size;
+                        });
+                    }
+                    this.bioentitiesNum = bioentitiesNum;
+
+                    this.result = {id: this.articleId, type :"publication", source : "openaire", title: this.publicationInfo.title,url: '', result: '', accessRights: this.publicationInfo.bestlicense, embargoEndDate: ''};
+                    // this.result.push(result_);
+        },
+        err => {
+          console.error(err)
+          console.info("error");
+
+          this.errorMessage = 'No publication found';
+        }
+      );
+    }
+   }
+
+   /*
+   ********* Methods for Inline Claim  of project / publication *****
+     */
+   toggleClaimProject(){
+      this.inlineClaimProject.toggle();
+   }
+   projectAdded($event){
+     var projects =$event.value;
+     if(projects){
+        for(var i=0; i < projects.length; i++){
+
+                if(this.publicationInfo.fundedByProjects == undefined) {
+                    this.publicationInfo.fundedByProjects = new Array<
+                        { "url": string, "acronym": string, "title": string,
+                          "funderShortname": string, "funderName": string,
+                          "funding": string, "inline": boolean
+                        }>();
+                }
+                var project =projects[i];
+
+                let counter = this.publicationInfo.fundedByProjects.length;
+                this.publicationInfo.fundedByProjects[counter] = {
+                    "url": "", "acronym": "", "title": "",
+                    "funderShortname": "", "funderName": "",
+                    "funding": "", "inline": true
+                }
+                this.publicationInfo.fundedByProjects[counter]['url'] =
+                    OpenaireProperties.getsearchLinkToProject() + project.projectId;
+                this.publicationInfo.fundedByProjects[counter]['acronym'] = project.projectAcronym;
+                this.publicationInfo.fundedByProjects[counter]['title'] = project.projectName;
+                this.publicationInfo.fundedByProjects[counter]['funderShortname'] = project.funderName;
+        }
+      }
+    }
+    toggleClaimContext(){
+       this.inlineClaimContext.toggle();
+    }
+    contextAdded($event){
+      var contexts =$event.value;
+      if(contexts){
+         for(var i=0; i < contexts.length; i++){
+           var context = contexts[i];
+           if(!this.publicationInfo.contexts){
+             this.publicationInfo.contexts =  new Array<
+                 { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}>();
+
+           }
+           var position:number = this.publicationInfo.contexts.length;
+
+           this.publicationInfo.contexts[ position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: true };
+           this.publicationInfo.contexts[position]['labelContext'] = context.community;
+           this.publicationInfo.contexts[position]['labelCategory'] = context.category;
+           this.publicationInfo.contexts[position]['labelConcept'] = context.concept.label;
+
+
+         }
+       }
+     }
+     toggleClaimResult(){
+        this.inlineClaimResult.toggle();
+     }
+     resultsAdded($event, isPublication:boolean){
+       var results =$event.value;
+
+      //TODO
+      }
+
+    showChange($event) {
+        this.showAllReferences=$event.value;
+    }
+
+
+}

portal-2/src/app/landingPages/showAuthors.component.ts

@@ -0,0 +1,47 @@
+import {Component, Input} from '@angular/core';
+
+@Component({
+    selector: 'showAuthors',
+    template: `
+        <span *ngIf="authors != undefined">
+            <div *ngIf="showAll">
+                <a class="text-muted" (click)="showAll = !showAll;">View less authors</a>
+            </div>
+            <span *ngFor="let item of authors.slice(0,30)">
+                <a class="custom-external" href="{{item['url']}}" target="_blank">
+                    {{item['name']}};
+                </a>
+            </span>
+            <span *ngIf="!showAll && authors.length > 30">	... </span>
+            <span *ngIf="showAll">
+                <span *ngFor="let item of authors.slice(30)">
+                    <a class="custom-external" href="{{item['url']}}" target="_blank">
+                        {{item['name']}};
+                    </a>
+                </span>
+            </span>
+            <span *ngIf="!showAll && authors.length > 30">
+                <a class="text-muted" (click)="showAll = !showAll;">
+                    view all {{authors.length}} authors
+                </a>
+            </span>
+            <span *ngIf="showAll">
+                <a class="text-muted" (click)="showAll = !showAll;">View less authors</a>
+            </span>
+        </span>
+
+    `
+
+    })
+
+export class ShowAuthorsComponent {
+    @Input() authors: { [key: string]: string }[];
+    private showAll: boolean = false;
+
+    constructor () {
+        console.info('showAuthors constructor');
+    }
+
+    ngOnInit() {
+    }
+}

portal-2/src/app/landingPages/showSubjects.component.ts

@@ -0,0 +1,52 @@
+import {Component, Input} from '@angular/core';
+
+@Component({
+    selector: 'showSubjects',
+    template: `
+        <div *ngIf="subjects != undefined">
+            <dt *ngIf="subjects.length > 0 || classifiedSubjects.size > 0">
+                Subjects:
+            </dt>
+            <dd>
+                <div *ngIf="subjects.length > 0"> {{subjects}} </div>
+                <div *ngIf="subjects.length == 0 && classifiedSubjects.size > 0"> - </div>
+            </dd>
+
+            <dd class="col-md-offset-1" *ngIf="classifiedSubjects.size > 0">
+                <a (click)="showClassifiedSbj = !showClassifiedSbj;">
+                    <div *ngIf="!showClassifiedSbj">
+                        Show additional classifications
+                        <span  class="glyphicon glyphicon-plus" aria-hidden="true"></span>
+                    </div>
+                    <div *ngIf="showClassifiedSbj">
+                        Hide additional classifications
+                        <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>
+                    </div>
+                </a>
+
+                <div class="well" *ngIf="showClassifiedSbj">
+                    <div *ngFor="let key of classifiedSubjects.keys()">
+                        Classified by OpenAIRE into
+                        <div>
+                            {{key}}: {{classifiedSubjects.get(key)}}
+                        </div>
+                    </div>
+                </div>
+            </dd>
+        </div>
+    `
+
+    })
+
+export class ShowSubjectsComponent {
+    @Input() subjects: string[];
+    @Input() classifiedSubjects: Map<string, string[]>;
+    private showClassifiedSbj: boolean = false;
+
+    constructor () {
+        console.info('showSubjects constructor');
+    }
+
+    ngOnInit() {
+    }
+}

portal-2/src/app/landingPages/showTitle.component.ts

@@ -0,0 +1,30 @@
+import {Component, Input} from '@angular/core';
+
+
+@Component({
+    selector: 'showTitle',
+    template: `
+        <h2 *ngIf="title != undefined">
+            <div *ngIf="title['url'] != undefined">
+                <a class="custom-external" href="{{title['url']}}" target="_blank">
+                    <div [innerHTML]="title['name']"></div>
+                </a>
+            </div>
+            <div *ngIf="title['url'] == undefined">
+                <div [innerHTML]="title['name']"></div>
+            </div>
+        </h2>
+    `
+    
+    })
+
+export class ShowTitleComponent {
+    @Input() title: { [key: string]: string };
+
+    constructor () {
+        console.info('title constructor');
+    }
+
+    ngOnInit() {
+    }
+}

portal-2/src/app/landingPages/tabPaging.component.ts

@@ -0,0 +1,27 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+
+@Component({
+    selector: 'tabPaging',
+    template: `
+        <div class="panel panel-default" *ngIf="!showAll && length > 10">
+            <div class="panel-heading">
+                <a (click)="changeShowAll.emit({value: true});">
+                    <div class="text-right">view all {{length}}</div>
+                </a>
+            </div>
+        </div>
+    `  
+    })
+
+export class TabPagingComponent {
+    @Input() showAll: boolean;
+    @Input() length: number;
+    @Output() changeShowAll: EventEmitter<any> = new EventEmitter();
+
+    constructor () {
+        console.info('publication:paging constructor');
+    }
+
+    ngOnInit() {
+    }
+}

portal-2/src/app/landingPages/tabTable.component.ts

@@ -0,0 +1,54 @@
+import {Component, Input} from '@angular/core';
+
+
+@Component({
+    selector: 'tabTable',
+    template: `
+        <table class="table table-striped">
+            <thead>
+                <tr>
+                    <th>Title</th>
+                    <th>Trust</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr *ngFor="let item of info" class="{{item['class']}}">
+                    <td *ngIf="item != undefined">
+                        <span *ngIf="item['class'] == 'dataset'" class="glyphicon glyphicon-star" aria-hidden="true">
+
+                        </span>
+                        <a *ngIf="item['url'] != '' && item['name'] != ''" class="custom-external" href="{{item['url']}}" target="_blank">
+                            {{item['name']}}
+                        </a>
+                        <p *ngIf="item['url'] == '' && item['name'] != ''">{{item['name']}}</p>
+                        <span *ngIf="item['date'] != ''">
+                            ({{item['date']}})
+                        </span>
+                    </td>
+                    <td>
+                        <div *ngIf="item['trust'] != ''" class="progress">
+                            <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="29" aria-valuemin="0" aria-valuemax="100" [style.width] = "item['trust']">
+                                {{item['trust']}}
+                            </div>
+                        </div>
+                        <div *ngIf="item['trust'] == ''">
+                            <p>no trust found</p>
+                        </div>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    `
+
+    })
+
+export class TabTableComponent {
+    @Input() info: { "name": string, "url": string, "date": string, "trust": string}[];//Map<string, string[]>;
+
+    constructor () {
+        console.info('tabTable constructor');
+    }
+
+    ngOnInit() {
+    }
+}

portal-2/src/app/openaireProperties.ts

@@ -0,0 +1,89 @@
+export class OpenaireProperties {
+    //landing Pages
+    private static baseSearchLink="/"
+    private static searchLinkToPublication = "publication?articleId=";
+    private static searchLinkToProject = "project?projectId=";
+    private static searchLinkToPerson = "person?personId=";
+    private static searchLinkToDataProvider = "https://beta.openaire.eu/search/dataprovider?datasourceId=";
+    private static searchLinkToDataset = "dataset?datasetId=";
+    private static searchLinkToOrganization = "organization?organizationId=";
+
+    // Services - APIs
+
+    // public claimsAPIURL      = "http://rudie.di.uoa.gr:8080/dnet-openaire-connector-service-1.0.0-SNAPSHOT/rest/claimsService/"
+    private static claimsAPIURL = "http://scoobydoo.di.uoa.gr:8181/dnet-openaire-connector-service-1.0.0-SNAPSHOT/rest/claimsService/";
+
+    private static searchAPIURL = "http://astero.di.uoa.gr:8080/dnet-functionality-services-2.0.0-SNAPSHOT/rest/v2.0/api/";
+    // private searchAPIURL     = "http://rudie.di.uoa.gr:8080/dnet-functionality-services-2.0.0-SNAPSHOT/rest/v2.0/api/";
+    // private searchAPIURL     = "http://scoobydoo.di.uoa.gr:8181/dnet-functionality-services-2.0.0-SNAPSHOT/rest/v2.0/api/";
+
+    private static searchServiveURL     = "http://astero.di.uoa.gr:8080/dnet-functionality-services-2.0.0-SNAPSHOT/";
+    // private static searchServiveURL  = "http://scoobydoo.di.uoa.gr:8181/dnet-functionality-services-2.0.0-SNAPSHOT/";
+    // private static searchServiveURL  = "http://services.openaire.eu:8380/search/";
+    //private static searchServiveURL   = "http://rudie.di.uoa.gr:8080/dnet-functionality-services-2.0.0-SNAPSHOT/";
+
+    private static searchCrossrefAPIURL = "http://api.crossref.org/works";
+    private static searchDataciteAPIURL = "http://search.datacite.org/api";
+    private static searchOrcidURL    = "https://pub.orcid.org/";
+
+    // Identifiers
+    private static pmidURL    = "http://www.ncbi.nlm.nih.gov/pubmed/";
+    private static doiURL     = "http://dx.doi.org/";
+    private static cordisURL  = "http://cordis.europa.eu/projects/";
+    private static pmcURL     = "http://europepmc.org/articles/";
+
+
+    //landing Pages' getters
+    public static getsearchLinkToPublication():string{
+      return this.baseSearchLink + this.searchLinkToPublication;
+    }
+    public static getsearchLinkToDataset():string{
+      return this.baseSearchLink + this.searchLinkToDataset;
+    }
+    public static getsearchLinkToProject():string{
+      return this.baseSearchLink + this.searchLinkToProject;
+    }
+    public static getsearchLinkToPerson():string{
+      return this.baseSearchLink + this.searchLinkToPerson;
+    }
+    public static getsearchLinkToOrganization():string{
+      return  this.searchLinkToOrganization;
+    }
+    public static getsearchLinkToDataProvider():string{
+      return  this.searchLinkToDataProvider;
+    }
+
+    // Services - APIs' getters
+    public static getSearchAPIURL():string{
+      return this.searchAPIURL;
+    }
+    public static getSearchServiceURL():string{
+      return this.searchServiveURL;
+    }
+    public static getClaimsAPIURL():string{
+      return this.claimsAPIURL;
+    }
+    public static getSearchCrossrefAPIURL():string{
+        return this.searchCrossrefAPIURL;
+    }
+    public static getSearchDataciteAPIURL():string{
+        return this.searchDataciteAPIURL;
+    }
+    public static getSearchOrcidURL():string{
+        return this.searchOrcidURL;
+    }
+
+    // Identifiers' getters
+    public static getPmidURL():string{
+        return this.pmidURL;
+    }
+    public static getDoiURL():string{
+        return this.doiURL;
+    }
+    public static getCordisURL():string{
+        return this.cordisURL;
+    }
+    public static getPmcURL():string{
+        return this.pmcURL;
+    }
+}

portal-2/src/app/pipes/claimTextFilter.pipe.ts

@@ -0,0 +1,21 @@
+import {Pipe, PipeTransform} from '@angular/core';
+
+@Pipe({
+    name: 'claimTextFilter'
+})
+export class ClaimTextFilterPipe implements PipeTransform {
+
+    transform(value: any, filter: string): any {
+      console.info('ClaimTextFilterPipe  word to filter : '+filter);
+      filter = filter?filter.toLocaleLowerCase():'';
+      return filter ? value.filter(claim=> (
+        claim.sourceType.toLocaleLowerCase().indexOf(filter)!=-1|| //sourceType
+        claim.targetType.toLocaleLowerCase().indexOf(filter)!=-1|| //targetType
+        claim.userMail.toLocaleLowerCase().indexOf(filter)!=-1|| //mail
+        ((claim.source.title && claim.source.title.toLocaleLowerCase().indexOf(filter)!=-1)||(claim.source.name && claim.source.name.toLocaleLowerCase().indexOf(filter)!=-1))|| //source title
+        ((claim.target.title && claim.target.title.toLocaleLowerCase().indexOf(filter)!=-1)||(claim.target.name && claim.target.name.toLocaleLowerCase().indexOf(filter)!=-1))|| //target  title
+        ((claim.source.funderName && claim.source.funderName.toLocaleLowerCase().indexOf(filter)!=-1)||(claim.source.funderName && claim.source.funderName.toLocaleLowerCase().indexOf(filter)!=-1))|| //source funder name
+        ((claim.target.funderName && claim.target.funderName.toLocaleLowerCase().indexOf(filter)!=-1)||(claim.target.funderName && claim.target.funderName.toLocaleLowerCase().indexOf(filter)!=-1)) //target funder name
+      )) : value;
+    }
+}

portal-2/src/app/pipes/claimTypeFilter.pipe.ts

@@ -0,0 +1,35 @@
+
+import {Pipe, PipeTransform} from '@angular/core';
+
+@Pipe({name: 'claimTypeFilter'})
+export class ClaimTypeFilterPipe implements PipeTransform {
+  transform(value: any, publication:boolean,dataset:boolean,project:boolean,context:boolean) : any {
+    let filter = publication;
+    console.info('ClaimTypeFilterPipe  types to show : '+(publication?'publication ':' ')+(dataset?'dataset ':' ')+(project?'project ':' ')+(context?'context ':' '));
+    return  (value)?value.filter((claim) =>{
+      let filter =publication;
+      if(publication||dataset||project||context) {
+        let filter = publication
+        if(filter && (claim.sourceType.toLocaleLowerCase().indexOf('publication')!=-1 || claim.targetType.toLocaleLowerCase().indexOf('publication')!=-1 )) {
+          return true;
+        }
+        filter = dataset;
+        if(filter && (claim.sourceType.toLocaleLowerCase().indexOf('dataset')!=-1 || claim.targetType.toLocaleLowerCase().indexOf('dataset')!=-1 )) {
+          return true;
+        }
+        filter = project;
+        if(filter && (claim.sourceType.toLocaleLowerCase().indexOf('project')!=-1 || claim.targetType.toLocaleLowerCase().indexOf('project')!=-1 )) {
+          return true;
+        }
+        filter = context;
+        if(filter && (claim.sourceType.toLocaleLowerCase().indexOf('context')!=-1 || claim.targetType.toLocaleLowerCase().indexOf('context')!=-1 )) {
+          return true;
+        }
+        return false;
+      }else{
+        return true;
+      }
+    }):value;
+  }
+
+}

portal-2/src/app/searchAll/searchAll.component.ts

@@ -0,0 +1,131 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {SearchCrossrefService} from '../services/searchCrossref.service';
+import {Publication} from '../entities/publication';
+import {PagingFormatter} from '../common/pagingFormatter.component';
+import {PublicationTitleFormatter} from '../common/publicationTitleFormatter.component';
+
+
+@Component({
+    selector: 'search-all',
+    template: `
+
+
+      <div  *ngIf="claim">
+        <h3>Selected publications:</h3>
+          <p *ngFor=" let item of selected "> <publication-title [title]="item.title" [url]="item.URL" > </publication-title> {{item.DOI}} --{{item.publisher}}  <button (click)="remove(item)"  type="button" class="btn btn-default">Remove</button></p>
+      </div>
+
+      <h1>Search</h1>
+      <form>
+        <input #term   [(ngModel)]="keyword" name= "searchAllTerm" />
+        <button   (click)="search(term)"  type="submit" class="btn btn-default">Search</button>
+        </form>
+      <div>
+        <div *ngIf="resultsNum != null && resultsNum > 0">
+          <p > {{resultsNum   }} Total Results </p>
+          <paging [currentPage]="page" [totalResults]="resultsNum"  [navigateTo]="navigateTo" [term]="keyword" [size]="size"> </paging>
+        </div>
+        <div >
+
+            <p *ngFor=" let item of results "> <publication-title [title]="item.title" [url]="item.URL" > </publication-title> {{item.DOI}} --{{item.publisher}} <button *ngIf="claim" (click)="add(item)"  type="button" class="btn btn-default">Select</button> </p>
+
+        </div>
+      </div>
+
+    `
+})
+export class SearchAllComponent {
+  constructor (private _searchService: SearchCrossrefService,
+  private route: ActivatedRoute) {}
+  ngOnInit() {
+  this.sub =  this.route.queryParams.subscribe(params => {
+
+      let page = (params['page']=== undefined)?1:+params['page'];
+      let size = (params['size']=== undefined)?10:+params['size'];
+      this.page = page;
+      this.size = size;
+      this.keyword = params['keyword'];
+      if(this.keyword !=null){
+        this.searchCrossref(this.keyword,this.size,this.page);
+      }
+    });
+
+ }
+   ngOnDestroy() {
+     this.sub.unsubscribe();
+   }
+   sub: any;
+  page : number;
+  size:number;
+  keyword:string;
+  navigateTo: string = "Search";
+
+  @Input() public claim:boolean = true ; // add selection for claiming
+  @Input() public publication:boolean = true ; // true for publication/ false for dataset
+  @Input() public source:string = 'openaire' ; // other values : crossref/ datacite/orcid
+  @Input() public selected = [] ;
+  @Output() selectedChange = new EventEmitter();
+  results:string[];
+  resultsNum : Observable<number> ;
+  search(term: string, size : number, page : number) {
+    // if(this.source == 'crossref' && this.publication){
+        this.searchCrossref(term,size,page);
+    // }else if(this.source == 'openaire' && this.publication){
+    //
+    // }else if(this.source == 'openaire' && this.publication){
+    //
+    // }else if(this.source == 'openaire' && !this.publication){
+    //
+    // }else if(this.source == 'orcid' && this.publication){
+    //
+    // }else if(this.source == 'datacite' && !this.publication){
+    //
+    // }
+  }
+  searchCrossref (term: string, size : number, page : number) {
+    this._searchService.searchCrossrefResults(term, size, page).subscribe(
+      data => {
+        this.results = data.items;
+        this.page=page;
+        this.resultsNum = data['total-results'];
+       },
+      err => console.error(err)
+    );
+  }
+  searchOpenaire (term2: string) {
+    //this.items = this._searchService.httpSearchOpenaire(term2);
+  }
+
+
+
+   add(item){
+        this.selected.push(item);
+         console.info("Select:"+this.selected);
+         for (var i = 0; i < this.selected.length; i++) {
+             console.log(this.selected[i]);
+         }
+
+
+        var index:number =this.results.indexOf(item);
+         if (index > -1) {
+            this.results.splice(index, 1);
+        }
+            console.info("Item removed "+this.selected.indexOf(item));
+            this.selectedChange.emit({
+             value: this.selected
+           });
+   }
+   remove(item){
+          var index:number =this.selected.indexOf(item);
+         if (index > -1) {
+            this.selected.splice(index, 1);
+        }
+        this.selectedChange.emit({
+         value: this.selected
+       });
+
+   }
+
+}

portal-2/src/app/searchPages/advancedSearchPublications.component.ts

@@ -0,0 +1,168 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router, ActivatedRoute} from '@angular/router';
+import {Filter, Value} from './common/searchHelperClasses.class';
+import {SearchPublicationsService} from '../services/searchPublications.service';
+import {SearchResult}     from '../entities/searchResult';
+ import {OpenaireProperties} from '../openaireProperties';
+
+
+@Component({
+    selector: 'advanced-search-publications',
+    template: `
+    <advanced-search-page pageTitle="Search Publications" type="publication" [(filters)] = "filters"
+                 [(results)] = "results" [(totalResults)] = "totalResults"
+                 [(page)] = "page" [(size)] = "size"
+                 [(fields)] = "fields" [(selectedFields)]="selectedFields"
+                 [(quantifiers)]="quantifiers" [(selectedQuantifiers)]="selectedQuantifiers"
+                 [(keywords)] = "keywords" (queryChange)="queryChanged($event)">
+    </advanced-search-page>
+
+    `
+ })
+export class AdvancedSearchPublicationsComponent {
+  private results =[];
+  private filters =[];
+  private totalResults:number  = 0 ;
+  private page :number = 1;
+  private size :number = 1;
+
+  private fields: {"name": string, "value": string}[] = [
+      {"name": "all fields", "value": "all"},
+      {"name": "Title", "value": "title"},
+      {"name": "Author", "value": "author"},
+      {"name": "Publisher", "value": "publisher"},
+      {"name": "Subject", "value": "subject"}
+  ];
+  private selectedFields: {"name": string, "value": string}[] = [this.fields[0]];
+
+  private quantifiers: {"name": string, "value": string}[] = [
+      {"name": "all words", "value": "and"},
+      {"name": "any words", "value": "or"},
+      {"name": "none words", "value": "not"}
+  ];
+  private selectedQuantifiers: {"name": string, "value": string}[] = [this.quantifiers[0]];
+
+  private keywords: string[] = [''];
+
+  constructor (private route: ActivatedRoute, private _searchPublicationsService: SearchPublicationsService ) {
+
+    this.results =[];
+    this.filters =[];
+    //SearchPublicationsComponent.filters = [];
+    this.totalResults = 123;
+    for(var i=0; i<15 ; i++){
+        //var result = {title: "title"+i, id: "id"+i}
+        var result: SearchResult = new SearchResult();
+
+        result['title'] = {"name": "title"+i, "url": OpenaireProperties.getsearchLinkToPublication()+i, "accessMode": ""};
+
+        result['authors'] = new Array<{"name": string, "url": string}>();
+        for(let j=0; j<=i+1; j++) {
+            result['authors'][j] = {"name": "author"+j+":"+i, "url": OpenaireProperties.getsearchLinkToPerson()+i};
+        }
+
+        result.year = "0000"
+
+        result.description = "This is a description for publication "+i;
+
+        result['projects'] = {"name": "EC | EPLANET (246806)", "url": "https://beta.openaire.eu/index.php?option=com_openaire&view=project&projectId=corda_______::9352bcbec0b5882278a21fdc0e83078c"};
+
+        this.results.push(result);
+    }
+
+    for(var i=0; i<5 ; i++){
+         var  values = [];
+         for(var j=0; j<10 ; j++){
+           var value:Value = {name: "name"+j, id: "filter_"+i+ "_id_"+j, number:j, selected:false}
+           values.push(value);
+         }
+         values.sort((n2,n1) => {
+            if (n1.number > n2.number) {
+                return 1;
+            }
+
+            if (n1.number < n2.number) {
+                return -1;
+            }
+
+            return 0;
+        });
+        var filter:Filter = {title: "title"+i, filterId: "filter_"+i, originalFilterId: "filter_"+i, values : values, countSelectedValues:0, "filterOperator": 'and'}
+        if(i==0) {
+            var  values = [];
+            for(var j=0; j<10 ; j++){
+              var value:Value = {name: "MYname"+j, id: "MYfilter_"+i+ "_id_"+j, number:j, selected:false}
+              values.push(value);
+            }
+            values.sort((n2,n1) => {
+               if (n1.number > n2.number) {
+                   return 1;
+               }
+
+               if (n1.number < n2.number) {
+                   return -1;
+               }
+
+               return 0;
+            });
+            var filter1:Filter = {title: "MYtitle"+i, filterId: "MYfilter_"+i, originalFilterId: "MYfilter_"+i, values : values, countSelectedValues:0, "filterOperator": 'or'}
+
+            this.filters.push(filter1);
+        }
+
+        this.sub =  this.route.queryParams.subscribe(params => {
+            console.info(params);
+            if(params[filter.filterId] != undefined) {
+                let values = params[filter.filterId].split(",");
+                for(let value of values) {
+                    for(let filterValue of filter.values) {
+                        if(filterValue.id == value) {
+                            filterValue.selected = true;
+                            filter.countSelectedValues++;
+                        }
+                    }
+                }
+            }
+
+        });
+
+        this.filters.push(filter);
+
+    }
+
+
+  }
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(params => {
+      let page = (params['page']=== undefined)?1:+params['page'];
+      let size = (params['size']=== undefined)?10:+params['size'];
+      this.page = ( page <= 0 ) ? 1 : page;
+      this.size = ( size <= 0 ) ? 10 : size;
+      //this.keywords = (params['keyword']?params['keyword']:'');
+
+    });
+
+    //TODO get the rest parameters to create query
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  getResults(parameters:string){
+    //http://rudie.di.uoa.gr:8080/dnet-functionality-services-1.2.0-SNAPSHOT/search?action=searchNrefine&sTransformer=results_openaire&rTransformer=results_openaire_browse&query=%28oaftype+exact+result%29+and+%28resulttypeid+exact+publication%29&page=5&size=10&fields=instancetypenameid&fields=resultlanguageid&fields=relfunderid&fields=relprojectid&fields=resultacceptanceyear&fields=resultbestlicense&fields=resulthostingdatasourceid&fields=communityid&locale=en_GB
+    console.info("getResults: Execute search query "+parameters);
+  }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  private queryChanged($event) {
+    var parameters = $event.value;
+    this.getResults(parameters);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}

portal-2/src/app/searchPages/common/advancedSearchForm.component.ts

@@ -0,0 +1,154 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Subject } from 'rxjs/Subject';
+
+
+@Component({
+    selector: 'advanced-search-form',
+    template: `
+        <form class="form-inline">
+            <div *ngFor="let selectedField of selectedFields; let i = index" class="form-group">
+                <div class="input-group">
+                    <div class="input-group-btn">
+                        <button [style.width]="'120px'" aria-expanded="false" aria-haspopup="true" class="btn btn-info dropdown-toggle" data-toggle="dropdown" id="dropdownMenu1" type="button">
+                            {{selectedField['name']}}
+                        </button>
+                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                            <li *ngFor="let field of fields">
+                                <a (click)="fieldChanged(i, field)">{{field['name']}}</a>
+                            </li>
+                        </ul>
+                    </div>
+
+                    <input type="text" class="form-control" placeholder="Type keywords..." [(ngModel)]="keywords[i]" name="keywords[{{i}}]">
+
+                    <div class="input-group-btn">
+                        <button [style.width]="'120px'" type="button" id="dropdownMenu1" data-toggle="dropdown" class="btn btn-info dropdown-toggle" aria-haspopup="true" aria-expanded="true">
+                            {{selectedQuantifiers[i]['name']}}
+                        </button>
+                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                            <li *ngFor="let quantifier of quantifiers">
+                                <a (click)="quantifierChanged(i, quantifier)">{{quantifier['name']}}</a>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+
+                <button type="button" class="btn btn-success" (click)="addFilter()">
+                    <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
+                </button>
+                <button type="button" class="btn btn-danger" *ngIf="selectedFields.length > 1" (click)="removeFilter(i)">
+                    <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>
+                </button>
+            </div>
+
+
+
+            <!--div *ngFor="let selectedField of selectedFields; let i = index" class="form-group">
+<div class="row">
+<div class="col-xs-9 col-sm-9">
+                <div class="input-group">
+<div class="col-xs-2 col-sm-2">
+                    <div class="input-group-btn">
+                        <button aria-expanded="false" aria-haspopup="true" class="btn btn-info dropdown-toggle" data-toggle="dropdown" id="dropdownMenu1" type="button">
+                            {{selectedField['name']}}
+                        </button>
+                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                            <li *ngFor="let field of fields">
+                                <a (click)="fieldChanged(i, field)">{{field['name']}}</a>
+                            </li>
+                        </ul>
+                    </div>
+</div>
+
+<div class="col-xs-4 col-sm-4">
+                    <input type="text" class="form-control" placeholder="Type keywords..." [(ngModel)]="keywords[i]" name="keywords[{{i}}]">
+</div>
+
+<div class="col-xs-3 col-sm-3">
+                    <div class="input-group-btn">
+                        <button type="button" id="dropdownMenu1" data-toggle="dropdown" class="btn btn-info dropdown-toggle" aria-haspopup="true" aria-expanded="true">
+                            {{selectedQuantifiers[i]['name']}}
+                        </button>
+                        <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
+                            <li *ngFor="let quantifier of quantifiers">
+                                <a (click)="quantifierChanged(i, quantifier)">{{quantifier['name']}}</a>
+                            </li>
+                        </ul>
+                    </div>
+</div>
+                </div>
+</div>
+<div class="col-xs-3 col-sm-3">
+                <button type="button" class="btn btn-success" (click)="addFilter()">
+                    <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
+                </button>
+
+                <button type="button" class="btn btn-danger" *ngIf="selectedFields.length > 1" (click)="removeFilter(i)">
+                    <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>
+                </button>
+</div>
+</div>
+            </div-->
+
+
+        </form>
+
+        <button (click)="keywordsChanged()"  type="submit" class="btn btn-default">Search</button>
+    `
+})
+
+export class AdvancedSearchFormComponent {
+
+
+    @Input() fields: {"name": string, "value": string}[];
+    @Input() selectedFields: {"name": string, "value": string}[];
+
+    @Input() quantifiers: {"name": string, "value": string}[];
+    @Input() selectedQuantifiers: {"name": string, "value": string}[];
+
+    @Input() keywords: string[];
+    @Output() keywordsChange  = new EventEmitter();
+
+    constructor () {
+        console.info("AdvancedSearchFormComponent constructor");
+    }
+
+    ngOnInit() {
+        console.info("AdvancedSearchFormComponent ngOnInit");
+    }
+
+    keywordsChanged() {
+        this.keywordsChange.emit({
+            selectedFields: this.selectedFields,
+            selectedQuantifiers: this.selectedQuantifiers,
+            keywords: this.keywords
+        });
+    }
+
+    addFilter() {
+        console.info("add filter");
+        //this.values.push({"field": this.fields[0].value, "quantifier": this.quantifiers[0].value, "keywords": []});
+        this.selectedFields.push(this.fields[0]);
+        this.selectedQuantifiers.push(this.quantifiers[0]);
+        this.keywords.push('');
+        console.info(this.keywords);
+    }
+
+    removeFilter(index: number) {
+        console.info("remove filter");
+        //this.values.splice(index, 1);
+        this.selectedFields.splice(index, 1);
+        this.selectedQuantifiers.splice(index, 1);
+        this.keywords.splice(index, 1);
+        console.info(this.keywords);
+    }
+
+    fieldChanged(index: number, field: {"name": string, "value": string}) {
+        this.selectedFields[index] = field;
+    }
+
+    quantifierChanged(index: number, quantifier: {"name": string, "value": string}) {
+        this.selectedQuantifiers[index] = quantifier;
+    }
+}

portal-2/src/app/searchPages/common/advancedSearchPage.component.ts

@@ -0,0 +1,206 @@
+import {Component, Input, ViewChild, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Location} from '@angular/common';
+ import { Filter, Value} from './searchHelperClasses.class';
+import {SearchResult}     from '../../entities/searchResult';
+
+@Component({
+    selector: 'advanced-search-page',
+    template: `
+
+    <div class="container">
+        <div class="page-header">
+            <h1>{{pageTitle}}</h1>
+        </div>
+        <div>
+            <div class="row row-offcanvas row-offcanvas-right">
+                <div class="col-xs-12 col-sm-3">
+                    <a *ngIf="isFiltered()" (click)="clearFilters()" > Clear Filters</a>
+                    <p *ngFor="let filter of filters " >
+                        <search-filter [filter]="filter"   (change)="filterChanged($event)"></search-filter>
+                    </p>
+                </div>
+
+                <div class="col-xs-6 col-sm-9 sidebar-offcanvas" id="sidebar">
+                    <advanced-search-form [(fields)]="fields"
+                                          [(selectedFields)]="selectedFields"
+                                          [(quantifiers)]="quantifiers"
+                                          [(selectedQuantifiers)]="selectedQuantifiers"
+                                          [(keywords)]="keywords"
+                                          (keywordsChange)="keywordsChanged($event)">
+                    </advanced-search-form>
+
+                    <div class="text-right" *ngIf="results  && results.length>= size">
+                        <paging-no-load [(currentPage)]="page" [totalResults]="totalResults" [size]="size"  (pageChange)="pageChanged($event)" > </paging-no-load>
+                    </div>
+                    <div>
+                        <search-result [results]="results" [page]="page"></search-result>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    `
+})
+export class AdvancedSearchPageComponent {
+  @Input() pageTitle = "";
+  @Input() results = [];
+  @Input() filters = [];
+  @Input() type;
+  @Input() page:number = 1;
+  @Input() size: number = 10;
+  @Input() totalResults: number = 0;
+
+  @Input() fields: {"name": string, "value": string}[];
+  @Input() selectedFields: {"name": string, "value": string}[];
+  @Input() quantifiers: {"name": string, "value": string}[];
+  @Input() selectedQuantifiers: {"name": string, "value": string}[];
+  @Input() keywords:string[];
+  @Output() keywordsChange = new EventEmitter();
+
+  test= { value: 0};
+
+  @Output() queryChange  = new EventEmitter();
+  constructor (private location: Location) {
+
+  }
+
+  ngOnInit() {
+    console.info("  page  - value: "+this.page);
+    this.totalResults = this.results.length;
+  }
+
+  private createUrlParameters(){
+    var allLimits="";//location.search.slice(1);
+    for (let filter of this.filters){
+      var filterLimits="";
+      if(filter.countSelectedValues > 0){
+        for (let value of filter.values){
+          if(value.selected == true){
+            filterLimits+=((filterLimits.length == 0)?'':',') + value.id;
+           }
+        }
+        allLimits+=((filterLimits.length == 0 )?'':((allLimits.length == 0)?'':'&') +filter.filterId + '='+ filterLimits) ;
+      }
+    }
+    /*if(this.keywords.length > 0 ){
+       allLimits+=((allLimits.length == 0)?'':'&') + 'keyword=' + this.keyword;
+    }
+    if(this.page != 1 ){
+       allLimits+=((allLimits.length == 0)?'':'&') + 'page=' + this.page;
+   }*/
+    return allLimits;
+  }
+  private createQueryParameters(){
+    var allLimits="";
+    for (let filter of this.filters){
+      if(filter.countSelectedValues > 0){
+        var filterLimits="";
+        for (let value of filter.values){
+          if(value.selected == true){
+              if(filter.filterOperator == 'not') {
+                  filterLimits+=((filterLimits.length == 0)?'':' and ') + filter.filterId + '<>'+ value.id;
+              } else {
+                  filterLimits+=((filterLimits.length == 0)?'':' '+filter.filterOperator+' ') + filter.filterId + '='+ value.id;
+              }
+            //filterLimits+=((filterLimits.length == 0)?'':' and ') + filter.filterId + '='+ value.id;
+           }
+        }
+        allLimits+=((filterLimits.length == 0 )?'':((allLimits.length == 0)?'':' and ')+'('+filterLimits +')') ;
+      }
+  }
+
+
+    for(let i=0; i<this.keywords.length; i++){
+        var keywords = this.keywords[i];
+        if(keywords == '') {
+            if(this.keywords.length > 1) {
+                this.selectedFields.splice(i, 1);
+                this.selectedQuantifiers.splice(i, 1);
+                this.keywords.splice(i, 1);
+            }
+        } else {
+            let keyword = keywords.split(" ");
+            let keywordLimits="";
+            let numOfKeywordLimits = 0;
+            for(let j=0; j<keyword.length; j++) {
+                numOfKeywordLimits++;
+                if(this.selectedQuantifiers[i].value == "not") {
+                    keywordLimits+=((keywordLimits.length == 0)?'':' and')+' ('+this.selectedFields[i].value+' <> "'+keyword[j]+'")';
+                } else {
+                    keywordLimits+=((keywordLimits.length == 0)?'':' '+this.selectedQuantifiers[i].value)+' ('+this.selectedFields[i].value+' = "'+keyword[j]+'")';
+                }
+            }
+
+            //... and ((resulttitle = "open") or (resulttitle = "access"))
+            if(numOfKeywordLimits > 1) {
+                allLimits+=((allLimits.length == 0)?'':' and (') + keywordLimits + ' )';
+            } else {
+                allLimits+=((allLimits.length == 0)?'':' and ') + keywordLimits;
+            }
+        }
+   }
+   console.info("QueryParams: "+allLimits);
+    return allLimits;
+  }
+  private isFiltered(){
+    var filtered=false;
+    for (let filter of this.filters){
+       if(filter.countSelectedValues > 0){
+           filtered = true;
+           break;
+       }
+   }/*
+    if(this.keywords.length > 0 ){
+      filtered = true;
+  }*/
+    return filtered;
+  }
+  clearFilters(){
+    for (let filter of this.filters){
+      if(filter.countSelectedValues > 0){
+         for (let value of filter.values){
+          if(value.selected == true){
+            value.selected = false;
+           }
+        }
+        filter.countSelectedValues = 0;
+      }
+  }/*
+    if(this.keywords.length > 0 ){
+      this.keywords =[''];
+  }*/
+  }
+
+  goTo(page:number = 1){
+      console.info("goto");
+      //console.info("keyword: "+this.keyword);
+    this.page = page;
+    var urlParameters = this.createUrlParameters();
+    var queryParameters = this.createQueryParameters();
+    this.location.go(location.pathname,urlParameters);
+    this.queryChange.emit({
+        value: queryParameters
+    });
+
+  }
+  filterChanged($event){
+      console.info("filterChanged");
+      this.goTo(1);
+  }
+  keywordsChanged($event) {
+      console.info("keywordsChanged");
+     // this.keyword = $event.value;
+     // console.info("searchPage: keyword= "+this.keyword);
+     this.keywords = $event.keywords;
+     this.selectedFields = $event.selectedFields;
+     this.selectedQuantifiers = $event.selectedQuantifiers;
+     this.goTo(1);
+  }
+  pageChanged($event) {
+    this.page = +$event.value;
+    this.goTo(this.page);
+  }
+
+}

portal-2/src/app/searchPages/common/searchFilter.component.ts

@@ -0,0 +1,77 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+import { Filter, Value} from './searchHelperClasses.class';
+
+@Component({
+    selector: 'search-filter',
+    template: `
+    <p>{{filter.title}}   </p>
+    <p *ngFor = "let value of filter.values.slice(0,5)" >
+        <input [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)" />
+        <span> {{value.name}} ({{value.number}}) </span>
+    </p>
+
+    <a *ngIf = "!showAll && filter.values.length > 5" (click)="toggleShowAll()" > More</a>
+    <span *ngIf = "filter.values.length > 5 && showAll" >
+        <p *ngFor = "let value of filter.values.slice(5)" >
+            <input [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)"  />
+            <span> {{value.name}} ({{value.number}}) </span>
+        </p>
+        <a (click)="toggleShowAll()" > Less</a>
+    </span>
+
+    `
+})
+
+export class SearchFilterComponent {
+    @Input() title;
+    @Input() filterId;
+    @Input() values; //array[] " name, id, number, selected"
+    @Input() countSelectedValues:number = 0; //array[] " name, id, number, selected"
+    //@Output() change  = new EventEmitter();
+    @Input() test:{value:number} ;
+    @Input() filter:Filter;
+    private showAll:boolean = false;
+
+    constructor () {
+
+    }
+
+    ngOnInit() {
+
+    }
+
+    toggleShowAll(){
+        this.showAll = !this.showAll;
+        if(this.showAll == false) {
+            this.reorderFilterValues();
+        }
+    }
+
+    filterChange(selected:boolean){
+        if(selected){
+            this.filter.countSelectedValues++;
+        }else{
+            this.filter.countSelectedValues--;
+        }
+
+        //this.change.emit({
+        //value: true
+        //});
+    }
+
+    reorderFilterValues() {
+        let values: Value[] = [];
+
+        for(let value of this.filter.values) {
+            if(value.selected) {
+                let index: number = this.filter.values.indexOf(value);
+                let selectedValue:Value = this.filter.values[index];
+
+                this.filter.values.splice(index, 1);
+                this.filter.values.splice(0, 0, selectedValue);
+            }
+        }
+    }
+}

portal-2/src/app/searchPages/common/searchForm.component.ts

@@ -0,0 +1,38 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+@Component({
+    selector: 'search-form',
+    template: `
+        <form>
+            <div class="input-group">
+                <span class="input-group-addon" id="sizing-addon2">Filter</span>
+                <input type="text" class="form-control" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="keyword"  name="keyword" >
+                <span class="input-group-btn">
+                    <button (click)="keywordChanged()"  type="submit" class="btn btn-default">Search</button>
+                </span>
+            </div>
+        </form>
+    `
+})
+
+export class SearchFormComponent {
+    @Input() keyword: string = '';
+
+    @Output() keywordChange  = new EventEmitter();
+
+    constructor () {
+        console.info("SearchFormComponent constructor");
+    }
+
+    ngOnInit() {
+
+    }
+
+    keywordChanged() {
+        console.info("inside form: "+this.keyword);
+        this.keywordChange.emit({
+            value: this.keyword
+        });
+    }
+}

portal-2/src/app/searchPages/common/searchHelperClasses.class.ts

@@ -0,0 +1,15 @@
+export class Filter{
+    public title: string; // eg Type
+    public filterId: string; // type (name in url parameter)
+    public originalFilterId: string; // (in index)
+    public countSelectedValues: number;
+    public values: Value[];
+    public filterOperator: string;
+}
+export class Value{
+    public name: string; //eg Article, Journal
+    public id: string; //0001
+    public selected: boolean;
+    public number: number;
+
+}

portal-2/src/app/searchPages/common/searchPage.component.ts

@@ -0,0 +1,181 @@
+import {Component, Input, ViewChild, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Location} from '@angular/common';
+
+import { Filter, Value} from './searchHelperClasses.class';
+import {SearchResult}     from '../../entities/searchResult';
+
+@Component({
+    selector: 'search-page',
+    template: `
+
+    <div class="container">
+      <div class="page-header">
+          <h1>{{pageTitle}}</h1>
+      </div>
+      <div>
+        <div class="row row-offcanvas row-offcanvas-right">
+          <div class="col-xs-12 col-sm-3">
+            <a *ngIf="isFiltered()" (click)="clearFilters()" > Clear Filters</a>
+            <p *ngFor="let filter of filters " >
+              <search-filter [filter]="filter"   (change)="filterChanged($event)"></search-filter>
+             </p>
+          </div>
+
+          <div class="col-xs-6 col-sm-9 sidebar-offcanvas" id="sidebar">
+            <!--form>
+             <div class="input-group">
+               <span class="input-group-addon" id="sizing-addon2">Filter</span>
+               <input type="text" class="form-control" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="keyword"  name="keyword" >
+               <span class="input-group-btn">
+                 <button (click)="goTo(1)"  type="submit" class="btn btn-default">Search</button>
+               </span>
+             </div>
+            </form-->
+            <search-form [(keyword)]="keyword" (keywordChange)="keywordChanged($event)"></search-form>
+
+            <div class="text-right" *ngIf="results  && results.length>= size">
+                <paging-no-load [(currentPage)]="page" [totalResults]="totalResults" [size]="size"  (pageChange)="pageChanged($event)" > </paging-no-load>
+            </div>
+            <div>
+            <!--p *ngFor="let result of results">
+              <search-result [id]="result.id" [title]="result.title" [page]="page"></search-result>
+             </p-->
+             <search-result [results]="results" [page]="page"></search-result>
+
+            </div>
+
+          </div>
+        </div>
+      </div>
+    </div>
+
+    `
+})
+export class SearchPageComponent {
+  @Input() pageTitle = "";
+  @Input() results = [];
+  @Input() filters = [];
+  @Input() type;
+  @Input() page:number = 1;
+  @Input() size: number = 10;
+  @Input() totalResults: number = 0;
+  @Input() keyword:string = '';
+
+  test= { value: 0};
+
+  @Output() queryChange  = new EventEmitter();
+  constructor (private location: Location) {
+
+  }
+
+  ngOnInit() {
+    console.info("  page  - value: "+this.page);
+    this.totalResults = this.results.length;
+  }
+
+  changekeyword(){
+
+  }
+
+  private createUrlParameters(){
+    var allLimits="";//location.search.slice(1);
+    for (let filter of this.filters){
+      var filterLimits="";
+      if(filter.countSelectedValues > 0){
+        for (let value of filter.values){
+          if(value.selected == true){
+            filterLimits+=((filterLimits.length == 0)?'':',') + value.id;
+           }
+        }
+        allLimits+=((filterLimits.length == 0 )?'':((allLimits.length == 0)?'':'&') +filter.filterId + '='+ filterLimits) ;
+      }
+    }
+    if(this.keyword.length > 0 ){
+       allLimits+=((allLimits.length == 0)?'':'&') + 'keyword=' + this.keyword;
+    }
+    if(this.page != 1 ){
+       allLimits+=((allLimits.length == 0)?'':'&') + 'page=' + this.page;
+    }
+    return allLimits;
+  }
+  private createQueryParameters(){
+    var allLimits="";
+    for (let filter of this.filters){
+      if(filter.countSelectedValues > 0){
+        var filterLimits="";
+        for (let value of filter.values){
+          if(value.selected == true){
+              if(filter.filterOperator == 'not') {
+                  filterLimits+=((filterLimits.length == 0)?'':' and ') + filter.filterId + '<>'+ value.id;
+              } else {
+                  filterLimits+=((filterLimits.length == 0)?'':' '+filter.filterOperator+' ') + filter.filterId + '='+ value.id;
+              }
+           }
+        }
+        allLimits+=((filterLimits.length == 0 )?'':((allLimits.length == 0)?'':' and ')+'('+filterLimits +')') ;
+      }
+    }
+    if(this.keyword.length > 0 ){
+       allLimits+=((allLimits.length == 0)?'':' and ') + ' keyword=' + this.keyword;
+    }
+    console.info("QueryParams: "+allLimits);
+    return allLimits;
+  }
+  private isFiltered(){
+    var filtered=false;
+    for (let filter of this.filters){
+       if(filter.countSelectedValues > 0){
+           filtered = true;
+           break;
+       }
+     }
+    if(this.keyword.length > 0 ){
+      filtered = true;
+    }
+    return filtered;
+  }
+  clearFilters(){
+    for (let filter of this.filters){
+      if(filter.countSelectedValues > 0){
+         for (let value of filter.values){
+          if(value.selected == true){
+            value.selected = false;
+           }
+        }
+        filter.countSelectedValues = 0;
+      }
+    }
+    if(this.keyword.length > 0 ){
+      this.keyword ='';
+    }
+  }
+
+  goTo(page:number = 1){
+      console.info("goto");
+      console.info("keyword: "+this.keyword);
+    this.page = page;
+    var urlParameters = this.createUrlParameters();
+    var queryParameters = this.createQueryParameters();
+    this.location.go(location.pathname,urlParameters);
+    this.queryChange.emit({
+        value: queryParameters
+    });
+
+  }
+  filterChanged($event){
+      console.info("filterChanged");
+      this.goTo(1);
+  }
+  keywordChanged($event) {
+      console.info("keywordChanged");
+      this.keyword = $event.value;
+      console.info("searchPage: keyword= "+this.keyword);
+      this.goTo(1);
+  }
+  pageChanged($event) {
+    this.page = +$event.value;
+    this.goTo(this.page);
+  }
+
+}

portal-2/src/app/searchPages/common/searchResult.component.ts

@@ -0,0 +1,91 @@
+import {Component, Input} from '@angular/core';
+import {SearchResult}     from '../../entities/searchResult';
+
+@Component({
+    selector: 'search-result',
+    template: `
+    <!--ul class="list-group"-->
+    <ul class="list-unstyled">
+        <!--li class="list-group-item" *ngFor="let result of results.slice((page-1)*10, page*10)"-->
+        <li *ngFor="let result of results.slice((page-1)*10, page*10)">
+            <div *ngIf="result != undefined">
+                <div *ngIf="result['title'] != undefined">
+                    <h3 *ngIf="result['title'].url != undefined">
+                        <a class="custom-external" href="{{result['title'].url}}" target="_blank">
+                            {{result['title'].name}}
+                        </a>
+                    </h3>
+                    <h3 *ngIf="result['title'].url == undefined">
+                        {{result['title'].name}}
+                    </h3>
+                </div>
+
+                <div>
+                    <span *ngIf="result['authors'] != undefined">
+                        <span *ngFor="let author of result['authors'].slice(0,15)">
+                            <a class="custom-external" href="{{author['url']}}" target="_blank">
+                                {{author['name']}};
+                            </a>
+                        </span>
+                        <span *ngIf="result['authors'].length > 15">...</span>
+                    </span>
+                    <span *ngIf="result.year != undefined && result.year != ''">
+                        ({{result.year}})
+                    </span>
+                </div>
+
+                <blockquote *ngIf="result.description != undefined && result.description != ''">
+                    {{result.description}}
+                </blockquote>
+
+                <div *ngIf="result['projects'] != undefined">
+                    <span> Projects: </span>
+                    <a *ngIf="result['projects'].url != undefined"
+                        class="custom-external" href="{{result['projects'].url}}" target="_blank">
+                            {{result['projects'].name}}
+                    </a>
+                    <p *ngIf="result['projects'].url == undefined">
+                        {{result['projects'].name}}
+                    </p>
+                </div>
+            </div>
+            <hr>
+        </li>
+    </ul>
+    `
+})
+
+export class SearchResultComponent {
+    @Input() page: number;
+    //@Input() results: { [key: string]: string }[];
+    @Input() results: SearchResult[];
+/*
+    @Input() title;
+    @Input() id;
+    //publications & organizations:
+    @Input() projects;
+    //datasets & publications
+    @Input() description;
+    @Input() year;
+    @Input() authors;
+    //datasets:
+    @Input() publisher;
+    //dataproviders & projects:
+    @Input() organizations;
+    //projects:
+    @Input() funders;
+    //organizations:
+    @Input() country;
+    //dataproviders:
+    @Input() type;
+    @Input() websiteURL;
+    @Input() OAIPMHURL;
+*/
+  constructor () {
+
+  }
+
+  ngOnInit() {
+
+  }
+}

portal-2/src/app/searchPages/search.component.ts

@@ -0,0 +1,75 @@
+import {Component} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {SearchCrossrefService} from '../services/searchCrossref.service';
+
+@Component({
+    selector: 'search',
+    template: `
+      <h1>Search Demo</h1>
+      <p><i>Fetches from crossref </i></p>
+      <form>
+        <input #term   [(ngModel)]="keyword" name="keyword" />
+        <button (click)="search(term.value,10,1)"  type="submit" class="btn btn-default">Search</button>
+      </form>
+      <div>
+        <div *ngIf="resultsNum != null && resultsNum > 0">
+          <p > {{resultsNum   }} Total Results </p>
+       <paging [currentPage]="page" [totalResults]="resultsNum" [navigateTo]="navigateTo" [term]="keyword" [size]="size"> </paging>
+        </div>
+      <div >
+            <p *ngFor=" let item of results "> <publication-title [title]="item.title" [url]="item.URL" > </publication-title> {{item.DOI}} --{{item.publisher}}  </p>
+        </div>
+      </div>
+     `
+})
+export class SearchComponent {
+  constructor (private _searchService: SearchCrossrefService,
+    private route: ActivatedRoute) {
+    console.info('search constructor');
+  }
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(params => {
+      console.info('Params'+params);
+      let page = (params['page']=== undefined)?1:+params['page'];
+      let size = (params['size']=== undefined)?10:+params['size'];
+      this.page = ( page <= 0 ) ? 1 : page;
+      this.size = ( size <= 0 ) ? 10 : size;
+
+      this.keyword = params['keyword'];
+      if(this.keyword !=null){
+        this.search(this.keyword,this.size,this.page);
+      }
+
+   });
+
+}
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  private sub: any;
+  private page : number;
+  private size:number;
+  private keyword:string;
+  private navigateTo: string = "./search";
+
+  private results : String[];
+  private orcidresults : String[];
+  private resultsNum : number ;
+  search (term: string, size : number, page : number) {
+     this.getCrossrefResults(term,size,page);
+    }
+
+
+  getCrossrefResults (term: string, size : number, page : number)  {
+    this._searchService.searchCrossrefResults(term, size, page).subscribe(
+      data => {
+        this.results = data.items;
+        this.page=page;
+        this.resultsNum = data['total-results'];
+      },
+      err => console.error(err)
+    );
+   }
+
+}

portal-2/src/app/searchPages/search.module.ts

@@ -0,0 +1,55 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SharedComponentsModule} from '../common/sharedComponents.module';
+
+
+import {Filter, Value} from './common/searchHelperClasses.class';
+import {SearchResult}     from '../entities/searchResult';
+
+
+import {AdvancedSearchPageComponent} from './common/advancedSearchPage.component';
+import {SearchAllComponent} from '../searchAll/searchAll.component';//helpers
+import {SearchPageComponent} from './common/searchPage.component';
+import {SearchFormComponent} from './common/searchForm.component';
+
+import {SearchResultComponent} from './common/searchResult.component';
+import {SearchFilterComponent} from './common/searchFilter.component';
+import {AdvancedSearchFormComponent} from './common/advancedSearchForm.component';
+import { SearchPublicationsComponent } from './searchPublications.component';
+import { AdvancedSearchPublicationsComponent } from './advancedSearchPublications.component';
+
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    SharedComponentsModule
+  ],
+  declarations: [
+
+    AdvancedSearchPageComponent,
+    SearchAllComponent,
+    SearchPageComponent,
+    SearchFormComponent,
+    SearchResultComponent,
+    SearchFilterComponent,
+    AdvancedSearchFormComponent,
+    SearchPublicationsComponent,
+    AdvancedSearchPublicationsComponent
+
+
+  ],
+  providers:[
+    // SearchPublicationsService
+  ],
+  exports: [
+      SearchAllComponent,
+      AdvancedSearchPublicationsComponent,
+      SearchPublicationsComponent
+
+
+    ]
+})
+export class SearchModule { }

portal-2/src/app/searchPages/searchPublications.component.ts

@@ -0,0 +1,205 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+
+import { Filter, Value} from './common/searchHelperClasses.class';
+
+import {SearchPublicationsService} from '../services/searchPublications.service';
+import {SearchResult}     from '../entities/searchResult';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Component({
+    selector: 'search-publications',
+    template: `
+    <search-page pageTitle="Search Publications" type="publication" [(filters)] = "filters"
+                 [(results)] = "results" [(totalResults)] = "totalResults" [(keyword)] = "keyword"
+                 [(page)] = "page" [(size)] = "size" (queryChange)="queryChanged($event)"  >
+    </search-page>
+
+    `
+
+})
+export class SearchPublicationsComponent {
+  private results =[];
+  private filters =[];
+  private totalResults:number  = 0 ;
+  private keyword = '';
+  private page :number = 1;
+  private size :number = 1;
+
+  constructor (private route: ActivatedRoute, private _searchPublicationsService: SearchPublicationsService ) {
+      //console.info("xaadasdafaf"+SearchPublicationsComponent.filters.length);
+
+    this.results =[];
+    this.filters =[];
+    //SearchPublicationsComponent.filters = [];
+    this.totalResults = 123;
+    for(var i=0; i<15 ; i++){
+        //var result = {title: "title"+i, id: "id"+i}
+        var result: SearchResult = new SearchResult();
+
+        result['title'] = {"name": "title"+i, "url": OpenaireProperties.getsearchLinkToPublication()+i, "accessMode": ""};
+
+        result['authors'] = new Array<{"name": string, "url": string}>();
+        for(let j=0; j<=i+1; j++) {
+            result['authors'][j] = {"name": "author"+j+":"+i, "url": OpenaireProperties.getsearchLinkToPerson()+i};
+        }
+
+        result.year = "0000"
+
+        result.description = "This is a description for publication "+i;
+
+        result['projects'] = {"name": "EC | EPLANET (246806)", "url": "https://beta.openaire.eu/index.php?option=com_openaire&view=project&projectId=corda_______::9352bcbec0b5882278a21fdc0e83078c"};
+
+        this.results.push(result);
+    }
+
+    for(var i=0; i<5 ; i++){
+         var  values = [];
+         for(var j=0; j<10 ; j++){
+           var value:Value = {name: "name"+j, id: "filter_"+i+ "_id_"+j, number:j, selected:false}
+           values.push(value);
+         }
+         values.sort((n2,n1) => {
+            if (n1.number > n2.number) {
+                return 1;
+            }
+
+            if (n1.number < n2.number) {
+                return -1;
+            }
+
+            return 0;
+        });
+        var filter:Filter = {title: "title"+i, filterId: "filter_"+i, originalFilterId: "filter_"+i, values : values, countSelectedValues:0, "filterOperator": 'and'}
+        if(i==0) {
+            var  values = [];
+            for(var j=0; j<10 ; j++){
+              var value:Value = {name: "MYname"+j, id: "MYfilter_"+i+ "_id_"+j, number:j, selected:false}
+              values.push(value);
+            }
+            values.sort((n2,n1) => {
+               if (n1.number > n2.number) {
+                   return 1;
+               }
+
+               if (n1.number < n2.number) {
+                   return -1;
+               }
+
+               return 0;
+            });
+            var filter1:Filter = {title: "MYtitle"+i, filterId: "MYfilter_"+i, originalFilterId: "MYfilter_"+i, values : values, countSelectedValues:0, "filterOperator": 'or'}
+            this.filters.push(filter1);
+        }
+
+/*console.info(location.search);
+        if(location.search != "") {
+            let urlParams = location.search.slice(1).split("&");
+            console.info(urlParams);
+            for(let urlParam of urlParams) {
+                console.info(urlParam);
+                let filtId = urlParam.split("=")[0];
+                let values = urlParam.split("=")[1].split(",");
+                if(filter.filterId == filtId) {
+                    for(let value of values) {
+                        for(let filterValue of filter.values) {
+                            if(filterValue.id == value) {
+                                filterValue.selected = true;
+                                filter.countSelectedValues++;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+*/
+        this.sub =  this.route.queryParams.subscribe(params => {
+            console.info(params);
+            if(params[filter.filterId] != undefined) {
+                let values = params[filter.filterId].split(",");
+                for(let value of values) {
+                    for(let filterValue of filter.values) {
+                        if(filterValue.id == value) {
+                            filterValue.selected = true;
+                            filter.countSelectedValues++;
+                        }
+                    }
+                }
+            }
+
+        });
+
+        this.filters.push(filter);
+
+    }
+
+
+  }
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(params => {
+      let page = (params['page']=== undefined)?1:+params['page'];
+      let size = (params['size']=== undefined)?10:+params['size'];
+      this.page = ( page <= 0 ) ? 1 : page;
+      this.size = ( size <= 0 ) ? 10 : size;
+      this.keyword = (params['keyword']?params['keyword']:'');
+
+    });
+    // this.sub = this.route.params.subscribe(params => {
+    //   let page = (params['page']=== undefined)?1:+params['page'];
+    //   let size = (params['size']=== undefined)?10:+params['size'];
+    //   this.page = ( page <= 0 ) ? 1 : page;
+    //   // this.size = ( size <= 0 ) ? 10 : size;
+    //   this.keyword = (params['keyword']?params['keyword']:'');
+    // });
+
+    //TODO get the rest parameters to create query
+
+
+    /*this._searchPublicationsService.searchPublications().subscribe(
+                data => {
+                    console.info(data);
+                },
+                err => {
+                    console.error(err);
+                    console.info("error");
+                }
+            );*/
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  getResults(parameters:string){
+    //http://rudie.di.uoa.gr:8080/dnet-functionality-services-1.2.0-SNAPSHOT/search?action=searchNrefine&sTransformer=results_openaire&rTransformer=results_openaire_browse&query=%28oaftype+exact+result%29+and+%28resulttypeid+exact+publication%29&page=5&size=10&fields=instancetypenameid&fields=resultlanguageid&fields=relfunderid&fields=relprojectid&fields=resultacceptanceyear&fields=resultbestlicense&fields=resulthostingdatasourceid&fields=communityid&locale=en_GB
+    console.info("getResults: Execute search query "+parameters);
+    // this.results =[];
+    // this.filters =[];
+    // for(var i=0; i<30 ; i++){
+    //     var result = {title: "title"+i, id: "id"+i}
+    //     this.results.push(result);
+    // }
+    //
+    // for(var i=0; i<5 ; i++){
+    //      var  values = [];
+    //      for(var j=0; j<10 ; j++){
+    //        var value = {name: "name"+j, id: "id"+j, number:j, selected:false}
+    //        values.push(value);
+    //      }
+    //     var filter = {title: "title"+i, filterId: "id"+i, values : values}
+    //     this.filters.push(filter);
+    // }
+
+  }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  private queryChanged($event) {
+    var parameters = $event.value;
+    this.getResults(parameters);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}

portal-2/src/app/services/claims.service.ts

@@ -0,0 +1,131 @@
+import {Injectable} from '@angular/core';
+import {Jsonp, URLSearchParams,ResponseOptions, RequestOptions, Headers} from '@angular/http';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {Claim}           from '../entities/claim';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Injectable()
+export class ClaimsService {
+  private baseUrl;
+  constructor(private jsonp: Jsonp, private http: Http) {
+    this.baseUrl = OpenaireProperties.getClaimsAPIURL();
+  }
+
+  private getClaimRequest(size : number, page : number, url :string):any {
+    console.info('ClaimsService: Claims request: '+url);
+      return this.http.get( url)
+                    .map(request => <any> request.json())
+                    .do(request => console.info("Get claims: offset = "+(size*(page-1)) + " limit ="+size ))
+                    .catch(this.handleError);
+  }
+  getClaims( size : number, page : number, keyword:string, sortby: string, descending: boolean, types: string):any {
+    console.info('ClaimsService: getClaims     ' );
+    console.info('ClaimsService: Types : '+types );
+    let url = this.baseUrl +"claims"+"?offset="+(size*(page-1) + "&limit="+size)+"&keyword="+keyword+"&sortby="+sortby+"&descending="+descending+""+types;
+     return this.getClaimRequest(size,page,url);
+
+  }
+  getClaimsByUser( size : number, page : number, user:string, keyword:string, sortby: string, descending: boolean, types: string):any {
+    console.info('ClaimsService: getClaims for user : '+user);
+    let url = this.baseUrl +"users/"+user+"/claims"+"?offset="+(size*(page-1) + "&limit="+size)+"&keyword="+keyword+"&sortby="+sortby+"&descending="+descending+""+types;
+     return this.getClaimRequest(size,page,url);
+
+  }
+  getClaimsBycontext( size : number, page : number, contextId:string, keyword:string, sortby: string, descending: boolean, types: string):any {
+    console.info('ClaimsService: getClaims for context : '+contextId);
+    let url = this.baseUrl +"contexts/"+contextId+"/claims"+"?offset="+(size*(page-1) + "&limit="+size)+"&keyword="+keyword+"&sortby="+sortby+"&descending="+descending+""+types;
+     return this.getClaimRequest(size,page,url);
+
+  }
+  getClaimsByResult( size : number, page : number, resultId:string, keyword:string, sortby: string, descending: boolean, types: string):any {
+    console.info('ClaimsService: getClaims for result : '+resultId);
+    let url = this.baseUrl +"results/"+resultId+"/claims"+"?offset="+(size*(page-1) + "&limit="+size)+"&keyword="+keyword+"&sortby="+sortby+"&descending="+descending+""+types;
+     return this.getClaimRequest(size,page,url);
+
+  }
+  getClaimsByProject( size : number, page : number, projectId:string, keyword:string, sortby: string, descending: boolean, types: string):any {
+    console.info('ClaimsService: getClaims for project : '+projectId);
+    let url = this.baseUrl +"projects/"+projectId+"/claims"+"?offset="+(size*(page-1) + "&limit="+size)+"&keyword="+keyword+"&sortby="+sortby+"&descending="+descending+""+types;
+     return this.getClaimRequest(size,page,url);
+  }
+
+  deleteClaimById(claimId:string):any{
+    console.warn('Trying to delete claim with id : '+claimId);
+    let url = this.baseUrl +"claims/"+claimId;
+    console.warn('Delete url: '+url);
+    let headers = new Headers({ 'Content-Type': 'application/json' });
+    let options = new RequestOptions({ headers: headers });
+      return this.http.delete( url, options).map(request => <any> request.json())
+      .do(request => console.info("After delete" ))
+      .catch(this.handleError);
+
+  }
+  deleteBulk(claimIds:string[]):any{
+
+    console.warn('Trying to delete claims with ids : '+claimIds);
+     var url = "";
+
+    for(var claimId of claimIds){
+      url=url+(url.length >0 ?"&":"")+"claimId="+claimId;
+    }
+    url= this.baseUrl +"claims/bulk?"+url;
+    console.warn('Delete url: '+url);
+    let headers = new Headers({ 'Content-Type': 'application/json' });
+    let options = new RequestOptions({ headers: headers });
+      return this.http.delete( url, options).map(request => <any> request.json())
+      .do(request => console.info("After delete" ))
+      .catch(this.handleError);
+
+  }
+  insertBulkClaims(claims):any{
+    console.warn('Trying toinsert claims  : '+claims);
+    let url = this.baseUrl +"claims/bulk";
+    let body = JSON.stringify( claims );
+    console.warn('Json body:  : '+body);
+    let headers = new Headers({ 'Content-Type': 'application/json' });
+    let options = new RequestOptions({ headers: headers });
+    return this.http.post(url, body, options)
+                          .map(res => res.json())
+                          .do(request => console.info("Insert Response:"+request.status) )
+                          .catch(this.handleError);
+
+    }
+  insertClaim(claim):any{
+    console.warn('Trying toinsert claim  : '+claim);
+   let url = this.baseUrl +"claims";
+          let body = JSON.stringify( claim );
+          let headers = new Headers({ 'Content-Type': 'application/json' });
+          let options = new RequestOptions({ headers: headers });
+          return this.http.post(url, body, options)
+                          .map(res => res.json())
+                          .do(request => console.info("Insert Response:"+request.status) )
+                          .catch(this.handleError);
+
+    }
+
+  private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+    console.error(error);
+    return Observable.throw(error  || 'Server error');
+  }
+
+  getClaim(id:string):any {
+  let url = this.baseUrl+"claims/"+id;
+      return new Promise((resolve, reject) => {
+        this.http.get(url)
+          .map(res => res.json())
+          .subscribe(
+            data => {
+              resolve(data.data);
+            },
+            err => {
+              reject(err);
+            }
+          )
+        ;
+      });
+      }
+
+}

portal-2/src/app/services/contexts.service.ts

@@ -0,0 +1,46 @@
+import {Injectable} from '@angular/core';
+import {Jsonp, URLSearchParams,ResponseOptions} from '@angular/http';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {Claim}           from '../entities/claim';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Injectable()
+export class ContextsService {
+  private baseUrl;
+  constructor(private http: Http) {
+    this.baseUrl = OpenaireProperties.getClaimsAPIURL();
+  }
+
+  public getCommunities():any {
+  let  url   = this.baseUrl + 'communities';
+    console.info('ContextsService: request communities  '+url);
+      return this.http.get( url)
+                    .map(request => <any> request.json().data)
+                    .do(request => console.info("Get claims: offset = "))
+                    .catch(this.handleError);
+  }
+  public getCategories(communityId :string):any {
+    console.info('ContextsService:  request categories for community  with id '+communityId);
+    let url= this.baseUrl  + 'communities/' + communityId + '/categories';
+      return this.http.get( url)
+                    .map(request => <any> request.json().data)
+                    .do(request => console.info("Get claims: offset = " ))
+                    .catch(this.handleError);
+  }
+  public getConcepts(categoryId :string, keyword: string):any {
+    console.info('ContextsService:  request concept for category  with id '+categoryId + ' and keyword '+ keyword);
+    let url= this.baseUrl  + 'categories/' + categoryId+ "/concepts";
+      return this.http.get( url)
+                    .map(request => <any> request.json().data)
+                    .do(request => console.info("Get claims: offset = " ))
+                    .catch(this.handleError);
+  }
+
+  private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+    console.error(error);
+    return Observable.throw(error  || 'Server error');
+  }
+}

portal-2/src/app/services/dataset.service.ts

@@ -0,0 +1,563 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {DatasetInfo} from '../entities/datasetInfo';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Injectable()
+export class DatasetService {
+
+    constructor(private http: Http) {}
+
+    datasetInfo: DatasetInfo;
+
+    getDatasetInfo (id: string):any {
+        console.info("getDatasetInfo in service");
+
+        let url = OpenaireProperties.getSearchAPIURL()+'datasets/'+id;
+
+
+        return this.http.get(url)
+                    .map(res => <any> res.json())
+                    .do(res => console.info(res['result']['metadata']['oaf:entity']))
+                    .map(res => res['result']['metadata']['oaf:entity']['oaf:result'])
+                    .map(res => [res,
+                                 res['title'],
+                                 res['rels']['rel'],
+                                 res['children'],
+                                 res['pid'],
+                                 res['subject'],
+                                 res['bestlicense'],
+                                 res['collectedfrom'],
+                                 res['context'],
+                                 res['resulttype']
+                    ])
+                    .map(res => this.parseDatasetInfo(res));
+
+    }
+
+    private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parseDatasetInfo (data: any):any {
+        this.datasetInfo = new DatasetInfo();
+
+        if(data[0] != null) {
+            this.datasetInfo.date = data[0].dateofacceptance.substring(0,4);
+            this.datasetInfo.publisher = data[0].publisher;
+            if(!Array.isArray(data[0].description)) {
+                this.datasetInfo.description = data[0].description;
+            } else {
+                this.datasetInfo.description = data[0].description[0];
+            }
+            this.datasetInfo.embargoEndDate = data[0].embargoenddate;
+        }
+
+        if(data[1] != null) {
+            this.datasetInfo.title = {"name": "", "url": "", "accessMode": ""};
+            if(Array.isArray(data[1])) {
+                this.datasetInfo.title['name'] = data[1][0].content;
+            } else {
+                this.datasetInfo.title['name'] = data[1].content;
+            }
+        }
+
+        if(data[2] != null) {
+            let mydata;
+            let counter = 0;
+            let length = data[2].length!=undefined ? data[2].length : 1;
+
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[2][i] : data[2];
+                if(mydata.hasOwnProperty("to")) {
+                    if(mydata['to'].class == "hasAuthor") {
+                        if(this.datasetInfo.authors == undefined) {
+                            this.datasetInfo.authors = new Array<{"name": string, "url": string}>();
+                        }
+
+                        this.datasetInfo.authors[mydata.ranking-1] = {"name": "", "url": ""};
+                        this.datasetInfo.authors[mydata.ranking-1]['name'] = mydata.fullname;
+                        this.datasetInfo.authors[mydata.ranking-1]['url'] = OpenaireProperties.getsearchLinkToPerson()+mydata['to'].content;
+                    } else if(mydata['to'].class == "isProducedBy") {
+                        if(this.datasetInfo.fundedByProjects == undefined) {
+                            this.datasetInfo.fundedByProjects = new Array<
+                                { "url": string, "acronym": string, "title": string,
+                                  "funderShortname": string, "funderName": string,
+                                  "funding": string, "inline": boolean
+                                }>();
+                        }
+
+                        counter = this.datasetInfo.fundedByProjects.length;
+
+                        this.datasetInfo.fundedByProjects[counter] = {
+                            "url": "", "acronym": "", "title": "",
+                            "funderShortname": "", "funderName": "",
+                            "funding": "", "inline": false
+                        }
+
+                        this.datasetInfo.fundedByProjects[counter]['url'] =
+                            OpenaireProperties.getsearchLinkToProject()+mydata['to'].content;
+                        this.datasetInfo.fundedByProjects[counter]['acronym'] = mydata.acronym;
+                        this.datasetInfo.fundedByProjects[counter]['title'] = mydata.title;
+
+                        if(mydata.hasOwnProperty("funding")) {
+                            let length1 = Array.isArray(mydata['funding']) ? mydata['funding'].length : 1;
+
+                            for(let j=0; j<length1; j++) {
+                                let funding;
+                                let mydata1 = length1 > 1 ? mydata['funding'][j] : mydata['funding'];
+
+                                if(mydata1.hasOwnProperty("funder")) {
+                                    this.datasetInfo.fundedByProjects[counter]['funderShortname'] = mydata1['funder'].shortname;
+                                    this.datasetInfo.fundedByProjects[counter]['funderName'] = mydata1['funder'].name;
+                                }
+
+                                if(mydata1.hasOwnProperty("funding_level_2")) {
+                                    funding = mydata1['funding_level_2'].content;
+                                } else if(mydata1.hasOwnProperty("funding_level_1")) {
+                                    funding = mydata1['funding_level_1'].content;
+                                } else if(mydata1.hasOwnProperty("funding_level_0")) {
+                                    funding = mydata1['funding_level_0'].content;
+                                }
+
+                                if(funding != undefined) {
+                                    funding = funding.split("::");
+
+                                    if(this.datasetInfo.fundedByProjects[counter]['funding'] != "") {
+                                        this.datasetInfo.fundedByProjects[counter]['funding'] += ", "+funding[1];
+                                    } else {
+                                        this.datasetInfo.fundedByProjects[counter]['funding'] = funding[1];
+                                    }
+                                    for(let i=2; i<funding.length; i++) {
+                                        this.datasetInfo.fundedByProjects[counter]['funding'] += " | " + funding[i];
+                                    }
+                                }
+                            }
+                        }
+                    } else if(mydata['to'].class == "hasAmongTopNSimilarDocuments") {
+                        if(this.datasetInfo.similarResearchResults == undefined) {
+                            this.datasetInfo.similarResearchResults = new Array<{
+                                "name": string, "url": string, "date": string,
+                                "trust": string, "class": string}>();
+                        }
+
+                        counter = this.datasetInfo.similarResearchResults.length;
+                        this.datasetInfo.similarResearchResults[counter] = {"name": "", "url": "", "date": "", "trust": "", "class": ""}
+
+                        let url;
+                        if(mydata['resulttype'].classname == "publication") {
+                            url = OpenaireProperties.getsearchLinkToPublication()+mydata['to'].content;
+                            this.datasetInfo.similarResearchResults[counter]['class'] = "publication";
+                        } else {
+                            url = OpenaireProperties.getsearchLinkToDataset()+mydata['to'].content;
+                            this.datasetInfo.similarResearchResults[counter]['class'] = "dataset";
+                        }
+
+                        this.datasetInfo.similarResearchResults[counter]['url'] = url;
+                        this.datasetInfo.similarResearchResults[counter]['name'] = mydata['title'].content;
+                        this.datasetInfo.similarResearchResults[counter]['date'] = mydata.dateofacceptance.substring(0,4);;
+                        this.datasetInfo.similarResearchResults[counter]['trust'] = Math.round(mydata.trust*100)+"%";
+
+
+                    } else if(mydata['to'].class == "isRelatedTo") {
+                        if(this.datasetInfo.relatedResearchResults == undefined) {
+                            this.datasetInfo.relatedResearchResults = new Array<{
+                                "name": string, "url": string, "date": string,
+                                "trust": string, "class": string}>();
+                        }
+
+                        counter = this.datasetInfo.relatedResearchResults.length;
+                        this.datasetInfo.relatedResearchResults[counter] = {"name": "", "url": "", "date": "", "trust": "", "class": ""}
+
+                        let url;
+                        if(mydata['resulttype'].classname == "publication") {
+                            url = OpenaireProperties.getsearchLinkToPublication()+mydata['to'].content;
+                            this.datasetInfo.relatedResearchResults[counter]['class'] = "publication";
+                        } else {
+                            url = OpenaireProperties.getsearchLinkToDataset()+mydata['to'].content;
+                            this.datasetInfo.relatedResearchResults[counter]['class'] = "dataset";
+                        }
+
+                        this.datasetInfo.relatedResearchResults[counter]['url'] = url;
+                        this.datasetInfo.relatedResearchResults[counter]['name'] = mydata['title'].content;
+                        this.datasetInfo.relatedResearchResults[counter]['date'] = mydata.dateofacceptance.substring(0,4);;
+                        this.datasetInfo.relatedResearchResults[counter]['trust'] = Math.round(mydata.trust*100)+"%";
+
+                    }
+                }
+            }
+
+            this.datasetInfo.authors = this.datasetInfo.authors.filter(function (item) {
+                return (item != undefined);
+            });
+        }
+
+        if(data[3] != null) {
+            if(data[3].hasOwnProperty("instance")) {
+                this.datasetInfo.downloadFrom = new Map<string, {"url": string[], "accessMode": string[]}>();
+                this.datasetInfo.publishedIn = new Map<string, {"url": string[], "accessMode": string[]}>()
+
+                let length = data[3]['instance'].length!=undefined ? data[3]['instance'].length : 1;
+
+                let counter = 0;
+                let counter1 = 0;
+                let counter2 = 0;
+                let mydata;
+                for(let i=0; i<length; i++) {
+                    mydata = length > 1 ? data[3]['instance'][i] : data[3]['instance'];
+
+                    if(this.datasetInfo.type == undefined) {
+                        if(mydata.hasOwnProperty("instancetype")) {
+                            if(mydata['instancetype'].classname != null
+                                && mydata['instancetype'].classname != ""
+                                && mydata['instancetype'].classname != "Unknown"){
+                                this.datasetInfo.type = mydata['instancetype'].classname;
+                            }
+                        }
+                    }
+
+                    if(mydata.hasOwnProperty("webresource")) {
+                        let url;
+                        if(mydata['webresource'].length == undefined) {
+                            url = mydata['webresource'].url;
+                        } else{
+                            url = mydata['webresource'][0].url;
+                        }
+
+                        if(!this.datasetInfo.downloadFrom.has(url) && mydata.hasOwnProperty("hostedby")) {
+                            if(mydata['hostedby'].name != "other resources" && mydata['hostedby'].name != "Unknown Repository") {
+                                if(!this.datasetInfo.downloadFrom.has(mydata['hostedby'].name)) {
+                                    this.datasetInfo.downloadFrom.set(mydata['hostedby'].name, {"url": null, "accessMode": null});
+                                }
+
+                                if(this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['url'] == null) {
+                                    this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['url'] = new Array<string>();
+                                }
+
+                                counter2 = this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['url'].length;
+                                this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['url'][counter2] = url;
+
+                                if(this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'] == null) {
+                                    this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'] = new Array<string>();
+                                }
+
+                                if(mydata.hasOwnProperty("licence")) {
+                                    this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'][counter2] = mydata['licence'].classid;
+                                } else {
+                                    this.datasetInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'][counter2] = "";
+                                }
+                            } else {
+                                if(data[0] != null && data[0].hasOwnProperty("source")) {
+                                    let key: string;
+                                    if(Array.isArray(data[0].source)) {
+                                        if(!this.datasetInfo.publishedIn.has(data[0]['source'][counter1])) {
+                                            key = data[0]['source'][counter1];
+                                        }
+                                    } else {
+                                        if(!this.datasetInfo.publishedIn.has(data[0]['source'])) {
+                                            key = data[0]['source'];
+                                        }
+                                    }
+
+                                    this.datasetInfo.publishedIn.set(key, {"url": null, "accessMode": null});
+
+                                    if(this.datasetInfo.publishedIn.get(key)['url'] == null) {
+                                        this.datasetInfo.publishedIn.get(key)['url'] = new Array<string>();
+                                    }
+
+                                    counter2 = this.datasetInfo.publishedIn.get(key)['url'].length;
+                                    this.datasetInfo.publishedIn.get(key)['url'][counter2] = url;
+
+                                    if(this.datasetInfo.publishedIn.get(key)['accessMode'] == null) {
+                                        this.datasetInfo.publishedIn.get(key)['accessMode'] = new Array<string>();
+                                    }
+
+                                    if(mydata.hasOwnProperty("licence")) {
+                                        this.datasetInfo.publishedIn.get(key)['accessMode'][counter2] = mydata['licence'].classid;
+                                    } else {
+                                        this.datasetInfo.publishedIn.get(key)['accessMode'][counter2] = "";
+                                    }
+                                    counter1++;
+                                }
+                            }
+                            if(this.datasetInfo.title != undefined) {
+                                if(this.datasetInfo.title['url'] == undefined) {
+                                    this.datasetInfo.title['url'] = url;
+                                }
+
+                                switch (this.datasetInfo.title['licence']) {
+                                    case undefined:
+                                        this.datasetInfo.title['licence'] = mydata['licence'].classid;
+                                        this.datasetInfo.title['url'] = url;
+                                        break;
+                                    case "CLOSED":
+                                        if(mydata['licence'].classid == "OPEN" ||
+                                            mydata['licence'].classid == "EMBARGO" ||
+                                            mydata['licence'].classid == "RESTRICTED") {
+                                                this.datasetInfo.title['licence'] = mydata['licence'].classid;
+                                                this.datasetInfo.title['url'] = url;
+                                        }
+                                        break;
+                                    case "RESTRICTED":
+                                        if(mydata['licence'].classid == "OPEN" ||
+                                            mydata['licence'].classid == "EMBARGO") {
+                                                this.datasetInfo.title['licence'] = mydata['licence'].classid;
+                                                this.datasetInfo.title['url'] = url;
+                                        }
+                                        break;
+                                    case "EMBARGO":
+                                        if(mydata['licence'].classid == "OPEN") {
+                                                this.datasetInfo.title['licence'] = mydata['licence'].classid;
+                                                this.datasetInfo.title['url'] = url;
+                                        }
+                                        break;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+
+        if(data[4] != null) {
+            let counter = 0;
+            this.datasetInfo.identifiers = new Map<string, string[]>();
+
+            if(data[4].hasOwnProperty("classname") && data[4]['classname'] != "") {
+                if(data[4].classname == "doi" || data[4].classname == "pmc") {
+                    if(!this.datasetInfo.identifiers.has(data[4].classname)) {
+                        this.datasetInfo.identifiers.set(data[4].classname, new Array<string>());
+                    }
+                    counter = this.datasetInfo.identifiers.get(data[4].classname).length;
+                    this.datasetInfo.identifiers.get(data[4].classname)[counter] = data[4].content;
+                }
+            } else {
+                for(let i=0; i<data[4].length; i++) {
+                    if(data[4][i].classname == "doi" || data[4][i].classname == "pmc") {
+                        if(!this.datasetInfo.identifiers.has(data[4][i].classname)) {
+                            this.datasetInfo.identifiers.set(data[4][i].classname, new Array<string>());
+                        }
+                        counter = this.datasetInfo.identifiers.get(data[4][i].classname).length;
+                        this.datasetInfo.identifiers.get(data[4][i].classname)[counter] = data[4][i].content;
+                    }
+                }
+            }
+        }
+
+        if(data[5] != null) {
+            this.datasetInfo.classifiedSubjects = new Map<string, string[]>();
+            this.datasetInfo.subjects = new Array<string>();
+
+            let mydata;
+            let length = data[5].length!=undefined ? data[5].length : 1;
+
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[5][i] : data[5];
+
+                if(mydata.classid != "") {
+                    if(mydata.inferred == true) {
+                        if(!this.datasetInfo.classifiedSubjects.has(mydata.classid)) {
+                            this.datasetInfo.classifiedSubjects.set(mydata.classid, new Array<string>());
+                        }
+
+                        let counter = this.datasetInfo.classifiedSubjects.get(mydata.classid).length;
+                        this.datasetInfo.classifiedSubjects.get(mydata.classid)[counter] = mydata.content;
+                    } else {
+                        let counter = this.datasetInfo.subjects.length;
+                        this.datasetInfo.subjects[counter] = mydata.content;
+                    }
+                }
+            }
+        }
+
+        if(data[6] != null) {
+            this.datasetInfo.bestlicense = data[6].classid;
+        }
+
+        if(data[7] != null) {
+            this.datasetInfo.collectedFrom = new Array<{"name": string, "url": string}>();
+
+            let mydata;
+            let length = data[7].length!=undefined ? data[7].length : 1;
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[7][i] : data[7];
+                let link = OpenaireProperties.getsearchLinkToDataProvider();
+                this.datasetInfo.collectedFrom[i] = {"name": "", "url": ""};
+                this.datasetInfo.collectedFrom[i]['name'] = mydata.name;
+                this.datasetInfo.collectedFrom[i]['url'] = link+mydata.id;
+            }
+        }
+
+        if(this.datasetInfo.publisher != null
+            && this.datasetInfo.identifiers != null
+            && this.datasetInfo.identifiers.has("doi")) {
+
+            if( this.datasetInfo.downloadFrom == null) {
+                this.datasetInfo.downloadFrom = new Map<string,{"url": string[], "accessMode": string[]}>();
+            }
+
+            this.datasetInfo.downloadFrom.set(this.datasetInfo.publisher, {"url": null, "accessMode": null});
+
+            let url = OpenaireProperties.getDoiURL()+this.datasetInfo.identifiers.get("doi");
+            this.datasetInfo.downloadFrom.get(this.datasetInfo.publisher)['url'] = new Array<string>();
+            this.datasetInfo.downloadFrom.get(this.datasetInfo.publisher)['accessMode'] = new Array<string>();
+
+            this.datasetInfo.downloadFrom.get(this.datasetInfo.publisher)['url'][0] = url;
+            this.datasetInfo.downloadFrom.get(this.datasetInfo.publisher)['accessMode'][0] = "";
+
+            if(this.datasetInfo.title != undefined && this.datasetInfo.title['url'] == "") {
+                this.datasetInfo.title['url'] = url;
+            }
+        }
+
+        if(data[8] != null) {
+            this.datasetInfo.contexts = new Array<
+                { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}>();
+
+            let position = 0;
+            let labels = "";
+            let mydata;
+            let length = data[8].length!=undefined ? data[8].length : 1;
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[8][i] : data[8];
+
+                if(mydata.hasOwnProperty("type") && mydata['type'] == "community") {
+                    if(mydata.hasOwnProperty("category")) {
+                        if(mydata['category'].hasOwnProperty("concept")) {
+                            let mydata1;
+                            let length1 = mydata['category']['concept'].length!=undefined ? mydata['category']['concept'].length : 1;
+                            for(let j=0; j<length1; j++) {
+                                mydata1 = length1 > 1 ? mydata['category']['concept'][j] : mydata['category']['concept'];
+
+                                this.datasetInfo.contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false};
+                                this.datasetInfo.contexts[position]['labelContext'] = mydata.label;
+                                this.datasetInfo.contexts[position]['labelCategory'] = mydata['category'].label;;
+                                this.datasetInfo.contexts[position]['labelConcept'] = mydata1.label;
+
+                                position++;
+                            }
+                        } else {
+                            this.datasetInfo.contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false};
+                            this.datasetInfo.contexts[position]['labelContext'] = mydata.label;
+                            this.datasetInfo.contexts[position]['labelCategory'] = mydata['category'].label;;
+                            this.datasetInfo.contexts[position]['labelConcept'] = null;
+                        }
+                    } else {
+                        this.datasetInfo.contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false};
+                        this.datasetInfo.contexts[position]['labelContext'] = mydata.label;
+                        this.datasetInfo.contexts[position]['labelCategory'] = null;
+                        this.datasetInfo.contexts[position]['labelConcept'] = null;
+                    }
+                }
+            }
+        }
+
+        if(data[9] != null && this.datasetInfo.type == undefined) {
+            if(data[9].hasOwnProperty('classname')) {
+                this.datasetInfo.type = data[9].classname;
+            }
+        }
+
+
+        //this.printdatasetInfo();
+        return this.datasetInfo;
+
+    }
+
+    printDatasetInfo() {
+        console.info("DATE: "+this.datasetInfo.date);
+        console.info("PUBLISHER: "+this.datasetInfo.publisher);
+        console.info("DESCRIPTION: "+this.datasetInfo.description);
+
+        console.info("TITLE: "+this.datasetInfo.title);
+
+        console.info("AUTHORS: "+this.datasetInfo.authors);
+        console.info("\nFUNDED BY PROJECTS:");
+        if(this.datasetInfo.fundedByProjects != undefined) {
+            this.datasetInfo.fundedByProjects.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+/*
+        console.info("\nRELATED RESEARCH DATA:");
+        if(this.datasetInfo.relatedResearchData != undefined) {
+            this.datasetInfo.relatedResearchData.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("\nSIMILAR datasetS:");
+        if(this.datasetInfo.similarPublications != undefined) {
+            this.datasetInfo.similarPublications.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+*/
+        console.info("TYPE: "+this.datasetInfo.type);
+        console.info("\nDOWNLOAD FROM:");
+        if(this.datasetInfo.downloadFrom != undefined) {
+            this.datasetInfo.downloadFrom.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("\nIDENTIFIERS:");
+        if(this.datasetInfo.identifiers != undefined) {
+            this.datasetInfo.identifiers.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("SUBJECTS: "+this.datasetInfo.subjects);
+        console.info("\nCLASSIFIED OBJECTS:");
+        if(this.datasetInfo.classifiedSubjects != undefined) {
+            this.datasetInfo.classifiedSubjects.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("BEST LICENSE: "+this.datasetInfo.bestlicense);
+
+        console.info("\nCOLLECTED FROM:");
+        if(this.datasetInfo.collectedFrom != undefined) {
+            this.datasetInfo.collectedFrom.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("\nDOWNLOAD FROM:");
+        if(this.datasetInfo.downloadFrom != undefined) {
+            this.datasetInfo.downloadFrom.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+    }
+}

portal-2/src/app/services/openaireProjects.service.ts

@@ -0,0 +1,69 @@
+
+
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Injectable()
+export class OpenaireProjectsService {
+  private searchUrl;
+  constructor( private http: Http) {
+    this.searchUrl = OpenaireProperties.getSearchServiceURL();
+
+  }
+  getFunders():any {
+     let url = this.searchUrl+'search?action=refine&rTransformer=results_openaire_browse&fields=funderid&query=%28oaftype+exact+project%29&locale=en_GB&format=json';
+     return this.http.get( url)
+                     .map(request => <any> request.json().response.browseResults.result)
+                     .do(funders => console.log("getFunders : "+funders))
+                     .catch(this.handleError);
+
+    }
+
+    searchForProjects(keyword:string, funderId:string):any {
+       let url = this.searchUrl+'search?action=search&sTransformer=projects_openaire&query='+
+       '%28oaftype+exact+project%29+and+%28%28projecttitle+%3D+%22'+keyword+'%22%29+or+%28projectacronym+%3D+%22'+keyword+'%22%29+or+%28projectcode+%3D+%22'+keyword+'%22%29%29+and+%28funderid+exact+'+funderId+'%29&size=10&locale=en_GB&format=json';
+       return this.http.get( url)
+                       .map(request => <any> (request.json().response.results)?request.json().response.results.result:request.json().response.results)
+                       .do(funders => console.log("getFunders : "+funders))
+                       .catch(this.handleError);
+
+      }
+      searchForProjectsObs(keyword:string, funderId:string):any {
+         let url = this.searchUrl+'search?action=search&sTransformer=projects_openaire&query='+
+         '%28oaftype+exact+project%29+and+%28%28projecttitle+%3D+%22'+keyword+'%22%29+or+%28projectacronym+%3D+%22'+keyword+'%22%29+or+%28projectcode+%3D+%22'+keyword+'%22%29%29+and+%28funderid+exact+'+funderId+'%29&size=10&locale=en_GB&format=json';
+         return this.http.get(url).toPromise()
+                    .then(request =>{
+
+              var valid:boolean= this.isJsonString(request);
+              if(valid==true){
+                return (request.json().response.results)?request.json().response.results.result:request.json().response.result;
+              }else{
+                return [];
+              }
+          })
+        }
+
+  private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+    console.error(error);
+    return Observable.throw(error  || 'Server error');
+  }
+  private isJsonString(str) {
+    console.info("Check jsooon");
+    if(str instanceof Array || str instanceof Object) {
+      try {
+          str.json();
+      } catch (e) {
+          console.info("INValid");
+          return false;
+      }
+      console.info("valid");
+      return true
+    }
+    console.info("INValid");
+    return false
+  }
+}

portal-2/src/app/services/organization.service.ts

@@ -0,0 +1,145 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OrganizationInfo} from '../entities/organizationInfo';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Injectable()
+export class OrganizationService {
+
+    constructor(private http: Http) {}
+
+    organizationInfo: OrganizationInfo;
+
+    getOrganizationInfo (id: string):any {
+        console.info("getOrganizationInfo in service");
+
+        let url = OpenaireProperties.getSearchAPIURL()+'organisations/'+id;
+
+        return this.http.get(url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res['result']['metadata']['oaf:entity']))
+                    .map(res => res['result']['metadata']['oaf:entity']['oaf:organization'])
+                    .map(res => [res, res['rels']['rel']])
+                    //.do(res => console.info(res))
+                    .map(res => this.parseOrganizationInfo(res));
+
+    }
+
+    private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parseOrganizationInfo (data: any):any {
+        console.info("parseOrganizationInfo");
+        this.organizationInfo = new OrganizationInfo();
+
+        let mydata;
+
+        if(data[0] != null) {
+            mydata = data[0];
+            if(mydata.hasOwnProperty("legalshortname")) {
+                if(mydata.hasOwnProperty("websiteurl")) {
+                    this.organizationInfo.title = {"name": mydata.legalshortname, "url": data.websiteurl};
+                } else {
+                    this.organizationInfo.title = {"name": mydata.legalshortname, "url": ""};
+                }
+            }
+
+            if(mydata.hasOwnProperty("legalname")) {
+                this.organizationInfo.name = mydata.legalname;
+            }
+
+            if(mydata.hasOwnProperty("country")) {
+                this.organizationInfo.country = mydata['country'].classname;
+            }
+        }
+
+        if(data[1] != null) {
+            let counter;
+            let length = data[1].length!=undefined ? data[1].length : 1;
+
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[1][i] : data[1];
+                if(mydata.hasOwnProperty("to")) {
+                    if(mydata['to'].class == "isParticipant") {
+                        if(mydata.hasOwnProperty("funding")) {
+                            if(mydata['funding'].hasOwnProperty("funder")) {
+                                if(this.organizationInfo.projects == undefined) {
+                                    this.organizationInfo.projects = new Map<string,
+                                        { "name": string, "url": string, "code": string,
+                                          "acronym": string, "funder": string, "fundingStream": string,
+                                          "fundingLevel1": string, "fundingLevel2": string,
+                                          "sc39": string, "startDate": string, "endDate": string }[]>();
+                                }
+
+                                if(!this.organizationInfo.projects.has(mydata['funding']['funder'].name)) {
+                                    this.organizationInfo.projects.set(mydata['funding']['funder'].name,
+                                        new Array<{ "name": string, "url": string, "code": string,
+                                                    "acronym": string, "funder": string, "fundingStream": string,
+                                                    "fundingLevel1": string, "fundingLevel2": string,
+                                                    "sc39": string, "startDate": string, "endDate": string }>());
+                                }
+
+                                counter = this.organizationInfo.projects.get(mydata['funding']['funder'].name).length;
+                                this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter] =
+                                    { "name": "", "url": "", "code": "",
+                                      "acronym": "", "funder": "", "fundingStream": "",
+                                      "fundingLevel1": "", "fundingLevel2": "",
+                                      "sc39": "", "startDate": "", "endDate": "" };
+
+                                let url = "";
+                                if(mydata['to'].content != null && mydata['to'].content != "") {
+                                    url = OpenaireProperties.getsearchLinkToProject()+mydata['to'].content;
+                                }
+                                this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['name'] = mydata.title;
+                                this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['url'] = url;
+                                this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['code'] = mydata.code;
+                                this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['acronym'] = mydata.acronym;
+
+                                this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['funder'] = mydata['funding']['funder'].shortname;
+                                if(mydata['funding'].hasOwnProperty("funding_level_0")) {
+                                    this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['fundingStream'] = mydata['funding']['funding_level_0'].name;
+                                }
+                                if(mydata['funding'].hasOwnProperty("funding_level_1")) {
+                                    this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['fundingLevel1'] = mydata['funding']['funding_level_1'].name;
+                                }
+                                if(mydata['funding'].hasOwnProperty("funding_level_2")) {
+                                    this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['fundingLevel2'] = mydata['funding']['funding_level_2'].name;
+                                }
+                                //this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['sc39'] =
+                                //this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['startDate'] =
+                                //this.organizationInfo.projects.get(mydata['funding']['funder'].name)[counter]['endDate'] =
+                            }
+                        }
+                    } else if(mydata['to'].class == "isProvidedBy") {
+                        if(this.organizationInfo.dataProviders == undefined) {
+                            this.organizationInfo.dataProviders = new Array<{ "name": string, "url": string, "type": string, "websiteUrl": string }>();
+                        }
+
+                        counter = this.organizationInfo.dataProviders.length;
+                        this.organizationInfo.dataProviders[counter] = { "name": "", "url": "", "type": "", "websiteUrl": "" }
+
+                        let url="";
+                        if(mydata['to'].content != null && mydata['to'].content != "") {
+                            url = OpenaireProperties.getsearchLinkToDataProvider()+mydata['to'].content;
+                        }
+                        this.organizationInfo.dataProviders[counter]['name'] = mydata.officialname;
+                        this.organizationInfo.dataProviders[counter]['url'] = url;
+                        if(mydata.hasOwnProperty("datasourcetype")) {
+                            this.organizationInfo.dataProviders[counter]['type'] = mydata['datasourcetype'].classname;
+                        }
+                        this.organizationInfo.dataProviders[counter]['websiteUrl'] = mydata.websiteurl;
+                    }
+                }
+            }
+        }
+
+        return this.organizationInfo;
+
+    }
+
+}

portal-2/src/app/services/person.service.ts

@@ -0,0 +1,53 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {PersonInfo} from '../entities/personInfo';
+import {OpenaireProperties} from '../openaireProperties'
+
+@Injectable()
+export class PersonService {
+
+    constructor(private http: Http) {}
+
+    personInfo: PersonInfo;
+
+    getPersonInfo (id: string):any {
+        console.info("getPersonInfo in service");
+
+        let url = OpenaireProperties.getSearchAPIURL()+'people/'+id;
+
+        return this.http.get(url)
+                    .map(res => <any> res.json())
+                    .map(res => res['result']['metadata']['oaf:entity']['oaf:person'])
+                    .map(res => this.parsePersonInfo(res));
+
+    }
+
+    private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parsePersonInfo (data: any):any {
+        console.info("parsePersonInfo");
+        this.personInfo = new PersonInfo();
+
+        if(data != null) {
+            if(data.hasOwnProperty('firstname')) {
+                this.personInfo.firstname = data.firstname;
+            }
+            if(data.hasOwnProperty('secondnames')) {
+                this.personInfo.secondnames = data.secondnames;
+            }
+            if(data.hasOwnProperty('fullname')) {
+                this.personInfo.fullname = data.fullname;
+            }
+        }
+
+        return this.personInfo;
+
+    }
+
+}

portal-2/src/app/services/project.service.ts

@@ -0,0 +1,143 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {ProjectInfo} from '../entities/projectInfo';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Injectable()
+export class ProjectService {
+
+    constructor(private http: Http) {}
+
+    projectInfo: ProjectInfo;
+
+    getProjectInfo (id: string):any {
+        console.info("getProjectInfo in service");
+
+        let url = OpenaireProperties.getSearchAPIURL() + 'projects/'+id;
+
+        return this.http.get(url)
+                    .map(res => <any> res.json())
+                    .map(res => res['result']['metadata']['oaf:entity']['oaf:project'])
+                    .do(res => console.info(res))
+                    .map(res => [res,
+                                 res['fundingtree'],
+                                 res['rels']['rel']])
+                    .map(res => this.parseProjectInfo(res));
+
+    }
+    /*
+    get project strtDate and endDate
+    */
+    getProjectDates (id: string):any {
+
+        let url = OpenaireProperties.getSearchAPIURL()+'projects/'+id;
+
+        return this.http.get(url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['result']['metadata']['oaf:entity']['oaf:project'],
+                                 res['result']['metadata']['oaf:entity']['oaf:project']['fundingtree'],
+                                 res['result']['metadata']['oaf:entity']['oaf:project']['rels']['rel']])
+                    .map(res => this.parseProjectDates(id,res));
+
+    }
+    private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parseProjectInfo (data: any):any {
+        this.projectInfo = new ProjectInfo();
+
+        if(data[0] != null) {
+            this.projectInfo.acronym = data[0].acronym;
+            this.projectInfo.title = data[0].title;
+            this.projectInfo.callIdentifier = data[0].callidentifier;
+            this.projectInfo.contractNum = data[0].code;
+            this.projectInfo.startDate = data[0].startdate;
+            this.projectInfo.endDate = data[0].enddate;
+            this.projectInfo.openAccessMandate = data[0].oamandatepublications;
+            this.projectInfo.specialClause39 = data[0].ecsc39;
+        }
+        if(data[1] != null) {
+            if(data[1]['funder'] != null) {
+                this.projectInfo.funder = data[1]['funder'].shortname;
+            }
+
+            let funding;
+            this.projectInfo.funding = "";
+
+            if(data[1]['funding_level_2'] != null) {
+                funding = data[1]['funding_level_2'].id;
+            } else if(data[1]['funding_level_1'] != null) {
+                funding = data[1]['funding_level_1'].id;
+            } else if(data[1]['funding_level_0'] != null) {
+                funding = data[1]['funding_level_0'].id;
+            }
+
+            if(funding != undefined) {
+                funding = funding.split("::");
+                for(let i=1; i<funding.length; i++) {
+                    if(this.projectInfo.funding != "") {
+                        this.projectInfo.funding += " | ";
+                    }
+                    this.projectInfo.funding += funding[i];
+                }
+            }
+        }
+
+        if(data[2] != null) {
+            this.projectInfo.organizations = new Map<string, string>();
+
+            let name = "";
+            let url = "";
+
+            if(!Array.isArray(data[2])) {
+                if(data[2].hasOwnProperty("legalshortname")) {
+                    name = data[2].legalshortname;
+                } else if(data[2].hasOwnProperty("legalname")) {
+                    name = data[2].legalname;
+                }
+
+                if(data[2].hasOwnProperty("to")) {
+                    url = OpenaireProperties.getsearchLinkToOrganization()+data[2]['to'].content;
+                }
+                this.projectInfo.organizations.set(name, url);
+            } else {
+                for(let i=0; i<data[2].length; i++) {
+                    if(data[2][i].hasOwnProperty("legalshortname")) {
+                        name = data[2][i].legalshortname;
+                    } else if(data[2][i].hasOwnProperty("legalname")) {
+                        name = data[2][i].legalname;
+                    }
+
+                    if(data[2][i].hasOwnProperty("to")) {
+                        url = OpenaireProperties.getsearchLinkToOrganization+data[2][i]['to'].content;
+                    }
+                    this.projectInfo.organizations.set(name, url);
+                }
+            }
+        }
+
+        if(this.projectInfo.funder == "EC") {
+            this.projectInfo.url = OpenaireProperties.getCordisURL()+this.projectInfo.contractNum;
+            this.projectInfo.urlInfo = "Detailed project information (CORDIS)";
+        }
+
+        return this.projectInfo;
+
+    }
+
+    parseProjectDates (id: string, data: any):any {
+        var project = { id: id, startDate: "", endDate: ""};
+        if(data[0] != null) {
+            project.startDate = data[0].startdate;
+            project.endDate = data[0].enddate;
+        }
+        return project;
+
+    }
+
+}

portal-2/src/app/services/publication.service.ts

@@ -0,0 +1,646 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {PublicationInfo} from '../entities/publicationInfo';
+import {OpenaireProperties} from '../openaireProperties';
+
+@Injectable()
+export class PublicationService {
+
+    constructor(private http: Http) {}
+
+    publicationInfo: PublicationInfo;
+
+    getPublicationInfo (id: string):any {
+        console.info("getPublicationInfo in service");
+        let url = OpenaireProperties.getSearchAPIURL() + 'publications/' +id;
+
+        return this.http.get(url)
+                    .map(res => <any> res.json())
+                    .do(res => console.info(res['result']['metadata']['oaf:entity']))
+                    .map(res => res['result']['metadata']['oaf:entity'])
+                    .map(res => [res['oaf:result'],
+                                 res['oaf:result']['title'],
+                                 res['oaf:result']['rels']['rel'],
+                                 res['oaf:result']['children'],
+                                 res['oaf:result']['pid'],
+                                 res['oaf:result']['journal'],
+                                 res['oaf:result']['language'],
+                                 res['oaf:result']['subject'],
+                                 res['oaf:result']['bestlicense'],
+                                 res['oaf:result']['collectedfrom'],
+                                 (res['extraInfo']!= undefined && res['extraInfo']['citations']!= undefined)? res['extraInfo']['citations']['citation']:null,
+                                 res['oaf:result']['context']
+                    ])
+                    .map(res => this.parsePublicationInfo(res));
+
+    }
+
+    private handleError (error: Response) {
+    // in a real world app, we may send the error to some remote logging infrastructure
+    // instead of just logging it to the console
+        console.error(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parsePublicationInfo (data: any):any {
+        this.publicationInfo = new PublicationInfo();
+
+        if(data[0] != null) {
+            this.publicationInfo.date = data[0].dateofacceptance.substring(0,4);
+            this.publicationInfo.publisher = data[0].publisher;
+            if(!Array.isArray(data[0].description)) {
+                this.publicationInfo.description = data[0].description;
+            } else {
+                this.publicationInfo.description = data[0].description[0];
+            }
+            this.publicationInfo.embargoEndDate = data[0].embargoenddate;
+        }
+
+        if(data[1] != null) {
+            this.publicationInfo.title = {"name": "", "url": "", "accessMode": ""};
+
+            if(Array.isArray(data[1])) {
+                this.publicationInfo.title['name'] = data[1][0].content;
+            } else {
+                this.publicationInfo.title['name'] = data[1].content;
+            }
+        }
+
+        if(data[2] != null) {
+            let mydata;
+            let counter = 0;
+            let length = data[2].length!=undefined ? data[2].length : 1;
+
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[2][i] : data[2];
+                if(mydata.hasOwnProperty("to")) {
+                    if(mydata['to'].class == "hasAuthor") {
+                        if(this.publicationInfo.authors == undefined) {
+                            this.publicationInfo.authors = new Array<{"name": string, "url": string}>();
+                        }
+
+                        this.publicationInfo.authors[mydata.ranking-1] = {"name": "", "url": ""};
+                        this.publicationInfo.authors[mydata.ranking-1]['name'] = mydata.fullname;
+                        this.publicationInfo.authors[mydata.ranking-1]['url'] = OpenaireProperties.getsearchLinkToPerson() +mydata['to'].content;
+                    } else if(mydata['to'].class == "isProducedBy") {
+                        if(this.publicationInfo.fundedByProjects == undefined) {
+                            this.publicationInfo.fundedByProjects = new Array<
+                                { "url": string, "acronym": string, "title": string,
+                                  "funderShortname": string, "funderName": string,
+                                  "funding": string, "inline": boolean
+                                }>();
+                        }
+
+                        counter = this.publicationInfo.fundedByProjects.length;
+
+                        this.publicationInfo.fundedByProjects[counter] = {
+                            "url": "", "acronym": "", "title": "",
+                            "funderShortname": "", "funderName": "",
+                            "funding": "", "inline": false
+                        }
+
+                        this.publicationInfo.fundedByProjects[counter]['url'] =
+                            OpenaireProperties.getsearchLinkToProject() + mydata['to'].content;
+                        this.publicationInfo.fundedByProjects[counter]['acronym'] = mydata.acronym;
+                        this.publicationInfo.fundedByProjects[counter]['title'] = mydata.title;
+
+                        if(mydata.hasOwnProperty("funding")) {
+                            let length1 = Array.isArray(mydata['funding']) ? mydata['funding'].length : 1;
+
+                            for(let j=0; j<length1; j++) {
+                                let funding;
+                                let mydata1 = length1 > 1 ? mydata['funding'][j] : mydata['funding'];
+
+                                if(mydata1.hasOwnProperty("funder")) {
+                                    this.publicationInfo.fundedByProjects[counter]['funderShortname'] = mydata1['funder'].shortname;
+                                    this.publicationInfo.fundedByProjects[counter]['funderName'] = mydata1['funder'].name;
+                                }
+
+                                if(mydata1.hasOwnProperty("funding_level_2")) {
+                                    funding = mydata1['funding_level_2'].content;
+                                } else if(mydata1.hasOwnProperty("funding_level_1")) {
+                                    funding = mydata1['funding_level_1'].content;
+                                } else if(mydata1.hasOwnProperty("funding_level_0")) {
+                                    funding = mydata1['funding_level_0'].content;
+                                }
+
+                                if(funding != undefined) {
+                                    funding = funding.split("::");
+
+                                    if(this.publicationInfo.fundedByProjects[counter]['funding'] != "") {
+                                        this.publicationInfo.fundedByProjects[counter]['funding'] += ", "+funding[1];
+                                    } else {
+                                        this.publicationInfo.fundedByProjects[counter]['funding'] = funding[1];
+                                    }
+                                    for(let i=2; i<funding.length; i++) {
+                                        this.publicationInfo.fundedByProjects[counter]['funding'] += " | " + funding[i];
+                                    }
+                                }
+                            }
+                        }
+                    } else if(mydata['to'].class == "isRelatedTo") {
+                        if(this.publicationInfo.relatedResearchResults == undefined) {
+                            this.publicationInfo.relatedResearchResults = new Array<{
+                                "name": string, "url": string, "date": string,
+                                "trust": string, "class": string}>();
+                        }
+
+                        counter = this.publicationInfo.relatedResearchResults.length;
+                        this.publicationInfo.relatedResearchResults[counter] = {"name": "", "url": "", "date": "", "trust": "", "class": ""}
+
+                        let url;
+                        if(mydata['resulttype'].classname == "publication") {
+                            url = OpenaireProperties.getsearchLinkToPublication() + mydata['to'].content;
+                            this.publicationInfo.relatedResearchResults[counter]['class'] = "publication";
+                        } else {
+                            url = OpenaireProperties.getsearchLinkToDataset() + mydata['to'].content;
+                            this.publicationInfo.relatedResearchResults[counter]['class'] = "dataset";
+                        }
+
+                        this.publicationInfo.relatedResearchResults[counter]['url'] = url;
+                        this.publicationInfo.relatedResearchResults[counter]['name'] = mydata['title'].content;
+                        this.publicationInfo.relatedResearchResults[counter]['date'] = mydata.dateofacceptance.substring(0,4);;
+                        this.publicationInfo.relatedResearchResults[counter]['trust'] = Math.round(mydata.trust*100)+"%";
+
+                    } else if(mydata['to'].class == "hasAmongTopNSimilarDocuments") {
+                        if(this.publicationInfo.similarResearchResults == undefined) {
+                            this.publicationInfo.similarResearchResults = new Array<{
+                                "name": string, "url": string, "date": string,
+                                "trust": string, "class": string}>();
+                        }
+
+                        counter = this.publicationInfo.similarResearchResults.length;
+                        this.publicationInfo.similarResearchResults[counter] = {"name": "", "url": "", "date": "", "trust": "", "class": ""}
+
+                        let url;
+                        if(mydata['resulttype'].classname == "publication") {
+                            url = OpenaireProperties.getsearchLinkToPublication() + mydata['to'].content;
+                            this.publicationInfo.similarResearchResults[counter]['class'] = "publication";
+                        } else {
+                            url = OpenaireProperties.getsearchLinkToDataset() + mydata['to'].content;
+                            this.publicationInfo.similarResearchResults[counter]['class'] = "dataset";
+                        }
+
+                        this.publicationInfo.similarResearchResults[counter]['url'] = url;
+                        this.publicationInfo.similarResearchResults[counter]['name'] = mydata['title'].content;
+                        this.publicationInfo.similarResearchResults[counter]['date'] = mydata.dateofacceptance.substring(0,4);;
+                        this.publicationInfo.similarResearchResults[counter]['trust'] = Math.round(mydata.trust*100)+"%";
+                    }
+                }
+            }
+
+            this.publicationInfo.authors = this.publicationInfo.authors.filter(function (item) {
+                return (item != undefined);
+            });
+        }
+
+        if(data[3] != null) {
+            if(data[3].hasOwnProperty("instance")) {
+                this.publicationInfo.downloadFrom = new Map<string, {"url": string[], "accessMode": string[]}>();
+                this.publicationInfo.publishedIn = new Map<string, {"url": string[], "accessMode": string[]}>();
+
+                this.publicationInfo.types = new Array<string>();
+
+                let length = data[3]['instance'].length!=undefined ? data[3]['instance'].length : 1;
+
+                let types = new Set<string>();
+                let counter = 0;
+                let counter1 = 0;
+                let counter2 = 0;
+                let mydata;
+                for(let i=0; i<length; i++) {
+                    mydata = length > 1 ? data[3]['instance'][i] : data[3]['instance'];
+
+                    if(mydata.hasOwnProperty("instancetype")) {
+                        if(!types.has(mydata['instancetype'].classname)) {
+                            this.publicationInfo.types[counter] = mydata['instancetype'].classname;
+                            types.add(mydata['instancetype'].classname);
+                            counter++;
+                        }
+                    }
+
+                    if(mydata.hasOwnProperty("webresource")) {
+                        let url;
+                        if(mydata['webresource'].length == undefined) {
+                            url = mydata['webresource'].url;
+                        } else{
+                            url = mydata['webresource'][0].url;
+                        }
+
+                        if(mydata.hasOwnProperty("hostedby")) {
+                            if(mydata['hostedby'].name != "other resources" && mydata['hostedby'].name != "Unknown Repository") {
+                                if(!this.publicationInfo.downloadFrom.has(mydata['hostedby'].name)) {
+                                    this.publicationInfo.downloadFrom.set(mydata['hostedby'].name, {"url": null, "accessMode": null});
+                                }
+
+                                if(this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['url'] == null) {
+                                    this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['url'] = new Array<string>();
+                                }
+
+                                counter2 = this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['url'].length;
+                                this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['url'][counter2] = url;
+
+                                if(this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'] == null) {
+                                    this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'] = new Array<string>();
+                                }
+
+                                if(mydata.hasOwnProperty("licence")) {
+                                    this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'][counter2] = mydata['licence'].classid;
+                                } else {
+                                    this.publicationInfo.downloadFrom.get(mydata['hostedby'].name)['accessMode'][counter2] = "";
+                                }
+                            } else {
+                                if(data[0] != null && data[0].hasOwnProperty("source")) {
+                                    let key: string;
+                                    if(Array.isArray(data[0].source)) {
+                                        if(!this.publicationInfo.publishedIn.has(data[0]['source'][counter1])) {
+                                            key = data[0]['source'][counter1];
+                                        }
+                                    } else {
+                                        if(!this.publicationInfo.publishedIn.has(data[0]['source'])) {
+                                            key = data[0]['source'];
+                                        }
+                                    }
+
+                                    this.publicationInfo.publishedIn.set(key, {"url": null, "accessMode": null});
+
+                                    if(this.publicationInfo.publishedIn.get(key)['url'] == null) {
+                                        this.publicationInfo.publishedIn.get(key)['url'] = new Array<string>();
+                                    }
+
+                                    counter2 = this.publicationInfo.publishedIn.get(key)['url'].length;
+                                    this.publicationInfo.publishedIn.get(key)['url'][counter2] = url;
+
+                                    if(this.publicationInfo.publishedIn.get(key)['accessMode'] == null) {
+                                        this.publicationInfo.publishedIn.get(key)['accessMode'] = new Array<string>();
+                                    }
+
+                                    if(mydata.hasOwnProperty("licence")) {
+                                        this.publicationInfo.publishedIn.get(key)['accessMode'][counter2] = mydata['licence'].classid;
+                                    } else {
+                                        this.publicationInfo.publishedIn.get(key)['accessMode'][counter2] = "";
+                                    }
+                                    counter1++;
+                                }
+                            }
+                            if(this.publicationInfo.title != undefined) {
+                                if(this.publicationInfo.title['url'] == "") {
+                                    this.publicationInfo.title['url'] = url;
+                                }
+
+                                switch (this.publicationInfo.title['accessMode']) {
+                                    case undefined:
+                                        this.publicationInfo.title['accessMode'] = mydata['accessMode'].classid;
+                                        this.publicationInfo.title['url'] = url;
+                                        break;
+                                    case "CLOSED":
+                                        if(mydata['licence'].classid == "OPEN" ||
+                                            mydata['licence'].classid == "EMBARGO" ||
+                                            mydata['licence'].classid == "RESTRICTED") {
+                                                this.publicationInfo.title['accessMode'] = mydata['licence'].classid;
+                                                this.publicationInfo.title['url'] = url;
+                                        }
+                                        break;
+                                    case "RESTRICTED":
+                                        if(mydata['licence'].classid == "OPEN" ||
+                                            mydata['licence'].classid == "EMBARGO") {
+                                                this.publicationInfo.title['accessMode'] = mydata['licence'].classid;
+                                                this.publicationInfo.title['url'] = url;
+                                        }
+                                        break;
+                                    case "EMBARGO":
+                                        if(mydata['licence'].classid == "OPEN") {
+                                                this.publicationInfo.title['accessMode'] = mydata['licence'].classid;
+                                                this.publicationInfo.title['url'] = url;
+                                        }
+                                        break;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+
+            if(data[3].hasOwnProperty("externalreference")) {
+                this.publicationInfo.bioentities = new Map<string, Map<string, string>>();
+
+                let length = data[3]['externalreference'].length!=undefined ? data[3]['externalreference'].length : 1;
+
+                let mydata;
+                for(let i=0; i<length; i++) {
+                    mydata = length > 1 ? data[3]['externalreference'][i] : data[3]['externalreference'];
+
+                    if(!this.publicationInfo.bioentities.has(mydata.sitename)) {
+                        this.publicationInfo.bioentities.set(mydata.sitename, new Map<string, string>());
+                    }
+                    this.publicationInfo.bioentities.get(mydata.sitename).set(mydata.refidentifier, mydata.url);
+                }
+            }
+        }
+
+        if(data[4] != null) {
+            let counter = 0;
+            this.publicationInfo.identifiers = new Map<string, string[]>();
+
+            if(data[4].hasOwnProperty("classname") && data[4]['classname'] != "") {
+                if(data[4].classname == "doi" || data[4].classname == "pmc") {
+                    if(!this.publicationInfo.identifiers.has(data[4].classname)) {
+                        this.publicationInfo.identifiers.set(data[4].classname, new Array<string>());
+                    }
+                    counter = this.publicationInfo.identifiers.get(data[4].classname).length;
+                    this.publicationInfo.identifiers.get(data[4].classname)[counter] = data[4].content;
+                }
+            } else {
+                for(let i=0; i<data[4].length; i++) {
+                    if(data[4][i].classname == "doi" || data[4][i].classname == "pmc") {
+                        if(!this.publicationInfo.identifiers.has(data[4][i].classname)) {
+                            this.publicationInfo.identifiers.set(data[4][i].classname, new Array<string>());
+                        }
+                        counter = this.publicationInfo.identifiers.get(data[4][i].classname).length;
+                        this.publicationInfo.identifiers.get(data[4][i].classname)[counter] = data[4][i].content;
+                    }
+                }
+            }
+        }
+
+        if(data[5] != null) {
+            this.publicationInfo.journal = {"journal": "", "issn": "", "lissn": ""}
+
+            this.publicationInfo.journal['journal'] = data[5].content;
+            this.publicationInfo.journal['issn'] = data[5].issn;
+            this.publicationInfo.journal['lissn'] = data[5].lissn;
+        }
+
+        if(data[6] != null) {
+            this.publicationInfo.languages = new Array<string>();
+
+            if(data[6].hasOwnProperty("classname")) {
+                this.publicationInfo.languages[0] = data[6].classname;
+            } else {
+                for(let i=0; i<data[6].length; i++) {
+                    this.publicationInfo.languages[i] = data[6][i].classname;
+                }
+            }
+        }
+
+        if(data[7] != null) {
+            this.publicationInfo.classifiedSubjects = new Map<string, string[]>();
+            this.publicationInfo.subjects = new Array<string>();
+
+            let mydata;
+            let length = data[7].length!=undefined ? data[7].length : 1;
+
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[7][i] : data[7];
+
+                if(mydata.classid != "") {
+                    if(mydata.inferred == true) {
+                        if(!this.publicationInfo.classifiedSubjects.has(mydata.classid)) {
+                            this.publicationInfo.classifiedSubjects.set(mydata.classid, new Array<string>());
+                        }
+
+                        let counter = this.publicationInfo.classifiedSubjects.get(mydata.classid).length;
+                        this.publicationInfo.classifiedSubjects.get(mydata.classid)[counter] = mydata.content;
+                    } else {
+                        let counter = this.publicationInfo.subjects.length;
+                        this.publicationInfo.subjects[counter] = mydata.content;
+                    }
+                }
+            }
+        }
+
+        if(data[8] != null) {
+            this.publicationInfo.bestlicense = data[8].classid;
+        }
+
+        if(data[9] != null) {
+            this.publicationInfo.collectedFrom = new Array<{"name": string, "url": string}>();
+
+            let mydata;
+            let length = data[9].length!=undefined ? data[9].length : 1;
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[9][i] : data[9];
+                let link = OpenaireProperties.getsearchLinkToDataProvider();
+                this.publicationInfo.collectedFrom[i] = {"name": "", "url": ""};
+                this.publicationInfo.collectedFrom[i]['name'] = mydata.name;
+                this.publicationInfo.collectedFrom[i]['url'] = link+mydata.id;
+            }
+        }
+
+        if(this.publicationInfo.publisher != null
+            && this.publicationInfo.identifiers != null
+            && this.publicationInfo.identifiers.has('doi')) {
+
+            if( this.publicationInfo.downloadFrom == null) {
+                this.publicationInfo.downloadFrom = new Map<string, {"url": string[], "accessMode": string[]}>();
+            }
+
+            let key: string;
+            if(this.publicationInfo.journal != null) {
+                key = this.publicationInfo.publisher + "/ "+this.publicationInfo.journal['journal'];
+            } else {
+                key = this.publicationInfo.publisher;
+            }
+            this.publicationInfo.downloadFrom.set(key, {"url": null, "accessMode": null});
+
+            let url = OpenaireProperties.getDoiURL()+this.publicationInfo.identifiers.get("doi")[0];
+
+            this.publicationInfo.downloadFrom.get(key)['url'] = new Array<string>();
+            this.publicationInfo.downloadFrom.get(key)['accessMode'] = new Array<string>();
+
+            this.publicationInfo.downloadFrom.get(key)['url'][0] = url;
+            this.publicationInfo.downloadFrom.get(key)['accessMode'][0] = "";
+
+            if(this.publicationInfo.title != undefined && this.publicationInfo.title['url'] == "") {
+                this.publicationInfo.title['url'] = url;
+            }
+        }
+
+        if(data[10] != null) {
+            this.publicationInfo.references = new Array<{"name": string, "url": string}>();
+
+            let mydata;
+            let length = data[10].length!=undefined ? data[10].length : 1;
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[10][i] : data[10];
+
+                let url;
+                if(mydata.hasOwnProperty("id")) {
+                    let mydata1;
+                    let length1 = mydata['id'].length!=undefined ? mydata['id'].length : 1;
+                    for(let j=0; j<length1; j++) {
+                        mydata1 = length1 > 1 ? mydata['id'][j] : mydata['id'];
+
+                        if(mydata1.type == "pmid") {
+                            url = OpenaireProperties.getPmidURL()+mydata1.value;
+                        }
+                    }
+                }
+
+                this.publicationInfo.references[mydata.position-1] = { "name": "", "url": ""};
+                this.publicationInfo.references[mydata.position-1]['name'] = mydata.rawText;
+                this.publicationInfo.references[mydata.position-1]['url'] = url;
+            }
+        }
+
+        if(data[11] != null) {
+            this.publicationInfo.contexts = new Array<
+                { "labelContext": string, "labelCategory": string, "labelConcept": string, inline:boolean}>();
+
+            let position = 0;
+            let labels = "";
+            let mydata;
+            let length = data[11].length!=undefined ? data[11].length : 1;
+            for(let i=0; i<length; i++) {
+                mydata = length > 1 ? data[11][i] : data[11];
+
+                if(mydata.hasOwnProperty("type") && mydata['type'] == "community") {
+                    if(mydata.hasOwnProperty("category")) {
+                        if(mydata['category'].hasOwnProperty("concept")) {
+                            let mydata1;
+                            let length1 = mydata['category']['concept'].length!=undefined ? mydata['category']['concept'].length : 1;
+                            for(let j=0; j<length1; j++) {
+                                mydata1 = length1 > 1 ? mydata['category']['concept'][j] : mydata['category']['concept'];
+
+                                this.publicationInfo.contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false };
+                                this.publicationInfo.contexts[position]['labelContext'] = mydata.label;
+                                this.publicationInfo.contexts[position]['labelCategory'] = mydata['category'].label;;
+                                this.publicationInfo.contexts[position]['labelConcept'] = mydata1.label;
+
+                                position++;
+                            }
+                        } else {
+                            this.publicationInfo.contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false};
+                            this.publicationInfo.contexts[position]['labelContext'] = mydata.label;
+                            this.publicationInfo.contexts[position]['labelCategory'] = mydata['category'].label;;
+                            this.publicationInfo.contexts[position]['labelConcept'] = null;
+                         }
+                    } else {
+                        this.publicationInfo.contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false};
+                        this.publicationInfo.contexts[position]['labelContext'] = mydata.label;
+                        this.publicationInfo.contexts[position]['labelCategory'] = null;
+                        this.publicationInfo.contexts[position]['labelConcept'] = null;
+                        this.publicationInfo.contexts[position]['new'] = false;
+                    }
+                }
+            }
+        }
+
+        //this.printPublicationInfo();
+        return this.publicationInfo;
+
+    }
+
+    printPublicationInfo() {
+        console.info("DATE: "+this.publicationInfo.date);
+        console.info("PUBLISHER: "+this.publicationInfo.publisher);
+        console.info("DESCRIPTION: "+this.publicationInfo.description);
+
+        console.info("TITLE: "+this.publicationInfo.title);
+
+        console.info("AUTHORS: "+this.publicationInfo.authors);
+        console.info("\nFUNDED BY PROJECTS:");
+        if(this.publicationInfo.fundedByProjects != undefined) {
+            this.publicationInfo.fundedByProjects.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+/*
+        console.info("\nRELATED RESEARCH DATA:");
+        if(this.publicationInfo.relatedResearchData != undefined) {
+            this.publicationInfo.relatedResearchData.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("\nSIMILAR PUBLICATIONS:");
+        if(this.publicationInfo.similarPublications != undefined) {
+            this.publicationInfo.similarPublications.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+*/
+        console.info("TYPES: "+this.publicationInfo.types);
+        console.info("\nDOWNLOAD FROM:");
+        if(this.publicationInfo.downloadFrom != undefined) {
+            this.publicationInfo.downloadFrom.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+        console.info("\nBIOENTITIES:");
+        if(this.publicationInfo.bioentities != undefined) {
+            this.publicationInfo.bioentities.forEach(function (value, key, map) {
+                value.forEach(function (value1, key1, map1) {
+                    console.info(key + " = " + key1 + " = " + value1);
+                })
+            })
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("\nIDENTIFIERS:");
+        if(this.publicationInfo.identifiers != undefined) {
+            this.publicationInfo.identifiers.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("JOURNAL: "+this.publicationInfo.journal);
+
+
+        console.info("LANGUAGES: "+this.publicationInfo.languages);
+
+
+        console.info("SUBJECTS: "+this.publicationInfo.subjects);
+        console.info("\nCLASSIFIED OBJECTS:");
+        if(this.publicationInfo.classifiedSubjects != undefined) {
+            this.publicationInfo.classifiedSubjects.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("BEST LICENSE: "+this.publicationInfo.bestlicense);
+
+        console.info("\nCOLLECTED FROM:");
+        if(this.publicationInfo.collectedFrom != undefined) {
+            this.publicationInfo.collectedFrom.forEach(function (value, key, map) {
+                console.info(key + " = " + value);
+            });
+        } else {
+            console.info("undefined");
+        }
+        console.info("\n");
+
+        console.info("\nREFERENCES:");
+        if(this.publicationInfo.references != undefined) {
+            for(let i in this.publicationInfo.references) {
+                for(let key in this.publicationInfo.references[i]) {
+                    console.info(key+" : "+this.publicationInfo.references[i][key]);
+                }
+            }
+        } else {
+            console.info("undefined");
+        }
+    }
+
+}