commit 86e750754b3731e7a32e55369868282d1df631f9
Author: argiro.kokogiannaki <argiro.kokogiannaki@d315682c-612b-4755-9ff5-7f18f6832af3>
Date:   Tue Dec 19 12:53:46 2017 +0000

    Commiting first draft of openaire library for angular portals
    
    git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@50169 d315682c-612b-4755-9ff5-7f18f6832af3

diff --git a/app.component.ts b/app.component.ts
new file mode 100644
index 00000000..fe237168
--- /dev/null
+++ b/app.component.ts
@@ -0,0 +1,56 @@
+import { Component, Directive, ElementRef, Renderer, ChangeDetectionStrategy, ViewEncapsulation } from '@angular/core';
+import { ConfigurationService } from './utils/configuration/configuration.service';
+import {Observable}       from 'rxjs/Observable';
+
+@Component({
+  //changeDetection: ChangeDetectionStrategy.Default,
+  //encapsulation: ViewEncapsulation.Emulated,
+  selector: 'app-root',
+  styles: [`
+  `],
+  template: `
+  <h1>Openaire Lib Component</h1>
+        <!--navbar></navbar-->
+
+
+          <!--div id="tm-main" class=" uk-section  uk-margin-large-top tm-middle custom-main-content"   >
+                <div uk-grid uk-grid>
+                   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first "-->
+                   <div class="custom-main-content"   >
+                      <main>
+                       <router-outlet></router-outlet>
+
+                     </main>
+                    </div>
+                   <!--/div>
+
+
+                </div>
+          </div-->
+          <!--feedback *ngIf= "isClient"></feedback>
+          <cookie-law *ngIf= "isClient" position="bottom">
+              OpenAIRE uses cookies in order to function properly.<br>
+              Cookies are small pieces of data that websites store in your browser to allow us to give you the best browsing experience possible.
+              By using the OpenAIRE portal you accept our use of cookies. <a href="//ec.europa.eu/ipg/basics/legal/cookies/index_en.htm" target="_blank"> Read more <span class="uk-icon">
+              <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+              </span></a>
+          </cookie-law>
+           <bottom *ngIf= "isClient"></bottom-->
+
+`
+
+})
+export class AppComponent {
+   isClient:boolean = false;
+   constructor(private config: ConfigurationService) {}
+
+   ngOnInit() {
+
+     if (typeof document !== 'undefined') {
+       try{
+         this.isClient = true;
+       }catch (e) {
+       }
+     }
+   }
+}
diff --git a/app.module.ts b/app.module.ts
new file mode 100755
index 00000000..d76a6f30
--- /dev/null
+++ b/app.module.ts
@@ -0,0 +1,145 @@
+import { NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { SharedModule } from './shared/shared.module';
+import { BrowserModule } from '@angular/platform-browser';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { APP_BASE_HREF, CommonModule } from '@angular/common';
+import { HttpModule } from '@angular/http';
+import { RouterModule } from '@angular/router';
+import { AppComponent } from './app.component';
+import {SharedComponentsModule} from './sharedComponents/sharedComponents.module'; //navbar
+import { CookieLawModule } from './sharedComponents/cookie-law/cookie-law.module';
+import {Meta} from '../angular2-meta';
+// import { ErrorModule } from './error/error.module';
+import { ConfigurationService } from './utils/configuration/configuration.service';
+import { ErrorPageComponent } from './error/errorPage.component';
+import {SearchComponent} from './searchPages/find/search.component';
+import {MainSearchModule} from './searchPages/find/mainSearch.module';
+import {PublicationComponent} from './landingPages/publication/publication.component';
+import {PublicationModule} from './landingPages/publication/publication.module';
+import {DatasetComponent} from './landingPages/dataset/dataset.component';
+import {DatasetModule} from './landingPages/dataset/dataset.module';
+import {SoftwareComponent} from './landingPages/software/software.component';
+import {SoftwareModule} from './landingPages/software/software.module';
+import {DataProviderComponent} from './landingPages/dataProvider/dataProvider.component';
+import {DataProviderModule} from './landingPages/dataProvider/dataProvider.module';
+import {ProjectComponent} from './landingPages/project/project.component';
+import {ProjectModule} from './landingPages/project/project.module';
+import {OrganizationComponent} from './landingPages/organization/organization.component';
+import {OrganizationModule} from './landingPages/organization/organization.module';
+import {ReloadModule} from './reload/reload.module';
+import {ErrorModule} from './error/error.module';
+import {DepositDatasetsModule} from './deposit/datasets/depositDatasets.module';
+import {DepositDatasetsComponent} from './deposit/datasets/depositDatasets.component';
+import {DepositDatasetsResultsModule} from './deposit/datasets/depositDatasetsResults.module';
+import {DepositDatasetsResultComponent} from './deposit/datasets/depositDatasetsResult.component';
+import {DepositBySubjectResultsModule} from './deposit/datasets/depositBySubjectResults.module';
+import {DepositBySubjectResultComponent} from './deposit/datasets/depositBySubjectResult.component';
+import {DepositPublicationsModule} from './deposit/publications/depositPublications.module';
+import {DepositPublicationsComponent} from './deposit/publications/depositPublications.component';
+import {DepositPublicationsResultsModule} from './deposit/publications/depositPublicationsResults.module';
+import {DepositPublicationsResultComponent} from './deposit/publications/depositPublicationsResult.component';
+
+import {SearchPublicationsModule} from './searchPages/simple/searchPublications.module';
+import {SearchPublicationsComponent} from './searchPages/simple/searchPublications.component';
+import {SearchDatasetsModule} from './searchPages/simple/searchDatasets.module';
+import {SearchDatasetsComponent} from './searchPages/simple/searchDatasets.component';
+import {SearchSoftwareModule} from './searchPages/simple/searchSoftware.module';
+import {SearchSoftwareComponent} from './searchPages/simple/searchSoftware.component';
+import {SearchDataProvidersModule} from './searchPages/simple/searchDataProviders.module';
+import {SearchDataprovidersComponent} from './searchPages/simple/searchDataproviders.component';
+import {SearchProjectsModule} from './searchPages/simple/searchProjects.module';
+import {SearchProjectsComponent} from './searchPages/simple/searchProjects.component';
+import {SearchOrganizationsModule} from './searchPages/simple/searchOrganizations.module';
+import {SearchOrganizationsComponent} from './searchPages/simple/searchOrganizations.component';
+
+import {AdvancedSearchPublicationsModule} from './searchPages/advanced/advancedSearchPublications.module';
+import {AdvancedSearchPublicationsComponent} from './searchPages/advanced/advancedSearchPublications.component';
+import {AdvancedSearchDatasetsModule} from './searchPages/advanced/advancedSearchDatasets.module';
+import {AdvancedSearchDatasetsComponent} from './searchPages/advanced/advancedSearchDatasets.component';
+import {AdvancedSearchSoftwareModule} from './searchPages/advanced/advancedSearchSoftware.module';
+import {AdvancedSearchSoftwareComponent} from './searchPages/advanced/advancedSearchSoftware.component';
+import {AdvancedSearchDataProvidersModule} from './searchPages/advanced/advancedSearchDataProviders.module';
+import {AdvancedSearchDataProvidersComponent} from './searchPages/advanced/advancedSearchDataProviders.component';
+import {AdvancedSearchProjectsModule} from './searchPages/advanced/advancedSearchProjects.module';
+import {AdvancedSearchProjectsComponent} from './searchPages/advanced/advancedSearchProjects.component';
+import {AdvancedSearchOrganizationsModule} from './searchPages/advanced/advancedSearchOrganizations.module';
+import {AdvancedSearchOrganizationsComponent} from './searchPages/advanced/advancedSearchOrganizations.component';
+
+
+import {EntityRegistriesModule} from './searchPages/dataProviders/entityRegistries.module';
+import {SearchEntityRegistriesComponent} from './searchPages/dataProviders/entityRegistries.component';
+
+import {CompatibleDataProvidersModule} from './searchPages/dataProviders/compatibleDataProviders.module';
+import {SearchCompatibleDataprovidersComponent} from './searchPages/dataProviders/compatibleDataProviders.component';
+
+@NgModule({
+
+  imports: [
+    SharedModule,
+    NoopAnimationsModule,
+    CommonModule,
+    HttpModule,
+    SharedComponentsModule,
+    CookieLawModule,
+    MainSearchModule,
+    ErrorModule,
+    DepositDatasetsModule,DepositDatasetsResultsModule, DepositBySubjectResultsModule,DepositPublicationsModule , DepositPublicationsResultsModule,
+    SearchPublicationsModule,SearchDatasetsModule, SearchSoftwareModule, SearchDataProvidersModule, SearchProjectsModule, SearchOrganizationsModule,
+    AdvancedSearchPublicationsModule,AdvancedSearchDatasetsModule, AdvancedSearchSoftwareModule, AdvancedSearchDataProvidersModule, AdvancedSearchProjectsModule, AdvancedSearchOrganizationsModule,
+    PublicationModule, DatasetModule, DataProviderModule, OrganizationModule, ProjectModule, SoftwareModule,
+    EntityRegistriesModule,CompatibleDataProvidersModule,
+    BrowserModule.withServerTransition({appId: 'my-app'}),
+    RouterModule.forRoot([
+      { path: '', component:  SearchComponent},
+      { path: 'home', component:  SearchComponent},
+      { path: 'search/publication', component: PublicationComponent },
+      { path: 'search/dataset', component: DatasetComponent},
+      { path: 'search/software', component: SoftwareComponent},
+      { path: 'search/project', component: ProjectComponent },
+      { path: 'search/dataprovider', component: DataProviderComponent },
+      { path: 'search/organization', component: OrganizationComponent },
+      { path: 'participate/deposit-datasets', component: DepositDatasetsComponent },
+      { path: 'participate/deposit-datasets-result', component: DepositDatasetsResultComponent},
+      { path: 'participate/deposit-subject-result', component: DepositBySubjectResultComponent },
+      { path: 'participate/deposit-publications', component: DepositPublicationsComponent },
+      { path: 'participate/deposit-publications-result', component: DepositPublicationsResultComponent},
+      { path: 'search/find', component:  SearchComponent},
+      { path: 'search/find/publications', component: SearchPublicationsComponent },
+      { path: 'search/find/datasets', component:SearchDatasetsComponent},
+      { path: 'search/find/software', component:SearchSoftwareComponent},
+      { path: 'search/find/projects', component:SearchProjectsComponent},
+      { path: 'search/find/dataproviders', component:SearchDataprovidersComponent },
+      { path: 'search/find/organizations', component:SearchOrganizationsComponent },
+      { path: 'search/content-providers', component: SearchCompatibleDataprovidersComponent},
+      { path: 'search/content-providers-table', loadChildren: './searchPages/dataProviders/compatibleDataProvidersTable.module#CompatibleDataProvidersTableModule' },
+      { path: 'search/entity-registries',component: SearchEntityRegistriesComponent},
+      { path: 'search/entity-registries-table', loadChildren: './searchPages/dataProviders/entityRegistriesTable.module#EntityRegistriesTableModule' },
+      { path: 'search/journals', loadChildren: './searchPages/dataProviders/journals.module#JournalsModule' },
+      { path: 'search/journals-table', loadChildren: './searchPages/dataProviders/journalsTable.module#JournalsTableModule' },
+      { path: 'search/advanced/publications', component: AdvancedSearchPublicationsComponent },
+      { path: 'search/advanced/datasets', component: AdvancedSearchPublicationsComponent  },
+      { path: 'search/advanced/software', component: AdvancedSearchPublicationsComponent  },
+      { path: 'search/advanced/organizations',component: AdvancedSearchPublicationsComponent  },
+      { path: 'search/advanced/dataproviders', component: AdvancedSearchPublicationsComponent  },
+      { path: 'search/advanced/projects', component: AdvancedSearchPublicationsComponent  },
+      { path: 'project-report', loadChildren: './landingPages/htmlProjectReport/htmlProjectReport.module#HtmlProjectReportModule' },
+      { path: 'myclaims', loadChildren: './claims/myClaims/myClaims.module#MyClaimsModule' },
+      { path: 'claims', loadChildren: './claims/claimsAdmin/claimsAdmin.module#ClaimsAdminModule' },
+      { path: 'participate/claim', loadChildren: './claims/linking/linkingGeneric.module#LinkingGenericModule' },
+      { path: 'participate/direct-claim', loadChildren: './claims/directLinking/directLinking.module#DirectLinkingModule' },
+      { path: 'claims-project-manager', loadChildren: './claims/claimsByToken/claimsByToken.module#ClaimsByTokenModule' },
+      { path: 'reload', loadChildren: './reload/reload.module#ReloadModule'  },
+      { path: 'user-info', loadChildren: './login/user.module#UserModule' },
+      { path: 'error', component: ErrorPageComponent },
+      { path: '**',pathMatch: 'full',component: ErrorPageComponent }
+
+
+    ]),
+  ],
+  declarations: [ AppComponent ],
+  exports: [ AppComponent ],
+ providers:[ Meta, ConfigurationService],
+ bootstrap: [AppComponent]
+})
+export class AppModule {}
diff --git a/app.server.module.ts b/app.server.module.ts
new file mode 100644
index 00000000..79602ec8
--- /dev/null
+++ b/app.server.module.ts
@@ -0,0 +1,20 @@
+import {NgModule} from '@angular/core';
+import {ServerModule} from '@angular/platform-server';
+import {ModuleMapLoaderModule} from '@nguniversal/module-map-ngfactory-loader';
+
+import {AppModule} from './app.module';
+import {AppComponent} from './app.component';
+
+@NgModule({
+  imports: [
+    // The AppServerModule should import your AppModule followed
+    // by the ServerModule from @angular/platform-server.
+    AppModule,
+    ServerModule,
+    ModuleMapLoaderModule,
+  ],
+  // Since the bootstrapped component is not inherited from your
+  // imported AppModule, it needs to be repeated here.
+  bootstrap: [AppComponent],
+})
+export class AppServerModule {}
diff --git a/claims/claim-utils/claim.ts b/claims/claim-utils/claim.ts
new file mode 100644
index 00000000..b5378c5f
--- /dev/null
+++ b/claims/claim-utils/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{
+
+}
diff --git a/claims/claim-utils/claimContextSearchForm.component.ts b/claims/claim-utils/claimContextSearchForm.component.ts
new file mode 100644
index 00000000..f3938127
--- /dev/null
+++ b/claims/claim-utils/claimContextSearchForm.component.ts
@@ -0,0 +1,367 @@
+import {Component, Input,Output, EventEmitter, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router} from '@angular/router';
+import {ContextsService} from './service/contexts.service';
+import {ClaimContext} from './claimEntities.class';
+import { StaticAutoCompleteComponent } from '../../utils/staticAutoComplete/staticAutoComplete.component';
+declare var UIkit:any;
+import {Session} from '../../login/utils/helper.class';
+import {ErrorCodes} from '../../login/utils/guardHelper.class';
+
+@Component({
+    // moduleId: module.id,
+    selector: 'claim-contexts-search-form',
+    template: `
+
+          <div class=" uk-animation uk-card uk-card-default uk-padding uk-padding-large uk-padding-remove-left uk-margin-left" >
+                <!--div uk-grid="" >
+                 <div class="uk-width-auto@m uk-first-column ">
+                    <div>
+                        <select [(ngModel)]="selectedCommunityId"    (ngModelChange)="communityChanged()"  class=" "  name="select_funder"  >
+                          <option  value="0"  >Select community</option>
+                          <option *ngFor="let community of communities"     [value]="community.id" >{{community.label}}</option>
+                        </select>
+                    </div>
+                    <div   *ngIf="selectedCommunityId != '0' && categories.length > 0">
+                          <select  [(ngModel)]="selectedCategoryId"    (ngModelChange)="categoryChanged()" class=" "   name="select_funder"  >
+                            <option  value="0"  >Select category</option>
+                            <option  *ngFor="let category of categories"    [value]="category.id" >{{category.label}}</option>
+                          </select>
+
+                    </div>
+                 </div>
+                 <div class="uk-width-expand@m">
+
+                       <static-autocomplete [(list)] = concepts  [allowDuplicates]=true [showSelected]=false [placeHolderMessage] = "'Concept name'" title = "Concepts"  [multipleSelections]=true  (addItem) = "select($event)" > </static-autocomplete>
+                 </div>
+                </div-->
+              <table class="uk-width-1-1 uk-table uk-table-responsive" ><tr>
+              <tr>
+              <td >
+                <select [(ngModel)]="selectedCommunityId"    (ngModelChange)="communityChanged()"  class=" "  name="select_funder"  >
+                  <option  value="0"  >Select community</option>
+                  <option *ngFor="let community of communities"     [value]="community.id" >{{community.label}}</option>
+                </select>
+                </td>
+                <td *ngIf="selectedCommunityId != '0' && categories.length > 0">
+                <select  [(ngModel)]="selectedCategoryId"    (ngModelChange)="categoryChanged()" class=" "   name="select_funder"  >
+                  <option  value="0"  >Select category</option>
+                  <option  *ngFor="let category of categories"    [value]="category.id" >{{category.label}}</option>
+                </select>
+                </td><td  >
+              <static-autocomplete [(list)] = concepts  [allowDuplicates]=true [showSelected]=false [placeHolderMessage] = "'Concept name'" title = "Concepts"  [multipleSelections]=true  (addItem) = "select($event)" > </static-autocomplete>
+                </td></tr>
+
+              </table>
+              <div *ngIf="loading" class="uk-alert uk-alert-primary" role="alert">Loading communities information...</div>
+              <div *ngIf="error" class="uk-alert uk-alert-warning" role="alert">An error occured while loading communities...</div>
+              <div class="uk-margin-left">
+              <div>Or <a  uk-toggle="target: #browse; animation:  uk-animation-fade"> Browse </a> through categories </div>
+              <div id="browse" class="uk-card uk-card-default uk-card-body uk-margin-small" hidden>
+                  <a uk-toggle="target: #browse; animation:  uk-animation-fade" class="uk-float-right"><span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span></a>
+                  <div *ngIf="selectedCommunityId =='0'"  class="uk-alert uk-alert-warning" >Please select community first...</div>
+                  <div *ngIf="selectedCommunityId !='0'" class="uk-panel uk-panel-scrollable">
+                    <ul   class="uk-list ">
+                      <li>
+                       <span (click)="displaySubcategory(selectedCommunityId)"  >
+                          <span *ngIf="!conceptsClassDisplay[selectedCommunityId]"   class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span>
+
+                          <span *ngIf="conceptsClassDisplay[selectedCommunityId]"   class="uk-icon">
+  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span>{{selectedCommunityLabel}}
+                        </span>
+                        <a *ngIf="!isSelected(selectedCommunityId)"  (click)="addNewContext(selectedCommunityLabel,null,{'id':selectedCommunityId, 'label':selectedCommunityLabel})" class="uk-button-default uk-align-right"  class="uk-icon-button uk-icon">
+  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg> </a>
+                        <ul *ngIf="conceptsClassDisplay[selectedCommunityId]" class="uk-animation-fade" >
+                        <li *ngFor="let category of categories" >
+                          <span (click)="browseConcepts(category.id)"  >
+                          <span *ngIf="!conceptsClassDisplay[category.id]"   class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span>
+
+                          <span *ngIf="conceptsClassDisplay[category.id]"   class="uk-icon">
+  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                          {{category.label}}</span><a *ngIf="!isSelected(category.id)"  (click)="addNewContext(selectedCommunityLabel,category.label,{'id':category.id, 'label':category.label})" class="uk-button-default uk-align-right"  class="uk-icon-button" >
+                          <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                          <div *ngIf="conceptsCategoryLoading[category.id]" class="uk-alert uk-alert-primary" role="alert">Loading category information...</div>
+
+                          <ul *ngIf="conceptsClass[category.id] && conceptsClassDisplay[category.id]" class="uk-list  uk-animation-fade"  id="ul_{{category.id}}"  >
+                            <li *ngFor="let concept1 of conceptsClass[category.id]" >
+                              <span   (click)="displaySubcategory(concept1.id)" >
+                                <span *ngIf="!conceptsClassDisplay[concept1.id] && concept1.concept"   class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span>
+
+                                <span *ngIf="conceptsClassDisplay[concept1.id]  && concept1.concept"   class="uk-icon">
+  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                                {{concept1.label}}
+                               </span>
+                              <a  *ngIf="!isSelected(concept1.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept1)" class="uk-button-default uk-align-right"  class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                                <ul  *ngIf="concept1.concept &&  conceptsClassDisplay[concept1.id] "  class="uk-animation-fade" >
+                                  <li *ngFor="let concept2 of concept1.concept"><span   (click)="displaySubcategory(concept2.id)" >
+                                  <span *ngIf="!conceptsClassDisplay[concept2.id]  && concept2.concept"   class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="8 5 13 10 8 15"></polygon></svg></span>
+
+                                  <span *ngIf="conceptsClassDisplay[concept2.id]  && concept2.concept"   class="uk-icon">
+  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                                  {{concept2.label}}</span>
+                                    <a  *ngIf="!isSelected(concept2.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept2)" class="uk-button-default uk-align-right"  class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                                    <ul  *ngIf="concept2.concept &&  conceptsClassDisplay[concept2.id] " class="uk-animation-fade" >
+                                      <li *ngFor="let concept3 of concept2.concept">{{concept3.label}}
+                                        <a  *ngIf="!isSelected(concept3.id)" (click)="addNewContext(selectedCommunityLabel,category.label,concept3)" class="uk-button-default uk-align-right"  class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                                      </li>
+                                    </ul>
+                                  </li>
+                                </ul>
+                            </li>
+                          </ul>
+                      </li>
+                    </ul>
+                  </ul>
+                </div>
+               </div>
+              </div>
+              <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" role="alert">{{warningMessage}}</div>
+              <div *ngIf="infoMessage.length > 0" class="uk-alert uk-alert-primary" role="alert">{{infoMessage}}</div>
+          </div>
+
+        `
+
+})
+export class ClaimContextSearchFormComponent {
+// @Input() public inline:boolean = false ; // for claimed started from landing pages
+public showComponent:boolean = true ; // for claimed started from landing pages
+@Input() public selectedList;
+//The following need to be kept in case we have to save the current state
+@Input() public projects;
+@Input() public results;
+@Input() public inlineEntity;
+public selectedCommunityId:string = "0";
+public selectedCategoryId:string ="0";
+// @Output() contextSelected = new EventEmitter();
+
+@ViewChild (StaticAutoCompleteComponent) autocomplete : StaticAutoCompleteComponent ;
+
+public query = '';
+public filteredList = [];
+public communities:any;
+public selectedCommunityLabel:string = "Community:";
+
+public categories:any;
+public selectedCategoryLabel:string ="Category:";
+public concepts = [];
+public conceptsClass = [];
+public conceptsClassDisplay = [];
+public conceptsCategoryLoading = [];
+public warningMessage = "";
+public infoMessage = "";
+public loading:boolean = false;
+public error:boolean = false;
+
+ngOnInit() {
+  this.getCommunities();
+}
+constructor(private _contextService: ContextsService,private router: Router) {
+
+}
+
+select($event){
+    var item = $event.value;
+    this.addNewContext( this.selectedCommunityLabel, this.selectedCategoryLabel, item);
+  }
+isSelected(id):boolean{
+  for (var _i = 0; _i < this.selectedList.length; _i++) {
+      let item = this.selectedList[_i];
+      if(item.concept.id == id){
+             return true;
+            // this.warningMessage = "Concept already in selected list";
+      }
+   }
+   return false;
+}
+  addNewContext(community,category,concept){
+    var context: ClaimContext= { community: community, category: category, concept: concept };
+    var found:boolean = false;
+    this.warningMessage = "";
+    if (!this.isSelected(context.concept.id)) {
+
+      this.selectedList.push(context);
+          UIkit.notification({
+              message : 'A new concept is selected.',
+              status  : 'primary',
+              timeout : 1000,
+              pos     : 'top-center'
+          });
+
+    }else{
+      UIkit.notification({
+          message : 'The concept is already on your list.',
+          status  : 'warning',
+          timeout : 1000,
+          pos     : 'top-center'
+      });
+    }
+}
+
+getCommunities ()  {
+  if(!Session.isValidAndRemove()){
+    this.saveStateAndRedirectLogin();
+
+  }else{
+    this.loading = true;
+    var token=Session.getUserJwt();
+    this._contextService.getCommunities().subscribe(
+      data => {
+        this.communities = data.communities;
+        this.loading = false;
+       },
+      err => {
+        console.log(err);
+        this.loading = false;
+        this.error = true;
+      }
+    );
+  }
+ }
+ getCategories ()  {
+   this.loading = true;
+   this.categories=[];
+   if(this.selectedCommunityId != '0'){
+     if(!Session.isValidAndRemove()){
+       this.saveStateAndRedirectLogin();
+
+     }else{
+       var token=Session.getUserJwt();
+       this._contextService.getCategories(this.selectedCommunityId).subscribe(
+         data => {
+
+           this.categories = (Array.isArray(data.category))? data.category:[data.category];
+           this.concepts = [];
+           this.addCommunityInConcepts();
+           this.filteredList = [];
+           if (this.query !== ""){
+             var event = {value: ""};
+             event.value = this.query;
+           }
+           this.loading = false;
+          },
+         err => {
+           console.log(err);
+           this.loading = false;
+         }
+       );
+     }
+   }
+  }
+  getConcepts ()  {
+    this.loading = true;
+    if(this.selectedCategoryId != '0'){
+      if(!Session.isValidAndRemove()){
+        this.saveStateAndRedirectLogin();
+      }else{
+        this.concepts = [];
+        var token=Session.getUserJwt();
+        this._contextService.getConcepts(this.selectedCategoryId, "",true).subscribe(
+          data => {
+
+            this.concepts =data;
+            this.addCommunityInConcepts();
+            if (this.query !== ""){
+              var event = {value: ""};
+              event.value = this.query;
+              //  this.filter(event);
+             }
+             this.loading = false;
+           },
+          err => {
+            console.log(err);
+            this.loading = false;
+          }
+        );
+      }
+    }else{
+      this.concepts=[];
+      this.loading = false;
+    }
+   }
+   displaySubcategory(id)  {
+     if(this.conceptsClassDisplay[id] != null){
+       this.conceptsClassDisplay[id] = !this.conceptsClassDisplay[id];
+
+     }else{
+       this.conceptsClassDisplay[id] = true;
+     }
+   }
+   browseConcepts (categoryId)  {
+       if(!Session.isValidAndRemove()){
+         this.saveStateAndRedirectLogin();
+       }else{
+         if(this.conceptsClass[categoryId] != null){
+           this.conceptsClassDisplay[categoryId] = !this.conceptsClassDisplay[categoryId];
+           return;
+         }else{
+           this.conceptsClassDisplay[categoryId] = true;
+         }
+         this.conceptsClass[categoryId] = [];
+         var token=Session.getUserJwt();
+         this.conceptsCategoryLoading[categoryId] = true;
+         this._contextService.getConcepts(categoryId, "",false).subscribe(
+           data => {
+            var concepts = (Array.isArray(data))? data:[data];
+             for(var i=0;i<concepts.length; i++){
+               console.log("Data"+concepts[i]);
+               if(concepts[i].id.split("::").length==3){
+                 this.conceptsClass[categoryId].push(concepts[i]);
+               }
+             }
+             console.log(this.conceptsClass[categoryId]);
+             this.conceptsCategoryLoading[categoryId] = false;
+            },
+           err => {
+             console.log(err);
+             this.conceptsCategoryLoading[categoryId] = false;
+           }
+         );
+       }
+
+    }
+  communityChanged(){
+    console.log(this.selectedCommunityId +"  ");
+    this.warningMessage = "";
+    this.infoMessage = "";
+    for(var i = 0; i< this.communities.length; i++){
+      if(this.communities[i].id==this.selectedCommunityId){
+        this.selectedCommunityLabel = this.communities[i].label;
+        break;
+      }
+    }
+    this.selectedCategoryId = "0";
+    this.selectedCategoryLabel="Select Category:";
+      this.getCategories();
+  }
+  categoryChanged(){
+    this.warningMessage = "";
+    this.infoMessage = "";
+    for(var i = 0; i< this.categories.length; i++){
+      if(this.categories[i].id==this.selectedCategoryId){
+        this.selectedCategoryLabel = this.categories[i].label;
+        break;
+      }
+    }
+      this.getConcepts();
+  }
+addCommunityInConcepts(){
+   this.concepts.push({"id":this.selectedCommunityId, "label":this.selectedCommunityLabel});
+  this.autocomplete.updateList(this.concepts);
+}
+saveStateAndRedirectLogin(){
+  if(this.projects != null){
+   localStorage.setItem("projects", JSON.stringify(this.projects));
+ }
+ localStorage.setItem("contexts", JSON.stringify(this.selectedList));
+ if(this.results != null){
+   localStorage.setItem("results", JSON.stringify(this.results));
+ }
+ if(this.inlineEntity != null){
+   localStorage.setItem("inlineEntity", JSON.stringify(this.inlineEntity));
+ }
+
+  this.router.navigate(['/user-info'], { queryParams: { "errorCode": ErrorCodes.NOT_VALID, "redirectUrl":  this.router.url } });
+}
+}
diff --git a/claims/claim-utils/claimContextSearchForm.module.ts b/claims/claim-utils/claimContextSearchForm.module.ts
new file mode 100644
index 00000000..345d2c93
--- /dev/null
+++ b/claims/claim-utils/claimContextSearchForm.module.ts
@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../shared/shared.module';
+import { ClaimContextSearchFormComponent } from './claimContextSearchForm.component';
+ import{ContextsServiceModule} from './service/contextsService.module';
+ import {StaticAutocompleteModule} from '../../utils/staticAutoComplete/staticAutoComplete.module';
+ import { RouterModule } from '@angular/router';
+
+@NgModule({
+  imports: [
+    SharedModule,RouterModule,
+     ContextsServiceModule,
+    StaticAutocompleteModule
+
+  ],
+  declarations: [
+    ClaimContextSearchFormComponent
+  ], exports: [ClaimContextSearchFormComponent ]
+})
+export class ClaimContextSearchFormModule { }
diff --git a/claims/claim-utils/claimEntities.class.ts b/claims/claim-utils/claimEntities.class.ts
new file mode 100644
index 00000000..7d866cea
--- /dev/null
+++ b/claims/claim-utils/claimEntities.class.ts
@@ -0,0 +1,100 @@
+//Classes used in linking / inlinelinking when selecting an entity
+export class ClaimResult{
+    public id: string;
+    public type: string;
+    public source: string;
+    public title: string;
+    public url: string;
+    public result: any;
+    public accessRights: string = "OPEN";
+    public embargoEndDate: string;
+    public date: string;
+    public authors: string[] =[];
+    public publisher: string;
+    public description: string;
+    public resourceType:string;
+
+    public static generateResult(item, itemId,itemSource,itemType, itemUrl, itemTitle, date, accessmode){
+
+        var result: ClaimResult = new ClaimResult();
+        result.id = itemId;
+        result.type = itemType;
+        result.source = itemSource;
+
+        result.title = (Array.isArray(itemTitle) && itemTitle.length > 0 )?itemTitle[0]:itemTitle;
+        result.url = itemUrl;
+        result.accessRights = 'OPEN';
+        result.date = date;
+        result.result = item;
+        if(item.publisher){
+          result.publisher = item.publisher;
+        }
+
+         if(itemSource == 'datacite'){
+
+           result.publisher = item.attributes['container-title'];
+           if(item.attributes.author){
+             result.authors =[]
+             for(var i=0; i< item.attributes.author.length; i++){
+               result.authors.push((item.attributes.author[i].family)?item.attributes.author[i].family+', '+item.attributes.author[i].given:item.attributes.author[i].literal);
+             }
+           }
+
+           // result = {id: itemId, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: 'OPEN', embargoEndDate: this.nextDate, date : date};
+         }else if (itemSource == 'openaire'){
+           //TODO put right access rights
+           // result = {id:itemId, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: accessMode, embargoEndDate: this.nextDate, date: date};
+           // result = {id:itemId, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: accessmode, embargoEndDate: this.nextDate, date : date};
+           result.embargoEndDate = accessmode;
+
+         }else if(itemSource == 'crossref'){
+           date = (date == null) ? null : date.substring(0,10);
+           result.date = date;
+           result.resourceType = item.type;
+           result.description = item.abstract;
+           if(item.author){
+             result.authors =[]
+             for(var i=0; i< item.author.length; i++){
+               result.authors.push(item.author[i].family +" "+ item.author[i].given );
+             }
+           }
+           // result = {id: itemId, type :itemType, source : itemSource, title: itemTitle,url: itemUrl, result: item, accessRights: 'OPEN', embargoEndDate: this.nextDate, date: date};
+         }else if (itemSource == 'orcid'){
+           date = (date == null) ? null : date + "-01.-01"
+           result.date = date;
+           if(item['work-type']){
+             result.resourceType = item.type;
+
+           }
+           if(item.contributors){
+             result.authors =[]
+             for(var i=0; i< item.contributors.length; i++){
+               result.authors.push(item.contributors[i]);
+             }
+           }
+
+         }
+         return result;
+       }
+}
+export class ClaimProject{
+    public funderId: string;
+    public funderName: string;
+    public projectId: string;
+    public projectName: string;
+    public projectAcronym: string;
+    public startDate: string;
+    public endDate: string;
+    public code: string;
+    public jurisdiction: string;
+    public fundingLevel0: string;
+
+
+}
+
+export class ClaimContext{
+    public community: string;
+    public category: string;
+    public concept:any;
+
+}
diff --git a/claims/claim-utils/claimProjectSearchForm.component.ts b/claims/claim-utils/claimProjectSearchForm.component.ts
new file mode 100644
index 00000000..9a217dcd
--- /dev/null
+++ b/claims/claim-utils/claimProjectSearchForm.component.ts
@@ -0,0 +1,191 @@
+import {Component, Input,Output, ElementRef, EventEmitter, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {SearchProjectsService} from '../../services/searchProjects.service';
+import {ProjectService} from '../../landingPages/project/project.service';
+// import {ModalLoading} from '../../utils/modal/loading.component';
+import { Subject } from 'rxjs/Subject';
+import {ClaimProject} from './claimEntities.class';
+declare var UIkit:any;
+@Component({
+    selector: 'claim-projects-search-form',
+
+    template: `
+    <div>
+      <form class=" uk-animation uk-card uk-card-default uk-padding uk-padding-large uk-padding-remove-left uk-margin-left uk-grid" uk-grid="">
+
+        <div class="uk-width-auto@m uk-first-column">
+          <select   class=""  [(ngModel)]="selectedFunderId" name="select_funder"  >
+                   <option  value="0" (click)="funderChanged('0','Select funder:')">Select funder:</option>
+                   <option *ngFor="let  funder of funders"  [value]="funder.id" (click)="funderChanged(funder.id,funder.name)">{{(funder.name.split("||").length > 0)?(funder.name.split("||")[0]+" ("+funder.name.split("||")[1]+")"):(funder.name)}}</option>
+          </select>
+        </div>
+        <div class="uk-width-expand@m">
+
+              <entities-autocomplete entityType="project" [funderId]="selectedFunderId"  [allowDuplicates]=true [showSelected]=false [placeHolderMessage] = "'Project name or ID'" title = "Projects"  [multipleSelections]=true  (addItem) = "select($event)" ></entities-autocomplete>
+        </div>
+
+        </form>
+
+    </div>
+        `
+
+})
+export class ClaimProjectsSearchFormComponent {
+   ngOnInit() {
+     this.getFunders();
+   }
+  //  @ViewChild (ModalLoading) loading : ModalLoading ;
+
+  // @Input() public inline: boolean = false ; // for claimed started from landing pages
+  public query = '';
+  @Input() public selectedProjects=[] ;
+  public elementRef;
+
+  public funders:string[];
+  public selectedFunderId:string ="0";
+  selectedFunderName:string ="Select funder:";
+  @Output() projectSelected = new EventEmitter();
+
+  public projects:string[];
+  public warningMessage = "";
+  public infoMessage = "";
+
+  // public searchTermStream = new Subject<string>();
+  // filtered: Observable<{}>   = this.searchTermStream
+  // .debounceTime(300).distinctUntilChanged()
+  // .switchMap((term: string) =>   this._projectService.searchForProjectsObs(term, this.selectedFunderId));
+  public tries:number = 0 ;
+  public keywordlimit = 3;
+
+constructor(private _service: ProjectService, private _projectService: SearchProjectsService, myElement: ElementRef) {
+    this.elementRef = myElement;
+}
+
+
+// search() {
+//   console.info("heeere "+this.query );
+//   this.infoMessage = "";
+//   // this.filtered = [];
+//   if(this.query == ""){
+//     this.tries = 0;
+//     this.warningMessage = "";
+//   } else if(this.query && this.query.length < this.keywordlimit){
+//     this.tries++;
+//     if(this.tries == this.keywordlimit -1 ){
+//       this.warningMessage = "Type at least " + this.keywordlimit + " characters";
+//       this.tries = 0;
+//     }
+//   }else{
+//     console.info("doo the search "+this.query );
+//
+//     this.tries = 0;
+//     this.warningMessage = "";
+//     this.searchTermStream.next(this.query);
+//
+//   }
+//
+// }
+select(item){
+    this.query = "";
+    // this.searchTermStream.next(this.query); //clear
+    item = item.value;
+    var project: ClaimProject = new ClaimProject();
+    project.funderId = (this.selectedFunderId=="0")?item.funderId:this.selectedFunderId;
+    project.funderName = (this.selectedFunderId=="0")?item.funderName:this.selectedFunderName;
+    project.projectId = item.id;
+    project.projectName = item.projectName;
+    project.projectAcronym = item.projectAcronym;
+    project.startDate = item.startDate;
+    project.endDate = item.endDate;
+    project.code = item.code;
+    project.jurisdiction = item.jurisdiction;
+    project.fundingLevel0 = item.fundingLevel0;
+
+    console.log(item);
+
+
+    // this._service.getProjectDates(project.projectId).subscribe(
+    //   data => {
+    //       project.startDate = data.startDate;
+    //       project.endDate = data.endDate;
+    //   },
+    //   err => console.log(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);
+      this.projectSelected.emit({
+        value: true
+      });
+      UIkit.notification({
+          message : 'A new project is selected.',
+          status  : 'primary',
+          timeout : 1000,
+          pos     : 'top-center'
+      });
+    }else{
+      UIkit.notification({
+          message : 'The project is already on your list.',
+          status  : 'warning',
+          timeout : 1000,
+          pos     : 'top-center'
+      });
+    }
+
+}
+showItem(item):string{
+  return ((item.field[1]['@value'])?item.field[1]['@value']+" - ":"" ) + item.field[3]['@value'];
+}
+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);
+
+}
+getFunders ()  {
+  console.info("Getting Funders....");
+  this._projectService.getFunders().subscribe(
+    data => {
+      this.funders = data[1];
+      console.log("this.funders");
+     },
+    err => console.log(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 );
+
+}
+
+}
diff --git a/claims/claim-utils/claimProjectSearchForm.module.ts b/claims/claim-utils/claimProjectSearchForm.module.ts
new file mode 100644
index 00000000..660cb500
--- /dev/null
+++ b/claims/claim-utils/claimProjectSearchForm.module.ts
@@ -0,0 +1,27 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../shared/shared.module';
+import { CommonModule }        from '@angular/common';
+
+import {ClaimProjectsSearchFormComponent} from './claimProjectSearchForm.component';
+// import {LoadingModalModule} from '../../utils/modal/loadingModal.module';
+
+import {ProjectServiceModule} from '../../landingPages/project/projectService.module';
+import {ProjectsServiceModule} from '../../services/projectsService.module';
+import {EntitiesAutocompleteModule} from '../../utils/entitiesAutoComplete/entitiesAutoComplete.module';
+
+ @NgModule({
+  imports: [
+    SharedModule, CommonModule,
+    // LoadingModalModule,
+    ProjectServiceModule, ProjectsServiceModule, EntitiesAutocompleteModule
+  ],
+  providers:[
+  ],
+  declarations: [
+    ClaimProjectsSearchFormComponent
+
+  ],
+  exports: [ClaimProjectsSearchFormComponent ]
+})
+export class ClaimProjectsSearchFormModule { }
diff --git a/claims/claim-utils/claimResultSearchForm.component.html b/claims/claim-utils/claimResultSearchForm.component.html
new file mode 100644
index 00000000..901bb93d
--- /dev/null
+++ b/claims/claim-utils/claimResultSearchForm.component.html
@@ -0,0 +1,222 @@
+
+   <form  class="  uk-padding uk-padding-large uk-padding-remove-left uk-margin-left uk-grid" uk-grid="">
+
+     <select   [(ngModel)]="searchSource" name="select_source" (ngModelChange)="searchSourceChanged(searchSource)"  class="uk-select uk-width-1-4">
+        <option value="openaire">in OpenAIRE </option>
+        <option value="crossref">in Crossref </option>
+        <option value="datacite">in Datacite </option>
+        <option value="orcid">in ORCID </option>
+        <option value="all">Search all</option>
+     </select>
+        <input class=" uk-input uk-width-1-2 form-control" [(ngModel)]="keyword" name="keyword" placeholder="Title, doi, author, orcid..."/>
+        <span class="input-group-btn">
+          <button (click)="search(false)"  type="submit" class=" uk-button uk-button-default">Search</button>
+        </span>
+   </form>
+  <div *ngIf="showSearchResults" class="uk-margin-top uk-animation">
+      <ul class="uk-tab" uk-tab="animation: uk-animation-fade">
+        <li *ngIf="searchSource == 'all' || searchSource == 'openaire'" (click)="clickTab('openairePub')" ><a>Publications <span  class="uk-badge uk-badge-notification">{{   (openairePubsNum)?openairePubsNum:0 }}</span></a></li>
+        <li *ngIf="searchSource == 'all' || searchSource == 'openaire'" (click)="clickTab('openaireData')" ><a>Research Data <span  class="uk-badge uk-badge-notification">{{(openaireDataNum==null)?'0':openaireDataNum}}</span></a></li>
+        <li *ngIf="searchSource == 'all' || searchSource == 'openaire'" (click)="clickTab('openaireSoftware')" ><a>Software <span  class="uk-badge uk-badge-notification">{{(openaireSoftwareNum==null)?'0':openaireSoftwareNum}}</span></a></li>
+        <li *ngIf="searchSource == 'all' || searchSource == 'crossref'" (click)="clickTab('crossref')" ><a>Crossref <span  class="uk-badge uk-badge-notification">{{(crossrefResultsNum)?crossrefResultsNum:0}}</span></a></li>
+        <li *ngIf="searchSource == 'all' || searchSource == 'datacite'" (click)="clickTab('datacite')"><a>Datacite <span  class="uk-badge uk-badge-notification">{{(dataciteResultsNum==null)?'0':dataciteResultsNum}}</span></a></li>
+        <li *ngIf="searchSource == 'all' || searchSource == 'orcid'" (click)="clickTab('orcid')"><a>Orcid  <span  class="uk-badge uk-badge-notification">{{(orcidResultsNum)?orcidResultsNum:0}}</span></a></li>
+      </ul>
+
+        <div *ngIf="activeTab == 'crossref'" id="crossref" >
+          <div  class="uk-margin-top" >
+            <div *ngIf="crossrefStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="crossrefStatus != errorCodes.LOADING && crossrefResults.length == 0" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
+            <div *ngIf="crossrefStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
+            <div *ngIf="crossrefStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
+             <div *ngIf="crossrefResultsNum != null && crossrefResultsNum > 0" class="uk-clearfix">
+               <div class="uk-float-right">
+               <paging-no-load [currentPage]="crossrefPage" [totalResults]="crossrefResultsNum"   [term]="keyword" [size]="size"  (pageChange)="crossrefPageChange($event)"> </paging-no-load>
+             </div>
+             </div>
+             <div >
+               <ul *ngIf="crossrefResults.length > 0 "  class="uk-list uk-list-divider">
+                  <li *ngFor=" let item of crossrefResults " [class]="(isSelected(item.DOI))?'uk-block-muted':''">
+                   <div >
+                    <a *ngIf="item.URL" target="_blank" href="{{item.URL}}" > <span class="custom-external"></span> {{item.title}}</a>
+                    <span *ngIf="!item.URL" >{{item.title}}</span>
+                    <a class="uk-button-default uk-align-right" *ngIf="!isSelected(item.DOI)" (click)="add(item, item.DOI, 'crossref', 'publication', item.URL, item.title, item.created['date-time'],'OPEN')" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                  </div>
+                  <span *ngIf="item.publisher" class="uk-article-meta">Publisher: {{item.publisher}}</span><span  class="uk-article-meta" *ngIf="(item['published-print'] && item['published-print']['date-parts'] && item['published-print']['date-parts'][0])">({{(item['published-print']['date-parts'][0][0])?item['published-print']['date-parts'][0][0]:item['published-print']['date-parts'][0]}})</span>
+                  <div *ngIf="item.author && item.author.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of item.author.slice(0,10)  let i = index">{{author.family}} {{author.given}}{{(i < (item.author.slice(0,10).length-1))?"; ":""}}{{(i == item.author.slice(0,10).length-1 && item.author.length > 10)?"...":""}}</span></div>
+                  <div *ngIf="item.editor && item.editor.length > 0" class="uk-article-meta">Editors: <span *ngFor="let author of item.editor.slice(0,10)  let i = index">{{author.family}} {{author.given}}{{(i < (item.editor.slice(0,10).length-1))?"; ":""}}{{(i == item.editor.slice(0,10).length-1 && item.editor.length > 10)?"...":""}}</span></div>
+                 </li>
+             </ul>
+           </div>
+          </div>
+        </div>
+        <div   *ngIf="activeTab == 'openairePub'" id="openairePubs" class="uk-animation-fade" >
+          <div class = "uk-margin-top">
+            <div *ngIf="openairePubsStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="openairePubsStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
+            <div *ngIf="openairePubsStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
+            <div *ngIf="openairePubsStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
+            <div *ngIf="openairePubsNum != null && openairePubsNum > 0" class="uk-clearfix">
+              <div class="uk-float-right">
+                  <paging-no-load [currentPage]="openairePubsPage" [totalResults]="openairePubsNum"   [term]="keyword" [size]="size"  (pageChange)="openairePubsPageChange($event)"> </paging-no-load>
+                </div>
+            </div>
+            <div >
+              <ul *ngIf="openairePubs.length > 0 "  class="uk-list uk-list-divider">
+                 <li *ngFor=" let result of openairePubs " [class]="(isSelected(result.id))?'uk-block-muted':''">
+                  <div >
+                   <a *ngIf="result['title'].url" target="_blank" [href]="result['title'].url" >{{result['title'].name}}</a>
+                   <span *ngIf="!result['title'].url" >{{result['title'].name}}</span>
+                   <a *ngIf="!isSelected(result.id)" (click)="add(result, result.id, 'openaire', 'publication', result['title'].url, result['title'].name, result.year,result['title'].accessMode)" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                 </div>
+                 <span  *ngIf="result.publisher" class="uk-article-meta">Publisher: {{result.publisher}}</span><span  class="uk-article-meta" *ngIf="(result.year)">({{result.year}})</span>
+                 <div *ngIf="result.authors && result.authors.length >0 " class="uk-article-meta">Authors: <span *ngFor="let author of result.authors.slice(0,10) let i = index">{{author}}{{(i < (result.authors.slice(0,10).length-1))?"; ":""}}{{(i == result.authors.slice(0,10).length-1 && result.authors.length > 10)?"...":""}}</span></div>
+
+
+                </li>
+            </ul>
+          </div>
+         </div>
+       </div>
+        <div  *ngIf="activeTab == 'orcid'" id="orcid" class="uk-animation-fade">
+          <div class="uk-margin-top" >
+            <div *ngIf="orcidStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="orcidStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
+            <div *ngIf="orcidStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
+            <div *ngIf="orcidStatus == errorCodes.NONE && (!authorIds ||authorIds.length == 0)" class = "uk-alert uk-alert-primary " > No results found  </div>
+
+             <div *ngIf="orcidResultsNum != null" class="panel-body">
+               <span>Results for
+                 <a target="_blank" href="http://orcid.org/{{authorId}}"> <span class="custom-external"></span>  {{authorGivenName}} {{authorFamilyName}} - {{authorId}}  </a> :
+               </span>
+               <div class = "uk-alert uk-alert-warning " >  Not the author you are looking for?
+
+                 <span class="dropdown">
+
+                   <select   [(ngModel)]="selectAuthorId" name="select_author" (ngModelChange)="getOrcidResultsById(selectAuthorId)"  >
+                      <option   [value]="0">Choose another one: </option>
+                      <option *ngFor=" let item of authorIds let i = index"   [value]="authorIds[i]">{{authorGivenNames[i]}} {{authorFamilyNames[i]}} : {{item}} </option>
+                   </select>
+                 </span>
+
+
+               </div>
+
+
+                 <div *ngIf=" ((orcidResultsNum >0) && (totalPages > 1) && ( 0 < page &&  page <= totalPages )) "  class="uk-clearfix">
+                   <div class="uk-float-right">
+                     <paging-no-load [currentPage]="orcidPage" [totalResults]="orcidResultsNum"   [term]="keyword" [size]="size"  (pageChange)="orcidPageChange($event)"> </paging-no-load>
+                  </div>
+
+                 </div>
+                       <div >
+                        <ul *ngIf="orcidResultsNum >0  && orcidResultsToShow.length > 0 "  class="uk-list uk-list-divider">
+                           <li *ngFor=" let item of orcidResultsToShow "  [class]="(isSelected(authorId+'-'+item['put-code']))?'uk-block-muted':''">
+                             <div>
+                              <span *ngIf="!item.URL" >{{item['work-title']['title'].value}}</span>
+                              <a class="uk-button-default uk-align-right" *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,'OPEN')" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                            </div>
+                            <span  *ngIf="item['journal-title'] && item['journal-title'].value " class="uk-article-meta">Journal: {{item['journal-title'].value}}</span><span  class="uk-article-meta" *ngIf="(item['publication-date']&&item['publication-date'].year&&item['publication-date'].year.value)"> ({{item['publication-date'].year.value}})</span>
+                            <div *ngIf="item.contributors && item.contributors.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of item.contributors.slice(0,10) let i = index">{{author}}{{(i < (item.contributors.slice(0,10).length-1))?"; ":""}}{{(i == item.contributors.slice(0,10).length-1 && item.contributors.length > 10)?"...":""}}</span></div>
+
+                          </li>
+                        </ul>
+                        <div *ngIf="orcidResultsNum == 0" class = "uk-alert uk-alert-primary " > No results found  </div>
+                      </div>
+             </div>
+           </div>
+         </div>
+         <div  *ngIf="activeTab == 'datacite'" id="datacite" class="uk-animation-fade">
+           <div *ngIf="dataciteStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+           <div *ngIf="dataciteStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
+           <div *ngIf="dataciteStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
+           <div *ngIf="dataciteStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
+            <div class = "uk-margin-top">
+               <div *ngIf="dataciteResultsNum != null && dataciteResultsNum > 0" class="uk-clearfix">
+                  <div class="uk-float-right">
+                   <paging-no-load [currentPage]="datacitePage" [totalResults]="dataciteResultsNum"   [term]="keyword" [size]="size"  (pageChange)="datacitePageChange($event)"> </paging-no-load>
+                  </div>
+               </div>
+               <div >
+                   <ul *ngIf="dataciteResults.length > 0 "  class="uk-list uk-list-divider">
+                      <li *ngFor=" let item of dataciteResults "  [class]="(isSelected(item.attributes.doi))?'uk-block-muted':''" >
+                       <div >
+                        <a *ngIf="item.attributes.doi" target="_blank" href="{{'http://dx.doi.org/'+item.attributes.doi}}" > <span class="custom-external"></span> {{item.attributes.title}}</a>
+                        <span *ngIf="!item.attributes.doi" >{{item.attributes.title}}</span>
+                        <a class="uk-button-default uk-align-right" *ngIf="!isSelected(item.attributes.doi)" (click)="add(item, item.attributes.doi,'datacite','dataset', 'http://dx.doi.org/'+item.attributes.doi, item.attributes.title, item.attributes.published,'OPEN')" class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></a>
+
+                      </div>
+                      <span  *ngIf="item.attributes['container-title']" class="uk-article-meta">Publisher: {{item.attributes['container-title']}}</span><span *ngIf="(item.attributes.published)" class="uk-article-meta">({{item.attributes.published}})</span>
+                      <div *ngIf="item.attributes.author && item.attributes.author.length > 0" class="uk-article-meta">Authors:
+                         <span *ngFor="let author of item.attributes.author.slice(0,10) let i = index">{{(author.family)?author.family+', '+author.given:author.literal}}{{(i < (item.attributes.author.slice(0,10).length-1))?"; ":""}}{{(i == item.attributes.author.slice(0,10).length-1 && item.attributes.author.length > 10)?"...":""}}</span></div>
+
+                     </li>
+                 </ul>
+
+               </div>
+            </div>
+          </div>
+          <div  *ngIf="activeTab == 'openaireData'" id="openaireData" class="uk-animation-fade">
+            <div *ngIf="openaireDataStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+            <div *ngIf="openaireDataStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
+            <div *ngIf="openaireDataStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
+            <div *ngIf="openaireDataStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
+            <div class = "uk-margin-top">
+              <div *ngIf="openaireDataNum != null && openaireDataNum > 0" class="uk-clearfix">
+                <div class="uk-float-right">
+                <paging-no-load [currentPage]="openaireDataPage" [totalResults]="openaireDataNum"   [term]="keyword" [size]="size"  (pageChange)="openaireDataPageChange($event)"> </paging-no-load>
+                </div>
+              </div>
+              <div >
+                <ul *ngIf="openaireData.length > 0 "  class="uk-list uk-list-divider">
+                   <li *ngFor=" let result of openaireData " [class]="(isSelected(result.id))?'uk-block-muted':''">
+                    <div >
+                     <a *ngIf="result['title'].url" target="_blank" [href]="result['title'].url" >{{result['title'].name}}</a>
+                     <span *ngIf="!result['title'].url" >{{result['title'].name}}</span>
+
+
+                     <a class="uk-button-default uk-align-right" *ngIf="!isSelected(result.id)"
+                     (click)="add(result, result.id,  'openaire','dataset',  result['title'].url, result['title'].name, result.year, result['title'].accessMode)"  class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect>
+                       <rect x="1" y="9" width="17" height="1"></rect></svg></a>
+                   </div>
+                    <span  *ngIf="result.publisher" class="uk-article-meta">Publisher: {{result.publisher}}</span><span *ngIf="(result.year)" class="uk-article-meta">({{result.year}})</span>
+                    <div *ngIf="result.authors && result.authors.length >0 " class="uk-article-meta">Authors: <span *ngFor="let author of result.authors.slice(0,10) let i = index">{{author}}{{(i < (result.authors.slice(0,10).length-1))?"; ":""}}{{(i == result.authors.slice(0,10).length-1 && result.authors.length > 10)?"...":""}}</span></div>
+
+
+                  </li>
+              </ul>
+             </div>
+           </div>
+      </div>
+      <div  *ngIf="activeTab == 'openaireSoftware'" id="openaireSoftware" class="uk-animation-fade">
+        <div *ngIf="openaireSoftwareStatus == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <div *ngIf="openaireSoftwareStatus == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
+        <div *ngIf="openaireSoftwareStatus == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
+        <div *ngIf="openaireSoftwareStatus == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service not available</div>
+        <div class = "uk-margin-top">
+          <div *ngIf="openaireSoftwareNum != null && openaireSoftwareNum > 0" class="uk-clearfix">
+            <div class="uk-float-right">
+            <paging-no-load [currentPage]="openaireSoftwarePage" [totalResults]="openaireSoftwareNum"   [term]="keyword" [size]="size"  (pageChange)="openaireSoftwarePageChange($event)"> </paging-no-load>
+            </div>
+          </div>
+          <div >
+            <ul *ngIf="openaireSoftware.length > 0 "  class="uk-list uk-list-divider">
+               <li *ngFor=" let result of openaireSoftware " [class]="(isSelected(result.id))?'uk-block-muted':''">
+                <div >
+                 <a *ngIf="result['title'].url" target="_blank" [href]="result['title'].url" >{{result['title'].name}}</a>
+                 <span *ngIf="!result['title'].url" >{{result['title'].name}}</span>
+
+
+                 <a class="uk-button-default uk-align-right" *ngIf="!isSelected(result.id)"
+                 (click)="add(result, result.id,  'openaire','software',  result['title'].url, result['title'].name, result.year, result['title'].accessMode)"  class="uk-icon-button"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect>
+                   <rect x="1" y="9" width="17" height="1"></rect></svg></a>
+               </div>
+                <span  *ngIf="result.publisher" class="uk-article-meta">Publisher: {{result.publisher}}</span><span *ngIf="(result.year)" class="uk-article-meta">({{result.year}})</span>
+                <div *ngIf="result.authors && result.authors.length >0 " class="uk-article-meta">Authors: <span *ngFor="let author of result.authors.slice(0,10) let i = index">{{author}}{{(i < (result.authors.slice(0,10).length-1))?"; ":""}}{{(i == result.authors.slice(0,10).length-1 && result.authors.length > 10)?"...":""}}</span></div>
+
+              </li>
+          </ul>
+         </div>
+       </div>
+  </div>
+    </div>
diff --git a/claims/claim-utils/claimResultSearchForm.component.ts b/claims/claim-utils/claimResultSearchForm.component.ts
new file mode 100644
index 00000000..adb95fab
--- /dev/null
+++ b/claims/claim-utils/claimResultSearchForm.component.ts
@@ -0,0 +1,643 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import {SearchCrossrefService} from '../claim-utils/service/searchCrossref.service';
+import {SearchOrcidService} from '../claim-utils/service/searchOrcid.service';
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import { SearchDataciteService } from '../claim-utils/service/searchDatacite.service';
+import {SearchDatasetsService} from '../../services/searchDatasets.service';
+import {SearchSoftwareService} from '../../services/searchSoftware.service';
+
+import { ErrorCodes} from '../../utils/properties/openaireProperties';
+import {ClaimResult} from '../claim-utils/claimEntities.class';
+import{DOI} from '../../utils/string-utils.class';
+declare var UIkit:any;
+
+@Component({
+    selector: 'claim-result-search-form',
+    templateUrl: 'claimResultSearchForm.component.html',
+
+})
+export class ClaimResultSearchFormComponent {
+  constructor (private _searchDataciteService: SearchDataciteService, private _searchDatasetsService:SearchDatasetsService, private _searchSoftwareService:SearchSoftwareService,
+    private _searchCrossrefService: SearchCrossrefService,private _searchOrcidService: SearchOrcidService, private _searchPublicationsService: SearchPublicationsService,
+    private route: ActivatedRoute) {
+    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.search(false);
+    }
+}
+
+
+  page : number = 1;
+  size:number = 5;
+  navigateTo: string = "Search";
+  source: string = "datacite";
+  type : string = "dataset";
+  showSearchResults:boolean=false;
+  // searchType ="publication";
+  @Input() public select:boolean = true ;
+  @Input() public keyword:string = '';
+  @Input() public selectedResults:ClaimResult[];
+  // @Output() datasetsChange = new EventEmitter();
+  // @Output() publicationsChange = new EventEmitter();
+
+  // @Output() resultsChange = new EventEmitter();
+
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    dataciteResults=[];
+    dataciteResultsNum:number = null;
+    // dataciteResultsNum : Observable<number> = null;
+    dataciteStatus = this.errorCodes.NONE;
+    datacitePage : number = 1;
+
+    openaireData=[];
+    openaireDataNum:number = 0 ;
+    openaireDataStatus = this.errorCodes.NONE;
+    openaireDataPage : number = 1;
+    openaireSoftware=[];
+    openaireSoftwareNum:number = 0 ;
+    openaireSoftwareStatus = this.errorCodes.NONE;
+    openaireSoftwarePage : number = 1;
+
+    public warningMessage = "";
+    public infoMessage = "";
+
+    public todayDate = '';
+    public nextDate = '';
+    public DOIs:string[] = [];
+    sub: any;
+    public searchSource:string = "openaire"
+    public activeTab:string = "openairePub"
+
+
+    crossrefResults=[];
+    crossrefResultsNum : number = null;
+    crossrefPage : number = 1;
+    crossrefStatus:number = this.errorCodes.NONE;
+
+    openairePubs = [];
+    openairePubsNum: number ;
+    openairePubsPage : number = 1;
+    openairePubsStatus:number = this.errorCodes.NONE;
+
+    orcidResults: string[];
+    orcidResultsNum: number ;
+    totalPages: number;
+    orcidResultsToShow: string[];
+    orcidPage : number = 1;
+    orcidStatus:number = this.errorCodes.NONE;
+    authorId: string;
+    selectAuthorId: string = "0";
+    authorGivenName: string;
+    authorFamilyName: string;
+
+    authorIds: string[];
+    authorGivenNames: string[];
+    authorFamilyNames: string[];
+
+    authorsNum : number ;
+
+    reloadOpenaire:boolean = true;
+    reloadCrossref:boolean = false;
+    reloadDatacite:boolean = false;
+    reloadOrcid:boolean = false;
+
+
+
+
+  search(sourceChanged){
+    this.warningMessage = "";
+    this.infoMessage = "";
+    if(!sourceChanged){
+      this.DOIs = DOI.getDOIsFromString(this.keyword);
+      this.reloadOpenaire = true;
+      this.reloadCrossref = true;
+      this.reloadDatacite = true;
+      this.reloadOrcid = true;
+    }
+    if((this.searchSource == "all" || this.searchSource == "openaire") && this.reloadOpenaire){
+      this.searchOpenairePubs(this.keyword, this.size, 1);
+      this.searchOpenaireData(this.keyword,this.size,1);
+      this.searchOpenaireSoftware(this.keyword,this.size,1);
+      this.reloadOpenaire = false;
+    }
+    if((this.searchSource == "all" || this.searchSource == "crossref")&&this.reloadCrossref){
+      this.getCrossrefResults(this.keyword, this.size,1);
+      this.reloadCrossref = false;
+    }
+    if((this.searchSource == "all" || this.searchSource == "datacite")&& this.reloadDatacite){
+      this.searchDatacite(this.keyword,this.size,1);
+      this.reloadDatacite = false;
+    }
+    if((this.searchSource == "all" || this.searchSource == "orcid")&& this.reloadOrcid){
+      this.searchOrcid(this.keyword);
+      this.reloadOrcid = false;
+    }
+    this.showSearchResults = true;
+
+  }
+
+private   getCrossrefResults (term: string, size : number, page : number)  {
+    this.crossrefStatus = this.errorCodes.LOADING;
+    if( this.DOIs.length > 0 ){
+      this._searchCrossrefService.searchCrossrefByDOIs(this.DOIs).subscribe(
+        data => {
+            if(data != null) {
+                this.crossrefResults = data.items;
+                this.crossrefPage=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.crossrefPage=page;
+                                this.crossrefResultsNum = data['total-results'];
+                                this.crossrefStatus = this.errorCodes.DONE;
+
+                            }else{
+                              this.crossrefStatus = this.errorCodes.ERROR;
+                            }
+                        },
+                        err =>{
+                           console.log(err.status);
+                           this.crossrefStatus = this.errorCodes.ERROR;
+                         }
+
+                    );
+                }else{
+                  this.crossrefStatus = this.errorCodes.DONE;
+                }
+            }
+         },
+        err => {
+          //console.log(err);
+          this._searchCrossrefService.searchCrossrefResults(term, size, page).subscribe(
+            data => {
+              this.crossrefResults = data.items;
+              this.crossrefPage=page;
+              this.crossrefResultsNum = data['total-results'];
+              this.crossrefStatus = this.errorCodes.DONE;
+
+             },
+            err => {
+              console.log(err.status);
+              this.crossrefStatus = this.errorCodes.ERROR;
+            }
+
+          );
+        }
+      );
+
+    }else{
+
+
+      this._searchCrossrefService.searchCrossrefResults(term, size, page).subscribe(
+        data => {
+            if(data != null) {
+                this.crossrefResults = data.items;
+                this.crossrefPage=page;
+                this.crossrefResultsNum = data['total-results'];
+                this.crossrefStatus = this.errorCodes.DONE;
+
+            }else{
+              this.crossrefStatus = this.errorCodes.ERROR;
+            }
+
+         },
+        err => {
+          console.log(err.status);
+          this.crossrefStatus = this.errorCodes.ERROR;
+          }
+      );
+    }
+  }
+  private searchOpenairePubs(term: string, size : number, page : number)  {
+
+          if(this.DOIs.length > 0 ){
+            this.openairePubsStatus = this.errorCodes.LOADING;
+            this._searchPublicationsService.searchPublicationsByDois(this.DOIs, null, page, size, []).subscribe(
+              data => {
+                  if(data != null) {
+                      this.openairePubsPage=page;
+                      this.openairePubsNum = data[0];
+                      this.openairePubs = data[1];
+                      this.openairePubsStatus = this.errorCodes.DONE;
+                      if(this.openairePubsNum == 0){
+                        this.openairePubsStatus = this.errorCodes.NONE;
+                      }
+                  }else {
+                    this.openairePubsStatus = this.errorCodes.ERROR;
+                  }
+               },
+              err => {
+                this.openairePubsStatus = this.errorCodes.ERROR;
+                console.log(err.status);
+              }
+            );
+          }else{
+            this.openairePubsStatus = this.errorCodes.LOADING;
+            this._searchPublicationsService.searchPublications('q='+term, null, page, size, []).subscribe(
+              data => {
+                  if(data != null) {
+                      this.openairePubsPage=page;
+                      this.openairePubsNum = data[0];
+                      this.openairePubs = data[1];
+                      this.openairePubsStatus = this.errorCodes.DONE;
+                      if(this.openairePubsNum == 0){
+                        this.openairePubsStatus = this.errorCodes.NONE;
+                      }
+                  }else {
+                    this.openairePubsStatus = this.errorCodes.ERROR;
+                  }
+               },
+              err => {
+                this.openairePubsStatus = this.errorCodes.ERROR;
+                console.log(err.status);
+              }
+            );
+          }
+  }
+
+  private searchOrcid (term: string) {
+    if(this.DOIs.length > 0){
+      this.orcidStatus = this.errorCodes.NONE;
+      return;
+    }
+    this.orcidStatus = this.errorCodes.LOADING;
+    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.getOrcidResultsByIndex(0);
+          }
+
+          this.orcidStatus = this.errorCodes.NONE;
+
+        },
+        err => this.errorHandler(err, term)
+
+      );
+    }
+
+    private  errorHandler(err: any, term: string) {
+      if(err.status == 404){
+        this.getOrcidAuthors(term);
+      } else {
+        this.orcidStatus = this.errorCodes.ERROR;
+        console.log(err.status);
+
+      }
+    }
+
+    private  getOrcidAuthors (term: string)  {
+      this.orcidResultsNum = null;
+      this.selectAuthorId = "0";
+          this.orcidStatus = this.errorCodes.LOADING;
+      //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.getOrcidResultsByIndex(0);
+            }else{
+              this.orcidStatus = this.errorCodes.ERROR;
+            }
+
+          },
+          err => {
+            this.orcidStatus = this.errorCodes.ERROR;
+            console.log(err.status);
+          }
+        );
+      }
+
+
+      private    getOrcidResultsByIndex (index:number) {
+        if(this.authorIds.length > index) {
+          this.orcidStatus = this.errorCodes.LOADING;
+          let id = this.authorIds[index];
+          this.authorGivenName = this.authorGivenNames[index];
+          this.authorFamilyName = this.authorFamilyNames[index];
+          this.getOrcidResultsById(id);
+        }
+      }
+      private    getOrcidResultsById (id:string) {
+          if(id=="0"){
+            return;
+          }
+          var index = this.authorIds.indexOf(id);
+          this.authorGivenName = this.authorGivenNames[index];
+          this.authorFamilyName = this.authorFamilyNames[index];
+          this.authorId = id;
+          console.info("getOrcidResultsById: "+id);
+            this.orcidStatus = this.errorCodes.LOADING;
+          this._searchOrcidService.searchOrcidPublications(id).subscribe(
+            data => {
+              if(data != null) {
+                this.orcidResults=data['orcid-work'];
+                this.orcidResultsNum = data['orcid-work'].length;
+                this.orcidPage = 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);
+
+                this.orcidStatus = this.errorCodes.DONE;
+                if(this.orcidResultsNum == 0){
+                  this.orcidStatus = this.errorCodes.NONE;
+                }
+              } else {
+                this.orcidResultsNum = 0;
+                this.totalPages=0;
+                this.orcidStatus = this.errorCodes.NONE;
+              }
+
+            },
+            err => {
+              console.log(err.status);
+              this.orcidStatus = this.errorCodes.ERROR;
+            }
+          );
+
+
+      }
+
+/*
+Is it USED???
+private  remove(item){
+     this.warningMessage = "";
+     this.infoMessage = "";
+        var index:number =this.selectedResults.indexOf(item);
+        item.selected=false;
+         if (index > -1) {
+            this.selectedResults.splice(index, 1);
+            // this.publicationsChange.emit({
+            //   value: this.selectedResults
+            // });
+        }
+
+   }*/
+private crossrefPageChange($event) {
+     this.crossrefPage=$event.value;
+     this.crossrefResults=[];
+     console.log("Crossref chaenged "+this.crossrefPage);
+     this.getCrossrefResults(this.keyword,this.size,this.crossrefPage);
+}
+private orcidPageChange($event) {
+     this.orcidPage=$event.value;
+     this.orcidResultsToShow=[];
+     this.orcidResultsToShow = this.orcidResults.slice(($event.value-1)*this.size, $event.value*this.size);
+}
+private openairePubsPageChange($event) {
+     this.openairePubsPage=$event.value;
+     this.searchOpenairePubs(this.keyword,this.size,this.openairePubsPage);
+}
+datacitePageChange($event) {
+  this.datacitePage=$event.value;
+  this.dataciteResults=[];
+  this.searchDatacite(this.keyword,10,this.datacitePage);
+  this.warningMessage = "";
+  this.infoMessage = "";
+
+}
+openaireDataPageChange($event) {
+  this.openaireDataPage=$event.value;
+  this.openaireData=[];
+  this.searchOpenaireData(this.keyword,10,this.openaireDataPage);
+  this.warningMessage = "";
+  this.infoMessage = "";
+
+}
+openaireSoftwarePageChange($event) {
+  this.openaireSoftwarePage=$event.value;
+  this.openaireSoftware=[];
+  this.searchOpenaireSoftware(this.keyword,10,this.openaireSoftwarePage);
+  this.warningMessage = "";
+  this.infoMessage = "";
+
+}
+
+  private   isSelected(id:string){
+
+      var found:boolean = false;
+      this.warningMessage = "";
+      for (var _i = 0; _i < this.selectedResults.length; _i++) {
+          let item = this.selectedResults[_i];
+          if(item.id == id){
+                found=true;
+                this.warningMessage = "Publication already in selected list";
+          }
+       }
+       return found;
+
+
+    }
+    // isSelected(id:string){
+    //
+    //   var found:boolean = false;
+    //   this.warningMessage = "";
+    //   for (var _i = 0; _i < this.selectedResults.length; _i++) {
+    //       let item = this.selectedResults[_i];
+    //       if(item.id == id){
+    //             found=true;
+    //             break;
+    //        }
+    //    }
+    //    return found;
+    // }
+    private searchDatacite (term: string, size : number, page : number) {
+      this.getDataciteResults(term,size,page);
+      this.warningMessage = "";
+      this.infoMessage = "";
+
+     }
+     private searchOpenaireData (term: string, size : number, page : number) {
+       if(this.DOIs.length > 0 ){
+         this.openaireDataStatus = this.errorCodes.LOADING;
+         this._searchDatasetsService.searchDatasetsByDois(this.DOIs, null, page, size, []).subscribe(
+           data => {
+               if(data != null) {
+                   this.openaireDataPage=page;
+                   this.openaireDataNum = data[0];
+                   this.openaireData = data[1];
+                   this.openaireDataStatus = this.errorCodes.DONE;
+                   if(this.openaireDataNum == 0){
+                      this.openaireDataStatus = this.errorCodes.NONE;
+                   }
+               }
+            },
+           err => {
+             this.openaireDataStatus = this.errorCodes.ERROR;
+             console.log(err.status);
+           }
+         );
+       }else{
+         this._searchDatasetsService.searchDatasets('q='+term+'', null, page, size, []).subscribe(
+                     data => {
+                         if(data != null) {
+                             this.openaireDataPage=page;
+                             this.openaireDataNum = data[0];
+                             this.openaireData = data[1];
+                             this.openaireDataStatus = this.errorCodes.DONE;
+                             if(this.openaireDataNum == 0){
+                                this.openaireDataStatus = this.errorCodes.NONE;
+                             }
+                         }
+                      },
+                     err => {
+                       this.openaireDataStatus = this.errorCodes.ERROR;
+                       console.log(err.status);
+                     }
+                   );
+                }
+       this.warningMessage = "";
+       this.infoMessage = "";
+
+      }
+      private searchOpenaireSoftware (term: string, size : number, page : number) {
+        if(this.DOIs.length > 0 ){
+          this.openaireSoftwareStatus = this.errorCodes.LOADING;
+          this._searchSoftwareService.searchSoftwareByDois(this.DOIs, null, page, size, []).subscribe(
+            data => {
+                if(data != null) {
+                    this.openaireSoftwarePage=page;
+                    this.openaireSoftwareNum = data[0];
+                    this.openaireSoftware = data[1];
+                    this.openaireSoftwareStatus = this.errorCodes.DONE;
+                    if(this.openaireSoftwareNum == 0){
+                       this.openaireSoftwareStatus = this.errorCodes.NONE;
+                    }
+                }
+             },
+            err => {
+              this.openaireSoftwareStatus = this.errorCodes.ERROR;
+              console.log(err.status);
+            }
+          );
+        }else{
+          this._searchSoftwareService.searchSoftware('q='+term+'', null, page, size, []).subscribe(
+                      data => {
+                          if(data != null) {
+                              this.openaireSoftwarePage=page;
+                              this.openaireSoftwareNum = data[0];
+                              this.openaireSoftware = data[1];
+                              this.openaireSoftwareStatus = this.errorCodes.DONE;
+                              if(this.openaireSoftwareNum == 0){
+                                 this.openaireSoftwareStatus = this.errorCodes.NONE;
+                              }
+                          }
+                       },
+                      err => {
+                        this.openaireSoftwareStatus = this.errorCodes.ERROR;
+                        console.log(err.status);
+                      }
+                    );
+                 }
+        this.warningMessage = "";
+        this.infoMessage = "";
+
+       }
+   private getDataciteResults (term: string, size : number, page : number)  {
+       this._searchDataciteService.searchDataciteResults(term, size, page).subscribe(
+        data => {
+          this.dataciteResults = data.data;
+          this.datacitePage=page;
+          this.dataciteResultsNum = data.meta.total;
+          this.dataciteStatus = this.errorCodes.DONE;
+
+
+        },
+        err => {
+          this.dataciteStatus = this.errorCodes.ERROR;
+          console.log(err);
+        }
+
+      );
+      }
+
+   add(item, itemId,itemSource,itemType, itemUrl, itemTitle, date, accessmode){
+
+     console.log(' adding ' + itemType + " From " + itemSource+"  "+ itemTitle);
+     var result: ClaimResult = ClaimResult.generateResult(item, itemId,itemSource,itemType, itemUrl, itemTitle, date, accessmode);
+
+
+    if (itemSource == 'orcid'){
+        if(result.authors.length ==0 ){
+          result.authors.push(this.authorGivenName + ', '+ this.authorFamilyName);
+        }
+      }
+      var found:boolean = this.isSelected( result.id);
+
+      this.warningMessage = "";
+       if (!found) {
+        this.selectedResults.push(result);
+
+               UIkit.notification({
+                  message : 'A new research result is selected.',
+                  status  : 'primary',
+                  timeout : 1000,
+                  pos     : 'top-center'
+              });
+
+
+      }else{
+        this.warningMessage = "Research Data already in selected list";
+        UIkit.notification({
+            message : 'The  research result is already on your list.',
+            status  : 'warning',
+            timeout : 1000,
+            pos     : 'top-center'
+        });
+      }
+
+    }
+
+    public searchSourceChanged(source){
+      this.searchSource = source;
+      this.activeTab = (source == "openaire" || source == "all")?"openairePub":source;
+      if(this.keyword && this.keyword.length > 0){
+        this.search(true);
+      }
+    }
+    public clickTab(tab){
+       this.activeTab = tab;
+    }
+}
diff --git a/claims/claim-utils/claimResultSearchForm.module.ts b/claims/claim-utils/claimResultSearchForm.module.ts
new file mode 100644
index 00000000..99b4fd65
--- /dev/null
+++ b/claims/claim-utils/claimResultSearchForm.module.ts
@@ -0,0 +1,29 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../shared/shared.module';
+import { CommonModule }        from '@angular/common';
+import {ClaimResultSearchFormComponent} from './claimResultSearchForm.component';
+
+import {SearchDataciteServiceModule} from './service/searchDataciteService.module';
+
+import {SearchCrossrefServiceModule} from './service/searchCrossrefService.module';
+import {SearchOrcidService} from './service/searchOrcid.service';
+
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+import {SoftwareServiceModule} from '../../services/softwareService.module';
+import {PagingModule } from '../../utils/paging.module';
+
+ @NgModule({
+  imports: [SharedModule, CommonModule, PublicationsServiceModule, DatasetsServiceModule, PagingModule, SearchCrossrefServiceModule,
+    SearchDataciteServiceModule,SoftwareServiceModule],
+  providers:[
+     SearchOrcidService
+  ],
+  declarations: [
+     ClaimResultSearchFormComponent
+
+  ],
+  exports: [ClaimResultSearchFormComponent ]
+})
+export class ClaimResultSearchFormModule { }
diff --git a/claims/claim-utils/displayClaims/displayClaims.component.html b/claims/claim-utils/displayClaims/displayClaims.component.html
new file mode 100644
index 00000000..5e385958
--- /dev/null
+++ b/claims/claim-utils/displayClaims/displayClaims.component.html
@@ -0,0 +1,115 @@
+
+<div class="uk-width-1-1">
+  <helper position="top"></helper>
+</div>
+<div class="uk-grid  helper-grid">
+  <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
+  <div class="uk-width-expand">
+    <form class="">
+
+
+        <div class="-row">
+            <span class="uk-text-bold">Filter By:</span>
+            <input type="text" class=" uk-input form-control" placeholder="Search for keywords in titles ..." aria-describedby="sizing-addon2"  [(ngModel)]="inputkeyword"  (keyup)="changekeyword()" name="claims-keyword" ></div>
+        <div class="uk-margin-small-top">
+          <label class="uk-margin-small-right"> <input [(ngModel)]="projectCB" type="checkbox" (ngModelChange)="changeType()"  name="project"  />
+            <span class="uk-icon"  ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="5" y="2" width="10" height="1"></rect><rect x="3" y="4" width="14" height="1"></rect><rect fill="none" stroke="#000" x="1.5" y="6.5" width="17" height="11"></rect></svg></span>
+            Project </label>
+          <label  class="uk-margin-small-right"> <input [(ngModel)]="publicationCB" type="checkbox"  (ngModelChange)="changeType()" name="publication"  />
+            <span class="uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect fill="none" stroke="#000" x="3.5" y="2.5" width="12" height="16"></rect><polyline fill="none" stroke="#000" points="5 0.5 17.5 0.5 17.5 17"></polyline></svg></span>
+            Publication </label>
+          <label  class="uk-margin-small-right"> <input [(ngModel)]="datasetCB" type="checkbox" (ngModelChange)="changeType()"  name="dataset"  />
+             <span class="uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><ellipse fill="none" stroke="#000" cx="10" cy="4.64" rx="7.5" ry="3.14"></ellipse><path fill="none" stroke="#000" d="M17.5,8.11 C17.5,9.85 14.14,11.25 10,11.25 C5.86,11.25 2.5,9.84 2.5,8.11"></path><path fill="none" stroke="#000" d="M17.5,11.25 C17.5,12.99 14.14,14.39 10,14.39 C5.86,14.39 2.5,12.98 2.5,11.25"></path><path fill="none" stroke="#000" d="M17.49,4.64 L17.5,14.36 C17.5,16.1 14.14,17.5 10,17.5 C5.86,17.5 2.5,16.09 2.5,14.36 L2.5,4.64"></path></svg></span>
+             Research Data </label>
+             <label  class="uk-margin-small-right"> <input [(ngModel)]="softwareCB" type="checkbox" (ngModelChange)="changeType()"  name="software"  />
+                <span class="uk-icon" >
+                  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <circle fill="none" stroke="#000" cx="9.997" cy="10" r="3.31"></circle> <path fill="none" stroke="#000" d="M18.488,12.285 L16.205,16.237 C15.322,15.496 14.185,15.281 13.303,15.791 C12.428,16.289 12.047,17.373 12.246,18.5 L7.735,18.5 C7.938,17.374 7.553,16.299 6.684,15.791 C5.801,15.27 4.655,15.492 3.773,16.237 L1.5,12.285 C2.573,11.871 3.317,10.999 3.317,9.991 C3.305,8.98 2.573,8.121 1.5,7.716 L3.765,3.784 C4.645,4.516 5.794,4.738 6.687,4.232 C7.555,3.722 7.939,2.637 7.735,1.5 L12.263,1.5 C12.072,2.637 12.441,3.71 13.314,4.22 C14.206,4.73 15.343,4.516 16.225,3.794 L18.487,7.714 C17.404,8.117 16.661,8.988 16.67,10.009 C16.672,11.018 17.415,11.88 18.488,12.285 L18.488,12.285 Z"></path></svg>
+                </span>
+                Software </label>
+          <label  class="uk-margin-small-right"> <input [(ngModel)]="contextCB" type="checkbox" (ngModelChange)="changeType()"  name="context"  />
+            <span class="uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="7.7" cy="8.6" r="3.5"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M1,18.1 C1.7,14.6 4.4,12.1 7.6,12.1 C10.9,12.1 13.7,14.8 14.3,18.3"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M11.4,4 C12.8,2.4 15.4,2.8 16.3,4.7 C17.2,6.6 15.7,8.9 13.6,8.9 C16.5,8.9 18.8,11.3 19.2,14.1"></path></svg></span>
+             Context </label>
+      </div>
+
+    </form>
+    <div class="searchPaging uk-panel uk-margin-top" data-uk-grid-margin="">
+
+        <div *ngIf="resultsNum" class="uk-float-right">
+            <paging-no-load [currentPage]="page" [totalResults]="resultsNum"      [size]="size"  (pageChange)="pageChange($event)"> </paging-no-load>
+         </div>
+
+      <div *ngIf="resultsNum>0" class="uk-width-1-2">
+        <span > Show
+          <select *ngIf="resultsNum>10"  class="uk-width-1-2 uk-select" [(ngModel)]="size" name="select_size"  (ngModelChange)="changeSize(size)" >
+            <option *ngFor="let size of sizes"  [value]="size">{{size}}</option>
+          </select>
+        </span>
+        <span >Showing {{(size*page - size +1)}} to {{(size*page>resultsNum)?resultsNum:(size*page)}} of {{resultsNum}} claims </span>
+
+      </div>
+    </div>
+
+
+     <div *ngIf="showErrorMessage " class = "uk-alert uk-alert-danger " >
+         An Error occured.
+     </div>
+     <div *ngIf="showForbiddenMessage " class = "uk-alert uk-alert-danger " >
+         You are not allowed to access this page.
+     </div>
+     <div *ngIf="userValidMessage.length > 0 " class = "uk-alert uk-alert-danger " >
+         User session is not valid. Please login again.
+     </div>
+
+
+    <!--  Buttons for selecting and Delete Claims -->
+    <div *ngIf="enableDelete">
+      <div *ngIf="selected.length>0 && resultsNum > 0 ">
+        <div class = "uk-alert uk-alert-primary " >
+          You have selected {{selected.length}} claim(s)
+        </div>
+      </div>
+      <div *ngIf="deleteMessage.length>0 "   [innerHTML]="deleteMessage">
+
+      </div>
+       <button class=" uk-button uk-button-default"  (click)="confirmOpen()"> <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="trash" ratio="1"><polyline fill="none" stroke="#000" points="6.5 3 6.5 1.5 13.5 1.5 13.5 3"></polyline><polyline fill="none" stroke="#000" points="4.5 4 4.5 18.5 15.5 18.5 15.5 4"></polyline><rect x="8" y="7" width="1" height="9"></rect><rect x="11" y="7" width="1" height="9"></rect><rect x="2" y="3" width="16" height="1"></rect></svg></span> Delete</button>
+    </div>
+    <br>
+
+
+    <div *ngIf=" claims && claims.length == 0" >
+      <div class = "uk-alert uk-alert-primary " >No entries found.</div>
+    </div>
+
+    <div class="">
+    <table *ngIf="claims && claims.length > 0" class="uk-table uk-table-striped">
+      <thead>
+         <tr>
+            <th *ngIf="enableDelete"><input id="checkAll" type="checkbox" (click)="selectAll($event)" [ngModel]="selected.length==claims.length" /></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 *ngIf="showUserEmail"><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 *ngIf="showUserEmail">{{claim.userMail}}</td>
+            <td>{{claim.date}}</td>
+         </tr>
+      </tbody>
+    </table>
+    </div>
+    <helper position="right" styleName=" uk-width-1-5"></helper>
+</div>
+<helper position="bottom"></helper>
+<modal-alert (alertOutput)="confirmClose($event)">
+</modal-alert>
+<modal-loading [message]= "'Please wait...'"></modal-loading>
diff --git a/claims/claim-utils/displayClaims/displayClaims.component.ts b/claims/claim-utils/displayClaims/displayClaims.component.ts
new file mode 100644
index 00000000..d6773c57
--- /dev/null
+++ b/claims/claim-utils/displayClaims/displayClaims.component.ts
@@ -0,0 +1,495 @@
+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 '../service/claims.service';
+import {ModalLoading} from '../../../utils/modal/loading.component';
+import {AlertModal} from '../../../utils/modal/alert';
+import {Session} from '../../../login/utils/helper.class';
+
+
+@Component({
+    selector: 'displayClaims',
+    templateUrl: 'displayClaims.component.html',
+    providers:[ ClaimsService]
+
+})
+export class DisplayClaimsComponent {
+  constructor (private _claimService: ClaimsService,  private route: ActivatedRoute, private _router:Router, private location: Location) {
+   }
+
+  ngOnInit() {
+     this.sub = this.route.queryParams.subscribe(params => {
+      if( this.myClaims){
+          this.fetchBy = "User";
+          this.fetchId = Session.getUserEmail();
+      }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();
+
+    });
+
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+    sub: any;
+  //string because comes as input from component directive
+  @Input() enableDelete: boolean = false;
+  @Input() showUserEmail: boolean = true;
+  @Input() myClaims: boolean= false ;
+  @Input() isAdmin:boolean = false;
+  page : number;
+  size:number;
+  sizes = [10,20,30,50];
+  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;
+  softwareCB = false;
+  contextCB = false;
+  projectCB = false;
+  entityTypes : string[] =[] ;
+
+  descending = true;
+  sortby = "date";
+
+  selected=[];
+  deleteMessage:string = "";
+  showErrorMessage:boolean = false;
+  showForbiddenMessage:boolean = false;
+  userValidMessage:string = "";
+
+  //params for pagingFormatter to use when navigate to page
+  params;
+  @ViewChild(AlertModal) alert;
+
+  claimsDeleted:number = 0;
+
+  getClaims () {
+    if(!Session.isValidAndRemove()){
+      this.userValidMessage = "User session has expired. Please login again.";
+
+    }else{
+      var token=Session.getUserJwt();
+    this.selected=[];
+    var types = '';
+    this.showErrorMessage = false;
+    this.showForbiddenMessage = 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 => {
+          this.handleErrors(err);
+        }
+      );
+    }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 => {
+            this.handleErrors(err);
+          }
+      );
+    }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 => {
+            this.handleErrors(err);
+          }
+      );
+    }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 => {
+             this.handleErrors(err);
+          }
+      );
+    }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 => {
+            this.handleErrors(err);
+          }
+      );
+    }
+  }
+}
+handleErrors(err){
+
+  this.showErrorMessage = true;
+  try{
+    var error =  err.json()
+      var code = error.code;
+      if(code == 403){
+        this.showErrorMessage = false;
+        this.showForbiddenMessage = true;
+      }
+  }catch (e) {
+        console.log("Couldn't parse answer as json")
+        this.showErrorMessage = true;
+  }
+
+}
+
+  goTo(page:number = 1){
+
+    this.page = page;
+
+    this.location.go(location.pathname,this.getParametersString());
+    this.getClaims();
+  }
+  getParameters(){
+    var params = {}
+    if(this.myClaims){
+       params={ page: this.page, size: this.size, types: this.entityTypes, keyword : this.keyword, sort: this.getSortby()  };
+    }else{
+      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 ){
+      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;
+  }
+  changeSize(size: number ){
+      this.goTo();
+  }
+
+  clearFilters(){
+    this.keyword = '';
+    this.inputkeyword = '';
+    this.publicationCB = false;
+    this.projectCB = false;
+    this.datasetCB = false;
+    this.softwareCB = 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.softwareCB){
+       this.entityTypes.push('software');
+     }
+     if(this.projectCB){
+       this.entityTypes.push('project');
+     }
+     if(this.contextCB){
+       this.entityTypes.push('context');
+     }
+
+     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("software")!=-1){
+         this.softwareCB = true;
+         this.entityTypes.push("software");
+       }
+       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.softwareCB && 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(event){
+     var value = event.currentTarget.checked;
+     if(value){
+       this.selected = [];
+      for (var _i = 0; _i < this.claims.length; _i++) {
+         let claim = this.claims[_i];
+         this.selected.push(claim);
+       }
+        this.deleteMessage = "";
+    }else{
+      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){
+      if(!Session.isValidAndRemove()){
+        this.userValidMessage = "User session has expired. Please login again.";
+
+      }else{
+        var token=Session.getUserJwt();
+         console.log("Deleting claim with id:"+id);
+         // this._claimService.deleteClaimById(id);
+         this._claimService.deleteClaimById(id).subscribe(
+            res =>  {
+              console.log('Delete response'+res.code );
+              console.log("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[]){
+      if(!Session.isValidAndRemove()){
+        this.userValidMessage = "User session has expired. Please login again.";
+
+      }else{
+        var token=Session.getUserJwt();
+         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 = "uk-alert uk-alert-primary " >'+res.deletedIds.length+' claim(s) successfully deleted.</div>';
+              }
+              if(res.notFoundIds.length>0){
+                  this.deleteMessage=this.deleteMessage+'<div class = "uk-alert uk-alert-warning " >'+res.notFoundIds.length+' claim(s) couldn\'t be deleted.</div>';
+              }
+           }, err => {
+             console.log(err);
+             this.showErrorMessage = true;
+             this.loading.close();
+
+           });
+         }
+    }
+    pageChange($event) {
+      var page:number = +$event.value
+      this.goTo(page);
+    }
+}
diff --git a/claims/claim-utils/displayClaims/displayClaims.module.ts b/claims/claim-utils/displayClaims/displayClaims.module.ts
new file mode 100644
index 00000000..4c8e0bb0
--- /dev/null
+++ b/claims/claim-utils/displayClaims/displayClaims.module.ts
@@ -0,0 +1,26 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import {ClaimServiceModule} from '../service/claimsService.module';
+import {DisplayClaimsComponent} from './displayClaims.component';
+import {LoadingModalModule} from '../../../utils/modal/loadingModal.module';
+import {AlertModalModule} from '../../../utils/modal/alertModal.module';
+import {ClaimEntityFormatterModule} from '../entityFormatter/claimEntityFormatter.module';
+import {PagingModule } from '../../../utils/paging.module';
+import {HelperModule} from '../../../utils/helper/helper.module';
+
+ @NgModule({
+  imports: [
+    CommonModule, FormsModule,  ClaimServiceModule, LoadingModalModule, AlertModalModule,
+ClaimEntityFormatterModule, PagingModule, HelperModule
+
+  ],
+  declarations: [
+    DisplayClaimsComponent
+
+  ],
+  exports: [
+    DisplayClaimsComponent
+   ]
+})
+export class DisplayClaimsModule { }
diff --git a/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts b/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts
new file mode 100644
index 00000000..8a1262a8
--- /dev/null
+++ b/claims/claim-utils/entityFormatter/claimEntityFormatter.component.ts
@@ -0,0 +1,48 @@
+import {Component, Input} from '@angular/core';
+
+//Usage Example "<claim-entity [entity]="" [type]="" > </claim-entity>"
+
+//externalUrl
+@Component({
+  selector: 'claim-entity',
+  template: `
+  <div *ngIf="type == 'publication'" title="Publication">
+      <span class="uk-margin-small-right uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect fill="none" stroke="#000" x="3.5" y="2.5" width="12" height="16"></rect><polyline fill="none" stroke="#000" points="5 0.5 17.5 0.5 17.5 17"></polyline></svg></span>
+      <publication-title [title]="entity.title" [url]="entity.externalUrl" ></publication-title>
+  </div>
+  <div *ngIf="type == 'dataset'" title="Dataset">
+      <span class="uk-margin-small-right uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><ellipse fill="none" stroke="#000" cx="10" cy="4.64" rx="7.5" ry="3.14"></ellipse><path fill="none" stroke="#000" d="M17.5,8.11 C17.5,9.85 14.14,11.25 10,11.25 C5.86,11.25 2.5,9.84 2.5,8.11"></path><path fill="none" stroke="#000" d="M17.5,11.25 C17.5,12.99 14.14,14.39 10,14.39 C5.86,14.39 2.5,12.98 2.5,11.25"></path><path fill="none" stroke="#000" d="M17.49,4.64 L17.5,14.36 C17.5,16.1 14.14,17.5 10,17.5 C5.86,17.5 2.5,16.09 2.5,14.36 L2.5,4.64"></path></svg></span>
+      <publication-title [title]="entity.title" [url]="entity.externalUrl" ></publication-title>
+  </div>
+  <div *ngIf="type == 'software'" title="Software">
+      <span class="uk-margin-small-right uk-icon" >
+        <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <circle fill="none" stroke="#000" cx="9.997" cy="10" r="3.31"></circle> <path fill="none" stroke="#000" d="M18.488,12.285 L16.205,16.237 C15.322,15.496 14.185,15.281 13.303,15.791 C12.428,16.289 12.047,17.373 12.246,18.5 L7.735,18.5 C7.938,17.374 7.553,16.299 6.684,15.791 C5.801,15.27 4.655,15.492 3.773,16.237 L1.5,12.285 C2.573,11.871 3.317,10.999 3.317,9.991 C3.305,8.98 2.573,8.121 1.5,7.716 L3.765,3.784 C4.645,4.516 5.794,4.738 6.687,4.232 C7.555,3.722 7.939,2.637 7.735,1.5 L12.263,1.5 C12.072,2.637 12.441,3.71 13.314,4.22 C14.206,4.73 15.343,4.516 16.225,3.794 L18.487,7.714 C17.404,8.117 16.661,8.988 16.67,10.009 C16.672,11.018 17.415,11.88 18.488,12.285 L18.488,12.285 Z"></path></svg>
+      </span>
+      <publication-title [title]="entity.title" [url]="entity.externalUrl" ></publication-title>
+  </div>
+  <div *ngIf="type == 'project'  " title="Project">
+    <span class="uk-margin-small-right uk-icon"  ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="5" y="2" width="10" height="1"></rect><rect x="3" y="4" width="14" height="1"></rect><rect fill="none" stroke="#000" x="1.5" y="6.5" width="17" height="11"></rect></svg></span>
+    <project-title [project]="entity"></project-title>
+  </div>
+  <div *ngIf="type == 'context'  " title="Concept">
+    <span class="uk-margin-small-right uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="7.7" cy="8.6" r="3.5"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M1,18.1 C1.7,14.6 4.4,12.1 7.6,12.1 C10.9,12.1 13.7,14.8 14.3,18.3"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M11.4,4 C12.8,2.4 15.4,2.8 16.3,4.7 C17.2,6.6 15.7,8.9 13.6,8.9 C16.5,8.9 18.8,11.3 19.2,14.1"></path></svg></span>
+    <span>{{entity.title}}</span>
+  </div>
+  `
+})
+
+export class ClaimEntityFormatter {
+  @Input() entity: string[];
+  @Input() type: string;
+
+  constructor () {}
+
+  ngOnInit() {
+    if(this.type && this.type == "software"){
+
+      console.log(this.entity);
+    }
+  }
+
+
+}
diff --git a/claims/claim-utils/entityFormatter/claimEntityFormatter.module.ts b/claims/claim-utils/entityFormatter/claimEntityFormatter.module.ts
new file mode 100644
index 00000000..01a1d0ac
--- /dev/null
+++ b/claims/claim-utils/entityFormatter/claimEntityFormatter.module.ts
@@ -0,0 +1,24 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import {ProjectTitleFormatter} from './projectTitleFormatter.component';
+import {PublicationTitleFormatter} from './publicationTitleFormatter.component';
+import {ClaimEntityFormatter} from './claimEntityFormatter.component';
+
+ @NgModule({
+  imports: [
+    CommonModule, RouterModule
+   ],
+  declarations: [
+    ProjectTitleFormatter, PublicationTitleFormatter, ClaimEntityFormatter
+
+  ],
+  providers:    [   ],
+  exports: [
+    ProjectTitleFormatter, PublicationTitleFormatter, ClaimEntityFormatter
+
+   ]
+})
+export class ClaimEntityFormatterModule { }
diff --git a/claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts b/claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts
new file mode 100644
index 00000000..b1b95aa1
--- /dev/null
+++ b/claims/claim-utils/entityFormatter/projectTitleFormatter.component.ts
@@ -0,0 +1,25 @@
+import {Component, Input} from '@angular/core';
+import {OpenaireProperties} from '../../../utils/properties/openaireProperties';
+import {RouterHelper} from '../../../utils/routerHelper.class';
+
+//Usage Example "<project-title [project]="X" > </project-title>"
+
+@Component({
+  selector: 'project-title',
+  template: `
+  <span class="project-title">
+    <span  ><a [queryParams]="routerHelper.createQueryParam('projectId',project['openaireId'])"   routerLinkActive="router-link-active" routerLink="/search/project" >{{project['name']}} ({{project['funderName']}})</a></span>
+  </span>
+  `
+})
+
+export class ProjectTitleFormatter {
+  @Input() project: string[];
+  public url:string;
+  public routerHelper:RouterHelper = new RouterHelper();
+  constructor () {}
+
+  ngOnInit() {
+    this.url = OpenaireProperties.getsearchLinkToProject() + "?projectId=" + this.project["openaireId"];
+  }
+}
diff --git a/claims/claim-utils/entityFormatter/publicationTitleFormatter.component.ts b/claims/claim-utils/entityFormatter/publicationTitleFormatter.component.ts
new file mode 100644
index 00000000..321e440d
--- /dev/null
+++ b/claims/claim-utils/entityFormatter/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: `
+  <span class="publication-title">
+    <span *ngIf="url" ><a target="_blank" href="{{url}}" ><span class="custom-external custom-icon" ></span> {{title}}</a></span>
+    <span *ngIf="!url" >{{title}}</span>
+  </span>
+  `
+})
+
+export class PublicationTitleFormatter {
+  @Input() title: string[];
+  @Input() url: string[];
+
+  constructor () {}
+
+  ngOnInit() {
+
+  }
+
+
+}
diff --git a/claims/claim-utils/service/claims.service.ts b/claims/claim-utils/service/claims.service.ts
new file mode 100644
index 00000000..45107b3b
--- /dev/null
+++ b/claims/claim-utils/service/claims.service.ts
@@ -0,0 +1,149 @@
+import {Injectable} from '@angular/core';
+import {URLSearchParams } from '@angular/http';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+// import {Claim}           from '../claim';
+import {OpenaireProperties} from '../../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../../../shared/cache.service';
+import { CustomOptions } from './customOptions.class';
+@Injectable()
+export class ClaimsService {
+  private baseUrl;
+  constructor(private http: Http ) {
+    this.baseUrl = OpenaireProperties.getClaimsAPIURL();
+  }
+
+  private getClaimRequest(size : number, page : number, url :string, fromCache:boolean):any {
+    console.info('ClaimsService: Claims request: '+url);
+    let key = url;
+    //(fromCache && OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url
+      return this.http.get(url, CustomOptions.getAuthOptions())
+                    .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,true);
+
+  }
+  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/claims"+"?offset="+(size*(page-1) + "&limit="+size)+"&keyword="+keyword+"&sortby="+sortby+"&descending="+descending+"&"+types;
+     return this.getClaimRequest(size,page,url,false);
+
+  }
+  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,true);
+
+  }
+  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,true);
+
+  }
+  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,true);
+  }
+
+  deleteClaimById(claimId:string ):any{
+    console.warn('Trying to delete claim with id : '+claimId);
+    let url = this.baseUrl +"claims/"+claimId;
+    // let headers = new Headers({ 'Content-Type': 'application/json' });
+    // let options = new RequestOptions({ headers: headers });
+      return this.http.delete( url,  CustomOptions.getAuthOptionsWithBody()).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;
+
+    // let headers = new Headers({ 'Content-Type': 'application/json' });
+    // let options = new RequestOptions({ headers: headers });
+      return this.http.delete( url,  CustomOptions.getAuthOptions()).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,  CustomOptions.getAuthOptionsWithBody())
+                          .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,  CustomOptions.getAuthOptionsWithBody())
+                          .map(res => res.json())
+                          .do(request => console.info("Insert Response:"+request.status) )
+                          .catch(this.handleError);
+
+    }
+    insertDirectRecords(records):any{
+      console.warn('Trying to feedrecords  : '+records);
+      let url = this.baseUrl +"feed/bulk";
+      let body = JSON.stringify( records );
+      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, CustomOptions.getAuthOptionsWithBody())
+                            .map(res => res.json())
+                            .do(request => console.info("Insert Response:"+request) )
+                            .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.log(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);
+            }
+          )
+        ;
+      });
+      }
+
+
+}
diff --git a/claims/claim-utils/service/claimsService.module.ts b/claims/claim-utils/service/claimsService.module.ts
new file mode 100644
index 00000000..d38d0f8d
--- /dev/null
+++ b/claims/claim-utils/service/claimsService.module.ts
@@ -0,0 +1,23 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {ClaimsService} from './claims.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  ClaimsService,
+
+],
+  exports: [
+    ]
+})
+
+
+export class ClaimServiceModule { }
diff --git a/claims/claim-utils/service/contexts.service.ts b/claims/claim-utils/service/contexts.service.ts
new file mode 100644
index 00000000..f5d15f70
--- /dev/null
+++ b/claims/claim-utils/service/contexts.service.ts
@@ -0,0 +1,85 @@
+import {Injectable} from '@angular/core';
+import {Jsonp, URLSearchParams, RequestOptions, Headers} from '@angular/http';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {Claim}           from '../claim';
+import {OpenaireProperties} from '../../../utils/properties/openaireProperties';
+import {AutoCompleteValue} from '../../../searchPages/searchUtils/searchHelperClasses.class';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../../../shared/cache.service';
+import { COOKIE  } from '../../../login/utils/helper.class';
+@Injectable()
+export class ContextsService {
+  private baseUrl;
+  constructor(private http: Http ) {
+    this.baseUrl = OpenaireProperties.getClaimsAPIURL();
+  }
+
+  public getCommunities():any {
+  let  url   = this.baseUrl + 'communities';
+  let key = url;
+
+
+    console.info('ContextsService: request communities  '+url);
+      return this.http.get(url, this.getAuthOptions())
+                    .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';
+    let key = url;
+
+
+      return this.http.get(url, this.getAuthOptions())
+                    .map(request => <any> request.json().data)
+                    // .do(request => console.info("Get claims: offset = " ))
+                    .catch(this.handleError);;
+  }
+  public getConcepts(categoryId :string, keyword: string, parsing:boolean):any {
+    console.info('ContextsService:  request concept for category  with id '+categoryId + ' and keyword '+ keyword);
+    let url= this.baseUrl  + 'categories/' + categoryId+ "/concepts";
+    let key = url+"_parsing="+parsing;
+
+
+      return this.http.get(url, this.getAuthOptions())
+                    .map(request => <any> request.json().data)
+                    .catch(this.handleError)
+                    .map(res => (parsing)?this.parse(res.concept):res.concept);
+                    // .do(res => console.info("Result is "+ res.length ));
+  }
+  parse (data: any):AutoCompleteValue[] {
+      var array:AutoCompleteValue[] =[]
+      if(!Array.isArray(data) && data.id && data.label){
+        var value:AutoCompleteValue =  new AutoCompleteValue();
+        value.id = data.id;
+        value.label = data.label;
+        array.push(value);
+      }
+      for(var i = 0; i < data.length; i++){
+        var value:AutoCompleteValue =  new AutoCompleteValue();
+        value.id = data[i].id;
+        value.label = data[i].label;
+        array.push(value);
+      }
+
+      return array;
+
+  }
+
+  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.log(error);
+    return Observable.throw(error  || 'Server error');
+  }
+  private getAuthOptions():RequestOptions{
+  let headers = new Headers();
+  headers.append('X-XSRF-TOKEN',  COOKIE.getCookie(COOKIE.cookieName_id));
+  let options = new RequestOptions({ headers: headers, withCredentials:true });
+    return options;
+  }
+}
diff --git a/claims/claim-utils/service/contextsService.module.ts b/claims/claim-utils/service/contextsService.module.ts
new file mode 100644
index 00000000..6bd55ced
--- /dev/null
+++ b/claims/claim-utils/service/contextsService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {ContextsService} from './contexts.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  ContextsService
+],
+  exports: [
+    ]
+})
+export class ContextsServiceModule { }
diff --git a/claims/claim-utils/service/customOptions.class.ts b/claims/claim-utils/service/customOptions.class.ts
new file mode 100644
index 00000000..7796c45e
--- /dev/null
+++ b/claims/claim-utils/service/customOptions.class.ts
@@ -0,0 +1,19 @@
+import { RequestOptions, Headers} from '@angular/http';
+import { COOKIE  } from '../../../login/utils/helper.class';
+
+
+export class CustomOptions{
+  public static getAuthOptionsWithBody():RequestOptions{
+  let headers = new Headers();
+  headers.append('Content-Type', 'application/json');
+  headers.append('X-XSRF-TOKEN',  COOKIE.getCookie(COOKIE.cookieName_id));
+  let options = new RequestOptions({ headers: headers, withCredentials:true });
+    return options;
+  }
+  public static getAuthOptions():RequestOptions{
+  let headers = new Headers();
+  headers.append('X-XSRF-TOKEN',  COOKIE.getCookie(COOKIE.cookieName_id));
+  let options = new RequestOptions({ headers: headers, withCredentials:true });
+    return options;
+  }
+}
diff --git a/claims/claim-utils/service/searchCrossref.service.ts b/claims/claim-utils/service/searchCrossref.service.ts
new file mode 100644
index 00000000..40c4e993
--- /dev/null
+++ b/claims/claim-utils/service/searchCrossref.service.ts
@@ -0,0 +1,67 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+@Injectable()
+export class SearchCrossrefService {
+  constructor( private http: Http ) {}
+
+
+  searchCrossrefResults (term: string, size : number, page : number):any {
+     let url = OpenaireProperties.getSearchCrossrefAPIURL()+'?query='+term+'&rows='+size+'&offset='+(size*(page-1));
+     let key = url;
+
+     return this.http.get(url)
+                     .map(request => <any> request.json().message)
+                     .do(items => console.log("Crossref Results: total results = "+items['total-results']+" keyword = "+term));
+                     //.catch(this.handleError);
+
+    }
+    searchCrossrefByDOIs(DOIs: string[]):any {
+      /*
+      $request ="http://api.crossref.org/works"."?filter=";
+                      foreach($dois as $doi){
+                          $request.="doi:".urlencode( trim($doi)).",";
+                      }
+      */
+      var doisParams = "";
+      for(var i =0 ;i < DOIs.length; i++){
+        doisParams+=(doisParams.length > 0?",":"")+'doi:'+DOIs[i];
+      }
+       let url = OpenaireProperties.getSearchCrossrefAPIURL()+'?filter='+doisParams;
+       let key = url;
+
+
+       return this.http.get(url)
+                       .map(request => <any> request.json().message)
+                       .do(items => console.log("Crossref Results: total results = "+items['total-results']+" for doi = "+doisParams));
+                       //.catch(this.handleError);
+
+      }
+      searchCrossrefByMultipleDOIs(dois: string[]):any {
+        let url = OpenaireProperties.getSearchCrossrefAPIURL()+'?filter=doi:';
+        for(var i=0; i<dois.length; i++){
+          url=url+(url.length==0?'':',')+'doi:'+dois[i];
+        }
+        url = OpenaireProperties.getSearchCrossrefAPIURL()+'?filter='+url;
+        let key = url;
+
+
+         return this.http.get(url)
+                         .map(request => <any> request.json().message)
+                         .do(items => console.log("Crossref Results: total results = "+items['total-results']));
+                         //.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.log(error);
+    return Observable.throw(error  || 'Server error');
+  }
+
+}
diff --git a/claims/claim-utils/service/searchCrossrefService.module.ts b/claims/claim-utils/service/searchCrossrefService.module.ts
new file mode 100644
index 00000000..798acdb3
--- /dev/null
+++ b/claims/claim-utils/service/searchCrossrefService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchCrossrefService} from './searchCrossref.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchCrossrefService
+],
+  exports: [
+    ]
+})
+export class SearchCrossrefServiceModule { }
diff --git a/claims/claim-utils/service/searchDatacite.service.ts b/claims/claim-utils/service/searchDatacite.service.ts
new file mode 100644
index 00000000..46b43032
--- /dev/null
+++ b/claims/claim-utils/service/searchDatacite.service.ts
@@ -0,0 +1,50 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+@Injectable()
+export class SearchDataciteService {
+  constructor(private http: Http ) {}
+
+  searchDataciteResults (term: string, size : number, page : number):any {
+    console.info("In search datacite results "+term);
+    let url = OpenaireProperties.getSearchDataciteAPIURL()+'?query='+term+'&rows='+size+'&start='+(size*(page-1));
+    let key = url;
+
+    return this.http.get( (OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                     .map(request => <any> request.json())
+                     .do(items => console.info(items))
+                     .do(items => console.log("Datacite Results: total results = "+items.meta.total+" keyword = "+term));
+                     //.catch(this.handleError);
+    }
+    getDataciteResultByDOI (doi: string):any {
+      console.info("Fetch datacite resultt by DOI: "+doi);
+      let url = OpenaireProperties.getSearchDataciteAPIURL()+'/'+doi;
+      let key = url;
+
+      return this.http.get( (OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                       .map(request => <any> request.json())
+                       .do(items => console.info(items));
+                      //  .do(items => console.log("Datacite Results: total results = "+items.meta.total+" doi = "+doi))
+
+                       //.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.log(error);
+    return Observable.throw(error  || 'Server error');
+  }
+  private extractData(res: Response) {
+    if (res.status < 200 || res.status >= 300) {
+      throw new Error('Bad response status: ' + res.status);
+    }
+    let body = res.json();
+    return body.data || { };
+  }
+}
diff --git a/claims/claim-utils/service/searchDataciteService.module.ts b/claims/claim-utils/service/searchDataciteService.module.ts
new file mode 100644
index 00000000..659ca2e3
--- /dev/null
+++ b/claims/claim-utils/service/searchDataciteService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchDataciteService} from './searchDatacite.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchDataciteService
+],
+  exports: [
+    ]
+})
+export class SearchDataciteServiceModule { }
diff --git a/claims/claim-utils/service/searchOrcid.service.ts b/claims/claim-utils/service/searchOrcid.service.ts
new file mode 100644
index 00000000..0a60ef7a
--- /dev/null
+++ b/claims/claim-utils/service/searchOrcid.service.ts
@@ -0,0 +1,126 @@
+import {Injectable} from '@angular/core';
+import {URLSearchParams} from '@angular/http';
+import {Http, Response} from '@angular/http';
+import { Headers, RequestOptions } from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+@Injectable()
+export class SearchOrcidService {
+  constructor( private http: Http ) {}
+
+
+  searchOrcidAuthor (term: string, authorIds: string[],
+      authorGivenNames: string[], authorFamilyNames: string[]):any {
+    console.info("In searchOrcidAuthor: "+term);
+
+    var headers = new Headers();
+    headers.append('Accept', 'application/orcid+json');
+
+    let url = OpenaireProperties.getSearchOrcidURL()+term+'/orcid-bio';
+    let key = url;
+
+    return this.http.get(url, { headers: headers })
+                .map(res => res.json()['orcid-profile'])
+                .map(res => [res['orcid-bio']['personal-details']['given-names'],
+                             res['orcid-bio']['personal-details']['family-name'],
+                             res['orcid-identifier']])
+                .map(res => this.parseOrcidAuthor(res, authorIds, authorGivenNames, authorFamilyNames));
+    }
+
+  searchOrcidAuthors (term: string, authorIds: string[],
+      authorGivenNames: string[], authorFamilyNames: string[]):any {
+    console.info("In search Orcid authors for keyword: "+term);
+
+    var headers = new Headers();
+    headers.append('Accept', 'application/orcid+json');
+
+    let url = OpenaireProperties.getSearchOrcidURL()+'search/orcid-bio?defType=edismax&q='+term+'&qf=given-name^1.0+family-name^2.0+other-names^1.0+credit-name^1.0&start=0&rows=10';
+    let key = url;
+
+    return this.http.get(url, { headers: headers })
+      .map(res => res.json()['orcid-search-results']['orcid-search-result'])
+      .map(res => this.parseOrcidAuthors(res, authorIds, authorGivenNames, authorFamilyNames));
+
+    }
+
+    searchOrcidPublications (id: string):any {
+      console.info("In search Orcid publications for author: "+id);
+
+      var headers = new Headers();
+      headers.append('Accept', 'application/orcid+json');
+
+      let url = OpenaireProperties.getSearchOrcidURL()+id+'/orcid-works';
+      let key = url;
+
+      return this.http.get(url, { headers: headers })
+        .map(res => res.json()['orcid-profile']['orcid-activities']['orcid-works']);
+        //.map(res => res['orcid-work']);
+      }
+
+
+      parseOrcidAuthor (data: any, authorIds: string[],
+          authorGivenNames: string[], authorFamilyNames: string[]):any {
+
+              if(data[2] != null) {
+                  authorIds.push(data[2].path);
+
+                  if(data[0] != null) {
+                    authorGivenNames.push(data[0].value);
+                  } else {
+                    authorGivenNames.push("");
+                  }
+                  if(data[1] != null) {
+                    authorFamilyNames.push(data[1].value);
+                  } else {
+                    authorFamilyNames.push("");
+                  }
+
+                  return true;
+              }
+
+              return false;
+      }
+
+      parseOrcidAuthors (data: any, authorIds: string[],
+          authorGivenNames: string[], authorFamilyNames: string[]):any {
+              let ret: boolean = false;
+              let mydata: any;
+              let length: number;
+
+              if(data != null) {
+                  length = data.length!=undefined ? data.length : 1;
+
+                  for(let i=0; i<length; i++) {
+                      mydata = data.length!=undefined  ? data[i] : data;
+
+                      if(mydata.hasOwnProperty("orcid-profile")) {
+                           if(mydata['orcid-profile'].hasOwnProperty("orcid-identifier")) {
+                               authorIds.push(mydata['orcid-profile']['orcid-identifier'].path);
+
+                               if(mydata['orcid-profile'].hasOwnProperty("orcid-bio")) {
+                                   if(mydata['orcid-profile']['orcid-bio'].hasOwnProperty("personal-details")) {
+                                       if(mydata['orcid-profile']['orcid-bio']['personal-details'].hasOwnProperty("given-names")) {
+                                           authorGivenNames.push(mydata['orcid-profile']['orcid-bio']['personal-details']['given-names'].value);
+                                       } else {
+                                           authorGivenNames.push("");
+                                       }
+
+                                       if(mydata['orcid-profile']['orcid-bio']['personal-details'].hasOwnProperty("family-name")) {
+                                           authorFamilyNames.push(mydata['orcid-profile']['orcid-bio']['personal-details']['family-name'].value);
+                                       } else {
+                                           authorFamilyNames.push("");
+                                       }
+                                   }
+                               }
+                               ret = true;
+                           }
+                      }
+                  }
+              }
+              return ret;
+      }
+}
diff --git a/claims/claim-utils/startOver.component.ts b/claims/claim-utils/startOver.component.ts
new file mode 100644
index 00000000..eb0acb2e
--- /dev/null
+++ b/claims/claim-utils/startOver.component.ts
@@ -0,0 +1,65 @@
+import {Component, Input, Output, EventEmitter, ViewChild} from '@angular/core';
+
+import {ClaimResult} from '../claim-utils/claimEntities.class';
+import {AlertModal} from '../../utils/modal/alert';
+
+@Component({
+    selector: 'start-over',
+    template: `
+    <button   (click)="confirmOpen()"  class="uk-button uk-button-danger uk-align-left"  >  <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="refresh" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M17.08,11.15 C17.09,11.31 17.1,11.47 17.1,11.64 C17.1,15.53 13.94,18.69 10.05,18.69 C6.16,18.68 3,15.53 3,11.63 C3,7.74 6.16,4.58 10.05,4.58 C10.9,4.58 11.71,4.73 12.46,5"></path><polyline fill="none" stroke="#000" points="9.9 2 12.79 4.89 9.79 7.9"></polyline></svg></span> Clear All</button>
+    <modal-alert (alertOutput)="confirmClose($event)">
+    </modal-alert>
+    `,
+
+})
+export class StartOverComponent {
+  constructor () {
+
+
+  }
+  ngOnInit() {
+
+}
+
+
+  // @Input() public inlineEntity = null;
+  @Input() public type:string;
+  @Input() public linkTo:string;
+  @Input() public results;
+  @Input() public projects;
+  @Input() public contexts;
+
+  @ViewChild(AlertModal) alertApplyAll;
+
+  confirmOpen(){
+    this.alertApplyAll.cancelButton = true;
+    this.alertApplyAll.okButton = true;
+    this.alertApplyAll.alertTitle = "Remove selected";
+    this.alertApplyAll.message = "This action will delete every selected entity (projects, communities, research results). Do you wish to continue?";
+    this.alertApplyAll.okButtonText = "Yes";
+    this.alertApplyAll.cancelButtonText = "No";
+    this.alertApplyAll.open();
+  }
+   confirmClose(data){
+     this.startOver();
+  }
+  startOver(){
+    if(this.type != null && this.linkTo != null){
+      console.log("inline");
+      if(this.linkTo == "project"){
+        this.projects.splice(0, this.projects.length);
+      }else if(this.linkTo == "context"){
+        this.contexts.splice(0, this.contexts.length);
+      }else if(this.linkTo == "result"){
+          this.results.splice(0, this.results.length);
+      }
+      }else{
+        console.log("generic");
+        this.results.splice(0, this.results.length);
+        this.projects.splice(0, this.projects.length);
+        this.contexts.splice(0, this.contexts.length);
+      }
+    console.log("projects:"+this.projects.length +" contexts:"+this.contexts.length + " results:"+this.results.length );
+  }
+
+}
diff --git a/claims/claim-utils/startOver.module.ts b/claims/claim-utils/startOver.module.ts
new file mode 100644
index 00000000..bde3d0a2
--- /dev/null
+++ b/claims/claim-utils/startOver.module.ts
@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+import { SharedModule } from '../../shared/shared.module';
+import { CommonModule }        from '@angular/common';
+import {StartOverComponent} from './startOver.component';
+import {AlertModalModule} from '../../utils/modal/alertModal.module';
+
+ @NgModule({
+  imports: [
+    SharedModule, CommonModule, AlertModalModule
+  ],
+  declarations: [
+     StartOverComponent
+  ],
+  exports: [StartOverComponent ]
+})
+export class StartOverModule { }
diff --git a/claims/claim.module.ts b/claims/claim.module.ts
new file mode 100644
index 00000000..113e8597
--- /dev/null
+++ b/claims/claim.module.ts
@@ -0,0 +1,68 @@
+// import { NgModule}            from '@angular/core';
+// import { CommonModule }        from '@angular/common';
+// import { FormsModule }         from '@angular/forms';
+// //
+// import {UtilsModule} from '../utils/utils.module';
+// import {ServicesModule} from '../services/services.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 './claim-utils/claims.component';
+//
+// import {ClaimContextComponent} from './claim-utils/claimContext.component';
+// import {ClaimProjectsComponent} from './claim-utils/claimProject.component';
+// import {ClaimResultComponent} from './claim-utils/claimResult.component';
+// import {ClaimPublicationComponent} from './claim-utils/claimPublication.component';
+// import {ClaimDatasetComponent} from './claim-utils/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 './inlineClaims/inlineClaimContext.component';
+// import {InlineClaimProjectComponent} from './inlineClaims/inlineClaimProject.component';
+// import {InlineClaimResultComponent} from './inlineClaims/inlineClaimResult.component';
+// import {ClaimEntityFormatter} from '../utils/claimEntityFormatter.component';
+//
+// import { Claim } from '../utils/entities/claim';
+// //helpers
+//
+// import { ClaimRoutingModule } from './claim-routing.module';
+// @NgModule({
+//   imports: [
+//     CommonModule, FormsModule,
+//     UtilsModule,
+//     ServicesModule,
+//     ClaimRoutingModule
+//
+//   ],
+//   declarations: [
+//     ClaimsAdminComponent, MyClaimsComponent, ClaimComponent, ClaimsComponent,
+//     BulkLinkingComponent, LinkingComponent,  LinkingHomeComponent, LinkingGenericComponent,
+//     InlineClaimContextComponent, InlineClaimProjectComponent, InlineClaimResultComponent, ClaimSelectedComponent,
+//     ClaimContextComponent,  ClaimSelectedContextsComponent, ClaimInsertComponent, ClaimProjectsComponent, ClaimSelectedProjectsComponent,
+//     ClaimResultComponent,  ClaimSelectedPublicationsComponent, ClaimSelectedDatasetsComponent, ClaimSelectedResultsComponent,  ClaimPublicationComponent,
+//     ClaimDatasetComponent, BulkClaimComponent,
+//     ClaimEntityFormatter
+//   ],
+//   providers:    [ ClaimsService ],
+//   exports: [
+//     InlineClaimContextComponent, InlineClaimProjectComponent, InlineClaimResultComponent
+//   ]
+// })
+// export class ClaimModule { }
diff --git a/claims/claimsAdmin/claimsAdmin-routing.module.ts b/claims/claimsAdmin/claimsAdmin-routing.module.ts
new file mode 100644
index 00000000..f915d2e9
--- /dev/null
+++ b/claims/claimsAdmin/claimsAdmin-routing.module.ts
@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { AdminLoginGuard} from'../../login/adminLoginGuard.guard';
+
+import { ClaimsAdminComponent } from './claimsAdmin.component';
+import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      { path: '', component: ClaimsAdminComponent, canActivate: [IsRouteEnabled, AdminLoginGuard],
+      data: {redirect: '/error'}, canDeactivate: [PreviousRouteRecorder]}])
+  ]
+})
+export class ClaimsAdminRoutingModule { }
diff --git a/claims/claimsAdmin/claimsAdmin.component.ts b/claims/claimsAdmin/claimsAdmin.component.ts
new file mode 100644
index 00000000..c498cc6f
--- /dev/null
+++ b/claims/claimsAdmin/claimsAdmin.component.ts
@@ -0,0 +1,38 @@
+import {Component, ViewChild, Input} from '@angular/core';
+import {Location} from '@angular/common';
+import {Observable}       from 'rxjs/Observable';
+import { Meta} from '../../../angular2-meta';
+
+@Component({
+    selector: 'claims-admin',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+          <div class="uk-container">
+            <div class="uk-article-title custom-article-title">
+                Claims Administrator
+            </div>
+            <div>
+              <div class="uk-text-right"><a  routerLink="/participate/claim">Add more Links?</a></div>
+              <displayClaims [enableDelete]=true [myClaims]=false [isAdmin]=true></displayClaims>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    `,
+
+})
+export class ClaimsAdminComponent {
+  constructor ( private _meta: Meta ) {
+    this._meta.setTitle("OpenAIRE | Claims Administrator");
+  }
+  ngOnInit() {
+  }
+}
diff --git a/claims/claimsAdmin/claimsAdmin.module.ts b/claims/claimsAdmin/claimsAdmin.module.ts
new file mode 100644
index 00000000..947bc901
--- /dev/null
+++ b/claims/claimsAdmin/claimsAdmin.module.ts
@@ -0,0 +1,25 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../shared/shared.module';
+import { ClaimsAdminComponent } from './claimsAdmin.component';
+import { ClaimsAdminRoutingModule } from './claimsAdmin-routing.module';
+// import{ClaimServiceModule} from '../claim-utils/service/claimsService.module';
+import {DisplayClaimsModule} from '../claim-utils/displayClaims/displayClaims.module';
+import { AdminLoginGuard} from'../../login/adminLoginGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    SharedModule,
+    ClaimsAdminRoutingModule,
+    // ClaimServiceModule,
+    DisplayClaimsModule
+
+  ],
+    providers:[AdminLoginGuard, PreviousRouteRecorder,IsRouteEnabled],
+  declarations: [
+    ClaimsAdminComponent
+  ]
+})
+export class ClaimsAdminModule { }
diff --git a/claims/claimsByToken/claimsByToken-routing.module.ts b/claims/claimsByToken/claimsByToken-routing.module.ts
new file mode 100644
index 00000000..3d50376a
--- /dev/null
+++ b/claims/claimsByToken/claimsByToken-routing.module.ts
@@ -0,0 +1,15 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { LoginGuard} from'../../login/loginGuard.guard';
+import { ClaimsByTokenComponent } from './claimsByToken.component';
+import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      { path: '', component: ClaimsByTokenComponent, canActivate: [IsRouteEnabled, LoginGuard],
+      data: {redirect: '/error'}, canDeactivate: [PreviousRouteRecorder]}])
+  ]
+})
+export class ClaimsByTokenRoutingModule { }
diff --git a/claims/claimsByToken/claimsByToken.component.ts b/claims/claimsByToken/claimsByToken.component.ts
new file mode 100644
index 00000000..bab35bb1
--- /dev/null
+++ b/claims/claimsByToken/claimsByToken.component.ts
@@ -0,0 +1,433 @@
+import {Component, ViewChild, Input} from '@angular/core';
+import {Location} from '@angular/common';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Params} from '@angular/router';
+import {ClaimsByTokenService} from './claimsByToken.service';
+
+import {ModalSelect} from '../../utils/modal/selectModal.component';
+import {ModalLoading} from '../../utils/modal/loading.component';
+
+import {Session} from '../../login/utils/helper.class';
+
+import {RouterHelper} from '../../utils/routerHelper.class';
+import { Meta} from '../../../angular2-meta';
+import {ClaimsDatatablePipe} from '../../utils/pipes/claimsDatatable.pipe';
+
+//import {DataTable} from "angular2-datatable";
+
+@Component({
+    selector: 'claims-project-manager',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+<div class="uk-container">
+      <!--div *ngIf="accessStatus=='empty'" class="uk-margin-top uk-width-medium-2-3 uk-container-center">
+        <div class="uk-block uk-block-primary uk-block-large uk-contrast uk-text-center">
+          <p class="uk-text-large">Please enter your email and then press 'See Claims' button.</p>
+          <form class="uk-form">
+            <fieldset data-uk-margin>
+                <input type="text" placeholder="example@email.com" name="email" [(ngModel)]="email">
+                <button (click)="validateJWTandToken()" class=" uk-button uk-button-default">See Claims</button>
+            </fieldset>
+          </form>
+        </div>
+      </div-->
+
+      <div *ngIf="accessStatus=='invalid'" class="uk-margin-top uk-width-medium-2-3 uk-container-center">
+        <div class="uk-block uk-block-primary uk-block-large uk-contrast uk-text-center">
+          <!--p class="uk-text-large">Oops! There is no entry for you! Please retry with another email or for another project.</p-->
+          <!--button (click)="accessStatus='empty'" class=" uk-button uk-button-default">Retry</button-->
+          <p class="uk-text-large">Oops! Your email does not give you the authority to view claims for the selected project. Please contact the administrators.</p>
+        </div>
+      </div>
+
+      <div *ngIf="accessStatus=='valid'">
+      <div class="uk-article-title custom-article-title">
+          Claims Administrator        
+          <a [queryParams]="routerHelper.createQueryParam('projectId',project['openaireId'])"
+              routerLinkActive="router-link-active"
+              routerLink="/search/project" >
+                {{project['name']}} ({{project['funderName']}})
+          </a>
+
+        </div>
+        <h2> Pending Claims</h2>
+
+        <div *ngIf=" pending_claims && pending_claims.length == 0" >
+          <div class = "uk-alert uk-alert-primary " >No pending claims found.</div>
+        </div>
+
+        <div class="uk-overflow-container custom-dataTable-content">
+
+          <div  class="uk-width-1-1  uk-margin uk-padding uk-panel  uk-background-muted">
+            <form class="uk-text-center uk-panel">
+              <input type="text" class="uk-input uk-width-1-3" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="filterQuery"  name="keyword" />
+            </form>
+          </div>
+
+          <span *ngIf="pending_claims && pending_claims.length > 0 && totalPendingResults.count > 0">
+            {{totalPendingResults.count}} pending claims, page {{activePendingPage.page}} of {{totalPages(totalPendingResults.count)}}
+            <paging-no-load class="uk-float-right" [currentPage]="activePendingPage.page" [totalResults]="totalPendingResults.count" [size]="rowsOnPage" (pageChange)="refreshTable(table1, $event, 'pending')"></paging-no-load>
+          </span>
+          <table #filtered1 *ngIf="pending_claims && pending_claims.length > 0" class="uk-table uk-table-striped"
+                  [mfData]="pending_claims | claimsDatatable : [filterQuery, totalPendingResults, activePendingPage]" #mf1="mfDataTable" [mfRowsOnPage]="rowsOnPage" [mfActivePage]="1">
+                  <!--[(mfSortBy)]="sortByClaimDate1" (mfSortOrder)="sortOrder"-->
+            <thead>
+               <tr>
+                  <th><mfDefaultSorter [by]="sortByTitle1">Research Result</mfDefaultSorter></th>
+                  <th class="uk-text-center"><mfDefaultSorter by="userMail">Claimed By</mfDefaultSorter></th>
+                  <th class="uk-text-center"><mfDefaultSorter [by]="sortByClaimDate1">Claimed Date</mfDefaultSorter></th>
+                  <th class="uk-text-center">Approve</th>
+               </tr>
+            </thead>
+            <tbody>
+                <tr class="uk-table-middle" *ngFor="let claim1 of mf1.data">
+                  <td  class="uk-width-2-5" *ngIf="claim1.targetType != 'project'"><claim-entity [entity]="claim1.target" [type]="claim1.targetType" > </claim-entity></td>
+                  <td class="uk-width-2-5 uk-text-center" *ngIf="claim1.sourceType != 'project'"><claim-entity [entity]="claim1.source" [type]="claim1.sourceType" > </claim-entity></td>
+                  <td class="uk-width-1-5 uk-text-center">{{claim1.userMail}}</td>
+                  <td class="uk-width-1-5 uk-text-center">{{claim1.date}}</td>
+                  <td class="uk-width-1-5 uk-text-center">
+
+                    <label>
+                      Yes <input [id]="claim1.id" type="checkbox" (click)="selectApprove(claim1.id,$event)"  [ngModel]="isSelectedRight(claim1.id)"/>
+                    </label>
+                    <label>
+                      No  <input [id]="claim1.id" type="checkbox" (click)="selectDisapprove(claim1.id,$event)"  [ngModel]="isSelectedWrong(claim1.id)"/>
+                    </label>
+                  </td>
+                </tr>
+            </tbody>
+          </table>
+         </div>
+
+         <div class="uk-text-small uk-text-right">*Note that claims you did not approved or disapproved are considered as right (but not curated)</div>
+         <button class="uk-button uk-button-primary uk-float-right" type="submit" (click)="saveChanges()">Save Changes</button>
+
+        <h2> Already Curated Claims</h2>
+
+        <div *ngIf=" curated_claims && curated_claims.length == 0" >
+          <div class = "uk-alert uk-alert-primary " >No curated claims found.</div>
+        </div>
+
+        <div class="uk-overflow-container custom-dataTable-content">
+
+          <div  class="uk-width-1-1  uk-margin uk-padding uk-panel  uk-background-muted">
+            <form class="uk-text-center uk-panel">
+              <input type="text" class="uk-input uk-width-1-3" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="filterQuery2"  name="keyword" />
+            </form>
+          </div>
+
+          <span *ngIf="curated_claims && curated_claims.length > 0 && totalCuratedResults.count > 0">
+            {{totalCuratedResults.count}} curated claims, page {{activeCuratedPage.page}} of {{totalPages(totalCuratedResults.count)}}
+            <paging-no-load class="uk-float-right" [currentPage]="activeCuratedPage.page" [totalResults]="totalCuratedResults.count" [size]="rowsOnPage"  (pageChange)="refreshTable(table2, $event, 'curated')"> </paging-no-load>
+          </span>
+
+          <table *ngIf="curated_claims && curated_claims.length > 0" class="uk-table uk-table-striped"
+                        [mfData]="curated_claims | claimsDatatable : [filterQuery2, totalCuratedResults, activeCuratedPage]" #mf2="mfDataTable" [mfRowsOnPage]="rowsOnPage" [mfActivePage]="1">
+                        <!--[(mfSortBy)]="sortByCurationDate2" [(mfSortOrder)]="sortOrder"-->
+            <thead>
+              <!--tr>
+                <td colspan="6">
+                  <form class="uk-text-center uk-panel uk-background-muted">
+                    <input type="text" class="uk-input uk-width-1-3" placeholder="Type keywords..." aria-describedby="sizing-addon2"  [(ngModel)]="filterQuery2"  name="keyword" />
+                  </form>
+                </td>
+              </tr-->
+              <!--tr>
+                <td>
+                  Filter curated claims:
+                  <input class="uk-input uk-width-1-3" [(ngModel)]="filterQuery2"/>
+                </td>
+              </tr-->
+              <tr>
+                <th><mfDefaultSorter [by]="sortByTitle1">Research Result</mfDefaultSorter></th>
+                <!--th>Link to</th-->
+                <th class="uk-text-center"><mfDefaultSorter by="userMail">Claimed by</mfDefaultSorter></th>
+                <th class="uk-text-center"><mfDefaultSorter [by]="sortByClaimDate2">Claimed Date</mfDefaultSorter></th>
+                <th class="uk-text-center"><mfDefaultSorter by="curatedBy">Curated by</mfDefaultSorter></th>
+                <th class="uk-text-center"><mfDefaultSorter [by]="sortByCurationDate2">Curation Date</mfDefaultSorter></th>
+                <th class="uk-text-center">Approved</th>
+              </tr>
+            </thead>
+            <tbody>
+                <tr class="uk-table-middle" *ngFor="let claim of mf2.data let i=index">
+                  <td class="uk-width-1-6" *ngIf="claim.targetType != 'project'"><claim-entity [entity]="claim.target" [type]="claim.targetType" > </claim-entity></td>
+                  <td class="uk-width-1-6" *ngIf="claim.sourceType != 'project'"><claim-entity [entity]="claim.source" [type]="claim.sourceType" > </claim-entity></td>
+                  <td class="uk-width-1-6 uk-text-center">{{claim.userMail}}</td>
+                  <td class="uk-width-1-6 uk-text-center">{{claim.date}}</td>
+                  <td class="uk-width-1-6 uk-text-center">{{claim.curatedBy}}</td>
+                  <td class="uk-width-1-6 uk-text-center">{{claim.curationDate}}</td>
+                  <td class="uk-width-1-6 uk-text-center">
+
+                   <label>
+                      Yes <input [id]="claim.id" type="checkbox" [disabled]="!editable.has(i)" [ngModel]="isRight(claim)"/>
+                    </label>
+
+                    <label>
+                      No  <input [id]="claim.id" type="checkbox" [disabled]="!editable.has(i)" [ngModel]="isWrong(claim)"/>
+                    </label>
+
+                  </td>
+                  <!--td><input [id]="claim.id" type="checkbox" [disabled]="!editable.has(i)" (click)="selectDisapprove(claim.id,$event)"  [ngModel]="isWrong(claim)"/></td-->
+                  <!--td><button class="uk-button" (click)="editable.add(i)">Edit</button></td-->
+                </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <!--modal-select (alertOutput)="curatorSelected($event)"></modal-select-->
+        <modal-loading [message]= "'Loading...'"></modal-loading>
+      </div>
+
+</div>
+</div>
+</div>
+</div>
+    `,
+
+})
+export class ClaimsByTokenComponent {
+  public token: string = "";
+  public sub: any;
+  public project: any;
+  private claims:any = [];
+  public pending_claims: any = [];
+  public curated_claims: any = [];
+  public selectedRight: Set<string>;
+  public selectedWrong: Set<string>;
+  public editable: Set<string>;
+  public contact_person: string[] = ["Konstantina", "Argiro", "Katerina"];
+
+  // when 'valid' show proper claims, when 'invalid' show no matched entry-wanna retry
+  public accessStatus: string;// = "empty";
+
+  public rowsOnPage = 5;
+  public sortOrder = "asc";
+  public filterQuery:string = "";
+  public filterQuery2:string = "";
+
+  public activePendingPage:any = {page: 1};
+  public totalPendingResults:any = {count: 0};
+  public activeCuratedPage:any = {page: 1};
+  public totalCuratedResults:any = {count: 0};
+
+
+  @ViewChild('mf1') table1: any;//DataTable;
+  @ViewChild('mf2') table2: any;//DataTable;
+  @ViewChild('filtered1') filteredItems1;
+
+
+  @ViewChild (ModalSelect) selectModal : ModalSelect;
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+
+  public routerHelper:RouterHelper = new RouterHelper();
+
+  constructor ( private route: ActivatedRoute, private claimsByTokenService: ClaimsByTokenService, private _meta: Meta) {
+
+  }
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(params => {
+        this.token = params['token'];
+        this.selectedRight = new Set<string>();
+        this.selectedWrong = new Set<string>();
+        this.editable = new Set<string>();
+        //this.openSelect();
+        //this.setMessageSelect("Please select your identity:");
+        //this.setOptionsSelect(this.contact_person);
+        this.validateJWTandToken();
+        this.updateTitle("Claims For Project Managers");
+      }
+    );
+  }
+
+refreshTable(table:any, $event:any, whichTable: string) {
+  if(whichTable == "pending") {
+    this.activePendingPage.page = $event.value;
+  } else if(whichTable == 'curated') {
+    this.activeCuratedPage.page = $event.value;
+  }
+  table.mfActivePage=$event.value;
+  table.setPage(table.mfActivePage, this.rowsOnPage);
+}
+
+public sortByClaimDate1 = (claim: any) => {
+  return new Date(claim.date);
+}
+
+public sortByCurationDate1 = (claim: any) => {
+  return new Date(claim.curationDate);
+}
+
+public sortByTitle1 = (claim: any) => {
+  if(claim.targetType != 'project') {
+    return claim.target.title;
+  } else {
+    return claim.source.title;
+  }
+}
+
+public sortByClaimDate2 = (claim: any) => {
+  return new Date(claim.date);
+}
+
+public sortByCurationDate2 = (claim: any) => {
+  console.info(new Date(claim.curationDate));
+  return new Date(claim.curationDate);
+}
+
+public sortByTitle2= (claim: any) => {
+  if(claim.targetType != 'project') {
+    return claim.target.title;
+  } else {
+    return claim.source.title;
+  }
+}
+
+
+  validateJWTandToken() {
+    var jwtToken=Session.getUserJwt();
+    if(this.token) {
+      this.claimsByTokenService.getClaims(this.token, jwtToken).subscribe(
+          data => {
+            this.closeLoading();
+            this.accessStatus = "valid";
+              //console.info(data);
+              this.claims = data.data;
+              for(let claim of this.claims) {
+                if(claim.targetType == "project") {
+                  this.project = claim.target;
+                } else {
+                  this.project = claim.source;
+                }
+                if(claim.curatedBy) {
+                  this.curated_claims.push(claim);
+                } else {
+                  this.pending_claims.push(claim);
+                }
+              }
+
+              this.totalPendingResults.count = this.pending_claims.length;
+              this.totalCuratedResults.count = this.curated_claims.length;
+
+              this.updateTitle("Claims For Project Managers - "+this.project.name);
+          },
+          err => {
+              this.accessStatus = "invalid";
+              console.log(err);
+          }
+        );
+      } else {
+        this.accessStatus = "invalid";
+      }
+  }
+
+  selectApprove(id:string, event) {
+    var value = event.currentTarget.checked;
+    if(value){
+      this.selectedRight.add(id);
+      this.selectedWrong.delete(id);
+      console.info(this.selectedRight);
+    }else{
+      this.selectedRight.delete(id);
+      console.info(this.selectedRight);
+    }
+  }
+
+  selectDisapprove(id:string,event) {
+    var value = event.currentTarget.checked;
+    if(value){
+      this.selectedWrong.add(id);
+      this.selectedRight.delete(id);
+    }else{
+      this.selectedWrong.delete(id);
+    }
+  }
+
+  isSelectedRight(id:string) {
+    return this.selectedRight.has(id);
+  }
+
+  isSelectedWrong(id:string) {
+    return this.selectedWrong.has(id);
+  }
+
+  isRight(claim: any) {
+    //claim.approved = true;
+    if(this.isSelectedRight(claim.id)) {
+      return true;
+    } else if(claim.approved == true && !this.isSelectedWrong(claim.id)) {
+      return true;
+    }
+
+    return false;
+  }
+
+  isWrong(claim: any) {
+    if(this.isSelectedWrong(claim.id)) {
+      return true;
+    } else if(claim.approved == false && !this.isSelectedRight(claim.id)) {
+      return true;
+    }
+
+    return false;
+  }
+
+  saveChanges() {
+    console.info("Changes Saved!");
+    var jwtToken=Session.getUserJwt();
+
+    this.claimsByTokenService.updateClaimsCuration(this.selectedRight, this.selectedWrong).subscribe(
+        data => {
+            console.info(data);
+        },
+        err => {
+            console.log(err);
+        }
+      );
+
+  }
+
+  public closeLoading(){
+    if(this.loading){
+      this.loading.close();
+    }
+  }
+
+  curatorSelected(selected: string) {
+    console.info("selected curator: "+selected);
+  }
+
+  public openSelect(){
+    if(this.selectModal){
+      this.selectModal.open();
+    }
+  }
+
+  public setMessageSelect(message: string){
+    if(this.selectModal){
+      this.selectModal.message = message;
+    }
+  }
+
+  public setOptionsSelect(options: string[]){
+    if(this.selectModal){
+      this.selectModal.options = options;
+    }
+  }
+
+  totalPages(totalResults: number): number {
+      let totalPages:any = totalResults/(this.rowsOnPage);
+      if(!(Number.isInteger(totalPages))) {
+          totalPages = (parseInt(totalPages, 10) + 1);
+      }
+      return totalPages;
+  }
+
+  updateTitle(title:string){
+    var _prefix ="OpenAIRE | ";
+    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+    this._meta.setTitle(_title );
+  }
+
+}
diff --git a/claims/claimsByToken/claimsByToken.module.ts b/claims/claimsByToken/claimsByToken.module.ts
new file mode 100644
index 00000000..9f5827b5
--- /dev/null
+++ b/claims/claimsByToken/claimsByToken.module.ts
@@ -0,0 +1,49 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import {DataTableModule} from "angular2-datatable";
+
+import { SharedModule } from '../../shared/shared.module';
+import { ClaimsByTokenComponent } from './claimsByToken.component';
+import { ClaimsByTokenService } from './claimsByToken.service';
+import { ClaimsByTokenRoutingModule } from './claimsByToken-routing.module';
+import {ClaimEntityFormatterModule} from '../claim-utils/entityFormatter/claimEntityFormatter.module';
+// import{ClaimServiceModule} from '../claim-utils/service/claimsService.module';
+//import {DisplayClaimsModule} from '../claim-utils/displayClaims/displayClaims.module';
+import {SelectModalModule} from '../../utils/modal/selectModal.module';
+import {LoadingModalModule} from '../../utils/modal/loadingModal.module';
+
+import {LoginGuard} from'../../login/loginGuard.guard';
+
+import {PagingModule} from '../../utils/paging.module';
+import {ClaimsDatatablePipe} from '../../utils/pipes/claimsDatatable.pipe';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+
+@NgModule({
+  imports: [
+    RouterModule,
+    DataTableModule,
+    SharedModule,
+    ClaimsByTokenRoutingModule,
+    ClaimEntityFormatterModule,
+    SelectModalModule,
+    LoadingModalModule,
+    PagingModule
+    // ClaimServiceModule,
+    //DisplayClaimsModule
+
+  ],
+  providers:[
+    ClaimsByTokenService,
+    LoginGuard, PreviousRouteRecorder, IsRouteEnabled
+  ],
+  declarations: [
+    ClaimsByTokenComponent, ClaimsDatatablePipe
+  ],
+  exports: [
+      ClaimsByTokenComponent, ClaimsDatatablePipe
+    ]
+})
+export class ClaimsByTokenModule { }
diff --git a/claims/claimsByToken/claimsByToken.service.ts b/claims/claimsByToken/claimsByToken.service.ts
new file mode 100644
index 00000000..ab75c85a
--- /dev/null
+++ b/claims/claimsByToken/claimsByToken.service.ts
@@ -0,0 +1,77 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Jsonp, URLSearchParams,ResponseOptions, RequestOptions, Headers} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/operator/do';
+
+import { CustomOptions } from '../claim-utils/service/customOptions.class';
+
+@Injectable()
+export class ClaimsByTokenService {
+
+    constructor(private http: Http ) {}
+
+    getClaims(token: string, jwtToken: string):any {
+        console.info("getClaims in service");
+
+        let url = OpenaireProperties.getClaimsAPIURL()+"project/claims?projectToken="+token;
+
+        let key = url;
+
+        return this.http.get(url, CustomOptions.getAuthOptions())
+                    //.map(res => <any> res.text())
+                    .map(request => <any> request.json());
+                 
+    }
+
+
+/*
+    getClaims(email: string, token: string, user_token: string):any {
+      let url = OpenaireProperties.getClaimsAPIURL();   // What else?
+      let body = JSON.stringify( {"email": email, "token": token} );
+      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);
+    }
+*/
+
+  updateClaimsCuration( selectedRight: Set<string>, selectedWrong: Set<string>) {
+    let url = OpenaireProperties.getClaimsAPIURL() + "curate/bulk";
+    let claimsCurationInfo: any = []; //e.g.:  [{"id":"2","approved":true},{"id":"1","approved":true}]
+
+    selectedRight.forEach(function(selected) {
+      console.info(selected);
+      let claimCurationInfo: {"id": string, "approved": boolean} = {"id": selected, "approved": true};
+      claimsCurationInfo.push(claimCurationInfo);
+    });
+
+    selectedWrong.forEach(function(selected) {
+      let claimCurationInfo: any = {"id": selected, "approved": false};
+      claimsCurationInfo.push(claimCurationInfo);
+    });
+
+    console.info("\n\n"+claimsCurationInfo);
+
+
+    let body = JSON.stringify( claimsCurationInfo );
+    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,  CustomOptions.getAuthOptionsWithBody())
+                          .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.log(error);
+    return Observable.throw(error  || 'Server error');
+  }
+}
diff --git a/claims/directLinking/directLinking-routing.module.ts b/claims/directLinking/directLinking-routing.module.ts
new file mode 100644
index 00000000..e9ed1f35
--- /dev/null
+++ b/claims/directLinking/directLinking-routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { LoginGuard} from'../../login/loginGuard.guard';
+
+import { DirectLinkingComponent } from './directLinking.component';
+import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      { path: '', component: DirectLinkingComponent, canActivate: [IsRouteEnabled, LoginGuard], data: {
+          redirect: '/error'
+        }, canDeactivate: [PreviousRouteRecorder]},
+
+    ])
+  ]
+})
+export class DirectLinkingRoutingModule { }
diff --git a/claims/directLinking/directLinking.component.html b/claims/directLinking/directLinking.component.html
new file mode 100644
index 00000000..5dab8ae8
--- /dev/null
+++ b/claims/directLinking/directLinking.component.html
@@ -0,0 +1,135 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div class="uk-container uk-margin-top">
+  <div class="uk-article-title custom-article-title">
+        Link
+  </div>
+  <div class="uk-width-1-1">
+    <helper position="top"></helper>
+  </div>
+  <div class="uk-grid  helper-grid">
+    <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
+    <div class="uk-width-expand">
+      <div *ngIf="validInput != null && !validInput" class="uk-alert uk-alert-warning" role="alert">No valid arguments provided in order to start linking openAIRE entities. </div>
+      <div *ngIf="validInput != null && validInput">
+      <!--div class="uk-clearfix">
+          <a  class="uk-float-right" uk-toggle="target: #linkingInfo; animation:  uk-animation-fade"><span class="uk-icon">
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+            </span> More Information </a>
+      </div>
+      <div id="linkingInfo" class="uk-card uk-card-default uk-card-body uk-margin-small" hidden>
+          <a uk-toggle="target: #linkingInfo; animation:  uk-animation-fade" class="uk-float-right"><span class="uk-icon">
+      <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+      </span></a>
+           <div class="uk-text-bold"><span class="uk-icon">
+      <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+      </span> Linking Functionality:</div>
+           <p>Through linking functioanilty you are able to create links from {{type}} to {{(linkTo =='context')?"communities/ concepts":((linkTo =='project')?"projects":"research results")}}. You have to select at least one {{(linkTo =='context')?"community/ concept":((linkTo =='project')?"project":"research result")}} in order to be able to proceed.</p>
+
+           <p *ngIf="linkTo=='project'"><span class="uk-text-bold">Projects:</span> Search & add projects using keyword search. Limit the search space by specifying project Funder. </p>
+           <p *ngIf="linkTo=='context'"><span class="uk-text-bold">Communities:</span> Search & add communities/ concepts by selecting community, category and using keyword search for . Or browse through the categories and add communities. </p>
+           <p *ngIf="linkTo=='result'"><span class="uk-text-bold">Research Results:</span> You can search for reasearch results (publication and/ or research data) to link, in openaire, crossref, Orcid, and/ or Datacite. Use search mode, to search and add results through keyword search. Use upload mode, to upload a list of DOIs of results. </p>
+           <p *ngIf="show=='claim' && linkTo=='result'"><span class="uk-text-bold">Review Metadata of research results:</span> The selected research results that came from 3rd party repositories (Datacite, Crossreff, Orcid), need review and change of metadata (such as access mode, and type)  before they are included in openaire information space.
+           Please have in mind that ignoring this step, the research results will get the default values, that may be wrong.
+           </p>
+
+
+
+       </div-->
+       <ul uk-accordion>
+         <li>
+             <h3 class=" uk-text-right uk-margin-remove-vertical uk-width-small uk-margin-auto-left uk-accordion-title basket-title ">
+             <span class="uk-icon"><svg xml:space="preserve" xmlns:xlink="http://www.w3.org/1999/xlink" height="28px" id="my-box" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="28px" x="0px" xmlns="http://www.w3.org/2000/svg" y="0px"><g>	<path d="M480,320v128H32V320h78.859l64.016,96h162.25l64-96H480 M384,32H128L0,288v192h512V288L384,32L384,32z M35.781,288l112-224 h216.438l112,224H384l-64,96H192l-64.016-96H35.781L35.781,288z" fill="#b5b5b5"></path></g> </svg> </span>
+             <span *ngIf="(projects.length + contexts.length + results.length)> 0" class="uk-badge basket-badge ">{{(projects.length + contexts.length + results.length)}}</span>
+           </h3>
+             <div class="uk-accordion-content dropbasket uk-padding-small uk-margin uk-grid-match uk-child-width-1-1 uk-child-width-1-1@m uk-grid uk-grid-stack">
+               <claim-selected-projects *ngIf=" linkTo == 'project' "   title="link Projects" [projects]="projects" [show]="show" [linkType]=linkType
+                (showChange)="showChange($event)"   > </claim-selected-projects>
+
+             <claim-selected-contexts *ngIf=" linkTo == 'context' "  title="link Communities" [contexts]="contexts"  [projects]="projects"  [results]="results" [inlineEntity] = "inlineResult" [show]="show" [linkType]=linkType
+             (showChange)="showChange($event)"  > </claim-selected-contexts>
+             <claim-selected-results *ngIf=" linkTo == 'result' "   title= "Selected Research Results" [results]="results"  [bulkMode]="bulkMode" showSearch=false  showAccessRights=false>
+             </claim-selected-results>
+             </div>
+         </li>
+     </ul>
+       <!--div *ngIf=" ! (linkTo =='result' && show=='claim') " >
+         <div class="uk-clearfix">
+             <a  class="uk-float-right" uk-toggle="target: #selected; animation:  uk-animation-fade">
+               <span class="uk-icon"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="my-box"  x="0px" y="0px" width="28px" height="28px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve"><g>	<path d="M480,320v128H32V320h78.859l64.016,96h162.25l64-96H480 M384,32H128L0,288v192h512V288L384,32L384,32z M35.781,288l112-224   h216.438l112,224H384l-64,96H192l-64.016-96H35.781L35.781,288z" fill="#b5b5b5"/></g>
+                   </svg>
+                 </span>
+
+                </a>
+         </div>
+         <div id="selected" class="uk-card uk-card-default uk-card-body uk-margin-small" hidden>
+              <claim-selected-projects *ngIf=" linkTo == 'project' "   title="link Projects" [projects]="projects" [show]="show" [linkType]=linkType
+               (showChange)="showChange($event)"   > </claim-selected-projects>
+
+            <claim-selected-contexts *ngIf=" linkTo == 'context' "  title="link Communities" [contexts]="contexts"  [projects]="projects"  [results]="results" [inlineEntity] = "inlineResult" [show]="show" [linkType]=linkType
+            (showChange)="showChange($event)"  > </claim-selected-contexts>
+            <claim-selected-results *ngIf=" linkTo == 'result' "   title= "Selected Research Results" [results]="results"  [bulkMode]="bulkMode" showSearch=false  showAccessRights=false>
+            </claim-selected-results>
+        </div>
+      </div-->
+        <div class="uk-text-large">
+              Link {{(type=="project")?'Project':' Research result'}}:
+        </div>
+          <div class="uk-clearfix">
+            <!--start-over [results]="results" [contexts]="contexts" [projects]="projects" [linkTo]="linkTo" [type]="type" ></start-over-->
+          </div>
+            <!-- inline result -->
+              <div *ngIf="displayedResult != null && (type =='publication' || type =='dataset' || type=='software' )" class=" uk-margin-top  uk-card uk-card-default uk-padding uk-padding-large uk-padding-remove-left uk-margin-left uk-grid uk-grid-stack" uk-grid="">
+                <div class="uk-width-1-1" >
+                    <div>
+                      <a *ngIf="displayedResult.url" target="_blank" href="{{displayedResult.url}}" > <span class="custom-external"></span> {{displayedResult.title}}</a>
+                      <span *ngIf="!displayedResult.url" >{{displayedResult.title}}</span>
+                    </div>
+                    <div *ngIf="displayedResult.result.authors && displayedResult.result.authors.length >0 " class="uk-article-meta">Authors: <span *ngFor="let author of displayedResult.result.authors.slice(0,10) let i = index">{{author}}{{(i < (displayedResult.result.authors.slice(0,10).length-1))?"; ":""}}{{(i == displayedResult.result.authors.slice(0,10).length-1 && displayedResult.result.authors.length > 10)?"...":""}}</span></div>
+
+                </div>
+
+            </div>
+            <!-- inline project -->
+            <div *ngIf=" type == 'project' && projects.length > 0 "  class="uk-margin-top  uk-card uk-card-default uk-padding uk-padding-large uk-padding-remove-left uk-margin-left uk-grid uk-grid-stack" uk-grid="">
+            {{projects[0].funderName}} | {{projects[0].projectName}} {{(projects[0].projectAcronym)?'('+projects[0].projectAcronym+')':''}}
+
+            </div>
+
+      <!-- search for entity -->
+
+        <div class = "uk-margin-top">
+
+                  <claim-projects-search-form *ngIf=" linkTo =='project'  "    [(selectedProjects)]="projects"    > </claim-projects-search-form>
+
+                  <claim-contexts-search-form   *ngIf=" linkTo =='context'  "   [(selectedList)]="contexts" [projects]="projects" [results]="results" [inlineEntity]="inlineResult" > </claim-contexts-search-form>
+
+                  <claim-result-search-form *ngIf=" linkTo =='result' && show!='claim' "  [selectedResults]="results"   > </claim-result-search-form>
+
+          </div>
+          <div  *ngIf="  show == 'claim'  "  class="uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l ">
+            <claim-selected-results *ngIf=" linkTo =='result'  "  title= "Selected Research Results" [results]="results"  [bulkMode]=false showSearch = false  showAccessRights = true>
+            </claim-selected-results>
+            <div class="uk-width-1-1  uk-margin-small-top">
+               <claim-insert   [contexts]="contexts" [results]="results"  [projects]="projects" [inlineEntity] = "inlineResult"  [show] = "show"
+                       (showChange)="showChange($event)" ></claim-insert>
+              </div>
+          </div>
+          <ul *ngIf="linkTo == 'result'"  class="uk-pagination">
+            <li  *ngIf="show == 'claim'"  (click)="show='result';"><a><span class="uk-margin-small-right" uk-pagination-previous></span>  Previous</a></li>
+            <li  *ngIf="show != 'claim'"(click)="show='claim';" class="uk-margin-auto-left">
+              <a>Next <span class="uk-margin-small-left" uk-pagination-next></span></a></li>
+          </ul>
+
+
+        </div>
+        </div>
+        <helper position="right" styleName=" uk-width-1-5"></helper>
+    </div>
+    <helper position="bottom"></helper>
+  </div>
+</div>
+</div>
+</div>
diff --git a/claims/directLinking/directLinking.component.ts b/claims/directLinking/directLinking.component.ts
new file mode 100644
index 00000000..8df535bb
--- /dev/null
+++ b/claims/directLinking/directLinking.component.ts
@@ -0,0 +1,208 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {EntitiesSearchService} from '../../utils/entitiesAutoComplete/entitySearch.service';
+import {ClaimProject, ClaimResult} from '../claim-utils/claimEntities.class';
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import {SearchDatasetsService} from '../../services/searchDatasets.service';
+import {SearchSoftwareService} from '../../services/searchSoftware.service';
+
+import { Meta} from '../../../angular2-meta';
+
+@Component({
+    selector: 'directLinking',
+    templateUrl: 'directLinking.component.html'
+})
+export class DirectLinkingComponent {
+  contexts=[];
+  projects=[];
+
+  results = [];
+
+  linkType:string ="project"; // link type (selected in home page) : project, context, software, etc
+  /* url Parameters for inline linking */
+  id:string = null; //entity id
+  type:string = null; // entity type (publication or dataset)
+  linkTo:string = null; // entity type (project or context or result)
+
+  entityTypes=["dataset", "publication","software", "project","context"];
+  inlineResult:ClaimResult =null;
+  displayedResult:ClaimResult =null;
+  sub:any =null;
+  show:string="claim"; //{claim,result}
+  validInput:boolean = null;//'true;
+  constructor ( private _router: Router,  private route: ActivatedRoute, private entitySearch:EntitiesSearchService,
+    private publicationsSearch:SearchPublicationsService, private datasetsSearch:SearchDatasetsService, private softwareSearch:SearchSoftwareService, private _meta: Meta) {
+      this._meta.setTitle("OpenAIRE | Direct Linking");
+  }
+  ngOnInit() {
+    if(localStorage.getItem("projects")){
+      this.projects  = JSON.parse(localStorage.getItem("projects"));
+    }
+    if(localStorage.getItem("contexts")){
+      this.contexts  = JSON.parse(localStorage.getItem("contexts"));
+    }
+    if(localStorage.getItem("results")){
+      this.results  = JSON.parse(localStorage.getItem("results"));
+    }
+    if(localStorage.getItem("inlineEntity")){
+      this.inlineResult  = JSON.parse(localStorage.getItem("inlineEntity"));
+    }
+
+    localStorage.removeItem("projects");
+    localStorage.removeItem("contexts");
+    localStorage.removeItem("results");
+    localStorage.removeItem("inlineEntity");
+
+    this.sub = this.route.queryParams.subscribe(params => {
+       this.id = params['id'];
+       this.type = params['type'];
+       this.linkTo = params['linkTo'];
+       if(this.type!=null && this.linkTo!=null){
+         this.type = (this.entityTypes.indexOf(this.type) != -1)? this.type:'publication';
+         this.linkTo = (this.entityTypes.indexOf(this.linkTo) != -1 || this.linkTo == "result")? this.linkTo:'project';
+         this.show = (this.linkTo != "result")?"claim":"result";
+         this.linkType = this.linkTo;
+         var isInlineResult:boolean = false; // is a link result - result
+        //  if((this.type == "publication" || this.type == "dataset" || this.type == "software") && ((this.linkTo == "publication" || this.linkTo == "dataset" || this.linkTo == "software") ||  this.linkTo == "result" )){
+        //    isInlineResult = true;
+        //  }
+         if(this.type == "project"){
+           this.linkType = "project";
+           this.getProjectById(this.id);
+         }else if(this.type == "publication"){
+            this.getPublicationById(this.id,true);
+         }else if(this.type == "dataset"){
+            this.getDatasetById(this.id,true);
+          }else if(this.type == "software"){
+             this.getSoftwareById(this.id,true);
+           }else{
+            this.validInput = this.isValidInput(null);
+          }
+
+       }else{
+         this.validInput = this.isValidInput(null);
+
+       }
+
+   });
+  }
+  isValidInput(result){
+    if(result == null){
+      return false;
+    }else if(this.type == "project" && this.linkTo != "result"){
+      return false;
+    }else if(["dataset","publication","software"].indexOf(this.type) != -1 && (["project","context","result"].indexOf(this.linkTo) == -1)){
+      return false;
+    }else if(["project","dataset","publication","software"].indexOf(this.type) == -1){
+      return false;
+    }else{
+      return true;
+    }
+  }
+  getProjectById(id:string){
+       this.sub = this.entitySearch.fetchByType(id,"project").subscribe(
+        data => {
+          console.log(data);
+          var item =data[0];
+             var project: ClaimProject = new ClaimProject();
+              project.funderId = item.funderId;
+              project.funderName = item.funderName;
+              project.projectId = id;
+              project.projectName = item.projectName;
+              project.projectAcronym = item.projectAcronym;
+              project.startDate = item.startDate;
+              project.endDate = item.endDate;
+              project.code = item.code;
+              project.jurisdiction = item.jurisdiction;
+              project.fundingLevel0 = item.fundingLevel0;
+
+            this.projects.push( project);
+            this.validInput = this.isValidInput(project);
+
+          },
+        err => {
+          this.validInput = this.isValidInput(null);
+          console.log("An error occured")
+        });
+      }
+    getPublicationById(id:string, isInlineResult:boolean){
+
+        this.sub = this.publicationsSearch.searchPublicationById(id).subscribe(
+          data => {
+             var item =data[0];
+            var result: ClaimResult = new ClaimResult();
+            result.id=id;
+            result.type="publication";
+            result.source="openaire";
+            result.title = item['title'].name;
+            result.url= item['title'].url;
+            result.result = item;
+            result.accessRights = item['title'].accessMode;
+            result.date = item.year;
+            this.displayedResult = result;
+            if(isInlineResult){
+              this.inlineResult = result;
+            }else{
+              this.results.push( result);
+            }
+            this.validInput = this.isValidInput(result);
+        },
+      err =>  {
+        this.validInput = this.isValidInput(null);
+        console.log("An error occured")
+      });
+      }
+    getDatasetById(id:string, isInlineResult:boolean){
+        this.sub = this.datasetsSearch.searchDatasetById(id).subscribe(
+          data => {
+             var item =data[0];
+             var result: ClaimResult = new ClaimResult();
+             result.id=id;
+             result.type="dataset";
+             result.source="openaire";
+             result.title = item['title'].name;
+             result.url= item['title'].url;
+             result.result = item;
+             result.accessRights = item['title'].accessMode;
+             result.date = item.year;
+             this.displayedResult = result;
+             if(isInlineResult){
+               this.inlineResult = result;
+             }else{
+               this.results.push( result);
+             }
+             this.validInput = this.isValidInput(result);
+        },
+      err =>  {
+        this.validInput = this.isValidInput(null);
+        console.log("An error occured")
+      });
+  }
+  getSoftwareById(id:string, isInlineResult:boolean){
+      this.sub = this.softwareSearch.searchSoftwareById(id).subscribe(
+        data => {
+           var item =data[0];
+           var result: ClaimResult = new ClaimResult();
+           result.id=id;
+           result.type="software";
+           result.source="openaire";
+           result.title = item['title'].name;
+           result.url= item['title'].url;
+           result.result = item;
+           result.accessRights = item['title'].accessMode;
+           result.date = item.year;
+           this.displayedResult = result;
+           if(isInlineResult){
+             this.inlineResult = result;
+           }else{
+             this.results.push( result);
+           }
+           this.validInput = this.isValidInput(result);
+      },
+    err =>  {
+      this.validInput = this.isValidInput(null);
+      console.log("An error occured")
+    });
+}
+}
diff --git a/claims/directLinking/directLinking.module.ts b/claims/directLinking/directLinking.module.ts
new file mode 100644
index 00000000..742d548d
--- /dev/null
+++ b/claims/directLinking/directLinking.module.ts
@@ -0,0 +1,40 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../shared/shared.module';
+import { DirectLinkingComponent } from './directLinking.component';
+import { DirectLinkingRoutingModule } from './directLinking-routing.module';
+
+import {SelectedProjectsModule} from '../linking/selected/selectedProjects.module';
+import {SelectedContextsModule} from '../linking/selected/selectedContexts.module';
+import {SelectedPublicationsModule} from '../linking/selected/selectedResults.module';
+import {InsertClaimsModule} from '../linking/insertClaim/insertClaim.module';
+import {StartOverModule} from '../claim-utils/startOver.module';
+
+import {EntitySearchServiceModule} from '../../utils/entitiesAutoComplete/entitySearchService.module';
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+import {SoftwareServiceModule} from '../../services/softwareService.module';
+import {LoginGuard} from'../../login/loginGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {HelperModule} from '../../utils/helper/helper.module';
+import {ClaimContextSearchFormModule} from '../claim-utils/claimContextSearchForm.module';
+import {ClaimProjectsSearchFormModule} from '../claim-utils/claimProjectSearchForm.module';
+import {ClaimResultSearchFormModule} from '../claim-utils/claimResultSearchForm.module';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+
+@NgModule({
+  imports: [
+    SharedModule,
+    DirectLinkingRoutingModule,SelectedProjectsModule, SelectedContextsModule, SelectedPublicationsModule, InsertClaimsModule,
+    EntitySearchServiceModule, PublicationsServiceModule, DatasetsServiceModule, StartOverModule, HelperModule,
+    ClaimContextSearchFormModule, ClaimProjectsSearchFormModule, ClaimResultSearchFormModule
+
+
+  ],
+  providers:[LoginGuard, PreviousRouteRecorder, IsRouteEnabled],
+  declarations: [
+    DirectLinkingComponent
+  ], exports:[DirectLinkingComponent]
+})
+export class DirectLinkingModule { }
diff --git a/claims/linking/bulkClaim/bulkClaim.component.ts b/claims/linking/bulkClaim/bulkClaim.component.ts
new file mode 100644
index 00000000..bc9ea125
--- /dev/null
+++ b/claims/linking/bulkClaim/bulkClaim.component.ts
@@ -0,0 +1,256 @@
+import {Component, Input, Output, EventEmitter,ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {SearchCrossrefService} from '../../claim-utils/service/searchCrossref.service';
+import {SearchDataciteService} from '../../claim-utils/service/searchDatacite.service';
+
+import {ModalLoading} from '../../../utils/modal/loading.component';
+import {Dates, DOI} from '../../../utils/string-utils.class';
+import {OpenaireProperties} from '../../../utils/properties/openaireProperties';
+import {ClaimResult} from '../../claim-utils/claimEntities.class';
+
+
+@Component({
+    selector: 'bulk-claim',
+    template: `
+    <div class="uk-animation  " style=" ">
+      <form class=" uk-padding uk-panel  uk-background-muted ">
+
+        <div class="uk-clearfix">
+            <a  class="uk-float-right" uk-toggle="target: #uploadInfo; animation:  uk-animation-fade"><span class="uk-icon">
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+</span> What is upload mode? </a>
+        </div>
+        <div id="uploadInfo" class="uk-card uk-card-default uk-card-body uk-margin-small" hidden>
+            <a uk-toggle="target: #uploadInfo; animation:  uk-animation-fade" class="uk-float-right"><span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span></a>
+             <div class="uk-text-bold"><span class="uk-icon">
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+</span> Upload information:</div>
+             Upload a csv file containing a list of DOIs. For each DOI found in the file, metadata will be fetched from CrossRef or Datacite.
+              Available results will be added to your selected resarch results list in order to be linked with the selected Projects and Contexts.
+
+                <div class="uk-article-meta">
+                 CSV format:
+                 <ul class="uk-list">
+                   <li>The format of CSV file should be "DOI","ACCESS_MODE","DATE".</li>
+                   <li>The value "DOI" is required </li>
+                    <li>Access mode column should have values: "OPEN","CLOSED" or "EMBARGO".</li>
+                    <li>Date column valid format is YYYY-MM-DD and is required when access mode has value EMBARGO.</li>
+                    <li>In case access mode is not available default value is "OPEN".</li>
+                  </ul>
+                </div>
+         </div>
+
+
+
+
+          <div for="exampleInputFile">Upload a DOI csv file:</div>
+          <label for="exampleInputFile">Select a file</label>
+          <input id="exampleInputFile" class="uk-width-1-2" type="file"  (change)="fileChangeEvent($event)" placeholder="Upload file..." />
+          <button class="uk-button uk-button-success" [class.disabled]="!enableUpload" type="button" (click)="upload()">Upload</button>
+
+          <div *ngIf="showReport"  uk-alert  class="uk-alert uk-alert-primary" role="alert" >
+            <a class="uk-alert-close" uk-close></a>
+            <div>Uploaded file contains {{allIds.length}} rows. {{foundIds.length}} results were sucefully  fetched from CrossRef and Datacite.</div>
+            <div *ngIf ="duplicateIds.length > 0"  >{{duplicateIds.length}} duplicate DOIs.</div>
+            <div *ngIf = "notFoundIds.length > 0"   >Couldn't be found:
+              <ul class="">
+                <li *ngFor="let id of notFoundIds">"{{id}}"</li>
+               </ul>
+            </div>
+            <div *ngIf = "noValidIds.length > 0"   >No valid DOIs:
+              <ul class="">
+                <li *ngFor="let id of noValidIds">"{{id}}"</li>
+               </ul>
+            </div>
+            <div *ngIf = "allIds.length == 0 || foundIds.length == 0"   > Please make sure you are using the right format for the csv file... </div>
+
+          </div>
+          <div *ngIf="errorMessage.length > 0 " class="uk-alert uk-alert-danger" role="alert">{{errorMessage}}</div>
+          <modal-loading [message]= "'Uploading, reading and fetching results from your document. Please give us a moment..'"></modal-loading>
+       </form>
+
+
+
+</div>
+    `
+
+})
+//[(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 results;
+
+  allIds:string[] = [];
+  foundIds:string[] = [];
+  duplicateIds:string[] = [];
+  notFoundIds:string[] = [];
+  noValidIds:string[] = [];
+  showReport:boolean = false;
+  showInfo :boolean = false;
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  errorMessage = "";
+  infoMEssage = "";
+  enableUpload:boolean = true;
+  constructor(private _searchCrossrefService: SearchCrossrefService, private _searchDataciteService: SearchDataciteService) {
+      this.filesToUpload = [];
+  }
+  ngOnInit() {}
+
+  upload() {
+    this.enableUpload = false;
+    this.showReport = false;
+    this.errorMessage = "";
+    if(this.filesToUpload.length == 0){
+      this.errorMessage = "There is no selected file to upload.";
+      return ;
+    }
+    this.loading.open();
+
+    this.makeFileRequest(OpenaireProperties.getUploadServiceUrl(), [], this.filesToUpload).then((result) => {
+          var rows = (result as any).split('\n');  // I have used space, you can use any thing.
+          var i = 0;
+          this.duplicateIds = [];
+          this.allIds = [];
+          this.foundIds = [];
+          this.noValidIds = [];
+          this.results.slice(0,this.results.length);
+          this.notFoundIds = [];
+
+          for(i=0;i<rows.length;i++){
+            if(rows[i] && rows[i] != null ){
+              console.log("Row is:" + rows[i]);
+              var values = rows[i].split(',');
+
+              var id=this.removeDoubleQuotes(values[0]);
+              if(DOI.isValidDOI(id)){
+                var accessMode = (values[1] != undefined) ? this.removeDoubleQuotes(values[1]):"OPEN";
+                accessMode = (this.validateAccessMode(accessMode)?accessMode:"OPEN");
+                var embargoDate =(values[2] != undefined) ? this.removeDoubleQuotes(values[2]):Dates.getDateToday();
+                embargoDate = (Dates.isValidDate(embargoDate)?embargoDate:Dates.getDateToday());
+                if(this.allIds.indexOf(id)>-1){
+                  this.duplicateIds.push(id);
+                }else{
+                  this.allIds.push(id);
+                  this.fetchResult(id,accessMode,embargoDate);
+                }
+             }else{
+               this.noValidIds.push(id);
+             }
+           }
+
+         }
+
+       }, (error) => {
+         this.enableUpload = true;
+          console.log(error);
+          this.loading.close();
+          this.errorMessage = "An error occured while uploading...";
+      });
+  }
+  private removeDoubleQuotes(value){
+     if(value.indexOf('"')== 0){
+        value = value.substring(1,value.length);
+      }
+      var index =+value.indexOf('"');
+      if(index == (value.length - 1) || index == (value.length - 2) ){
+        value = value.substring(0,index);
+      }
+      return value;
+  }
+  private validateAccessMode(value){
+    var accessModes = ["OPEN", "CLOSED", "EMBARGO"];
+     if(accessModes.indexOf(value) > -1){
+        return true;
+      }
+
+      return false;
+  }
+
+  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,accessMode:string,date:string){
+        this._searchCrossrefService.searchCrossrefByDOIs([id]).subscribe(
+          data => {
+
+            var crossrefResult = data.items[0];
+            if(data.items.length > 0){
+              this.foundIds.push(id);
+              var result: ClaimResult = ClaimResult.generateResult(crossrefResult, id,"crossref","publication",  crossrefResult.URL, crossrefResult.title, crossrefResult.created['date-time'], accessMode);
+              result.embargoEndDate = date;
+              this.results.push(result);
+              this.endOfFetching();
+            }else{
+              this.searchInDatacite(id,accessMode,date);
+              // this.notFoundIds.push(id);
+            }
+           },
+          err => {
+            console.log(err);
+            this.notFoundIds.push(id);
+            this.endOfFetching();
+          }
+        );
+  }
+  searchInDatacite(id:string,accessMode:string,date:string){
+        this._searchDataciteService.getDataciteResultByDOI(id).subscribe(
+          item => {
+            var dataciteResult = item.data;
+
+            if(dataciteResult != null &&  dataciteResult.attributes!= null  ){
+
+              this.foundIds.push(id);
+              var result: ClaimResult = ClaimResult.generateResult(dataciteResult, id,"datacite","dataset",  'http://dx.doi.org/'+dataciteResult.attributes.doi, dataciteResult.attributes.title, dataciteResult.attributes.published, accessMode);
+              result.embargoEndDate = date;
+              this.results.push(result);
+            }else{
+              this.notFoundIds.push(id);
+            }
+            this.endOfFetching();
+           },
+          err => {
+            console.log(err);
+            this.notFoundIds.push(id);
+            this.endOfFetching();
+          }
+        );
+  }
+  endOfFetching(){
+    if(this.allIds.length == this.foundIds.length+this.notFoundIds.length+ this.duplicateIds.length ){
+      this.showReport = true;
+      this.enableUpload = true;
+      this.loading.close();
+
+    }
+
+  }
+}
diff --git a/claims/linking/bulkClaim/bulkClaim.module.ts b/claims/linking/bulkClaim/bulkClaim.module.ts
new file mode 100644
index 00000000..7f35a46f
--- /dev/null
+++ b/claims/linking/bulkClaim/bulkClaim.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../../shared/shared.module';
+import {LoadingModalModule} from '../../../utils/modal/loadingModal.module';
+import {BulkClaimComponent} from './bulkClaim.component';
+import {SearchCrossrefServiceModule} from '../../claim-utils/service/searchCrossrefService.module';
+import {SearchDataciteServiceModule} from '../../claim-utils/service/searchDataciteService.module';
+
+@NgModule({
+  imports: [
+    SharedModule, LoadingModalModule, SearchCrossrefServiceModule
+  ],
+  declarations: [
+BulkClaimComponent
+  ], exports:[ BulkClaimComponent]
+})
+export class BulkClaimModule { }
diff --git a/claims/linking/bulkLinking.component.ts b/claims/linking/bulkLinking.component.ts
new file mode 100644
index 00000000..96e32dcf
--- /dev/null
+++ b/claims/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 () {
+//    }
+// }
diff --git a/claims/linking/bulkLinking.module.ts b/claims/linking/bulkLinking.module.ts
new file mode 100644
index 00000000..55c71221
--- /dev/null
+++ b/claims/linking/bulkLinking.module.ts
@@ -0,0 +1,20 @@
+// import { NgModule } from '@angular/core';
+//
+// import { SharedModule } from '../../shared/shared.module';
+// import { BulkLinkingComponent } from './bulkLinking.component';
+// import { BulkLinkingRoutingModule } from './bulkLinking-routing.module';
+// import {LinkingGenericModule} from './linkingGeneric.module';
+// import {BulkClaimModule} from './bulkClaim/bulkClaim.module';
+// @NgModule({
+//   imports: [
+//     SharedModule,
+//     BulkLinkingRoutingModule,
+//     LinkingGenericModule,
+//     BulkClaimModule
+//
+//   ],
+//   declarations: [
+//     BulkLinkingComponent
+//   ], exports:[BulkLinkingComponent]
+// })
+// export class BulkLinkingModule { }
diff --git a/claims/linking/insertClaim/insertClaim.component.ts b/claims/linking/insertClaim/insertClaim.component.ts
new file mode 100644
index 00000000..faea79ff
--- /dev/null
+++ b/claims/linking/insertClaim/insertClaim.component.ts
@@ -0,0 +1,371 @@
+import {Component, Input, Output, EventEmitter, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Router} from '@angular/router';
+import {ClaimsService} from '../../claim-utils/service/claims.service';
+
+import {ModalLoading} from '../../../utils/modal/loading.component';
+import {AlertModal} from '../../../utils/modal/alert';
+import {Md5} from 'ts-md5/dist/md5';
+import {Session} from '../../../login/utils/helper.class';
+import {ErrorCodes} from '../../../login/utils/guardHelper.class';
+
+@Component({
+    selector: 'claim-insert',
+    template: `
+    <div *ngIf="errorMessage.length > 0">
+      <div class="uk-alert uk-alert-danger" role="alert" [innerHTML]="errorMessage"></div>
+      <div *ngIf="insertedClaims.length>0">There are {{insertedClaims.length}} claims, follow <a routerLinkActive="router-link-active" routerLink="/myclaims">the link</a> to manage your claims</div>
+    </div>
+    <div *ngIf="warningMessage.length > 0">
+      <div class="uk-alert uk-alert-warning" role="alert">{{warningMessage}}</div>
+    </div>
+
+
+    <modal-loading [message]= "'Please wait...'"></modal-loading>
+    <modal-alert (alertOutput)="confirmClose($event)">
+    </modal-alert>
+    <button  *ngIf="!claiming  && showButton" (click)="validateInsertions()"  class="uk-button uk-button-primary"  >Finish</button>
+    `
+})
+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 results;
+  @Input() public showButton:boolean = true;
+  @Input() show='claim';
+  @Input() inlineEntity = null; // the entity from the landing page
+  @Output() showChange = new EventEmitter();
+
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  @ViewChild(AlertModal) alert;
+
+  public claiming =false;
+  public error = false;
+  public errorMessage = "";
+  public warningMessage = "";
+  public claimsTODO:number = 0;
+  public claims:number = 0;
+
+  private servicesRespond:number = 0;
+  private insertedClaims=[];
+  private errorInClaims=[];
+  private insertedRecords=[];
+  private errorInRecords=[];
+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.insertActions();
+        return true;
+      }
+    }
+    return
+}
+private insertActions(){
+  this.servicesRespond = 0;
+   this.insertedClaims=[];
+   this.errorInClaims=[];
+  this.insertedRecords=[];
+  this.errorInRecords=[];
+  if(!Session.isValidAndRemove()){
+    this.showButton = false;
+    localStorage.setItem("projects", JSON.stringify(this.projects));
+    localStorage.setItem("contexts", JSON.stringify(this.contexts));
+    localStorage.setItem("results", JSON.stringify(this.results));
+    if(this.inlineEntity != null){
+      localStorage.setItem("inlineEntity", JSON.stringify(this.inlineEntity));
+    }
+
+    this._router.navigate(['/user-info'], { queryParams: { "errorCode": ErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });
+
+  }else{
+      this.claiming = true;
+      var user=Session.getUserEmail();
+       this.loading.open();
+      var claims = [];
+      var directclaims = [];
+      if(this.results){
+        console.info("results: "+this.results.length);
+
+          for (var i = 0; i < this.results.length; i++) {
+              var result=this.results[i];
+              if(["crossref","datacite","orcid"].indexOf(result.source) != -1){
+                directclaims.push({"id":result.id, "record":this.createDirectClaim(result,this.projects,this.contexts)});
+              }
+              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.inlineEntity != null){
+                var resultClaim = this.createResultClaim(this.inlineEntity, result, user);
+                claims.push(resultClaim);
+              }
+
+          }
+        }
+        //first call direct index service - when call is done (success or error) call isertBulkClaims method to insert claims in DB
+        console.info("\n\ndirectclaims: "+directclaims.length+"\n\n");
+        if(directclaims.length > 0){
+          this.claimService.insertDirectRecords(directclaims).subscribe(
+            data => {
+              this.insertedRecords = data.insertedIds;
+
+                this.errorInRecords = data.errorInClaims;
+                this.isertBulkClaims(claims);
+            },
+            err =>  {
+              err=err.json();
+              if(err.insertedIds && err.insertedIds.length >0){
+                this.insertedRecords = err.insertedIds;
+              }
+              if(err.errorInClaims && err.errorInClaims.length >0){
+                this.errorInRecords = err.errorInClaims;
+              }
+              this.isertBulkClaims(claims);
+            }
+          );
+      }else{
+        this.isertBulkClaims(claims);
+      }
+  }
+
+}
+
+private isertBulkClaims(claims){
+  console.info("try to insert "+claims.length+" claims");
+  this.claimService.insertBulkClaims(claims).subscribe(
+    data => {
+      this.insertedClaims = data.insertedIds;
+      this.errorInClaims = data.errorInClaims;
+      this.afterclaimsInsertion();
+    },
+    err =>  {
+      err=err.json();
+      if(err.insertedIds && err.insertedIds.length >0){
+        this.insertedClaims = err.insertedIds;
+      }
+      if(err.errorInClaims && err.errorInClaims.length >0){
+        this.errorInClaims = err.errorInClaims;
+      }
+      this.afterclaimsInsertion();
+    }
+  );
+}
+private validate(){
+  this.warningMessage = "";
+  this.errorMessage = "";
+  if( this.results && this.results.length == 0){
+   this.warningMessage = "There are no research results selected.";
+ }else if((!this.contexts|| this.contexts.length==0 )&&(!this.projects|| this.projects.length==0 )&&  ( this.inlineEntity == null)){
+   this.warningMessage = "There are no projects or communities 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.results){
+        for (var i = 0; i < this.results.length; i++) {
+          var result = this.results[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+5)) ){
+              this.confirmOpen();
+              return false;
+            }
+          }
+        }
+      }
+
+
+    }
+  }
+  if(this.results){
+    for (var i = 0; i < this.results.length; i++) {
+      var result = this.results[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(){
+
+    this.loading.close();
+    this.claiming = false;
+
+    if(this.errorInClaims.length == 0 && this.insertedClaims.length > 0  && this.errorInRecords.length == 0){
+
+        this._router.navigate( ['/myclaims'] );
+      this.showChange.emit({
+        value: this.show
+      });
+    }else{
+      this.errorsInClaimsInsertion();
+    }
+}
+private errorsInClaimsInsertion(){
+  this.errorMessage = "";
+  this.loading.close();
+  this.error =  true;
+  this.claiming = false;
+  this.showButton = false;
+  var text =""
+  console.log("Errors: this.errorInRecords.length: "+this.errorInRecords.length+" - this.errorInClaims.length: "+this.errorInClaims.length);
+  if(this.errorInRecords.length>0){
+    text+="<div>The following records couldn't automatically inserted to the Openaire Info space: <ul>";
+    for(var i=0; i< this.errorInRecords.length ; i++){
+      for(var k=0; k< this.results.length ; k++){
+        if(this.results[k].id == this.errorInRecords[i]){
+          text+="<li>"+this.results[i].title+" from "+this.results[i].source+"</li>";
+        }
+      }
+    }
+    text+="</ul></div>";
+
+  }
+  if(this.errorInClaims.length > 0){
+    text+="<div>The following links couldn't be saved: <ul>";
+    for(var i=0; i< this.errorInClaims.length ; i++){
+      // 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 == null?"":result.embargoEndDate)};
+
+      text+="<li>"+this.errorInClaims[i].sourceType+": "+this.errorInClaims[i].sourceId +"(from "+this.errorInClaims[i].sourceCollectedFrom+") link to "+this.errorInClaims[i].targetType+": "+this.errorInClaims[i].targetId +"(from "+this.errorInClaims[i].targetCollectedFrom+") </li>";
+
+    }
+    text+="</ul></div>";
+  }
+  this.errorMessage+="<div>An error occured:</div>"+text;
+  console.log(text);
+  //   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 == null?"":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 == null?"":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 == null?"":inlineResult.embargoEndDate)};
+    return claim;
+  }
+createDirectClaim(result, projects, contexts){
+  var entity = {};
+  var md5_id = Md5.hashStr(result.id);
+  entity["originalId"]="userclaim___::"+md5_id;
+  entity["openaireId"]="userclaim___::"+md5_id;
+  entity["title"]=result.title;
+  entity["title"] =(Array.isArray(result.title) && result.title.length > 0 )?result.title[0]:result.title;
+
+  if(result.authors && result.authors.length > 0){
+    entity["authors"]=result.authors;
+  }
+  if(result.publisher){
+    entity["publisher"]=result.publisher;
+  }
+  if(result.description){
+    entity["description"]=result.description;
+  }
+  // entity["language"]=""; no info
+  entity["type"]=result.type;
+  if(result.source == "crossref" || result.source == "datacite"){
+    entity["pids"]= [];//{type:string, value:string}[];
+    entity["pids"].push({type:"doi",value:result.id})
+  }
+  entity["licenseCode"]=result.accessRights;
+  if(result.accessRights == "EMBARGO"){
+    entity["embargoEndDate"]=result.embargoEndDate;
+  }
+  if(result.type =="publication"){
+    entity["resourceType"]="0001";
+  }else if(result.type =="dataset"){
+    entity["resourceType"]="0021";
+  }else if(result.type =="software"){
+    entity["resourceType"]="0029";
+  }
+  entity["url"]=result.url;
+  entity["hostedById"]="openaire____::1256f046-bf1f-4afc-8b47-d0b147148b18";
+  if(result.source == "crossref"){
+    entity["collectedFromId"]="openaire____::crossref";
+  }else if(result.source == "datacite"){
+    entity["collectedFromId"]="openaire____::datacite";
+  }else if(result.source == "orcid"){
+    entity["collectedFromId"]="openaire____::orcid";
+  }else if(result.source == "orpenaire"){
+    entity["collectedFromId"]="openaire____::driver";
+  }
+
+  if(projects.length>0){
+    entity["linksToProjects"]=[];
+    for(var i =0; i < projects.length; i++){
+      // "info:eu-repo/grantAgreement/EC/FP7/283595/EU//OpenAIREplus",
+      entity["linksToProjects"].push("info:eu-repo/grantAgreement/"+projects[i].funderName+"/"+projects[i].fundingLevel0+"/"+projects[i].code+"/"+projects[i].jurisdiction+"/"+projects[i].projectName+"/"+projects[i].projectAcronym);
+    }
+  }
+  if(contexts.length > 0){
+    entity["contexts"]=[];
+    for(var i =0; i < contexts.length; i++){
+      entity["contexts"].push(contexts[i].concept.id);
+    }
+  }
+  var json = JSON.stringify(entity);
+  console.log("\nJSON:\n"+json);
+  return entity;
+
+
+
+}
+  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 = "Proceed anyway";
+    this.alert.cancelButtonText = "Cancel";
+    this.alert.open();
+  }
+   confirmClose(data){
+    this.insertActions();
+  }
+}
diff --git a/claims/linking/insertClaim/insertClaim.module.ts b/claims/linking/insertClaim/insertClaim.module.ts
new file mode 100644
index 00000000..6b2c4bb0
--- /dev/null
+++ b/claims/linking/insertClaim/insertClaim.module.ts
@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../../shared/shared.module';
+import {AlertModalModule} from '../../../utils/modal/alertModal.module';
+import {LoadingModalModule} from '../../../utils/modal/loadingModal.module';
+import {ClaimInsertComponent} from './insertClaim.component';
+import {ClaimServiceModule} from '../../claim-utils/service/claimsService.module';
+
+@NgModule({
+  imports: [
+    SharedModule, AlertModalModule, LoadingModalModule, ClaimServiceModule
+  ],
+  declarations: [ClaimInsertComponent],
+   exports:[ ClaimInsertComponent]
+})
+export class InsertClaimsModule { }
diff --git a/claims/linking/linking-routing.module.ts b/claims/linking/linking-routing.module.ts
new file mode 100644
index 00000000..2660b77f
--- /dev/null
+++ b/claims/linking/linking-routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { LoginGuard} from'../../login/loginGuard.guard';
+
+import { LinkingGenericComponent } from './linkingGeneric.component';
+import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      { path: '', component: LinkingGenericComponent, canActivate: [IsRouteEnabled, LoginGuard], data: {
+          redirect: '/error'
+        }, canDeactivate: [PreviousRouteRecorder]},
+
+    ])
+  ]
+})
+export class LinkingRoutingModule { }
diff --git a/claims/linking/linking.component.ts b/claims/linking/linking.component.ts
new file mode 100644
index 00000000..dbf7a23f
--- /dev/null
+++ b/claims/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 () {
+//    }
+//
+// }
diff --git a/claims/linking/linkingGeneric.component.html b/claims/linking/linkingGeneric.component.html
new file mode 100644
index 00000000..64cbe741
--- /dev/null
+++ b/claims/linking/linkingGeneric.component.html
@@ -0,0 +1,118 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div class="uk-container uk-margin-top">
+<div class="uk-article-title custom-article-title">
+    Link
+</div>
+
+<div class="uk-width-1-1">
+  <helper position="top"></helper>
+</div>
+<div class="uk-grid  helper-grid">
+  <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
+  <div class="uk-width-expand">
+
+      <ul class="uk-subnav uk-margin-remove-bottom uk-subnav-divider linkingSteps" uk-margin="">
+          <li  [class]="(step==1)?'uk-active':' '" ><a (click)="step=1;"> 1  Select Projects <span  >or  Communities  </span></a></li>
+           <li [class]="(step==2)?'uk-active':' '" ><a  (click)="step=2;">2 Select Research Results  </a></li>
+          <li [class]="(step==3)?'uk-active':' '" (click)="step=3;"><a [class]="(results.length == 0)?'uk-disabled':''"  (click)="show='claim';" >3 Review metadata</a></li>
+      </ul>
+      <!--start-over [results]="results" [contexts]="contexts" [projects]="projects" ></start-over-->
+      <ul uk-accordion>
+        <li>
+            <h3 class=" uk-text-right uk-margin-remove-vertical uk-width-small uk-margin-auto-left uk-accordion-title basket-title ">
+
+            <span class="uk-icon"><svg xml:space="preserve" xmlns:xlink="http://www.w3.org/1999/xlink" height="28px" id="my-box" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="28px" x="0px" xmlns="http://www.w3.org/2000/svg" y="0px"><g>	<path d="M480,320v128H32V320h78.859l64.016,96h162.25l64-96H480 M384,32H128L0,288v192h512V288L384,32L384,32z M35.781,288l112-224 h216.438l112,224H384l-64,96H192l-64.016-96H35.781L35.781,288z" fill="#b5b5b5"></path></g> </svg> </span>
+            <span *ngIf="(projects.length + contexts.length + results.length)> 0" class="uk-badge basket-badge ">{{(projects.length + contexts.length + results.length)}}</span>
+          </h3>
+            <div class="uk-accordion-content dropbasket uk-padding-small uk-margin uk-grid-match uk-child-width-1-1 uk-child-width-1-1@m uk-grid uk-grid-stack">
+              <claim-selected-projects   title="link Projects" [projects]="projects" [show]="show" [linkType]=linkType
+                (showChange)="showChange($event)"   > </claim-selected-projects>
+
+             <claim-selected-contexts  title="link Communities" [contexts]="contexts"  [projects]="projects"  [results]="results" [inlineEntity] = "inlineResult" [show]="show" [linkType]=linkType
+             (showChange)="showChange($event)"  > </claim-selected-contexts>
+             <claim-selected-results *ngIf="step!=3"  title= "Selected Research Results" [results]="results"  [bulkMode]="bulkMode" showSearch=false  showAccessRights=false>
+             </claim-selected-results>
+            </div>
+        </li>
+    </ul>
+
+                <div *ngIf="step==1">
+
+                   <ul class=" uk-tab " uk-tab="connect: #tabs; animation: uk-animation-fade">
+                           <li>
+                              <a>Projects ({{projects.length}})</a>
+                          </li>
+                          <li>
+                             <a>Communities ({{contexts.length}})</a>
+                         </li>
+                    </ul>
+                    <ul id="tabs" class="uk-switcher uk-margin-left uk-width-1-1">
+                      <li>
+
+                               <claim-projects-search-form     [(selectedProjects)]="projects"    > </claim-projects-search-form>
+                     </li>
+                      <li>
+
+                          <claim-contexts-search-form    [(selectedList)]="contexts" [projects]="projects" [results]="results" [inlineEntity]="inlineResult" > </claim-contexts-search-form>
+                      </li>
+
+              </ul>
+            </div>
+                  <!--/div-->
+                <!--/div-->
+        <!--hr-->
+        <!-- Research Results -->
+
+        <div *ngIf="step==2 ">
+            <div  class="uk-width-1-1 uk-card uk-card-default uk-padding ">
+              <div class=" uk-padding-small uk-padding-remove-bottom   ">
+              <span *ngIf="bulkMode"   class=" uk-animation uk-float-right">
+                <span   title= "Bulk mode"><i  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="upload" ratio="1"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg></i></span>
+                <a   title= "Switch to Search mode"  (click)="bulkMode = !bulkMode;"> <span class="uk-icon">
+                    <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>
+                    </span></a>
+              </span>
+              <span *ngIf="!bulkMode"   class=" uk-animation uk-float-right">
+                <a   title= "Switch to Bulk mode"   (click)="bulkMode = !bulkMode;"><i  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="upload" ratio="1"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg></i></a>
+                <span   title= "Search mode"> <span class="uk-icon">
+                    <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>
+                    </span></span>
+              </span>
+              </div>
+              <claim-result-search-form *ngIf="!bulkMode"  [selectedResults]="results"   > </claim-result-search-form>
+              <bulk-claim  *ngIf="bulkMode" [results]="results" > </bulk-claim>
+            </div>
+        </div>
+        <div *ngIf="step==3" class="uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l">
+          <claim-selected-results   title= "Selected Research Results" [results]="results"  [bulkMode]="bulkMode" showSearch = false  showAccessRights = true>
+          </claim-selected-results>
+        </div>
+
+
+
+        <ul class=" uk-pagination uk-flex-center uk-margin-auto uk-text-center">
+            <li  *ngIf="step !=1 " (click)="step=step-1;" class="uk-margin-left"><a><span class="uk-margin-small-right" uk-pagination-previous></span> Previous</a></li>
+             <li  *ngIf="step !=3 " (click)="step=step + 1;"  >
+              <a>Next <span uk-pagination-next></span></a>
+            </li>
+            <li  *ngIf=" step == 3  " (click)="next()"  >
+            <claim-insert   [contexts]="contexts" [results]="results"  [projects]="projects" [show] = "show"
+              (showChange)="showChange($event)" ></claim-insert>
+
+            </li>
+        </ul>
+      </div>
+      <helper position="right" styleName=" uk-width-1-5"></helper>
+    </div>
+    <helper position="bottom"></helper>
+
+
+
+</div>
+
+</div>
+</div>
+</div>
diff --git a/claims/linking/linkingGeneric.component.ts b/claims/linking/linkingGeneric.component.ts
new file mode 100644
index 00000000..379b8677
--- /dev/null
+++ b/claims/linking/linkingGeneric.component.ts
@@ -0,0 +1,117 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {EntitiesSearchService} from '../../utils/entitiesAutoComplete/entitySearch.service';
+import {ClaimProject, ClaimResult} from '../claim-utils/claimEntities.class';
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import {SearchDatasetsService} from '../../services/searchDatasets.service';
+import { Meta} from '../../../angular2-meta';
+declare var UIkit:any;
+
+@Component({
+    selector: 'linking-generic',
+    templateUrl: 'linkingGeneric.component.html'
+
+})
+export class LinkingGenericComponent {
+
+  @Input() bulkMode: boolean = false;
+  sourceType:string;
+  targetType:string;
+  step:number = 1;
+  contexts=[];
+  projects=[];
+   results = [];
+  show = "project";
+  date='8-6-2016';
+  keyword: string = "";
+  linkType:string ="project"; // link type (selected in home page) : project, context, software, etc
+  /* url Parameters for inline linking */
+  id:string = null; //entity id
+  type:string = null; // entity type (publication or research data)
+  linkTo:string = null; // entity type (project or context or result)
+
+  entityTypes=["dataset", "publication", "project","context"];
+  inlineResult:ClaimResult =null;
+  sub:any =null;
+  constructor ( private _router: Router,  private route: ActivatedRoute, private entitySearch:EntitiesSearchService,
+    private publicationsSearch:SearchPublicationsService, private datasetsSearch:SearchDatasetsService, private _meta: Meta) {
+      this._meta.setTitle("OpenAIRE | Linking");
+  }
+  ngOnInit() {
+      if( typeof localStorage !== 'undefined') {
+        if(localStorage.getItem("projects")){
+          this.projects  = JSON.parse(localStorage.getItem("projects"));
+
+        }
+        if(localStorage.getItem("contexts")){
+          this.contexts  = JSON.parse(localStorage.getItem("contexts"));
+        }
+        if(localStorage.getItem("results")){
+          this.results  = JSON.parse(localStorage.getItem("results"));
+
+        }
+        localStorage.removeItem("projects");
+        localStorage.removeItem("contexts");
+        localStorage.removeItem("results");
+    }
+  }
+
+  next(){
+
+    if((this.show == 'result' && this.keyword == '')||(this.show == 'dataset' || this.show == 'publication')){
+        this.show='claim';
+
+    }
+  }
+  prev(){
+  if(this.show == 'claim'){
+      this.show='result';
+    }
+  }
+
+
+  resultsChange($event) {
+    this.results=$event.value;
+  }
+
+  projectsChange($event) {
+    this.projects=$event.value;
+  }
+
+  linkTypeChange($event) {
+
+    this.linkType =$event.value;
+    this.show="result";
+    if(this.bulkMode){
+      this.show="claim";
+    }
+  }
+
+  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;
+    }
+  }
+
+  canProceedToMetadata(){
+    if(this.results.length == 0){
+
+      UIkit.notification({
+          message : 'No research results selected!<br>Please select research results to link with projects and/ or ommunities.',
+          status  : 'warning',
+          timeout : 1000,
+          pos     : 'top-center'
+      });
+    }else{
+      this.show = 'claim';
+      this.step = 3;
+    }
+  }
+}
diff --git a/claims/linking/linkingGeneric.module.ts b/claims/linking/linkingGeneric.module.ts
new file mode 100644
index 00000000..d9627a23
--- /dev/null
+++ b/claims/linking/linkingGeneric.module.ts
@@ -0,0 +1,37 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../shared/shared.module';
+import {SelectedProjectsModule} from './selected/selectedProjects.module';
+import {SelectedContextsModule} from './selected/selectedContexts.module';
+import {SelectedPublicationsModule} from './selected/selectedResults.module';
+import {InsertClaimsModule} from './insertClaim/insertClaim.module';
+import {LinkingGenericComponent} from './linkingGeneric.component';
+import {EntitySearchServiceModule} from '../../utils/entitiesAutoComplete/entitySearchService.module';
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+import { LinkingRoutingModule } from './linking-routing.module';
+import {StartOverModule} from '../claim-utils/startOver.module';
+import {LoginGuard} from'../../login/loginGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {ClaimContextSearchFormModule} from '../claim-utils/claimContextSearchForm.module';
+import {ClaimProjectsSearchFormModule} from '../claim-utils/claimProjectSearchForm.module';
+import {BulkClaimModule} from './bulkClaim/bulkClaim.module';
+import {ClaimResultSearchFormModule} from '../claim-utils/claimResultSearchForm.module';
+import {HelperModule} from '../../utils/helper/helper.module';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    SharedModule,  SelectedProjectsModule, SelectedContextsModule,
+    SelectedPublicationsModule,
+     InsertClaimsModule,
+    EntitySearchServiceModule, PublicationsServiceModule, DatasetsServiceModule, LinkingRoutingModule, StartOverModule,
+    ClaimContextSearchFormModule, ClaimProjectsSearchFormModule, BulkClaimModule, ClaimResultSearchFormModule, HelperModule
+  ],
+  providers:[LoginGuard, PreviousRouteRecorder, IsRouteEnabled],
+  declarations: [
+    LinkingGenericComponent
+   ], exports:[
+   LinkingGenericComponent ]
+})
+export class LinkingGenericModule { }
diff --git a/claims/linking/selected/selectedContexts.component.ts b/claims/linking/selected/selectedContexts.component.ts
new file mode 100644
index 00000000..c8e572a9
--- /dev/null
+++ b/claims/linking/selected/selectedContexts.component.ts
@@ -0,0 +1,91 @@
+import {Component, Input,Output, EventEmitter} from '@angular/core';
+import {ClaimContext} from '../../claim-utils/claimEntities.class';
+
+@Component({
+    selector: 'claim-selected-contexts',
+    template: `
+
+        <!-- Contexts -->
+
+            <div class="uk-placeholder uk-margin-top" >
+
+             <!--div  class="uk-width-1-2    ">
+
+                <div class="uk-clearfix"><button *ngIf=" !showsearch "  (click)="showsearch = true;" class="uk-button uk-button-default uk-animation uk-float-right">Add more <span><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></span></button></div>
+                <claim-contexts-search-form *ngIf=" showsearch "    [selectedList]="contexts" [projects]="projects" [results]="results" [inlineEntity]="inlineEntity" > </claim-contexts-search-form>
+              </div-->
+              <div  *ngIf="contexts.length > 0 "  class="    ">
+                  <h5 class=" uk-margin uk-h5 uk-text-primary">Selected Communities ({{contexts.length}}) </h5>
+
+                  <ul class="uk-list uk-list-divider">
+                    <li class="list-group-item" *ngFor="let context of contexts" >
+                      <span *ngIf="context.community != context.concept.label">{{context.community }} > {{context.category}} ></span><span> {{context.concept.label}} </span>
+                      <span (click)="removeContext(context)" aria-hidden="true" class="uk-icon-button"><span class="uk-icon">
+                        <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+                        </span></span>
+
+                    </li>
+                  </ul>
+                </div>
+                  <div  *ngIf="contexts.length == 0 "  class="uk-text-center">There are no selected communities</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
+    //  if(this.linkType == "context"){
+       this.showsearch = true
+    //  }else{
+    //    this.showsearch = false;
+    //  }
+}
+
+
+  @Input() contexts:ClaimContext[];
+  //The following need to be kept in case we have to save the current state
+  @Input() public projects;
+  @Input() public results;
+  @Input() public inlineEntity;
+  @Input() componentClass:string = ""; //"" or "col-sm-6" for horizontal display (besides projects)
+  @Input() show='home';
+  @Input() title='Communities';
+  @Input() linkType:string = "project";
+
+  @Input() hideType;
+  @Input() bulkMode:boolean = false;
+  @Output() showChange = new EventEmitter();
+
+  showsearch:boolean = false;
+
+  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);
+      }
+
+    }
+  contextSelected($event) {
+    // this.showsearch = false;
+  }
+
+}
diff --git a/claims/linking/selected/selectedContexts.module.ts b/claims/linking/selected/selectedContexts.module.ts
new file mode 100644
index 00000000..08d3d059
--- /dev/null
+++ b/claims/linking/selected/selectedContexts.module.ts
@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../../shared/shared.module';
+import {ClaimSelectedContextsComponent} from './selectedContexts.component';
+// import {ClaimContextSearchFormModule} from '../../claim-utils/claimContextSearchForm.module';
+
+ @NgModule({
+  imports: [
+    SharedModule,
+    // ClaimContextSearchFormModule
+  ],
+  declarations: [
+    ClaimSelectedContextsComponent
+  ], exports:[ClaimSelectedContextsComponent]
+})
+export class SelectedContextsModule { }
diff --git a/claims/linking/selected/selectedProjects.component.ts b/claims/linking/selected/selectedProjects.component.ts
new file mode 100644
index 00000000..d8929ec3
--- /dev/null
+++ b/claims/linking/selected/selectedProjects.component.ts
@@ -0,0 +1,88 @@
+import {Component, Input,Output, EventEmitter} from '@angular/core';
+import {ClaimProject} from '../../claim-utils/claimEntities.class';
+import {RouterHelper} from '../../../utils/routerHelper.class';
+
+@Component({
+    selector: 'claim-selected-projects',
+    template: `
+
+
+                <div class="uk-placeholder uk-margin-top" >
+
+                 <!--div  class="uk-width-1-2    ">
+                  <!--div class="uk-clearfix"><button *ngIf=" !showsearch "  (click)="showsearch = true;" class="uk-button-default uk-float-right uk-animation ">Add more <span><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></span></button></div>
+                  <claim-projects-search-form   *ngIf=" showsearch "  [selectedProjects]="projects"  (projectSelected)="projectSelected($event)" > </claim-projects-search-form>
+                </div>
+                <div  class="uk-width-1-2    "-->
+                  <div>
+                    <h5 class=" uk-margin uk-h5 uk-text-primary" *ngIf="projects.length > 0 "> Selected Projects ({{projects.length}}) </h5>
+                    <ul class="uk-list uk-list-divider">
+                      <li class="list-group-item" *ngFor="let project of projects">
+                        <a [queryParams]="routerHelper.createQueryParam('projectId',project.projectId)"   routerLinkActive="router-link-active" routerLink="/search/project" >{{project.funderName}} | {{project.projectName}} {{(project.projectAcronym)?'('+project.projectAcronym+')':''}} <!--[{{project.startDate}} - {{project.endDate}}]--></a>
+                        <span  (click)="removeProject(project)" aria-hidden="true" class="uk-icon-button"><span class="uk-icon">
+                          <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+                          </span></span>
+                      </li>
+                    </ul>
+                  </div>
+                <div *ngIf="projects.length == 0 " class="uk-text-center">There are no selected  projects</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() ;
+  // if(this.linkType == "project"){
+    this.showsearch = true
+  // }else{
+  //   this.showsearch = false;
+  // }
+  //2015-05-01
+}
+
+
+@Input() projects: ClaimProject[];
+@Input() show='home';
+@Input() title='Projects';
+@Input() linkType:string = "project";
+@Input() hideType;
+@Input() bulkMode:boolean = false;
+@Input() linkToResults:boolean = true;
+@Output() projectsChange = new EventEmitter();
+@Output() showChange = new EventEmitter();
+showsearch:boolean = false;
+
+todayDate = '';
+nextDate = '';
+public routerHelper:RouterHelper = new RouterHelper();
+
+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
+  });
+}
+}
+projectSelected($event) {
+  // this.showsearch = false;
+}
+
+
+}
diff --git a/claims/linking/selected/selectedProjects.module.ts b/claims/linking/selected/selectedProjects.module.ts
new file mode 100644
index 00000000..e3d96ef7
--- /dev/null
+++ b/claims/linking/selected/selectedProjects.module.ts
@@ -0,0 +1,18 @@
+
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import { SharedModule } from '../../../shared/shared.module';
+import {ClaimSelectedProjectsComponent} from './selectedProjects.component';
+// import {ClaimProjectsSearchFormModule} from '../../claim-utils/claimProjectSearchForm.module';
+
+ @NgModule({
+  imports: [
+    SharedModule, RouterModule,
+    // ClaimProjectsSearchFormModule
+  ],
+  declarations: [
+    ClaimSelectedProjectsComponent
+  ], exports:[ClaimSelectedProjectsComponent]
+})
+export class SelectedProjectsModule { }
diff --git a/claims/linking/selected/selectedResults.component.ts b/claims/linking/selected/selectedResults.component.ts
new file mode 100644
index 00000000..b1b91aca
--- /dev/null
+++ b/claims/linking/selected/selectedResults.component.ts
@@ -0,0 +1,225 @@
+import {Component, Input,Output, EventEmitter, ViewChild} from '@angular/core';
+import {AlertModal} from '../../../utils/modal/alert';
+import {ClaimResult} from '../../claim-utils/claimEntities.class';
+import {IMyOptions, IMyDateModel} from '../../../utils/my-date-picker/interfaces/index';
+import {Dates} from '../../../utils/string-utils.class';
+
+@Component({
+    selector: 'claim-selected-results',
+    template: `
+
+
+
+
+        <!--div *ngIf="showSearch " class="uk-width-1-2    ">
+          <div class="uk-clearfix"><a    (click)="bulkMode = !bulkMode;" class=" uk-animation uk-float-right">
+            <span *ngIf="!bulkMode">Switch to Upload mode <i  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="upload" ratio="1"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg></i></span>
+            <span *ngIf="bulkMode">Switch to Search mode <span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>
+</span></span>
+          </a></div>
+          <claim-result-search-form *ngIf="!bulkMode"  [selectedResults]="results"   > </claim-result-search-form>
+          <bulk-claim  *ngIf="bulkMode" [results]="results" > </bulk-claim>
+        </div-->
+         <div class="uk-placeholder uk-margin-top" >
+           <div  *ngIf="results.length == 0 " class="uk-text-center">There are no selected research results</div>
+           <div *ngIf="results.length > 0 ">
+            <h5 class=" uk-margin uk-h5 uk-text-primary" > {{title}} ({{results.length}}) </h5>
+            <table class="uk-table uk-table-responsive">
+              <thead *ngIf="showAccessRights">
+                <tr>
+                  <th> Research Result</th>
+                  <th> Change type and access mode</th>
+                </tr>
+              </thead>
+              <tbody>
+                 <tr  *ngFor="let pub of results" >
+                     <td   >
+                        <div>
+                          <span *ngIf="showAccessRights" (click)="removePublication(pub)" aria-hidden="true" class="uk-icon-button"><span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span></span>
+                          <a *ngIf="pub.url" target="_blank" href="{{pub.url}}" > <span class="custom-external"></span> {{pub.title}}</a>
+                          <span *ngIf="!pub.url" >{{pub.title}}</span>
+                          <span *ngIf="!showAccessRights" (click)="removePublication(pub)" aria-hidden="true" class="uk-icon-button"><span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span></span>
+                        </div>
+
+                        <span *ngIf="pub.publisher"  >Publisher: {{pub.publisher}}</span>
+                        <!--Orcid --><span  *ngIf="pub.result['journal-title'] && pub.result['journal-title'].value " >Journal: {{pub.result['journal-title'].value}}</span>
+                        <span *ngIf="pub.date"   >({{pub.date.substring(0,4)}})</span>
+
+                        <div *ngIf="pub.authors && pub.authors.length > 0"  >Authors: <span *ngFor="let author of pub.authors.slice(0,10)  let i = index">{{author}}{{(i < (pub.authors.slice(0,10).length-1))?"; ":""}}{{(i == pub.authors.slice(0,10).length-1 && pub.authors.length > 10)?"...":""}}</span></div>
+
+                        <!-- Crossref -->
+                        <!--span *ngIf="pub.result.publisher" class="uk-article-meta">Publisher: {{pub.result.publisher}}</span><span *ngIf="pub.date"  class="uk-article-meta" >({{pub.date.substring(0,4)}})</span>
+                        <div *ngIf="pub.result.author && pub.result.author.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of pub.result.author.slice(0,10)  let i = index">{{author.family}} {{author.given}}{{(i < (pub.result.author.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.author.slice(0,10).length-1 && pub.result.author.length > 10)?"...":""}}</span></div-->
+                        <div *ngIf="pub.result.editor && pub.result.editor.length > 0"  >Editors: <span *ngFor="let author of pub.result.editor.slice(0,10)  let i = index">{{author.family}} {{author.given}}{{(i < (pub.result.editor.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.editor.slice(0,10).length-1 && pub.result.editor.length > 10)?"...":""}}</span></div>
+
+                        <!-- Openaire -->
+                        <div *ngIf="pub.result.authors && pub.result.authors.length >0 "  >Authors: <span *ngFor="let author of pub.result.authors.slice(0,10) let i = index">{{author}}{{(i < (pub.result.authors.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.authors.slice(0,10).length-1 && pub.result.authors.length > 10)?"...":""}}</span></div>
+
+                        <!-- Orcid -->
+
+                        <!--span  *ngIf="pub.result['journal-title'] && pub.result['journal-title'].value " class="uk-article-meta">Journal: {{pub.result['journal-title'].value}}</span>
+                        <div *ngIf="pub.result.contributors && pub.result.contributors.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of pub.result.contributors.slice(0,10) let i = index">{{author}}{{(i < (pub.result.contributors.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.contributors.slice(0,10).length-1 && pub.result.contributors.length > 10)?"...":""}}</span></div-->
+                        <!-- Datacite -->
+                        <!--span *ngIf="pub.result.attributes['container-title']" class="uk-article-meta">Publisher: {{pub.result.attributes['container-title']}}</span><span *ngIf="pub.date"  class="uk-article-meta" >({{pub.date.substring(0,4)}})</span>
+                       <div *ngIf="pub.result.attributes.author && pub.result.attributes.author.length > 0" class="uk-article-meta">Authors: <span *ngFor="let author of pub.result.attributes.author.slice(0,10) let i = index">{{(author.family)?author.family+', '+author.given:author.literal}}{{(i < (pub.result.attributes.author.slice(0,10).length-1))?"; ":""}}{{(i == pub.result.attributes.author.slice(0,10).length-1 && pub.result.attributes.author.length > 10)?"...":""}}</span></div-->
+                       <div><span class="uk-label label-grey">{{pub.source}}</span>
+                        <span *ngIf="pub.accessRights" [class]=" 'uk-label label-'+pub.accessRights" > {{pub.accessRights}}</span>
+                         <span *ngIf="pub.type" [class]="'uk-label label-'+pub.type" > {{pub.type}}</span>
+                        </div>
+                    </td>
+                    <td *ngIf="showAccessRights  && pub.source != 'openaire' "   >
+
+                            <select   [(ngModel)]="pub.type" name="{{'select_type_'+pub.id}}"  >
+                              <option   [value]="'publication'" (click)="onTypeChanged('publication',pub)" >Publication</option>
+                              <option   [value]="'dataset'"   (click)="onTypeChanged('dataset',pub)" >Research Data</option>
+                              <option   [value]="'software'"   (click)="onTypeChanged('software',pub)" >Software</option>
+                            </select>
+
+                            <select   [(ngModel)]="pub.accessRights" name="{{'select_rights_'+pub.id}}"  >
+                              <option *ngFor="let type of accessTypes"  [value]="type"  (click)="accessRightsTypeChanged(type,pub)">{{type}}</option>
+                            </select>
+                            <my-date-picker *ngIf="pub.accessRights== 'EMBARGO'"  name="{{'date'+pub.id}}" [options]="myDatePickerOptions"
+                            [(ngModel)]="nextDate" (dateChanged)="onDateChanged($event,pub)" ></my-date-picker>
+
+                    </td>
+
+
+
+                     <td *ngIf="showAccessRights  && pub.source == 'openaire' "  >
+                           Currently you cannot change metadata from OpenAIRE
+
+                    </td>
+                 </tr>
+                </tbody>
+
+            </table>
+          <div>
+            <modal-alert (alertOutput)="confirmClose($event)">
+            </modal-alert>
+          </div>
+  </div>
+</div>
+
+
+          `
+
+})
+export class ClaimSelectedResultsComponent {
+  ngOnInit() {
+    var myDate = new Date();
+    this.nextDate = { date: { year: myDate.getFullYear()+10, month: (myDate.getMonth()+1), day: myDate.getDate() } };
+    //2015-05-01
+
+}
+
+ @Input() results: ClaimResult[];
+ @Input() title:string = "Research Results";
+ @Input() showAccessRights:boolean = false;
+ @Input() bulkMode:boolean = false;
+ // @Output()resultsChange = new EventEmitter();
+ @Input() showSearch:boolean = false;
+ nextDate  = {};
+ @ViewChild(AlertModal) alertApplyAll;
+
+public commonAccessRights = "OPEN"; // for access rights- changes when user apply a change to every result
+public commonEmbargoEndDate; // for access rights: embargoEndDate - changes when user apply a change to every result
+public commonType; // for research result type - changes when user apply a change to every result
+public typeChanged:boolean = true; //
+accessTypes = ["OPEN","CLOSED","EMBARGO","RESTRICTED"];
+private myDatePickerOptions: IMyOptions = {
+      // other options...
+      dateFormat: 'yyyy-mm-dd',
+      selectionTxtFontSize: '15px',
+      height:'28px',
+      width: '100%',
+      editableDateField: false,
+      showClearDateBtn: false
+  };
+
+
+ removePublication(item:any){
+   var index:number =this.results.indexOf(item);
+    if (index > -1) {
+       this.results.splice(index, 1);
+   }
+  //  this.resultsChange.emit({
+  //    value: this.results
+  //  });
+ }
+
+
+   onDateChanged (event:any, item:any) {
+       item.embargoEndDate = Dates.getDateFromString(event.formatted);
+       if(this.results.length > 1 ){
+         this.commonAccessRights = "EMBARGO";
+         this.commonEmbargoEndDate = item.embargoEndDate;
+           this.confirmOpen(false,"Do you wish to apply the change to every result?");
+       }
+
+   }
+   onTypeChanged (event:any, item:any) {
+       item.type =(event);
+       if(this.results.length > 1 ){
+         this.commonType = item.type;
+            this.confirmOpen(true, "Do you wish to apply the change to every result?");
+       }
+
+   }
+  //  resultsChanged($event) {
+  //    this.results=$event.value;
+  //    this.resultsChange.emit({
+  //      value: this.results
+  //    });
+  //  }
+   /* 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.results.length > 1 ){
+         this.commonAccessRights = type;
+         if(this.commonAccessRights != "EMBARGO"){
+           this.commonEmbargoEndDate = item.embargoEndDate;
+           this.confirmOpen(false, "Do you wish to apply the change to every result?");
+         }
+       }
+
+   }
+   confirmOpen(type: boolean, message: string){
+     this.typeChanged = type;
+     this.alertApplyAll.cancelButton = true;
+     this.alertApplyAll.okButton = true;
+     this.alertApplyAll.alertTitle = "Change metadata";
+     this.alertApplyAll.message = "Do you wish to apply the change to every result?";
+     this.alertApplyAll.okButtonText = "Yes";
+     this.alertApplyAll.cancelButtonText = "No";
+     this.alertApplyAll.open();
+   }
+    confirmClose(data){
+      if(this.typeChanged){
+
+        for (var i = 0; i < this.results.length; i++) {
+          if(this.results[i].source != 'openaire' ){
+            this.results[i].type = this.commonType;
+          }
+        }
+
+      }else{
+        for (var i = 0; i < this.results.length; i++) {
+          if(this.results[i].source != 'openaire' ){
+            this.results[i].accessRights = this.commonAccessRights;
+            if(this.commonAccessRights == "EMBARGO"){
+              this.results[i].embargoEndDate = this.commonEmbargoEndDate;
+            }
+          }
+        }
+     }
+   }
+}
diff --git a/claims/linking/selected/selectedResults.module.ts b/claims/linking/selected/selectedResults.module.ts
new file mode 100644
index 00000000..0b12fb2d
--- /dev/null
+++ b/claims/linking/selected/selectedResults.module.ts
@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../../shared/shared.module';
+import {ClaimSelectedResultsComponent} from './selectedResults.component';
+import {AlertModalModule} from '../../../utils/modal/alertModal.module';
+import { MyDatePickerModule } from '../../../utils/my-date-picker/my-date-picker.module';
+// import {BulkClaimModule} from '../bulkClaim/bulkClaim.module';
+// import {ClaimResultSearchFormModule} from '../../claim-utils/claimResultSearchForm.module';
+
+@NgModule({
+  imports: [
+    SharedModule,
+    AlertModalModule,
+     MyDatePickerModule,
+    // BulkClaimModule, ClaimResultSearchFormModule,
+  ],
+  declarations: [
+    ClaimSelectedResultsComponent
+  ], exports:[ClaimSelectedResultsComponent]
+})
+export class SelectedPublicationsModule { }
diff --git a/claims/myClaims/myClaims-routing.module.ts b/claims/myClaims/myClaims-routing.module.ts
new file mode 100644
index 00000000..a5f99f5f
--- /dev/null
+++ b/claims/myClaims/myClaims-routing.module.ts
@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { LoginGuard} from'../../login/loginGuard.guard';
+
+import { MyClaimsComponent } from './myClaims.component';
+import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      { path: '', component: MyClaimsComponent, canActivate: [IsRouteEnabled, LoginGuard],
+      data: {redirect: '/error'}, canDeactivate: [PreviousRouteRecorder]}])
+  ]
+})
+export class MyClaimsRoutingModule { }
diff --git a/claims/myClaims/myClaims.component.ts b/claims/myClaims/myClaims.component.ts
new file mode 100644
index 00000000..7d740def
--- /dev/null
+++ b/claims/myClaims/myClaims.component.ts
@@ -0,0 +1,36 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Meta} from '../../../angular2-meta';
+
+
+@Component({
+    selector: 'my-claims',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+    <div class="uk-container uk-margin-top">
+      <div class="uk-article-title custom-article-title">
+         My Claims
+      </div>
+      <div>
+        <div class="uk-text-right"><a  routerLink="/participate/claim">Add more Links?</a></div>
+        <displayClaims [enableDelete]=true [myClaims]=true [isAdmin]=false [showUserEmail]=false ></displayClaims>
+      </div>
+    </div>
+    </div>
+  </div>
+</div>
+`
+
+})
+ export class MyClaimsComponent {
+  constructor ( private _meta: Meta ) {
+    this._meta.setTitle("OpenAIRE | My Claims");
+   }
+   ngOnInit() {
+
+  }
+
+}
diff --git a/claims/myClaims/myClaims.module.ts b/claims/myClaims/myClaims.module.ts
new file mode 100644
index 00000000..e7f0199b
--- /dev/null
+++ b/claims/myClaims/myClaims.module.ts
@@ -0,0 +1,25 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../../shared/shared.module';
+import { MyClaimsComponent } from './myClaims.component';
+import { MyClaimsRoutingModule } from './myClaims-routing.module';
+// import{ClaimServiceModule} from '../claim-utils/service/claimsService.module';
+import {DisplayClaimsModule} from '../claim-utils/displayClaims/displayClaims.module';
+import {LoginGuard} from'../../login/loginGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    SharedModule,
+    MyClaimsRoutingModule,
+    // ClaimServiceModule,
+    DisplayClaimsModule
+
+  ],
+  providers:[LoginGuard, PreviousRouteRecorder, IsRouteEnabled],
+  declarations: [
+    MyClaimsComponent
+  ]
+})
+export class MyClaimsModule { }
diff --git a/claims/myClaimsDemo.component.ts b/claims/myClaimsDemo.component.ts
new file mode 100644
index 00000000..6490a59c
--- /dev/null
+++ b/claims/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}] );
+//   }
+// }
diff --git a/deposit/datasets/depositBySubject.component.ts b/deposit/datasets/depositBySubject.component.ts
new file mode 100644
index 00000000..17a17268
--- /dev/null
+++ b/deposit/datasets/depositBySubject.component.ts
@@ -0,0 +1,34 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router } from '@angular/router';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+
+
+@Component({
+    selector: 'deposit-by-subject',
+    template: `
+        <div class="uk-margin-top">
+
+                <h3>Or search for domain specific repositories</h3>
+
+                <form class= "uk-grid">
+                    <input type="text"  [(ngModel)]="subjectKeyword"  class="uk-margin-medium-left uk-padding-remove-left  uk-input" name="subject" placeholder="Type keywords (e.g Biology, Natural sciences, Social Sciences, Engineering Sciences... )"  style="width: 580px;" />
+
+                    <button class=" uk-button uk-button-default"  type="submit" (click)="search()" >
+                        Search
+                    </button>
+                </form>
+        </div>
+    `
+})
+
+export class DepositBySubjectComponent {
+    @Input() subjectKeyword: string='';
+
+    constructor (private _router: Router) { }
+
+    public search() {
+      this._router.navigate( ['participate/deposit-subject-result'], { queryParams: { "q": this.subjectKeyword } } );
+    }
+}
diff --git a/deposit/datasets/depositBySubjectResult.component.html b/deposit/datasets/depositBySubjectResult.component.html
new file mode 100644
index 00000000..69825626
--- /dev/null
+++ b/deposit/datasets/depositBySubjectResult.component.html
@@ -0,0 +1,79 @@
+
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+    <div class="uk-container uk-margin-top">
+        <div class="uk-article-title custom-article-title">
+            Deposit {{requestFor}}
+        </div>
+
+                    <div class="uk-width-1-1  uk-margin uk-padding uk-panel  uk-background-muted">
+                      <form class= "uk-margin uk-text-center uk-margin-top">
+                          <input type="text"  [(ngModel)]="newSubject"  class=" uk-input uk-width-1-2" name="subject" placeholder="Search for classifications..."   />
+
+                          <button class=" uk-button uk-button-default"  type="submit" (click)="searchDataproviders()" >
+                              Search
+                          </button>
+                      </form>
+                      <div *ngIf="subject.length > 0" class=" uk-text-center ">
+                          <span>Keywords: {{subject}}<span><a class="uk-icon-button" (click) = "subject = ''"><span aria-hidden="true" class=" clickable "><span class="clickable uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span></span></a></span>
+                        </span>
+                      </div>
+                    </div>
+          <div class="uk-width-1-1">
+            <helper position="top"></helper>
+          </div>
+          <div class="uk-grid  helper-grid">
+            <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
+            <div class="uk-width-expand">
+              <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING"
+                    class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
+              </div>
+
+
+
+              <div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
+                  <p>Please use the information/contacts shown below to deposit your {{requestFor}}.</p>
+                  <!--showDataProviders [dataProviders]=dataProviders></showDataProviders-->
+                  <div *ngIf="fetchDataproviders.searchUtils.totalResults" class="">
+                      <paging-no-load [currentPage]="page" [totalResults]="fetchDataproviders.searchUtils.totalResults"    size=10  (pageChange)="pageChange($event)"> </paging-no-load>
+                   </div>
+                   <div class="" *ngIf="fetchDataproviders.results  && fetchDataproviders.searchUtils.totalResults > 0">
+                         {{fetchDataproviders.searchUtils.totalResults}} content providers, page {{fetchDataproviders.searchUtils.page}} of {{(totalPages())}}
+                   </div>
+
+                  <search-result  [(results)]="fetchDataproviders.results"
+                                  type="dataprovider" urlParam="datasourceId" [showSubjects]=true
+                                  [custom_class]="'other-results'">
+                  </search-result>
+              </div>
+
+              <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NONE && subject != ''" class = "uk-alert uk-alert-primary">
+                  No content providers found with classification "{{subject}}".
+              </div>
+              <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR && subject != ''" class = "uk-alert uk-alert-danger">
+                  An error occured.
+              </div>
+
+              <div *ngIf="(fetchDataproviders.searchUtils.totalResults == 0 && fetchDataproviders.searchUtils.status == errorCodes.DONE)
+                          || fetchDataproviders.searchUtils.status == errorCodes.NONE || fetchDataproviders.searchUtils.status == errorCodes.ERROR" class = "uk-alert  ">
+
+                  You can still deposit your {{requestFor}} in
+                  <a href="{{zenodo}}" target="_blank">OpenAIRE's Zenodo catch-all repository (<i class="custom-external"></i>)</a>
+                  hosted by CERN.
+              </div>
+            </div>
+            <helper position="right" styleName=" uk-width-1-5"></helper>
+      </div>
+
+        <button class=" uk-button uk-button-default uk-margin-small-top"  type="submit" (click)="goToDeposit()">
+            <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span> Back
+        </button>
+        <helper position="bottom"></helper>
+    </div>
+    </div>
+  </div>
+</div>
diff --git a/deposit/datasets/depositBySubjectResult.component.ts b/deposit/datasets/depositBySubjectResult.component.ts
new file mode 100644
index 00000000..438db3c1
--- /dev/null
+++ b/deposit/datasets/depositBySubjectResult.component.ts
@@ -0,0 +1,127 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import { Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
+import { FetchDataproviders } from '../../utils/fetchEntitiesClasses/fetchDataproviders.class';
+import { SearchDataprovidersService } from '../../services/searchDataproviders.service';
+
+import {OrganizationService} from '../../services/organization.service';
+import { Meta} from '../../../angular2-meta';
+
+import {RouterHelper} from '../../utils/routerHelper.class';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'deposit-by-subject-result',
+    templateUrl: 'depositBySubjectResult.component.html'
+})
+
+export class DepositBySubjectResultComponent {
+  @Input() compatibility: string = '';
+
+  // Type of entity: Publication or Research Data
+  @Input() requestFor: string = "Research Data";
+  @Input() subject: string = "";
+
+  public newSubject: string= "";
+
+  public fetchDataproviders : FetchDataproviders;
+  public linkToSearchDataproviders = "";
+
+  // url of Zenodo
+  public zenodo: string;
+
+  public page: number = 1;
+
+  public status: number;
+
+  public routerHelper:RouterHelper = new RouterHelper();
+  public errorCodes:ErrorCodes = new ErrorCodes();
+
+  sub: any;
+  piwiksub: any;
+
+  constructor ( private _router: Router,
+                private  route: ActivatedRoute,
+                private _searchDataprovidersService: SearchDataprovidersService,
+                private _meta: Meta, private _piwikService:PiwikService) {
+
+          this.zenodo = OpenaireProperties.getZenodoURL();
+          this.fetchDataproviders = new FetchDataproviders(this._searchDataprovidersService);
+
+          this.status = this.errorCodes.LOADING;
+          this.updateTitle("Deposit "+this.requestFor);
+          this.updateDescription("Openaire,  repositories, open access,  content provider, compatibility, organization, deposit "+ this.requestFor);
+          this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+          if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+            this.piwiksub = this._piwikService.trackView("Deposit "+this.requestFor).subscribe();
+          }
+  }
+
+
+
+  ngOnInit() {
+      console.info('depositResult init');
+
+      this.sub =  this.route.queryParams.subscribe(params => {
+          this.subject = params['q'];
+          this.newSubject = this.subject;
+          this.searchDataproviders();
+      });
+  }
+
+  // ngDoCheck() {
+  //     if(this.organizationId == "" || this.organizationId == undefined) {
+  //         this.organizationId = "";
+  //         this.status = this.errorCodes.ERROR;
+  //     }
+  // }
+
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+    if(this.piwiksub){
+      this.piwiksub.unsubscribe();
+    }
+  }
+
+  public totalPages(): number {
+      let totalPages:any = this.fetchDataproviders.searchUtils.totalResults/(this.fetchDataproviders.searchUtils.size);
+      if(!(Number.isInteger(totalPages))) {
+          totalPages = (parseInt(totalPages, 10) + 1);
+      }
+      return totalPages;
+  }
+
+  public searchDataproviders() {
+      this.subject = this.newSubject;
+      this.fetchDataproviders.getResultsBySubjectsForDeposit( (this.subject =="")?"*":this.subject, this.requestFor, this.page, 10);
+      this.linkToSearchDataproviders = OpenaireProperties.getLinkToSearchDataProviders();
+  }
+
+  public goToDeposit() {
+      if(this.requestFor == "Publications") {
+          this._router.navigate( ['participate/deposit-publications'] );
+      } else if(this.requestFor == "Research Data") {
+          this._router.navigate( ['participate/deposit-datasets'] );
+      }
+  }
+  public pageChange($event) {
+    this.page = +$event.value;
+    this.searchDataproviders();
+  }
+
+  private updateDescription(description:string){
+    this._meta.updateMeta("description", description);
+    this._meta.updateProperty("og:description", description);
+  }
+  private updateTitle(title:string){
+    var _prefix ="OpenAIRE | ";
+    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+    this._meta.setTitle(_title );
+    this._meta.updateProperty("og:title",_title);
+  }
+  private updateUrl(url:string){
+    this._meta.updateProperty("og:url", url);
+  }
+}
diff --git a/deposit/datasets/depositBySubjectResults.module.ts b/deposit/datasets/depositBySubjectResults.module.ts
new file mode 100644
index 00000000..6445da0c
--- /dev/null
+++ b/deposit/datasets/depositBySubjectResults.module.ts
@@ -0,0 +1,33 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import { DepositBySubjectResultComponent } from './depositBySubjectResult.component';
+
+import {DepositModule} from '../deposit.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {PagingModule } from '../../utils/paging.module';
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchResultsModule } from '../../searchPages/searchUtils/searchResults.module';
+import {HelperModule} from '../../utils/helper/helper.module';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DepositModule,
+    SearchResultsModule, DataProvidersServiceModule, PagingModule,
+    HelperModule
+  ],
+  declarations: [
+
+    DepositBySubjectResultComponent
+
+  ],
+  exports: [
+    DepositBySubjectResultComponent
+   ],
+  providers:    [FreeGuard,PreviousRouteRecorder, IsRouteEnabled]
+})
+export class DepositBySubjectResultsModule { }
diff --git a/deposit/datasets/depositDatasets.component.ts b/deposit/datasets/depositDatasets.component.ts
new file mode 100644
index 00000000..4c468aeb
--- /dev/null
+++ b/deposit/datasets/depositDatasets.component.ts
@@ -0,0 +1,21 @@
+import {Component} from '@angular/core';
+
+@Component({
+    selector: 'deposit-datasets',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+    <div class="uk-container">
+        <deposit [compatibility]="'openaire____::21f8a223b9925c2f87c404096080b046||Registry of Research Data Repository'" [requestFor]="'Research Data'" [searchBySubjects]=true></deposit>         
+    <div>
+    </div>
+  </div>
+</div>
+    `
+})
+
+export class DepositDatasetsComponent {
+
+}
diff --git a/deposit/datasets/depositDatasets.module.ts b/deposit/datasets/depositDatasets.module.ts
new file mode 100644
index 00000000..471b277a
--- /dev/null
+++ b/deposit/datasets/depositDatasets.module.ts
@@ -0,0 +1,27 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import { DepositDatasetsComponent } from './depositDatasets.component';
+import { DepositDatasetsResultComponent } from './depositDatasetsResult.component';
+ import {DepositModule} from '../deposit.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DepositModule
+  ],
+  declarations: [
+
+    DepositDatasetsComponent
+
+  ],
+  exports: [
+    DepositDatasetsComponent
+   ],
+  providers:    [FreeGuard,PreviousRouteRecorder, IsRouteEnabled]
+})
+export class DepositDatasetsModule { }
diff --git a/deposit/datasets/depositDatasetsResult.component.ts b/deposit/datasets/depositDatasetsResult.component.ts
new file mode 100644
index 00000000..edbe92db
--- /dev/null
+++ b/deposit/datasets/depositDatasetsResult.component.ts
@@ -0,0 +1,14 @@
+import {Component} from '@angular/core';
+
+@Component({
+    selector: 'deposit-datasets-result',
+    template: `
+        <deposit-result [compatibility]="'openaire____::21f8a223b9925c2f87c404096080b046||Registry of Research Data Repository'" [requestFor]="'Research Data'"></deposit-result>
+
+        
+    `
+})
+
+export class DepositDatasetsResultComponent {
+
+}
diff --git a/deposit/datasets/depositDatasetsResults.module.ts b/deposit/datasets/depositDatasetsResults.module.ts
new file mode 100644
index 00000000..cdad3153
--- /dev/null
+++ b/deposit/datasets/depositDatasetsResults.module.ts
@@ -0,0 +1,27 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import { DepositDatasetsResultComponent } from './depositDatasetsResult.component';
+
+import {DepositModule} from '../deposit.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DepositModule
+  ],
+  declarations: [
+
+    DepositDatasetsResultComponent,
+
+  ],
+  exports: [
+    DepositDatasetsResultComponent,
+   ],
+  providers:    [FreeGuard,PreviousRouteRecorder, IsRouteEnabled]
+})
+export class DepositDatasetsResultsModule { }
diff --git a/deposit/deposit.component.html b/deposit/deposit.component.html
new file mode 100644
index 00000000..f18817f4
--- /dev/null
+++ b/deposit/deposit.component.html
@@ -0,0 +1,56 @@
+<div class="uk-margin-top">
+    <div class="uk-article-title custom-article-title uk-margin-bottom">
+      Deposit {{requestFor}}
+    </div>
+    <div class="uk-width-1-1">
+      <helper position="top"></helper>
+    </div>
+    <div class="uk-grid  helper-grid uk-margin-top">
+      <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
+      <div class="uk-width-expand">
+        <!--div>
+          <p>
+              <i>
+                  Are you a grant recipient from the following: H2020; FP7 with SC39; or ERC?
+              </i>
+              Then you are required to publish in
+              <a href="{{openAccess}}" target="_blank">open access (<i class="custom-external"></i>)</a>.
+              One way to do this is to deposit your {{requestFor}} into an
+              <a href="{{openAccessRepo}}" target="_blank">open access repository (<i class="custom-external"></i>)</a>.
+          </p>
+          <p>
+              Click the following to find more information:
+              <a href="{{fp7Guidlines}}" target="_blank">FP7 guidelines (<i class="custom-external"></i>)</a>,
+              <a href="{{h2020Guidlines}}" target="_blank">H2020 guidelines (<i class="custom-external"></i>)</a>,
+              <a href="{{ercGuidlines}}" target="_blank">ERC guidelines (<i class="custom-external"></i>)</a> OR
+              <a href="{{helpdesk}}" target="_blank">ask a question (<i class="custom-external"></i>)</a> to OpenAIRE’s national representative.
+          </p>
+        </div-->
+          <h3>See if your institution has a repository </h3>
+
+          <form class= "uk-grid">
+              <div class="uk-width-1-2 ">
+              <entities-autocomplete fieldId="organization" (click)="warningMessage = ''" [entityType]="'organization'" [depositType]=compatibility   [selectedValue]=selectedId [showSelected]=true
+                [placeHolderMessage] = "'Organization name'" [title] = "'Organizations'"  [multipleSelections]=false
+                (selectedValueChanged)="valueChanged($event)">
+              </entities-autocomplete>
+              </div>
+              <button class=" uk-margin-left uk-button uk-button-default"  type="submit" (click)="organizationSelected(selectedId)" >
+                  Locate
+              </button>
+              <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">{{warningMessage}}</div>
+          </form>
+          <div *ngIf="searchBySubjects" >
+            <deposit-by-subject></deposit-by-subject>
+          </div>
+          <div *ngIf="mapUrl"  class="uk-margin-large-top">
+            <h3>Or locate repository on map</h3>
+            <div   class="uk-margin-top">
+              <i-frame [url]="mapUrl" width="100%" height="900"></i-frame>
+            </div>
+          </div>
+        </div>
+        <helper position="right" styleName=" uk-width-1-5"></helper>
+  </div>
+  <helper position="bottom"></helper>
+</div>
diff --git a/deposit/deposit.component.ts b/deposit/deposit.component.ts
new file mode 100644
index 00000000..04565a11
--- /dev/null
+++ b/deposit/deposit.component.ts
@@ -0,0 +1,91 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router } from '@angular/router';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import { Meta} from '../../angular2-meta';
+import {PiwikService} from '../utils/piwik/piwik.service';
+
+
+@Component({
+    selector: 'deposit',
+    templateUrl: 'deposit.component.html'
+})
+
+export class DepositComponent {
+  @Input() compatibility: string = '';
+  @Input() mapUrl: string = null; // optional  in case i-frame is needed
+  @Input() searchBySubjects: boolean = false; // optional: in case search by subjects is needed
+
+
+  public status: number;
+
+  // Type of entity: Publication or Research Data
+  @Input() requestFor: string = "Publications";
+
+  // url's needed for information text
+  public openAccess: string;
+  public openAccessRepo: string;
+  public fp7Guidlines: string;
+  public h2020Guidlines: string;
+  public ercGuidlines: string;
+  public helpdesk: string;
+
+  // Id of the new selected organization to be searched
+  public selectedId: string = "";
+
+  public warningMessage: string = "";
+
+  piwiksub:any;
+
+  constructor (private _router: Router, private _meta: Meta, private _piwikService:PiwikService) {
+
+      this.openAccess = OpenaireProperties.getOpenAccess();
+      this.openAccessRepo = OpenaireProperties.getOpenAccessRepo();
+      this.fp7Guidlines = OpenaireProperties.getFP7Guidlines();
+      this.h2020Guidlines = OpenaireProperties.getH2020Guidlines();
+      this.ercGuidlines = OpenaireProperties.getERCGuidlines();
+      this.helpdesk = OpenaireProperties.getHelpdesk();
+      this.updateTitle("Deposit "+this.requestFor);
+      this.updateDescription("Openaire,  repositories, open access,  content provider, compatibility, organization, deposit "+ this.requestFor);
+      this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+      if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+        this.piwiksub = this._piwikService.trackView("Deposit "+this.requestFor).subscribe();
+      }
+  }
+  ngOnDestroy() {
+    if(this.piwiksub){
+      this.piwiksub.unsubscribe();
+    }
+  }
+
+  public organizationSelected(id: string) {
+      console.info("organization selected");
+      if(id && id.length > 0){
+          if(this.requestFor == "Publications") {
+              this._router.navigate( ['participate/deposit-publications-result'], { queryParams: { "organizationId": id } } );
+          } else if(this.requestFor == "Research Data") {
+              this._router.navigate( ['participate/deposit-datasets-result'], { queryParams: { "organizationId": id } } );
+          }
+      } else {
+          this.warningMessage = "No organization selected";
+      }
+  }
+
+  public valueChanged($event){
+    this.selectedId = $event.value;
+  }
+
+  private updateDescription(description:string){
+    this._meta.updateMeta("description", description);
+    this._meta.updateProperty("og:description", description);
+  }
+  private updateTitle(title:string){
+    var _prefix ="OpenAIRE | ";
+    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+    this._meta.setTitle(_title );
+    this._meta.updateProperty("og:title",_title);
+  }
+  private updateUrl(url:string){
+    this._meta.updateProperty("og:url", url);
+  }
+}
diff --git a/deposit/deposit.module.ts b/deposit/deposit.module.ts
new file mode 100644
index 00000000..8eaf0b55
--- /dev/null
+++ b/deposit/deposit.module.ts
@@ -0,0 +1,45 @@
+/* Common Component of deposit for both research data & ppublications*/
+
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import { DepositComponent } from './deposit.component';
+import { DepositResultComponent } from './depositResult.component';
+import {EntitiesAutocompleteModule} from '../utils/entitiesAutoComplete/entitiesAutoComplete.module';
+import {DataProvidersServiceModule} from '../services/dataProvidersService.module';
+import {OrganizationServiceModule} from '../services/organizationService.module';
+import {SearchResultsModule } from '../searchPages/searchUtils/searchResults.module';
+import {PiwikServiceModule} from '../utils/piwik/piwikService.module';
+import {HelperModule} from '../utils/helper/helper.module';
+import { DepositBySubjectComponent } from './datasets/depositBySubject.component';
+import {IFrameModule} from '../utils/iframe.module';
+
+
+
+ @NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    RouterModule,
+    EntitiesAutocompleteModule,
+    DataProvidersServiceModule,
+    OrganizationServiceModule,
+    SearchResultsModule,
+    PiwikServiceModule,
+    HelperModule,
+    IFrameModule
+  ],
+  declarations: [
+    DepositComponent,
+    DepositResultComponent,
+    DepositBySubjectComponent
+  ],
+  exports: [
+    DepositComponent,
+    DepositResultComponent
+  ],
+  providers:    [
+  ]
+})
+export class DepositModule { }
diff --git a/deposit/depositResult.component.ts b/deposit/depositResult.component.ts
new file mode 100644
index 00000000..bbd41c31
--- /dev/null
+++ b/deposit/depositResult.component.ts
@@ -0,0 +1,283 @@
+import {Component, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {OpenaireProperties, ErrorCodes} from '../utils/properties/openaireProperties';
+import { Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
+import { FetchDataproviders } from '../utils/fetchEntitiesClasses/fetchDataproviders.class';
+import { SearchDataprovidersService } from '../services/searchDataproviders.service';
+
+import {OrganizationService} from '../services/organization.service';
+import { Meta} from '../../angular2-meta';
+
+import {RouterHelper} from '../utils/routerHelper.class';
+import {PiwikService} from '../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'deposit-result',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+        <div class="uk-container uk-margin-top">
+            <!--div class="uk-article-title custom-article-title">
+                Deposit {{requestFor}}
+            </div-->
+            <helper position="top"></helper>
+            <div class="uk-grid  helper-grid">
+              <helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
+              <div class="uk-width-expand">
+                <div *ngIf="status == errorCodes.LOADING || (status == errorCodes.LOADING && fetchDataproviders.searchUtils.status == errorCodes.LOADING)"
+                      class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
+                </div>
+
+
+                <!--div *ngIf="status != errorCodes.LOADING" class="uk-margin-bottom  uk-margin-top">
+                  <h3>See if your institution has a repository </h3>
+
+                  <form class= "uk-grid">
+                      <div class="uk-width-1-2 ">
+                      <entities-autocomplete fieldId="organization" (click)="warningMessage = ''" [entityType]="'organization'"
+                        [depositType]=compatibility  [showSelected]=true [placeHolderMessage] = "'Organization name'"
+                        [title] = "'Organizations'"  [multipleSelections]=false (selectedValueChanged)="valueChanged($event)">
+                      </entities-autocomplete>
+                      </div>
+                      <button class=" uk-button uk-button-default"  type="submit" (click)="organizationSelected(selectedId)" >
+                          Locate
+                      </button>
+                      <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">{{warningMessage}}</div>
+                  </form>
+                </div-->
+
+
+                <div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
+                    <h2 *ngIf="organization" class="organization">
+                        <a *ngIf="organization['url']!=''" href="{{organization.url}}" target="_blank">
+                            <span><i class="custom-external"></i>{{organization['name']}}</span>
+                        </a>
+                        <span *ngIf="organization['url']==''">{{organization['name']}}</span>
+                    </h2>
+
+
+                </div>
+
+                <div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
+                    <p class="uk-text-meta">Please use the information below and contact your repository to deposit your <span class="uk-text-lowercase">{{requestFor}}</span>.</p>
+                    <!--showDataProviders [dataProviders]=dataProviders></showDataProviders-->
+                    <div class = "uk-text-right" *ngIf = "fetchDataproviders.searchUtils.totalResults > 10">
+    					<!--a [href] = "linkToSearchDataproviders">
+    						View all {{fetchDataproviders.searchUtils.totalResults}} results <span class="uk-icon">
+    <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+    </span>
+    					</a-->
+
+                        <a  [queryParams]="routerHelper.createQueryParams(['organizationId', 'or'], [organizationId, 'and'])"
+                            routerLinkActive="router-link-active" [routerLink]="linkToSearchDataproviders" class="uk-button uk-button-text">
+                            View all {{fetchDataproviders.searchUtils.totalResults}} results
+                        </a>
+    				</div>
+                    <search-result  [(results)]="fetchDataproviders.results"
+                                    [(status)]= "fetchDataproviders.searchUtils.status"
+                                    type="dataprovider" urlParam="datasourceId" [showOrganizations] = false
+                                    [custom_class]="'other-results'">
+                    </search-result>
+                </div>
+
+
+                <div *ngIf="(fetchDataproviders.searchUtils.totalResults == 0 && status == errorCodes.DONE)
+                            || status == errorCodes.NOT_FOUND || status == errorCodes.ERROR || status == errorCodes.NOT_AVAILABLE" class = "alert alert-warning">
+                    <div *ngIf="organization">
+                        <span *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR">
+                            An error occured.
+                        </span>
+                        No content providers found for institution:
+                        <a *ngIf="organization['url']!=''" target="_blank" href="{{organization.url}}">
+                            <span>{{organization['name']}} (<i class="custom-external"></i>)</span>
+                        </a>
+                        <span *ngIf="organization['url']==''">{{organization['name']}}</span>
+                        .
+                    </div>
+                    <div *ngIf="status == errorCodes.NOT_FOUND && organizationId != ''">
+                        No organization with ID: {{organizationId}} found.
+                    </div>
+                    <div *ngIf="status == errorCodes.ERROR && organizationId != ''">
+                        An error occured.
+                    </div>
+                    <span *ngIf="status == errorCodes.NOT_AVAILABLE && organizationId != ''">
+                        Service temprorarily unavailable. Please try again later.
+                    </span>
+                    <div *ngIf="organizationId == ''">
+                        No ID for organization.
+                    </div>
+
+                    You can still deposit your {{requestFor}} in
+                    <a href="{{zenodo}}" target="_blank">OpenAIRE's Zenodo catch-all repository (<i class="custom-external"></i>)</a>
+                    hosted by CERN.
+                </div>
+              </div>
+              <helper position="right" styleName=" uk-width-1-5"></helper>
+            </div>
+            <button class=" uk-button uk-button-default uk-margin-small-top"  type="submit" (click)="goToDeposit()">
+                <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span> Back
+            </button>
+            <helper position="bottom"></helper>
+        </div>
+        </div>
+      </div>
+    </div>
+
+    `
+})
+
+export class DepositResultComponent {
+  @Input() compatibility: string = '';
+
+  // Type of entity: Publication or Research Data
+  @Input() requestFor: string = "Publications";
+
+  public organization: {"name": string, "url": string};
+  public organizationId: string = "";
+
+  // Id of the new selected organization to be searched
+  public selectedId: string = "";
+
+  public status: number;
+  public warningMessage: string = "";
+
+  public fetchDataproviders : FetchDataproviders;
+  public linkToSearchDataproviders: string = "";
+
+  // url of Zenodo
+  public zenodo: string;
+
+  public routerHelper:RouterHelper = new RouterHelper();
+  public errorCodes:ErrorCodes = new ErrorCodes();
+
+  sub: any; piwiksub: any;
+
+  constructor ( private _router: Router,
+                private  route: ActivatedRoute,
+                private _searchDataprovidersService: SearchDataprovidersService,
+                private _organizationService: OrganizationService,
+                private _meta: Meta, private _piwikService:PiwikService) {
+
+      this.zenodo = OpenaireProperties.getZenodoURL();
+      this.fetchDataproviders = new FetchDataproviders(this._searchDataprovidersService);
+
+      this.status = this.errorCodes.LOADING;
+      this.updateTitle("Deposit "+this.requestFor);
+      this.updateDescription("Openaire,  repositories, open access,  content provider, compatibility, organization, deposit "+ this.requestFor);
+      this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+      if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+        this.piwiksub = this._piwikService.trackView("Deposit "+this.requestFor).subscribe();
+      }
+    }
+
+    ngOnInit() {
+        console.info('depositResult init');
+
+        this.sub =  this.route.queryParams.subscribe(params => {
+            this.organizationId = params['organizationId'];
+            console.info("Id is :"+this.organizationId);
+            if(this.organizationId){
+                this.getOrganizationInfo();
+            }
+            this.selectedId = "";
+        });
+    }
+
+    ngDoCheck() {
+        if(this.organizationId == "" || this.organizationId == undefined) {
+            this.organizationId = "";
+            this.status = this.errorCodes.ERROR;
+        }
+    }
+
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+      if(this.piwiksub){
+        this.piwiksub.unsubscribe();
+      }
+    }
+
+    private searchDataproviders() {
+        // if(this.organization != undefined) {
+        //     this.fetchDataproviders.getResults(this.organization.name, false, 1, 10);
+        // } else if(this.organizationId != undefined) {
+            this.fetchDataproviders.getResultsForDeposit( this.organizationId,this.requestFor, 1, 10);
+        //}
+        this.linkToSearchDataproviders = OpenaireProperties.getLinkToSearchDataProviders();
+    }
+
+    private getOrganizationInfo ()  {
+        console.info("inside getOrganizationInfo of component");
+
+        this._organizationService.getOrganizationInfo(this.organizationId).subscribe(
+            data => {
+                if(data == null) {
+                  this.status = this.errorCodes.NOT_FOUND;
+                } else {
+                  this.organization = data.title;
+                  this.status = this.errorCodes.DONE;
+                  this.searchDataproviders();
+                }
+            },
+            err => {
+                //console.log(err)
+
+                if(err.status == '404') {
+                  this.status = this.errorCodes.NOT_FOUND;
+                  console.info("not found");
+                } else if(err.status == '500') {
+                  this.status = this.errorCodes.ERROR;
+                  console.info("error");
+                } else {
+                  this.status = this.errorCodes.NOT_AVAILABLE;
+                  console.info("not available");
+                }
+            }
+        );
+    }
+
+    public goToDeposit() {
+        if(this.requestFor == "Publications") {
+            this._router.navigate( ['participate/deposit-publications'] );
+        } else if(this.requestFor == "Research Data") {
+            this._router.navigate( ['participate/deposit-datasets'] );
+        }
+    }
+
+    public valueChanged($event){
+      this.selectedId = $event.value;
+    }
+
+    public organizationSelected(id: string) {
+        console.info("organization selected");
+        if(id && id.length > 0 && id != this.organizationId){
+            this.organization = null;
+            this.status = this.errorCodes.LOADING;
+
+            if(this.requestFor == "Publications") {
+                this._router.navigate( ['participate/deposit-publications-result'], { queryParams: { "organizationId": id } } );
+            } else if(this.requestFor == "Research Data") {
+                this._router.navigate( ['participate/deposit-datasets-result'], { queryParams: { "organizationId": id } } );
+            }
+        } else {
+            this.warningMessage = "No new organization selected";
+        }
+    }
+
+    private updateDescription(description:string){
+      this._meta.updateMeta("description", description);
+      this._meta.updateProperty("og:description", description);
+    }
+    private updateTitle(title:string){
+      var _prefix ="OpenAIRE | ";
+      var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+      this._meta.setTitle(_title );
+      this._meta.updateProperty("og:title",_title);
+    }
+    private updateUrl(url:string){
+      this._meta.updateProperty("og:url", url);
+    }
+}
diff --git a/deposit/publications/depositPublications.component.ts b/deposit/publications/depositPublications.component.ts
new file mode 100644
index 00000000..77ff9a23
--- /dev/null
+++ b/deposit/publications/depositPublications.component.ts
@@ -0,0 +1,21 @@
+import {Component} from '@angular/core';
+
+@Component({
+    selector: 'deposit-publications',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+      <div class="uk-container">
+        <deposit [compatibility]="'openaire____::47ce9e9f4fad46e732cff06419ecaabb||OpenDOAR'" [requestFor]="'Publications'" [mapUrl]=mapUrl></deposit>         
+      </div>
+      </div>
+    </div>
+  </div>
+    `
+})
+
+export class DepositPublicationsComponent {
+  public mapUrl ="https://beta.openaire.eu/stats/markers-demo.html";
+}
diff --git a/deposit/publications/depositPublications.module.ts b/deposit/publications/depositPublications.module.ts
new file mode 100644
index 00000000..77e922bf
--- /dev/null
+++ b/deposit/publications/depositPublications.module.ts
@@ -0,0 +1,25 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import { DepositPublicationsComponent } from './depositPublications.component';
+
+import {DepositModule} from '../deposit.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DepositModule
+    ],
+  declarations: [
+    DepositPublicationsComponent
+  ],
+  exports: [
+    DepositPublicationsComponent,
+   ],
+  providers:    [FreeGuard,PreviousRouteRecorder, IsRouteEnabled]
+})
+export class DepositPublicationsModule { }
diff --git a/deposit/publications/depositPublicationsResult.component.ts b/deposit/publications/depositPublicationsResult.component.ts
new file mode 100644
index 00000000..c7da81eb
--- /dev/null
+++ b/deposit/publications/depositPublicationsResult.component.ts
@@ -0,0 +1,12 @@
+import {Component} from '@angular/core';
+
+@Component({
+    selector: 'deposit-publications-result',
+    template: `
+        <deposit-result [compatibility]="'openaire____::47ce9e9f4fad46e732cff06419ecaabb||OpenDOAR'" [requestFor]="'Publications'"></deposit-result>
+    `
+})
+
+export class DepositPublicationsResultComponent {
+
+}
diff --git a/deposit/publications/depositPublicationsResults.module.ts b/deposit/publications/depositPublicationsResults.module.ts
new file mode 100644
index 00000000..9a8e144a
--- /dev/null
+++ b/deposit/publications/depositPublicationsResults.module.ts
@@ -0,0 +1,26 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import { DepositPublicationsResultComponent } from './depositPublicationsResult.component';
+
+import {DepositModule} from '../deposit.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DepositModule
+
+  ],
+  declarations: [
+    DepositPublicationsResultComponent
+  ],
+  exports: [
+    DepositPublicationsResultComponent
+   ],
+  providers:    [FreeGuard,PreviousRouteRecorder, IsRouteEnabled]
+})
+export class DepositPublicationsResultsModule { }
diff --git a/error/error.module.ts b/error/error.module.ts
new file mode 100644
index 00000000..7cea4c20
--- /dev/null
+++ b/error/error.module.ts
@@ -0,0 +1,17 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {ErrorPageComponent } from './errorPage.component';
+import {MetaModule} from '../../meta.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, MetaModule
+  ],
+  providers:[],
+  declarations: [
+    ErrorPageComponent
+], exports:[ErrorPageComponent]
+})
+export class ErrorModule { }
diff --git a/error/errorPage.component.ts b/error/errorPage.component.ts
new file mode 100644
index 00000000..30029577
--- /dev/null
+++ b/error/errorPage.component.ts
@@ -0,0 +1,55 @@
+import { Component, Input } from '@angular/core';
+import { Location } from '@angular/common';
+import { Meta} from '../../angular2-meta';
+import {ActivatedRoute} from '@angular/router';
+
+@Component({
+    selector: 'error',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+        <div class="uk-container">
+            <h2>
+                Bad karma: we can't find that page!
+            </h2>
+            <br>
+
+            <p>
+                You asked for {{page}}, but despite our computers looking very hard, we could not find it. What happened ?
+            </p>
+
+            <ul>
+                <li>the link you clicked to arrive here has a typo in it</li>
+                <li>or somehow we removed that page, or gave it another name</li>
+                <li>or, quite unlikely for sure, maybe you typed it yourself and there was a little mistake ?</li>
+            </ul>
+
+        </div>
+      </div>
+     </div>
+  </div>
+    `
+})
+
+export class ErrorPageComponent {
+    public page: string;
+
+    constructor (private _location: Location, private _meta: Meta,private route: ActivatedRoute) {
+        this._meta.setTitle("OpenAIRE | Error page");
+        this.page = _location.path(true);
+        //this.page = _router.url;
+        //this.page = location.href;
+    }
+    ngOnInit() {
+         this.route.queryParams.subscribe(data => {
+
+
+            this.page = data['page'];
+            if(!this.page){
+              this.page = this._location.path(true);
+            }
+          });
+    }
+}
diff --git a/error/isRouteEnabled.guard.ts b/error/isRouteEnabled.guard.ts
new file mode 100644
index 00000000..f196f322
--- /dev/null
+++ b/error/isRouteEnabled.guard.ts
@@ -0,0 +1,23 @@
+import { Injectable } from '@angular/core';
+import { Router,CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from '@angular/router';
+import {Observable}       from 'rxjs/Observable';
+import 'rxjs/add/operator/filter';
+import { ConfigurationService } from '../utils/configuration/configuration.service';
+
+@Injectable()
+export class IsRouteEnabled implements CanActivate {
+
+  constructor(private router: Router, private config: ConfigurationService) {}
+
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
+    let customRedirect = route.data['redirect'];
+    console.log("In IsRouteEnabled");
+    console.log(state.url.split("?")[0].substring(1));
+    let isEnabled = this.config.isPageEnabled(state.url.split("?")[0].substring(1));
+    let redirect = !!customRedirect ? customRedirect : '/error';
+    isEnabled.filter(enabled => !enabled)
+      .subscribe(() => this.router.navigate([redirect], { queryParams: { "page": state.url } }));
+
+      return isEnabled;
+   }
+}
diff --git a/landingPages/dataProvider/dataProvider-routing.module.ts b/landingPages/dataProvider/dataProvider-routing.module.ts
new file mode 100644
index 00000000..8fb2f38f
--- /dev/null
+++ b/landingPages/dataProvider/dataProvider-routing.module.ts
@@ -0,0 +1,18 @@
+// import { NgModule } from '@angular/core';
+// import { RouterModule } from '@angular/router';
+//
+// import { DataProviderComponent } from './dataProvider.component';
+// import {FreeGuard} from'../../login/freeGuard.guard';
+// import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+// import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+//
+// @NgModule({
+//  imports: [
+//   RouterModule.forChild([
+//     { path: '', component: DataProviderComponent, canActivate: [FreeGuard, IsRouteEnabled], data: {
+//         redirect: '/error'
+//       },canDeactivate: [PreviousRouteRecorder] }
+//   ])
+// ]
+// })
+// export class DataProviderRoutingModule { }
diff --git a/landingPages/dataProvider/dataProvider.component.html b/landingPages/dataProvider/dataProvider.component.html
new file mode 100644
index 00000000..2a5d336a
--- /dev/null
+++ b/landingPages/dataProvider/dataProvider.component.html
@@ -0,0 +1,234 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div class="uk-container uk-margin-top datasource">
+    <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
+    <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+
+    <div *ngIf="dataProviderInfo != null" uk-grid class="uk-grid-large">
+
+        <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
+            <!--h3 *ngIf="dataProviderInfo.title != null">
+                <a *ngIf="dataProviderInfo.title['url'] != undefined && dataProviderInfo.title['url'] != null"
+                    href="{{dataProviderInfo.title['url']}}" target="_blank" class="custom-external">
+                    {{dataProviderInfo.title['name']}}
+                </a>
+                <p *ngIf="dataProviderInfo.title['url'] == undefined || dataProviderInfo.title['url'] == null">
+                    {{dataProviderInfo.title['name']}}
+                </p>
+            </h3-->
+            <showTitle   [title]="dataProviderInfo.title"></showTitle>
+            <div class="uk-text-large " *ngIf="dataProviderInfo.officialName && this.dataProviderInfo.title.name != dataProviderInfo.officialName ">{{dataProviderInfo.officialName}}</div>
+
+            <span *ngIf="dataProviderInfo.type" class="uk-label custom-label label-type label-dataprovider " title="Type">{{dataProviderInfo.type}}</span>
+            <span *ngIf="dataProviderInfo.compatibility" class="uk-label custom-label label-compatibility " title="Compatibility">{{dataProviderInfo.compatibility}}</span>
+
+            <ul class="uk-list">
+
+
+                <li *ngIf="dataProviderInfo.oaiPmhURL"><span class="uk-text-bold">OAI-PMH: </span>
+                        <span class="uk-button-text">
+                            <a target="_blank" href="{{dataProviderInfo.oaiPmhURL}}">
+                                {{dataProviderInfo.oaiPmhURL}}
+                            </a>
+                        </span>
+
+                </li>
+                <li *ngIf="dataProviderInfo.openDoarURL">
+                        <span class="uk-button-text">
+                            <a target="_blank" href="{{dataProviderInfo.openDoarURL}}">
+                                Detailed content provider information (OpenDOAR)
+                            </a>
+                        </span>
+
+                </li>
+                <li *ngIf="dataProviderInfo.r3DataURL">
+                        <span class="uk-button-text">
+                            <a target="_blank" href="{{dataProviderInfo.r3DataURL}}">
+                                Detailed content provider information (Re3data)
+                            </a>
+                        </span>
+
+                </li>
+
+                <li *ngIf="dataProviderInfo.countries != undefined && dataProviderInfo.countries.length > 0"><span class="uk-text-bold">Countries: </span>{{dataProviderInfo.countries.join(", ")}}</li>
+            </ul>
+
+            <!--tabs [id] = "datasourceId"
+                  [name] = "dataProviderInfo.title['name']"
+                  [resultsBy] = "dataProviderInfo.resultsBy"
+                  [tabs]="dataProviderInfo.tabs"
+                  [statistics]="dataProviderInfo.statistics"
+                  [organizations]="dataProviderInfo.organizations"
+                  [_dataproviderService]="_dataproviderService">
+            </tabs-->
+            <div *ngIf="showTabs">
+                <ul *ngIf="dataProviderInfo.tabs != undefined" class="uk-tab uk-visible@xl" uk-tab="connect: #tab-content">
+                    <li *ngFor="let tab of dataProviderInfo.tabs; let i=index" id="{{dataProviderInfo.tabs[i].content}}"
+                        [class]="activeTab==tab.name?'uk-active':''">
+                        <a
+                            (click)="search(tab.content, 1, 10); activeTab=tab.name">
+                                {{tab.name}}
+
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='publicationsTab'">
+                                    {{fetchPublications.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='datasetsTab'">
+                                    {{fetchDatasets.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='projectsTab'">
+                                    {{fetchProjects.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='datasourcesTab'">
+                                    {{fetchDataproviders.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='organizationsTab'">
+                                    {{dataProviderInfo.organizations.length}}
+                                </span>
+                        </a>
+                    </li>
+                </ul>
+
+                <button class="uk-button uk-button-default uk-hidden@xl" type="button">
+                  <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
+                </button>
+
+                <ul *ngIf="dataProviderInfo.tabs != undefined" id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@xl" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
+                    <li *ngFor="let tab of dataProviderInfo.tabs; let i=index" id="{{dataProviderInfo.tabs[i].content}}"
+                        [class]="activeTab==tab.name?'uk-active':''">
+                        <a
+                            (click)="search(tab.content, 1, 10); activeTab=tab.name">
+                                {{tab.name}}
+
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='publicationsTab'">
+                                    {{fetchPublications.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='datasetsTab'">
+                                    {{fetchDatasets.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='projectsTab'">
+                                    {{fetchProjects.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='datasourcesTab'">
+                                    {{fetchDataproviders.searchUtils.totalResults}}
+                                </span>
+                                <span class="uk-badge uk-badge-notification" *ngIf="tab.content=='organizationsTab'">
+                                    {{dataProviderInfo.organizations.length}}
+                                </span>
+                        </a>
+                    </li>
+                </ul>
+
+                <!--ul *ngIf="dataProviderInfo.tabs != undefined" id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+                <div *ngIf="dataProviderInfo.tabs != undefined" class="uk-margin custom-tab-content">
+
+                    <!--div class="uk-animation-fade" *ngFor="let tab of dataProviderInfo.tabs; let i=index"-->
+                    <div class="uk-animation-fade">
+                        <!--*ngIf="tab.content=='publicationsTab'"-->
+                        <publicationsTab *ngIf="activeTab=='Publications'"
+                                         [paramsForSearchLink]="paramsForSearchLink"
+                                         [fetchPublications] = "fetchPublications">
+                        </publicationsTab>
+                        <!--*ngIf="tab.content=='datasetsTab'"-->
+                        <datasetsTab *ngIf="activeTab=='Research Data'"
+                                     [paramsForSearchLink]="paramsForSearchLink"
+                                     [fetchDatasets]="fetchDatasets">
+                        </datasetsTab>
+                        <!--*ngIf="  tab.content=='projectsTab'"-->
+                        <projectsTab *ngIf="activeTab=='Projects'"
+                                     [paramsForSearchLink]="paramsForSearchLink"
+                                     [fetchProjects]="fetchProjects">
+                        </projectsTab>
+                        <!--*ngIf="  tab.content=='datasourcesTab'"-->
+                        <datasourcesTab *ngIf="activeTab=='Datasources'"
+                                        [paramsForSearchLink]="paramsForSearchLink"
+                                        [fetchDataproviders]="fetchDataproviders">
+                        </datasourcesTab>
+                        <!--*ngIf="  tab.content=='organizationsTab'"-->
+                        <organizationsTab *ngIf="activeTab=='Organizations'"
+                                          [organizations]="dataProviderInfo.organizations">
+                        </organizationsTab>
+                        <!--*ngIf="  tab.content=='relatedDatasourcesTab'"-->
+                        <relatedDatasourcesTab *ngIf="activeTab=='Related Content Providers'"
+                            [dataproviderId]="datasourceId"
+                            [results]="dataProviderInfo.relatedDatasources"
+                            [loading]="loadingRelatedDatasources"
+                            [fetchPublications]="fetchAggregatorsPublications"
+                            [fetchDatasets]="fetchAggregatorsDatasets">
+                            <!--[type]="relatedDataprovidersResultsType"-->
+                        </relatedDatasourcesTab>
+
+                        <!-- *ngIf="  tab.content=='statisticsTab' && statsClicked"-->
+                        <div *ngIf="activeTab=='Statistics' && statsClicked">
+                          <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0 && fetchDatasets.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
+                              No statistics available
+                          </div-->
+                          <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE && fetchDatasets.searchUtils.status == errorCodes.NONE"
+                                class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No statistics available</div>
+                          <div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR || fetchDatasets.searchUtils.status == errorCodes.ERROR"
+                                class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+                          <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE || fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE"
+                                class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+                          <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING || fetchDatasets.searchUtils.status == errorCodes.LOADING"
+                                class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+
+                          <errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'statistics'"></errorMessages>
+
+                          <div *ngIf="(fetchPublications.searchUtils.totalResults != 0 || fetchDatasets.searchUtils.totalResults != 0)">
+                            <p class="uk-text-bold">Latest Research Result Timeline</p>
+                            <i-frame  [url]=docsTimelineUrl width="800" height="350"></i-frame>
+                            <p class="uk-text-bold">Research Result Types</p>
+                            <i-frame [url]=docsTypesUrl width="800" height="350"></i-frame>
+                          </div>
+
+
+                            <div *ngIf="fetchPublications.searchUtils.totalResults > 0 || (fetchDatasets.searchUtils.totalResults > 0)">
+
+                                  <p class="uk-text-bold">Funders in Research Results of content provider</p>
+                                  <i-frame  [url]=docsFunderUrl width="800" height="350"></i-frame>
+
+                            </div>
+                            <div *ngIf="fetchPublications.searchUtils.totalResults > 0 ">
+                                <p class="uk-text-bold">Projects with most Publications</p>
+                                <i-frame [url]=pubsProjectsUrl width="800" height="350"></i-frame>
+                            </div>
+                            <div *ngIf="(fetchDatasets.searchUtils.totalResults > 0)">
+                                  <div>
+                                      <p class="uk-text-bold">Projects with most Research Data</p>
+                                      <i-frame  [url]=dataProjectsUrl width="800" height="350"></i-frame>
+                                  </div>
+                            </div>
+                          </div>
+                        </div>
+
+                        <!--*ngIf="  tab.content=='metricsTab'"-->
+                        <!--[name]="dataProviderInfo.title['name']"-->
+                        <metrics *ngIf="activeTab=='Metrics'" [pageViews]="pageViews"
+                            [id]="datasourceId" [entityType]="'datasources'" [entity]="'Content Provider'"
+                            (metricsResults)="metricsResults($event)">
+                        </metrics>
+                        <i-frame *ngIf="activeTab=='Metrics' && metricsClicked && totalViews > 0"
+                            [url]=viewsFrameUrl width="100%" height="250">
+                        </i-frame>
+                        <i-frame *ngIf="activeTab=='Metrics' && metricsClicked && totalDownloads > 0"
+                            [url]=downloadsFrameUrl width="100%" height="250">
+                        </i-frame>
+                    </div>
+                <!--/ul-->
+                </div>
+
+        </div>
+        <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
+          <div class="uk-card uk-card-default uk-padding-small">
+            <div>
+              Share - Bookmark<addThis ></addThis>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  </div>
+</div>
diff --git a/landingPages/dataProvider/dataProvider.component.ts b/landingPages/dataProvider/dataProvider.component.ts
new file mode 100644
index 00000000..155960ee
--- /dev/null
+++ b/landingPages/dataProvider/dataProvider.component.ts
@@ -0,0 +1,385 @@
+import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Observable} from 'rxjs/Observable';
+import {DataProviderService} from './dataProvider.service';
+import {DataProviderInfo} from '../../utils/entities/dataProviderInfo';
+import {ActivatedRoute, Router} from '@angular/router';
+import { Meta} from '../../../angular2-meta';
+import { FetchPublications } from '../../utils/fetchEntitiesClasses/fetchPublications.class';
+import { SearchPublicationsService } from '../../services/searchPublications.service';
+import { FetchDatasets } from '../../utils/fetchEntitiesClasses/fetchDatasets.class';
+import { SearchDatasetsService } from '../../services/searchDatasets.service';
+import { FetchProjects } from '../../utils/fetchEntitiesClasses/fetchProjects.class';
+import { SearchProjectsService } from '../../services/searchProjects.service';
+import { FetchDataproviders } from '../../utils/fetchEntitiesClasses/fetchDataproviders.class';
+import { SearchDataprovidersService } from '../../services/searchDataproviders.service';
+import { RelatedDatasourcesTabComponent } from './relatedDatasourcesTab.component';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {RouterHelper} from '../../utils/routerHelper.class';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+import 'rxjs/add/operator/switch';
+import 'rxjs/add/operator/switchMap';
+
+@Component({
+    selector: 'dataprovider',
+     templateUrl: 'dataProvider.component.html',
+ })
+
+export class DataProviderComponent {
+  public dataProviderInfo: DataProviderInfo;
+  public datasourceId: string;
+
+  // Message variables
+  public warningMessage = "";
+  public errorMessage = "";
+  public showLoading: boolean = true;
+
+  // Variable to specify requests with either collectedFrom or hostedBy
+  public paramsForSearchLink = {};
+
+  // Metrics tab variables
+  public metricsClicked: boolean;
+  public viewsFrameUrl: string;
+  public downloadsFrameUrl: string;
+  public totalViews: number;
+  public totalDownloads: number;
+  public pageViews: number;
+
+  // Statistics tab variables
+  public statsClicked: boolean = false;
+  public docsTimelineUrl: string;
+  public docsTypesUrl:string;
+  public docsFunderUrl:string;
+  public dataProjectsUrl:string ;
+  public pubsProjectsUrl:string;
+
+  // Variables for publications, research data, projects, content providers, related content providers tabs
+  public fetchPublications : FetchPublications;
+  public fetchDatasets: FetchDatasets;
+  public fetchProjects: FetchProjects;
+  public fetchDataproviders: FetchDataproviders;
+  public fetchAggregatorsPublications: FetchPublications;
+  public fetchAggregatorsDatasets: FetchDatasets;
+
+  public loadingRelatedDatasources: boolean = true;
+
+  // Active tab variable for responsiveness - show tabs only if main request is completed
+  public activeTab: string = "";
+  public showTabs:boolean = false;
+
+  public routerHelper:RouterHelper = new RouterHelper();
+  public errorCodes:ErrorCodes = new ErrorCodes();
+
+  // Request results of each tab only the one time (first time tab is clicked)
+  private reloadPublications: boolean = true;
+  private reloadDatasets: boolean = true;
+  private reloadProjects: boolean = true;
+  private reloadDataproviders: boolean = true;
+  private reloadRelatedDatasources: boolean = true;
+
+  private nativeElement : Node;
+
+  sub: any;
+  piwiksub: any;
+  subInfo: any;
+  relatedDatasourcesSub: any;
+
+  constructor (private element: ElementRef,
+               private _dataproviderService: DataProviderService,
+               private _piwikService:PiwikService,
+               private route: ActivatedRoute,
+               private _meta: Meta,
+               private _router: Router,
+               private _searchPublicationsService: SearchPublicationsService,
+               private _searchDatasetsService: SearchDatasetsService,
+               private _searchProjectsService: SearchProjectsService,
+               private _searchDataprovidersService: SearchDataprovidersService) {
+                 this.fetchPublications = new FetchPublications(this._searchPublicationsService);
+                 this.fetchDatasets = new FetchDatasets(this._searchDatasetsService);
+                 this.fetchProjects = new FetchProjects(this._searchProjectsService);
+                 this.fetchDataproviders = new FetchDataproviders(this._searchDataprovidersService);
+
+                 this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+ }
+
+ ngOnInit() {
+   this.sub =  this.route.queryParams.subscribe(data => {
+      this.updateTitle("Content provider");
+      this.updateDescription("Content provider, search, repositories, open access");
+      this.datasourceId = data['datasourceId'];
+      if(this.datasourceId){
+       this.getDataProviderInfo(this.datasourceId);
+      }else{
+       // console.info("Content Provider id not found");
+      }
+
+      if (typeof document !== 'undefined') {
+        this.element.nativeElement.scrollIntoView();
+      }
+   });
+ }
+
+   ngOnDestroy() {
+     this.sub.unsubscribe();
+     if(this.piwiksub){
+       this.piwiksub.unsubscribe();
+     }
+     if(this.subInfo) {
+      this.subInfo.unsubscribe();
+     }
+
+     if(this.relatedDatasourcesSub) {
+       this.relatedDatasourcesSub.unsubscribe();
+     }
+   }
+  private getDataProviderInfo(id:string) {
+    this.warningMessage = '';
+    this.errorMessage=""
+    this.showLoading = true;
+
+    this.showTabs = false ;
+    if(this.datasourceId==null || this.datasourceId==''){
+      this.showLoading = false;
+      this.warningMessage="No valid datasource id";
+    }else{
+      this.subInfo = this._dataproviderService.getDataproviderInfo(this.datasourceId).subscribe(
+        data => {
+            this.dataProviderInfo = data;
+            this.initTabs();
+            this.showTabs = true ;
+            this.updateTitle(this.dataProviderInfo.title.name);
+            this.updateDescription("Content provider, search, repositories, open access,"+this.dataProviderInfo.title.name);
+            if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+              this.piwiksub = this._piwikService.trackView(this.dataProviderInfo.title.name).subscribe();
+            }
+
+            this.showLoading = false;
+
+            if(this.dataProviderInfo.tabs != undefined && this.dataProviderInfo.tabs.length > 0) {
+              this.activeTab = this.dataProviderInfo.tabs[0].name;
+            }
+        },
+        err => {
+          console.log(err);
+          // console.info("error");
+          this.errorMessage = 'No dataProvider found';
+          this.showLoading = false;
+        }
+      );
+    }
+   }
+
+   private updateDescription(description:string){
+     this._meta.updateMeta("description", description);
+     this._meta.updateProperty("og:description", description);
+   }
+   private updateTitle(title:string){
+     var _prefix ="OpenAIRE | ";
+     var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+     this._meta.setTitle(_title );
+     this._meta.updateProperty("og:title",_title);
+   }
+   private updateUrl(url:string){
+     this._meta.updateProperty("og:url", url);
+   }
+
+   private initTabs(){
+
+           if(this.dataProviderInfo.tabs != undefined && this.dataProviderInfo.tabs.length > 0) {
+               this.reloadPublications = true;
+               this.reloadDatasets = true;
+               this.reloadProjects = true;
+               this.reloadDataproviders = true;
+               this.reloadRelatedDatasources = true;
+               this.statsClicked = false;
+
+               this.search(this.dataProviderInfo.tabs[0].content, 1, 10);
+               this.count(1, 0);
+
+               this.metricsClicked = false;
+
+               this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"dtsrcRepoViews","dtsrcName":"'+this.datasourceId+'","table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":"","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[]}]&info_types=["column"]&stacking=&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+               /*this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"dtsrcOpenAIRETimeline", "dtsrcName":"'+this.datasourceId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":"","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"OpenAIRE","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]},{"query":"dtsrcRepoTimeline", "dtsrcName":"'+this.datasourceId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":[""],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column","column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true';
+               */
+
+               this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"dtsrcRepoDownloads","dtsrcName":"'+this.datasourceId+'","table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":"","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[]}]&info_types=["column"]&stacking=&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+               /*
+               this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"dtsrcDownloadsTimeline","dtsrcName":"'+this.datasourceId+'","table":"","fields":[{"fld":"sum","agg":"sum","type":"chart","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":"","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[]}]&info_types=["spline"]&stacking=&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true';
+               */
+
+               this.docsTimelineUrl ='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcYear","dtsrcName":"'+this.datasourceId+'","table": "result", "fields": [{"fld": "number", "agg": "count", "type": "line", "yaxis":1, "c":true}], "xaxis":{"name": "year", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": -30, "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Research Results"], "in": [{"f":0, "text": "Yearly"}], "filters": [{"name":"year","max":"2016","min":"1997"},{"name": "result_datasources-datasource-name", "values":[""], "to": "-1"}],"having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": "Year"}&w=600&h=250';
+               this.docsTypesUrl = 'https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcPubs","dtsrcName":"'+this.datasourceId+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "pie", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Research Results"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+               this.docsFunderUrl =' https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcPubsFund","dtsrcName":"'+this.datasourceId+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "pie", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Research Results"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+               this.dataProjectsUrl ='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcProjData","dtsrcName":"'+this.datasourceId+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "bar", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Research Data"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+               this.pubsProjectsUrl ='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcProjPubs","dtsrcName":"'+this.datasourceId+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "bar", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Publications"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+
+               //if({"name": "Publications", "content": "publicationsTab"} in this.dataProviderInfo.tabs) {
+               //if(this.dataProviderInfo.tabs.some(function (tab) {
+               //    return tab.name === 'Publications';
+               //})) {
+               //    this.relatedDataprovidersResultsType = 'publications';
+                   this.fetchAggregatorsPublications = new FetchPublications(this._searchPublicationsService);
+               //} else {
+               //   this.relatedDataprovidersResultsType = 'datasets';
+                   this.fetchAggregatorsDatasets = new FetchDatasets(this._searchDatasetsService);
+               //}
+           }
+           if(this.dataProviderInfo.resultsBy == "collectedFrom") {
+               //this.paramsForSearchLink = "?collectedFrom="+this.datasourceId+"&co=and";
+               this.paramsForSearchLink = this.routerHelper.createQueryParams(['collectedFrom', 'co'], [this.datasourceId, 'and']);
+           } else if (this.dataProviderInfo.resultsBy == "hostedBy") {
+               //this.paramsForSearchLink = "?hostedBy="+this.datasourceId+"&ho=and";
+               this.paramsForSearchLink = this.routerHelper.createQueryParams(['hostedBy', 'ho'], [this.datasourceId, 'and']);
+           }
+
+   }
+
+   private count(page: number, size: number) {
+       for(let i=1; i<this.dataProviderInfo.tabs.length; i++) {
+           let content: string = this.dataProviderInfo.tabs[i].content;
+
+           if(content=='publicationsTab') {
+               this.countPublications(page, size);
+           } else if(content=='datasetsTab') {
+               this.countDatasets(page, size);
+           } else if(content=='projectsTab') {
+               this.countProjects(page, size);
+           } else if(content=='datasourcesTab') {
+               this.countDatasources(page, size);
+           }// else if(content=='relatedDatasourcesTab') {
+           //    this.countRelatedDatasources(page, size);
+           //}
+       }
+   }
+
+   public search(content: string, page: number, size: number) {
+       if(content=='publicationsTab') {
+           this.searchPublications(page, size);
+       } else if(content=='datasetsTab') {
+           this.searchDatasets(page, size);
+       } else if(content=='projectsTab') {
+           this.searchProjects(page, size);
+       } else if(content=='datasourcesTab') {
+           this.searchDatasources(page, size);
+       } else if(content=='relatedDatasourcesTab') {
+           this.searchRelatedDatasources(1, 0);
+       } else if(content=='metricsTab') {
+           this.metricsClicked = true;
+       } else if(content=='statisticsTab') {
+           this.statsClicked = true;
+       }
+   }
+
+   private searchPublications(page: number, size: number) {
+     if(  this.reloadPublications &&
+          ( this.fetchPublications.searchUtils.status == this.errorCodes.LOADING ||
+            this.fetchPublications.searchUtils.status == this.errorCodes.DONE ) ) {
+       this.fetchPublications.getResultsForDataproviders(this.datasourceId, this.dataProviderInfo.resultsBy, page, size);
+     }
+     this.reloadPublications = false;
+    }
+
+    private countPublications(page: number, size: number) {
+      this.fetchPublications.getResultsForDataproviders(this.datasourceId, this.dataProviderInfo.resultsBy, page, size);
+    }
+
+    private searchDatasets(page: number, size: number) {
+      if( this.reloadDatasets &&
+          ( this.fetchDatasets.searchUtils.status == this.errorCodes.LOADING ||
+            this.fetchDatasets.searchUtils.status == this.errorCodes.DONE ) ) {
+        this.fetchDatasets.getResultsForDataproviders(this.datasourceId, this.dataProviderInfo.resultsBy, page, size);
+      }
+      this.reloadDatasets = false;
+    }
+
+    private countDatasets(page: number, size: number) {
+      this.fetchDatasets.getResultsForDataproviders(this.datasourceId, this.dataProviderInfo.resultsBy, page, size);
+    }
+
+    private searchProjects(page: number, size: number) {
+      if( this.reloadProjects &&
+          ( this.fetchProjects.searchUtils.status == this.errorCodes.LOADING ||
+            this.fetchProjects.searchUtils.status == this.errorCodes.DONE ) ) {
+        this.fetchProjects.getResultsForDataproviders(this.datasourceId, page, size);
+      }
+      this.reloadProjects = false;
+    }
+
+    private countProjects(page: number, size: number) {
+      this.fetchProjects.getResultsForDataproviders(this.datasourceId, page, size);
+    }
+
+    private searchDatasources(page: number, size: number) {
+      if( this.reloadDataproviders &&
+          ( this.fetchDataproviders.searchUtils.status == this.errorCodes.LOADING ||
+            this.fetchDataproviders.searchUtils.status == this.errorCodes.DONE ) ) {
+        this.fetchDataproviders.getResultsForDataproviders(this.datasourceId, page, size);
+      }
+      this.reloadDataproviders = false;
+    }
+
+    private countDatasources(page: number, size: number) {
+      this.fetchDataproviders.getResultsForDataproviders(this.datasourceId, page, size);
+    }
+
+    private searchRelatedDatasources(page: number, size: number) {
+      // Currently no counting is done for this tab. Following condition is always false
+
+      if( this.reloadRelatedDatasources &&
+          ( this.fetchAggregatorsPublications.searchUtils.status == this.errorCodes.LOADING ||
+            this.fetchAggregatorsPublications.searchUtils.status == this.errorCodes.DONE )
+          &&
+          ( this.fetchAggregatorsDatasets.searchUtils.status == this.errorCodes.LOADING ||
+            this.fetchAggregatorsDatasets.searchUtils.status == this.errorCodes.DONE ) ) {
+        this.relatedDatasourcesSub = Observable.merge(this.fetchAggregatorsPublications.requestComplete, this.fetchAggregatorsDatasets.requestComplete)
+                               .subscribe(
+                                 data => {},
+                                 err => {},
+                                 () => { this.preprocessRelatedDatasources(); }
+                               )
+
+         this.fetchAggregatorsPublications.getAggregatorResults(this.datasourceId, page, size);
+         this.fetchAggregatorsDatasets.getAggregatorResults(this.datasourceId, page, size);
+       } else {
+         this.loadingRelatedDatasources = false;
+       }
+
+
+      this.reloadRelatedDatasources = false;
+    }
+
+    private countRelatedDatasources(page: number, size: number) {
+      this.fetchAggregatorsPublications.getAggregatorResults(this.datasourceId, page, size);
+      this.fetchAggregatorsDatasets.getAggregatorResults(this.datasourceId, page, size);
+    }
+
+
+    private preprocessRelatedDatasources() {
+      if( this.fetchAggregatorsPublications.searchUtils.status == this.errorCodes.DONE ||
+          this.fetchAggregatorsDatasets.searchUtils.status == this.errorCodes.DONE ) {
+        this.dataProviderInfo.relatedDatasources = new Map<string, {"name": string, "countPublications": string, "countDatasets": string}>();
+      }
+      for(let result of this.fetchAggregatorsPublications.results) {
+        if(!this.dataProviderInfo.relatedDatasources.has(result.id)) {
+          this.dataProviderInfo.relatedDatasources.set(result.id, {"name": result.name, "countPublications": result.count, "countDatasets": "0"});
+        } else {
+          this.dataProviderInfo.relatedDatasources.get(result.id).countPublications = parseInt(this.dataProviderInfo.relatedDatasources.get(result.id).countPublications + result.count)+"";
+        }
+      }
+
+      for(let result of this.fetchAggregatorsDatasets.results) {
+        if(!this.dataProviderInfo.relatedDatasources.has(result.id)) {
+          this.dataProviderInfo.relatedDatasources.set(result.id, {"name": result.name, "countPublications": "0", "countDatasets": result.count});
+        } else {
+          this.dataProviderInfo.relatedDatasources.get(result.id).countDatasets = parseInt(this.dataProviderInfo.relatedDatasources.get(result.id).countDatasets + result.count)+"";
+        }
+      }
+      this.loadingRelatedDatasources = false;
+    }
+
+    public metricsResults($event) {
+      this.totalViews = $event.totalViews;
+      this.totalDownloads = $event.totalDownloads;
+      this.pageViews = $event.pageViews;
+    }
+}
diff --git a/landingPages/dataProvider/dataProvider.module.ts b/landingPages/dataProvider/dataProvider.module.ts
new file mode 100644
index 00000000..61f42205
--- /dev/null
+++ b/landingPages/dataProvider/dataProvider.module.ts
@@ -0,0 +1,51 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import {IFrameModule} from '../../utils/iframe.module';
+import {ErrorMessagesModule} from '../../utils/errorMessages.module';
+// import { ResultLandingModule } from '../resultLanding.module';
+import {TabResultModule } from '../../searchPages/searchUtils/tabResult.module';
+import {MetricsModule} from '../landing-utils/metrics.module';
+import {LandingModule} from '../landing-utils/landing.module';
+import {PagingModule} from '../../utils/paging.module';
+
+import {PublicationsTabComponent} from './publicationsTab.component';
+import {DatasetsTabComponent} from './datasetsTab.component';
+import {StatisticsTabComponent} from './statisticsTab.component';
+import {ProjectsTabComponent} from './projectsTab.component';
+import {DatasourcesTabComponent} from './datasourcesTab.component';
+import {OrganizationsTabComponent} from './organizationsTab.component';
+import {RelatedDatasourcesTabComponent} from './relatedDatasourcesTab.component';
+// import {TabsComponent} from './tabs.component';
+
+import {DataProviderComponent} from './dataProvider.component';
+import {DataProviderService} from './dataProvider.service';
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+import {ProjectsServiceModule} from '../../services/projectsService.module';
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+
+// import { DataProviderRoutingModule } from './dataProvider-routing.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports:
+  [CommonModule, FormsModule, RouterModule,
+    TabResultModule, IFrameModule, ErrorMessagesModule, MetricsModule, LandingModule,
+    DataProvidersServiceModule, DatasetsServiceModule, ProjectsServiceModule, PublicationsServiceModule,
+    PagingModule],
+  declarations:
+  [PublicationsTabComponent, DatasetsTabComponent, StatisticsTabComponent, ProjectsTabComponent, DatasourcesTabComponent, OrganizationsTabComponent,
+    RelatedDatasourcesTabComponent, DataProviderComponent
+  ],
+  providers:[
+    DataProviderService, FreeGuard, IsRouteEnabled],
+  exports: [
+    DataProviderComponent
+  ]
+
+})
+export class DataProviderModule { }
diff --git a/landingPages/dataProvider/dataProvider.service.ts b/landingPages/dataProvider/dataProvider.service.ts
new file mode 100644
index 00000000..4b549e8d
--- /dev/null
+++ b/landingPages/dataProvider/dataProvider.service.ts
@@ -0,0 +1,162 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {DataProviderInfo} from '../../utils/entities/dataProviderInfo';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+
+@Injectable()
+export class DataProviderService {
+
+    constructor(private http: Http ) {}
+
+    dataProviderInfo: DataProviderInfo;
+
+    getDataproviderInfo (id: string):any {
+        console.info("getDataProviderInfo in service");
+        let url = OpenaireProperties.getSearchAPIURLLast() + 'datasources/' +id +"?format=json";
+        let key = url;
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => res['result']['metadata']['oaf:entity'])
+                    .map(res => [res['oaf:datasource'],
+                                 res['oaf:datasource']['datasourcetype'],
+                                 res['oaf:datasource']['openairecompatibility'],
+                                 res['oaf:datasource']['accessinfopackage'],
+                                 res['oaf:datasource']['rels']['rel']
+                     ])
+                     .map(res => this.parseDataProviderInfo(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.log(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parseDataProviderInfo (data: any):any {
+        this.dataProviderInfo = new DataProviderInfo();
+
+        if(data[0] != null) {
+            this.dataProviderInfo.title = {"name": (data[0].englishname)?data[0].englishname: data[0].officialname, "url": data[0].websiteurl};
+            this.dataProviderInfo.officialName =  data[0].officialname;
+            var originalId =(data[0].originalId)?data[0].originalId:"";
+            if(originalId && originalId != ""){
+              if(originalId.indexOf("opendoar____::") != -1){
+                this.dataProviderInfo.openDoarURL = "http://www.opendoar.org/find.php?format=full&rID="+originalId.split("opendoar____::")[1];
+
+              }else if (originalId.indexOf("re3data_____::") != -1){
+                this.dataProviderInfo.r3DataURL = "http://service.re3data.org/repository/"+originalId.split("re3data_____::")[1];
+              }
+            }
+
+        }
+
+        if(data[1] != null) {
+            this.dataProviderInfo.type = data[1].classname;
+
+            if(data[1].classid == "entityregistry" || data[1].classid == "entityregistry::projects" || data[1].classid == "entityregistry::repositories") {
+                this.dataProviderInfo.registry = true;
+            } else {
+                this.dataProviderInfo.registry = false;
+            }
+
+            if(this.dataProviderInfo.tabs == undefined) {
+                this.dataProviderInfo.tabs = new Array<{"name": string, "content": string}>();
+            }
+
+            if(this.dataProviderInfo.tabsInTypes.publicationsTab.has(data[1].classid)) {
+                this.dataProviderInfo.tabs.push({"name": "Publications", "content": "publicationsTab"});
+            }
+            if(this.dataProviderInfo.tabsInTypes.datasetsTab.has(data[1].classid)) {
+                this.dataProviderInfo.tabs.push({"name": "Research Data", "content": "datasetsTab"});
+            }
+
+            if(this.dataProviderInfo.tabsInTypes.projectsTab.has(data[1].classid)) {
+                this.dataProviderInfo.tabs.push({"name": "Projects", "content": "projectsTab"});
+            }
+            if(this.dataProviderInfo.tabsInTypes.datasourcesTab.has(data[1].classid)) {
+                this.dataProviderInfo.tabs.push({"name": "Content Providers", "content": "datasourcesTab"});
+            }
+            this.dataProviderInfo.tabs.push({"name": "Organizations", "content": "organizationsTab"});
+
+            if(this.dataProviderInfo.tabsInTypes.relatedDatasourcesTab.has(data[1].classid)) {
+                this.dataProviderInfo.tabs.push({"name": "Related Content Providers", "content": "relatedDatasourcesTab"});
+            }
+
+            if(this.dataProviderInfo.tabsInTypes.statisticsTab.has(data[1].classid)) {
+                this.dataProviderInfo.tabs.push({"name": "Statistics", "content": "statisticsTab"});
+            }
+
+            this.dataProviderInfo.tabs.push({"name": "Metrics", "content": "metricsTab"});
+
+            if(this.dataProviderInfo.resultTypes.collectedFrom.has(data[1].classid)) {
+                this.dataProviderInfo.resultsBy = "collectedFrom";
+            } else if(this.dataProviderInfo.resultTypes.hostedBy.has(data[1].classid)) {
+                this.dataProviderInfo.resultsBy = "hostedBy";
+            }
+        }
+
+        if(!this.dataProviderInfo.registry) {
+            if(data[2] != null) {
+                this.dataProviderInfo.compatibility = data[2].classname;
+            }
+
+            if(data[3] != null) {
+                let oaiPmhURL: string;
+                if(Array.isArray(data[3])) {
+                    oaiPmhURL = data[3][0];
+                }
+                else {
+                    oaiPmhURL = data[3];
+                }
+
+                if(oaiPmhURL != '' && oaiPmhURL != 'unknown') {
+                    this.dataProviderInfo.oaiPmhURL = oaiPmhURL;
+                }
+            }
+        }
+
+        if(data[4] != null) {
+            let mydata;
+            let counter = 0;
+            let countriesSet: Set<string>;
+            let length = data[4].length!=undefined ? data[4].length : 1;
+
+            for(let i=0; i<length; i++) {
+                mydata = data[4].length!=undefined ? data[4][i] : data[4];
+                if(mydata.hasOwnProperty("to")) {
+                    if(mydata['to'].class == "provides" && mydata['to'].type == "organization") {
+                        //if(this.dataProviderInfo.organizations == undefined) {
+                        if(this.dataProviderInfo.organizations.length == 0) {
+                            //this.dataProviderInfo.organizations = new Array<{"name": string, "url": string}>();
+                            this.dataProviderInfo.countries = new Array<string>();
+                            countriesSet = new Set<string>();
+                        }
+
+                        this.dataProviderInfo.organizations[counter] = {"name": "", "id": ""};
+                        this.dataProviderInfo.organizations[counter]['name'] = mydata.legalname;
+                        this.dataProviderInfo.organizations[counter]['id'] = /*OpenaireProperties.getsearchLinkToOrganization()+*/mydata['to'].content;
+
+                        if(mydata.country != '' && mydata['country'].classname != '') {
+                            if(!countriesSet.has(mydata['country'].classname)) {
+                                this.dataProviderInfo.countries.push(mydata['country'].classname);
+                                countriesSet.add(mydata['country'].classname);
+                            }
+                        }
+
+                        counter++;
+                    }
+                }
+            }
+        }
+
+        return this.dataProviderInfo;
+    }
+}
diff --git a/landingPages/dataProvider/datasetsTab.component.ts b/landingPages/dataProvider/datasetsTab.component.ts
new file mode 100644
index 00000000..d75edae7
--- /dev/null
+++ b/landingPages/dataProvider/datasetsTab.component.ts
@@ -0,0 +1,48 @@
+import {Component, Input} from '@angular/core';
+import { FetchDatasets } from '../../utils/fetchEntitiesClasses/fetchDatasets.class';
+
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'datasetsTab',
+    template: `
+        <!--div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No research data available</div>
+        <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+        <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service temprorarily unavailable. Please try again later.</div>
+        <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NOT_FOUND" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">No research data found</div-->
+        <errorMessages [status]="[fetchDatasets.searchUtils.status]" [type]="'research data'"></errorMessages>
+
+        <!--div *ngIf="fetchDatasets.searchUtils.totalResults == 0" class = "uk-alert">
+            No research data available
+        </div-->
+
+        <div *ngIf="fetchDatasets.searchUtils.totalResults > 0">
+            <div class = "uk-text-right" *ngIf = "fetchDatasets.searchUtils.totalResults > 10" >
+                <a  [queryParams]="paramsForSearchLink"
+                    routerLinkActive="router-link-active" [routerLink]="linkToSearchDatasets" class="uk-button uk-button-text">
+                    View all {{fetchDatasets.searchUtils.totalResults}} results
+                </a>
+            </div>
+            <tab-result  [(results)]="fetchDatasets.results"
+                            [(status)]= "fetchDatasets.searchUtils.status"
+                            type="dataset" urlParam="datasetId">
+            </tab-result>
+        </div>
+    `
+})
+
+export class DatasetsTabComponent {
+    @Input() paramsForSearchLink = {};
+    @Input() fetchDatasets : FetchDatasets;
+    public linkToSearchDatasets = "";
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    constructor () {}
+
+    ngOnInit() {
+        this.linkToSearchDatasets = OpenaireProperties.getLinkToAdvancedSearchDatasets();
+    }
+
+    ngOnDestroy() {}
+}
diff --git a/landingPages/dataProvider/datasourcesTab.component.ts b/landingPages/dataProvider/datasourcesTab.component.ts
new file mode 100644
index 00000000..4db8adf8
--- /dev/null
+++ b/landingPages/dataProvider/datasourcesTab.component.ts
@@ -0,0 +1,50 @@
+import {Component, Input} from '@angular/core';
+import { FetchDataproviders } from '../../utils/fetchEntitiesClasses/fetchDataproviders.class';
+
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'datasourcesTab',
+    template: `
+        <!--div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No content providers available</div>
+        <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+        <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service temprorarily unavailable. Please try again later.</div>
+        <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NOT_FOUND" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">No content providers found</div-->
+        <errorMessages [status]="[fetchDataproviders.searchUtils.status]" [type]="'content providers'"></errorMessages>
+
+        <!--div *ngIf="fetchDataproviders.searchUtils.totalResults == 0" class = "uk-alert">
+            No content providers available
+        </div-->
+
+        <div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
+            <div class = "uk-text-right" *ngIf = "fetchDataproviders.searchUtils.totalResults > 10">
+                <a  [queryParams]="paramsForSearchLink"
+                    routerLinkActive="router-link-active" [routerLink]="linkToSearchDataproviders" class="uk-button uk-button-text">
+                    View all {{fetchDataproviders.searchUtils.totalResults}} results
+                </a>
+            </div>
+            <tab-result  [(results)]="fetchDataproviders.results"
+                            [(status)]= "fetchDataproviders.status"
+                            type="dataprovider" urlParam="datasourceId"
+                            lazy=false>
+            </tab-result>
+        </div>
+    `
+})
+
+export class DatasourcesTabComponent {
+
+    @Input() paramsForSearchLink = {};
+    @Input() fetchDataproviders : FetchDataproviders;
+    public linkToSearchDataproviders = "";
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    constructor () {}
+
+    ngOnInit() {
+        this.linkToSearchDataproviders = OpenaireProperties.getLinkToAdvancedSearchDataProviders();
+    }
+
+    ngOnDestroy() {}
+}
diff --git a/landingPages/dataProvider/organizationsTab.component.ts b/landingPages/dataProvider/organizationsTab.component.ts
new file mode 100644
index 00000000..0acc97d2
--- /dev/null
+++ b/landingPages/dataProvider/organizationsTab.component.ts
@@ -0,0 +1,54 @@
+import {Component, Input} from '@angular/core';
+
+@Component({
+    selector: 'organizationsTab',
+    template: `
+        <div *ngIf=" !organizations || organizations.length == 0" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">
+            No organizations available
+        </div>
+
+        <div *ngIf="  organizations && organizations.length > 0">
+            <div *ngIf="organizations.length > pageSize" class="uk-margin-bottom">
+              {{organizations.length}} organizations, page {{organizationsPage}} of {{totalPages(organizations.length)}}
+              <paging-no-load class="uk-float-right" [currentPage]="organizationsPage" [totalResults]="organizations.length" [size]="pageSize" (pageChange)="updateOrganizationsPage($event)"></paging-no-load>
+            </div>
+
+            <div *ngFor="let item of organizations.slice((organizationsPage-1)*pageSize, organizationsPage*pageSize)" class="uk-h4">
+                <p *ngIf=" item != undefined && item['id'] != undefined">
+                    <!--a href="{{item['url']}}"-->
+                    <a [queryParams]="{organizationId: item.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
+                        {{item['name']}}
+                    </a>
+                </p>
+                <p *ngIf="item['id'] == undefined">
+                    {{item['name']}}
+                </p>
+            </div>
+        </div>
+    `
+})
+
+export class OrganizationsTabComponent {
+
+    @Input() organizations: {"name": string, "id": string}[];
+    public organizationsPage: number = 1;
+    public pageSize: number = 10;
+
+    constructor () {}
+
+    ngOnInit() {}
+
+    ngOnDestroy() {}
+
+    totalPages(totalResults: number): number {
+      let totalPages:any = totalResults/this.pageSize;
+      if(!(Number.isInteger(totalPages))) {
+          totalPages = (parseInt(totalPages, this.pageSize) + 1);
+      }
+      return totalPages;
+    }
+
+    updateOrganizationsPage($event) {
+      this.organizationsPage = $event.value;
+    }
+}
diff --git a/landingPages/dataProvider/projectsTab.component.ts b/landingPages/dataProvider/projectsTab.component.ts
new file mode 100644
index 00000000..4102e285
--- /dev/null
+++ b/landingPages/dataProvider/projectsTab.component.ts
@@ -0,0 +1,49 @@
+import {Component, Input} from '@angular/core';
+
+import { FetchProjects } from '../../utils/fetchEntitiesClasses/fetchProjects.class';
+
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'projectsTab',
+    template: `
+        <!--div *ngIf="fetchProjects.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No projects available</div>
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+        <errorMessages [status]="[fetchProjects.searchUtils.status]" [type]="'projects'"></errorMessages>
+
+        <!--div *ngIf="fetchProjects.searchUtils.totalResults == 0" class = "uk-alert">
+            No projects available
+        </div-->
+
+        <div *ngIf="fetchProjects.searchUtils.totalResults > 0">
+            <div class = "uk-text-right" *ngIf = "fetchProjects.searchUtils.totalResults > 10">
+                <a  [queryParams]="paramsForSearchLink"
+                    routerLinkActive="router-link-active" [routerLink]="linkToSearchProjects" class="uk-button uk-button-text">
+                    View all {{fetchProjects.searchUtils.totalResults}} results
+                </a>
+            </div>
+            <tab-result  [(results)]="fetchProjects.results"
+                            [(status)]= "fetchProjects.status"
+                            type="project" urlParam="projectId">
+            </tab-result>
+        </div>
+    `
+})
+
+export class ProjectsTabComponent {
+
+    @Input() paramsForSearchLink = {};
+    @Input() fetchProjects : FetchProjects;
+    public linkToSearchProjects = "";
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    constructor () {}
+
+    ngOnInit() {
+        this.linkToSearchProjects = OpenaireProperties.getLinkToAdvancedSearchProjects();
+    }
+
+    ngOnDestroy() {}
+}
diff --git a/landingPages/dataProvider/publicationsTab.component.ts b/landingPages/dataProvider/publicationsTab.component.ts
new file mode 100644
index 00000000..156e48e6
--- /dev/null
+++ b/landingPages/dataProvider/publicationsTab.component.ts
@@ -0,0 +1,50 @@
+import {Component, Input} from '@angular/core';
+import { FetchPublications } from '../../utils/fetchEntitiesClasses/fetchPublications.class';
+
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'publicationsTab',
+    template: `
+        <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No publications available</div>
+        <div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+        <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+        <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+        <!--errorMessages [status]="[fetchPublications.searchUtils.status]" [type]="'publications'"></errorMessages>
+{{fetchPublications.searchUtils.status}}-->
+        <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0" class = "uk-alert">
+            No publications available
+        </div-->
+
+        <div *ngIf="fetchPublications.searchUtils.totalResults > 0">
+            <div class = "uk-text-right" *ngIf = "fetchPublications.searchUtils.totalResults > 10">
+                <!--a [href] = "linkToSearchPublications">
+                    View all {{fetchPublications.searchUtils.totalResults}} results
+                </a-->
+                <a  [queryParams]="paramsForSearchLink"
+                    routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications" class="uk-button uk-button-text">
+                    View all {{fetchPublications.searchUtils.totalResults}} results
+                </a>
+            </div>
+            <tab-result  [(results)]="fetchPublications.results"
+                            [(status)]= "fetchPublications.status"
+                            type="publication" urlParam="articleId">
+            </tab-result>
+        </div>
+    `
+})
+
+export class PublicationsTabComponent {
+    @Input() paramsForSearchLink = {};//: string = "";
+    @Input() fetchPublications : FetchPublications;
+    public linkToSearchPublications = "";
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    constructor () {}
+
+    ngOnInit() {
+        this.linkToSearchPublications = OpenaireProperties.getLinkToAdvancedSearchPublications();//+this.paramsForSearchLink;
+    }
+
+    ngOnDestroy() {}
+}
diff --git a/landingPages/dataProvider/relatedDatasourcesTab.component.ts b/landingPages/dataProvider/relatedDatasourcesTab.component.ts
new file mode 100644
index 00000000..da85f597
--- /dev/null
+++ b/landingPages/dataProvider/relatedDatasourcesTab.component.ts
@@ -0,0 +1,122 @@
+import {Component, Input} from '@angular/core';
+
+import { FetchPublications } from '../../utils/fetchEntitiesClasses/fetchPublications.class';
+import { FetchDatasets } from '../../utils/fetchEntitiesClasses/fetchDatasets.class';
+
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {RouterHelper} from '../../utils/routerHelper.class';
+import { Observable } from 'rxjs/Observable';
+
+@Component({
+    selector: 'relatedDatasourcesTab',
+    template: `
+        <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE && fetchDatasets.searchUtils.status == errorCodes.NONE"
+              class="uk-alert uk-alert-primary uk-animation-fade" role="alert">
+              No related content providers available
+        </div>
+        <div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR && fetchDatasets.searchUtils.status == errorCodes.ERROR"
+              class="uk-alert uk-alert-warning uk-animation-fade" role="alert">
+          An Error Occured
+        </div-->
+        <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE && fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE"
+              class="uk-alert uk-alert-danger uk-animation-fade" role="alert">
+          Service not available
+        </div-->
+        <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING || fetchDatasets.searchUtils.status == errorCodes.LOADING || loading"
+              class="uk-animation-fade uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
+        </div-->
+
+        <errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'related content providers'"></errorMessages>
+
+        <div *ngIf="(fetchPublications.searchUtils.status == errorCodes.DONE || fetchDatasets.searchUtils.status == errorCodes.DONE) && !loading">
+            <div *ngIf="results && results.size > pageSize" class="uk-margin">
+              <span class="uk-text-bold">{{results.size}} related content providers, page {{page}} of {{totalPages(results.size)}}</span>
+              <paging-no-load class="uk-float-right" [currentPage]="page" [totalResults]="results.size" [size]="pageSize" (pageChange)="updatePage($event)"></paging-no-load>
+            </div>
+
+            <table class="uk-table uk-table-striped">
+                <thead>
+                    <tr>
+                        <th class="uk-text-center">Content Provider Name</th>
+                        <th *ngIf="fetchPublications.results.length > 0 || fetchPublications.searchUtils.status == errorCodes.ERROR"
+                            class="uk-text-center">
+                          Number of Publications
+                        </th>
+                        <th *ngIf="fetchDatasets.results.length > 0 || fetchDatasets.searchUtils.status == errorCodes.ERROR"
+                            class="uk-text-center">
+                          Number of Research Data
+                        </th>
+                    </tr>
+                </thead>
+                <tbody>
+                  <ng-container *ngIf="results">
+                      <ng-container *ngFor="let id of results.keys() let i=index">
+                        <tr *ngIf="i>=(page-1)*pageSize && i<page*pageSize">
+                          <td class="uk-text-center">
+                              <a [queryParams]="{datasourceId: id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
+                                  {{results.get(id).name}}
+                              </a>
+                          </td>
+                          <td *ngIf="fetchPublications.results.length > 0" class="uk-text-center">
+                              <a  [queryParams]="routerHelper.createQueryParams(['hostedBy', 'ho', 'collectedFrom', 'co'], [id, 'and', dataproviderId, 'and'])"
+                                  routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications">
+                                      {{results.get(id).countPublications}}
+                              </a>
+                          </td>
+                          <td *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR" class="uk-text-center">-</td>
+
+                          <td *ngIf="fetchDatasets.results.length > 0" class="uk-text-center">
+                              <a  [queryParams]="routerHelper.createQueryParams(['hostedBy', 'ho', 'collectedFrom', 'co'], [id, 'and', dataproviderId, 'and'])"
+                                  routerLinkActive="router-link-active" [routerLink]="linkToSearchResearchData">
+                                      {{results.get(id).countDatasets}}
+                              </a>
+                          </td>
+                          <td *ngIf="fetchDatasets.searchUtils.status == errorCodes.ERROR" class="uk-text-center">-</td>
+                        </tr>
+                      </ng-container>
+                    </ng-container>
+                </tbody>
+            </table>
+        </div>
+    `
+})
+
+export class RelatedDatasourcesTabComponent {
+    @Input() dataproviderId: string;
+    @Input() fetchPublications : FetchPublications;
+    @Input() fetchDatasets : FetchDatasets;
+    // true: preprocessing is not over
+    @Input() loading: boolean = true;
+    // Εvery content provider's id is a single key of a map
+    @Input() results: Map<string, {"name": string, "countPublications": string, "countDatasets": string}>;
+
+    public linkToSearchPublications: string = "";
+    public linkToSearchResearchData: string = "";
+
+    public routerHelper:RouterHelper = new RouterHelper();
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    public page: number = 1;
+    public pageSize: number = 10;
+
+    constructor () {}
+
+    ngOnInit() {
+      this.linkToSearchPublications = OpenaireProperties.getLinkToAdvancedSearchPublications();//+"?&hostedBy=";//+ +"&ho=and&collectedFrom="+ +"&co=and";
+      this.linkToSearchResearchData = OpenaireProperties.getLinkToAdvancedSearchDatasets();
+    }
+
+    ngOnDestroy() {}
+
+    totalPages(totalResults: number): number {
+      let totalPages:any = totalResults/this.pageSize;
+      if(!(Number.isInteger(totalPages))) {
+          totalPages = (parseInt(totalPages, this.pageSize) + 1);
+      }
+      return totalPages;
+    }
+
+    updatePage($event) {
+      this.page = $event.value;
+    }
+}
diff --git a/landingPages/dataProvider/statisticsTab.component.ts b/landingPages/dataProvider/statisticsTab.component.ts
new file mode 100644
index 00000000..4aae1f91
--- /dev/null
+++ b/landingPages/dataProvider/statisticsTab.component.ts
@@ -0,0 +1,78 @@
+import {Component, Input} from '@angular/core';
+import { SearchDatasetsComponent } from '../../searchPages/simple/searchDatasets.component';
+import { SearchPublicationsComponent } from '../../searchPages/simple/searchPublications.component';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'statisticsTab',
+    template: `
+    <div *ngIf="show">
+      <!--div *ngIf="searchPublicationsComponent.searchUtils.status == errorCodes.NONE && DatasetsComponent.searchUtils.status == errorCodes.NONE"
+            class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No statistics available</div>
+      <div *ngIf="searchPublicationsComponent.searchUtils.status == errorCodes.ERROR || DatasetsComponent.searchUtils.status == errorCodes.ERROR"
+            class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+      <div *ngIf="searchPublicationsComponent.searchUtils.status == errorCodes.NOT_AVAILABLE || DatasetsComponent.searchUtils.status == errorCodes.NOT_AVAILABLE"
+            class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+      <div *ngIf="searchPublicationsComponent.searchUtils.status == errorCodes.LOADING || DatasetsComponent.searchUtils.status == errorCodes.LOADING"
+            class="uk-animation-fade  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+      <errorMessages [status]="[searchPublicationsComponent.searchUtils.status, DatasetsComponent.searchUtils.status]" [type]="'statistics'"></errorMessages>
+
+      <!--div *ngIf="searchPublicationsComponent.searchUtils.totalResults == 0 && searchDatasetsComponent.searchUtils.totalResults == 0" class = "uk-alert">
+          No statistics available
+      </div-->
+      <div *ngIf="searchPublicationsComponent.searchUtils.totalResults != 0 || searchDatasetsComponent.searchUtils.totalResults != 0">
+        <p class="uk-text-bold">Latest Documents Timeline</p>
+        <i-frame  [url]=docsTimelineUrl width="800" height="350"></i-frame>
+        <p class="uk-text-bold">Documents Types</p>
+        <i-frame [url]=docsTypesUrl width="800" height="350"></i-frame>
+      </div>
+
+
+      <div *ngIf="(searchPublicationsComponent.searchUtils.totalResults > 0)">
+          <div>
+            <p class="uk-text-bold">Funders in content providers Publications</p>
+            <i-frame  [url]=docsFunderUrl width="800" height="350"></i-frame>
+            <p class="uk-text-bold">Projects with most Publications</p>
+            <i-frame [url]=pubsProjectsUrl width="800" height="350"></i-frame>
+
+      </div>
+      <div *ngIf="(searchDatasetsComponent.searchUtils.totalResults > 0)">
+          <div>
+            <p class="uk-text-bold">Projects with most Research Data</p>
+            <i-frame  [url]=dataProjectsUrl width="800" height="350"></i-frame>
+
+          </div>
+      </div>
+    </div>
+    </div>
+    `
+})
+
+export class StatisticsTabComponent {
+
+    @Input() statistics;
+    @Input() id;
+    @Input() searchDatasetsComponent : SearchDatasetsComponent;
+    @Input() searchPublicationsComponent : SearchPublicationsComponent;
+    @Input() show : boolean = false;
+
+    private  docsTimelineUrl: string;
+    private  docsTypesUrl:string;
+    private  docsFunderUrl:string;
+    private  dataProjectsUrl:string ;
+    private  pubsProjectsUrl:string;
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    constructor () {}
+
+    ngOnInit() {
+
+      this.docsTimelineUrl ='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcYear","dtsrcName":"'+this.id+'","table": "result", "fields": [{"fld": "number", "agg": "count", "type": "line", "yaxis":1, "c":true}], "xaxis":{"name": "year", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Documents"], "in": [{"f":0, "text": "Yearly"}], "filters": [{"name":"year","max":"2016","min":"1997"},{"name": "result_datasources-datasource-name", "values":[""], "to": "-1"}],"having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": "Year"}&w=600&h=250';
+      this.docsTypesUrl = 'https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcPubs","dtsrcName":"'+this.id+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "pie", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Documents"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+      this.docsFunderUrl =' https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcPubsFund","dtsrcName":"'+this.id+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "pie", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Documents"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+      this.dataProjectsUrl ='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcProjData","dtsrcName":"'+this.id+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "bar", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Datasets"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+      this.pubsProjectsUrl ='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"dtsrcProjPubs","dtsrcName":"'+this.id+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "bar", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Publications"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [""], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+    }
+
+    ngOnDestroy() {}
+}
diff --git a/landingPages/dataset/dataset-routing.module.ts b/landingPages/dataset/dataset-routing.module.ts
new file mode 100644
index 00000000..4b9372a4
--- /dev/null
+++ b/landingPages/dataset/dataset-routing.module.ts
@@ -0,0 +1,18 @@
+// import { NgModule } from '@angular/core';
+// import { RouterModule } from '@angular/router';
+//
+// import { DatasetComponent } from './dataset.component';
+// import {FreeGuard} from'../../login/freeGuard.guard';
+// import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+// import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+//
+// @NgModule({
+//  imports: [
+//   RouterModule.forChild([
+//     { path: '', component: DatasetComponent, canActivate: [FreeGuard, IsRouteEnabled], data: {
+//         redirect: '/error'
+//       },canDeactivate: [PreviousRouteRecorder] }
+//   ])
+// ]
+// })
+// export class DatasetRoutingModule { }
diff --git a/landingPages/dataset/dataset.component.html b/landingPages/dataset/dataset.component.html
new file mode 100644
index 00000000..f14ec667
--- /dev/null
+++ b/landingPages/dataset/dataset.component.html
@@ -0,0 +1,292 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div class="uk-container uk-margin-top dataset">
+
+    <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
+    <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+
+    <div *ngIf="datasetInfo != null" uk-grid class="uk-grid-large">
+        <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
+            <showTitle   [title]="datasetInfo.title"></showTitle>
+            <span *ngIf="datasetInfo.types.length > 0"class="uk-label custom-label label-dataset " title="Type">{{datasetInfo.types.join(", ")}}</span>
+            <span *ngIf="datasetInfo.languages.length > 0" class="uk-label custom-label  label-language " title="Language">{{datasetInfo.languages.join(", ")}}</span>
+
+            <span *ngIf="datasetInfo.title && datasetInfo.title.accessMode" [class]="'uk-label custom-label   label-'+ datasetInfo.title.accessMode " >{{datasetInfo.title.accessMode}}</span>
+            <span *ngIf="datasetInfo.underCurationMessage" class="uk-label custom-label label-underCuration "  >
+              <span uk-tooltip="pos:right; delay:10"
+                  title="{{buildCurationTooltip()}}">
+              <i>Record in preview</i>
+              <i class="uk-icon-info-circle"></i>
+            </span></span>
+            <!--div *ngIf="datasetInfo.underCurationMessage">
+              <span uk-tooltip="pos:right; delay:10"
+                    title="{{buildCurationTooltip()}}">
+                <i>Record in preview</i>
+                <i class="uk-icon-info-circle"></i>
+              </span>
+            </div-->
+
+            <div class= " uk-margin-top">
+                <showAuthors [authors]="datasetInfo.authors" searchPage="datasets"></showAuthors>
+                <span *ngIf="datasetInfo.date != ''">({{datasetInfo.date}})</span>
+            </div>
+
+            <ul class="uk-list">
+                <li *ngIf="datasetInfo.publisher"><span class="uk-text-bold">Publisher:</span> {{datasetInfo.publisher}}</li>
+
+                <li *ngIf="datasetInfo.embargoEndDate"><span class="uk-text-bold">Embargo end date:</span> {{datasetInfo.embargoEndDate}}</li>
+                 <li *ngIf="datasetInfo.identifiers && datasetInfo.identifiers.size > 0">
+                  <showIdentifiers [identifiers]="datasetInfo.identifiers"></showIdentifiers>
+                </li>
+                <li *ngIf="datasetInfo.subjects ||datasetInfo.otherSubjects ||  datasetInfo.classifiedSubjects">
+                  <showSubjects [subjects]="datasetInfo.subjects"
+                  [otherSubjects]="datasetInfo.otherSubjects"
+                  [classifiedSubjects]="datasetInfo.classifiedSubjects">
+                </showSubjects>
+                </li>
+            </ul>
+
+            <div *ngIf="datasetInfo.description" class="uk-margin-bottom uk-text-justify descriptionText">
+              {{datasetInfo.description}}
+            </div>
+
+            <!-- <div class="uk-clearfix"><div class="uk-float-right  uk-margin-top">
+                <div class="uk-inline">
+                    <button class="uk-button uk-button-small uk-button-action" type="button">
+                      <span class="uk-icon"   ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                      Link this research data to
+                      <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-down" ratio="1"><polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                    </button>
+                    <div uk-dropdown="mode: click; boundary: ! .uk-button-group; boundary-align: true;"
+                    class="uk-dropdown uk-dropdown-boundary uk-dropdown-bottom-left" style="top: 40px;    left: -236.5px;">
+                        <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                            <li><a class="uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                               Projects</a></li>
+                            <li><a  class="uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                               Communities</a></li>
+                            <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                              Other research results</a></li>
+                        </ul>
+
+                    </div>
+                </div>
+            </div></div> -->
+
+
+            <ul class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
+                <li (click)="activeTab='Related Research Results'"
+                    [class]="activeTab == 'Related Research Results'?'uk-active':''">
+                     <a>
+                         Related Research Results
+                         <span class="uk-badge uk-badge-notification">
+                             {{relatedResearchResultsNum}}
+                         </span>
+                     </a>
+                 </li>
+
+                <li (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
+                    <a>
+                        Similar Research Results
+                        <span *ngIf="!datasetInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
+                        <span *ngIf="datasetInfo.similarResearchResults" class="uk-badge uk-badge-notification">
+                            {{datasetInfo.similarResearchResults.length}}
+                        </span>
+                    </a>
+                </li>
+
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
+                    <a>
+                        Metrics  <!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+  <path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+</svg></i-->
+                    </a>
+                </li>
+            </ul>
+
+            <button class="uk-button uk-button-default uk-hidden@m" type="button">
+              <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
+            </button>
+
+            <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
+              <li (click)="activeTab='Related Research Results'"
+                  [class]="activeTab == 'Related Research Results'?'uk-active':''">
+                     <a>
+                         Related Research Results
+                         <span class="uk-badge uk-badge-notification">
+                             {{relatedResearchResultsNum}}
+                         </span>
+                     </a>
+                 </li>
+
+                <li (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
+                    <a>
+                        Similar Research Results
+                        <span *ngIf="!datasetInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
+                        <span *ngIf="datasetInfo.similarResearchResults" class="uk-badge uk-badge-notification">
+                            {{datasetInfo.similarResearchResults.length}}
+                        </span>
+                    </a>
+                </li>
+
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
+                    <a>
+                        Metrics<!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+<path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+  </svg></i-->
+                    </a>
+                </li>
+            </ul>
+
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+                <div *ngIf="activeTab=='Related Research Results'" class="uk-animation-fade">
+                    <div *ngIf="!datasetInfo.relatedResearchResults" class = "uk-alert  uk-alert-primary" >
+                        No related research results available
+                    </div>
+                    <div *ngIf="datasetInfo.relatedResearchResults && datasetInfo.relatedResearchResults.size > 0">
+
+                        <div *ngFor="let provenanceaction of getKeys(datasetInfo.relatedResearchResults)">
+                            <div class="uk-text-large">{{provenanceaction}}</div>
+
+                            <tabTable [info]="datasetInfo.relatedResearchResults.get(provenanceaction)"></tabTable>
+                        </div>
+                    </div>
+                </div>
+
+                <div *ngIf="activeTab=='Similar Research Results'" class="uk-animation-fade">
+                    <div  *ngIf="!datasetInfo.similarResearchResults"  class = "uk-alert  uk-alert-primary" >
+                        No similar research results available
+                    </div>
+                    <div *ngIf="datasetInfo.similarResearchResults">
+                        <tabTable [info]="datasetInfo.similarResearchResults"></tabTable>
+                    </div>
+                </div>
+                <div *ngIf="activeTab=='Metrics'" class="uk-animation-fade">
+                  <!-- Page Views: {{pageViews}} -->
+                    <metrics [pageViews]="pageViews"
+                        [id]="datasetId" [entityType]="'results'" [entity]="'Research Data'"
+                        (metricsResults)="metricsResults($event)">
+                    </metrics>
+                    <i-frame *ngIf="metricsClicked && totalViews > 0"
+                        [url]=viewsFrameUrl width="100%" height="250">
+                    </i-frame>
+                    <i-frame *ngIf="metricsClicked && totalDownloads > 0"
+                        [url]=downloadsFrameUrl width="100%" height="250">
+                    </i-frame>
+                </div>
+            <!--/ul-->
+          </div>
+        </div>
+
+        <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
+          <div class="uk-card uk-card-default uk-padding-small">
+          <div  >
+            Share - Bookmark
+            <addThis></addThis>
+          </div>
+          <altmetrics *ngIf="datasetInfo.identifiers && datasetInfo.identifiers.get('doi')"
+             id="{{datasetInfo.identifiers.get('doi')[0]}}" type="doi">
+          </altmetrics >
+            <ul class="uk-list ">
+
+                <li *ngIf="datasetInfo.hostedBy_collectedFrom && datasetInfo.hostedBy_collectedFrom.length > 0">
+                    <availableOn [availableOn]="datasetInfo.hostedBy_collectedFrom"></availableOn>
+                </li>
+                <li *ngIf="datasetInfo.fundedByProjects != undefined && datasetInfo.fundedByProjects.length > 0">
+                    <fundedBy [fundedByProjects]="datasetInfo.fundedByProjects"></fundedBy>
+                </li>
+
+                <li  *ngIf="datasetInfo.contexts && datasetInfo.contexts.length >0 ">
+                    <dl class="uk-description-list-line" >
+                        <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']">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
+                          </span>
+                          <mark *ngIf = "item['inline']" >
+                            <span>{{item['labelContext']}}</span>
+                            <span *ngIf="item['labelCategory']">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
+                          </mark>
+                        </dd>
+
+                    </dl>
+
+                </li>
+
+                <li>
+                  <ul uk-accordion class="uk-padding-remove">
+                      <li>
+                        <div class=" uk-accordion-title cite-this-button uk-width-1-1" type="button">
+                          Cite this reasearch data
+                        </div>
+                          <div class="uk-accordion-content">
+                            <citeThis [result]="datasetInfo" [id]="datasetId" type="research data"></citeThis>
+                          </div>
+                      </li>
+                  </ul>
+                </li>
+                <li>
+                  <ul uk-accordion class="uk-padding-remove">
+                      <li>
+                        <button class="uk-button uk-button-primary uk-accordion-title link-to-button  uk-width-1-1" type="button">
+                          <span class="uk-icon" >
+                                 <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                          <span>Link this research data to</span>
+                        </button>
+                          <div class="uk-accordion-content">
+                            <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                                <li><a class="uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                   Projects</a></li>
+                                <li><a  class="uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                   Communities</a></li>
+                                <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                  Other research results</a></li>
+                            </ul>
+                          </div>
+                      </li>
+                  </ul>
+
+                </li>
+
+
+            </ul>
+
+            <!--div class="uk-card uk-card-default uk-padding-small uk-card-body">
+              <div class="uk-card-title">
+                <span class=""  uk-tooltip="pos:right; delay:5"
+                       title='<div id="linkinginfo"  class= "uk-margin uk-padding-small">
+                         <p>Do you think that information is missing about a project, a community or other research results related to this dataset?</p>
+                         <p>You are able to enhance it! Please follow the links and create the missing relations.</p>
+                       </div>'>
+                       <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                Link this dataset to</div>
+              <div>
+
+                    <div class="uk-clearfix">
+
+                      <div><a class="uk-button-text  uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                         Projects</a></div>
+                      <div><a  class=" uk-button-text  uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                         Communities</a></div>
+                      <div><a   class=" uk-button-text uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[datasetId,'dataset','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                        Other research results</a></div>
+                    </div>
+               </div>
+            </div-->
+        </div>
+      </div>
+    </div>
+</div>
+</div>
+</div>
+</div>
diff --git a/landingPages/dataset/dataset.component.ts b/landingPages/dataset/dataset.component.ts
new file mode 100644
index 00000000..b1c5829b
--- /dev/null
+++ b/landingPages/dataset/dataset.component.ts
@@ -0,0 +1,172 @@
+import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {DatasetService} from './dataset.service';
+import {DatasetInfo} from '../../utils/entities/datasetInfo';
+import {ActivatedRoute, Router} from '@angular/router';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties'
+import {RouterHelper} from '../../utils/routerHelper.class';
+import { Meta} from '../../../angular2-meta';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'dataset',
+    templateUrl: 'dataset.component.html',
+})
+
+export class DatasetComponent {
+    public datasetInfo: DatasetInfo;
+    public datasetId : string ;
+
+    // APP BOX variables
+    public showAllCollectedFrom: boolean = false;
+    public showAllDownloadFrom: boolean = false;
+    public showAllPublishedIn: boolean = false;
+
+    // Metrics tab variables
+    public metricsClicked: boolean;
+    public viewsFrameUrl: string;
+    public downloadsFrameUrl: string;
+    public totalViews: number;
+    public totalDownloads: number;
+    public pageViews: number;
+
+    // Active tab variable for responsiveness
+    public activeTab: string = "Related Research Results";
+
+    // Map counting variable
+    public relatedResearchResultsNum: number = 0;
+
+    // Message variables
+    public warningMessage = "";
+    public errorMessage = "";
+    public showLoading: boolean = true;
+
+    public routerHelper:RouterHelper = new RouterHelper();
+
+    private result ;
+    sub: any; piwiksub: any; infoSub: any;
+
+    constructor (private element: ElementRef,
+                 private _datasetService: DatasetService,
+                 private _piwikService:PiwikService,
+                 private  route: ActivatedRoute,
+                 private _meta: Meta,
+                 private _router: Router) {
+                   this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+    }
+
+    ngOnInit() {
+      this.sub =  this.route.queryParams.subscribe(params => {
+          this.datasetInfo = null;
+          this.updateTitle("Dataset");
+          this.updateDescription("Dataset, search, open access");
+
+            this.datasetId = params['datasetId'];
+             console.info("Id is :"+this.datasetId);
+
+             if(this.datasetId){
+                this.getDatasetInfo(this.datasetId);
+            }else{
+              this.showLoading = false;
+                this.warningMessage="No valid research data id";
+            }
+
+            this.metricsClicked = false;
+
+            this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoViews", "resTitle":"'+this.datasetId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+            /*this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resViewsTimeline", "resTitle":"'+this.datasetId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+            */
+
+            this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoDownloads", "resTitle":"'+this.datasetId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+            /*this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoDownloadTimeline", "resTitle":"'+this.datasetId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true';
+            */
+            if (typeof document !== 'undefined') {
+               this.element.nativeElement.scrollIntoView();
+            }
+        });
+
+    }
+
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+      if(this.piwiksub){
+        this.piwiksub.unsubscribe();
+      }
+      if(this.infoSub) {
+        this.infoSub.unsubscribe();
+      }
+    }
+
+    private getDatasetInfo(id:string) {
+        this.warningMessage = '';
+        this.errorMessage=""
+        this.showLoading = true;
+
+        this.infoSub = this._datasetService.getDatasetInfo(id).subscribe(
+            data => {
+                this.datasetInfo = data;
+                this.updateTitle(this.datasetInfo.title.name);
+                this.updateDescription("Dataset, search, repositories, open access,"+this.datasetInfo.title.name);
+                if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                  this.piwiksub = this._piwikService.trackView(this.datasetInfo.title.name).subscribe();
+                }
+
+                this.result = []
+                this.result = {id: id, type :"dataset", source : "openaire", title: this.datasetInfo.title,url: '', result: '', accessRights: this.datasetInfo.title.accessMode, embargoEndDate: ''};
+
+                let relatedResearchResultsNum = 0;
+                if(this.datasetInfo.relatedResearchResults != undefined) {
+                    this.datasetInfo.relatedResearchResults.forEach(function (value, key, map) {
+                        relatedResearchResultsNum += value.length;
+                    });
+                }
+                this.relatedResearchResultsNum = relatedResearchResultsNum;
+
+                this.showLoading = false;
+            },
+            err => {
+                console.log(err)
+                console.info("error");
+
+                this.errorMessage = 'No research data found';
+                this.showLoading = false;
+            }
+        );
+    }
+
+    // showChange($event) {
+    //     this.showAllReferences=$event.value;
+    // }
+
+    public metricsResults($event) {
+      this.totalViews = $event.totalViews;
+      this.totalDownloads = $event.totalDownloads;
+      this.pageViews = $event.pageViews;
+    }
+
+    private updateDescription(description:string){
+      this._meta.updateMeta("description", description);
+      this._meta.updateProperty("og:description", description);
+    }
+    private updateTitle(title:string){
+      var _prefix ="OpenAIRE | ";
+      var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+      this._meta.setTitle(_title );
+      this._meta.updateProperty("og:title",_title);
+    }
+    private updateUrl(url:string){
+      this._meta.updateProperty("og:url", url);
+    }
+
+    public buildCurationTooltip() {
+        let tooltipContent: string = "<div class='uk-padding-small uk-light'>";
+
+        tooltipContent += "<h4>Record in preview</h4>";
+        tooltipContent += "<p>Bibliographic record accepted by the system, but not yet processed by <br> OpenAIRE tools for information quality improvement and de-duplication</p></di>";
+
+        return tooltipContent;
+    }
+    public getKeys( map) {
+      return Array.from(map.keys());
+    }
+}
diff --git a/landingPages/dataset/dataset.module.ts b/landingPages/dataset/dataset.module.ts
new file mode 100644
index 00000000..8aeb5940
--- /dev/null
+++ b/landingPages/dataset/dataset.module.ts
@@ -0,0 +1,42 @@
+//import {MaterialModule} from '@angular/material';
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { SharedModule } from '../../shared/shared.module';
+import { RouterModule } from '@angular/router';
+
+import { DatasetService} from './dataset.service';
+import { DatasetComponent } from './dataset.component';
+// import { DatasetRoutingModule } from './dataset-routing.module';
+import {MetricsModule} from '../landing-utils/metrics.module';
+import {IFrameModule} from '../../utils/iframe.module';
+import {AltMetricsModule} from '../../utils/altmetrics.module';
+import {CiteThisModule} from '../landing-utils/citeThis/citeThis.module';
+
+import { ResultLandingModule } from '../landing-utils/resultLanding.module';
+import { LandingModule } from '../landing-utils/landing.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+import {MetaModule} from '../../../meta.module';
+import { ConfigurationServiceModule } from '../../utils/configuration/configurationService.module';
+
+
+@NgModule({
+  imports: [
+    //MaterialModule.forRoot(),
+    CommonModule, FormsModule,SharedModule, RouterModule, LandingModule, CiteThisModule,
+    ResultLandingModule, MetricsModule, IFrameModule, AltMetricsModule,
+    MetaModule, ConfigurationServiceModule
+  ],
+  declarations: [
+  DatasetComponent
+  ],
+  providers:[
+    DatasetService, FreeGuard, IsRouteEnabled
+   ],
+  exports: [
+  DatasetComponent
+    ]
+})
+export class DatasetModule { }
diff --git a/landingPages/dataset/dataset.service.ts b/landingPages/dataset/dataset.service.ts
new file mode 100644
index 00000000..a6328f2e
--- /dev/null
+++ b/landingPages/dataset/dataset.service.ts
@@ -0,0 +1,195 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {DatasetInfo} from '../../utils/entities/datasetInfo';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+import { ParsingFunctions } from '../landing-utils/parsingFunctions.class';
+
+@Injectable()
+export class DatasetService {
+
+  constructor(private http: Http ) {
+    this.parsingFunctions = new ParsingFunctions();
+  }
+
+  public parsingFunctions: ParsingFunctions;
+  datasetInfo: DatasetInfo;
+
+  getDatasetInfo (id: string):any {
+    console.info("getDatasetInfo in service");
+
+    let url = OpenaireProperties. getSearchAPIURLLast()+'datasets/'+id+"?format=json";
+    let key = url;
+
+
+    return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .do(res => console.info(res['result']['metadata']['oaf:entity']))
+                    .map(res => [res['result']['header']['dri:status'], res['result']['metadata']['oaf:entity']['oaf:result']])
+                    .map(res => [res[1],
+                                 res[1]['title'],
+                                 res[1]['rels']['rel'],
+                                 res[1]['children'],
+                                 res[1]['pid'],
+                                 res[1]['subject'],
+                                 res[1]['bestaccessright'],
+                                 res[1]['collectedfrom'],
+                                 res[1]['context'],
+                                 //res[1]['resulttype'],
+                                 res[0],
+                                 res[1]['creator']
+                    ]).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.log(error);
+    return Observable.throw(error  || 'Server error');
+  }
+
+  parseDatasetInfo (data: any):any {
+    this.datasetInfo = new DatasetInfo();
+
+    if(data[0] != null) {
+      var date:string = (data[0].dateofacceptance)+""; // transform to string in case it is an integer
+      this.datasetInfo.date  = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+      this.datasetInfo.dateofacceptance = data[0].dateofacceptance;
+      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;
+    }
+    this.datasetInfo.title = {"name": "", "url": "", "accessMode": ""};
+    if(data[0]['bestaccessright'].hasOwnProperty("classid")) {
+      this.datasetInfo.title.accessMode = data[0]['bestaccessright'].classid;
+    }
+    if(data[1] != null) {
+      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 relation;
+      let length = data[2].length!=undefined ? data[2].length : 1;
+
+      for(let i=0; i<length; i++) {
+        relation = data[2].length!=undefined ? data[2][i] : data[2];
+        if(relation.hasOwnProperty("to")) {
+          if(relation['to'].class == "isProducedBy") {
+            this.datasetInfo.fundedByProjects = this.parsingFunctions.parseFundingByProjects(this.datasetInfo.fundedByProjects, relation, this.datasetInfo.projectsProvenanceVocabulary);
+          } else if(relation['to'].class == "isRelatedTo") {
+            let provenanceAction: string;
+            if(relation.provenanceaction in this.datasetInfo.researchResultsProvenanceVocabulary) {
+              provenanceAction = this.datasetInfo.researchResultsProvenanceVocabulary[relation.provenanceaction];
+            } else {
+              provenanceAction = "Other"
+            }
+
+            this.datasetInfo.relatedResearchResults = this.parsingFunctions.parseRelatedResearchResults(this.datasetInfo.relatedResearchResults, relation, provenanceAction);
+
+          } else if(relation['to'].class == "hasAmongTopNSimilarDocuments") {
+            this.datasetInfo.similarResearchResults = this.parsingFunctions.parseSimilarResearchResults(this.datasetInfo.similarResearchResults, relation);
+          }
+        }
+      }
+    }
+
+    if(data[3] != null) {
+      if(data[3].hasOwnProperty("instance")) {
+        this.datasetInfo.hostedBy_collectedFrom = new Array<{ "downloadName": string, "downloadUrl": string[],
+                                                              "collectedName": string, "collectedId": string,
+                                                              "accessMode": string[], "bestAccessMode": string,
+                                                              "type": string, "year":string}>();
+
+        this.datasetInfo.types = new Array<string>();
+        let types = new Set<string>();
+
+        let counter = 0;
+        let instance;
+
+        let length = data[3]['instance'].length!=undefined ? data[3]['instance'].length : 1;
+
+        for(let i=0; i<length; i++) {
+          instance = data[3]['instance'].length!=undefined ? data[3]['instance'][i] : data[3]['instance'];
+
+          this.parsingFunctions.parseTypes(this.datasetInfo.types, types, instance);
+
+          if(instance.hasOwnProperty("webresource")) {
+            let url;
+            if(instance['webresource'].length == undefined) {
+              url = instance['webresource'].url;
+            } else{
+              url = instance['webresource'][0].url;
+            }
+
+            if(instance.hasOwnProperty("hostedby")) {
+              counter = this.parsingFunctions.parseHostedBy_collectedFrom(this.datasetInfo.hostedBy_collectedFrom, instance, data[0], url, counter, this.datasetInfo.title);
+            }
+          }
+        }
+      }
+    }
+
+    if(data[4] != null) {
+      this.datasetInfo.identifiers = this.parsingFunctions.parseIdentifiers(data[4]);
+    }
+
+    if(data[5] != null) {
+      let subjectResults: [string[], Map<string, string[]>, Map<string, string[]>] = this.parsingFunctions.parseAllSubjects(data[5]);
+      this.datasetInfo.subjects = subjectResults[0];
+      this.datasetInfo.otherSubjects = subjectResults[1];
+      this.datasetInfo.classifiedSubjects = subjectResults[2];
+    }
+
+    this.datasetInfo.hostedBy_collectedFrom = this.parsingFunctions.addPublisherToHostedBy_collectedFrom(
+                this.datasetInfo.hostedBy_collectedFrom, this.datasetInfo.publisher,
+                null, this.datasetInfo.identifiers, this.datasetInfo.title);
+
+    if(data[8] != null) {
+      this.datasetInfo.contexts = this.parsingFunctions.parseContexts(data[8]);
+    }
+
+    // if(data[9] != null && this.datasetInfo.type == undefined) {
+    //   if(data[9].hasOwnProperty('classname')) {
+    //     this.datasetInfo.type = data[9].classname;
+    //   }
+    // }
+
+    if(data[9] != null && data[9] == "under curation") {
+      this.datasetInfo.underCurationMessage = true;
+    } else {
+      this.datasetInfo.underCurationMessage = false;
+    }
+
+    if(data[10] != null) {
+      if(this.datasetInfo.authors == undefined) {
+        this.datasetInfo.authors = new Array<string>();
+      }
+
+      let authors = data[10];
+      let length = Array.isArray(authors) ? authors.length : 1;
+      for(let i=0; i<length; i++) {
+        let author = Array.isArray(authors) ? authors[i] : authors;
+        this.datasetInfo.authors[author.rank-1] = author.content;
+
+      }
+
+      this.datasetInfo.authors = this.datasetInfo.authors.filter(function (item) {
+        return (item != undefined);
+      });
+    }
+
+    return this.datasetInfo;
+  }
+}
diff --git a/landingPages/htmlProjectReport/htmlProjectReport-routing.module.ts b/landingPages/htmlProjectReport/htmlProjectReport-routing.module.ts
new file mode 100644
index 00000000..75a108fb
--- /dev/null
+++ b/landingPages/htmlProjectReport/htmlProjectReport-routing.module.ts
@@ -0,0 +1,15 @@
+// import { NgModule } from '@angular/core';
+// import { RouterModule } from '@angular/router';
+//
+// import { HtmlProjectReportComponent } from './htmlProjectReport.component';
+// import {FreeGuard} from'../../login/freeGuard.guard';
+// import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+//
+// @NgModule({
+//  imports: [
+//   RouterModule.forChild([
+//     { path: '', component: HtmlProjectReportComponent , canActivate: [FreeGuard],canDeactivate: [PreviousRouteRecorder]}
+//   ])
+// ]
+// })
+// export class HtmlProjectReportRoutingModule { }
diff --git a/landingPages/htmlProjectReport/htmlProjectReport.component.ts b/landingPages/htmlProjectReport/htmlProjectReport.component.ts
new file mode 100644
index 00000000..b08ccf15
--- /dev/null
+++ b/landingPages/htmlProjectReport/htmlProjectReport.component.ts
@@ -0,0 +1,241 @@
+import {Component} from '@angular/core';
+import {Observable} from 'rxjs/Observable';
+import {ActivatedRoute, Params, Router} from '@angular/router';
+import {HtmlProjectReportService} from './htmlProjectReport.service';
+import {ProjectService} from '../project/project.service';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import { Meta} from '../../../angular2-meta';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+declare var UIkit: any;
+
+@Component({
+    selector: 'htmlProjectReport',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+      <div class="uk-container uk-margin-top">
+          <div *ngIf="warningMessage" class="uk-alert uk-alert-warning" role="alert">{{warningMessage}}</div>
+          <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+
+          <div *ngIf="!showLoading && !warningMessage">
+            <h1 *ngIf="header1">{{header1}}</h1>
+            <h2 *ngIf="header1 || htmlResult">{{header2}}</h2>
+
+            <div class="uk-clearfix uk-margin-bottom">
+              <button *ngIf="htmlResult" class="uk-icon-clipboard uk-button uk-button-primary clipBtn uk-float-right" (click)="copied()">
+                  Copy to clipboard
+              </button>
+            </div>
+            <!--div class="uk-panel-scrollable custom-html-table-height" *ngIf="htmlResult" id="clipboard" [innerHTML]="htmlResult"></div-->
+            <div class="uk-overflow-auto custom-html-table-height" *ngIf="htmlResult" id="clipboard" [innerHTML]="htmlResult"></div>
+
+            <div *ngIf="errorMessage" class="uk-alert uk-alert-danger" role="alert">{{errorMessage}}</div>
+          </div>
+      </div>
+      </div>
+    </div>
+  </div>
+
+    `
+ })
+export class HtmlProjectReportComponent{
+    private projectId: string;
+    private totalResults: number = 10;
+    private resultsType: string = "publication";
+
+    public header1: string = "";
+    public header2: string = "";
+    public htmlResult: string = "";
+
+    public sub: any; piwiksub: any;
+    public subHTML: any;
+    public subHTMLInfo: any;
+
+    public warningMessage: string = "";
+    public errorMessage: string = "";
+    public showLoading: boolean = true;
+
+    constructor ( private  route: ActivatedRoute,
+                  private htmlService: HtmlProjectReportService,
+                  private _piwikService:PiwikService,
+                  private _projectService: ProjectService,
+                  private _meta: Meta, private _router: Router) {
+          this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+    }
+
+    ngOnInit() {
+        this.sub =  this.route.queryParams.subscribe(params => {
+            this.projectId = params['projectId'];
+
+            if (params['size'] == parseInt(params['size'], 10)) {
+              this.totalResults = params['size'];
+            } else {
+              this.showLoading = false;
+    		      this.warningMessage="Requested size is not an integer";
+            }
+
+            if(params['type'] && (params['type'] == "publication" || params['type'] == "dataset" || params['type'] == "software")){
+              if(params['type'] == "publication") {
+                this.resultsType = 'publication';
+              } else if(params['type'] == "dataset") {
+                this.resultsType = 'research data';
+              } else if(params['type'] == "software") {
+                this.resultsType = 'software';
+              }
+
+              this.updateTitle("Project's "+this.resultsType+" report");
+              this.updateDescription("project, project "+ this.resultsType +" report, funding, open access, publications, research data, software");
+            } else {
+              this.showLoading = false;
+    		      this.warningMessage="Requested type should be publication or research data or software";
+            }
+
+            //showLoading is true if no warnings
+            if(this.showLoading) {
+              if(this.projectId) {
+                this.createHeaders();
+              } else {
+                this.showLoading = false;
+      		      this.warningMessage="No valid project id";
+              }
+            }
+        });
+    }
+
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+      if(this.piwiksub){
+        this.piwiksub.unsubscribe();
+      }
+      if(this.subHTML) {
+        this.subHTML.unsubscribe();
+      }
+      if(this.subHTMLInfo) {
+        this.subHTMLInfo.unsubscribe();
+      }
+    }
+
+    private createHeaders() {
+        this.subHTMLInfo = this._projectService.getHTMLInfo(this.projectId).subscribe(
+            data => {
+                this.createHeader1(data);
+                if(data.acronym) {
+                  this.updateTitle(data.acronym+" "+this.resultsType+" report");
+                } else if(data.title){
+                  this.updateTitle(data.title+" "+this.resultsType+" report");
+                }
+                if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                  this.piwiksub = this._piwikService.trackView(((data.acronym)?data.acronym:data.title)+" "+this.resultsType+" report").subscribe();
+                }
+            },
+            err => {
+                console.log(err);
+                this.createClipboard();
+            }
+        );
+
+        if(this.resultsType == "publication") {
+          this.header2 += this.totalResults + " publications";
+        } else if(this.resultsType == "research data") {
+          this.header2 += this.totalResults + " research data";
+        } else if(this.resultsType == "software") {
+          this.header2 += this.totalResults + " software";
+        }
+    }
+
+    private createClipboard() {
+        let intro: string = '<!doctype html>';
+        intro += '<html lang="en-gb" dir="ltr" vocab="http://schema.org/">';
+        intro += '<head>';
+        intro += '<title>'+this.header1+'</title>'
+        intro += '</head>';
+
+        if (typeof window !== 'undefined') {
+            this.subHTML = this.htmlService.getHTML(this.projectId, this.totalResults, this.resultsType).subscribe(
+                data => {
+                    let body: string = intro+'<body><h1>'+this.header1+'</h1><h2>'+this.header2+'</h2>'+data+'</body></html>';
+                    this.htmlResult = data;
+
+                    let clipboard;
+                    let Clipboard;
+                    Clipboard = require('clipboard');
+                    clipboard = new Clipboard('.clipBtn', {
+                        /*target: function(trigger) {
+                            return document.getElementById("clipboard");
+                        }*/
+                        text: function(trigger) {
+                            return body;//document.getElementById("clipboard").getAttribute('innerHTML');//"aaaa"+tmp+"oo";
+                        }
+                    });
+
+                    this.showLoading = false;
+                },
+                err => {
+                    console.log(err);
+                    this.errorMessage = 'Service not available';
+                    this.showLoading = false;
+                }
+            );
+        }
+    }
+
+    createHeader1(data: {"title": string, "acronym": string, "callIdentifier": string}) {
+        if(this.resultsType == "publication") {
+          this.header1 += "Publications";
+        } else if(this.resultsType == "research data") {
+          this.header1 += "Research Data";
+        } else if(this.resultsType == "software") {
+          this.header1 += "Software";
+        }
+
+        if(data != undefined) {
+            if(data.title != undefined && data.title != "") {
+                this.header1 += data.title;
+            }
+            if((data.title != undefined && data.title != "") &&
+             ((data.acronym != undefined && data.acronym != "") ||
+              (data.callIdentifier != undefined && data.callIdentifier != ""))) {
+                    this.header1 += "(";
+            }
+            if(data.acronym != undefined && data.acronym != "") {
+                this.header1 += data.acronym + " - ";
+            }
+            if(data.callIdentifier != undefined && data.callIdentifier != "") {
+                this.header1 += data.callIdentifier;
+            }
+            if((data.title != undefined && data.title != "") &&
+             ((data.acronym != undefined && data.acronym != "") ||
+              (data.callIdentifier != undefined && data.callIdentifier != ""))) {
+                    this.header1 += ")";
+            }
+        }
+
+        this.createClipboard();
+    }
+
+    public copied() {
+      UIkit.notification({
+          message : '<strong>Raw html is copied. Please paste it on an html file.<strong>',
+          status  : 'success',
+          timeout : 3000,
+          pos     : 'top-center'
+      });
+    }
+
+    private updateDescription(description:string){
+      this._meta.updateMeta("description", description);
+      this._meta.updateProperty("og:description", description);
+    }
+    private updateTitle(title:string){
+      var _prefix ="OpenAIRE | ";
+      var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+      this._meta.setTitle(_title );
+      this._meta.updateProperty("og:title",_title);
+    }
+    private updateUrl(url:string){
+      this._meta.updateProperty("og:url", url);
+    }
+}
diff --git a/landingPages/htmlProjectReport/htmlProjectReport.module.ts b/landingPages/htmlProjectReport/htmlProjectReport.module.ts
new file mode 100644
index 00000000..fde02fac
--- /dev/null
+++ b/landingPages/htmlProjectReport/htmlProjectReport.module.ts
@@ -0,0 +1,28 @@
+//import {MaterialModule} from '@angular/material';
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { ProjectServiceModule} from '../project/projectService.module';
+
+
+import {HtmlProjectReportService} from './htmlProjectReport.service';
+import {HtmlProjectReportComponent} from './htmlProjectReport.component';
+// import { HtmlProjectReportRoutingModule } from './htmlProjectReport-routing.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {PiwikServiceModule} from '../../utils/piwik/piwikService.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, ProjectServiceModule,PiwikServiceModule
+  ],
+  declarations: [
+  HtmlProjectReportComponent
+  ],
+  providers:[
+    HtmlProjectReportService, FreeGuard
+   ],
+  exports: [
+  HtmlProjectReportComponent
+    ]
+})
+export class HtmlProjectReportModule { }
diff --git a/landingPages/htmlProjectReport/htmlProjectReport.service.ts b/landingPages/htmlProjectReport/htmlProjectReport.service.ts
new file mode 100644
index 00000000..c044af95
--- /dev/null
+++ b/landingPages/htmlProjectReport/htmlProjectReport.service.ts
@@ -0,0 +1,36 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/operator/do';
+
+@Injectable()
+export class HtmlProjectReportService {
+
+    constructor(private http: Http ) {}
+
+    getHTML(id: string, size: number, type:string):any {
+        console.info("getHTML in service");
+
+        let resultTypeId: string;
+        let requestType: string;
+        if(type == "publication") {
+          resultTypeId = 'publication';
+          requestType = 'publications';
+        } else if(type == "research data") {
+          resultTypeId = 'dataset';
+          requestType = 'datasets';
+        } else if(type == "software") {
+          resultTypeId = 'software';
+          requestType = 'software'
+        }
+
+        //let url = OpenaireProperties. getSearchAPIURLLast() + 'publications/' +id+"?format=json";
+        let url = OpenaireProperties.getCsvAPIURL();
+        url += 'resources?format=html&page=0&size='+size+'&type='+requestType+'&query=(((oaftype exact result) and (resulttypeid exact '+resultTypeId+')) and (relprojectid exact "'+id+'"))';
+        let key = url;
+
+        return this.http.get(url)
+                    .map(res => <any> res.text());
+    }
+}
diff --git a/landingPages/landing-utils/addThis.component.ts b/landingPages/landing-utils/addThis.component.ts
new file mode 100644
index 00000000..b17d1cae
--- /dev/null
+++ b/landingPages/landing-utils/addThis.component.ts
@@ -0,0 +1,43 @@
+import {Component, ElementRef, Input} from '@angular/core';
+import {ActivatedRoute} from '@angular/router';
+
+ interface addthis {
+     layers: refresh;
+     init: Function;
+ }
+ interface refresh {
+     refresh: Function;
+ }
+ declare var addthis: addthis;
+
+//<addThis ></addThis>
+@Component({
+  selector: 'addThis',
+  template: `
+  <div class="addthis_inline_share_toolbox"></div>
+  `
+})
+export class AddThisComponent {
+  private sub:any;
+
+
+  constructor(private route: ActivatedRoute) {
+
+  }
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(data => {
+
+      if (typeof document !== 'undefined') {
+        try{
+          addthis.init();
+          addthis.layers.refresh();
+        }catch (e) {
+          console.log(e);
+        }
+      }
+  });
+
+  }
+
+
+}
diff --git a/landingPages/landing-utils/availableOn.component.ts b/landingPages/landing-utils/availableOn.component.ts
new file mode 100644
index 00000000..40b1baab
--- /dev/null
+++ b/landingPages/landing-utils/availableOn.component.ts
@@ -0,0 +1,73 @@
+import {Component, Input, ElementRef} from '@angular/core';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'availableOn',
+    template: `
+    <dl class="uk-description-list-line">
+        <dt class="title">Available On</dt>
+        <dd class="line" *ngFor="let available of availableOn let i=index" >
+            <div *ngIf="i<5 || showAll">
+              <div class="{{available['bestAccessMode']}}">
+                <span *ngIf="available.downloadUrl.length > 1"
+                      class="custom-external custom-icon">
+                      {{available.downloadName}}
+                  <span *ngFor="let url of available.downloadUrl; let i=index;">
+                      <a  href="{{url}}" target="_blank"
+                          [attr.uk-tooltip]="available.accessMode[i] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                          [title]="available.accessMode[i]">
+                          [{{i+1}}]
+                      </a>
+                  </span>
+                </span>
+                <a  class="custom-external custom-icon"
+                    *ngIf="available['downloadUrl'].length == 1"
+                    href="{{available['downloadUrl']}}"
+                    target="_blank"
+                    [attr.uk-tooltip]="available['bestAccessMode'] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                    [title]="available['bestAccessMode']">
+                    {{available.downloadName}}
+                </a>
+                <span *ngIf="available.collectedName" class="uk-text-bold">via</span>
+                <a *ngIf="available.collectedName"
+                    [queryParams]="{datasourceId: available.collectedId}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
+                  {{available.collectedName}}
+                </a>
+                <span *ngIf="available.type || available.year">(<span *ngIf="available.type">{{available.type}}, </span><span *ngIf="available.year">{{available.year}}</span>)</span>
+              </div>
+            </div>
+        </dd>
+        <dd *ngIf="showAll" class="uk-text-right">
+            <a (click)="showAll = !showAll; scroll()">
+                View less
+            </a>
+        </dd>
+        <dd *ngIf="!showAll && availableOn.length > 5">...</dd>
+        <dd *ngIf="!showAll && availableOn.length > 5" class="uk-text-right">
+            <a (click)="showAll = !showAll;">
+                View more
+            </a>
+        </dd>
+    </dl>
+    `
+    })
+
+export class AvailableOnComponent {
+    @Input() availableOn: { "downloadName": string, "downloadUrl": string[],
+                            "collectedName": string, "collectedId": string,
+                            "accessMode": string[], "bestAccessMode": string,
+                            "type": string, "year":string }[];
+
+    public showAll: boolean = false;
+
+    constructor (private element: ElementRef) {}
+
+    ngOnInit() {}
+
+    public scroll() {
+      console.info("scroll into view");
+      if (typeof document !== 'undefined') {
+         this.element.nativeElement.scrollIntoView();
+      }
+    }
+}
diff --git a/landingPages/landing-utils/citeThis/citation.class.ts b/landingPages/landing-utils/citeThis/citation.class.ts
new file mode 100644
index 00000000..b1367230
--- /dev/null
+++ b/landingPages/landing-utils/citeThis/citation.class.ts
@@ -0,0 +1,31 @@
+export class Citation{
+  public templates:string[]=["bibtex","chicago","ieee","science","apa","cell","harvard","mla","nature","acm"];
+
+  bibtex:string =`<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="sort-only" default-locale="en-US"> <info> <title>BibTeX generic citation style</title> <id>http://www.zotero.org/styles/bibtex</id> <link href="http://www.zotero.org/styles/bibtex" rel="self"/> <link href="http://www.bibtex.org/" rel="documentation"/> <author> <name>Markus Schaffner</name> </author> <contributor> <name>Richard Karnesky</name> <email>karnesky+zotero@gmail.com</email> <uri>http://arc.nucapt.northwestern.edu/Richard_Karnesky</uri> </contributor> <category citation-format="author-date"/> <category field="generic-base"/> <updated>2012-09-14T21:22:32+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <macro name="zotero2bibtexType"> <choose> <if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <text value="book"/> </if> <else-if type="chapter paper-conference" match="any"> <text value="inbook"/> </else-if> <else-if type="article article-journal article-magazine article-newspaper" match="any"> <text value="article"/> </else-if> <else-if type="thesis" match="any"> <text value="phdthesis"/> </else-if> <else-if type="manuscript" match="any"> <text value="unpublished"/> </else-if> <else-if type="paper-conference" match="any"> <text value="inproceedings"/> </else-if> <else-if type="report" match="any"> <text value="techreport"/> </else-if> <else> <text value="misc"/> </else> </choose> </macro> <macro name="citeKey"> <group delimiter="_"> <text macro="author-short" text-case="lowercase"/> <text macro="issued-year"/> </group> </macro> <macro name="author-short"> <names variable="author"> <name form="short" delimiter="_" delimiter-precedes-last="always"/> <substitute> <names variable="editor"/> <names variable="translator"/> <choose> <if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <text variable="title" form="short"/> </if> <else> <text variable="title" form="short"/> </else> </choose> </substitute> </names> </macro> <macro name="issued-year"> <date variable="issued"> <date-part name="year"/> </date> </macro> <macro name="issued-month"> <date variable="issued"> <date-part name="month" form="short" strip-periods="true"/> </date> </macro> <macro name="author"> <names variable="author"> <name sort-separator=", " delimiter=" and " delimiter-precedes-last="always" name-as-sort-order="all"/> <label form="long" text-case="capitalize-first"/> </names> </macro> <macro name="editor-translator"> <names variable="editor translator" delimiter=", "> <name sort-separator=", " delimiter=" and " delimiter-precedes-last="always" name-as-sort-order="all"/> <label form="long" text-case="capitalize-first"/> </names> </macro> <macro name="title"> <text variable="title"/> </macro> <macro name="number"> <text variable="issue"/> <text variable="number"/> </macro> <macro name="container-title"> <choose> <if type="chapter paper-conference" match="any"> <text variable="container-title" prefix=" booktitle={" suffix="}"/> </if> <else> <text variable="container-title" prefix=" journal={" suffix="}"/> </else> </choose> </macro> <macro name="publisher"> <choose> <if type="thesis"> <text variable="publisher" prefix=" school={" suffix="}"/> </if> <else-if type="report"> <text variable="publisher" prefix=" institution={" suffix="}"/> </else-if> <else> <text variable="publisher" prefix=" publisher={" suffix="}"/> </else> </choose> </macro> <macro name="pages"> <text variable="page"/> </macro> <macro name="edition"> <text variable="edition"/> </macro> <citation et-al-min="10" et-al-use-first="10" disambiguate-add-year-suffix="true" disambiguate-add-names="false" disambiguate-add-givenname="false" collapse="year"> <sort> <key macro="author"/> <key variable="issued"/> </sort> <layout delimiter="_"> <text macro="citeKey"/> </layout> </citation> <bibliography hanging-indent="false" et-al-min="10" et-al-use-first="10"> <sort> <key macro="author"/> <key variable="issued"/> </sort> <layout> <text macro="zotero2bibtexType" prefix=" @"/> <group prefix="{" suffix="}" delimiter=", "> <text macro="citeKey"/> <text variable="publisher-place" prefix=" place={" suffix="}"/> <!--Fix This--> <text variable="chapter-number" prefix=" chapter={" suffix="}"/> <!--Fix This--> <text macro="edition" prefix=" edition={" suffix="}"/> <!--Is this in CSL? <text variable="type" prefix=" type={" suffix="}"/>--> <text variable="collection-title" prefix=" series={" suffix="}"/> <text macro="title" prefix=" title={" suffix="}"/> <text variable="volume" prefix=" volume={" suffix="}"/> <!--Not in CSL<text variable="rights" prefix=" rights={" suffix="}"/>--> <text variable="ISBN" prefix=" ISBN={" suffix="}"/> <text variable="ISSN" prefix=" ISSN={" suffix="}"/> <!--Not in CSL <text variable="LCCN" prefix=" callNumber={" suffix="}"/>--> <text variable="archive_location" prefix=" archiveLocation={" suffix="}"/> <text variable="URL" prefix=" url={" suffix="}"/> <text variable="DOI" prefix=" DOI={" suffix="}"/> <text variable="abstract" prefix=" abstractNote={" suffix="}"/> <text variable="note" prefix=" note={" suffix="}"/> <text macro="number" prefix=" number={" suffix="}"/> <text macro="container-title"/> <text macro="publisher"/> <text macro="author" prefix=" author={" suffix="}"/> <text macro="editor-translator" prefix=" editor={" suffix="}"/> <text macro="issued-year" prefix=" year={" suffix="}"/> <text macro="issued-month" prefix=" month={" suffix="}"/> <text macro="pages" prefix=" pages={" suffix="}"/> <text variable="collection-title" prefix=" collection={" suffix="}"/> </group> </layout> </bibliography> </style> `;
+  ieee:string =`<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="sort-only"> <info> <title>IEEE</title> <id>http://www.zotero.org/styles/ieee</id> <link href="http://www.zotero.org/styles/ieee" rel="self"/> <link href="http://www.ieee.org/documents/style_manual.pdf" rel="documentation"/> <link href="http://www.ieee.org/documents/auinfo07.pdf" rel="documentation"/> <author> <name>Michael Berkowitz</name> <email>mberkowi@gmu.edu</email> </author> <contributor> <name>Julian Onions</name> <email>julian.onions@gmail.com</email> </contributor> <contributor> <name>Rintze Zelle</name> <uri>http://twitter.com/rintzezelle</uri> </contributor> <contributor> <name>Stephen Frank</name> <uri>http://www.zotero.org/sfrank</uri> </contributor> <contributor> <name>Sebastian Karcher</name> </contributor> <category citation-format="numeric"/> <category field="engineering"/> <category field="generic-base"/> <updated>2016-10-06T15:32:30+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <locale xml:lang="en"> <terms> <term name="chapter" form="short">ch.</term> <term name="presented at">presented at the</term> <term name="available at">available</term> </terms> </locale> <!-- Macros --> <macro name="edition"> <choose> <if type="bill book chapter graphic legal_case legislation motion_picture paper-conference report song" match="any"> <choose> <if is-numeric="edition"> <group delimiter=" "> <number variable="edition" form="ordinal"/> <text term="edition" form="short"/> </group> </if> <else> <text variable="edition" text-case="capitalize-first" suffix="."/> </else> </choose> </if> </choose> </macro> <macro name="issued"> <choose> <if type="article-journal report" match="any"> <date variable="issued"> <date-part name="month" form="short" suffix=" "/> <date-part name="year" form="long"/> </date> </if> <else-if type=" bill book chapter graphic legal_case legislation motion_picture paper-conference song thesis" match="any"> <date variable="issued"> <date-part name="year" form="long"/> </date> </else-if> <else> <date variable="issued"> <date-part name="day" form="numeric-leading-zeros" suffix="-"/> <date-part name="month" form="short" suffix="-" strip-periods="true"/> <date-part name="year" form="long"/> </date> </else> </choose> </macro> <macro name="author"> <names variable="author"> <name and="text" et-al-min="7" et-al-use-first="1" initialize-with=". "/> <label form="short" prefix=", " text-case="capitalize-first"/> <et-al font-style="italic"/> <substitute> <names variable="editor"/> <names variable="translator"/> </substitute> </names> </macro> <macro name="editor"> <names variable="editor"> <name initialize-with=". " delimiter=", " and="text"/> <label form="short" prefix=", " text-case="capitalize-first"/> </names> </macro> <macro name="locators"> <group delimiter=", "> <text macro="edition"/> <group delimiter=" "> <text term="volume" form="short"/> <number variable="volume" form="numeric"/> </group> <group delimiter=" "> <number variable="number-of-volumes" form="numeric"/> <text term="volume" form="short" plural="true"/> </group> <group delimiter=" "> <text term="issue" form="short"/> <number variable="issue" form="numeric"/> </group> </group> </macro> <macro name="title"> <choose> <if type="bill book graphic legal_case legislation motion_picture song" match="any"> <text variable="title" font-style="italic"/> </if> <else> <text variable="title" quotes="true"/> </else> </choose> </macro> <macro name="publisher"> <choose> <if type=" bill book chapter graphic legal_case legislation motion_picture paper-conference song" match="any"> <group delimiter=": "> <text variable="publisher-place"/> <text variable="publisher"/> </group> </if> <else> <group delimiter=", "> <text variable="publisher"/> <text variable="publisher-place"/> </group> </else> </choose> </macro> <macro name="event"> <choose> <if type="paper-conference speech" match="any"> <choose> <!-- Published Conference Paper --> <if variable="container-title"> <group delimiter=", "> <group delimiter=" "> <text term="in"/> <text variable="container-title" font-style="italic"/> </group> <text variable="event-place"/> </group> </if> <!-- Unpublished Conference Paper --> <else> <group delimiter=", "> <group delimiter=" "> <text term="presented at"/> <text variable="event"/> </group> <text variable="event-place"/> </group> </else> </choose> </if> </choose> </macro> <macro name="access"> <choose> <if type="webpage"> <choose> <if variable="URL"> <group delimiter=". "> <text term="online" prefix="[" suffix="]" text-case="capitalize-first"/> <group delimiter=": "> <text term="available at" text-case="capitalize-first"/> <text variable="URL"/> </group> <group prefix="[" suffix="]" delimiter=": "> <text term="accessed" text-case="capitalize-first"/> <date variable="accessed"> <date-part name="day" form="numeric-leading-zeros" suffix="-"/> <date-part name="month" form="short" suffix="-" strip-periods="true"/> <date-part name="year" form="long"/> </date> </group> </group> </if> </choose> </if> </choose> </macro> <macro name="page"> <group> <label variable="page" form="short" suffix=" "/> <text variable="page"/> </group> </macro> <macro name="citation-locator"> <group delimiter=" "> <choose> <if locator="page"> <label variable="locator" form="short"/> </if> <else> <label variable="locator" form="short" text-case="capitalize-first"/> </else> </choose> <text variable="locator"/> </group> </macro> <!-- Citation --> <citation collapse="citation-number"> <sort> <key variable="citation-number"/> </sort> <layout delimiter=", "> <group prefix="[" suffix="]" delimiter=", "> <text variable="citation-number"/> <text macro="citation-locator"/> </group> </layout> </citation> <!-- Bibliography --> <bibliography entry-spacing="0" second-field-align="flush"> <layout suffix="."> <!-- Citation Number --> <text variable="citation-number" prefix="[" suffix="]"/> <!-- Author(s) --> <text macro="author" suffix=", "/> <!-- Rest of Citation --> <choose> <!-- Specific Formats --> <if type="article-journal"> <group delimiter=", "> <text macro="title"/> <text variable="container-title" font-style="italic" form="short"/> <text macro="locators"/> <text macro="page"/> <text macro="issued"/> </group> </if> <else-if type="paper-conference speech" match="any"> <group delimiter=", "> <text macro="title"/> <text macro="event"/> <text macro="issued"/> <text macro="locators"/> <text macro="page"/> </group> </else-if> <else-if type="report"> <group delimiter=", "> <text macro="title"/> <text macro="publisher"/> <group delimiter=" "> <text variable="genre"/> <text variable="number"/> </group> <text macro="issued"/> </group> </else-if> <else-if type="thesis"> <group delimiter=", "> <text macro="title"/> <text variable="genre"/> <text macro="publisher"/> <text macro="issued"/> </group> </else-if> <else-if type="webpage post-weblog" match="any"> <group delimiter=", " suffix=". "> <text macro="title"/> <text variable="container-title" font-style="italic"/> <text macro="issued"/> </group> <text macro="access"/> </else-if> <else-if type="patent"> <group delimiter=", "> <text macro="title"/> <text variable="number"/> <text macro="issued"/> </group> </else-if> <!-- Generic/Fallback Formats --> <else-if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <group delimiter=", " suffix=". "> <text macro="title"/> <text macro="locators"/> </group> <group delimiter=", "> <text macro="publisher"/> <text macro="issued"/> <text macro="page"/> </group> </else-if> <else-if type="article-magazine article-newspaper broadcast interview manuscript map patent personal_communication song speech thesis webpage" match="any"> <group delimiter=", "> <text macro="title"/> <text variable="container-title" font-style="italic"/> <text macro="locators"/> <text macro="publisher"/> <text macro="page"/> <text macro="issued"/> </group> </else-if> <else-if type="chapter paper-conference" match="any"> <group delimiter=", " suffix=", "> <text macro="title"/> <group delimiter=" "> <text term="in"/> <text variable="container-title" font-style="italic"/> </group> <text macro="locators"/> </group> <text macro="editor" suffix=" "/> <group delimiter=", "> <text macro="publisher"/> <text macro="issued"/> <text macro="page"/> </group> </else-if> <else> <group delimiter=", " suffix=". "> <text macro="title"/> <text variable="container-title" font-style="italic"/> <text macro="locators"/> </group> <group delimiter=", "> <text macro="publisher"/> <text macro="page"/> <text macro="issued"/> </group> </else> </choose> </layout> </bibliography> </style> `;
+  chicago:string =`<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="note" version="1.0" demote-non-dropping-particle="display-and-sort" page-range-format="chicago"> <info> <title>Chicago Manual of Style 16th edition (full note)</title> <id>http://www.zotero.org/styles/chicago-fullnote-bibliography</id> <link href="http://www.zotero.org/styles/chicago-fullnote-bibliography" rel="self"/> <link href="http://www.chicagomanualofstyle.org/tools_citationguide.html" rel="documentation"/> <author> <name>Julian Onions</name> <email>julian.onions@gmail.com</email> </author> <contributor> <name>Simon Kornblith</name> <email>simon@simonster.com</email> </contributor> <contributor> <name>Elena Razlogova</name> <email>elena.razlogova@gmail.com</email> </contributor> <contributor> <name>Frank Bennett</name> <email>biercenator@gmail.com</email> </contributor> <contributor> <name>Andrew Dunning</name> <email>andrew.dunning@utoronto.ca</email> </contributor> <category citation-format="note"/> <category field="generic-base"/> <summary>Chicago format with full notes and bibliography</summary> <updated>2016-11-03T13:30:08+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <locale xml:lang="en"> <terms> <term name="editor" form="verb-short">ed.</term> <term name="translator" form="verb-short">trans.</term> <term name="translator" form="short">trans.</term> <term name="editortranslator" form="verb-short"> <single>ed. and trans.</single> <multiple>ed. and trans.</multiple> </term> <term name="editortranslator" form="verb"> <single>Edited and translated by</single> <multiple>Edited and translated by</multiple> </term> <term name="translator" form="short">trans.</term> </terms> </locale> <macro name="editor-translator"> <group delimiter=", "> <group delimiter=" "> <choose> <if variable="container-author reviewed-author" match="any"> <group> <names variable="container-author reviewed-author"> <label form="verb-short" text-case="lowercase" suffix=" "/> <name and="text" delimiter=", "/> </names> </group> </if> </choose> </group> <names variable="editor translator" delimiter=", "> <label form="verb-short" text-case="lowercase" suffix=" "/> <name and="text" delimiter=", "/> </names> </group> </macro> <macro name="secondary-contributors-note"> <choose> <if type="chapter paper-conference" match="none"> <text macro="editor-translator"/> </if> </choose> </macro> <macro name="container-contributors-note"> <choose> <if type="chapter paper-conference" match="any"> <text macro="editor-translator"/> </if> </choose> </macro> <macro name="secondary-contributors"> <choose> <if type="chapter paper-conference" match="none"> <names variable="editor translator" delimiter=". "> <label form="verb" text-case="capitalize-first" suffix=" "/> <name and="text" delimiter=", "/> </names> </if> </choose> </macro> <macro name="container-contributors"> <choose> <if type="chapter paper-conference" match="any"> <group delimiter=", "> <choose> <if variable="author"> <choose> <if variable="container-author" match="any"> <names variable="container-author"> <label form="verb-short" text-case="lowercase" suffix=" "/> <name and="text" delimiter=", "/> </names> </if> </choose> <!--This includes page numers after the container author, e.g. for Introductions --> <choose> <if variable="container-author author" match="all"> <group delimiter=". "> <text variable="page"/> <names variable="editor translator" delimiter=", "> <label form="verb" suffix=" "/> <name and="text" delimiter=", "/> </names> </group> </if> <else> <names variable="editor translator" delimiter=", "> <label form="verb" text-case="lowercase" suffix=" "/> <name and="text" delimiter=", "/> </names> </else> </choose> </if> </choose> </group> </if> </choose> </macro> <macro name="recipient-note"> <names variable="recipient" delimiter=", "> <label form="verb" text-case="lowercase" suffix=" "/> <name and="text" delimiter=", "/> </names> </macro> <macro name="contributors-note"> <group delimiter=" "> <names variable="author"> <name and="text" sort-separator=", " delimiter=", "/> <label form="short" prefix=", "/> <substitute> <names variable="editor"/> <names variable="translator"/> </substitute> </names> <text macro="recipient-note"/> </group> </macro> <macro name="editor"> <names variable="editor"> <name name-as-sort-order="first" and="text" sort-separator=", " delimiter=", " delimiter-precedes-last="always"/> <label form="short" prefix=", "/> </names> </macro> <macro name="translator"> <names variable="translator"> <name name-as-sort-order="first" and="text" sort-separator=", " delimiter=", " delimiter-precedes-last="always"/> <label form="verb-short" prefix=", "/> </names> </macro> <macro name="recipient"> <group delimiter=" "> <choose> <if type="personal_communication"> <choose> <if variable="genre"> <text variable="genre" text-case="capitalize-first"/> </if> <else> <text term="letter" text-case="capitalize-first"/> </else> </choose> </if> </choose> <text macro="recipient-note"/> </group> </macro> <macro name="contributors"> <group delimiter=". "> <names variable="author"> <name name-as-sort-order="first" and="text" sort-separator=", " delimiter=", " delimiter-precedes-last="always"/> <substitute> <text macro="editor"/> <text macro="translator"/> </substitute> </names> <text macro="recipient"/> </group> </macro> <macro name="recipient-short"> <names variable="recipient"> <label form="verb" text-case="lowercase" suffix=" "/> <name form="short" and="text" delimiter=", "/> </names> </macro> <macro name="contributors-short"> <group delimiter=" "> <names variable="author"> <name form="short" and="text" delimiter=", "/> <substitute> <names variable="editor"/> <names variable="translator"/> </substitute> </names> <text macro="recipient-short"/> </group> </macro> <macro name="contributors-sort"> <names variable="author"> <name name-as-sort-order="all" and="text" sort-separator=", " delimiter=", " delimiter-precedes-last="always"/> <substitute> <names variable="editor"/> <names variable="translator"/> <text macro="title"/> </substitute> </names> </macro> <macro name="interviewer-note"> <names variable="interviewer" delimiter=", "> <label form="verb" text-case="lowercase" suffix=" "/> <name and="text" delimiter=", "/> </names> </macro> <macro name="interviewer"> <names variable="interviewer" delimiter=", "> <label form="verb" text-case="capitalize-first" suffix=" "/> <name and="text" delimiter=", "/> </names> </macro> <macro name="title-note"> <choose> <if variable="title" match="none"> <text variable="genre"/> </if> <else-if type="book graphic motion_picture song" match="any"> <text variable="title" text-case="title" font-style="italic"/> <group delimiter=" " prefix=", "> <text term="version"/> <text variable="version"/> </group> </else-if> <else-if type="legal_case interview patent" match="any"> <text variable="title"/> </else-if> <else-if variable="reviewed-author"> <text variable="title" font-style="italic" prefix="review of "/> </else-if> <else> <text variable="title" text-case="title" quotes="true"/> </else> </choose> </macro> <macro name="title"> <choose> <if variable="title" match="none"> <choose> <if type="personal_communication" match="none"> <text variable="genre" text-case="capitalize-first"/> </if> </choose> </if> <else-if type="book graphic motion_picture song" match="any"> <text variable="title" text-case="title" font-style="italic"/> <group prefix=" (" suffix=")" delimiter=" "> <text term="version"/> <text variable="version"/> </group> </else-if> <else-if variable="reviewed-author"> <group delimiter=", "> <text variable="title" font-style="italic" prefix="Review of "/> <names variable="reviewed-author"> <label form="verb-short" text-case="lowercase" suffix=" "/> <name and="text" delimiter=", "/> </names> </group> </else-if> <else-if type="bill legislation legal_case interview patent" match="any"> <text variable="title"/> </else-if> <else> <text variable="title" text-case="title" quotes="true"/> </else> </choose> </macro> <macro name="title-short"> <choose> <if variable="title" match="none"> <choose> <if type="interview"> <text term="interview"/> </if> <else-if type="manuscript speech" match="any"> <text variable="genre" form="short"/> </else-if> <else-if type="personal_communication"> <text macro="issued"/> </else-if> </choose> </if> <else-if type="book graphic motion_picture song" match="any"> <text variable="title" text-case="title" form="short" font-style="italic"/> </else-if> <else-if type="legal_case" variable="title-short" match="all"> <text variable="title" font-style="italic" form="short"/> </else-if> <else-if type="patent interview" match="any"> <text variable="title" form="short"/> </else-if> <else-if type="legal_case bill legislation" match="any"> <text variable="title"/> </else-if> <else> <text variable="title" text-case="title" form="short" quotes="true"/> </else> </choose> </macro> <macro name="date-disambiguate"> <choose> <if disambiguate="true"> <text macro="issued"/> </if> </choose> </macro> <macro name="description-note"> <group delimiter=", "> <text macro="interviewer-note"/> <text variable="medium"/> <choose> <if variable="title" match="none"/> <else-if type="manuscript thesis speech" match="any"/> <else-if type="patent"> <group delimiter=" "> <text variable="authority"/> <text variable="number"/> </group> </else-if> <else> <text variable="genre"/> </else> </choose> </group> </macro> <macro name="description"> <group delimiter=", "> <group delimiter=". "> <text macro="interviewer"/> <text variable="medium" text-case="capitalize-first"/> </group> <choose> <if variable="title" match="none"/> <else-if type="thesis speech" match="any"/> <else-if type="patent"> <group delimiter=" "> <text variable="authority"/> <text variable="number"/> </group> </else-if> <else> <text variable="genre" text-case="capitalize-first"/> </else> </choose> </group> </macro> <macro name="container-title-note"> <group delimiter=" "> <choose> <if type="chapter paper-conference" match="any"> <text term="in"/> </if> </choose> <choose> <if type="bill legislation legal_case" match="none"> <text variable="container-title" text-case="title" font-style="italic"/> </if> </choose> </group> </macro> <macro name="container-title"> <group delimiter=" "> <choose> <if type="chapter paper-conference" match="any"> <text term="in" text-case="capitalize-first"/> </if> </choose> <choose> <if type="bill legislation legal_case" match="none"> <text variable="container-title" text-case="title" font-style="italic"/> </if> </choose> </group> </macro> <macro name="collection-title"> <choose> <if match="none" type="article-journal"> <choose> <if match="none" is-numeric="collection-number"> <group delimiter=", "> <text variable="collection-title" text-case="title"/> <text variable="collection-number"/> </group> </if> <else> <group delimiter=" "> <text variable="collection-title" text-case="title"/> <text variable="collection-number"/> </group> </else> </choose> </if> </choose> </macro> <macro name="collection-title-journal"> <choose> <if type="article-journal"> <group delimiter=" "> <text variable="collection-title"/> <text variable="collection-number"/> </group> </if> </choose> </macro> <macro name="edition-note"> <choose> <if type="book chapter graphic motion_picture paper-conference report song" match="any"> <choose> <if is-numeric="edition"> <group delimiter=" "> <number variable="edition" form="ordinal"/> <text term="edition" form="short"/> </group> </if> <else> <text variable="edition"/> </else> </choose> </if> </choose> </macro> <macro name="edition"> <choose> <if type="book chapter graphic motion_picture paper-conference report song" match="any"> <choose> <if is-numeric="edition"> <group delimiter=" "> <number variable="edition" form="ordinal"/> <text term="edition" form="short"/> </group> </if> <else> <text variable="edition" text-case="capitalize-first" suffix="."/> </else> </choose> </if> </choose> </macro> <macro name="locators-note-join-with-space"> <choose> <if type="article-journal" variable="volume" match="all"> <choose> <if match="none" variable="collection-title"> <text macro="locators-note"/> </if> </choose> </if> </choose> </macro> <macro name="locators-note-join-with-comma"> <choose> <if type="article-journal" match="none"> <text macro="locators-note"/> </if> <else-if type="article-journal"> <choose> <if variable="volume" match="none"> <text macro="locators-note"/> </if> <else-if match="any" variable="collection-title"> <text macro="locators-note"/> </else-if> </choose> </else-if> </choose> </macro> <macro name="locators-note"> <choose> <if type="article-journal"> <group delimiter=", "> <text macro="collection-title-journal"/> <number variable="volume"/> <group delimiter=" "> <text term="issue" form="short"/> <number variable="issue"/> </group> </group> </if> <else-if type="bill legislation legal_case" match="any"> <text macro="legal-cites"/> </else-if> <else-if type="book chapter graphic motion_picture paper-conference report song" match="any"> <group delimiter=", "> <text macro="edition-note"/> <group delimiter=" "> <text term="volume" form="short"/> <number variable="volume" form="numeric"/> </group> <choose> <if variable="locator" match="none"> <group delimiter=" "> <number variable="number-of-volumes" form="numeric"/> <text term="volume" form="short" plural="true"/> </group> </if> </choose> </group> </else-if> </choose> </macro> <macro name="legal-cites"> <choose> <if type="legal_case" match="any"> <group delimiter=" "> <choose> <if variable="container-title"> <text variable="volume"/> <text variable="container-title"/> <group delimiter=" "> <!--change to label variable="section" as that becomes available --> <text term="section" form="symbol"/> <text variable="section"/> </group> <text variable="page"/> </if> <else> <text variable="number" prefix="No. "/> </else> </choose> </group> </if> <else-if type="bill legislation" match="any"> <group delimiter=", "> <choose> <if variable="number"> <!--There's a public law number--> <text variable="number" prefix="Pub. L. No. "/> <group delimiter=" "> <!--change to label variable="section" as that becomes available --> <text term="section" form="symbol"/> <text variable="section"/> </group> <group delimiter=" "> <text variable="volume"/> <text variable="container-title"/> <text variable="page-first"/> </group> </if> <else> <group delimiter=" "> <text variable="volume"/> <text variable="container-title"/> <!--change to label variable="section" as that becomes available --> <text term="section" form="symbol"/> <text variable="section"/> </group> </else> </choose> </group> </else-if> </choose> </macro> <macro name="locators-join-with-space"> <choose> <if type="article-journal" variable="volume" match="all"> <choose> <if match="none" variable="collection-title"> <text macro="locators"/> </if> </choose> </if> </choose> </macro> <macro name="locators-join-with-comma"> <choose> <if type="bill chapter legislation legal_case paper-conference" match="any"> <text macro="locators"/> </if> <else-if type="article-journal"> <choose> <if variable="volume" match="none"> <text macro="locators"/> </if> <else-if match="any" variable="collection-title"> <text macro="locators"/> </else-if> </choose> </else-if> </choose> </macro> <macro name="locators-join-with-period"> <choose> <if type="bill legislation legal_case article-journal chapter paper-conference" match="none"> <text macro="locators"/> </if> </choose> </macro> <macro name="locators"> <choose> <if type="article-journal"> <group delimiter=", "> <text macro="collection-title-journal"/> <number variable="volume"/> <group delimiter=" "> <text term="issue" form="short"/> <number variable="issue"/> </group> </group> </if> <else-if type="bill legislation legal_case" match="any"> <text macro="legal-cites"/> </else-if> <else-if type="book graphic motion_picture report song" match="any"> <group delimiter=". "> <text macro="edition"/> <group delimiter=" "> <text term="volume" form="short" text-case="capitalize-first"/> <number variable="volume" form="numeric"/> </group> <group delimiter=" "> <number variable="number-of-volumes" form="numeric"/> <text term="volume" form="short" plural="true"/> </group> </group> </else-if> <else-if type="chapter paper-conference" match="any"> <group delimiter=". "> <text macro="edition"/> <choose> <if variable="page" match="none"> <group delimiter=" "> <text term="volume" form="short" text-case="capitalize-first"/> <number variable="volume" form="numeric"/> </group> </if> </choose> </group> </else-if> </choose> </macro> <macro name="locators-newspaper"> <choose> <if type="article-newspaper"> <group delimiter=", "> <group delimiter=" "> <number variable="edition"/> <text term="edition"/> </group> <group delimiter=" "> <text term="section" form="short"/> <text variable="section"/> </group> </group> </if> </choose> </macro> <macro name="event-note"> <text variable="event"/> </macro> <macro name="event"> <choose> <if variable="title"> <group delimiter=" "> <text term="presented at"/> <text variable="event"/> </group> </if> <else> <group delimiter=" "> <text term="presented at" text-case="capitalize-first"/> <text variable="event"/> </group> </else> </choose> </macro> <macro name="originally-published"> <group delimiter=", "> <group delimiter=": "> <text variable="original-publisher-place"/> <text variable="original-publisher"/> </group> <date variable="original-date" form="text" date-parts="year"/> </group> </macro> <macro name="reprint-note"> <!--needs localization--> <choose> <if variable="original-date issued" match="all"> <choose> <!--for whatever reason in notes, when we have both original and new publishers, reprint doesn't appear--> <if variable="original-publisher original-publisher-place" match="none"> <text value="repr."/> </if> </choose> </if> </choose> </macro> <macro name="reprint"> <!--needs localization--> <choose> <if variable="original-date issued" match="all"> <text value="reprint" text-case="capitalize-first"/> </if> </choose> </macro> <macro name="publisher"> <choose> <if type="thesis"> <text variable="publisher"/> </if> <else-if type="speech"> <text variable="event-place"/> </else-if> <else> <group delimiter=": "> <text variable="publisher-place"/> <text variable="publisher"/> </group> </else> </choose> </macro> <macro name="issued"> <choose> <if variable="issued"> <choose> <if type="graphic report" match="any"> <date variable="issued" form="text"/> </if> <else-if type="legal_case"> <group delimiter=" "> <text variable="authority"/> <choose> <if variable="container-title" match="any"> <!--Only print year for cases published in reporters--> <date variable="issued" form="numeric" date-parts="year"/> </if> <else> <date variable="issued" form="text"/> </else> </choose> </group> </else-if> <else-if type="book bill chapter graphic legislation motion_picture paper-conference report song thesis" match="any"> <date variable="issued"> <date-part name="year"/> </date> </else-if> <else-if type="patent"> <group delimiter=", "> <group delimiter=" "> <!--Needs Localization--> <text value="filed"/> <date variable="submitted" form="text"/> </group> <group delimiter=" "> <choose> <if variable="issued submitted" match="all"> <text term="and"/> </if> </choose> <!--Needs Localization--> <text value="issued"/> <date variable="issued" form="text"/> </group> </group> </else-if> <else> <date variable="issued" form="text"/> </else> </choose> </if> <else-if variable="status"> <text variable="status"/> </else-if> <else-if variable="accessed URL" match="all"/> <else> <text term="no date" form="short"/> </else> </choose> </macro> <macro name="point-locators-subsequent"> <choose> <if type="legal_case" variable="locator" match="all"> <choose> <if locator="page"> <group delimiter=":"> <number variable="volume"/> <text variable="locator"/> </group> </if> <else> <group delimiter=" "> <label variable="locator" form="short"/> <text variable="locator"/> </group> </else> </choose> </if> <else-if variable="locator"> <choose> <if locator="page" match="none"> <group delimiter=" "> <choose> <if type="book graphic motion_picture report song" match="any"> <choose> <if variable="volume"> <group delimiter=", "> <group delimiter=" "> <text term="volume" form="short"/> <number variable="volume" form="numeric"/> </group> <label variable="locator" form="short"/> </group> </if> <else> <label variable="locator" form="short"/> </else> </choose> </if> <else> <label variable="locator" form="short"/> </else> </choose> <text variable="locator"/> </group> </if> <else-if type="book graphic motion_picture report song" match="any"> <group delimiter=":"> <number variable="volume" form="numeric"/> <text variable="locator"/> </group> </else-if> <else> <text variable="locator"/> </else> </choose> </else-if> </choose> </macro> <macro name="point-locators-join-with-colon"> <choose> <if type="article-journal"> <choose> <if variable="locator page" match="any"> <choose> <if variable="volume issue" match="any"> <text macro="point-locators"/> </if> </choose> </if> </choose> </if> </choose> </macro> <macro name="point-locators-join-with-comma"> <choose> <if type="article-journal" match="none"> <text macro="point-locators"/> </if> <else-if variable="volume issue" match="none"> <text macro="point-locators"/> </else-if> </choose> </macro> <macro name="point-locators"> <choose> <if variable="locator" match="none"> <choose> <if type="article-journal chapter paper-conference" match="any"> <text variable="page"/> </if> </choose> </if> <else-if type="article-journal"> <group delimiter=" "> <choose> <if locator="page" match="none"> <label variable="locator" form="short" suffix=" "/> </if> </choose> <text variable="locator"/> </group> </else-if> <else-if type="legal_case"/> <else> <group delimiter=" "> <choose> <if locator="page" match="none"> <label variable="locator" form="short"/> </if> </choose> <text variable="locator"/> </group> </else> </choose> </macro> <macro name="locators-chapter"> <choose> <if type="chapter paper-conference" match="any"> <choose> <if variable="author container-author" match="all"/> <else> <choose> <if variable="page"> <number variable="volume" suffix=":"/> <text variable="page"/> </if> </choose> </else> </choose> </if> </choose> </macro> <macro name="locators-journal-join-with-colon"> <choose> <if type="article-journal"> <choose> <if variable="volume issue" match="any"> <text variable="page"/> </if> </choose> </if> </choose> </macro> <macro name="locators-journal-join-with-comma"> <choose> <if type="article-journal"> <choose> <if variable="volume issue" match="none"> <text variable="page"/> </if> </choose> </if> </choose> </macro> <macro name="archive-note"> <choose> <if type="thesis"> <group delimiter=" "> <text variable="archive"/> <text variable="archive_location" prefix="(" suffix=")"/> </group> </if> <else> <group delimiter=", "> <text variable="archive_location"/> <text variable="archive"/> <text variable="archive-place"/> </group> </else> </choose> </macro> <macro name="archive"> <choose> <if type="thesis"> <group delimiter=" "> <text variable="archive"/> <text variable="archive_location" prefix="(" suffix=")"/> </group> </if> <else> <group delimiter=". "> <text variable="archive_location" text-case="capitalize-first"/> <text variable="archive"/> <text variable="archive-place"/> </group> </else> </choose> </macro> <macro name="issue-note-join-with-space"> <choose> <if type="article-journal bill legislation legal_case manuscript thesis" variable="publisher-place publisher" match="any"> <!--Chicago doesn't use publisher/place for Newspapers and we want the date delimited by a comma--> <choose> <if type="article-newspaper" match="none"> <choose> <if type="article-journal" match="none"> <text macro="issue-note"/> </if> <else-if variable="issue volume" match="any"> <text macro="issue-note"/> </else-if> </choose> </if> </choose> </if> </choose> </macro> <macro name="issue-note-join-with-comma"> <choose> <if type="article-journal bill legislation legal_case manuscript thesis" variable="publisher-place publisher" match="none"> <text macro="issue-note"/> </if> <else-if type="article-newspaper"> <text macro="issue-note"/> </else-if> <else-if type="article-journal"> <choose> <if variable="volume issue" match="none"> <text macro="issue-note"/> </if> </choose> </else-if> </choose> </macro> <macro name="issue-note"> <choose> <if type="bill legislation legal_case" match="any"> <text macro="issued" prefix="(" suffix=")"/> </if> <else-if type="article-journal"> <choose> <if variable="volume issue" match="any"> <text macro="issued" prefix="(" suffix=")"/> </if> <else> <text macro="issued"/> </else> </choose> </else-if> <else-if type="article-newspaper"> <text macro="issued"/> </else-if> <else-if variable="publisher-place event-place publisher genre" match="any"> <group prefix="(" suffix=")" delimiter=", "> <choose> <if variable="title" match="none"/> <else-if type="manuscript thesis speech" match="any"> <text variable="genre"/> </else-if> </choose> <text macro="event-note"/> <group delimiter="; "> <text macro="originally-published"/> <group delimiter=", "> <text macro="reprint-note"/> <text macro="publisher"/> </group> </group> <text macro="issued"/> </group> </else-if> <else> <text macro="issued"/> </else> </choose> </macro> <macro name="issue-join-with-space"> <choose> <if type="article-journal" match="any"> <choose> <if variable="issue volume" match="any"> <text macro="issue"/> </if> </choose> </if> <else-if type="bill legislation legal_case" match="any"> <text macro="issue"/> </else-if> </choose> </macro> <macro name="issue-join-with-period"> <choose> <if type="article-journal bill legislation legal_case" match="none"> <choose> <if type="speech" variable="publisher publisher-place" match="any"> <text macro="issue"/> </if> </choose> </if> </choose> </macro> <macro name="issue-join-with-comma"> <choose> <if type="bill legislation legal_case" match="none"> <choose> <if type="article-journal" match="none"> <choose> <if type="speech" variable="publisher publisher-place" match="none"> <text macro="issue"/> </if> </choose> </if> <else-if variable="volume issue" match="none"> <text macro="issue"/> </else-if> </choose> </if> </choose> </macro> <macro name="issue"> <choose> <if type="bill legislation legal_case" match="any"> <text macro="issued" prefix="(" suffix=")"/> </if> <else-if type="article-journal"> <choose> <if variable="issue volume" match="any"> <text macro="issued" prefix="(" suffix=")"/> </if> <else> <text macro="issued"/> </else> </choose> </else-if> <else-if type="speech"> <group delimiter=", "> <group delimiter=" "> <choose> <if variable="title" match="none"/> <else> <text variable="genre" text-case="capitalize-first"/> </else> </choose> <text macro="event"/> </group> <text variable="event-place"/> <text macro="issued"/> </group> </else-if> <!--Chicago doesn't use publisher/place for Newspapers --> <else-if type="article-newspaper"> <text macro="issued"/> </else-if> <else-if variable="publisher-place publisher" match="any"> <group delimiter=", "> <choose> <if type="thesis"> <text variable="genre" text-case="capitalize-first"/> </if> </choose> <group delimiter=". "> <text macro="originally-published"/> <group delimiter=", "> <text macro="reprint"/> <text macro="publisher"/> </group> </group> <text macro="issued"/> </group> </else-if> <else> <text macro="issued"/> </else> </choose> </macro> <macro name="access-note"> <group delimiter=", "> <choose> <if type="graphic report" match="any"> <text macro="archive-note"/> </if> <else-if type="article-journal bill book chapter legal_case legislation motion_picture paper-conference" match="none"> <text macro="archive-note"/> </else-if> </choose> <choose> <if variable="issued" match="none"> <group delimiter=" "> <text term="accessed"/> <date variable="accessed" form="text"/> </group> </if> </choose> <choose> <if type="legal_case" match="none"> <choose> <if variable="DOI"> <text variable="DOI" prefix="doi:"/> </if> <else> <text variable="URL"/> </else> </choose> </if> </choose> </group> </macro> <macro name="access"> <group delimiter=". "> <choose> <if type="graphic report" match="any"> <text macro="archive"/> </if> <else-if type="article-journal bill book chapter legal_case legislation motion_picture paper-conference" match="none"> <text macro="archive"/> </else-if> </choose> <choose> <if variable="issued" match="none"> <group delimiter=" "> <text term="accessed" text-case="capitalize-first"/> <date variable="accessed" form="text"/> </group> </if> </choose> <choose> <if type="legal_case" match="none"> <choose> <if variable="DOI"> <text variable="DOI" prefix="doi:"/> </if> <else> <text variable="URL"/> </else> </choose> </if> </choose> </group> </macro> <macro name="case-locator-subsequent"> <choose> <if type="legal_case"> <group delimiter=" "> <text variable="volume"/> <text variable="container-title"/> </group> </if> </choose> </macro> <macro name="case-pinpoint-subsequent"> <choose> <if type="legal_case"> <group delimiter=" "> <choose> <if locator="page"> <text term="at"/> <text variable="locator"/> </if> <else> <label variable="locator"/> <text variable="locator"/> </else> </choose> </group> </if> </choose> </macro> <citation et-al-min="4" et-al-use-first="1" disambiguate-add-names="true"> <layout suffix="." delimiter="; "> <choose> <if position="ibid-with-locator"> <group delimiter=", "> <text term="ibid"/> <text macro="point-locators-subsequent"/> </group> </if> <else-if position="ibid"> <text term="ibid"/> </else-if> <else-if position="subsequent"> <group delimiter=", "> <text macro="contributors-short"/> <group delimiter=" "> <group delimiter=", "> <text macro="title-short"/> <!--if title & author are the same: --> <text macro="date-disambiguate"/> <text macro="case-locator-subsequent"/> </group> <text macro="case-pinpoint-subsequent"/> </group> <choose> <if match="none" type="legal_case"> <text macro="point-locators-subsequent"/> </if> </choose> </group> </else-if> <else> <group delimiter=", "> <group delimiter=": "> <group delimiter=", "> <group delimiter=" "> <group delimiter=", "> <group delimiter=" "> <group delimiter=", "> <group delimiter=", "> <text macro="contributors-note"/> <text macro="title-note"/> </group> <text macro="description-note"/> <text macro="secondary-contributors-note"/> <text macro="container-title-note"/> <text macro="container-contributors-note"/> </group> <text macro="locators-note-join-with-space"/> </group> <text macro="locators-note-join-with-comma"/> <text macro="collection-title"/> <text macro="issue-note-join-with-comma"/> </group> <text macro="issue-note-join-with-space"/> </group> <text macro="locators-newspaper"/> <text macro="point-locators-join-with-comma"/> </group> <text macro="point-locators-join-with-colon"/> </group> <text macro="access-note"/> </group> </else> </choose> </layout> </citation> <bibliography hanging-indent="true" et-al-min="11" et-al-use-first="7" subsequent-author-substitute="&#8212;&#8212;&#8212;" entry-spacing="0"> <sort> <key macro="contributors-sort"/> <key variable="title"/> <key variable="genre"/> <key variable="issued"/> </sort> <layout suffix="."> <group delimiter=". "> <group delimiter=": "> <group delimiter=", "> <group delimiter=" "> <group delimiter=". "> <group delimiter=" "> <group delimiter=", "> <group delimiter=". "> <group delimiter=". "> <text macro="contributors"/> <text macro="title"/> </group> <text macro="description"/> <text macro="secondary-contributors"/> <group delimiter=", "> <text macro="container-title"/> <text macro="container-contributors"/> </group> <text macro="locators-join-with-period"/> </group> <text macro="locators-join-with-comma"/> <text macro="locators-chapter"/> </group> <text macro="locators-join-with-space"/> </group> <text macro="collection-title"/> <text macro="issue-join-with-period"/> </group> <text macro="issue-join-with-space"/> </group> <text macro="issue-join-with-comma"/> <text macro="locators-journal-join-with-comma"/> <text macro="locators-newspaper"/> </group> <text macro="locators-journal-join-with-colon"/> </group> <text macro="access"/> </group> </layout> </bibliography> </style> `;
+  science:string ='<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="sort-only" default-locale="en-US"> <info> <title>Science</title> <id>http://www.zotero.org/styles/science</id> <link href="http://www.zotero.org/styles/science" rel="self"/> <link href="http://www.sciencemag.org/about/authors/prep/res/refs.dtl" rel="documentation"/> <author> <name>Julian Onions</name> <email>julian.onions@gmail.com</email> </author> <contributor> <name>Sebastian Karcher</name> </contributor> <contributor> <name>Greg Barendt</name> </contributor> <category citation-format="numeric"/> <category field="science"/> <issn>0036-8075</issn> <eissn>1095-9203</eissn> <summary>The Science journal style.</summary> <updated>2014-08-28T01:36:46+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <macro name="editor"> <names variable="editor" delimiter=", "> <name initialize-with=". " delimiter=", " delimiter-precedes-last="always"/> <label form="short" prefix=", " text-case="capitalize-first"/> </names> </macro> <macro name="author"> <names variable="author"> <name sort-separator=", " initialize-with=". " delimiter=", " delimiter-precedes-last="always"/> <label form="short" prefix=", " text-case="capitalize-first"/> <et-al font-style="italic"/> <substitute> <names variable="editor"/> </substitute> </names> </macro> <macro name="access"> <choose> <if variable="page" match="none"> <text macro="access-value"/> </if> <else-if is-numeric="page" match="none"> <text macro="access-value"/> </else-if> </choose> </macro> <macro name="access-value"> <choose> <if variable="DOI"> <text variable="DOI" prefix=", doi:"/> </if> <else> <group prefix=" (" suffix=")"> <text value="available at "/> <text variable="URL"/> </group> </else> </choose> </macro> <macro name="title"> <choose> <if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <text variable="title" font-style="italic"/> </if> <else> <text variable="title"/> </else> </choose> </macro> <macro name="article-details"> <group delimiter=", "> <group delimiter=". "> <text macro="title"/> <text form="short" variable="container-title" font-style="italic"/> <text variable="volume" font-weight="bold"/> </group> <text variable="page"/> </group> <text macro="issued" prefix=" (" suffix=")"/> <text macro="access"/> </macro> <macro name="publisher"> <group delimiter=", "> <text variable="publisher"/> <text variable="publisher-place"/> </group> </macro> <macro name="pages"> <label variable="page" form="short" suffix=" "/> <text variable="page" form="short"/> </macro> <macro name="issued"> <date variable="issued" delimiter=" "> <date-part name="year"/> </date> </macro> <macro name="edition"> <choose> <if is-numeric="edition"> <group delimiter=" "> <text term="edition" form="short"/> <number variable="edition" form="numeric"/> </group> </if> <else> <text variable="edition" suffix="."/> </else> </choose> </macro> <citation collapse="citation-number"> <sort> <key variable="citation-number"/> </sort> <layout prefix="(" suffix=")" delimiter=", "> <text variable="citation-number" font-style="italic"/> </layout> </citation> <bibliography et-al-min="6" et-al-use-first="1" second-field-align="flush"> <layout suffix="."> <text variable="citation-number" suffix=". "/> <group delimiter=", "> <text macro="author"/> <choose> <if type="thesis"> <group delimiter=" "> <group delimiter=", "> <group> <!-- Always print, even if no university given --> <text value="thesis"/> </group> <text macro="publisher"/> </group> <text macro="issued" prefix="(" suffix=")"/> </group> </if> <else-if type="bill book graphic legal_case legislation motion_picture song chapter paper-conference" match="any"> <group delimiter=" "> <choose> <if type="chapter paper-conference" match="any"> <group delimiter=", "> <group delimiter=" "> <text term="in"/> <text variable="container-title" font-style="italic"/> </group> <text macro="editor"/> </group> </if> <else> <text macro="title"/> </else> </choose> <group prefix="(" suffix=")" delimiter="; "> <group delimiter=", "> <text macro="publisher"/> <text macro="edition"/> <text macro="issued"/> </group> <text variable="URL"/> </group> </group> <group delimiter=" of "> <group> <label variable="volume" form="short" suffix=" "/> <number variable="volume"/> </group> <text variable="collection-title" font-style="italic"/> </group> <choose> <if type="chapter paper-conference" match="any"> <text macro="pages"/> </if> </choose> </else-if> <else-if type="article-journal"> <choose> <if variable="page"> <choose> <if is-numeric="page" match="none"> <group> <group delimiter=", "> <text variable="container-title" form="short" font-style="italic"/> <group> <text term="in press"/> </group> </group> <text macro="access"/> </group> </if> <else> <text macro="article-details"/> </else> </choose> </if> <else> <text macro="article-details"/> </else> </choose> </else-if> <else-if type="report"> <group> <group delimiter=", "> <text variable="title" quotes="true"/> <text variable="collection-title" font-style="italic"/> </group> <group prefix=" (" suffix=")" delimiter=", "> <group delimiter=" "> <text variable="genre" form="short"/> <number variable="number"/> </group> <text variable="publisher"/> <text variable="publisher-place"/> <text macro="issued"/> </group> </group> <text macro="pages"/> <text macro="access"/> </else-if> <else> <group> <group delimiter=", "> <text macro="editor"/> <group delimiter=". "> <text macro="title"/> <text form="short" variable="container-title" font-style="italic"/> <text variable="volume" font-weight="bold"/> </group> </group> <text macro="issued" prefix=" (" suffix=")"/> </group> <text macro="pages"/> <text macro="access"/> </else> </choose> </group> </layout> </bibliography> </style>';
+  cell:string ='<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" version="1.0" class="in-text" default-locale="en-US" demote-non-dropping-particle="sort-only" page-range-format="expanded"> <info> <title>Cell</title> <id>http://www.zotero.org/styles/cell</id> <link href="http://www.zotero.org/styles/cell" rel="self"/> <link href="http://www.cell.com/authors" rel="documentation"/> <author> <name>Adam Mark</name> <email>a.mark@uoguelph.ca</email> </author> <contributor> <name>Julian Onions</name> <email>julian.onions@gmail.com</email> </contributor> <contributor> <name>Aurimas Vinckevicius</name> <email>aurimas.dev@gmail.com</email> </contributor> <category citation-format="author-date"/> <category field="biology"/> <issn>0092-8674</issn> <eissn>1097-4172</eissn> <summary>The Cell journal style. Original by Julian Onions.</summary> <updated>2013-01-26T22:06:38+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <macro name="author-short"> <names variable="author"> <name form="short" and="text"/> </names> </macro> <macro name="author-count"> <names variable="author"> <name form="count"/> </names> </macro> <macro name="author"> <names variable="author"> <name name-as-sort-order="all" initialize-with="." and="text" delimiter-precedes-last="always"/> </names> </macro> <macro name="issued"> <date variable="issued"> <date-part name="year"/> </date> </macro> <macro name="publisher"> <group prefix="(" delimiter=": " suffix=")"> <text variable="publisher-place"/> <text variable="publisher"/> </group> </macro> <macro name="editor"> <names variable="editor"> <name initialize-with="." and="text" delimiter-precedes-last="always"/> <label form="short" prefix=", "/> </names> </macro> <citation et-al-min="3" et-al-use-first="1" disambiguate-add-year-suffix="true" collapse="year"> <sort> <key macro="author-short" names-min="1" names-use-first="1"/> <key macro="author-count" names-min="3" names-use-first="3"/> <key macro="author" names-min="3" names-use-first="1"/> <key macro="issued"/> <key variable="title"/> </sort> <layout prefix="(" suffix=")" delimiter="; "> <group delimiter=", "> <text macro="author-short"/> <text macro="issued"/> </group> </layout> </citation> <bibliography et-al-min="11" et-al-use-first="10"> <sort> <key macro="author-short" names-min="1" names-use-first="1"/> <key macro="author-count" names-min="3" names-use-first="3"/> <key macro="author" names-min="3" names-use-first="1"/> <key macro="issued"/> </sort> <layout suffix="."> <group delimiter=" "> <text macro="author"/> <text macro="issued" prefix="(" suffix=")."/> <choose> <if type="article article-magazine article-newspaper article-journal review" match="any"> <text variable="title" suffix="."/> <text variable="container-title" form="short" text-case="title"/> <group delimiter=", "> <text variable="volume" font-style="italic"/> <text variable="page"/> </group> </if> <else-if type="chapter paper-conference" match="any"> <text variable="title" suffix="."/> <text variable="container-title" prefix="In " suffix="," text-case="title"/> <text macro="editor"/> <text macro="publisher" suffix=","/> <label variable="page" form="short"/> <text variable="page"/> </else-if> <else-if type="thesis"> <text variable="title" suffix="."/> <text variable="genre" suffix="."/> <text variable="publisher"/> </else-if> <else> <text variable="title"/> <text macro="publisher"/> </else> </choose> </group> </layout> </bibliography> </style> ';
+  mla:string ='<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="never"> <info> <title>Modern Language Association 7th edition</title> <title-short>MLA</title-short> <id>http://www.zotero.org/styles/modern-language-association</id> <link href="http://www.zotero.org/styles/modern-language-association" rel="self"/> <link href="http://owl.english.purdue.edu/owl/section/2/11/" rel="documentation"/> <author> <name>Ilouise S. Bradford</name> <email>isbradford@gmail.com</email> </author> <contributor> <name>Sarah Ficke</name> <email>sficke@email.unc.edu</email> </contributor> <contributor> <name>Sebastian Karcher</name> <email>karcher@u.northwestern.edu</email> </contributor> <contributor> <name>Christian Werthschulte</name> <email>Christian.Werthschulte@rub.de</email> </contributor> <contributor> <name>Simon Kornblith</name> <email>simon@simonster.com</email> </contributor> <contributor> <name>James Johnston</name> <email>thejamesjohnston@gmail.com</email> </contributor> <category citation-format="author"/> <category field="generic-base"/> <summary>This style adheres to the MLA 7th edition handbook and contains modifications to these types of sources: e-mail, forum posts, interviews, manuscripts, maps, presentations, TV broadcasts, and web pages.</summary> <updated>2014-07-06T20:05:10+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <locale xml:lang="en"> <terms> <term name="month-01" form="short">Jan.</term> <term name="month-02" form="short">Feb.</term> <term name="month-03" form="short">Mar.</term> <term name="month-04" form="short">Apr.</term> <term name="month-05" form="short">May</term> <term name="month-06" form="short">June</term> <term name="month-07" form="short">July</term> <term name="month-08" form="short">Aug.</term> <term name="month-09" form="short">Sept.</term> <term name="month-10" form="short">Oct.</term> <term name="month-11" form="short">Nov.</term> <term name="month-12" form="short">Dec.</term> <term name="volume" form="short"> <single>Vol.</single> <multiple>vols</multiple> </term> <term name="edition" form="short">ed</term> <term name="editor" form="verb-short">ed.</term> <term name="translator" form="verb-short">trans.</term> <term name="translator" form="short">trans.</term> </terms> </locale> <macro name="editor-translator"> <names variable="editor translator" delimiter=". "> <label form="verb-short" text-case="capitalize-first" suffix=" "/> <name and="text" delimiter=", "/> </names> </macro> <macro name="author"> <names variable="author"> <name name-as-sort-order="first" and="text" sort-separator=", " delimiter=", " delimiter-precedes-last="always"/> <label form="short" prefix=", "/> <substitute> <names variable="editor"/> <names variable="translator"/> <text macro="title"/> </substitute> </names> </macro> <macro name="author-short"> <names variable="author"> <name form="short" and="text" delimiter=", " initialize-with=". "/> <substitute> <names variable="editor"/> <names variable="translator"/> <text macro="title-short"/> </substitute> </names> </macro> <macro name="access"> <group delimiter=" "> <date variable="accessed"> <date-part name="day" suffix=" "/> <date-part name="month" form="short" suffix=" "/> <date-part name="year"/> </date> </group> </macro> <macro name="issued-full-date"> <choose> <if variable="issued"> <date variable="issued"> <date-part name="day" suffix=" "/> <date-part name="month" form="short" suffix=" " strip-periods="false"/> <date-part name="year"/> </date> </if> <else> <text term="no date" form="short"/> </else> </choose> </macro> <macro name="medium"> <choose> <if type="motion_picture"> <choose> <if variable="medium"> <text variable="medium" prefix=" "/> </if> <else> <text value="Film" prefix=" "/> </else> </choose> </if> <else-if type="broadcast"> <choose> <if variable="medium"> <text variable="medium" prefix=" "/> </if> <else> <text value="Television" prefix=" "/> </else> </choose> </else-if> <else-if type="manuscript"> <text value=""/> </else-if> <else-if type="personal_communication" match="any"> <text value="" prefix=" "/> </else-if> <else-if type="speech" match="any"> <text value=""/> </else-if> <else-if type="interview"> <text variable="medium" prefix=" "/> </else-if> <else-if type="song"> <choose> <if variable="medium"> <text variable="medium" prefix=" "/> </if> <else> <text value="Audio Recording" prefix=" "/> </else> </choose> </else-if> <else> <choose> <if variable="URL DOI" match="any"> <text variable="source" prefix=" " suffix="." font-style="italic"/> <group> <text value="Web." prefix=" "/> </group> <text prefix=" " suffix="." macro="access"/> </if> <else> <text value="Print" prefix=" "/> </else> </choose> </else> </choose> </macro> <macro name="title"> <choose> <if type="bill book graphic legal_case legislation manuscript motion_picture report song" match="any"> <text variable="title" font-style="italic" text-case="title"/> </if> <else-if type="interview personal_communication" match="any"> <text variable="title" text-case="title" quotes="false"/> </else-if> <else> <text variable="title" text-case="title" quotes="true"/> </else> </choose> </macro> <macro name="title-short"> <choose> <if type="bill book graphic legal_case legislation manuscript motion_picture report song" match="any"> <text variable="title" text-case="title" form="short" font-style="italic"/> </if> <else> <text variable="title" text-case="title" form="short" quotes="true"/> </else> </choose> </macro> <macro name="pages"> <choose> <if variable="page"> <text variable="page"/> </if> <else-if type="personal_communication interview" match="any"> <text value=""/> </else-if> <else> <text value="n. pag"/> </else> </choose> </macro> <macro name="edition"> <choose> <if is-numeric="edition"> <group delimiter=" "> <number variable="edition" form="ordinal"/> <text term="edition" form="short"/> </group> </if> <else> <text variable="edition"/> </else> </choose> </macro> <macro name="volume"> <choose> <if is-numeric="volume"> <group delimiter=" "> <text term="volume" form="short" strip-periods="false"/> <number variable="volume"/> </group> </if> <else> <text variable="volume"/> </else> </choose> </macro> <macro name="number-of-volumes-only"> <choose> <if variable="volume" match="none"> <choose> <if is-numeric="number-of-volumes"> <group delimiter=" "> <number variable="number-of-volumes"/> <text term="volume" form="short" plural="true" strip-periods="true"/> </group> </if> <else> <text variable="number-of-volumes"/> </else> </choose> </if> </choose> </macro> <macro name="number-of-volumes-optional"> <choose> <if variable="volume"> <choose> <if is-numeric="number-of-volumes"> <group delimiter=" "> <number variable="number-of-volumes"/> <text term="volume" form="short" plural="true" strip-periods="true"/> </group> </if> <else> <text variable="number-of-volumes"/> </else> </choose> </if> </choose> </macro> <macro name="collection-title"> <text variable="collection-title" text-case="title" prefix=" "/> </macro> <macro name="collection-number"> <text variable="collection-number" prefix=" " suffix="."/> </macro> <macro name="publisher"> <choose> <if variable="publisher"> <text variable="publisher"/> </if> <else> <text value="N.p."/> </else> </choose> </macro> <macro name="publisher-year"> <group delimiter=", "> <group delimiter=": "> <text variable="publisher-place"/> <text macro="publisher"/> </group> <date variable="issued"> <date-part name="year"/> </date> </group> </macro> <citation et-al-min="4" et-al-use-first="1" disambiguate-add-names="true" disambiguate-add-givenname="true"> <layout prefix="(" suffix=")" delimiter="; "> <group delimiter=" "> <choose> <if variable="author editor translator" match="any"> <group delimiter=", "> <text macro="author-short"/> <choose> <if disambiguate="true"> <text macro="title-short"/> </if> </choose> </group> </if> <else> <text macro="title-short"/> </else> </choose> <text variable="locator"/> </group> </layout> </citation> <bibliography hanging-indent="true" et-al-min="4" et-al-use-first="1" line-spacing="2" entry-spacing="0" subsequent-author-substitute="---"> <sort> <key macro="author"/> <key variable="title"/> </sort> <layout suffix="."> <text macro="author" suffix="."/> <text macro="title" prefix=" " suffix="."/> <choose> <if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <text macro="editor-translator" prefix=" " suffix="."/> <text macro="edition" prefix=" " suffix="."/> <text macro="volume" prefix=" " suffix="."/> <text macro="number-of-volumes-only" prefix=" " suffix="."/> <text macro="publisher-year" prefix=" " suffix="."/> </if> <else-if type="chapter paper-conference" match="any"> <group> <text variable="container-title" text-case="title" font-style="italic" prefix=" " suffix="."/> <text macro="editor-translator" prefix=" " suffix="."/> <text macro="edition" prefix=" " suffix="."/> <text macro="volume" prefix=" " suffix="."/> <text macro="number-of-volumes-only" prefix=" " suffix="."/> <text macro="publisher-year" prefix=" " suffix="."/> </group> <text variable="page" prefix=" " suffix="."/> </else-if> <else-if type="thesis"> <text variable="genre" prefix=" " suffix="."/> <group delimiter=", "> <text macro="publisher" prefix=" "/> <date variable="issued" prefix=" " suffix="."> <date-part name="year"/> </date> </group> <text variable="archive_location" prefix=" " suffix="."/> </else-if> <else-if type="manuscript"> <date variable="issued" prefix=" " suffix="."> <date-part name="year"/> </date> <text variable="genre" prefix=" " suffix="."/> <text variable="archive_location" prefix=" " suffix="."/> <text variable="publisher-place" prefix=" "/> </else-if> <else-if type="personal_communication"> <date variable="issued" prefix=" " suffix="."> <date-part name="day" suffix=" "/> <date-part name="month" form="short" suffix=" "/> <date-part name="year"/> </date> <choose> <if variable="genre"> <text prefix=" " suffix="." variable="genre"/> </if> <else> <text prefix=" " suffix="." value="E-mail"/> </else> </choose> </else-if> <else-if type="map"> <text variable="genre" prefix=" " suffix="."/> <text variable="publisher-place" prefix=" " suffix=":"/> <text macro="publisher" prefix=" "/> <date variable="issued" prefix=" " suffix=","> <date-part name="year"/> </date> </else-if> <else-if type="speech"> <text variable="event" prefix=" " suffix="."/> <text variable="publisher-place" prefix=" " suffix="."/> <date variable="issued" prefix=" " suffix="."> <date-part name="year"/> </date> <text variable="genre" prefix=" " suffix="."/> </else-if> <else-if type="webpage post-weblog" match="any"> <text variable="genre" prefix=" " suffix="."/> <text variable="container-title" font-style="italic" prefix=" " suffix="."/> <group delimiter=", " prefix=" "> <text macro="publisher"/> <text macro="issued-full-date" suffix="."/> </group> </else-if> <else-if type="broadcast"> <text variable="container-title" font-style="italic" prefix=" " suffix="."/> <text macro="publisher" prefix=" " suffix=","/> <date variable="issued" prefix=" " suffix="."> <date-part name="day" suffix=" "/> <date-part name="month" form="short" suffix=" " strip-periods="false"/> <date-part name="year"/> </date> </else-if> <else> <group prefix=" " suffix="." delimiter=": "> <group delimiter=" "> <text macro="editor-translator" suffix="."/> <text variable="container-title" font-style="italic"/> <choose> <if type="article-journal"> <group delimiter=" "> <group delimiter="."> <text variable="volume"/> <text variable="issue"/> </group> <date variable="issued" prefix="(" suffix="):"> <date-part name="year"/> </date> </group> <text macro="pages" prefix=" "/> </if> <else> <group> <date variable="issued"> <date-part name="day" suffix=" "/> <date-part name="month" form="short" suffix=" " strip-periods="false"/> <date-part name="year"/> </date> <choose> <if variable="URL DOI" match="any"> <text variable="page" prefix=": "/> </if> <else> <text macro="pages" prefix=": "/> </else> </choose> </group> </else> </choose> </group> </group> </else> </choose> <text macro="medium" suffix="."/> <text macro="number-of-volumes-optional" suffix="." prefix=" "/> <text macro="collection-title"/> <text macro="collection-number"/> </layout> </bibliography> </style> ';
+  nature:string ='<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="sort-only" default-locale="en-GB"> <info> <title>Nature</title> <id>http://www.zotero.org/styles/nature</id> <link href="http://www.zotero.org/styles/nature" rel="self"/> <link href="http://www.nature.com/nature/authors/gta/index.html#a5.4" rel="documentation"/> <author> <name>Michael Berkowitz</name> <email>mberkowi@gmu.edu</email> </author> <category citation-format="numeric"/> <category field="science"/> <category field="generic-base"/> <issn>0028-0836</issn> <eissn>1476-4687</eissn> <updated>2014-06-22T03:46:28+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <macro name="title"> <choose> <if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <text variable="title" font-style="italic"/> </if> <else-if type="chapter" match="any"/> <else> <text variable="title"/> </else> </choose> </macro> <macro name="author"> <names variable="author"> <name sort-separator=", " delimiter=", " and="symbol" initialize-with=". " delimiter-precedes-last="never" name-as-sort-order="all"/> <label form="short" prefix=", "/> <et-al font-style="italic"/> </names> </macro> <macro name="access"> <choose> <if variable="volume"/> <else-if variable="DOI"> <text variable="DOI" prefix="doi:"/> </else-if> <else-if variable="URL"> <text term="at"/> <text variable="URL" prefix=" &lt;" suffix="&gt;"/> </else-if> </choose> </macro> <macro name="issuance"> <choose> <if type="bill book graphic legal_case legislation motion_picture report song thesis chapter paper-conference" match="any"> <group delimiter=", " prefix="(" suffix=")."> <text variable="publisher" form="long"/> <date variable="issued"> <date-part name="year"/> </date> </group> </if> <else> <date prefix="(" suffix=")." variable="issued"> <date-part name="year"/> </date> </else> </choose> </macro> <macro name="container-title"> <choose> <if type="article-journal"> <text variable="container-title" font-style="italic" form="short"/> </if> <else> <text variable="container-title" font-style="italic"/> </else> </choose> </macro> <macro name="editor"> <choose> <if type="chapter paper-conference" match="any"> <names variable="editor" prefix="(" suffix=")"> <label form="short" suffix=" "/> <name and="symbol" delimiter-precedes-last="never" initialize-with=". " name-as-sort-order="all"/> </names> </if> </choose> </macro> <citation collapse="citation-number"> <sort> <key variable="citation-number"/> </sort> <layout vertical-align="sup" delimiter=","> <text variable="citation-number"/> </layout> </citation> <bibliography et-al-min="6" et-al-use-first="1" second-field-align="flush" entry-spacing="0" line-spacing="2"> <layout> <text variable="citation-number" suffix="."/> <group delimiter=" "> <text macro="author" suffix="."/> <text macro="title" suffix="."/> <choose> <if type="chapter paper-conference" match="any"> <text term="in" form="long" plural="false"/> </if> </choose> <text macro="container-title"/> <text macro="editor"/> <group font-weight="bold"> <text variable="volume" suffix=","/> </group> <text variable="page"/> <text macro="issuance"/> <text macro="access"/> </group> </layout> </bibliography> </style> ';
+//nature_csl:string ='<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="sort-only" default-locale="en-GB"> <info> <title>Nature</title> <id>http://www.zotero.org/styles/nature</id> <link href="http://www.zotero.org/styles/nature" rel="self"/> <link href="http://www.nature.com/nature/authors/gta/index.html#a5.4" rel="documentation"/> <author> <name>Michael Berkowitz</name> <email>mberkowi@gmu.edu</email> </author> <category citation-format="numeric"/> <category field="science"/> <category field="generic-base"/> <issn>0028-0836</issn> <eissn>1476-4687</eissn> <updated>2016-03-10T03:00:48+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <macro name="title"> <choose> <if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <text variable="title" font-style="italic"/> </if> <else-if type="chapter" match="any"/> <else> <text variable="title"/> </else> </choose> </macro> <macro name="author"> <names variable="author"> <name sort-separator=", " delimiter=", " and="symbol" initialize-with=". " delimiter-precedes-last="never" name-as-sort-order="all"/> <label form="short" prefix=", "/> <et-al font-style="italic"/> </names> </macro> <macro name="access"> <choose> <if variable="volume"/> <else-if variable="DOI"> <text variable="DOI" prefix="doi:"/> </else-if> <else-if type="webpage" variable="URL" match="all"> <text term="available at" text-case="capitalize-first" suffix=": "/> <text variable="URL" suffix=". "/> <group prefix="(" suffix=")" delimiter=": "> <text term="accessed" text-case="capitalize-first"/> <date variable="accessed"> <date-part name="day" suffix=" " form="ordinal"/> <date-part name="month" suffix=" "/> <date-part name="year"/> </date> </group> </else-if> </choose> </macro> <macro name="issuance"> <choose> <if type="bill book graphic legal_case legislation motion_picture report song thesis chapter paper-conference" match="any"> <group delimiter=", " prefix="(" suffix=")."> <text variable="publisher" form="long"/> <date variable="issued"> <date-part name="year"/> </date> </group> </if> <else> <date prefix="(" suffix=")." variable="issued"> <date-part name="year"/> </date> </else> </choose> </macro> <macro name="container-title"> <choose> <if type="article-journal"> <text variable="container-title" font-style="italic" form="short"/> </if> <else> <text variable="container-title" font-style="italic"/> </else> </choose> </macro> <macro name="editor"> <choose> <if type="chapter paper-conference" match="any"> <names variable="editor" prefix="(" suffix=")"> <label form="short" suffix=" "/> <name and="symbol" delimiter-precedes-last="never" initialize-with=". " name-as-sort-order="all"/> </names> </if> </choose> </macro> <citation collapse="citation-number"> <sort> <key variable="citation-number"/> </sort> <layout vertical-align="sup" delimiter=","> <text variable="citation-number"/> </layout> </citation> <bibliography et-al-min="6" et-al-use-first="1" second-field-align="flush" entry-spacing="0" line-spacing="2"> <layout> <text variable="citation-number" suffix="."/> <group delimiter=" "> <text macro="author" suffix="."/> <text macro="title" suffix="."/> <choose> <if type="chapter paper-conference" match="any"> <text term="in" form="long" plural="false"/> </if> </choose> <text macro="container-title"/> <text macro="editor"/> <group font-weight="bold"> <text variable="volume" suffix=","/> </group> <text variable="page"/> <text macro="issuance"/> <text macro="access"/> </group> </layout> </bibliography> </style>';
+  acm:string ='<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="sort-only" default-locale="en-US"> <info> <title>ACM SIG Proceedings ("et al." for 3+ authors)</title> <id>http://www.zotero.org/styles/acm-sig-proceedings</id> <link href="http://www.zotero.org/styles/acm-sig-proceedings" rel="self"/> <link href="http://www.acm.org/sigs/publications/proceedings-templates" rel="documentation"/> <author> <name>Naeem Esfahani</name> <email>nesfaha2@gmu.edu</email> <uri>http://mason.gmu.edu/~nesfaha2/</uri> </author> <contributor> <name>Chris Horn</name> <email>chris.horn@securedecisions.com</email> </contributor> <category citation-format="numeric"/> <category field="science"/> <category field="engineering"/> <updated>2012-09-27T22:06:38+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <macro name="author"> <choose> <if type="webpage"> <text variable="title" suffix=":"/> </if> <else> <names variable="author"> <name name-as-sort-order="all" and="text" sort-separator=", " initialize-with="." delimiter-precedes-last="never" delimiter=", "/> <label form="short" prefix=" "/> <substitute> <names variable="editor"/> <names variable="translator"/> </substitute> </names> </else> </choose> </macro> <macro name="editor"> <names variable="editor"> <name initialize-with="." delimiter=", " and="text"/> <label form="short" prefix=", "/> </names> </macro> <citation collapse="citation-number"> <sort> <key variable="citation-number"/> </sort> <layout prefix="[" suffix="]" delimiter=", "> <text variable="citation-number"/> </layout> </citation> <bibliography entry-spacing="0" second-field-align="flush" et-al-min="3" et-al-use-first="1"> <sort> <key macro="author"/> <key variable="title"/> </sort> <layout suffix="."> <text variable="citation-number" prefix="[" suffix="]"/> <text macro="author" suffix=" "/> <date variable="issued" suffix=". "> <date-part name="year"/> </date> <choose> <if type="paper-conference"> <group delimiter=". "> <text variable="title"/> <group delimiter=" "> <text variable="container-title" font-style="italic"/> <group delimiter=", "> <group delimiter=", " prefix="(" suffix=")"> <text variable="publisher-place"/> <date variable="issued"> <date-part name="month" form="short" suffix=" "/> <date-part name="year"/> </date> </group> <text variable="page"/> </group> </group> </group> </if> <else-if type="article-journal"> <group delimiter=". "> <text variable="title"/> <text variable="container-title" font-style="italic"/> <group delimiter=", "> <text variable="volume"/> <group delimiter=" "> <text variable="issue"/> <date variable="issued" prefix="(" suffix=")"> <date-part name="month" form="short" suffix=" "/> <date-part name="year"/> </date> </group> <text variable="page"/> </group> </group> </else-if> <else-if type="patent"> <group delimiter=". "> <text variable="title"/> <text variable="number"/> <date variable="issued"> <date-part name="month" form="short" suffix=" "/> <date-part name="day" suffix=", "/> <date-part name="year"/> </date> </group> </else-if> <else-if type="thesis"> <group delimiter=". "> <text variable="title" font-style="italic"/> <text variable="archive_location" prefix="Doctoral Thesis #"/> <text variable="publisher"/> </group> </else-if> <else-if type="report"> <group delimiter=". "> <text variable="title" font-style="italic"/> <text variable="number" prefix="Technical Report #"/> <text variable="publisher"/> </group> </else-if> <else-if type="webpage"> <group delimiter=". "> <text variable="URL" font-style="italic"/> <date variable="accessed" prefix="Accessed: "> <date-part name="year" suffix="-"/> <date-part name="month" form="numeric-leading-zeros" suffix="-"/> <date-part name="day" form="numeric-leading-zeros"/> </date> </group> </else-if> <else-if type="chapter paper-conference" match="any"> <group delimiter=". "> <text variable="title"/> <text variable="container-title" font-style="italic"/> <text macro="editor"/> <text variable="publisher"/> <text variable="page"/> </group> </else-if> <else-if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <group delimiter=". "> <text variable="title" font-style="italic"/> <text variable="publisher"/> </group> </else-if> <else> <group delimiter=". "> <text variable="title"/> <text variable="container-title" font-style="italic"/> <text variable="publisher"/> </group> </else> </choose> </layout> </bibliography> </style> ';
+  apa:string ='<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="never" default-locale="tr-TR"> <info> <title>American Psychological Association 6th edition (Turkish)</title> <title-short>APA</title-short> <id>http://www.zotero.org/styles/apa-tr</id> <link href="http://www.zotero.org/styles/apa-tr" rel="self"/> <link href="http://www.zotero.org/styles/apa" rel="template"/> <link href="https://github.com/citation-style-language/styles/issues/240" rel="documentation"/> <contributor> <name>Kasım Binici</name> <email>kbinici@atauni.edu.tr</email> <uri>http://www.atauni.edu.tr/#personel=kasim-binici</uri> </contributor> <category citation-format="author-date"/> <category field="psychology"/> <category field="generic-base"/> <summary>APA’nın Türkçeye uyarlandığı bu çalışma Kurbanoğlu (2004) tarafından hazırlanan “kaynakça gösterme el kitabı”ndan yararlanılmıştır. APA’da kullanılan “and, n.d., et al., p., pp., eds., trans., ed., unpublished” etiketleri sırasıyla “ve, t.y., ve diğerleri, s., ss., ed., çev., bs., yayımlanmamış” şeklinde tercümesi yapılmıştır. Üç ve daha fazla yazarlı eserlerde “and” etiketi önünde kullanılan “,” karakteri kullanılmamıştır. İngilizcede sırasal rakam ile birlikte kullanılan son ek yerine Türkçede geçerli olan “.” işareti kullanılmıştır. APA’da künye içerisinde eserin yayın tarihi, erişim tarihi verilmektedir. Bazı eserlerde yayın tarihi için kullanılan “yıl, ay gün” biçimi APA-TR’de “yıl, gün ay” şeklinde kullanılmıştır. Erişim tarihi için kullanılan “ay gün, yıl” biçimi yerine de “gün ay yıl” biçimi seçilmiştir. APA’da elektronik yayınlarda kullanılan “Retrieved ……… from……..” etiketi yerine “……… tarihinde ……… adresinden erişildi” etiketi kullanılmıştır. CSL dilinde “retrieved”, “from” etiketleri ayrı olduğu için çalışmamızda “retrieved” etiketi “tarihinde”, “from” etiketi ise “adresinden erişildi” şeklinde yerelleştirilmesi yapılmıştır. APA’da bir kitap içerisinde yayımlanan yayına yapılan atıflarda eser adında önce kullanılan “in” etiketi, Türkçeye “içinde” olarak tercümesi yapılmış ve eser adından sonra kullanılmıştır. Dolayısıyla “tarih”, “tarihinde”, “adresinden erişildi”, “içinde” etiketlerinin künye içerisindeki yerleri değiştirilmiştir. Öneriler: “vol., vols.” etiketleri “c.”; toplantı adından önce kullanılan “Presented at the……” ifadesi “…….., sunulmuş bildiri” olarak kullanılmıştır. Çalışmada elektronik kaynaklar ve diğer değişen kurallar için APA’nın 6. versiyondaki kurallar öngörülmüştür. Lütfen tespit ettiğiniz sorunlar ve öneriler için kbinici@atauni.edu.tr adresine yazınız. Kasım Binici.</summary> <updated>2012-09-27T22:06:38+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <locale xml:lang="tr-TR"> <terms> <term name="no date">t.y.</term> <term name="et-al">ve diğerleri</term> <term name="and">ve</term> <term name="in">içinde</term> <term name="retrieved">erişildi</term> <term name="from">adresinden</term> <term name="presented at">sunulmuş bildiri</term> <term name="edition"> <single>basım</single> <multiple>basım</multiple> </term> <term name="edition" form="short">bs.</term> <term name="page"> <single>page</single> <multiple>pages</multiple> </term> <term name="page" form="short"> <single>s.</single> <multiple>ss.</multiple> </term> <term name="volume" form="short"> <single>c.</single> <multiple>c.</multiple> </term> <term name="translator" form="short"> <single>çev.</single> <multiple>çev.</multiple> </term> <term name="editor" form="short"> <single>ed.</single> <multiple>ed.</multiple> </term> <!-- ORDINALS --> <term name="ordinal-01">.</term> <term name="ordinal-02">.</term> <term name="ordinal-03">.</term> <term name="ordinal-04">.</term> <!-- LONG MONTH FORMS --> <term name="month-01">Ocak</term> <term name="month-02">Şubat</term> <term name="month-03">Mart</term> <term name="month-04">Nisan</term> <term name="month-05">Mayıs</term> <term name="month-06">Haziran</term> <term name="month-07">Temmuz</term> <term name="month-08">Ağustos</term> <term name="month-09">Eylül</term> <term name="month-10">Ekim</term> <term name="month-11">Kasım</term> <term name="month-12">Aralık</term> </terms> </locale> <macro name="container-contributors"> <choose> <if type="chapter paper-conference" match="any"> <names variable="editor" delimiter=", " suffix=", "> <name and="text" initialize-with=". " delimiter=", " delimiter-precedes-last="never"/> <label form="short" prefix=" (" text-case="capitalize-first" suffix=")"/> <substitute> <names variable="translator"/> </substitute> </names> </if> </choose> </macro> <macro name="secondary-contributors"> <choose> <if type="article-journal chapter paper-conference" match="none"> <names variable="translator" delimiter=", " prefix=" (" suffix=")"> <name and="text" initialize-with=". " delimiter=", " delimiter-precedes-last="never"/> <label form="short" prefix=", " text-case="capitalize-first"/> <substitute> <names variable="editor"/> </substitute> </names> </if> </choose> </macro> <macro name="author"> <names variable="author"> <name name-as-sort-order="all" and="text" sort-separator=", " initialize-with=". " delimiter=", " delimiter-precedes-last="never"/> <label form="short" prefix=" (" suffix=")" text-case="capitalize-first"/> <substitute> <names variable="editor"/> <names variable="translator"/> <choose> <if type="report"> <text variable="publisher"/> <text macro="title"/> </if> <else> <text macro="title"/> </else> </choose> </substitute> </names> </macro> <macro name="author-short"> <names variable="author"> <name form="short" and="text" delimiter=", " initialize-with=". " delimiter-precedes-last="never"/> <substitute> <names variable="editor"/> <names variable="translator"/> <choose> <if type="report"> <text variable="publisher"/> <text variable="title" form="short" font-style="italic"/> </if> <else-if type="bill book graphic legal_case legislation motion_picture song" match="any"> <text variable="title" form="short" font-style="italic"/> </else-if> <else> <text variable="title" form="short" quotes="true"/> </else> </choose> </substitute> </names> </macro> <macro name="access"> <choose> <if type="thesis"> <choose> <if variable="archive" match="any"> <group> <text variable="archive"/> <text variable="archive_location" prefix=" (" suffix=")"/> <text term="retrieved" prefix=" veri tabanından " suffix="."/> </group> </if> <else> <group> <text variable="URL"/> <text term="from" prefix=" "/> <text term="retrieved" prefix=" " suffix="."/> </group> </else> </choose> </if> <else> <choose> <if variable="DOI"> <text variable="DOI" prefix="doi:"/> </if> <else> <choose> <if type="webpage"> <group delimiter=" "> <group> <date variable="accessed" suffix=" "> <date-part name="day" suffix=" "/> <date-part name="month" suffix=" "/> <date-part name="year" suffix=" tarihinde "/> </date> </group> <text variable="URL" suffix=" "/> <text term="from" prefix=" "/> <text term="retrieved" prefix=" " suffix="."/> </group> </if> <else> <group delimiter=" "> <text variable="URL" suffix=" "/> <text term="from" prefix=" "/> <text term="retrieved" prefix=" " suffix="."/> </group> </else> </choose> </else> </choose> </else> </choose> </macro> <macro name="title"> <choose> <if type="report"> <text variable="title" font-style="italic"/> <group prefix=" (" suffix=")"> <text variable="genre"/> <text variable="number" prefix=" No: "/> </group> </if> <else-if type="book graphic motion_picture report song manuscript speech thesis" match="any"> <text variable="title" font-style="italic"/> </else-if> <else> <text variable="title"/> </else> </choose> </macro> <macro name="publisher"> <choose> <if type="report"> <group delimiter=": "> <text variable="publisher-place"/> <text variable="publisher"/> </group> </if> <else-if type="thesis"> <choose> <if variable="archive URL" match="any"> <text variable="genre" text-case="capitalize-first" prefix=" (" suffix=")"/> </if> <else> <text variable="genre" text-case="lowercase" prefix=" (Yayımlanmamış " suffix="). "/> <group delimiter=", "> <text variable="publisher"/> <text variable="publisher-place"/> </group> </else> </choose> </else-if> <else> <group delimiter=", "> <choose> <if variable="event" match="none"> <text variable="genre"/> </if> </choose> <choose> <if type="article-journal article-magazine" match="none"> <group delimiter=": "> <text variable="publisher-place"/> <text variable="publisher"/> </group> </if> </choose> </group> </else> </choose> </macro> <macro name="event"> <choose> <if variable="event"> <choose> <if variable="genre" match="none"> <text variable="event"/> <text term="presented at" prefix=", "/> </if> <else> <group delimiter=" "> <text variable="event"/> <text variable="genre"/> </group> </else> </choose> </if> </choose> </macro> <macro name="issued"> <choose> <if type="bill legal_case legislation" match="none"> <choose> <if variable="issued"> <group prefix=" (" suffix=")."> <date variable="issued"> <date-part name="year"/> </date> <text variable="year-suffix"/> <choose> <if type="bill book graphic legal_case legislation motion_picture report song article-journal chapter paper-conference" match="none"> <date variable="issued" prefix=","> <date-part prefix=" " name="day"/> <date-part prefix=" " name="month"/> </date> </if> </choose> </group> </if> <else> <group prefix=" (" suffix=")."> <text term="no date" form="short"/> <text variable="year-suffix" prefix="-"/> </group> </else> </choose> </if> </choose> </macro> <macro name="issued-sort"> <choose> <if type="article-journal bill book chapter graphic legal_case legislation motion_picture paper-conference report song" match="none"> <date variable="issued"> <date-part name="year"/> <date-part prefix=", " name="day"/> <date-part prefix=" " name="month"/> </date> </if> <else> <date variable="issued"> <date-part name="year"/> </date> </else> </choose> </macro> <macro name="issued-year"> <choose> <if variable="issued"> <date variable="issued"> <date-part name="year"/> </date> <text variable="year-suffix"/> </if> <else> <text term="no date" form="short"/> <text variable="year-suffix" prefix="-"/> </else> </choose> </macro> <macro name="edition"> <choose> <if is-numeric="edition"> <group delimiter=" "> <number variable="edition" form="ordinal"/> <text term="edition" form="short"/> </group> </if> <else> <text variable="edition" suffix="."/> </else> </choose> </macro> <macro name="locators"> <choose> <if type="article-journal article-magazine" match="any"> <group prefix=", " delimiter=", "> <group> <text variable="volume" font-style="italic"/> <text variable="issue" prefix="(" suffix=")"/> </group> <text variable="page"/> </group> </if> <else-if type="article-newspaper"> <group delimiter=" " prefix=", "> <label variable="page" form="short"/> <text variable="page"/> </group> </else-if> <else-if type="book graphic motion_picture report song chapter paper-conference" match="any"> <group prefix=" (" suffix=")" delimiter=", "> <text macro="edition"/> <group> <text term="volume" form="short" plural="true" text-case="capitalize-first" suffix=" "/> <number variable="number-of-volumes" form="numeric" prefix="1-"/> </group> <group> <text term="volume" form="short" text-case="capitalize-first" suffix=" "/> <number variable="volume" form="numeric"/> </group> <group> <label variable="page" form="short" suffix=" "/> <text variable="page"/> </group> </group> </else-if> <else-if type="legal_case"> <group prefix=" (" suffix=")" delimiter=" "> <text variable="authority"/> <date variable="issued" delimiter=" "> <date-part name="month" form="short"/> <date-part name="day" suffix=","/> <date-part name="year"/> </date> </group> </else-if> <else-if type="bill legislation" match="any"> <date variable="issued" prefix=" (" suffix=")"> <date-part name="year"/> </date> </else-if> </choose> </macro> <macro name="citation-locator"> <group> <label variable="locator" form="short"/> <text variable="locator" prefix=" "/> </group> </macro> <macro name="container"> <choose> <if type="bill legal_case legislation" match="none"> <text variable="container-title" font-style="italic"/> <choose> <if type="chapter paper-conference" match="any"> <text term="in" prefix=" " suffix=" "/> </if> </choose> </if> <else> <group delimiter=" " prefix=" "> <choose> <if variable="container-title"> <text variable="volume"/> <text variable="container-title"/> <group delimiter=" "> <!--change to label variable="section" as that becomes available --> <text term="section" form="symbol"/> <text variable="section"/> </group> <text variable="page"/> </if> <else> <choose> <if type="legal_case"> <text variable="number" prefix="No. "/> </if> <else> <text variable="number" prefix="Pub. L. No. "/> <group delimiter=" "> <!--change to label variable="section" as that becomes available --> <text term="section" form="symbol"/> <text variable="section"/> </group> </else> </choose> </else> </choose> </group> </else> </choose> </macro> <citation et-al-min="6" et-al-use-first="1" et-al-subsequent-min="3" et-al-subsequent-use-first="1" disambiguate-add-year-suffix="true" disambiguate-add-names="true" disambiguate-add-givenname="true" collapse="year" givenname-disambiguation-rule="primary-name"> <sort> <key macro="author"/> <key macro="issued-sort"/> </sort> <layout prefix="(" suffix=")" delimiter="; "> <group delimiter=", "> <choose> <if type="personal_communication interview" match="any"> <names variable="author"> <name initialize-with=". "/> </names> <text value="kişisel iletişim"/> <date variable="issued"> <date-part prefix=" " name="day"/> <date-part prefix=" " name="month"/> <date-part prefix=" " name="year"/> </date> </if> <else> <text macro="author-short"/> <text macro="issued-year"/> </else> </choose> <text macro="citation-locator"/> </group> </layout> </citation> <bibliography hanging-indent="true" et-al-min="8" et-al-use-first="6" et-al-use-last="true" entry-spacing="0" line-spacing="2"> <sort> <key macro="author"/> <key macro="issued-sort" sort="ascending"/> </sort> <layout> <group suffix="."> <text macro="author" suffix="."/> <text macro="issued"/> <group delimiter=". "> <text macro="title" prefix=" "/> <group> <text macro="container-contributors"/> <text macro="secondary-contributors"/> <group delimiter=", "> <text macro="container"/> <text variable="collection-title"/> </group> </group> </group> <text macro="locators"/> <group delimiter=", " prefix=". "> <text macro="event"/> <text macro="publisher"/> </group> </group> <text macro="access" prefix=" "/> </layout> </bibliography> </style>';
+  harvard:string = '<?xml version="1.0" encoding="utf-8"?> <style xmlns="http://purl.org/net/xbiblio/csl" class="in-text" version="1.0" demote-non-dropping-particle="sort-only"> <info> <title>Harvard Reference format 1 (author-date)</title> <id>http://www.zotero.org/styles/harvard1</id> <link href="http://www.zotero.org/styles/harvard1" rel="self"/> <link href="http://libweb.anglia.ac.uk/referencing/harvard.htm" rel="documentation"/> <author> <name>Julian Onions</name> <email>julian.onions@gmail.com</email> </author> <category citation-format="author-date"/> <category field="generic-base"/> <summary>The Harvard author-date style</summary> <updated>2012-09-27T22:06:38+00:00</updated> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> </info> <macro name="editor"> <names variable="editor" delimiter=", "> <name and="symbol" initialize-with=". " delimiter=", "/> <label form="short" prefix=", " text-case="lowercase"/> </names> </macro> <macro name="anon"> <text term="anonymous" form="short" text-case="capitalize-first" strip-periods="true"/> </macro> <macro name="author"> <names variable="author"> <name name-as-sort-order="all" and="symbol" sort-separator=", " initialize-with="." delimiter-precedes-last="never" delimiter=", "/> <label form="short" prefix=" " text-case="lowercase"/> <substitute> <names variable="editor"/> <text macro="anon"/> </substitute> </names> </macro> <macro name="author-short"> <names variable="author"> <name form="short" and="symbol" delimiter=", " delimiter-precedes-last="never" initialize-with=". "/> <substitute> <names variable="editor"/> <names variable="translator"/> <text macro="anon"/> </substitute> </names> </macro> <macro name="access"> <choose> <if variable="URL"> <text value="Available at:" suffix=" "/> <text variable="URL"/> <group prefix=" [" suffix="]"> <text term="accessed" text-case="capitalize-first" suffix=" "/> <date variable="accessed"> <date-part name="month" suffix=" "/> <date-part name="day" suffix=", "/> <date-part name="year"/> </date> </group> </if> </choose> </macro> <macro name="title"> <choose> <if type="bill book graphic legal_case legislation motion_picture report song thesis" match="any"> <text variable="title" font-style="italic"/> </if> <else> <text variable="title"/> </else> </choose> </macro> <macro name="publisher"> <group delimiter=": "> <text variable="publisher-place"/> <text variable="publisher"/> </group> </macro> <macro name="year-date"> <choose> <if variable="issued"> <date variable="issued"> <date-part name="year"/> </date> </if> <else> <text term="no date" form="short"/> </else> </choose> </macro> <macro name="edition"> <choose> <if is-numeric="edition"> <group delimiter=" "> <number variable="edition" form="ordinal"/> <text term="edition" form="short"/> </group> </if> <else> <text variable="edition" suffix="."/> </else> </choose> </macro> <macro name="pages"> <group> <label variable="page" form="short" suffix=" "/> <text variable="page"/> </group> </macro> <citation et-al-min="3" et-al-use-first="1" disambiguate-add-year-suffix="true" disambiguate-add-names="true" disambiguate-add-givenname="true"> <layout prefix="(" suffix=")" delimiter="; "> <group delimiter=", "> <group delimiter=" "> <text macro="author-short"/> <text macro="year-date"/> </group> <group> <label variable="locator" form="short"/> <text variable="locator"/> </group> </group> </layout> </citation> <bibliography hanging-indent="true" et-al-min="4" et-al-use-first="1"> <sort> <key macro="author"/> <key variable="title"/> </sort> <layout> <text macro="author" suffix=","/> <date variable="issued" prefix=" " suffix="."> <date-part name="year"/> </date> <choose> <if type="bill book graphic legal_case legislation motion_picture report song" match="any"> <group prefix=" " delimiter=" " suffix=","> <text macro="title"/> <text macro="edition"/> <text macro="editor"/> </group> <text prefix=" " suffix="." macro="publisher"/> </if> <else-if type="chapter paper-conference" match="any"> <text macro="title" prefix=" " suffix="."/> <group prefix=" " delimiter=" "> <text term="in" text-case="capitalize-first"/> <text macro="editor"/> <text variable="container-title" font-style="italic" suffix="."/> <text variable="collection-title" suffix="."/> <text variable="event" suffix="."/> <group suffix="." delimiter=", "> <text macro="publisher" prefix=" "/> <text macro="pages"/> </group> </group> </else-if> <else-if type="thesis"> <group prefix=" " suffix="." delimiter=". "> <text macro="title"/> <text variable="genre"/> <text macro="publisher"/> </group> </else-if> <else> <group suffix="."> <text macro="title" prefix=" "/> <text macro="editor" prefix=" "/> </group> <group prefix=" " suffix="."> <text variable="container-title" font-style="italic"/> <group prefix=", "> <text variable="volume"/> <text variable="issue" prefix="(" suffix=")"/> </group> <group prefix=", "> <label variable="page" form="short"/> <text variable="page"/> </group> </group> </else> </choose> <text prefix=" " macro="access" suffix="."/> </layout> </bibliography> </style>';
+  locale:string ='<?xml version="1.0" encoding="utf-8"?> <locale xmlns="http://purl.org/net/xbiblio/csl" version="1.0" xml:lang="en-US"> <info> <rights license="http://creativecommons.org/licenses/by-sa/3.0/">This work is licensed under a Creative Commons Attribution-ShareAlike 3.0 License</rights> <updated>2012-07-04T23:31:02+00:00</updated> </info> <style-options punctuation-in-quote="true" leading-noise-words="a,an,the" name-as-sort-order="ja zh kr my hu vi" name-never-short="ja zh kr my hu vi"/> <date form="text"> <date-part name="month" suffix=" "/> <date-part name="day" suffix=", "/> <date-part name="year"/> </date> <date form="numeric"> <date-part name="month" form="numeric-leading-zeros" suffix="/"/> <date-part name="day" form="numeric-leading-zeros" suffix="/"/> <date-part name="year"/> </date> <terms> <term name="radio-broadcast">radio broadcast</term> <term name="television-broadcast">television broadcast</term> <term name="podcast">podcast</term> <term name="instant-message">instant message</term> <term name="email">email</term> <term name="number-of-volumes"> <single>volume</single> <multiple>volumes</multiple> </term> <term name="accessed">accessed</term> <term name="and">and</term> <term name="and" form="symbol">&amp;</term> <term name="and others">and others</term> <term name="anonymous">anonymous</term> <term name="anonymous" form="short">anon.</term> <term name="at">at</term> <term name="available at">available at</term> <term name="by">by</term> <term name="circa">circa</term> <term name="circa" form="short">c.</term> <term name="cited">cited</term> <term name="edition"> <single>edition</single> <multiple>editions</multiple> </term> <term name="edition" form="short">ed.</term> <term name="et-al">et al.</term> <term name="forthcoming">forthcoming</term> <term name="from">from</term> <term name="ibid">ibid.</term> <term name="in">in</term> <term name="in press">in press</term> <term name="internet">internet</term> <term name="interview">interview</term> <term name="letter">letter</term> <term name="no date">no date</term> <term name="no date" form="short">n.d.</term> <term name="online">online</term> <term name="presented at">presented at the</term> <term name="reference"> <single>reference</single> <multiple>references</multiple> </term> <term name="reference" form="short"> <single>ref.</single> <multiple>refs.</multiple> </term> <term name="retrieved">retrieved</term> <term name="scale">scale</term> <term name="version">version</term> <!-- ANNO DOMINI; BEFORE CHRIST --> <term name="ad">AD</term> <term name="bc">BC</term> <!-- PUNCTUATION --> <term name="open-quote">“</term> <term name="close-quote">”</term> <term name="open-inner-quote">‘</term> <term name="close-inner-quote">’</term> <term name="page-range-delimiter">–</term> <!-- ORDINALS --> <term name="ordinal">th</term> <term name="ordinal-01">st</term> <term name="ordinal-02">nd</term> <term name="ordinal-03">rd</term> <term name="ordinal-11">th</term> <term name="ordinal-12">th</term> <term name="ordinal-13">th</term> <!-- LONG ORDINALS --> <term name="long-ordinal-01">first</term> <term name="long-ordinal-02">second</term> <term name="long-ordinal-03">third</term> <term name="long-ordinal-04">fourth</term> <term name="long-ordinal-05">fifth</term> <term name="long-ordinal-06">sixth</term> <term name="long-ordinal-07">seventh</term> <term name="long-ordinal-08">eighth</term> <term name="long-ordinal-09">ninth</term> <term name="long-ordinal-10">tenth</term> <!-- LONG LOCATOR FORMS --> <term name="book"> <single>book</single> <multiple>books</multiple> </term> <term name="chapter"> <single>chapter</single> <multiple>chapters</multiple> </term> <term name="column"> <single>column</single> <multiple>columns</multiple> </term> <term name="figure"> <single>figure</single> <multiple>figures</multiple> </term> <term name="folio"> <single>folio</single> <multiple>folios</multiple> </term> <term name="issue"> <single>number</single> <multiple>numbers</multiple> </term> <term name="line"> <single>line</single> <multiple>lines</multiple> </term> <term name="note"> <single>note</single> <multiple>notes</multiple> </term> <term name="opus"> <single>opus</single> <multiple>opera</multiple> </term> <term name="page"> <single>page</single> <multiple>pages</multiple> </term> <term name="paragraph"> <single>paragraph</single> <multiple>paragraph</multiple> </term> <term name="part"> <single>part</single> <multiple>parts</multiple> </term> <term name="section"> <single>section</single> <multiple>sections</multiple> </term> <term name="sub verbo"> <single>sub verbo</single> <multiple>sub verbis</multiple> </term> <term name="verse"> <single>verse</single> <multiple>verses</multiple> </term> <term name="volume"> <single>volume</single> <multiple>volumes</multiple> </term> <!-- SHORT LOCATOR FORMS --> <term name="book" form="short">bk.</term> <term name="chapter" form="short">chap.</term> <term name="column" form="short">col.</term> <term name="figure" form="short">fig.</term> <term name="folio" form="short">f.</term> <term name="issue" form="short">no.</term> <term name="line" form="short">l.</term> <term name="note" form="short">n.</term> <term name="opus" form="short">op.</term> <term name="page" form="short"> <single>p.</single> <multiple>pp.</multiple> </term> <term name="paragraph" form="short">para.</term> <term name="part" form="short">pt.</term> <term name="section" form="short">sec.</term> <term name="sub verbo" form="short"> <single>s.v.</single> <multiple>s.vv.</multiple> </term> <term name="verse" form="short"> <single>v.</single> <multiple>vv.</multiple> </term> <term name="volume" form="short"> <single>vol.</single> <multiple>vols.</multiple> </term> <!-- SYMBOL LOCATOR FORMS --> <term name="paragraph" form="symbol"> <single>¶</single> <multiple>¶¶</multiple> </term> <term name="section" form="symbol"> <single>§</single> <multiple>§§</multiple> </term> <!-- LONG ROLE FORMS --> <term name="director"> <single>director</single> <multiple>directors</multiple> </term> <term name="editor"> <single>editor</single> <multiple>editors</multiple> </term> <term name="editorial-director"> <single>editor</single> <multiple>editors</multiple> </term> <term name="illustrator"> <single>illustrator</single> <multiple>illustrators</multiple> </term> <term name="translator"> <single>translator</single> <multiple>translators</multiple> </term> <term name="editortranslator"> <single>editor &amp; translator</single> <multiple>editors &amp; translators</multiple> </term> <!-- SHORT ROLE FORMS --> <term name="director" form="short"> <single>dir.</single> <multiple>dirs.</multiple> </term> <term name="editor" form="short"> <single>ed.</single> <multiple>eds.</multiple> </term> <term name="editorial-director" form="short"> <single>ed.</single> <multiple>eds.</multiple> </term> <term name="illustrator" form="short"> <single>ill.</single> <multiple>ills.</multiple> </term> <term name="translator" form="short"> <single>tran.</single> <multiple>trans.</multiple> </term> <term name="editortranslator" form="short"> <single>ed. &amp; tran.</single> <multiple>eds. &amp; trans.</multiple> </term> <!-- VERB ROLE FORMS --> <term name="director" form="verb">directed by</term> <term name="editor" form="verb">edited by</term> <term name="editorial-director" form="verb">edited by</term> <term name="illustrator" form="verb">illustrated by</term> <term name="interviewer" form="verb">interview by</term> <term name="recipient" form="verb">to</term> <term name="reviewed-author" form="verb">by</term> <term name="translator" form="verb">translated by</term> <term name="editortranslator" form="verb">edited &amp; translated by</term> <!-- SHORT VERB ROLE FORMS --> <term name="container-author" form="verb-short">by</term> <term name="director" form="verb-short">dir.</term> <term name="editor" form="verb-short">ed.</term> <term name="editorial-director" form="verb-short">ed.</term> <term name="illustrator" form="verb-short">illus.</term> <term name="translator" form="verb-short">trans.</term> <term name="editortranslator" form="verb-short">ed. &amp; trans.</term> <!-- LONG MONTH FORMS --> <term name="month-01">January</term> <term name="month-02">February</term> <term name="month-03">March</term> <term name="month-04">April</term> <term name="month-05">May</term> <term name="month-06">June</term> <term name="month-07">July</term> <term name="month-08">August</term> <term name="month-09">September</term> <term name="month-10">October</term> <term name="month-11">November</term> <term name="month-12">December</term> <!-- SHORT MONTH FORMS --> <term name="month-01" form="short">Jan.</term> <term name="month-02" form="short">Feb.</term> <term name="month-03" form="short">Mar.</term> <term name="month-04" form="short">Apr.</term> <term name="month-05" form="short">May</term> <term name="month-06" form="short">Jun.</term> <term name="month-07" form="short">Jul.</term> <term name="month-08" form="short">Aug.</term> <term name="month-09" form="short">Sep.</term> <term name="month-10" form="short">Oct.</term> <term name="month-11" form="short">Nov.</term> <term name="month-12" form="short">Dec.</term> <!-- SEASONS --> <term name="season-01">Spring</term> <term name="season-02">Summer</term> <term name="season-03">Autumn</term> <term name="season-04">Winter</term> </terms> </locale>';
+
+
+}
+export class CitationData{
+  public id:string;
+  public type:string;
+  public title:string;
+  public DOI:string;
+  public "container-title":string;
+  public publisher:string;
+  public author:{given:string, family:string, 'parse-names':boolean}[] =[];
+  public issued ={};//{"date-parts":string[]}[] =[];
+  public date:string;
+  public authors:string[] =[];
+
+}
diff --git a/landingPages/landing-utils/citeThis/citeThis.component.ts b/landingPages/landing-utils/citeThis/citeThis.component.ts
new file mode 100644
index 00000000..91fbac4b
--- /dev/null
+++ b/landingPages/landing-utils/citeThis/citeThis.component.ts
@@ -0,0 +1,127 @@
+import {Component, ElementRef, Input} from '@angular/core';
+import {ActivatedRoute} from '@angular/router';
+import {Citation, CitationData} from './citation.class';
+declare var CSL:any;
+declare var Sys:any;
+//<addThis ></addThis>
+@Component({
+  selector: 'citeThis',
+  template: `
+
+  <div class="citationDownloader ">
+    <dl class="uk-description-list-line">
+      <!--dt class="title">Cite this {{type}}</dt-->
+      <dd class="line"  >
+        <select class="select" id="citations" name="citeselect" [(ngModel)]="selectedStyle" (ngModelChange)="styleChanged()">
+          <option *ngFor=" let  style of this.citation.templates let i = index" [value]="style">{{style}}</option>
+        </select>
+        <div id="citation" class="box-content" [innerHTML]=citationText></div>
+      </dd>
+    </dl>
+  </div>
+  `
+})
+export class CiteThisComponent {
+  private sub:any;
+  public selectedStyle:string;
+  public citationText:string;
+  public citation:Citation = new Citation();
+  // public cite: any;
+  @Input() result: any;
+  @Input() id: string;
+  @Input() type: string="article";
+  public citeproc;
+  public data;
+
+
+  constructor(private route: ActivatedRoute) {
+    this.selectedStyle = this.citation.templates[0];
+  }
+
+  ngOnInit() {
+    if(typeof window !== 'undefined') {
+      // this.citeproc = require('./citeproc.js');
+      // console.log(this.citeproc);
+      this.parseData();
+      this.updateCitation();
+    }
+  }
+  parseData(){
+    var citationData:CitationData = new CitationData();
+
+        citationData.id = this.id;
+        if(this.result.types != undefined && this.result.types.length > 0 && this.result.types[0]){
+          citationData.type = this.result.types[0].toLowerCase();
+        }else if(this.result.type != undefined ){
+          citationData.type = this.result.type.toLowerCase();
+        }
+        if(this.result.title && this.result.title.name){
+          citationData.title = this.result.title.name;
+        }
+        if(this.result.journal && this.result.journal.journal){
+          citationData["container-title"] = this.result.journal.journal;
+        }
+        if(this.result.publisher){
+          citationData.publisher = this.result.publisher;
+        }
+        if( this.result.authors){
+          citationData.author = [];
+          var max_length = (this.result.authors.length > 10)?10:this.result.authors.length;
+          for (var i =0 ;i <  max_length; i++){
+            if(this.result.authors[i] && this.result.authors[i].indexOf(", ") !== -1){
+              citationData.author.push({given:this.result.authors[i].split(", ")[0], family:this.result.authors[i].split(", ")[1], 'parse-names':true});
+            }else{
+              citationData.author.push({given:"", family:this.result.authors[i], 'parse-names':true});
+            }
+            // citationData.authors.push(this.result.authors[i]);
+          }
+        }
+        if(this.result.dateofacceptance  != undefined){
+          citationData.issued = {};
+          var date:string = (this.result.dateofacceptance)+""; // transform to string in case it is an integer
+          var dateArray:string[]  = (date && (date).indexOf('-') !== -1)?date.split('-'):[date];
+          if(dateArray.length < 3){
+            // dateArray.push[1];
+            // dateArray.push[1];
+          }
+           citationData.issued={"date-parts":[[""+dateArray[0],dateArray[1], dateArray[2]]]};
+           if(this.result.date ){
+             citationData.date = this.result.date ;
+           }
+      }
+
+
+    this.data = citationData;
+    // console.log(this.data);
+
+  }
+  styleChanged(){
+    this.updateCitation();
+
+  }
+  updateCitation(){
+    var Sys =
+      function Sys(lang, data){
+     this.lang = lang;
+     this.data = data;
+       this.changeName = function (name) {
+           this.lastName = name;
+       };
+       this.retrieveLocale= function (lang){
+
+         return this.lang;
+       }
+       this.retrieveItem= function(id){
+         console.log("retrieve id:" + id);
+         return this.data;
+       }
+    };
+
+    var citeproc = new CSL.Engine(new Sys(this.citation.locale,  this.data ), this.citation[this.selectedStyle]);
+    citeproc.updateItems([this.data.id]);
+    this.citationText = citeproc.makeBibliography();
+    this.citationText = ((this.citationText != null) && (this.citationText.length > 1) && (this.citationText[1].length > 0)) ? this.citationText[1][0] : '';
+
+  }
+
+}
diff --git a/landingPages/landing-utils/citeThis/citeThis.module.ts b/landingPages/landing-utils/citeThis/citeThis.module.ts
new file mode 100644
index 00000000..4a14a36a
--- /dev/null
+++ b/landingPages/landing-utils/citeThis/citeThis.module.ts
@@ -0,0 +1,23 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+ import {CiteThisComponent} from './citeThis.component';
+
+@NgModule({
+  imports: [
+
+    CommonModule, FormsModule
+   ],
+  declarations: [
+     CiteThisComponent
+  ],
+  providers:[
+
+   ],
+  exports: [
+
+    CiteThisComponent
+    ]
+})
+export class CiteThisModule { }
diff --git a/landingPages/landing-utils/fundedBy.component.ts b/landingPages/landing-utils/fundedBy.component.ts
new file mode 100644
index 00000000..885ad549
--- /dev/null
+++ b/landingPages/landing-utils/fundedBy.component.ts
@@ -0,0 +1,131 @@
+import {Component, Input, ElementRef} from '@angular/core';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'fundedBy',
+    template: `
+      <dl class="uk-description-list-line">
+        <dt  class="title">Funded By</dt>
+        <dd class="line"
+            *ngFor="let item of fundedByProjects let i=index">
+          <div *ngIf="i<5 || showAll">
+            <span   uk-tooltip="pos:right; delay:10"
+                    title="{{buildFundingTooltip(item)}}">
+
+              <a *ngIf="!item['inline'] && item.id"
+                  [queryParams]="{projectId: item.id}" routerLinkActive="router-link-active" routerLink="/search/project">
+                <span *ngIf="item['funderShortname'] || item['funderName']">{{item['funderShortname']?item['funderShortname']:item['funderName']}}</span>
+                <span *ngIf="!item['funderShortname'] && !item['funderName']">[no funder available]</span>
+                <span *ngIf="item['acronym'] || item['title']">| {{ item['acronym']?item['acronym']:item['title']}}</span>
+              </a>
+
+              <a *ngIf="item['inline'] && item.id"
+                  [queryParams]="{projectId: item.id}" routerLinkActive="router-link-active" routerLink="/search/project">
+                <mark>
+                  <span *ngIf="item['funderShortname'] || item['funderName']">{{item['funderShortname']?item['funderShortname']:item['funderName']}}</span>
+                  <span *ngIf="!item['funderShortname'] && !item['funderName']">[no funder available]</span>
+                  <span *ngIf="item['acronym'] || item['title']">| {{ item['acronym']?item['acronym']:item['title']}}</span>
+                </mark>
+              </a>
+
+              <span class="clickable" *ngIf="!item['inline'] && !item.id">
+                <span *ngIf="item['funderShortname'] || item['funderName']">{{item['funderShortname']?item['funderShortname']:item['funderName']}}</span>
+                <span *ngIf="!item['funderShortname'] && !item['funderName']">[no funder available]</span>
+                <span *ngIf="item['acronym'] || item['title']">| {{ item['acronym']?item['acronym']:item['title']}}</span>
+              </span>
+
+              <span class="clickable" *ngIf="item['inline'] && !item.id">
+                <mark>
+                  <span *ngIf="item['funderShortname'] || item['funderName']">{{item['funderShortname']?item['funderShortname']:item['funderName']}}</span>
+                  <span *ngIf="!item['funderShortname'] && !item['funderName']">[no funder available]</span>
+                  <span *ngIf="item['acronym'] || item['title']">| {{ item['acronym']?item['acronym']:item['title']}}</span>
+                </mark>
+              </span>
+
+              <span class="uk-icon">
+                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+              </span>
+            </span>
+          </div>
+        </dd>
+        <dd *ngIf="showAll" class="uk-text-right">
+          <a (click)="showAll = !showAll; scroll()">
+            View less
+          </a>
+        </dd>
+        <dd *ngIf="!showAll && fundedByProjects && fundedByProjects.length > 5">...</dd>
+        <dd *ngIf="!showAll && fundedByProjects && fundedByProjects.length > 5" class="uk-text-right">
+          <a (click)="showAll = !showAll;">
+            View more
+          </a>
+        </dd>
+      </dl>
+    `
+    })
+
+export class FundedByComponent {
+    @Input() fundedByProjects: {  "id": string, "acronym": string, "title": string,
+                                  "funderShortname": string, "funderName": string,
+                                  "funding": string, "code": string, "provenanceAction": string,
+                                  "inline": boolean }[];
+    public showAll: boolean = false;
+
+    constructor (private element: ElementRef) {}
+
+    ngOnInit() {}
+
+    public buildFundingTooltip(item: { "id": string, "acronym": string, "title": string,
+                        "funderShortname": string, "funderName": string,
+                        "funding": string, "code": string, "provenanceAction": string, inline: boolean}) {
+      let tooltipContent: string = "<div class='tooltip-custom-font-size uk-light uk-padding-small'>";
+
+      if(item.title) {
+          tooltipContent += "<h5>"+item.title+"</h5>";
+      }
+
+      if(item.code || item.funderName || item.funderShortname || item.funding) {
+        tooltipContent += "<p>";
+      }
+
+      if(item.code) {
+          tooltipContent += "<div>Project Code: "+item.code+"</div>";
+      }
+      if(item.funderName || item.funderShortname) {
+          tooltipContent += "<div>Funder: ";
+          if(item.funderName && item.funderShortname) {
+              tooltipContent += item.funderName + " ("+ item.funderShortname +")";
+          } else if(item.funderName) {
+              tooltipContent += item.funderName;
+          } else {
+              tooltipContent += item.funderShortname;
+          }
+          tooltipContent += "</div>";
+      }
+
+      if(item.funding) {
+          tooltipContent += "<div>Funding: "+ item.funding + "</div>";
+      }
+
+      if(item.code || item.funderName || item.funderShortname || item.funding) {
+        tooltipContent += "</p>";
+      }
+
+      if(item.provenanceAction == 'Repository') {
+        tooltipContent += "Provided by Repository";
+      } else if(item.provenanceAction == 'OpenAIRE') {
+        tooltipContent += "Inferred by OpenAIRE";
+      } else if(item.provenanceAction == 'USer') {
+        tooltipContent += "Claimed by User";
+      }
+
+      tooltipContent+="</div>"
+      return tooltipContent;
+    }
+
+    public scroll() {
+      console.info("scroll into view");
+      if (typeof document !== 'undefined') {
+         this.element.nativeElement.scrollIntoView();
+      }
+    }
+}
diff --git a/landingPages/landing-utils/landing.module.ts b/landingPages/landing-utils/landing.module.ts
new file mode 100644
index 00000000..a7ae76f1
--- /dev/null
+++ b/landingPages/landing-utils/landing.module.ts
@@ -0,0 +1,28 @@
+/* This module contains all common components for all landing pages */
+
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import {TabPagingComponent} from './tabPaging.component';
+import {ShowTitleComponent} from './showTitle.component';
+import {AddThisComponent} from './addThis.component';
+import {PiwikServiceModule} from '../../utils/piwik/piwikService.module';
+import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule, PiwikServiceModule
+  ],
+  declarations: [
+      TabPagingComponent,  ShowTitleComponent, AddThisComponent
+  ],
+  providers:[
+    PreviousRouteRecorder
+   ],
+  exports: [
+     TabPagingComponent, ShowTitleComponent, AddThisComponent
+    ]
+})
+export class LandingModule { }
diff --git a/landingPages/landing-utils/metrics.component.ts b/landingPages/landing-utils/metrics.component.ts
new file mode 100644
index 00000000..b4c75833
--- /dev/null
+++ b/landingPages/landing-utils/metrics.component.ts
@@ -0,0 +1,224 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Metrics} from '../../utils/entities/metrics';
+import {MetricsService } from '../../services/metrics.service';
+import {ErrorCodes} from '../../utils/properties/openaireProperties';
+
+import { Subscription }   from 'rxjs/Subscription';
+
+@Component({
+    selector: 'metrics',
+    template: `
+    <!--div *ngIf="i>0 && tab.content=='metricsTab' && metrics != undefined" class="uk-panel uk-padding uk-background-muted"-->
+    <!--/div-->
+
+    <!--dl *ngIf="metrics != undefined"
+        class="uk-description-list-horizontal uk-panel uk-padding uk-background-muted">
+        <dt *ngIf="type=='results'">Total Downloads: </dt>
+        <dt *ngIf="type!='results'" class="uk-text-break">
+            Total <span [innerHTML]="name"></span> Publication Downloads:
+        </dt>
+        <dd>{{metrics.totalDownloads}}</dd>
+        <dt>Total Views: </dt>
+        <dd>{{metrics.totalViews}}</dd>
+    </dl-->
+
+    <!--div *ngIf="metrics == undefined" class="uk-alert uk-alert-warning">
+        Metrics are currently unavailable
+    </div-->
+
+    <!--div *ngIf="status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+    <div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary" role="alert">No Results found</div>
+    <div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning" role="alert">An Error Occured</div>
+    <div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service temprorarily unavailable. Please try again later.</div>
+    <div *ngIf="status == errorCodes.NOT_FOUND" class="uk-alert uk-alert-danger" role="alert">No metrics found</div-->
+    <errorMessages [status]="[status]" [type]="'metrics'"></errorMessages>
+    <div *ngIf="metrics != undefined" class="uk-child-width-1-3@m uk-grid-small uk-grid-match uk-grid" uk-grid="">
+        <div *ngIf="entityType == 'projects'" class="uk-width-1-1 uk-text-center uk-text-meta uk-margin">Project metrics are derived from aggregating individual research results metrics.</div>
+      <div class="metrics-openaire uk-first-column">
+          <div class="uk-tile uk-tile-default uk-padding-small">
+            <!--div class="uk-clearfix">
+                <div class="uk-float-left  " uk-tooltip="pos:right; delay:5"
+                      title='<div    class= "uk-margin uk-padding-small">
+                        <p>Info about the value....</p>
+                      </div>'><span class="uk-icon">
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+</span>
+                </div>
+            </div-->
+            <div class="uk-text-center">{{pageViews}}</div>
+              <div class="uk-text-center">views in OpenAIRE</div>
+              <!--div  *ngIf="entityType!='results'" class="uk-text-center">Research results views  in OpenAIRE</div-->
+              <!--div class="uk-margin-top uk-article-meta">
+                <div *ngIf="entityType != 'results'">Research results page views in OpenAIRE</div>
+                <div *ngIf="entityType == 'results'">{{entity}} page views in OpenAIRE</div>
+              </div-->
+
+          </div>
+      </div>
+      <div class="metrics-views">
+          <div class="uk-tile uk-tile-muted uk-padding-small">
+              <!--div class="uk-clearfix">
+                  <div class="uk-float-left  " uk-tooltip="pos:right; delay:5"
+                        title='<div    class= "uk-margin uk-padding-small">
+                          <p>Info about the value....</p>
+                        </div>'><span class="uk-icon">
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+</span>
+                  </div>
+              </div-->
+              <div class="uk-text-center">  {{metrics.totalViews}}
+              <span *ngIf="metrics.totalViews > 0 && metrics.totalOpenaireViews > 0">
+              ( {{metrics.totalOpenaireViews}} from OpenAIRE )
+              </span></div>
+              <div  class="uk-text-center">views in local repository</div>
+              <!--div  *ngIf="entityType!='results'" class="uk-text-center"> research results views in local repository</div-->
+              <!--div  *ngIf="type!='results'" class="uk-text-center">  Total <span [innerHTML]="name"></span> Research Results Views</div-->
+
+
+                <!--div class="uk-margin-top uk-article-meta">
+                  <div *ngIf="entityType == 'projects'">Research results page views in Repositories</div>
+                  <div *ngIf="entityType == 'datasources'">Research results page views in Repository</div>
+                  <div *ngIf="entityType == 'results'">{{entity}} page views in Repositories</div>
+                  <div *ngIf="entityType!='datasources' && metrics.totalOpenaireViews > 0">
+                    Of the {{metrics.totalViews}} views, repositories accessed {{metrics.totalOpenaireViews}} time(s) from OpenAIRE
+                  </div>
+                  <div *ngIf="entityType=='datasources' && metrics.totalOpenaireViews > 0">
+                    Of the {{metrics.totalViews}} views, repository accessed {{metrics.totalOpenaireViews}} time(s) from OpenAIRE
+                  </div>
+                </div-->
+          </div>
+      </div>
+      <div class="metrics-downloads">
+          <div class="uk-tile uk-tile-primary uk-padding-small">
+              <!--div class="uk-clearfix">
+                  <div class="uk-float-left  " uk-tooltip="pos:right; delay:5"
+                        title='<div    class= "uk-margin uk-padding-small">
+                          <p>Info about the value....</p>
+                        </div>'><span class="uk-icon">
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" icon="info" ratio="1"><path d="M12.13,11.59 C11.97,12.84 10.35,14.12 9.1,14.16 C6.17,14.2 9.89,9.46 8.74,8.37 C9.3,8.16 10.62,7.83 10.62,8.81 C10.62,9.63 10.12,10.55 9.88,11.32 C8.66,15.16 12.13,11.15 12.14,11.18 C12.16,11.21 12.16,11.35 12.13,11.59 C12.08,11.95 12.16,11.35 12.13,11.59 L12.13,11.59 Z M11.56,5.67 C11.56,6.67 9.36,7.15 9.36,6.03 C9.36,5 11.56,4.54 11.56,5.67 L11.56,5.67 Z"></path><circle fill="none" stroke="#000" stroke-width="1.1" cx="10" cy="10" r="9"></circle></svg>
+</span>
+                  </div>
+              </div-->
+              <div class="uk-text-center">  {{metrics.totalDownloads}}
+              <span *ngIf="metrics.totalDownloads > 0 && metrics.totalOpenaireDownloads > 0">
+              ( {{metrics.totalOpenaireDownloads}} from OpenAIRE )
+              </span></div>
+              <div class="uk-text-center">downloads in local repository</div>
+              <!--div  *ngIf="entityType!='results'" class="uk-text-center">research results downloads in local repository</div-->
+              <!--div *ngIf="type!='results'" class="uk-text-center">Total <span [innerHTML]="name"></span> Research Results Downloads</div-->
+
+
+                <!--div class="uk-margin-top uk-article-meta">
+                  <div *ngIf="entityType == 'projects'">Research results page downloads in Repositories</div>
+                  <div *ngIf="entityType == 'datasources'">Research results page downloads in Repository</div>
+                  <div *ngIf="entityType == 'results'">{{entity}} page downloads in Repositories</div>
+                  <div *ngIf="entityType!='datasources' && metrics.totalOpenaireDownloads > 0">
+                    Of the {{metrics.totalDownloads}} downloads, repositories accessed {{metrics.totalOpenaireDownloads}} time(s) from OpenAIRE
+                  </div>
+                  <div *ngIf="entityType=='datasources' && metrics.totalOpenaireDownloads > 0">
+                    Of the {{metrics.totalDownloads}} downloads, repository accessed {{metrics.totalOpenaireDownloads}} time(s) from OpenAIRE
+                  </div>
+                </div-->
+
+          </div>
+      </div>
+
+  </div>
+
+<p *ngIf="metrics != undefined && metrics.infos.size > 0" >The information is available from the following content providers: </p>
+    <table *ngIf="metrics != undefined && metrics.infos.size > 0"
+            class="uk-table uk-table-striped">
+        <thead>
+            <tr>
+                <th class="uk-text-center uk-text-bold">From</th>
+                <th class="uk-text-center  uk-text-bold">Number Of Views</th>
+                <th class="uk-text-center  uk-text-bold">Number Of Downloads</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr *ngFor="let key of metrics.infos.keys()">
+                <td class="uk-text-center">
+                    <a href="{{metrics.infos.get(key).url}}">
+                        {{metrics.infos.get(key).name}}
+                    </a>
+                </td>
+                <td class="uk-text-center">
+                    {{metrics.infos.get(key).numOfViews}}
+                    <span *ngIf="metrics.infos.get(key).numOfViews > 0 && metrics.infos.get(key).openaireViews > 0">
+                      ( {{metrics.infos.get(key).openaireViews}} from OpenAIRE )
+                    </span>
+                </td>
+                <td class="uk-text-center">
+                    {{metrics.infos.get(key).numOfDownloads}}
+                    <span *ngIf="metrics.infos.get(key).numOfDownloads > 0 && metrics.infos.get(key).openaireDownloads > 0">
+                      ( {{metrics.infos.get(key).openaireDownloads}} from OpenAIRE )
+                    </span>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    `
+    })
+
+export class MetricsComponent {
+    @Output() metricsResults = new EventEmitter();
+    @Input() id: string;
+    @Input() entityType: string;
+    @Input() entity: string;
+    //@Input() name: string = "";
+    @Input() pageViews: number = 0;
+
+    public metrics: Metrics;
+    public errorCodes:ErrorCodes;
+    private sub: Subscription;
+
+    public status: number;
+
+    constructor (private _metricsService: MetricsService) {}
+
+    ngOnInit() {
+        this.errorCodes = new ErrorCodes();
+        this.status = this.errorCodes.LOADING;
+        this.getMetrics();
+    }
+
+    ngOnDestroy() {
+        this.sub.unsubscribe();
+    }
+
+    private getMetrics() {
+        //if(this.id == undefined || this.id == "") {
+        //    console.log("supplied id in metrics is not acceptable");
+        //}
+        //if(this.type == undefined || this.type == "") {
+        //    console.log("supplied id in metrics is not acceptable");
+        //}
+
+        this.sub = this._metricsService.getMetrics(this.id, this.entityType).subscribe(
+         data => {
+             this.metrics = data;
+             this.status = this.errorCodes.DONE;
+
+             this.metricsResults.emit({
+                 totalViews: this.metrics.totalViews,
+                 totalDownloads: this.metrics.totalDownloads,
+                 pageViews: this.metrics.pageViews
+             });
+         },
+         err => {
+           console.log(err);
+           if(err.status == '404') {
+             this.status = this.errorCodes.NOT_FOUND;
+           } else if(err.status == '500') {
+             this.status = this.errorCodes.ERROR;
+           } else {
+             this.status = this.errorCodes.NOT_AVAILABLE;
+           }
+           this.metricsResults.emit({
+               totalViews: 0,
+               totalDownloads: 0
+           });
+         }
+       );
+    }
+}
diff --git a/landingPages/landing-utils/metrics.module.ts b/landingPages/landing-utils/metrics.module.ts
new file mode 100644
index 00000000..3fb241b4
--- /dev/null
+++ b/landingPages/landing-utils/metrics.module.ts
@@ -0,0 +1,26 @@
+/* This module contains all common components for all landing pages */
+
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+ import {MetricsComponent} from './metrics.component';
+ import { MetricsService } from '../../services/metrics.service';
+
+ import {ErrorMessagesModule} from '../../utils/errorMessages.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, ErrorMessagesModule
+  ],
+  declarations: [
+    MetricsComponent
+  ],
+  providers:[
+    MetricsService
+   ],
+  exports: [
+    MetricsComponent
+  ]
+})
+export class MetricsModule { }
diff --git a/landingPages/landing-utils/parsingFunctions.class.ts b/landingPages/landing-utils/parsingFunctions.class.ts
new file mode 100644
index 00000000..70b8e0c2
--- /dev/null
+++ b/landingPages/landing-utils/parsingFunctions.class.ts
@@ -0,0 +1,529 @@
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+export class ParsingFunctions {
+
+  constructor () {}
+
+  public ngOnDestroy() {}
+
+  public parseFundingByProjects(fundedByProjects: { "id": string, "acronym": string, "title": string,
+                                                    "funderShortname": string, "funderName": string,
+                                                    "funding": string, "code": string,
+                                                    "provenanceAction": string, "inline": boolean
+                                                  }[],
+                                relation: any, projectsProvenanceVocabulary: any):
+                            { "id": string, "acronym": string, "title": string,
+                              "funderShortname": string, "funderName": string,
+                              "funding": string, "code": string,
+                              "provenanceAction": string, "inline": boolean
+                            }[] {
+    if(fundedByProjects == undefined) {
+      fundedByProjects = new Array<{"id": string, "acronym": string, "title": string,
+                                    "funderShortname": string, "funderName": string,
+                                    "funding": string, "code": string,
+                                    "provenanceAction": string, "inline": boolean
+                                  }>();
+    }
+
+    let fundedByProject:  { "id": string, "acronym": string, "title": string,
+                            "funderShortname": string, "funderName": string,
+                            "funding": string, "code": string,
+                            "provenanceAction": string, "inline": boolean
+                          } = { "id": "", "acronym": "", "title": "",
+                                "funderShortname": "", "funderName": "",
+                                "funding": "", "code": "", "provenanceAction": "", "inline": false
+                          };
+
+    if(relation.title != 'unidentified') {
+      fundedByProject['id'] = relation['to'].content;
+      fundedByProject['acronym'] = relation.acronym;
+      fundedByProject['title'] = relation.title;
+      fundedByProject['code'] = relation.code;
+
+      if(relation.provenanceaction in projectsProvenanceVocabulary) {
+        fundedByProject['provenanceAction'] = projectsProvenanceVocabulary[relation.provenanceaction];
+      }
+    } else {
+      fundedByProject['id'] = "";
+      fundedByProject['acronym'] = "";
+      fundedByProject['title'] = "";
+      fundedByProject['code'] = "";
+      fundedByProject['provenanceAction'] = "";
+    }
+
+    if(relation.hasOwnProperty("funding")) {
+      let funding: {"funderName": string, "funderShortname": string, "stream": string};
+      funding = this.parseFundingTrees(relation.funding);
+
+      if(funding.funderName) {
+        fundedByProject['funderName'] = funding.funderName;
+      }
+      if(funding.funderShortname) {
+        fundedByProject['funderShortname'] = funding.funderShortname;
+      }
+      if(funding.stream) {
+        fundedByProject['funding'] = funding.stream;
+      }
+    }
+    fundedByProjects.push(fundedByProject);
+    return fundedByProjects;
+  }
+
+  // publication & research data : for fundedByProjects | project landing : for funding
+  public parseFundingTrees(fundingTree: any): {"funderName": string, "funderShortname": string, "stream": string} {
+    let funding: {"funderName": string, "funderShortname": string, "stream": string} = {"funderName": "", "funderShortname": "", "stream": ""};
+    let length = Array.isArray(fundingTree) ? fundingTree.length : 1;
+
+    for(let i=0; i<length; i++) {
+      let fundingData = Array.isArray(fundingTree) ? fundingTree[i] : fundingTree;
+
+      if(fundingData.hasOwnProperty("funder")) {
+        funding.funderShortname = fundingData['funder'].shortname;
+        funding.funderName = fundingData['funder'].name;
+      }
+
+      funding.stream = this.addFundingLevel0(fundingData, funding.stream);
+
+      funding.stream = this.addFundingLevel1(fundingData, funding.stream);
+
+      funding.stream = this.addFundingLevel2(fundingData, funding.stream);
+    }
+    return funding;
+  }
+
+  addFundingLevel0(parent: string, fundingStream: string) : string {
+    if(parent.hasOwnProperty("funding_level_0")) {
+      let level0 = parent['funding_level_0'];
+
+      fundingStream += (fundingStream) ? " ; " : "";
+      fundingStream += level0.name;
+    }
+    return fundingStream;
+  }
+
+  addFundingLevel1(parent: string, fundingStream: string): string {
+    if(parent.hasOwnProperty("funding_level_1")) {
+      let level1 = parent['funding_level_1'];
+
+      // For projects' parsing
+      if(level1.hasOwnProperty("parent")) {
+        fundingStream = this.addFundingLevel0(level1.parent, fundingStream);
+      }
+
+      fundingStream += (fundingStream) ? " | " : "";
+      fundingStream += level1.name;
+    }
+    return fundingStream;
+  }
+
+  addFundingLevel2(parent: string, fundingStream: string): string {
+    if(parent.hasOwnProperty("funding_level_2")) {
+      let level2 = parent['funding_level_2'];
+
+      // For projects' parsing
+      if(level2.hasOwnProperty("parent")) {
+        fundingStream = this.addFundingLevel1(level2.parent, fundingStream);
+      }
+
+      fundingStream += (fundingStream) ? " | " : "";
+      fundingStream += level2.name;
+    }
+    return fundingStream;
+  }
+
+  // publication & dataset landing : for collectedFrom
+  parseCollectedFrom( collectedFrom: {"name": string, "id": string}[],
+                     _collectedFrom: any) {
+    let length: number = collectedFrom.length;
+    collectedFrom[length] = {"name": "", "id": ""};
+    collectedFrom[length]['name'] = _collectedFrom.name;
+    collectedFrom[length]['id'] = _collectedFrom.id;
+  }
+
+  // publication & dataset landing : for downloadFrom
+  addPublisherToHostedBy_collectedFrom( hostedBy_collectedFrom: {"downloadName": string, "downloadUrl": string[], "collectedName": string, "collectedId": string, "accessMode": string[], "bestAccessMode": string, "type": string, "year":string}[],
+                              publisher: string, journal:{"journal": string, "issn": string, "lissn": string},
+                              identifiers: Map<string, string[]>, title: { "name": string, "url": string, "accessMode": string}) {
+    if( publisher && identifiers != null && identifiers.has('doi')) {
+      if( hostedBy_collectedFrom == null) {
+        hostedBy_collectedFrom = new Array<{"downloadName": string, "downloadUrl": string[], "collectedName": string, "collectedId": string, "accessMode": string[], "bestAccessMode": string, "type": string, "year":string}>();
+      }
+      let available: {"downloadName": string, "downloadUrl": string[], "collectedName": string, "collectedId": string, "accessMode": string[], "bestAccessMode": string, "type": string, "year":string};
+      available = {"downloadName": "", "downloadUrl": null, "collectedName": "", "collectedId": "", "accessMode": null, "bestAccessMode": null, "type": "", "year": ""};
+
+      if(journal && journal.journal) {
+        available.downloadName = publisher + "/ "+journal['journal'];
+      } else {
+        available.downloadName = publisher;
+      }
+
+      let url = OpenaireProperties.getDoiURL()+identifiers.get("doi")[0];
+
+      available.downloadUrl = new Array<string>();
+      available.accessMode = new Array<string>();
+
+      available.downloadUrl.push(url);
+
+      if(title != undefined && title['url'] == "") {
+        title['url'] = url;
+      }
+      hostedBy_collectedFrom.push(available);
+    }
+    return hostedBy_collectedFrom;
+  }
+
+  // publication & dataset landing : for downloadFrom
+  parseDownloadFrom(downloadFrom: Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>, instance: any, url: string)
+  {
+    let key: string = instance['hostedby'].name;
+
+    if(key) {
+      this.addUrlAndAccessMode(downloadFrom, instance, key, url);
+    }
+  }
+
+  // publication & dataset landing : for publishedIn
+  parsePublishedIn(publishedIn: Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>, instance: any, result: any, url: string, counter: number): number {
+    if(result != null && result.hasOwnProperty("source")) {
+      let key: string;
+      if(Array.isArray(result.source)) {
+        if(counter==result.source.length) {
+          counter--;
+        }
+        key = result['source'][counter];
+      } else {
+        key = result['source'];
+      }
+
+      if(key) {
+        this.addUrlAndAccessMode(publishedIn, instance, key, url);
+        counter++;
+      }
+    }
+    return counter;
+  }
+
+  // publication & dataset landing : for downloadFrom and publishedIn
+  addUrlAndAccessMode(mapStructure: Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>, instance: any, key: string, url: string) {
+    if(!mapStructure.has(key)) {
+      mapStructure.set(key, {"url": null, "accessMode": null, "bestAccessMode": null});
+    }
+
+    if(mapStructure.get(key)['url'] == null) {
+      mapStructure.get(key)['url'] = new Array<string>();
+    }
+
+    if(url) {
+      mapStructure.get(key)['url'].push(url);
+    }
+
+    if(mapStructure.get(key)['accessMode'] == null) {
+      mapStructure.get(key)['accessMode'] = new Array<string>();
+    }
+
+    if(instance.hasOwnProperty("accessright")) {
+      if(url) {
+        mapStructure.get(key)['accessMode'].push(instance['accessright'].classid);
+      }
+
+      if(this.changeBestAccessMode(mapStructure.get(key)['bestAccessMode'], instance['accessright'])) {
+        mapStructure.get(key)['bestAccessMode'] = instance['accessright'].classid;
+      }
+    } else if(url) {
+      mapStructure.get(key)['accessMode'].push("");
+    }
+  }
+
+
+  parseHostedBy_collectedFrom(hostedBy_collectedFrom: { "downloadName": string, "downloadUrl": string[],
+                                  "collectedName": string, "collectedId": string,
+                                  "accessMode": string[], "bestAccessMode": string,
+                                  "type": string, "year":string }[],
+                   instance: any, data: any, url: string, counter: number,
+                   title: { "name": string, "url": string, "accessMode": string}): number {
+     let available: {"downloadName": string, "downloadUrl": string[], "collectedName": string, "collectedId": string, "accessMode": string[], "bestAccessMode": string, "type": string, "year":string};
+     available = {"downloadName": "", "downloadUrl": null, "collectedName": "", "collectedId": "", "accessMode": null, "bestAccessMode": null, "type": "", "year": ""};
+
+     if(instance['hostedby'].name && instance['hostedby'].name != "other resources" && instance['hostedby'].name != "Unknown Repository") {
+       available.downloadName = instance['hostedby'].name;
+     } else {
+       if(data != null && data.hasOwnProperty("source")) {
+         let downloadName: string;
+         if(Array.isArray(data.source)) {
+
+           if(counter==data.source.length) {
+             counter--;
+           }
+           downloadName = data['source'][counter];
+         } else {
+           downloadName = data['source'];
+         }
+         if(downloadName) {
+           counter++;
+           available.downloadName = downloadName;
+         }
+       }
+
+     }
+
+     if(available.downloadName) {
+       if(instance.hasOwnProperty("collectedfrom")) {
+         available.collectedId = instance['collectedfrom'].id;
+         available.collectedName = instance['collectedfrom'].name;
+       }
+
+       if(instance.hasOwnProperty("instancetype") && instance['instancetype'].classname) {
+         available.type = instance['instancetype'].classname;
+       }
+
+       if(instance.hasOwnProperty("dateofacceptance")) {
+         var date:string = (instance.dateofacceptance)+""; // transform to string in case it is an integer
+         available.year  = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+       }
+
+       available.accessMode = new Array<string>();
+       available.downloadUrl = new Array<string>();
+       available['downloadUrl'].push(url);
+       if(instance.hasOwnProperty("accessright")) {
+         if(url) {
+           available['accessMode'].push(instance['accessright'].classid);
+         }
+
+         if(this.changeBestAccessMode(available.bestAccessMode, instance['accessright'])) {
+           available.bestAccessMode = instance['accessright'].classid;
+
+           if(title != undefined) {
+             if(this.changeBestAccessMode(title['accessMode'], instance['accessright'])) {
+               title['accessMode'] = instance['accessright'].classid;
+               title['url'] = url;
+             }
+           }
+         }
+
+         if(title != undefined) {
+           if(!title['url']) {
+             title['url'] = url;
+           }
+         }
+
+       } else if(url) {
+         available['accessMode'].push("");
+       }
+
+       hostedBy_collectedFrom.push(available);
+     }
+
+     return counter;
+  }
+
+  // publication & dataset landing : for downloadFrom and publishedIn
+  changeBestAccessMode(currentAccessMode: string, accessMode: any): boolean {
+    if(!accessMode) {
+      return false;
+    }
+    accessMode = accessMode.classid;
+
+    switch (currentAccessMode) {
+      case null:
+        return true;
+      case "CLOSED":
+        if( accessMode == "OPEN" ||
+            accessMode == "EMBARGO" ||
+            accessMode == "RESTRICTED") {
+              return true;
+        }
+        return false;
+      case "RESTRICTED":
+        if( accessMode == "OPEN" ||
+            accessMode == "EMBARGO") {
+              return true;
+        }
+        return false;
+      case "EMBARGO":
+        if(accessMode == "OPEN") {
+          return true;
+      }
+      return false;
+    }
+    return false;
+  }
+
+  // publication & dataset landing : for relatedResearchResults
+  parseRelatedResearchResults(relatedResearchResults: Map<string, { "name": string, "id": string, "date": string,
+                    "trust": number, "class": string}[]>, relation: any, provenanceAction: string) :
+                        Map<string, { "name": string, "id": string, "date": string,
+                                      "trust": number, "class": string}[]> {
+    if(relatedResearchResults == undefined) {
+      relatedResearchResults = new Map<string, {"name": string, "id": string, "date": string,
+                                                "trust": number, "class": string }[]>();
+    }
+
+    if(!relatedResearchResults.has(provenanceAction)) {
+      relatedResearchResults.set(provenanceAction,
+                        new Array<{ "name": string, "id": string, "date": string,
+                                    "trust": number, "class": string }>());
+    }
+    relatedResearchResults.get(provenanceAction).push(this.parseRelatedOrSimilarResearchResult(relation));
+
+    return relatedResearchResults;
+  }
+
+  // publication & dataset landing : for similarResearchResults
+  parseSimilarResearchResults(similarResearchResults: { "name": string, "id": string, "date": string,
+                                                        "trust": number, "class": string}[], relation: any) :
+                { "name": string, "id": string, "date": string, "trust": number, "class": string }[] {
+    if(similarResearchResults == undefined) {
+      similarResearchResults = new Array<{"name": string, "id": string, "date": string,
+                                          "trust": number, "class": string}>();
+    }
+    similarResearchResults.push(this.parseRelatedOrSimilarResearchResult(relation));
+    return similarResearchResults;
+  }
+
+  // publication & dataset landing : for relatedResearchResults and similarResearchResults
+  parseRelatedOrSimilarResearchResult(relation: any): {"name": string, "id": string, "date": string, "trust": number, "class": string} {
+    let researchResult: {"name": string, "id": string, "date": string, "trust": number, "class": string}
+                              = {"name": "", "id": "", "date": "", "trust": null, "class": ""}
+
+    if(relation['resulttype'].classname == "publication") {
+      researchResult['class'] = "publication";
+    } else if(relation['resulttype'].classname == "dataset") {
+      researchResult['class'] = "dataset";
+    } else {
+      researchResult['class'] = "software";
+    }
+
+    researchResult['id'] = relation['to'].content;
+    let titleName = Array.isArray(relation['title']) ? relation['title'][0].content : relation['title'].content;
+    researchResult['name'] = titleName;
+    var date:string = ((Array.isArray(relation.dateofacceptance))?(relation.dateofacceptance[0]):(relation.dateofacceptance))+""; // transform to string in case it is an integer
+    researchResult['date']  = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+    //researchResult['date'] = relation.dateofacceptance.substring(0,4);;
+    researchResult['trust'] = Math.round(relation.trust*100);
+    return researchResult;
+  }
+
+  // publication & dataset landing : for identifiers
+  parseIdentifiers(pid: any): Map<string, string[]> {
+    let identifiers = new Map<string, string[]>();
+
+    if(pid.hasOwnProperty("classname") && pid['classname'] != "") {
+      if(pid.classname == "doi" || pid.classname == "pmc" || pid.classname == "handle") {
+        if(!identifiers.has(pid.classname)) {
+          identifiers.set(pid.classname, new Array<string>());
+        }
+
+        identifiers.get(pid.classname).push(pid.content);
+      }
+    } else {
+      for(let i=0; i<pid.length; i++) {
+        if(pid[i].classname == "doi" || pid[i].classname == "pmc" || pid[i].classname == "handle") {
+          if(!identifiers.has(pid[i].classname)) {
+            identifiers.set(pid[i].classname, new Array<string>());
+          }
+          identifiers.get(pid[i].classname).push(pid[i].content);
+        }
+      }
+    }
+    return identifiers;
+  }
+
+  // publication & dataset landing : for subjects and otherSubjects and classifiedSubjects
+  parseAllSubjects(_subjects: any): [string[], Map<string, string[]>, Map<string, string[]>] {
+    let subjects: string[];
+    let otherSubjects: Map<string, string[]>;
+    let classifiedSubjects: Map<string, string[]>;
+
+    let subject;
+    let length = Array.isArray(_subjects) ? _subjects.length : 1;
+
+    for(let i=0; i<length; i++) {
+      subject = Array.isArray(_subjects) ? _subjects[i] : _subjects;
+      if(subject.classid != "") {
+        if(subject.inferred && subject.inferred == true) {
+          if(classifiedSubjects == undefined) {
+            classifiedSubjects = new Map<string, string[]>();
+          }
+
+          if(!classifiedSubjects.has(subject.classname)) {
+            classifiedSubjects.set(subject.classname, new Array<string>());
+          }
+
+          classifiedSubjects.get(subject.classname).push(subject.content);
+        } else {
+          if(subject.classid == "keyword") {
+            if(subjects == undefined) {
+              subjects = new Array<string>();
+            }
+
+            subjects.push(subject.content);
+          } else {
+            if(otherSubjects == undefined) {
+              otherSubjects = new Map<string, string[]>();
+            }
+
+            if(!otherSubjects.has(subject.classname)) {
+              otherSubjects.set(subject.classname, new Array<string>());
+            }
+            otherSubjects.get(subject.classname).push(subject.content);
+          }
+        }
+      }
+    }
+    return [subjects, otherSubjects, classifiedSubjects];
+  }
+
+  parseContexts(_contexts: any): {"labelContext": string, "labelCategory": string,
+                                  "labelConcept": string, inline:boolean}[] {
+    let contexts = new Array<{"labelContext": string, "labelCategory": string,
+                              "labelConcept": string, inline:boolean}>();
+
+    let position = 0;
+    let labels = "";
+    let context;
+    let length = Array.isArray(_contexts) ? _contexts.length : 1;
+    for(let i=0; i<length; i++) {
+      context = Array.isArray(_contexts) ? _contexts[i] : _contexts;
+
+      if(context.hasOwnProperty("type") && context['type'] == "community") {
+        if(context.hasOwnProperty("category")) {
+          if(context['category'].hasOwnProperty("concept")) {
+            let categoryConcept;
+            let length1 = Array.isArray(context['category']['concept']) ? context['category']['concept'].length : 1;
+            for(let j=0; j<length1; j++) {
+              categoryConcept = Array.isArray(context['category']['concept']) ? context['category']['concept'][j] : context['category']['concept'];
+
+              contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false };
+              contexts[position]['labelContext'] = context.label;
+              contexts[position]['labelCategory'] = context['category'].label;
+              contexts[position]['labelConcept'] = categoryConcept.label;
+
+              position++;
+            }
+          } else {
+            contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false};
+            contexts[position]['labelContext'] = context.label;
+            contexts[position]['labelCategory'] = context['category'].label;
+            contexts[position]['labelConcept'] = null;
+          }
+        } else {
+          contexts[position] = {"labelContext": "", "labelCategory": "", "labelConcept": "", inline: false};
+          contexts[position]['labelContext'] = context.label;
+          contexts[position]['labelCategory'] = null;
+          contexts[position]['labelConcept'] = null;
+          contexts[position]['new'] = false;
+        }
+      }
+    }
+    return contexts;
+  }
+
+  parseTypes(types: string[], uniqueTypes: Set<string>, instance: any) {
+    if(instance.hasOwnProperty("instancetype") && instance['instancetype'].classname) {
+      if(!uniqueTypes.has(instance['instancetype'].classname)) {
+        types.push(instance['instancetype'].classname);
+        uniqueTypes.add(instance['instancetype'].classname);
+      }
+    }
+  }
+}
diff --git a/landingPages/landing-utils/publishedIn.component.ts b/landingPages/landing-utils/publishedIn.component.ts
new file mode 100644
index 00000000..7a4f47be
--- /dev/null
+++ b/landingPages/landing-utils/publishedIn.component.ts
@@ -0,0 +1,71 @@
+import {Component, Input, ElementRef} from '@angular/core';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'publishedIn',
+    template: `
+      <dl class="uk-description-list-line">
+        <dt class="title">Published in</dt>
+        <dd class="line" *ngFor="let key of getKeys(publishedIn) let i=index">
+          <div *ngIf="i<5 || showAll" class="{{publishedIn.get(key)['bestAccessMode']}}">
+            <span [class]="publishedIn.get(key)['url'].length > 0 ? 'custom-external custom-icon' : ''">
+              <span *ngIf="publishedIn.get(key)['url'].length > 1">
+                {{key}}
+                <span *ngFor="let url of publishedIn.get(key)['url']; let i=index">
+                  <a  href="{{url}}" target="_blank"
+                      [attr.uk-tooltip]="publishedIn.get(key)['accessMode'][i] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                      [title]="publishedIn.get(key)['accessMode'][i]">
+                    [{{i+1}}]
+                  </a>
+                </span>
+              </span>
+              <a *ngIf="publishedIn.get(key)['url'].length == 1"
+                  href="{{publishedIn.get(key)['url']}}"
+                  target="_blank"
+                  [attr.uk-tooltip]="publishedIn.get(key)['bestAccessMode'] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                  [title]="publishedIn.get(key)['bestAccessMode']">
+                {{key}}
+              </a>
+              <span *ngIf="publishedIn.get(key)['url'].length == 0"
+                    [attr.uk-tooltip]="publishedIn.get(key)['bestAccessMode'] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                    [title]="publishedIn.get(key)['bestAccessMode']">
+                {{key}}
+              </span>
+            </span>
+          </div>
+        </dd>
+        <dd *ngIf="showAll" class="uk-text-right">
+          <a class="uk-text-muted" (click)="showAll = !showAll; scroll()">
+            View less
+          </a>
+        </dd>
+        <dd *ngIf="!showAll && publishedIn.size > 5">...</dd>
+        <dd *ngIf="!showAll && publishedIn.size > 5" class="uk-text-right">
+          <a class="uk-text-muted" (click)="showAll = !showAll;">
+            View more
+          </a>
+        </dd>
+      </dl>
+    `
+    })
+
+export class PublishedInComponent {
+    //key is name
+    @Input() publishedIn: Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>;
+
+    public showAll: boolean = false;
+
+    constructor (private element: ElementRef) {}
+
+    ngOnInit() {}
+
+    public scroll() {
+      console.info("scroll into view");
+      if (typeof document !== 'undefined') {
+         this.element.nativeElement.scrollIntoView();
+      }
+    }
+    public getKeys( map) {
+      return Array.from(map.keys());
+    }
+}
diff --git a/landingPages/landing-utils/resultLanding.module.ts b/landingPages/landing-utils/resultLanding.module.ts
new file mode 100644
index 00000000..5233be99
--- /dev/null
+++ b/landingPages/landing-utils/resultLanding.module.ts
@@ -0,0 +1,31 @@
+/* This module contains all common components for Publication & Daasets Landing Pages */
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+import {PagingModule} from '../../utils/paging.module';
+
+import {ShowAuthorsComponent} from './showAuthors.component';
+import {ShowIdentifiersComponent} from './showIdentifiers.component';
+import {ShowSubjectsComponent} from './showSubjects.component';
+import {FundedByComponent} from './fundedBy.component';
+import {PublishedInComponent} from './publishedIn.component';
+import {AvailableOnComponent} from './availableOn.component';
+import {TabTableComponent} from './tabTable.component';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule, PagingModule
+  ],
+  declarations: [
+   ShowAuthorsComponent,ShowIdentifiersComponent,ShowSubjectsComponent,
+   FundedByComponent,PublishedInComponent,AvailableOnComponent,TabTableComponent
+  ],
+  providers:[
+  ],
+  exports: [
+    ShowAuthorsComponent,ShowIdentifiersComponent,ShowSubjectsComponent,
+    FundedByComponent,PublishedInComponent,AvailableOnComponent,TabTableComponent
+  ]
+})
+export class ResultLandingModule { }
diff --git a/landingPages/landing-utils/searchingProjectsInTab.component.ts b/landingPages/landing-utils/searchingProjectsInTab.component.ts
new file mode 100644
index 00000000..c96d23ba
--- /dev/null
+++ b/landingPages/landing-utils/searchingProjectsInTab.component.ts
@@ -0,0 +1,122 @@
+import {Component, Input} from '@angular/core';
+import {ActivatedRoute} from '@angular/router';
+
+import { FetchProjects } from '../../utils/fetchEntitiesClasses/fetchProjects.class';
+import { SearchProjectsService } from '../../services/searchProjects.service';
+
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {StringUtils} from '../../utils/string-utils.class';
+import {RouterHelper} from '../../utils/routerHelper.class';
+
+@Component({
+    selector: 'searchingProjectsTab',
+    template: `
+        <!--div *ngIf="fetchProjects.searchUtils.totalResults == 0" class = "uk-alert">
+            No projects available
+        </div-->
+        <!--div *ngIf="fetchProjects.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No projects available</div>
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+        <div *ngIf="fetchProjects.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+        <errorMessages [status]="[fetchProjects.searchUtils.status]" [type]="'projects'"></errorMessages>
+
+        <div *ngIf="fetchProjects.searchUtils.totalResults > 0">
+            <div class = "uk-text-right" *ngIf = "fetchProjects.searchUtils.totalResultsNoFilters > 10">
+                <a  [queryParams]="routerHelper.createQueryParams(['organization', 'or'], [organizationId, 'and'])"
+                    routerLinkActive="router-link-active" [routerLink]="linkToSearchProjects" class="uk-button uk-button-text">
+                    View all {{fetchProjects.searchUtils.totalResultsNoFilters}} results
+                </a>
+			      </div>
+            <div class= "searchPaging uk-panel uk-margin-top">
+              <div class="uk-clearfix">
+                <div class="uk-float-right" *ngIf="fetchProjects.results  && fetchProjects.searchUtils.totalResults > fetchProjects.searchUtils.size">
+                  <paging-no-load [currentPage]="page" [totalResults]="fetchProjects.searchUtils.totalResults" [term]="keyword" [size]="size"  (pageChange)="pageChange($event)"> </paging-no-load>
+                </div>
+              </div>
+              <ul  *ngIf = "fetchProjects.funders.length > 1" class="uk-list uk-list-divider uk-margin-remove">
+                <li  *ngFor="let filter of fetchProjects.filters "  >
+                    <!--div class="text-bold">Filter by {{filter.title}}:</div-->
+                    <span *ngFor = "let value of filter.values"  class = "uk-animation-fade">
+                       <input [(ngModel)]="value.selected" type="checkbox"  (ngModelChange)="filterChange(value.selected)" />
+                       <span title = "{{value.name}}"> {{value.name}}</span><span *ngIf = "showResultCount === true" > ({{value.number}})</span>
+                    </span>
+                </li>
+
+                <li *ngIf = "fetchProjects.searchUtils.totalResults !=fetchProjects.searchUtils.totalResultsNoFilters "> Filtered {{fetchProjects.searchUtils.totalResults}} results of {{fetchProjects.searchUtils.totalResultsNoFilters}} total results</li>
+                <li></li>
+              </ul>
+
+              <tab-result  [(results)]="fetchProjects.results" [(status)]= "fetchProjects.searchUtils.status"
+                            type="project" urlParam="projectId" [showLoading] = true [showOrganizations] = false>
+              </tab-result>
+            </div>
+        </div>
+    `
+})
+
+export class SearchingProjectsTabComponent {
+    @Input() fetchProjects : FetchProjects;
+    @Input()  organizationId:string = "";
+    public page :number = 1;
+    public size :number = 10;
+    public linkToSearchProjects: string;
+
+    public routerHelper:RouterHelper = new RouterHelper();
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    private filterQuery:string = "";
+
+    constructor (private  route: ActivatedRoute,
+                 private _searchProjectsService: SearchProjectsService) {
+    }
+
+
+    ngOnInit() {
+
+            if(this.organizationId) {
+                this.linkToSearchProjects = OpenaireProperties.getLinkToAdvancedSearchProjects();//+"?organization="+this.organizationId+"or=and";;
+                if(this.fetchProjects.searchUtils.totalResults > 0) {
+                  this.search(false,"");
+                }
+            }
+    }
+
+
+    private search(refine:boolean, filterQuery:string){
+      var refineFields:string [] = ["funder"];
+      this.fetchProjects.getResultsForOrganizations(this.organizationId, filterQuery, this.page, this.size,(refine)?refineFields:[]);
+    }
+
+    public pageChange($event) {
+      this.page=$event.value;
+      this.search(false, this.filterQuery);
+    }
+
+    public filterChange($event) {
+      console.log("Filter Changed");
+      this.updateFilters();
+      //this.search(true, this.filterQuery);
+      this.search(false, this.filterQuery);
+    }
+
+    private updateFilters (){
+      this.filterQuery = "";
+      for (let filter of this.fetchProjects.filters){
+        var filterLimits="";
+        for (let value of filter.values){
+            if(value.selected == true){
+              //filterLimits+=((filterLimits.length == 0)?'':',') +'"'+ StringUtils.URIEncode(value.id)+'"';
+              filterLimits+=((filterLimits.length == 0)?'':' or ')+filter.filterId+' exact ';
+              filterLimits+='"'+ StringUtils.URIEncode(value.id)+'"';
+             }
+        }
+        if(filterLimits.length > 0){
+          //this.filterQuery+=' and '+filter.filterId + ' exact '+ filterLimits + ' ';
+          this.filterQuery+=' and ( ' + filterLimits + ' ) ';
+        }
+
+      }
+      console.log("Filter Changed"+this.filterQuery);
+
+    }
+}
diff --git a/landingPages/landing-utils/searchingProjectsInTab.module.ts b/landingPages/landing-utils/searchingProjectsInTab.module.ts
new file mode 100644
index 00000000..e3d7a061
--- /dev/null
+++ b/landingPages/landing-utils/searchingProjectsInTab.module.ts
@@ -0,0 +1,31 @@
+/* This module contains all common components for all landing pages */
+
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule }       from '@angular/router';
+
+import { ProjectsServiceModule} from '../../services/projectsService.module';
+import { TabResultModule } from '../../searchPages/searchUtils/tabResult.module';
+import { SearchingProjectsTabComponent} from './searchingProjectsInTab.component';
+
+import {PagingModule } from '../../utils/paging.module';
+import {ErrorMessagesModule} from '../../utils/errorMessages.module';
+
+@NgModule({
+  imports: [
+      RouterModule, CommonModule, FormsModule,
+      ProjectsServiceModule, TabResultModule,
+      PagingModule, ErrorMessagesModule
+   ],
+  declarations: [
+     SearchingProjectsTabComponent
+  ],
+  providers:[
+   ],
+  exports: [
+
+    SearchingProjectsTabComponent
+    ]
+})
+export class SearchingProjectsTabModule { }
diff --git a/landingPages/landing-utils/showAuthors.component.ts b/landingPages/landing-utils/showAuthors.component.ts
new file mode 100644
index 00000000..517d9372
--- /dev/null
+++ b/landingPages/landing-utils/showAuthors.component.ts
@@ -0,0 +1,65 @@
+import {Component, Input, ElementRef} from '@angular/core';
+import {RouterHelper} from '../../utils/routerHelper.class';
+
+@Component({
+    selector: 'showAuthors',
+    template: `
+        <span *ngIf="authors != undefined">
+            <div *ngIf="showAll">
+                <a (click)="showAll = !showAll;">View less authors</a>
+            </div>
+            <span *ngFor="let author of authors.slice(0,30) let i=index">
+                  <!--a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="'/search/advanced/'+searchPage">
+                      {{author['name']}}
+                  </a-->
+                  {{author}}
+               <span *ngIf=" i<29 && i<(authors.length-1)">;</span>
+            </span>
+            <span *ngIf="!showAll && authors.length > 30">	... </span>
+            <span *ngIf="showAll">
+                <span *ngFor="let author of authors.slice(30) let i=index">
+                    <!--a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="'/search/advanced/'+searchPage">
+                        {{author['name']}}
+                    </a-->
+                    {{author}}
+                    <span *ngIf="  i<(authors.length-1)">;</span>
+                </span>
+            </span>
+            <span *ngIf="!showAll && authors.length > 30">
+                <a (click)="showAll = !showAll;">
+                    view all {{authors.length}} authors
+                </a>
+            </span>
+            <span *ngIf="showAll">
+                <a (click)="showAll = !showAll; scroll()">View less authors</a>
+            </span>
+        </span>
+
+    `
+
+    })
+
+export class ShowAuthorsComponent {
+    @Input() authors: { [key: string]: string }[];
+    @Input() searchPage:string ="publications"
+
+    public showAll: boolean = false;
+    public routerHelper:RouterHelper = new RouterHelper();
+
+    constructor (private element: ElementRef) {
+    }
+
+    ngOnInit() {
+    }
+
+    public  quote(params: string):string {
+        return '"'+params+'"';
+    }
+
+    public scroll() {
+      console.info("scroll into view");
+      if (typeof document !== 'undefined') {
+         this.element.nativeElement.scrollIntoView();
+      }
+    }
+}
diff --git a/landingPages/landing-utils/showIdentifiers.component.ts b/landingPages/landing-utils/showIdentifiers.component.ts
new file mode 100644
index 00000000..1092d55c
--- /dev/null
+++ b/landingPages/landing-utils/showIdentifiers.component.ts
@@ -0,0 +1,94 @@
+import {Component, Input, ElementRef} from '@angular/core';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'showIdentifiers',
+    template: `
+
+                <span *ngIf="showAll && countIdentifiers() > pageSize">
+                    <a (click)="showAll = !showAll;">View less identifiers</a>
+                </span>
+
+                <ng-container *ngFor="let key of getKeys(identifiers) let i=index">
+                  <ng-container *ngIf="countSizeOfPreviousIdentifiers(i) < pageSize">
+                    <ng-container *ngFor="let item of identifiers.get(key) let j=index">
+                      <span *ngIf="(sizeOfPreviousIdentifiers + j) < pageSize || showAll" class="custom-external custom-icon">
+                        <a *ngIf="key=='doi'" href="{{doiURL}}{{item}}" target="_blank">{{key}}: {{item}}</a><a
+                        *ngIf="key=='pmc'" href="{{pmcURL}}{{item}}" target="_blank">{{key}}: {{item}}</a><a
+                        *ngIf="key=='handle'" href="{{handleURL}}{{item}}" target="_blank">{{key}}: {{item}}</a></span><span
+
+                        *ngIf="((sizeOfPreviousIdentifiers + j) < pageSize || showAll) && ((sizeOfPreviousIdentifiers + j) < countIdentifiers()-1)">{{", "}}</span>
+                      <span *ngIf="!showAll && (sizeOfPreviousIdentifiers + j)==pageSize"> ... </span>
+                    </ng-container>
+                  </ng-container>
+                </ng-container>
+
+                <span *ngIf="!showAll && countIdentifiers() > pageSize">
+                    <a (click)="showAll = !showAll;">
+                        view all {{countIdentifiers()}} identifiers
+                    </a>
+                </span>
+                <span *ngIf="showAll && countIdentifiers() > pageSize">
+                    <a (click)="showAll = !showAll; scroll()">View less identifiers</a>
+                </span>
+
+
+    `
+    })
+
+export class ShowIdentifiersComponent {
+    @Input() identifiers: Map<string, string[]>;
+    public doiURL: string;
+    public pmcURL: string;
+    public handleURL: string;
+    public showAll: boolean = false;
+    public sizeOfIdentifiers: number = -1;
+    public sizeOfPreviousIdentifiers: number = -1;
+    public pageSize: number = 10;
+
+    constructor (private element: ElementRef) {
+        this.doiURL = OpenaireProperties.getDoiURL();
+        this.pmcURL = OpenaireProperties.getPmcURL();
+        this.handleURL = OpenaireProperties.getHandleURL();
+    }
+
+    ngOnInit() {}
+
+    public countIdentifiers(): number {
+      if(this.sizeOfIdentifiers < 0) {
+        let num: number = 0;
+        if(this.identifiers != undefined) {
+            this.identifiers.forEach(function (value, key, map) {
+                num += value.length;
+            });
+        }
+        this.sizeOfIdentifiers = num;
+      }
+      return this.sizeOfIdentifiers;
+    }
+
+    public countSizeOfPreviousIdentifiers(index: number): number {
+      let num: number = 0;
+      let i: number = 0;
+      if(this.identifiers != undefined) {
+        this.identifiers.forEach(function (value, key, map) {
+          if(i < index) {
+            num += value.length;
+          }
+          i++;
+        });
+      }
+      this.sizeOfPreviousIdentifiers= num;
+      return num;
+    }
+
+    public scroll() {
+      console.info("scroll into view");
+      if (typeof document !== 'undefined') {
+         this.element.nativeElement.scrollIntoView();
+      }
+    }
+    public getKeys( map) {
+      return Array.from(map.keys());
+    }
+}
diff --git a/landingPages/landing-utils/showSubjects.component.ts b/landingPages/landing-utils/showSubjects.component.ts
new file mode 100644
index 00000000..e3f4faa5
--- /dev/null
+++ b/landingPages/landing-utils/showSubjects.component.ts
@@ -0,0 +1,57 @@
+import {Component, Input} from '@angular/core';
+
+@Component({
+    selector: 'showSubjects',
+    template: `
+        <div   *ngIf="subjects != undefined || otherSubjects != undefined || classifiedSubjects != undefined ">
+
+            <div *ngIf="(subjects != undefined && subjects.length > 0) ||
+                       (otherSubjects != undefined && otherSubjects.size > 0) ||
+                       (classifiedSubjects != undefined && classifiedSubjects.size > 0)">
+                <span class="uk-text-bold">Subject:</span>
+
+                <span *ngIf="subjects != undefined && subjects.length > 0"> {{subjects.join(" | ")}} </span>
+                <ul class="uk-list">
+                <li *ngIf="otherSubjects != undefined && otherSubjects.size > 0">
+                    <div *ngFor="let key of getKeys(otherSubjects)">
+                        <span class="uk-text-bold">{{key}}:</span> {{otherSubjects.get(key).join(" | ")}}
+                    </div>
+                </li>
+                <!--li *ngIf="(subjects == undefined || subjects.length == 0) &&
+                           (otherSubjects == undefined || otherSubjects.size == 0) &&
+                           classifiedSubjects != undefined && classifiedSubjects.size > 0">
+                    -
+                </li-->
+                </ul>
+            </div>
+
+            <div *ngIf="classifiedSubjects != undefined && classifiedSubjects.size > 0">
+                <div class="uk-panel uk-padding-small uk-background-muted"  >
+                    <div *ngFor="let key of getKeys(classifiedSubjects)">
+                        <span class="uk-text-bold">Classified by OpenAIRE into</span>
+                        <div>
+                            <span class="uk-text-bold">{{key}}:</span> {{classifiedSubjects.get(key).join(" | ")}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    `
+
+    })
+
+export class ShowSubjectsComponent {
+    @Input() subjects: string[];
+    @Input() otherSubjects: Map<string, string[]>;
+    @Input() classifiedSubjects: Map<string, string[]>;
+    // private showClassifiedSbj: boolean = false;
+
+    constructor () {
+    }
+
+    ngOnInit() {
+    }
+    public getKeys( map) {
+      return Array.from(map.keys());
+    }
+}
diff --git a/landingPages/landing-utils/showTitle.component.ts b/landingPages/landing-utils/showTitle.component.ts
new file mode 100644
index 00000000..a458aae9
--- /dev/null
+++ b/landingPages/landing-utils/showTitle.component.ts
@@ -0,0 +1,66 @@
+import {Component, Input} from '@angular/core';
+import {ActivatedRoute} from '@angular/router';
+
+@Component({
+    selector: 'showTitle',
+    template: `
+        <h2 *ngIf="title != undefined">
+            <!--span [class]="'entityTitleIcon '+iconClass"></span-->
+            <span   *ngIf="title['url'] != undefined && title['url'] != null && title['url'] != ''"
+                    class="custom-external">
+                    <!--span class=" custom-icon {{title['accessMode']}}"
+                    uk-tooltip="pos:bottom-right"
+                    [title]="title['accessMode']"-->
+                <a *ngIf="title['name'] != undefined && title['name'] != ''"
+                    href="{{title['url']}}" target="_blank"
+                    [innerHTML]="title['name']">
+                </a>
+                <a *ngIf="title['name'] == undefined || title['name'] == ''"
+                    href="{{title['url']}}" target="_blank">
+                    [no title available]
+                </a>
+            <!--/span-->
+            </span>
+            <span *ngIf="(title['name'] != undefined && title['name'] != '') &&
+                    (title['url'] == undefined || title['url'] == null || title['url'] == '')"
+                    [innerHTML]="title['name']">
+            </span>
+            <span *ngIf="(title['name'] == undefined || title['name'] == '') &&
+                    (title['url'] == undefined || title['url'] == null || title['url'] == '')"
+                     >
+                [no title available]
+            </span>
+        </h2>
+        <!--[class]="title['accessMode']"
+        uk-tooltip="pos:bottom-right"
+        [title]="title['accessMode']"
+        [innerHTML]="title['name']" -->
+    `
+
+    })
+
+export class ShowTitleComponent {
+  @Input() title: { [key: string]: string };
+  @Input() iconClass:string;
+
+  sub: any;
+
+  constructor (private route: ActivatedRoute) {}
+
+  ngOnInit() {
+    this.sub = this.route.queryParams.subscribe(
+      params => {
+        console.info("onInit showTitle");
+
+        if(this.title['accessMode'] == undefined) {
+          this.title['accessMode'] = "";
+        }
+      }
+    );
+  }
+
+  ngOnDestroy() {
+    console.info("onDestroy showTitle");
+    this.sub.unsubscribe();
+  }
+}
diff --git a/landingPages/landing-utils/tabPaging.component.ts b/landingPages/landing-utils/tabPaging.component.ts
new file mode 100644
index 00000000..f0671764
--- /dev/null
+++ b/landingPages/landing-utils/tabPaging.component.ts
@@ -0,0 +1,24 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+
+@Component({
+    selector: 'tabPaging',
+    template: `
+        <div class="uk-panel" *ngIf="!showAll && length > 10">
+            <a (click)="changeShowAll.emit({value: true});">
+                <div class="uk-float-right">view all {{length}}</div>
+            </a>
+        </div>
+    `
+    })
+
+export class TabPagingComponent {
+    @Input() showAll: boolean;
+    @Input() length: number;
+    @Output() changeShowAll: EventEmitter<any> = new EventEmitter();
+
+    constructor () {
+    }
+
+    ngOnInit() {
+    }
+}
diff --git a/landingPages/landing-utils/tabTable.component.ts b/landingPages/landing-utils/tabTable.component.ts
new file mode 100644
index 00000000..83e51e77
--- /dev/null
+++ b/landingPages/landing-utils/tabTable.component.ts
@@ -0,0 +1,99 @@
+import {Component, Input} from '@angular/core';
+import {RouterHelper} from '../../utils/routerHelper.class';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+//import {PagingModule} from '../utils/paging.module';
+
+@Component({
+    selector: 'tabTable',
+    template: `
+        <div *ngIf="info && info.length > pageSize" class="uk-margin">
+          <span class="uk-text-bold">{{info.length}} research results, page {{page}} of {{totalPages(info.length)}}</span>
+          <paging-no-load class="uk-float-right" [currentPage]="page" [totalResults]="info.length" [size]="pageSize" (pageChange)="updatePage($event)"></paging-no-load>
+        </div>
+
+        <table class="uk-table">
+            <!--thead>
+                <tr>
+                    <th>Title</th>
+                    <th width="20%">Trust</th>
+                </tr>
+            </thead-->
+            <tbody>
+                <tr *ngFor="let item of info.slice((page-1)*pageSize, page*pageSize)" class="{{item['class']}}">
+                    <td *ngIf="item != undefined">
+                        <!--span *ngIf="item['class'] == 'dataset'" class="glyphicon glyphicon-star" aria-hidden="true"-->
+                        <img *ngIf="item['class'] == 'publication'" class= "entityIcon" src="assets/publication.png" alt="(Publication)">
+                        <img *ngIf="item['class'] == 'dataset'" class= "entityIcon" src="assets/dataset.png" alt="(Dataset)">
+                        <img *ngIf="item['class'] == 'software'" class= "entityIcon" src="assets/dataset.png" alt="(Software)">
+
+                        <!--/span-->
+                        <!--a *ngIf="item['url'] != '' && item['name'] != ''" href="{{item['url']}}"-->
+                        <a *ngIf="item['id'] != '' && item['name'] != '' && item['class'] == 'dataset'"
+                            [queryParams]="{datasetId: item.id}" routerLinkActive="router-link-active" routerLink="/search/dataset">
+                                {{item['name']}}
+                        </a>
+
+                        <a *ngIf="item['id'] != '' && item['name'] != '' && item['class'] == 'software'"
+                            [queryParams]="{softwareId: item.id}" routerLinkActive="router-link-active" routerLink="/search/software">
+                                {{item['name']}}
+                        </a>
+
+                        <a *ngIf="item['id'] != '' && item['name'] != '' && item['class'] == 'publication'"
+                            [queryParams]="{articleId: item.id}" routerLinkActive="router-link-active" routerLink="/search/publication">
+                        <!--a *ngIf="item['url'] != '' && item['name'] != '' && item['class'] == 'publication'"
+                            href="http://astero.di.uoa.gr:3000/search/publication?articleId={{item['id']}}"-->
+
+                                {{item['name']}}
+                        </a>
+
+                        <p *ngIf="item['id'] == '' && item['name'] != ''">{{item['name']}}</p>
+                        <span *ngIf="item['date'] != ''">
+                            ({{item['date']}})
+                        </span>
+                    </td>
+                    <td>
+                        <div *ngIf="item['trust'] != ''"  title="{{item['trust']}}%" >
+                            <div class="uk-text-center">{{item['trust']}}%</div>
+                            <progress class="uk-progress uk-margin-remove" value="{{item['trust']}}" max="100"></progress>
+                         </div>
+                        <div *ngIf="item['trust'] == ''">
+                            <p>No trust available</p>
+                        </div>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    `
+
+    })
+
+export class TabTableComponent {
+    @Input() info: { "name": string, "url": string, "date": string, "trust": number}[];//Map<string, string[]>;
+
+    public routerHelper:RouterHelper = new RouterHelper();
+    public searchLinkToPublication: string;
+    public searchLinkToDataset: string;
+
+    public page: number = 1;
+    public pageSize: number = 10;
+
+    constructor () {
+    }
+
+    ngOnInit() {
+        this.searchLinkToPublication = OpenaireProperties.getsearchLinkToPublication();
+        this.searchLinkToDataset = OpenaireProperties.getsearchLinkToDataset();
+    }
+
+    totalPages(totalResults: number): number {
+      let totalPages:any = totalResults/this.pageSize;
+      if(!(Number.isInteger(totalPages))) {
+          totalPages = (parseInt(totalPages, this.pageSize) + 1);
+      }
+      return totalPages;
+    }
+
+    updatePage($event) {
+      this.page = $event.value;
+    }
+}
diff --git a/landingPages/organization/organization-routing.module.ts b/landingPages/organization/organization-routing.module.ts
new file mode 100644
index 00000000..52d44be3
--- /dev/null
+++ b/landingPages/organization/organization-routing.module.ts
@@ -0,0 +1,18 @@
+// import { NgModule } from '@angular/core';
+// import { RouterModule } from '@angular/router';
+//
+// import { OrganizationComponent } from './organization.component';
+// import {FreeGuard} from'../../login/freeGuard.guard';
+// import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+// import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+//
+// @NgModule({
+//  imports: [
+//   RouterModule.forChild([
+//     { path: '', component: OrganizationComponent, canActivate: [FreeGuard, IsRouteEnabled], data: {
+//         redirect: '/error'
+//       },canDeactivate: [PreviousRouteRecorder] }
+//   ])
+// ]
+// })
+// export class OrganizationRoutingModule { }
diff --git a/landingPages/organization/organization.component.html b/landingPages/organization/organization.component.html
new file mode 100644
index 00000000..83ebdb03
--- /dev/null
+++ b/landingPages/organization/organization.component.html
@@ -0,0 +1,196 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div class="uk-container uk-margin-top organization">
+    <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
+    <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
+    <div [style.display]="showLoading ? 'inline' : 'none'"class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+
+    <div *ngIf="organizationInfo != null" uk-grid class="uk-grid-large">
+        <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
+            <showTitle  [title]="organizationInfo.title"></showTitle>
+            <div class="uk-text-large " *ngIf="organizationInfo.title.name && organizationInfo.title.name != organizationInfo.name ">{{organizationInfo.name}}</div>
+            <span   class="uk-label custom-label label-blue label-organization" title="Type">Organization</span>
+            <span *ngIf="organizationInfo.country" class="uk-label custom-label label-country " title="Country">{{organizationInfo.country}}</span>
+
+            <ul class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
+              <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
+                  <a>
+                      Publications
+                      <span class="uk-badge uk-badge-notification">
+                        {{fetchPublications.searchUtils.totalResults}}
+                      </span>
+                  </a>
+              </li>
+                <li (click)="activeTab='Projects'; projectsClicked=true;"
+                    [class]="activeTab == 'Projects'?'uk-active':''">
+                    <a>
+                        Projects
+                        <span class="uk-badge uk-badge-notification">
+                          <!--{{(searchingProjectsTabComponent)?searchingProjectsTabComponent.fetchProjects.totalResults:0}}-->
+                          {{fetchProjects.searchUtils.totalResultsNoFilters}}
+                        </span>
+                    </a>
+                </li>
+                <li (click)="activeTab='Content Providers'; searchDataprovidersInit()"
+                    [class]="activeTab == 'Content Providers'?'uk-active':''">
+                    <a>
+                        Content Providers
+                        <!--span *ngIf="organizationInfo.dataProviders == undefined" class="badge">0</span>
+                        <span *ngIf="organizationInfo.dataProviders != undefined" class="badge">
+                            {{organizationInfo.dataProviders.length}}
+                        </span-->
+                        <span class="uk-badge uk-badge-notification">
+                            {{fetchDataproviders.searchUtils.totalResults}}
+                        </span>
+                    </a>
+                </li>
+            </ul>
+
+            <div class="uk-hidden@m uk-margin-top">
+              <button class="uk-button uk-button-default" type="button">
+                <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
+              </button>
+            </div>
+
+            <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
+              <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
+                  <a>
+                      Publications
+                      <span class="uk-badge uk-badge-notification">
+                        {{fetchPublications.searchUtils.totalResults}}
+                      </span>
+                  </a>
+              </li>
+                <li (click)="activeTab='Projects'; projectsClicked=true;"
+                    [class]="activeTab == 'Projects'?'uk-active':''">
+                    <a>
+                        Projects
+                        <span class="uk-badge uk-badge-notification">
+                          {{fetchProjects.searchUtils.totalResultsNoFilters}}
+                        </span>
+                    </a>
+                </li>
+                <li (click)="activeTab='Content Providers'; searchDataprovidersInit()"
+                    [class]="activeTab == 'Content Providers'?'uk-active':''">
+                    <a>
+                        Content Providers
+                        <span class="uk-badge uk-badge-notification">
+                            {{fetchDataproviders.searchUtils.totalResults}}
+                        </span>
+                    </a>
+                </li>
+            </ul>
+
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+
+                <div *ngIf="activeTab=='Publications'" class="uk-animation-fade">
+                    <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No publications available</div>
+                    <div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+                    <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+                    <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <errorMessages [status]="[fetchPublications.searchUtils.status]" [type]="'publications'"></errorMessages>
+
+                    <div *ngIf="fetchPublications.searchUtils.totalResults > 0">
+                        <div class = "uk-text-right" *ngIf = "fetchPublications.searchUtils.totalResults > 10">
+                            <a  [queryParams]="routerHelper.createQueryParams(['organization', 'or'], [organizationId, 'and'])"
+                                routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications" class="uk-button uk-button-text">
+                                View all {{fetchPublications.searchUtils.totalResults}} results
+                            </a>
+                        </div>
+                        <tab-result  [(results)]="fetchPublications.results"
+                                        [(status)]= "fetchPublications.status"
+                                        type="publication" urlParam="articleId">
+                        </tab-result>
+                    </div>
+                </div>
+                <div *ngIf="activeTab=='Projects'" class="uk-animation-fade">
+                  <searchingProjectsTab *ngIf="projectsClicked" [(fetchProjects)]="fetchProjects" [organizationId]="organizationId"></searchingProjectsTab>
+                </div>
+
+                <div *ngIf="activeTab=='Content Providers'" class="uk-animation-fade">
+                    <!--showDataProviders [dataProviders]="organizationInfo.dataProviders"></showDataProviders-->
+                    <!--div *ngIf="fetchDataproviders.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
+                        No content providers available
+                    </div-->
+
+                    <!--div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No content providers available</div>
+                    <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+                    <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+                    <div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <errorMessages [status]="[fetchDataproviders.searchUtils.status]" [type]="'content providers'"></errorMessages>
+
+                    <div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
+
+                        <div class = "uk-text-right" *ngIf = "fetchDataproviders.searchUtils.totalResults > 10">
+                            <!--a [href] = "linkToSearchDataproviders">
+                                View all {{fetchDataproviders.searchUtils.totalResults}} results
+                            </a-->
+                            <a  [queryParams]="routerHelper.createQueryParams(['organization', 'or'], [organizationId, 'and'])"
+                                routerLinkActive="router-link-active" [routerLink]="linkToSearchDataproviders" class="uk-button uk-button-text">
+                                View all {{fetchDataproviders.searchUtils.totalResults}} results
+                            </a>
+                        </div>
+                        <tab-result  [(results)]="fetchDataproviders.results"
+                                        [(status)]= "fetchDataproviders.status"
+                                        type="dataprovider" urlParam="datasourceId">
+                        </tab-result>
+                    </div>
+                </div>
+            <!--/ul-->
+          </div>
+        </div>
+
+        <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
+          <div class="uk-card uk-card-default uk-padding-small">
+          <div>
+            Share - Bookmark<addThis ></addThis>
+          </div>
+          <div class="uk-margin-medium-top uk-margin-medium-bottom">
+              <div class="uk-text-center uk-text-large">
+                Application Box
+              </div>
+              <div  class="app-box app-box uk-padding-small" >
+                <ul class="uk-list">
+
+                    <ng-container *ngIf="fetchProjects && fetchProjects.funders.length  > 0">
+                            <li *ngFor="let funder of fetchProjects.funders">
+                                <!--a href="{{downloadURLAPI}}resources?size={{organizationInfo.projects.get(key).length}}&{{csvProjectParamsHead}}{{organizationInfo.projects.get(key)[0]['funderId']}}{{csvParamsTail}}">
+                                    Download projects report (CSV) for {{key}}
+                                </a-->
+                                <a class="clickable" (click)="downloadFile(downloadURLAPI+'resources?size='+funder.number+'&'+csvProjectParamsHead+encodeURI(funder.id)+csvParamsTail)">
+                                <!--span class="clickable" (click)="downloadProjectsFile(downloadURLAPI+'organizations/'+organizationId+'/projects?fq=(funderid exact '+funder.id+')&size='+funder.number)"-->
+                                    <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="download" ratio="1"><polyline fill="none" stroke="#000" points="14,10 9.5,14.5 5,10"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="13.91" x2="9.5" y2="3"></line></svg></span>
+                                    <span class="uk-icon-download"> Project list for {{funder.name}} (CSV)</span>
+                                </a>
+                            </li>
+
+                            <li *ngFor="let funder of fetchProjects.funders">
+                                <a class="clickable" (click)="confirmOpenApplyAll(funder.name,encodeURI(funder.id), funder.number)">
+                                    <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="download" ratio="1"><polyline fill="none" stroke="#000" points="14,10 9.5,14.5 5,10"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="13.91" x2="9.5" y2="3"></line></svg></span>
+                                    <span class="uk-icon-download"> Project Publications for {{funder.name}} (CSV)</span>
+                                </a>
+                            </li>
+                    </ng-container>
+                    <li>
+                        <a class="clickable" (click)="downloadFile(downloadURLAPI+'organizations/'+organizationId+'/publications?format=csv')">
+                            <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="download" ratio="1"><polyline fill="none" stroke="#000" points="14,10 9.5,14.5 5,10"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="13.91" x2="9.5" y2="3"></line></svg></span>
+                            <span class="uk-icon-download"> Publications of organization (CSV) - based on the affiliation information.</span>
+                        </a>
+                    </li>
+                </ul>
+              </div>
+            </div>
+        </div>
+
+        </div>
+    </div>
+    <modal-loading></modal-loading>
+    <modal-alert #AlertModalApplyAll (alertOutput)="confirmCloseApplyAll($event)"></modal-alert>
+    <modal-alert #AlertModalCsvError></modal-alert>
+</div>
+</div>
+</div>
+</div>
diff --git a/landingPages/organization/organization.component.ts b/landingPages/organization/organization.component.ts
new file mode 100644
index 00000000..1e02b02d
--- /dev/null
+++ b/landingPages/organization/organization.component.ts
@@ -0,0 +1,489 @@
+import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Subject} from 'rxjs/Subject';
+import {ActivatedRoute, Router} from '@angular/router';
+
+import {OrganizationService} from '../../services/organization.service';
+import {OrganizationInfo} from '../../utils/entities/organizationInfo';
+import {ReportsService} from '../../services/reports.service';
+import {FetchPublications} from '../../utils/fetchEntitiesClasses/fetchPublications.class';
+import {FetchProjects} from '../../utils/fetchEntitiesClasses/fetchProjects.class';
+import {FetchDataproviders} from '../../utils/fetchEntitiesClasses/fetchDataproviders.class';
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchProjectsService} from '../../services/searchProjects.service';
+import { Meta} from '../../../angular2-meta';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchingProjectsTabComponent} from '../landing-utils/searchingProjectsInTab.component';
+import {RouterHelper} from '../../utils/routerHelper.class';
+
+import {ModalLoading} from '../../utils/modal/loading.component';
+import {AlertModal} from '../../utils/modal/alert';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+import {StringUtils} from '../../utils/string-utils.class';
+
+@Component({
+    selector: 'organization',
+    templateUrl: 'organization.component.html',
+})
+
+export class OrganizationComponent {
+    public organizationInfo: OrganizationInfo;
+    public organizationId: string;
+
+    // Message variables
+    public warningMessage = "";
+    public errorMessage = "";
+    public showLoading: boolean = true;
+
+    // CSV variables
+    public downloadURLAPI: string;
+    public csvProjectParamsHead: string;
+    public csvPublicationParamsHead: string;
+    public csvParamsTail: string;
+
+    // Active tab variable for responsiveness
+    public activeTab: string = "Publications";
+
+    // Variables for publications, projects, dataproviders tabs
+    public fetchPublications: FetchPublications;
+    public linkToSearchPublications: string = "";
+    public fetchProjects: FetchProjects;
+    public fetchDataproviders : FetchDataproviders;
+    public linkToSearchDataproviders:string = "";
+    //public projectFunders:string[] = [];
+
+    // Variables for projects query (query results only if projects tab is clicked)
+    public projectsClicked: boolean = false;
+    @ViewChild (SearchingProjectsTabComponent) searchingProjectsTabComponent : SearchingProjectsTabComponent ;
+
+    @ViewChild (ModalLoading) loading : ModalLoading ;
+    // Alert box when CSV: Project Publications for a funder is requested
+    @ViewChild('AlertModalApplyAll') alertApplyAll;
+    // Alert box when something is wrong with CSV requests
+    @ViewChild('AlertModalCsvError') alertCsvError;
+
+    public routerHelper:RouterHelper = new RouterHelper();
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    //private projectsNum: number = 0;
+    //private fundersSet: Set<string>;
+    //private emptyFundersSet: boolean = true;
+
+    // Request results for content providers only the one time (first time tab is clicked)
+    private reloadDataproviders: boolean = true;
+
+    // Helper variables to specify funder in downloadPublicationsFile function
+    private funder: string;
+    private funderId: string;
+    private funderCountPublications: number;
+    sub: any;
+    infoSub: any;
+    piwiksub: any;
+    downloadFileSub: any;
+    downloadFilePiwikSub: any;
+    countProjectsSub: any;
+    countPublSub: any;
+    downloadProjectPublSub: any;
+
+    //private ngUnsubscribe: Subject<void> = new Subject<void>();
+
+    constructor (private element: ElementRef,
+                 private _organizationService: OrganizationService,
+                 private _piwikService:PiwikService,
+                 private  route: ActivatedRoute,
+                 private _searchDataprovidersService: SearchDataprovidersService,
+                 private _reportsService: ReportsService,
+                 private _searchPublicationsService: SearchPublicationsService,
+                 private _searchProjectsService: SearchProjectsService, private _meta: Meta,
+                 private _router: Router) {
+
+            this.fetchPublications = new FetchPublications(this._searchPublicationsService);
+            this.fetchProjects = new FetchProjects(this._searchProjectsService);
+            this.fetchDataproviders = new FetchDataproviders(this._searchDataprovidersService);
+            this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+    }
+
+    ngOnInit() {
+        console.info('organization init');
+        this.sub =  this.route.queryParams.subscribe(params => {
+            this.organizationInfo=null;
+            this.updateTitle("Organization");
+            this.updateDescription("Organization, country, projects,  search, repositories, open access");
+            this.projectsClicked = false;
+
+            this.organizationId = params['organizationId'];
+            console.info("Id is :"+this.organizationId);
+
+            if(this.organizationId){
+                this.getOrganizationInfo();
+            }else{
+                this.showLoading = false;
+                this.warningMessage="No valid organization id";
+            }
+
+            if (typeof document !== 'undefined') {
+               this.element.nativeElement.scrollIntoView();
+            }
+
+            this.csvParamsTail = '" and relorganizationid exact "'+this.organizationId+'" ))';
+
+        });
+
+        this.downloadURLAPI = OpenaireProperties.getCsvAPIURL();
+        this.csvProjectParamsHead = 'format=csv&type=projects&page=0&query=( (oaftype exact project)and (funder exact "';
+        //this.csvPublicationParamsHead = 'format=csv-special&type=publications&page=0&query=((((oaftype exact result) and (resulttypeid exact publication)) and (funderid exact ';
+    }
+
+
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+      if(this.piwiksub){
+        this.piwiksub.unsubscribe();
+      }
+      if(this.infoSub) {
+        this.infoSub.unsubscribe();
+      }
+      if(this.downloadFileSub) {
+        this.downloadFileSub.unsubscribe();
+      }
+      if(this.downloadFilePiwikSub) {
+        this.downloadFilePiwikSub.unsubscribe();
+      }
+      if(this.countProjectsSub) {
+        this.countProjectsSub.unsubscribe();
+      }
+      if(this.countPublSub) {
+        this.countPublSub.unsubscribe();
+      }
+      if(this.downloadProjectPublSub) {
+        this.downloadProjectPublSub.unsubscribe();
+      }
+
+      /*
+      this.ngUnsubscribe.next();
+      this.ngUnsubscribe.complete();
+      */
+    }
+
+    private getOrganizationInfo ()  {
+
+        this.warningMessage = '';
+        this.errorMessage=""
+        this.showLoading = true;
+
+        this.infoSub = this._organizationService.getOrganizationInfo(this.organizationId).subscribe(
+            data => {
+                if(data == null) {
+                    this.showLoading = false;
+                    this.errorMessage = 'No organization found';
+                } else {
+                    this.organizationInfo = data;
+                    this.updateTitle(this.organizationInfo.title.name);
+                    this.updateDescription("Organization, country, projects,  search, repositories, open access"+this.organizationInfo.title.name);
+                    if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                      this.piwiksub = this._piwikService.trackView(this.organizationInfo.title.name).subscribe();
+                    }
+                    var refineFields:string [] = ["funder"];
+
+                    this.searchPublications();
+
+                     this.fetchProjects.getResultsForOrganizations(this.organizationId, "", 1, 0,refineFields);
+
+                    this.fetchDataproviders.getNumForEntity("organization", this.organizationId);
+
+                    this.showLoading = false;
+
+                    /*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);
+                        }.bind(this));
+                    }
+
+                    this.projectsNum = projectsNum;*/
+                }
+            },
+            err => {
+                console.log(err)
+
+                this.errorMessage = 'No organization found';
+                this.showLoading = false;
+            }
+        );
+    }
+/*
+    private getMetrics() {
+        console.info("getOrganizationMetrics: component");
+        this._organizationService.getMetrics(this.organizationId).subscribe(
+         data => {
+             this.metrics = data;
+         },
+         err => {
+           console.log(err);
+         }
+       );
+    }
+*/
+/*
+    private 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");
+         }
+     }
+*/
+     //private getProjectsData(key: string): any {
+         //return this.projectsData;
+     //}
+
+     private searchPublications() {
+       this.fetchPublications.getResultsForEntity("organization", this.organizationId, 1, 10);
+       this.linkToSearchPublications = OpenaireProperties.getLinkToAdvancedSearchPublications();// + "?project=" + this.projectId+"&pr=and";
+       if(this.fetchPublications.searchUtils.totalResults > 0) {
+         //this.activeTab = "Publications";
+       } else {
+         //this.projectsClicked = true;
+       }
+     }
+
+     private searchDataproviders() {
+       this.fetchDataproviders.getResultsForEntity("organization", this.organizationId, 1, 10);
+       this.linkToSearchDataproviders = OpenaireProperties.getLinkToAdvancedSearchDataProviders();
+
+       if(this.fetchDataproviders.searchUtils.totalResults > 0) {
+         this.reloadDataproviders = false;
+         //this.activeTab = "Content Providers";
+       } else {
+
+       }
+     }
+
+     public searchDataprovidersInit() {
+         if(this.reloadDataproviders && this.fetchDataproviders.searchUtils.totalResults > 0) {
+             this.searchDataproviders();
+         }
+     }
+
+     public downloadFile(url:string){
+       console.log("Downloading file: "+ url);
+
+       this.openLoading();
+       this.setMessageLoading("Downloading CSV file");
+
+       this.downloadFileSub = this._reportsService.downloadCSVFile(url).subscribe(
+           data => {
+               this.closeLoading();
+               window.open(window.URL.createObjectURL(data));
+                if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                  this.downloadFilePiwikSub = this._piwikService.trackDownload(url).subscribe();
+                }
+           },
+           err => {
+             console.log("Error downloading the file.");
+             this.closeLoading();
+             this.confirmOpenCsvError();
+           },
+           () => console.log('Completed file download.'));
+     }
+
+     private downloadPublicationsFile(funder: string, funderId:string, count:number){
+       console.log("Downloading publications file");
+
+       this.openLoading();
+       this.setMessageLoading("Downloading CSV file");
+
+       let response: string[] = [];
+       let totalResponse: string = "";
+       let projects = [];
+       let counter: number = count;
+       let title: boolean = false;
+
+       this.countProjectsSub = this._searchProjectsService.getProjectsForOrganizations(this.organizationId,' and (funder exact "'+ funderId + '" ) ',1,count,[]).subscribe(
+           data =>
+               {
+                 projects = data[1];
+                  for(let index=0; index < projects.length; index++) {
+                      this.countPublSub = this._searchPublicationsService.numOfEntityPublications(projects[index].id, "project").subscribe(
+                          data =>
+                              {
+                                  // let index: number = this.organizationInfo.projects.get(funder).indexOf(project);
+
+                                  let url: string;
+                                  if(index == 0 || !title) {
+                                      url = this.downloadURLAPI+"projects/"+projects[index].id+"/publications?format=csv-special&size="+data;
+                                  } else {
+                                      url = this.downloadURLAPI+"projects/"+projects[index].id+"/publications?format=csv-special-notitle&size="+data;
+                                  }
+
+                                  if(data == 0) {   // if no publications for this project
+                                      counter--;
+                                      response[index] = "";
+                                      if(counter == 0) {
+                                          for(let i=0; i<count; i++) {
+                                              if(response[i] != "") {
+                                                  totalResponse += response[i];
+                                              }
+                                          }
+                                          this.closeLoading();
+                                          window.open(window.URL.createObjectURL(new Blob([totalResponse], { type: 'text/csv' })));
+                                          // if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                                          //   this._piwikService.trackDownload(url).subscribe();
+                                          // }
+                                      }
+                                  } else {
+                                      title = true;
+
+                                      this.downloadProjectPublSub = this._reportsService.getCSVResponse(url).subscribe(
+                                          data =>
+                                              {
+                                                  counter--;
+                                                  response[index] = data;
+
+                                                  if(counter == 0) {
+                                                      for(let i=0; i<count; i++) {
+                                                          if(response[i] != "") {
+                                                              totalResponse += response[i];
+                                                          }
+                                                      }
+                                                      this.closeLoading();
+                                                      window.open(window.URL.createObjectURL(new Blob([totalResponse], { type: 'text/csv' })));
+                                                      // if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                                                      //   this._piwikService.trackDownload(url).subscribe();
+                                                      // }
+                                                  }
+                                              },
+                                          err => {
+                                            console.log("Error downloading the file.");
+                                            this.closeLoading();
+                                            this.confirmOpenCsvError();
+                                          },
+                                          () => console.log('Completed file download.')
+                                      );
+                                  }
+                              },
+                          err => console.log("Error getting number of publications for project."));
+                  }//);
+
+               },
+           err => {
+            console.log("Error getting projects project.");
+            this.closeLoading();
+            this.confirmOpenCsvError();
+          }
+        );
+
+      //  let counter: number = this.organizationInfo.projects.get(funder).length;
+       //
+      //  for(let project of this.organizationInfo.projects.get(funder)) {
+      //       this._searchPublicationsService.numOfEntityPublications(project.id, "projects/").subscribe(
+      //           data =>
+      //               {
+      //                   let index: number = this.organizationInfo.projects.get(funder).indexOf(project);
+       //
+      //                   let url: string;
+      //                   if(index == 0) {
+      //                       url = this.downloadURLAPI+"projects/"+project.id+"/publications?format=csv-special&size="+data;
+      //                   } else {
+      //                       url = this.downloadURLAPI+"projects/"+project.id+"/publications?format=csv-special-notitle&size="+data;
+      //                   }
+       //
+      //                   this._reportsService.getCSVResponse(url).subscribe(
+      //                       data =>
+      //                           {
+      //                               counter--;
+       //
+      //                               response[index] = data;
+       //
+      //                               if(counter == 0) {
+      //                                   for(let i=0; i<this.organizationInfo.projects.get(funder).length; i++) {
+      //                                       totalResponse += response[i]+"\n";
+      //                                   }
+      //                                   window.open(window.URL.createObjectURL(new Blob([totalResponse], { type: 'text/csv' })));
+      //                               }
+      //                           },
+      //                       error => console.log("Error downloading the file."),
+      //                       () => console.log('Completed file download.'));
+      //               },
+      //           error => console.log("Error getting number of publications for project."));
+        // }//);
+    }
+
+    private updateDescription(description:string){
+      this._meta.updateMeta("description", description);
+      this._meta.updateProperty("og:description", description);
+    }
+    private updateTitle(title:string){
+      var _prefix ="OpenAIRE | ";
+      var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+      this._meta.setTitle(_title );
+      this._meta.updateProperty("og:title",_title);
+    }
+    private updateUrl(url:string){
+      this._meta.updateProperty("og:url", url);
+    }
+
+    private openLoading(){
+      if(this.loading){
+        this.loading.open();
+      }
+    }
+    private closeLoading(){
+      if(this.loading){
+        this.loading.close();
+      }
+    }
+    private setMessageLoading(message: string){
+      if(this.loading){
+        this.loading.message = message;
+      }
+    }
+
+    public confirmOpenApplyAll(funder: string, funderId:string, funderCountPublications:number){
+      this.alertApplyAll.cancelButton = true;
+      this.alertApplyAll.okButton = true;
+      this.alertApplyAll.alertTitle = "CSV FILE";
+      this.alertApplyAll.message = "Do you wish to download a CSV file? Note that this process may take a while.";
+      this.alertApplyAll.okButtonText = "Yes";
+      this.alertApplyAll.cancelButtonText = "No";
+      this.alertApplyAll.open();
+
+      this.funder = funder;
+      this.funderId = funderId;
+      this.funderCountPublications = funderCountPublications;
+    }
+    public confirmCloseApplyAll(data){
+         this.downloadPublicationsFile(this.funder, this.funderId, this.funderCountPublications);
+    }
+
+    public confirmOpenCsvError(){
+      this.alertCsvError.cancelButton = false;
+      this.alertCsvError.okButton = true;
+      this.alertCsvError.alertTitle = "ERROR DOWNLOADING CSV FILE";
+      this.alertCsvError.message = "There was an error in csv downloading. Please try again later.";
+      this.alertCsvError.okButtonText = "OK";
+      this.alertCsvError.open();
+    }
+
+    encodeURI(input: string): string {
+      return StringUtils.URIEncode(input);
+    }
+}
diff --git a/landingPages/organization/organization.module.ts b/landingPages/organization/organization.module.ts
new file mode 100644
index 00000000..8c17083e
--- /dev/null
+++ b/landingPages/organization/organization.module.ts
@@ -0,0 +1,51 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import {LoadingModalModule} from '../../utils/modal/loadingModal.module';
+import {AlertModalModule} from '../../utils/modal/alertModal.module';
+import {ErrorMessagesModule} from '../../utils/errorMessages.module';
+
+import { OrganizationServiceModule} from '../../services/organizationService.module';
+// import { ProjectsServiceModule} from '../../services/projectsService.module';
+import { OrganizationComponent } from './organization.component';
+// import { OrganizationRoutingModule } from './organization-routing.module';
+
+import { LandingModule } from '../landing-utils/landing.module';
+import {TabResultModule } from '../../searchPages/searchUtils/tabResult.module';
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {ReportsServiceModule} from '../../services/reportsService.module';
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+import {ProjectsServiceModule} from '../../services/projectsService.module';
+
+import { SearchingProjectsTabModule} from '../landing-utils/searchingProjectsInTab.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule,
+    LoadingModalModule, AlertModalModule, ErrorMessagesModule,
+    LandingModule,
+    TabResultModule,
+    DataProvidersServiceModule,
+    ReportsServiceModule,
+    OrganizationServiceModule,
+    SearchingProjectsTabModule,
+    OrganizationServiceModule,
+    PublicationsServiceModule,
+    ProjectsServiceModule
+
+  ],
+  declarations: [
+  OrganizationComponent,
+  ],
+  providers:[
+    FreeGuard, IsRouteEnabled
+   ],
+  exports: [
+  OrganizationComponent
+    ]
+})
+export class OrganizationModule { }
diff --git a/landingPages/project/project-routing.module.ts b/landingPages/project/project-routing.module.ts
new file mode 100644
index 00000000..2eff3b40
--- /dev/null
+++ b/landingPages/project/project-routing.module.ts
@@ -0,0 +1,18 @@
+// import { NgModule } from '@angular/core';
+// import { RouterModule } from '@angular/router';
+//
+// import { ProjectComponent } from './project.component';
+// import {FreeGuard} from'../../login/freeGuard.guard';
+// import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+// import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+//
+// @NgModule({
+//  imports: [
+//   RouterModule.forChild([
+//     { path: '', component: ProjectComponent, canActivate: [FreeGuard, IsRouteEnabled], data: {
+//         redirect: '/error'
+//       },canDeactivate: [PreviousRouteRecorder]  }
+//   ])
+//  ]
+// })
+// export class ProjectRoutingModule { }
diff --git a/landingPages/project/project.component.html b/landingPages/project/project.component.html
new file mode 100644
index 00000000..43a4b467
--- /dev/null
+++ b/landingPages/project/project.component.html
@@ -0,0 +1,400 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div id="project" class="uk-container uk-margin-top project">
+    <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning uk-margin-large-top" role="alert">{{warningMessage}}</div>
+    <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+
+    <div *ngIf="projectInfo != null" uk-grid class="uk-grid-large">
+        <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
+            <!--h3 *ngIf="projectInfo.acronym != undefined && projectInfo.acronym != ''">{{projectInfo.acronym}}</h3>
+            <h3 *ngIf="projectInfo.acronym == undefined || projectInfo.acronym == ''">{{projectInfo.title}}</h3-->
+            <h2 class="projectIcon">
+              <!--span class="entityTitleIcon projectTitleIcon"></span-->
+              <!-- <span *ngIf="projectInfo.specialClause39==true" class="sc39">{{projectName}}</span>
+              <span *ngIf="projectInfo.specialClause39!=true">{{projectName}}</span> -->
+              <span>{{projectName}}</span>
+              <span  *ngIf="  projectInfo.title == projectName ">({{projectInfo.contractNum}})</span>
+            </h2>
+            <div class="uk-text-large " *ngIf="projectInfo.title && projectInfo.title != projectName ">{{projectInfo.title}} ({{projectInfo.contractNum}})</div>
+            <div>
+              <span class="uk-label custom-label label-blue label-project" title="Type">Project</span>
+              <span class="uk-label custom-label label-funder " title="Funder">{{projectInfo.funder}}</span>
+              <span *ngIf="projectInfo.openAccessMandate != undefined && projectInfo.openAccessMandate " class="uk-label custom-label label-openaccessmandate " title="Open Access mandate">Open Access mandate</span>
+              <span *ngIf="projectInfo.specialClause39" class="uk-label custom-label label-sc39 " title="Special Clause 39">Special Clause 39</span>
+            </div>
+            <ul class="uk-list">
+              <li  *ngIf="projectInfo.funding"><span class="uk-text-bold">Funding:</span> {{projectInfo.funding}}</li>
+              <li  *ngIf="projectInfo.startDate"><span class="uk-text-bold">Start Date:</span> {{projectInfo.startDate}}</li>
+              <li  *ngIf="projectInfo.endDate"><span class="uk-text-bold">End Date:</span> {{projectInfo.endDate}}</li>
+              <li  *ngIf="projectInfo.openAccessMandate != undefined && !projectInfo.openAccessMandate "><span class="uk-text-bold">Open Access mandate:</span> no</li>
+              <li *ngIf="projectInfo.organizations && projectInfo.organizations.length > 0"><span class="uk-text-bold">Organization:</span>
+
+                <span class="list-horizontal-line">
+                  <span *ngFor="let organization of projectInfo.organizations let i=index"
+                        [attr.uk-tooltip]="organization.acronym && organization.name ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                        [title]="organization.name">
+                        <a *ngIf="organization.id"
+                            [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
+                            {{(organization.acronym)?organization.acronym:''}} {{(!organization.acronym && organization.name)?organization.name:''}}</a>
+                              <span
+
+                        *ngIf="!organization.id">
+                          <span *ngIf="organization.acronym">{{organization.acronym}}</span><span
+                          *ngIf="!organization.acronym && organization.name">{{organization.name}}</span></span>
+                  </span>
+                </span>
+              </li>
+              <li *ngIf="projectInfo.urlInfo ">
+                <span class="uk-button-text">
+                    <a target="_blank" href="{{projectInfo.url}}">
+                        {{projectInfo.urlInfo}}
+                    </a>
+                </span>
+              </li>
+            </ul>
+
+            <!-- <div class="uk-clearfix"><div class="uk-button-group uk-float-right  uk-margin-top">
+                <button class="uk-button uk-button-small uk-button-action">
+                  <span class="uk-icon" >
+                         <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                  Link this project to
+                </button>
+                <div class="uk-inline">
+                    <button class="uk-button uk-button-small uk-button-action" type="button">
+                      <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-down" ratio="1"><polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                    </button>
+                    <div uk-dropdown="mode: click; boundary: ! .uk-button-group; boundary-align: true;"
+                    class="uk-dropdown uk-dropdown-boundary uk-dropdown-bottom-left" style="top: 40px;    left: -236.5px;">
+                        <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+
+                            <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[projectId,'project','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                              Other research results</a></li>
+
+                        </ul>
+                    </div>
+                </div>
+            </div></div> -->
+
+            <ul class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
+                <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
+                    <a>
+                        Publications
+                        <span class="uk-badge uk-badge-notification">
+                            {{fetchPublications.searchUtils.totalResults}}
+                        </span>
+                    </a>
+                </li>
+                <li (click)="activeTab='Research Data'; searchDatasetsInit()"
+                    [class]="activeTab == 'Research Data'?'uk-active':''">
+                    <a>
+                        Research Data
+                        <span class="uk-badge uk-badge-notification">
+                            {{fetchDatasets.searchUtils.totalResults}}
+                        </span>
+                    </a>
+                </li>
+                <li (click)="activeTab='Software'; searchSoftwareInit()"
+                    [class]="activeTab == 'Software'?'uk-active':''">
+                    <a>
+                        Software
+                        <span class="uk-badge uk-badge-notification">
+                            {{fetchSoftware.searchUtils.totalResults}}
+                        </span>
+                    </a>
+                </li>
+                <li (click)="activeTab='Statistics'; statsClicked=true"
+                    [class]="activeTab == 'Statistics'?'uk-active':''">
+                    <a>
+                        Statistics
+
+                    </a>
+                </li>
+                <li (click)="activeTab='Metrics'; metricsClicked=true"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
+                    <a>
+                        Metrics
+                        <!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+<path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+  </svg></i-->
+                    </a>
+                </li>
+            </ul>
+
+            <button class="uk-button uk-button-default uk-hidden@m" type="button">
+              <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
+            </button>
+
+            <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
+              <li (click)="activeTab='Publications'" [class]="activeTab == 'Publications'?'uk-active':''">
+                  <a>
+                      Publications
+                      <span class="uk-badge uk-badge-notification">
+                          {{fetchPublications.searchUtils.totalResults}}
+                      </span>
+                  </a>
+              </li>
+              <li (click)="searchDatasetsInit(); activeTab='Research Data'"
+                  [class]="activeTab == 'Research Data'?'uk-active':''">
+                  <a>
+                      Research Data
+                      <span class="uk-badge uk-badge-notification">
+                          {{fetchDatasets.searchUtils.totalResults}}
+                      </span>
+                  </a>
+              </li>
+              <li (click)="searchSoftwareInit(); activeTab='Software'"
+                  [class]="activeTab == 'Software'?'uk-active':''">
+                  <a>
+                      Software
+                      <span class="uk-badge uk-badge-notification">
+                          {{fetchSoftware.searchUtils.totalResults}}
+                      </span>
+                  </a>
+              </li>
+              <li (click)="statsClicked=true; activeTab='Statistics'"
+                  [class]="activeTab == 'Statistics'?'uk-active':''">
+                  <a>
+                      Statistics
+                  </a>
+              </li>
+              <li (click)="metricsClicked=true; activeTab='Metrics'"
+                  [class]="activeTab == 'Metrics'?'uk-active':''">
+                  <a>
+                      Metrics
+                      <!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+<path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+  </svg></i-->
+                  </a>
+              </li>
+            </ul>
+
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+
+                <div *ngIf="activeTab=='Publications'" class="uk-animation-fade">
+                    <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary" >
+                        No publications available
+                    </div-->
+                    <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No publications available</div>
+                    <div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+                    <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+                    <div*ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <errorMessages [status]="[fetchPublications.searchUtils.status]" [type]="'publications'"></errorMessages>
+
+                    <div *ngIf="fetchPublications.searchUtils.totalResults > 0">
+                        <div class = "uk-text-right" *ngIf = "fetchPublications.searchUtils.totalResults > 10" >
+                            <a  [queryParams]="routerHelper.createQueryParams(['project', 'pr'], [projectId, 'and'])"
+                                routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications" class="uk-button uk-button-text">
+                                View all {{fetchPublications.searchUtils.totalResults}} results
+                            </a>
+                        </div>
+                        <tab-result  [(results)]="fetchPublications.results"
+                                        [(status)]= "fetchPublications.searchUtils.status"
+                                        type="publication" urlParam="articleId">
+                        </tab-result>
+                    </div>
+                </div>
+
+                <div *ngIf="activeTab == 'Research Data'" class="uk-animation-fade">
+                    <!--div *ngIf="fetchDatasets.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
+                        No research data available
+                    </div-->
+                    <!--div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No research data available</div>
+                    <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+                    <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+                    <div *ngIf="fetchDatasets.searchUtils.status == errorCodes.LOADING" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                    <errorMessages [status]="[fetchDatasets.searchUtils.status]" [type]="'research data'"></errorMessages>
+
+                    <div *ngIf="fetchDatasets.searchUtils.totalResults > 0">
+
+                        <div class = "uk-text-right" *ngIf = "fetchDatasets.searchUtils.totalResults > 10">
+                            <a [queryParams]="routerHelper.createQueryParams(['project', 'pr'], [projectId, 'and'])"
+                                routerLinkActive="router-link-active" [routerLink]="linkToSearchDatasets" class="uk-button uk-button-text">
+                                View all {{fetchDatasets.searchUtils.totalResults}} results
+                            </a>
+                        </div>
+                        <tab-result  [(results)]="fetchDatasets.results"
+                                        [(status)]= "fetchDatasets.searchUtils.status"
+                                        type="dataset" urlParam="datasetId">
+                        </tab-result>
+                    </div>
+                </div>
+                <div *ngIf="activeTab == 'Software'" class="uk-animation-fade">
+                    <errorMessages [status]="[fetchSoftware.searchUtils.status]" [type]="'software'"></errorMessages>
+
+                    <div *ngIf="fetchSoftware.searchUtils.totalResults > 0">
+
+                        <div class = "uk-text-right" *ngIf = "fetchSoftware.searchUtils.totalResults > 10">
+                            <a [queryParams]="routerHelper.createQueryParams(['project', 'pr'], [projectId, 'and'])"
+                                routerLinkActive="router-link-active" [routerLink]="linkToSearchSoftware" class="uk-button uk-button-text">
+                                View all {{fetchSoftware.searchUtils.totalResults}} results
+                            </a>
+                        </div>
+                        <tab-result  [(results)]="fetchSoftware.results"
+                                        [(status)]= "fetchSoftware.searchUtils.status"
+                                        type="software" urlParam="softwareId">
+                        </tab-result>
+                    </div>
+                </div>
+                <div *ngIf="activeTab == 'Statistics'" class="uk-animation-fade">
+                  <!--div *ngIf="fetchPublications.searchUtils.totalResults == 0 && fetchDatasets.searchUtils.totalResults == 0" class = "uk-alert  uk-alert-primary">
+                      No statistics available
+                  </div-->
+                  <!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE && fetchDatasets.searchUtils.status == errorCodes.NONE"
+                        class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No statistics available</div>
+                  <div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR || fetchDatasets.searchUtils.status == errorCodes.ERROR"
+                        class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+                  <div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE || fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE"
+                        class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+                  <div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING || fetchDatasets.searchUtils.status == errorCodes.LOADING"
+                        class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+                  <errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'statistics'"></errorMessages>
+
+                  <div *ngIf="statsClicked && (fetchPublications.searchUtils.totalResults != 0 || fetchDatasets.searchUtils.totalResults != 0)">
+
+                      <div>
+                        <p class="uk-text-bold">Research Results</p>
+                        <i-frame  [url]=chartScientificResultsUrl width="800" height="350"></i-frame>
+                        <p class="uk-text-bold">Access Mode of Research Results</p>
+                        <i-frame [url]=chartAccessModeUrl width="800" height="350"></i-frame>
+                        <p class="uk-text-bold">By Datasource of Research Results</p>
+                        <i-frame  [url]=chartDatasourcesUrl width="800" height="350"></i-frame>
+                      </div>
+                  </div>
+                </div>
+                <div *ngIf="activeTab=='Metrics'" class="uk-animation-fade">
+
+                    <!--[name]="projectName"-->
+                    <metrics [pageViews]="pageViews"
+                        [id]="projectId" [entityType]="'projects'" [entity]="'Project'"
+                        (metricsResults)="metricsResults($event)">
+                    </metrics>
+                    <!--i-frame *ngIf="metricsClicked" [url]=viewsFrameUrl width="800" height="350"></i-frame-->
+                    <i-frame *ngIf="metricsClicked && totalViews > 0"
+                        [url]=viewsFrameUrl width="100%" height="250">
+                    </i-frame>
+                    <i-frame *ngIf="metricsClicked && totalDownloads > 0"
+                        [url]=downloadsFrameUrl width="100%" height="250">
+                    </i-frame>
+                </div>
+            <!--/ul-->
+          </div>
+        </div>
+
+        <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
+          <div class="uk-card uk-card-default uk-padding-small">
+          <div>
+            Share - Bookmark<addThis ></addThis>
+          </div>
+          <div class="uk-margin-medium-top uk-margin-medium-bottom">
+              <div class="uk-text-center uk-text-large">
+                Application Box
+              </div>
+            <div  class="app-box" >
+            <ul class="uk-tab" uk-tab="connect: #tab-app-box-project">
+                <li>
+                    <a>Publications</a>
+                </li>
+                <li>
+                    <a>Research Data</a>
+                </li>
+              </ul>
+              <ul id="tab-app-box-project" class="uk-switcher uk-margin uk-padding-small">
+                  <li class="uk-animation-fade">
+                     <!-- Publication box-->
+                     <ul class="uk-list">
+                       <li>
+                         <a class="clickable" uk-toggle="target: #publications_dynamic; animation:uk-animation-fade"><span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="code" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.01" points="13,4 19,10 13,16"></polyline><polyline fill="none" stroke="#000" stroke-width="1.01" points="7,4 1,10 7,16"></polyline></svg></span> Include in your site (HTML)</a>
+                         <div hidden id="publications_dynamic">
+                             <button class="uk-button uk-button-default publ_clipboard_btn" data-clipboard-target="#publ_clipboard">
+                                 Copy to clipboard
+                                 <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="copy" ratio="1"><rect fill="none" stroke="#000" x="3.5" y="2.5" width="12" height="16"></rect><polyline fill="none" stroke="#000" points="5 0.5 17.5 0.5 17.5 17"></polyline></svg></span>
+                             </button>
+                             <pre><code id="publ_clipboard">{{publications_dynamic}}</code></pre>
+                         </div>
+                       </li>
+                       <li>
+                          <a target="_blank"
+                             href="/project-report?projectId={{projectId}}&size={{fetchPublications.searchUtils.totalResults}}&type=publication">
+                              <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span> Get {{projectInfo.funder}} report (HTML)
+                         </a>
+                       </li>
+                       <li>
+                         <a class="clickable" (click)="downloadfile(downloadURLAPI+'resources?'+csvParams+fetchPublications.searchUtils.totalResults)">
+                              <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="download" ratio="1"><polyline fill="none" stroke="#000" points="14,10 9.5,14.5 5,10"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="13.91" x2="9.5" y2="3"></line></svg></span> Get {{projectInfo.funder}} report (CSV)
+                         </a>
+                       </li>
+                       <li>
+                         <a  routerLinkActive="router-link-active" routerLink="/participate/deposit-publications">
+                             <span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg>
+</span> Deposit
+                           </a>
+                       </li>
+                   </ul>
+                  </li>
+                  <li class="uk-animation-fade">
+                    <!-- Dataset box-->
+                    <ul class="uk-list">
+                      <li>
+                        <a class="clickable" uk-toggle="target: #datasets_dynamic; animation:uk-animation-fade"><span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="code" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.01" points="13,4 19,10 13,16"></polyline><polyline fill="none" stroke="#000" stroke-width="1.01" points="7,4 1,10 7,16"></polyline></svg></span> Include in your site (HTML) </a>
+                        <div hidden id="datasets_dynamic">
+                            <button class="uk-button uk-button-default datasets_clipboard_btn" data-clipboard-target="#datasets_clipboard">
+                                Copy to clipboard
+                                <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="copy" ratio="1"><rect fill="none" stroke="#000" x="3.5" y="2.5" width="12" height="16"></rect><polyline fill="none" stroke="#000" points="5 0.5 17.5 0.5 17.5 17"></polyline></svg></span>
+                            </button>
+                            <pre><code id="datasets_clipboard">{{datasets_dynamic}}</code></pre>
+                        </div>
+                    </li>
+                    <li>
+                       <a target="_blank"
+                          href="/project-report?projectId={{projectId}}&size={{fetchDatasets.searchUtils.totalResults}}&type=dataset">
+                           <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span> Get {{projectInfo.funder}} report (HTML)
+                      </a>
+                    </li>
+                    <li>
+                      <a class="clickable" (click)="downloadfile(downloadURLAPI+'resources?'+csvParamsDatasets+fetchDatasets.searchUtils.totalResults)">
+                           <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="download" ratio="1"><polyline fill="none" stroke="#000" points="14,10 9.5,14.5 5,10"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="13.91" x2="9.5" y2="3"></line></svg></span> Get {{projectInfo.funder}} report (CSV)
+                      </a>
+                    </li>
+                    <li>
+                         <a  routerLinkActive="router-link-active" routerLink="/participate/deposit-datasets">
+                              <span class="uk-icon">
+                              <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg>
+                              </span> Deposit
+                         </a>
+                    </li>
+                  </ul>
+                </li>
+              </ul>
+
+            </div>
+            <ul uk-accordion class="uk-padding-remove">
+                <li>
+                  <button class="uk-button uk-button-primary uk-accordion-title link-to-button  uk-width-1-1" type="button">
+                    <span class="uk-icon" >
+                           <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                    <span>Link this project to</span>
+                  </button>
+                    <div class="uk-accordion-content">
+                      <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                        <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[projectId,'project','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                          Other research results</a></li>
+                      </ul>
+                    </div>
+                </li>
+            </ul>
+          </div>
+
+        </div>
+      </div>
+    </div>
+    <modal-loading></modal-loading>
+    <modal-alert #AlertModalCsvError></modal-alert>
+</div>
+</div>
+</div>
+</div>
diff --git a/landingPages/project/project.component.ts b/landingPages/project/project.component.ts
new file mode 100644
index 00000000..3e8f32d3
--- /dev/null
+++ b/landingPages/project/project.component.ts
@@ -0,0 +1,374 @@
+import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Observable} from 'rxjs/Observable';
+import {ActivatedRoute, Params, Router} from '@angular/router';
+import {ProjectService} from './project.service';
+import {ProjectInfo} from '../../utils/entities/projectInfo';
+import {RouterHelper} from '../../utils/routerHelper.class';
+
+import { FetchPublications } from '../../utils/fetchEntitiesClasses/fetchPublications.class';
+import { SearchPublicationsService } from '../../services/searchPublications.service';
+import { FetchDatasets } from '../../utils/fetchEntitiesClasses/fetchDatasets.class';
+import { SearchDatasetsService } from '../../services/searchDatasets.service';
+import { FetchSoftware } from '../../utils/fetchEntitiesClasses/fetchSoftware.class';
+import { SearchSoftwareService } from '../../services/searchSoftware.service';
+
+import {ModalLoading} from '../../utils/modal/loading.component';
+
+import {ReportsService} from '../../services/reports.service';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import { Meta} from '../../../angular2-meta';
+
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'project',
+    templateUrl: 'project.component.html',
+ })
+export class ProjectComponent{
+  public projectInfo: ProjectInfo;
+  public projectId : string ;
+  public projectName: string;
+
+  // Metrics tab variables
+  public metricsClicked: boolean;
+  public viewsFrameUrl: string;
+  public downloadsFrameUrl: string;
+  private totalViews: number;
+  private totalDownloads: number;
+  private pageViews: number;
+
+  // Statistics tab variables
+  public statsClicked: boolean;
+  public chartScientificResultsUrl: string;
+  public chartAccessModeUrl: string;
+  public chartDatasourcesUrl: string;
+
+  // HTML variables in APP BOX
+  public publications_dynamic: string;
+  public datasets_dynamic: string;
+  public software_dynamic: string;
+
+  public project ;
+
+  // CSV variables
+  public downloadURLAPI: string;
+  public csvParams: string;
+  public csvParamsDatasets: string;
+  public csvParamsSoftware: string;
+
+  // Message variables
+  public warningMessage = "";
+  public errorMessage = "";
+  public showLoading: boolean = true;
+
+  // Active tab variable for responsiveness
+  public activeTab: string = "Publications";
+
+  // Request results for research data and software only the one time (first time tab is clicked)
+  private reloadDatasets: boolean = true;
+  private reloadSoftware: boolean = true;
+
+  // Variables for publications, research data, software tabs
+  public fetchPublications : FetchPublications;
+  public linkToSearchPublications = "";
+  public fetchDatasets : FetchDatasets;
+  public linkToSearchDatasets = "";
+  public fetchSoftware: FetchSoftware;
+  public linkToSearchSoftware = "";
+
+  public routerHelper:RouterHelper = new RouterHelper();
+  public errorCodes:ErrorCodes = new ErrorCodes();
+
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  // Alert box when something is wrong with CSV requests
+  @ViewChild('AlertModalCsvError') alertCsvError;
+
+  sub: any; piwiksub: any; infoSub: any; downloadFilePiwikSub: any;
+
+  constructor ( private element: ElementRef,
+                private _projectService: ProjectService,
+                private _piwikService:PiwikService,
+                private  route: ActivatedRoute,
+                private _searchPublicationsService: SearchPublicationsService,
+                private _searchDatasetsService: SearchDatasetsService,
+                private _searchSoftwareService: SearchSoftwareService,
+                private _reportsService: ReportsService, private _meta: Meta,
+                private _router: Router) {
+    this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+  }
+
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(params => {
+        this.metricsClicked = false;
+        this.statsClicked = false;
+        this.fetchPublications = new FetchPublications( this._searchPublicationsService);
+        this.fetchDatasets = new FetchDatasets(this._searchDatasetsService);
+        this.fetchSoftware = new FetchSoftware(this._searchSoftwareService);
+
+        this.updateTitle("Project");
+        this.updateDescription("project, funding, open access, publications, research data, software");
+
+      this.projectId = params['projectId'];
+       if(this.projectId){
+           this.publications_dynamic =
+                "<script type=\"text/javascript\">"
+                + "\n<!--"
+                + "\ndocument.write('<div id=\"oa_widget\"></div>');"
+                + "\ndocument.write('<script type=\"text/javascript\""
+                + "\nsrc=\"https://beta.openaire.eu/index.php?option=com_openaire&view=widget&format=raw&projectId="
+                + this.projectId + "&type=publication\"></script>');"
+                + "\n-->"
+                + "\n</script>";
+
+            this.datasets_dynamic =
+                "<script type=\"text/javascript\">"
+                + "\n<!--"
+                + "\ndocument.write('<div id=\"oa_widget\"></div>');"
+                + "\ndocument.write('<script type=\"text/javascript\""
+                + "\nsrc=\"https://beta.openaire.eu/index.php?option=com_openaire&view=widget&format=raw&projectId="
+                + this.projectId + "&type=dataset\"></script>');"
+                + "\n-->"
+                + "\n</script>";
+
+            this.software_dynamic =
+                "<script type=\"text/javascript\">"
+                + "\n<!--"
+                + "\ndocument.write('<div id=\"oa_widget\"></div>');"
+                + "\ndocument.write('<script type=\"text/javascript\""
+                + "\nsrc=\"https://beta.openaire.eu/index.php?option=com_openaire&view=widget&format=raw&projectId="
+                + this.projectId + "&type=software\"></script>');"
+                + "\n-->"
+                + "\n</script>";
+
+          this.getProjectInfo(this.projectId);
+          this.searchPublications();
+          this.fetchDatasets.getNumForEntity("project", this.projectId);
+          this.fetchSoftware.getNumForEntity("project", this.projectId);
+      }else{
+          this.showLoading = false;
+		      this.warningMessage="No valid project id";
+      }
+
+      this.downloadURLAPI = OpenaireProperties.getCsvAPIURL();
+
+      this.createClipboard();
+      this.csvParams = "format=csv-special&page=0&type=publications&query=(((oaftype exact result) and (resulttypeid exact publication)) and (relprojectid exact "+this.projectId+"))&size=";
+      this.csvParamsDatasets = "format=csv-special&page=0&type=datasets&query=(((oaftype exact result) and (resulttypeid exact dataset)) and (relprojectid exact "+this.projectId+"))&size=";
+      this.csvParamsSoftware = "format=csv-special&page=0&type=software&query=(((oaftype exact result) and (resulttypeid exact software)) and (relprojectid exact "+this.projectId+"))&size=";
+
+      if (typeof document !== 'undefined') {
+         this.element.nativeElement.scrollIntoView();
+      }
+  });
+}
+
+
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+    if(this.piwiksub){
+      this.piwiksub.unsubscribe();
+    }
+    if(this.infoSub) {
+      this.infoSub.unsubscribe();
+    }
+    if(this.downloadFilePiwikSub) {
+      this.downloadFilePiwikSub.unsubscribe();
+    }
+  }
+
+  private createClipboard() {
+      if(typeof window !== 'undefined') {
+
+          let publ_clipboard, datasets_clipboard, software_clipboard;
+          let Clipboard;
+          Clipboard = require('clipboard');
+          publ_clipboard = new Clipboard('.publ_clipboard_btn');
+          datasets_clipboard = new Clipboard('.datasets_clipboard_btn');
+          software_clipboard = new Clipboard('.software_clipboard_btn');
+      }
+  }
+
+  private searchPublications() {
+    this.fetchPublications.getResultsForEntity("project", this.projectId, 1, 10);
+    this.linkToSearchPublications = OpenaireProperties.getLinkToAdvancedSearchPublications();// + "?project=" + this.projectId+"&pr=and";
+    if(this.fetchPublications.searchUtils.totalResults > 0) {
+      //this.activeTab = "Publications";
+    } else {
+      //this.searchDatasetsInit();
+    }
+  }
+
+  private searchDatasets() {
+      this.fetchDatasets.getResultsForEntity("project", this.projectId, 1, 10);
+      this.linkToSearchDatasets = OpenaireProperties.getLinkToAdvancedSearchDatasets();// + "?project=" + this.projectId+"&pr=and";
+
+      this.reloadDatasets = false;
+      //this.activeTab = "Research Data";
+  }
+
+  private searchSoftware() {
+      this.fetchSoftware.getResultsForEntity("project", this.projectId, 1, 10);
+      this.linkToSearchSoftware = OpenaireProperties.getLinkToAdvancedSearchSoftware();
+      this.reloadSoftware = false;
+  }
+
+  public searchDatasetsInit() {
+    console.info("searchDatasetsInit");
+      if(this.reloadDatasets && this.fetchDatasets.searchUtils.totalResults > 0) {
+	      this.searchDatasets();
+      } else if(this.fetchDatasets.searchUtils.totalResults == 0) {
+        //this.statsClicked=true;
+        //this.activeTab = "Statistics";
+      }
+  }
+
+  public searchSoftwareInit() {
+    console.info("searchSoftwareInit");
+      if(this.reloadSoftware && this.fetchSoftware.searchUtils.totalResults > 0) {
+	      this.searchSoftware();
+      }
+  }
+
+  private getProjectInfo (id:string)  {
+	  this.warningMessage = '';
+    this.errorMessage=""
+    this.showLoading = true;
+
+    this.infoSub = this._projectService.getProjectInfo(id).subscribe(
+      data => {
+          this.projectInfo = data;
+
+          this.projectName = this.projectInfo.acronym;
+          if(this.projectName == undefined || this.projectName == '') {
+              this.projectName = this.projectInfo.title;
+          }
+          this.updateTitle(this.projectName);
+          this.updateDescription("project, funding, open access, publications, research data, "+this.projectName+ ","+this.projectInfo.funder);
+          if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+            this.piwiksub = this._piwikService.trackView(this.projectName).subscribe();
+          }
+
+          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 };
+
+          this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"projRepoViews","projTitle":"'+this.projectId+'","table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":"","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[]}]&info_types=["column"]&stacking=&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+
+          this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"projRepoDownloads","projTitle":"'+this.projectId+'","table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":"","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[]}]&info_types=["column"]&stacking=&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+
+          //stats tab charts
+          this.chartScientificResultsUrl='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"projScient","projTitle":"'+this.projectId+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "spline", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Research Results"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [" "], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+          this.chartAccessModeUrl='https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"projOA","projTitle":"'+this.projectId+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "pie", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Research Results"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [" "], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+          this.chartDatasourcesUrl= 'https://beta.openaire.eu/stats/chart.php?com=query&persistent=false&data={"query":"projPubsRepos","projTitle":"'+this.projectId+'", "table": "result", "fields": [{"fld": "number", "agg": "count", "type": "bar", "yaxis":1, "c":false}], "xaxis":{"name": "result_classifications-type", "agg": "avg"}, "group": "", "color": "", "type": "chart", "size":30, "sort": "xaxis", "xStyle":{"r": "-", "s": "-", "l": "-", "ft": "-", "wt": "-"}, "yaxisheaders": [""], "fieldsheaders": ["Research Results"], "in": [], "filters": [{"name": "result_datasources-datasource-name", "values": [" "], "to": "-1"}], "having": [], "incfilters": [], "inchaving": [], "title": "", "subtitle": "", "xaxistitle": ""}&w=600&h=250';
+
+          this.showLoading = false;
+      },
+      err => {
+		      console.log(err);
+		      this.errorMessage = 'No project found';
+          this.showLoading = false;
+		  }
+    );
+   }
+
+   public downloadfile(url:string){
+       this.openLoading();
+       this.setMessageLoading("Downloading CSV file");
+
+       this._reportsService.downloadCSVFile(url).subscribe(
+            data => {
+                this.closeLoading();
+                window.open(window.URL.createObjectURL(data));
+                if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                  this.downloadFilePiwikSub = this._piwikService.trackDownload(url).subscribe();
+                }
+            },
+            error => {
+              console.log("Error downloading the file.");
+              this.closeLoading();
+              this.confirmOpenCsvError();
+            },
+            () => console.log('Completed file download.')
+        );
+    }
+
+/*
+    showHTML(){
+      let info:string = "<h1>Publications of Project ";
+
+      if(this.projectInfo.title != undefined && this.projectInfo.title != "") {
+          info += this.projectInfo.title;
+      }
+      if((this.projectInfo.title != undefined && this.projectInfo.title != "") &&
+         ((this.projectInfo.acronym != undefined && this.projectInfo.acronym != "") ||
+          (this.projectInfo.callIdentifier != undefined && this.projectInfo.callIdentifier != ""))) {
+                info += "(";
+      }
+      if(this.projectInfo.acronym != undefined && this.projectInfo.acronym != "") {
+          info += this.projectInfo.acronym + " - ";
+      }
+      if(this.projectInfo.callIdentifier != undefined && this.projectInfo.callIdentifier != "") {
+          info += this.projectInfo.callIdentifier;
+      }
+      if((this.projectInfo.title != undefined && this.projectInfo.title != "") &&
+         ((this.projectInfo.acronym != undefined && this.projectInfo.acronym != "") ||
+          (this.projectInfo.callIdentifier != undefined && this.projectInfo.callIdentifier != ""))) {
+                info += ")";
+      }
+      info +="</h1>";
+      info += "<h3>"+this.fetchPublications.searchUtils.totalResults+" publications</h3>";
+
+      let htmlParams = 'resources?format=html&page=0&size='+this.fetchPublications.searchUtils.totalResults+'&type=publications&query=(((oaftype exact result) and (resulttypeid exact publication)) and (relprojectid exact "'+this.projectId+'"))';
+      this._reportsService.downloadHTMLFile(this.downloadURLAPI+htmlParams, info)
+          .subscribe(data => this.funct(data),
+                      error => console.log("Error downloading the file."),
+                      () => console.log('Completed file download.'));
+     }
+
+     funct(data) {
+         var win = window.open(window.URL.createObjectURL(data));
+     }
+*/
+    public metricsResults($event) {
+      this.totalViews = $event.totalViews;
+      this.totalDownloads = $event.totalDownloads;
+      this.pageViews = $event.pageViews;
+    }
+
+    private updateDescription(description:string){
+      this._meta.updateMeta("description", description);
+      this._meta.updateProperty("og:description", description);
+    }
+    private updateTitle(title:string){
+      var _prefix ="OpenAIRE | ";
+      var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+      this._meta.setTitle(_title );
+      this._meta.updateProperty("og:title",_title);
+    }
+    private updateUrl(url:string){
+      this._meta.updateProperty("og:url", url);
+    }
+
+    private openLoading(){
+      if(this.loading){
+        this.loading.open();
+      }
+    }
+    private closeLoading(){
+      if(this.loading){
+        this.loading.close();
+      }
+    }
+    private setMessageLoading(message: string){
+      if(this.loading){
+        this.loading.message = message;
+      }
+    }
+
+    public confirmOpenCsvError(){
+      this.alertCsvError.cancelButton = false;
+      this.alertCsvError.okButton = true;
+      this.alertCsvError.alertTitle = "ERROR DOWNLOADING CSV FILE";
+      this.alertCsvError.message = "There was an error in csv downloading. Please try again later.";
+      this.alertCsvError.okButtonText = "OK";
+      this.alertCsvError.open();
+    }
+}
diff --git a/landingPages/project/project.module.ts b/landingPages/project/project.module.ts
new file mode 100644
index 00000000..d7156d0a
--- /dev/null
+++ b/landingPages/project/project.module.ts
@@ -0,0 +1,45 @@
+//import {MaterialModule} from '@angular/material';
+import { NgModule}            from '@angular/core';
+import { CommonModule }       from '@angular/common';
+import { FormsModule }        from '@angular/forms';
+import { RouterModule }       from '@angular/router';
+
+import { ProjectServiceModule} from './projectService.module';
+// import {HtmlProgressReportService} from './htmlProgressReport.service';
+import{LoadingModalModule} from '../../utils/modal/loadingModal.module';
+import {AlertModalModule} from '../../utils/modal/alertModal.module';
+import {ErrorMessagesModule} from '../../utils/errorMessages.module';
+
+import { ProjectComponent } from './project.component';
+// import { ProjectRoutingModule } from './project-routing.module';
+import {IFrameModule} from '../../utils/iframe.module';
+import {MetricsModule} from '../landing-utils/metrics.module';
+import {ReportsServiceModule} from '../../services/reportsService.module';
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+import {SoftwareServiceModule} from '../../services/softwareService.module';
+import {TabResultModule } from '../../searchPages/searchUtils/tabResult.module';
+import { LandingModule } from '../landing-utils/landing.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule, LandingModule,
+     LoadingModalModule, AlertModalModule, ErrorMessagesModule,
+    TabResultModule, IFrameModule, MetricsModule, ReportsServiceModule,
+    PublicationsServiceModule, DatasetsServiceModule, SoftwareServiceModule, ProjectServiceModule
+  ],
+  declarations: [
+    ProjectComponent
+  ],
+  providers:[
+    // ProjectService,
+    // HtmlProgressReportService
+    FreeGuard, IsRouteEnabled
+  ],
+  exports: [
+    ProjectComponent
+  ]
+})
+export class ProjectModule { }
diff --git a/landingPages/project/project.service.ts b/landingPages/project/project.service.ts
new file mode 100644
index 00000000..57b57d90
--- /dev/null
+++ b/landingPages/project/project.service.ts
@@ -0,0 +1,207 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {ProjectInfo} from '../../utils/entities/projectInfo';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+import { ParsingFunctions } from '../landing-utils/parsingFunctions.class';
+
+@Injectable()
+export class ProjectService {
+
+    constructor(private http: Http ) {
+      this.parsingFunctions = new ParsingFunctions();
+    }
+
+    public parsingFunctions: ParsingFunctions;
+    projectInfo: ProjectInfo;
+
+    getProjectInfo (id: string):any {
+        console.info("getProjectInfo in service");
+
+        let url = OpenaireProperties. getSearchAPIURLLast() + 'projects/'+id+"?format=json";
+        let key = url;
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => res['result']['metadata']['oaf:entity']['oaf:project'])
+                    .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. getSearchAPIURLLast()+'projects/'+id+"?format=json";
+        let key = url+'_projectDates';
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => res['result']['metadata']['oaf:entity']['oaf:project'])
+                    .map(res => [res,
+                              res['fundingtree'],
+                              res['rels']['rel']])
+                    .map(res => this.parseProjectDates(id,res))
+
+    }
+
+    getHTMLInfo(id: string): any {
+        let url = OpenaireProperties. getSearchAPIURLLast() + 'projects/'+id+"?format=json";
+        let key = url;
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => res['result']['metadata']['oaf:entity']['oaf:project'])
+                    .map(res => this.parseHTMLInfo(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.log(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parseHTMLInfo (data: any):any {
+        let htmlInfo: {"title": string, "acronym": string, "callIdentifier": string};
+
+        if(data != null) {
+            htmlInfo = {"title": data.title, "acronym": data.acronym, "callIdentifier": data.callidentifier};
+        }
+        return htmlInfo;
+    }
+
+    parseProjectInfo (data: any):any {
+        this.projectInfo = new ProjectInfo();
+
+        if(data[0] != null) {
+            this.projectInfo.acronym = data[0].acronym;
+            if(Array.isArray(data[0]['title'])) {
+                this.projectInfo.title = data[0].title[0];
+            } else {
+                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];
+                }
+            }
+            */
+
+            let funding: {"funderName": string, "funderShortname": string, "stream": string};
+            funding = this.parsingFunctions.parseFundingTrees(data[1]);
+
+            // if(funding.funderName) {
+            //   this.publicationInfo.fundedByProjects[counter]['funderName'] = funding.funderName;
+            // }
+            if(funding.funderShortname) {
+              this.projectInfo.funder = funding.funderShortname;
+            }
+            if(funding.stream) {
+              this.projectInfo['funding'] = funding.stream;
+            }
+        }
+
+        if(data[2] != null) {
+            this.projectInfo.organizations = [];//new Map<string, string>();
+
+            let acronym: string = "";
+            let name: string = "";
+            let id: string = "";
+
+            if(!Array.isArray(data[2])) {
+                if(data[2].hasOwnProperty("legalshortname")) {
+                  acronym = data[2].legalshortname;
+                }
+                if(data[2].hasOwnProperty("legalname")) {
+                  name = data[2].legalname;
+                }
+                if(!acronym && !name){
+                  // acronym is displayed with link and name only in tooltip
+                  acronym = "[no title available]";
+                }
+
+                if(data[2].hasOwnProperty("to")) {
+                    id = data[2]['to'].content;
+                }
+
+                this.projectInfo.organizations.push({"acronym": acronym, "name": name, "id": id});
+            } else {
+                for(let i=0; i<data[2].length; i++) {
+                    if(data[2][i].hasOwnProperty("to") && data[2][i]['to'].class == "hasParticipant") {
+                        if(data[2][i].hasOwnProperty("legalshortname")) {
+                          acronym = data[2][i].legalshortname;
+                        }
+                        if(data[2][i].hasOwnProperty("legalname")) {
+                          name = data[2][i].legalname;
+                        }
+                        if(!acronym && !name){
+                          acronym = "[no title available]";
+                        }
+
+                        if(data[2][i].hasOwnProperty("to")) {
+                            id = data[2][i]['to'].content;
+                        }
+
+                        this.projectInfo.organizations.push({"acronym": acronym, "name": name, "id": id});
+                    }
+                }
+            }
+        }
+
+        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;
+
+    }
+
+}
diff --git a/landingPages/project/projectService.module.ts b/landingPages/project/projectService.module.ts
new file mode 100644
index 00000000..1dbae019
--- /dev/null
+++ b/landingPages/project/projectService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {ProjectService} from './project.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  ProjectService
+],
+  exports: [
+    ]
+})
+export class ProjectServiceModule { }
diff --git a/landingPages/publication/publication-routing.module.ts b/landingPages/publication/publication-routing.module.ts
new file mode 100644
index 00000000..034f01c3
--- /dev/null
+++ b/landingPages/publication/publication-routing.module.ts
@@ -0,0 +1,18 @@
+// import { NgModule } from '@angular/core';
+// import { RouterModule } from '@angular/router';
+//
+// import { PublicationComponent } from './publication.component';
+// import {FreeGuard} from'../../login/freeGuard.guard';
+// import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+// import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+//
+// @NgModule({
+//  imports: [
+//   RouterModule.forChild([
+//     { path: '', component: PublicationComponent, canActivate: [FreeGuard, IsRouteEnabled], data: {
+//         redirect: '/error'
+//       },canDeactivate: [PreviousRouteRecorder]  }
+//   ])
+// ]
+// })
+// export class PublicationRoutingModule { }
diff --git a/landingPages/publication/publication.component.html b/landingPages/publication/publication.component.html
new file mode 100644
index 00000000..1fa28104
--- /dev/null
+++ b/landingPages/publication/publication.component.html
@@ -0,0 +1,585 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div class="uk-container uk-margin-top publication">
+    <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
+    <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+
+    <div  *ngIf="publicationInfo != null"  uk-grid class="uk-grid-large">
+        <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
+            <showTitle  [title]="publicationInfo.title"></showTitle>
+            <span *ngIf="publicationInfo.types.length > 0"class="uk-label custom-label label-blue label-publication" title="Type">{{publicationInfo.types.join(", ")}}</span>
+            <span *ngIf="publicationInfo.languages.length > 0" class="uk-label custom-label  label-language " title="Language">{{publicationInfo.languages.join(", ")}}</span>
+            <span *ngIf="publicationInfo.title && publicationInfo.title.accessMode" [class]="'uk-label custom-label  label-'+ publicationInfo.title.accessMode "><!--span [class]="publicationInfo.title.accessMode" -->{{publicationInfo.title.accessMode}}<!--/span--></span>
+
+            <span *ngIf="publicationInfo.underCurationMessage" class="uk-label custom-label label-underCuration"  >
+              <span uk-tooltip="pos:right; delay:10"
+                  title="{{buildCurationTooltip()}}">
+              <i>Record in preview</i>
+              <i class="uk-icon-info-circle"></i>
+            </span></span>
+
+
+
+            <div class= " uk-margin-top">
+                <showAuthors [authors]="publicationInfo.authors" searchPage="publications"></showAuthors>
+                <span *ngIf="publicationInfo.date != ''">({{publicationInfo.date}})</span>
+            </div>
+
+            <ul class="uk-list">
+                <li *ngIf="publicationInfo.publisher"><span class="uk-text-bold">Publisher:</span> {{publicationInfo.publisher}}</li>
+                <li *ngIf="publicationInfo.journal &&
+                    (publicationInfo.journal['journal'] || publicationInfo.journal['issn'] || publicationInfo.journal['lissn'])">
+                    <span class="uk-text-bold">Journal:</span>
+                    <span *ngIf="publicationInfo.journal['journal']">{{publicationInfo.journal['journal']}}</span>
+                    <span *ngIf="publicationInfo.journal['issn'] || publicationInfo.journal['lissn']">
+                        (
+                    </span>
+                    <span *ngIf="publicationInfo.journal['issn']">
+                        issn: {{publicationInfo.journal['issn']}}
+                    </span>
+                    <span *ngIf="publicationInfo.journal['lissn']">
+                        lissn: {{publicationInfo.journal['lissn']}}
+                    </span>
+                    <span *ngIf="publicationInfo.journal['issn'] || publicationInfo.journal['lissn']">
+                        )
+                    </span>
+                </li>
+
+                <li *ngIf="publicationInfo.embargoEndDate"><span class="uk-text-bold">Embargo end date:</span> {{publicationInfo.embargoEndDate}}</li>
+                <li *ngIf="publicationInfo.identifiers && publicationInfo.identifiers.size > 0">
+                  <showIdentifiers [identifiers]="publicationInfo.identifiers"></showIdentifiers>
+                </li>
+                <li *ngIf="publicationInfo.subjects || publicationInfo.otherSubjects ||  publicationInfo.classifiedSubjects">
+                  <showSubjects [subjects]="publicationInfo.subjects"
+                  [otherSubjects]="publicationInfo.otherSubjects"
+                  [classifiedSubjects]="publicationInfo.classifiedSubjects">
+                </showSubjects>
+                </li>
+              </ul>
+
+              <div *ngIf="publicationInfo.description" class="uk-margin-bottom uk-text-justify descriptionText">
+                {{publicationInfo.description}}
+              </div>
+
+
+           <!--div class="uk-clearfix"><div class="uk-button-group uk-float-right  uk-margin-top">
+               <button class="uk-button uk-button-small uk-button-action">
+                 <span class="uk-icon" >
+                        <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                 Link this publication to
+               </button>
+               <div class="uk-inline">
+                   <button class="uk-button uk-button-small uk-button-action" type="button">
+                     <span class="uk-icon" >
+                            <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                     Link this publication to
+                     <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-down" ratio="1"><polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                   </button>
+                   <div uk-dropdown="mode: click; boundary: ! .uk-button-group; boundary-align: true;"
+                   class="uk-dropdown uk-dropdown-boundary uk-dropdown-bottom-left" style="top: 40px;    left: -236.5px;">
+                       <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                           <li><a class="uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                              Projects</a></li>
+                           <li><a  class="uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                              Communities</a></li>
+                           <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                             Other research results</a></li>
+                       </ul>
+                   </div>
+               </div>
+           </div></div-->
+
+
+
+
+
+
+            <ul class="uk-tab uk-visible@l" uk-tab="connect: #tab-content">
+                <li *ngIf="publicationInfo.references" (click)="activeTab='References'"
+                    [class]="activeTab == 'References'?'uk-active':''">
+                    <a>
+                        References
+                        <span *ngIf="!publicationInfo.references" class="uk-badge uk-badge-notification">0</span>
+                        <span *ngIf="publicationInfo.references" class="uk-badge uk-badge-notification">
+                            {{publicationInfo.references.length}}
+                        </span>
+                    </a>
+                </li>
+                <li *ngIf="publicationInfo.relatedResearchResults" (click)="activeTab='Related Research Results'"
+                    [class]="activeTab == 'Related Research Results'?'uk-active':''">
+                    <a>
+                        Related Research Results
+                        <span class="uk-badge uk-badge-notification">
+                            {{relatedResearchResultsNum}}
+                        </span>
+                    </a>
+                </li>
+                <li *ngIf="publicationInfo.similarResearchResults" (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
+                    <a>
+                        Similar Research Results
+                        <span *ngIf="!publicationInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
+                        <span *ngIf="publicationInfo.similarResearchResults" class="uk-badge uk-badge-notification">
+                            {{publicationInfo.similarResearchResults.length}}
+                        </span>
+                    </a>
+                </li>
+                <li *ngIf="publicationInfo.organizations" (click)="activeTab='Related Organizations'"
+                    [class]="activeTab == 'Related Organizations'?'uk-active':''">
+                    <a>
+                        Related Organizations
+                        <span *ngIf="!publicationInfo.organizations" class="uk-badge uk-badge-notification">0</span>
+                        <span *ngIf="publicationInfo.organizations" class="uk-badge uk-badge-notification">
+                            {{publicationInfo.organizations.length}}
+                        </span>
+                    </a>
+                </li>
+                <li *ngIf="publicationInfo.bioentities" (click)="activeTab='Bioentities'"
+                    [class]="activeTab == 'Bioentities'?'uk-active':''">
+                    <a>
+                        Bioentities
+                        <span class="uk-badge uk-badge-notification">{{bioentitiesNum}}</span>
+                    </a>
+                </li>
+                <li *ngIf="publicationInfo.software" (click)="activeTab='Software'"
+                    [class]="activeTab == 'Software'?'uk-active':''">
+                    <a>
+                        Software
+                        <span class="uk-badge uk-badge-notification">{{publicationInfo.software.length}}</span>
+                    </a>
+                </li>
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
+                    <a>
+                        Metrics
+                        <!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+<path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+  </svg></i-->
+                    </a>
+                </li>
+            </ul>
+
+            <!--span uk-icon="icon: menu"></span> {{activeTab}}<-->
+            <button class="uk-button uk-button-default uk-hidden@l" type="button">
+              <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
+            </button>
+
+            <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@l" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
+                <li *ngIf="publicationInfo.references" (click)="activeTab='References'"
+                    [class]="activeTab == 'References'?'uk-active':''">
+                  <a>
+                    References
+                    <span *ngIf="!publicationInfo.references" class="uk-badge uk-badge-notification">0</span>
+                    <span *ngIf="publicationInfo.references" class="uk-badge uk-badge-notification">
+                        {{publicationInfo.references.length}}
+                    </span>
+                  </a>
+                </li>
+                <li *ngIf="publicationInfo.relatedResearchResults" (click)="activeTab='Related Research Results'"
+                    [class]="activeTab == 'Related Research Results'?'uk-active':''">
+                  <a>
+                    Related Research Results
+                    <span class="uk-badge uk-badge-notification">
+                        {{relatedResearchResultsNum}}
+                    </span>
+                  </a>
+                </li>
+                <li *ngIf="publicationInfo.similarResearchResults" (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
+                  <a>
+                    Similar Research Results
+                    <span *ngIf="!publicationInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
+                    <span *ngIf="publicationInfo.similarResearchResults" class="uk-badge uk-badge-notification">
+                        {{publicationInfo.similarResearchResults.length}}
+                    </span>
+                  </a>
+                </li>
+                <li *ngIf="publicationInfo.organizations" (click)="activeTab='Related Organizations'"
+                    [class]="activeTab == 'Related Organizations'?'uk-active':''">
+                  <a>
+                    Related Organizations
+                    <span *ngIf="!publicationInfo.organizations" class="uk-badge uk-badge-notification">0</span>
+                    <span *ngIf="publicationInfo.organizations" class="uk-badge uk-badge-notification">
+                        {{publicationInfo.organizations.length}}
+                    </span>
+                  </a>
+                </li>
+                <li *ngIf="publicationInfo.bioentities" (click)="activeTab='Bioentities'"
+                    [class]="activeTab == 'Bioentities'?'uk-active':''">
+                  <a>
+                    Bioentities
+                    <span class="uk-badge uk-badge-notification">{{bioentitiesNum}}</span>
+                  </a>
+                </li>
+                <li *ngIf="publicationInfo.software" (click)="activeTab='Software'"
+                    [class]="activeTab == 'Software'?'uk-active':''">
+                  <a>
+                    Software
+                    <span class="uk-badge uk-badge-notification">{{publicationInfo.software.length}}</span>
+                  </a>
+                </li>
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
+                  <a>
+                    Metrics<!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+<path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+  </svg></i-->
+                  </a>
+                </li>
+            </ul>
+
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+                <div *ngIf="activeTab == 'References'" class="uk-animation-fade">
+                    <div *ngIf="!publicationInfo.references" class = "uk-alert  uk-alert-primary" >
+                        No references available
+                    </div>
+
+                    <div *ngIf="publicationInfo.references">
+
+                        <!--tabPaging [showAll]="showAllReferences" [length]="publicationInfo.references.length" (changeShowAll)="showChange($event)"></tabPaging-->
+                        <div *ngIf="publicationInfo.references && publicationInfo.references.length > pageSize" class="uk-margin-bottom">
+                          <span class="uk-h6">{{publicationInfo.references.length}} references, page {{referencesPage}} of {{totalPages(publicationInfo.references.length)}}</span>
+                          <paging-no-load class="uk-float-right" [currentPage]="referencesPage" [totalResults]="publicationInfo.references.length" [size]="pageSize" (pageChange)="updateReferencesPage($event)"></paging-no-load>
+                        </div>
+
+                        <div *ngFor="let item of publicationInfo.references.slice((referencesPage-1)*pageSize, referencesPage*pageSize)">
+                            <p *ngIf=" item && item['url']"
+                                class="custom-external custom-icon">
+                                <a href="{{item['url']}}" target="_blank">
+                                    {{item['name']}}
+                                </a>
+                            </p>
+                            <p  *ngIf="!item['url']" class="pseudo-external custom-icon">
+                                {{item['name']}}
+                            </p>
+                        </div>
+
+                        <!--div *ngIf="showAllReferences">
+                            <div *ngFor="let item of publicationInfo.references.slice(10)">
+                                <p *ngIf=" item && item['url']"
+                                    class="custom-external custom-icon">
+                                    <a href="{{item['url']}}" target="_blank">
+                                        {{item['name']}}
+                                    </a>
+                                </p>
+                                <p *ngIf="!item['url']">
+                                    {{item['name']}}
+                                </p>
+                           </div>
+                        </div-->
+
+                        <!--tabPaging [showAll]="showAllReferences" [length]="publicationInfo.references.length" (changeShowAll)="showChange($event)"></tabPaging-->
+
+                    </div>
+                </div>
+
+                <div *ngIf="activeTab == 'Related Research Results'" class="uk-animation-fade">
+                    <div *ngIf="!publicationInfo.relatedResearchResults" class = "uk-alert  uk-alert-primary">
+                        No related research results available
+                    </div>
+                    <div *ngIf="publicationInfo.relatedResearchResults">
+                        <div *ngFor="let provenanceaction of getKeys(publicationInfo.relatedResearchResults)">
+                            <div class="uk-text-large uk-margin-bottom">{{provenanceaction}}</div>
+
+                            <tabTable [info]="publicationInfo.relatedResearchResults.get(provenanceaction)"></tabTable>
+                        </div>
+                    </div>
+                </div>
+
+
+                <div *ngIf="activeTab == 'Similar Research Results'" class="uk-animation-fade">
+                    <div *ngIf="!publicationInfo.similarResearchResults" class = "uk-alert  uk-alert-primary">
+                        No similar research results available
+                    </div>
+                    <div *ngIf="publicationInfo.similarResearchResults">
+
+                        <tabTable [info]="publicationInfo.similarResearchResults"></tabTable>
+                    </div>
+                </div>
+
+                <div *ngIf="activeTab == 'Related Organizations'" class="uk-animation-fade">
+                    <div *ngIf="!publicationInfo.organizations" class = "uk-alert  uk-alert-primary">
+                        No related organizations available
+                    </div>
+                    <div *ngIf="publicationInfo.organizations">
+                        <div *ngIf="publicationInfo.organizations && publicationInfo.organizations.length > pageSize" class="uk-margin-bottom">
+                          <span class="uk-text-bold">{{publicationInfo.organizations.length}} organizations, page {{organizationsPage}} of {{totalPages(publicationInfo.organizations.length)}}</span>
+                          <paging-no-load class="uk-float-right" [currentPage]="organizationsPage" [totalResults]="publicationInfo.organizations.length" [size]="pageSize" (pageChange)="updateOrganizationsPage($event)"></paging-no-load>
+                        </div>
+
+                        <table class="uk-table ">
+                            <!--thead>
+                                <tr>
+                                    <th>Organization</th>
+                                    <th>Trust</th>
+                                </tr>
+                            </thead-->
+                            <tbody>
+                                <tr *ngFor="let organization of publicationInfo.organizations.slice((organizationsPage-1)*pageSize, organizationsPage*pageSize)">
+                                    <td>
+                                        <a *ngIf="(organization['id']) && ((organization['name']) || (organization['shortname']))"
+                                            [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
+                                                {{organization['name']}}
+                                                <span *ngIf="organization.name && organization.shortname"> ( </span>
+                                                <span *ngIf="organization.shortname">{{organization.shortname}}</span>
+                                                <span *ngIf="organization.name && organization.shortname"> ) </span>
+                                        </a>
+                                        <p *ngIf="(!organization['id']) && ((organization['name']) || (organization['shortname']))">
+                                            {{organization['name']}}
+                                            <span *ngIf="organization.name && organization.shortname"> ( </span>
+                                            <span *ngIf="organization.shortname">{{organization.shortname}}</span>
+                                            <span *ngIf="organization.name && organization.shortname"> ) </span>
+                                        </p>
+                                        <div *ngIf="organization.country">{{organization.country}}</div>
+                                        <div *ngIf="organization.websiteUrl">Website url:
+                                            <a href="{{organization.websiteUrl}}" target="_blank">{{organization.websiteUrl}}</a>
+                                        </div>
+                                    </td>
+                                    <td>
+                                        <div *ngIf="organization['trust']" title="{{organization['trust']}}%" >
+                                          <div class="uk-text-center">{{organization['trust']}}%</div>
+                                          <progress class="uk-progress uk-margin-remove" value="{{organization['trust']}}" max="100"></progress>
+                                        </div>
+                                        <div *ngIf="!organization['trust']">
+                                            <p>no trust available</p>
+                                        </div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+
+
+                    </div>
+                </div>
+
+                <div *ngIf="activeTab=='Bioentities'" class="uk-animation-fade">
+                    <div *ngIf="publicationInfo.bioentities && bioentitiesNum > pageSize" class="uk-margin-bottom">
+                      <span class="uk-text-bold"> {{bioentitiesNum}} bioentities, page {{bioentitiesPage}} of {{totalPages(bioentitiesNum)}}</span>
+                      <paging-no-load class="uk-float-right" [currentPage]="bioentitiesPage" [totalResults]="bioentitiesNum" [size]="pageSize" (pageChange)="updateBioentitiesPage($event)"></paging-no-load>
+                    </div>
+
+                    <table id="bioentitiesTable" class="uk-table ">
+                        <!--thead>
+                            <tr>
+                                <th class="uk-text-center">Bio Entity</th>
+                                <th class="uk-text-center">Site Name</th>
+                            </tr>
+                        </thead-->
+                        <tbody>
+                          <ng-container *ngFor="let key of getKeys(publicationInfo.bioentities) let i=index">
+                            <!--ng-container *ngIf="stop(i, bioentitiesPage) - start(i, bioentitiesPage) > 0"-->
+                              <tr *ngFor="let keyIn of keysToArray(publicationInfo.bioentities.get(key)).slice((bioentitiesPage-1)*pageSize, bioentitiesPage*pageSize)">
+                                  <td class="uk-text-center" *ngIf="keyIn">
+                                      <span class="custom-external custom-icon">
+                                          <a href="{{publicationInfo.bioentities.get(key).get(keyIn)}}"
+                                              target="_blank">
+                                              {{keyIn}}
+                                          </a>
+                                      </span>
+                                  </td>
+                                  <td class="uk-text-center">
+                                      {{key}}
+                                  </td>
+                              </tr>
+                            </ng-container>
+                          <!--/ng-container-->
+                        </tbody>
+                    </table>
+                </div>
+                <div *ngIf="activeTab == 'Software'" class="uk-animation-fade">
+                    <div *ngIf="publicationInfo.software && publicationInfo.software.length > pageSize" class="uk-margin-bottom">
+                      <span class="uk-text-bold">{{publicationInfo.software.length}} software results, page {{softwarePage}} of {{totalPages(publicationInfo.software.length)}}</span>
+                      <paging-no-load class="uk-float-right" [currentPage]="softwarePage" [totalResults]="publicationInfo.software.length" [size]="pageSize" (pageChange)="updateSoftwarePage($event)"></paging-no-load>
+                    </div>
+
+                    <table id="softwareTable" class="uk-table ">
+                        <!--thead>
+                            <tr>
+                                <th class="uk-text-center">Site Name</th>
+                            </tr>
+                        </thead-->
+                        <tbody>
+                            <tr *ngFor="let item of publicationInfo.software.slice((softwarePage-1)*pageSize, softwarePage*pageSize)" class="uk-text-center">
+                                <td>
+                                    <span class="custom-external custom-icon">
+                                        <a href="{{item.url}}" target="_blank">
+                                            {{item.name}}
+                                        </a>
+                                    </span>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+                <div *ngIf="activeTab == 'Metrics'" class="uk-animation-fade">
+                  <!-- Page Views: {{pageViews}} -->
+                    <metrics [pageViews]="pageViews"
+                        [id]="articleId" [entityType]="'results'" [entity]="'Publication'"
+                        (metricsResults)="metricsResults($event)">
+                    </metrics>
+                    <!--i-frame *ngIf="metricsClicked" [url]=viewsFrameUrl width="100%" height="250"></i-frame-->
+                    <i-frame *ngIf="metricsClicked && totalViews>0"
+                        [url]=viewsFrameUrl width="100%" height="250">
+                    </i-frame>
+                    <i-frame *ngIf="metricsClicked && totalDownloads>0"
+                        [url]=downloadsFrameUrl width="100%" height="250">
+                    </i-frame>
+                </div>
+            <!--/ul-->
+          </div>
+        </div>
+
+        <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
+          <div class="uk-card uk-card-default uk-padding-small">
+          <div  >
+            Share - Bookmark
+            <addThis></addThis>
+          </div>
+          <altmetrics  *ngIf="publicationInfo.identifiers && publicationInfo.identifiers.get('doi')"
+              id="{{publicationInfo.identifiers.get('doi')[0]}}" type="doi">
+          </altmetrics>
+            <ul class="uk-list">
+                <!-- <li *ngIf="publicationInfo.downloadFrom && publicationInfo.downloadFrom.size > 0">
+                    <dl class="uk-description-list-line">
+                        <dt class="title">Download from</dt>
+                        <dd class="line"
+                            *ngFor="let key of getKeys(publicationInfo.downloadFrom) let i=index" >
+                            <div *ngIf="i<5 || showAllDownloadFrom"
+                                  class="{{publicationInfo.downloadFrom.get(key)['bestAccessMode']}}">
+                                <span [class]="publicationInfo.downloadFrom.get(key)['url'].length > 0 ? 'custom-external custom-icon' : ''">
+                                    <span *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}}" target="_blank"
+                                                [attr.uk-tooltip]="publicationInfo.downloadFrom.get(key)['accessMode'][i] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                                                [title]="publicationInfo.downloadFrom.get(key)['accessMode'][i]">
+                                                [{{i+1}}]
+                                            </a>
+                                        </span>
+                                    </span>
+                                    <a *ngIf="publicationInfo.downloadFrom.get(key)['url'].length == 1"
+                                        href="{{publicationInfo.downloadFrom.get(key)['url']}}"
+                                        target="_blank"
+                                        [attr.uk-tooltip]="publicationInfo.downloadFrom.get(key)['bestAccessMode'] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                                        [title]="publicationInfo.downloadFrom.get(key)['bestAccessMode']">
+                                        {{key}}
+                                    </a>
+                                    <span *ngIf="publicationInfo.downloadFrom.get(key)['url'].length == 0"
+                                          [attr.uk-tooltip]="publicationInfo.downloadFrom.get(key)['bestAccessMode'] ? 'pos:right; delay:10' : 'cls: uk-invisible'"
+                                          [title]="publicationInfo.downloadFrom.get(key)['bestAccessMode']">
+                                        {{key}}
+                                    </span>
+                                </span>
+                            </div>
+                        </dd>
+                        <dd *ngIf="showAllDownloadFrom" class="uk-text-right">
+                            <a class="uk-text-muted" (click)="showAllDownloadFrom = !showAllDownloadFrom;">
+                                View less
+                            </a>
+                        </dd>
+                        <dd *ngIf="!showAllDownloadFrom && publicationInfo.downloadFrom.size > 5">...</dd>
+                        <dd *ngIf="!showAllDownloadFrom && publicationInfo.downloadFrom.size > 5" class="uk-text-right">
+                            <a class="uk-text-muted" (click)="showAllDownloadFrom = !showAllDownloadFrom;">
+                                View more
+                            </a>
+                        </dd>
+                    </dl>
+                </li> -->
+
+                <!-- <li *ngIf="publicationInfo.publishedIn && publicationInfo.publishedIn.size > 0">
+                    <publishedIn [publishedIn]="publicationInfo.publishedIn"></publishedIn>
+                </li> -->
+                <li *ngIf="publicationInfo.hostedBy_collectedFrom && publicationInfo.hostedBy_collectedFrom.length > 0">
+                    <availableOn [availableOn]="publicationInfo.hostedBy_collectedFrom"></availableOn>
+                </li>
+                <li *ngIf="publicationInfo.fundedByProjects != undefined && publicationInfo.fundedByProjects.length > 0">
+                    <fundedBy [fundedByProjects]="publicationInfo.fundedByProjects"></fundedBy>
+                </li>
+
+                <li *ngIf="publicationInfo.contexts && publicationInfo.contexts.length >0 ">
+                    <dl class="uk-description-list-line"  >
+                        <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']">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
+                          </span>
+                          <mark *ngIf = "item['inline']" >
+                            <span>{{item['labelContext']}}</span>
+                            <span *ngIf="item['labelCategory']">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
+                          </mark>
+                        </dd>
+                    </dl>
+
+                </li>
+                <li>
+                  <ul uk-accordion class="uk-padding-remove">
+                      <li>
+                        <div class=" uk-accordion-title cite-this-button uk-width-1-1" type="button">
+                          Cite this publication
+                        </div>
+                          <div class="uk-accordion-content">
+                            <citeThis [result]="publicationInfo" [id]="articleId" type="publication"></citeThis>
+                          </div>
+                      </li>
+                  </ul>
+
+                </li>
+                <li>
+
+                  <ul uk-accordion class="uk-padding-remove">
+                      <li>
+                        <button class="uk-button uk-button-primary uk-accordion-title link-to-button  uk-width-1-1" type="button">
+                          <span class="uk-icon" >
+                                 <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                          <span class="uk-margin-right">Link this publication to</span>
+                        </button>
+                          <div class="uk-accordion-content">
+                            <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                                <li><a class="uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                   Projects</a></li>
+                                <li><a  class="uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                   Communities</a></li>
+                                <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                  Other research results</a></li>
+                            </ul>
+                          </div>
+                          <!--button class="uk-button uk-button-small uk-button-default">
+                            <span class="uk-icon" >
+                                   <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                            Link this publication to
+                          </button>
+                          <div class="uk-inline">
+                              <button class="uk-button uk-button-small uk-button-default" type="button">
+                                <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-down" ratio="1"><polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                              </button>
+                              <div uk-dropdown="mode: click; boundary: ! .uk-button-group; boundary-align: true;"
+                              class="uk-dropdown uk-dropdown-boundary uk-dropdown-bottom-left" style="top: 40px;    left: -236.5px;">
+                                  <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                                      <li><a class="uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                         Projects</a></li>
+                                      <li><a  class="uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                         Communities</a></li>
+                                      <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[articleId,'publication','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                        Other research results</a></li>
+                                  </ul>
+                              </div>
+                          </div-->
+                      </li>
+                  </ul>
+
+                </li>
+            </ul>
+          </div>
+        </div>
+    </div>
+</div>
+</div>
+</div>
+</div>
diff --git a/landingPages/publication/publication.component.ts b/landingPages/publication/publication.component.ts
new file mode 100644
index 00000000..b44a14c6
--- /dev/null
+++ b/landingPages/publication/publication.component.ts
@@ -0,0 +1,312 @@
+import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Observable} from 'rxjs/Observable';
+import {PublicationService} from './publication.service';
+import {PublicationInfo} from '../../utils/entities/publicationInfo';
+import {ActivatedRoute, Router} from '@angular/router';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import {RouterHelper} from '../../utils/routerHelper.class';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+import { Meta} from '../../../angular2-meta';
+
+
+
+@Component({
+    selector: 'publication',
+    templateUrl: 'publication.component.html',
+
+})
+
+export class PublicationComponent {
+  public publicationInfo: PublicationInfo;
+  public articleId: string;
+
+  // APP BOX variables
+  public showAllCollectedFrom: boolean = false;
+  public showAllDownloadFrom: boolean = false;
+
+  // Metrics tab variables
+  public metricsClicked: boolean;
+  public viewsFrameUrl: string;
+  public downloadsFrameUrl: string;
+  public totalViews: number;
+  public totalDownloads: number;
+  public pageViews: number;
+
+  // Custom tab paging variables
+  public referencesPage: number = 1;
+  public organizationsPage: number = 1;
+  public softwarePage: number = 1;
+  public bioentitiesPage: number = 1;
+  public pageSize: number = 10;
+  /*
+    public startt: number = 0;
+    public stopp: number = 0;
+  */
+
+  // Active tab variable for responsiveness
+  public activeTab: string = "References";
+
+  // Map counting variables
+  public bioentitiesNum: number = 0;
+  public relatedResearchResultsNum: number = 0;
+
+  // Message variables
+  public warningMessage = "";
+  public errorMessage = "";
+  public showLoading: boolean = true;
+
+  public routerHelper:RouterHelper = new RouterHelper();
+
+  private doi: string;
+  private result;
+  sub: any; piwiksub: any; infoSub: any;
+
+  constructor ( private element: ElementRef,
+                private _publicationService: PublicationService,
+                private _piwikService:PiwikService,
+                private route: ActivatedRoute, private _meta: Meta,
+                private _router: Router) {
+                  this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+  }
+
+  ngOnInit() {
+       this.sub =  this.route.queryParams.subscribe(data => {
+           this.publicationInfo = null;
+           this.updateTitle("Publication");
+           this.updateDescription("Publication, open access, collected from");
+
+          this.articleId = data['articleId'];
+          console.info("Article id is :"+this.articleId);
+
+          this.metricsClicked = false;
+
+          if(this.articleId){
+
+              this.getPublicationInfo(this.articleId);
+              // if (typeof document !== 'undefined') {
+              //   switcher(UIkit);
+              // }
+          }else{
+              this.showLoading = false;
+              this.warningMessage="No valid publication id";
+          }
+
+          this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoViews", "resTitle":"'+this.articleId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+
+          this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoDownloads", "resTitle":"'+this.articleId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+
+          if (typeof document !== 'undefined') {
+             this.element.nativeElement.scrollIntoView();
+          }
+    });
+  }
+
+    ngOnDestroy() {
+        this.sub.unsubscribe();
+        if(this.piwiksub){
+          this.piwiksub.unsubscribe();
+        }
+        if(this.infoSub) {
+          this.infoSub.unsubscribe();
+        }
+    }
+
+    private getPublicationInfo(id:string) {
+        this.warningMessage = '';
+        this.errorMessage=""
+        this.showLoading = true;
+
+        this.infoSub = this._publicationService.getPublicationInfo(this.articleId).subscribe(
+            data => {
+                this.publicationInfo = data;
+
+                // this.result = []
+                // this.result = {id: id, type :"dataset", source : "openaire", title: this.publicationInfo.title,url: '', result: '', accessRights: this.publicationInfo.bestaccessright, embargoEndDate: ''};
+                this.updateTitle(this.publicationInfo.title.name);
+                this.updateDescription("Dataset, search, repositories, open access,"+this.publicationInfo.title.name);
+                if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                  this.piwiksub =  this._piwikService.trackView(this.publicationInfo.title.name).subscribe();
+                }
+
+                let bioentitiesNum = 0;
+                if(this.publicationInfo.bioentities != undefined) {
+                    this.publicationInfo.bioentities.forEach(function (value, key, map) {
+                        bioentitiesNum += value.size;
+                    });
+                }
+                this.bioentitiesNum = bioentitiesNum;
+
+                let relatedResearchResultsNum = 0;
+                if(this.publicationInfo.relatedResearchResults != undefined) {
+                    this.publicationInfo.relatedResearchResults.forEach(function (value, key, map) {
+                        relatedResearchResultsNum += value.length;
+                    });
+                }
+                this.relatedResearchResultsNum = relatedResearchResultsNum;
+
+                this.result = {id: this.articleId, type :"publication", source : "openaire", title: this.publicationInfo.title,url: '', result: '', accessRights: this.publicationInfo.title.accessMode, embargoEndDate: ''};
+                // this.result.push(result_);
+
+                if(this.publicationInfo.identifiers != undefined && this.publicationInfo.identifiers.has('doi')) {
+                    this.doi = this.publicationInfo.identifiers.get('doi')[0];
+                }
+
+                this.showLoading = false;
+
+                if(this.publicationInfo.references) {
+                  this.activeTab = "References";
+                } else if(this.publicationInfo.relatedResearchResults) {
+                  this.activeTab = "Related Research Results";
+                } else if(this.publicationInfo.similarResearchResults) {
+                  this.activeTab = "Similar Research Results";
+                } else if(this.publicationInfo.organizations) {
+                  this.activeTab = "Related Organizations";
+                } else if(this.publicationInfo.bioentities) {
+                  this.activeTab = "bioentities";
+                } else if(this.publicationInfo.software) {
+                  this.activeTab = "Software";
+                } else {
+                  this.activeTab = "Metrics";
+                  this.metricsClicked = true;
+                }
+                console.info("activeTab is "+this.activeTab);
+            },
+            err => {
+              console.log(err);
+              console.info("error");
+
+              this.errorMessage = 'No publication found';
+              this.showLoading = false;
+            }
+      );
+    }
+
+    public metricsResults($event) {
+      this.totalViews = $event.totalViews;
+      this.totalDownloads = $event.totalDownloads;
+      this.pageViews = $event.pageViews;
+    }
+
+    public buildCurationTooltip() {
+        let tooltipContent: string = "<div class='uk-margin uk-padding-small'>";
+
+        tooltipContent += "<h4>Record in preview</h4>";
+        tooltipContent += "<p>Bibliographic record accepted by the system, but not yet processed by <br> OpenAIRE tools for information quality improvement and de-duplication</p>";
+
+        return tooltipContent+= "</div>";
+    }
+
+    private updateDescription(description:string){
+      this._meta.updateMeta("description", description);
+      this._meta.updateProperty("og:description", description);
+    }
+    private updateTitle(title:string){
+      var _prefix ="OpenAIRE | ";
+      var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+      this._meta.setTitle(_title );
+      this._meta.updateProperty("og:title",_title);
+    }
+
+    private updateUrl(url:string){
+      this._meta.updateProperty("og:url", url);
+    }
+
+    public totalPages(totalResults: number): number {
+      let totalPages:any = totalResults/this.pageSize;
+      if(!(Number.isInteger(totalPages))) {
+          totalPages = (parseInt(totalPages, this.pageSize) + 1);
+      }
+      return totalPages;
+    }
+
+    public updateReferencesPage($event) {
+      this.referencesPage = $event.value;
+    }
+
+    public updateOrganizationsPage($event) {
+      this.organizationsPage = $event.value;
+    }
+
+    public updateSoftwarePage($event) {
+      this.softwarePage = $event.value;
+    }
+
+    public updateBioentitiesPage($event) {
+      this.bioentitiesPage = $event.value;
+    }
+
+    public keysToArray(bioentities: Map<string, string>) : string[] {
+      let keys: string[] = [];
+      bioentities.forEach(function (value, key, map) {
+        keys.push(key);
+      });
+      return keys;
+    }
+    public getKeys( map) {
+      return Array.from(map.keys());
+    }
+/*
+    start(i: number, bioentitiesPage: number) {
+      let sum = 0;
+      let index=0;
+      let retValue = 0;
+      let valuesToPage = this.pageSize*bioentitiesPage;
+      let valuesToPreviousPage = valuesToPage - this.pageSize;
+
+      if(bioentitiesPage == 1) {
+        return 0;
+      }
+
+      this.publicationInfo.bioentities.forEach(function (value, key, map) {
+        sum += map.get(key).size;
+
+        if(index == i) {
+          if(sum <= valuesToPreviousPage) {
+            retValue =  0;
+          } else if((sum-map.get(key).size) >= valuesToPage){
+            retValue = 0;
+          } else {
+            if(map.get(key).size < (sum - valuesToPreviousPage)) {
+              retValue = 0;
+            } else {
+              retValue = map.get(key).size - (sum - valuesToPreviousPage);
+            }
+          }
+        }
+        index++;
+      });
+      this.startt = retValue;
+      return retValue;
+    }
+
+    stop(i: number, bioentitiesPage: number) {
+      let sum = 0;
+      let index=0;
+      let retValue = 0;
+      let valuesToPage = this.pageSize*bioentitiesPage;
+      let valuesToPreviousPage = valuesToPage - this.pageSize;
+
+      this.publicationInfo.bioentities.forEach(function (value, key, map) {
+        sum += map.get(key).size;
+        if(index == i) {
+          if(sum <= valuesToPreviousPage) {
+            retValue =  0;
+          } else if((sum - map.get(key).size) >= valuesToPage){
+            retValue = 0;
+          } else {
+            if(sum < valuesToPage) {
+              retValue = map.get(key).size;
+            } else {
+              retValue = map.get(key).size - (sum - valuesToPage);
+            }
+          }
+        }
+        index++;
+      });
+      this.stopp = retValue;
+      return retValue;
+    }
+*/
+
+}
diff --git a/landingPages/publication/publication.module.ts b/landingPages/publication/publication.module.ts
new file mode 100644
index 00000000..b2dd29c6
--- /dev/null
+++ b/landingPages/publication/publication.module.ts
@@ -0,0 +1,32 @@
+//import {MaterialModule} from '@angular/material';
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { SharedModule } from '../../shared/shared.module';
+import { RouterModule } from '@angular/router';
+
+import { PublicationService} from './publication.service';
+import { PublicationComponent } from './publication.component';
+// import { PublicationRoutingModule } from './publication-routing.module';
+import {MetricsModule} from '../landing-utils/metrics.module';
+import {IFrameModule} from '../../utils/iframe.module';
+import {AltMetricsModule} from '../../utils/altmetrics.module';
+import {CiteThisModule} from '../landing-utils/citeThis/citeThis.module';
+import {PagingModule} from '../../utils/paging.module';
+
+import { ResultLandingModule } from '../landing-utils/resultLanding.module';
+import { LandingModule } from '../landing-utils/landing.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+import {MetaModule} from '../../../meta.module';
+import { ConfigurationServiceModule } from '../../utils/configuration/configurationService.module';
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, LandingModule,SharedModule, RouterModule, CiteThisModule, PagingModule,
+    ResultLandingModule, IFrameModule, MetricsModule, AltMetricsModule,
+    MetaModule, ConfigurationServiceModule],
+  declarations: [PublicationComponent],
+  providers:[PublicationService, FreeGuard, IsRouteEnabled],
+  exports: [PublicationComponent]
+})
+export class PublicationModule { }
diff --git a/landingPages/publication/publication.service.ts b/landingPages/publication/publication.service.ts
new file mode 100644
index 00000000..2aabb215
--- /dev/null
+++ b/landingPages/publication/publication.service.ts
@@ -0,0 +1,339 @@
+
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {PublicationInfo} from '../../utils/entities/publicationInfo';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import 'rxjs/add/operator/map';
+
+
+import { ParsingFunctions } from '../landing-utils/parsingFunctions.class';
+
+@Injectable()
+export class PublicationService {
+
+  constructor(private http: Http ) {
+    this.parsingFunctions = new ParsingFunctions();
+  }
+
+  public parsingFunctions: ParsingFunctions;
+  publicationInfo: PublicationInfo;
+
+  getPublicationInfo (id: string):any {
+    console.info("getPublicationInfo in service");
+    let url = OpenaireProperties. getSearchAPIURLLast() + 'publications/' +id+"?format=json";
+    let key = url;
+
+    return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                .map(res => <any> res.json())
+                .map(res => [res['result']['header']['dri:status'], res['result']['metadata']['oaf:entity']])
+                .map(res => [ res[1]['oaf:result'],
+                              res[1]['oaf:result']['title'],
+                              res[1]['oaf:result']['rels']['rel'],
+                              res[1]['oaf:result']['children'],
+                              res[1]['oaf:result']['pid'],
+                              res[1]['oaf:result']['journal'],
+                              res[1]['oaf:result']['language'],
+                              res[1]['oaf:result']['subject'],
+                              res[1]['oaf:result']['bestaccessright'],
+                              res[1]['oaf:result']['collectedfrom'],
+                              (res[1]['extraInfo']!= undefined && res[1]['extraInfo']['citations']!= undefined)? res[1]['extraInfo']['citations']['citation']:null,
+                              res[1]['oaf:result']['context'],
+                              res[0],
+                              res[1]['oaf:result']['creator']
+                ])
+                .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.log(error);
+    return Observable.throw(error  || 'Server error');
+  }
+
+  parsePublicationInfo (data: any):any {
+    this.publicationInfo = new PublicationInfo();
+
+    if(data[0] != null) {
+      var date:string = (data[0].dateofacceptance)+""; // transform to string in case it is an integer
+      this.publicationInfo.date  = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+      this.publicationInfo.dateofacceptance = data[0].dateofacceptance;
+      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;
+    }
+
+    this.publicationInfo.title = {"name": "", "url": "", "accessMode": ""};
+    if(data[0]['bestaccessright'].hasOwnProperty("classid")) {
+      this.publicationInfo.title.accessMode = data[0]['bestaccessright'].classid;
+    }
+
+    if(data[1] != null) {
+      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 relation;
+      let length = Array.isArray(data[2]) ? data[2].length : 1;
+
+      for(let i=0; i<length; i++) {
+        relation = Array.isArray(data[2]) ? data[2][i] : data[2];
+        if(relation.hasOwnProperty("to")) {
+          if(relation['to'].class == "isProducedBy") {
+            this.publicationInfo.fundedByProjects = this.parsingFunctions.parseFundingByProjects(this.publicationInfo.fundedByProjects, relation, this.publicationInfo.projectsProvenanceVocabulary);
+          } else if(relation['to'].class == "isRelatedTo") {
+            let provenanceAction: string;
+            if(relation.provenanceaction in this.publicationInfo.researchResultsProvenanceVocabulary) {
+              provenanceAction = this.publicationInfo.researchResultsProvenanceVocabulary[relation.provenanceaction];
+            } else {
+              provenanceAction = "Other";
+            }
+
+            this.publicationInfo.relatedResearchResults = this.parsingFunctions.parseRelatedResearchResults(this.publicationInfo.relatedResearchResults, relation, provenanceAction);
+          } else if(relation['to'].class == "hasAmongTopNSimilarDocuments") {
+            this.publicationInfo.similarResearchResults = this.parsingFunctions.parseSimilarResearchResults(this.publicationInfo.similarResearchResults, relation);
+          } else if(relation['to'].class == "hasAuthorInstitution") {
+            this.publicationInfo.organizations = this.parseRelatedOrganizations(this.publicationInfo.organizations, relation);
+          }
+        }
+      }
+    }
+
+    if(data[3] != null) {
+      if(data[3].hasOwnProperty("instance")) {
+        //this.publicationInfo.collectedFrom = new Array<{"name": string, "id": string}>();
+        //this.publicationInfo.downloadFrom = new Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>();
+        //this.publicationInfo.publishedIn = new Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>();
+
+
+        this.publicationInfo.hostedBy_collectedFrom = new Array<{"downloadName": string, "downloadUrl": string[], "collectedName": string, "collectedId": string, "accessMode": string[], "bestAccessMode": string, "type": string, "year":string}>();
+
+
+        this.publicationInfo.types = new Array<string>();
+        let types = new Set<string>();
+
+        let counter = 0;
+        let instance;
+
+        let length = Array.isArray(data[3]['instance']) ? data[3]['instance'].length : 1;
+
+        for(let i=0; i<length; i++) {
+          instance = Array.isArray(data[3]['instance']) ? data[3]['instance'][i] : data[3]['instance'];
+
+          this.parsingFunctions.parseTypes(this.publicationInfo.types, types, instance);
+
+          if(instance.hasOwnProperty("webresource")) {
+            let url;
+            if(!Array.isArray(instance['webresource'])) {
+              url = instance['webresource'].url;
+            } else{
+              url = instance['webresource'][0].url;
+            }
+
+            /**********************************************************/
+            if(instance.hasOwnProperty("hostedby")) {
+              counter = this.parsingFunctions.parseHostedBy_collectedFrom(this.publicationInfo.hostedBy_collectedFrom, instance, data[0], url, counter, this.publicationInfo.title);
+            }
+            /**********************************************************/
+          }
+        }
+      }
+
+      if(data[3].hasOwnProperty("externalreference")) {
+        let externalResults: [Map<string, Map<string, string>>, { "name": string, "url": string}[]] = this.parseBioentitiesAndSoftware(data[3]);
+        this.publicationInfo.bioentities = externalResults[0];
+        this.publicationInfo.software = externalResults[1];
+      }
+    }
+
+    if(data[4] != null) {
+      this.publicationInfo.identifiers = this.parsingFunctions.parseIdentifiers(data[4]);
+    }
+
+    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(!Array.isArray(data[6])) {
+        if(data[6].classname != "Undetermined" && data[6].classname) {
+          this.publicationInfo.languages.push(data[6].classname);
+        }
+      } else {
+        for(let i=0; i<data[6].length; i++) {
+          if(data[6][i].classname != "Undetermined" && data[6][i].classname) {
+            this.publicationInfo.languages.push(data[6][i].classname);
+          }
+        }
+      }
+    }
+
+    if(data[7] != null) {
+      let subjectResults: [string[], Map<string, string[]>, Map<string, string[]>] = this.parsingFunctions.parseAllSubjects(data[7]);
+      this.publicationInfo.subjects = subjectResults[0];
+      this.publicationInfo.otherSubjects = subjectResults[1];
+      this.publicationInfo.classifiedSubjects = subjectResults[2];
+    }
+
+    // if(data[8] != null) {
+    //     this.publicationInfo.bestaccessright = data[8].classid;
+    // }
+
+    // if(data[9] != null) {
+    //   this.publicationInfo.collectedFrom = this.parsingFunctions.parseCollectedFrom(data[9]);
+    // }
+
+    this.publicationInfo.hostedBy_collectedFrom = this.parsingFunctions.addPublisherToHostedBy_collectedFrom(
+                this.publicationInfo.hostedBy_collectedFrom, this.publicationInfo.publisher,
+                this.publicationInfo.journal, this.publicationInfo.identifiers,
+                this.publicationInfo.title);
+
+    if(data[10] != null) {
+      this.publicationInfo.references = this.parseReferences(data[10]);
+    }
+
+    if(data[11] != null) {
+      this.publicationInfo.contexts = this.parsingFunctions.parseContexts(data[11]);
+    }
+
+    if(data[12] != null && data[12] == "under curation") {
+      this.publicationInfo.underCurationMessage = true;
+    } else {
+      this.publicationInfo.underCurationMessage = false;
+    }
+
+    if(data[13] != null) {
+      if(this.publicationInfo.authors == undefined) {
+        this.publicationInfo.authors = new Array<string>();
+      }
+
+      let authors = data[13];
+      let length = Array.isArray(authors) ? authors.length : 1;
+
+      for(let i=0; i<length; i++) {
+        let author = Array.isArray(authors) ? authors[i] : authors;
+        this.publicationInfo.authors[author.rank-1] = author.content;
+      }
+      this.publicationInfo.authors = this.publicationInfo.authors.filter(function (item) {
+        return (item != undefined);
+      });
+    }
+
+    return this.publicationInfo;
+  }
+
+  parseRelatedOrganizations(organizations: {"name": string, "shortname":string, "id": string, "websiteUrl": string, "country": string, "trust": number}[], relation: any):
+                  {"name": string, "shortname":string, "id": string, "websiteUrl": string, "country": string, "trust": number}[] {
+    if(organizations == undefined) {
+      organizations = new Array<{
+                  "name": string, "shortname": string,
+                  "id": string, "websiteUrl": string,
+                  "country": string, "trust": number}>();
+    }
+
+    let organization: { "name": string, "shortname": string,
+                        "id": string, "websiteUrl": string,
+                        "country": string, "trust": number
+                      } = {
+                        "name": "", "shortname": "",
+                        "id": "", "websiteUrl": "",
+                        "country": "", "trust": null
+                      };
+
+    organization.id = relation['to'].content;
+    organization.name = relation.legalname;
+    organization.shortname = relation.legalshortname;
+    organization.websiteUrl = relation.websiteurl;
+    if(relation.country) {
+      organization.country = relation.country.classname;
+    }
+    if(relation.trust) {
+      organization.trust = Math.round(relation.trust*100);
+    }
+
+    organizations.push(organization);
+    return organizations;
+  }
+
+  parseBioentitiesAndSoftware(children: any) : [Map<string, Map<string, string>>, { "name": string, "url": string}[]] {
+    let bioentities: Map<string, Map<string, string>>;
+    let software: {"name": string, "url": string}[];
+
+    let length = Array.isArray(children['externalreference']) ? children['externalreference'].length : 1;
+
+    let externalreference;
+    for(let i=0; i<length; i++) {
+      externalreference = Array.isArray(children['externalreference']) ? children['externalreference'][i] : children['externalreference'];
+
+      if(externalreference.hasOwnProperty("qualifier")) {
+        if(externalreference['qualifier'].classid == "accessionNumber") {
+
+          if(bioentities == undefined) {
+            bioentities = new Map<string, Map<string, string>>();
+          }
+
+          if(!bioentities.has(externalreference.sitename)) {
+            bioentities.set(externalreference.sitename, new Map<string, string>());
+          }
+          bioentities.get(externalreference.sitename).set(externalreference.refidentifier, externalreference.url);
+
+        } else if(externalreference['qualifier'].classid == "software") {
+
+          if(software == undefined) {
+            software = new Array<{"name": string, "url": string}>();
+          }
+
+          software.push({"name": externalreference.sitename, "url": externalreference.url});
+        }
+      }
+    }
+
+    return [bioentities, software];
+  }
+
+  parseReferences(citations: any): {"name": string, "url": string}[] {
+    let references = new Array<{"name": string, "url": string}>();
+
+    let citation;
+    let length = Array.isArray(citations) ? citations.length : 1;
+    for(let i=0; i<length; i++) {
+      citation = Array.isArray(citations) ? citations[i] : citations;
+
+      let url;
+      if(citation.hasOwnProperty("id")) {
+        let citationId;
+        let length1 = Array.isArray(citation['id']) ? citation['id'].length : 1;
+        for(let j=0; j<length1; j++) {
+          citationId = Array.isArray(citation['id']) ? citation['id'][j] : citation['id'];
+
+          if(citationId.type == "pmid") {
+            url = OpenaireProperties.getPmidURL()+citationId.value;
+          }
+        }
+      }
+
+      references[citation.position-1] = { "name": "", "url": ""};
+      references[citation.position-1]['name'] = citation.rawText;
+      references[citation.position-1]['url'] = url;
+    }
+    return references;
+  }
+}
diff --git a/landingPages/software/software-routing.module.ts b/landingPages/software/software-routing.module.ts
new file mode 100644
index 00000000..ccf819db
--- /dev/null
+++ b/landingPages/software/software-routing.module.ts
@@ -0,0 +1,15 @@
+// import { NgModule } from '@angular/core';
+// import { RouterModule } from '@angular/router';
+//
+// import {SoftwareComponent } from './software.component';
+// import {FreeGuard} from'../../login/freeGuard.guard';
+// import {PreviousRouteRecorder} from'../../utils/piwik/previousRouteRecorder.guard';
+//
+// @NgModule({
+//  imports: [
+//   RouterModule.forChild([
+//     { path: '', component: SoftwareComponent, canActivate: [FreeGuard],canDeactivate: [PreviousRouteRecorder]  }
+//   ])
+// ]
+// })
+// export class SoftwareRoutingModule { }
diff --git a/landingPages/software/software.component.html b/landingPages/software/software.component.html
new file mode 100644
index 00000000..f047c3cd
--- /dev/null
+++ b/landingPages/software/software.component.html
@@ -0,0 +1,270 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div class="uk-container uk-margin-top software">
+
+    <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
+    <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
+    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+
+    <div *ngIf="softwareInfo != null" uk-grid class="uk-grid-large">
+        <div class="uk-width-3-4@l uk-width-3-4@xl uk-width-3-4@m uk-width-1-1@s">
+            <showTitle   [title]="softwareInfo.title"></showTitle>
+            <span *ngIf="softwareInfo.types.length > 0"class="uk-label custom-label label-software " title="Type">{{softwareInfo.types.join(", ")}}</span>
+            <span *ngIf="softwareInfo.languages.length > 0" class="uk-label custom-label  label-language " title="Language">{{softwareInfo.languages.join(", ")}}</span>
+            <span *ngIf="softwareInfo.title && softwareInfo.title.accessMode" [class]="'uk-label custom-label  label-'+ softwareInfo.title.accessMode " >{{softwareInfo.title.accessMode}}</span>
+            <span *ngIf="softwareInfo.underCurationMessage" class="uk-label custom-label label-underCuration "  >
+              <span uk-tooltip="pos:right; delay:10"
+                  title="{{buildCurationTooltip()}}">
+              <i>Record in preview</i>
+              <i class="uk-icon-info-circle"></i>
+            </span></span>
+            <!--div *ngIf="softwareInfo.underCurationMessage">
+              <span uk-tooltip="pos:right; delay:10"
+                    title="{{buildCurationTooltip()}}">
+                <i>Record in preview</i>
+                <i class="uk-icon-info-circle"></i>
+              </span>
+            </div-->
+
+            <div class= " uk-margin-top">
+                <showAuthors [authors]="softwareInfo.authors" searchPage="software"></showAuthors>
+                <span *ngIf="softwareInfo.date != ''">({{softwareInfo.date}})</span>
+            </div>
+
+            <ul class="uk-list">
+                <li *ngIf="softwareInfo.publisher"><span class="uk-text-bold">Publisher:</span> {{softwareInfo.publisher}}</li>
+
+                <li *ngIf="softwareInfo.embargoEndDate"><span class="uk-text-bold">Embargo end date:</span> {{softwareInfo.embargoEndDate}}</li>
+                 <li *ngIf="softwareInfo.identifiers && softwareInfo.identifiers.size > 0">
+                  <showIdentifiers [identifiers]="softwareInfo.identifiers"></showIdentifiers>
+                </li>
+                <li *ngIf="softwareInfo.subjects ||softwareInfo.otherSubjects ||  softwareInfo.classifiedSubjects">
+                  <showSubjects [subjects]="softwareInfo.subjects"
+                  [otherSubjects]="softwareInfo.otherSubjects"
+                  [classifiedSubjects]="softwareInfo.classifiedSubjects">
+                </showSubjects>
+                </li>
+            </ul>
+
+            <div *ngIf="softwareInfo.description" class="uk-margin-bottom uk-text-justify descriptionText">
+              {{softwareInfo.description}}
+            </div>
+
+            <!-- <div class="uk-clearfix"><div class="uk-button-group uk-float-right  uk-margin-top">
+                <button class="uk-button uk-button-small uk-button-action">
+                  <span class="uk-icon"   >
+                         <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                  Link this software to
+                </button>
+                <div class="uk-inline">
+                    <button class="uk-button uk-button-small uk-button-action" type="button">
+                      <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-down" ratio="1"><polygon points="5 7 15 7 10 12"></polygon></svg></span>
+                    </button>
+                    <div uk-dropdown="mode: click; boundary: ! .uk-button-group; boundary-align: true;"
+                    class="uk-dropdown uk-dropdown-boundary uk-dropdown-bottom-left" style="top: 40px;    left: -236.5px;">
+                        <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                            <li><a class="uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[softwareId,'software','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                               Projects</a></li>
+                            <li><a  class="uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[softwareId,'software','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                               Communities</a></li>
+                            <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[softwareId,'software','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                              Other research results</a></li>
+                        </ul>
+
+                    </div>
+                </div>
+            </div></div> -->
+
+
+            <ul class="uk-tab uk-visible@m" uk-tab="connect: #tab-content">
+                <li (click)="activeTab='Related Research Results'"
+                    [class]="activeTab == 'Related Research Results'?'uk-active':''">
+                     <a>
+                         Related Research Results
+                         <span class="uk-badge uk-badge-notification">
+                             {{relatedResearchResultsNum}}
+                         </span>
+                     </a>
+                 </li>
+
+                <li (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
+                    <a>
+                        Similar Research Results
+                        <span *ngIf="!softwareInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
+                        <span *ngIf="softwareInfo.similarResearchResults" class="uk-badge uk-badge-notification">
+                            {{softwareInfo.similarResearchResults.length}}
+                        </span>
+                    </a>
+                </li>
+
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
+                    <a>
+                        Metrics  <!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+  <path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+</svg></i-->
+                    </a>
+                </li>
+            </ul>
+
+            <button class="uk-button uk-button-default uk-hidden@m" type="button">
+              <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
+            </button>
+
+            <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #tab-content" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
+              <li (click)="activeTab='Related Research Results'"
+                  [class]="activeTab == 'Related Research Results'?'uk-active':''">
+                     <a>
+                         Related Research Results
+                         <span class="uk-badge uk-badge-notification">
+                             {{relatedResearchResultsNum}}
+                         </span>
+                     </a>
+                 </li>
+
+                <li (click)="activeTab='Similar Research Results'"
+                    [class]="activeTab == 'Similar Research Results'?'uk-active':''">
+                    <a>
+                        Similar Research Results
+                        <span *ngIf="!softwareInfo.similarResearchResults" class="uk-badge uk-badge-notification">0</span>
+                        <span *ngIf="softwareInfo.similarResearchResults" class="uk-badge uk-badge-notification">
+                            {{softwareInfo.similarResearchResults.length}}
+                        </span>
+                    </a>
+                </li>
+
+                <li (click)="metricsClicked=true; activeTab='Metrics'"
+                    [class]="activeTab == 'Metrics'?'uk-active':''">
+                    <a>
+                        Metrics<!--i class="icon-line-chart"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 36 36"  style="fill:currentColor;">
+<path d="M4.415 31.713h31.704v4.529h-36.233v-36.233h4.529zM10.077 29.447c-1.877 0-3.396-1.521-3.396-3.396s1.521-3.396 3.396-3.396c0.101 0 0.199 0.006 0.297 0.014l3.652-6.086c-0.348-0.534-0.551-1.171-0.551-1.855 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 0.685-0.203 1.321-0.551 1.855l3.652 6.086c0.098-0.009 0.196-0.014 0.297-0.014 0.076 0 0.151 0.004 0.225 0.009l6.028-10.549c-0.373-0.546-0.592-1.204-0.592-1.916 0-1.877 1.521-3.396 3.396-3.396s3.396 1.521 3.396 3.396c0 1.877-1.521 3.396-3.396 3.396-0.076 0-0.151-0.004-0.225-0.009l-6.028 10.549c0.373 0.546 0.592 1.204 0.592 1.916 0 1.877-1.521 3.396-3.396 3.396s-3.396-1.521-3.396-3.396c0-0.684 0.203-1.321 0.551-1.855l-3.652-6.086c-0.098 0.009-0.196 0.014-0.297 0.014s-0.199-0.006-0.297-0.014l-3.652 6.086c0.348 0.534 0.551 1.171 0.551 1.855 0 1.877-1.521 3.396-3.396 3.396z"></path>
+  </svg></i-->
+                    </a>
+                </li>
+            </ul>
+
+            <!--ul id="tab-content" class="uk-switcher uk-margin custom-tab-content"-->
+            <div class="uk-margin custom-tab-content">
+                <div *ngIf="activeTab=='Related Research Results'" class="uk-animation-fade">
+                    <div *ngIf="!softwareInfo.relatedResearchResults" class = "uk-alert  uk-alert-primary" >
+                        No related research results available
+                    </div>
+                    <div *ngIf="softwareInfo.relatedResearchResults">
+                        <div *ngFor="let provenanceaction of getKeys(softwareInfo.relatedResearchResults)">
+                            <div class="uk-text-large">{{provenanceaction}}</div>
+
+                            <tabTable [info]="softwareInfo.relatedResearchResults.get(provenanceaction)"></tabTable>
+                        </div>
+                    </div>
+                </div>
+
+                <div *ngIf="activeTab=='Similar Research Results'" class="uk-animation-fade">
+                    <div  *ngIf="!softwareInfo.similarResearchResults"  class = "uk-alert  uk-alert-primary" >
+                        No similar research results available
+                    </div>
+                    <div *ngIf="softwareInfo.similarResearchResults">
+                        <tabTable [info]="softwareInfo.similarResearchResults"></tabTable>
+                    </div>
+                </div>
+                <div *ngIf="activeTab=='Metrics'" class="uk-animation-fade">
+                  <!-- Page Views: {{pageViews}} -->
+                    <metrics [pageViews]="pageViews"
+                        [id]="softwareId" [entityType]="'results'" [entity]="'Software'"
+                        (metricsResults)="metricsResults($event)">
+                    </metrics>
+                    <i-frame *ngIf="metricsClicked && totalViews > 0"
+                        [url]=viewsFrameUrl width="100%" height="250">
+                    </i-frame>
+                    <i-frame *ngIf="metricsClicked && totalDownloads > 0"
+                        [url]=downloadsFrameUrl width="100%" height="250">
+                    </i-frame>
+                </div>
+            <!--/ul-->
+          </div>
+        </div>
+
+        <div class="uk-width-1-4@l uk-width-1-4@xl uk-width-1-4@m uk-width-1-1@s">
+          <div class="uk-card uk-card-default uk-padding-small">
+          <div  >
+            Share - Bookmark
+            <addThis></addThis>
+          </div>
+          <altmetrics *ngIf="softwareInfo.identifiers && softwareInfo.identifiers.get('doi')"
+             id="{{softwareInfo.identifiers.get('doi')[0]}}" type="doi">
+          </altmetrics >
+            <ul class="uk-list ">
+
+                <li *ngIf="softwareInfo.hostedBy_collectedFrom && softwareInfo.hostedBy_collectedFrom.length > 0">
+                    <availableOn [availableOn]="softwareInfo.hostedBy_collectedFrom"></availableOn>
+                </li>
+                <li *ngIf="softwareInfo.fundedByProjects != undefined && softwareInfo.fundedByProjects.length > 0">
+                  <fundedBy [fundedByProjects]="softwareInfo.fundedByProjects"></fundedBy>
+                </li>
+
+                <li  *ngIf="softwareInfo.contexts && softwareInfo.contexts.length >0 ">
+                    <dl class="uk-description-list-line" >
+                        <dt class="title">Related to </dt>
+                        <dd class="line" *ngFor="let item of softwareInfo.contexts">
+                          <span *ngIf = "!item['inline']" >
+                            <span>{{item['labelContext']}}</span>
+                            <span *ngIf="item['labelCategory']">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
+                          </span>
+                          <mark *ngIf = "item['inline']" >
+                            <span>{{item['labelContext']}}</span>
+                            <span *ngIf="item['labelCategory']">-> {{item['labelCategory']}}</span>
+                            <span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
+                          </mark>
+                        </dd>
+
+                    </dl>
+
+                </li>
+                <li>
+                  <ul uk-accordion class="uk-padding-remove">
+                      <li>
+                        <div class=" uk-accordion-title cite-this-button uk-width-1-1" type="button">
+                          Cite this software
+                        </div>
+                          <div class="uk-accordion-content">
+                            <citeThis [result]="softwareInfo" [id]="softwareId" type="software"></citeThis>
+                          </div>
+                      </li>
+                  </ul>
+
+
+                </li>
+                <li>
+                  <ul uk-accordion class="uk-padding-remove">
+                      <li>
+                        <button class="uk-button uk-button-primary uk-accordion-title link-to-button  uk-width-1-1" type="button">
+                          <span class="uk-icon" >
+                                 <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="link" ratio="1"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg></span>
+                          <span class="uk-margin-right">Link this software to</span>
+                        </button>
+                          <div class="uk-accordion-content">
+                            <ul class="uk-nav uk-dropdown-nav uk-padding-small" >
+                              <li><a class="uk-width-1-1" [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[softwareId,'software','project'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                 Projects</a></li>
+                              <li><a  class="uk-width-1-1"[queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[softwareId,'software','context'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                 Communities</a></li>
+                              <li><a   class="uk-width-1-1"  [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[softwareId,'software','result'])"   routerLinkActive="router-link-active" routerLink="/participate/direct-claim" >
+                                Other research results</a></li>
+                            </ul>
+                          </div>
+                      </li>
+                  </ul>
+                </li>
+
+            </ul>
+
+          </div>
+        </div>
+    </div>
+</div>
+</div>
+</div>
+</div>
diff --git a/landingPages/software/software.component.ts b/landingPages/software/software.component.ts
new file mode 100644
index 00000000..9e2456b3
--- /dev/null
+++ b/landingPages/software/software.component.ts
@@ -0,0 +1,172 @@
+import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {SoftwareService} from './software.service';
+import {SoftwareInfo} from '../../utils/entities/softwareInfo';
+import {ActivatedRoute, Router} from '@angular/router';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties'
+import {RouterHelper} from '../../utils/routerHelper.class';
+import { Meta} from '../../../angular2-meta';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'software',
+    templateUrl: 'software.component.html',
+})
+
+export class SoftwareComponent {
+    public softwareInfo: SoftwareInfo;
+    public softwareId : string ;
+
+    // APP BOX variables
+    public showAllCollectedFrom: boolean = false;
+    public showAllDownloadFrom: boolean = false;
+    public showAllPublishedIn: boolean = false;
+
+    // Metrics tab variables
+    public metricsClicked: boolean;
+    public viewsFrameUrl: string;
+    public downloadsFrameUrl: string;
+    public totalViews: number;
+    public totalDownloads: number;
+    public pageViews: number;
+
+    // Active tab variable for responsiveness
+    public activeTab: string = "Related Research Results";
+
+    // Map counting variable
+    public relatedResearchResultsNum: number = 0;
+
+    // Message variables
+    public warningMessage = "";
+    public errorMessage = "";
+    public showLoading: boolean = true;
+
+    public routerHelper:RouterHelper = new RouterHelper();
+
+    private result ;
+    sub: any; piwiksub: any; infoSub: any;
+
+    constructor (private element: ElementRef,
+                 private _softwareService: SoftwareService,
+                 private _piwikService:PiwikService,
+                 private  route: ActivatedRoute,
+                 private _meta: Meta,
+                 private _router: Router) {
+                   this.updateUrl(OpenaireProperties.getBaseLink()+this._router.url);
+    }
+
+    ngOnInit() {
+      this.sub =  this.route.queryParams.subscribe(params => {
+          this.softwareInfo = null;
+          this.updateTitle("Software");
+          this.updateDescription("Software, search, open access");
+
+            this.softwareId = params['softwareId'];
+             console.info("Id is :"+this.softwareId);
+
+             if(this.softwareId){
+                this.getSoftwareInfo(this.softwareId);
+            }else{
+              this.showLoading = false;
+                this.warningMessage="No valid software id";
+            }
+
+            this.metricsClicked = false;
+
+            this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoViews", "resTitle":"'+this.softwareId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+            /*this.viewsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resViewsTimeline", "resTitle":"'+this.softwareId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly views"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(124, 181, 236, 1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+            */
+
+            this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoDownloads", "resTitle":"'+this.softwareId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
+            /*this.downloadsFrameUrl = OpenaireProperties.getFramesAPIURL()+'merge.php?com=query&data=[{"query":"resRepoDownloadTimeline", "resTitle":"'+this.softwareId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true';
+            */
+            if (typeof document !== 'undefined') {
+               this.element.nativeElement.scrollIntoView();
+            }
+        });
+
+    }
+
+    ngOnDestroy() {
+      this.sub.unsubscribe();
+      if(this.piwiksub){
+        this.piwiksub.unsubscribe();
+      }
+      if(this.infoSub) {
+        this.infoSub.unsubscribe();
+      }
+    }
+
+    private getSoftwareInfo(id:string) {
+        this.warningMessage = '';
+        this.errorMessage=""
+        this.showLoading = true;
+
+        this.infoSub = this._softwareService.getSoftwareInfo(id).subscribe(
+            data => {
+                this.softwareInfo = data;
+                this.updateTitle(this.softwareInfo.title.name);
+                this.updateDescription("Software, search, repositories, open access,"+this.softwareInfo.title.name);
+                if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                  this.piwiksub = this._piwikService.trackView(this.softwareInfo.title.name).subscribe();
+                }
+
+                this.result = []
+                this.result = {id: id, type :"software", source : "openaire", title: this.softwareInfo.title,url: '', result: '', accessRights: this.softwareInfo.title.accessMode, embargoEndDate: ''};
+
+                let relatedResearchResultsNum = 0;
+                if(this.softwareInfo.relatedResearchResults != undefined) {
+                    this.softwareInfo.relatedResearchResults.forEach(function (value, key, map) {
+                        relatedResearchResultsNum += value.length;
+                    });
+                }
+                this.relatedResearchResultsNum = relatedResearchResultsNum;
+
+                this.showLoading = false;
+            },
+            err => {
+                console.log(err)
+                console.info("error");
+
+                this.errorMessage = 'No software found';
+                this.showLoading = false;
+            }
+        );
+    }
+
+    // showChange($event) {
+    //     this.showAllReferences=$event.value;
+    // }
+
+    public metricsResults($event) {
+      this.totalViews = $event.totalViews;
+      this.totalDownloads = $event.totalDownloads;
+      this.pageViews = $event.pageViews;
+    }
+
+    private updateDescription(description:string){
+      this._meta.updateMeta("description", description);
+      this._meta.updateProperty("og:description", description);
+    }
+    private updateTitle(title:string){
+      var _prefix ="OpenAIRE | ";
+      var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+      this._meta.setTitle(_title );
+      this._meta.updateProperty("og:title",_title);
+    }
+    private updateUrl(url:string){
+      this._meta.updateProperty("og:url", url);
+    }
+
+    public buildCurationTooltip() {
+        let tooltipContent: string = "<div class='uk-padding-small uk-light'>";
+
+        tooltipContent += "<h4>Record in preview</h4>";
+        tooltipContent += "<p>Bibliographic record accepted by the system, but not yet processed by <br> OpenAIRE tools for information quality improvement and de-duplication</p></di>";
+
+        return tooltipContent;
+    }
+    public getKeys( map) {
+      return Array.from(map.keys());
+    }
+}
diff --git a/landingPages/software/software.module.ts b/landingPages/software/software.module.ts
new file mode 100644
index 00000000..6584f9ed
--- /dev/null
+++ b/landingPages/software/software.module.ts
@@ -0,0 +1,36 @@
+//import {MaterialModule} from '@angular/material';
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import { RouterModule } from '@angular/router';
+
+import { SoftwareService } from './software.service';
+import { SoftwareComponent } from './software.component';
+// import { SoftwareRoutingModule } from './software-routing.module';
+import { MetricsModule } from '../landing-utils/metrics.module';
+import { IFrameModule } from '../../utils/iframe.module';
+import { AltMetricsModule } from '../../utils/altmetrics.module';
+import { CiteThisModule } from '../landing-utils/citeThis/citeThis.module';
+import { PagingModule } from '../../utils/paging.module';
+
+import { ResultLandingModule } from '../landing-utils/resultLanding.module';
+import { LandingModule } from '../landing-utils/landing.module';
+import { FreeGuard } from'../../login/freeGuard.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, LandingModule,  RouterModule, CiteThisModule, PagingModule,
+    ResultLandingModule,   IFrameModule, MetricsModule, AltMetricsModule
+  ],
+  declarations: [
+    SoftwareComponent
+  ],
+  providers:[
+    SoftwareService, FreeGuard
+  ],
+  exports: [
+    SoftwareComponent
+  ]
+})
+export class SoftwareModule { }
diff --git a/landingPages/software/software.service.ts b/landingPages/software/software.service.ts
new file mode 100644
index 00000000..c0fc5806
--- /dev/null
+++ b/landingPages/software/software.service.ts
@@ -0,0 +1,196 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {SoftwareInfo} from '../../utils/entities/softwareInfo';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+import { ParsingFunctions } from '../landing-utils/parsingFunctions.class';
+
+@Injectable()
+export class SoftwareService {
+
+  constructor(private http: Http ) {
+    this.parsingFunctions = new ParsingFunctions();
+  }
+
+  public parsingFunctions: ParsingFunctions;
+  softwareInfo: SoftwareInfo;
+
+  getSoftwareInfo (id: string):any {
+    console.info("getSoftwareInfo in service");
+
+    let url = OpenaireProperties. getSearchAPIURLLast()+'software/'+id+"?format=json";
+    let key = url;
+
+
+    return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .do(res => console.info(res['result']['metadata']['oaf:entity']))
+                    .map(res => [res['result']['header']['dri:status'], res['result']['metadata']['oaf:entity']['oaf:result']])
+                    .map(res => [res[1],
+                                 res[1]['title'],
+                                 res[1]['rels']['rel'],
+                                 res[1]['children'],
+                                 res[1]['pid'],
+                                 res[1]['subject'],
+                                 res[1]['bestaccessright'],
+                                 res[1]['collectedfrom'],
+                                 res[1]['context'],
+                                 //res[1]['resulttype'],
+                                 res[0],
+                                 res[1]['creator']
+                    ]).map(res => this.parseSoftwareInfo(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.log(error);
+    return Observable.throw(error  || 'Server error');
+  }
+
+  parseSoftwareInfo (data: any):any {
+    this.softwareInfo = new SoftwareInfo();
+
+    if(data[0] != null) {
+      var date:string = (data[0].dateofacceptance)+""; // transform to string in case it is an integer
+      this.softwareInfo.date  = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+      this.softwareInfo.dateofacceptance = data[0].dateofacceptance;
+      this.softwareInfo.publisher = data[0].publisher;
+      if(!Array.isArray(data[0].description)) {
+        this.softwareInfo.description = data[0].description;
+      } else {
+        this.softwareInfo.description = data[0].description[0];
+      }
+      this.softwareInfo.embargoEndDate = data[0].embargoenddate;
+    }
+    this.softwareInfo.title = {"name": "", "url": "", "accessMode": ""};
+    if(data[0]['bestaccessright'] && data[0]['bestaccessright'].hasOwnProperty("classid")) {
+      this.softwareInfo.title.accessMode = data[0]['bestaccessright'].classid;
+    }
+    if(data[1] != null) {
+      if(Array.isArray(data[1])) {
+        this.softwareInfo.title['name'] = data[1][0].content;
+      } else {
+        this.softwareInfo.title['name'] = data[1].content;
+      }
+    }
+
+    if(data[2] != null) {
+      let relation;
+      let length = data[2].length!=undefined ? data[2].length : 1;
+
+      for(let i=0; i<length; i++) {
+        relation = data[2].length!=undefined ? data[2][i] : data[2];
+        if(relation.hasOwnProperty("to")) {
+          if(relation['to'].class == "isProducedBy") {
+            this.softwareInfo.fundedByProjects = this.parsingFunctions.parseFundingByProjects(this.softwareInfo.fundedByProjects, relation, this.softwareInfo.projectsProvenanceVocabulary);
+          } else if(relation['to'].class == "isRelatedTo") {
+            let provenanceAction: string;
+            if(relation.provenanceaction in this.softwareInfo.researchResultsProvenanceVocabulary) {
+              provenanceAction = this.softwareInfo.researchResultsProvenanceVocabulary[relation.provenanceaction];
+            } else {
+              provenanceAction = "Other"
+            }
+
+            this.softwareInfo.relatedResearchResults = this.parsingFunctions.parseRelatedResearchResults(this.softwareInfo.relatedResearchResults, relation, provenanceAction);
+
+          } else if(relation['to'].class == "hasAmongTopNSimilarDocuments") {
+            this.softwareInfo.similarResearchResults = this.parsingFunctions.parseSimilarResearchResults(this.softwareInfo.similarResearchResults, relation);
+          }
+        }
+      }
+    }
+
+    if(data[3] != null) {
+      if(data[3].hasOwnProperty("instance")) {
+        this.softwareInfo.hostedBy_collectedFrom = new Array<{  "downloadName": string, "downloadUrl": string[],
+                                                                "collectedName": string, "collectedId": string,
+                                                                "accessMode": string[], "bestAccessMode": string,
+                                                                "type": string, "year":string}>();
+
+        this.softwareInfo.types = new Array<string>();
+        let types = new Set<string>();
+
+        let counter = 0;
+        let instance;
+
+        let length = data[3]['instance'].length!=undefined ? data[3]['instance'].length : 1;
+
+        for(let i=0; i<length; i++) {
+          instance = data[3]['instance'].length!=undefined ? data[3]['instance'][i] : data[3]['instance'];
+
+          this.parsingFunctions.parseTypes(this.softwareInfo.types, types, instance);
+
+          if(instance.hasOwnProperty("webresource")) {
+            let url;
+            if(instance['webresource'].length == undefined) {
+              url = instance['webresource'].url;
+            } else{
+              url = instance['webresource'][0].url;
+            }
+
+            if(instance.hasOwnProperty("hostedby")) {
+              counter = this.parsingFunctions.parseHostedBy_collectedFrom(this.softwareInfo.hostedBy_collectedFrom, instance, data[0], url, counter, this.softwareInfo.title);
+            }
+          }
+        }
+      }
+    }
+
+    if(data[4] != null) {
+      this.softwareInfo.identifiers = this.parsingFunctions.parseIdentifiers(data[4]);
+    }
+
+    if(data[5] != null) {
+      let subjectResults: [string[], Map<string, string[]>, Map<string, string[]>] = this.parsingFunctions.parseAllSubjects(data[5]);
+      this.softwareInfo.subjects = subjectResults[0];
+      this.softwareInfo.otherSubjects = subjectResults[1];
+      this.softwareInfo.classifiedSubjects = subjectResults[2];
+    }
+
+    // null argument is for journal
+    this.softwareInfo.hostedBy_collectedFrom = this.parsingFunctions.addPublisherToHostedBy_collectedFrom(
+                this.softwareInfo.hostedBy_collectedFrom, this.softwareInfo.publisher,
+                null, this.softwareInfo.identifiers, this.softwareInfo.title);
+
+    if(data[8] != null) {
+      this.softwareInfo.contexts = this.parsingFunctions.parseContexts(data[8]);
+    }
+
+    // if(data[9] != null && this.softwareInfo.type == undefined) {
+    //   if(data[9].hasOwnProperty('classname')) {
+    //     this.softwareInfo.type = data[9].classname;
+    //   }
+    // }
+
+    if(data[9] != null && data[9] == "under curation") {
+      this.softwareInfo.underCurationMessage = true;
+    } else {
+      this.softwareInfo.underCurationMessage = false;
+    }
+
+    if(data[10] != null) {
+      if(this.softwareInfo.authors == undefined) {
+        this.softwareInfo.authors = new Array<string>();
+      }
+
+      let authors = data[10];
+      let length = Array.isArray(authors) ? authors.length : 1;
+
+      for(let i=0; i<length; i++) {
+        let author = Array.isArray(authors) ? authors[i] : authors;
+        this.softwareInfo.authors[author.rank-1] = author.content;
+      }
+
+      this.softwareInfo.authors = this.softwareInfo.authors.filter(function (item) {
+        return (item != undefined);
+      });
+    }
+
+    return this.softwareInfo;
+  }
+}
diff --git a/login/adminLoginGuard.guard.ts b/login/adminLoginGuard.guard.ts
new file mode 100644
index 00000000..c35d8eb0
--- /dev/null
+++ b/login/adminLoginGuard.guard.ts
@@ -0,0 +1,45 @@
+import { Injectable } from '@angular/core';
+import { Router,CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from '@angular/router';
+import {Observable}       from 'rxjs/Observable';
+import {Session} from './utils/helper.class';
+import {ErrorCodes} from './utils/guardHelper.class';
+@Injectable()
+export class AdminLoginGuard implements CanActivate {
+
+  constructor(private router: Router) {}
+
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
+    var user;
+    var loggedIn = false;
+    var isAdmin = false;
+    var errorCode = ErrorCodes.NOT_LOGGIN;
+
+    if(Session.isLoggedIn()){
+      loggedIn = true;
+      if(!Session.isValidAndRemove()){
+        loggedIn = false;
+        errorCode = ErrorCodes.NOT_VALID;
+      }else {
+        isAdmin = Session.isAdminUser();
+        if(!isAdmin){
+          errorCode = ErrorCodes.NOT_ADMIN;
+        }
+      }
+    }else{
+      errorCode =ErrorCodes.NOT_LOGGIN;
+    }
+
+    if(!loggedIn){
+      // this.guardHelper.redirect("/user-info",errorCode,state.url);
+      this.router.navigate(['/user-info'], { queryParams: { "errorCode": errorCode, "redirectUrl":  state.url } });
+
+      return false;
+    }else if(!isAdmin){
+        // this.guardHelper.redirect("/user-info",errorCode,state.url);
+        this.router.navigate(['/user-info'], { queryParams: { "errorCode": errorCode, "redirectUrl":  state.url } });
+        return false;
+      }else{
+      return true;
+    }
+  }
+}
diff --git a/login/freeGuard.guard.ts b/login/freeGuard.guard.ts
new file mode 100644
index 00000000..316ff266
--- /dev/null
+++ b/login/freeGuard.guard.ts
@@ -0,0 +1,36 @@
+import { Injectable } from '@angular/core';
+import { Router,CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from '@angular/router';
+import {Observable}       from 'rxjs/Observable';
+import {Session} from './utils/helper.class';
+import {ErrorCodes} from './utils/guardHelper.class';
+
+@Injectable()
+export class FreeGuard implements CanActivate {
+
+  constructor(private router: Router) {}
+
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
+    var user;
+    var valid = true;
+    var loggedIn = false;
+     var errorCode = ErrorCodes.NOT_LOGGIN;
+
+    if(Session.isLoggedIn()){
+      loggedIn = true;
+      if(!Session.isValidAndRemove()){
+        loggedIn = false;
+        valid = false;
+        errorCode = ErrorCodes.NOT_VALID;
+      }
+    }
+
+    if(!valid){
+      // this.guardHelper.redirect("/user-info",errorCode,state.url);
+
+      this.router.navigate(['/user-info'], { queryParams: { "errorCode": errorCode, "redirectUrl":  state.url } });
+      return false;
+    }
+    return true;
+
+  }
+}
diff --git a/login/loginGuard.guard.ts b/login/loginGuard.guard.ts
new file mode 100644
index 00000000..59999519
--- /dev/null
+++ b/login/loginGuard.guard.ts
@@ -0,0 +1,33 @@
+import { Injectable } from '@angular/core';
+import { Router,CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from '@angular/router';
+import {Observable}       from 'rxjs/Observable';
+import {Session} from './utils/helper.class';
+import {ErrorCodes} from './utils/guardHelper.class';
+
+@Injectable()
+export class LoginGuard implements CanActivate {
+
+  constructor(private router: Router) {}
+
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
+    var user;
+    var loggedIn = false;
+    var errorCode = ErrorCodes.NOT_LOGGIN;
+    if(Session.isLoggedIn()){
+      loggedIn = true;
+      if(!Session.isValidAndRemove()){
+        loggedIn = false;
+        errorCode = ErrorCodes.NOT_VALID;
+      }
+    }else{
+      errorCode = ErrorCodes.NOT_LOGGIN;
+    }
+    if(!loggedIn){
+      // this.guardHelper.redirect("/user-info",errorCode,state.url);
+      this.router.navigate(['/user-info'], { queryParams: { "errorCode": errorCode, "redirectUrl":  state.url } });
+      return false;
+    }else{
+      return true;
+    }
+  }
+}
diff --git a/login/user-routing.module.ts b/login/user-routing.module.ts
new file mode 100644
index 00000000..6bbadb82
--- /dev/null
+++ b/login/user-routing.module.ts
@@ -0,0 +1,15 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import { UserComponent } from './user.component';
+import {PreviousRouteRecorder} from '../utils/piwik/previousRouteRecorder.guard';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      { path: '', component: UserComponent, canDeactivate: [PreviousRouteRecorder]},
+
+    ])
+  ]
+})
+export class UserRoutingModule { }
diff --git a/login/user.component.html b/login/user.component.html
new file mode 100644
index 00000000..5f1a52bb
--- /dev/null
+++ b/login/user.component.html
@@ -0,0 +1,54 @@
+
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+
+<div *ngIf="!server" class="uk-margin-top uk-container uk-container-small uk-position-relative">
+
+
+<!--form *ngIf="!loggedIn" class=" ">
+
+        <h3>Welcome to OpenAIRE's Discover Portal</h3>
+
+           <p>This service uses the same ldap sign-in  as the OpenAIRE services so you can use the same
+               credentials.</p>
+
+           <p>Login in. To see it in action.</p>
+        <div class="uk-margin">
+         <input class="uk-input uk-form-width-medium" placeholder="Username" type="text" name="username" [(ngModel)]="username">
+      </div>
+
+      <div class="uk-margin">
+         <input placeholder="Password" class="uk-input uk-form-width-medium" type="password" name="password" [(ngModel)]="password">
+      </div>
+      <div class="uk-margin">
+         <button (click)="login()" class=" uk-button uk-button-primary">Login</button>
+      </div>
+ </form-->
+ <div *ngIf="errorCode == '1'" class="uk-alert uk-alert-warning">
+  The requested page requires authentication. Please sign in.
+  <span  *ngIf="!loggedIn">
+      <a  class="loginLink"  (click)="logIn()"  >Sign in</a>
+   </span>
+</div>
+<div *ngIf="errorCode == '2'" class="uk-alert uk-alert-warning">
+  You are not authorized to use the requested page
+</div>
+<div *ngIf="errorCode == '3'" class="uk-alert uk-alert-warning">
+  The session has expired. Please sign in again or continue <a (click)="redirect();">browsing as a guest</a>.
+  <span  *ngIf="!loggedIn">
+      <a  class="loginLink"   [href]="loginUrl"   >Sign in</a>
+   </span>
+</div>
+<div *ngIf="!loggedIn && errorMessage.length > 0" class="uk-alert uk-alert-danger">{{errorMessage}}</div>
+
+<div *ngIf="loggedIn">
+    <div  class="uk-alert uk-alert-success">
+    Hello {{user.fullname}}!
+    </div>
+    <!-- <button (click)="logout()" class=" uk-button uk-button-default">Log out</button> -->
+</div>
+</div>
+</div>
+</div>
+</div>
diff --git a/login/user.component.ts b/login/user.component.ts
new file mode 100644
index 00000000..076c2cd2
--- /dev/null
+++ b/login/user.component.ts
@@ -0,0 +1,144 @@
+import {Component, ElementRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+
+// import {LoginService} from './login.service';
+import {User,Session} from './utils/helper.class';
+import {RouterHelper} from '../utils/routerHelper.class';
+import { Meta} from '../../angular2-meta';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'user',
+    templateUrl: 'user.component.html'
+  })
+
+export class UserComponent {
+    public user: User;
+    public loggedIn: boolean = false;
+    public server: boolean = true;
+    public errorMessage: string;
+    public username: string = "";
+    public password: string = "";
+    private sub:any;private sublogin:any;
+    public errorCode: string = "";
+    public redirectUrl: string = "";
+    public routerHelper:RouterHelper = new RouterHelper();
+    public loginUrl= OpenaireProperties.getLoginURL();
+
+    constructor( private router: Router,
+                 private  route: ActivatedRoute, private _meta: Meta) {
+      this._meta.setTitle("OpenAIRE | Login");
+    }
+
+    ngOnInit() {
+      if( typeof document !== 'undefined') {
+        this.server = false;
+      }
+      this.loggedIn = Session.isLoggedIn();
+      this.user = Session.getUser();
+      this.errorMessage = "";
+      this.sub =  this.route.queryParams.subscribe(params => {
+        this.errorCode = params["errorCode"];
+        this.redirectUrl = params["redirectUrl"];
+        this.loggedIn = Session.isLoggedIn();
+        this.user = Session.getUser();
+        this.errorMessage = "";
+        if(this.loggedIn){
+          this.redirect();
+        }
+      });
+    }
+    ngOnDestroy(){
+      this.sub.unsubscribe();
+      if(this.sublogin){
+        this.sublogin.unsubscribe();
+      }
+    }
+    // logout(){
+    //     if(Session.isLoggedIn()){
+    //       Session.removeUser();
+    //     }
+    //     this.loggedIn = false;
+    //     this.user = new User();
+    //     this.username = "";
+    //     this.password = "";
+    //     this.redirect();
+    //
+    // }
+    redirect(){
+      if(this.redirectUrl && this.redirectUrl != null && this.redirectUrl != ""){
+        this.redirectUrl = decodeURIComponent(this.redirectUrl);
+        var baseUrl = this.redirectUrl;
+        var queryParams = "";
+        var paramsArray =[];
+        var valuesArray =[];
+        if(this.redirectUrl.indexOf('?') != -1){
+          baseUrl = this.redirectUrl.split('?')[0];
+          queryParams =  this.redirectUrl.split('?')[1];
+        }
+        if(queryParams != ""){
+          var queryParamsArray = queryParams.split('&');
+          for(var i = 0; i < queryParamsArray.length; i++){
+            paramsArray.push(queryParamsArray[i].split("=")[0]);
+            valuesArray.push(queryParamsArray[i].split("=")[1]);
+          }
+          this.router.navigate([baseUrl], { queryParams: this.routerHelper.createQueryParams(paramsArray,valuesArray)});
+        }else{
+          this.router.navigate([baseUrl]);
+        }
+      }else{
+        this.router.navigate(['/']);
+      }
+    }
+    logIn(){
+      if(this.redirectUrl && this.redirectUrl != null && this.redirectUrl != ""){
+        this.redirectUrl = decodeURIComponent(this.redirectUrl);
+        var baseUrl = this.redirectUrl;
+        var queryParams = "";
+        var paramsArray =[];
+        var valuesArray =[];
+        if(this.redirectUrl.indexOf('?') != -1){
+          var splits =this.redirectUrl.split('?');
+          if(splits.length>0){
+            baseUrl = splits[0];
+          }
+          if(splits.length >1){
+            queryParams =  splits[1];
+          }
+        }
+        console.log("saving url & params...");
+        console.log(queryParams);
+        Session.setCurrentUrl(baseUrl);
+        Session.setCurrentParameters(queryParams);
+      }
+
+      window.location.href = OpenaireProperties.getLoginURL();
+    }
+
+    // login() {
+    //     this.sublogin =this._loginService.authenticate(/*this.user*/this.username, this.password).subscribe(
+    //         data => {
+    //             this.user = data;
+    //             this.loggedIn = true;
+    //             this.username = "";
+    //             this.password = "";
+    //             this.errorCode = "";
+    //             this.redirect();
+    //
+    //         },
+    //         err => {
+    //           console.log(err);
+    //           if(err.status == "404") {
+    //               this.errorMessage = "Wrong username";
+    //           } else if(err.status == "401") {
+    //               this.errorMessage = "Wrong password";
+    //           }
+    //           this.username = "";
+    //           this.password = "";
+    //           this.errorCode = "";
+    //
+    //         }
+    //     );
+    // }
+}
diff --git a/login/user.module.ts b/login/user.module.ts
new file mode 100644
index 00000000..676d3fd3
--- /dev/null
+++ b/login/user.module.ts
@@ -0,0 +1,24 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {UserComponent } from './user.component';
+import { UserRoutingModule } from './user-routing.module';
+import {PreviousRouteRecorder} from '../utils/piwik/previousRouteRecorder.guard';
+import {FreeGuard} from './freeGuard.guard';
+import {LoginGuard} from './loginGuard.guard';
+import {MetaModule} from '../../meta.module';
+
+// import {LoginService} from './login.service';
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    UserRoutingModule, MetaModule
+
+  ],
+  providers:[PreviousRouteRecorder, FreeGuard,LoginGuard ],
+  declarations: [
+    UserComponent
+], exports:[UserComponent]
+})
+export class UserModule { }
diff --git a/login/userMini.component.ts b/login/userMini.component.ts
new file mode 100644
index 00000000..f667c138
--- /dev/null
+++ b/login/userMini.component.ts
@@ -0,0 +1,147 @@
+import {Component, ElementRef, Input} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {Location} from '@angular/common';
+// import {LoginService} from './login.service';
+import {User,Session} from './utils/helper.class';
+import {RouterHelper} from '../utils/routerHelper.class';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {StringUtils} from '../utils/string-utils.class';
+import {LogoutOpenaireService} from './utils/logoutOpenaire.service';
+declare var logoutClicked;
+@Component({
+    selector: 'user-mini',
+    template: `
+<ul *ngIf="!mobileView"  class="uk-navbar-nav">
+   <li class="uk-parent">
+
+  <a   *ngIf="loggedIn" >
+       <span>{{user.fullname+" "}} <span class="uk-margin-small-right uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9.9" cy="6.4" r="4.4"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M1.5,19 C2.3,14.5 5.8,11.2 10,11.2 C14.2,11.2 17.7,14.6 18.5,19.2"></path></svg></span></span>
+     </a>
+         <a  *ngIf="!loggedIn" class="loginLink" (click)="logIn()" >Sign in | Register <span class="uk-margin-small-right uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9.9" cy="6.4" r="4.4"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M1.5,19 C2.3,14.5 5.8,11.2 10,11.2 C14.2,11.2 17.7,14.6 18.5,19.2"></path></svg> </span>
+       </a>
+
+
+  <div *ngIf="loggedIn" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left"   id="userMenu" (click)="onClick('userMenu')"  >
+     <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
+        <div class="uk-first-column">
+           <ul class="uk-nav uk-navbar-dropdown-nav">
+             <li><a href="" >My profile</a></li>
+             <li><a   routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
+             <li *ngIf="isAuthorized"><a   routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
+              <li><a (click)="logOut()" id="logout" >Log out</a></li>
+           </ul>
+        </div>
+        <div id="logout1"></div>
+     </div>
+  </div>   </li>
+  </ul>
+
+<li *ngIf="mobileView" class="uk-nav-header uk-parent " >
+
+    <span  *ngIf="loggedIn" >
+      <span>{{user.fullname+" "}}<span class="uk-margin-small-right uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9.9" cy="6.4" r="4.4"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M1.5,19 C2.3,14.5 5.8,11.2 10,11.2 C14.2,11.2 17.7,14.6 18.5,19.2"></path></svg></span></span>
+    </span>
+    <span  *ngIf="!loggedIn">
+        <a  class="loginLink" (click)="logIn()" >Sign in | Register <span class="uk-margin-small-right uk-icon" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9.9" cy="6.4" r="4.4"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M1.5,19 C2.3,14.5 5.8,11.2 10,11.2 C14.2,11.2 17.7,14.6 18.5,19.2"></path></svg></span>
+        </a>
+   </span>
+
+  <ul *ngIf="loggedIn" class="uk-nav-sub">
+  <li><a href="" >My profile</a></li>
+  <li><a   routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
+  <li *ngIf="isAuthorized"><a   routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
+  <li><a (click)="logOut()" id="logout" >Log out</a></li>
+ </ul>
+</li>
+<div id="logout2"></div>
+    `
+})
+
+export class UserMiniComponent {
+    public user: User;
+    public loggedIn: boolean = false;
+    public isAuthorized: boolean = false;
+    @Input() public mobileView:boolean = false ;
+    public server: boolean = true;
+    public routerHelper:RouterHelper = new RouterHelper();
+
+    public redirectUrl: string = "";
+    private baseUrl = "user-info";
+    sub:any;
+    constructor( private router: Router, private  route: ActivatedRoute, private location: Location, private logoutOpenaire: LogoutOpenaireService) {}
+
+    ngOnInit() {
+      if( typeof document !== 'undefined') {
+        this.server = false;
+      }
+      this.initialize();
+      this.sub =  this.route.queryParams.subscribe(params => {
+        this.initialize();
+      });
+    }
+    ngOnDestroy(){
+      this.sub.unsubscribe();
+    }
+    initialize(){
+      this.redirectUrl = this.location.path();
+      if(Session.isLoggedIn()){
+        if(Session.isUserValid()){
+          this.loggedIn = Session.isLoggedIn();
+          this.user = Session.getUser();
+          if(Session.isAdminUser()){
+           this.isAuthorized = true;
+           }else {
+                 this.isAuthorized = false;
+           }
+
+        }else{
+          Session.removeUser();
+            this.loggedIn = false;
+             this.isAuthorized = false;
+            this.user = null;
+        }
+      }else {
+            this.loggedIn = false;
+             this.isAuthorized = false;
+            this.user = null;
+      }
+
+    }
+    gotoUserPage(){
+      this.redirectUrl = this.location.path();
+      if(this.redirectUrl && this.redirectUrl != null && this.redirectUrl != "" && this.redirectUrl !="user-info"){
+          this.router.navigate([this.baseUrl], { queryParams: this.routerHelper.createQueryParam("redirectUrl",this.redirectUrl )});
+      }else{
+        this.router.navigate([this.baseUrl]);
+      }
+    }
+    logOut(){
+      if(Session.isLoggedIn()){
+        Session.removeUser();
+        // console.log("Try to Logout!");
+        // this.logoutOpenaire.logout().subscribe(params => {
+        //   console.log("Logout!");
+        // });
+        logoutClicked();
+        console.log("Redirect to "+location.href);
+        window.location.href = OpenaireProperties.getLogoutURL()+ StringUtils.URIEncode(location.href);
+
+      }
+      this.loggedIn = false;
+       this.isAuthorized = false;
+      this.user = new User();
+    }
+
+    logIn(){
+      Session.setCurrentUrl(location.pathname);
+      Session.setCurrentParameters(location.search);
+      window.location.href = OpenaireProperties.getLoginURL();
+    }
+
+    onClick(id: string) {
+          var el: HTMLElement = document.getElementById(id);
+          el.classList.remove('uk-open');
+      }
+
+}
diff --git a/login/utils/guardHelper.class.ts b/login/utils/guardHelper.class.ts
new file mode 100644
index 00000000..2bee44e6
--- /dev/null
+++ b/login/utils/guardHelper.class.ts
@@ -0,0 +1,19 @@
+
+import { Router} from '@angular/router';
+
+// export class GuardHelper{
+//   constructor(private router: Router) {}
+//
+//   redirect(url:string, errorCode:number, redirectUrl:string){
+//       this.router.navigate([url], { queryParams: { "errorCode": errorCode, "redirectUrl":  redirectUrl } });
+//
+//   }
+//
+// }
+export class ErrorCodes {
+   public static NOT_LOGGIN:number =1;
+   public static NOT_ADMIN:number =2;
+   public static NOT_VALID:number =3;
+
+}
+ 
diff --git a/login/utils/helper.class.ts b/login/utils/helper.class.ts
new file mode 100644
index 00000000..0a62a995
--- /dev/null
+++ b/login/utils/helper.class.ts
@@ -0,0 +1,276 @@
+import {StringUtils} from '../../utils/string-utils.class';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+
+export class User {
+    email:string;
+    firstname: string;
+    lastname: string;
+    id: string;
+    fullname: string;
+    expirationDate: number;
+    role:string[];
+    jwt:string;
+
+}
+
+export class Session{
+  // public static setUser(user:User): User {
+  //
+  //     localStorage.setItem("user", JSON.stringify(user));
+  //
+  //     return user;
+  // }
+  public static removeUser() {
+    if(Session.isLoggedIn()){
+        localStorage.removeItem("user");
+        COOKIE.deleteCookie(COOKIE.cookieName_id)
+        COOKIE.deleteCookie(COOKIE.cookieName_u);
+    }
+  }
+  public static getUser():User {
+    if(Session.isLoggedIn()){
+        return JSON.parse(localStorage.getItem("user"));
+    }else{
+      return null;
+    }
+  }
+  public static isLoggedIn(): boolean {
+      var loggedIn:boolean = false;
+      var user:User = null;
+      var cookie= COOKIE.getCookie(COOKIE.cookieName_u);
+    if( typeof localStorage !== 'undefined') {
+        if(localStorage.getItem("user")) {
+          user = JSON.parse(localStorage.getItem("user"));
+            if(user && (user.fullname != null || user.lastname !=null || user.firstname !=null)){
+
+              loggedIn = true;
+            }else if(cookie != null && this.getUserFromCookie()!= null){
+               loggedIn = true
+            }else{
+              loggedIn = false;
+            }
+          }else{
+            if(cookie != null && this.getUserFromCookie()!= null){
+               loggedIn = true
+            }else{
+              loggedIn = false;
+            }
+
+          }
+      }else{
+        loggedIn = false;
+      }
+      return loggedIn;
+  }
+  public static getUserFromCookie():User{
+    var cookie= COOKIE.getCookie(COOKIE.cookieName_u);
+    if(cookie != null){
+      var user:User = MyJWT.parseUserInfo(cookie);
+       if( typeof localStorage !== 'undefined') {
+         localStorage.setItem("user", JSON.stringify(user));
+         if(user && user.email){
+           COOKIE.deleteCookie(COOKIE.cookieName_u); // delete cookie to avoid transfer through requests
+           return user;
+         }else{
+           return null;
+         }
+       }else{
+         return null;
+       }
+    }else{
+      return null;
+    }
+  }
+  public static getUserJwt():string {
+      if(Session.isLoggedIn()){
+          return Session.getUser().jwt;
+      }else{
+        return null;
+      }
+
+  }
+  public static getUserEmail():string {
+      if(Session.isLoggedIn()){
+          return Session.getUser().email;
+      }else{
+        return null;
+      }
+
+  }
+  public static getCurrentUrl():string {
+    if( typeof localStorage !== 'undefined') {
+        return localStorage.getItem("url");
+    }
+    return "";
+
+    }
+  public static setCurrentUrl(url:string) {
+        if( typeof localStorage !== 'undefined') {
+          localStorage.setItem("url", url);
+        }
+  }
+  public static getCurrentParameters():any {
+    if( typeof localStorage !== 'undefined') {
+      var params = localStorage.getItem("params");
+      console.log(params);
+      var object = null;
+      if(params.split("&").length > 0){
+        object = {};
+      }
+      for(var i=0; i<params.split("&").length; i++){
+        console.log(params.split("&")[i]);
+        console.log((params.split("&")[i]).split("=")[0]);
+        console.log((params.split("&")[i]).split("=")[1]);
+        object[(params.split("&")[i]).split("=")[0]] = (params.split("&")[i]).split("=")[1];
+      }
+      return object;
+    }
+    return {};
+  }
+  public static setCurrentParameters(params:string) {
+    if( typeof localStorage !== 'undefined') {
+          if(params.indexOf("?")==0){
+            params = params.substring(1);
+          }
+         localStorage.setItem("params",(params && params.length > 1)? params:"");
+       }
+  }
+  public static isAdminUser():boolean {
+      var isAdmin = false;
+      if(Session.isLoggedIn()){
+        var claimRoles = ["urn:mace:openminted.eu:aai.openminted.eu:group:OpenAIRE+Curator+-+Claim","urn:mace:openminted.eu:aai.openminted.eu:group:OpenAIRE+Portal+Administrator"]
+        for (var i = 0; i < claimRoles.length; i++) {
+            if ((Session.getUser().role).indexOf(claimRoles[i]) > -1) {
+                isAdmin = true;
+                break;
+            }
+        }
+          // console.log("Is admin:"+ isAdmin)
+          return (isAdmin);
+      }
+      // console.log("Is admin:"+ isAdmin)
+      return (isAdmin);
+  }
+  public static isRegisteredUser():boolean {
+      var isRegisteredUser = false;
+      if(Session.isLoggedIn()){
+        var claimRoles = ["urn:mace:openminted.eu:aai.openminted.eu:group:Registered+User"];
+        for (var i = 0; i < claimRoles.length; i++) {
+            if ((Session.getUser().role).indexOf(claimRoles[i]) > -1) {
+                isRegisteredUser = true;
+                break;
+            }
+        }
+          // console.log("Is isRegisteredUser:"+ isRegisteredUser)
+          return (isRegisteredUser);
+      }
+      // console.log("Is isRegisteredUser:"+ isRegisteredUser)
+      return (isRegisteredUser);
+  }
+  public static isUserValid() {
+    if(Session.isLoggedIn()){
+        var expires = Session.getUser().expirationDate;
+        var now = new Date().getTime() / 1000;
+        // console.log(" is still valid ? "+(now +0 < expires)  +" Remaining:"+ (expires - (now+0))+ " now is:"+now + "expires at:"+expires);
+        return now +0 < expires;
+    }
+    return false;
+  }
+  public static isValidAndRemove() {
+    if(Session.isLoggedIn()){
+        if(!Session.isUserValid()){
+          Session.removeUser();
+          return false;
+        }else{
+          return true;
+        }
+    }else{
+      return false;
+    }
+  }
+
+}
+export  class MyJWT{
+  private static validateJWTFormat(data){
+    if(data != null && (data.indexOf(".") !=-1 && data.split('.').length == 3)){
+      return true;
+    }
+    return false;
+  }
+  private static getPayload(data){
+    var payload = data.split('.')[1];
+    return StringUtils.b64DecodeUnicode(payload);
+  }
+  public static parseUserInfo(data: any): User {
+      if(this.validateJWTFormat(data)){
+        var info = JSON.parse(this.getPayload(data));
+      }else{
+        return null;
+      }
+      var user: User = new User();
+
+      user.firstname = (StringUtils.URIDecode((info.firstname && info.firstname!="")?info.firstname:"")).replace("+"," ");
+      user.lastname = (StringUtils.URIDecode((info.lastname && info.lastname!="")?info.lastname:"")).replace("+"," ");
+      user.email = info.email;
+      // user.id = info.userId;
+      user.fullname = (StringUtils.URIDecode((info.fullname && info.fullname!="")?info.fullname:"")).replace("+"," ");
+      if(user.fullname == ""){
+        if(user.firstname != ""){
+          user.fullname += user.firstname;
+        }
+        if(user.lastname !=""){
+          user.fullname += user.lastname;
+        }
+        if(user.fullname == ""){ //it is still empty set a default
+          user.fullname = "Anonymous user";
+        }
+      }
+      if(info.role && info.role != ""){
+        user.role =JSON.parse( StringUtils.URIDecode(info.role));
+      }else{
+        user.role =[];
+      }
+
+      // console.log("User Role is:");
+      // console.log(user.role)
+      user.jwt = data;
+      user.expirationDate = info.exp;
+      localStorage.setItem("user", JSON.stringify(user));
+      console.log(user)
+      return user;
+  }
+
+}
+  export class COOKIE{
+    public static cookieName_u:string="XCsrfToken";
+    public static cookieName_id:string="AccessToken";
+
+    public static  getCookie(name: string) : string {
+      if(typeof document == 'undefined'){
+        return null;
+      }
+      let ca: Array<string> = document.cookie.split(';');
+      let caLen: number = ca.length;
+      let cookieName = `${name}=`;
+      let c: string;
+
+      for (let i: number = 0; i < caLen; i += 1) {
+          c = ca[i].replace(/^\s+/g, '');
+          if (c.indexOf(cookieName) == 0) {
+              return c.substring(cookieName.length, c.length);
+          }
+      }
+      return null;
+  }
+  public static deleteCookie(name) {
+      this.setCookie(name, '', -1);
+  }
+  public static setCookie(name: string, value: string, expireDays: number, path: string = '/') {
+      let d:Date = new Date();
+      d.setTime(d.getTime() + expireDays * 24 * 60 * 60 * 1000);
+      let expires:string = `expires=${d.toUTCString()}`;
+      // let cpath:string = path ? `; path=${path}` : '';
+      document.cookie = name+'='+value+'; path='+path+'; domain='+OpenaireProperties.getCookieDomain()+';';
+  }
+}
diff --git a/login/utils/logoutOpenaire.service.ts b/login/utils/logoutOpenaire.service.ts
new file mode 100644
index 00000000..b000789f
--- /dev/null
+++ b/login/utils/logoutOpenaire.service.ts
@@ -0,0 +1,19 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+ import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import 'rxjs/add/operator/do';
+@Injectable()
+export class LogoutOpenaireService {
+
+    constructor(private http: Http ) {}
+
+    logout():any {
+        console.info("Logout openaire");
+        //let url = OpenaireProperties. getSearchAPIURLLast() + 'publications/' +id+"?format=json";
+        let url = OpenaireProperties.getLogoutOpenaireURL();
+
+        return this.http.get(url).do(request => console.info("Log out?" ));
+    }
+
+}
diff --git a/reload/reload-routing.module.ts b/reload/reload-routing.module.ts
new file mode 100644
index 00000000..f304da05
--- /dev/null
+++ b/reload/reload-routing.module.ts
@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import{ReloadComponent} from './reload.component';
+import {FreeGuard} from'../login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../utils/piwik/previousRouteRecorder.guard';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+     	{ path: '', component: ReloadComponent, canActivate: [FreeGuard], canDeactivate: [PreviousRouteRecorder] }
+
+    ])
+  ]
+})
+export class ReloadRoutingModule { }
diff --git a/reload/reload.component.ts b/reload/reload.component.ts
new file mode 100644
index 00000000..50338a48
--- /dev/null
+++ b/reload/reload.component.ts
@@ -0,0 +1,55 @@
+import {Component, Input, Output, EventEmitter, ViewChild, ElementRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {Location} from '@angular/common';
+
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {ErrorCodes} from '../utils/properties/openaireProperties';
+import {RouterHelper} from '../utils/routerHelper.class';
+import {Session} from '../login/utils/helper.class';
+
+@Component({
+    selector: 'reload',
+    template: `
+    <div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+      <div uk-grid uk-grid>
+       <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+          <div class="uk-container uk-margin-top publication">
+            Go to initial page....
+          </div>
+        </div>
+      </div>
+    </div>
+     `
+})
+export class ReloadComponent {
+
+  constructor (private element: ElementRef,
+    private route: ActivatedRoute,
+      private _router: Router,
+       private location: Location
+    ) {
+
+   }
+
+  public ngOnInit() {
+    if (typeof document !== 'undefined') {
+      this.element.nativeElement.scrollIntoView();
+    }
+        var url = Session.getCurrentUrl();
+        if(url && url != null && url != ""){
+          Session.setCurrentUrl("");
+          var paramsObject = Session.getCurrentParameters();
+          Session.setCurrentParameters("");
+          if(paramsObject &&  paramsObject != null){
+            this._router.navigate([url],{ queryParams: paramsObject});
+          }else{
+            this._router.navigate([url]);
+          }
+        }else{
+          this._router.navigate(['/']);
+
+        }
+  }
+
+}
diff --git a/reload/reload.module.ts b/reload/reload.module.ts
new file mode 100644
index 00000000..2b7e8469
--- /dev/null
+++ b/reload/reload.module.ts
@@ -0,0 +1,29 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import{ReloadRoutingModule } from './reload-routing.module';
+import{ReloadComponent} from './reload.component';
+
+
+ import {FreeGuard} from'../login/freeGuard.guard';
+import {PreviousRouteRecorder} from '../utils/piwik/previousRouteRecorder.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule,
+      ReloadRoutingModule
+
+  ],
+  declarations: [
+    ReloadComponent
+   ],
+  providers:[
+    FreeGuard, PreviousRouteRecorder
+    ],
+  exports: [
+    ReloadComponent
+     ]
+})
+export class ReloadModule { }
diff --git a/searchPages/advanced/advancedSearchDataProviders.component.ts b/searchPages/advanced/advancedSearchDataProviders.component.ts
new file mode 100644
index 00000000..6ccd0768
--- /dev/null
+++ b/searchPages/advanced/advancedSearchDataProviders.component.ts
@@ -0,0 +1,153 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router, ActivatedRoute} from '@angular/router';
+import {Filter, Value,AdvancedField} from '../searchUtils/searchHelperClasses.class';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {AdvancedSearchPageComponent} from '../searchUtils/advancedSearchPage.component';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+
+
+@Component({
+    selector: 'advanced-search-dataprovider',
+    template: `
+    <advanced-search-page pageTitle="Advanced Search for Content Providers" entityType="dataprovider"
+                 type = "content providers"
+                 [(results)] = "results"
+                 [(fieldIds)]="fieldIds" [(fieldIdsMap)]="fieldIdsMap"   [(selectedFields)]="selectedFields"
+                  [(searchUtils)] = "searchUtils"
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="resources" simpleSearchLink="/search/find/dataproviders"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults">
+    </advanced-search-page>
+
+    `
+ })
+
+export class AdvancedSearchDataProvidersComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public searchFields:SearchFields = new SearchFields();
+
+  public fieldIds:  string[] = this.searchFields.DATASOURCE_ADVANCED_FIELDS;
+  public fieldIdsMap= this.searchFields.DATASOURCE_FIELDS;
+  public selectedFields:AdvancedField[] =  [];
+
+  @ViewChild (AdvancedSearchPageComponent) searchPage : AdvancedSearchPageComponent ;
+  public resourcesQuery = "(oaftype exact datasource)";
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  constructor (private route: ActivatedRoute, private _searchDataProvidersService: SearchDataprovidersService ) {
+    this.results =[];
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.baseUrl = OpenaireProperties.searchLinkToAdvancedDataProviders;
+    console.info("Con -base url:"+this.searchUtils.baseUrl );
+
+  }
+  ngOnInit() {
+   this.sub =  this.route.queryParams.subscribe(params => {
+     if(params['page'] && this.searchUtils.page != params['page']) {
+       this.loadPaging = false;
+       this.oldTotalResults = this.searchUtils.totalResults;
+     }
+
+    let page = (params['page']=== undefined)?0:+params['page'];
+    this.searchUtils.page = ( page < 1 ) ? 1 : page;
+    this.searchPage.fieldIds = this.fieldIds;
+    this.selectedFields =[];
+    this.searchPage.selectedFields = this.selectedFields;
+    this.searchPage.fieldIdsMap = this.fieldIdsMap;
+    this.searchPage.getSelectedFiltersFromUrl(params);
+    this.getResults(this.searchPage.createQueryParameters(),  this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  public getResults(parameters:string, page: number, size: number){
+      if(parameters!= null && parameters != ''  ) {
+        this.csvParams ="&type=datasources&query=( "+this.resourcesQuery + "and (" + parameters + "))";
+      }else{
+        this.csvParams ="&type=datasources&query="+this.resourcesQuery;
+      }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+    console.info("Advanced Search for Content Providers: Execute search query "+parameters);
+     this._searchDataProvidersService.advancedSearchDataproviders(parameters,  page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("Adv Search Content Providers total="+this.searchUtils.totalResults);
+            this.results = data[1];
+            this.searchPage.updateBaseUrlWithParameters();
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+            console.info("error");
+            //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = errorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.NOT_AVAILABLE;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+        }
+    );
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    var parameters = $event.value;
+    this.getResults(parameters, this.searchUtils.page,this.searchUtils.size);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}
diff --git a/searchPages/advanced/advancedSearchDataProviders.module.ts b/searchPages/advanced/advancedSearchDataProviders.module.ts
new file mode 100644
index 00000000..333e386b
--- /dev/null
+++ b/searchPages/advanced/advancedSearchDataProviders.module.ts
@@ -0,0 +1,28 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{AdvancedSearchDataProvidersComponent} from './advancedSearchDataProviders.component';
+
+
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+ import {AdvancedSearchPageModule} from '../searchUtils/advancedSearchPage.module';
+ import {FreeGuard} from'../../login/freeGuard.guard';
+ import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DataProvidersServiceModule,
+     AdvancedSearchPageModule
+
+  ],
+  declarations: [
+    AdvancedSearchDataProvidersComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    AdvancedSearchDataProvidersComponent
+     ]
+})
+export class AdvancedSearchDataProvidersModule { }
diff --git a/searchPages/advanced/advancedSearchDatasets.component.ts b/searchPages/advanced/advancedSearchDatasets.component.ts
new file mode 100644
index 00000000..e31af8ad
--- /dev/null
+++ b/searchPages/advanced/advancedSearchDatasets.component.ts
@@ -0,0 +1,161 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router, ActivatedRoute} from '@angular/router';
+import {Filter, Value,AdvancedField} from '../searchUtils/searchHelperClasses.class';
+import {SearchDatasetsService} from '../../services/searchDatasets.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {AdvancedSearchPageComponent} from '../searchUtils/advancedSearchPage.component';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+
+@Component({
+    selector: 'advanced-search-datasets',
+    template: `
+    <advanced-search-page pageTitle="Advanced Search for Research Data" entityType="dataset"
+                 type = "research data"
+                 [(results)] = "results"
+                 [(searchUtils)] = "searchUtils"
+                 [(fieldIds)]="fieldIds" [(fieldIdsMap)]="fieldIdsMap"   [(selectedFields)]="selectedFields"
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="resources" simpleSearchLink="/search/find/datasets"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults">
+    </advanced-search-page>
+
+    `
+ })
+
+export class AdvancedSearchDatasetsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public searchFields:SearchFields = new SearchFields();
+
+  public fieldIds:  string[] = this.searchFields.RESULT_ADVANCED_FIELDS;
+  public fieldIdsMap= this.searchFields.RESULT_FIELDS;
+  public selectedFields:AdvancedField[] =  [];
+
+  @ViewChild (AdvancedSearchPageComponent) searchPage : AdvancedSearchPageComponent ;
+  public resourcesQuery = "( (oaftype exact result) and (resulttypeid exact dataset)  )";
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  constructor (private route: ActivatedRoute, private _searchDatasetsService: SearchDatasetsService ) {
+    this.results =[];
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.baseUrl = OpenaireProperties.searchLinkToAdvancedDatasets;
+
+
+
+  }
+  ngOnInit() {
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      let page = (params['page']=== undefined)?1:+params['page'];
+      this.searchUtils.page = ( page <= 0 ) ? 1 : page;
+      this.searchPage.fieldIds = this.fieldIds;
+      this.selectedFields =[];
+      this.searchPage.selectedFields = this.selectedFields;
+      this.searchPage.fieldIdsMap = this.fieldIdsMap;
+      this.searchPage.getSelectedFiltersFromUrl(params);
+      this.getResults(this.searchPage.createQueryParameters(),  this.searchUtils.page, this.searchUtils.size);
+
+    });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  public getResults(parameters:string, page: number, size: number){
+      if(parameters!= null && parameters != ''  ) {
+        this.csvParams ="&type=datasets&query=( "+this.resourcesQuery + "and (" + parameters + "))";
+      }else{
+        this.csvParams ="&type=datasets&query="+this.resourcesQuery;
+      }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+    console.info("Advanced Search for Research Data: Execute search query "+parameters);
+     this._searchDatasetsService.advancedSearchDatasets(parameters, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Research Data total="+this.searchUtils.totalResults);
+            this.results = data[1];
+            this.searchPage.updateBaseUrlWithParameters();
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit!!!
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+            console.info("error");
+            //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = errorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.NOT_AVAILABLE;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+        }
+    );
+  }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    var parameters = $event.value;
+    this.getResults(parameters, this.searchUtils.page,this.searchUtils.size);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}
diff --git a/searchPages/advanced/advancedSearchDatasets.module.ts b/searchPages/advanced/advancedSearchDatasets.module.ts
new file mode 100644
index 00000000..d56cc181
--- /dev/null
+++ b/searchPages/advanced/advancedSearchDatasets.module.ts
@@ -0,0 +1,28 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{AdvancedSearchDatasetsComponent} from './advancedSearchDatasets.component';
+
+
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+ import {AdvancedSearchPageModule} from '../searchUtils/advancedSearchPage.module';
+ import {FreeGuard} from'../../login/freeGuard.guard';
+ import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DatasetsServiceModule,
+    AdvancedSearchPageModule
+
+  ],
+  declarations: [
+    AdvancedSearchDatasetsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    AdvancedSearchDatasetsComponent
+     ]
+})
+export class AdvancedSearchDatasetsModule { }
diff --git a/searchPages/advanced/advancedSearchOrganizations.component.ts b/searchPages/advanced/advancedSearchOrganizations.component.ts
new file mode 100644
index 00000000..320c1bd9
--- /dev/null
+++ b/searchPages/advanced/advancedSearchOrganizations.component.ts
@@ -0,0 +1,161 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router, ActivatedRoute} from '@angular/router';
+import {Filter, Value,AdvancedField} from '../searchUtils/searchHelperClasses.class';
+import {SearchOrganizationsService} from '../../services/searchOrganizations.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {AdvancedSearchPageComponent} from '../searchUtils/advancedSearchPage.component';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+
+@Component({
+    selector: 'advanced-search-organizations',
+    template: `
+    <advanced-search-page pageTitle="Advanced Search for Organizations" entityType="organization"
+                 type = "organizations"
+                 [(results)] = "results"
+                 [(searchUtils)] = "searchUtils"
+                 [(fieldIds)]="fieldIds" [(fieldIdsMap)]="fieldIdsMap"   [(selectedFields)]="selectedFields"
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="resources" simpleSearchLink="/search/find/organizations"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults">
+    </advanced-search-page>
+
+    `
+ })
+
+export class AdvancedSearchOrganizationsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public searchFields:SearchFields = new SearchFields();
+
+  public fieldIds:  string[] = this.searchFields.ORGANIZATION_ADVANCED_FIELDS;
+  public fieldIdsMap  = this.searchFields.ORGANIZATION_FIELDS;
+  public selectedFields:AdvancedField[] =  [];
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  @ViewChild (AdvancedSearchPageComponent) searchPage : AdvancedSearchPageComponent ;
+
+public resourcesQuery = "(oaftype exact organization)";
+  constructor (private route: ActivatedRoute, private _searchOrganizationsService: SearchOrganizationsService ) {
+    this.results =[];
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.baseUrl = OpenaireProperties.searchLinkToAdvancedOrganizations;
+
+
+
+  }
+  ngOnInit() {
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      let page = (params['page']=== undefined)?1:+params['page'];
+      this.searchUtils.page = ( page <= 0 ) ? 1 : page;
+      this.searchPage.fieldIds = this.fieldIds;
+      this.selectedFields =[];
+      this.searchPage.selectedFields = this.selectedFields;
+      this.searchPage.fieldIdsMap = this.fieldIdsMap;
+      this.searchPage.getSelectedFiltersFromUrl(params);
+      this.getResults(this.searchPage.createQueryParameters(),  this.searchUtils.page, this.searchUtils.size);
+
+    });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  public getResults(parameters:string, page: number, size: number){
+      if(parameters!= null && parameters != ''  ) {
+        this.csvParams ="&type=organizations&query=( "+this.resourcesQuery + "and (" + parameters + "))";
+      }else{
+        this.csvParams ="&type=organizations&query="+this.resourcesQuery;
+      }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+    console.info("Advanced Search for Organizations: Execute search query "+parameters);
+     this._searchOrganizationsService.advancedSearchOrganizations(parameters, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Organizations total="+this.searchUtils.totalResults);
+            this.results = data[1];
+            this.searchPage.updateBaseUrlWithParameters();
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit!!!
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+            console.info("error");
+            //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = errorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.NOT_AVAILABLE;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+        }
+    );
+  }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    var parameters = $event.value;
+    this.getResults(parameters, this.searchUtils.page,this.searchUtils.size);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}
diff --git a/searchPages/advanced/advancedSearchOrganizations.module.ts b/searchPages/advanced/advancedSearchOrganizations.module.ts
new file mode 100644
index 00000000..2ce5a6fa
--- /dev/null
+++ b/searchPages/advanced/advancedSearchOrganizations.module.ts
@@ -0,0 +1,28 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{AdvancedSearchOrganizationsComponent} from './advancedSearchOrganizations.component';
+
+
+import {OrganizationsServiceModule} from '../../services/organizationsService.module';
+ import {AdvancedSearchPageModule} from '../searchUtils/advancedSearchPage.module';
+ import {FreeGuard} from'../../login/freeGuard.guard';
+ import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    OrganizationsServiceModule,
+    AdvancedSearchPageModule
+
+  ],
+  declarations: [
+    AdvancedSearchOrganizationsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    AdvancedSearchOrganizationsComponent
+     ]
+})
+export class AdvancedSearchOrganizationsModule { }
diff --git a/searchPages/advanced/advancedSearchProjects.component.ts b/searchPages/advanced/advancedSearchProjects.component.ts
new file mode 100644
index 00000000..769d6f5d
--- /dev/null
+++ b/searchPages/advanced/advancedSearchProjects.component.ts
@@ -0,0 +1,162 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router, ActivatedRoute} from '@angular/router';
+import {Filter, Value,AdvancedField} from '../searchUtils/searchHelperClasses.class';
+import {SearchProjectsService} from '../../services/searchProjects.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {AdvancedSearchPageComponent} from '../searchUtils/advancedSearchPage.component';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'advanced-search-projects',
+    template: `
+    <advanced-search-page pageTitle="Advanced Search for Projects" entityType="project"
+                 type = "projects"
+                 [(results)] = "results"
+                 [(searchUtils)] = "searchUtils"
+                 [(fieldIds)]="fieldIds" [(fieldIdsMap)]="fieldIdsMap"   [(selectedFields)]="selectedFields"
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="resources" simpleSearchLink="/search/find/projects"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults">
+    </advanced-search-page>
+
+    `
+ })
+
+export class AdvancedSearchProjectsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public searchFields:SearchFields = new SearchFields();
+
+  public fieldIds:  string[] = this.searchFields.PROJECT_ADVANCED_FIELDS;
+  public fieldIdsMap = this.searchFields.PROJECT_FIELDS;
+  public selectedFields:AdvancedField[] =  [];
+
+  @ViewChild (AdvancedSearchPageComponent) searchPage : AdvancedSearchPageComponent ;
+  public resourcesQuery = "(oaftype exact project)";
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  constructor (private route: ActivatedRoute, private _searchProjectsService: SearchProjectsService ) {
+
+    this.results =[];
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.baseUrl = OpenaireProperties.searchLinkToAdvancedProjects;
+
+
+
+  }
+  ngOnInit() {
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      let page = (params['page']=== undefined)?1:+params['page'];
+      this.searchUtils.page = ( page <= 0 ) ? 1 : page;
+      this.searchPage.fieldIds = this.fieldIds;
+      this.selectedFields =[];
+      this.searchPage.selectedFields = this.selectedFields;
+      this.searchPage.fieldIdsMap = this.fieldIdsMap;
+      this.searchPage.getSelectedFiltersFromUrl(params);
+      this.getResults(this.searchPage.createQueryParameters(),  this.searchUtils.page, this.searchUtils.size);
+
+    });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  public getResults(parameters:string, page: number, size: number){
+      if(parameters!= null && parameters != ''  ) {
+        this.csvParams ="&type=projects&query=( "+this.resourcesQuery + "and (" + parameters + "))";
+      }else{
+        this.csvParams ="&type=projects&query="+this.resourcesQuery;
+      }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+    console.info("Advanced Search for Publications: Execute search query "+parameters);
+     this._searchProjectsService.advancedSearchProjects(parameters,  page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("Advanced Search for Projects total="+this.searchUtils.totalResults);
+            this.results = data[1];
+            this.searchPage.updateBaseUrlWithParameters();
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit!!!
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+            console.info("error");
+            //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = errorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.NOT_AVAILABLE;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+        }
+    );
+  }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    var parameters = $event.value;
+    this.getResults(parameters, this.searchUtils.page,this.searchUtils.size);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}
diff --git a/searchPages/advanced/advancedSearchProjects.module.ts b/searchPages/advanced/advancedSearchProjects.module.ts
new file mode 100644
index 00000000..1239745e
--- /dev/null
+++ b/searchPages/advanced/advancedSearchProjects.module.ts
@@ -0,0 +1,28 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{AdvancedSearchProjectsComponent} from './advancedSearchProjects.component';
+
+
+import {ProjectsServiceModule} from '../../services/projectsService.module';
+ import {AdvancedSearchPageModule} from '../searchUtils/advancedSearchPage.module';
+ import {FreeGuard} from'../../login/freeGuard.guard';
+ import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    ProjectsServiceModule,
+    AdvancedSearchPageModule
+
+  ],
+  declarations: [
+    AdvancedSearchProjectsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    AdvancedSearchProjectsComponent
+     ]
+})
+export class AdvancedSearchProjectsModule { }
diff --git a/searchPages/advanced/advancedSearchPublications.component.ts b/searchPages/advanced/advancedSearchPublications.component.ts
new file mode 100644
index 00000000..eec08478
--- /dev/null
+++ b/searchPages/advanced/advancedSearchPublications.component.ts
@@ -0,0 +1,160 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router, ActivatedRoute} from '@angular/router';
+import {Filter, Value,AdvancedField} from '../searchUtils/searchHelperClasses.class';
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {AdvancedSearchPageComponent} from '../searchUtils/advancedSearchPage.component';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+
+@Component({
+    selector: 'advanced-search-publications',
+    template: `
+    <advanced-search-page pageTitle="Advanced Search for Publications" entityType="publication"
+                 type="publications"
+                 [(results)] = "results"
+                 [(searchUtils)] = "searchUtils"
+                 [(fieldIds)]="fieldIds" [(fieldIdsMap)]="fieldIdsMap"   [(selectedFields)]="selectedFields"
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="resources" simpleSearchLink="/search/find/publications"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults">
+    </advanced-search-page>
+    `
+ })
+
+export class AdvancedSearchPublicationsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public searchFields:SearchFields = new SearchFields();
+
+  public fieldIds:  string[] = this.searchFields.RESULT_ADVANCED_FIELDS;
+  public fieldIdsMap= this.searchFields.RESULT_FIELDS;
+  public selectedFields:AdvancedField[] =  [];
+  public resourcesQuery = "((oaftype exact result) and (resulttypeid exact publication))";
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  @ViewChild (AdvancedSearchPageComponent) searchPage : AdvancedSearchPageComponent ;
+
+
+  constructor (private route: ActivatedRoute, private _searchPublicationsService: SearchPublicationsService ) {
+
+    this.results =[];
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.baseUrl = OpenaireProperties.searchLinkToAdvancedPublications;
+
+
+
+  }
+  ngOnInit() {
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      let page = (params['page']=== undefined)?1:+params['page'];
+      this.searchUtils.page = ( page <= 0 ) ? 1 : page;
+      this.searchPage.fieldIds = this.fieldIds;
+      this.selectedFields =[];
+      this.searchPage.selectedFields = this.selectedFields;
+      this.searchPage.fieldIdsMap = this.fieldIdsMap;
+
+      this.searchPage.getSelectedFiltersFromUrl(params);
+      this.getResults(this.searchPage.createQueryParameters(),  this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  public getResults(parameters:string, page: number, size: number){
+      if(parameters!= null && parameters != ''  ) {
+        this.csvParams ="&type=publications&query=("+this.resourcesQuery +" and (" + parameters + "))";
+      }else{
+        this.csvParams ="&type=publications&query="+this.resourcesQuery;
+      }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+    console.info("Advanced Search for Publications: Execute search query "+parameters);
+     this._searchPublicationsService.advancedSearchPublications(parameters, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("searchPubl total="+this.searchUtils.totalResults);
+            this.results = data[1];
+            this.searchPage.updateBaseUrlWithParameters();
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit!!!
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+            console.info("error");
+            //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.NOT_AVAILABLE;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+        }
+    );
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+
+    var parameters = $event.value;
+    this.getResults(parameters, this.searchUtils.page,this.searchUtils.size);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}
diff --git a/searchPages/advanced/advancedSearchPublications.module.ts b/searchPages/advanced/advancedSearchPublications.module.ts
new file mode 100644
index 00000000..225234bc
--- /dev/null
+++ b/searchPages/advanced/advancedSearchPublications.module.ts
@@ -0,0 +1,28 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{AdvancedSearchPublicationsComponent} from './advancedSearchPublications.component';
+
+
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+ import {AdvancedSearchPageModule} from '../searchUtils/advancedSearchPage.module';
+ import {FreeGuard} from'../../login/freeGuard.guard';
+ import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    PublicationsServiceModule,
+    AdvancedSearchPageModule
+
+  ],
+  declarations: [
+    AdvancedSearchPublicationsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    AdvancedSearchPublicationsComponent
+     ]
+})
+export class AdvancedSearchPublicationsModule { }
diff --git a/searchPages/advanced/advancedSearchSoftware.component.ts b/searchPages/advanced/advancedSearchSoftware.component.ts
new file mode 100644
index 00000000..5de0eda7
--- /dev/null
+++ b/searchPages/advanced/advancedSearchSoftware.component.ts
@@ -0,0 +1,161 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Router, ActivatedRoute} from '@angular/router';
+import {Filter, Value,AdvancedField} from '../searchUtils/searchHelperClasses.class';
+import {SearchSoftwareService} from '../../services/searchSoftware.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {AdvancedSearchPageComponent} from '../searchUtils/advancedSearchPage.component';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+
+@Component({
+    selector: 'advanced-search-software',
+    template: `
+    <advanced-search-page pageTitle="Advanced Search for Software" entityType="software"
+                 type = "software"
+                 [(results)] = "results"
+                 [(searchUtils)] = "searchUtils"
+                 [(fieldIds)]="fieldIds" [(fieldIdsMap)]="fieldIdsMap"   [(selectedFields)]="selectedFields"
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="resources" simpleSearchLink="/search/find/software"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults">
+    </advanced-search-page>
+
+    `
+ })
+
+export class AdvancedSearchSoftwareComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public searchFields:SearchFields = new SearchFields();
+
+  public fieldIds:  string[] = this.searchFields.RESULT_ADVANCED_FIELDS;
+  public fieldIdsMap= this.searchFields.RESULT_FIELDS;
+  public selectedFields:AdvancedField[] =  [];
+
+  @ViewChild (AdvancedSearchPageComponent) searchPage : AdvancedSearchPageComponent ;
+  public resourcesQuery = "( (oaftype exact result) and (resulttypeid exact software)  )";
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  constructor (private route: ActivatedRoute, private _searchSoftwareService: SearchSoftwareService ) {
+    this.results =[];
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.baseUrl = OpenaireProperties.searchLinkToAdvancedSoftware;
+
+
+
+  }
+  ngOnInit() {
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      let page = (params['page']=== undefined)?1:+params['page'];
+      this.searchUtils.page = ( page <= 0 ) ? 1 : page;
+      this.searchPage.fieldIds = this.fieldIds;
+      this.selectedFields =[];
+      this.searchPage.selectedFields = this.selectedFields;
+      this.searchPage.fieldIdsMap = this.fieldIdsMap;
+      this.searchPage.getSelectedFiltersFromUrl(params);
+      this.getResults(this.searchPage.createQueryParameters(),  this.searchUtils.page, this.searchUtils.size);
+
+    });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+  sub: any;
+  public getResults(parameters:string, page: number, size: number){
+      if(parameters!= null && parameters != ''  ) {
+        this.csvParams ="&type=software&query=( "+this.resourcesQuery + "and (" + parameters + "))";
+      }else{
+        this.csvParams ="&type=software&query="+this.resourcesQuery;
+      }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+    console.info("Advanced Search for Software: Execute search query "+parameters);
+     this._searchSoftwareService.advancedSearchSoftware(parameters, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Software total="+this.searchUtils.totalResults);
+            this.results = data[1];
+            this.searchPage.updateBaseUrlWithParameters();
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit!!!
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+            console.info("error");
+            //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = errorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.NOT_AVAILABLE;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+        }
+    );
+  }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+
+    var parameters = $event.value;
+    this.getResults(parameters, this.searchUtils.page,this.searchUtils.size);
+    console.info("queryChanged: Execute search query "+parameters);
+
+  }
+
+
+}
diff --git a/searchPages/advanced/advancedSearchSoftware.module.ts b/searchPages/advanced/advancedSearchSoftware.module.ts
new file mode 100644
index 00000000..01f95b15
--- /dev/null
+++ b/searchPages/advanced/advancedSearchSoftware.module.ts
@@ -0,0 +1,28 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{AdvancedSearchSoftwareComponent} from './advancedSearchSoftware.component';
+
+
+import {SoftwareServiceModule} from '../../services/softwareService.module';
+ import {AdvancedSearchPageModule} from '../searchUtils/advancedSearchPage.module';
+ import {FreeGuard} from'../../login/freeGuard.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    SoftwareServiceModule,
+    AdvancedSearchPageModule
+
+  ],
+  declarations: [
+    AdvancedSearchSoftwareComponent
+   ],
+  providers:[FreeGuard
+    ],
+  exports: [
+    AdvancedSearchSoftwareComponent
+     ]
+})
+export class AdvancedSearchSoftwareModule { }
diff --git a/searchPages/dataProviders/compatibleDataProviders.component.ts b/searchPages/dataProviders/compatibleDataProviders.component.ts
new file mode 100644
index 00000000..a069f62d
--- /dev/null
+++ b/searchPages/dataProviders/compatibleDataProviders.component.ts
@@ -0,0 +1,184 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Location} from '@angular/common';
+import { ActivatedRoute} from '@angular/router';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-content-providers',
+    template: `
+
+    <search-page    pageTitle="OpenAIRE Content Providers"
+                    formPlaceholderText = "Search for OpenAIRE Content Providers"
+                    type="content providers" entityType="dataprovider" [(filters)] = "filters"
+                    [(results)] = "results"  [(searchUtils)] = "searchUtils"
+                    [baseUrl] = "baseUrl" [showResultCount]=false
+                    (queryChange)="queryChanged($event)"
+                    [csvParams]="csvParams" csvPath="resources"
+                    [disableForms]="disableForms"
+                    [tableViewLink]="'/search/content-providers-table'"
+                    searchFormClass="compatibleDatasourcesSearchForm">
+    </search-page>
+
+    `
+
+})
+export class SearchCompatibleDataprovidersComponent {
+  private errorCodes: ErrorCodes;
+  public results =[];
+  public filters =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public _location:Location;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.COMPATIBLE_DATAPROVIDER_FIELDS;
+  public fieldIdsMap= this.searchFields.DATASOURCE_FIELDS;
+  public _prefixQueryFields: {field:string,opName:string,opValue:string,values:string[]}[] =[{field:"compatibility",opName:"cm",opValue:"not", values:["UNKNOWN","hostedBy","notCompatible"]},{field:"type",opName:"tp",opValue:"not",values: ["other"]}];
+  // ["entityregistry","entityregistry::projects","entityregistry::repositories"]}];
+  public _prefixQuery: string = "";
+
+  public CSV: any = {  "columnNames":  [ "Title", "Type", "Coutries", "Compatibility" ],
+                        "export":[]
+                     };
+  public CSVDownloaded = false;
+  public resourcesQuery = '&query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other) not(datasourcetypeuiid exact "pubsrepository::journal") not(datasourcetypeuiid exact "aggregator::pubsrepository::journals"))';
+  public csvParams: string;
+  public disableForms: boolean = false;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.baseUrl = OpenaireProperties.getLinkToSearchCompatibleDataProviders();
+    for(var i = 0; i < this._prefixQueryFields.length; i++ ){
+      for(var j =0; j < this._prefixQueryFields[i].values.length; j++){
+        this._prefixQuery+="&" + this._prefixQueryFields[i].field + "="
+        + this._prefixQueryFields[i].values[j] + "&" +
+        this._prefixQueryFields[i].opName + "=" + this._prefixQueryFields[i].opValue;
+      }
+    }
+    this._prefixQuery+="&";
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.searchPage.fieldIdsMap = this.fieldIdsMap;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+      this.filters = this.createFilters();
+      var queryParameters = this.searchPage.getIndexQueryParametersFromUrl(params);
+      console.info("|"+queryParameters+"|");
+      this._getResults(queryParameters, false, this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }  }
+    private _getResults(parameters:string,refine:boolean, page: number, size: number){
+        this.csvParams = parameters+this.resourcesQuery+"&type=datasources";
+
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+      //this.searchPage.openLoading();
+      this.disableForms = true;
+      this.results = [];
+      this.searchUtils.totalResults = 0;
+
+      this.subResults = this._searchDataprovidersService.searchCompatibleDataproviders(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, []).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Content Providers: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+              this.searchPage.checkSelectedFilters(this.filters);
+              this.searchPage.updateBaseUrlWithParameters(this.filters);
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          }
+      );
+    }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    var parameters = $event.index;
+    console.info("queryChanged: Execute search query "+parameters);
+
+    this._getResults(parameters, false, this.searchUtils.page, this.searchUtils.size);
+  }
+  private createFilters():Filter[] {
+    var filter_names=["Type","Compatibility Level"];
+    var filter_ids=["datasourcetypeuiid","datasourcecompatibilityname"];
+    var searchFields = new SearchFields();
+    var filter_original_ids = searchFields.COMPATIBLE_DATAPROVIDER_FIELDS;
+    var value_names=[
+      /*[
+      "Institutional Publication Repository","Thematic Publication Repository", "Other Publication Repository",
+     "Institutional Repositories Aggregators",
+     "Thematic Repositories Aggregators", "Other Repositories Aggregators",
+      "Data Repositories", "Data Repositories Aggregators", "Journals", "Journals Aggregators", "CRIS Systems", "Publication Catalogues"],
+      */
+      [
+      "Institutional Repository", "Thematic Repository", "Publication Repository",
+      "Institutional Repository Aggregator",
+      "Thematic Repositories Aggregators", "Publication Repository Aggregator",
+      "Data Repository", "Data Repository Aggregator", "CRIS Systems", "Publication Catalogue"],
+      ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var value_original_ids=[
+      ["pubsrepository::institutional","pubsrepository::thematic", "pubsrepository::unknown", "aggregator::pubsrepository::institutional","aggregator::pubsrepository::thematic","aggregator::pubsrepository::unknown",
+      "datarepository::unknown", "aggregator::datarepository", "cris", "pubscatalogue::unknown"],
+      //["driver","openaire2.0", "driver-openaire2.0", "openaire3.0","openaire2.0_data"]
+    ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+    var filters: Filter[] =[];
+    for(var i =0 ; i < filter_names.length;i++){
+      var values:Value[] = [];
+      for(var j =0 ; j < value_names[i].length;j++){
+        var value:Value = {name: value_names[i][j], id: value_original_ids[i][j], number:j, selected:false}
+        values.push(value);
+      }
+       var filter:Filter = {title: filter_names[i], filterId: filter_ids[i], originalFilterId:  filter_original_ids[i], values : values, countSelectedValues:0, "filterOperator": 'or' };
+       filters.push(filter);
+    }
+    return filters;
+    }
+}
diff --git a/searchPages/dataProviders/compatibleDataProviders.module.ts b/searchPages/dataProviders/compatibleDataProviders.module.ts
new file mode 100644
index 00000000..62d0c525
--- /dev/null
+++ b/searchPages/dataProviders/compatibleDataProviders.module.ts
@@ -0,0 +1,27 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchCompatibleDataprovidersComponent} from './compatibleDataProviders.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DataProvidersServiceModule,
+     SearchFormModule, SearchResultsModule, SearchPageModule
+
+  ],
+  declarations: [
+    SearchCompatibleDataprovidersComponent
+   ],
+  exports: [
+    SearchCompatibleDataprovidersComponent
+     ]
+})
+export class CompatibleDataProvidersModule { }
diff --git a/searchPages/dataProviders/compatibleDataProvidersTable.component.ts b/searchPages/dataProviders/compatibleDataProvidersTable.component.ts
new file mode 100644
index 00000000..4f07d603
--- /dev/null
+++ b/searchPages/dataProviders/compatibleDataProvidersTable.component.ts
@@ -0,0 +1,195 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import {Location} from '@angular/common';
+import { ActivatedRoute} from '@angular/router';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageTableViewComponent } from '../searchUtils/searchPageTableView.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-content-providers-table',
+    template: `
+
+    <search-page-table    pageTitle="OpenAIRE Content Providers Table"
+                          type="content providers" entityType="dataprovider" [(filters)] = "filters"
+                          [(results)] = "results"  [(searchUtils)] = "searchUtils"
+                          [showResultCount]=false
+                          [disableForms]="disableForms"
+                          [searchViewLink]="'/search/content-providers'"
+                          searchFormClass="compatibleDatasourcesTableSearchForm"
+                          formPlaceholderText="Search for OpenAIRE Content Providers">
+    </search-page-table>
+    `
+
+})
+export class SearchCompatibleDataprovidersTableComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public _location:Location;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.COMPATIBLE_DATAPROVIDER_FIELDS;
+
+  /*public CSV: any = {  "columnNames":  [ "Title", "Type", "Coutries", "Compatibility" ],
+                        "export":[]
+                     };
+  public CSVDownloaded = false;
+  public csvParams: string;
+  public resourcesQuery = "&query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other))";*/
+
+  public disableForms: boolean = false;
+
+  @ViewChild (SearchPageTableViewComponent) searchPage : SearchPageTableViewComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.baseUrl = OpenaireProperties.getLinkToSearchCompatibleDataProvidersTable();
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      //this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+      this.filters = this.createFilters();
+      this.searchPage.getParametersFromUrl(params);
+      this._getResults();
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }  }
+    private _getResults(){
+        //this.csvParams = this.resourcesQuery+"&type=datasources";
+
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+      this.disableForms = true;
+      this.results = [];
+      this.searchUtils.totalResults = 0;
+
+      let size: number = 0;
+      this.subResults = this._searchDataprovidersService.searchCompatibleDataprovidersTable().subscribe(
+          data => {
+              size = data;
+              if(size > 0) {
+                this.subResults = this._searchDataprovidersService.searchCompatibleDataproviders("", null, 1, size, []).subscribe(
+                    data => {
+                        this.searchUtils.totalResults = data[0];
+                        console.info("search Content Providers [total results:"+this.searchUtils.totalResults+"]");
+                        this.results = data[1];
+
+                        this.searchPage.checkSelectedFilters(this.filters);
+
+                        //var errorCodes:ErrorCodes = new ErrorCodes();
+                        this.searchUtils.status = this.errorCodes.DONE;
+                        if(this.searchUtils.totalResults == 0 ){
+                          this.searchUtils.status = this.errorCodes.NONE;
+                        }
+                        this.disableForms = false;
+                    },
+                    err => {
+                        console.log(err);
+                         //TODO check erros (service not available, bad request)
+                        // if( ){
+                        //   this.searchUtils.status = ErrorCodes.ERROR;
+                        // }
+                        //var errorCodes:ErrorCodes = new ErrorCodes();
+                        //this.searchUtils.status = errorCodes.ERROR;
+                        if(err.status == '404') {
+                          this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                        } else if(err.status == '500') {
+                          this.searchUtils.status = this.errorCodes.ERROR;
+                        } else {
+                          this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                        }
+
+                        this.disableForms = false;
+
+                    }
+                );
+              } else {
+                this.searchPage.checkSelectedFilters(this.filters);
+
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                this.searchUtils.status = this.errorCodes.NONE;
+                this.disableForms = false;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+
+    }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  private createFilters():Filter[] {
+    var filter_names=["Type","Compatibility Level"];
+    var filter_ids=["datasourcetypeuiid","datasourcecompatibilityname"];
+    var searchFields = new SearchFields();
+    var filter_original_ids = searchFields.COMPATIBLE_DATAPROVIDER_FIELDS;
+    var value_names=[
+      /*[
+      "Institutional Publication Repository","Thematic Publication Repository", "Other Publication Repository",
+     "Institutional Repositories Aggregators",
+     "Thematic Repositories Aggregators", "Other Repositories Aggregators",
+      "Data Repositories", "Data Repositories Aggregators", "Journals", "Journals Aggregators", "CRIS Systems", "Publication Catalogues"],
+      */
+      [
+      "Institutional Repository", "Thematic Repository", "Publication Repository",
+      "Institutional Repository Aggregator",
+      "Thematic Repositories Aggregators", "Publication Repository Aggregator",
+      "Data Repository", "Data Repository Aggregator", "CRIS Systems", "Publication Catalogue"],
+
+
+
+
+      ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var value_original_ids=[
+      ["pubsrepository::institutional","pubsrepository::thematic", "pubsrepository::unknown", "aggregator::pubsrepository::institutional","aggregator::pubsrepository::thematic","aggregator::pubsrepository::unknown",
+      "datarepository::unknown", "aggregator::datarepository", "cris", "pubscatalogue::unknown"],
+      //["driver","openaire2.0", "driver-openaire2.0", "openaire3.0","openaire2.0_data"]
+    ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+    var filters: Filter[] =[];
+    for(var i =0 ; i < filter_names.length;i++){
+      var values:Value[] = [];
+      for(var j =0 ; j < value_names[i].length;j++){
+        var value:Value = {name: value_names[i][j], id: value_original_ids[i][j], number:j, selected:false}
+        values.push(value);
+      }
+       var filter:Filter = {title: filter_names[i], filterId: filter_ids[i], originalFilterId:  filter_original_ids[i], values : values, countSelectedValues:0, "filterOperator": 'or' };
+       filters.push(filter);
+    }
+    return filters;
+    }
+}
diff --git a/searchPages/dataProviders/compatibleDataProvidersTable.module.ts b/searchPages/dataProviders/compatibleDataProvidersTable.module.ts
new file mode 100644
index 00000000..95c36833
--- /dev/null
+++ b/searchPages/dataProviders/compatibleDataProvidersTable.module.ts
@@ -0,0 +1,26 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchCompatibleDataprovidersTableComponent} from './compatibleDataProvidersTable.component';
+
+
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageTableViewModule} from '../searchUtils/searchPageTableView.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DataProvidersServiceModule,
+     SearchFormModule, SearchPageTableViewModule
+
+  ],
+  declarations: [
+    SearchCompatibleDataprovidersTableComponent
+   ],
+  exports: [
+    SearchCompatibleDataprovidersTableComponent
+     ]
+})
+export class CompatibleDataProvidersTableModule { }
diff --git a/searchPages/dataProviders/entityRegistries.component.ts b/searchPages/dataProviders/entityRegistries.component.ts
new file mode 100644
index 00000000..8339ac42
--- /dev/null
+++ b/searchPages/dataProviders/entityRegistries.component.ts
@@ -0,0 +1,176 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-entity-registries',
+    template: `
+
+    <search-page pageTitle="Registries/ Databases"
+                formPlaceholderText = "Search for Registries/ Databases"
+                 type="content providers" entityType="dataprovider" [(filters)] = "filters"
+                 [(results)] = "results" [(searchUtils)] = "searchUtils"
+                 [baseUrl] = "baseUrl" [showResultCount]=false
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="resources"
+                 [disableForms]="disableForms"
+                 [tableViewLink]="'/search/entity-registries-table'"
+                 searchFormClass="entityRegistriesSearchForm">
+    </search-page>
+
+    `
+
+})
+export class SearchEntityRegistriesComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public _location:Location;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.ENTITY_REGISTRIES_FIELDS;
+  public fieldIdsMap= this.searchFields.DATASOURCE_FIELDS;
+  public _prefixQueryFields: {field:string,opName:string,opValue:string,values:string[]}[] =[
+    {field:"type",opName:"tp",opValue:"and",values: ["other"]}];
+    // ["entityregistry","entityregistry::projects","entityregistry::repositories"]}];
+  public _prefixQuery: string = "";
+
+  public CSV: any = {  "columnNames":  [ "Title", "Type", "Coutries", "Compatibility" ],
+                        "export":[]
+                     };
+  public CSVDownloaded = false;
+  public disableForms: boolean = false;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+  public resourcesQuery = "&query=((oaftype exact datasource) and(datasourcetypeuiid = other))";
+  public csvParams: string;
+
+  constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.baseUrl = OpenaireProperties.getLinkToSearchEntityRegistries();
+    for(var i = 0; i < this._prefixQueryFields.length; i++ ){
+      for(var j =0; j < this._prefixQueryFields[i].values.length; j++){
+        this._prefixQuery+="&" + this._prefixQueryFields[i].field + "="
+        + this._prefixQueryFields[i].values[j] + "&" +
+        this._prefixQueryFields[i].opName + "=" + this._prefixQueryFields[i].opValue;
+      }
+    }
+    this._prefixQuery+="&";
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.searchPage.fieldIdsMap = this.fieldIdsMap;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+      this.filters = this.createFilters();
+
+      var queryParameters = this.searchPage.getIndexQueryParametersFromUrl(params);
+      this._getResults(queryParameters, false, this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }  }
+    private _getResults(parameters:string,refine:boolean, page: number, size: number){
+        this.csvParams = parameters+this.resourcesQuery+"&type=datasources";
+
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+      //this.searchPage.openLoading();
+      this.disableForms = true;
+      this.results = [];
+      this.searchUtils.totalResults = 0;
+
+       this.subResults = this._searchDataprovidersService.searchEntityRegistries(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, []).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Entity Registries: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+              this.searchPage.checkSelectedFilters(this.filters);
+              this.searchPage.updateBaseUrlWithParameters(this.filters);
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          }
+      );
+    }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    var parameters = $event.index;
+    console.info("queryChanged: Execute search query "+parameters);
+    this._getResults(parameters, false, this.searchUtils.page, this.searchUtils.size);
+  }
+  private createFilters():Filter[] {
+    var filter_names=["Type","Compatibility Level"];
+    var filter_ids=["datasourcetypename","datasourcecompatibilityname"];
+    var searchFields = new SearchFields();
+    var filter_original_ids = searchFields.ENTITY_REGISTRIES_FIELDS;
+    var value_names=[
+      ["Funder","Registry of repositories","Scholarly Comm. Infrastructure","Registry","Information Space","Web Source"],
+
+      ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var value_original_ids=[
+      ["Funder database","Registry of repositories","Scholarly Comm. Infrastructure","Registry","Information Space","Web Source"],
+      //["entityregistry::projects","entityregistry::repositories","scholarcomminfra","entityregistry","infospace","websource"],
+      //["driver","openaire2.0", "driver-openaire2.0", "openaire3.0","openaire2.0_data"]
+    ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var filters: Filter[] =[];
+    for(var i =0 ; i < filter_names.length;i++){
+      var values:Value[] = [];
+      for(var j =0 ; j < value_names[i].length;j++){
+        var value:Value = {name: value_names[i][j], id: value_original_ids[i][j], number:j, selected:false}
+        values.push(value);
+      }
+       var filter:Filter = {title: filter_names[i], filterId: filter_ids[i], originalFilterId:  filter_original_ids[i], values : values, countSelectedValues:0, "filterOperator": 'or' };
+       filters.push(filter);
+    }
+    return filters;
+    }
+}
diff --git a/searchPages/dataProviders/entityRegistries.module.ts b/searchPages/dataProviders/entityRegistries.module.ts
new file mode 100644
index 00000000..4b5dcf6e
--- /dev/null
+++ b/searchPages/dataProviders/entityRegistries.module.ts
@@ -0,0 +1,25 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchEntityRegistriesComponent} from './entityRegistries.component';
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DataProvidersServiceModule,
+     SearchFormModule, SearchResultsModule, SearchPageModule
+
+  ],
+  declarations: [
+    SearchEntityRegistriesComponent
+   ],
+  exports: [
+    SearchEntityRegistriesComponent
+     ]
+})
+export class EntityRegistriesModule { }
diff --git a/searchPages/dataProviders/entityRegistriesTable.component.ts b/searchPages/dataProviders/entityRegistriesTable.component.ts
new file mode 100644
index 00000000..dd016bb9
--- /dev/null
+++ b/searchPages/dataProviders/entityRegistriesTable.component.ts
@@ -0,0 +1,204 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageTableViewComponent } from '../searchUtils/searchPageTableView.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-entity-registries-table',
+    template: `
+
+    <search-page-table pageTitle="Registries/ Databases"
+                       type="content providers" entityType="dataprovider" [(filters)] = "filters"
+                       [(results)] = "results" [(searchUtils)] = "searchUtils"
+                       [showResultCount]=false
+                       [disableForms]="disableForms"
+                       [searchViewLink]="'/search/entity-registries'"
+                       searchFormClass="entityRegistriesTableSearchForm"
+                       formPlaceholderText="Search for Registries/ Databases">
+    </search-page-table>
+
+    `
+
+})
+export class SearchEntityRegistriesTableComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public _location:Location;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.ENTITY_REGISTRIES_FIELDS;
+  public disableForms: boolean = false;
+
+  @ViewChild (SearchPageTableViewComponent) searchPage : SearchPageTableViewComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      //this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+      this.filters = this.createFilters();
+
+      this.searchPage.getParametersFromUrl(params);
+      this._getResults("", false, this.searchUtils.page);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }  }
+    private _getResults(parameters:string,refine:boolean, page: number){
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+      this.disableForms = true;
+      this.results = [];
+      this.searchUtils.totalResults = 0;
+
+      let size: number = 0;
+      this.subResults = this._searchDataprovidersService.searchEntityRegistriesTable().subscribe(
+          data => {
+              size = data;
+              if(size > 0) {
+                this.subResults = this._searchDataprovidersService.searchEntityRegistries("",null, page, size, []).subscribe(
+                    data => {
+                        this.searchUtils.totalResults = data[0];
+                        console.info("search Entity Registries [total results:"+this.searchUtils.totalResults+"]");
+                        this.results = data[1];
+                        this.searchPage.checkSelectedFilters(this.filters);
+
+                        //var errorCodes:ErrorCodes = new ErrorCodes();
+                        this.searchUtils.status = this.errorCodes.DONE;
+                        if(this.searchUtils.totalResults == 0 ){
+                          this.searchUtils.status = this.errorCodes.NONE;
+                        }
+                        this.disableForms = false;
+
+                    },
+                    err => {
+                        console.log(err);
+                         //TODO check erros (service not available, bad request)
+                        // if( ){
+                        //   this.searchUtils.status = ErrorCodes.ERROR;
+                        // }
+                        //var errorCodes:ErrorCodes = new ErrorCodes();
+                        //this.searchUtils.status = errorCodes.ERROR;
+                        if(err.status == '404') {
+                          this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                        } else if(err.status == '500') {
+                          this.searchUtils.status = this.errorCodes.ERROR;
+                        } else {
+                          this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                        }
+
+                        this.disableForms = false;
+
+                    }
+                );
+              } else {
+                this.searchPage.checkSelectedFilters(this.filters);
+
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                this.searchUtils.status = this.errorCodes.NONE;
+                this.disableForms = false;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+/*
+       this.subResults = this._searchDataprovidersService.searchEntityRegistries(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, []).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Entity Registries: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+              this.searchPage.checkSelectedFilters(this.filters);
+              this.searchPage.updateBaseUrlWithParameters(this.filters);
+              var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = errorCodes.NONE;
+              }
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = errorCodes.ERROR;
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          }
+      );
+*/
+    }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+
+  private createFilters():Filter[] {
+    var filter_names=["Type","Compatibility Level"];
+    var filter_ids=["datasourcetypename","datasourcecompatibilityname"];
+    var searchFields = new SearchFields();
+    var filter_original_ids = searchFields.ENTITY_REGISTRIES_FIELDS;
+    var value_names=[
+      ["Funder database","Registry of repositories","Scholarly Comm. Infrastructure","Registry","Information Space","Web Source"],
+
+      ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var value_original_ids=[
+      ["Funder database","Registry of repositories","Scholarly Comm. Infrastructure","Registry","Information Space","Web Source"],
+      //["entityregistry::projects","entityregistry::repositories","scholarcomminfra","entityregistry","infospace","websource"],
+      //["driver","openaire2.0", "driver-openaire2.0", "openaire3.0","openaire2.0_data"]
+    ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var filters: Filter[] =[];
+    for(var i =0 ; i < filter_names.length;i++){
+      var values:Value[] = [];
+      for(var j =0 ; j < value_names[i].length;j++){
+        var value:Value = {name: value_names[i][j], id: value_original_ids[i][j], number:j, selected:false}
+        values.push(value);
+      }
+       var filter:Filter = {title: filter_names[i], filterId: filter_ids[i], originalFilterId:  filter_original_ids[i], values : values, countSelectedValues:0, "filterOperator": 'or' };
+       filters.push(filter);
+    }
+    return filters;
+    }
+}
diff --git a/searchPages/dataProviders/entityRegistriesTable.module.ts b/searchPages/dataProviders/entityRegistriesTable.module.ts
new file mode 100644
index 00000000..42ef101a
--- /dev/null
+++ b/searchPages/dataProviders/entityRegistriesTable.module.ts
@@ -0,0 +1,24 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchEntityRegistriesTableComponent} from './entityRegistriesTable.component';
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageTableViewModule} from '../searchUtils/searchPageTableView.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DataProvidersServiceModule,
+     SearchFormModule, SearchPageTableViewModule
+
+  ],
+  declarations: [
+    SearchEntityRegistriesTableComponent
+   ],
+  exports: [
+    SearchEntityRegistriesTableComponent
+     ]
+})
+export class EntityRegistriesTableModule { }
diff --git a/searchPages/dataProviders/journals.component.ts b/searchPages/dataProviders/journals.component.ts
new file mode 100644
index 00000000..7d7c527d
--- /dev/null
+++ b/searchPages/dataProviders/journals.component.ts
@@ -0,0 +1,181 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-journals',
+    template: `
+
+    <search-page    pageTitle="OpenAIRE Journals"
+                    formPlaceholderText = "Search for OpenAIRE Journals"
+                    type="content providers" entityType="dataprovider" [(filters)] = "filters"
+                    [(results)] = "results"  [(searchUtils)] = "searchUtils"
+                    [baseUrl] = "baseUrl" [showResultCount]=false
+                    (queryChange)="queryChanged($event)"
+                    [csvParams]="csvParams" csvPath="resources"
+                    [disableForms]="disableForms"
+                    [tableViewLink]="'/search/journals-table'"
+                    searchFormClass="journalsSearchForm">
+    </search-page>
+    `
+
+})
+export class SearchJournalsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public _location:Location;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.JOURNAL_FIELDS;
+  public fieldIdsMap= this.searchFields.DATASOURCE_FIELDS;
+  public _prefixQueryFields: {field:string,opName:string,opValue:string,values:string[]}[] =[{field:"compatibility",opName:"cm",opValue:"not", values:["UNKNOWN","hostedBy","notCompatible"]},{field:"type",opName:"tp",opValue:"not",values: ["other"]}];
+  // ["entityregistry","entityregistry::projects","entityregistry::repositories"]}];
+  public _prefixQuery: string = "";
+
+  public CSV: any = {  "columnNames":  [ "Title", "Type", "Coutries", "Compatibility" ],
+                        "export":[]
+                     };
+  public CSVDownloaded = false;
+  public resourcesQuery = '&query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) and (datasourcetypeuiid exact "pubsrepository::journal" or datasourcetypeuiid exact "aggregator::pubsrepository::journals" ))';
+  //"&query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other))";
+  public csvParams: string;
+  public disableForms: boolean = false;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.baseUrl = OpenaireProperties.getLinkToSearchJournals();
+    for(var i = 0; i < this._prefixQueryFields.length; i++ ){
+      for(var j =0; j < this._prefixQueryFields[i].values.length; j++){
+        this._prefixQuery+="&" + this._prefixQueryFields[i].field + "="
+        + this._prefixQueryFields[i].values[j] + "&" +
+        this._prefixQueryFields[i].opName + "=" + this._prefixQueryFields[i].opValue;
+      }
+    }
+    this._prefixQuery+="&";
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.searchPage.fieldIdsMap = this.fieldIdsMap;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+      this.filters = this.createFilters();
+      var queryParameters = this.searchPage.getIndexQueryParametersFromUrl(params);
+      console.info("|"+queryParameters+"|");
+      this._getResults(queryParameters, false, this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }  }
+    private _getResults(parameters:string,refine:boolean, page: number, size: number){
+        this.csvParams = parameters+this.resourcesQuery+"&type=datasources";
+
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+      //this.searchPage.openLoading();
+      this.disableForms = true;
+      this.results = [];
+      this.searchUtils.totalResults = 0;
+
+      this.subResults = this._searchDataprovidersService.searchJournals(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, []).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Journals: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+              this.searchPage.checkSelectedFilters(this.filters);
+              this.searchPage.updateBaseUrlWithParameters(this.filters);
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+          }
+      );
+    }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    var parameters = $event.index;
+    console.info("queryChanged: Execute search query "+parameters);
+
+    this._getResults(parameters, false, this.searchUtils.page, this.searchUtils.size);
+  }
+  private createFilters():Filter[] {
+    var filter_names=["Type","Compatibility Level"];
+    var filter_ids=["datasourcetypeuiid","datasourcecompatibilityname"];
+    var searchFields = new SearchFields();
+    var filter_original_ids = searchFields.JOURNAL_FIELDS;
+    var value_names=[
+      /*[
+      "Institutional Publication Repository","Thematic Publication Repository", "Other Publication Repository",
+     "Institutional Repositories Aggregators",
+     "Thematic Repositories Aggregators", "Other Repositories Aggregators",
+      "Data Repositories", "Data Repositories Aggregators", "Journals", "Journals Aggregators", "CRIS Systems", "Publication Catalogues"],
+      */
+      ["Journal", "Journal Aggregator\/Publisher"],
+      ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var value_original_ids=[
+      ["pubsrepository::journal", "aggregator::pubsrepository::journals"],
+      //["driver","openaire2.0", "driver-openaire2.0", "openaire3.0","openaire2.0_data"]
+    ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+    var filters: Filter[] =[];
+    for(var i =0 ; i < filter_names.length;i++){
+      var values:Value[] = [];
+      for(var j =0 ; j < value_names[i].length;j++){
+        var value:Value = {name: value_names[i][j], id: value_original_ids[i][j], number:j, selected:false}
+        values.push(value);
+      }
+       var filter:Filter = {title: filter_names[i], filterId: filter_ids[i], originalFilterId:  filter_original_ids[i], values : values, countSelectedValues:0, "filterOperator": 'or' };
+       filters.push(filter);
+    }
+    return filters;
+    }
+}
diff --git a/searchPages/dataProviders/journals.module.ts b/searchPages/dataProviders/journals.module.ts
new file mode 100644
index 00000000..296987e5
--- /dev/null
+++ b/searchPages/dataProviders/journals.module.ts
@@ -0,0 +1,27 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchJournalsComponent} from './journals.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DataProvidersServiceModule,
+     SearchFormModule, SearchResultsModule, SearchPageModule
+
+  ],
+  declarations: [
+    SearchJournalsComponent
+   ],
+  exports: [
+    SearchJournalsComponent
+     ]
+})
+export class JournalsModule { }
diff --git a/searchPages/dataProviders/journalsTable.component.ts b/searchPages/dataProviders/journalsTable.component.ts
new file mode 100644
index 00000000..1c4bb74e
--- /dev/null
+++ b/searchPages/dataProviders/journalsTable.component.ts
@@ -0,0 +1,191 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageTableViewComponent } from '../searchUtils/searchPageTableView.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-journals-table',
+    template: `
+
+    <search-page-table    pageTitle="OpenAIRE Journals Table"
+                          type="content providers" entityType="dataprovider" [(filters)] = "filters"
+                          [(results)] = "results"  [(searchUtils)] = "searchUtils"
+                          [showResultCount]=false
+                          [disableForms]="disableForms"
+                          [searchViewLink]="'/search/journals'"
+                          searchFormClass="journalsTableSearchForm"
+                          formPlaceholderText="Search for Journals">
+    </search-page-table>
+    `
+
+})
+export class SearchJournalsTableComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public _location:Location;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.JOURNAL_FIELDS;
+
+  /*public CSV: any = {  "columnNames":  [ "Title", "Type", "Coutries", "Compatibility" ],
+                        "export":[]
+                     };
+  public CSVDownloaded = false;
+  public csvParams: string;
+  public resourcesQuery = "&query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other))";*/
+
+  public disableForms: boolean = false;
+
+  @ViewChild (SearchPageTableViewComponent) searchPage : SearchPageTableViewComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.baseUrl = OpenaireProperties.getLinkToSearchJournalsTable();
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      //this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+      this.filters = this.createFilters();
+      this.searchPage.getParametersFromUrl(params);
+      this._getResults();
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }  }
+    private _getResults(){
+        //this.csvParams = this.resourcesQuery+"&type=datasources";
+
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+      this.disableForms = true;
+      this.results = [];
+      this.searchUtils.totalResults = 0;
+
+      let size: number = 0;
+      this.subResults = this._searchDataprovidersService.searchJournalsTable().subscribe(
+          data => {
+              size = data;
+              if(size > 0) {
+                this.subResults = this._searchDataprovidersService.searchJournals("", null, 1, size, []).subscribe(
+                    data => {
+                        this.searchUtils.totalResults = data[0];
+                        console.info("search Journals [total results:"+this.searchUtils.totalResults+"]");
+                        this.results = data[1];
+
+                        this.searchPage.checkSelectedFilters(this.filters);
+
+                        //var errorCodes:ErrorCodes = new ErrorCodes();
+                        this.searchUtils.status = this.errorCodes.DONE;
+                        if(this.searchUtils.totalResults == 0 ){
+                          this.searchUtils.status = this.errorCodes.NONE;
+                        }
+                        this.disableForms = false;
+                    },
+                    err => {
+                        console.log(err);
+                         //TODO check erros (service not available, bad request)
+                        // if( ){
+                        //   this.searchUtils.status = ErrorCodes.ERROR;
+                        // }
+                        //var errorCodes:ErrorCodes = new ErrorCodes();
+                        //this.searchUtils.status = errorCodes.ERROR;
+                        if(err.status == '404') {
+                          this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                        } else if(err.status == '500') {
+                          this.searchUtils.status = this.errorCodes.ERROR;
+                        } else {
+                          this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                        }
+
+                        this.disableForms = false;
+
+                    }
+                );
+              } else {
+                this.searchPage.checkSelectedFilters(this.filters);
+
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                this.searchUtils.status = this.errorCodes.NONE;
+                this.disableForms = false;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+
+    }
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  private createFilters():Filter[] {
+    var filter_names=["Type","Compatibility Level"];
+    var filter_ids=["datasourcetypeuiid","datasourcecompatibilityname"];
+    var searchFields = new SearchFields();
+    var filter_original_ids = searchFields.JOURNAL_FIELDS;
+    var value_names=[
+      /*[
+      "Institutional Publication Repository","Thematic Publication Repository", "Other Publication Repository",
+     "Institutional Repositories Aggregators",
+     "Thematic Repositories Aggregators", "Other Repositories Aggregators",
+      "Data Repositories", "Data Repositories Aggregators", "Journals", "Journals Aggregators", "CRIS Systems", "Publication Catalogues"],
+      */
+      ["Journal", "Journal Aggregator\/Publisher"],
+
+
+
+
+      ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+
+    var value_original_ids=[
+      ["pubsrepository::journal", "aggregator::pubsrepository::journals"],
+      //["driver","openaire2.0", "driver-openaire2.0", "openaire3.0","openaire2.0_data"]
+    ["OpenAIRE Basic (DRIVER OA)","OpenAIRE 2.0 (EC funding)", "OpenAIRE 2.0+ (DRIVER OA, EC funding)", "OpenAIRE 3.0 (OA, funding)","OpenAIRE Data (funded, referenced datasets)"]];
+    var filters: Filter[] =[];
+    for(var i =0 ; i < filter_names.length;i++){
+      var values:Value[] = [];
+      for(var j =0 ; j < value_names[i].length;j++){
+        var value:Value = {name: value_names[i][j], id: value_original_ids[i][j], number:j, selected:false}
+        values.push(value);
+      }
+       var filter:Filter = {title: filter_names[i], filterId: filter_ids[i], originalFilterId:  filter_original_ids[i], values : values, countSelectedValues:0, "filterOperator": 'or' };
+       filters.push(filter);
+    }
+    return filters;
+    }
+}
diff --git a/searchPages/dataProviders/journalsTable.module.ts b/searchPages/dataProviders/journalsTable.module.ts
new file mode 100644
index 00000000..2a50de8a
--- /dev/null
+++ b/searchPages/dataProviders/journalsTable.module.ts
@@ -0,0 +1,25 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchJournalsTableComponent} from './journalsTable.component';
+
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageTableViewModule} from '../searchUtils/searchPageTableView.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    DataProvidersServiceModule,
+     SearchFormModule, SearchPageTableViewModule
+
+  ],
+  declarations: [
+    SearchJournalsTableComponent
+   ],
+  exports: [
+    SearchJournalsTableComponent
+     ]
+})
+export class JournalsTableModule { }
diff --git a/searchPages/find/mainSearch.module.ts b/searchPages/find/mainSearch.module.ts
new file mode 100644
index 00000000..ae96d666
--- /dev/null
+++ b/searchPages/find/mainSearch.module.ts
@@ -0,0 +1,40 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+// import{MainSearchRoutingModule} from './mainSearch-routing.module';
+import{SearchComponent} from './search.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+import {SoftwareServiceModule} from '../../services/softwareService.module';
+import {ProjectsServiceModule} from '../../services/projectsService.module';
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+import {OrganizationsServiceModule} from '../../services/organizationsService.module';
+import {BrowseEntitiesModule} from '../searchUtils/browseEntities.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+ 
+import {PiwikServiceModule} from '../../utils/piwik/piwikService.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule,
+    DataProvidersServiceModule, DatasetsServiceModule, SoftwareServiceModule, ProjectsServiceModule,
+    PublicationsServiceModule, OrganizationsServiceModule,
+    BrowseEntitiesModule, SearchFormModule, SearchResultsModule,  PiwikServiceModule
+
+  ],
+  declarations: [
+    SearchComponent
+   ],
+  providers:[
+    //FreeGuard, PreviousRouteRecorder
+    ],
+  exports: [
+    SearchComponent
+     ]
+})
+export class MainSearchModule { }
diff --git a/searchPages/find/search.component.html b/searchPages/find/search.component.html
new file mode 100644
index 00000000..16d936d9
--- /dev/null
+++ b/searchPages/find/search.component.html
@@ -0,0 +1,241 @@
+
+
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+<div uk-grid uk-grid>
+<div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+<div  class="">
+
+    <div class="uk-width-1-1  ">
+      <div    class="uk-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle generalSearchForm">
+       <div   class="uk-width-1-1">
+          <search-form [(keyword)]=keyword (keywordChange)="keywordChanged($event)" placeholderText="Search for research results, software, projects, content providers, organizations in OpenAIRE information space"></search-form>
+        </div>
+      </div>
+    </div>
+    <div  class=" uk-margin-small-top uk-container">
+      <div class="uk-grid uk-margin-top">
+        <ul class=" uk-tab uk-tab-left uk-width-1-5 uk-visible@m" uk-tab="animation: uk-animation-fade">
+                <li *ngIf="showPublications" (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
+                   <a>
+                       Publications
+                       <span   [class]="(fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
+
+                   </a>
+               </li>
+               <li *ngIf="showDatasets" (click)="searchDatasets()" [class]="activeTab == 'research data'?'uk-active':''">
+                   <a>
+                       Research Data
+                       <span   [class]="(fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
+
+                   </a>
+               </li>
+               <li *ngIf="showSoftware" (click)="searchSoftware()" [class]="activeTab == 'software'?'uk-active':''">
+                   <a>
+                       Software
+                       <span   [class]="(fetchSoftware.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchSoftware.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchSoftware.searchUtils.totalResults :'')}}</span>
+
+                   </a>
+               </li>
+               <li *ngIf="showProjects" (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
+                   <a>
+                       Projects
+                       <span   [class]="(fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
+
+                   </a>
+               </li>
+               <li *ngIf="showDataProviders" (click)="searchDataProviders()" [class]="activeTab == 'content providers'?'uk-active':''">
+                   <a>
+                       Content Providers
+                       <span   [class]="(fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
+
+                   </a>
+               </li>
+               <li *ngIf="showOrganizations" (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
+                   <a>
+                       Organizations
+                       <span   [class]="(fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchOrganizations.searchUtils.totalResults :'')}}</span>
+                   </a>
+               </li>
+            </ul>
+            <div class="uk-hidden@m uk-clearfix uk-width-1-1 uk-margin-bottom">
+            <button class="uk-button uk-button-default uk-hidden@m " type="button">
+              <span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
+            </button>
+
+            <ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #searchtabs; animation: uk-animation-fade" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
+                <li *ngIf="showPublications" (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
+                   <a>
+                       Publications
+                       <span *ngIf = "fetchPublications.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
+                       <span *ngIf = "fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification">{{((keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
+                   </a>
+               </li>
+               <li *ngIf="showDatasets" (click)="searchDatasets()" [class]="activeTab == 'research data'?'uk-active':''">
+                   <a>
+                       Research Data
+                       <span *ngIf = "fetchDatasets.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
+                       <span *ngIf = "fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
+                   </a>
+               </li>
+               <li *ngIf="showSoftware" (click)="searchSoftware()" [class]="activeTab == 'software'?'uk-active':''">
+                   <a>
+                       Software
+                       <span *ngIf = "fetchSoftware.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
+                       <span *ngIf = "fetchSoftware.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchSoftware.searchUtils.totalResults :'')}}</span>
+                   </a>
+               </li>
+               <li *ngIf="showProjects" (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
+                   <a>
+                       Projects
+                       <span *ngIf = "fetchProjects.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
+                       <span *ngIf = "fetchProjects.searchUtils.status != errorCodes.LOADING  && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
+                   </a>
+               </li>
+               <li *ngIf="showDataProviders" (click)="searchDataProviders()" [class]="activeTab == 'content providers'?'uk-active':''">
+                   <a>
+                       Content Providers
+                       <span *ngIf = "fetchDataproviders.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
+                       <span *ngIf = "fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
+                   </a>
+               </li>
+               <li  *ngIf="showOrganizations" (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
+                   <a>
+                       Organizations
+                       <span *ngIf = "fetchOrganizations.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
+                       <span *ngIf = "fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0"  class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchOrganizations.searchUtils.totalResults :'')}}</span>
+                   </a>
+               </li>
+
+            </ul>
+            </div>
+
+            <!--ul id="searchtabs" class="uk-switcher  uk-width-1-1 uk-margin-top custom-tab-content-large">
+                 <li-->
+            <div  class="uk-width-expand  custom-tab-content-large">
+              <div *ngIf = "activeTab=='publications' && showPublications">
+                  <div *ngIf = "keyword.length > 0  && activeTab=='publications'" class ="uk-animation-fade">
+                    <div class = "uk-text-right" *ngIf = "fetchPublications.searchUtils.totalResults> 10">
+                        <!--a [href] = "linkToSearchPublications"-->
+                          <a  [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
+                                            routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications" class="uk-button uk-button-text">
+                            View all {{fetchPublications.searchUtils.totalResults}} results
+                          </a>
+                        </div>
+                    <search-result  [(results)]="fetchPublications.results"
+                                    [(status)]= "fetchPublications.searchUtils.status" showLoading = true
+                                    type="publication" urlParam="articleId">
+                    </search-result>
+                  </div>
+                  <div *ngIf = "keyword.length == 0 && activeTab=='publications'" class ="uk-animation-fade" >
+                          <browse-entities entityName="publication" baseUrl="/search/find/publications" [refineFields]=searchFields.RESULT_REFINE_FIELDS></browse-entities>
+                  </div>
+                <!--/li>
+                <li-->
+                </div>
+                <div *ngIf = "activeTab=='research data' && showDatasets" >
+                  <div *ngIf = "keyword.length > 0  && activeTab=='research data'" class ="uk-animation-fade">
+                    <div class = "uk-text-right" *ngIf = "fetchDatasets.searchUtils.totalResults> 10">
+                      <!--a [href] = "linkToSearchDatasets"-->
+                      <a  [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
+                                        routerLinkActive="router-link-active" [routerLink]="linkToSearchDatasets" class="uk-button uk-button-text">
+                        View all {{fetchDatasets.searchUtils.totalResults}} results
+                      </a>
+                    </div>
+                    <search-result  [(results)]="fetchDatasets.results"
+                                    [(status)]= "fetchDatasets.searchUtils.status" showLoading = true
+                                    type="dataset" urlParam="datasetId">
+                    </search-result>
+                    </div>
+                    <div *ngIf = "keyword.length == 0 && activeTab=='research data'" class ="uk-animation-fade">
+                            <browse-entities entityName="dataset" baseUrl="/search/find/datasets" [refineFields]=searchFields.RESULT_REFINE_FIELDS></browse-entities>
+                    </div>
+                <!--/li>
+                <li-->
+                </div>
+                <div *ngIf = "activeTab=='software' && showSoftware" >
+                  <div *ngIf = "keyword.length > 0  && activeTab=='software'" class ="uk-animation-fade">
+                    <div class = "uk-text-right" *ngIf = "fetchSoftware.searchUtils.totalResults> 10">
+                      <a  [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
+                                        routerLinkActive="router-link-active" [routerLink]="linkToSearchSoftware" class="uk-button uk-button-text">
+                        View all {{fetchSoftware.searchUtils.totalResults}} results
+                      </a>
+                    </div>
+                    <search-result  [(results)]="fetchSoftware.results"
+                                    [(status)]= "fetchSoftware.searchUtils.status" showLoading = true
+                                    type="software" urlParam="softwareId">
+                    </search-result>
+                    </div>
+                    <div *ngIf = "keyword.length == 0 && activeTab=='software'" class ="uk-animation-fade">
+                            <browse-entities entityName="software" baseUrl="/search/find/software" [refineFields]=searchFields.RESULT_REFINE_FIELDS></browse-entities>
+                    </div>
+                <!--/li>
+                <li-->
+                </div>
+                <div  *ngIf = "activeTab=='projects' && showProjects">
+                  <div *ngIf = "keyword.length > 0 && activeTab=='projects'" class ="uk-animation-fade">
+                    <div class = "uk-text-right" *ngIf = "fetchProjects.searchUtils.totalResults> 10">
+                      <!--a [href] = "linkToSearchProjects"-->
+                      <a  [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
+                                        routerLinkActive="router-link-active" [routerLink]="linkToSearchProjects" class="uk-button uk-button-text">
+                        View all {{fetchProjects.searchUtils.totalResults}} results
+                      </a>
+                    </div>
+                    <search-result  [(results)]="fetchProjects.results"
+                                    [(status)]= "fetchProjects.searchUtils.status" showLoading = true
+                                    type="project" urlParam="projectId">
+                    </search-result>
+                  </div>
+                  <div *ngIf = "keyword.length == 0 && activeTab=='projects'" class ="uk-animation-fade">
+                          <browse-entities entityName="project" baseUrl="/search/find/projects" [refineFields]=searchFields.PROJECT_REFINE_FIELDS></browse-entities>
+                  </div>
+                  <!--/li>
+                  <li-->
+                  </div>
+                  <div  *ngIf = "activeTab=='content providers' && showDataProviders">
+                  <div *ngIf = "keyword.length > 0 && activeTab=='content providers'" class ="uk-animation-fade">
+                    <div class = "uk-text-right" *ngIf = "fetchDataproviders.searchUtils.totalResults> 10">
+                      <!--a [href] = "linkToSearchDataproviders"-->
+                      <a  [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
+                                        routerLinkActive="router-link-active" [routerLink]="linkToSearchDataproviders" class="uk-button uk-button-text">
+                        View all {{fetchDataproviders.searchUtils.totalResults}} results
+                      </a>
+                    </div>
+                    <search-result  [(results)]="fetchDataproviders.results"
+                                    [(status)]= "fetchDataproviders.searchUtils.status" showLoading = true
+                                    type="dataprovider" urlParam="datasourceId">
+                    </search-result>
+                  </div>
+                  <div *ngIf = "keyword.length == 0 && activeTab=='content providers'" class ="uk-animation-fade" >
+                          <browse-entities entityName="dataprovider" baseUrl="/search/find/dataproviders" [refineFields]=searchFields.DATASOURCE_REFINE_FIELDS></browse-entities>
+                  </div>
+                  <!--/li>
+                  <li-->
+                  </div>
+                  <div *ngIf = "activeTab=='organizations' && showOrganizations">
+                  <div *ngIf = "keyword.length > 0" class ="uk-animation-fade">
+                    <div class = "uk-text-right" *ngIf = "fetchOrganizations.searchUtils.totalResults> 10">
+          <!--a [href] = "linkToSearchOrganizations"-->
+                        <a  [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
+                            routerLinkActive="router-link-active" [routerLink]="linkToSearchOrganizations" class="uk-button uk-button-text">
+                              View all {{fetchOrganizations.searchUtils.totalResults}} results
+                    </a>
+                   </div>
+                    <search-result  [(results)]="fetchOrganizations.results"
+                                    [(status)]= "fetchOrganizations.searchUtils.status" showLoading = true
+                                    type="organization" urlParam="organizationId">
+                    </search-result>
+                  </div>
+                  <div *ngIf = "keyword.length == 0" class ="uk-animation-fade">
+                          <browse-entities entityName="organization" baseUrl="/search/find/organizations" [refineFields]=searchFields.ORGANIZATION_REFINE_FIELDS></browse-entities>
+                  </div>
+
+              </div>
+            </div>
+        </div>
+                <!--/li>
+
+            </ul-->
+    </div>
+  </div>
+</div>
+</div>
diff --git a/searchPages/find/search.component.ts b/searchPages/find/search.component.ts
new file mode 100644
index 00000000..7e713828
--- /dev/null
+++ b/searchPages/find/search.component.ts
@@ -0,0 +1,400 @@
+import {Component, Input, Output, EventEmitter, ViewChild, ChangeDetectionStrategy, ViewEncapsulation} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ActivatedRoute, Router} from '@angular/router';
+import {Location} from '@angular/common';
+
+import { Meta, MetaDefinition} from '../../../angular2-meta';
+
+import { FetchPublications } from '../../utils/fetchEntitiesClasses/fetchPublications.class';
+import { FetchDataproviders } from  '../../utils/fetchEntitiesClasses/fetchDataproviders.class';
+import { FetchProjects } from  '../../utils/fetchEntitiesClasses/fetchProjects.class';
+import { FetchDatasets } from '../../utils/fetchEntitiesClasses/fetchDatasets.class';
+import { FetchSoftware } from '../../utils/fetchEntitiesClasses/fetchSoftware.class';
+import { FetchOrganizations } from '../../utils/fetchEntitiesClasses/fetchOrganizations.class';
+
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchProjectsService} from '../../services/searchProjects.service';
+import {SearchDatasetsService} from '../../services/searchDatasets.service';
+import {SearchSoftwareService} from '../../services/searchSoftware.service';
+import {SearchOrganizationsService} from '../../services/searchOrganizations.service';
+
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {ErrorCodes} from '../../utils/properties/openaireProperties';
+import {RouterHelper} from '../../utils/routerHelper.class';
+import {RefineFieldResultsService} from '../../services/refineFieldResults.service';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+import { ConfigurationService } from '../../utils/configuration/configuration.service';
+
+@Component({
+  changeDetection: ChangeDetectionStrategy.Default,
+  encapsulation: ViewEncapsulation.Emulated,
+    selector: 'search-find',
+    templateUrl: 'search.component.html'
+})
+export class SearchComponent {
+  public sub: any; piwiksub: any;
+  public reloadPublications: boolean;
+  public reloadDatasets: boolean;
+  public reloadSoftware: boolean;
+  public reloadProjects: boolean;
+  public reloadDataproviders: boolean;
+  public reloadOrganizations: boolean;
+
+
+  public pageTitle = "Search in OpenAIRE"
+  public keyword:string = "";
+  public publications:string[];
+  public datasets:string[];
+  public software:string[];
+  public projectsTab:string[];
+  public dataproviders:string[];
+  public organizations:string[];
+
+  public activeTab = "publications";
+  public linkToSearchPublications = "";
+  public linkToSearchProjects = "";
+  public linkToSearchDataproviders = "";
+  public linkToSearchDatasets = "";
+  public linkToSearchSoftware = "";
+  public linkToSearchOrganizations = "";
+
+  public fetchPublications : FetchPublications;
+  public fetchDataproviders : FetchDataproviders;
+  public fetchProjects : FetchProjects;
+  public fetchDatasets: FetchDatasets;
+  public fetchSoftware: FetchSoftware;
+  public fetchOrganizations: FetchOrganizations;
+
+  public searchFields:SearchFields = new SearchFields();
+  public errorCodes:ErrorCodes = new ErrorCodes();
+  public routerHelper:RouterHelper = new RouterHelper();
+
+  public publicationsSize:any = null;
+  public datasetsSize:any = null;
+  public softwareSize:any = null;
+  public fundersSize:any = null;
+  public projectsSize:any = null;
+  public datasourcesSize:any = null;
+  showPublications:boolean= false;
+  showDatasets:boolean= false;
+  showSoftware:boolean=false;
+  showProjects:boolean= false;
+  showDataProviders:boolean= false;
+  showOrganizations:boolean= false;
+public subPub;public subData;public subProjects;public subOrg; public subDataPr;
+  constructor ( private route: ActivatedRoute,
+      private _router: Router,
+      private _searchPublicationsService: SearchPublicationsService,
+      private _searchDataprovidersService: SearchDataprovidersService,
+      private _searchProjectsService: SearchProjectsService,
+      private _searchDatasetsService: SearchDatasetsService,
+      private _searchSoftwareService: SearchSoftwareService,
+      private _searchOrganizationsService: SearchOrganizationsService,
+      private _refineFieldResultsService:RefineFieldResultsService,
+      private location: Location, private _meta: Meta,private _piwikService:PiwikService,
+      private config: ConfigurationService ) {
+          this.fetchPublications = new FetchPublications(this._searchPublicationsService);
+          this.fetchDataproviders = new FetchDataproviders(this._searchDataprovidersService);
+          this.fetchProjects = new FetchProjects(this._searchProjectsService);
+          this.fetchDatasets = new FetchDatasets( this._searchDatasetsService);
+          this.fetchSoftware = new FetchSoftware(this._searchSoftwareService);
+          this.fetchOrganizations = new FetchOrganizations( this._searchOrganizationsService);
+
+          var description = "open access, research, scientific publication, European Commission, EC, FP7, ERC, Horizon 2020, H2020, search, projects ";
+
+          var title = "OpenAIRE | Search publications, research data, projects... | OpenAIRE";
+
+          var url = OpenaireProperties.getBaseLink()+this._router.url;
+          this._meta.setTitle(title);
+          this._meta.updateMeta("description", description);
+          this._meta.updateProperty("og:description", description);
+          this._meta.updateProperty("og:title", title);
+          this._meta.updateProperty("og:url", url);
+          if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+            this.piwiksub = this._piwikService.trackView("OpenAIRE |Search publications, research data, projects...").subscribe();
+
+          }
+
+
+
+  }
+
+  public ngOnInit() {
+    const entityOne = this.config.isEntityEnabled("publication");
+    const entityTwo = this.config.isEntityEnabled("dataset");
+    const entityThree = this.config.isEntityEnabled("project");
+    const entityFour = this.config.isEntityEnabled("organization");
+    const entityFive = this.config.isEntityEnabled("datasource");
+    const entitySix = this.config.isEntityEnabled("software");
+    const example = Observable.zip(entityOne,entityTwo,entityThree,entityFour,entityFive,entitySix);
+
+//wait until all observables have emitted a value then emit all as an array
+    this.sub =  this.route.queryParams.subscribe(params => {
+      const subscribe = example.subscribe(data => {
+         this.showPublications =  data[0];
+         this.showDatasets =  data[1];
+         this.showProjects =  data[2];
+         this.showOrganizations =  data[3];
+         this.showDataProviders =  data[4];
+         this.showSoftware = data[5];
+          console.log(data)
+          this.keyword = (params['keyword'])?params['keyword']:"";
+          if(this.keyword !=null && this.keyword.length > 0){
+            this.reloadTabs();
+            //if showPublications == false will set another entity as the first
+            if(this.showPublications){
+              this.activeTab = "publications";
+              this.searchPublications();
+            }else if(this.showDatasets){
+              this.activeTab = "research data";
+              this.searchDatasets();
+            }else if(this.showSoftware){
+              this.activeTab = "software";
+              this.searchSoftware();
+            }else if(this.showProjects){
+              this.activeTab = "projects";
+              this.searchProjects();
+            }else if(this.showDataProviders){
+              this.activeTab = "content providers";
+              this.searchDataProviders();
+            }else if(this.showOrganizations){
+              this.activeTab = "organizations";
+              this.searchOrganizations();
+            }
+            this.count();
+          }
+        });
+      });
+
+  }
+  public ngOnDestroy() {
+    this.sub.unsubscribe();
+    if(this.piwiksub){
+  this.piwiksub.unsubscribe();
+}
+    if(this.keyword !=null && this.keyword.length > 0){
+        if(this.subPub){
+          this.subPub.unsubscribe();
+        }
+        if(this.subData){
+          this.subData.unsubscribe();
+        }
+        if(this.subProjects){
+          this.subProjects.unsubscribe();
+        }
+        if(this.subOrg){
+          this.subOrg.unsubscribe();
+        }
+        if(this.subDataPr){
+          this.subDataPr.unsubscribe();
+        }
+
+    }
+  }
+  public searchPublications() {
+    this.activeTab = "publications";
+    if( this.reloadPublications &&
+        this.fetchPublications.searchUtils.status != this.errorCodes.NONE &&
+        this.fetchPublications.searchUtils.status != this.errorCodes.ERROR) {
+      this.reloadPublications = false;
+      this.fetchPublications.getResultsByKeyword(this.keyword,  1, 10);
+      this.linkToSearchPublications = OpenaireProperties.getLinkToSearchPublications();// + "?keyword="  + this.keyword;
+    }
+   }
+   public searchDatasets() {
+     this.activeTab = "research data";
+     if(this.reloadDatasets &&
+        this.fetchDatasets.searchUtils.status != this.errorCodes.NONE &&
+        this.fetchDatasets.searchUtils.status != this.errorCodes.ERROR) {
+       this.reloadDatasets = false;
+       this.fetchDatasets.getResultsByKeyword(this.keyword,  1, 10);
+       this.linkToSearchDatasets = OpenaireProperties.getLinkToSearchDatasets();// + "?keyword="  + this.keyword;
+     }
+   }
+   public searchSoftware() {
+     this.activeTab = "software";
+     if(this.reloadSoftware &&
+        ( this.fetchSoftware.searchUtils.status == this.errorCodes.LOADING ||
+          this.fetchSoftware.searchUtils.status == this.errorCodes.DONE )) {
+       this.reloadSoftware = false;
+       this.fetchSoftware.getResultsByKeyword(this.keyword,  1, 10);
+       this.linkToSearchSoftware = OpenaireProperties.getLinkToSearchSoftware();// + "?keyword="  + this.keyword;
+     }
+   }
+   public  searchProjects() {
+     this.activeTab = "projects";
+     if(this.reloadProjects &&
+        this.fetchProjects.searchUtils.status != this.errorCodes.NONE &&
+        this.fetchProjects.searchUtils.status != this.errorCodes.ERROR) {
+       this.reloadProjects = false;
+       this.fetchProjects.getResultsByKeyword(this.keyword,  1, 10);
+       this.linkToSearchProjects = OpenaireProperties.getLinkToSearchProjects();// + "?keyword="  + this.keyword;
+     }
+   }
+   public  searchDataProviders() {
+     this.activeTab = "content providers";
+     if( this.reloadDataproviders &&
+         this.fetchDataproviders.searchUtils.status != this.errorCodes.NONE &&
+         this.fetchDataproviders.searchUtils.status != this.errorCodes.ERROR) {
+       this.reloadDataproviders = false;
+       this.fetchDataproviders.getResultsByKeyword(this.keyword, 1, 10);
+       this.linkToSearchDataproviders = OpenaireProperties.getLinkToSearchDataProviders();// + "?keyword="  + this.keyword;
+     }
+   }
+   public searchOrganizations() {
+     this.activeTab = "organizations";
+     if( this.reloadOrganizations &&
+         this.fetchOrganizations.searchUtils.status != this.errorCodes.NONE &&
+         this.fetchOrganizations.searchUtils.status != this.errorCodes.ERROR) {
+       this.reloadOrganizations = false;
+       this.fetchOrganizations.getResultsByKeyword(this.keyword,  1, 10);
+       this.linkToSearchOrganizations = OpenaireProperties.getLinkToSearchOrganizations();// + "?keyword="  + this.keyword;
+     }
+   }
+
+
+   public keywordChanged($event){
+
+    this.keyword = $event.value;
+    console.info("Search Find: search with keyword \"" +  this.keyword + "\"" );
+      this.location.go(location.pathname,"?keyword="  + this.keyword);
+    this.reloadTabs();
+    if(this.activeTab == "publications") {
+      this.searchPublications();
+    }
+    if(this.activeTab == "projects") {
+      this.searchProjects();
+    }
+    if(this.activeTab == "content providers") {
+      this.searchDataProviders();
+    }
+    if(this.activeTab == "research data") {
+      this.searchDatasets();
+    }
+    if(this.activeTab == "software") {
+      this.searchSoftware();
+    }
+    if(this.activeTab == "organizations") {
+      this.searchOrganizations();
+    }
+
+    this.count();
+   }
+
+   private count() {
+     if(this.activeTab != "publications" && this.showPublications){
+      this.fetchPublications.searchUtils.status = this.errorCodes.LOADING;
+      this.fetchPublications.results = [];
+      this.subPub = this._searchPublicationsService.numOfSearchPublications(this.keyword).subscribe(
+             data => {
+                console.log("Count results: "+data);
+                 this.fetchPublications.searchUtils.totalResults = data;
+                 this.fetchPublications.searchUtils.status = this.errorCodes.DONE;
+                 if(this.fetchPublications.searchUtils.totalResults == 0) {
+                   this.fetchPublications.searchUtils.status = this.errorCodes.NONE;
+                 }
+             },
+             err => {
+       		    console.log(err);
+              this.fetchPublications.searchUtils.status = this.errorCodes.ERROR;
+       		 }
+      );
+    }
+    if(this.activeTab != "research data" && this.showDatasets){
+       this.fetchDatasets.searchUtils.status = this.errorCodes.LOADING;
+       this.fetchDatasets.results = [];
+       this.subData = this._searchDatasetsService.numOfSearchDatasets(this.keyword).subscribe(
+             data => {
+                 this.fetchDatasets.searchUtils.totalResults = data;
+                 this.fetchDatasets.searchUtils.status = this.errorCodes.DONE;
+                 if(this.fetchDatasets.searchUtils.totalResults == 0) {
+                   this.fetchDatasets.searchUtils.status = this.errorCodes.NONE;
+                 }
+             },
+             err => {
+                 console.log(err);
+                 this.fetchDatasets.searchUtils.status = this.errorCodes.ERROR;
+              }
+       );
+    }
+    if(this.activeTab != "software" && this.showSoftware){
+       this.fetchSoftware.searchUtils.status = this.errorCodes.LOADING;
+       this.fetchSoftware.results = [];
+       this.subData = this._searchSoftwareService.numOfSearchSoftware(this.keyword).subscribe(
+             data => {
+                 this.fetchSoftware.searchUtils.totalResults = data;
+                 this.fetchSoftware.searchUtils.status = this.errorCodes.DONE;
+                 if(this.fetchSoftware.searchUtils.totalResults == 0) {
+                   this.fetchSoftware.searchUtils.status = this.errorCodes.NONE;
+                 }
+             },
+             err => {
+                 console.log(err);
+                 if(err.status == '404') {
+                   this.fetchSoftware.searchUtils.status = this.errorCodes.NOT_FOUND;
+                 } else if(err.status == '500') {
+                   this.fetchSoftware.searchUtils.status = this.errorCodes.ERROR;
+                 } else {
+                   this.fetchSoftware.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                 }
+                 //this.fetchSoftware.searchUtils.status = this.errorCodes.ERROR;
+              }
+       );
+    }
+    if(this.activeTab != "projects" && this.showProjects){
+      this.fetchProjects.searchUtils.status = this.errorCodes.LOADING;
+      this.fetchProjects.results = [];
+      this.subProjects = this._searchProjectsService.numOfSearchProjects(this.keyword).subscribe(
+             data => {
+                 this.fetchProjects.searchUtils.totalResults = data;
+                 this.fetchProjects.searchUtils.status = this.errorCodes.DONE;
+                 if(this.fetchProjects.searchUtils.totalResults == 0) {
+                   this.fetchProjects.searchUtils.status = this.errorCodes.NONE;
+                 }
+             },
+             err => {
+                 console.log(err);
+                 this.fetchProjects.searchUtils.status = this.errorCodes.ERROR;
+              }
+       );
+     }
+     if(this.activeTab != "content providers" && this.showDataProviders){
+       this.fetchDataproviders.results = [];
+       this.fetchDataproviders.getNumForSearch(this.keyword);
+     }
+      if(this.activeTab != "organizations" && this.showOrganizations){
+       this.fetchOrganizations.searchUtils.status = this.errorCodes.LOADING;
+       this.fetchOrganizations.results = [];
+       this.subOrg = this._searchOrganizationsService.numOfSearchOrganizations(this.keyword).subscribe(
+             data => {
+                 this.fetchOrganizations.searchUtils.totalResults = data;
+                 this.fetchOrganizations.searchUtils.status = this.errorCodes.DONE;
+                 if(this.fetchOrganizations.searchUtils.totalResults == 0) {
+                   this.fetchOrganizations.searchUtils.status = this.errorCodes.NONE;
+                 }
+             },
+             err => {
+                 console.log(err);
+                 this.fetchOrganizations.searchUtils.status = this.errorCodes.ERROR;
+
+              }
+         );
+       }
+
+
+   }
+
+   private reloadTabs() {
+       this.reloadPublications = true;
+       this.reloadDatasets = true;
+       this.reloadSoftware = true;
+       this.reloadProjects = true;
+       this.reloadDataproviders = true;
+       this.reloadOrganizations = true;
+   }
+
+
+
+}
diff --git a/searchPages/searchUtils/advancedSearchForm.component.html b/searchPages/searchUtils/advancedSearchForm.component.html
new file mode 100644
index 00000000..938ca3cd
--- /dev/null
+++ b/searchPages/searchUtils/advancedSearchForm.component.html
@@ -0,0 +1,56 @@
+
+    <form [class]="(isDisabled )?'uk-disabled advancedSearchForm uk-tile  uk-tile-muted':'advancedSearchForm uk-tile  uk-tile-muted'">
+    <table  class=" uk-table uk-table-responsive" >
+        <tr *ngFor="let selectedField of selectedFields; let i = index" class="-row  ">
+                <td *ngIf ="i==0 " class="">Search for:</td>
+
+                <td *ngIf = "i != 0" class=""><select [(ngModel)]="selectedField.operatorId" name="selectOp_{{i}}" >
+                      <option *ngFor="let op of operators" (change)="fieldOperatorChanged(i, op.id, op.id)" (click)="fieldOperatorChanged(i, op.id, op.id)" [value]="op.id">{{op.id}}</option>
+                </select></td>
+                <td ><select [(ngModel)]="selectedField.id" name="selectField_{{i}}"  (ngModelChange)="fieldIdsChanged(i,selectedField.id)" ><!--(click)="fieldIdsChanged(i)"  -->
+                  <option *ngFor="let id of fieldIds"  [value]="id" >{{fieldIdsMap[id].name}} </option>
+                </select> </td>
+                <td *ngIf = "selectedField.type == 'keyword'"  ><input  type="text" class="form-control" placeholder="Type keywords..."
+                    [(ngModel)]="selectedField.value" name="value[{{i}}]"></td>
+                <td *ngIf = "selectedField.type == 'date'" >
+                <date-filter [(dateValue)]=selectedField.dateValue ></date-filter>
+                </td>
+                <td *ngIf = " selectedField.id && selectedField.type == 'vocabulary'"  >
+                  <static-autocomplete *ngIf = " selectedField.id" [(vocabularyId)] = selectedField.param [fieldId]=selectedField.id
+                    [(list)] = this.fieldList[selectedField.id]  [entityName] = "entityType" [selectedValue]=selectedField.value [showSelected]=true
+                     [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name"   [multipleSelections]=false
+                     (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete>
+                </td>
+                <td  *ngIf = "  selectedField.id &&  selectedField.type == 'refine'" >
+                  <static-autocomplete [(list)] = this.fieldList[selectedField.id] [fieldId]=selectedField.id [entityName] = "entityType" [fieldName] = [selectedField.id] [selectedValue]=selectedField.value [showSelected]=true [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name"  [multipleSelections]=false (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete></td>
+                <td  *ngIf = "selectedField.type == 'entity'"  ><entities-autocomplete  [fieldId]=selectedField.id [entityType]=selectedField.param   [selectedValue]=selectedField.value [showSelected]=true
+                   [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name"  [multipleSelections]=false
+                    (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)" >
+                </entities-autocomplete></td>
+
+                <td *ngIf = "selectedField.type == 'boolean'" class="input-group"  >
+                   <span class="input-group-addon">
+                      <input type="radio" [(ngModel)]="selectedField.value"  [name]=selectedField.param value="true">Yes<br>
+                  </span>
+                  <span class="input-group-addon">
+                    <input type="radio" [(ngModel)]="selectedField.value"  [name]=selectedField.param value="false">No<br>
+                  </span>
+              </td>
+              <td class=" " >
+                <span *ngIf="selectedFields.length > 1" type="button" class="uk-icon-button" (click)="removeField(i)">
+                  <span class=""><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg></span>
+                </span>
+                <span *ngIf="selectedFields.length == 1" type="button" class="uk-icon-button"  disabled>
+                  <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg></span>
+                </span>
+              </td>
+              <td *ngIf="i == selectedFields.length-1 " class=" "><span type="button" class="uk-icon-button" (click)="addField()">
+                  <span><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></span>
+              </span></td>
+        </tr>
+        </table>
+        <div  class="-row uk-text-right">
+          <button (click)="queryChanged()"  type="submit" class="uk-button uk-button-primary">Search</button>
+        </div>
+
+    </form>
diff --git a/searchPages/searchUtils/advancedSearchForm.component.ts b/searchPages/searchUtils/advancedSearchForm.component.ts
new file mode 100644
index 00000000..3700ab57
--- /dev/null
+++ b/searchPages/searchUtils/advancedSearchForm.component.ts
@@ -0,0 +1,95 @@
+import {Component, Input, Output, EventEmitter, ElementRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import { Subject } from 'rxjs/Subject';
+
+import {AdvancedField, OPERATOR} from '../searchUtils/searchHelperClasses.class';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {Dates} from '../../utils/string-utils.class';
+
+@Component({
+    selector: 'advanced-search-form',
+    templateUrl: 'advancedSearchForm.component.html'
+})
+export class AdvancedSearchFormComponent {
+  @Input() entityType;
+  @Input() fieldIds:  string[];
+  @Input() fieldIdsMap;
+  @Input() selectedFields:AdvancedField[];
+  @Input() isDisabled: boolean = false;
+
+  @Output() queryChange  = new EventEmitter();
+  newFieldId:string;
+  newFieldName:string;
+  fieldList:{[id:string]:any[]} = {};
+  public searchFields:SearchFields = new SearchFields();
+
+  public operators:  [{name:string, id:string}] = this.searchFields.ADVANCED_SEARCH_OPERATORS;
+    constructor () {
+     }
+
+    ngOnInit() {
+      for(var i = 0; i < this.fieldIds.length; i++){
+        this.fieldList[this.fieldIds[i]]=[];
+      }
+      this.newFieldId = this.fieldIds[0];
+      this.newFieldName = this.fieldIdsMap[this.newFieldId].name;
+     }
+
+    queryChanged() {
+        this.queryChange.emit({
+            // selectedFields: this.selectedFields,
+            // selectedQuantifiers: this.selectedQuantifiers,
+            // keywords: this.keywords
+        });
+    }
+
+    addField() {
+        this.newFieldId = this.fieldIds[0];
+        var type = this.fieldIdsMap[this.newFieldId].type;
+        if(type == "boolean"){
+          this.selectedFields.push(new AdvancedField(this.newFieldId,this.fieldIdsMap[this.newFieldId].param, this.fieldIdsMap[this.newFieldId].name, type, "true", "and"));
+        }else{
+          this.selectedFields.push(new AdvancedField(this.newFieldId, this.fieldIdsMap[this.newFieldId].param,this.fieldIdsMap[this.newFieldId].name, type, "", "and"));
+        }
+
+    }
+
+    removeField(index: number) {
+        this.selectedFields.splice(index, 1);
+
+    }
+
+    fieldOperatorChanged(index: number, operatorId: string, operatorName: string) {
+         this.selectedFields[index].operatorId = operatorId;
+         this.selectedFields[index].operatorName = operatorName;
+    }
+    validateDate(index: number, value: string){
+      this.selectedFields[index].valid = Dates.isValidYear(value);
+    }
+
+    fieldIdsChanged(index: number, fieldId:string ) {
+      console.log("Field index::"+index + "  " + this.selectedFields[index].id + " function id:" +fieldId);
+
+          var id= this.fieldIds[0];
+          this.selectedFields[index].name = this.fieldIdsMap[id].name;
+         this.selectedFields[index].type = this.fieldIdsMap[id].type;
+         this.selectedFields[index].value = "";
+         this.selectedFields[index].param = this.fieldIdsMap[id].param;
+
+         var id =fieldId;//this.selectedFields[index].id;
+         this.selectedFields[index].name = this.fieldIdsMap[id].name;
+         this.selectedFields[index].type = this.fieldIdsMap[id].type;
+         this.selectedFields[index].value = "";
+         this.selectedFields[index].param = this.fieldIdsMap[id].param;
+         if(this.fieldIdsMap[id].type == "boolean"){
+           this.selectedFields[index].value = "true";
+         }
+    }
+    valueChanged($event,index:number){
+      this.selectedFields[index].value = $event.value;
+    }
+    listUpdated($event,fieldId:number){
+      this.fieldList[fieldId] = $event.value;
+    }
+
+}
diff --git a/searchPages/searchUtils/advancedSearchForm.module.ts b/searchPages/searchUtils/advancedSearchForm.module.ts
new file mode 100644
index 00000000..1ee2f437
--- /dev/null
+++ b/searchPages/searchUtils/advancedSearchForm.module.ts
@@ -0,0 +1,26 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{AdvancedSearchFormComponent} from './advancedSearchForm.component';
+import {EntitiesAutocompleteModule} from '../../utils/entitiesAutoComplete/entitiesAutoComplete.module';
+import {StaticAutocompleteModule} from '../../utils/staticAutoComplete/staticAutoComplete.module';
+import {DateFilterModule} from './dateFilter.module';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,    EntitiesAutocompleteModule,   StaticAutocompleteModule, DateFilterModule
+  ],
+  declarations: [
+    AdvancedSearchFormComponent,
+],
+
+  providers:[
+  ],
+  exports: [
+    AdvancedSearchFormComponent
+
+    ]
+})
+export class AdvancedSearchFormModule { }
diff --git a/searchPages/searchUtils/advancedSearchPage.component.html b/searchPages/searchUtils/advancedSearchPage.component.html
new file mode 100644
index 00000000..bea9e58f
--- /dev/null
+++ b/searchPages/searchUtils/advancedSearchPage.component.html
@@ -0,0 +1,61 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle">
+  <div uk-grid uk-grid>
+    <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+      <div class="uk-container uk-margin-top">
+        <div class="uk-article-title custom-article-title">
+          {{pageTitle}}
+        </div>
+        <div>
+          <a  *ngIf = "simpleSearchLink && simpleSearchLink.length > 0" routerLinkActive="router-link-active" [routerLink]=simpleSearchLink  [class]="(disableForms)?'uk-float-right uk-disabled uk-link-muted':'uk-float-right'" >Simple search <span class="uk-icon">
+            <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+          </span></a>
+          <advanced-search-form
+              [entityType] = "entityType"
+              [(fieldIds)]="fieldIds"
+              [(fieldIdsMap)]="fieldIdsMap"
+              [(selectedFields)]="selectedFields"
+              (queryChange)="queryChanged($event)"
+              [isDisabled]="disableForms">
+          </advanced-search-form>
+          <div class="uk-width-1-1">
+            <helper position="top"></helper>
+          </div>
+          <div class="uk-width-1-1 uk-grid helper-grid" >
+            <helper class="helper-left-right uk-visible@m" position="left"></helper>
+            <div class="uk-width-expand@m uk-with-1-1@s">
+              <div  class="uk-align-center uk-margin-remove-bottom">
+                <search-paging [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults" [(searchUtils)] = "searchUtils"  [(results)] = "results" [(baseUrl)] = "searchUtils.baseUrl"  [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues"   ></search-paging>
+              </div>
+
+              <search-download *ngIf="searchUtils.totalResults <= 10000" class="uk-width-1-1@s uk-hidden@m" [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults" ></search-download>
+
+              <div class="uk-margin-top">
+                <search-result  [results]="results"
+                                [status]=searchUtils.status
+                                [type]="entityType"
+                                [showLoading]="true">
+                </search-result>
+              </div>
+              <div  class="uk-align-center uk-margin-remove-bottom">
+                <search-paging [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults" [(searchUtils)] = "searchUtils"  [(results)] = "results" [(baseUrl)] = "searchUtils.baseUrl"  [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues"   ></search-paging>
+              </div>
+
+              <helper class="uk-hidden@m" position="left" styleName="uk-width-1-1@s"></helper>
+              <helper class="uk-hidden@m" position="right" styleName="uk-width-1-1@s"></helper>
+            </div>
+            <div *ngIf="searchUtils.totalResults <= 10000" class="uk-visible@m helper-left-right">
+              <search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults" ></search-download>
+              <helper position="right"></helper>
+            </div>
+            <helper *ngIf="searchUtils.totalResults > 10000" class="helper-left-right uk-visible@m" position="right"></helper>
+          </div>
+
+          <div class="uk-width-1-1">
+            <helper position="bottom"></helper>
+          </div>
+        </div>
+      </div>
+<!--modal-loading [message]= "'Loading results...'"></modal-loading-->
+    </div>
+  </div>
+</div>
diff --git a/searchPages/searchUtils/advancedSearchPage.component.ts b/searchPages/searchUtils/advancedSearchPage.component.ts
new file mode 100644
index 00000000..3ffeffb2
--- /dev/null
+++ b/searchPages/searchUtils/advancedSearchPage.component.ts
@@ -0,0 +1,254 @@
+import {Component, Input, ViewChild, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Location} from '@angular/common';
+import {  Router} from '@angular/router';
+import {Filter, Value,AdvancedField} from '../searchUtils/searchHelperClasses.class';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass} from './searchUtils.class';
+import {ModalLoading} from '../../utils/modal/loading.component';
+import {StringUtils, Dates} from '../../utils/string-utils.class';
+import { Meta} from '../../../angular2-meta';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'advanced-search-page',
+    templateUrl: 'advancedSearchPage.component.html'
+})
+export class AdvancedSearchPageComponent {
+  @Input() pageTitle = "";
+  @Input() results = [];
+  @Input() type;
+  @Input() entityType;
+  @Input() searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  @Input() fieldIds:  string[];
+  @Input() fieldIdsMap;//:{ [key:string]:{ name:string, operator:string, type:string, indexField:string, equalityOperator:string  }} ;
+  @Input() selectedFields:AdvancedField[];
+  @Input() simpleSearchUrl: string;
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  @Input() csvParams: string;
+  @Input() csvPath: string;
+  @Input() simpleSearchLink: string = "";
+  @Input() disableForms:boolean = false;
+  @Input() loadPaging: boolean = true;
+  @Input() oldTotalResults: number = 0;
+
+  piwiksub: any;
+  public parameterNames:string[] =[];
+  public parameterValues:string[] =[];
+
+  public baseURLWithParameters:string = '';
+
+  @Output() queryChange  = new EventEmitter();
+  constructor (private location: Location, private _meta: Meta, private _piwikService:PiwikService, private router: Router) {
+   }
+
+  ngOnInit() {
+    this.updateTitle("Advanced search "+this.pageTitle);
+    this.updateDescription("Openaire, search, repositories, open access, type, content provider, funder, project, "+ this.pageTitle);
+    if(typeof window !== 'undefined') {
+      this.updateUrl(OpenaireProperties.getBaseLink()+location.pathname);
+    }
+
+      this.searchUtils.baseUrl = "/" + this.searchUtils.baseUrl;
+     this.updateBaseUrlWithParameters();
+     if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+       this.piwiksub = this._piwikService.trackView(this.pageTitle).subscribe();
+     }
+  }
+
+  ngOnDestroy() {
+    if(this.piwiksub){
+  this.piwiksub.unsubscribe();
+}
+  }
+  updateDescription(description:string){
+    this._meta.updateMeta("description", description);
+    this._meta.updateProperty("og:description", description);
+  }
+  updateTitle(title:string){
+    var _prefix ="OpenAIRE | ";
+    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+    this._meta.setTitle(_title );
+    this._meta.updateProperty("og:title",_title);
+  }
+  updateUrl(url:string){
+    this._meta.updateProperty("og:url", url);
+  }
+
+  public getSelectedFiltersFromUrl(params){
+    for(var i=0; i< this.fieldIds.length ; i++){
+
+         var fieldId =  this.fieldIds[i];
+         var fieldparam =  (this.fieldIdsMap[fieldId])?this.fieldIdsMap[fieldId].param:"";
+         if(!this.fieldIdsMap[fieldId]){
+
+           console.error("Field: "+fieldId +" not found in fieldIds map");
+         }
+
+         var operatorId =  this.getOperatorParameter(fieldparam);
+          if(params[fieldparam] != undefined && params[operatorId] != undefined) {
+              var values:string [] = StringUtils.URIDecode(params[fieldparam]).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
+             var operators:string [] = (StringUtils.URIDecode(params[operatorId])).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
+              if(values.length == operators.length){
+               for(var j=0; j< values.length ; j++){
+                 if(this.fieldIdsMap[fieldId].type == "date"){
+                   var value:string =StringUtils.unquote(values[j]);
+                   var validDates:boolean = true;
+                   var dateField:AdvancedField = new AdvancedField(fieldId,fieldparam,this.fieldIdsMap[fieldId].name,this.fieldIdsMap[fieldId].type,value,operators[j]) ;
+                   if(value.indexOf("range") != -1){
+                     dateField.dateValue.type="range";
+                     if(value.length < 26 ){
+                       validDates =false;
+                     }else{
+                       if(!Dates.isValidDate(value.substring(5,15)) || !Dates.isValidDate(value.substring(16,26))){
+                         validDates =false;
+                       }else {
+                        dateField.dateValue.from = Dates.getDateFromString(value.substring(5,15));
+                        dateField.dateValue.to = Dates.getDateFromString(value.substring(16,26));
+                      }
+                    }
+                    //  "rangeYYYY-MM-DD:YYYY-MM-DD"
+                   }else{
+                     dateField.dateValue.setDatesByType(value);
+                   }
+                   if(validDates){
+                     this.selectedFields.push(dateField);
+                   }
+
+                 }else{
+                   this.selectedFields.push(new AdvancedField(fieldId,fieldparam,this.fieldIdsMap[fieldId].name,this.fieldIdsMap[fieldId].type,StringUtils.unquote(values[j]),operators[j]) );
+                 }
+               }
+             }
+         }
+   }
+   if(this.selectedFields.length == 0){
+     this.selectedFields.push(new AdvancedField(this.fieldIds[0],fieldparam,this.fieldIdsMap[this.fieldIds[0]].name,this.fieldIdsMap[this.fieldIds[0]].type,"","and"));
+   }
+  }
+  private createUrlParameters(includePage:boolean){
+    var params="";
+    this.parameterNames.splice(0,this.parameterNames.length);
+    this.parameterValues.splice(0,this.parameterValues.length);
+    var fields: { [key:string]:{ values:string[], operators:string[] }}={};
+     for(var i = 0; i< this.selectedFields.length; i++){
+       if(this.fieldIdsMap[this.selectedFields[i].id] != undefined && (this.selectedFields[i].value.length > 0  || this.selectedFields[i].type == "date" )){
+        if(!fields[this.selectedFields[i].id]){
+          fields[this.selectedFields[i].id] = {values:[], operators:[]};
+          fields[this.selectedFields[i].id].values =[];
+          fields[this.selectedFields[i].id].operators =[];
+        }
+        if(this.selectedFields[i].type == "date"){
+           if(this.selectedFields[i].dateValue.type == "range"){
+              fields[this.selectedFields[i].id].values.push(StringUtils.quote(StringUtils.URIEncode("range"+Dates.getDateToString(this.selectedFields[i].dateValue.from)+":"+Dates.getDateToString(this.selectedFields[i].dateValue.to))));
+          }else{
+              fields[this.selectedFields[i].id].values.push(StringUtils.quote(StringUtils.URIEncode(this.selectedFields[i].dateValue.type)));
+          }
+        }else{
+          fields[this.selectedFields[i].id].values.push(StringUtils.quote(StringUtils.URIEncode(this.selectedFields[i].value)));
+        }
+        fields[this.selectedFields[i].id].operators.push(this.selectedFields[i].operatorId);
+
+      }
+    }
+    for(var i = 0; i< this.fieldIds.length; i++){
+      if(fields[this.fieldIds[i]]){
+
+        params+="&"+this.fieldIdsMap[this.fieldIds[i]].param+"="+fields[this.fieldIds[i]].values.join()+
+        "&"+this.getOperatorParameter(this.fieldIdsMap[this.fieldIds[i]].param)+"="+fields[this.fieldIds[i]].operators.join()
+        this.parameterNames.push(this.fieldIdsMap[this.fieldIds[i]].param);
+        this.parameterValues.push(fields[this.fieldIds[i]].values.join());
+        this.parameterNames.push(this.getOperatorParameter(this.fieldIdsMap[this.fieldIds[i]].param));
+        this.parameterValues.push(fields[this.fieldIds[i]].operators.join());
+      }
+    }
+    if(includePage && this.searchUtils.page != 1){
+      params += "&page="+this.searchUtils.page;
+    }
+     return '?'+params;
+  }
+  public createQueryParameters(){
+    var params="";
+    var countParams = 0;
+    for(var i = 0; i< this.selectedFields.length; i++){
+      if(this.fieldIdsMap[this.selectedFields[i].id] != undefined && (this.selectedFields[i].value != "" ||this.selectedFields[i].type == "date")){
+        console.log("createQueryParameters::"+this.selectedFields[i].type);
+        if(this.selectedFields[i].type == "date"){
+          if(this.selectedFields[i].dateValue.type != "any"){
+            params += (countParams == 0 ? "" : this.selectedFields[i].operatorId) + " " + this.selectedFields[i].id + this.fieldIdsMap[this.selectedFields[i].id].equalityOperator+ '"' + StringUtils.URIEncode(Dates.getDateToString(this.selectedFields[i].dateValue.from)) + " "
+            + StringUtils.URIEncode(Dates.getDateToString(this.selectedFields[i].dateValue.to)) + '"' + " ";
+          }
+        }else{
+          if(this.selectedFields[i].id == "q"){
+            var op = "";
+            // if()
+            params += (countParams == 0 ? "" : this.selectedFields[i].operatorId) + " " + '"' + StringUtils.URIEncode(this.selectedFields[i].value) + '"' + " ";
+          }else if(countParams == 0 && this.selectedFields[i].operatorId == "not"){
+              params += " "+ this.selectedFields[i].id +  " <> "+'"' + StringUtils.URIEncode(this.selectedFields[i].value) +'"' + " ";
+          }else{
+            params += (countParams == 0 ? "" : this.selectedFields[i].operatorId + " " ) + this.selectedFields[i].id + this.fieldIdsMap[this.selectedFields[i].id].equalityOperator+'"' + encodeURIComponent(this.selectedFields[i].value) +'"' + " ";
+
+          }
+      }
+        countParams++;
+      }
+    }
+
+     return params;
+
+  }
+  clearFilters(){
+  }
+
+  goTo(page:number = 1){
+     this.searchUtils.page = page;
+    var urlParameters = this.createUrlParameters(true);
+    var queryParameters = this.createQueryParameters();
+    this.location.go(location.pathname,urlParameters);
+    this.queryChange.emit({
+        value: queryParameters
+    });
+    /* Code For Piwik*/
+        if (typeof localStorage !== 'undefined') {
+          console.log("In PreviousRouteRecorder : "+this.router.url );
+          localStorage.setItem('previousRoute', this.router.url);
+        }
+        if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+          this.piwiksub = this._piwikService.trackView(this.pageTitle).subscribe();
+        }
+        /* End Piwik Code */
+  }
+
+  queryChanged($event) {
+
+     this.goTo(1);
+  }
+  pageChanged($event) {
+    this.searchUtils.page = +$event.value;
+    this.goTo(this.searchUtils.page);
+  }
+  /*
+  * Update the url with proper parameters. This is used as base url in Paging Component
+  */
+  public updateBaseUrlWithParameters(){
+    this.baseURLWithParameters = this.searchUtils.baseUrl + this.createUrlParameters(false);
+   }
+   getOperatorParameter(parameter:string):string{
+     if(parameter.length > 2){
+       return parameter.substring(0,2);
+     }else if(parameter == "q"){
+       return "op";
+     }else{
+       return parameter+"Op";
+     }
+   }
+   // for loading
+   public openLoading(){
+     this.loading.open();
+   }
+   public closeLoading(){
+       this.loading.close();
+   }
+}
diff --git a/searchPages/searchUtils/advancedSearchPage.module.ts b/searchPages/searchUtils/advancedSearchPage.module.ts
new file mode 100644
index 00000000..df34b56c
--- /dev/null
+++ b/searchPages/searchUtils/advancedSearchPage.module.ts
@@ -0,0 +1,33 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import{AdvancedSearchPageComponent} from './advancedSearchPage.component';
+import{SearchResultsModule} from './searchResults.module';
+import{LoadingModalModule} from '../../utils/modal/loadingModal.module';
+import {ReportsServiceModule} from '../../services/reportsService.module';
+import {SearchDownloadModule} from './searchDownload.module';
+import{SearchPagingModule} from './searchPaging.module';
+
+import {AdvancedSearchFormModule} from '../searchUtils/advancedSearchForm.module';
+import {PiwikServiceModule} from '../../utils/piwik/piwikService.module';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {HelperModule} from '../../utils/helper/helper.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,  RouterModule, SearchResultsModule, LoadingModalModule, ReportsServiceModule, SearchPagingModule, AdvancedSearchFormModule, SearchDownloadModule, PiwikServiceModule, HelperModule
+  ],
+  declarations: [
+    AdvancedSearchPageComponent,
+],
+
+  providers:[
+    PreviousRouteRecorder
+  ],
+  exports: [
+    AdvancedSearchPageComponent,
+    ]
+})
+export class AdvancedSearchPageModule { }
diff --git a/searchPages/searchUtils/browseEntities.component.ts b/searchPages/searchUtils/browseEntities.component.ts
new file mode 100644
index 00000000..868fe06a
--- /dev/null
+++ b/searchPages/searchUtils/browseEntities.component.ts
@@ -0,0 +1,96 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+
+import {RefineFieldResultsService} from '../../services/refineFieldResults.service';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass} from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'browse-entities',
+    template: `
+<div>
+  <!--div *ngIf="status == errorCodes.LOADING" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+  <div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
+  <div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+  <div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger" role="alert">Service temprorarily unavailable. Please try again later.</div>
+  <div *ngIf="status == errorCodes.NOT_FOUND" class="uk-alert uk-alert-danger" role="alert">No filters found</div-->
+  <errorMessages [status]="[status]" [type]="'results'"></errorMessages>
+
+  <div class ="uk-grid">
+    <div *ngFor= "let filter of filters" class = "uk-margin-bottom uk-width-1-4@l uk-width-1-3@m  uk-width-1-2@s">
+      <browse-statistic   [baseUrl]=baseUrl [filter]=filter ></browse-statistic>
+    </div>
+  </div>
+</div>
+`
+
+})
+export class BrowseEntitiesComponent {
+  public searchFields:SearchFields = new SearchFields();
+  public filters =[];
+  @Input() public baseUrl:string = "";
+  @Input() public entityName:string = "";
+  @Input() public refineFields: string[] ;//=  this.searchFields.RESULT_REFINE_FIELDS;
+  public sub: any;
+  public errorCodes:ErrorCodes = new ErrorCodes();
+  public status = this.errorCodes.LOADING;
+   public fieldIdsMap=this.searchFields.RESULT_REFINE_FIELDS;
+
+  constructor ( private _refineFieldsService: RefineFieldResultsService ) {
+    //  this.baseUrl = OpenaireProperties.getLinkToSearchPublications();
+
+  }
+
+  public ngOnInit() {
+        for(var i=0; i < this.searchFields.HIDDEN_FIELDS.length; i++){
+          var index = this.refineFields.indexOf(this.searchFields.HIDDEN_FIELDS[i]) ;
+          if(index > -1){
+            this.refineFields.splice(index,1);
+
+          }
+        }
+        this.getStats();
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+  }
+
+
+private getStats(){
+
+  this.status = this.errorCodes.LOADING;
+  this.sub = this._refineFieldsService.getRefineFieldsResultsByEntityName(this.refineFields,this.entityName).subscribe(
+      data => {
+          console.info("Get Stats for "+this.entityName+ ": [Total:"+data[0]+" ]  [fields: "+data[1].length+"]");
+          this.filters = data[1];
+          this.status = this.errorCodes.DONE;
+          if(data[0] == 0 ){
+            this.status = this.errorCodes.NONE;
+          }
+      },
+      err => {
+          console.log(err);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          //this.status = this.errorCodes.ERROR;
+          if(err.status == '404') {
+            this.status = this.errorCodes.NOT_FOUND;
+          } else if(err.status == '500') {
+            this.status = this.errorCodes.ERROR;
+          } else {
+            this.status = this.errorCodes.NOT_AVAILABLE;
+          }
+      }
+  );
+}
+}
diff --git a/searchPages/searchUtils/browseEntities.module.ts b/searchPages/searchUtils/browseEntities.module.ts
new file mode 100644
index 00000000..2d8d3cda
--- /dev/null
+++ b/searchPages/searchUtils/browseEntities.module.ts
@@ -0,0 +1,31 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import {RefineFieldResultsServiceModule} from '../../services/refineFieldResultsService.module';
+
+import {BrowseEntitiesComponent} from './browseEntities.component';
+import {BrowseStatisticComponent} from './browseStatistic.component';
+
+import {ErrorMessagesModule} from '../../utils/errorMessages.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, ErrorMessagesModule,
+    RefineFieldResultsServiceModule, RouterModule
+  ],
+  declarations: [
+      BrowseEntitiesComponent,
+      BrowseStatisticComponent
+
+],
+
+  providers:[
+  ],
+  exports: [
+    BrowseEntitiesComponent,
+    BrowseStatisticComponent
+    ]
+})
+export class BrowseEntitiesModule { }
diff --git a/searchPages/searchUtils/browseStatistic.component.html b/searchPages/searchUtils/browseStatistic.component.html
new file mode 100644
index 00000000..3eb79bc6
--- /dev/null
+++ b/searchPages/searchUtils/browseStatistic.component.html
@@ -0,0 +1,50 @@
+
+     <span class="uk-h6">{{filter.title}}</span>
+      <div *ngIf="filter.values.length == 0" class="uk-alert uk-alert-primary" role="alert">No {{filter.title}} statistics found</div>
+      <ul *ngIf="filter.values.length > 0 && !viewAll" class="uk-list browseFilters">
+
+        <li *ngFor= "let value of filter.values.slice(0,5)" class= " uk-margin-remove-top"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
+          <a class = " filterItem"  [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
+          <span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
+        </li>
+        <li *ngIf= " filter.values.length > 5  " class= " uk-margin-remove-top">
+          <a href="#modal-{{filter.filterId}}" uk-toggle><span class="uk-text-muted">View more </span><span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
+</span></a>
+
+          <!--
+              uk-toggle="target: modal-"
+              uk-toggle='{"target": modal-}'>
+              uk-toggle target="modal-"
+          -->
+          <!--span uk-toggle='{"target": modal-}'><span class="uk-text-muted clickable">View more </span><a><span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
+</span></a></span-->
+        </li>
+      </ul>
+      <ul *ngIf="filter.values.length > 0 && viewAll" class="uk-list uk-list-divider   browseFilters">
+        <li *ngFor= "let value of filter.values"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
+        <a class = " filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
+          <span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
+        </li>
+        <li *ngIf= " filter.values.length > 5 && viewAll " (click)="viewAll=false;">
+          <span  ><span class="uk-text-muted clickable">View less </span><a><span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-up" ratio="1"><polygon points="5 13 10 8 15 13"></polygon></svg></span></a></span>
+        </li>
+      </ul>
+
+
+      <!-- This is the modal -->
+      <div id="modal-{{filter.filterId}}" uk-modal>
+        <div class="uk-modal-dialog uk-modal-body">
+          <button class="uk-modal-close-default" type="button" uk-close></button>
+
+          <h4 class="tm-article-subtitle">{{filter.title}}</h4>
+          <ul *ngIf="filter.values.length > 0" class="uk-list uk-list-line   browseFilters">
+            <li *ngFor= "let value of filter.values"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
+            <a class = "uk-modal-close filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
+              <span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
+            </li>
+          </ul>
+        </div>
+      </div>
diff --git a/searchPages/searchUtils/browseStatistic.component.ts b/searchPages/searchUtils/browseStatistic.component.ts
new file mode 100644
index 00000000..b0b78951
--- /dev/null
+++ b/searchPages/searchUtils/browseStatistic.component.ts
@@ -0,0 +1,42 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+
+import {RefineFieldResultsService} from '../../services/refineFieldResults.service';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass} from '../searchUtils/searchUtils.class';
+import {RouterHelper} from '../../utils/routerHelper.class';
+@Component({
+    selector: 'browse-statistic',
+    templateUrl: 'browseStatistic.component.html'
+
+})
+export class BrowseStatisticComponent {
+
+  @Input() public baseUrl:string = "";
+  @Input() public filter:any = "";
+  private _maxCharacters = 30;
+  public viewAll = false;
+  public routerHelper:RouterHelper = new RouterHelper();
+  constructor () {
+
+  }
+
+  public ngOnInit() {
+
+
+  }
+
+      quote(str:string){
+        return '"'+str+'"';
+      }
+
+  private _formatName(value){
+    return value.name+" ";//(((value.name+" ("+value.number+")").length >this._maxCharacters)?(value.name.substring(0,(this._maxCharacters - (" ("+value.number+")").length - ('...').length))+"..."):value.name)
+  }
+
+}
diff --git a/searchPages/searchUtils/dateFilter.component.ts b/searchPages/searchUtils/dateFilter.component.ts
new file mode 100644
index 00000000..f03eb76a
--- /dev/null
+++ b/searchPages/searchUtils/dateFilter.component.ts
@@ -0,0 +1,73 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+import { Filter, Value, DateValue} from './searchHelperClasses.class';
+import {IMyOptions, IMyDateModel} from '../../utils/my-date-picker/interfaces/index';
+// import {IMyDateModel} from '../../../utils/my-date-picker/interfaces/my-date-model.interface';
+import {Dates} from '../../utils/string-utils.class';
+
+@Component({
+    selector: 'date-filter',
+    template: `
+
+    <select *ngIf="dateValue.type!='range' "  name="{{'select_date_type'+filterId}}"    [(ngModel)]=dateValue.type >
+      <option *ngFor="let type of dateValue.types let i = index"  [value]="type" (click)="typeChanged(type)">{{dateValue.typesTitle[i]}}</option>
+    </select>
+    <div *ngIf="dateValue.type=='range' " class="-row dateFilter" >
+
+      <table class=" uk-table uk-table-responsive" >
+      <tr><td>
+      <select name="{{'select_date_type'+filterId}}"    [(ngModel)]=dateValue.type >
+        <option *ngFor="let type of dateValue.types let i = index"  [value]="type" (click)="typeChanged(type)">{{dateValue.typesTitle[i]}}</option>
+      </select></td>
+      <td>
+          From</td><td  style="width: 112px;"><my-date-picker name="from" [options]="myDatePickerOptions"
+                    [(ngModel)]="from" (dateChanged)="onFromDateChanged($event)" ></my-date-picker>
+      </td> <td>
+            To </td><td  style="width: 112px;">     <my-date-picker name="to" [options]="myDatePickerOptions"
+                            [(ngModel)]="to" (dateChanged)="onToDateChanged($event)" ></my-date-picker></td></tr>
+      </table>
+     </div>
+    `
+
+})
+
+export class DateFilterComponent {
+
+    @Input() dateValue = new DateValue("any");
+    @Input() filterId;
+
+    private myDatePickerOptions: IMyOptions = {
+          // other options...
+          dateFormat: 'yyyy-mm-dd',
+          selectionTxtFontSize: '15px',
+          height:'28px',
+          width: '100%',
+          editableDateField: false,
+          showClearDateBtn: false
+      };
+
+      // Initialized to specific date (09.10.2018).
+      public from;//: Object = { date: { year: 2018, month: 10, day: 9 } };
+      public to;//: Object = { date: { year: 2018, month: 10, day: 9 } };
+
+constructor() {
+  this.updateDefaultRangeDates(this.dateValue.from,this.dateValue.to);
+}
+updateDefaultRangeDates(df:Date,dt:Date){
+    this.from = { date: { year: df.getFullYear(), month: (df.getMonth()+1), day: df.getDate() } };
+    this.to = { date: { year: dt.getFullYear(), month: (dt.getMonth()+1), day: dt.getDate() } };
+  }
+typeChanged(type:string){
+  this.dateValue.setDatesByType(type);
+  this.updateDefaultRangeDates(this.dateValue.from, this.dateValue.to);
+}
+
+onFromDateChanged(event: IMyDateModel) {
+  this.dateValue.from = Dates.getDateFromString(event.formatted);
+
+}
+onToDateChanged(event: IMyDateModel) {
+  this.dateValue.to = Dates.getDateFromString(event.formatted);
+
+}}
diff --git a/searchPages/searchUtils/dateFilter.module.ts b/searchPages/searchUtils/dateFilter.module.ts
new file mode 100644
index 00000000..0c5dca82
--- /dev/null
+++ b/searchPages/searchUtils/dateFilter.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { MyDatePickerModule } from '../../utils/my-date-picker/my-date-picker.module';
+import {DateFilterComponent} from './dateFilter.component';
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, MyDatePickerModule
+  ],
+  declarations: [
+    DateFilterComponent
+],
+
+  providers:[
+  ],
+  exports: [
+    DateFilterComponent
+    ]
+})
+export class DateFilterModule { }
diff --git a/searchPages/searchUtils/searchDownload.component.ts b/searchPages/searchUtils/searchDownload.component.ts
new file mode 100644
index 00000000..55df68d0
--- /dev/null
+++ b/searchPages/searchUtils/searchDownload.component.ts
@@ -0,0 +1,112 @@
+import {Component, Input, Output, EventEmitter, ViewChild} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {AlertModal} from '../../utils/modal/alert';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import {ReportsService} from '../../services/reports.service';
+import {ModalLoading} from '../../utils/modal/loading.component';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'search-download',
+    template: `
+        <span class="uk-margin-large-right" *ngIf="totalResults > 0 && totalResults <= 10000">
+            <span class="clickable" (click)="downloadfile(downloadURLAPI+type+'?format=csv&page=0&size='+totalResults+csvParams,type+'-report-'+totalResults)">
+                <span aria-hidden="true" class="glyphicon glyphicon-download"></span>
+                <span  class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="download" ratio="1"><polyline fill="none" stroke="#000" points="14,10 9.5,14.5 5,10"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="13.91" x2="9.5" y2="3"></line></svg></span> (CSV)
+            </span>
+        </span>
+    <!--modal-alert></modal-alert-->
+    <modal-loading></modal-loading>
+    <modal-alert #AlertModalCsvError></modal-alert>
+    `
+})
+
+export class SearchDownloadComponent {
+    @Input() totalResults:number = 0;
+    @Input() csvParams: string;
+    @Input() type: string;
+    @ViewChild(AlertModal) alertApplyAll;
+    private downloadURLAPI: string;
+
+    sub: any;
+    downloadFilePiwikSub: any;
+
+    @ViewChild (ModalLoading) loading : ModalLoading ;
+    // Alert box when something is wrong with CSV requests
+    @ViewChild('AlertModalCsvError') alertCsvError;
+
+    constructor ( private _reportsService: ReportsService, private _piwikService:PiwikService) {}
+
+    ngOnInit() {
+        this.downloadURLAPI = OpenaireProperties.getCsvAPIURL();
+    }
+
+    ngOnDestroy() {
+      if(this.sub) {
+        this.sub.unsubscribe();
+      }
+      if(this.downloadFilePiwikSub) {
+        this.downloadFilePiwikSub.unsubscribe();
+      }
+    }
+
+    denialOfDownload() {
+        this.alertApplyAll.isOpen = true;
+        this.alertApplyAll.cancelButton = true;
+        this.alertApplyAll.okButton = false;
+        this.alertApplyAll.alertTitle = "Download Results in CSV";
+        this.alertApplyAll.message = "Sorry, but the results are too many! Use the api instead!";
+        this.alertApplyAll.cancelButtonText = "Ok";
+
+        console.info("denial of Download");
+
+    }
+    downloadfile(url:string,filename:string){
+      console.log("Downloading file: "+ url);
+      this.openLoading();
+      this.setMessageLoading("Downloading CSV file");
+
+      this._reportsService.downloadCSVFile(url).subscribe(
+          data => {
+              this.closeLoading();
+              window.open(window.URL.createObjectURL(data),filename+".csv");
+              if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+                this.downloadFilePiwikSub = this._piwikService.trackDownload(url).subscribe();
+              }
+          },
+          error => {
+            console.log("Error downloading the file.");
+            this.closeLoading();
+            this.confirmOpenCsvError();
+          },
+          () => console.log('Completed file download.')
+      );
+    }
+
+
+    public openLoading(){
+      if(this.loading){
+        this.loading.open();
+      }
+    }
+    public closeLoading(){
+      if(this.loading){
+        this.loading.close();
+      }
+    }
+    public setMessageLoading(message: string){
+      if(this.loading){
+        this.loading.message = message;
+      }
+    }
+
+    public confirmOpenCsvError(){
+      this.alertCsvError.cancelButton = false;
+      this.alertCsvError.okButton = true;
+      this.alertCsvError.alertTitle = "ERROR DOWNLOADING CSV FILE";
+      this.alertCsvError.message = "There was an error in csv downloading. Please try again later.";
+      this.alertCsvError.okButtonText = "OK";
+      this.alertCsvError.open();
+    }
+
+}
diff --git a/searchPages/searchUtils/searchDownload.module.ts b/searchPages/searchUtils/searchDownload.module.ts
new file mode 100644
index 00000000..1275de01
--- /dev/null
+++ b/searchPages/searchUtils/searchDownload.module.ts
@@ -0,0 +1,24 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchDownloadComponent} from './searchDownload.component';
+import {LoadingModalModule} from '../../utils/modal/loadingModal.module';
+import {AlertModalModule} from '../../utils/modal/alertModal.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, LoadingModalModule, AlertModalModule
+  ],
+  declarations: [
+    SearchDownloadComponent
+],
+
+  providers:[
+  ],
+  exports: [
+    SearchDownloadComponent
+
+    ]
+})
+export class SearchDownloadModule { }
diff --git a/searchPages/searchUtils/searchFilter.component.html b/searchPages/searchUtils/searchFilter.component.html
new file mode 100644
index 00000000..fdf83db7
--- /dev/null
+++ b/searchPages/searchUtils/searchFilter.component.html
@@ -0,0 +1,67 @@
+
+<ul *ngIf= "filter.values.length >0" class="uk-list">
+<li class="uk-open">
+    <h5  class="uk-margin-bottom-remove">{{_formatTitle(filter.title,filter.values.length)}}
+    </h5>
+    <div  aria-expanded="false">
+      <div class="searchFilterBoxValues ">
+        <div *ngFor = "let value of getSelectedValues(filter)"  class = "uk-animation-fade filterItem">
+
+           <span class="filterName"><div title = "{{value.name}}">
+           <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)" />
+           {{_formatName(value)}} </div></span>
+           <span class="filterNumber" *ngIf = "showResultCount === true" >  ({{value.number}})</span>
+        </div>
+        <!--div class="uk-grid-divider uk-margin-remove"></div-->
+        <hr *ngIf="getSelectedValues(filter).length > 0 && getNotSelectedValues(filter).length > 0" class="uk-grid-divider uk-margin-remove">
+        <div *ngFor = "let value of getNotSelectedValues(filter).slice(0,(!addShowMore?getNotSelectedValues(filter).length:5-getSelectedValues(filter).length))" class = "uk-animation-fade filterItem">
+
+           <span class="filterName"><div title = "{{value.name}}"> <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)" />
+           {{_formatName(value)}} </div></span>
+           <span class="filterNumber" *ngIf = "showResultCount === true" >  ({{value.number}})</span>
+        </div>
+
+        <!--a *ngIf="(getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5" (click)="toggle()" [class]="(isDisabled)?'uk-disabled uk-link-muted':''">Show More</a-->
+
+        <!--button *ngIf="(getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5"
+                class="uk-button uk-button-link" (click)="toggle()" [disabled]="isDisabled">
+                Show More
+        </button-->
+
+        <a *ngIf=" addShowMore && (getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5" (click)="open()" [class]="(isDisabled)?'uk-disabled uk-link-muted':''">View more<span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
+</span></a>
+
+
+        <div *ngIf="addShowMore" [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'" uk-modal  [open]="!isOpen" id="modal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" bg-close="true">
+          <div class="filtersModal uk-modal-dialog uk-small-1-2 uk-width-medium-1-3 uk-width-1-3 uk-padding-small uk-padding-remove-top uk-padding-remove-horizontal">
+
+            <button type="button" class="uk-modal-close-default" uk-close (click)="close()"></button>
+            <h5  class="uk-margin-remove uk-padding uk-padding-remove-bottom">
+              {{filter.title}}
+            </h5>
+            <span *ngIf="filter.values.length >= 99" class="uk-article-meta uk-text-center">Showing top {{filter.values.length}} values. </span>
+            <div class="uk-modal-body uk-overflow-auto uk-height-medium uk-padding-remove
+                        uk-margin-medium-left uk-margin-medium-right uk-margin-small-top uk-margin-bottom">
+              <div *ngFor = "let value of getSelectedValues(filter)"  class = "uk-animation-fade filterItem">
+                 <span class="filterName"><div title = "{{value.name}}">
+                 <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="close(); filterChange(value.selected)" />
+                 {{_formatName(value)}} </div></span>
+                 <span class="filterNumber" *ngIf = "showResultCount === true" >  ({{value.number}})</span>
+              </div>
+              <hr *ngIf="getSelectedValues(filter).length > 0 && getNotSelectedValues(filter).length > 0" class="uk-grid-divider uk-margin-remove">
+              <div *ngFor = "let value of getNotSelectedValues(filter)" class = "uk-animation-fade filterItem">
+                 <span class="filterName"><div title = "{{value.name}}"> <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="close(); filterChange(value.selected)" />
+                 {{_formatName(value)}} </div></span>
+                 <span class="filterNumber" *ngIf = "showResultCount === true" >  ({{value.number}})</span>
+              </div>
+            </div>
+          </div>
+        </div>
+
+
+
+   </div>
+  </div>
+</li>
+</ul>
diff --git a/searchPages/searchUtils/searchFilter.component.ts b/searchPages/searchUtils/searchFilter.component.ts
new file mode 100644
index 00000000..a120673c
--- /dev/null
+++ b/searchPages/searchUtils/searchFilter.component.ts
@@ -0,0 +1,144 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+
+import { Filter, Value} from './searchHelperClasses.class';
+import {Open} from '../../utils/modal/open.component';
+
+@Component({
+    selector: 'search-filter',
+    templateUrl: 'searchFilter.component.html'
+})
+
+export class SearchFilterComponent {
+
+    @Input() filter:Filter;
+    @Input() showResultCount:boolean = true;
+    @Input() isDisabled:boolean = false;
+    @Input() addShowMore:boolean = true;
+
+    public showAll:boolean = false;
+    public _maxCharacters:number =28;
+
+    @Output() toggleModal = new EventEmitter();
+
+    @Output() modalChange = new EventEmitter();
+
+
+    public isOpen:boolean=false;
+
+    filterModalChange() {
+      console.info("Modal Changed");
+      this.modalChange.emit({
+        value: true
+      });
+      //this.close();
+    }
+
+    constructor () {
+    }
+
+    ngOnInit() {
+
+    }
+    public _formatTitle(title,length){
+      return (((title+" ("+length+")").length >this._maxCharacters)?(title.substring(0,(this._maxCharacters - (" ("+length+")").length - ('...').length))+"..."):title+" ("+((length >= 99)?length+"+":length)+")")
+    }
+    private _formatName(value){
+      return value.name;//(((value.name+" ("+value.number+")").length >this._maxCharacters)?(value.name.substring(0,(this._maxCharacters - (" ("+value.number+")").length - ('...').length))+"..."):value.name)
+    }
+    toggleShowAll(){
+        this.showAll = !this.showAll;
+        if(this.showAll == false) {
+            this.reorderFilterValues();
+        }
+    }
+
+    filterChange(selected:boolean){
+      console.info("filter change: "+selected);
+        if(selected){
+            this.filter.countSelectedValues++;
+            // this.reorderFilterValues();
+        }else{
+            this.filter.countSelectedValues--;
+            // this.reorderFilterValues();
+        }
+    }
+    getSelectedValues(filter):any{
+      var selected = [];
+      if(filter.countSelectedValues >0){
+        for (var i=0; i < filter.values.length; i++){
+          if(filter.values[i].selected){
+            selected.push(filter.values[i]);
+          }
+        }
+      }
+      return selected;
+
+    }
+    getNotSelectedValues(filter):any{
+      var notSselected = [];
+      if(filter.countSelectedValues >0){
+        for (var i=0; i < filter.values.length; i++){
+          if(!filter.values[i].selected){
+            notSselected.push(filter.values[i]);
+          }
+        }
+      }else {
+        notSselected = filter.values;
+      }
+      return notSselected;
+    }
+    reorderFilterValues() {
+        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);
+            }
+        }
+    }
+//     sliceSelected() {
+//         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);
+//             }
+//         }
+
+
+  toggle() {
+    this.toggleModal.emit({
+      value: this.filter
+    });
+  }
+
+
+  open() {
+    this.isOpen = true;
+  }
+
+  close() {
+    this.isOpen = false;
+  }
+
+  filterChange2(selected:boolean){
+
+    console.info("filter change2");
+      if(selected){
+          this.filter.countSelectedValues++;
+          // this.reorderFilterValues();
+      }else{
+          this.filter.countSelectedValues--;
+          // this.reorderFilterValues();
+      }
+      this.close();
+  }
+
+}
diff --git a/searchPages/searchUtils/searchFilter.module.ts b/searchPages/searchUtils/searchFilter.module.ts
new file mode 100644
index 00000000..3cc6792b
--- /dev/null
+++ b/searchPages/searchUtils/searchFilter.module.ts
@@ -0,0 +1,24 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchFilterComponent} from './searchFilter.component';
+import{SearchFilterModalComponent} from './searchFilterModal.component';
+import {ModalModule} from '../../utils/modal/modal.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, ModalModule
+  ],
+  declarations: [
+    SearchFilterComponent, SearchFilterModalComponent
+],
+
+  providers:[
+  ],
+  exports: [
+    SearchFilterComponent, SearchFilterModalComponent
+
+    ]
+})
+export class SearchFilterModule { }
diff --git a/searchPages/searchUtils/searchFilterModal.component.ts b/searchPages/searchUtils/searchFilterModal.component.ts
new file mode 100644
index 00000000..bb0ed624
--- /dev/null
+++ b/searchPages/searchUtils/searchFilterModal.component.ts
@@ -0,0 +1,104 @@
+import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmitter, Output} from '@angular/core';
+// import { DynamicComponentLoader} from '@angular/core';
+
+import {Open} from '../../utils/modal/open.component';
+import { Filter} from './searchHelperClasses.class';
+
+@Component({
+  selector: 'modal-search-filter',
+  template: `
+  <div *ngIf="filter!=undefined" [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'" uk-modal  [open]="!isOpen" id="modal-{{filter.filterId}}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+    <div class="uk-modal-dialog uk-modal-body">
+      <button type="button" class="uk-modal-close-default" uk-close (click)="close()"></button>
+
+
+      <h3  class="uk-margin-bottom-remove uk-margin-top">
+        {{filter.title}}
+      </h3>
+
+      <div class="uk-accordion-content searchFilterBoxValues ">
+        <div *ngFor = "let value of getSelectedValues(filter)"  class = "uk-animation-fade filterItem">
+
+           <span class="filterName"><div title = "{{value.name}}">
+           <input [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterModalChange(value.selected)">
+           {{value.name}} </div></span>
+           <span class="filterNumber" *ngIf = "showResultCount === true" >  ({{value.number}})</span>
+        </div>
+        <hr *ngIf="getSelectedValues(filter).length > 0 && getNotSelectedValues(filter).length > 0" class="uk-grid-divider uk-margin-remove">
+        <div *ngFor = "let value of getNotSelectedValues(filter)" class = "uk-animation-fade filterItem">
+           <span class="filterName"><div title = "{{value.name}}">
+           <input [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterModalChange(value.selected)">
+           {{value.name}} </div></span>
+           <span class="filterNumber" *ngIf = "showResultCount === true" >  ({{value.number}})</span>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  `,
+  encapsulation: ViewEncapsulation.None,
+})
+/**
+  * API to an open search filter window.
+  */
+export class SearchFilterModalComponent{
+  @Input() filter: Filter;
+  @Input() showResultCount:boolean = true;
+  @Output() modalChange = new EventEmitter();
+
+  public isOpen:boolean=false;
+
+  constructor( public _elementRef: ElementRef){}
+
+  filterModalChange(selected:boolean) {
+    console.info("Modal Changed");
+    this.filterChange(selected);
+    this.modalChange.emit({
+      value: selected
+    });
+    this.close();
+  }
+  filterChange(selected:boolean){
+      if(selected){
+          this.filter.countSelectedValues++;
+          // this.reorderFilterValues();
+      }else{
+          this.filter.countSelectedValues--;
+          // this.reorderFilterValues();
+      }
+  }
+  getSelectedValues(filter):any{
+    var selected = [];
+    if(filter.countSelectedValues >0){
+      for (var i=0; i < filter.values.length; i++){
+        if(filter.values[i].selected){
+          selected.push(filter.values[i]);
+        }
+      }
+    }
+    return selected;
+
+  }
+  getNotSelectedValues(filter):any{
+    var notSselected = [];
+    if(filter.countSelectedValues >0){
+      for (var i=0; i < filter.values.length; i++){
+        if(!filter.values[i].selected){
+          notSselected.push(filter.values[i]);
+        }
+      }
+    }else {
+      notSselected = filter.values;
+    }
+    return notSselected;
+  }
+
+  open() {
+    this.isOpen = true;
+  }
+
+  close() {
+    this.isOpen = false;
+  }
+
+}
diff --git a/searchPages/searchUtils/searchForm.component.ts b/searchPages/searchUtils/searchForm.component.ts
new file mode 100644
index 00000000..0a6ba9a8
--- /dev/null
+++ b/searchPages/searchUtils/searchForm.component.ts
@@ -0,0 +1,52 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {RouterHelper} from '../../utils/routerHelper.class';
+import {Router} from '@angular/router';
+
+@Component({
+    selector: 'search-form',
+    template: `
+
+        <form [class]="(isDisabled)?'uk-margin uk-text-center uk-margin-top uk-disabled':'uk-margin uk-text-center uk-margin-top'">
+                 <input type="text" class="uk-input  uk-width-1-2" [placeholder]="placeholderText" aria-describedby="sizing-addon2"  [(ngModel)]="keyword"  name="keyword" >
+                    <button *ngIf="!link" (click)="keywordChanged()"  type="submit" class=" uk-button uk-button-default">
+                    <span class="uk-icon">
+                    <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>
+                    </span>Search
+                  </button>
+                  <button *ngIf="link"  class=" uk-button uk-button-default" (click)="goTo()"  type="submit" >
+                    <span class="uk-icon">
+                    <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>
+                    </span>Search
+                  </button>
+        </form>
+    `
+})
+
+export class SearchFormComponent {
+    @Input() isDisabled: boolean = false;
+    @Input() keyword: string = '';
+    @Input() generalSearch: boolean = false;
+    @Input() placeholderText: string = "Type keywords";
+    @Input() link: boolean = false;
+    public routerHelper:RouterHelper = new RouterHelper();
+
+    @Output() keywordChange  = new EventEmitter();
+
+    constructor (private _router:Router) {
+     }
+
+    ngOnInit() {
+
+    }
+
+    keywordChanged() {
+        console.info("inside form: "+this.keyword);
+        this.keywordChange.emit({
+            value: this.keyword
+        });
+    }
+    goTo() {
+      this._router.navigate(['/search/find'], { queryParams: this.routerHelper.createQueryParam('keyword',this.keyword) });
+    }
+}
diff --git a/searchPages/searchUtils/searchForm.module.ts b/searchPages/searchUtils/searchForm.module.ts
new file mode 100644
index 00000000..21a9d9b1
--- /dev/null
+++ b/searchPages/searchUtils/searchForm.module.ts
@@ -0,0 +1,23 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import{SearchFormComponent} from './searchForm.component';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule
+  ],
+  declarations: [
+    SearchFormComponent
+],
+
+  providers:[
+  ],
+  exports: [
+    SearchFormComponent
+
+    ]
+})
+export class SearchFormModule { }
diff --git a/searchPages/searchUtils/searchHelperClasses.class.ts b/searchPages/searchUtils/searchHelperClasses.class.ts
new file mode 100644
index 00000000..c09b3440
--- /dev/null
+++ b/searchPages/searchUtils/searchHelperClasses.class.ts
@@ -0,0 +1,89 @@
+import {Dates} from '../../utils/string-utils.class';
+export class Filter{
+    public title: string; // eg Type
+    public filterId: string; // type (name in url parameter)
+    public originalFilterId: string; // (in index)
+    public countSelectedValues: number = 0;
+    public values: Value[] = [];
+    public filterOperator: string ='or';
+
+
+}
+
+export class Value{
+    public name: string; //eg Article, Journal
+    public id: string; //0001
+    public selected: boolean = false;
+    public number: number = 0;
+
+}
+export class AdvancedField{
+    public id: string; //
+    public param:string;
+    public name: string; //
+    public type: string = "keyword"; //keyword, static or dynamic
+    public value: string = '';
+    public operatorId: string;
+    public operatorName: string ="";
+    public valid: boolean = true;
+    public dateValue:DateValue = new DateValue("any");
+
+    constructor(id:string,param:string,name:string, type:string, value:string,operator:string){
+      this.id = id;
+      this.param = param;
+      this.name = name;
+      this.type = type;
+      this.value = value;
+      this.operatorId =  operator;
+      // this.operatorName =  "AND";
+
+    }
+}
+export class DateValue{
+    public types = ["any","range","1mon","2mon","3mon","6mon","12mon","2year","5year","10year"];
+    public typesTitle = ["any","in the specified date range","in the last month","in the last 2 months","in the last 3 months","in the last 6 months","in the last year","in the last 2 years","in the last 5 years","in the last 10 years"];
+    public type: string ;
+    public from:Date = new Date();
+    public to:Date = new Date();
+    constructor(type:string = "any"){
+      this.setDatesByType(type);
+    }
+    public setDatesByType(type:string){
+      if(this.types.indexOf(type) == -1){
+        type=this.types[0];
+      }
+      this.type = type;
+      this.to = Dates.getDateToday();
+      if(this.type == "range" || this.type == "any"){ // for type "any" just to  initiate with values
+        this.from = Dates.getDateXMonthsAgo(1);
+      }else if(this.type == "1mon"){
+        this.from = Dates.getDateXMonthsAgo(1);
+      }else if(this.type == "2mon"){
+        this.from = Dates.getDateXMonthsAgo(2);
+      }else if(this.type == "3mon"){
+        this.from = Dates.getDateXMonthsAgo(3);
+      }else if(this.type == "6mon"){
+        this.from = Dates.getDateXMonthsAgo(6);
+      }else if(this.type == "12mon"){
+        this.from = Dates.getDateXMonthsAgo(12);
+      }else if(this.type == "2year"){
+        this.from = Dates.getDateXYearsAgo(2);
+      }else if(this.type == "5year"){
+        this.from = Dates.getDateXYearsAgo(5);
+      }else if(this.type == "10year"){
+        this.from = Dates.getDateXYearsAgo(10);
+      }
+    }
+
+}
+export class OPERATOR{
+    public static AND: string ="and";
+    public static OR: string ="or";
+    public static NOT: string ="not";
+
+}
+
+export class AutoCompleteValue{
+  public id: string;
+  public label: string;
+}
diff --git a/searchPages/searchUtils/searchPage.component.html b/searchPages/searchUtils/searchPage.component.html
new file mode 100644
index 00000000..029d3709
--- /dev/null
+++ b/searchPages/searchUtils/searchPage.component.html
@@ -0,0 +1,126 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid >
+    <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+      <div class="">
+
+        <div   [class]="'uk-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle uk- light '+searchFormClass" >
+          <div   class="uk-width-1-1">
+            <div   class="uk-width-1-1">
+              <search-form [isDisabled]="disableForms" [(keyword)]="searchUtils.keyword" (keywordChange)="keywordChanged($event)" [placeholderText]="formPlaceholderText"></search-form>
+            </div>
+            <div   class="uk-width-1-1  ">
+              <!--link to advanced search -->
+              <a *ngIf = "advancedSearchLink && advancedSearchLink.length > 0" routerLinkActive="router-link-active" [class]="(disableForms)?'uk-float-right   uk-disabled uk-link-muted uk-light ':'uk-float-right  uk-light'" [routerLink]=advancedSearchLink >More search options <span class="uk-icon">
+                  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+                  </span>
+              </a>
+              <div *ngIf="isFiltered()" class = "uk-container uk-width-1-2@m uk-width-1-2@s uk-align-center uk-text-center uk-text-small">
+                <span *ngIf = "searchUtils.keyword.length > 0">Keywords: <span [innerHtml]="searchUtils.keyword"></span><a (click) = "clearKeywords() " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable " aria-hidden="true"><span class="uk-icon">
+                  <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+                  </span></span></a>
+                </span>
+                <span *ngFor="let filter of filters " >
+                  <span *ngIf = "filter.countSelectedValues > 0"> {{filter.title}}:
+                    <span *ngFor="let value of getSelectedValues(filter); let i = index;  let end = last; " ><span [innerHtml]="(value.name.length > 25)?value.name.substring(0,25)+'...':value.name" title="value.name"></span><a (click) = "removeFilter(value, filter) " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable" aria-hidden="true"><span class="uk-icon">
+                      <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+                      </span></span></a>
+                      <span *ngIf="!end">, </span>
+                    </span>
+                  </span>
+                </span>
+
+                <a (click)="clearFilters()" [class]="(disableForms)?'uk-disabled uk-link-muted':''">
+                 Clear All
+                </a>
+              </div>
+              <div *ngIf= "showUnknownFilters"  class = " uk-text-center ">
+                <a (click) = "clearFilters() " >Try new Query</a>
+              </div>
+            </div>
+
+          </div>
+        </div>
+        <div  class="uk-container">
+          <helper position="top"></helper>
+          <div  [class]="(showRefine)? 'uk-width-3-5@m  uk-width-3-5@l  uk-width-1-1@s' :'uk-width-1-1'">
+            <div  *ngIf="showRefine" class="uk-offcanvas-content uk-hidden@m">
+
+              <a href="#offcanvas-usage" uk-toggle><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="6" y="4" width="12" height="1"></rect><rect x="6" y="9" width="12" height="1"></rect><rect x="6" y="14" width="12" height="1"></rect><rect x="2" y="4" width="2" height="1"></rect><rect x="2" y="9" width="2" height="1"></rect><rect x="2" y="14" width="2" height="1"></rect></svg></a>
+
+              <div id="offcanvas-usage" uk-offcanvas>
+                <div class="uk-offcanvas-bar">
+                  <button class="uk-offcanvas-close" type="button" uk-close></button>
+                  <div class="uk-text-large">Filter By:</div>
+                  <search-filter  *ngFor="let filter of filters "  [addShowMore]=false [isDisabled]="disableForms" [filter]="filter"  [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
+                </div>
+              </div>
+
+            </div>
+          </div>
+
+
+          <div  class="uk-grid uk-width-1-1">
+            <div  *ngIf="showRefine" class="helper-left-right search-filters uk-visible@m">
+               <helper position="left"></helper>
+               <search-filter  *ngFor="let filter of filters " [isDisabled]="disableForms" [filter]="filter"  [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
+            </div>
+            <helper *ngIf="!showRefine" class="helper-left-right uk-visible@m" position="left"></helper>
+
+            <div class="uk-width-expand@m uk-width-1-1@s uk-first-column">
+            <!-- <div [class]="(showRefine)?'uk-width-expand@m uk-first-column':''" > -->
+              <div  class="uk-align-center uk-margin-remove-bottom">
+                <search-paging [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults" [(searchUtils)] = "searchUtils"  [(results)] = "results"  [(baseUrl)] = "baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
+              </div>
+
+              <div  *ngIf="tableViewLink || searchUtils.totalResults <=10000"  class="uk-width-1-1@s uk-hidden@m">
+                <span *ngIf="tableViewLink" class="uk-margin-medium-right">
+                  <a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=tableViewLink >
+                    <span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
+                  </a>
+
+                  <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
+                </span>
+                <search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults"></search-download>
+              </div>
+
+              <div class="uk-margin-top">
+                <search-result    *ngIf="!tableView"
+                                  [results]="results"
+                                  [status]="searchUtils.status"
+                                  [type]="entityType"
+                                  [showLoading]="true">
+                </search-result>
+              </div>
+
+              <div  class="uk-align-center uk-margin-remove-bottom">
+                <search-paging [type]="type" [loadPaging]="loadPaging" [oldTotalResults]="oldTotalResults" [(searchUtils)] = "searchUtils"  [(results)] = "results"  [(baseUrl)] = "baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
+              </div>
+
+              <helper class="uk-hidden@m" position="left" styleName="uk-width-1-1@s"></helper>
+              <helper class="uk-hidden@m" position="right" styleName="uk-width-1-1@s"></helper>
+            </div>
+
+            <div *ngIf="tableViewLink || searchUtils.totalResults <=10000" class="helper-left-right uk-visible@m">
+              <span *ngIf="tableViewLink" class="uk-margin-medium-right">
+                <a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=tableViewLink >
+                  <span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
+                </a>
+
+                <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
+              </span>
+              <search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults"></search-download>
+              <helper position="right"></helper>
+            </div>
+            <helper *ngIf="!tableViewLink && searchUtils.totalResults > 10000" class="helper-left-right uk-visible@m" position="right"></helper>
+          </div>
+          <!-- <div [class]="(showRefine)? 'uk-width-3-5@m  uk-width-3-5@l  uk-width-1-1@s uk-align-center uk-margin-remove-bottom' : 'uk-width-1-1'">
+            <search-paging [loadPaging]="loadPaging" [type]="type" [oldTotalResults]="oldTotalResults" [(searchUtils)] = "searchUtils"  [(results)] = "results"  [(baseUrl)] = "baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
+          </div> -->
+          <div class="uk-width-1-1">
+            <helper position="bottom"></helper>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/searchPages/searchUtils/searchPage.component.ts b/searchPages/searchUtils/searchPage.component.ts
new file mode 100644
index 00000000..145fdb92
--- /dev/null
+++ b/searchPages/searchUtils/searchPage.component.ts
@@ -0,0 +1,551 @@
+import {Component, Input, ViewChild, Output, EventEmitter,ElementRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Location} from '@angular/common';
+import {  Router} from '@angular/router';
+
+import { Filter, Value} from './searchHelperClasses.class';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass} from './searchUtils.class';
+import {DOI, StringUtils} from '../../utils/string-utils.class';
+import {ModalLoading} from '../../utils/modal/loading.component';
+import { Meta} from '../../../angular2-meta';
+import{SearchFilterComponent} from './searchFilter.component';
+import {SearchFilterModalComponent} from './searchFilterModal.component';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import { ErrorCodes} from '../../utils/properties/openaireProperties';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+
+@Component({
+    selector: 'search-page',
+    templateUrl: 'searchPage.component.html'
+
+})
+export class SearchPageComponent {
+  @Input() pageTitle = "";
+  @Input() formPlaceholderText = "Type Keywords...";
+  @Input() results = [];
+  @Input() filters = [];
+  @Input() type:string = "";
+  @Input() entityType: string = "";
+  @Input() searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  @Output() queryChange  = new EventEmitter();
+  @Input() baseUrl:string = '';
+  @Input() showResultCount:boolean = true;
+  @Input() showRefine:boolean = true;
+  @Input() refineFields = [];
+  @Input() csvParams: string;
+  @Input() csvPath: string;
+  @Input() advancedSearchLink: string = "";
+  @Input() tableViewLink: string;
+  @Input() disableForms: boolean = false;
+  @Input() loadPaging: boolean = true;
+  @Input() oldTotalResults: number = 0;
+  @Input() tableView: boolean = false;
+  @Input() searchFormClass: string = "searchForm";
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  public fieldIdsMap;//:  { [key:string]:{ name:string, operator:string, type:string, indexField:string, equalityOperator:string  }};
+  private searchFieldsHelper:SearchFields = new SearchFields();
+  private queryParameters: Map<string, string>  = new Map<string,string>();
+  private baseURLWithParameters:string = '';
+  private sub: any; piwiksub: any;
+  public countFilters= 0;
+  public parameterNames:string[] =[];
+  public parameterValues:string[] =[];
+  public showUnknownFilters:boolean = false; // when a filter exists in query but has no results, so no filters returned from the query
+  //@ViewChild (SearchFilterModalComponent) searchFilterModal : SearchFilterModalComponent ;
+  public currentFilter: Filter;
+
+  constructor (private location: Location , private _meta: Meta,private element: ElementRef,private _piwikService:PiwikService, private router: Router) {
+   }
+
+  ngOnInit() {
+    if (typeof document !== 'undefined') {
+       this.element.nativeElement.scrollIntoView();
+    }
+        // this.updateBaseUrlWithParameters(this.filters);
+        this.updateTitle(this.pageTitle);
+        this.updateDescription("Openaire, search, repositories, open access, type, content provider, funder, project, " + this.type + "," +this.pageTitle);
+        if(typeof window !== 'undefined') {
+          this.updateUrl(OpenaireProperties.getBaseLink()+location.pathname);
+        }
+        if(typeof document !== 'undefined' && OpenaireProperties.isPiwikTrackEnabled()){
+          this.piwiksub = this._piwikService.trackView(this.pageTitle).subscribe();
+        }
+  }
+  ngAfterViewChecked(){
+
+  }
+  ngOnDestroy() {
+    if(this.piwiksub){
+      this.piwiksub.unsubscribe();
+    }
+  }
+  toggleModal($event) {
+    this.currentFilter = $event.value;
+    //this.searchFilterModal.open();
+  }
+
+  updateDescription(description:string){
+    this._meta.updateMeta("description", description);
+    this._meta.updateProperty("og:description", description);
+  }
+  updateTitle(title:string){
+    var _prefix ="OpenAIRE | ";
+    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+    this._meta.setTitle(_title );
+    this._meta.updateProperty("og:title",_title);
+  }
+  updateUrl(url:string){
+    this._meta.updateProperty("og:url", url);
+  }
+
+  public getQueryParametersFromUrl(params){
+    // var parameters = "";
+    var allFqs = "";
+
+    this.queryParameters = new Map<string,string>();
+    for(var i=0; i< this.refineFields.length ; i++){
+         var filterId =  this.refineFields[i];
+
+          if(params[filterId] != undefined) {
+             this.queryParameters.set(filterId, StringUtils.URIDecode(params[filterId]));
+             let values = (StringUtils.URIDecode(this.queryParameters.get(filterId))).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
+             var countvalues = 0;
+             var fq = "";
+             for(let value of values) {
+               countvalues++;
+               var paramId = this.fieldIdsMap[filterId].param;
+              // parameters+='&' + paramId+ '='+ value;//+"&" + this.fieldIdsMap[paramId].operator + "="+((countvalues == 1)?"and":"or");
+              fq+=(fq.length > 0 ? " " + "or" + " ":"" ) + filterId +" exact " +StringUtils.URIEncode(value);
+             }
+             if(countvalues > 0){
+               fq="&fq="+fq;
+             }
+             allFqs += fq;
+          }
+   }
+   var keyword = params['keyword'];
+   var doiQuery = "";
+   var keywordQuery = "";
+   if((keyword && keyword.length > 0)){
+      if((this.type == 'publications' ||this.type == 'research data')){
+        var DOIs:string[] = DOI.getDOIsFromString(keyword);
+       var doisParams = "";
+
+       for(var i =0 ;i < DOIs.length; i++){
+         doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+       }
+       if(doisParams.length > 0){
+         doiQuery += "&"+doisParams;
+       }else {
+        keywordQuery += "&q="+StringUtils.URIEncode(keyword);
+       }
+     }else{
+        keywordQuery += "&q="+StringUtils.URIEncode(keyword);
+
+     }
+   }
+   return (doiQuery.length > 0 ? doiQuery:keywordQuery) + allFqs;
+ }
+ public getIndexQueryParametersFromUrl(params){
+  //  var parameters = "";
+   var allFqs = "";
+
+   for(var i=0; i< this.refineFields.length ; i++){
+        var filterId =  this.refineFields[i];
+        var fq = "";
+         if(params[filterId] != undefined) {
+            this.queryParameters.set(filterId,decodeURIComponent(params[filterId]));
+            let values = (decodeURIComponent(this.queryParameters.get(filterId))).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
+            var countvalues = 0
+            for(let value of values) {
+              countvalues++;
+              // parameters+= ((countvalues == 1)?" and (":" or ")+ filterId+ '='+ value;
+              fq+=(fq.length > 0 ? " " + "or" + " ":"" ) + filterId + " exact " + value;//StringUtils.quote(value);
+            }
+            // parameters+= " ) ";
+            if(countvalues > 0){
+              fq="&fq="+fq;
+            }
+            allFqs += fq;
+        }
+
+  }
+  var keyword = params['keyword'];
+  var doiQuery = "";
+  var keywordQuery = "";
+  if((keyword && keyword.length > 0)){
+    if((this.type == 'publications' ||this.type == 'research data')){
+      var DOIs:string[] = DOI.getDOIsFromString(keyword);
+      var doisParams = "";
+
+      for(var i =0 ;i < DOIs.length; i++){
+        doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+      }
+      if(doisParams.length > 0){
+        doiQuery += "&"+doisParams;
+      }
+    }else{
+       keywordQuery += "and ("+StringUtils.quote(StringUtils.URIEncode(keyword)) +")";
+
+    }
+  }
+  return (doiQuery.length > 0 ? doiQuery:keywordQuery) + allFqs;
+
+}
+ /*
+ * Mark as check the new filters that are selected, when you get them from search
+ */
+  public checkSelectedFilters(filters:Filter[]){
+    this.filters = filters;
+       for(var i=0; i< filters.length ; i++){
+            var filter:Filter = filters[i];
+            filter.countSelectedValues = 0;
+              if(this.queryParameters.get(filter.filterId) != undefined) {
+                let values = (decodeURIComponent(this.queryParameters.get(filter.filterId))).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
+                     for(let filterValue of filter.values) {
+                       if(values.indexOf(StringUtils.quote(filterValue.id)) > -1) {
+                            filterValue.selected = true;
+                            filter.countSelectedValues++;
+                         }else{
+                           filterValue.selected = false;
+
+                         }
+                    }
+            }else{
+              for(let filterValue of filter.values) {
+                 filterValue.selected = false;
+              }
+            }
+        }
+        this.filterFilterValues(this.filters);
+        return filters;
+  }
+  /*
+  * For Funder filters - if funder selected
+  */
+   public filterFilterValues(filters:Filter[]){
+     var funders = [];
+     var funder_prefix = [];
+        for(var i=0; i< filters.length ; i++){
+
+             var filter:Filter = filters[i];
+            //  console.log(filter.filterId);
+             if(filter.filterId.indexOf("funder")!=-1 && this.queryParameters.get(filter.filterId) != undefined) {
+                 let funders = (decodeURIComponent(this.queryParameters.get(filter.filterId))).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
+                      for(let funder of funders) {
+                        console.log(funder);
+                        funder_prefix.push(StringUtils.unquote(funder).split("____")[0]);
+                     }
+                    //  console.log(funder_prefix );
+             }else if(filter.filterId.indexOf("funding")!=-1){
+              //  console.log(" funding: "+filter.filterId );
+               var filteredValues = []
+               for(let filterValue of filter.values) {
+                 var value_prefix = filterValue.id.split("____")[0];
+                //  console.log("Value prefix: "+value_prefix );
+                 if(funder_prefix.indexOf(value_prefix)!=-1){
+                  //  console.log("here" + value_prefix);
+                   filteredValues.push(filterValue);
+                 }
+
+               }
+               console.log("From " +filter.values.length+ "to "+filteredValues.length);
+               if(filteredValues.length > 0){
+                 filter.values = filteredValues;
+               }
+             }
+
+         }
+
+         return filters;
+   }
+  /*
+  * Update the url with proper parameters. This is used as base url in Paging Component
+  */
+  public updateBaseUrlWithParameters(filters:Filter[]){
+    this.baseURLWithParameters = this.baseUrl + this.createUrlParameters(filters,false);
+
+  }
+
+  /*
+  *Get The filters and create url parameters
+  */
+  private createUrlParameters(filters:Filter[], includePage:boolean){
+    var allLimits="";//location.search.slice(1);
+    this.queryParameters = new Map<string,string>();
+    this.parameterNames.splice(0,this.parameterNames.length);
+    this.parameterValues.splice(0,this.parameterValues.length);
+
+    for (let filter of filters){
+      var filterLimits="";
+      if(filter.countSelectedValues > 0){
+        for (let value of filter.values){
+          if(value.selected == true){
+            filterLimits+=((filterLimits.length == 0)?'':',') +'"'+ StringUtils.URIEncode(value.id)+'"';
+           }
+        }
+        this.queryParameters.set(filter.filterId,filterLimits);
+        if(filterLimits.length > 0){
+          this.parameterNames.push(filter.filterId);
+          this.parameterValues.push(filterLimits);
+        }
+        allLimits+=(allLimits.length==0?"?":"&")+((filterLimits.length == 0 )?'':filter.filterId + '='+ filterLimits) ;
+      }
+    }
+    if(this.searchUtils.keyword.length > 0 ){
+       allLimits+=(allLimits.length==0?"?":"&")+'keyword=' + this.searchUtils.keyword;
+      this.parameterNames.push("keyword");
+      this.parameterValues.push(this.searchUtils.keyword);
+     }
+    if(this.searchUtils.page != 1 && includePage){
+       allLimits+=((allLimits.length == 0)?'?':'&') + 'page=' + this.searchUtils.page;
+    }
+
+    return allLimits;
+  }
+  /*
+  *
+  */
+  private createSearchQueryParameters(filters:Filter[]){
+    var allFqs = "";
+    for (let filter of filters){
+      if(filter.countSelectedValues > 0){
+        var fq = "";
+        var count_selected=0;
+        for (let value of filter.values){
+          if(value.selected == true){
+              count_selected++;
+              fq+=(fq.length > 0 ? " " + filter.filterOperator + " ":"" ) + filter.filterId +  " exact " + StringUtils.quote(StringUtils.URIEncode(value.id));
+           }
+        }
+        fq="&fq="+fq;
+        allFqs += fq;
+      }
+    }
+    var doiQuery = "";
+    var keywordQuery = "";
+    if((this.searchUtils.keyword && this.searchUtils.keyword.length > 0)){
+      if((this.type == 'publications' ||this.type == 'research data')){
+        var DOIs:string[] = DOI.getDOIsFromString(this.searchUtils.keyword);
+        var doisParams = "";
+
+        for(var i =0 ;i < DOIs.length; i++){
+          doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+        }
+        if(doisParams.length > 0){
+          doiQuery += "&"+doisParams;
+        }else{
+          keywordQuery += "&q="+StringUtils.URIEncode(this.searchUtils.keyword);
+        }
+      }else{
+           keywordQuery += "&q="+StringUtils.URIEncode(this.searchUtils.keyword);
+      }
+    }
+
+    return (doiQuery.length > 0 ? doiQuery:keywordQuery) + allFqs;
+
+  }
+  private createIndexQueryParameters(filters:Filter[]){
+    var allFqs = "";
+    for (let filter of filters){
+      if(filter.countSelectedValues > 0){
+        var count_selected=0;
+        var fq = "";
+        for (let value of filter.values){
+          if(value.selected == true){
+              count_selected++;
+               fq+=(fq.length > 0 ? " " + filter.filterOperator + " ":"" ) + filter.filterId + " exact " + StringUtils.quote(StringUtils.URIEncode(value.id));
+           }
+        }
+        if(count_selected > 0){
+          fq="&fq="+fq;
+          allFqs += fq;
+        }
+      }
+    }
+    var doiQuery = "";
+    var keywordQuery = "";
+    if((this.searchUtils.keyword && this.searchUtils.keyword.length > 0)){
+      if((this.type == 'publications' ||this.type == 'research data')){
+        var DOIs:string[] = DOI.getDOIsFromString(this.searchUtils.keyword);
+        var doisParams = "";
+        for(var i =0 ;i < DOIs.length; i++){
+          doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+        }
+        if(doisParams.length > 0){
+          doiQuery += "&"+doisParams;
+        }
+      }else{
+         keywordQuery += " and ("+StringUtils.quote(StringUtils.URIEncode(this.searchUtils.keyword)) +")"
+
+      }
+    }
+    return (doiQuery.length > 0 ? doiQuery:keywordQuery) + allFqs;
+
+  }
+  public isFiltered(){
+    var filtered=false;
+    this.showUnknownFilters = false;
+    for (let filter of this.filters){
+       if(filter.countSelectedValues > 0){
+           filtered = true;
+           break;
+       }
+     }
+    if(this.searchUtils.keyword.length > 0 ){
+      filtered = true;
+    }
+    var errorCodes:ErrorCodes = new ErrorCodes();
+    if(this.queryParameters.keys() && this.searchUtils.totalResults == 0 && this.searchUtils.status !=errorCodes.LOADING ){
+      this.showUnknownFilters = true;
+    }
+    return filtered;
+  }
+  private clearKeywords(){
+    if(this.searchUtils.keyword.length > 0 ){
+      this.searchUtils.keyword ='';
+    }
+    this.goTo(1);
+  }
+  private clearFilters(){
+    for (var i =0 ; i <  this.filters.length; i++){
+         for (var j=0; j <  this.filters[i].countSelectedValues; j++){
+          if(this.filters[i].values[j].selected){
+            this.filters[i].values[j].selected = false;
+           }
+        this.filters[i].countSelectedValues = 0;
+      }
+    }
+    this.clearKeywords();
+
+  }
+  private removeFilter(value:Value,filter:Filter){
+    filter.countSelectedValues--;
+    if(value.selected == true){
+      value.selected = false;
+     }
+    this.goTo(1);
+
+  }
+  goTo(page:number = 1){
+    this.searchUtils.page = page;
+    console.info("searchUtils.page goto = "+this.searchUtils.page);
+    var urlParameters = this.createUrlParameters(this.filters,true);
+    console.info("urlParams : "+urlParameters);
+    this.updateBaseUrlWithParameters(this.filters);
+    var queryParameters = this.createSearchQueryParameters(this.filters);
+    console.info("queryParams : "+queryParameters);
+    var indexQuery = this.createIndexQueryParameters(this.filters);
+
+    this.location.go(location.pathname,urlParameters);
+/* Code For Piwik*/
+    if (typeof localStorage !== 'undefined') {
+      localStorage.setItem('previousRoute', this.router.url);
+    }
+    if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+      this.piwiksub = this._piwikService.trackView(this.pageTitle).subscribe();
+    }
+    /* End Piwik Code */
+    this.queryChange.emit({
+        value: queryParameters,
+        index:indexQuery
+
+    });
+    if (typeof document !== 'undefined') {
+       this.element.nativeElement.scrollIntoView();
+    }
+  }
+  filterChanged($event){
+    console.info("filter Changed");
+       this.goTo(1);
+  }
+  keywordChanged($event) {
+       this.searchUtils.keyword = $event.value;
+       this.goTo(1);
+  }
+
+  /*
+  * Get A sub-array of this.refineFields array, which contains the ids of the selected filters
+  */
+  public getSelectedFilters():string[] {
+    var selected:string[] = [];
+    for(var i=0; i <  this.filters.length; i++){
+      var filter:Filter = this.filters[i];
+      if(filter.countSelectedValues > 0){
+          selected.push(filter.filterId);
+      }
+    }
+    return selected;
+  }
+  /*
+  * Get A sub-array of this.refineFields array, which contains the ids of the selected parameters
+  */
+  private getSelectedParameters():string[] {
+    var selected:string[] = [];
+    var params:string[] = Object.keys(this.queryParameters);
+    for(var i=0; i <  params.length; i++){
+       if(this.refineFields.indexOf(params[i]) > -1){
+          selected.push(params[i]);
+      }
+    }
+    return selected;
+  }
+  /*
+  * Get A sub-array of this.refineFields array, which hides hidden fields (e.g Funding level 0,1,2,..), and contains those that depend on another fields (e.g  Funding level 0 if Funder is selected )
+  */
+  public getFields():string[] {
+    var selected_filters:string[] = this.getSelectedFilters();
+    if(selected_filters.length == 0){
+      selected_filters = this.getSelectedParameters();
+    }
+    var fields:string[] = [];
+    for(var i =0 ; i < this.refineFields.length;i++){
+      var dependentTo = this.searchFieldsHelper.DEPENDENT_FIELDS[this.refineFields[i]];
+
+      //if filter is not marked as hidden OR it is hidden but it is dependent to a field that it IS selected
+      if(this.searchFieldsHelper.HIDDEN_FIELDS.indexOf(this.refineFields[i]) == -1 || (selected_filters.indexOf(dependentTo) != -1) || (selected_filters.indexOf(this.refineFields[i]) != -1) ){
+          fields.push(this.refineFields[i]);
+       }
+    }
+    return fields;
+  }
+  /*
+  * Get a query  string of all fields, that want to get from search (e.g. &fields=funderid&fields=projectstartyear&...))
+  */
+  public getRefineFieldsQuery():string{
+
+    var fields:string[] = this.getFields();
+    var fieldsStr = ""
+    for(var i =0 ; i < fields.length  ;i++){
+        fieldsStr+="&fields="+fields[i];
+    }
+    return "&refine=true"+fieldsStr;
+  }
+
+  // for loading
+  public openLoading(){
+    if(this.loading){
+      this.loading.open();
+    }
+  }
+  public closeLoading(){
+    if(this.loading){
+      this.loading.close();
+    }
+  }
+  getSelectedValues(filter):any{
+    var selected = [];
+    if(filter.countSelectedValues >0){
+      for (var i=0; i < filter.values.length; i++){
+        if(filter.values[i].selected){
+          selected.push(filter.values[i]);
+        }
+      }
+    }
+    return selected;
+
+  }
+}
diff --git a/searchPages/searchUtils/searchPage.module.ts b/searchPages/searchUtils/searchPage.module.ts
new file mode 100644
index 00000000..39fc78fd
--- /dev/null
+++ b/searchPages/searchUtils/searchPage.module.ts
@@ -0,0 +1,40 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import{SearchPageComponent} from './searchPage.component';
+import{SearchFormModule} from './searchForm.module';
+import{SearchResultsModule} from './searchResults.module';
+//import{DatasourceTableViewModule} from './datasourceTableView.module';
+//import{SearchFilterComponent} from './searchFilter.component';
+//import{SearchFilterModalComponent} from './searchFilterModal.component';
+import {SearchFilterModule} from './searchFilter.module';
+import{LoadingModalModule} from '../../utils/modal/loadingModal.module';
+import {ReportsServiceModule} from '../../services/reportsService.module';
+import{SearchPagingModule} from './searchPaging.module';
+import {SearchDownloadModule} from './searchDownload.module';
+import {ModalModule} from '../../utils/modal/modal.module';
+import {PiwikServiceModule} from '../../utils/piwik/piwikService.module';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+import {HelperModule} from '../../utils/helper/helper.module';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,RouterModule,  SearchFormModule, SearchResultsModule,
+    LoadingModalModule, ReportsServiceModule,
+    SearchPagingModule, SearchDownloadModule, ModalModule, SearchFilterModule, PiwikServiceModule, HelperModule
+  ],
+  declarations: [
+    SearchPageComponent
+],
+
+  providers:[
+    PreviousRouteRecorder
+  ],
+  exports: [
+    SearchPageComponent
+    ]
+})
+export class SearchPageModule { }
diff --git a/searchPages/searchUtils/searchPageTableView.component.html b/searchPages/searchUtils/searchPageTableView.component.html
new file mode 100644
index 00000000..ccd8c450
--- /dev/null
+++ b/searchPages/searchUtils/searchPageTableView.component.html
@@ -0,0 +1,197 @@
+<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
+  <div uk-grid uk-grid>
+    <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">
+      <div   [class]="'uk-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle '+searchFormClass" >
+        <div   class="uk-width-1-1">
+          <div   class="uk-width-1-1">
+            <search-form [isDisabled]="disableForms" [(keyword)]="searchUtils.keyword" (keywordChange)="keywordChanged($event)"  [placeholderText]="formPlaceholderText"></search-form>
+          </div>
+          <div   class="uk-width-1-1  uk-light">
+            <div *ngIf="isFiltered()" class = "uk-container uk-text-center ">
+              <span *ngIf = "searchUtils.keyword.length > 0">Keywords: <span>{{searchUtils.keyword}}<a (click) = "clearKeywords() " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable " aria-hidden="true"><span class="uk-icon">
+                <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+                </span></span></a></span>
+              </span>
+              <span *ngFor="let filter of filters " >
+                <span *ngIf = "filter.countSelectedValues > 0"> {{filter.title}}:
+                  <span *ngFor="let value of getSelectedValues(filter); let i = index;  let end = last; " >{{value.name}}<a (click) = "removeFilter(value, filter) " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable" aria-hidden="true"><span class="uk-icon">
+                    <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+                    </span></span></a>
+                    <span *ngIf="!end">, </span>
+                  </span>
+                </span>
+              </span>
+
+              <a (click)="clearFilters()" [class]="(disableForms)?'uk-disabled uk-link-muted':''">
+                Clear All
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div  class="uk-container">
+        <helper position="top"></helper>
+        <div  class="uk-width-2-3@m  uk-width-2-3@l  uk-width-1-1@s">
+
+          <div class="uk-offcanvas-content uk-hidden@m">
+            <a href="#offcanvas-usage" uk-toggle><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="6" y="4" width="12" height="1"></rect><rect x="6" y="9" width="12" height="1"></rect><rect x="6" y="14" width="12" height="1"></rect><rect x="2" y="4" width="2" height="1"></rect><rect x="2" y="9" width="2" height="1"></rect><rect x="2" y="14" width="2" height="1"></rect></svg></a>
+
+            <div id="offcanvas-usage" uk-offcanvas>
+              <div class="uk-offcanvas-bar">
+                <button class="uk-offcanvas-close" type="button" uk-close></button>
+                <div class="uk-text-large">Filter By:</div>
+                <search-filter  *ngFor="let filter of filters " [addShowMore]=false [isDisabled]="disableForms" [filter]="filter"  [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
+              </div>
+            </div>
+
+          </div>
+        </div>
+
+        <div  class="uk-grid uk-width-1-1">
+          <div class="helper-left-right search-filters uk-width-1-6@m  uk-visible@m">
+            <helper position="left"></helper>
+            <search-filter  *ngFor="let filter of filters " [isDisabled]="disableForms" [filter]="filter"  [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
+          </div>
+
+          <div class="uk-width-expand@m uk-width-1-1@s uk-first-column" >
+            <div *ngIf="searchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">
+              <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">
+                <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">
+                  {{searchUtils.totalResults}} content providers, page {{searchUtils.page}} of {{(totalPages())}}
+                </span>
+                <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">
+                  <paging-no-load [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load>
+                </span>
+              </div>
+            </div>
+
+            <div *ngIf="searchViewLink" class="uk-width-1-1@s uk-hidden@m">
+              <p>
+                <span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
+
+                <a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=searchViewLink >
+                  <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
+                </a>
+              </p>
+            </div>
+
+            <div *ngIf="searchUtils.totalResults <= 0" class="errors-in-searchTableView">
+              <errorMessages [status]="[searchUtils.status]" [type]="'results'"></errorMessages>
+            </div>
+
+            <div class="uk-overflow-container custom-dataTable-content">
+              <table  class="uk-table uk-table-striped divider-table"  #mf="mfDataTable" [mfRowsOnPage]="rowsOnPage"
+                      [mfData]="results | contentProvidersDatatable : [searchUtils, filters, triggerPipe, cd]">
+
+                <thead *ngIf="searchUtils.totalResults > 0">
+                  <tr>
+                    <!-- Name	Type	Country	Institution	Compatibility -->
+                    <th class="uk-text-left"><mfDefaultSorter by="title.name">Name</mfDefaultSorter>
+                      <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+                        <polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
+                        <polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
+                      </svg>
+                    </th>
+                    <th class="uk-text-center"><mfDefaultSorter by="type">Type</mfDefaultSorter>
+                      <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+                        <polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
+                        <polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
+                      </svg>
+                    </th>
+                    <th class="uk-text-center"><mfDefaultSorter by="countries">Country</mfDefaultSorter>
+                      <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+                        <polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
+                        <polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
+                      </svg>
+                    </th>
+                    <th class="uk-text-center"><mfDefaultSorter [by]="sortByOrganization">Institution</mfDefaultSorter>
+                      <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+                        <polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
+                        <polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
+                      </svg>
+                    </th>
+                    <th class="uk-text-center"><mfDefaultSorter by="compatibility">Compatibility</mfDefaultSorter>
+                      <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+                        <polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
+                        <polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
+                      </svg>
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr class="uk-table-middle" *ngFor="let dataprovider of mf.data">
+                    <td  class="uk-width-1-5 uk-text-left">
+                      <a [queryParams]="{datasourceId: dataprovider.id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
+                        <span *ngIf="dataprovider.title.name"
+                              [innerHTML]="dataprovider.title.name">
+                        </span>
+                        <span *ngIf="!dataprovider.title.name">
+                          [no title available]
+                        </span>
+                      </a>
+                    </td>
+                    <td class="uk-width-1-5 uk-text-center">
+                      <span *ngIf="dataprovider.type">{{dataprovider.type}}</span>
+                      <span *ngIf="!dataprovider.type">-</span>
+                    </td>
+                    <td class="uk-width-1-5 uk-text-center">
+                      <span *ngFor="let country of dataprovider['countries'].slice(0,5) let i = index">{{country}}{{(i < ( dataprovider['countries'].slice(0,5).length-1))?", ":""}}{{(i ==  dataprovider['countries'].slice(0,5).length-1 &&  dataprovider['countries'].length > 5)?"...":""}}</span>
+                      <span *ngIf="dataprovider.countries.length == 0">-</span>
+                    </td>
+                    <td class="uk-width-1-5 uk-text-center">
+                      <span *ngFor="let org of dataprovider['organizations'].slice(0,5) let i = index">
+                        <a *ngIf="org.id" [queryParams]="{organizationId: org.id}" routerLinkActive="router-link-active" routerLink="/search/organization">{{org.name}}</a><span *ngIf="!org.id">{{org.name}}</span>{{(i < ( dataprovider['organizations'].slice(0,5).length-1))?", ":""}}{{(i ==  dataprovider['organizations'].slice(0,5).length-1 &&  dataprovider['organizations'].length > 5)?"...":""}}
+                      </span>
+                      <span *ngIf="dataprovider.organizations.length == 0">-</span>
+                    </td>
+                    <td  class="uk-width-1-5 uk-text-center">
+                      <span *ngIf="dataprovider.compatibility">{{dataprovider.compatibility}}</span>
+                      <span *ngIf="!dataprovider.compatibility">-</span>
+                    </td>
+                  </tr>
+                </tbody>
+                <!-- <thead *ngIf="searchUtils.totalResults > 0">
+                  <tr><td colspan="5" class="uk-padding-remove-horizontal">
+                    <span class="uk-h6">
+                      {{searchUtils.totalResults}} content providers, page {{searchUtils.page}} of {{(totalPages())}}
+                    </span>
+                    <paging-no-load class="uk-float-right" [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load>
+                  </td></tr>
+                </thead> -->
+              </table>
+            </div>
+
+            <div *ngIf="searchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">
+              <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">
+                <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">
+                  {{searchUtils.totalResults}} content providers, page {{searchUtils.page}} of {{(totalPages())}}
+                </span>
+                <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">
+                  <paging-no-load [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load>
+                </span>
+              </div>
+            </div>
+
+            <helper class="uk-hidden@m" position="left" styleName="uk-width-1-1@s"></helper>
+            <helper class="uk-hidden@m" position="right" styleName="uk-width-1-1@s"></helper>
+          </div>
+
+          <div *ngIf="searchViewLink" class="helper-left-right uk-width-1-6@m uk-visible@m">
+            <p>
+              <span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
+
+              <a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=searchViewLink >
+                <span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
+              </a>
+            </p>
+
+            <helper position="right"></helper>
+          </div>
+        </div>
+
+        <helper position="bottom"></helper>
+      </div>
+      <modal-search-filter [filter]="currentFilter" [showResultCount]=showResultCount (modalChange)="filterChanged($event)"></modal-search-filter>
+    </div>
+  </div>
+</div>
diff --git a/searchPages/searchUtils/searchPageTableView.component.ts b/searchPages/searchUtils/searchPageTableView.component.ts
new file mode 100644
index 00000000..50d206fa
--- /dev/null
+++ b/searchPages/searchUtils/searchPageTableView.component.ts
@@ -0,0 +1,272 @@
+import {Component, Input, ViewChild, Output, EventEmitter, ChangeDetectorRef} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {Location} from '@angular/common';
+import { Filter, Value} from './searchHelperClasses.class';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchUtilsClass} from './searchUtils.class';
+import {DOI, StringUtils} from '../../utils/string-utils.class';
+import {ModalLoading} from '../../utils/modal/loading.component';
+import { Meta} from '../../../angular2-meta';
+import{SearchFilterComponent} from './searchFilter.component';
+import {SearchFilterModalComponent} from './searchFilterModal.component';
+import { ErrorCodes} from '../../utils/properties/openaireProperties';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import {ContentProvidersDatatablePipe} from '../../utils/pipes/contentProvidersDatatable.pipe';
+import {PiwikService} from '../../utils/piwik/piwik.service';
+
+@Component({
+    selector: 'search-page-table',
+    templateUrl:'searchPageTableView.component.html'
+  })
+export class SearchPageTableViewComponent {
+  @Input() pageTitle = "";
+  @Input() results;
+  @Input() filters = [];
+  @Input() type:string = "";
+  @Input() entityType: string = "";
+  @Input() searchUtils:SearchUtilsClass;// = new SearchUtilsClass();
+  //@Output() downloadClick = new EventEmitter();
+  @Input() showResultCount:boolean = true;
+  @Input() showRefine:boolean = true;
+  @Input() refineFields = [];
+  //@Input() csvParams: string;
+  //@Input() csvPath: string;
+  @Input() searchViewLink: string;
+  @Input() disableForms: boolean = false;
+  @Input() searchFormClass: string = "searchForm";
+@Input() formPlaceholderText = "Type Keywords...";
+  @ViewChild (ModalLoading) loading : ModalLoading ;
+  private searchFieldsHelper:SearchFields = new SearchFields();
+  private queryParameters: Map<string, string>  = new Map<string,string>();
+  private sub: any;
+  public countFilters= 0;
+  public parameterNames:string[] =[];
+  public parameterValues:string[] =[];
+
+  public triggerPipe: boolean = false;
+
+  public rowsOnPage:number  = 10;
+  @ViewChild('mf') table: any;//DataTable;
+
+  @ViewChild (SearchFilterModalComponent) searchFilterModal : SearchFilterModalComponent ;
+  public currentFilter: Filter;
+  public errorCodes:ErrorCodes = new ErrorCodes();
+  piwiksub: any;
+
+  constructor (private location: Location , private _meta: Meta, private _piwikService:PiwikService, public cd: ChangeDetectorRef) { }
+
+  ngOnInit() {
+        this.updateTitle(this.pageTitle);
+        this.updateDescription("Openaire, search, repositories, open access, type, content provider, funder, project, " + this.type + "," +this.pageTitle);
+        if(typeof window !== 'undefined') {
+          this.updateUrl(OpenaireProperties.getBaseLink()+location.pathname);
+        }
+        if(OpenaireProperties.isPiwikTrackEnabled() && (typeof document !== 'undefined')){
+          this.piwiksub = this._piwikService.trackView(this.pageTitle).subscribe();
+        }
+  }
+  ngOnDestroy() {
+     if(this.piwiksub){
+  this.piwiksub.unsubscribe();
+}
+  }
+  public sortByOrganization = (dataprovider: any) => {
+    if(dataprovider.organizations && dataprovider.organizations.length > 0) {
+      return dataprovider.organizations[0].name.toUpperCase();
+    }
+    return "-";
+  }
+
+  totalPages(): number {
+      let totalPages:any = this.searchUtils.totalResults/(this.rowsOnPage);
+      if(!(Number.isInteger(totalPages))) {
+          totalPages = (parseInt(totalPages, 10) + 1);
+      }
+      return totalPages;
+  }
+
+  refreshTable(page:number) {
+    this.searchUtils.page=page;
+    //this.table.mfActivePage=$event.value;
+    this.table.setPage(this.searchUtils.page, this.rowsOnPage);
+  }
+
+  toggleModal($event) {
+    this.currentFilter = $event.value;
+    this.searchFilterModal.open();
+  }
+
+  updateDescription(description:string){
+    this._meta.updateMeta("description", description);
+    this._meta.updateProperty("og:description", description);
+  }
+  updateTitle(title:string){
+    var _prefix ="OpenAIRE | ";
+    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+    this._meta.setTitle(_title );
+    this._meta.updateProperty("og:title",_title);
+  }
+  updateUrl(url:string){
+    this._meta.updateProperty("og:url", url);
+  }
+
+public getParametersFromUrl(params) {
+  for(var i=0; i< this.refineFields.length ; i++) {
+    var filterId =  this.refineFields[i];
+    if(params[filterId] != undefined) {
+      if(this.queryParameters == undefined){
+        this.queryParameters = new Map<string,string>();
+      }
+      this.queryParameters[filterId]=decodeURIComponent(params[filterId]);
+    }
+  }
+}
+ /*
+ * Mark as check the new filters that are selected, when you get them from search
+ */
+  public checkSelectedFilters(filters:Filter[]){
+
+    this.filters = filters;
+       for(var i=0; i< filters.length ; i++){
+            var filter:Filter = filters[i];
+            filter.countSelectedValues = 0;
+
+              if(this.queryParameters[filter.filterId] != undefined) {
+                let values = (decodeURIComponent(this.queryParameters[filter.filterId])).split(/,(?=(?:[^\"]*\"[^\"]*\")*[^\"]*$)/,-1);
+                     for(let filterValue of filter.values) {
+                       if(values.indexOf(StringUtils.quote(filterValue.id)) > -1) {
+                            filterValue.selected = true;
+                            filter.countSelectedValues++;
+                         }else{
+                           filterValue.selected = false;
+                         }
+                    }
+            }else{
+              for(let filterValue of filter.values) {
+                 filterValue.selected = false;
+              }
+            }
+        }
+
+        return filters;
+  }
+
+  /*
+  *
+  */
+  private createUrlParameters(filters:Filter[], includePage:boolean){
+    var allLimits="";//location.search.slice(1);
+    this.parameterNames.splice(0,this.parameterNames.length);
+    this.parameterValues.splice(0,this.parameterValues.length);
+
+    for (let filter of filters){
+      var filterLimits="";
+      if(filter.countSelectedValues > 0){
+        for (let value of filter.values){
+          if(value.selected == true){
+            filterLimits+=((filterLimits.length == 0)?'':',') +'"'+ StringUtils.URIEncode(value.id)+'"';
+           }
+        }
+        this.queryParameters[filter.filterId]=filterLimits;
+        if(filterLimits.length > 0){
+          this.parameterNames.push(filter.filterId);
+          this.parameterValues.push(filterLimits);
+        }
+        allLimits+=(allLimits.length==0?"?":"&")+((filterLimits.length == 0 )?'':filter.filterId + '='+ filterLimits) ;
+      }
+    }
+    if(this.searchUtils.keyword.length > 0 ){
+       allLimits+=(allLimits.length==0?"?":"&")+'keyword=' + this.searchUtils.keyword;
+      this.parameterNames.push("keyword");
+      this.parameterValues.push(this.searchUtils.keyword);
+     }
+
+    //if(this.searchUtils.page != 1 && includePage){
+    //   allLimits+=((allLimits.length == 0)?'?':'&') + 'page=' + this.searchUtils.page;
+    //}
+
+    return allLimits;
+  }
+
+  public isFiltered(){
+    var filtered=false;
+    for (let filter of this.filters){
+       if(filter.countSelectedValues > 0){
+           filtered = true;
+           break;
+       }
+     }
+    if(this.searchUtils.keyword.length > 0 ){
+      filtered = true;
+    }
+    return filtered;
+  }
+  private clearKeywords(){
+    if(this.searchUtils.keyword.length > 0 ){
+      this.searchUtils.keyword ='';
+    }
+    this.goTo(1, true);
+  }
+  private clearFilters(){
+    for (var i =0 ; i <  this.filters.length; i++) {
+         for (var j=0; j <  this.filters[i].values.length; j++) {
+          if(this.filters[i].values[j].selected) {
+            this.filters[i].values[j].selected = false;
+          }
+         }
+        this.filters[i].countSelectedValues = 0;
+    }
+    this.clearKeywords();
+  }
+
+  private removeFilter(value:Value,filter:Filter){
+    filter.countSelectedValues--;
+    if(value.selected == true){
+      value.selected = false;
+     }
+    this.goTo(1, true);
+  }
+  goTo(page:number = 1, triggerPipe:boolean = true){
+    this.refreshTable(page);
+
+    var urlParameters = this.createUrlParameters(this.filters,true);
+    this.location.go(location.pathname,urlParameters);
+    if(triggerPipe) {
+      this.triggerPipe = !this.triggerPipe;
+    }
+  }
+
+  filterChanged($event){
+       this.goTo(1, true);
+  }
+  keywordChanged($event) {
+       this.searchUtils.keyword = $event.value;
+       this.goTo(1, true);
+  }
+/*
+	downloadClicked($event) {
+		if($event.value == true) {
+		    var queryParameters = this.createSearchQueryParameters(this.filters);
+
+		    this.downloadClick.emit({
+		        value: queryParameters
+		    });
+		}
+	}
+*/
+
+
+  getSelectedValues(filter):any{
+    var selected = [];
+    if(filter.countSelectedValues >0){
+      for (var i=0; i < filter.values.length; i++){
+        if(filter.values[i].selected){
+          selected.push(filter.values[i]);
+        }
+      }
+    }
+    return selected;
+
+  }
+}
diff --git a/searchPages/searchUtils/searchPageTableView.module.ts b/searchPages/searchUtils/searchPageTableView.module.ts
new file mode 100644
index 00000000..2586914e
--- /dev/null
+++ b/searchPages/searchUtils/searchPageTableView.module.ts
@@ -0,0 +1,53 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import{SearchPageTableViewComponent} from './searchPageTableView.component';
+import{SearchFormModule} from './searchForm.module';
+import{SearchResultsModule} from './searchResults.module';
+//import{DatasourceTableViewModule} from './datasourceTableView.module';
+//import{SearchFilterComponent} from './searchFilter.component';
+//import{SearchFilterModalComponent} from './searchFilterModal.component';
+import {SearchFilterModule} from './searchFilter.module';
+import{LoadingModalModule} from '../../utils/modal/loadingModal.module';
+import {ReportsServiceModule} from '../../services/reportsService.module';
+import{SearchPagingModule} from './searchPaging.module';
+import {SearchDownloadModule} from './searchDownload.module';
+import {ModalModule} from '../../utils/modal/modal.module';
+import {PagingModule} from '../../utils/paging.module';
+import {DataTableModule} from "angular2-datatable";
+import {ContentProvidersDatatablePipe} from '../../utils/pipes/contentProvidersDatatable.pipe';
+
+import {PiwikServiceModule} from '../../utils/piwik/piwikService.module';
+import {PreviousRouteRecorder} from '../../utils/piwik/previousRouteRecorder.guard';
+
+import {HelperModule} from '../../utils/helper/helper.module';
+import {ErrorMessagesModule} from '../../utils/errorMessages.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,RouterModule,  SearchFormModule, SearchResultsModule,  LoadingModalModule,
+    ReportsServiceModule, SearchPagingModule, SearchDownloadModule, ModalModule, PagingModule,
+    DataTableModule, SearchFilterModule, PiwikServiceModule, HelperModule, ErrorMessagesModule
+  ],
+  declarations: [
+    SearchPageTableViewComponent//,
+    //SearchFilterComponent,
+    //SearchFilterModalComponent
+    ,
+    ContentProvidersDatatablePipe
+],
+
+  providers:[
+    PreviousRouteRecorder
+  ],
+  exports: [
+    SearchPageTableViewComponent//,
+    //SearchFilterComponent,
+    //SearchFilterModalComponent
+    ,
+    ContentProvidersDatatablePipe
+    ]
+})
+export class SearchPageTableViewModule { }
diff --git a/searchPages/searchUtils/searchPaging.component.ts b/searchPages/searchUtils/searchPaging.component.ts
new file mode 100644
index 00000000..5044baa3
--- /dev/null
+++ b/searchPages/searchUtils/searchPaging.component.ts
@@ -0,0 +1,58 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+import {Observable}       from 'rxjs/Observable';
+import {ErrorCodes} from '../../utils/properties/openaireProperties';
+
+@Component({
+    selector: 'search-paging',
+    template: `
+    <div class= "searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">
+      <div class="uk-h6 uk-width-1-1@s uk-width-1-2@m" *ngIf="results && searchUtils.totalResults > 0">
+        {{searchUtils.totalResults}} {{type}}, page {{searchUtils.page}} of {{(totalPages(searchUtils.totalResults))}}
+      </div>
+      <div class="uk-h6 uk-width-1-1@s uk-width-1-2@m" *ngIf="!loadPaging && oldTotalResults > 0 && searchUtils.status == errorCodes.LOADING">
+        {{oldTotalResults}} {{type}}, page {{searchUtils.page}} of {{(totalPages(oldTotalResults))}}
+      </div>
+      <div class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m" *ngIf="results && searchUtils.totalResults > searchUtils.size">
+        <paging [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults"  [baseUrl]="baseUrl" [size]="searchUtils.size"  [parameterNames] = "parameterNames" [parameterValues] = "parameterValues" > </paging>
+      </div>
+      <div class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m" *ngIf="!loadPaging && oldTotalResults > searchUtils.size && searchUtils.status == errorCodes.LOADING">
+        <paging [currentPage]="searchUtils.page" [totalResults]="oldTotalResults"  [baseUrl]="baseUrl" [size]="searchUtils.size"  [parameterNames] = "parameterNames" [parameterValues] = "parameterValues" > </paging>
+      </div>
+    </div>
+    `
+})
+
+export class SearchPagingComponent {
+    @Input() searchUtils;
+    @Input() results;
+    @Input() baseUrl;
+    @Input() type;
+    @Input() parameterNames:string[];
+    @Input() parameterValues:string[];
+
+    @Input() loadPaging: boolean = true;
+    @Input() oldTotalResults: number = 0;
+
+    public totalResults: number = 0;
+    public errorCodes:ErrorCodes = new ErrorCodes();
+
+    // @Input() totalResults:number = 0;
+    constructor () {}
+
+    ngOnInit() {
+      // this.totalResults = this.searchUtils.totalResults;
+      // if(!this.loadPaging && this.totalResults == 0) {
+      //   this.totalResults = this.oldTotalResults;
+      // }
+    }
+
+    totalPages(totalResults: number): number {
+        let totalPages:any = totalResults/(this.searchUtils.size);
+        if(!(Number.isInteger(totalPages))) {
+            totalPages = (parseInt(totalPages, 10) + 1);
+        }
+        return totalPages;
+    }
+
+
+}
diff --git a/searchPages/searchUtils/searchPaging.module.ts b/searchPages/searchUtils/searchPaging.module.ts
new file mode 100644
index 00000000..4a403bd1
--- /dev/null
+++ b/searchPages/searchUtils/searchPaging.module.ts
@@ -0,0 +1,23 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchPagingComponent} from './searchPaging.component';
+import{PagingModule} from '../../utils/paging.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, PagingModule
+  ],
+  declarations: [
+    SearchPagingComponent
+],
+
+  providers:[
+  ],
+  exports: [
+    SearchPagingComponent
+
+    ]
+})
+export class SearchPagingModule { }
diff --git a/searchPages/searchUtils/searchResult.component.html b/searchPages/searchUtils/searchResult.component.html
new file mode 100644
index 00000000..23393e07
--- /dev/null
+++ b/searchPages/searchUtils/searchResult.component.html
@@ -0,0 +1,139 @@
+ <ul [class]="'uk-list uk-list-divider  uk-margin '+custom_class">
+  <!--div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
+  <div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+  <div *ngIf="status == errorCodes.OUT_OF_BOUND" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">Requested page out of bounds</div>
+  <div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+  <div *ngIf="status == errorCodes.LOADING && showLoading"   class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div-->
+  <errorMessages [status]="[status]" [type]="'results'"></errorMessages>
+
+    <li *ngFor="let result of results" class="uk-animation-fade">
+        <!-- <h4 class = "{{result.title.accessMode}} {{result.title.sc39}}" [title] = result.title.accessMode > -->
+        <h4  [title] = result.title.accessMode >
+            <a [queryParams]="routerHelper.createQueryParam(urlParam,result.id)" routerLinkActive="router-link-active" routerLink="/search/{{type}}">
+                <p *ngIf="result['title'].name != undefined && result['title'].name != ''"
+                    [innerHTML]="result['title'].name">
+                </p>
+                <p *ngIf="result['title'].name == undefined || result['title'].name == ''">
+                    [no title available]
+                </p>
+            </a>
+        </h4>
+        <span *ngIf="result.types && result.types.length > 0" [class]="'uk-label custom-label label-blue label-'+result.entityType" title="Type">{{result.types.join(", ")}}</span>
+        <span *ngIf="result.languages && result.languages.length > 0" class="uk-label custom-label  label-language " title="Language">{{result.languages.join(", ")}}</span>
+        <span *ngIf="result.title && result.title.accessMode" [class]="'uk-label custom-label  label-'+ result.title.accessMode " title="Access Mode">{{result.title.accessMode}}</span>
+        <span *ngIf="result['funders'] && result['funders'].length > 0" class="uk-label custom-label label-funder " title="Funder"><span *ngFor="let funder of result['funders'] let i=index">
+
+            <span *ngIf="funder.funderShortname">
+              {{funder.funderShortname}}</span><span
+
+              *ngIf="i < result['funders'].length-1">, </span>
+        </span></span>
+        <span *ngIf="result.openAccessMandate != undefined && result.openAccessMandate " class="uk-label custom-label label-openaccessmandate " title="Open Access mandate">Open Access mandate</span>
+
+        <span *ngIf="result.title  && result.title.sc39" class="uk-label custom-label label-sc39 " title="Special Clause 39">Special Clause 39</span>
+        <div>
+            <span *ngIf="result['authors'] != undefined">
+                <span *ngFor="let author of result['authors'].slice(0,15)">
+                    <!--a href="{{author['url']}}"-->
+                    <!--a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="linkToAdvancedSearchPage">
+                        {{author['name']}};
+                    </a-->
+                    {{author}};
+                </span>
+                <span *ngIf="result['authors'].length > 15">...</span>
+            </span>
+            <span *ngIf="result.year != undefined && result.year != ''">
+                ({{result.year}})
+            </span>
+        </div>
+
+        <div *ngIf="result.publisher != undefined && result.publisher != ''"><span class="uk-text-bold">Publisher:</span> {{result.publisher}}</div>
+        <!-- <div *ngIf="result['compatibility'] != undefined && result['compatibility'] != ''">
+            Compatibility: {{result.compatibility}}
+        </div> -->
+        <span *ngIf="result['type'] != undefined && result['type'] != ''" class="uk-label custom-label label-blue label-dataprovider" title="Type"> {{result['type']}}</span>
+        <!-- <div *ngIf="result['type'] != undefined && result['type'] != ''">Type: {{result['type']}}</div> -->
+        <span *ngIf="result['compatibility'] != undefined && result['compatibility'] != ''" class="uk-label custom-label  label-compatibility" title="Compatibility">{{result.compatibility}}</span>
+
+        <!-- <div *ngIf="result.country != undefined && result.country != ''">Country: {{result.country}}</div> -->
+        <span *ngIf="result.country != undefined && result.country != ''" class="uk-label custom-label  label-country" title="Country"> {{result.country}}</span>
+        <div *ngIf="result['projects'] != undefined">
+            <span> Project: </span>
+            <span *ngFor="let project of result['projects'].slice(0,15) let i=index">
+                <!--a *ngIf="project.url != undefined" href="{{project.url}}"-->
+                    <a *ngIf="project.id" [queryParams]="{projectId: project.id}" routerLinkActive="router-link-active" routerLink="/search/project">
+                        {{project['funderShortname']?project['funderShortname']:project['funderName']}}
+                        | {{ project['acronym']?project['acronym']:(project['title'].length>25?project['title'].substring(0,25)+'...':project['title'])}} ({{project.code}})</a><span
+
+                        *ngIf="!project.id">{{project['funderShortname']?project['funderShortname']:project['funderName']}}<span
+                            *ngIf="project['acronym'] || project['title']"> | {{ project['acronym']?project['acronym']:(project['title'].length>25?project['title'].substring(0,25)+'...':project['title'])}}</span><span
+                            *ngIf="project.code">({{project.code}})</span></span><span
+
+                *ngIf="i < result['projects'].length-1">,</span>
+            </span>
+            <span *ngIf="result['projects'].length > 15">...</span>
+        </div>
+
+        <div *ngIf="result.description != undefined && result.description != ''">
+            <div class="text-justify descriptionText">
+                {{result.description}}
+            </div>
+        </div>
+
+        <mark *ngIf="result.embargoEndDate != undefined && result.embargoEndDate != ''">Embargo End Date: {{result.embargoEndDate}}</mark>
+
+
+        <!-- <div *ngIf="result['funders'] != undefined">
+          <span> Funder: </span>
+          <span *ngFor="let funder of result['funders'] let i=index">
+
+              <span *ngIf="funder.funderShortname">
+                {{funder.funderShortname}}</span><span
+
+                *ngIf="i < result['funders'].length-1">,</span>
+          </span>
+          <span *ngIf="result.startYear && result.endYear"> (start {{result.startYear}} - end {{result.endYear}})</span>
+        </div> -->
+        <div *ngIf="result.startYear && result.endYear"> Start year: {{result.startYear}} - End year: {{result.endYear}})</div>
+        <div *ngIf="showOrganizations && result['organizations'] != undefined && result['organizations'].length > 0">
+            <span> Organization: </span>
+            <span *ngFor="let organization of result['organizations'].slice(0,10) let i=index">
+                <!--a *ngIf="organization.url != undefined" href="{{organization.url}}"-->
+                <a *ngIf="organization.id" [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
+                        {{organization.name}}</a><span
+
+                    *ngIf="!organization.id">
+                        {{organization.name}}</span><span
+
+                    *ngIf="(i < result['organizations'].length-1) && (i < 9)">,</span>
+            </span>
+            <span *ngIf="result['organizations'].length > 10">...</span>
+        </div>
+
+        <div *ngIf="result['countries'] && result['countries'].length > 0">
+            Country: <span *ngFor="let country of  result['countries'].slice(0,10) let i = index">{{country}}{{(i < ( result['countries'].slice(0,10).length-1))?", ":""}}{{(i ==  result['countries'].slice(0,10).length-1 &&  result['countries'].length > 10)?"...":""}}</span>
+        </div>
+        <div *ngIf="result['websiteURL'] != undefined && result['websiteURL'] != ''">
+            <span>Website URL: </span>
+            <span>
+                <a href="{{result['websiteURL']}}" target="_blank" class="custom-external custom-icon">
+                    {{result['websiteURL']}}
+                </a>
+            </span>
+        </div>
+        <div *ngIf="result['OAIPMHURL'] != undefined && result['OAIPMHURL'] != ''">
+            <span>OAI-PMH URL: </span>
+            <span>
+                <a href="{{result['OAIPMHURL']}}" target="_blank" class="custom-external custom-icon">
+                    {{result['OAIPMHURL']}}
+                </a>
+            </span>
+        </div>
+
+        <div *ngIf="showSubjects && result['subjects'] && result['subjects'].length > 0">
+            Subject: <span *ngFor="let subject of  result['subjects'].slice(0,10) let i = index">{{subject}}{{(i < ( result['subjects'].slice(0,10).length-1))?", ":""}}{{(i ==  result['subjects'].slice(0,10).length-1 &&  result['subjects'].length > 10)?"...":""}}</span>
+        </div>
+
+
+    </li>
+</ul>
diff --git a/searchPages/searchUtils/searchResult.component.ts b/searchPages/searchUtils/searchResult.component.ts
new file mode 100644
index 00000000..d071ad5d
--- /dev/null
+++ b/searchPages/searchUtils/searchResult.component.ts
@@ -0,0 +1,53 @@
+import {Component, Input} from '@angular/core';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {RouterHelper} from '../../utils/routerHelper.class';
+
+@Component({
+    selector: 'search-result',
+    templateUrl:'searchResult.component.html'
+})
+
+export class SearchResultComponent {
+    @Input() results: SearchResult[];
+    @Input() status: number;
+    @Input() type: string;
+    @Input() showLoading: boolean = false;
+    @Input() showSubjects: boolean = false;
+    @Input() showOrganizations: boolean = true;
+    @Input() custom_class: string = "search-results";
+
+    public urlParam: string;
+    public linkToAdvancedSearchPage: string;
+    public errorCodes:ErrorCodes = new ErrorCodes();
+    public routerHelper:RouterHelper = new RouterHelper();
+    public errorMessage: string = "No results found";
+
+    constructor () {}
+
+    ngOnInit() {
+      if(this.type == "publication") {
+        this.linkToAdvancedSearchPage = OpenaireProperties.getLinkToAdvancedSearchPublications();
+        this.urlParam = "articleId";
+      } else if(this.type == "dataset") {
+        this.linkToAdvancedSearchPage = OpenaireProperties.getLinkToAdvancedSearchDatasets();
+        this.urlParam = "datasetId";
+      } else if(this.type == "software") {
+        this.linkToAdvancedSearchPage = OpenaireProperties.getLinkToAdvancedSearchSoftware();
+        this.urlParam = "softwareId";
+      } else if(this.type == "project") {
+        this.linkToAdvancedSearchPage = OpenaireProperties.getLinkToAdvancedSearchProjects();
+        this.urlParam = "projectId";
+      } else if(this.type == "organization") {
+        this.linkToAdvancedSearchPage = OpenaireProperties.getLinkToAdvancedSearchOrganizations();
+        this.urlParam = "organizationId";
+      } else if(this.type == "dataprovider") {
+        this.linkToAdvancedSearchPage = OpenaireProperties.getLinkToAdvancedSearchDataProviders();
+        this.urlParam = "datasourceId";
+      }
+    }
+
+    public  quote(params: string):string {
+      return '"'+params+'"';
+    }
+}
diff --git a/searchPages/searchUtils/searchResults.module.ts b/searchPages/searchUtils/searchResults.module.ts
new file mode 100644
index 00000000..0ca38971
--- /dev/null
+++ b/searchPages/searchUtils/searchResults.module.ts
@@ -0,0 +1,29 @@
+import { NgModule}              from '@angular/core';
+import { CommonModule }         from '@angular/common';
+import { FormsModule }          from '@angular/forms';
+import { RouterModule }         from '@angular/router';
+
+import {ErrorMessagesModule}    from '../../utils/errorMessages.module';
+
+import {SearchResult}           from '../../utils/entities/searchResult';
+import {SearchResultComponent}  from './searchResult.component';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    RouterModule, ErrorMessagesModule
+   ],
+  declarations: [
+    SearchResultComponent,
+
+],
+
+  providers:[
+  ],
+  exports: [
+
+      SearchResultComponent
+
+    ]
+})
+export class SearchResultsModule { }
diff --git a/searchPages/searchUtils/searchUtils.class.ts b/searchPages/searchUtils/searchUtils.class.ts
new file mode 100644
index 00000000..da9fb9cb
--- /dev/null
+++ b/searchPages/searchUtils/searchUtils.class.ts
@@ -0,0 +1,10 @@
+export class SearchUtilsClass{
+  page:number = 1;
+  size:number = 10;
+  status:number = 1;
+  keyword:string = "";
+  baseUrl:string = "";
+  totalResults = 0;
+  totalResultsNoFilters:number; // for organization landing - tab with projects
+
+}
diff --git a/searchPages/searchUtils/tabResult.component.html b/searchPages/searchUtils/tabResult.component.html
new file mode 100644
index 00000000..cf370265
--- /dev/null
+++ b/searchPages/searchUtils/tabResult.component.html
@@ -0,0 +1,122 @@
+<ul class="uk-list uk-list-divider  uk-margin">
+ <!--div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
+ <div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
+ <div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
+ <div *ngIf="status == errorCodes.LOADING && showLoading" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">Loading...</div-->
+
+   <li *ngFor="let result of results" class="uk-animation-fade">
+       <div class = "uk-h4 {{result.title.accessMode}} {{result.title.sc39}}" [title] = result.title.accessMode >
+           <!--a href="{{result['title'].url}}"-->
+           <!--a [queryParams]="{articleId: 'od_______908::3a5b2885656a91307156325644e73b92'}" routerLinkActive="router-link-active" routerLink="search/publication"-->
+
+           <a [queryParams]="routerHelper.createQueryParam(urlParam,result.id)" routerLinkActive="router-link-active" routerLink="/search/{{type}}">
+               <span *ngIf="result['title'].name != undefined && result['title'].name != ''"
+                   [innerHTML]="result['title'].name">
+               </span>
+               <!--p *ngIf="result['title'].name == undefined || result['title'].name == ''">
+                   {{result['title'].url}}
+               </p-->
+               <span *ngIf="result['title'].name == undefined || result['title'].name == ''">
+                   [no title available]
+               </span>
+           </a>
+       </div>
+
+       <div>
+           <span *ngIf="result['authors'] != undefined">
+               <span *ngFor="let author of result['authors'].slice(0,15)">
+                 <!--a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="'/search/advanced/'+type+'s'">
+                     {{author['name']}};
+                 </a-->
+                 {{author}};
+               </span>
+               <span *ngIf="result['authors'].length > 15">...</span>
+           </span>
+           <span *ngIf="result.year != undefined && result.year != ''">
+               ({{result.year}})
+           </span>
+       </div>
+
+       <div *ngIf="result.publisher != undefined && result.publisher != ''">Publisher: {{result.publisher}}</div>
+
+       <div *ngIf="result.country != undefined && result.country != ''">Country: {{result.country}}</div>
+
+       <div *ngIf="result['projects'] != undefined">
+           <span> Project: </span>
+           <span *ngFor="let project of result['projects'].slice(0,15) let i=index">
+               <!--a *ngIf="project.url != undefined" href="{{project.url}}"-->
+                   <a *ngIf="project.id" [queryParams]="{projectId: project.id}" routerLinkActive="router-link-active" routerLink="/search/project">
+                       {{project['funderShortname']?project['funderShortname']:project['funderName']}}
+                       | {{ project['acronym']?project['acronym']:project['title']}} ({{project.code}})</a><span
+
+                       *ngIf="!project.id">{{project['funderShortname']?project['funderShortname']:project['funderName']}}<span
+                           *ngIf="project['acronym'] || project['title']"> | {{ project['acronym']?project['acronym']:project['title']}}</span><span
+                           *ngIf="project.code">({{project.code}})</span></span><span
+
+               *ngIf="i < result['projects'].length-1">,</span>
+           </span>
+           <span *ngIf="result['projects'].length > 15">...</span>
+       </div>
+
+       <!--blockquote *ngIf="result.description != undefined && result.description != ''">
+           <div class="text-justify">
+               {{result.description}}
+           </div>
+       </blockquote-->
+
+       <mark *ngIf="result.embargoEndDate != undefined && result.embargoEndDate != ''">Embargo End Date: {{result.embargoEndDate}}</mark>
+
+
+       <div *ngIf="result['funders'] != undefined">
+         <!--span> Funders: </span-->
+         <span *ngFor="let funder of result['funders'] let i=index">
+
+             <span *ngIf="funder.funderShortname">
+               {{funder.funderShortname}}</span><span
+
+               *ngIf="i < result['funders'].length-1">,</span>
+         </span> <span *ngIf="result.startYear && result.endYear"> (start {{result.startYear}} - end {{result.endYear}})</span>
+       </div>
+
+       <div *ngIf="showOrganizations && result['organizations'] != undefined && result['organizations'].length > 0">
+           <span> Organization: </span>
+           <span *ngFor="let organization of result['organizations'].slice(0, 10) let i=index">
+               <!--a *ngIf="organization.url != undefined" href="{{organization.url}}"-->
+               <a *ngIf="organization.id" [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
+                       {{organization.name}}</a><span
+
+                   *ngIf="!organization.id">
+                       {{organization.name}}</span><span
+
+                   *ngIf="(i < result['organizations'].length-1) && (i < 9)">,</span>
+           </span>
+           <span *ngIf="result['organizations'].length > 10">...</span>
+       </div>
+
+       <div *ngIf="result['type'] != undefined && result['type'] != ''">Type: {{result['type']}}</div>
+       <div *ngIf="result['countries'] && result['countries'].length > 0">
+           Country: {{result.countries}}
+       </div>
+       <div *ngIf="result['websiteURL'] != undefined && result['websiteURL'] != ''">
+           <span>Website URL: </span>
+           <span>
+               <a href="{{result['websiteURL']}}" target="_blank" class="custom-external custom-icon">
+                   {{result['websiteURL']}}
+               </a>
+           </span>
+       </div>
+       <div *ngIf="result['OAIPMHURL'] != undefined && result['OAIPMHURL'] != ''">
+           <span>OAI-PMH URL: </span>
+           <span>
+               <a href="{{result['OAIPMHURL']}}" target="_blank" class="custom-external custom-icon">
+                   {{result['OAIPMHURL']}}
+               </a>
+           </span>
+       </div>
+
+       <div *ngIf="result['compatibility'] != undefined && result['compatibility'] != ''">
+           Compatibility: {{result.compatibility}}
+       </div>
+
+   </li>
+</ul>
diff --git a/searchPages/searchUtils/tabResult.component.ts b/searchPages/searchUtils/tabResult.component.ts
new file mode 100644
index 00000000..39576e56
--- /dev/null
+++ b/searchPages/searchUtils/tabResult.component.ts
@@ -0,0 +1,31 @@
+import {Component, Input} from '@angular/core';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {ErrorCodes} from '../../utils/properties/openaireProperties';
+import {RouterHelper} from '../../utils/routerHelper.class';
+
+@Component({
+    selector: 'tab-result',
+    templateUrl: 'tabResult.component.html'
+  })
+
+export class TabResultComponent {
+    @Input() results: SearchResult[];
+    @Input() status: number;
+    @Input() type: string;
+    @Input() urlParam: string;
+    @Input() showLoading: boolean = false;
+    @Input() showOrganizations: boolean = true;
+
+    public errorCodes:ErrorCodes = new ErrorCodes();
+    public routerHelper:RouterHelper = new RouterHelper();
+    public errorMessage: string = "No results found";
+    constructor () {
+
+    }
+
+    ngOnInit() {}
+
+        public  quote(params: string):string {
+            return '"'+params+'"';
+        }
+}
diff --git a/searchPages/searchUtils/tabResult.module.ts b/searchPages/searchUtils/tabResult.module.ts
new file mode 100644
index 00000000..589b5623
--- /dev/null
+++ b/searchPages/searchUtils/tabResult.module.ts
@@ -0,0 +1,23 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {TabResultComponent} from './tabResult.component';
+import {RouterModule} from '@angular/router';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    RouterModule
+   ],
+  declarations: [
+    TabResultComponent,
+  ],
+  providers:[
+  ],
+  exports: [
+      TabResultComponent
+    ]
+})
+export class TabResultModule { }
diff --git a/searchPages/simple/searchDataProviders.module.ts b/searchPages/simple/searchDataProviders.module.ts
new file mode 100644
index 00000000..27db9dde
--- /dev/null
+++ b/searchPages/simple/searchDataProviders.module.ts
@@ -0,0 +1,32 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchDataprovidersComponent} from './searchDataproviders.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {DataProvidersServiceModule} from '../../services/dataProvidersService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+//import {SearchFilterModalModule} from '../searchUtils/searchFilterModal.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+
+    DataProvidersServiceModule,
+     SearchFormModule, SearchResultsModule, SearchPageModule
+
+  ],
+  declarations: [
+    SearchDataprovidersComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    SearchDataprovidersComponent
+     ]
+})
+export class SearchDataProvidersModule { }
diff --git a/searchPages/simple/searchDataproviders.component.ts b/searchPages/simple/searchDataproviders.component.ts
new file mode 100644
index 00000000..23f5a838
--- /dev/null
+++ b/searchPages/simple/searchDataproviders.component.ts
@@ -0,0 +1,360 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-dataproviders',
+    template: `
+
+    <search-page pageTitle="Search Content Providers"
+                  formPlaceholderText = "Search for Content Providers"
+                 type="content providers" entityType="dataprovider" [(filters)] = "filters"
+                 [(results)] = "results"   [(searchUtils)] = "searchUtils" [baseUrl] = "baseUrl"
+				         (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="datasources" advancedSearchLink="/search/advanced/dataproviders"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults"
+                 searchFormClass="datasourcesSearchForm">
+    </search-page>
+
+    `
+})
+export class SearchDataprovidersComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public totalResults:number  = 0 ;
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public _location:Location;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.DATASOURCE_REFINE_FIELDS;
+  public fieldIdsMap= this.searchFields.DATASOURCE_FIELDS;
+  public CSV: any = {  "columnNames":  [ "Title", "Type", "Coutries", "Compatibility" ],
+                        "export":[]
+                     };
+  public CSVDownloaded = false;
+  public csvParams: string;
+
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.page =1;
+    this.baseUrl = OpenaireProperties.getLinkToSearchDataProviders();
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+     this.searchPage.fieldIdsMap = this.fieldIdsMap;
+     var firstLoad =true;
+
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      var refine = true;
+      if(this.searchUtils.page != ((params['page']=== undefined)?1:+params['page']) && this.filters && !firstLoad){
+        refine = false;
+
+      }
+      firstLoad = false;
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+
+      var queryParameters = this.searchPage.getQueryParametersFromUrl(params);
+      this._getResults(queryParameters, refine, this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+  public getNumForEntity(entity: string, id:string) {
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+      if(id != "" && entity != "") {
+
+          this._searchDataprovidersService.numOfEntityDataproviders(id, entity).subscribe(
+              data => {
+                  this.searchUtils.totalResults = data;
+
+                  //var errorCodes:ErrorCodes = new ErrorCodes();
+                  this.searchUtils.status = this.errorCodes.DONE;
+                  if(this.searchUtils.totalResults == 0 ){
+                    this.searchUtils.status = this.errorCodes.NONE;
+                  }
+              },
+              err => {
+                  console.log(err);
+                   //TODO check erros (service not available, bad request)
+                  // if( ){
+                  //   this.searchUtils.status = ErrorCodes.ERROR;
+                  // }
+                  //var errorCodes:ErrorCodes = new ErrorCodes();
+                  //this.searchUtils.status = errorCodes.ERROR;
+
+                  if(err.status == '404') {
+                    this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                  } else if(err.status == '500') {
+                    this.searchUtils.status = this.errorCodes.ERROR;
+                  } else {
+                    this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                  }
+              }
+          );
+      }
+  }
+
+  public getNumForSearch(keyword: string) {
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+      this._searchDataprovidersService.numOfDataproviders(keyword).subscribe(
+          data => {
+              this.searchUtils.totalResults = data;
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+
+public getResultsForDeposit(id:string, type:string, page: number,  size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    //this.status = errorCodes.LOADING;
+  if(id != "") {
+
+      this._searchDataprovidersService.searchDataprovidersForDeposit(id,type, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Dataproviders forDeposit: [id:"+id+", type:"+type+" ]  [total results:"+this.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+  public getResultsForEntity(entity:string, id:string, page: number, size: number){
+    var parameters = "";
+
+    if(entity == "organization") {
+      parameters = "organizations/"+id;
+    }
+
+    if(parameters != "") {
+
+        this._searchDataprovidersService.searchDataprovidersForEntity(parameters, page, size).subscribe(
+            data => {
+                this.searchUtils.totalResults = data[0];
+                console.info("search Dataproviders for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+                this.results = data[1];
+
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                this.searchUtils.status = this.errorCodes.DONE;
+                if(this.searchUtils.totalResults == 0 ){
+                  this.searchUtils.status = this.errorCodes.NONE;
+                }
+            },
+            err => {
+                console.log(err);
+                 //TODO check erros (service not available, bad request)
+                // if( ){
+                //   this.searchUtils.status = ErrorCodes.ERROR;
+                // }
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                //this.searchUtils.status = errorCodes.ERROR;
+                if(err.status == '404') {
+                  this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                } else if(err.status == '500') {
+                  this.searchUtils.status = this.errorCodes.ERROR;
+                } else {
+                  this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                }
+            }
+        );
+    }
+  }
+
+  public getResultsForDataproviders(id:string, page: number, size: number){
+
+    this._searchDataprovidersService.getDataProvidersforEntityRegistry(id, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Dataproviders for Entity Registry: [Id:"+id+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+        }
+    );
+  }
+
+  public getResults(keyword:string,refine:boolean, page: number, size: number){
+    var parameters = "";
+    if(keyword.length > 0){
+      parameters = "q="+ keyword;
+    }
+    this._getResults(parameters,refine,page,this.searchUtils.size);
+  }
+  private _getResults(parameters:string,refine:boolean, page: number, size: number){
+      this.csvParams = parameters;
+
+    // if(!refine && !this.searchPage){
+    //     this.searchPage = new SearchPageComponent(this._location);
+    // }
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+    this.subResults = this._searchDataprovidersService.searchDataproviders(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, this.searchPage.getFields()).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Content Providers: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+            if(refine){
+              this.filters = data[2];
+            }
+            this.searchPage.checkSelectedFilters(this.filters);
+            // this.filters = this.searchPage.checkSelectedFilters(data[2]);
+            this.searchPage.updateBaseUrlWithParameters(this.filters);
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit!!!
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+        }
+    );
+  }
+
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    var parameters = $event.value;
+    this._getResults(parameters, true, this.searchUtils.page, this.searchUtils.size);
+  }
+}
diff --git a/searchPages/simple/searchDatasets.component.ts b/searchPages/simple/searchDatasets.component.ts
new file mode 100644
index 00000000..4fc0c57a
--- /dev/null
+++ b/searchPages/simple/searchDatasets.component.ts
@@ -0,0 +1,275 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+
+import {SearchDatasetsService} from '../../services/searchDatasets.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+import {DOI} from '../../utils/string-utils.class';
+
+@Component({
+    selector: 'search-datasets',
+    template: `
+
+    <search-page pageTitle="Search Research Data"
+                  formPlaceholderText = "Search for Research Data"
+                 type="research data" entityType="dataset" [(filters)] = "filters"
+                 [(results)] = "results"   [(searchUtils)] = "searchUtils"
+                 [baseUrl] = "baseUrl" (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="datasets" advancedSearchLink="/search/advanced/datasets"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults"
+                 searchFormClass="datasetsSearchForm">
+    </search-page>
+    `
+})
+
+export class SearchDatasetsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters: Filter[] =[];
+  // public totalResults:number  = 0 ;
+  public baseUrl:string;
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  private sub: any;
+  private subResults: any;
+  private searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.RESULT_REFINE_FIELDS;
+  public fieldIdsMap=this.searchFields.RESULT_FIELDS;
+  private urlParams : Map<string, string>;
+  private _location:Location;
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+  constructor (private route: ActivatedRoute, private _searchDatasetsService: SearchDatasetsService ) {
+
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.page =1;
+    this.baseUrl = OpenaireProperties.getLinkToSearchDatasets();
+
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+     this.searchPage.fieldIdsMap = this.fieldIdsMap;
+     this.searchPage.type = "research data";
+     var firstLoad =true;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      var refine = true;
+      if(this.searchUtils.page != ((params['page']=== undefined)?1:+params['page']) && this.filters && !firstLoad){
+        refine = false;
+      }
+      firstLoad = false;
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+
+      var queryParameters = this.searchPage.getQueryParametersFromUrl(params);
+       this._getResults(queryParameters, refine, this.searchUtils.page, this.searchUtils.size);
+
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+
+public getResultsForEntity(entity:string, id:string, page: number, size: number){
+  var parameters = "";
+
+  if(entity == "project") {
+    parameters = "projects/"+id;
+  }
+
+  if(parameters != "") {
+
+      this._searchDatasetsService.searchDatasetsForEntity(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Research Data for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResultsForDataproviders(id:string, resultsFrom:string, page: number, size: number){
+  var parameters;
+  if(resultsFrom == "collectedFrom") {
+      parameters = "datasets?fq=collectedfromdatasourceid exact "+'"'+id+'"';
+  } else if(resultsFrom == "hostedBy") {
+      parameters = "datasets?fq=resulthostingdatasourceid exact "+'"'+id+'"';
+  }
+
+  if(parameters != "") {
+
+      this._searchDatasetsService.searchDatasetsForDataproviders(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Research Data for Dataproviders: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResults(keyword:string,refine:boolean, page: number, size: number){
+  var parameters = "";
+  if(keyword.length > 0){
+    var DOIs:string[] = DOI.getDOIsFromString(keyword);
+    var doisParams = "";
+    for(var i =0 ;i < DOIs.length; i++){
+      doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+    }
+    if(doisParams.length > 0){
+        parameters +=  "&"+doisParams;
+    }else{
+      parameters = "q=" + keyword;
+    }
+  }
+  this._getResults(parameters,refine,page,size);
+}
+private _getResults(parameters:string,refine:boolean, page: number, size: number){
+    this.csvParams = parameters;
+
+  // if(!refine && !this.searchPage){
+  //     this.searchPage = new SearchPageComponent(this._location);
+  // }
+  //var errorCodes:ErrorCodes = new ErrorCodes();
+  this.searchUtils.status = this.errorCodes.LOADING;
+  //this.searchPage.openLoading();
+  this.disableForms = true;
+  this.results = [];
+  this.searchUtils.totalResults = 0;
+
+  this.subResults = this._searchDatasetsService.searchDatasets(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, this.searchPage.getFields()).subscribe(
+      data => {
+          this.searchUtils.totalResults = data[0];
+          console.info("search Research Data: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+          this.results = data[1];
+          if(refine){
+            this.filters = data[2];
+          }
+          this.searchPage.checkSelectedFilters(this.filters);
+          this.searchPage.updateBaseUrlWithParameters(this.filters);
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          this.searchUtils.status = this.errorCodes.DONE;
+          if(this.searchUtils.totalResults == 0 ){
+            this.searchUtils.status = this.errorCodes.NONE;
+          }
+          //this.searchPage.closeLoading();
+          this.disableForms = false;
+
+          if(this.searchUtils.status == this.errorCodes.DONE) {
+            // Page out of limit!!!
+            let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+            if(!(Number.isInteger(totalPages))) {
+                totalPages = (parseInt(totalPages, 10) + 1);
+            }
+            if(totalPages < page) {
+              this.searchUtils.totalResults = 0;
+              this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+            }
+          }
+      },
+      err => {
+          console.log(err);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          //this.searchUtils.status = errorCodes.ERROR;
+          if(err.status == '404') {
+            this.searchUtils.status = this.errorCodes.NOT_FOUND;
+          } else if(err.status == '500') {
+            this.searchUtils.status = this.errorCodes.ERROR;
+          } else {
+            this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+          }
+
+          //this.searchPage.closeLoading();
+          this.disableForms = false;
+      }
+  );
+}
+
+
+
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    var parameters = $event.value;
+    //this.getResults(parameters, this.searchUtils.page, this.searchUtils.size, "searchPage");
+    this._getResults(parameters, true, this.searchUtils.page, this.searchUtils.size);
+  }
+}
diff --git a/searchPages/simple/searchDatasets.module.ts b/searchPages/simple/searchDatasets.module.ts
new file mode 100644
index 00000000..1a1aa1c1
--- /dev/null
+++ b/searchPages/simple/searchDatasets.module.ts
@@ -0,0 +1,32 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchDatasetsComponent} from './searchDatasets.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {DatasetsServiceModule} from '../../services/datasetsService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+//import {SearchFilterModalModule} from '../searchUtils/searchFilterModal.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+
+    DatasetsServiceModule,
+     SearchFormModule, SearchResultsModule,  SearchPageModule
+
+  ],
+  declarations: [
+    SearchDatasetsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    SearchDatasetsComponent
+     ]
+})
+export class SearchDatasetsModule { }
diff --git a/searchPages/simple/searchOrganizations.component.ts b/searchPages/simple/searchOrganizations.component.ts
new file mode 100644
index 00000000..2989d8e4
--- /dev/null
+++ b/searchPages/simple/searchOrganizations.component.ts
@@ -0,0 +1,175 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+import {SearchOrganizationsService} from '../../services/searchOrganizations.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-organizations',
+    template: `
+
+    <search-page pageTitle="Search Organizations"
+                  formPlaceholderText = "Search for Organizations"
+                 type="organizations" entityType="organization" [(filters)] = "filters"
+                 [(results)] = "results"  [(searchUtils)] = "searchUtils"
+                 [baseUrl] = "baseUrl" (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="organizations" advancedSearchLink="/search/advanced/organizations"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults"
+                 searchFormClass="organizationsSearchForm">
+    </search-page>
+
+    `
+
+})
+export class SearchOrganizationsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any;
+  public subResults: any;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.ORGANIZATION_REFINE_FIELDS;
+  public fieldIdsMap = this.searchFields.ORGANIZATION_FIELDS;
+  public urlParams : Map<string, string>;
+  public _location:Location;
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchOrganizationsService: SearchOrganizationsService ) {
+
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.page =1;
+    this.baseUrl = OpenaireProperties.getLinkToSearchOrganizations();
+
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.searchPage.fieldIdsMap = this.fieldIdsMap;
+    var firstLoad = true;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      var refine = true;
+      if(this.searchUtils.page != ((params['page']=== undefined)?1:+params['page']) && this.filters && !firstLoad){
+        refine = false;
+
+      }
+      firstLoad = false;
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+
+      var queryParameters = this.searchPage.getQueryParametersFromUrl(params);
+       this._getResults(queryParameters, refine, this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+
+    public getResults(keyword:string,refine:boolean, page: number, size: number){
+      var parameters = "";
+      if(keyword.length > 0){
+        parameters = "q=" + keyword;
+      }
+      this._getResults(parameters,refine,page,this.searchUtils.size);
+    }
+    private _getResults(parameters:string,refine:boolean, page: number, size: number){
+        this.csvParams = parameters;
+
+      // if(!refine && !this.searchPage){
+      //     this.searchPage = new SearchPageComponent(this._location);
+      // }
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+      //this.searchPage.openLoading();
+      this.disableForms = true;
+      this.results = [];
+      this.searchUtils.totalResults = 0;
+
+      this.subResults = this._searchOrganizationsService.searchOrganizations(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, this.searchPage.getFields()).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Organizations: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+              if(refine){
+                this.filters = data[2];
+              }
+              this.searchPage.checkSelectedFilters(this.filters);
+              this.searchPage.updateBaseUrlWithParameters(this.filters);
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+
+              if(this.searchUtils.status == this.errorCodes.DONE) {
+                // Page out of limit!!!
+                let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+                if(!(Number.isInteger(totalPages))) {
+                    totalPages = (parseInt(totalPages, 10) + 1);
+                }
+                if(totalPages < page) {
+                  this.searchUtils.totalResults = 0;
+                  this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+                }
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+
+              //this.searchPage.closeLoading();
+              this.disableForms = false;
+          }
+      );
+    }
+
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    var parameters = $event.value;
+    console.info("queryChanged: Execute search query "+parameters);
+    this._getResults(parameters, true, this.searchUtils.page, this.searchUtils.size);
+  }
+}
diff --git a/searchPages/simple/searchOrganizations.module.ts b/searchPages/simple/searchOrganizations.module.ts
new file mode 100644
index 00000000..cd5bf990
--- /dev/null
+++ b/searchPages/simple/searchOrganizations.module.ts
@@ -0,0 +1,31 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchOrganizationsComponent} from './searchOrganizations.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {OrganizationsServiceModule} from '../../services/organizationsService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+
+    OrganizationsServiceModule,
+     SearchFormModule, SearchResultsModule, SearchPageModule
+
+  ],
+  declarations: [
+    SearchOrganizationsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    SearchOrganizationsComponent
+     ]
+})
+export class SearchOrganizationsModule { }
diff --git a/searchPages/simple/searchProjects.component.ts b/searchPages/simple/searchProjects.component.ts
new file mode 100644
index 00000000..24659305
--- /dev/null
+++ b/searchPages/simple/searchProjects.component.ts
@@ -0,0 +1,213 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+import {SearchProjectsService} from '../../services/searchProjects.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+
+@Component({
+    selector: 'search-projects',
+    template: `
+
+    <search-page pageTitle="Search Projects"
+                formPlaceholderText = "Search for Projects"
+                 type="projects" entityType="project" [(filters)] = "filters"
+                 [(results)] = "results" [(searchUtils)] = "searchUtils"
+                 [baseUrl] = "baseUrl" (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="projects" advancedSearchLink="/search/advanced/projects"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults"
+                 searchFormClass="projectsSearchForm">
+    </search-page>
+     `
+
+})
+export class SearchProjectsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters: Filter[] =[];
+  public baseUrl:string;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any;
+  public subResults: any;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.PROJECT_REFINE_FIELDS;
+  public fieldIdsMap = this.searchFields.PROJECT_FIELDS;
+  public urlParams : Map<string, string>;
+  public _location:Location;
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+
+  constructor (private route: ActivatedRoute, private _searchProjectsService: SearchProjectsService) {
+    console.info(" constructor SearchProjectsComponent "+this.refineFields.length);
+
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.page =1;
+    this.baseUrl = OpenaireProperties.getLinkToSearchProjects();
+
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.searchPage.fieldIdsMap = this.fieldIdsMap;
+    console.info(" ngOnInit SearchProjectsComponent "+this.refineFields.length);
+    //get refine field filters  from url parameters
+    var firstLoad = true;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      //get keyword from url parameters
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      var refine = true;
+      if(this.searchUtils.page != ((params['page']=== undefined)?1:+params['page']) && this.filters && !firstLoad){
+        refine = false;
+
+      }
+      firstLoad = false;
+      //get page from url parameters
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+      var queryParameters = this.searchPage.getQueryParametersFromUrl(params);
+      this._getResults(queryParameters, refine, this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+  public getResults(keyword:string,refine:boolean, page: number, size: number){
+    var parameters = "";
+    if(keyword.length > 0){
+      parameters = "q="+keyword;
+    }
+    this._getResults(parameters,refine,page,this.searchUtils.size);
+  }
+  private _getResults(parameters:string,refine:boolean, page: number, size: number){
+      this.csvParams = parameters;
+
+    // if(!refine && !this.searchPage){
+    //     this.searchPage = new SearchPageComponent(this._location);
+    // }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    //this.searchPage.openLoading();
+    this.disableForms = true;
+    this.results = [];
+    this.searchUtils.totalResults = 0;
+
+  this.subResults = this._searchProjectsService.searchProjects(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, this.searchPage.getFields()).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Projects: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+            if(refine){
+              this.filters = data[2];
+            }
+            this.searchPage.checkSelectedFilters(this.filters);
+            // this.filters = this.searchPage.checkSelectedFilters(data[2]);
+            this.searchPage.updateBaseUrlWithParameters(this.filters);
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+
+            if(this.searchUtils.status == this.errorCodes.DONE) {
+              // Page out of limit!!!
+              let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+              if(!(Number.isInteger(totalPages))) {
+                  totalPages = (parseInt(totalPages, 10) + 1);
+              }
+              if(totalPages < page) {
+                this.searchUtils.totalResults = 0;
+                this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+              }
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+
+            //this.searchPage.closeLoading();
+            this.disableForms = false;
+        }
+    );
+  }
+
+  public getResultsForDataproviders(id:string, page: number, size: number){
+
+    this._searchProjectsService.getProjectsforDataProvider(id, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Projects for Dataproviders: [Id:"+id+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+        }
+    );
+  }
+
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+    
+    this.urlParams = undefined;
+    var parameters = $event.value;
+    this._getResults(parameters, true, this.searchUtils.page, this.searchUtils.size);
+  }
+
+}
diff --git a/searchPages/simple/searchProjects.module.ts b/searchPages/simple/searchProjects.module.ts
new file mode 100644
index 00000000..c8e1b094
--- /dev/null
+++ b/searchPages/simple/searchProjects.module.ts
@@ -0,0 +1,32 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchProjectsComponent} from './searchProjects.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {ProjectsServiceModule} from '../../services/projectsService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+//import {SearchFilterModalModule} from '../searchUtils/searchFilterModal.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+
+    ProjectsServiceModule,
+     SearchFormModule, SearchResultsModule,  SearchPageModule
+
+  ],
+  declarations: [
+    SearchProjectsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    SearchProjectsComponent
+     ]
+})
+export class SearchProjectsModule { }
diff --git a/searchPages/simple/searchPublications.component.ts b/searchPages/simple/searchPublications.component.ts
new file mode 100644
index 00000000..ff643a03
--- /dev/null
+++ b/searchPages/simple/searchPublications.component.ts
@@ -0,0 +1,308 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass} from '../searchUtils/searchUtils.class';
+import {DOI} from '../../utils/string-utils.class';
+
+@Component({
+    selector: 'search-publications',
+    template: `
+
+    <search-page pageTitle="Search Publications"
+                  formPlaceholderText = "Search for Publications"
+                 type="publications" entityType="publication"
+                 [(filters)] = "filters" [(results)] = "results"
+                 [(searchUtils)] = "searchUtils"   [(baseUrl)] = baseUrl
+                 (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="publications"
+                 advancedSearchLink="/search/advanced/publications"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults"
+                 searchFormClass="publicationsSearchForm">
+    </search-page>
+
+    `
+
+})
+export class SearchPublicationsComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters =[];
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public baseUrl:string = "";
+  public sub: any;
+  public subResults: any;
+  public searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.RESULT_REFINE_FIELDS;
+  public fieldIdsMap=this.searchFields.RESULT_FIELDS;
+    //:  { [key:string] :{ name:string, operator:string, type:string, indexField:string, equalityOperator:string  }} = this.searchFields.PUBLICATION_FIELDS_MAP;
+  public urlParams : Map<string, string>;
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+  public _location:Location;
+
+  public CSV: any = {  "columnNames":  ["Title", "Authors", "Publication Year", "DOI",
+                                       /*"Download From", "Publication type", "Journal",*/
+                                       "Funder", "Project Name (GA Number)", "Access"],
+                      "export":[]
+                  };
+  public CSVDownloaded = false;
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  constructor (private route: ActivatedRoute, private _searchPublicationsService: SearchPublicationsService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.page =1;
+    this.baseUrl = OpenaireProperties.getLinkToSearchPublications();
+
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+    this.searchPage.fieldIdsMap = this.fieldIdsMap;
+    this.searchPage.type = "publications";
+    var firstLoad =true;
+    this.sub =  this.route.queryParams.subscribe(params => {
+        if(params['page'] && this.searchUtils.page != params['page']) {
+          this.loadPaging = false;
+          this.oldTotalResults = this.searchUtils.totalResults;
+        }
+
+        this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+        var refine = true;
+        if(this.searchUtils.page != ((params['page']=== undefined)?1:+params['page']) && this.filters && !firstLoad){
+          refine = false;
+
+        }
+        firstLoad = false;
+        this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+        var queryParameters = this.searchPage.getQueryParametersFromUrl(params);
+        this._getResults(queryParameters, refine, this.searchUtils.page, this.searchUtils.size);
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+public getResultsForEntity(entity:string, id:string, page: number, size: number){
+  var parameters = "";
+
+  if(entity == "project") {
+    parameters = "projects/"+id;
+  }
+
+  if(parameters != "") {
+
+      this._searchPublicationsService.searchPublicationsForEntity(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Publications for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResultsForDataproviders(id:string, resultsFrom:string, page: number, size: number){
+  var parameters;
+  if(resultsFrom == "collectedFrom") {
+      parameters = "publications?fq=collectedfromdatasourceid exact "+'"'+id+'"';
+  } else if(resultsFrom == "hostedBy") {
+      parameters = "publications?fq=resulthostingdatasourceid exact "+'"'+id+'"';
+  }
+
+  if(parameters != "") {
+
+      this._searchPublicationsService.searchPublicationsForDataproviders(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Publications for Dataproviders: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResults(keyword:string,refine:boolean, page: number, size: number){
+  var parameters = "";
+  if(keyword.length > 0){
+    var DOIs:string[] = DOI.getDOIsFromString(keyword);
+    var doisParams = "";
+
+    for(var i =0 ;i < DOIs.length; i++){
+      doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+    }
+    if(doisParams.length > 0){
+        parameters +=  "&"+doisParams;
+    }else{
+      parameters = "q=" +  keyword;
+    }
+  }
+  this._getResults(parameters,refine,page,size);
+}
+
+private _getResults(parameters:string,refine:boolean, page: number, size: number){
+    this.csvParams = parameters;
+
+  // if(!refine && !this.searchPage){
+  //     this.searchPage = new SearchPageComponent(this._location);
+  // }
+
+  //var errorCodes:ErrorCodes = new ErrorCodes();
+  this.searchUtils.status = this.errorCodes.LOADING;
+  //this.searchPage.openLoading();
+  this.disableForms = true;
+  this.results = [];
+  this.searchUtils.totalResults = 0;
+
+  this.subResults = this._searchPublicationsService.searchPublications(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, this.searchPage.getFields()).subscribe(
+      data => {
+          this.searchUtils.totalResults = data[0];
+          console.info("search Publications: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+          this.results = data[1];
+          if(refine){
+            this.filters = data[2];
+          }
+          this.searchPage.checkSelectedFilters(this.filters);
+          this.searchPage.updateBaseUrlWithParameters(this.filters);
+
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+
+          this.searchUtils.status = this.errorCodes.DONE;
+          if(this.searchUtils.totalResults == 0 ){
+            this.searchUtils.status = this.errorCodes.NONE;
+          }
+          //this.searchPage.closeLoading();
+          this.disableForms = false;
+
+          if(this.searchUtils.status == this.errorCodes.DONE) {
+            // Page out of limit!!!
+            let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+            if(!(Number.isInteger(totalPages))) {
+                totalPages = (parseInt(totalPages, 10) + 1);
+            }
+            if(totalPages < page) {
+              this.searchUtils.totalResults = 0;
+              this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+            }
+          }
+      },
+      err => {
+          console.log(err);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          //this.searchUtils.status = errorCodes.ERROR;
+          if(err.status == '404') {
+            this.searchUtils.status = this.errorCodes.NOT_FOUND;
+          } else if(err.status == '500') {
+            this.searchUtils.status = this.errorCodes.ERROR;
+          } else {
+            this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+          }
+
+          //this.searchPage.closeLoading();
+          this.disableForms = false;
+
+      }
+  );
+}
+/*
+public getAggregatorResults(id:string, page: number, size: number){
+  this.subResults = this._searchPublicationsService.searchAggregators('&fq=collectedfromdatasourceid exact "'+id+'"',"&refine=true&fields=resulthostingdatasource" , page, size).subscribe(
+      data => {
+          this.results = data;
+
+          var errorCodes:ErrorCodes = new ErrorCodes();
+          this.searchUtils.status = errorCodes.DONE;
+          if(this.searchUtils.totalResults == 0 ){
+            this.searchUtils.status = errorCodes.NONE;
+          }
+      },
+      err => {
+          console.log(err);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          var errorCodes:ErrorCodes = new ErrorCodes();
+          this.searchUtils.status = errorCodes.ERROR;
+      }
+  );
+}*/
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+
+    var parameters = $event.value;
+    console.info("queryChanged: Execute search query "+parameters);
+    console.info("Search Pubs::page "+this.searchUtils.page);
+    this._getResults(parameters, true, this.searchUtils.page, this.searchUtils.size);
+  }
+
+
+}
diff --git a/searchPages/simple/searchPublications.module.ts b/searchPages/simple/searchPublications.module.ts
new file mode 100644
index 00000000..b76d203c
--- /dev/null
+++ b/searchPages/simple/searchPublications.module.ts
@@ -0,0 +1,32 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchPublicationsComponent} from './searchPublications.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {PublicationsServiceModule} from '../../services/publicationsService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+//import {SearchFilterModalModule} from '../searchUtils/searchFilterModal.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+import {IsRouteEnabled} from '../../error/isRouteEnabled.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+
+    PublicationsServiceModule,
+     SearchFormModule, SearchResultsModule, SearchPageModule
+
+  ],
+  declarations: [
+    SearchPublicationsComponent
+   ],
+  providers:[FreeGuard, IsRouteEnabled],
+  exports: [
+    SearchPublicationsComponent
+     ]
+})
+export class SearchPublicationsModule { }
diff --git a/searchPages/simple/searchSoftware.component.ts b/searchPages/simple/searchSoftware.component.ts
new file mode 100644
index 00000000..5105cb93
--- /dev/null
+++ b/searchPages/simple/searchSoftware.component.ts
@@ -0,0 +1,275 @@
+import {Component, Input, ViewChild} from '@angular/core';
+import { ActivatedRoute} from '@angular/router';
+import {Location} from '@angular/common';
+import { Filter, Value} from '../searchUtils/searchHelperClasses.class';
+
+import {SearchSoftwareService} from '../../services/searchSoftware.service';
+import {SearchResult}     from '../../utils/entities/searchResult';
+import {OpenaireProperties, ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+import {SearchPageComponent } from '../searchUtils/searchPage.component';
+import {SearchUtilsClass } from '../searchUtils/searchUtils.class';
+import {DOI} from '../../utils/string-utils.class';
+
+@Component({
+    selector: 'search-software',
+    template: `
+
+    <search-page pageTitle="Search Software"
+                  formPlaceholderText = "Search for Software"
+                 type="software" entityType="software" [(filters)] = "filters"
+                 [(results)] = "results"   [(searchUtils)] = "searchUtils"
+                 [baseUrl] = "baseUrl" (queryChange)="queryChanged($event)"
+                 [csvParams]="csvParams" csvPath="software" advancedSearchLink="/search/advanced/software"
+                 [disableForms]="disableForms"
+                 [loadPaging]="loadPaging"
+                 [oldTotalResults]="oldTotalResults"
+                 searchFormClass="softwareSearchForm">
+    </search-page>
+    `
+})
+
+export class SearchSoftwareComponent {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public filters: Filter[] =[];
+  // public totalResults:number  = 0 ;
+  public baseUrl:string;
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  private sub: any;
+  private subResults: any;
+  private searchFields:SearchFields = new SearchFields();
+  public refineFields: string[] =  this.searchFields.RESULT_REFINE_FIELDS;
+  public fieldIdsMap=this.searchFields.RESULT_FIELDS;
+  private urlParams : Map<string, string>;
+  private _location:Location;
+  public csvParams: string;
+  public disableForms: boolean = false;
+  public loadPaging: boolean = true;
+  public oldTotalResults: number = 0;
+
+  @ViewChild (SearchPageComponent) searchPage : SearchPageComponent ;
+  constructor (private route: ActivatedRoute, private _searchSoftwareService: SearchSoftwareService ) {
+
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    this.searchUtils.page =1;
+    this.baseUrl = OpenaireProperties.getLinkToSearchSoftware();
+
+  }
+
+  public ngOnInit() {
+    this.searchPage.refineFields = this.refineFields;
+     this.searchPage.fieldIdsMap = this.fieldIdsMap;
+     this.searchPage.type = "software";
+     var firstLoad =true;
+    this.sub =  this.route.queryParams.subscribe(params => {
+      if(params['page'] && this.searchUtils.page != params['page']) {
+        this.loadPaging = false;
+        this.oldTotalResults = this.searchUtils.totalResults;
+      }
+
+      this.searchUtils.keyword = (params['keyword']?params['keyword']:'');
+      var refine = true;
+      if(this.searchUtils.page != ((params['page']=== undefined)?1:+params['page']) && this.filters && !firstLoad){
+        refine = false;
+      }
+      firstLoad = false;
+      this.searchUtils.page = (params['page']=== undefined)?1:+params['page'];
+
+      var queryParameters = this.searchPage.getQueryParametersFromUrl(params);
+       this._getResults(queryParameters, refine, this.searchUtils.page, this.searchUtils.size);
+
+    });
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+
+public getResultsForEntity(entity:string, id:string, page: number, size: number){
+  var parameters = "";
+
+  if(entity == "project") {
+    parameters = "projects/"+id;
+  }
+
+  if(parameters != "") {
+
+      this._searchSoftwareService.searchSoftwareForEntity(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Software for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResultsForDataproviders(id:string, resultsFrom:string, page: number, size: number){
+  var parameters;
+  if(resultsFrom == "collectedFrom") {
+      parameters = "software?fq=collectedfromdatasourceid exact "+'"'+id+'"';
+  } else if(resultsFrom == "hostedBy") {
+      parameters = "software?fq=resulthostingdatasourceid exact "+'"'+id+'"';
+  }
+
+  if(parameters != "") {
+
+      this._searchSoftwareService.searchSoftwareForDataproviders(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Software for Dataproviders: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResults(keyword:string,refine:boolean, page: number, size: number){
+  var parameters = "";
+  if(keyword.length > 0){
+    var DOIs:string[] = DOI.getDOIsFromString(keyword);
+    var doisParams = "";
+    for(var i =0 ;i < DOIs.length; i++){
+      doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+    }
+    if(doisParams.length > 0){
+        parameters +=  "&"+doisParams;
+    }else{
+      parameters = "q=" + keyword;
+    }
+  }
+  this._getResults(parameters,refine,page,size);
+}
+private _getResults(parameters:string,refine:boolean, page: number, size: number){
+    this.csvParams = parameters;
+
+  // if(!refine && !this.searchPage){
+  //     this.searchPage = new SearchPageComponent(this._location);
+  // }
+  //var errorCodes:ErrorCodes = new ErrorCodes();
+  this.searchUtils.status = this.errorCodes.LOADING;
+  //this.searchPage.openLoading();
+  this.disableForms = true;
+  this.results = [];
+  this.searchUtils.totalResults = 0;
+
+  this.subResults = this._searchSoftwareService.searchSoftware(parameters,(refine)?this.searchPage.getRefineFieldsQuery():null, page, size, this.searchPage.getFields()).subscribe(
+      data => {
+          this.searchUtils.totalResults = data[0];
+          console.info("search Software: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+          this.results = data[1];
+          if(refine){
+            this.filters = data[2];
+          }
+          this.searchPage.checkSelectedFilters(this.filters);
+          this.searchPage.updateBaseUrlWithParameters(this.filters);
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          this.searchUtils.status = this.errorCodes.DONE;
+          if(this.searchUtils.totalResults == 0 ){
+            this.searchUtils.status = this.errorCodes.NONE;
+          }
+          //this.searchPage.closeLoading();
+          this.disableForms = false;
+
+          if(this.searchUtils.status == this.errorCodes.DONE) {
+            // Page out of limit!!!
+            let totalPages:any = this.searchUtils.totalResults/(this.searchUtils.size);
+            if(!(Number.isInteger(totalPages))) {
+                totalPages = (parseInt(totalPages, 10) + 1);
+            }
+            if(totalPages < page) {
+              this.searchUtils.totalResults = 0;
+              this.searchUtils.status = this.errorCodes.OUT_OF_BOUND;
+            }
+          }
+      },
+      err => {
+          console.log(err);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          //this.searchUtils.status = errorCodes.ERROR;
+          if(err.status == '404') {
+            this.searchUtils.status = this.errorCodes.NOT_FOUND;
+          } else if(err.status == '500') {
+            this.searchUtils.status = this.errorCodes.ERROR;
+          } else {
+            this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+          }
+
+          //this.searchPage.closeLoading();
+          this.disableForms = false;
+      }
+  );
+}
+
+
+
+  private setFilters(){
+    //TODO set filters from
+  }
+
+  public queryChanged($event) {
+    this.loadPaging = true;
+
+    var parameters = $event.value;
+    //this.getResults(parameters, this.searchUtils.page, this.searchUtils.size, "searchPage");
+    this._getResults(parameters, true, this.searchUtils.page, this.searchUtils.size);
+  }
+}
diff --git a/searchPages/simple/searchSoftware.module.ts b/searchPages/simple/searchSoftware.module.ts
new file mode 100644
index 00000000..58d498e6
--- /dev/null
+++ b/searchPages/simple/searchSoftware.module.ts
@@ -0,0 +1,31 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import{SearchSoftwareComponent} from './searchSoftware.component';
+
+import {SearchResultsModule } from '../searchUtils/searchResults.module';
+
+import {SoftwareServiceModule} from '../../services/softwareService.module';
+import {SearchFormModule} from  '../searchUtils/searchForm.module';
+import {SearchPageModule} from '../searchUtils/searchPage.module';
+import {FreeGuard} from'../../login/freeGuard.guard';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+
+    SoftwareServiceModule,
+     SearchFormModule, SearchResultsModule, SearchPageModule
+
+  ],
+  declarations: [
+    SearchSoftwareComponent
+   ],
+  providers:[FreeGuard
+    ],
+  exports: [
+    SearchSoftwareComponent
+     ]
+})
+export class SearchSoftwareModule { }
diff --git a/services/dataProvidersService.module.ts b/services/dataProvidersService.module.ts
new file mode 100644
index 00000000..88e7b6df
--- /dev/null
+++ b/services/dataProvidersService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchDataprovidersService} from './searchDataproviders.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchDataprovidersService
+],
+  exports: [
+    ]
+})
+export class DataProvidersServiceModule { }
diff --git a/services/datasetsService.module.ts b/services/datasetsService.module.ts
new file mode 100644
index 00000000..e5298338
--- /dev/null
+++ b/services/datasetsService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchDatasetsService} from './searchDatasets.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchDatasetsService
+],
+  exports: [
+    ]
+})
+export class DatasetsServiceModule { }
diff --git a/services/metrics.service.ts b/services/metrics.service.ts
new file mode 100644
index 00000000..2408b026
--- /dev/null
+++ b/services/metrics.service.ts
@@ -0,0 +1,82 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {Metrics} from '../utils/entities/metrics';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import 'rxjs/add/operator/do';
+
+@Injectable()
+export class MetricsService {
+    metrics: Metrics;
+
+    constructor(private http: Http ) {}
+
+    getMetrics (id: string, entityType: string):any {
+        console.info("getMetrics in service");
+        //let url = OpenaireProperties. getSearchAPIURLLast() + 'publications/' +id+"?format=json";
+        let url = OpenaireProperties.getMetricsAPIURL()+entityType+"/"+id+"/clicks";
+        let key = url;
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => this.parseMetrics(res["downloads"], res["views"], res["total_downloads"], res["total_views"],
+                                                  res["total_openaire_views"], res["total_openaire_downloads"], res["pageviews"]));
+    }
+
+
+    parseMetrics(downloads: any, views: any, totalDownloads: string, totalViews: string,
+                totalOpenaireViews: string, totalOpenaireDownloads: string, pageViews: string): any {
+        this.metrics = new Metrics();
+
+        this.metrics.totalDownloads = totalDownloads;
+        this.metrics.totalViews = totalViews;
+        this.metrics.totalOpenaireViews = totalOpenaireViews;
+        this.metrics.totalOpenaireDownloads = totalOpenaireDownloads;
+        this.metrics.pageViews = pageViews;
+
+        this.metrics.infos = new Map<string, {"name": string, "url": string, "numOfDownloads": string, "numOfViews": string, "openaireDownloads": string, "openaireViews": string}>();
+
+        for(let i=0; i<downloads.length; i++) {
+            let id: string = downloads[i]['datasource_id'];
+            if(this.metrics.infos.has(id)) {
+                this.metrics.infos.get(id).numOfDownloads = downloads[i]['value'];
+                this.metrics.infos.get(id).openaireDownloads = downloads[i]['openaire'];
+            } else {
+                let info;//: {"url": string, "numOfDownloads": string, "numOfViews": string};
+                info = {};
+
+                info.name = downloads[i]['datasource_name'];
+                info.url = OpenaireProperties.getsearchLinkToDataProvider()+id;
+                info.numOfDownloads = downloads[i]['value'];
+                info.openaireDownloads = downloads[i]['openaire'];
+                info.numOfViews = "0";
+                info.openaireViews = "0";
+
+                this.metrics.infos.set(id, info);
+            }
+        }
+
+        for(let i=0; i<views.length; i++) {
+            let id: string = views[i]['datasource_id'];
+            if(this.metrics.infos.has(id)) {
+                this.metrics.infos.get(id).numOfViews = views[i]['value'];
+                this.metrics.infos.get(id).openaireViews = views[i]['openaire'];
+            } else {
+                let info;//: {"url": string, "numOfDownloads": string, "numOfViews": string};
+                info = {};
+
+                info.name = views[i]['datasource_name'];
+                info.url = OpenaireProperties.getsearchLinkToDataProvider()+id;
+                info.numOfDownloads = "0";
+                info.openaireDownloads = "0";
+                info.numOfViews = views[i]['value'];
+                info.openaireViews = views[i]['openaire'];
+
+                this.metrics.infos.set(id, info);
+            }
+        }
+        console.info("Metrics : "+this.metrics.infos.size);
+
+        return this.metrics;
+    }
+}
diff --git a/services/organization.service.ts b/services/organization.service.ts
new file mode 100644
index 00000000..03b1aed3
--- /dev/null
+++ b/services/organization.service.ts
@@ -0,0 +1,180 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OrganizationInfo} from '../utils/entities/organizationInfo';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../shared/cache.service';
+
+@Injectable()
+export class OrganizationService {
+
+    constructor(private http: Http ) {}
+
+    organizationInfo: OrganizationInfo;
+
+    getOrganizationInfo (id: string):any {
+        console.info("getOrganizationInfo in service");
+        //let url = OpenaireProperties. getSearchAPIURLLast()+'organizations/'+id+"?format=json";
+        let url = /*OpenaireProperties.getSearchAPIURLLast()+*/'https://beta.services.openaire.eu/search/v2/api/'+'resources?format=json&query=( (oaftype exact organization) and (reldatasourcecompatibilityid=driver or reldatasourcecompatibilityid=driver-openaire2.0 or reldatasourcecompatibilityid=openaire2.0 or reldatasourcecompatibilityid=openaire3.0 or reldatasourcecompatibilityid=openaire2.0_data or reldatasourcecompatibilityid=hostedBy or relprojectid=*)) and ( objIdentifier ='+id+')';
+        //let url = "http://beta.services.openaire.eu:8480/search/rest/v2/api/resources?format=json&query=(%20(oaftype%20exact%20organization)%20and%20(reldatasourcecompatibilityid=driver%20or%20reldatasourcecompatibilityid=driver-openaire2.0%20or%20reldatasourcecompatibilityid=openaire2.0%20or%20reldatasourcecompatibilityid=openaire3.0%20or%20reldatasourcecompatibilityid=openaire2.0_data%20or%20reldatasourcecompatibilityid=hostedBy%20or%20relprojectid=*))%20and%20(%20objIdentifier%20=dedup_wf_001%3A%3Af1e63493def7cedfa5b497cdbea26faa)";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => res['results'][0])
+                    //.map(res => res[0]['result']['metadata']['oaf:entity']['oaf:organization'])
+                    //.map(res => [res, res['rels']['rel']])
+                    .map(res => this.parseOrganizationInfo(res));
+
+
+    }
+/*
+    getMetrics (id: string):any {
+        console.info("getOrganizationMetrics in service");
+        //let url = OpenaireProperties. getSearchAPIURLLast() + 'publications/' +id+"?format=json";
+        let url = OpenaireProperties.getMetricsAPIURL()+"organizations/"+id+"/clicks";
+ 
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => res['views']);
+    }
+*/
+    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.log(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+    parseOrganizationInfo (data: any):any {
+        console.info("parseOrganizationInfo");
+        this.organizationInfo = new OrganizationInfo();
+
+        let organization;
+        let relations;
+
+        if(data != null) {
+            organization = data['result']['metadata']['oaf:entity']['oaf:organization'];
+            relations = data['result']['metadata']['oaf:entity']['oaf:organization']['rels']['rel'];
+        } else {
+            return null;
+        }
+
+        if(organization != null) {
+
+            if(organization.hasOwnProperty("websiteurl")) {
+                this.organizationInfo.title = {"name": organization.legalshortname, "url": organization.websiteurl};
+            } else {
+                this.organizationInfo.title = {"name": organization.legalshortname, "url": ''};
+            }
+
+            this.organizationInfo.name = organization.legalname;
+
+            if(this.organizationInfo.title.name == '') {
+                this.organizationInfo.title.name = this.organizationInfo.name;
+            }
+
+            if(organization.hasOwnProperty("country")) {
+                this.organizationInfo.country = organization['country'].classname;
+            }
+        }
+
+//Comment Parsing Projects info
+/*
+        if(data[1] != null) {
+
+            let counter;
+            let length = relations.length!=undefined ? relations.length : 1;
+
+            for(let i=0; i<length; i++) {
+                let relation = relations.length!=undefined ? relations[i] : relations;
+                if(relation.hasOwnProperty("to")) {
+                    if(relation['to'].class == "isParticipant") {
+                        if(relation.hasOwnProperty("funding")) {
+                            if(relation['funding'].hasOwnProperty("funder")) {
+                                if(this.organizationInfo.projects == undefined) {
+                                    this.organizationInfo.projects = new Map<string,
+                                        { "name": string, "id": string, "code": string,
+                                          "acronym": string, "funder": string, "funderId": string,
+                                          "fundingStream": string, "fundingLevel1": string, "fundingLevel2": string,
+                                          "sc39": string, "startDate": string, "endDate": string }[]>();
+                                }
+
+                                if(!this.organizationInfo.projects.has(relation['funding']['funder'].name)) {
+                                    this.organizationInfo.projects.set(relation['funding']['funder'].name,
+                                        new Array<{ "name": string, "id": string, "code": string,
+                                                    "acronym": string, "funder": string, "funderId": string,
+                                                    "fundingStream": string, "fundingLevel1": string, "fundingLevel2": string,
+                                                    "sc39": string, "startDate": string, "endDate": string }>());
+                                }
+
+                                counter = this.organizationInfo.projects.get(relation['funding']['funder'].name).length;
+                                this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter] =
+                                    { "name": "", "id": "", "code": "",
+                                      "acronym": "", "funder": "", "funderId": "",
+                                      "fundingStream": "", "fundingLevel1": "", "fundingLevel2": "",
+                                      "sc39": "", "startDate": "", "endDate": "" };
+
+                                //let url = "";
+                                if(relation['to'].content != null && relation['to'].content != "") {
+                                    this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['id'] = relation['to'].content;
+                                    //url = OpenaireProperties.getsearchLinkToProject()+relation['to'].content;
+                                }
+                                this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['name'] = relation.title;
+                                //this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['url'] = url;
+                                this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['code'] = relation.code;
+                                this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['acronym'] = relation.acronym;
+
+                                this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['funder'] = relation['funding']['funder'].shortname;
+                                this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['funderId'] = relation['funding']['funder'].id;
+                                if(relation['funding'].hasOwnProperty("funding_level_0")) {
+                                    this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['fundingStream'] = relation['funding']['funding_level_0'].name;
+                                }
+                                if(relation['funding'].hasOwnProperty("funding_level_1")) {
+                                    this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['fundingLevel1'] = relation['funding']['funding_level_1'].name;
+                                }
+                                if(relation['funding'].hasOwnProperty("funding_level_2")) {
+                                    this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['fundingLevel2'] = relation['funding']['funding_level_2'].name;
+                                }
+                                //this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['sc39'] =
+                                //this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['startDate'] =
+                                //this.organizationInfo.projects.get(relation['funding']['funder'].name)[counter]['endDate'] =
+                            }
+                        }
+
+                    }
+
+
+                    } /*else if(relation['to'].class == "isProvidedBy") {
+
+                        if(this.organizationInfo.dataProviders == undefined) {
+                            this.organizationInfo.dataProviders = new Array<{ "name": string, "url": string, "type": string, "websiteUrl": string , "organizations": {"name": string, "url": string}[]}>();
+                        }
+
+                        counter = this.organizationInfo.dataProviders.length;
+                        this.organizationInfo.dataProviders[counter] = { "name": "", "url": "", "type": "", "websiteUrl": "", "organizations": [] }
+
+                        let url="";
+                        if(relation['to'].content != null && relation['to'].content != "") {
+                            url = OpenaireProperties.getsearchLinkToDataProvider()+relation['to'].content;
+                        }
+                        this.organizationInfo.dataProviders[counter]['name'] = relation.officialname;
+                        this.organizationInfo.dataProviders[counter]['url'] = url;
+                        if(relation.hasOwnProperty("datasourcetype")) {
+                            this.organizationInfo.dataProviders[counter]['type'] = relation['datasourcetype'].classname;
+                        }
+                        this.organizationInfo.dataProviders[counter]['websiteUrl'] = relation.websiteurl;
+                    }*/
+/* ----->
+                }
+            }
+        }
+*/
+        return this.organizationInfo;
+
+    }
+
+}
diff --git a/services/organizationService.module.ts b/services/organizationService.module.ts
new file mode 100644
index 00000000..ee150c3e
--- /dev/null
+++ b/services/organizationService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {OrganizationService} from './organization.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  OrganizationService
+],
+  exports: [
+    ]
+})
+export class OrganizationServiceModule { }
diff --git a/services/organizationsService.module.ts b/services/organizationsService.module.ts
new file mode 100644
index 00000000..0810f680
--- /dev/null
+++ b/services/organizationsService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchOrganizationsService} from './searchOrganizations.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchOrganizationsService
+],
+  exports: [
+    ]
+})
+export class OrganizationsServiceModule { }
diff --git a/services/projectsService.module.ts b/services/projectsService.module.ts
new file mode 100644
index 00000000..117f5ca7
--- /dev/null
+++ b/services/projectsService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchProjectsService} from './searchProjects.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchProjectsService
+],
+  exports: [
+    ]
+})
+export class ProjectsServiceModule { }
diff --git a/services/publicationsService.module.ts b/services/publicationsService.module.ts
new file mode 100644
index 00000000..ab371386
--- /dev/null
+++ b/services/publicationsService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchPublicationsService} from './searchPublications.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchPublicationsService
+],
+  exports: [
+    ]
+})
+export class PublicationsServiceModule { }
diff --git a/services/refineFieldResults.service.ts b/services/refineFieldResults.service.ts
new file mode 100644
index 00000000..71d3fe50
--- /dev/null
+++ b/services/refineFieldResults.service.ts
@@ -0,0 +1,66 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {AutoCompleteValue} from '../searchPages/searchUtils/searchHelperClasses.class';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../shared/cache.service';
+import {RefineResultsUtils} from './servicesUtils/refineResults.class';
+
+@Injectable()
+export class RefineFieldResultsService {
+  // scoobydoo.di.uoa.gr:8181/dnet-functionality-services-2.0.0-SNAPSHOT/rest/v2/api/projects?refine=true&fields=funderid&page=1&size=0
+     constructor(private http: Http ) {}
+     getRefineFieldsResultsByEntityName(fields:string[], entityName:string):any{
+        let url = OpenaireProperties.getSearchAPIURLForEntity(entityName)+"?format=json&refine=true&page=1&size=0";
+        for(var i=0; i < fields.length; i++){
+            url += "&fields="+fields[i];
+        }
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+
+                    .map(res =>   [res['meta'].total, RefineResultsUtils.parse(res['refineResults'],fields, entityName)]);
+
+     }
+    getRefineFieldResultsByFieldName(fieldName:string, entityName:string):any{
+       let link = OpenaireProperties.getSearchAPIURLForEntity(entityName)+"?fields="+fieldName + "&format=json";
+        return  this.getField(link,fieldName)
+
+    }
+
+    getField (link:string,fieldName:string):any{
+      let url = link+"&refine=true&page=1&size=0";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  .map(res => res['refineResults'])                   
+                  .map(res =>  this.parse(res,fieldName));
+
+    }
+    parse(data: any,fieldName:string):any {
+      var values:AutoCompleteValue[] = [];
+      if(data){
+          let field = data[fieldName];
+          for(let i=0; i<field.length; i++) {
+            var value:AutoCompleteValue = new AutoCompleteValue();
+            value.label = field[i].name;
+            value.label = RefineResultsUtils.inParenthesisThePartAfterCharacters(field[i],"||");
+            value.id = field[i].id;
+            values.push(value);
+
+        }
+    }
+
+    return values;
+    }
+
+    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.log(error);
+      return Observable.throw(error  || 'Server error');
+    }
+}
diff --git a/services/refineFieldResultsService.module.ts b/services/refineFieldResultsService.module.ts
new file mode 100644
index 00000000..79c9e94c
--- /dev/null
+++ b/services/refineFieldResultsService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {RefineFieldResultsService} from './refineFieldResults.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  RefineFieldResultsService
+],
+  exports: [
+    ]
+})
+export class RefineFieldResultsServiceModule { }
diff --git a/services/reports.service.ts b/services/reports.service.ts
new file mode 100644
index 00000000..210c0249
--- /dev/null
+++ b/services/reports.service.ts
@@ -0,0 +1,56 @@
+import {Injectable} from '@angular/core';
+import {Http, Response, Headers} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../shared/cache.service';
+
+@Injectable()
+export class ReportsService {
+    // url:string = "http://beta.services.openaire.eu:8480/search/rest/v2/api/publications?format=csv&page=0&size=3&q=(%22test%22)&fq=instancetypename%20exact%20%22Dataset%22";
+    constructor(private http: Http) {}
+//text/html
+    //On the service:
+   downloadCSVFile(url: string){
+     var headers = new Headers();
+     headers.append('responseType', 'arraybuffer');
+     return this.http.get(url)
+               .map(res => new Blob([res['_body']], { type: 'text/csv' }));
+   }
+   getCSVResponse(url: string){
+     var headers = new Headers();
+     headers.append('responseType', 'arraybuffer');
+     return this.http.get(url)
+                .map(res => res['_body']);
+   }
+   downloadHTMLFile(url: string, info: string){
+     var headers = new Headers();
+     headers.append('responseType', 'arraybuffer');
+     return this.http.get(url)
+                .map(res => this.addInfo(res, info))
+                .map(res => new Blob([res['_body']], { type: 'text/html' }))
+                .do(res => console.log(res))
+   }
+
+   addInfo(res:any, info:string) {
+       /*
+       var para = res.document.createElement("P");                       // Create a <p> element
+       var t = res.document.createTextNode("This is a paragraph");       // Create a text node
+       para.appendChild(t);                                          // Append the text to <p>
+       res.document.body.appendChild(para);
+       */
+       res['_body'] = info+res['_body'];
+       return 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.log(error);
+        return Observable.throw(error  || 'Server error');
+    }
+
+
+}
diff --git a/services/reportsService.module.ts b/services/reportsService.module.ts
new file mode 100644
index 00000000..0d637dad
--- /dev/null
+++ b/services/reportsService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {ReportsService} from './reports.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  ReportsService
+],
+  exports: [
+    ]
+})
+export class ReportsServiceModule { }
diff --git a/services/searchDataproviders.service.ts b/services/searchDataproviders.service.ts
new file mode 100644
index 00000000..3f05580a
--- /dev/null
+++ b/services/searchDataproviders.service.ts
@@ -0,0 +1,433 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {SearchResult}     from '../utils/entities/searchResult';
+import {RefineResultsUtils} from './servicesUtils/refineResults.class';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../shared/cache.service';
+import {StringUtils} from '../utils/string-utils.class';
+@Injectable()
+export class SearchDataprovidersService {
+    constructor(private http: Http ) {}
+
+    searchDataproviders (params: string, refineParams:string, page: number, size: number, refineFields:string[] ):any {
+
+        let link = OpenaireProperties. getSearchAPIURLLast()+"datasources";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "datasource")]);
+    }
+    //((oaftype exact datasource) and(collectedfromdatasourceid exact "openaire____::47ce9e9f4fad46e732cff06419ecaabb"))
+    advancedSearchDataproviders (params: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact datasource) "
+      url += "?query=";
+      if(params!= null && params != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (" + params + ")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+      .map(res => [res['meta'].total, this.parseResults(res['results'])])
+    }
+
+    searchCompatibleDataprovidersTable ():any {
+      let size: number = 0;
+      let url: string= OpenaireProperties.getSearchResourcesAPIURL();
+      url += '?query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other) not(datasourcetypeuiid exact "pubsrepository::journal") not(datasourcetypeuiid exact "aggregator::pubsrepository::journals"))';
+      url += "&page=0&size=0&format=json";
+
+
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url).map(res => <any> res.json())
+
+                        .map(res => res['meta'].total);
+    }
+
+    searchCompatibleDataproviders (params: string,refineParams:string, page: number, size: number, refineFields:string[] ):any {
+      console.info("in search Compatible Dataproviders service function");
+      let url: string = OpenaireProperties.getSearchResourcesAPIURL();
+      url += '?query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other) not(datasourcetypeuiid exact "pubsrepository::journal") not(datasourcetypeuiid exact "aggregator::pubsrepository::journals"))';
+      if(params!= null && params != ''  ) {
+        url += params;
+      }
+      if(refineParams!= null && refineParams != ''  ) {
+        url += refineParams;
+      }
+      url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+      .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "datasource")]);
+    }
+
+    searchEntityRegistriesTable ():any {
+      let size: number = 0;
+      let url: string= OpenaireProperties.getSearchResourcesAPIURL();
+      url += "?query=((oaftype exact datasource) and(datasourcetypeuiid = other))";
+      url += "&page=0&size=0&format=json";
+
+
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url).map(res => <any> res.json())
+                        .map(res => res['meta'].total);
+    }
+
+    searchEntityRegistries (params: string,refineParams:string, page: number, size: number, refineFields:string[] ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      url += "?query=((oaftype exact datasource) and(datasourcetypeuiid = other))";
+      if(params!= null && params != ''  ) {
+        url += params;
+      }
+      if(refineParams!= null && refineParams != ''  ) {
+        url += refineParams;
+      }
+      url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+      .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "datasource")]);
+    }
+
+    searchJournalsTable ():any {
+      let size: number = 0;
+      let url: string= OpenaireProperties.getSearchResourcesAPIURL();
+      url += '?query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) and (datasourcetypeuiid exact "pubsrepository::journal" or datasourcetypeuiid exact "aggregator::pubsrepository::journals" ))';
+      url += "&page=0&size=0&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url).map(res => <any> res.json())
+                        .map(res => res['meta'].total);
+    }
+
+    searchJournals (params: string,refineParams:string, page: number, size: number, refineFields:string[] ):any {
+      console.info("in search Journals service function");
+      let url: string = OpenaireProperties.getSearchResourcesAPIURL();
+      //url += "?query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other))"
+      url += '?query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) and (datasourcetypeuiid exact "pubsrepository::journal" or datasourcetypeuiid exact "aggregator::pubsrepository::journals" ))';
+
+      if(params!= null && params != ''  ) {
+        url += params;
+      }
+      if(refineParams!= null && refineParams != ''  ) {
+        url += refineParams;
+      }
+      url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+      .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "datasource")]);
+    }
+
+    searchDataprovidersForDeposit (id: string,type:string, page: number, size: number):any {
+        let link = OpenaireProperties.getSearchResourcesAPIURL();
+        var compatibilities = "";
+        if(type == "Research Data"){
+          compatibilities = " and (datasourcecompatibilityid <> UNKNOWN) and (datasourcecompatibilityid = openaire2.0_data)"
+        }else if(type == "Publications"){
+          compatibilities = " and (datasourcecompatibilityid <> UNKNOWN) and (datasourcecompatibilityid <> openaire2.0_data)"
+        }
+        let url = link+"?query=(((deletedbyinference = false) AND (oaftype exact datasource)) "+((compatibilities && compatibilities.length > 0)?" "+compatibilities+" ":"")+") and (relorganizationid exact "+id+")";
+        url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    searchDataProvidersBySubjects(keyword:string, type:string, page: number, size: number):any {
+      let link = OpenaireProperties.getSearchResourcesAPIURL();
+      var compatibilities = "";
+      if(type == "Research Data"){
+        compatibilities = " and (datasourcecompatibilityid <> UNKNOWN) and (datasourcecompatibilityid = openaire2.0_data)"
+      }else if(type == "Publications"){
+        compatibilities = " and (datasourcecompatibilityid <> UNKNOWN) and (datasourcecompatibilityid <> openaire2.0_data)"
+      }
+      let url = link+"?query=(((deletedbyinference = false) AND (oaftype exact datasource)) "+((compatibilities && compatibilities.length > 0)?" "+
+      compatibilities+" ":"")+") "+
+      " and (datasourcesubject all "+'"'+keyword+'"'+") " ;
+      url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+
+    }
+
+    getDataProvidersforEntityRegistry(datasourceId: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact datasource) "
+      url += "?query=";
+      if(datasourceId!= null && datasourceId != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (collectedfromdatasourceid exact \"" + datasourceId + "\")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    searchDataprovidersForEntity (params: string, page: number, size: number):any {
+        let link = OpenaireProperties. getSearchAPIURLLast();
+        let url = link+params+"/datasources?format=json";
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+/*
+    searchDataprovidersCSV (params: string, refineParams:string, page: number, size: number):any {
+
+        let link = OpenaireProperties. getSearchAPIURLLast()+"datasources";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+
+                    .map(res => this.parseResultsCSV(res['results']));
+    }
+*/
+/*
+    searchEntityRegistriesCSV (params: string,refineParams:string, page: number, size: number):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      url += "?query=((oaftype exact datasource) and(datasourcetypeuiid = other))"
+      if(params!= null && params != ''  ) {
+        url += params;
+      }
+      if(refineParams!= null && refineParams != ''  ) {
+        url += refineParams;
+      }
+      url += "&page="+(page - 1)+"&size="+size+"&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+
+      .map(res => this.parseResultsCSV(res['results']));
+    }
+*/
+/*
+    searchCompatibleDataprovidersCSV (params: string,refineParams:string, page: number, size: number):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      url += "?query=((oaftype exact datasource) not(datasourcecompatibilityid = UNKNOWN) not(datasourcecompatibilityid = notCompatible) not(datasourcetypeuiid = other))"
+      if(params!= null && params != ''  ) {
+        url += params;
+      }
+      if(refineParams!= null && refineParams != ''  ) {
+        url += refineParams;
+      }
+      url += "&page="+(page - 1)+"&size="+size+"&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+ 
+      .map(res => this.parseResultsCSV(res['results']));
+    }
+*/
+
+
+    parseResults(data: any): SearchResult[] {
+        let results: SearchResult[] = [];
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:datasource'] : data['result']['metadata']['oaf:entity']['oaf:datasource'];
+
+            var result: SearchResult = new SearchResult();
+
+            result['title'] = {"name": '', "accessMode": '', "sc39": ''};
+
+            result['title'].name = resData.officialname;
+
+            //result['title'].url = OpenaireProperties.getsearchLinkToDataProvider();
+            //result['title'].url += Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            result['id'] = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+
+            result['type'] = this.getDataproviderType(resData);
+
+            let typeid: string = resData['datasourcetype'].classid;
+            //console.info(typeid);
+            if(typeid != "entityregistry" && typeid != "entityregistry::projects" && typeid != "entityregistry::repositories") {
+
+                if(resData.hasOwnProperty('accessinfopackage')) {
+                    let OAIPMHURL: string;
+                    if(Array.isArray(resData['accessinfopackage'])) {
+                        OAIPMHURL = resData['accessinfopackage'][0];
+                    } else {
+                        OAIPMHURL = resData['accessinfopackage'];
+                    }
+
+                    if(OAIPMHURL != '' && OAIPMHURL != 'unknown') {
+                        result['OAIPMHURL'] = OAIPMHURL;
+                    }
+                }
+                result['compatibility'] = this.getDataproviderCompatibility(resData);
+            }
+
+            result['websiteURL'] = resData.websiteurl;
+
+            let res:[string[], {"name":string, "id":string}[]] = this.getDataproviderCountriesOrganizations(resData, true, true);
+            result['organizations'] = res[1];
+            result['countries'] = res[0];
+            result['subjects'] = this.getDataproviderSubjects(resData);
+            //console.log(result['subjects']);
+            results.push(result);
+        }
+
+        return results;
+    }
+    getDataproviderSubjects(resData: any): string [] {
+      var subjects:string [] = [];
+
+      let length = Array.isArray(resData['subjects']) ? resData['subjects'].length : 1;
+      for(let i=0; i<length; i++) {
+          let subject = Array.isArray(resData['subjects']) ? resData['subjects'][i] :resData['subjects'];
+          subjects.push(subject.content);
+      }
+      return subjects;
+    }
+    getDataproviderType(resData: any): string {
+        if(resData['datasourcetype'].hasOwnProperty("classname")) {
+            return resData['datasourcetype'].classname;
+        } else {
+            return '';
+        }
+    }
+
+    getDataproviderCompatibility(resData: any): string {
+        if(resData.hasOwnProperty('openairecompatibility')) {
+            return resData['openairecompatibility'].classname;
+        } else {
+            return '';
+        }
+    }
+
+    getDataproviderCountriesOrganizations(resData: any, getCountries: boolean, getOrganizations: boolean): [string[], {"name": string, "id": string}[]] {
+        let countries: string[] = [];
+        let organizations: {"name": string, "id": string}[] = [];
+
+        if(resData['rels'].hasOwnProperty("rel")) {
+            let countriesSet: Set<string> = new Set<string>();
+
+            let relLength = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'].length : 1;
+
+            for(let i=0; i<relLength; i++) {
+                let relation = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'][i] : resData['rels']['rel'];
+
+                if(relation.hasOwnProperty("to")) {
+                    if(relation['to'].class == "provides" && relation['to'].type == "organization") {
+                        if(getOrganizations) {
+                            let item: {"name":string, "id":string} = {"name": "", "id": ""};
+                            //item['name'] = relation.legalname;
+                            if(relation.legalshortname) {
+                              item['name'] = relation.legalshortname;
+                            } else {
+                              item['name'] = relation.legalname;
+                            }
+                            item['id'] = /*OpenaireProperties.getsearchLinkToOrganization()+*/relation['to'].content;
+                            organizations.push(item);
+                        }
+
+                        if(getCountries) {
+                            if(relation.hasOwnProperty('country') &&
+                               relation.country.hasOwnProperty('classname')) {
+                                if(!countriesSet.has(relation.country.classname)) {
+                                    countriesSet.add(relation.country.classname);
+                                    countries.push(relation.country.classname);
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        return [countries, organizations];
+    }
+/*
+    parseResultsCSV(data: any): any {
+        let results: any = [];
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:datasource'] : data['result']['metadata']['oaf:entity']['oaf:datasource'];
+
+            var result: any = [];
+
+            result.push(this.quote(resData.officialname));
+            result.push(this.quote(this.getDataproviderType(resData)));
+            result.push(this.quote(this.getDataproviderCountriesOrganizations(resData, true, false)[0]));
+            result.push(this.quote(this.getDataproviderCompatibility(resData)));
+            results.push(result);
+        }
+        return results;
+    }
+*/
+    numOfDataproviders(url: string):any {
+        //let url = OpenaireProperties. getSearchAPIURLLast()+params+(params.indexOf("?") == -1 ?"?":"&")+"format=json";
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => res.total);
+    }
+
+    numOfEntityDataproviders(id: string, entity: string):any {
+        var parameters = "";
+        if(entity == "organization") {
+          parameters = "organizations/"+id+"/datasources/count";
+        }
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+parameters+"?format=json";
+        return this.numOfDataproviders(url);
+    }
+
+    numOfSearchDataproviders(params: string):any {
+        let url: string = OpenaireProperties.getSearchAPIURLLast()+"datasources/count?format=json";
+        if(params != "") {
+          url += "&q=" + params;
+        }
+
+        return this.numOfDataproviders(url);
+    }
+/*
+    private quote(word: any): string {
+        return '"'+word+'"';
+    }
+*/
+}
diff --git a/services/searchDatasets.service.ts b/services/searchDatasets.service.ts
new file mode 100644
index 00000000..c6aec560
--- /dev/null
+++ b/services/searchDatasets.service.ts
@@ -0,0 +1,343 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {SearchResult}     from '../utils/entities/searchResult';
+import {RefineResultsUtils} from './servicesUtils/refineResults.class';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+import { ParsingFunctions } from '../landingPages/landing-utils/parsingFunctions.class';
+
+@Injectable()
+export class SearchDatasetsService {
+    private sizeOfDescription: number = 270;
+    public parsingFunctions: ParsingFunctions = new ParsingFunctions();
+
+    constructor(private http: Http ) {}
+
+    searchDatasets (params: string, refineParams:string, page: number, size: number, refineFields:string[] ):any {
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"datasets";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+ (page-1) +"&size="+size+"&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "dataset")]);
+    }
+    searchDatasetById (id: string ):any {
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+"datasets/"+id+"?format=json";
+         return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => this.parseResults(res));
+    }
+
+    searchAggregators (id: string, params: string, refineParams:string, page: number, size: number ):any {
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"datasets";
+
+        let url = link+"?"+"&format=json";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size;
+
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => this.parseRefineResults(id, res['refineResults']))
+    }
+
+    searchDatasetsByDois (DOIs: string[], refineParams:string, page: number, size: number, refineFields:string[] ):any {
+        let link = OpenaireProperties.getSearchAPIURLLast()+"datasets";
+        let url = link+"?";
+        var doisParams = "";
+
+        for(var i =0 ;i < DOIs.length; i++){
+          doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+        }
+        if(doisParams.length > 0){
+          url += "&"+doisParams;
+
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+ (page-1) +"&size="+size+"&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "dataset")]);
+    }
+    advancedSearchDatasets (params: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact result) and (resulttypeid exact dataset)  "
+      url += "?query=";
+      if(params!= null && params != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (" + params + ")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size;
+      url += "&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+      .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    searchDatasetsForEntity (params: string, page: number, size: number):any {
+        let link = OpenaireProperties.getSearchAPIURLLast();
+        let url = link+params+"/datasets"+"?format=json";
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+
+    searchDatasetsForDataproviders(params: string, page: number, size: number):any {
+        let link = OpenaireProperties.getSearchAPIURLLast();
+        let url = link+params+ "&page="+(page-1)+"&size="+size + "&format=json";
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+
+    parseResults(data: any): SearchResult[] {
+        let results: SearchResult[] = [];
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:result'] : data['result']['metadata']['oaf:entity']['oaf:result'];
+
+            var result: SearchResult = new SearchResult();
+            result.entityType = "dataset";
+            if(resData['language'] && resData['language'] != null) {
+              result.languages = new Array<string>();
+              result.types = new Array<string>();
+              let types = new Set<string>();
+
+              let counter = 0;
+              let instance;
+
+              let length = Array.isArray(resData['children']['instance']) ? resData['children']['instance'].length : 1;
+
+              for(let i=0; i<length; i++) {
+                instance = Array.isArray(resData['children']['instance']) ? resData['children']['instance'][i] : resData['children']['instance'];
+                this.parsingFunctions.parseTypes(result.types, types, instance);
+              }
+              if(!Array.isArray(resData['language'])) {
+                if(resData['language'].classname != "Undetermined" && resData['language'].classname) {
+                  result.languages.push(resData['language'].classname);
+                }
+              } else {
+                for(let i=0; i<resData['language'].length; i++) {
+                  if(resData['language'][i].classname != "Undetermined" && resData['language'][i].classname) {
+                    result.languages.push(resData['language'][i].classname);
+                  }
+                }
+              }
+            }
+            result['title'] = {"name": '', "accessMode": '', "sc39": ''};
+
+            if(Array.isArray(resData['title'])) {
+                result['title'].name = resData['title'][0].content;
+            } else {
+                result['title'].name = resData['title'].content;
+            }
+
+            //result['title'].url = OpenaireProperties.getsearchLinkToDataset();
+            //result['title'].url += Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            result['id'] = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            if(resData['bestaccessright'].hasOwnProperty("classid")) {
+                result['title'].accessMode = resData['bestaccessright'].classid;
+            }
+
+            if(resData['rels'].hasOwnProperty("rel")) {
+                let relLength = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'].length : 1;
+
+                for(let j=0; j<relLength; j++) {
+                    let relation = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'][j] : resData['rels']['rel'];
+
+                    if(relation.hasOwnProperty("to")) {
+                        /*if(relation['to'].class == "hasAuthor") {
+                          if(result['authors'] == undefined) {
+                            result['authors'] = new Array<{"name": string, "id": string}>();
+                          }
+
+                          result['authors'].push({"name": relation.fullname, "id": relation['to'].content});
+                        } else */if(relation['to'].class == "isProducedBy") {
+                          result['projects'] = this.parseProjects(result['projects'], relation);
+                        }
+                    }
+                }
+            }
+
+            if(resData.hasOwnProperty("creator") && resData['creator'] != null) {
+              if(result['authors'] == undefined) {
+                result['authors'] = new Array<string>();
+              }
+
+              let authors = resData['creator'];
+              let length = Array.isArray(authors) ? authors.length : 1;
+
+              for(let i=0; i<length; i++) {
+                let author = Array.isArray(authors) ? authors[i] : authors;
+                result.authors[author.rank-1] = author.content;
+              }
+              result.authors = result.authors.filter(function (item) {
+                return (item != undefined);
+              });
+            }
+
+            var date:string = (resData.dateofacceptance)+""; // transform to string in case it is an integer
+            result.year = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+            if(!Array.isArray(resData.description)) {
+                result.description = resData.description;
+            } else {
+                result.description = resData.description[0];
+            }
+            if(result.description.length > this.sizeOfDescription) {
+                result.description = result.description.substring(0, this.sizeOfDescription)+"...";
+            }
+
+            result.embargoEndDate = resData.embargoenddate;
+
+            if(!Array.isArray(resData.publisher)) {
+                result.publisher = resData.publisher;
+            } else {
+                for(let i=0; i<resData.publisher.length; i++) {
+                    if(result.publisher != undefined){
+                        result.publisher += ', '+resData['publisher'][i];
+                    } else {
+                        result.publisher = resData['publisher'][i];
+                    }
+                }
+            }
+
+            results.push(result);
+        }
+
+        return results;
+    }
+
+    parseProjects(projects: { "id": string, "acronym": string, "title": string,
+                              "funderShortname": string, "funderName": string,
+                              "code": string }[], relation: any ) :  {
+                              "id": string, "acronym": string, "title": string,
+                              "funderShortname": string, "funderName": string,
+                              "code": string }[] {
+      if(projects == undefined) {
+          projects = new Array<
+              { "id": string, "acronym": string, "title": string,
+                "funderShortname": string, "funderName": string,
+                "code": string
+              }>();
+      }
+
+      let countProjects = projects.length;
+
+      projects[countProjects] = {
+          "id": "", "acronym": "", "title": "",
+          "funderShortname": "", "funderName": "",
+          "code": ""
+      }
+
+      if(relation.title != 'unidentified') {
+          projects[countProjects]['id'] =
+              /*OpenaireProperties.getsearchLinkToProject() + */relation['to'].content;
+          projects[countProjects]['acronym'] = relation.acronym;
+          projects[countProjects]['title'] = relation.title;
+          projects[countProjects]['code'] = relation.code;
+      } else {
+          projects[countProjects]['id'] = "";
+          projects[countProjects]['acronym'] = "";
+          projects[countProjects]['title'] = "";
+          projects[countProjects]['code'] = "";
+      }
+
+      if(relation.hasOwnProperty("funding")) {
+          let fundingLength = Array.isArray(relation['funding']) ? relation['funding'].length : 1;
+
+          for(let z=0; z<fundingLength; z++) {
+              let fundingData = Array.isArray(relation['funding']) ? relation['funding'][z] : relation['funding'];
+
+              if(fundingData.hasOwnProperty("funder")) {
+                  projects[countProjects]['funderShortname'] = fundingData['funder'].shortname;
+                  projects[countProjects]['funderName'] = fundingData['funder'].name;
+              }
+          }
+      }
+
+      return projects;
+    }
+
+    parseRefineResults(id: string, data: any): any {
+        var results:any = [];
+        if(data.hasOwnProperty("resulthostingdatasource")) {
+            let length = Array.isArray(data['resulthostingdatasource']) ? data['resulthostingdatasource'].length : 1;
+
+            for(let i=0; i<length; i++) {
+                let datasource = Array.isArray(data['resulthostingdatasource']) ? data['resulthostingdatasource'][i] : data['resulthostingdatasource'];
+
+                let result: {"name": string, "id": string, "count": number} = {"name": "", "id": "", "count": 0};
+                result['name'] = datasource.name;
+                result['id'] = datasource.id.split("||")[0];
+                //result['url'] = OpenaireProperties.getsearchLinkToDataProvider()+result['id'];
+                result['count'] = datasource.count;
+
+                if(result['id'] != id && result['name'] != "Unknown Repository") {
+                    results.push(result);
+                }
+            }
+        }
+        return results;
+    }
+
+    numOfDatasets(url: string):any {
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  .map(res => res.total);
+    }
+
+    numOfEntityDatasets(id: string, entity: string):any {
+        var parameters = "";
+
+        if(entity == "project") {
+          parameters = "projects/"+id+"/datasets/count";
+        }
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+parameters+"?format=json";
+        return this.numOfDatasets(url);
+    }
+
+    numOfSearchDatasets(params: string):any {
+        let url = OpenaireProperties.getSearchAPIURLLast()+"datasets/count?format=json";
+        if(params != "") {
+          url += "&q=" + params;
+        }
+        return this.numOfDatasets(url);
+    }
+}
diff --git a/services/searchOrganizations.service.ts b/services/searchOrganizations.service.ts
new file mode 100644
index 00000000..5da21881
--- /dev/null
+++ b/services/searchOrganizations.service.ts
@@ -0,0 +1,191 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../shared/cache.service';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {SearchResult}     from '../utils/entities/searchResult';
+import {RefineResultsUtils} from './servicesUtils/refineResults.class';
+
+@Injectable()
+export class SearchOrganizationsService {
+
+    constructor(private http: Http ) {}
+
+    parseResultsForDeposit(data: any): {"name": string, "id": string}[] {
+        let results: {"name": string, "id": string}[] = [];
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let name: string = '';
+            let id: string = '';
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:organization'] : data['result']['metadata']['oaf:entity']['oaf:organization'];
+            name = resData.legalname;
+            if(name == '') {
+                name = resData.legalshortname;
+            }
+
+            id = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+
+            results.push({"name": name, "id": id});
+        }
+        console.info(results);
+        return results;
+    }
+
+    searchOrganizations (params: string, refineParams:string, page: number, size: number, refineFields:string[] ):any {
+
+        console.info("In searchOrganizations");
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"organizations";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size + "&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "organization")]);
+    }
+    advancedSearchOrganizations (params: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact organization) "
+      url += "?query=";
+      if(params!= null && params != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (" + params + ")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size;
+      url += "&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+
+      .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    parseResults(data: any): SearchResult[] {
+        let results: SearchResult[] = [];
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+             let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:organization'] : data['result']['metadata']['oaf:entity']['oaf:organization'];
+
+            var result: SearchResult = new SearchResult();
+
+            result['title'] = {"name": '', "accessMode": '', "sc39": ''};
+
+            result['title'].name = resData.legalshortname;
+            if(result['title'].name == '') {
+                result['title'].name = resData.legalname;
+            }
+
+            //result['title'].url = OpenaireProperties.getsearchLinkToOrganization();
+            //result['title'].url += Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            result['id'] = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+
+            if(resData['rels'].hasOwnProperty("rel")) {
+                let relLength = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'].length : 1;
+
+                for(let j=0; j<relLength; j++) {
+                    let relation = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'][j] : resData['rels']['rel'];
+
+                    if(relation.hasOwnProperty("to")) {
+                        if(relation['to'].class == "isParticipant") {
+                            if(result['projects'] == undefined) {
+                                result['projects'] = new Array<
+                                    { "id": string, "acronym": string, "title": string,
+                                      "funderShortname": string, "funderName": string,
+                                      "code": string
+                                    }>();
+                            }
+
+                            let countProjects = result['projects'].length;
+
+                            result['projects'][countProjects] = {
+                                "id": "", "acronym": "", "title": "",
+                                "funderShortname": "", "funderName": "",
+                                "code": ""
+                            }
+
+                            if(relation.title != 'unidentified') {
+                                result['projects'][countProjects]['id'] =
+                                    /*OpenaireProperties.getsearchLinkToProject() + */relation['to'].content;
+                                result['projects'][countProjects]['acronym'] = relation.acronym;
+                                result['projects'][countProjects]['title'] = relation.title;
+                                result['projects'][countProjects]['code'] = relation.code;
+                            } else {
+                                result['projects'][countProjects]['id'] = "";
+                                result['projects'][countProjects]['acronym'] = "";
+                                result['projects'][countProjects]['title'] = "";
+                                result['projects'][countProjects]['code'] = "";
+                            }
+
+                            if(relation.hasOwnProperty("funding")) {
+                                let fundingLength = Array.isArray(relation['funding']) ? relation['funding'].length : 1;
+
+                                for(let z=0; z<fundingLength; z++) {
+                                    let fundingData = Array.isArray(relation['funding']) ? relation['funding'][z] : relation['funding'];
+
+                                    if(fundingData.hasOwnProperty("funder")) {
+                                        result['projects'][countProjects]['funderShortname'] = fundingData['funder'].shortname;
+                                        result['projects'][countProjects]['funderName'] = fundingData['funder'].name;
+                                    }
+                                }
+                            }
+
+                        }
+                    }
+                }
+            }
+
+            if(resData.country.hasOwnProperty("classname")) {
+                result.country = resData.country.classname;
+            }
+
+            results.push(result);
+        }
+
+        return results;
+    }
+
+    numOfOrganizations(url: string): any {
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  .map(res => res.total);
+    }
+
+    numOfEntityOrganizations(id: string, entity: string):any {
+        // currently not used - if used fix entity comparison below
+        var parameters: string = "";
+        if(entity == "organization") {
+          parameters = "organizations/"+id+"/organizations/count";
+        }
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+parameters+"?format=json";
+        return this.numOfOrganizations(url);
+    }
+
+    numOfSearchOrganizations(params: string):any {
+        let url = OpenaireProperties.getSearchAPIURLLast()+"organizations/count?format=json";
+        if(params != "") {
+          url += "&q=" + params;
+        }
+        return this.numOfOrganizations(url);
+    }
+}
diff --git a/services/searchProjects.service.ts b/services/searchProjects.service.ts
new file mode 100644
index 00000000..741ca621
--- /dev/null
+++ b/services/searchProjects.service.ts
@@ -0,0 +1,242 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../shared/cache.service';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {SearchResult}     from '../utils/entities/searchResult';
+import {RefineResultsUtils} from './servicesUtils/refineResults.class';
+
+@Injectable()
+export class SearchProjectsService {
+    private sizeOfDescription: number = 270;
+
+    constructor(private http: Http ) {}
+
+    searchProjects (params: string, refineParams:string, page: number, size: number, refineFields:string[] ):any {
+
+        console.info("In searchProjects");
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"projects";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size + "&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "project")]);
+    }
+    getProjectsforDataProvider (datasourceId: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact project) "
+      url += "?query=";
+      if(datasourceId!= null && datasourceId != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (collectedfromdatasourceid exact \"" + datasourceId + "\")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size;
+      url += "&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    advancedSearchProjects (params: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact project) "
+      url += "?query=";
+      if(params!= null && params != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (" + params + ")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size;
+      url += "&format=json";
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+      .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    getProjectsForOrganizations (organizationId: string, filterquery: string, page: number, size: number, refineFields:string[]  ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact project) "
+      url += "?query=";
+      if(filterquery!= null && filterquery != ''  ) {
+        url +="( ( "+basicQuery+ " )  and (relorganizationid exact \"" + organizationId + "\")"+"  " + filterquery + ")";
+      }else{
+        url +=" (( "+basicQuery+ " ) " +" and (relorganizationid exact \"" + organizationId + "\"))";
+      }
+      if(refineFields!= null && refineFields.length > 0 ) {
+        url +="&refine=true";
+        for(let i=0; i< refineFields.length ; i++ ){
+          url +="&fields="+refineFields[i];
+        }
+      }
+      url += "&page="+(page-1)+"&size="+size;
+      url += "&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  //.do(res => console.info(res))
+                  .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "project")]);
+    }
+    getFunders():any {
+       let url = OpenaireProperties.getSearchAPIURLLast()+"projects?refine=true&fields=funder&size=0"+ "&format=json";;
+
+       return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                   .map(res => <any> res.json())
+                   .map(res => [res['meta'].total, res['refineResults']['funder']]);
+
+
+      }
+
+      searchForProjectsObs(keyword:string, funderId:string):any {
+         let url = '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+%28funder+exact+'+funderId+'%29&size=10&locale=en_GB&format=json';
+
+         return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url).toPromise()
+                    .then(request =>{
+                      return (request.json().response.results)?request.json().response.results.result:request.json().response.result;
+
+                }) ;
+        }
+    parseResults(data: any): SearchResult[] {
+        let results: SearchResult[] = [];
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:project'] : data['result']['metadata']['oaf:entity']['oaf:project'];
+
+            var result: SearchResult = new SearchResult();
+            result.openAccessMandate = (resData['oamandatepublications'])?true:false;
+            result['title'] = {"name": '', "accessMode": '', "sc39": ''};
+            if(resData['acronym'] != undefined && resData['acronym'] != "") {
+                result['title'].name = resData['acronym'] + " - ";
+            }
+            if(Array.isArray(resData['title'])) {
+                // resData['title'][0].hasOwnProperty("content") {
+                    result['title'].name += resData['title'][0];
+                // }
+            } else {
+                // resData['title'].hasOwnProperty("content") {
+                    result['title'].name += resData['title'];
+                // }
+            }
+
+            if(result['title'].name != '') {
+                result['title'].name += " ("+resData['code']+")"
+            }
+
+            if(resData['ecsc39'] == true) {
+                result['title'].sc39 = "sc39";
+            }
+
+
+
+            // if(resData['title'].hasOwnProperty("content")) {
+            //     result['title'].name = resData['title'].content;
+            // }
+            //result['title'].url = OpenaireProperties.getsearchLinkToProject();
+            //result['title'].url += Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            result['id'] = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+
+            if(resData['rels'].hasOwnProperty("rel")) {
+                let relLength = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'].length : 1;
+
+                for(let j=0; j<relLength; j++) {
+                    let relation = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'][j] : resData['rels']['rel'];
+
+                    if(relation.hasOwnProperty("to")) {
+                         if(relation['to'].class == "hasParticipant") {
+                            if(result['organizations'] == undefined) {
+                                result['organizations'] = new Array<
+                                    { "name": string, "id": string}>();
+                            }
+
+                            let countOrganizations = result['organizations'].length;
+
+                            result['organizations'][countOrganizations] = { "name": "", "id": "" }
+
+                            result['organizations'][countOrganizations]['id'] =
+                                /*OpenaireProperties.getsearchLinkToOrganization() + */relation['to'].content;
+                            if(relation.legalshortname) {
+                              result['organizations'][countOrganizations]['name'] = relation.legalshortname;
+                            } else {
+                              result['organizations'][countOrganizations]['name'] = relation.legalname;
+                            }
+                        }
+                    }
+                }
+            }
+            if(resData.hasOwnProperty("fundingtree")) {
+              if(result['funders'] == undefined) {
+                  result['funders'] = new Array<
+                      {"funderShortname": string, "funderName": string}>();
+              }
+
+                let fundingLength = Array.isArray(resData['fundingtree']) ? resData['fundingtree'].length : 1;
+
+                for(let z=0; z<fundingLength; z++) {
+                    let fundingData = Array.isArray(resData['fundingtree']) ? resData['fundingtree'][z] : resData['fundingtree'];
+                      let countFunders = result['funders'].length;
+                    if(fundingData.hasOwnProperty("funder")) {
+                        result['funders'][countFunders] =   {"funderShortname": "", "funderName": ""};
+                        result['funders'][countFunders]['funderShortname'] = fundingData['funder'].shortname;
+                        result['funders'][countFunders]['funderName'] = fundingData['funder'].name;
+                    }
+                }
+            }
+            if(resData.hasOwnProperty("startdate")) {
+              result.startYear = resData.startdate.split('-')[0];
+            }
+            if(resData.hasOwnProperty("enddate")) {
+              result.endYear = resData.enddate.split('-')[0];
+            }
+
+            results.push(result);
+        }
+
+        return results;
+    }
+
+    numOfProjects(url: string):any {
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  .map(res => res.total);
+    }
+
+    numOfEntityProjects(id: string, entity: string):any {
+        //let url = OpenaireProperties.getSearchAPIURLLast()+params+(params.indexOf("?") == -1 ?"?":"&")+"format=json";
+        var parameters: string = "";
+        if(entity == "organization") {
+          parameters = "organizations/"+id+"/projects/count";
+        }
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+parameters+ "?format=json";
+
+        return this.numOfProjects(url);
+    }
+
+    numOfSearchProjects(params: string):any {
+        let url = OpenaireProperties.getSearchAPIURLLast()+"projects/count?format=json";
+        if(params != "") {
+          url += "&q=" + params;
+        }
+        return this.numOfProjects(url);
+    }
+}
diff --git a/services/searchPublications.service.ts b/services/searchPublications.service.ts
new file mode 100644
index 00000000..125f3b84
--- /dev/null
+++ b/services/searchPublications.service.ts
@@ -0,0 +1,461 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {   } from '../shared/cache.service';
+
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {SearchResult}     from '../utils/entities/searchResult';
+import {RefineResultsUtils} from './servicesUtils/refineResults.class';
+
+import { ParsingFunctions } from '../landingPages/landing-utils/parsingFunctions.class';
+
+
+@Injectable()
+export class SearchPublicationsService {
+    private sizeOfDescription: number = 270;
+    public parsingFunctions: ParsingFunctions = new ParsingFunctions();
+
+    constructor(private http: Http ) {}
+
+    searchPublications (params: string, refineParams:string, page: number, size: number, refineFields:string[] ):any {
+        let link = OpenaireProperties.getSearchAPIURLLast()+"publications";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size+"&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    // .do(res => console.info(res))
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "publication")]);
+    }
+    searchPublicationById (id: string ):any {
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+"publications/"+id+"?format=json";
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res =>  this.parseResults(res));
+    }
+
+    searchAggregators (id: string, params: string, refineParams:string, page: number, size: number ):any {
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"publications";
+
+        let url = link+"?"+"&format=json";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size;
+
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => this.parseRefineResults(id, res['refineResults']));
+    }
+
+    searchPublicationsByDois (DOIs: string[], refineParams:string, page: number, size: number, refineFields:string[] ):any {
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"publications";
+
+        let url = link+"?"+"&format=json&";
+        var doisParams = "";
+
+        for(var i =0 ;i < DOIs.length; i++){
+          doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+        }
+        if(doisParams.length > 0){
+          url +="&"+doisParams;
+
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size;
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "publication")]);
+    }
+
+    advancedSearchPublications (params: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact result) and (resulttypeid exact publication) ";
+      url += "?query=";
+      if(params!= null && params != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (" + params + ")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size;
+      url += "&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+
+      .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    searchPublicationsForEntity (params: string, page: number, size: number):any {
+        let link = OpenaireProperties.getSearchAPIURLLast();
+        let url = link+params+"/publications"+ "?format=json";
+        url += "&page="+(page-1)+"&size="+size;
+
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+
+    searchPublicationsForDataproviders(params: string, page: number, size: number):any {
+        let link = OpenaireProperties.getSearchAPIURLLast();
+        let url = link+params+ "&page="+(page-1)+"&size="+size + "&format=json";
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+/*
+	searchPublicationsCSV (params: string, refineParams:string, page: number, size: number):any {
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"publications";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size+ "&format=json";
+
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+
+                    .map(res => this.parseResultsCSV(res['results']));
+    }
+*/
+
+    parseResults(data: any): SearchResult[] {
+        let results: SearchResult[] = [];
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:result'] : data['result']['metadata']['oaf:entity']['oaf:result'];
+
+            var result: SearchResult = new SearchResult();
+            result.entityType = "publication";
+            if(resData['language'] && resData['language'] != null) {
+              result.languages = new Array<string>();
+              result.types = new Array<string>();
+              let types = new Set<string>();
+
+              let counter = 0;
+              let instance;
+
+              let length = Array.isArray(resData['children']['instance']) ? resData['children']['instance'].length : 1;
+
+              for(let i=0; i<length; i++) {
+                instance = Array.isArray(resData['children']['instance']) ? resData['children']['instance'][i] : resData['children']['instance'];
+                this.parsingFunctions.parseTypes(result.types, types, instance);
+              }
+              if(!Array.isArray(resData['language'])) {
+                if(resData['language'].classname != "Undetermined" && resData['language'].classname) {
+                  result.languages.push(resData['language'].classname);
+                }
+              } else {
+                for(let i=0; i<resData['language'].length; i++) {
+                  if(resData['language'][i].classname != "Undetermined" && resData['language'][i].classname) {
+                    result.languages.push(resData['language'][i].classname);
+                  }
+                }
+              }
+            }
+            result['title'] = {"name": '', "accessMode": '', "sc39": ''};
+
+            if(Array.isArray(resData['title'])) {
+                // resData['title'][0].hasOwnProperty("content") {
+                    result['title'].name = resData['title'][0].content;
+                // }
+            } else {
+                // resData['title'].hasOwnProperty("content") {
+                    result['title'].name = resData['title'].content;
+                // }
+            }
+
+            //result['title'].url = OpenaireProperties.getsearchLinkToPublication();
+            //result['title'].url += Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            result['id'] = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            if(resData['bestaccessright'].hasOwnProperty("classid")) {
+                result['title'].accessMode = resData['bestaccessright'].classid;
+            }
+
+            if(resData['rels'].hasOwnProperty("rel")) {
+                let relLength = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'].length : 1;
+
+                for(let j=0; j<relLength; j++) {
+                    let relation = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'][j] : resData['rels']['rel'];
+
+                    if(relation.hasOwnProperty("to")) {
+                        /*if(relation['to'].class == "hasAuthor") {
+                            if(result['authors'] == undefined) {
+                                result['authors'] = new Array<{"name": string, "id": string}>();
+                            }
+
+                            result['authors'].push({"name": relation.fullname, "id": relation['to'].content});
+                        } else */if(relation['to'].class == "isProducedBy") {
+                            result['projects'] = this.parseProjects(result['projects'], relation);
+                        }
+                    }
+                }
+            }
+
+            if(resData.hasOwnProperty("creator") && resData['creator'] != null) {
+              if(result['authors'] == undefined) {
+                result['authors'] = new Array<string>();
+              }
+
+              let authors = resData['creator'];
+              let length = Array.isArray(authors) ? authors.length : 1;
+
+              for(let i=0; i<length; i++) {
+                let author = Array.isArray(authors) ? authors[i] : authors;
+                result.authors[author.rank-1] = author.content;
+              }
+              result.authors = result.authors.filter(function (item) {
+                return (item != undefined);
+              });
+            }
+
+            var date:string = (resData.dateofacceptance)+""; // transform to string in case it is an integer
+            result.year = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+
+            if(!Array.isArray(resData.description)) {
+                result.description = resData.description;
+            } else {
+                result.description = resData.description[0];
+            }
+
+            if(result.description.length > this.sizeOfDescription) {
+                result.description = result.description.substring(0, this.sizeOfDescription) + "...";
+            }
+
+
+            result.embargoEndDate = resData.embargoenddate;
+
+            results.push(result);
+        }
+
+        return results;
+    }
+
+    parseProjects(projects: { "id": string, "acronym": string, "title": string,
+                              "funderShortname": string, "funderName": string,
+                              "code": string }[], relation: any ) :  {
+                              "id": string, "acronym": string, "title": string,
+                              "funderShortname": string, "funderName": string,
+                              "code": string }[] {
+      if(projects == undefined) {
+          projects = new Array<
+              { "id": string, "acronym": string, "title": string,
+                "funderShortname": string, "funderName": string,
+                "code": string
+              }>();
+      }
+
+      let countProjects = projects.length;
+
+      projects[countProjects] = {
+          "id": "", "acronym": "", "title": "",
+          "funderShortname": "", "funderName": "",
+          "code": ""
+      }
+
+      if(relation.title != 'unidentified') {
+          projects[countProjects]['id'] =
+              /*OpenaireProperties.getsearchLinkToProject() + */relation['to'].content;
+          projects[countProjects]['acronym'] = relation.acronym;
+          projects[countProjects]['title'] = relation.title;
+          projects[countProjects]['code'] = relation.code;
+      } else {
+          projects[countProjects]['id'] = "";
+          projects[countProjects]['acronym'] = "";
+          projects[countProjects]['title'] = "";
+          projects[countProjects]['code'] = "";
+      }
+
+      if(relation.hasOwnProperty("funding")) {
+          let fundingLength = Array.isArray(relation['funding']) ? relation['funding'].length : 1;
+
+          for(let z=0; z<fundingLength; z++) {
+              let fundingData = Array.isArray(relation['funding']) ? relation['funding'][z] : relation['funding'];
+
+              if(fundingData.hasOwnProperty("funder")) {
+                  projects[countProjects]['funderShortname'] = fundingData['funder'].shortname;
+                  projects[countProjects]['funderName'] = fundingData['funder'].name;
+              }
+          }
+      }
+
+      return projects;
+    }
+/*
+    parseResultsCSV(data: any): any {
+        let results: any = [];
+
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:result'] : data['result']['metadata']['oaf:entity']['oaf:result'];
+
+            var result: any = [];
+
+            if(Array.isArray(resData['title'])) {
+                result.push(this.quote(resData['title'][0].content));
+            } else {
+                result.push(this.quote(resData['title'].content));
+            }
+
+            var authors: string[] = [];
+            var projects: string[] = [];
+            var funder: string = "";
+            if(resData['rels'].hasOwnProperty("rel")) {
+                let relLength = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'].length : 1;
+
+                for(let j=0; j<relLength; j++) {
+                    let relation = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'][j] : resData['rels']['rel'];
+
+                    if(relation.hasOwnProperty("to")) {
+                        if(relation['to'].class == "hasAuthor") {
+                            authors.push(relation.fullname);
+                        } else if(relation['to'].class == "isProducedBy") {
+                            if(relation.code != "") {
+                                projects.push(relation.title+" ("+relation.code+")");
+                            } else {
+                                projects.push(relation.title);
+                            }
+
+                            if(relation.hasOwnProperty("funding")) {
+                                let fundingLength = Array.isArray(relation['funding']) ? relation['funding'].length : 1;
+
+                                for(let z=0; z<fundingLength; z++) {
+                                    let fundingData = Array.isArray(relation['funding']) ? relation['funding'][z] : relation['funding'];
+
+                                    if(fundingData.hasOwnProperty("funder")) {
+                                        funder = fundingData['funder'].shortname;
+                                    }
+                                }
+                            }
+
+                        }
+                    }
+                }
+                result.push(this.quote(authors));
+                var year: string = "";
+                if(resData.hasOwnProperty("dateofacceptance")) {
+                    year = resData.dateofacceptance;
+                }
+                result.push(year);
+                var id:string = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+                result.push(this.quote(id));
+                result.push(funder);
+                result.push(this.quote(projects));
+            } else {
+                result.push(this.quote(''));
+                var year: string = "";
+                if(resData.hasOwnProperty("dateofacceptance")) {
+                    year = resData.dateofacceptance;
+                }
+                result.push(year);
+                var id:string = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+                result.push(this.quote(id));
+                result.push(funder);
+                result.push("");
+            }
+
+
+            //result.push(resData.embargoenddate);
+
+            if(resData['bestaccessright'].hasOwnProperty("classid")) {
+                result.push(this.quote(resData['bestaccessright'].classid));
+            } else {
+                result.push("");
+            }
+
+            results.push(result);
+        }
+
+        return results;
+    }
+*/
+    parseRefineResults(id: string, data: any): any {
+        var results:any = [];
+        if(data.hasOwnProperty("resulthostingdatasource")) {
+            let length = Array.isArray(data['resulthostingdatasource']) ? data['resulthostingdatasource'].length : 1;
+
+            for(let i=0; i<length; i++) {
+                let datasource = Array.isArray(data['resulthostingdatasource']) ? data['resulthostingdatasource'][i] : data['resulthostingdatasource'];
+
+                let result: {"name": string, "id": string, "count": number} = {"name": "", "id": "", "count": 0};
+                result['name'] = datasource.name;
+                result['id'] = datasource.id.split("||")[0];
+                //result['url'] = OpenaireProperties.getsearchLinkToDataProvider()+result['id'];
+                result['count'] = datasource.count;
+
+                if(result['id'] != id && result['name'] != "Unknown Repository") {
+                    results.push(result);
+                }
+            }
+        }
+        return results;
+    }
+
+    numOfPublications(url: string): any {
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  .map(res => res.total);
+    }
+
+    numOfEntityPublications(id: string, entity: string):any {
+        var parameters: string = "";
+        if(entity == "project") {
+          parameters = "projects/"+id+"/publications/count";
+        }
+        let url = OpenaireProperties.getSearchAPIURLLast()+parameters+"?format=json";
+        return this.numOfPublications(url);
+    }
+
+    numOfSearchPublications(params: string):any {
+        let url = OpenaireProperties.getSearchAPIURLLast()+"publications/count?format=json";
+        if(params != "") {
+          url += "&q=" + params;
+        }
+        return this.numOfPublications(url);
+    }
+/*
+    private quote(word: any): string {
+        return '"'+word+'"';
+    }
+*/
+}
diff --git a/services/searchSoftware.service.ts b/services/searchSoftware.service.ts
new file mode 100644
index 00000000..f33c81a1
--- /dev/null
+++ b/services/searchSoftware.service.ts
@@ -0,0 +1,343 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../utils/properties/openaireProperties';
+import {SearchResult}     from '../utils/entities/searchResult';
+import {RefineResultsUtils} from './servicesUtils/refineResults.class';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import { ParsingFunctions } from '../landingPages/landing-utils/parsingFunctions.class';
+
+@Injectable()
+export class SearchSoftwareService {
+    private sizeOfDescription: number = 270;
+    public parsingFunctions: ParsingFunctions = new ParsingFunctions();
+
+    constructor(private http: Http ) {}
+
+    searchSoftware (params: string, refineParams:string, page: number, size: number, refineFields:string[] ):any {
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"software";
+
+        let url = link+"?";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+ (page-1) +"&size="+size+"&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "software")]);
+    }
+    searchSoftwareById (id: string ):any {
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+"software/"+id+"?format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => this.parseResults(res));
+    }
+
+    searchAggregators (id: string, params: string, refineParams:string, page: number, size: number ):any {
+
+        let link = OpenaireProperties.getSearchAPIURLLast()+"software";
+
+        let url = link+"?"+"&format=json";
+        if(params!= null && params != ''  ) {
+            url += params;
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+(page-1)+"&size="+size;
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => this.parseRefineResults(id, res['refineResults']))
+    }
+
+    searchSoftwareByDois (DOIs: string[], refineParams:string, page: number, size: number, refineFields:string[] ):any {
+        let link = OpenaireProperties.getSearchAPIURLLast()+"software";
+        let url = link+"?";
+        var doisParams = "";
+
+        for(var i =0 ;i < DOIs.length; i++){
+          doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+        }
+        if(doisParams.length > 0){
+          url += "&"+doisParams;
+
+        }
+        if(refineParams!= null && refineParams != ''  ) {
+            url += refineParams;
+        }
+        url += "&page="+ (page-1) +"&size="+size+"&format=json";
+
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    //.do(res => console.info(res))
+                    .map(res => [res['meta'].total, this.parseResults(res['results']),RefineResultsUtils.parse(res['refineResults'],refineFields, "software")]);
+    }
+    advancedSearchSoftware (params: string, page: number, size: number ):any {
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      var basicQuery = "(oaftype exact result) and (resulttypeid exact software)  "
+      url += "?query=";
+      if(params!= null && params != ''  ) {
+        url +=" ( "+basicQuery+ " ) " +" and (" + params + ")";
+      }else{
+        url +=" ( "+basicQuery+ " ) ";
+      }
+
+      url += "&page="+(page-1)+"&size="+size;
+      url += "&format=json";
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+      .map(res => <any> res.json())
+      //.do(res => console.info(res))
+      .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+    searchSoftwareForEntity (params: string, page: number, size: number):any {
+        let link = OpenaireProperties.getSearchAPIURLLast();
+        let url = link+params+"/software"+"?format=json";
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+
+    searchSoftwareForDataproviders(params: string, page: number, size: number):any {
+        let link = OpenaireProperties.getSearchAPIURLLast();
+        let url = link+params+ "&page="+(page-1)+"&size="+size + "&format=json";
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json())
+                    .map(res => [res['meta'].total, this.parseResults(res['results'])]);
+    }
+
+    parseResults(data: any): SearchResult[] {
+        let results: SearchResult[] = [];
+
+        let length = Array.isArray(data) ? data.length : 1;
+
+        for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity']['oaf:result'] : data['result']['metadata']['oaf:entity']['oaf:result'];
+
+            var result: SearchResult = new SearchResult();
+            result.entityType = "software";
+            if(resData['language'] && resData['language'] != null) {
+              result.languages = new Array<string>();
+              result.types = new Array<string>();
+              let types = new Set<string>();
+
+              let counter = 0;
+              let instance;
+
+              let length = Array.isArray(resData['children']['instance']) ? resData['children']['instance'].length : 1;
+
+              for(let i=0; i<length; i++) {
+                instance = Array.isArray(resData['children']['instance']) ? resData['children']['instance'][i] : resData['children']['instance'];
+                this.parsingFunctions.parseTypes(result.types, types, instance);
+              }
+              if(!Array.isArray(resData['language'])) {
+                if(resData['language'].classname != "Undetermined" && resData['language'].classname) {
+                  result.languages.push(resData['language'].classname);
+                }
+              } else {
+                for(let i=0; i<resData['language'].length; i++) {
+                  if(resData['language'][i].classname != "Undetermined" && resData['language'][i].classname) {
+                    result.languages.push(resData['language'][i].classname);
+                  }
+                }
+              }
+            }
+            result['title'] = {"name": '', "accessMode": '', "sc39": ''};
+
+            if(Array.isArray(resData['title'])) {
+                result['title'].name = resData['title'][0].content;
+            } else {
+                result['title'].name = resData['title'].content;
+            }
+
+            //result['title'].url = OpenaireProperties.getsearchLinkToSoftware();
+            //result['title'].url += Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            result['id'] = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+            if(resData['bestaccessright'] && resData['bestaccessright'].hasOwnProperty("classid")) {
+                result['title'].accessMode = resData['bestaccessright'].classid;
+            }
+
+            if(resData['rels'].hasOwnProperty("rel")) {
+                let relLength = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'].length : 1;
+
+                for(let j=0; j<relLength; j++) {
+                    let relation = Array.isArray(resData['rels']['rel']) ? resData['rels']['rel'][j] : resData['rels']['rel'];
+
+                    if(relation.hasOwnProperty("to")) {
+                        /*if(relation['to'].class == "hasAuthor") {
+                          if(result['authors'] == undefined) {
+                            result['authors'] = new Array<{"name": string, "id": string}>();
+                          }
+
+                          result['authors'].push({"name": relation.fullname, "id": relation['to'].content});
+                        } else */if(relation['to'].class == "isProducedBy") {
+                          result['projects'] = this.parseProjects(result['projects'], relation);
+                        }
+                    }
+                }
+            }
+
+            if(resData.hasOwnProperty("creator") && resData['creator'] != null) {
+              if(result['authors'] == undefined) {
+                result['authors'] = new Array<string>();
+              }
+
+              let authors = resData['creator'];
+              let length = Array.isArray(authors) ? authors.length : 1;
+
+              for(let i=0; i<length; i++) {
+                let author = Array.isArray(authors) ? authors[i] : authors;
+                result.authors[author.rank-1] = author.content;
+              }
+              result.authors = result.authors.filter(function (item) {
+                return (item != undefined);
+              });
+            }
+
+            var date:string = (resData.dateofacceptance)+""; // transform to string in case it is an integer
+            result.year = (date && (date).indexOf('-') !== -1)?date.split('-')[0]:date;
+            if(!Array.isArray(resData.description)) {
+                result.description = resData.description;
+            } else {
+                result.description = resData.description[0];
+            }
+            if(result.description.length > this.sizeOfDescription) {
+                result.description = result.description.substring(0, this.sizeOfDescription)+"...";
+            }
+
+            result.embargoEndDate = resData.embargoenddate;
+
+            if(!Array.isArray(resData.publisher)) {
+                result.publisher = resData.publisher;
+            } else {
+                for(let i=0; i<resData.publisher.length; i++) {
+                    if(result.publisher != undefined){
+                        result.publisher += ', '+resData['publisher'][i];
+                    } else {
+                        result.publisher = resData['publisher'][i];
+                    }
+                }
+            }
+
+            results.push(result);
+        }
+
+        return results;
+    }
+
+    parseProjects(projects: { "id": string, "acronym": string, "title": string,
+                              "funderShortname": string, "funderName": string,
+                              "code": string }[], relation: any ) :  {
+                              "id": string, "acronym": string, "title": string,
+                              "funderShortname": string, "funderName": string,
+                              "code": string }[] {
+      if(projects == undefined) {
+          projects = new Array<
+              { "id": string, "acronym": string, "title": string,
+                "funderShortname": string, "funderName": string,
+                "code": string
+              }>();
+      }
+
+      let countProjects = projects.length;
+
+      projects[countProjects] = {
+          "id": "", "acronym": "", "title": "",
+          "funderShortname": "", "funderName": "",
+          "code": ""
+      }
+
+      if(relation.title != 'unidentified') {
+          projects[countProjects]['id'] =
+              /*OpenaireProperties.getsearchLinkToProject() + */relation['to'].content;
+          projects[countProjects]['acronym'] = relation.acronym;
+          projects[countProjects]['title'] = relation.title;
+          projects[countProjects]['code'] = relation.code;
+      } else {
+          projects[countProjects]['id'] = "";
+          projects[countProjects]['acronym'] = "";
+          projects[countProjects]['title'] = "";
+          projects[countProjects]['code'] = "";
+      }
+
+      if(relation.hasOwnProperty("funding")) {
+          let fundingLength = Array.isArray(relation['funding']) ? relation['funding'].length : 1;
+
+          for(let z=0; z<fundingLength; z++) {
+              let fundingData = Array.isArray(relation['funding']) ? relation['funding'][z] : relation['funding'];
+
+              if(fundingData.hasOwnProperty("funder")) {
+                  projects[countProjects]['funderShortname'] = fundingData['funder'].shortname;
+                  projects[countProjects]['funderName'] = fundingData['funder'].name;
+              }
+          }
+      }
+
+      return projects;
+    }
+
+    parseRefineResults(id: string, data: any): any {
+        var results:any = [];
+        if(data.hasOwnProperty("resulthostingdatasource")) {
+            let length = Array.isArray(data['resulthostingdatasource']) ? data['resulthostingdatasource'].length : 1;
+
+            for(let i=0; i<length; i++) {
+                let datasource = Array.isArray(data['resulthostingdatasource']) ? data['resulthostingdatasource'][i] : data['resulthostingdatasource'];
+
+                let result: {"name": string, "id": string, "count": number} = {"name": "", "id": "", "count": 0};
+                result['name'] = datasource.name;
+                result['id'] = datasource.id.split("||")[0];
+                //result['url'] = OpenaireProperties.getsearchLinkToDataProvider()+result['id'];
+                result['count'] = datasource.count;
+
+                if(result['id'] != id && result['name'] != "Unknown Repository") {
+                    results.push(result);
+                }
+            }
+        }
+        return results;
+    }
+
+    numOfSoftware(url: string):any {
+
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                  .map(res => <any> res.json())
+                  .map(res => res.total);
+    }
+
+    numOfEntitySoftware(id: string, entity: string):any {
+        var parameters = "";
+
+        if(entity == "project") {
+          parameters = "projects/"+id+"/software/count";
+        }
+
+        let url = OpenaireProperties.getSearchAPIURLLast()+parameters+"?format=json";
+        return this.numOfSoftware(url);
+    }
+
+    numOfSearchSoftware(params: string):any {
+        let url = OpenaireProperties.getSearchAPIURLLast()+"software/count?format=json";
+        if(params != "") {
+          url += "&q=" + params;
+        }
+        return this.numOfSoftware(url);
+    }
+}
diff --git a/services/servicesUtils/refineResults.class.ts b/services/servicesUtils/refineResults.class.ts
new file mode 100644
index 00000000..19cf28d1
--- /dev/null
+++ b/services/servicesUtils/refineResults.class.ts
@@ -0,0 +1,62 @@
+
+import { Filter, Value} from '../../searchPages/searchUtils/searchHelperClasses.class';
+import { SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+
+
+export class RefineResultsUtils {
+
+
+   public static parse (data, fields:string[], entityType:string):Filter[] {
+         // var data = this.json.refineReuslts;
+
+         var searchFields:SearchFields = new SearchFields();
+         var filters:Filter[] = [];
+         if(data){
+           for(let j=0; j<fields.length; j++) {
+
+             var filter:Filter = new Filter();
+             filter.title = searchFields.getFieldName(fields[j],entityType);
+             filter.filterId = fields[j];
+             filter.originalFilterId = fields[j];
+             let field = data[fields[j]];
+             if(field){
+               for(let i=0; i<field.length; i++) {
+                 var value:Value = new Value();
+                 value.name = field[i].name;
+                 value.name =this.removePartAfterCharacters(value,"||");
+                 value.number = field[i].count;
+                 value.id = field[i].id;
+                 if(RefineResultsUtils.includeValue(value)){
+                   filter.values.push(value);
+                 }
+
+
+             }
+             filters.push(filter);
+           }
+       }
+     }
+       return filters;
+   }
+   private static includeValue (field):boolean {
+     if( field.name == "unidentified"){
+       return false;
+
+     }
+     return true;
+   }
+   private static removePartAfterCharacters(field, characters):string {
+     if( field.name.indexOf(characters) !=-1){
+       return field.name.split(characters)[0];
+
+     }
+     return field.name;
+   }
+   public static inParenthesisThePartAfterCharacters(field, characters):string {
+     if( field.name.indexOf(characters) !=-1){
+       return field.name.split(characters)[0]+" ("+field.name.split(characters)[1]+")";
+
+     }
+     return field.name;
+   }
+  }
diff --git a/services/softwareService.module.ts b/services/softwareService.module.ts
new file mode 100644
index 00000000..55759bc5
--- /dev/null
+++ b/services/softwareService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {SearchSoftwareService} from './searchSoftware.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  SearchSoftwareService
+],
+  exports: [
+    ]
+})
+export class SoftwareServiceModule { }
diff --git a/shared/shared.module.ts b/shared/shared.module.ts
new file mode 100644
index 00000000..f0ce0d20
--- /dev/null
+++ b/shared/shared.module.ts
@@ -0,0 +1,45 @@
+import { NgModule, ModuleWithProviders } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule } from '@angular/router';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+
+
+const MODULES = [
+  // Do NOT include UniversalModule, HttpModule, or JsonpModule here
+  CommonModule,
+  RouterModule,
+  FormsModule,
+  ReactiveFormsModule
+];
+
+const PIPES = [
+  // put pipes here
+];
+
+const COMPONENTS = [
+  // put shared components here
+];
+
+
+
+@NgModule({
+  imports: [
+    ...MODULES
+  ],
+  declarations: [
+    ...PIPES,
+    ...COMPONENTS
+  ],
+  exports: [
+    ...MODULES,
+    ...PIPES,
+    ...COMPONENTS
+  ]
+})
+export class SharedModule {
+  static forRoot(): ModuleWithProviders {
+    return {
+      ngModule: SharedModule,
+    };
+  }
+}
diff --git a/sharedComponents/bottom.component.html b/sharedComponents/bottom.component.html
new file mode 100644
index 00000000..8f1e61c3
--- /dev/null
+++ b/sharedComponents/bottom.component.html
@@ -0,0 +1,79 @@
+
+
+<div class="custom-footer">
+<div class="uk-section-primary uk-section uk-section-small uk-padding-remove-bottom">
+  <div class="uk-container">
+     <div class="uk-grid-margin uk-grid" uk-grid="">
+        <div class="uk-width-expand@m uk-light uk-first-column">
+           <div class="uk-margin">
+
+
+           <div class="uk-child-width-auto uk-grid-small uk-grid" uk-grid="">
+             <div class="uk-first-column">
+                <a class="el-link uk-icon-link uk-icon" href="http://www.facebook.com/groups/openaire/" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="facebook" ratio="1"><path d="M11,10h2.6l0.4-3H11V5.3c0-0.9,0.2-1.5,1.5-1.5H14V1.1c-0.3,0-1-0.1-2.1-0.1C9.6,1,8,2.4,8,5v2H5.5v3H8v8h3V10z"></path></svg></a>
+             </div>
+             <div>
+                <a class="el-link uk-icon-link uk-icon" href="http://www.twitter.com/OpenAIRE_eu" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="twitter" ratio="1"><path d="M19,4.74 C18.339,5.029 17.626,5.229 16.881,5.32 C17.644,4.86 18.227,4.139 18.503,3.28 C17.79,3.7 17.001,4.009 16.159,4.17 C15.485,3.45 14.526,3 13.464,3 C11.423,3 9.771,4.66 9.771,6.7 C9.771,6.99 9.804,7.269 9.868,7.539 C6.795,7.38 4.076,5.919 2.254,3.679 C1.936,4.219 1.754,4.86 1.754,5.539 C1.754,6.82 2.405,7.95 3.397,8.61 C2.79,8.589 2.22,8.429 1.723,8.149 L1.723,8.189 C1.723,9.978 2.997,11.478 4.686,11.82 C4.376,11.899 4.049,11.939 3.713,11.939 C3.475,11.939 3.245,11.919 3.018,11.88 C3.49,13.349 4.852,14.419 6.469,14.449 C5.205,15.429 3.612,16.019 1.882,16.019 C1.583,16.019 1.29,16.009 1,15.969 C2.635,17.019 4.576,17.629 6.662,17.629 C13.454,17.629 17.17,12 17.17,7.129 C17.17,6.969 17.166,6.809 17.157,6.649 C17.879,6.129 18.504,5.478 19,4.74"></path></svg></a>
+             </div>
+             <div>
+                <a class="el-link uk-icon-link uk-icon" href="http://www.linkedin.com/groups/OpenAIRE-3893548" target="_blank"  ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="linkedin" ratio="1"><path d="M5.77,17.89 L5.77,7.17 L2.21,7.17 L2.21,17.89 L5.77,17.89 L5.77,17.89 Z M3.99,5.71 C5.23,5.71 6.01,4.89 6.01,3.86 C5.99,2.8 5.24,2 4.02,2 C2.8,2 2,2.8 2,3.85 C2,4.88 2.77,5.7 3.97,5.7 L3.99,5.7 L3.99,5.71 L3.99,5.71 Z"></path><path d="M7.75,17.89 L11.31,17.89 L11.31,11.9 C11.31,11.58 11.33,11.26 11.43,11.03 C11.69,10.39 12.27,9.73 13.26,9.73 C14.55,9.73 15.06,10.71 15.06,12.15 L15.06,17.89 L18.62,17.89 L18.62,11.74 C18.62,8.45 16.86,6.92 14.52,6.92 C12.6,6.92 11.75,7.99 11.28,8.73 L11.3,8.73 L11.3,7.17 L7.75,7.17 C7.79,8.17 7.75,17.89 7.75,17.89 L7.75,17.89 L7.75,17.89 Z"></path></svg></a>
+             </div>
+             <div>
+                <a class="el-link uk-icon-link uk-icon" href="http://www.slideshare.net/OpenAIRE_eu" target="_blank"  ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="social" ratio="1"><line fill="none" stroke="#000" stroke-width="1.1" x1="13.4" y1="14" x2="6.3" y2="10.7"></line><line fill="none" stroke="#000" stroke-width="1.1" x1="13.5" y1="5.5" x2="6.5" y2="8.8"></line><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="4.6" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="14.8" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="4.5" cy="9.8" r="2.3"></circle></svg></a>
+             </div>
+             <div>
+                <a class="el-link uk-icon-link uk-icon" href="http://vimeo.com/openaire" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="vimeo" ratio="1"><path d="M2.065,7.59C1.84,7.367,1.654,7.082,1.468,6.838c-0.332-0.42-0.137-0.411,0.274-0.772c1.026-0.91,2.004-1.896,3.127-2.688 c1.017-0.713,2.365-1.173,3.286-0.039c0.849,1.045,0.869,2.629,1.084,3.891c0.215,1.309,0.421,2.648,0.88,3.901 c0.127,0.352,0.37,1.018,0.81,1.074c0.567,0.078,1.145-0.917,1.408-1.289c0.684-0.987,1.611-2.317,1.494-3.587 c-0.115-1.349-1.572-1.095-2.482-0.773c0.146-1.514,1.555-3.216,2.912-3.792c1.439-0.597,3.579-0.587,4.302,1.036 c0.772,1.759,0.078,3.802-0.763,5.396c-0.918,1.731-2.1,3.333-3.363,4.829c-1.114,1.329-2.432,2.787-4.093,3.422 c-1.897,0.723-3.021-0.686-3.667-2.318c-0.705-1.777-1.056-3.771-1.565-5.621C4.898,8.726,4.644,7.836,4.136,7.191 C3.473,6.358,2.72,7.141,2.065,7.59C1.977,7.502,2.115,7.551,2.065,7.59L2.065,7.59z"></path></svg></a>
+             </div>
+          </div>
+
+           </div>
+           <div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-left">
+              <img src="assets/common/ec_logo_inv_small.png" class="el-image" alt="European Commission">
+           </div>
+        </div>
+        <div class="uk-width-expand@m uk-light">
+           <div>
+              <ul class="uk-subnav uk-margin-remove-bottom uk-subnav-divider" uk-margin="">
+                 <li class="el-item uk-first-column">
+                    <a target="_blank" href="https://beta.openaire.eu/project-factsheets">About</a>
+                 </li>
+                 <li class="el-item">
+                    <a target="_blank" >Services</a>
+                 </li>
+                 <li class="el-item">
+                    <a target="_blank" href="https://beta.openaire.eu/news-events/">News</a>
+                 </li>
+                 <li class="el-item">
+                    <a target="_blank" href="https://beta.openaire.eu/news-events/">Events</a>
+                 </li>
+                 <li class="el-item">
+                    <a target="_blank" href="https://blogs.openaire.eu/">Blog</a>
+                 </li>
+                 <li class="el-item">
+                    <a target="_blank" href="https://beta.openaire.eu/contact-us">Contact us</a>
+                 </li>
+              </ul>
+           </div>
+        </div>
+     </div>
+  </div>
+</div>
+<div class="uk-section-primary uk-section uk-section-small">
+  <div class="uk-container">
+     <div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
+        <div class="uk-width-1-1@m uk-first-column">
+           <div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-center">
+              <img src="assets/common/Logo_Horizontal_white_small.png" class="el-image" alt="OpenAIRE">
+           </div>
+           <div class="footer-license uk-margin uk-margin-remove-bottom uk-text-center uk-text-lead">
+              <div><a href="http://creativecommons.org/licenses/by/4.0/" rel="license"><img src="assets/common/80x15.png" alt="Creative" style="height: auto; max-width: 100%; vertical-align: middle;"></a>&nbsp;UNLESS OTHERWISE INDICATED, ALL MATERIALS CREATED BY THE OPENAIRE CONSORTIUM ARE LICENSED UNDER A&nbsp;<a href="http://creativecommons.org/licenses/by/4.0/" rel="license">CREATIVE COMMONS ATTRIBUTION 4.0 INTERNATIONAL LICENSE</a>.</div>
+              <div>OPENAIRE IS POWERED BY&nbsp;<a href="http://www.d-net.research-infrastructures.eu/">D-NET</a>.</div>
+           </div>
+           <div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-right">
+              <a href="#" uk-totop="" uk-scroll="" class="uk-totop uk-icon"></a>
+           </div>
+        </div>
+     </div>
+  </div>
+</div>
+</div>
diff --git a/sharedComponents/bottom.component.ts b/sharedComponents/bottom.component.ts
new file mode 100644
index 00000000..3ae13c03
--- /dev/null
+++ b/sharedComponents/bottom.component.ts
@@ -0,0 +1,10 @@
+import { Component } from '@angular/core';
+import 'rxjs/Rx';
+
+@Component({
+  selector: 'bottom',
+  templateUrl: 'bottom.component.html' 
+})
+export class BottomComponent {
+
+}
diff --git a/sharedComponents/cookie-law/cookie-law.component.ts b/sharedComponents/cookie-law/cookie-law.component.ts
new file mode 100644
index 00000000..3a72e7d0
--- /dev/null
+++ b/sharedComponents/cookie-law/cookie-law.component.ts
@@ -0,0 +1,148 @@
+/**
+ * angular2-cookie-law
+ *
+ * Copyright 2016-2017, @andreasonny83, All rights reserved.
+ *
+ * @author: @andreasonny83 <andreasonny83@gmail.com>
+ */
+
+import {
+  Component,
+  OnInit,
+  ViewEncapsulation,
+  HostBinding,
+  Input,
+  Output,
+  EventEmitter,
+  animate,
+  state,
+  trigger,
+  style,
+  transition,
+  AnimationTransitionEvent,
+} from '@angular/core';
+
+import {
+  DomSanitizer,
+  SafeHtml,
+} from '@angular/platform-browser';
+
+import {
+  CookieLawService,
+} from './cookie-law.service';
+
+// import {
+//   closeIcon,
+// } from './icons';
+
+export type CookieLawPosition = 'top' | 'bottom';
+export type CookieLawAnimation = 'topIn' | 'bottomIn' | 'topOut' | 'bottomOut';
+export type CookieLawTarget = '_blank' | '_self';
+
+@Component({
+  selector: 'cookie-law',
+  // encapsulation: ViewEncapsulation.None,
+  animations: [
+    trigger('state', [
+      state('bottomOut', style({ transform: 'translateY(100%)' })),
+      state('topOut', style({ transform: 'translateY(-100%)' })),
+      state('*', style({ transform: 'translateY(0)' })),
+
+      transition('void => topIn', [
+        style({ transform: 'translateY(-100%)' }),
+        animate('1000ms ease-in-out'),
+      ]),
+
+      transition('void => bottomIn', [
+        style({ transform: 'translateY(100%)' }),
+        animate('1000ms ease-in-out'),
+      ]),
+
+      transition('* => *', animate('1000ms ease-out')),
+    ])
+  ],
+  styleUrls: [ './cookie-law.css' ],
+  templateUrl: './cookie-law.html',
+})
+export class CookieLawComponent implements OnInit {
+  public cookieLawSeen: boolean;
+
+  @Input('learnMore')
+  get learnMore() { return this._learnMore; }
+  set learnMore(value: string) {
+    this._learnMore = (value !== null && `${value}` !== 'false') ? value : null;
+  }
+
+  @Input('target')
+  get target() { return this._target; }
+  set target(value: CookieLawTarget) {
+    this._target = (value !== null && `${value}` !== 'false' &&
+                      (`${value}` === '_blank' || `${value}` === '_self')
+                     ) ? value : '_blank';
+  }
+
+  @Input('position')
+  get position() { return this._position; }
+  set position(value: CookieLawPosition) {
+    this._position = (value !== null && `${value}` !== 'false' &&
+                      (`${value}` === 'top' || `${value}` === 'bottom')
+                     ) ? value : 'bottom';
+  }
+
+  @Output('isSeen')
+  private isSeenEvt: EventEmitter<boolean>;
+
+  @HostBinding('attr.seen')
+  public isSeen: boolean;
+
+  private animation: CookieLawAnimation;
+  private closeSvg: SafeHtml;
+  private currentStyles: {};
+  private _learnMore: string;
+  private _target: CookieLawTarget;
+  private _position: CookieLawPosition;
+
+  constructor(
+    private _service: CookieLawService,
+    private domSanitizer: DomSanitizer,
+  ) {
+    this.isSeenEvt = new EventEmitter<boolean>();
+    this.animation = 'topIn';
+    this._position = 'bottom';
+    this.cookieLawSeen = this._service.seen();
+  }
+
+  ngOnInit(): void {
+    if (typeof document !== 'undefined') {
+      this.animation = this.position === 'bottom' ? 'bottomIn' : 'topIn';
+
+      this.closeSvg = '<span class="clickable uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg></span> ' ;
+
+      if (this.cookieLawSeen) {
+        this.isSeen = true;
+      }
+
+      this.currentStyles = {
+        'top': this.position === 'top' ? '0' : null,
+        'bottom': this.position === 'top' ? 'initial' : null,
+      };
+    }
+  }
+
+  afterDismissAnimation(evt: AnimationTransitionEvent) {
+    if (evt.toState === 'topOut' ||
+        evt.toState === 'bottomOut') {
+      this.isSeen = true;
+      this.isSeenEvt.emit(this.isSeen);
+    }
+  }
+
+  public dismiss(evt?: MouseEvent): void {
+    if (evt) {
+      evt.preventDefault();
+    }
+
+    this._service.storeCookie();
+    this.animation = this.position === 'top' ? 'topOut' : 'bottomOut';
+  }
+}
diff --git a/sharedComponents/cookie-law/cookie-law.css b/sharedComponents/cookie-law/cookie-law.css
new file mode 100644
index 00000000..17e09689
--- /dev/null
+++ b/sharedComponents/cookie-law/cookie-law.css
@@ -0,0 +1,77 @@
+.cookie-law-wrapper a {
+  color: #bbb;
+  -webkit-transition: color .2s;
+  transition: color .2s;
+}
+.cookie-law-wrapper a:hover {
+  color: #fff;
+}
+.cookie-law-wrapper a:hover svg {
+  fill: #fff;
+}
+.cookie-law-wrapper {
+  background: #333;
+  color: #bbb;
+  display: block;
+  /*font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
+  font-size: 15px;
+  font-weight: 200;
+  line-height: 20px;*/
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  z-index: 999999999;
+  font-smooth: always;
+  -webkit-font-smoothing: antialiased;
+  text-align: center;
+}
+.dismiss {
+  display: block;
+  box-sizing: border-box;
+  padding: 10px;
+  position: absolute;
+  top: 0;
+  right: 10px;
+  text-decoration: none;
+  line-height: 20px;
+}
+.dismiss svg {
+  display: block;
+  fill: #bbb;
+  width: 20px;
+  height: 20px;
+  -webkit-transition: fill .2s;
+  transition: fill .2s;
+}
+.copy {
+  box-sizing: border-box;
+  padding: 10px 60px 10px 10px;
+}
+.copy span {
+  color: #fff;
+  /*font-weight: 400;*/
+}
+.copy a {
+  text-decoration: underline;
+}
+.copy a:active, .copy a:hover {
+    outline: 0;
+}
+
+@media (min-width: 600px) {
+  /* For bigger devices: */
+  .copy {
+    padding: 20px 60px 20px 20px;
+    /*font-size: 18px;
+    line-height: 24px;*/
+  }
+  .dismiss {
+    top: 10px;
+    right: 15px;
+  }
+  .dismiss svg {
+    width: 24px;
+    height: 24px;
+  }
+}
diff --git a/sharedComponents/cookie-law/cookie-law.html b/sharedComponents/cookie-law/cookie-law.html
new file mode 100644
index 00000000..ccccbba4
--- /dev/null
+++ b/sharedComponents/cookie-law/cookie-law.html
@@ -0,0 +1,23 @@
+<div class="cookie-law-wrapper"
+    [ngStyle]="currentStyles"
+    *ngIf="!cookieLawSeen"
+    [@state]="animation"
+    (@state.done)="afterDismissAnimation($event)">
+
+  <div class="copy">
+    <span #ref><ng-content></ng-content></span>
+
+  <span *ngIf="ref.childNodes.length == 0">
+    By continuing to browse the site, you're agreeing to our use of cookies.
+    <span *ngIf="learnMore">
+      Learn more in our <a [href]="learnMore" [target]="target">privacy policy</a>.
+    </span>
+  </span>
+
+  <a href="#" role="button"
+              class="dismiss"
+
+              (click)="dismiss($event)"><span class="clickable uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span></a>
+</div>
diff --git a/sharedComponents/cookie-law/cookie-law.module.ts b/sharedComponents/cookie-law/cookie-law.module.ts
new file mode 100644
index 00000000..cd5ae1f4
--- /dev/null
+++ b/sharedComponents/cookie-law/cookie-law.module.ts
@@ -0,0 +1,25 @@
+/**
+ * angular2-cookie-law
+ *
+ * Copyright 2016-2017, @andreasonny83, All rights reserved.
+ *
+ * @author: @andreasonny83 <andreasonny83@gmail.com>
+ */
+
+import { NgModule }           from '@angular/core';
+import { CommonModule }       from '@angular/common';
+import { CookieLawComponent } from './cookie-law.component';
+import { CookieLawService }   from './cookie-law.service';
+
+@NgModule({
+  imports: [ CommonModule ],
+  declarations: [ CookieLawComponent ],
+  providers: [ CookieLawService ],
+  exports: [ CookieLawComponent ]
+})
+export class CookieLawModule { }
+
+export {
+  CookieLawComponent,
+  CookieLawService
+};
diff --git a/sharedComponents/cookie-law/cookie-law.service.ts b/sharedComponents/cookie-law/cookie-law.service.ts
new file mode 100644
index 00000000..360e7b78
--- /dev/null
+++ b/sharedComponents/cookie-law/cookie-law.service.ts
@@ -0,0 +1,57 @@
+/**
+ * angular2-cookie-law
+ *
+ * Copyright 2016-2017, @andreasonny83, All rights reserved.
+ *
+ * @author: @andreasonny83 <andreasonny83@gmail.com>
+ */
+
+import { Injectable } from '@angular/core';
+
+@Injectable()
+export class CookieLawService {
+
+
+  seen(): boolean {
+    return this.cookieExists('cookieLawSeen');
+  }
+
+  storeCookie(): void {
+    return this.setCookie('cookieLawSeen');
+  }
+
+  /**
+   * try to read a saved cookie
+   *
+   * @param  {string} name [the cookie name]
+   *
+   * @return {string}      [the cookie's value]
+   */
+  private cookieExists(name: string): boolean {
+    if (typeof document !== 'undefined') {
+      let ca: Array<string> = document.cookie.split(';');
+      let caLen: number = ca.length;
+      let cookieName = name + '=';
+      let c: string;
+
+      for (let i: number = 0; i < caLen; i += 1) {
+        c = ca[i].replace(/^\s\+/g, '');
+        if (c.indexOf(cookieName) !== -1) {
+          return true;
+        }
+      }
+  }
+    return false;
+  }
+
+  /**
+   * store a new cookie in the browser
+   *
+   * @param {string} name [the name for the cookie]
+   */
+  private setCookie(name: string): void {
+    if (typeof document !== 'undefined') {
+      document.cookie = encodeURIComponent(name) + '=true; path=/';
+    }
+  }
+}
diff --git a/sharedComponents/cookie-law/icons.ts b/sharedComponents/cookie-law/icons.ts
new file mode 100644
index 00000000..987dd766
--- /dev/null
+++ b/sharedComponents/cookie-law/icons.ts
@@ -0,0 +1,13 @@
+/**
+ * angular2-cookie-law
+ *
+ * Copyright 2016-2017, @andreasonny83, All rights reserved.
+ *
+ * @author: @andreasonny83 <andreasonny83@gmail.com>
+ */
+
+export const closeIcon: string = `
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+    <path d="M377.047 184.198q0 8.26-6.037 14.297L313.505 256l57.505 57.505q6.037 6.037 6.037 14.297 0 8.578-6.037 14.615l-28.593 28.593q-6.037 6.037-14.615 6.037-8.26 0-14.297-6.037L256 313.505l-57.505 57.505q-6.037 6.037-14.297 6.037-8.578 0-14.615-6.037l-28.593-28.593q-6.037-6.037-6.037-14.615 0-8.26 6.037-14.297L198.495 256l-57.505-57.505q-6.037-6.037-6.037-14.297 0-8.578 6.037-14.615l28.593-28.593q6.037-6.037 14.615-6.037 8.26 0 14.297 6.037L256 198.495l57.505-57.505q6.037-6.037 14.297-6.037 8.578 0 14.615 6.037l28.593 28.593q6.037 6.037 6.037 14.615zM500 256q0-66.401-32.724-122.477-32.724-56.075-88.799-88.799Q322.401 12 256 12q-66.401 0-122.477 32.724-56.075 32.724-88.799 88.799Q12 189.599 12 256q0 66.401 32.724 122.477 32.724 56.075 88.799 88.799Q189.599 500 256 500q66.401 0 122.477-32.724 56.075-32.724 88.799-88.799Q500 322.401 500 256z"></path>
+  </svg>
+`;
diff --git a/sharedComponents/feedback/feedback.component.ts b/sharedComponents/feedback/feedback.component.ts
new file mode 100644
index 00000000..7a246ad6
--- /dev/null
+++ b/sharedComponents/feedback/feedback.component.ts
@@ -0,0 +1,51 @@
+
+import { Component } from '@angular/core';
+import {ActivatedRoute} from '@angular/router';
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+import {StringUtils} from '../../utils/string-utils.class';
+
+@Component({
+  selector: 'feedback',
+  template: `
+  <div id="feedback" class="uk-tooltip" (click) = "initialize()">
+  	<a [href]="'mailto:' + feedbackmail +'?Subject=' + subject + '&body=' + body" target="_top" type="button" class="btn btn-info btn-lg">
+  		<img src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI5LjI5OXB4IiBoZWlnaHQ9IjUwLjYyNXB4IiB2aWV3Qm94PSIwIDAgOS4yOTkgNTAuNjI1IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA5LjI5OSA1MC42MjUiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0zLjUxNiw0Ni44N3YxLjYzNWg1LjY2N3YwLjk3NEgzLjUxNnYxLjE0N2gtMC40NGwtMC4zNTItMS4xNDdIMi4zNjdDMC43ODksNDkuNDc4LDAsNDguNzg4LDAsNDcuNDA5YzAtMC4zNCwwLjA2OC0wLjczOCwwLjIwNS0xLjE5NWwwLjc3OSwwLjI1MmMtMC4xMjEsMC4zNzUtMC4xODIsMC42OTUtMC4xODIsMC45NjFjMCwwLjM2NywwLjEyMiwwLjY0LDAuMzY2LDAuODE0YzAuMjQ0LDAuMTc2LDAuNjM2LDAuMjY0LDEuMTc1LDAuMjY0SDIuNzZWNDYuODdIMy41MTZ6Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTkuMjk5LDQyLjk4NWMwLDAuOTQ5LTAuMjg5LDEuNjk3LTAuODY2LDIuMjQ2Yy0wLjU3OCwwLjU0OS0xLjM4MiwwLjgyNC0yLjQwOCwwLjgyNGMtMS4wMzYsMC0xLjg1Ny0wLjI1Ni0yLjQ2Ny0wLjc2NmMtMC42MS0wLjUxMS0wLjkxNC0xLjE5My0wLjkxNC0yLjA1NGMwLTAuODA1LDAuMjY1LTEuNDQsMC43OTQtMS45MDljMC41MjktMC40NywxLjIyOC0wLjcwMywyLjA5NS0wLjcwM2gwLjYxNXY0LjQyNGMwLjc1NC0wLjAyMSwxLjMyNi0wLjIxMSwxLjcxNy0wLjU3MlM4LjQ1LDQzLjYwNiw4LjQ1LDQyLjk1YzAtMC42OTEtMC4xNDUtMS4zNzUtMC40MzQtMi4wNTFoMC44NjZjMC4xNDgsMC4zNDQsMC4yNTUsMC42NjgsMC4zMTksMC45NzVDOS4yNjcsNDIuMTgxLDkuMjk5LDQyLjU1MSw5LjI5OSw0Mi45ODV6IE0zLjQ1Nyw0My4yNDljMCwwLjUxNywwLjE2OCwwLjkyNiwwLjUwNCwxLjIzMnMwLjgwMSwwLjQ4OCwxLjM5NiwwLjU0M3YtMy4zNTdjLTAuNjEzLDAtMS4wODMsMC4xMzgtMS40MSwwLjQxQzMuNjIxLDQyLjM1LDMuNDU3LDQyLjc0MSwzLjQ1Nyw0My4yNDl6Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTkuMjk5LDM2LjI1MmMwLDAuOTQ5LTAuMjg5LDEuNjk3LTAuODY2LDIuMjQ2Yy0wLjU3OCwwLjU0OS0xLjM4MiwwLjgyNC0yLjQwOCwwLjgyNGMtMS4wMzYsMC0xLjg1Ny0wLjI1Ni0yLjQ2Ny0wLjc2NmMtMC42MS0wLjUxLTAuOTE0LTEuMTkzLTAuOTE0LTIuMDUzYzAtMC44MDUsMC4yNjUtMS40NDEsMC43OTQtMS45MXMxLjIyOC0wLjcwMywyLjA5NS0wLjcwM2gwLjYxNXY0LjQyNGMwLjc1NC0wLjAyLDEuMzI2LTAuMjExLDEuNzE3LTAuNTcyczAuNTg2LTAuODY5LDAuNTg2LTEuNTI1YzAtMC42OTEtMC4xNDUtMS4zNzUtMC40MzQtMi4wNTFoMC44NjZjMC4xNDgsMC4zNDQsMC4yNTUsMC42NjgsMC4zMTksMC45NzZTOS4yOTksMzUuODE5LDkuMjk5LDM2LjI1MnogTTMuNDU3LDM2LjUxNmMwLDAuNTE2LDAuMTY4LDAuOTI2LDAuNTA0LDEuMjMyYzAuMzM2LDAuMzA4LDAuODAxLDAuNDg4LDEuMzk2LDAuNTQzdi0zLjM1N2MtMC42MTMsMC0xLjA4MywwLjEzNy0xLjQxLDAuNDFDMy42MjEsMzUuNjE4LDMuNDU3LDM2LjAwOCwzLjQ1NywzNi41MTZ6Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTguMzE5LDI3Ljg2MnYwLjA1M2MwLjY1MiwwLjQ0OSwwLjk3OSwxLjEyMSwwLjk3OSwyLjAxN2MwLDAuODQtMC4yODYsMS40OTMtMC44NiwxLjk2UzcuMDQ3LDMyLjU5LDUuOTg5LDMyLjU5Yy0xLjA1OCwwLTEuODgxLTAuMjMzLTIuNDY3LTAuNzAyYy0wLjU4Ni0wLjQ3LTAuODc5LTEuMTIxLTAuODc5LTEuOTU3YzAtMC44NzEsMC4zMTYtMS41MzksMC45NDktMi4wMDVWMjcuODVsLTAuNDYzLDAuMDQxbC0wLjQ1MSwwLjAyM0gwLjA2NHYtMC45NzRoOS4xMTd2MC43OTFMOC4zMTksMjcuODYyeiBNOC40ODMsMjkuODA3YzAtMC42NjQtMC4xOC0xLjE0Ni0wLjU0MS0xLjQ0NHMtMC45NDQtMC40NDgtMS43NS0wLjQ0OEg1Ljk4N2MtMC45MDksMC0xLjU1OSwwLjE1MS0xLjk0NywwLjQ1NWMtMC4zODgsMC4zMDMtMC41ODMsMC43ODUtMC41ODMsMS40NDljMCwwLjU3LDAuMjIyLDEuMDA4LDAuNjY1LDEuMzExUzUuMTksMzEuNTgzLDYsMzEuNTgzYzAuODE5LDAsMS40MzgtMC4xNDksMS44NTYtMC40NTFDOC4yNzQsMzAuODMxLDguNDgzLDMwLjM4OSw4LjQ4MywyOS44MDd6Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTIuNjU0LDIxLjg5MWMwLTAuODQ0LDAuMjg4LTEuNDk5LDAuODY0LTEuOTY2YzAuNTc2LTAuNDY3LDEuMzkyLTAuNywyLjQ0Ni0wLjdjMS4wNTUsMCwxLjg3NCwwLjIzNSwyLjQ1OCwwLjcwNmMwLjU4NCwwLjQ3MSwwLjg3NiwxLjEyNCwwLjg3NiwxLjk2YzAsMC40MTgtMC4wNzYsMC44LTAuMjMsMS4xNDZjLTAuMTU0LDAuMzQ2LTAuMzkzLDAuNjM2LTAuNzEzLDAuODd2MC4wN2wwLjgyNiwwLjIwNXYwLjY5N0gwLjA2NHYtMC45NzNoMi4yMTVjMC40OTYsMCwwLjk0MSwwLjAxNiwxLjMzNiwwLjA0N3YtMC4wNDdDMi45NzUsMjMuNDU0LDIuNjU0LDIyLjc4MiwyLjY1NCwyMS44OTF6IE0zLjQ2OSwyMi4wMzJjMCwwLjY2NCwwLjE5LDEuMTQzLDAuNTcxLDEuNDM2czEuMDIyLDAuNDM5LDEuOTI1LDAuNDM5YzAuOTAzLDAsMS41NDgtMC4xNSwxLjkzNy0wLjQ1MWMwLjM5LTAuMzAxLDAuNTg0LTAuNzgzLDAuNTg0LTEuNDQ3YzAtMC41OTgtMC4yMTktMS4wNDMtMC42NTMtMS4zMzZzLTEuMDYyLTAuNDM5LTEuODc4LTAuNDM5Yy0wLjgzNiwwLTEuNDU5LDAuMTQ2LTEuODY5LDAuNDM5UzMuNDY5LDIxLjQxOCwzLjQ2OSwyMi4wMzJ6Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTkuMTgzLDEzLjU3N0w4LjI2OSwxMy43N3YwLjA0N2MwLjQwMSwwLjMyLDAuNjc0LDAuNjQsMC44MTYsMC45NThzMC4yMTQsMC43MTYsMC4yMTQsMS4xOTJjMCwwLjYzNy0wLjE2NCwxLjEzNi0wLjQ5MSwxLjQ5N2MtMC4zMjgsMC4zNjEtMC43OTUsMC41NDItMS40LDAuNTQyYy0xLjI5NywwLTEuOTc3LTEuMDM3LTIuMDM5LTMuMTExbC0wLjAzNS0xLjA5SDQuOTM0Yy0wLjUwNCwwLTAuODc2LDAuMTA4LTEuMTE2LDAuMzI1Yy0wLjI0LDAuMjE3LTAuMzYsMC41NjMtMC4zNiwxLjA0YzAsMC41MzUsMC4xNjQsMS4xNDEsMC40OTIsMS44MTZsLTAuNzQ0LDAuMjk5Yy0wLjE3Mi0wLjMxNi0wLjMwNy0wLjY2My0wLjQwNC0xLjA0Yy0wLjA5Ny0wLjM3Ny0wLjE0Ni0wLjc1NS0wLjE0Ni0xLjEzNGMwLTAuNzY2LDAuMTctMS4zMzMsMC41MS0xLjcwMmMwLjM0LTAuMzY5LDAuODg1LTAuNTU0LDEuNjM1LTAuNTU0aDQuMzg0djAuNzIySDkuMTgzeiBNOC40OTYsMTUuNzc0YzAtMC42MDUtMC4xNjYtMS4wODEtMC40OTgtMS40MjdjLTAuMzMyLTAuMzQ2LTAuNzk3LTAuNTE5LTEuMzk2LTAuNTE5aC0wLjU4bDAuMDQxLDAuOTczYzAuMDI3LDAuNzczLDAuMTQ3LDEuMzMxLDAuMzYsMS42NzNjMC4yMTQsMC4zNDIsMC41NDQsMC41MTMsMC45OTMsMC41MTNjMC4zNTIsMCwwLjYxOS0wLjEwNiwwLjgwMy0wLjMxOVM4LjQ5NiwxNi4xNTcsOC40OTYsMTUuNzc0eiIvPjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik05LjI5OSw4LjI4NWMwLDAuOTMtMC4yODYsMS42NDktMC44NTgsMi4xNTljLTAuNTcxLDAuNTEtMS4zODEsMC43NjUtMi40MjgsMC43NjVjLTEuMDc1LDAtMS45MDUtMC4yNTktMi40OTEtMC43NzZTMi42NDMsOS4xNzgsMi42NDMsOC4yMjFjMC0wLjMwOSwwLjAzMy0wLjYxNywwLjEtMC45MjZDMi44MSw2Ljk4NiwyLjg4OCw2Ljc0NCwyLjk3Nyw2LjU2OGwwLjgyNiwwLjI5OUMzLjcxNyw3LjA4MiwzLjY0Niw3LjMxNiwzLjU4OSw3LjU3QzMuNTMyLDcuODI0LDMuNTA0LDguMDQ5LDMuNTA0LDguMjQ0YzAsMS4zMDUsMC44MzIsMS45NTcsMi40OTYsMS45NTdjMC43ODksMCwxLjM5Ni0wLjE1OSwxLjgxNS0wLjQ3OGMwLjQyMi0wLjMxOSwwLjYzNC0wLjc5LDAuNjM0LTEuNDE1YzAtMC41MzUtMC4xMTUtMS4wODQtMC4zNDctMS42NDZoMC44NjFDOS4xODgsNy4wOTIsOS4yOTksNy42MzMsOS4yOTksOC4yODV6Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTUuODk2LDQuMTc4QzUuNjU2LDQuMDEsNS4zNDQsMy43NTQsNC45NTcsMy40MUwyLjc2LDEuMzM2VjAuMTgybDIuNzM2LDIuNjAyTDkuMTgzLDB2MS4xNzhMNi4xNDYsMy40NDVsMC42MzMsMC43MzJoMi40MDJ2MC45NjFIMC4wNjR2LTAuOTZoNC44MzRjMC4yMTUsMCwwLjU0NiwwLjAxNiwwLjk5NiwwLjA0N1Y0LjE3OEg1Ljg5NnoiLz48L2c+PC9zdmc+" alt="Feedback" title="Feedback Button" height="70px">
+  	</a>
+  </div>
+
+
+`
+})
+export class FeedbackComponent {
+  public feedbackmail:string = "someone@example.com";
+  public subject:string = "[Feedback - OpenAIRE Explore]";
+  public body:string = "Send from page";
+
+  sub:any;
+  constructor(private  route: ActivatedRoute) {}
+
+  ngOnInit() {
+    this.feedbackmail = OpenaireProperties.getFeedbackMail();
+    this.initialize();
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.initialize();
+    });
+  }
+  ngOnDestroy(){
+    this.sub.unsubscribe();
+  }
+  initialize(){
+    var referrer = null;
+    if (typeof location !== 'undefined') {
+        referrer = location.href;
+       }
+
+    this.body = "[Please write your message here] \n\n\nOpenAIRE Explore \nSent from "+((referrer)?referrer:" [referrer not available]")+ "  \n(please don't delete this part of the message)";
+    this.body = StringUtils.URIEncode(this.body);
+    // this.subject = StringUtils.URIEncode(this.subject);
+
+  }
+
+
+
+}
diff --git a/sharedComponents/navigationBar.component.html b/sharedComponents/navigationBar.component.html
new file mode 100644
index 00000000..472eefe3
--- /dev/null
+++ b/sharedComponents/navigationBar.component.html
@@ -0,0 +1,205 @@
+<div class="tm-header-mobile uk-hidden@m">
+   <nav class="uk-navbar-container uk-navbar" uk-navbar="">
+      <div class="uk-navbar-left">
+         <a class="uk-navbar-toggle" href="#tm-mobile" uk-toggle="" style="z-index:1000;">
+            <div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon custom-navbar-toggle-icon"> </div>
+         </a>
+      </div>
+      <div class="uk-navbar-center">
+         <a class="uk-navbar-item uk-logo"  routerLinkActive="uk-link" routerLink="/" >
+         <img src="assets/OA EXPLORE_B.png" alt="OpenAIRE" class="uk-responsive-height">        </a>
+      </div>
+      <!--div class="uk-navbar-right uk-margin-xlarge-top">
+         <user-mini></user-mini>
+      </div-->
+   </nav>
+   <div id="tm-mobile" uk-offcanvas="" mode="slide" overlay="" class="uk-offcanvas">
+      <div class="uk-offcanvas-bar">
+         <button class="uk-offcanvas-close uk-close uk-icon" type="button" uk-close=""></button>
+         <div class="uk-child-width-1-1 uk-grid" uk-grid="">
+            <div>
+               <div  *ngIf= "isClient" class="uk-panel" id="module-0">
+                  <ul class="uk-nav uk-nav-default">
+                     <li class="uk-nav-header uk-parent">
+                        <a routerLinkActive="uk-link" routerLink="/search/find"  class="uk-offcanvas-close custom-offcanvas-close">Search</a>
+                        <ul class="uk-nav-sub">
+                           <li *ngIf="showPublications"><a routerLinkActive="uk-link" routerLink="/search/find/publications"   class="uk-offcanvas-close custom-offcanvas-close">Publications</a></li>
+                           <li *ngIf="showDatasets"><a routerLinkActive="uk-link" routerLink="/search/find/datasets"  class="uk-offcanvas-close custom-offcanvas-close">Research Data</a></li>
+                           <li *ngIf="showSoftware"><a routerLinkActive="uk-link" routerLink="/search/find/software"  class="uk-offcanvas-close custom-offcanvas-close">Software</a></li>
+                           <li *ngIf="showProjects"><a routerLinkActive="uk-link" routerLink="/search/find/projects"  class="uk-offcanvas-close custom-offcanvas-close">Projects</a></li>
+                           <li *ngIf="showDataProviders"><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders"  class="uk-offcanvas-close custom-offcanvas-close">Content Providers</a></li>
+                           <li *ngIf="showOrganizations"><a routerLinkActive="uk-link" routerLink="/search/find/organizations"  class="uk-offcanvas-close custom-offcanvas-close">Organizations</a></li>
+                        </ul>
+                     </li>
+
+                     <li *ngIf="showDepositDatasets||showDepositPublications"class="uk-nav-header uk-parent">
+                         Share
+                         <ul class="uk-nav-sub">
+                           <li  *ngIf="showDepositPublications" ><a  routerLinkActive="uk-link" routerLink="/participate/deposit-publications"  class="uk-offcanvas-close custom-offcanvas-close" >Publications</a></li>
+                           <li  *ngIf="showDepositDatasets"><a   routerLinkActive="uk-link" routerLink="/participate/deposit-datasets"  class="uk-offcanvas-close custom-offcanvas-close" >Research Data</a></li>
+                        </ul>
+                     </li>
+                     <li *ngIf="showLinking" class="uk-nav-header uk-parent">
+                         <a  routerLinkActive="uk-link" routerLink="/participate/claim"  class="" aria-expanded="false">Link</a>
+                         <!--ul class="uk-nav-sub">
+                           <li><a  routerLinkActive="uk-link" routerLink="/participate/claim"  class="uk-offcanvas-close custom-offcanvas-close" >Link</a></li>
+                           <li><a   routerLinkActive="uk-link" routerLink="/myclaims"  class="uk-offcanvas-close custom-offcanvas-close">My Claims</a></li>
+                           <li *ngIf="isAuthorized"><a   routerLinkActive="uk-link" routerLink="/claims"  class="uk-offcanvas-close custom-offcanvas-close">Manage all Claims</a></li>
+                        </ul-->
+                     </li>
+                     <li *ngIf="showDataProviders" class="uk-nav-header uk-parent">
+                       Content Providers
+                       <ul class="uk-nav-sub">
+                         <li><a href="https://beta.openaire.eu/oa-policies-mandates"  class="uk-offcanvas-close custom-offcanvas-close" >Data Policies</a></li>
+                         <li><a routerLinkActive="uk-link" routerLink="/search/content-providers"  class="uk-offcanvas-close custom-offcanvas-close" >Repositories</a></li>
+                         <li><a routerLinkActive="uk-link" routerLink="/search/journals"  class="uk-offcanvas-close custom-offcanvas-close" >Journals</a></li>
+                         <li><a routerLinkActive="uk-link" routerLink="/search/entity-registries"  class="uk-offcanvas-close custom-offcanvas-close" >Registries/ Databases</a></li>
+                         <li><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders"  class="uk-offcanvas-close custom-offcanvas-close" >Browse all</a></li>
+                      </ul>
+                     </li>
+                     <user-mini mobileView=true></user-mini>
+                  </ul>
+               </div>
+            </div>
+
+         </div>
+      </div>
+   </div>
+</div>
+<div *ngIf="specialAnnouncementContent" class="uk-hidden@m" [innerHTML]="specialAnnouncementContent">
+
+</div>
+<div class="tm-toolbar custom-discover-toolbar uk-visible@m">
+   <div class="uk-container uk-flex uk-flex-middle uk-container-expand">
+      <div class="uk-margin-auto-left">
+         <div class="uk-grid-medium uk-child-width-auto uk-flex-middle uk-grid uk-grid-stack" uk-grid="margin: uk-margin-small-top">
+            <div class="uk-first-column">
+               <div class="uk-panel inner" id="module-119">
+                  <ul class="uk-subnav uk-subnav-line">
+                     <li ><a href="https://beta.openaire.eu" class="home-icon"><span class="uk-responsive-height" >
+                      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 20 20" height="20px" id="Layer_1" version="1.1" viewBox="0 0 48 48" width="20px" xml:space="preserve"><path id="home" clip-rule="evenodd" d="M44.715,23.711c-0.381,0.382-1,0.382-1.381,0l-8.939-8.938  c-0.064-0.051-0.119-0.106-0.17-0.171l-3.83-3.829c-0.064-0.051-0.119-0.106-0.17-0.171L24,4.377L4.667,23.711  c-0.381,0.382-1,0.382-1.381,0c-0.381-0.381-0.381-1,0-1.381L23.191,2.425c0.031-0.047,0.053-0.101,0.094-0.144  C23.482,2.085,23.742,1.994,24,2c0.258-0.006,0.518,0.084,0.715,0.281c0.043,0.042,0.062,0.096,0.096,0.144L30,7.616V4.997  c0,0,0,0,0,0c0-0.552,0.447-1,1-1h4c0.277,0,0.527,0.112,0.707,0.293C35.889,4.471,36,4.721,36,4.997v8.619l8.715,8.714  C45.096,22.711,45.096,23.33,44.715,23.711z M34,5.997h-2v3.619l2,2V5.997z M10,21.997c0.552,0,1,0.448,1,1v19c0,1.105,0.896,2,2,2  h6l0,0v-13c0-0.553,0.447-1,1-1h8c0.553,0,1,0.447,1,1v13l0,0h6c1.105,0,2-0.895,2-2v-19c0-0.552,0.447-1,1-1s1,0.448,1,1v19  c0,2.209-1.791,4-4,4H13c-2.209,0-4-1.791-4-4v-19C9,22.444,9.448,21.997,10,21.997z M27,43.996v-12h-6v12l0,0H27L27,43.996z" fill-rule="evenodd" fill="#fff"/></svg>
+                      <!--img class="uk-responsive-height" src="assets/Home_24white.svg" alt="home"-->
+                     </span></a></li>
+                     <li class="custom-discover-li"><a  routerLinkActive="uk-link" routerLink="/" title="Search in OA. Link your research">Explore</a></li>
+                     <li class="line"><a href="#" title="Content Provider Dashboard">Provide</a></li>
+                     <li class="line"><a href="https://connect.openaire.eu" title="Research Community Dashboard">Connect</a></li>
+                     <li class="line"><a href="https://monitor.openaire.eu" title="Monitoring Dashboard">Monitor</a></li>
+                     <li class="line custom-develop-li "><a href="https://api.openaire.eu" title="APIs">Develop</a></li>
+                  </ul>
+               </div>
+            </div>
+         </div>
+      </div>
+   </div>
+</div>
+<div *ngIf="specialAnnouncementContent" class="uk-visible@m" [innerHTML]="specialAnnouncementContent">
+
+</div>
+<div class="tm-header uk-visible@m tm-header-transparent" uk-header="">
+   <div class="uk-navbar-container uk-sticky uk-navbar-transparent uk-light" uk-sticky="" media="768" cls-active="uk-active uk-navbar-sticky" animation="uk-animation-slide-top" top=".tm-header + [class*=&quot;uk-section&quot;]" cls-inactive="uk-navbar-transparent uk-light" style="">
+      <div class="uk-container uk-container-expand">
+         <nav class="uk-navbar" uk-navbar="{&quot;align&quot;:&quot;left&quot;}">
+            <div class="uk-navbar-left  uk-visible@l  ">
+               <a  routerLinkActive="uk-link" routerLink="/"  class="uk-logo uk-navbar-item">
+               <img src="assets/OA EXPLORE_a.png" alt="OpenAIRE" class="uk-responsive-height"></a>
+            </div>
+            <div class="uk-navbar-left  uk-visible@m uk-hidden@l">
+               <a  routerLinkActive="uk-link" routerLink="/"  class="uk-logo uk-navbar-item">
+               <img src="assets/OA EXPLORE_B.png" alt="OpenAIRE" class="uk-responsive-height"></a>
+            </div>
+            <div class="uk-navbar-center">
+               <ul *ngIf= "isClient" class="uk-navbar-nav">
+                  <li class="uk-parent">
+                     <a routerLinkActive="uk-link" routerLink="/search/find" class="" aria-expanded="false">Search</a>
+                     <div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 0px;" id="searchMenu" (click)="onClick('searchMenu')">
+                        <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
+                           <div class="uk-first-column">
+                              <ul class="uk-nav uk-navbar-dropdown-nav">
+                                 <li *ngIf="showPublications"><a routerLinkActive="uk-link" routerLink="/search/find/publications">Publications</a></li>
+                                 <li *ngIf="showDatasets"><a routerLinkActive="uk-link" routerLink="/search/find/datasets">Research Data</a></li>
+                                 <li *ngIf="showSoftware"><a routerLinkActive="uk-link" routerLink="/search/find/software">Software</a></li>
+                                 <li *ngIf="showProjects"><a routerLinkActive="uk-link" routerLink="/search/find/projects">Projects</a></li>
+                                 <li *ngIf="showDataProviders"><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders">Content Providers</a></li>
+                                 <li *ngIf="showOrganizations"><a routerLinkActive="uk-link" routerLink="/search/find/organizations">Organizations</a></li>
+                              </ul>
+                           </div>
+                        </div>
+                     </div>
+                  </li>
+
+                  <li *ngIf="showDepositDatasets||showDepositPublications" class="uk-parent">
+                     <a  routerLinkActive="uk-link" routerLink="/participate/deposit-publications" class="" aria-expanded="false">Share</a>
+                     <div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 240px;" id="depositMenu"  (click)="onClick('depositMenu')">
+                        <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
+                           <div class="uk-first-column">
+                              <ul   class="uk-nav uk-navbar-dropdown-nav">
+                                 <li  *ngIf="showDepositPublications"><a  routerLinkActive="uk-link" routerLink="/participate/deposit-publications">Publications</a></li>
+                                 <li *ngIf="showDepositDatasets"><a   routerLinkActive="uk-link" routerLink="/participate/deposit-datasets">Research Data</a></li>
+                              </ul>
+                           </div>
+                        </div>
+                     </div>
+                  </li>
+                  <li  *ngIf="showLinking" class="uk-parent">
+                     <a  routerLinkActive="uk-link" routerLink="/participate/claim"  class="" aria-expanded="false">Link</a>
+                     <!--div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 358px;" id="linkingMenu"   (click)="onClick('linkingMenu')" >
+                        <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
+                           <div class="uk-first-column">
+                              <ul class="uk-nav uk-navbar-dropdown-nav">
+                                 <li><a  routerLinkActive="uk-link" routerLink="/participate/claim">Link</a></li>
+                                 <li><a   routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
+                                 <li *ngIf="isAuthorized"><a   routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
+                              </ul>
+                           </div>
+                        </div>
+                     </div-->
+                  </li>
+                  <li *ngIf="showDataProviders" class="uk-parent">
+                     <a routerLinkActive="uk-link" routerLink="/search/content-providers" class="" aria-expanded="false">Content Providers</a>
+                     <div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 113px;" id="dpMenu"  (click)="onClick('dpMenu')">
+                        <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
+                           <div class="uk-first-column">
+                              <ul class="uk-nav uk-navbar-dropdown-nav">
+                                <li><a href="https://beta.openaire.eu/oa-policies-mandates"  class="uk-offcanvas-close custom-offcanvas-close" >Data policies</a></li>
+                                 <li><a routerLinkActive="uk-link" routerLink="/search/content-providers">Repositories</a></li>
+                                 <li><a routerLinkActive="uk-link" routerLink="/search/journals">Journals</a></li>
+                                 <li><a routerLinkActive="uk-link" routerLink="/search/entity-registries">Registries/ Databases</a></li>
+                                 <li><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders">Browse all</a></li>
+
+                              </ul>
+                           </div>
+                        </div>
+                     </div>
+                  </li>
+               </ul>
+            </div>
+            <div  *ngIf= "isClient" class="uk-navbar-right">
+            <!--ul class="uk-navbar-nav">
+               <li class="uk-parent"-->
+                  <user-mini ></user-mini>
+                  <!--a routerLinkActive="uk-link" routerLink="/search/content-providers" class="" aria-expanded="false">Resources</a-->
+                  <!--div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left"   id="userMenu"  (click)="onClick('userMenu')">
+                     <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
+                        <div class="uk-first-column">
+                           <ul class="uk-nav uk-navbar-dropdown-nav">
+                             <li><a href=""  class="uk-offcanvas-close custom-offcanvas-close" >My profile</a></li>
+                             <li><a   routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
+                             <li *ngIf="isAuthorized"><a   routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
+                              <li><a routerLinkActive="uk-link" routerLink="/login">Log out</a></li>
+                           </ul>
+                        </div>
+                     </div>
+                  </div-->
+               <!--/li>
+            </ul-->
+            </div>
+         </nav>
+      </div>
+   </div>
+   <!--div class="uk-sticky-placeholder" style="height: 80px; margin: 0px;" hidden="hidden"></div>
+   <div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" hidden="hidden"></div-->
+</div>
+<div class="first_page_section uk-section-default uk-section uk-padding-remove-vertical">
+   <div class="first_page_banner_headline uk-grid-collapse uk-flex-middle uk-margin-remove-vertical uk-grid uk-grid-stack" uk-grid="">
+   </div>
+</div>
diff --git a/sharedComponents/navigationBar.component.ts b/sharedComponents/navigationBar.component.ts
new file mode 100644
index 00000000..978831c5
--- /dev/null
+++ b/sharedComponents/navigationBar.component.ts
@@ -0,0 +1,98 @@
+import { Component } from '@angular/core';
+// import 'rxjs/Rx';
+import {ActivatedRoute, Router} from '@angular/router';
+import {Observable}       from 'rxjs/Observable';
+
+import {Session} from '../login/utils/helper.class';
+import { ConfigurationService } from '../utils/configuration/configuration.service';
+
+@Component({
+  selector: 'navbar',
+  templateUrl: 'navigationBar.component.html'
+})
+export class NavigationBarComponent {
+  public isAuthorized: boolean = false;
+  sub:any;
+  isClient:boolean = false;
+
+  showPublications:boolean= false;
+  showDatasets:boolean= false;
+  showSoftware:boolean=false;
+  showProjects:boolean= false;
+  showDataProviders:boolean= false;
+  showOrganizations:boolean= false;
+  showDepositDatasets:boolean= false;
+  showDepositPublications:boolean= false;
+  showLinking:boolean= false;
+  specialAnnouncementContent:string= null;
+
+
+  constructor( private router: Router, private  route: ActivatedRoute, private config: ConfigurationService) {}
+
+  ngOnInit() {
+    if (typeof document !== 'undefined') {
+      try{
+        this.isClient = true;
+      }catch (e) {
+      }
+    }
+    // this.initialize();
+    this.sub =  this.route.queryParams.subscribe(params => {
+      this.initialize();
+    });
+    console.log("Before get entities");
+
+    // const entityOne = this.config.isEntityEnabled("publication");
+    // const entityTwo = this.config.isEntityEnabled("dataset");
+    // const entityThree = this.config.isEntityEnabled("project");
+    // const entityFour = this.config.isEntityEnabled("organization");
+    // const entityFive = this.config.isEntityEnabled("datasource");
+    // const entitySix = this.config.isEntityEnabled("software");
+    // const entity7 = this.config.isPageEnabled("participate/deposit-publications");
+    // const entity8 = this.config.isPageEnabled("participate/deposit-datasets");
+    // const entity9 = this.config.isPageEnabled("participate/claim");
+    // const example = Observable.zip(entityOne,entityTwo,entityThree,entityFour,entityFive,entitySix, entity7, entity8, entity9);
+    // const subscribe = example.subscribe(data => {
+    //   console.log("Got the respond")
+    //    this.showPublications =  data[0];
+    //    this.showDatasets =  data[1];
+    //    this.showProjects =  data[2];
+    //    this.showOrganizations =  data[3];
+    //    this.showDataProviders =  data[4];
+    //    this.showSoftware = data[5];
+    //    this.showDepositPublications = data[6];
+    //    this.showDepositDatasets = data[7];
+    //    this.showLinking = data[8];
+    //   });
+
+  }
+  ngOnDestroy(){
+    this.sub.unsubscribe();
+  }
+  initialize(){
+     if(Session.isLoggedIn() && Session.isUserValid() && Session.isAdminUser()){
+      this.isAuthorized = true;
+    }else {
+          this.isAuthorized = false;
+    }
+    this.config.isEntityEnabled("publication").subscribe(data => {
+      console.log("heree");
+       this.showPublications =  data;
+     });
+    this.config.isEntityEnabled("dataset").subscribe(data => { this.showDatasets =  data;});
+    this.config.isEntityEnabled("software").subscribe(data => { this.showSoftware = data;})
+    this.config.isEntityEnabled("project").subscribe(data => { this.showProjects =  data;});
+    this.config.isEntityEnabled("organization").subscribe(data => { this.showOrganizations =  data;});
+    this.config.isEntityEnabled("datasource").subscribe(data => { this.showDataProviders =  data;});
+
+    this.config.isPageEnabled("participate/deposit-publications").subscribe(data => { this.showDepositPublications =  data;});
+    this.config.isPageEnabled("participate/deposit-datasets").subscribe(data => { this.showDepositDatasets =  data;});
+    this.config.isPageEnabled("participate/claim").subscribe(data => { this.showLinking =  data;});
+    this.config.getSpecialAnouncementContent().subscribe(data => { this.specialAnnouncementContent =  data;});
+  }
+  onClick(id: string) {
+        var el: HTMLElement = document.getElementById(id);
+        el.classList.remove('uk-open');
+    }
+
+}
diff --git a/sharedComponents/sharedComponents.module.ts b/sharedComponents/sharedComponents.module.ts
new file mode 100644
index 00000000..1db38be7
--- /dev/null
+++ b/sharedComponents/sharedComponents.module.ts
@@ -0,0 +1,31 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {  RouterModule } from "@angular/router";
+
+import {NavigationBarComponent} from './navigationBar.component';
+import {BottomComponent} from './bottom.component';
+import {FeedbackComponent} from './feedback/feedback.component';
+
+import {UserMiniComponent} from '../login/userMini.component';
+import {LogoutOpenaireService} from '../login/utils/logoutOpenaire.service';
+import {MetaModule} from '../../meta.module';
+import { ConfigurationServiceModule } from '../utils/configuration/configurationService.module';
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+     RouterModule, MetaModule, ConfigurationServiceModule
+  ],
+  declarations: [
+    NavigationBarComponent,
+    BottomComponent,UserMiniComponent, FeedbackComponent
+  ],
+  providers:[LogoutOpenaireService],
+  exports: [
+    NavigationBarComponent,
+    BottomComponent,UserMiniComponent, FeedbackComponent
+    ]
+})
+export class SharedComponentsModule{ }
diff --git a/test/test-routing.module.ts b/test/test-routing.module.ts
new file mode 100644
index 00000000..07f034d4
--- /dev/null
+++ b/test/test-routing.module.ts
@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+
+import { TestComponent } from './test.component';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      { path: '', component: TestComponent},
+
+    ])
+  ]
+})
+export class TestRoutingModule { }
diff --git a/test/test.component.ts b/test/test.component.ts
new file mode 100644
index 00000000..669320f0
--- /dev/null
+++ b/test/test.component.ts
@@ -0,0 +1,61 @@
+import {Component, ElementRef} from '@angular/core';
+import { Subject } from 'rxjs/Subject';
+import {Observable}       from 'rxjs/Observable';
+
+import {SearchFields, FieldDetails} from '../utils/properties/searchFields';
+
+@Component({
+    selector: 'test',
+    template: `
+
+
+
+`
+
+})
+export class TestComponent {
+
+  constructor() {
+
+   }
+
+
+  ngOnInit() {
+
+    }
+
+
+  test(){
+    var  sf:SearchFields  = new SearchFields();
+    console.info("~~~RESULT");
+
+    this.checktables(sf.RESULT_REFINE_FIELDS,sf.RESULT_FIELDS,sf.RESULT_FIELDS);
+    this.checktables(sf.RESULT_ADVANCED_FIELDS,sf.RESULT_FIELDS,sf.RESULT_FIELDS);
+    console.info("~~~PR");
+
+    this.checktables(sf.PROJECT_REFINE_FIELDS,sf.PROJECT_FIELDS,sf.PROJECT_FIELDS);
+    this.checktables(sf.PROJECT_ADVANCED_FIELDS,sf.PROJECT_FIELDS,sf.PROJECT_FIELDS);
+    console.info("~~~DATAPR");
+
+    this.checktables(sf.DATASOURCE_REFINE_FIELDS,sf.DATASOURCE_FIELDS,sf.DATASOURCE_FIELDS);
+    this.checktables(sf.DATASOURCE_ADVANCED_FIELDS,sf.DATASOURCE_FIELDS,sf.DATASOURCE_FIELDS);
+
+    console.info("~~~ORG");
+    this.checktables(sf.ORGANIZATION_REFINE_FIELDS,sf.ORGANIZATION_FIELDS,sf.ORGANIZATION_FIELDS);
+    this.checktables(sf.ORGANIZATION_ADVANCED_FIELDS,sf.ORGANIZATION_FIELDS,sf.ORGANIZATION_FIELDS);
+    console.info("~~~PERSON");
+   
+ }
+  checktables(fields,fieldsDetails,fieldsParam){
+ for(var i =0; i < fields.length; i++){
+   if(!fieldsDetails[fields[i]]){
+     console.info("!!!!"+fields[i]+ "field has to details");
+   }
+   }
+
+ }
+
+
+
+
+}
diff --git a/test/test.module.ts b/test/test.module.ts
new file mode 100644
index 00000000..8277654b
--- /dev/null
+++ b/test/test.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../shared/shared.module';
+import { TestComponent } from './test.component';
+import { TestRoutingModule } from './test-routing.module';
+
+
+ 
+@NgModule({
+  imports: [
+    SharedModule,
+    TestRoutingModule,
+
+  ],
+  declarations: [
+    TestComponent
+  ]
+})
+export class TestModule { }
diff --git a/utils/altmetrics.component.ts b/utils/altmetrics.component.ts
new file mode 100644
index 00000000..ab3c7292
--- /dev/null
+++ b/utils/altmetrics.component.ts
@@ -0,0 +1,43 @@
+import {Component, ElementRef, Input} from '@angular/core';
+ import {SafeHtmlPipe} from '../utils/pipes/safeHTML.pipe';
+ import {ActivatedRoute} from '@angular/router';
+declare var loadAltmetrics:any;
+//<altmetrics [id]="10.7717/peerj.1150" type="doi"></altmetrics>
+@Component({
+  selector: 'altmetrics',
+  template: `
+   <div [innerHTML]="altmetrics | safeHtml"></div>
+  `
+})
+export class AltMetricsComponent {
+  @Input() id ;
+  @Input() type = 'doi'; // doi or arxiv
+
+  // public doi="10.7717/peerj.1150";
+  public altmetrics:string;
+  private sub:any;
+
+  constructor(private route: ActivatedRoute) {
+
+    // if (typeof document !== 'undefined') {
+    //    let yourModule = require('../utils/altmetrics.js');
+    //  }
+  }
+  ngOnInit() {
+    this.sub =  this.route.queryParams.subscribe(data => {
+      if(this.type == "doi"){
+        this.altmetrics='<div data-badge-popover="right" data-hide-no-mentions="true" data-badge-type="donut" data-doi="'+this.id+'" class="altmetric-embed uk-text-center"> </div>';
+      }else{
+        this.altmetrics='<div data-badge-popover="right" data-hide-no-mentions="true" data-badge-type="donut" data-arxiv-id="'+this.id+'" class="altmetric-embed uk-text-center"> </div>';
+      }
+      if (typeof document !== 'undefined') {
+      //   let yourModule = require('../utils/altmetrics.js');
+        loadAltmetrics("altmetric-embed-js","https://d1bxh8uas1mnw7.cloudfront.net/assets/altmetric_badges-8f271adb184c21cc5169a7f67f7fe5ab.js");
+      }
+  });
+  }
+  ngOnDestroy() {
+    this.sub.unsubscribe();
+  }
+
+}
diff --git a/utils/altmetrics.js b/utils/altmetrics.js
new file mode 100644
index 00000000..c90a3753
--- /dev/null
+++ b/utils/altmetrics.js
@@ -0,0 +1,8 @@
+// !function(e,t,n){
+//   var d="createElement",c="getElementsByTagName",m="setAttribute",n=document.getElementById(e);
+//   return n&&n.parentNode&&n.parentNode.removeChild(n),n=document[d+"NS"]&&document.documentElement.namespaceURI,n=n?document[d+"NS"](n,"script"):document[d]("script"),n[m]("id",e),n[m]("src",t),(document[c]("head")[0]||document[c]("body")[0]).appendChild(n),n=new Image,void n[m]("src","https://d1uo4w7k31k5mn.cloudfront.net/donut/0.png")
+// }("altmetric-embed-js","https://d1bxh8uas1mnw7.cloudfront.net/assets/altmetric_badges-8f271adb184c21cc5169a7f67f7fe5ab.js");
+function loadAltmetrics(e,t,n){
+  var d="createElement",c="getElementsByTagName",m="setAttribute",n=document.getElementById(e);
+  return n&&n.parentNode&&n.parentNode.removeChild(n),n=document[d+"NS"]&&document.documentElement.namespaceURI,n=n?document[d+"NS"](n,"script"):document[d]("script"),n[m]("id",e),n[m]("src",t),(document[c]("head")[0]||document[c]("body")[0]).appendChild(n),n=new Image,void n[m]("src","https://d1uo4w7k31k5mn.cloudfront.net/donut/0.png")
+};
diff --git a/utils/altmetrics.module.ts b/utils/altmetrics.module.ts
new file mode 100644
index 00000000..fda0921f
--- /dev/null
+++ b/utils/altmetrics.module.ts
@@ -0,0 +1,20 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {AltMetricsComponent} from './altmetrics.component';
+import {SafeHtmlPipe} from './pipes/safeHTML.pipe';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+     AltMetricsComponent, SafeHtmlPipe
+  ],
+  exports: [
+      AltMetricsComponent, SafeHtmlPipe
+    ]
+})
+export class AltMetricsModule { }
diff --git a/utils/autoComplete.component.css b/utils/autoComplete.component.css
new file mode 100644
index 00000000..6faef1f8
--- /dev/null
+++ b/utils/autoComplete.component.css
@@ -0,0 +1,35 @@
+.auto-complete-box{
+}
+.custom-autocomplete{
+  vertical-align: top;
+}
+.custom-autocomplete .suggestions,.custom-autocomplete  .messages{
+  position:absolute;
+  z-index: 1000;
+  top: 25px;
+}
+.auto-complete-choice .remove {
+  cursor: pointer;
+}
+.auto-complete-choice{
+  background: white none repeat scroll 0 0;
+  border-color: gray;
+  border-radius: 5px;
+  border-style: solid;
+  border-width: thin;
+  color: grey;
+  margin: 3px;
+  padding: 7px;
+}
+.auto-complete-input {
+  border-radius:0;
+  border-color: white;
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0) inset;
+  margin-left: 5px;
+}
+.form-control .auto-complete-input {
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0) inset;
+}
+.auto-complete-box .suggestions .list-group-item, .custom-autocomplete .suggestions .list-group-item {
+    padding: 5px 10px;
+}
diff --git a/utils/configuration/configuration.service.ts b/utils/configuration/configuration.service.ts
new file mode 100644
index 00000000..75cf0642
--- /dev/null
+++ b/utils/configuration/configuration.service.ts
@@ -0,0 +1,57 @@
+import {Injectable} from '@angular/core';
+import {Http, Response, Headers} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {OpenaireProperties} from '../properties/openaireProperties';
+import 'rxjs/add/operator/mapTo';
+import 'rxjs/add/observable/of';
+// import 'rxjs/add/operator/do';
+// import 'rxjs/add/operator/share';
+import { mapTo } from 'rxjs/operators';
+
+@Injectable()
+export class ConfigurationService {
+     constructor(private http: Http ) {}
+
+   isEntityEnabled(entity: string){
+     console.log("isEntityEnabled:  "+entity);
+     let url = "isEntityEnabled-"+entity;
+
+    //  if(entity == "publication" || entity == "dataset" || entity == "datasource"){
+    //     return Observable.of(new Object()).mapTo(false);
+    //  }
+    //  return Observable.of(new Object()).mapTo(true);
+     return this.http.get("http://duffy.di.uoa.gr:8080/uoa-admin-tools/page")
+               .map(res => true);
+   }
+   isPageEnabled(router: string){
+     let url = "isPageEnabled-"+router;
+
+    //  if(router == "search/journals" ){
+     //
+    //     return Observable.of(new Object()).mapTo(false);
+    //  }
+    return this.http.get("http://duffy.di.uoa.gr:8080/uoa-admin-tools/page")
+              .map(res => true);
+   }
+   getMainPageContent(){
+     return this.http.get("http://duffy.di.uoa.gr:8080/uoa-admin-tools/page")
+               .map(res => true);
+   }
+   getSpecialAnouncementContent(){
+     return this.http.get("http://duffy.di.uoa.gr:8080/uoa-admin-tools/page")
+               .map(res => "");
+   }
+   getHelpPageContent(router:string){
+     return  this.http.get("http://duffy.di.uoa.gr:8080/uoa-admin-tools/page")
+               .map(res => true);
+   }
+    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.log(error);
+        return this.http.get("http://duffy.di.uoa.gr:8080/uoa-admin-tools/page")
+                  .map(res => true);
+    }
+
+
+}
diff --git a/utils/configuration/configurationService.module.ts b/utils/configuration/configurationService.module.ts
new file mode 100644
index 00000000..050255e5
--- /dev/null
+++ b/utils/configuration/configurationService.module.ts
@@ -0,0 +1,25 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { SharedModule } from '../../shared/shared.module';
+import { RouterModule } from '@angular/router';
+import { ConfigurationService } from './configuration.service';
+
+
+@NgModule({
+  imports: [
+    SharedModule,
+     CommonModule
+
+    ],
+  providers:[ ConfigurationService]
+
+})
+export class ConfigurationServiceModule {
+  static forRoot() {
+    return {
+      ngModule: ConfigurationServiceModule,
+      providers: [ ConfigurationService ]
+    }
+  }
+}
diff --git a/utils/entities/dataProviderInfo.ts b/utils/entities/dataProviderInfo.ts
new file mode 100644
index 00000000..6d6eb174
--- /dev/null
+++ b/utils/entities/dataProviderInfo.ts
@@ -0,0 +1,124 @@
+export class DataProviderInfo {
+    title: { "name": string, "url": string };
+    officialName: string;
+    type: string;
+    registry: boolean;
+    compatibility: string;
+    oaiPmhURL: string;
+    openDoarURL: string;
+    r3DataURL: string;
+    countries: string[];
+    tabs: {"name": string, "content": string}[];
+    tabsInTypes = {
+        "publicationsTab": new Set<string>(
+                        [   "aggregator::pubsrepository::institutional",
+                            "aggregator::pubsrepository::unknown",
+                            "aggregator::pubsrepository::journals",
+                            "crissystem",
+                            "infospace",
+                            "pubsrepository::institutional",
+                            "pubsrepository::journal",
+                            "pubsrepository::unknown",
+                            "scholarcomminfra",
+                            "pubsrepository::thematic",
+                            "pubscatalogue::unknown",
+
+                            "aggregator::datarepository",
+                            "crissystem",
+                            "datarepository::unknown"
+                        ]),
+        "datasetsTab": new Set<string>(
+                        [   "aggregator::pubsrepository::institutional",
+                            "aggregator::pubsrepository::unknown",
+                            "aggregator::pubsrepository::journals",
+                            "crissystem",
+                            "infospace",
+                            "pubsrepository::institutional",
+                            "pubsrepository::journal",
+                            "pubsrepository::unknown",
+                            "scholarcomminfra",
+                            "pubsrepository::thematic",
+                            "pubscatalogue::unknown",
+
+                            "aggregator::datarepository",
+                            "crissystem",
+                            "datarepository::unknown"
+                        ]),
+        "statisticsTab": new Set<string>(
+                        [   "aggregator::datarepository",
+                            "aggregator::pubsrepository::institutional",
+                            "aggregator::pubsrepository::unknown",
+                            "aggregator::pubsrepository::journals",
+                            "crissystem",
+                            "datarepository::unknown",
+                            "pubsrepository::institutional",
+                            "pubsrepository::journal",
+                            "pubsrepository::unknown",
+                            "pubsrepository::thematic",
+                            "pubscatalogue::unknown",
+                        ]),
+        // "organizationsTab": new Set<string>(
+        //                 [   "entityregistry::projects",
+        //                     "entityregistry::repositories"
+        //                 ]),
+        "projectsTab": new Set<string>(["entityregistry::projects"]),
+        "datasourcesTab": new Set<string>(["entityregistry::repositories"]),
+        "relatedDatasourcesTab": new Set<string>(
+                        [   "aggregator::pubsrepository::unknown",
+                            "aggregator::pubsrepository::journals",
+                            "aggregator::pubsrepository::institutional",
+                            "aggregator::datarepository"
+                        ])/*,
+        "metricsTab": new Set<string>(
+                        [   "aggregator::datarepository",
+                            "aggregator::pubsrepository::institutional",
+                            "aggregator::pubsrepository::unknown",
+                            "aggregator::pubsrepository::journals",
+                            "crissystem",
+                            "datarepository::unknown",
+                            "pubsrepository::institutional",
+                            "pubsrepository::journal",
+                            "pubsrepository::unknown",
+                            "pubsrepository::thematic",
+                            "pubscatalogue::unknown",
+
+                            "infospace",
+                            "scholarcomminfra",
+                            "entityregistry",
+                            "entityregistry::projects",
+                            "entityregistry::repositories"
+                        ])*/
+    };
+
+    resultsBy: string;
+    resultTypes = {
+        "collectedFrom": new Set<string>(
+                        [   "aggregator::datarepository",
+                            "aggregator::pubsrepository::institutional",
+                            "aggregator::pubsrepository::unknown",
+                            "aggregator::pubsrepository::journals",
+                            "entityregistry::projects",
+                            "entityregistry::repositories",
+                            "infospace",
+                            "scholarcomminfra",
+                            "pubscatalogue::unknown"
+                        ]),
+        "hostedBy": new Set<string>(
+                        [   "crissystem",
+                            "datarepository::unknown",
+                            "pubsrepository::institutional",
+                            "pubsrepository::journal",
+                            "pubsrepository::unknown",
+                            "pubsrepository::thematic"
+                        ])
+    };
+
+    organizations: {"name": string, "id": string}[] = [];
+    //publications: any;
+    //datasets: any;
+    statistics: any;
+    //projects: any;
+    datasources: any;
+
+    relatedDatasources: Map<string, {"name": string, "countPublications": string, "countDatasets": string}>;
+}
diff --git a/utils/entities/datasetInfo.ts b/utils/entities/datasetInfo.ts
new file mode 100644
index 00000000..1f32fa75
--- /dev/null
+++ b/utils/entities/datasetInfo.ts
@@ -0,0 +1,44 @@
+export class DatasetInfo {
+    underCurationMessage: boolean;
+    title: { "name": string, "url": string, "accessMode": string};
+    authors: string[];
+    date: string;
+    dateofacceptance: string;
+    embargoEndDate: string;
+    types: string[];
+    hostedBy_collectedFrom: { "downloadName": string, "downloadUrl": string[],
+                              "collectedName": string, "collectedId": string,
+                              "accessMode": string[], "bestAccessMode": string,
+                              "type": string, "year":string}[];
+    identifiers: Map<string, string[]>;
+    publisher: string;
+    subjects: string[];
+    otherSubjects: Map<string, string[]>;
+    classifiedSubjects: Map<string, string[]>;
+    description: string;
+    projectsProvenanceVocabulary: { "sysimport:crosswalk:repository": string,
+                                    "sysimport:crosswalk:entityregistry": string,
+                                    "sysimport:crosswalk:datasetarchive": string,
+                                    "iis": string,
+                                    "sysimport:mining:repository": string,
+                                    "user:claim:pid": string,
+                                    "user:claim:search": string,
+                                    "user:claim:datacite": string
+                                  } = {
+                                    "sysimport:crosswalk:repository": "Repository",
+                                    "sysimport:crosswalk:entityregistry": "Repository",
+                                    "sysimport:crosswalk:datasetarchive": "Repository",
+                                    "iis": "OpenAIRE",
+                                    "sysimport:mining:repository": "OpenAIRE",
+                                    "user:claim:pid": "User",
+                                    "user:claim:search": "User",
+                                    "user:claim:datacite": "User"
+                                  };
+    fundedByProjects: { "id": string, "acronym": string, "title": string,
+                        "funderShortname": string, "funderName": string,
+                        "funding": string, "code": string, "provenanceAction": string, "inline": boolean}[];
+    researchResultsProvenanceVocabulary: {"iis": string, "sysimport": string, "user": string} = {"iis": "Inferred", "sysimport": "Harvested", "user": "Claimed"};
+    relatedResearchResults: Map<string, { "name": string, "id": string, "date": string, "trust": number, "class": string}[]>;
+    similarResearchResults: { "name": string, "id": string, "date": string, "trust": number, "class": string}[];
+    contexts: { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}[];
+}
diff --git a/utils/entities/entities.module.ts b/utils/entities/entities.module.ts
new file mode 100644
index 00000000..9dc27455
--- /dev/null
+++ b/utils/entities/entities.module.ts
@@ -0,0 +1,24 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+
+//Entities
+import {DatasetInfo} from './datasetInfo';
+import {OrganizationInfo} from './organizationInfo';
+import {ProjectInfo} from './projectInfo';
+import {Publication} from './publication';
+import {PublicationInfo} from './publicationInfo';
+import {SearchResult} from './searchResult';
+import {DataProviderInfo} from './dataProviderInfo';
+import {Metrics} from './metrics';
+
+@NgModule({
+  imports: [ CommonModule, FormsModule ],
+  declarations: [
+
+  ],
+  exports: [
+   ]
+})
+export class EntitiesModule { }
diff --git a/utils/entities/metrics.ts b/utils/entities/metrics.ts
new file mode 100644
index 00000000..097d8006
--- /dev/null
+++ b/utils/entities/metrics.ts
@@ -0,0 +1,8 @@
+export class Metrics {
+    totalDownloads: string;
+    totalViews: string;
+    totalOpenaireViews: string;
+    totalOpenaireDownloads: string;
+    pageViews: string;
+    infos: Map<string, {"name": string, "url": string, "numOfDownloads": string, "numOfViews": string, "openaireDownloads": string, "openaireViews": string}>;
+}
diff --git a/utils/entities/organizationInfo.ts b/utils/entities/organizationInfo.ts
new file mode 100644
index 00000000..74583872
--- /dev/null
+++ b/utils/entities/organizationInfo.ts
@@ -0,0 +1,12 @@
+export class OrganizationInfo {
+    title: { "name": string, "url": string };
+    name: string;
+    country: string;
+
+    projects: Map<string, { "name": string, "id":string, "code": string,
+                            "acronym": string, "funder": string, "funderId": string,
+                            "fundingStream": string, "fundingLevel1": string, "fundingLevel2": string,
+                            "sc39": string, "startDate": string, "endDate": string }[]>;
+    //dataProviders: { "name": string, "url": string, "type": string, "websiteUrl": string,
+    //                    "organizations": {"name": string, "url": string}[]}[];
+}
diff --git a/utils/entities/projectInfo.ts b/utils/entities/projectInfo.ts
new file mode 100644
index 00000000..ee3d9b06
--- /dev/null
+++ b/utils/entities/projectInfo.ts
@@ -0,0 +1,23 @@
+export class ProjectInfo {
+    acronym: string;
+    title: string;
+    callIdentifier: string;
+    funder: string;
+    funding: string;
+    contractNum: string;
+    startDate: string;
+    endDate: string;
+    openAccessMandate: string;
+    specialClause39: string;
+    organizations: { "acronym": string, "name": string, "id": string }[];//Map<string, string>;
+    url: string;
+    urlInfo: string;
+
+    //publications: any;
+    researchData: any;
+    statistics: any;
+
+    totalPublications: number;
+    totalDatasets: number;
+    publicationsStatus: any;
+}
diff --git a/utils/entities/publication.ts b/utils/entities/publication.ts
new file mode 100644
index 00000000..c3904b15
--- /dev/null
+++ b/utils/entities/publication.ts
@@ -0,0 +1,7 @@
+export class Publication {
+  title: string;
+  publisher: string;
+  DOI: string;
+  source: string;
+  type: string;
+}
diff --git a/utils/entities/publicationInfo.ts b/utils/entities/publicationInfo.ts
new file mode 100644
index 00000000..81aef56e
--- /dev/null
+++ b/utils/entities/publicationInfo.ts
@@ -0,0 +1,58 @@
+export class PublicationInfo {
+    underCurationMessage: boolean;
+    title: { "name": string, "url": string, "accessMode": string};
+    authors: string[];
+    date: string;
+    dateofacceptance: string;
+    embargoEndDate: string;
+    types: string[];
+    //downloadFrom: Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>;   //key is name
+    //publishedIn: Map<string, {"url": string[], "accessMode": string[], "bestAccessMode": string}>;    //key is name
+
+    hostedBy_collectedFrom: {"downloadName": string, "downloadUrl": string[], "collectedName": string, "collectedId": string, "accessMode": string[], "bestAccessMode": string, "type": string, "year":string}[];
+
+    identifiers: Map<string, string[]>;     //key is the classname
+    publisher: string;
+    journal: {"journal": string, "issn": string, "lissn": string};
+    languages: string[];
+    subjects: string[];
+    otherSubjects: Map<string, string[]>;
+    classifiedSubjects: Map<string, string[]>;          //<class of subject, subjects>
+    description: string;
+    //bestaccessright: string;
+    //collectedFrom: { "name": string, "id": string}[];
+    projectsProvenanceVocabulary: { "sysimport:crosswalk:repository": string,
+                                    "sysimport:crosswalk:entityregistry": string,
+                                    "sysimport:crosswalk:datasetarchive": string,
+                                    "iis": string,
+                                    "sysimport:mining:repository": string,
+                                    "user:claim:pid": string,
+                                    "user:claim:search": string,
+                                    "user:claim:datacite": string
+                                  } = {
+                                    "sysimport:crosswalk:repository": "Repository",
+                                    "sysimport:crosswalk:entityregistry": "Repository",
+                                    "sysimport:crosswalk:datasetarchive": "Repository",
+                                    "iis": "OpenAIRE",
+                                    "sysimport:mining:repository": "OpenAIRE",
+                                    "user:claim:pid": "User",
+                                    "user:claim:search": "User",
+                                    "user:claim:datacite": "User"
+                                  };
+    fundedByProjects: { "id": string, "acronym": string, "title": string,
+                        "funderShortname": string, "funderName": string,
+                        "funding": string, "code": string, "provenanceAction": string,
+                        "inline": boolean}[];
+    bioentities: Map<string, Map<string, string>>;      //<site name, <>>
+    software: { "name": string, "url": string}[];      //<site name, <>>
+    //relatedPublications: { "name": string, "url": string, "date": string, "trust": number}[];
+    //relatedResearchData: { "name": string, "url": string, "date": string, "trust": number}[];
+    //similarPublications: {"name": string, "url": string, "date": string, "trust": number}[];
+    //similarDatasets: {"name": string, "url": string, "date": string, "trust": number}[];
+    researchResultsProvenanceVocabulary: {"iis": string, "sysimport": string, "user": string} = {"iis": "Inferred", "sysimport": "Harvested", "user": "Claimed"};
+    relatedResearchResults: Map<string, { "name": string, "id": string, "date": string, "trust": number, "class": string}[]>;
+    similarResearchResults: { "name": string, "id": string, "date": string, "trust": number, "class": string}[];
+    references: { "name": string, "url": string}[];
+    contexts: { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}[];
+    organizations: {"name": string, "shortname":string, "id": string, "websiteUrl": string, "country": string, "trust": number}[];
+}
diff --git a/utils/entities/searchResult.ts b/utils/entities/searchResult.ts
new file mode 100644
index 00000000..78712755
--- /dev/null
+++ b/utils/entities/searchResult.ts
@@ -0,0 +1,34 @@
+export class SearchResult {
+    title: { "name": string, "accessMode": string, "sc39": string};
+    id:string;
+    DOI:string;
+    //publications & datasets & organizations:
+    projects: {"funderShortname": string, "funderName": string, "acronym": string, "title": string, "code": string, "id": string}[];
+    //datasets & publications
+    description: string;
+    year: string;
+    embargoEndDate: string;
+    authors: string[];
+    //datasets:
+    publisher: string;
+    //dataproviders & projects:
+    organizations: { "name": string, "id": string}[];
+    //projects:
+    funders: {"funderShortname": string, "funderName": string}[];
+    startYear:number;
+    endYear:number;
+    //organizations:
+    country: string;
+    //dataproviders:
+    type: string;
+    websiteURL: string;
+    OAIPMHURL: string;
+    compatibility: string;
+    countries: string[];
+    entityType: string;
+    languages: string[];
+    types: string[];
+    openAccessMandate: boolean;
+    constructor(){}
+
+}
diff --git a/utils/entities/softwareInfo.ts b/utils/entities/softwareInfo.ts
new file mode 100644
index 00000000..1e4b90f0
--- /dev/null
+++ b/utils/entities/softwareInfo.ts
@@ -0,0 +1,44 @@
+export class SoftwareInfo {
+    underCurationMessage: boolean;
+    title: { "name": string, "url": string, "accessMode": string};
+    authors: string[];
+    date: string;
+    dateofacceptance: string;
+    embargoEndDate: string;
+    types: string[];
+    hostedBy_collectedFrom: { "downloadName": string, "downloadUrl": string[],
+                              "collectedName": string, "collectedId": string,
+                              "accessMode": string[], "bestAccessMode": string,
+                              "type": string, "year":string}[];
+    identifiers: Map<string, string[]>;
+    publisher: string;
+    subjects: string[];
+    otherSubjects: Map<string, string[]>;
+    classifiedSubjects: Map<string, string[]>;
+    description: string;
+    projectsProvenanceVocabulary: { "sysimport:crosswalk:repository": string,
+                                    "sysimport:crosswalk:entityregistry": string,
+                                    "sysimport:crosswalk:datasetarchive": string,
+                                    "iis": string,
+                                    "sysimport:mining:repository": string,
+                                    "user:claim:pid": string,
+                                    "user:claim:search": string,
+                                    "user:claim:datacite": string
+                                  } = {
+                                    "sysimport:crosswalk:repository": "Repository",
+                                    "sysimport:crosswalk:entityregistry": "Repository",
+                                    "sysimport:crosswalk:datasetarchive": "Repository",
+                                    "iis": "OpenAIRE",
+                                    "sysimport:mining:repository": "OpenAIRE",
+                                    "user:claim:pid": "User",
+                                    "user:claim:search": "User",
+                                    "user:claim:datacite": "User"
+                                  };
+    fundedByProjects: { "id": string, "acronym": string, "title": string,
+                        "funderShortname": string, "funderName": string,
+                        "funding": string, "code": string, "provenanceAction": string, "inline": boolean}[];
+    researchResultsProvenanceVocabulary: {"iis": string, "sysimport": string, "user": string} = {"iis": "Inferred", "sysimport": "Harvested", "user": "Claimed"};
+    relatedResearchResults: Map<string, { "name": string, "id": string, "date": string, "trust": number, "class": string}[]>;
+    similarResearchResults: { "name": string, "id": string, "date": string, "trust": number, "class": string}[];
+    contexts: { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}[];
+}
diff --git a/utils/entitiesAutoComplete/entitiesAutoComplete.component.ts b/utils/entitiesAutoComplete/entitiesAutoComplete.component.ts
new file mode 100644
index 00000000..0852e590
--- /dev/null
+++ b/utils/entitiesAutoComplete/entitiesAutoComplete.component.ts
@@ -0,0 +1,280 @@
+import {Component, ElementRef, Input, Output, EventEmitter, OnChanges, SimpleChange} from '@angular/core';
+import {Observable} from 'rxjs/Observable';
+import {Subject} from 'rxjs/Subject';
+import {Value} from '../../searchPages/searchUtils/searchHelperClasses.class';
+import {EntitiesSearchService} from './entitySearch.service';
+
+//Usage example
+//<static-autocomplete [(filtered)] =filtered [(selected)] =selected placeHolderMessage = "Search for countries" title = "Countries:" (keywordChange)="keywordChanged($event)"></static-autocomplete>
+
+@Component({
+    selector: 'entities-autocomplete',
+     host: {
+       '(document:click)': 'handleClick($event)',
+   },
+    template: `
+
+        <span class="custom-autocomplete">
+          <span   *ngIf = "showSelected && selectedValue != ''">
+            <span  class="uk-alert-default" data-uk-alert=""  *ngFor="let item of selected" [title]="showItem(item)" > <span >{{showItem(item)}} </span>
+            <span (click)="remove(item)" aria-hidden="true" title="Remove selection" > <span class="clickable uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span> </span>
+          </span>
+          </span>
+          <input *ngIf = "showInput" type="text" class="auto-complete-input validate filter-input input-sm form-control -width-small " [placeholder]=placeHolderMessage [(ngModel)]=keyword (keyup)=search()   >
+          <!--span [style.display]="showLoading ? 'inline' : 'none'" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading... </span>
+          <span *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" data-uk-alert=""> {{warningMessage}} <a href="" class="uk-alert-close uk-close"></a></span-->
+          <div *ngIf="focus && showInput" class="uk-dropdown" aria-expanded="true" style="display:block" >
+                <ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results" >
+                      <li>
+                          <span *ngIf="!_search.ready" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading..... </span>
+                          <span *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" data-uk-alert="">{{warningMessage}}</span>
+                          <span *ngIf="results > 0"  >  {{results}} results found:</span>
+                          <!--span *ngIf="results == 0 && !showLoading" class="uk-alert uk-alert-primary" data-uk-alert=""> No results found</span-->
+                      </li>
+                       <li      *ngFor=" let item of filtered | async">
+                        <a *ngIf= "item.id !=-1 && item.id !=-2" (click)="select(item)" [title]="showItem(item)"  style="text-overflow: ellipsis; ">{{showItem(item)}}</a>
+                          <span *ngIf= "item.id ==-1"  class="uk-alert uk-alert-primary" data-uk-alert=""> No results found</span>
+                          <span *ngIf= "item.id ==-2"  class="uk-alert uk-alert-warning" data-uk-alert=""> An error occured</span>
+                     </li>
+                </ul>
+
+          </div>
+
+      </span>
+
+        `
+})
+export class EntitiesAutocompleteComponent {
+    @Input() placeHolderMessage = "Search for entries";
+    @Input() title = "Autocomplete";
+    @Output() addItem = new EventEmitter(); // when selected list  changes update parent component
+    @Output() selectedValueChanged = new EventEmitter(); // when changed  a method for filtering will be called
+    @Input() public list = []; // the entries resulted after filtering function
+    @Input() public selected = []; // the entries selected from user
+    @Input() public keywordlimit = 3; // the minimum length of keyword
+    @Input() public showSelected = true; // the minimum length of keyword
+    @Input() public multipleSelections:boolean = true;
+    @Input() public allowDuplicates:boolean = false;
+    @Input() public selectedValue:string = '';
+    @Input() public keyword = '';
+    @Input() public fieldId:string ;
+    public currentFieldId: string ;
+    public currentFunderId: string ;
+    public warningMessage = "";
+    public infoMessage = "";
+    public tries = 0;
+    public showInput = true;
+    public sub;
+    public done = false;
+    public showLoading:boolean = false;
+    public searchTermStream = new Subject<string>();
+    filtered: Observable<{}> ;
+    // public numFilteredResults:number = 0;
+
+    @Input() public funderId:string;
+    @Input() public entityType:string ;
+    @Input() public depositType:string ;
+    public results = 0;
+    public focus:boolean  = false;
+    constructor (public _search:EntitiesSearchService, private myElement: ElementRef) {
+      this.currentFieldId=this.fieldId;
+      this.currentFunderId=this.funderId;
+      this.initialize();
+    }
+
+    ngOnChanges(changes: {[propKey: string]: SimpleChange}) {
+         if(this.currentFieldId!=this.fieldId){ //this is going to be called when
+          this.currentFieldId=this.fieldId;
+          this.initialize();
+        }else if(this.currentFunderId!=this.funderId){
+          this.currentFunderId=this.funderId;
+          this.initialize();
+        }
+    }
+    private initialize(){
+
+      this.showInput = true;
+       if(this.entityType == "project" && this.funderId ){
+        this.filtered  = this.searchTermStream
+        .debounceTime(300).distinctUntilChanged()
+        .switchMap((term: string) =>    {
+          console.log("funder"+this.funderId);
+            var results = this._search.searchProjectsByFunder(term, (this.funderId == "0"?"":encodeURIComponent(this.funderId)));
+            this.showLoading = false;
+             this.results = results.length;
+            return   results;
+        });
+      }else if(this.entityType == "organization" && this.depositType ){
+         this.filtered  = this.searchTermStream
+        .debounceTime(300).distinctUntilChanged()
+        .switchMap((term: string) => {
+          var results = this._search.searchByDepositType(term, this.depositType);
+          this.showLoading = false;
+          this.results = results.length;
+          return   results;
+      });
+
+      }else{
+
+        this.filtered  = this.searchTermStream
+        .debounceTime(300)
+        .distinctUntilChanged()
+        .switchMap((term: string) => {
+          var results = this._search.searchByType(term, this.entityType);
+          this.showLoading = false;
+          this.results = results.length;
+          return   results;
+      });
+
+        this.getSelectedNameFromGivenId();
+      }
+
+    }
+    ngOnDestroy(){
+      if(this.sub && this.sub != undefined){
+        this.sub.unsubscribe();
+      }
+    }
+
+    search() {
+      this.infoMessage = "";
+      if(this.keyword == ""){
+        this.tries = 0;
+        this.warningMessage = "";
+      } else if(this.keyword && this.keyword.length < this.keywordlimit){
+        this.tries++;
+        if(this.tries == this.keywordlimit -1 ){
+          this.warningMessage = "Type at least " + this.keywordlimit + " characters";
+          this.tries = 0;
+        }
+      }else{
+
+        this.tries = 0;
+        this.warningMessage = "";
+        this.searchTermStream.next(this.keyword);
+        // if(this.numFilteredResults ==0){
+          this.showLoading = true;
+          this.focus = true;
+        // }
+      }
+
+    }
+
+    remove(item:any){
+      var index:number =this.checkIfExists(item,this.selected);
+       if (index > -1) {
+          this.selected.splice(index, 1);
+      }
+      if(!this.multipleSelections && this.selected.length == 0 ){
+        this.showInput = true;
+        this.selectedValue = "";
+        this.selectedValueChanged.emit({
+            value: this.selectedValue
+        });
+
+
+      }
+    }
+    select(item:any){
+        if(this.multipleSelections){
+          var index:number =this.checkIfExists(item,this.selected);
+           if (index > -1 && !this.allowDuplicates) {
+              // this.keyword = "";
+              // this.filtered.splice(0, this.filtered.length);
+              this.focus=false;
+              return;
+          }
+          else{
+              this.selected.push(item);
+              // this.keyword = "";
+              // this.filtered.splice(0, this.filtered.length);
+              this.addItem.emit({
+                  value: item
+              });
+              this.focus=false;
+          }
+      }else{
+        this.selected.splice(0, this.selected.length);
+        this.selected.push(item);
+        // this.filtered.splice(0, this.filtered.length);
+        this.keyword = "";
+        this.showInput = false;
+        this.selectedValue = item.id;
+        this.selectedValueChanged.emit({
+            value: this.selectedValue
+        });
+        this.focus=false;
+
+      }
+
+    }
+    private checkIfExists(item:any,list):number{
+
+       if(item.concept && item.concept.id ){
+
+        for (var _i = 0; _i < list.length; _i++) {
+            let itemInList = list[_i];
+            if(item.concept.id == itemInList.concept.id){
+                 return _i;
+            }
+         }
+      }else if(item.id){
+        for (var _i = 0; _i < list.length; _i++) {
+            let itemInList = list[_i];
+             if(item.id == itemInList.id){
+                 return _i;
+            }
+         }
+      }
+      return -1;
+
+    }
+    showItem(item:any):string{
+
+     if (item.name){ //search
+         return item.name;
+      }else if( item.concept && item.concept.label){ //context
+         return item.concept.label;
+      }else if (item.label){ //simple
+         return item.label;
+      }
+
+    }
+    truncate(str:string, size:number):string{
+      if(str == null){return "";}
+      return (str.length > size)?str.substr(0,size)+'...':str;
+    }
+    private getSelectedNameFromGivenId(){
+      this.showInput = true;
+      if(this.selectedValue && this.selectedValue.length > 0 ){
+
+
+      this.sub = this._search.fetchByType(this.selectedValue,this.entityType).subscribe(
+        data => {
+          this.selected.push( data[0]);
+          this.showInput = false;
+         },
+        err => console.log("An error occured"));
+    }
+  }
+
+    handleClick(event){
+     var clickedComponent = event.target;
+     var inside = false;
+     do {
+         if (clickedComponent === this.myElement.nativeElement) {
+             inside = true;
+         }
+        clickedComponent = clickedComponent.parentNode;
+     } while (clickedComponent);
+      if(!inside){
+        this.keyword = "";
+        // this.numFilteredResults = 0;
+        this.searchTermStream.next(this.keyword);
+        this.focus=false;
+      }
+  }
+
+}
diff --git a/utils/entitiesAutoComplete/entitiesAutoComplete.module.ts b/utils/entitiesAutoComplete/entitiesAutoComplete.module.ts
new file mode 100644
index 00000000..af8e0697
--- /dev/null
+++ b/utils/entitiesAutoComplete/entitiesAutoComplete.module.ts
@@ -0,0 +1,21 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {EntitiesAutocompleteComponent} from './entitiesAutoComplete.component';
+import {EntitySearchServiceModule} from './entitySearchService.module';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, EntitySearchServiceModule
+  ],
+  declarations: [
+     EntitiesAutocompleteComponent
+  ],
+  exports: [
+      EntitiesAutocompleteComponent
+    ],
+    providers:[ ]
+})
+export class EntitiesAutocompleteModule { }
diff --git a/utils/entitiesAutoComplete/entitySearch.service.ts b/utils/entitiesAutoComplete/entitySearch.service.ts
new file mode 100644
index 00000000..24c21f01
--- /dev/null
+++ b/utils/entitiesAutoComplete/entitySearch.service.ts
@@ -0,0 +1,249 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {AutoCompleteValue} from '../../searchPages/searchUtils/searchHelperClasses.class';
+import {OpenaireProperties} from '../properties/openaireProperties';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+import {StringUtils} from '../string-utils.class';
+@Injectable()
+export class EntitiesSearchService {
+    public ready:boolean = false;
+    constructor(private http: Http ) {}
+
+    searchProjectsByFunder(keyword:string, funderId:string):any {
+      this.ready = false;
+      let url = OpenaireProperties.getSearchResourcesAPIURL();
+      console.log("Funder is " + funderId);
+      url = url+"?query=(oaftype exact project and deletedbyinference=false) ";
+      if(keyword!= null && keyword != ''  ) {
+        url +=  'and ((projectcode_nt exact "'+keyword+'" )or('+keyword+')) ' ;
+        url+=((funderId && funderId.length > 0 )?("&fq=funder exact " + '"'+funderId+ '"'):"");
+      }
+
+      url += "&page=0&size=10";
+      url += "&format=json";
+      console.log("URL " + url);
+      // let url =  OpenaireProperties. getSearchAPIURLLast()+"projects?"+((keyword && keyword.length > 0)?("q=" +keyword):"")+((funderId && funderId.length > 0 )?"&fq=funder exact " + '"'+funderId+ '"':"")+"&size=10&page=0&format=json";
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url).toPromise()
+      .then(request =>
+        {
+          request = request.json().results;
+          this.ready = true;
+          return this.parse(request,"oaf:project","project");
+        }).catch((ex) => {
+          console.error('An error occured', ex);
+          return  [{id:'-2',label:'Error'}];;
+        });
+      }
+      searchByDepositType(keyword:string, DepositType:string):any {
+        this.ready = false;
+        console.info("In searchOrganizationsforDeposit");
+
+        let link = OpenaireProperties.getSearchResourcesAPIURL();
+
+        let url = link+"?query=";
+        if(keyword!= null && keyword != ''  ) {
+          url += "((oaftype exact organization and deletedbyinference=false and "+
+            "(reldatasourcecompatibilityid=driver or reldatasourcecompatibilityid=driver-openaire2.0 or reldatasourcecompatibilityid=openaire2.0 or reldatasourcecompatibilityid=openaire3.0 or reldatasourcecompatibilityid=openaire2.0_data or reldatasourcecompatibilityid=hostedBy or relprojectid=*))"+
+            " and ((organizationlegalname all "+'"'+keyword+'"'+") or (organizationlegalshortname all "+'"'+keyword+'"'+")) " +
+            // "and " + this.quote(params) + " " +
+            "and (collectedfrom exact "+StringUtils.quote(StringUtils.URIEncode(DepositType))+")) "
+
+        }
+
+        url += "&page=0&size=10";
+        url += "&format=json";
+
+        // let url =  OpenaireProperties. getSearchAPIURLLast()+"projects?"+((keyword && keyword.length > 0)?("q=" +keyword):"")+((funderId && funderId.length > 0 )?"&fq=funderid exact " + '"'+funderId+ '"':"")+"&size=10&page=0&format=json";
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url).toPromise()
+        .then(request =>
+          {
+            request = request.json().results;
+            console.log(request);
+            this.ready = true;
+            return this.parse(request,"oaf:organization","organization");
+          }).catch((ex) => {
+            console.error('An error occured', ex);
+            return  [{id:'-2',label:'Error'}];;
+          });
+        }
+
+    searchByType(keyword:string,type:string){
+       if (type == "project"){
+         return  this.searchEntity(keyword,"projects","oaf:project","project");
+      }else if (type == "dataset"){
+        return  this.searchEntity(keyword,"datasets","oaf:result","dataset");
+      }else if (type == "datasource" || type == "hostedBy" || type== "collectedFrom"){
+        return  this.searchEntity(keyword,"datasources","oaf:datasource","datasource");
+      }else if (type == "publication"){
+        return  this.searchEntity(keyword,"publications","oaf:result","publication");
+      }else if (type == "organization"){
+        return  this.searchEntity(keyword,"organizations","oaf:organization","organization");
+
+      }
+
+    }
+    fetchByType(id:string,type:string){
+       if (type == "project"){
+         return  this.fetchEntity(id,"projects","oaf:project","project");
+      }else if (type == "dataset"){
+        return  this.fetchEntity(id,"datasets","oaf:result","dataset");
+      }else if (type == "datasource"  || type == "hostedBy" || type== "collectedFrom"){
+        return  this.fetchEntity(id,"datasources","oaf:datasource","datasource");
+      }else if (type == "publication"){
+        return  this.fetchEntity(id,"publications","oaf:result","publication");
+      }else if (type == "organization"){
+        return  this.fetchEntity(id,"organizations","oaf:organization","organization");
+
+      }
+
+    }
+private searchEntity (keyword: string,APIname:string,oafEntityType:string, type:string):any {
+      let link = OpenaireProperties. getSearchAPIURLLast()+APIname;
+      return this.search(link,keyword,oafEntityType,type)
+
+}
+private fetchEntity (id: string,APIname:string,oafEntityType:string, type:string):any {
+    let link = OpenaireProperties. getSearchAPIURLLast()+APIname;
+    return this.fetch(link,id,oafEntityType,type)
+}
+private fetch (link,id,oafEntityType,type){
+  this.ready = false;
+  let url = link+"/"+id+"?format=json";
+  return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+    .map(request => <any> request.json())
+    // .do(res => console.info(res))
+    .map(request => {
+      this.ready = true;
+      return this.parse(request,oafEntityType,type);
+    }).catch((ex) => {
+      console.error('An error occured', ex);
+      return  [{id:'-2',label:'Error'}];;
+    });
+
+}
+    private search (link,keyword,oafEntityType,type){
+      this.ready = false;
+      let url = link+"?";
+      if(keyword!= null && keyword != ''  ) {
+          url += "q="+ keyword;
+      }
+
+      url += "&page=0&size="+10+"&format=json";
+      return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url).toPromise()
+                 .then(request =>
+                   {
+                     request = request.json().results;
+                     this.ready = true;
+                     return this.parse(request,oafEntityType,type);
+                   }).catch((ex) => {
+                     console.error('An error occured', ex);
+                     return [{id:'-2',label:'Error'}];
+                   });
+
+
+    }
+
+    private parse(data: any,oafEntityType:string, type:string){
+      var array:any =[]
+      let length = Array.isArray(data) ? data.length : 1;
+
+      for(let i=0; i<length; i++) {
+            let resData = Array.isArray(data) ? data[i]['result']['metadata']['oaf:entity'][oafEntityType] : data['result']['metadata']['oaf:entity'][oafEntityType];
+
+            var value:any={} ;
+            if(resData['title']){
+              if(Array.isArray(resData['title'])) {
+                    value.label = resData['title'][0];
+              } else {
+                    value.label = resData['title'];
+              }
+              if(oafEntityType=="oaf:result"){
+                value.label = value.label.content;
+                value.result = resData;
+              }
+            }else if(resData["fullname"]){
+              if(Array.isArray(resData["fullname"])) {
+                    value.label = resData["fullname"][0];
+              } else {
+                    value.label = resData["fullname"];
+              }
+            }else if(resData["legalname"]){
+
+              if(Array.isArray(resData["legalname"])) {
+                    value.label = resData["legalname"][0];
+              } else {
+                    value.label = resData["legalname"];
+              }
+
+            }else if(resData["officialname"]){
+
+              if(Array.isArray(resData["officialname"])) {
+                    value.label = resData["officialname"][0];
+              } else {
+                    value.label = resData["officialname"];
+              }
+            }
+
+           value.id = Array.isArray(data) ? data[i]['result']['header']['dri:objIdentifier'] : data['result']['header']['dri:objIdentifier'];
+
+             if(type=="project"){
+                  value.projectAcronym = resData['acronym'];
+                  value.projectName = value.label;
+                  value.endDate = null;
+                  value.startDate = null;
+                  value.funderId = "";
+                  value.funderName = "";
+                  value.jurisdiction = "";
+                  value.fundingLevel0 = "";
+                  value.code =  resData['code'];
+
+                  if(resData['fundingtree'] && resData['fundingtree']['funder']){
+                    value.funderId = (resData['fundingtree']['funder']['id'] )?resData['fundingtree']['funder']['id']:"";
+                    value.funderName = (resData['fundingtree']['funder']['shortname'] )?resData['fundingtree']['funder']['shortname']:"";
+                    value.jurisdiction = (resData['fundingtree']['funder']['jurisdiction'] )?resData['fundingtree']['funder']['jurisdiction']:"";
+                    if(resData['fundingtree']['funding_level_2']){
+                      value.fundingLevel0 = (resData['fundingtree']['funding_level_2'] && resData['fundingtree']['funding_level_2']['parent'] &&
+                       resData['fundingtree']['funding_level_2']['parent']['funding_level_1'] && resData['fundingtree']['funding_level_2']['parent']['funding_level_1']['parent']
+                     && resData['fundingtree']['funding_level_2']['parent']['funding_level_1']['parent']['funding_level_0'])?
+                      resData['fundingtree']['funding_level_2']['parent']['funding_level_1']['parent']['funding_level_0']['name']:"";
+                    }else if(resData['fundingtree']['funding_level_1']){
+                      value.fundingLevel0 = (resData['fundingtree']['funding_level_1'] && resData['fundingtree']['funding_level_1']['parent'] && resData['fundingtree']['funding_level_1']['parent']['funding_level_0'])?
+                      resData['fundingtree']['funding_level_1']['parent']['funding_level_0']['name']:"";
+                    }else if(resData['fundingtree']['funding_level_0']){
+                      value.fundingLevel0 = (resData['fundingtree']['funding_level_0']  )?resData['fundingtree']['funding_level_0']['name']:"";
+                    }else {
+                      value.fundingLevel0="";
+                    }
+                  }
+
+                  if(resData.hasOwnProperty("startdate")) {
+                    value.startDate = resData.startdate.split('-')[0];
+                  }
+                  if(resData.hasOwnProperty("enddate")) {
+                    value.endDate = resData.enddate.split('-')[0];
+                  }
+
+             }
+            //  console.info("add:"+value.label+"   "+value.id);
+
+              array.push(value);
+        }
+        if(array.length == 0){
+          array.push({id:'-1',label:'No results found'});
+        }
+        console.info("Parsing results.... Size:"+array.length);
+
+        return array;
+    }
+
+    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.log(error);
+      return Observable.throw(error  || 'Server error');
+    }
+}
diff --git a/utils/entitiesAutoComplete/entitySearchService.module.ts b/utils/entitiesAutoComplete/entitySearchService.module.ts
new file mode 100644
index 00000000..8cb6823e
--- /dev/null
+++ b/utils/entitiesAutoComplete/entitySearchService.module.ts
@@ -0,0 +1,18 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+ import {EntitiesSearchService} from './entitySearch.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+   ],
+  exports: [
+     ],
+    providers:[ EntitiesSearchService]
+})
+export class EntitySearchServiceModule { }
diff --git a/utils/errorMessages.component.ts b/utils/errorMessages.component.ts
new file mode 100644
index 00000000..aeb43d66
--- /dev/null
+++ b/utils/errorMessages.component.ts
@@ -0,0 +1,51 @@
+import {Component, Input} from '@angular/core';
+import {ErrorCodes} from './properties/openaireProperties';
+
+@Component({
+    selector: 'errorMessages',
+    template: `
+      <div *ngIf="status.some(checkErroCode(errorCodes.LOADING))" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
+      <div *ngIf="status.every(checkErroCode(errorCodes.NONE))"   class="uk-animation-fade uk-alert uk-alert-primary" role="alert">No {{type}} available</div>
+      <div *ngIf="status.every(checkErroCode(errorCodes.ERROR)) ||
+                  (status.some(checkErroCode(errorCodes.ERROR)) && (!status.every(checkErroCode(errorCodes.DONE)) || !status.every(checkErroCode(errorCodes.LOADING))))"
+            class="uk-animation-fade uk-alert uk-alert-warning" role="alert">
+        An Error Occured
+      </div>
+      <div *ngIf="status.every(checkErroCode(errorCodes.NOT_AVAILABLE)) ||
+                  (status.some(checkErroCode(errorCodes.NOT_AVAILABLE)) && (!status.every(checkErroCode(errorCodes.DONE)) || !status.every(checkErroCode(errorCodes.LOADING))))"
+            class="uk-animation-fade uk-alert uk-alert-warning" role="alert">
+        Service temprorarily unavailable. Please try again later.
+      </div>
+      <div *ngIf="status.every(checkErroCode(errorCodes.NOT_FOUND)) ||
+                  (status.some(checkErroCode(errorCodes.NOT_FOUND)) && (!status.every(checkErroCode(errorCodes.DONE)) || !status.every(checkErroCode(errorCodes.LOADING))))"
+            class="uk-animation-fade uk-alert uk-alert-warning" role="alert">
+        No {{type}} found
+      </div>
+      <div *ngIf="status.every(checkErroCode(errorCodes.OUT_OF_BOUND))" class="uk-animation-fade uk-alert uk-alert-warning" role="alert">Requested page out of bounds</div>
+    `
+  })
+
+  export class ErrorMessagesComponent {
+      @Input() status: Array<number>;
+      @Input() type: string;
+
+      public errorCodes:ErrorCodes;
+
+      constructor () {}
+
+      ngOnInit() {
+          this.errorCodes = new ErrorCodes();
+          console.info("ngOnInit");
+          if(!this.status) {
+            this.status = [this.errorCodes.LOADING];
+          }
+      }
+
+      ngOnDestroy() {}
+
+      public checkErroCode(code: number) {
+        return function(status: number) {
+          return (status == code);
+        }
+      }
+  }
diff --git a/utils/errorMessages.module.ts b/utils/errorMessages.module.ts
new file mode 100644
index 00000000..9f7315af
--- /dev/null
+++ b/utils/errorMessages.module.ts
@@ -0,0 +1,19 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {ErrorMessagesComponent} from './errorMessages.component';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+     ErrorMessagesComponent
+  ],
+  exports: [
+      ErrorMessagesComponent
+    ]
+})
+export class ErrorMessagesModule { }
diff --git a/utils/exportCSV.class.ts b/utils/exportCSV.class.ts
new file mode 100644
index 00000000..c5e39a33
--- /dev/null
+++ b/utils/exportCSV.class.ts
@@ -0,0 +1,131 @@
+
+
+
+export class ExportCSVComponent {
+    stockData : any =
+        {
+            "columnNames":
+                ["Symbol", "Company", "Price"],
+            "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"
+                    },
+                ],
+*/
+
+                [
+                    [
+                        "AAPL",
+                        "Apple Inc.",
+                        "132.54"
+                    ],
+                    [
+                        "INTC",
+                        "Intel Corporation",
+                        "33.45"
+                    ],
+                    [
+                        "GOOG",
+                        "Google Inc",
+                        "554.52"
+                    ],
+                ],
+
+
+            "columnDelimiter": ',',
+            "lineDelimiter": '\n'
+        };
+
+     data: any = this.stockData;
+     filename: string;
+     linkname: string = "Download CSV";
+
+    constructor () {
+    }
+
+    ngOnInit() {
+    }
+
+    public static 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]);
+        keys = args.columnNames;
+
+        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;
+        });
+*/
+
+        for(let line of data) {
+            ctr = 0;
+            for(let column of line) {
+                if (ctr > 0) result += columnDelimiter;
+                result += column;
+                ctr++;
+            }
+            result += lineDelimiter;
+        }
+
+        return result;
+    }
+
+    public static downloadCSV(data: any, filenameArg: string) {
+        console.info("downloadCSV");
+
+        var encodedData, filename, link;
+
+        var csv = this.convertArrayOfObjectsToCSV(data);
+        if (csv == null) return;
+
+        filename = filenameArg || 'export.csv';
+
+        if (!csv.match(/^data:text\/csv/i)) {
+            csv = 'data:text/csv;charset=utf-8,' + csv;
+        }
+        encodedData = encodeURI(csv);
+
+        //link = document.createElement('a');
+        link = document.getElementsByTagName('a');
+        link[0].setAttribute('href', encodedData);
+        link[0].setAttribute('download', filename);
+        //document.body.appendChild(link);
+        link[0].click();
+        //document.body.removeChild(link);
+    }
+}
diff --git a/utils/fetchEntitiesClasses/fetchDataproviders.class.ts b/utils/fetchEntitiesClasses/fetchDataproviders.class.ts
new file mode 100644
index 00000000..1ef9125c
--- /dev/null
+++ b/utils/fetchEntitiesClasses/fetchDataproviders.class.ts
@@ -0,0 +1,291 @@
+import {SearchDataprovidersService} from '../../services/searchDataproviders.service';
+import { ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchUtilsClass } from '../../searchPages/searchUtils/searchUtils.class';
+
+export class FetchDataproviders {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any; public subResults: any;
+  public CSV: any = {  "columnNames":  [ "Title", "Type", "Coutries", "Compatibility" ],
+                        "export":[]
+                     };
+  public CSVDownloaded = false;
+  public csvParams: string;
+
+
+  constructor ( private _searchDataprovidersService: SearchDataprovidersService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+   }
+
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+  public getResultsByKeyword(keyword:string, page: number, size: number){
+    var parameters = "";
+    if(keyword.length > 0){
+      parameters = "q=" + keyword;
+    }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+
+    this.subResults = this._searchDataprovidersService.searchDataproviders(parameters,null, page, size,[]).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Content Providers: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //ar errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+        }
+    );
+  }
+
+  public getNumForEntity(entity: string, id:string) {
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+      if(id != "" && entity != "") {
+
+          this._searchDataprovidersService.numOfEntityDataproviders(id, entity).subscribe(
+              data => {
+                  this.searchUtils.totalResults = data;
+
+                  //var errorCodes:ErrorCodes = new ErrorCodes();
+                  this.searchUtils.status = this.errorCodes.DONE;
+                  if(this.searchUtils.totalResults == 0 ){
+                    this.searchUtils.status = this.errorCodes.NONE;
+                  }
+              },
+              err => {
+                  console.log(err);
+                   //TODO check erros (service not available, bad request)
+                  // if( ){
+                  //   this.searchUtils.status = ErrorCodes.ERROR;
+                  // }
+                  //var errorCodes:ErrorCodes = new ErrorCodes();
+                  //this.searchUtils.status = errorCodes.ERROR;
+                  if(err.status == '404') {
+                    this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                  } else if(err.status == '500') {
+                    this.searchUtils.status = this.errorCodes.ERROR;
+                  } else {
+                    this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                  }
+              }
+          );
+      }
+  }
+
+  public getNumForSearch(keyword: string) {
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+      this._searchDataprovidersService.numOfSearchDataproviders(keyword).subscribe(
+          data => {
+              this.searchUtils.totalResults = data;
+              this.searchUtils.status = this.errorCodes.DONE;
+
+              if(this.searchUtils.totalResults == 0) {
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+
+public getResultsForDeposit(id:string, type:string, page: number,  size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  if(id != "") {
+
+      this._searchDataprovidersService.searchDataprovidersForDeposit(id,type, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Dataproviders forDeposit: [id:"+id+", type:"+type+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+public getResultsBySubjectsForDeposit(subject:string, type:string, page: number,  size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+      this._searchDataprovidersService.searchDataProvidersBySubjects(subject,type, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Dataproviders forDeposit: [subject:"+subject+", type:"+type+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+
+}
+  public getResultsForEntity(entity:string, id:string, page: number, size: number){
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+    var parameters = "";
+
+    if(entity == "organization") {
+      parameters = "organizations/"+id;
+    }
+
+    if(parameters != "") {
+
+        this._searchDataprovidersService.searchDataprovidersForEntity(parameters, page, size).subscribe(
+            data => {
+                this.searchUtils.totalResults = data[0];
+                console.info("search Dataproviders for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+                this.results = data[1];
+
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                this.searchUtils.status = this.errorCodes.DONE;
+                if(this.searchUtils.totalResults == 0 ){
+                  this.searchUtils.status = this.errorCodes.NONE;
+                }
+            },
+            err => {
+                console.log(err);
+                 //TODO check erros (service not available, bad request)
+                // if( ){
+                //   this.searchUtils.status = ErrorCodes.ERROR;
+                // }
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                //this.searchUtils.status = errorCodes.ERROR;
+                if(err.status == '404') {
+                  this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                } else if(err.status == '500') {
+                  this.searchUtils.status = this.errorCodes.ERROR;
+                } else {
+                  this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                }
+            }
+        );
+    }
+  }
+
+  public getResultsForDataproviders(id:string, page: number, size: number){
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+    this._searchDataprovidersService.getDataProvidersforEntityRegistry(id, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Dataproviders for Entity Registry: [Id:"+id+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+        }
+    );
+  }
+}
diff --git a/utils/fetchEntitiesClasses/fetchDatasets.class.ts b/utils/fetchEntitiesClasses/fetchDatasets.class.ts
new file mode 100644
index 00000000..9e6916b6
--- /dev/null
+++ b/utils/fetchEntitiesClasses/fetchDatasets.class.ts
@@ -0,0 +1,253 @@
+import {SearchDatasetsService} from '../../services/searchDatasets.service';
+import { ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchUtilsClass } from '../../searchPages/searchUtils/searchUtils.class';
+import {DOI} from '../../utils/string-utils.class';
+import {Subject} from 'rxjs/Subject';
+
+export class FetchDatasets{
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public requestComplete: Subject<void>;
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  private sub: any;
+  private subResults: any;
+
+  public csvParams: string;
+
+  constructor ( private _searchDatasetsService: SearchDatasetsService ) {
+
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+    this.requestComplete = new Subject<void>();
+  }
+
+
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+
+  public getResultsByKeyword(keyword:string,  page: number, size: number){
+    var parameters = "";
+    if(keyword.length > 0){
+      var DOIs:string[] = DOI.getDOIsFromString(keyword);
+      var doisParams = "";
+
+      for(var i =0 ;i < DOIs.length; i++){
+        doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+      }
+      if(doisParams.length > 0){
+        parameters += "&"+doisParams;
+      }else{
+        parameters = "q=" + keyword;
+      }
+    }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+    this.subResults = this._searchDatasetsService.searchDatasets(parameters,null, page, size, []).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Research Data: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+         },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+         }
+    );
+  }
+
+public getNumForEntity(entity:string, id:string){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+
+    if(id != "" && entity != "") {
+        this._searchDatasetsService.numOfEntityDatasets(id, entity).subscribe(
+            data => {
+                this.searchUtils.totalResults = data;
+
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                this.searchUtils.status = this.errorCodes.DONE;
+                if(this.searchUtils.totalResults == 0 ){
+                  this.searchUtils.status = this.errorCodes.NONE;
+                }
+            },
+            err => {
+                console.log(err);
+                 //TODO check erros (service not available, bad request)
+                // if( ){
+                //   this.searchUtils.status = ErrorCodes.ERROR;
+                // }
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                //this.searchUtils.status = errorCodes.ERROR;
+                if(err.status == '404') {
+                  this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                } else if(err.status == '500') {
+                  this.searchUtils.status = this.errorCodes.ERROR;
+                } else {
+                  this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                }
+            }
+        );
+    }
+}
+
+public getResultsForEntity(entity:string, id:string, page: number, size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  var parameters = "";
+
+  if(entity == "project") {
+    parameters = "projects/"+id;
+  }
+
+  if(parameters != "") {
+
+      this._searchDatasetsService.searchDatasetsForEntity(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Research Data for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResultsForDataproviders(id:string, resultsFrom:string, page: number, size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  var parameters;
+  if(resultsFrom == "collectedFrom") {
+      parameters = "datasets?fq=collectedfromdatasourceid exact "+'"'+id+'"';
+  } else if(resultsFrom == "hostedBy") {
+      parameters = "datasets?fq=resulthostingdatasourceid exact "+'"'+id+'"';
+  }
+
+  if(parameters != "") {
+
+      this._searchDatasetsService.searchDatasetsForDataproviders(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Research Data for Dataproviders: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getAggregatorResults(id:string, page: number, size: number){
+  //var errorCodes:ErrorCodes = new ErrorCodes();
+  this.searchUtils.status = this.errorCodes.LOADING;
+
+  this.subResults = this._searchDatasetsService.searchAggregators(id, '&fq=collectedfromdatasourceid exact "'+id+'"',"&refine=true&fields=resulthostingdatasource" , page, size).subscribe(
+      data => {
+          this.results = data;
+          this.searchUtils.totalResults = this.results.length;
+
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          this.searchUtils.status = this.errorCodes.DONE;
+          if(this.searchUtils.totalResults == 0 ){
+            this.searchUtils.status = this.errorCodes.NONE;
+          }
+
+          this.requestComplete.complete();
+      },
+      err => {
+          console.log(err);
+          console.info("status: "+err.status);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          //this.searchUtils.status = errorCodes.ERROR;
+          if(err.status == '404') {
+            this.searchUtils.status = this.errorCodes.NOT_FOUND;
+          } else if(err.status == '500') {
+            this.searchUtils.status = this.errorCodes.ERROR;
+          } else {
+            this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+          }
+
+          this.requestComplete.complete();
+      }
+  );
+}
+
+}
diff --git a/utils/fetchEntitiesClasses/fetchOrganizations.class.ts b/utils/fetchEntitiesClasses/fetchOrganizations.class.ts
new file mode 100644
index 00000000..07cb4c61
--- /dev/null
+++ b/utils/fetchEntitiesClasses/fetchOrganizations.class.ts
@@ -0,0 +1,76 @@
+ import {SearchOrganizationsService} from '../../services/searchOrganizations.service';
+ import { ErrorCodes} from '../../utils/properties/openaireProperties';
+ import {SearchUtilsClass } from '../../searchPages/searchUtils/searchUtils.class';
+
+export class FetchOrganizations {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  public sub: any;
+  public subResults: any;
+
+
+
+  constructor ( private _searchOrganizationsService: SearchOrganizationsService ) {
+
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  }
+
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+
+    public getResultsByKeyword(keyword:string , page: number, size: number){
+      var parameters = "";
+      if(keyword.length > 0){
+        parameters = "q=" + keyword;
+      }
+
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+      this.subResults = this._searchOrganizationsService.searchOrganizations(parameters, null, page, size, []).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Organizations: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+           },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+           }
+      );
+    }
+
+
+}
diff --git a/utils/fetchEntitiesClasses/fetchProjects.class.ts b/utils/fetchEntitiesClasses/fetchProjects.class.ts
new file mode 100644
index 00000000..d31a3232
--- /dev/null
+++ b/utils/fetchEntitiesClasses/fetchProjects.class.ts
@@ -0,0 +1,209 @@
+import {SearchProjectsService} from '../../services/searchProjects.service';
+import {ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchUtilsClass } from '../../searchPages/searchUtils/searchUtils.class';
+
+export class FetchProjects{
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+
+  public filters; // for getResultsForOrganizations
+  public funders:any = [];  // for getResultsForOrganizations // this is filled with the initial query - before filtering
+
+  public sub: any;
+  public subResults: any;
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+
+
+  constructor (private _searchProjectsService: SearchProjectsService) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  }
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+  public getResultsByKeyword(keyword:string,  page: number, size: number){
+    var parameters = "";
+    if(keyword.length > 0){
+      parameters = "q=" + keyword;
+    }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  this.subResults = this._searchProjectsService.searchProjects(parameters, null, page, size, []).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Projects: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+             //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+         },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+         }
+    );
+  }
+
+  public getResultsForDataproviders(id:string, page: number, size: number){
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+    this._searchProjectsService.getProjectsforDataProvider(id, page, size).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Projects for Dataproviders: [Id:"+id+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+        }
+    );
+  }
+
+  public getNumForEntity(entity: string, id:string) {
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+      if(id != "" && entity != "") {
+
+          this._searchProjectsService.numOfEntityProjects(id, entity).subscribe(
+              data => {
+                  this.searchUtils.totalResults = data;
+
+                  //var errorCodes:ErrorCodes = new ErrorCodes();
+                  this.searchUtils.status = this.errorCodes.DONE;
+                  if(this.searchUtils.totalResults == 0 ){
+                    this.searchUtils.status = this.errorCodes.NONE;
+                  }
+              },
+              err => {
+                  console.log(err);
+                   //TODO check erros (service not available, bad request)
+                  // if( ){
+                  //   this.searchUtils.status = ErrorCodes.ERROR;
+                  // }
+                  //var errorCodes:ErrorCodes = new ErrorCodes();
+                  //this.searchUtils.status = errorCodes.ERROR;
+
+                  if(err.status == '404') {
+                    this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                  } else if(err.status == '500') {
+                    this.searchUtils.status = this.errorCodes.ERROR;
+                  } else {
+                    this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                  }
+              }
+          );
+      }
+  }
+
+  public getResultsForOrganizations(organizationId:string, filterquery:string, page: number, size: number, refineFields:string[]){
+      //var errorCodes:ErrorCodes = new ErrorCodes();
+      this.searchUtils.status = this.errorCodes.LOADING;
+
+    this._searchProjectsService.getProjectsForOrganizations(organizationId,filterquery, page, size,refineFields).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0]; // the results can be filtered so this number can be no total results
+            console.info("search Projects for Organization: [Id:"+organizationId+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+            if(refineFields && refineFields.length > 0){
+              this.filters = data[2];
+              filterquery = decodeURIComponent(filterquery);
+              for(var i = 0; i < this.filters.length; i++){
+                if(filterquery.indexOf(this.filters[i].filterId) !== -1){
+                  console.log("this.filters[i].filterId:"+this.filters[i].filterId);
+                  for(var j = 0; j < this.filters[i].values.length; j++){
+                    console.log("this.filters[i].values[j].id:"+this.filters[i].values[j].id);
+                      if(filterquery.indexOf(this.filters[i].values[j].id) !== -1){
+                        this.filters[i].values[j].selected = true;
+                      }
+                  }
+                }
+              }
+            }
+
+            if(filterquery == ""){
+              this.searchUtils.totalResultsNoFilters = this.searchUtils.totalResults;
+              this.funders = [];
+              for(var i = 0; i < this.filters.length; i++){
+                console.log("this.filters[i].filterId:"+this.filters[i].filterId);
+                if(this.filters[i].filterId == "funder"){
+                   this.funders = (this.filters[i].values);
+
+                }
+              }
+              console.log("  this.funders:"+   this.funders);
+
+            }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+        },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+        }
+    );
+  }
+
+
+}
diff --git a/utils/fetchEntitiesClasses/fetchPublications.class.ts b/utils/fetchEntitiesClasses/fetchPublications.class.ts
new file mode 100644
index 00000000..c2993f70
--- /dev/null
+++ b/utils/fetchEntitiesClasses/fetchPublications.class.ts
@@ -0,0 +1,233 @@
+
+import {SearchPublicationsService} from '../../services/searchPublications.service';
+import {ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchFields, FieldDetails} from '../../utils/properties/searchFields';
+ import {SearchUtilsClass } from '../../searchPages/searchUtils/searchUtils.class';
+import {DOI} from '../../utils/string-utils.class';
+import {Subject} from 'rxjs/Subject';
+
+export class FetchPublications {
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+
+  public requestComplete: Subject<void>;
+
+  // public filters =[];
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  // public baseUrl:string = "";
+  public sub: any;
+  public subResults: any;
+  public searchFields:SearchFields = new SearchFields();
+  // public refineFields: string[] =  this.searchFields.RESULT_REFINE_FIELDS;
+  // public fieldIdsMap=this.searchFields.RESULT_FIELDS;
+    //:  { [key:string] :{ name:string, operator:string, type:string, indexField:string, equalityOperator:string  }} = this.searchFields.PUBLICATION_FIELDS_MAP;
+
+  public CSV: any = {  "columnNames":  ["Title", "Authors", "Publication Year", "DOI",
+                                       /*"Download From", "Publication type", "Journal",*/
+                                       "Funder", "Project Name (GA Number)", "Access"],
+                      "export":[]
+                  };
+  public CSVDownloaded = false;
+  public csvParams: string;
+
+  constructor ( private _searchPublicationsService: SearchPublicationsService ) {
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+    // this.baseUrl = OpenaireProperties.getLinkToSearchPublications();
+
+    this.requestComplete = new Subject<void>();
+  }
+
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+  public getResultsByKeyword(keyword:string,  page: number, size: number){
+    var parameters = "";
+    if(keyword.length > 0){
+      var DOIs:string[] = DOI.getDOIsFromString(keyword);
+      var doisParams = "";
+
+      for(var i =0 ;i < DOIs.length; i++){
+        doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+      }
+      if(doisParams.length > 0){
+        parameters +=  "&"+doisParams;
+      }else{
+        parameters = "q=" + keyword;
+      }
+    }
+
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+    this.subResults = this._searchPublicationsService.searchPublications(parameters,null, page, size, []).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Publications: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+         },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+        }
+    );
+  }
+
+public getResultsForEntity(entity:string, id:string, page: number, size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  var parameters = "";
+  if(entity == "project") {
+    parameters = "projects/"+id;
+  } else if(entity == "organization") {
+    parameters = "organizations/"+id;
+  }
+
+  if(parameters != "") {
+      this._searchPublicationsService.searchPublicationsForEntity(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+
+              console.info("search Publications for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResultsForDataproviders(id:string, resultsFrom:string, page: number, size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  var parameters;
+  if(resultsFrom == "collectedFrom") {
+      parameters = "publications?fq=collectedfromdatasourceid exact "+'"'+id+'"';
+  } else if(resultsFrom == "hostedBy") {
+      parameters = "publications?fq=resulthostingdatasourceid exact "+'"'+id+'"';
+  }
+
+  if(parameters != "") {
+
+      this._searchPublicationsService.searchPublicationsForDataproviders(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Publications for Dataproviders: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getAggregatorResults(id:string, page: number, size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  this.subResults = this._searchPublicationsService.searchAggregators(id, '&fq=collectedfromdatasourceid exact "'+id+'"',"&refine=true&fields=resulthostingdatasource" , page, size).subscribe(
+      data => {
+          this.results = data;
+          this.searchUtils.totalResults = this.results.length;
+
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          this.searchUtils.status = this.errorCodes.DONE;
+          if(this.searchUtils.totalResults == 0 ){
+            this.searchUtils.status = this.errorCodes.NONE;
+          }
+
+          this.requestComplete.complete();
+      },
+      err => {
+          console.log(err);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          //this.searchUtils.status = errorCodes.ERROR;
+          if(err.status == '404') {
+            this.searchUtils.status = this.errorCodes.NOT_FOUND;
+          } else if(err.status == '500') {
+            this.searchUtils.status = this.errorCodes.ERROR;
+          } else {
+            this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+          }
+
+          this.requestComplete.complete();
+      }
+  );
+}
+
+
+}
diff --git a/utils/fetchEntitiesClasses/fetchSoftware.class.ts b/utils/fetchEntitiesClasses/fetchSoftware.class.ts
new file mode 100644
index 00000000..9dbc37d6
--- /dev/null
+++ b/utils/fetchEntitiesClasses/fetchSoftware.class.ts
@@ -0,0 +1,253 @@
+import {SearchSoftwareService} from '../../services/searchSoftware.service';
+import { ErrorCodes} from '../../utils/properties/openaireProperties';
+import {SearchUtilsClass } from '../../searchPages/searchUtils/searchUtils.class';
+import {DOI} from '../../utils/string-utils.class';
+import {Subject} from 'rxjs/Subject';
+
+export class FetchSoftware{
+  private errorCodes: ErrorCodes;
+
+  public results =[];
+  public requestComplete: Subject<void>;
+
+  public searchUtils:SearchUtilsClass = new SearchUtilsClass();
+  private sub: any;
+  private subResults: any;
+
+  public csvParams: string;
+
+  constructor ( private _searchSoftwareService: SearchSoftwareService ) {
+
+    this.errorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+    this.requestComplete = new Subject<void>();
+  }
+
+
+
+  public ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+    if(this.subResults){
+      this.subResults.unsubscribe();
+    }
+  }
+
+
+  public getResultsByKeyword(keyword:string,  page: number, size: number){
+    var parameters = "";
+    if(keyword.length > 0){
+      var DOIs:string[] = DOI.getDOIsFromString(keyword);
+      var doisParams = "";
+
+      for(var i =0 ;i < DOIs.length; i++){
+        doisParams+=(doisParams.length > 0?"&":"")+'doi="'+ DOIs[i]+'"';
+      }
+      if(doisParams.length > 0){
+        parameters += "&"+doisParams;
+      }else{
+        parameters = "q=" + keyword;
+      }
+    }
+
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+    this.subResults = this._searchSoftwareService.searchSoftware(parameters,null, page, size, []).subscribe(
+        data => {
+            this.searchUtils.totalResults = data[0];
+            console.info("search Software: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+            this.results = data[1];
+
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            this.searchUtils.status = this.errorCodes.DONE;
+            if(this.searchUtils.totalResults == 0 ){
+              this.searchUtils.status = this.errorCodes.NONE;
+            }
+         },
+        err => {
+            console.log(err);
+             //TODO check erros (service not available, bad request)
+            // if( ){
+            //   this.searchUtils.status = ErrorCodes.ERROR;
+            // }
+            //var errorCodes:ErrorCodes = new ErrorCodes();
+            //this.searchUtils.status = errorCodes.ERROR;
+            if(err.status == '404') {
+              this.searchUtils.status = this.errorCodes.NOT_FOUND;
+            } else if(err.status == '500') {
+              this.searchUtils.status = this.errorCodes.ERROR;
+            } else {
+              this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+            }
+         }
+    );
+  }
+
+public getNumForEntity(entity:string, id:string){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+
+    if(id != "" && entity != "") {
+        this._searchSoftwareService.numOfEntitySoftware(id, entity).subscribe(
+            data => {
+                this.searchUtils.totalResults = data;
+
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                this.searchUtils.status = this.errorCodes.DONE;
+                if(this.searchUtils.totalResults == 0 ){
+                  this.searchUtils.status = this.errorCodes.NONE;
+                }
+            },
+            err => {
+                console.log(err);
+                 //TODO check erros (service not available, bad request)
+                // if( ){
+                //   this.searchUtils.status = ErrorCodes.ERROR;
+                // }
+                //var errorCodes:ErrorCodes = new ErrorCodes();
+                //this.searchUtils.status = errorCodes.ERROR;
+                if(err.status == '404') {
+                  this.searchUtils.status = this.errorCodes.NOT_FOUND;
+                } else if(err.status == '500') {
+                  this.searchUtils.status = this.errorCodes.ERROR;
+                } else {
+                  this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+                }
+            }
+        );
+    }
+}
+
+public getResultsForEntity(entity:string, id:string, page: number, size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  var parameters = "";
+
+  if(entity == "project") {
+    parameters = "projects/"+id;
+  }
+
+  if(parameters != "") {
+
+      this._searchSoftwareService.searchSoftwareForEntity(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Software for "+entity+": [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getResultsForDataproviders(id:string, resultsFrom:string, page: number, size: number){
+    //var errorCodes:ErrorCodes = new ErrorCodes();
+    this.searchUtils.status = this.errorCodes.LOADING;
+
+  var parameters;
+  if(resultsFrom == "collectedFrom") {
+      parameters = "software?fq=collectedfromdatasourceid exact "+'"'+id+'"';
+  } else if(resultsFrom == "hostedBy") {
+      parameters = "software?fq=resulthostingdatasourceid exact "+'"'+id+'"';
+  }
+
+  if(parameters != "") {
+
+      this._searchSoftwareService.searchSoftwareForDataproviders(parameters, page, size).subscribe(
+          data => {
+              this.searchUtils.totalResults = data[0];
+              console.info("search Software for Dataproviders: [Parameters:"+parameters+" ]  [total results:"+this.searchUtils.totalResults+"]");
+              this.results = data[1];
+
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              this.searchUtils.status = this.errorCodes.DONE;
+              if(this.searchUtils.totalResults == 0 ){
+                this.searchUtils.status = this.errorCodes.NONE;
+              }
+          },
+          err => {
+              console.log(err);
+               //TODO check erros (service not available, bad request)
+              // if( ){
+              //   this.searchUtils.status = ErrorCodes.ERROR;
+              // }
+              //var errorCodes:ErrorCodes = new ErrorCodes();
+              //this.searchUtils.status = errorCodes.ERROR;
+              if(err.status == '404') {
+                this.searchUtils.status = this.errorCodes.NOT_FOUND;
+              } else if(err.status == '500') {
+                this.searchUtils.status = this.errorCodes.ERROR;
+              } else {
+                this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+              }
+          }
+      );
+  }
+}
+
+public getAggregatorResults(id:string, page: number, size: number){
+  //var errorCodes:ErrorCodes = new ErrorCodes();
+  this.searchUtils.status = this.errorCodes.LOADING;
+
+  this.subResults = this._searchSoftwareService.searchAggregators(id, '&fq=collectedfromdatasourceid exact "'+id+'"',"&refine=true&fields=resulthostingdatasource" , page, size).subscribe(
+      data => {
+          this.results = data;
+          this.searchUtils.totalResults = this.results.length;
+
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          this.searchUtils.status = this.errorCodes.DONE;
+          if(this.searchUtils.totalResults == 0 ){
+            this.searchUtils.status = this.errorCodes.NONE;
+          }
+
+          this.requestComplete.complete();
+      },
+      err => {
+          console.log(err);
+          console.info("status: "+err.status);
+           //TODO check erros (service not available, bad request)
+          // if( ){
+          //   this.searchUtils.status = ErrorCodes.ERROR;
+          // }
+          //var errorCodes:ErrorCodes = new ErrorCodes();
+          //this.searchUtils.status = errorCodes.ERROR;
+          if(err.status == '404') {
+            this.searchUtils.status = this.errorCodes.NOT_FOUND;
+          } else if(err.status == '500') {
+            this.searchUtils.status = this.errorCodes.ERROR;
+          } else {
+            this.searchUtils.status = this.errorCodes.NOT_AVAILABLE;
+          }
+
+          this.requestComplete.complete();
+      }
+  );
+}
+
+}
diff --git a/utils/helper/helper.component.ts b/utils/helper/helper.component.ts
new file mode 100644
index 00000000..66c3c70c
--- /dev/null
+++ b/utils/helper/helper.component.ts
@@ -0,0 +1,47 @@
+import { Component, Input } from '@angular/core';
+import 'rxjs/Rx';
+import {HelperService} from './helper.service';
+import {OpenaireProperties} from '../properties/openaireProperties';
+
+@Component({
+  selector: 'helper',
+  template: `
+  <div *ngIf=" texts  && texts.length > 0" [ngClass]=styleName>
+    <div *ngFor="let text of texts " [innerHTML]="text.content">
+    </div>
+  </div>
+`
+})
+export class HelperComponent {
+  texts=[];
+  @Input() style:boolean = false;
+  @Input() position:string = 'right';
+  @Input() styleName:string = '';
+  sub:any;
+
+  constructor (
+    private _service: HelperService
+  ) {
+  }
+
+  ngOnInit() {
+    if(OpenaireProperties.isHelperEnabled() && location){
+      this.sub = this._service.getHelper(location.pathname).subscribe(
+          data => {
+               this.texts =(data && data.content && data.content[this.position] )? data.content[this.position]:[];
+          },
+          err => {
+              console.log(err);
+
+          }
+      );
+    }
+  }
+  ngOnDestroy() {
+    if(this.sub){
+      this.sub.unsubscribe();
+    }
+  }
+
+
+}
diff --git a/utils/helper/helper.module.ts b/utils/helper/helper.module.ts
new file mode 100644
index 00000000..93752d19
--- /dev/null
+++ b/utils/helper/helper.module.ts
@@ -0,0 +1,25 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+// import {  RouterModule } from "@angular/router";
+
+import {HelperComponent} from './helper.component';
+// import {HelperServiceModule} from './helperService.module';
+import {HelperService} from './helper.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+    //  RouterModule//,HelperServiceModule
+  ],
+  declarations: [
+    HelperComponent
+  ],
+  providers:[HelperService],
+  exports: [
+    HelperComponent
+    ]
+})
+export class HelperModule{ }
diff --git a/utils/helper/helper.service.ts b/utils/helper/helper.service.ts
new file mode 100644
index 00000000..013ad903
--- /dev/null
+++ b/utils/helper/helper.service.ts
@@ -0,0 +1,26 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+import { OpenaireProperties  } from '../../utils/properties/openaireProperties';
+
+@Injectable()
+export class HelperService {
+    constructor(private http: Http ) {}
+
+    getHelper (router: string):any {
+        console.info("get router helpText for : "+router);
+
+        let url = OpenaireProperties.getHelperPageUrl() + '?q=' + router;
+
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .map(res => <any> res.json());
+
+    }
+
+
+
+}
diff --git a/utils/helper/helperService.module.ts b/utils/helper/helperService.module.ts
new file mode 100644
index 00000000..475fd82d
--- /dev/null
+++ b/utils/helper/helperService.module.ts
@@ -0,0 +1,20 @@
+import { NgModule}            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {HelperService} from './helper.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+  ],
+  providers:[
+  HelperService
+],
+  exports: [
+    ]
+})
+export class HelperServiceModule { }
diff --git a/utils/iframe.component.ts b/utils/iframe.component.ts
new file mode 100644
index 00000000..302f6431
--- /dev/null
+++ b/utils/iframe.component.ts
@@ -0,0 +1,21 @@
+import {Component, ElementRef, Input} from '@angular/core';
+import { SafeResourceUrl, DomSanitizer } from '@angular/platform-browser';
+//Usage :: <i-frame [url]="url" width="30%" height="250"></i-frame>`
+@Component({
+  selector: 'i-frame',
+  template: `
+    <iframe [width]="width" [height]="height" [src]="safeUrl"></iframe>
+  `
+})
+export class IFrameComponent {
+  public safeUrl: SafeResourceUrl;
+  @Input() url ;
+  @Input() width = '100%';
+  @Input() height = '300';
+  constructor(private sanitizer: DomSanitizer) {
+  }
+  ngOnInit() {
+    this.safeUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.url);
+    console.info("URL:" + this.safeUrl);
+  }
+}
diff --git a/utils/iframe.module.ts b/utils/iframe.module.ts
new file mode 100644
index 00000000..702e5ab5
--- /dev/null
+++ b/utils/iframe.module.ts
@@ -0,0 +1,19 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {IFrameComponent} from './iframe.component';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule
+  ],
+  declarations: [
+     IFrameComponent
+  ],
+  exports: [
+      IFrameComponent
+    ]
+})
+export class IFrameModule { }
diff --git a/utils/metaTags/openaireMetaTags.class.ts b/utils/metaTags/openaireMetaTags.class.ts
new file mode 100644
index 00000000..3b78aa42
--- /dev/null
+++ b/utils/metaTags/openaireMetaTags.class.ts
@@ -0,0 +1,21 @@
+import {Meta} from '../../../angular2-meta';
+
+export class OpenaireMetaTags{
+
+  constructor (private _meta: Meta ) {
+  }
+
+  updateDescription(description:string){
+    this._meta.updateMeta("description", description);
+    this._meta.updateProperty("og:description", description);
+  }
+  updateTitle(title:string){
+    var _prefix ="OpenAIRE | ";
+    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
+    this._meta.setTitle(_title );
+    this._meta.updateProperty("og:title",_title);
+  }
+  updateUrl(url:string){
+    this._meta.updateProperty("og:url", url);
+  }
+}
diff --git a/utils/modal/alert.ts b/utils/modal/alert.ts
new file mode 100644
index 00000000..c7155cd8
--- /dev/null
+++ b/utils/modal/alert.ts
@@ -0,0 +1,111 @@
+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]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'" uk-modal  [open]="!isOpen" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+    <div class="uk-modal-dialog  uk-modal-body" role="">
+         <div class="uk-modal-title" [hidden]=!alertHeader>
+        <a href="" class="uk-modal-close uk-close uk-float-right" (click)='cancel()' ></a>
+           <h4 class="modal-title text-center" id="myModalLabel">{{alertTitle}}</h4>
+        </div>
+        <div class="uk-margin  ">
+          <div [hidden]=!alertMessage>
+          {{message}}
+          </div>
+        </div>
+        <div class="  uk-text-right" [hidden]=!alertFooter>
+        <span [hidden]=!okButton >
+          <button class=" uk-button uk-button-default  " (click)="ok()">{{okButtonText}}</button>
+          </span>
+          <span [hidden]=!cancelButton>
+          <button class=" uk-button uk-button-default" (click)="cancel()">{{cancelButtonText}}</button>
+          </span>
+        </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;
+  }
+}
diff --git a/utils/modal/alertModal.module.ts b/utils/modal/alertModal.module.ts
new file mode 100644
index 00000000..d39e168d
--- /dev/null
+++ b/utils/modal/alertModal.module.ts
@@ -0,0 +1,17 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {AlertModal} from './alert';
+import {ModalModule} from './modal.module';
+
+@NgModule({
+  imports: [ CommonModule, FormsModule, ModalModule ],
+  declarations: [
+    AlertModal
+  ],
+  exports: [
+    AlertModal
+  ]
+})
+export class AlertModalModule { }
diff --git a/utils/modal/loading.component.ts b/utils/modal/loading.component.ts
new file mode 100644
index 00000000..55a5501e
--- /dev/null
+++ b/utils/modal/loading.component.ts
@@ -0,0 +1,56 @@
+import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmitter, Output} from '@angular/core';
+
+@Component({
+  selector: 'modal-loading',
+  template: `
+  <!--uk-modal="center:true"-->
+  <div [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'"   [open]="!isOpen"    tabindex="-1" role="dialog" >
+    <div class="uk-modal-dialog" role="">
+      <!--div class="modal-content"-->
+
+        <div class="uk-modal-body">
+          <div >
+          <h3 class="text-center" >{{message}}</h3>
+          <div class="uk-modal-spinner"></div>
+          </div>
+        </div>
+
+      </div>
+    <!--/div-->
+  </div>
+  <!--div   class="uk-modal uk-open" aria-hidden="false" style="display: block; overflow-y: scroll;">
+                            <div class="uk-modal-dialog" tabindex="">
+                                <div class="uk-modal-spinner"></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;
+  }
+}
diff --git a/utils/modal/loadingModal.module.ts b/utils/modal/loadingModal.module.ts
new file mode 100644
index 00000000..6edf5c4a
--- /dev/null
+++ b/utils/modal/loadingModal.module.ts
@@ -0,0 +1,19 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+ import {ModalLoading} from './loading.component';
+import {ModalModule} from './modal.module';
+
+//helpers
+
+@NgModule({
+  imports: [ CommonModule, FormsModule,ModalModule  ],
+  declarations: [
+    ModalLoading
+  ],
+  exports: [
+   ModalLoading
+  ]
+})
+export class LoadingModalModule { }
diff --git a/utils/modal/modal.module.ts b/utils/modal/modal.module.ts
new file mode 100644
index 00000000..fd48478c
--- /dev/null
+++ b/utils/modal/modal.module.ts
@@ -0,0 +1,13 @@
+/*  common components of modal components */
+import { NgModule } from '@angular/core';
+import {Open} from './open.component';
+@NgModule({
+  imports: [  ],
+  declarations: [
+      Open
+  ],
+  exports: [
+    Open
+  ]
+})
+export class ModalModule { }
diff --git a/utils/modal/open.component.ts b/utils/modal/open.component.ts
new file mode 100644
index 00000000..fb9f011e
--- /dev/null
+++ b/utils/modal/open.component.ts
@@ -0,0 +1,57 @@
+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')
+  public display:string;
+  @HostBinding('class.in')
+  @HostBinding('attr.aria-expanded')
+  public isExpanded:boolean = true;
+
+  @Input()
+  public set open(value:boolean) {
+    this.isExpanded = value;
+    this.toggle();
+  }
+
+  public 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() {
+      if (typeof document !== 'undefined') {
+        // let backDrop = document.createElement('div');
+        // backDrop.className="modal-backdrop fade in";
+        // document.body.appendChild(backDrop);
+      }
+    this.isExpanded = true;
+    this.display = 'block';
+  }
+}
diff --git a/utils/modal/selectModal.component.ts b/utils/modal/selectModal.component.ts
new file mode 100644
index 00000000..78330b76
--- /dev/null
+++ b/utils/modal/selectModal.component.ts
@@ -0,0 +1,79 @@
+import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmitter, Output} from '@angular/core';
+
+@Component({
+  selector: 'modal-select',
+  template: `
+  <div [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'"   [open]="!isOpen"  uk-modal="center:true" tabindex="-1" role="dialog" >
+    <div class="uk-modal-dialog" role="">
+      <div class="modal-content">
+
+        <div class="modal-body">
+          <div >
+          <h3 class="text-center" >{{message}}</h3>
+          <!--div class="uk-button-default -select uk-active" data--select="">
+            <span class=""></span>
+            <i class="uk-icon-caret-down"></i>
+            <select (change)="selected=$event.target.value">
+                <option *ngFor="let option of options" value="option">aa</option>
+            </select>
+          </div-->
+
+          <div class="-select" data--select>
+            <span></span>
+            <select (change)="selected=$event.target.value">
+                <option *ngFor="let option of options let i=index" value="{{option}}">{{option}}</option>
+            </select>
+          </div>
+
+          <div class="uk-modal-footer uk-text-right">
+            <button class=" uk-button uk-button-default" (click)="close()">Proceed</button>
+          </div>
+        </div>
+
+      </div>
+    </div>
+  </div>
+  <!--div   class="uk-modal uk-open" aria-hidden="false" style="display: block; overflow-y: scroll;">
+                            <div class="uk-modal-dialog" tabindex="">
+                                <div class="uk-modal-spinner"></div>
+                            </div>
+                        </div-->
+  `,
+  encapsulation: ViewEncapsulation.None,
+})
+/**
+  * API to an open alert window.
+  */
+export class ModalSelect{
+
+@Input() public message:string ="Loading";
+@Input() public options:string[] = [];
+
+public selected: string;
+
+  /**
+    * 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;
+    if(!this.selected) {
+      this.selected = this.options[0];
+    }
+    this.alertOutput.emit(this.selected);
+  }
+
+}
diff --git a/utils/modal/selectModal.module.ts b/utils/modal/selectModal.module.ts
new file mode 100644
index 00000000..971a7dd7
--- /dev/null
+++ b/utils/modal/selectModal.module.ts
@@ -0,0 +1,19 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+ import {ModalSelect} from './selectModal.component';
+import {ModalModule} from './modal.module';
+
+//helpers
+
+@NgModule({
+  imports: [ CommonModule, FormsModule,ModalModule  ],
+  declarations: [
+    ModalSelect
+  ],
+  exports: [
+   ModalSelect
+  ]
+})
+export class SelectModalModule { }
diff --git a/utils/my-date-picker/directives/my-date-picker.focus.directive.ts b/utils/my-date-picker/directives/my-date-picker.focus.directive.ts
new file mode 100644
index 00000000..5508ea6c
--- /dev/null
+++ b/utils/my-date-picker/directives/my-date-picker.focus.directive.ts
@@ -0,0 +1,26 @@
+import { Directive, ElementRef, Renderer, AfterViewInit, Input } from "@angular/core";
+
+@Directive({
+    selector: "[mydpfocus]"
+})
+
+export class FocusDirective implements AfterViewInit {
+    @Input("mydpfocus") value: string;
+
+    constructor(private el: ElementRef, private renderer: Renderer) {}
+
+    // Focus to element: if value 0 = don't set focus, 1 = set only focus, 2 = set focus and set cursor position
+    ngAfterViewInit() {
+        if (this.value === "0") {
+            return;
+        }
+
+        this.renderer.invokeElementMethod(this.el.nativeElement, "focus", []);
+
+        // Set cursor position at the end of text if input element
+        if (this.value === "2") {
+            let len = this.el.nativeElement.value.length;
+            this.el.nativeElement.setSelectionRange(len, len);
+        }
+    }
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/directives/my-date-picker.input.auto.fill.directive.ts b/utils/my-date-picker/directives/my-date-picker.input.auto.fill.directive.ts
new file mode 100644
index 00000000..ef1a1501
--- /dev/null
+++ b/utils/my-date-picker/directives/my-date-picker.input.auto.fill.directive.ts
@@ -0,0 +1,69 @@
+import { Directive, ElementRef, Renderer, Input, HostListener } from "@angular/core";
+import { IMyInputAutoFill } from "../interfaces/my-input-auto-fill.interface";
+
+@Directive({
+    selector: "[myinputautofill]"
+})
+
+export class InputAutoFillDirective {
+    @Input("myinputautofill") opts: IMyInputAutoFill;
+
+    constructor(private el: ElementRef, private rndr: Renderer) {}
+
+    @HostListener("keyup", ["$event"]) onKeyUp(evt: KeyboardEvent) {
+        if (!this.opts.enabled || evt.keyCode === 8 || evt.keyCode === 46) {
+            return;
+        }
+
+        let val: string = this.getInputValue();
+        let ews: boolean = this.endsWith(val, this.opts.separator);
+        let parts: Array<string> = val.split(this.opts.separator);
+        let idx: number = parts.length - 1;
+
+        if (val.indexOf(this.opts.separator + this.opts.separator) !== -1) {
+            return;
+        }
+
+        if (!ews && (val.length === this.getPartLength(0) || val.length === this.getPartLength(0) + this.getPartLength(1) + this.opts.separator.length)) {
+            this.setInputValue(val + this.opts.separator);
+        }
+        else if (ews && parts[idx - 1].length < this.getPartLength(idx - 1) && this.isNumber(parts[idx - 1]) && (this.isDay(idx - 1) || this.isMonth(idx - 1))) {
+            this.setInputValue(this.insertPos(val, val.length - 2, "0"));
+        }
+        else if (parts[idx].length < this.getPartLength(idx) && this.isNumber(parts[idx]) && (Number(parts[idx]) > 3 && this.isDay(idx) || Number(parts[idx]) > 1 && this.isMonth(idx))) {
+            this.setInputValue(this.insertPos(val, val.length - 1, "0") + (idx < 2 ? this.opts.separator : ""));
+        }
+    }
+
+    private endsWith(val: string, suffix: string): boolean {
+        return val.indexOf(suffix, val.length - suffix.length) !== -1;
+    }
+
+    private insertPos(str: string, idx: number, val: string): string {
+        return str.substr(0, idx) + val + str.substr(idx);
+    }
+
+    private getPartLength(idx: number): number {
+        return this.opts.formatParts[idx].length;
+    }
+
+    private isNumber(val: string): boolean {
+        return val.match(/[1-9]/) !== null;
+    }
+
+    private isDay(idx: number): boolean {
+        return this.opts.formatParts[idx].indexOf("d") !== -1;
+    }
+
+    private isMonth(idx: number): boolean {
+        return this.opts.formatParts[idx].indexOf("m") !== -1 && this.opts.formatParts[idx].length === 2;
+    }
+
+    private getInputValue(): string {
+        return this.el.nativeElement.value;
+    }
+
+    private setInputValue(val: string): void {
+        this.rndr.setElementProperty(this.el.nativeElement, "value", val);
+    }
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/index.ts b/utils/my-date-picker/index.ts
new file mode 100644
index 00000000..55613d2b
--- /dev/null
+++ b/utils/my-date-picker/index.ts
@@ -0,0 +1,7 @@
+export * from "./services/my-date-picker.locale.service";
+export * from "./services/my-date-picker.util.service";
+export * from "./directives/my-date-picker.focus.directive";
+export * from "./directives/my-date-picker.input.auto.fill.directive";
+export * from "./my-date-picker.component";
+export * from "./my-date-picker.module";
+export * from "./interfaces/index";
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/index.ts b/utils/my-date-picker/interfaces/index.ts
new file mode 100644
index 00000000..ab34b252
--- /dev/null
+++ b/utils/my-date-picker/interfaces/index.ts
@@ -0,0 +1,15 @@
+export * from "./my-date.interface";
+export * from "./my-date-range.interface";
+export * from "./my-day-labels.interface";
+export * from "./my-month-labels.interface";
+export * from "./my-month.interface";
+export * from "./my-calendar-day.interface";
+export * from "./my-week.interface";
+export * from "./my-options.interface";
+export * from "./my-locale.interface";
+export * from "./my-date-model.interface";
+export * from "./my-input-field-changed.interface";
+export * from "./my-input-focus-blur.interface";
+export * from "./my-weekday.interface";
+export * from "./my-calendar-view-changed.interface";
+export * from "./my-input-auto-fill.interface";
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/my-calendar-day.interface.ts b/utils/my-date-picker/interfaces/my-calendar-day.interface.ts
new file mode 100644
index 00000000..d554243a
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-calendar-day.interface.ts
@@ -0,0 +1,9 @@
+import { IMyDate } from "./my-date.interface";
+
+export interface IMyCalendarDay {
+    dateObj: IMyDate;
+    cmo: number;
+    currDay: boolean;
+    dayNbr: number;
+    disabled: boolean;
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/my-calendar-view-changed.interface.ts b/utils/my-date-picker/interfaces/my-calendar-view-changed.interface.ts
new file mode 100644
index 00000000..9b9baa5e
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-calendar-view-changed.interface.ts
@@ -0,0 +1,8 @@
+import { IMyWeekday } from "./my-weekday.interface";
+
+export interface IMyCalendarViewChanged {
+    year: number;
+    month: number;
+    first: IMyWeekday;
+    last: IMyWeekday;
+}
diff --git a/utils/my-date-picker/interfaces/my-date-model.interface.ts b/utils/my-date-picker/interfaces/my-date-model.interface.ts
new file mode 100644
index 00000000..35aa7535
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-date-model.interface.ts
@@ -0,0 +1,8 @@
+import { IMyDate } from "./my-date.interface";
+
+export interface IMyDateModel {
+    date: IMyDate;
+    jsdate: Date;
+    formatted: string;
+    epoc: number;
+}
diff --git a/utils/my-date-picker/interfaces/my-date-range.interface.ts b/utils/my-date-picker/interfaces/my-date-range.interface.ts
new file mode 100644
index 00000000..e24b319b
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-date-range.interface.ts
@@ -0,0 +1,6 @@
+import { IMyDate } from "./my-date.interface";
+
+export interface IMyDateRange {
+    begin: IMyDate;
+    end: IMyDate;
+}
diff --git a/utils/my-date-picker/interfaces/my-date.interface.ts b/utils/my-date-picker/interfaces/my-date.interface.ts
new file mode 100644
index 00000000..99f00796
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-date.interface.ts
@@ -0,0 +1,5 @@
+export interface IMyDate {
+    year: number;
+    month: number;
+    day: number;
+}
diff --git a/utils/my-date-picker/interfaces/my-day-labels.interface.ts b/utils/my-date-picker/interfaces/my-day-labels.interface.ts
new file mode 100644
index 00000000..f2fcfa24
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-day-labels.interface.ts
@@ -0,0 +1,3 @@
+export interface IMyDayLabels {
+    [day: string]: string;
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/my-input-auto-fill.interface.ts b/utils/my-date-picker/interfaces/my-input-auto-fill.interface.ts
new file mode 100644
index 00000000..695afa92
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-input-auto-fill.interface.ts
@@ -0,0 +1,5 @@
+export interface IMyInputAutoFill {
+    separator: string;
+    formatParts: Array<string>;
+    enabled: boolean;
+}
diff --git a/utils/my-date-picker/interfaces/my-input-field-changed.interface.ts b/utils/my-date-picker/interfaces/my-input-field-changed.interface.ts
new file mode 100644
index 00000000..c93530b6
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-input-field-changed.interface.ts
@@ -0,0 +1,5 @@
+export interface IMyInputFieldChanged {
+    value: string;
+    dateFormat: string;
+    valid: boolean;
+}
diff --git a/utils/my-date-picker/interfaces/my-input-focus-blur.interface.ts b/utils/my-date-picker/interfaces/my-input-focus-blur.interface.ts
new file mode 100644
index 00000000..99678cbb
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-input-focus-blur.interface.ts
@@ -0,0 +1,4 @@
+export interface IMyInputFocusBlur {
+    reason: number;
+    value: string;
+}
diff --git a/utils/my-date-picker/interfaces/my-locale.interface.ts b/utils/my-date-picker/interfaces/my-locale.interface.ts
new file mode 100644
index 00000000..25d268ba
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-locale.interface.ts
@@ -0,0 +1,5 @@
+import { IMyOptions } from "./my-options.interface";
+
+export interface IMyLocales {
+    [lang: string]: IMyOptions;
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/my-month-labels.interface.ts b/utils/my-date-picker/interfaces/my-month-labels.interface.ts
new file mode 100644
index 00000000..0eede49b
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-month-labels.interface.ts
@@ -0,0 +1,3 @@
+export interface IMyMonthLabels {
+    [month: number]: string;
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/my-month.interface.ts b/utils/my-date-picker/interfaces/my-month.interface.ts
new file mode 100644
index 00000000..846a23eb
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-month.interface.ts
@@ -0,0 +1,5 @@
+export interface IMyMonth {
+    monthTxt: string;
+    monthNbr: number;
+    year: number;
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/my-options.interface.ts b/utils/my-date-picker/interfaces/my-options.interface.ts
new file mode 100644
index 00000000..89c26bea
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-options.interface.ts
@@ -0,0 +1,48 @@
+import { IMyDayLabels } from "./my-day-labels.interface";
+import { IMyMonthLabels } from "./my-month-labels.interface";
+import { IMyDate } from "./my-date.interface";
+import { IMyDateRange } from "./my-date-range.interface";
+
+export interface IMyOptions {
+    dayLabels?: IMyDayLabels;
+    monthLabels?: IMyMonthLabels;
+    dateFormat?: string;
+    showTodayBtn?: boolean;
+    todayBtnTxt?: string;
+    firstDayOfWeek?: string;
+    sunHighlight?: boolean;
+    markCurrentDay?: boolean;
+    disableUntil?: IMyDate;
+    disableSince?: IMyDate;
+    disableDays?: Array<IMyDate>;
+    enableDays?: Array<IMyDate>;
+    disableDateRange?: IMyDateRange;
+    disableWeekends?: boolean;
+    showWeekNumbers?: boolean;
+    height?: string;
+    width?: string;
+    selectionTxtFontSize?: string;
+    inline?: boolean;
+    showClearDateBtn?: boolean;
+    alignSelectorRight?: boolean;
+    openSelectorTopOfInput?: boolean;
+    indicateInvalidDate?: boolean;
+    editableDateField?: boolean;
+    editableMonthAndYear?: boolean;
+    disableHeaderButtons?: boolean;
+    minYear?: number;
+    maxYear?: number;
+    componentDisabled?: boolean;
+    inputValueRequired?: boolean;
+    showSelectorArrow?: boolean;
+    showInputField?: boolean;
+    openSelectorOnInputClick?: boolean;
+    inputAutoFill?: boolean;
+    ariaLabelInputField?: string;
+    ariaLabelClearDate?: string;
+    ariaLabelOpenCalendar?: string;
+    ariaLabelPrevMonth?: string;
+    ariaLabelNextMonth?: string;
+    ariaLabelPrevYear?: string;
+    ariaLabelNextYear?: string;
+}
diff --git a/utils/my-date-picker/interfaces/my-week.interface.ts b/utils/my-date-picker/interfaces/my-week.interface.ts
new file mode 100644
index 00000000..be7bca16
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-week.interface.ts
@@ -0,0 +1,6 @@
+import { IMyCalendarDay } from "./my-calendar-day.interface";
+
+export interface IMyWeek {
+    week: Array<IMyCalendarDay>;
+    weekNbr: number;
+}
\ No newline at end of file
diff --git a/utils/my-date-picker/interfaces/my-weekday.interface.ts b/utils/my-date-picker/interfaces/my-weekday.interface.ts
new file mode 100644
index 00000000..da1df557
--- /dev/null
+++ b/utils/my-date-picker/interfaces/my-weekday.interface.ts
@@ -0,0 +1,4 @@
+export interface IMyWeekday {
+    number: number;
+    weekday: string;
+}
diff --git a/utils/my-date-picker/my-date-picker.component.css b/utils/my-date-picker/my-date-picker.component.css
new file mode 100644
index 00000000..3c21416d
--- /dev/null
+++ b/utils/my-date-picker/my-date-picker.component.css
@@ -0,0 +1,461 @@
+.mydp {
+    min-width: 30px;
+    border-radius: 2px;
+    line-height: 1.1;
+    display: inline-block;
+    position: relative;
+}
+
+.mydp * {
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    font-family: Arial, Helvetica, sans-serif;
+    padding: 0;
+    margin: 0;
+}
+
+.mydp .selector {
+    margin-top: 2px;
+    margin-left: -1px;
+    position: absolute;
+    width: 252px;
+    padding: 0;
+    border: 1px solid #CCC;
+    border-radius: 2px;
+    z-index: 100;
+    animation: selectorfadein 0.1s;
+}
+
+.mydp .selector:focus {
+    border: 1px solid #ADD8E6;
+    outline: none;
+}
+
+@keyframes selectorfadein {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+.mydp .selectorarrow {
+    background: #FAFAFA;
+    margin-top: 12px;
+    padding: 0;
+}
+
+.mydp .selectorarrow:after,
+.mydp .selectorarrow:before {
+    bottom: 100%;
+    border: solid transparent;
+    content: " ";
+    height: 0;
+    width: 0;
+    position: absolute;
+}
+
+.mydp .selectorarrow:after {
+    border-color: rgba(250, 250, 250, 0);
+    border-bottom-color: #FAFAFA;
+    border-width: 10px;
+    margin-left: -10px;
+}
+
+.mydp .selectorarrow:before {
+    border-color: rgba(204, 204, 204, 0);
+    border-bottom-color: #CCC;
+    border-width: 11px;
+    margin-left: -11px;
+}
+
+.mydp .selectorarrow:focus:before {
+    border-bottom-color: #ADD8E6;
+}
+
+.mydp .selectorarrowleft:after,
+.mydp .selectorarrowleft:before {
+    left: 24px;
+}
+
+.mydp .selectorarrowright:after,
+.mydp .selectorarrowright:before {
+    left: 224px;
+}
+
+.mydp .alignselectorright {
+    right: -1px;
+}
+
+.mydp .selectiongroup {
+    position: relative;
+    display: table;
+    border: none;
+    border-spacing: 0;
+    background-color: #FFF;
+}
+
+.mydp .selection {
+    outline: none;
+    background-color: #FFF;
+    display: table-cell;
+    position: absolute;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    text-align: center;
+}
+
+.mydp .invaliddate,
+.mydp .invalidmonth,
+.mydp .invalidyear {
+    background-color: #F1DEDE;
+}
+
+.mydp ::-ms-clear {
+    display: none;
+}
+
+.mydp .selbtngroup {
+    position: relative;
+    vertical-align: middle;
+    white-space: nowrap;
+    width: 1%;
+    display: table-cell;
+    font-size: 0;
+}
+
+.mydp .btnpicker,
+.mydp .btnclear {
+    height: 100%;
+    width: 30px;
+    border: none;
+    padding: 0;
+    outline: 0;
+    font: inherit;
+    -moz-user-select: none;
+}
+
+.mydp .btnleftborder {
+    border-left: 1px solid #CCC;
+}
+
+.mydp .btnpickerenabled,
+.mydp .btnclearenabled,
+.mydp .headertodaybtnenabled,
+.mydp .headerbtnenabled {
+    cursor: pointer;
+}
+
+.mydp .btnpickerdisabled,
+.mydp .btncleardisabled,
+.mydp .headertodaybtndisabled,
+.mydp .headerbtndisabled {
+    cursor: not-allowed;
+}
+
+.mydp .headerbtndisabled {
+    opacity: 0.4;
+}
+
+.mydp .btnpicker,
+.mydp .btnclear,
+.mydp .headertodaybtn {
+    background: #FFF;
+}
+
+.mydp .header {
+    width: 100%;
+    height: 30px;
+    background-color: #FAFAFA;
+}
+
+.mydp .header td {
+    vertical-align: middle;
+    border: none;
+    line-height: 0;
+}
+
+.mydp .header td:nth-child(1) {
+    padding-left: 4px;
+}
+
+.mydp .header td:nth-child(2) {
+    text-align: center;
+}
+
+.mydp .header td:nth-child(3) {
+    padding-right: 4px;
+}
+
+.mydp .caltable {
+    table-layout: fixed;
+    width: 100%;
+    background-color: #FFF;
+    font-size: 14px;
+}
+
+.mydp .caltable,
+.mydp .weekdaytitle,
+.mydp .daycell {
+    border-collapse: collapse;
+    color: #003366;
+    line-height: 1.1;
+}
+
+.mydp .weekdaytitle,
+.mydp .daycell {
+    padding: 5px;
+    text-align: center;
+}
+
+.mydp .weekdaytitle {
+    background-color: #DDD;
+    font-size: 12px;
+    font-weight: bold;
+    vertical-align: middle;
+    max-width: 36px;
+    overflow: hidden;
+    white-space: nowrap;
+}
+
+.mydp .weekdaytitleweeknbr {
+    width: 20px;
+    border-right: 1px solid #BBB;
+}
+
+.mydp .daycell {
+    cursor: pointer;
+    height: 30px;
+}
+
+.mydp .daycell div {
+    background-color: inherit;
+    vertical-align: middle;
+}
+
+.mydp .daycell div span {
+    vertical-align: middle;
+}
+
+.mydp .daycellweeknbr {
+    font-size: 10px;
+    border-right: 1px solid #CCC;
+    cursor: default;
+    color: #000;
+}
+
+.mydp .inlinedp {
+    position: relative;
+    margin-top: -1px;
+}
+
+.mydp .prevmonth {
+    color: #CCC;
+}
+
+.mydp .nextmonth {
+    color: #CCC;
+}
+
+.mydp .disabled {
+    cursor: default !important;
+    color: #CCC !important;
+    background: #FBEFEF !important;
+}
+
+.mydp .sunday {
+    color: #C30000;
+}
+
+.mydp .sundayDim {
+    opacity: 0.5;
+}
+
+.mydp .currmonth {
+    background-color: #F6F6F6;
+    font-weight: bold;
+}
+
+.mydp .currday {
+    text-decoration: underline;
+}
+
+.mydp .selectedday div {
+    border: 1px solid #004198;
+    background-color: #8EBFFF !important;
+    border-radius: 2px;
+}
+
+.mydp .headerbtncell {
+    background-color: #FAFAFA;
+    display: table-cell;
+    vertical-align: middle;
+}
+
+.mydp .headerbtn,
+.mydp .headerlabelbtn {
+    background: #FAFAFA;
+    border: none;
+    height: 22px;
+}
+
+.mydp .headerbtn {
+    width: 16px;
+}
+
+.mydp .headerlabelbtn {
+    font-size: 14px;
+}
+
+.mydp,
+.mydp .headertodaybtn,
+.mydp .monthinput,
+.mydp .yearinput {
+    border: 1px solid #CCC;
+}
+
+.mydp .btnpicker,
+.mydp .btnclear,
+.mydp .headerbtn,
+.mydp .headermonthtxt,
+.mydp .headeryeartxt,
+.mydp .headertodaybtn,
+.mydp .selection {
+    color: #000;
+}
+
+.mydp .headertodaybtn {
+    padding: 0 4px;
+    border-radius: 2px;
+    font-size: 11px;
+    height: 22px;
+    min-width: 60px;
+    max-width: 70px;
+    overflow: hidden;
+    white-space: nowrap;
+}
+
+.mydp button::-moz-focus-inner {
+    border: 0;
+}
+
+.mydp .headermonthtxt,
+.mydp .headeryeartxt {
+    text-align: center;
+    display: table-cell;
+    vertical-align: middle;
+    font-size: 14px;
+    height: 26px;
+    width: 40px;
+    max-width: 40px;
+    overflow: hidden;
+    white-space: nowrap;
+}
+
+.mydp .btnclear:focus,
+.mydp .btnpicker:focus,
+.mydp .headertodaybtn:focus {
+    background: #ADD8E6;
+}
+
+.mydp .headerbtn:focus,
+.mydp .monthlabel:focus,
+.mydp .yearlabel:focus {
+    color: #ADD8E6;
+    outline: none;
+}
+
+.mydp .daycell:focus {
+    outline: 1px solid #CCC;
+}
+
+.mydp .icon-mydpcalendar,
+.mydp .icon-mydpremove {
+    font-size: 16px;
+}
+
+.mydp .icon-mydpleft,
+.mydp .icon-mydpright {
+    color: #222;
+    font-size: 20px;
+}
+
+.mydp table {
+    display: table;
+    border-spacing: 0;
+}
+
+.mydp table td {
+    padding: 0;
+}
+
+.mydp table,
+.mydp th,
+.mydp td {
+    border: none;
+}
+
+.mydp .btnpickerenabled:hover,
+.mydp .btnclearenabled:hover,
+.mydp .headertodaybtnenabled:hover,
+.mydp .tablesingleday:hover {
+    background-color: #8BDAF4;
+}
+
+.mydp .monthlabel,
+.mydp .yearlabel {
+    cursor: pointer;
+}
+
+.mydp .yearinput,
+.mydp .monthinput {
+    width: 40px;
+    height: 22px;
+    text-align: center;
+    font-weight: bold;
+    outline: none;
+    border-radius: 2px;
+}
+
+.mydp .headerbtnenabled:hover,
+.mydp .monthlabel:hover,
+.mydp .yearlabel:hover {
+    color: #8BDAF4;
+}
+
+@font-face {
+    font-family: 'mydatepicker';
+    src: url('data:application/octet-stream;base64,AAEAAAAPAIAAAwBwR1NVQiCMJXkAAAD8AAAAVE9TLzI+IEhBAAABUAAAAFZjbWFwEIvU5AAAAagAAAGiY3Z0IAbV/wQAAApQAAAAIGZwZ22KkZBZAAAKcAAAC3BnYXNwAAAAEAAACkgAAAAIZ2x5ZsNblX4AAANMAAADBGhlYWQM+nt/AAAGUAAAADZoaGVhBz0DVgAABogAAAAkaG10eA1jAAAAAAasAAAAFGxvY2EBWgHMAAAGwAAAAAxtYXhwAXUMOgAABswAAAAgbmFtZZKUFgMAAAbsAAAC/XBvc3TOA7dOAAAJ7AAAAFpwcmVw5UErvAAAFeAAAACGAAEAAAAKADAAPgACbGF0bgAOREZMVAAaAAQAAAAAAAAAAQAAAAQAAAAAAAAAAQAAAAFsaWdhAAgAAAABAAAAAQAEAAQAAAABAAgAAQAGAAAAAQAAAAECrQGQAAUAAAJ6ArwAAACMAnoCvAAAAeAAMQECAAACAAUDAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFBmRWQAQOgA6AUDUv9qAFoDUgCWAAAAAQAAAAAAAAAAAAUAAAADAAAALAAAAAQAAAFiAAEAAAAAAFwAAwABAAAALAADAAoAAAFiAAQAMAAAAAYABAABAALoAugF//8AAOgA6AX//wAAAAAAAQAGAAoAAAABAAIAAwAEAAABBgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMAAAAAABAAAAAAAAAAAQAAOgAAADoAAAAAAEAAOgBAADoAQAAAAIAAOgCAADoAgAAAAMAAOgFAADoBQAAAAQAAAABAAAAAAFBAn0ADgAKtwAAAGYUAQUVKwEUDwEGIiY1ETQ+AR8BFgFBCvoLHBYWHAv6CgFeDgv6CxYOAfQPFAIM+goAAAEAAAAAAWcCfAANABdAFAABAAEBRwABAAFvAAAAZhcTAgUWKwERFAYiLwEmND8BNjIWAWUUIAn6Cgr6CxwYAlj+DA4WC/oLHAv6CxYAAAAADwAA/2oDoQNSAAMABwALAA8AEwAXABsAHwAjADMANwA7AD8ATwBzAJhAlUElAh0SSS0kAxMdAkchHwIdEwkdVBsBExkXDQMJCBMJXxgWDAMIFREHAwUECAVeFBAGAwQPCwMDAQAEAV4aARISHlggAR4eDEgOCgIDAAAcWAAcHA0cSXJwbWpnZmNgXVtWU01MRUQ/Pj08Ozo5ODc2NTQxLyknIyIhIB8eHRwbGhkYFxYVFBMSEREREREREREQIgUdKxczNSMXMzUjJzM1IxczNSMnMzUjATM1IyczNSMBMzUjJzM1IwM1NCYnIyIGBxUUFjczMjYBMzUjJzM1IxczNSM3NTQmJyMiBhcVFBY3MzI2NxEUBiMhIiY1ETQ2OwE1NDY7ATIWHQEzNTQ2OwEyFgcVMzIWR6GhxbKyxaGhxbKyxaGhAZuzs9aysgGsoaHWs7PEDAYkBwoBDAYkBwoBm6Gh1rOz1qGhEgoIIwcMAQoIIwgK1ywc/O4dKiodSDQlJCU01jYkIyU2AUcdKk+hoaEksrKyJKH9xKH6of3EoSSyATChBwoBDAahBwwBCv4msiShoaFroQcKAQwGoQcMAQos/TUdKiodAssdKjYlNDQlNjYlNDQlNioAAAABAAD/7wLUAoYAJAAeQBsiGRAHBAACAUcDAQIAAm8BAQAAZhQcFBQEBRgrJRQPAQYiLwEHBiIvASY0PwEnJjQ/ATYyHwE3NjIfARYUDwEXFgLUD0wQLBCkpBAsEEwQEKSkEBBMECwQpKQQLBBMDw+kpA9wFhBMDw+lpQ8PTBAsEKSkECwQTBAQpKQQEEwPLg+kpA8AAQAAAAEAAGAI8Y9fDzz1AAsD6AAAAADU+ZvvAAAAANT5m+8AAP9qA+gDUgAAAAgAAgAAAAAAAAABAAADUv9qAAAD6AAA//4D6AABAAAAAAAAAAAAAAAAAAAABQPoAAABZQAAAWUAAAOgAAADEQAAAAAAAAAiAEoBOAGCAAEAAAAFAHQADwAAAAAAAgBEAFQAcwAAAKkLcAAAAAAAAAASAN4AAQAAAAAAAAA1AAAAAQAAAAAAAQAMADUAAQAAAAAAAgAHAEEAAQAAAAAAAwAMAEgAAQAAAAAABAAMAFQAAQAAAAAABQALAGAAAQAAAAAABgAMAGsAAQAAAAAACgArAHcAAQAAAAAACwATAKIAAwABBAkAAABqALUAAwABBAkAAQAYAR8AAwABBAkAAgAOATcAAwABBAkAAwAYAUUAAwABBAkABAAYAV0AAwABBAkABQAWAXUAAwABBAkABgAYAYsAAwABBAkACgBWAaMAAwABBAkACwAmAflDb3B5cmlnaHQgKEMpIDIwMTcgYnkgb3JpZ2luYWwgYXV0aG9ycyBAIGZvbnRlbGxvLmNvbW15ZGF0ZXBpY2tlclJlZ3VsYXJteWRhdGVwaWNrZXJteWRhdGVwaWNrZXJWZXJzaW9uIDEuMG15ZGF0ZXBpY2tlckdlbmVyYXRlZCBieSBzdmcydHRmIGZyb20gRm9udGVsbG8gcHJvamVjdC5odHRwOi8vZm9udGVsbG8uY29tAEMAbwBwAHkAcgBpAGcAaAB0ACAAKABDACkAIAAyADAAMQA3ACAAYgB5ACAAbwByAGkAZwBpAG4AYQBsACAAYQB1AHQAaABvAHIAcwAgAEAAIABmAG8AbgB0AGUAbABsAG8ALgBjAG8AbQBtAHkAZABhAHQAZQBwAGkAYwBrAGUAcgBSAGUAZwB1AGwAYQByAG0AeQBkAGEAdABlAHAAaQBjAGsAZQByAG0AeQBkAGEAdABlAHAAaQBjAGsAZQByAFYAZQByAHMAaQBvAG4AIAAxAC4AMABtAHkAZABhAHQAZQBwAGkAYwBrAGUAcgBHAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAHMAdgBnADIAdAB0AGYAIABmAHIAbwBtACAARgBvAG4AdABlAGwAbABvACAAcAByAG8AagBlAGMAdAAuAGgAdAB0AHAAOgAvAC8AZgBvAG4AdABlAGwAbABvAC4AYwBvAG0AAAAAAgAAAAAAAAAKAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFAQIBAwEEAQUBBgAJbXlkcHJpZ2h0CG15ZHBsZWZ0DG15ZHBjYWxlbmRhcgpteWRwcmVtb3ZlAAAAAAABAAH//wAPAAAAAAAAAAAAAAAAAAAAAAAYABgAGAAYA1L/agNS/2qwACwgsABVWEVZICBLuAAOUUuwBlNaWLA0G7AoWWBmIIpVWLACJWG5CAAIAGNjI2IbISGwAFmwAEMjRLIAAQBDYEItsAEssCBgZi2wAiwgZCCwwFCwBCZasigBCkNFY0VSW1ghIyEbilggsFBQWCGwQFkbILA4UFghsDhZWSCxAQpDRWNFYWSwKFBYIbEBCkNFY0UgsDBQWCGwMFkbILDAUFggZiCKimEgsApQWGAbILAgUFghsApgGyCwNlBYIbA2YBtgWVlZG7ABK1lZI7AAUFhlWVktsAMsIEUgsAQlYWQgsAVDUFiwBSNCsAYjQhshIVmwAWAtsAQsIyEjISBksQViQiCwBiNCsQEKQ0VjsQEKQ7ABYEVjsAMqISCwBkMgiiCKsAErsTAFJbAEJlFYYFAbYVJZWCNZISCwQFNYsAErGyGwQFkjsABQWGVZLbAFLLAHQyuyAAIAQ2BCLbAGLLAHI0IjILAAI0JhsAJiZrABY7ABYLAFKi2wBywgIEUgsAtDY7gEAGIgsABQWLBAYFlmsAFjYESwAWAtsAgssgcLAENFQiohsgABAENgQi2wCSywAEMjRLIAAQBDYEItsAosICBFILABKyOwAEOwBCVgIEWKI2EgZCCwIFBYIbAAG7AwUFiwIBuwQFlZI7AAUFhlWbADJSNhRESwAWAtsAssICBFILABKyOwAEOwBCVgIEWKI2EgZLAkUFiwABuwQFkjsABQWGVZsAMlI2FERLABYC2wDCwgsAAjQrILCgNFWCEbIyFZKiEtsA0ssQICRbBkYUQtsA4ssAFgICCwDENKsABQWCCwDCNCWbANQ0qwAFJYILANI0JZLbAPLCCwEGJmsAFjILgEAGOKI2GwDkNgIIpgILAOI0IjLbAQLEtUWLEEZERZJLANZSN4LbARLEtRWEtTWLEEZERZGyFZJLATZSN4LbASLLEAD0NVWLEPD0OwAWFCsA8rWbAAQ7ACJUKxDAIlQrENAiVCsAEWIyCwAyVQWLEBAENgsAQlQoqKIIojYbAOKiEjsAFhIIojYbAOKiEbsQEAQ2CwAiVCsAIlYbAOKiFZsAxDR7ANQ0dgsAJiILAAUFiwQGBZZrABYyCwC0NjuAQAYiCwAFBYsEBgWWawAWNgsQAAEyNEsAFDsAA+sgEBAUNgQi2wEywAsQACRVRYsA8jQiBFsAsjQrAKI7ABYEIgYLABYbUQEAEADgBCQopgsRIGK7ByKxsiWS2wFCyxABMrLbAVLLEBEystsBYssQITKy2wFyyxAxMrLbAYLLEEEystsBkssQUTKy2wGiyxBhMrLbAbLLEHEystsBwssQgTKy2wHSyxCRMrLbAeLACwDSuxAAJFVFiwDyNCIEWwCyNCsAojsAFgQiBgsAFhtRAQAQAOAEJCimCxEgYrsHIrGyJZLbAfLLEAHistsCAssQEeKy2wISyxAh4rLbAiLLEDHistsCMssQQeKy2wJCyxBR4rLbAlLLEGHistsCYssQceKy2wJyyxCB4rLbAoLLEJHistsCksIDywAWAtsCosIGCwEGAgQyOwAWBDsAIlYbABYLApKiEtsCsssCorsCoqLbAsLCAgRyAgsAtDY7gEAGIgsABQWLBAYFlmsAFjYCNhOCMgilVYIEcgILALQ2O4BABiILAAUFiwQGBZZrABY2AjYTgbIVktsC0sALEAAkVUWLABFrAsKrABFTAbIlktsC4sALANK7EAAkVUWLABFrAsKrABFTAbIlktsC8sIDWwAWAtsDAsALABRWO4BABiILAAUFiwQGBZZrABY7ABK7ALQ2O4BABiILAAUFiwQGBZZrABY7ABK7AAFrQAAAAAAEQ+IzixLwEVKi2wMSwgPCBHILALQ2O4BABiILAAUFiwQGBZZrABY2CwAENhOC2wMiwuFzwtsDMsIDwgRyCwC0NjuAQAYiCwAFBYsEBgWWawAWNgsABDYbABQ2M4LbA0LLECABYlIC4gR7AAI0KwAiVJiopHI0cjYSBYYhshWbABI0KyMwEBFRQqLbA1LLAAFrAEJbAEJUcjRyNhsAlDK2WKLiMgIDyKOC2wNiywABawBCWwBCUgLkcjRyNhILAEI0KwCUMrILBgUFggsEBRWLMCIAMgG7MCJgMaWUJCIyCwCEMgiiNHI0cjYSNGYLAEQ7ACYiCwAFBYsEBgWWawAWNgILABKyCKimEgsAJDYGQjsANDYWRQWLACQ2EbsANDYFmwAyWwAmIgsABQWLBAYFlmsAFjYSMgILAEJiNGYTgbI7AIQ0awAiWwCENHI0cjYWAgsARDsAJiILAAUFiwQGBZZrABY2AjILABKyOwBENgsAErsAUlYbAFJbACYiCwAFBYsEBgWWawAWOwBCZhILAEJWBkI7ADJWBkUFghGyMhWSMgILAEJiNGYThZLbA3LLAAFiAgILAFJiAuRyNHI2EjPDgtsDgssAAWILAII0IgICBGI0ewASsjYTgtsDkssAAWsAMlsAIlRyNHI2GwAFRYLiA8IyEbsAIlsAIlRyNHI2EgsAUlsAQlRyNHI2GwBiWwBSVJsAIlYbkIAAgAY2MjIFhiGyFZY7gEAGIgsABQWLBAYFlmsAFjYCMuIyAgPIo4IyFZLbA6LLAAFiCwCEMgLkcjRyNhIGCwIGBmsAJiILAAUFiwQGBZZrABYyMgIDyKOC2wOywjIC5GsAIlRlJYIDxZLrErARQrLbA8LCMgLkawAiVGUFggPFkusSsBFCstsD0sIyAuRrACJUZSWCA8WSMgLkawAiVGUFggPFkusSsBFCstsD4ssDUrIyAuRrACJUZSWCA8WS6xKwEUKy2wPyywNiuKICA8sAQjQoo4IyAuRrACJUZSWCA8WS6xKwEUK7AEQy6wKystsEAssAAWsAQlsAQmIC5HI0cjYbAJQysjIDwgLiM4sSsBFCstsEEssQgEJUKwABawBCWwBCUgLkcjRyNhILAEI0KwCUMrILBgUFggsEBRWLMCIAMgG7MCJgMaWUJCIyBHsARDsAJiILAAUFiwQGBZZrABY2AgsAErIIqKYSCwAkNgZCOwA0NhZFBYsAJDYRuwA0NgWbADJbACYiCwAFBYsEBgWWawAWNhsAIlRmE4IyA8IzgbISAgRiNHsAErI2E4IVmxKwEUKy2wQiywNSsusSsBFCstsEMssDYrISMgIDywBCNCIzixKwEUK7AEQy6wKystsEQssAAVIEewACNCsgABARUUEy6wMSotsEUssAAVIEewACNCsgABARUUEy6wMSotsEYssQABFBOwMiotsEcssDQqLbBILLAAFkUjIC4gRoojYTixKwEUKy2wSSywCCNCsEgrLbBKLLIAAEErLbBLLLIAAUErLbBMLLIBAEErLbBNLLIBAUErLbBOLLIAAEIrLbBPLLIAAUIrLbBQLLIBAEIrLbBRLLIBAUIrLbBSLLIAAD4rLbBTLLIAAT4rLbBULLIBAD4rLbBVLLIBAT4rLbBWLLIAAEArLbBXLLIAAUArLbBYLLIBAEArLbBZLLIBAUArLbBaLLIAAEMrLbBbLLIAAUMrLbBcLLIBAEMrLbBdLLIBAUMrLbBeLLIAAD8rLbBfLLIAAT8rLbBgLLIBAD8rLbBhLLIBAT8rLbBiLLA3Ky6xKwEUKy2wYyywNyuwOystsGQssDcrsDwrLbBlLLAAFrA3K7A9Ky2wZiywOCsusSsBFCstsGcssDgrsDsrLbBoLLA4K7A8Ky2waSywOCuwPSstsGossDkrLrErARQrLbBrLLA5K7A7Ky2wbCywOSuwPCstsG0ssDkrsD0rLbBuLLA6Ky6xKwEUKy2wbyywOiuwOystsHAssDorsDwrLbBxLLA6K7A9Ky2wciyzCQQCA0VYIRsjIVlCK7AIZbADJFB4sAEVMC0AS7gAyFJYsQEBjlmwAbkIAAgAY3CxAAVCsgABACqxAAVCswoCAQgqsQAFQrMOAAEIKrEABkK6AsAAAQAJKrEAB0K6AEAAAQAJKrEDAESxJAGIUViwQIhYsQNkRLEmAYhRWLoIgAABBECIY1RYsQMARFlZWVmzDAIBDCq4Af+FsASNsQIARAAA') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+}
+
+.mydp .mydpicon {
+    font-family: 'mydatepicker';
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
+.mydp .icon-mydpright:before {
+    content: "\e800";
+}
+
+.mydp .icon-mydpleft:before {
+    content: "\e801";
+}
+
+.mydp .icon-mydpcalendar:before {
+    content: "\e802";
+}
+
+.mydp .icon-mydpremove:before {
+    content: "\e805";
+}
diff --git a/utils/my-date-picker/my-date-picker.component.html b/utils/my-date-picker/my-date-picker.component.html
new file mode 100644
index 00000000..9b7280e0
--- /dev/null
+++ b/utils/my-date-picker/my-date-picker.component.html
@@ -0,0 +1,61 @@
+<div class="mydp" [ngStyle]="{'width': getComponentWidth(), 'border': opts.inline ? 'none' : null}">
+    <div class="selectiongroup" *ngIf="!opts.inline">
+        <input *ngIf="opts.showInputField" ngtype="text" class="selection" [attr.aria-label]="opts.ariaLabelInputField" (click)="opts.openSelectorOnInputClick&&!opts.editableDateField&&openBtnClicked()" [attr.maxlength]="opts.dateFormat.length" [ngClass]="{'invaliddate': invalidDate&&opts.indicateInvalidDate}"
+                placeholder="{{placeholder}}" [myinputautofill]="autoFillOpts" [ngStyle]="{'height': opts.height, 'line-height': opts.height, 'font-size': opts.selectionTxtFontSize, 'border': 'none', 'padding-right': selectionDayTxt.length>0&&opts.showClearDateBtn ? '60px' : '30px'}"
+                (keyup)="userDateInput($event)" [value]="selectionDayTxt" (focus)="opts.editableDateField&&onFocusInput($event)" (blur)="opts.editableDateField&&lostFocusInput($event)" [disabled]="opts.componentDisabled" [readonly]="!opts.editableDateField" [required]="opts.inputValueRequired">
+        <div class="selbtngroup" [style.height]="opts.height">
+            <button type="button" [attr.aria-label]="opts.ariaLabelClearDate" class="btnclear" *ngIf="selectionDayTxt.length>0&&opts.showClearDateBtn" (click)="removeBtnClicked()" [ngClass]="{'btnclearenabled': !opts.componentDisabled, 'btncleardisabled': opts.componentDisabled, 'btnleftborder': opts.showInputField}" [disabled]="opts.componentDisabled">
+                <span class="mydpicon icon-mydpremove"></span>
+            </button>
+            <button type="button" [attr.aria-label]="opts.ariaLabelOpenCalendar" class="btnpicker" (click)="openBtnClicked()" [ngClass]="{'btnpickerenabled': !opts.componentDisabled, 'btnpickerdisabled': opts.componentDisabled, 'btnleftborder': opts.showInputField||selectionDayTxt.length>0&&opts.showClearDateBtn}" [disabled]="opts.componentDisabled">
+                <span class="uk-icon"> <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="calendar" ratio="1"><path d="M 2,3 2,17 18,17 18,3 2,3 Z M 17,16 3,16 3,8 17,8 17,16 Z M 17,7 3,7 3,4 17,4 17,7 Z"></path><rect width="1" height="3" x="6" y="2"></rect><rect width="1" height="3" x="13" y="2"></rect></svg></span>
+            </button>
+        </div>
+    </div>
+    <div class="selector" *ngIf="showSelector||opts.inline" [mydpfocus]="opts.inline?'0':'1'" [ngStyle]="{'bottom': getSelectorTopPosition()}" [ngClass]="{'inlinedp': opts.inline, 'alignselectorright': opts.alignSelectorRight, 'selectorarrow': opts.showSelectorArrow&&!opts.inline, 'selectorarrowleft': opts.showSelectorArrow&&!opts.alignSelectorRight&&!opts.inline, 'selectorarrowright': opts.showSelectorArrow&&opts.alignSelectorRight&&!opts.inline}" tabindex="0">
+        <table class="header">
+            <tr>
+                <td>
+                    <div style="float:left">
+                        <div class="headerbtncell"><button type="button" [attr.aria-label]="opts.ariaLabelPrevMonth" class="headerbtn "  (click)="prevMonth()" [disabled]="prevMonthDisabled" [ngClass]="{'headerbtnenabled': !prevMonthDisabled, 'headerbtndisabled': prevMonthDisabled}"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></button></div>
+                        <div class="headermonthtxt">
+                            <input type="text" *ngIf="editMonth" class="monthinput" maxlength="10" [mydpfocus]="2" [value]="visibleMonth.monthTxt" (keyup)="userMonthInput($event)" (click)="$event.stopPropagation()" [ngClass]="{'invalidmonth': invalidMonth}">
+                            <button class="headerlabelbtn" type="button" [ngClass]="{'monthlabel': opts.editableMonthAndYear}" *ngIf="!editMonth" (click)="opts.editableMonthAndYear&&editMonthClicked($event)" tabindex="{{opts.editableMonthAndYear?'0':'-1'}}">{{visibleMonth.monthTxt}}</button>
+                        </div>
+                        <div class="headerbtncell"><button type="button" [attr.aria-label]="opts.ariaLabelNextMonth" class="headerbtn uk- "  (click)="nextMonth()" [disabled]="nextMonthDisabled" [ngClass]="{'headerbtnenabled': !nextMonthDisabled, 'headerbtndisabled': nextMonthDisabled}"><span class="uk-icon">
+                        <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+                        </span></button></div>
+                    </div>
+                </td>
+                <td *ngIf="opts.showTodayBtn">
+                    <button type="button" class="headertodaybtn" (click)="todayClicked()" [disabled]="disableTodayBtn" [ngClass]="{'headertodaybtnenabled': !disableTodayBtn, 'headertodaybtndisabled': disableTodayBtn}">{{opts.todayBtnTxt}}</button>
+                </td>
+                <td>
+                    <div style="float:right">
+                        <div class="headerbtncell"><button type="button" [attr.aria-label]="opts.ariaLabelPrevYear" class="headerbtn  " (click)="prevYear()" [disabled]="prevYearDisabled" [ngClass]="{'headerbtnenabled': !prevYearDisabled, 'headerbtndisabled': prevYearDisabled}"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></button></div>
+                        <div class="headeryeartxt">
+                            <input type="text" *ngIf="editYear" class="yearinput" maxlength="4" [mydpfocus]="2" [value]="visibleMonth.year" (keyup)="userYearInput($event)" (click)="$event.stopPropagation()" [ngClass]="{'invalidyear': invalidYear}">
+                            <button class="headerlabelbtn" type="button" [ngClass]="{'yearlabel': opts.editableMonthAndYear}" *ngIf="!editYear" (click)="opts.editableMonthAndYear&&editYearClicked($event)" tabindex="{{opts.editableMonthAndYear?'0':'-1'}}">{{visibleMonth.year}}</button>
+                        </div>
+                        <div class="headerbtncell"><button type="button" [attr.aria-label]="opts.ariaLabelNextYear" class="headerbtn  "   (click)="nextYear()" [disabled]="nextYearDisabled" [ngClass]="{'headerbtnenabled': !nextYearDisabled, 'headerbtndisabled': nextYearDisabled}"><span class="uk-icon">
+                        <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+                        </span></button></div>
+                    </div>
+                </td>
+            </tr>
+        </table>
+        <table class="caltable">
+            <thead><tr><th class="weekdaytitle weekdaytitleweeknbr" *ngIf="opts.showWeekNumbers&&opts.firstDayOfWeek==='mo'">#</th><th class="weekdaytitle" scope="col" *ngFor="let d of weekDays">{{d}}</th></tr></thead>
+            <tbody>
+            <tr *ngFor="let w of dates">
+                <td class="daycell daycellweeknbr" *ngIf="opts.showWeekNumbers&&opts.firstDayOfWeek==='mo'">{{w.weekNbr}}</td>
+                <td class="daycell" *ngFor="let d of w.week" [ngClass]="{'currmonth':d.cmo===CURR_MONTH&&!d.disabled, 'selectedday':selectedDate.day===d.dateObj.day && selectedDate.month===d.dateObj.month && selectedDate.year===d.dateObj.year && d.cmo===CURR_MONTH, 'disabled': d.disabled, 'tablesingleday': d.cmo===CURR_MONTH&&!d.disabled}" (click)="!d.disabled&&cellClicked(d);$event.stopPropagation()" (keydown)="cellKeyDown($event, d)" tabindex="0">
+                    <div [ngClass]="{'prevmonth':d.cmo===PREV_MONTH,'currmonth':d.cmo===CURR_MONTH,'nextmonth':d.cmo===NEXT_MONTH,'sunday':d.dayNbr === 0 && opts.sunHighlight}">
+                        <span [ngClass]="{'currday':d.currDay&&opts.markCurrentDay, 'sundayDim': opts.sunHighlight && d.dayNbr === 0 && (d.cmo===PREV_MONTH || d.cmo===NEXT_MONTH || d.disabled)}">{{d.dateObj.day}}</span>
+                    </div>
+                </td>
+            </tr>
+            </tbody>
+        </table>
+    </div>
+</div>
diff --git a/utils/my-date-picker/my-date-picker.component.spec.ts b/utils/my-date-picker/my-date-picker.component.spec.ts
new file mode 100644
index 00000000..83801d58
--- /dev/null
+++ b/utils/my-date-picker/my-date-picker.component.spec.ts
@@ -0,0 +1,2209 @@
+// //<reference path="../../node_modules/@types/jasmine/index.d.ts"/>
+//
+// import {ComponentFixture, TestBed} from '@angular/core/testing';
+// import {By} from '@angular/platform-browser';
+// import {DebugElement} from '@angular/core';
+// import {MyDatePicker} from './my-date-picker.component';
+// import {FocusDirective} from './directives/my-date-picker.focus.directive';
+// import {InputAutoFillDirective} from './directives/my-date-picker.input.auto.fill.directive';
+//
+// let comp: MyDatePicker;
+// let fixture: ComponentFixture<MyDatePicker>;
+// let de: DebugElement;
+// let el: HTMLElement;
+//
+// let PREVMONTH: string = '.header tr td:first-child div .headerbtncell:first-child .headerbtn';
+// let NEXTMONTH: string = '.header tr td:first-child div .headerbtncell:last-child .headerbtn';
+// let PREVYEAR: string = '.header tr td:last-child div .headerbtncell:first-child .headerbtn';
+// let NEXTYEAR: string = '.header tr td:last-child div .headerbtncell:last-child .headerbtn';
+//
+// function getDateString(date:any):string {
+//     return date.getFullYear() + '-' + ((date.getMonth() + 1) < 10 ? '0' + (date.getMonth() + 1) : (date.getMonth() + 1)) + '-' + (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
+// }
+//
+// function getElement(id:string):DebugElement {
+//     return de.query(By.css(id));
+// }
+//
+// function getElements(id:string):Array<DebugElement> {
+//     return de.queryAll(By.css(id));
+// }
+//
+// describe('MyDatePicker', () => {
+//     beforeEach(() => {
+//         TestBed.configureTestingModule({
+//             declarations: [MyDatePicker, FocusDirective, InputAutoFillDirective],
+//         });
+//
+//         fixture = TestBed.createComponent(MyDatePicker);
+//
+//         comp = fixture.componentInstance;
+//
+//         de = fixture.debugElement.query(By.css('.mydp'));
+//         el = de.nativeElement;
+//     });
+//
+//     it('set valid date', () => {
+//         comp.selectionDayTxt = '2016-08-22';
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toContain('2016-08-22');
+//     });
+//
+//     it('open/close selector', () => {
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         let selector = getElement('.selector');
+//         expect(selector).toBe(null);
+//
+//         btnpicker.nativeElement.click();
+//         fixture.detectChanges();
+//         selector = getElement('.selector');
+//         expect(selector).not.toBe(null);
+//
+//         btnpicker.nativeElement.click();
+//         fixture.detectChanges();
+//         selector = getElement('.selector');
+//         expect(selector).toBe(null);
+//     });
+//
+//     it('select current day from the selector and clear', () => {
+//         let date = new Date();
+//         comp.selectedMonth = {monthTxt: '', monthNbr: date.getMonth() + 1, year: date.getFullYear()};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let currday = getElement('.currday');
+//         expect(currday).not.toBe(null);
+//
+//         currday.nativeElement.click();
+//
+//         let dateStr = getDateString(date);
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toContain(dateStr);
+//
+//         fixture.detectChanges();
+//         let btnclear = getElement('.btnclear');
+//         btnclear.nativeElement.click();
+//         expect(selection.nativeElement.value).toContain('');
+//     });
+//
+//     it('select/unselect current day from the selector', () => {
+//         let date = new Date();
+//         comp.selectedMonth = {monthTxt: '', monthNbr: date.getMonth() + 1, year: date.getFullYear()};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let currday = getElement('.currday');
+//         expect(currday).not.toBe(null);
+//
+//         currday.nativeElement.click();
+//
+//         let dateStr = getDateString(date);
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toContain(dateStr);
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//
+//         fixture.detectChanges();
+//         let selectedday = getElement('.selectedday');
+//         expect(selectedday).not.toBe(null);
+//
+//         fixture.detectChanges();
+//         currday = getElement('.currday');
+//         expect(currday).not.toBe(null);
+//         currday.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selectedday = getElement('.selectedday');
+//         expect(selectedday).toBe(null);
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('');
+//     });
+//
+//     it('select today button', () => {
+//         let date = new Date();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let today = getElement('.headertodaybtn');
+//         expect(today).not.toBe(null);
+//
+//         today.nativeElement.click();
+//
+//         let dateStr = getDateString(date);
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toContain(dateStr);
+//
+//         fixture.detectChanges();
+//         let btnclear = getElement('.btnclear');
+//         btnclear.nativeElement.click();
+//         expect(selection.nativeElement.value).toContain('');
+//     });
+//
+//     it('select previous month', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let prevmonth = getElement('.header tr td:first-child .headerbtn:first-child');
+//         expect(prevmonth).not.toBe(null);
+//
+//         prevmonth.nativeElement.click();
+//
+//         expect(comp.visibleMonth.monthTxt).toBe('Apr');
+//         expect(comp.visibleMonth.monthNbr).toBe(4);
+//         expect(comp.visibleMonth.year).toBe(2016);
+//     });
+//
+//     it('select next month', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//
+//         nextmonth.nativeElement.click();
+//
+//         expect(comp.visibleMonth.monthTxt).toBe('Jun');
+//         expect(comp.visibleMonth.monthNbr).toBe(6);
+//         expect(comp.visibleMonth.year).toBe(2016);
+//     });
+//
+//     it('select previous month january change year', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let prevmonth = getElement(PREVMONTH);
+//         expect(prevmonth).not.toBe(null);
+//
+//         prevmonth.nativeElement.click();
+//
+//         expect(comp.visibleMonth.year).toBe(2015);
+//     });
+//
+//     it('select next month december change year', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 12, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//
+//         nextmonth.nativeElement.click();
+//
+//         expect(comp.visibleMonth.year).toBe(2017);
+//     });
+//
+//     it('select previous month from selector', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let prevmonth = getElement(PREVMONTH);
+//         expect(prevmonth).not.toBe(null);
+//
+//         prevmonth.nativeElement.click();
+//         expect(comp.visibleMonth.monthNbr).toBe(4);
+//         expect(comp.visibleMonth.monthTxt).toBe('Apr');
+//
+//         prevmonth.nativeElement.click();
+//         expect(comp.visibleMonth.monthNbr).toBe(3);
+//         expect(comp.visibleMonth.monthTxt).toBe('Mar');
+//     });
+//
+//     it('select next month from selector', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//
+//         nextmonth.nativeElement.click();
+//         expect(comp.visibleMonth.monthNbr).toBe(6);
+//         expect(comp.visibleMonth.monthTxt).toBe('Jun');
+//
+//         nextmonth.nativeElement.click();
+//         expect(comp.visibleMonth.monthNbr).toBe(7);
+//         expect(comp.visibleMonth.monthTxt).toBe('Jul');
+//     });
+//
+//     it('select previous year', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let prevyear = getElement(PREVYEAR);
+//         expect(prevyear).not.toBe(null);
+//
+//         prevyear.nativeElement.click();
+//         fixture.detectChanges();
+//         let yearLabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearLabel).not.toBe(null);
+//         expect(yearLabel.nativeElement.textContent).toBe('2015');
+//     });
+//
+//     it('select next year', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let nextyear = getElement(NEXTYEAR);
+//         expect(nextyear).not.toBe(null);
+//
+//         nextyear.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let yearLabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearLabel).not.toBe(null);
+//         expect(yearLabel.nativeElement.textContent).toBe('2017');
+//     });
+//
+//     it('test calendar year 2016 month one by one - next month button', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2016};
+//
+//         comp.options = {firstDayOfWeek: 'mo'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let monthlabel = getElement('.monthlabel');
+//         expect(monthlabel).not.toBe(null);
+//         expect(monthlabel.nativeElement.textContent.trim()).toBe('Jan');
+//
+//         fixture.detectChanges();
+//         let yearlabel = getElement('.yearlabel');
+//         expect(yearlabel).not.toBe(null);
+//         expect(yearlabel.nativeElement.textContent.trim()).toBe('2016');
+//
+//         comp.generateCalendar(1, 2016, true);
+//
+//         let beginDate: Array<string> = ['28', '1', '29', '28', '25', '30', '27', '1', '29', '26', '31', '28'];
+//         let endDate: Array<string> = ['7', '13', '10', '8', '5', '10', '7', '11', '9', '6', '11', '8'];
+//
+//         let i: number = 0;
+//         do {
+//             fixture.detectChanges();
+//             let currmonth = getElements('.caltable tbody tr td');
+//             expect(currmonth).not.toBe(null);
+//             expect(currmonth.length).toBe(42);
+//
+//             expect(currmonth[0]).not.toBe(null);
+//             expect(currmonth[0].nativeElement.textContent.trim()).toBe(beginDate[i]);
+//
+//             expect(currmonth[41]).not.toBe(null);
+//             expect(currmonth[41].nativeElement.textContent.trim()).toBe(endDate[i]);
+//
+//             comp.nextMonth();
+//
+//             i++;
+//         } while (i < 12)
+//     });
+//
+//     it('test calendar year 2016 month one by one - previous month button', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 12, year: 2016};
+//
+//         comp.options = {firstDayOfWeek: 'mo'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let monthlabel = getElement('.monthlabel');
+//         expect(monthlabel).not.toBe(null);
+//         expect(monthlabel.nativeElement.textContent.trim()).toBe('Dec');
+//
+//         fixture.detectChanges();
+//         let yearlabel = getElement('.yearlabel');
+//         expect(yearlabel).not.toBe(null);
+//         expect(yearlabel.nativeElement.textContent.trim()).toBe('2016');
+//
+//         comp.generateCalendar(12, 2016, true);
+//
+//         let beginDate: Array<string> = ['28', '1', '29', '28', '25', '30', '27', '1', '29', '26', '31', '28'];
+//         let endDate: Array<string> = ['7', '13', '10', '8', '5', '10', '7', '11', '9', '6', '11', '8'];
+//
+//         let i: number = 11;
+//         do {
+//             fixture.detectChanges();
+//             let currmonth = getElements('.caltable tbody tr td');
+//             expect(currmonth).not.toBe(null);
+//             expect(currmonth.length).toBe(42);
+//
+//             expect(currmonth[0]).not.toBe(null);
+//             expect(currmonth[0].nativeElement.textContent.trim()).toBe(beginDate[i]);
+//
+//             expect(currmonth[41]).not.toBe(null);
+//             expect(currmonth[41].nativeElement.textContent.trim()).toBe(endDate[i]);
+//
+//             comp.prevMonth();
+//
+//             i--;
+//         } while (i >= 0)
+//     });
+//
+//     // options
+//     it('options - dayLabels', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//         comp.options = {dayLabels:  {su: '1', mo: '2', tu: '3', we: '4', th: '5', fr: '6', sa: '7'}, firstDayOfWeek: 'su'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let ths = getElements('.caltable thead tr th');
+//         expect(ths.length).toBe(7);
+//         for(let i in ths) {
+//             let el = ths[i];
+//             expect(parseInt(el.nativeElement.textContent)).toBe(parseInt(i) + 1);
+//         }
+//     });
+//
+//     it('options - monthLabels', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2016};
+//         comp.options = {monthLabels:  { 1: '1', 2: '2', 3: '3', 4: '4', 5: '5', 6: '6', 7: '7', 8: '8', 9: '9', 10: '10', 11: '11', 12: '12' }};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//
+//         for(let i = 1; i <= 12; i++) {
+//             fixture.detectChanges();
+//             let monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//             expect(parseInt(monthLabel.nativeElement.textContent)).toBe(i);
+//             nextmonth.nativeElement.click();
+//         }
+//     });
+//
+//     it('options - date format', () => {
+//         comp.options = {dateFormat: 'dd.mm.yyyy', indicateInvalidDate: true};
+//
+//         comp.parseOptions();
+//
+//         let value = {target:{value:'2016-08-22'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(true);
+//
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         value = {target:{value:'2016-08-2'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(true);
+//
+//         value = {target:{value:'16.09/2016'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(true);
+//
+//         value = {target:{value:'2016-08-xx'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(true);
+//
+//         value = {target:{value:'16.09.999'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(true);
+//
+//         value = {target:{value:'16.09.19999'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(true);
+//
+//         value = {target:{value:'16.09.2016'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(false);
+//
+//         comp.options = {dateFormat: 'dd mmm yyyy', indicateInvalidDate: true};
+//
+//         comp.parseOptions();
+//
+//         value = {target:{value:'2016-08-22'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(true);
+//
+//         value = {target:{value:'22 Aug 2016'}};
+//         comp.userDateInput(value);
+//         expect(comp.invalidDate).toBe(false);
+//     });
+//
+//     it('options - show today button', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2016};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).not.toBe(null);
+//
+//         btnpicker.nativeElement.click();
+//
+//         comp.options = {showTodayBtn: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).toBe(null);
+//
+//         btnpicker.nativeElement.click();
+//
+//         comp.options = {showTodayBtn: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).not.toBe(null);
+//     });
+//
+//     it('options - today button text', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2016};
+//         comp.options = {todayBtnTxt: 'test text'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).not.toBe(null);
+//         expect(headertodaybtn.nativeElement.textContent).toBe('test text');
+//     });
+//
+//     it('options - first day of week', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//         comp.options = {firstDayOfWeek: 'tu'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let first = getElement('.caltable thead tr th:first-child');
+//         expect(first).not.toBe(null);
+//         expect(first.nativeElement.textContent).toBe('Tue');
+//
+//         let last = getElement('.caltable thead tr th:last-child');
+//         expect(last).not.toBe(null);
+//         expect(last.nativeElement.textContent).toBe('Mon');
+//     });
+//
+//     it('options - sunday highlight', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//         comp.options = {sunHighlight: true};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let sunday = getElement('.sunday');
+//         expect(sunday).not.toBe(null);
+//
+//         btnpicker.nativeElement.click();
+//
+//         comp.options = {sunHighlight: false};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker.nativeElement.click();
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         sunday = getElement('.sunday');
+//         expect(sunday).toBe(null);
+//     });
+//
+//     it('options - current day marked', () => {
+//         comp.options = {markCurrentDay: true};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let currday = getElement('.currday');
+//         expect(currday).not.toBe(null);
+//
+//         btnpicker.nativeElement.click();
+//
+//         comp.options = {markCurrentDay: false};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker.nativeElement.click();
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         currday = getElement('.currday');
+//         expect(currday).toBe(null);
+//     });
+//
+//     it('options - editable month and year', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//         comp.options = {editableMonthAndYear: true};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         montlabel.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let monthinput = getElement('.monthinput');
+//         expect(monthinput).not.toBe(null);
+//
+//         comp.userMonthInput({target:{value:'jan'}});
+//
+//         fixture.detectChanges();
+//         montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         expect(montlabel.nativeElement.textContent).toBe('Jan');
+//
+//
+//         fixture.detectChanges();
+//         let yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         yearlabel.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let yearinput = getElement('.yearinput');
+//         expect(yearinput).not.toBe(null);
+//
+//         comp.userYearInput({target:{value:'2019'}});
+//
+//         fixture.detectChanges();
+//         yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         expect(yearlabel.nativeElement.textContent).toBe('2019');
+//     });
+//
+//     it('options - disable header buttons', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 5, year: 2016};
+//         comp.options = {
+//             disableHeaderButtons: true,
+//             disableUntil: {year: 2016, month: 4, day: 10}
+//         };
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         expect(montlabel.nativeElement.textContent).toBe('May');
+//
+//         fixture.detectChanges();
+//         let prevmonth = getElement(PREVMONTH);
+//         expect(prevmonth).not.toBe(null);
+//         prevmonth.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         expect(montlabel.nativeElement.textContent).toBe('Apr');
+//
+//         fixture.detectChanges();
+//         let headerbtndisabled = getElements('.headerbtndisabled');
+//         expect(headerbtndisabled).not.toBe(null);
+//         expect(headerbtndisabled.length).toBe(2);
+//
+//         prevmonth.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         expect(montlabel.nativeElement.textContent).toBe('Apr');
+//
+//         fixture.detectChanges();
+//         let prevyear = getElement(PREVYEAR);
+//         expect(prevyear).not.toBe(null);
+//         prevyear.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         expect(yearlabel.nativeElement.textContent).toBe('2016');
+//
+//         btnpicker.nativeElement.click();
+//
+//
+//         comp.options = {
+//             disableHeaderButtons: true,
+//             disableSince: {year: 2016, month: 7, day: 10}
+//         };
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         expect(montlabel.nativeElement.textContent).toBe('May');
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//         nextmonth.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         expect(montlabel.nativeElement.textContent).toBe('Jun');
+//
+//         fixture.detectChanges();
+//         headerbtndisabled = getElements('.headerbtndisabled');
+//         expect(headerbtndisabled).not.toBe(null);
+//         expect(headerbtndisabled.length).toBe(2);
+//
+//         prevmonth.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         montlabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(montlabel).not.toBe(null);
+//         expect(montlabel.nativeElement.textContent).toBe('Jun');
+//
+//         fixture.detectChanges();
+//         let nextyear = getElement(NEXTYEAR);
+//         expect(nextyear).not.toBe(null);
+//         nextyear.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         expect(yearlabel.nativeElement.textContent).toBe('2016');
+//     });
+//
+//     it('options - min year', () => {
+//         comp.visibleMonth = {monthTxt: 'May', monthNbr: 5, year: 2016};
+//         comp.options = {minYear: 2000};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         yearlabel.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let yearinput = getElement('.yearinput');
+//         expect(yearinput).not.toBe(null);
+//
+//         comp.userYearInput({target:{value:1999}});
+//
+//         fixture.detectChanges();
+//         let invalidyear = getElement('.invalidyear');
+//         expect(invalidyear).not.toBe(null);
+//
+//         comp.userYearInput({target:{value:2000}});
+//
+//         fixture.detectChanges();
+//         yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         expect(yearlabel.nativeElement.textContent).toBe('2000');
+//     });
+//
+//     it('options - max year', () => {
+//         comp.visibleMonth = {monthTxt: 'May', monthNbr: 5, year: 2016};
+//         comp.options = {maxYear: 2020};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         yearlabel.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let yearinput = getElement('.yearinput');
+//         expect(yearinput).not.toBe(null);
+//
+//         comp.userYearInput({target:{value:2021}});
+//
+//         fixture.detectChanges();
+//         let invalidyear = getElement('.invalidyear');
+//         expect(invalidyear).not.toBe(null);
+//
+//         comp.userYearInput({target:{value:2020}});
+//
+//         fixture.detectChanges();
+//         yearlabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearlabel).not.toBe(null);
+//         expect(yearlabel.nativeElement.textContent).toBe('2020');
+//     });
+//
+//     it('options - disable until', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {disableUntil: {year: 2016, month: 10, day: 5}};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         let disabled = getElements('tr .disabled');
+//         expect(disabled).not.toBe(null);
+//         expect(disabled.length).toBe(10);
+//
+//         let firstDisabled = disabled[0];
+//         expect(firstDisabled.nativeElement.textContent.trim()).toBe('26');
+//
+//         let lastDisabled = disabled[disabled.length - 1];
+//         expect(lastDisabled.nativeElement.textContent.trim()).toBe('5');
+//
+//         fixture.detectChanges();
+//         lastDisabled.nativeElement.click();
+//         let selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('');
+//
+//         fixture.detectChanges();
+//         let selectableDays = getElements('.tablesingleday');
+//         expect(selectableDays).not.toBe(null);
+//         expect(selectableDays.length).toBe(26);
+//
+//         selectableDays[0].nativeElement.click();
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toContain('2016-10-06');
+//     });
+//
+//     it('options - disable since', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {disableSince: {year: 2016, month: 10, day: 30}};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         let disabled = getElements('tr .disabled');
+//         expect(disabled).not.toBe(null);
+//         expect(disabled.length).toBe(8);
+//
+//         let firstDisabled = disabled[0];
+//         expect(firstDisabled.nativeElement.textContent.trim()).toBe('30');
+//
+//         let lastDisabled = disabled[disabled.length - 1];
+//         expect(lastDisabled.nativeElement.textContent.trim()).toBe('6');
+//
+//         fixture.detectChanges();
+//         lastDisabled.nativeElement.click();
+//         let selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('');
+//
+//         fixture.detectChanges();
+//         let selectableDays = getElements('.tablesingleday');
+//         expect(selectableDays).not.toBe(null);
+//         expect(selectableDays.length).toBe(29);
+//
+//         selectableDays[5].nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toContain('2016-10-06');
+//     });
+//
+//     it('options - disable days one by one', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {disableDays: [{year: 2016, month: 10, day: 5}, {year: 2016, month: 10, day: 10}]};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         let disabled = getElements('tr .disabled');
+//         expect(disabled).not.toBe(null);
+//         expect(disabled.length).toBe(2);
+//
+//         let firstDisabled = disabled[0];
+//         expect(firstDisabled.nativeElement.textContent.trim()).toBe('5');
+//
+//         let lastDisabled = disabled[1];
+//         expect(lastDisabled.nativeElement.textContent.trim()).toBe('10');
+//     });
+//
+//     it('options - enable disabled days one by one', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2017};
+//         comp.options = {
+//             dateFormat: 'dd.mm.yyyy',
+//             disableDateRange: {begin: {year: 2017, month: 1, day: 1}, end: {year: 2017, month: 1, day: 31}},
+//             enableDays: [{year: 2017, month: 1, day: 5}, {year: 2017, month: 1, day: 6}, {year: 2017, month: 1, day: 7}, {year: 2017, month: 1, day: 8}]
+//         };
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(1, 2017, true);
+//
+//         fixture.detectChanges();
+//         let disabled = getElements('tr .disabled');
+//         expect(disabled).not.toBe(null);
+//         expect(disabled.length).toBe(27);
+//
+//         let firstDisabled = disabled[0];
+//         expect(firstDisabled.nativeElement.textContent.trim()).toBe('1');
+//
+//         let lastDisabled = disabled[disabled.length - 1];
+//         expect(lastDisabled.nativeElement.textContent.trim()).toBe('31');
+//
+//         fixture.detectChanges();
+//         let alldates = getElements('.caltable .daycell');
+//         expect(alldates).not.toBe(null);
+//         expect(alldates.length).toBe(42);
+//
+//         fixture.detectChanges();
+//         let firstEnabled = alldates[10];
+//         firstEnabled.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.nativeElement.value).toBe('05.01.2017');
+//     });
+//
+//     it('options - disable range', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {disableDateRange: {begin: {year: 2016, month: 10, day: 5}, end: {year: 2016, month: 10, day: 10}}};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         let disabled = getElements('tr .disabled');
+//         expect(disabled).not.toBe(null);
+//         expect(disabled.length).toBe(6);
+//
+//         let firstDisabled = disabled[0];
+//         expect(firstDisabled.nativeElement.textContent.trim()).toBe('5');
+//
+//         let lastDisabled = disabled[disabled.length - 1];
+//         expect(lastDisabled.nativeElement.textContent.trim()).toBe('10');
+//         btnpicker.nativeElement.click();
+//
+//
+//         comp.options = {disableDateRange: {begin: {}, end: {}}};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         disabled = getElements('tr .disabled');
+//         expect(disabled).not.toBe(null);
+//         expect(disabled.length).toBe(0);
+//     });
+//
+//     it('options - disable today - today button disabled', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//
+//         let date = new Date();
+//         comp.options = {disableDays: [{year: date.getFullYear(), month: date.getMonth() + 1, day: date.getDate()}]};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         let headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).not.toBe(null);
+//         expect(headertodaybtn.properties['disabled']).toBe(true);
+//
+//         fixture.detectChanges();
+//         headertodaybtn.nativeElement.click();
+//         let selector = getElement('.selector');
+//         expect(selector).not.toBe(null);
+//
+//         btnpicker.nativeElement.click();
+//
+//         comp.options = {disableDays: []};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker.nativeElement.click();
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).not.toBe(null);
+//         expect(headertodaybtn.properties['disabled']).toBe(false);
+//
+//         headertodaybtn.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.nativeElement.value).toBe(getDateString(date));
+//     });
+//
+//     it('options - disable weekends', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {firstDayOfWeek: 'mo', disableWeekends: true};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.generateCalendar(10, 2016, true);
+//
+//         fixture.detectChanges();
+//         let disabled = getElements('tr .disabled');
+//         expect(disabled).not.toBe(null);
+//         expect(disabled.length).toBe(12);
+//
+//         let firstDisabled = disabled[0];
+//         expect(firstDisabled.nativeElement.textContent.trim()).toBe('1');
+//
+//         let secondDisabled = disabled[1];
+//         expect(secondDisabled.nativeElement.textContent.trim()).toBe('2');
+//
+//         let lastDisabled = disabled[disabled.length - 1];
+//         expect(lastDisabled.nativeElement.textContent.trim()).toBe('6');
+//
+//         fixture.detectChanges();
+//         firstDisabled.nativeElement.click();
+//         let selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('');
+//
+//         fixture.detectChanges();
+//         secondDisabled.nativeElement.click();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('');
+//
+//         fixture.detectChanges();
+//         let selectableDays = getElements('.tablesingleday');
+//         expect(selectableDays).not.toBe(null);
+//         expect(selectableDays.length).toBe(21);
+//
+//         selectableDays[0].nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toContain('2016-10-03');
+//     });
+//
+//     it('options - inline', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {inline: true};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selector = getElement('.selector');
+//         expect(selector).not.toBe(null);
+//
+//         fixture.detectChanges();
+//         let selectiongroup = getElement('.selectiongroup');
+//         expect(selectiongroup).toBe(null);
+//     });
+//
+//     it('options - show clear date button', () => {
+//         let date = new Date();
+//         comp.selectedMonth = {monthTxt: '', monthNbr: date.getMonth() + 1, year: date.getFullYear()};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let currday = getElement('.currday');
+//         expect(currday).not.toBe(null);
+//
+//         currday.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let btnclear = getElement('.btnclear');
+//         expect(btnclear).not.toBe(null);
+//
+//         btnclear.nativeElement.click();
+//
+//         comp.options = {showClearDateBtn: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         currday = getElement('.currday');
+//         expect(currday).not.toBe(null);
+//
+//         currday.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         btnclear = getElement('.btnclear');
+//         expect(btnclear).not.toBe(null);
+//         btnclear.nativeElement.click();
+//
+//         btnclear.nativeElement.click();
+//
+//
+//         comp.options = {showClearDateBtn: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         currday = getElement('.currday');
+//         expect(currday).not.toBe(null);
+//
+//         currday.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         btnclear = getElement('.btnclear');
+//         expect(btnclear).toBe(null);
+//     });
+//
+//     it('options - height', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {height: '50px'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.styles['height']).toBe('50px');
+//     });
+//
+//     it('options - width', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {width: '300px'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         expect(de).not.toBe(null);
+//         expect(de.styles['width']).toBe('300px');
+//
+//         comp.options = {width: '20%'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         expect(de).not.toBe(null);
+//         expect(de.styles['width']).toBe('20%');
+//     });
+//
+//     it('options - selection text font size', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {selectionTxtFontSize: '10px'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.styles['font-size']).toBe('10px');
+//     });
+//
+//     it('options - align selector right', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {alignSelectorRight: true};
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let alignselectorright = getElement('.alignselectorright');
+//         expect(alignselectorright).not.toBe(null);
+//
+//         comp.options = {alignSelectorRight: false};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         alignselectorright = getElement('.alignselectorright');
+//         expect(alignselectorright).toBe(null);
+//     });
+//
+//     it('options - open selector top of input', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {openSelectorTopOfInput: true, height: '30px'};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         let value: string = comp.getSelectorTopPosition();
+//         expect(value).not.toBe(null);
+//         expect(value).toBe('32px');
+//
+//         btnpicker.nativeElement.click();
+//
+//
+//         comp.options = {openSelectorTopOfInput: false};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         value = comp.getSelectorTopPosition();
+//         expect(value).toBe(undefined);
+//
+//
+//         btnpicker.nativeElement.click();
+//
+//         comp.options = {};
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         value = comp.getSelectorTopPosition();
+//         expect(value).toBe(undefined);
+//     });
+//
+//     it('options - indicate invalid date', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {indicateInvalidDate: true, dateFormat: 'dd.mm.yyyy'};
+//
+//         comp.parseOptions();
+//
+//         comp.userDateInput({target:{value:'2016-08-22'}});
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'2016-08-xx'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'2016-08-99'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'10.10.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//     });
+//
+//     it('options - disableUntil input dates validation', ()=> {
+//         comp.options = {
+//             indicateInvalidDate: true,
+//             dateFormat: 'dd.mm.yyyy',
+//             disableUntil:{year: 2016, month: 11, day: 4}
+//         };
+//
+//         comp.parseOptions();
+//
+//         comp.userDateInput({target:{value:'11.12.2015'}});
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'11.06.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'04.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'05.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//
+//         comp.options = {
+//             indicateInvalidDate: true,
+//             dateFormat: 'dd.mm.yyyy',
+//             disableUntil:{year: 0, month: 0, day: 0}
+//         };
+//
+//         comp.parseOptions();
+//
+//         comp.userDateInput({target:{value:'11.12.2015'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//     });
+//
+//     it('options - disableSince input dates validation', ()=> {
+//         comp.options = {
+//             indicateInvalidDate: true,
+//             dateFormat: 'dd.mm.yyyy',
+//             disableSince:{year: 2016, month: 11, day: 22}
+//         };
+//
+//         comp.parseOptions();
+//
+//         comp.userDateInput({target:{value:'08.12.2017'}});
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'08.12.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'23.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'21.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//
+//         comp.options = {
+//             indicateInvalidDate: true,
+//             dateFormat: 'dd.mm.yyyy',
+//             disableSince:{year: 0, month: 0, day: 0}
+//         };
+//
+//         comp.parseOptions();
+//
+//         comp.userDateInput({target:{value:'11.12.2015'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//     });
+//
+//     it('options - disable weekends input date validation', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 11, year: 2016};
+//         comp.options = {
+//             indicateInvalidDate: true,
+//             dateFormat: 'dd.mm.yyyy',
+//             disableWeekends: true,
+//             firstDayOfWeek: 'mo'
+//         };
+//
+//         comp.parseOptions();
+//
+//         comp.userDateInput({target:{value:'05.11.2016'}});
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'06.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'12.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'13.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'19.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'20.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'26.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'27.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'04.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//     });
+//
+//     it('options - disableDays input date validation', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 11, year: 2016};
+//         comp.options = {
+//             indicateInvalidDate: true,
+//             dateFormat: 'dd.mm.yyyy',
+//             disableDays: [
+//                 {year: 2016, month: 11, day: 1},
+//                 {year: 2016, month: 11, day: 3},
+//                 {year: 2016, month: 11, day: 5},
+//                 {year: 2016, month: 11, day: 7}
+//             ],
+//             firstDayOfWeek: 'mo'
+//         };
+//
+//         comp.parseOptions();
+//
+//         comp.userDateInput({target:{value:'01.11.2016'}});
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'03.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'05.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'07.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'02.11.2016'}});
+//         fixture.detectChanges();
+//         invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//     });
+//
+//     it('options - disable component', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {componentDisabled: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//
+//         btnpicker.nativeElement.click();
+//         fixture.detectChanges();
+//
+//         let selector = getElement('.selector');
+//         expect(selector).toBe(null);
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//
+//         selection.nativeElement.value = '2016-11-14';
+//
+//         fixture.detectChanges();
+//         expect(selection.nativeElement.value).toContain('');
+//     });
+//
+//     it('options - editable date field', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {editableDateField: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//
+//         selection.nativeElement.value = '2016-11-14';
+//
+//         fixture.detectChanges();
+//         expect(selection.nativeElement.value).toContain('');
+//
+//         comp.options = {editableDateField: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//
+//         selection.nativeElement.value = '2016-11-14';
+//
+//         fixture.detectChanges();
+//         expect(selection.nativeElement.value).toContain('2016-11-14');
+//     });
+//
+//     it('options - click input to open selector', () => {
+//
+//         let selection: DebugElement,
+//             selector: DebugElement;
+//
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {editableDateField: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//
+//         selection.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selector = getElement('.selector');
+//         expect(selector).toBe(null);
+//
+//         comp.options = {editableDateField: false, openSelectorOnInputClick: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//
+//         selection.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selector = getElement('.selector');
+//         expect(selector).not.toBe(null);
+//     });
+//
+//     it('options - input field value required', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.properties['required']).toBe(false);
+//
+//         comp.options = {inputValueRequired: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.properties['required']).toBe(true);
+//
+//         comp.options = {inputValueRequired: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.properties['required']).toBe(false);
+//     });
+//
+//     it('options - show selector arrow', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let selectorarrow = getElement('.selectorarrow');
+//         expect(selectorarrow).not.toBe(null);
+//         btnpicker.nativeElement.click();
+//
+//
+//         comp.options = {showSelectorArrow: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selectorarrow = getElement('.selectorarrow');
+//         expect(selectorarrow).toBe(null);
+//         btnpicker.nativeElement.click();
+//
+//
+//         comp.options = {showSelectorArrow: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selectorarrow = getElement('.selectorarrow');
+//         expect(selectorarrow).not.toBe(null);
+//         btnpicker.nativeElement.click();
+//     });
+//
+//     it('options - show input field', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 10, year: 2016};
+//         comp.options = {};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//
+//
+//         comp.options = {showInputField: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection).toBe(null);
+//
+//
+//         comp.options = {showInputField: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//     });
+//
+//     it('options - input auto fill', () => {
+//         comp.options = {inputAutoFill: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//
+//         fixture.detectChanges();
+//         selection.nativeElement.value = '2016-2-1';
+//         fixture.nativeElement.querySelector('.selection').dispatchEvent(new Event('keyup'));
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('2016-2-1');
+//
+//
+//         comp.options = {inputAutoFill: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         selection.nativeElement.value = '';
+//
+//         fixture.detectChanges();
+//         selection.nativeElement.value = '2016-1-';
+//         fixture.nativeElement.querySelector('.selection').dispatchEvent(new Event('keyup'));
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('2016-01-');
+//
+//         fixture.detectChanges();
+//         selection.nativeElement.value = '2016-01-9';
+//         fixture.nativeElement.querySelector('.selection').dispatchEvent(new Event('keyup'));
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection.nativeElement.value).toBe('2016-01-09');
+//     });
+//
+//     it('options - show week numbers', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2017};
+//         comp.options = {showWeekNumbers: false};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let weekdaytitleweeknbr = getElement('.weekdaytitleweeknbr');
+//         expect(weekdaytitleweeknbr).toBe(null);
+//
+//         fixture.detectChanges();
+//         let daycellweeknbr = getElements('.daycellweeknbr');
+//         expect(daycellweeknbr.length).toBe(0);
+//
+//         btnpicker.nativeElement.click();
+//
+//
+//         comp.options = {showWeekNumbers: true};
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         weekdaytitleweeknbr = getElement('.weekdaytitleweeknbr');
+//         expect(weekdaytitleweeknbr).not.toBe(null);
+//
+//         fixture.detectChanges();
+//         daycellweeknbr = getElements('.daycellweeknbr');
+//         expect(daycellweeknbr.length).toBe(6);
+//
+//         expect(daycellweeknbr[0].nativeElement.textContent.trim()).toBe('52');
+//         expect(daycellweeknbr[1].nativeElement.textContent.trim()).toBe('1');
+//         expect(daycellweeknbr[2].nativeElement.textContent.trim()).toBe('2');
+//         expect(daycellweeknbr[3].nativeElement.textContent.trim()).toBe('3');
+//         expect(daycellweeknbr[4].nativeElement.textContent.trim()).toBe('4');
+//         expect(daycellweeknbr[5].nativeElement.textContent.trim()).toBe('5');
+//
+//         fixture.detectChanges();
+//         let prevyear = getElement(PREVYEAR);
+//         expect(prevyear).not.toBe(null);
+//         prevyear.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         daycellweeknbr = getElements('.daycellweeknbr');
+//         expect(daycellweeknbr.length).toBe(6);
+//
+//         expect(daycellweeknbr[0].nativeElement.textContent.trim()).toBe('53');
+//         expect(daycellweeknbr[1].nativeElement.textContent.trim()).toBe('1');
+//         expect(daycellweeknbr[2].nativeElement.textContent.trim()).toBe('2');
+//         expect(daycellweeknbr[3].nativeElement.textContent.trim()).toBe('3');
+//         expect(daycellweeknbr[4].nativeElement.textContent.trim()).toBe('4');
+//         expect(daycellweeknbr[5].nativeElement.textContent.trim()).toBe('5');
+//
+//         prevyear.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         daycellweeknbr = getElements('.daycellweeknbr');
+//         expect(daycellweeknbr.length).toBe(6);
+//
+//         expect(daycellweeknbr[0].nativeElement.textContent.trim()).toBe('1');
+//         expect(daycellweeknbr[1].nativeElement.textContent.trim()).toBe('2');
+//         expect(daycellweeknbr[2].nativeElement.textContent.trim()).toBe('3');
+//         expect(daycellweeknbr[3].nativeElement.textContent.trim()).toBe('4');
+//         expect(daycellweeknbr[4].nativeElement.textContent.trim()).toBe('5');
+//         expect(daycellweeknbr[5].nativeElement.textContent.trim()).toBe('6');
+//     });
+//
+//     it('options - aria label texts', () => {
+//         comp.selectedDate = comp.parseSelectedDate('2017-10-11');
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         expect(btnpicker).not.toBe(null);
+//         expect(btnpicker.nativeElement.attributes['aria-label'].textContent).toBe('Open Calendar');
+//
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.nativeElement.attributes['aria-label'].textContent).toBe('Date input field');
+//
+//         fixture.detectChanges();
+//         let btnclear = getElement('.btnclear');
+//         expect(btnclear).not.toBe(null);
+//         expect(btnclear.nativeElement.attributes['aria-label'].textContent).toBe('Clear Date');
+//
+//
+//         fixture.detectChanges();
+//         let prevmonth = getElement(PREVMONTH);
+//         expect(prevmonth).not.toBe(null);
+//         expect(prevmonth.nativeElement.attributes['aria-label'].textContent).toBe('Previous Month');
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//         expect(nextmonth.nativeElement.attributes['aria-label'].textContent).toBe('Next Month');
+//
+//         fixture.detectChanges();
+//         let prevyear = getElement(PREVYEAR);
+//         expect(prevyear).not.toBe(null);
+//         expect(prevyear.nativeElement.attributes['aria-label'].textContent).toBe('Previous Year');
+//
+//         fixture.detectChanges();
+//         let nextyear = getElement(NEXTYEAR);
+//         expect(nextyear).not.toBe(null);
+//         expect(nextyear.nativeElement.attributes['aria-label'].textContent).toBe('Next Year');
+//
+//         btnpicker.nativeElement.click();
+//
+//         comp.options = {
+//             ariaLabelInputField: 'text 1',
+//             ariaLabelClearDate: 'text 2',
+//             ariaLabelOpenCalendar: 'text 3',
+//             ariaLabelPrevMonth: 'text 4',
+//             ariaLabelNextMonth: 'text 5',
+//             ariaLabelPrevYear: 'text 6',
+//             ariaLabelNextYear: 'text 7'
+//         };
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         btnpicker = getElement('.btnpicker');
+//         expect(btnpicker).not.toBe(null);
+//         expect(btnpicker.nativeElement.attributes['aria-label'].textContent).toBe(comp.options.ariaLabelOpenCalendar);
+//
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.nativeElement.attributes['aria-label'].textContent).toBe(comp.options.ariaLabelInputField);
+//
+//         fixture.detectChanges();
+//         btnclear = getElement('.btnclear');
+//         expect(btnclear).not.toBe(null);
+//         expect(btnclear.nativeElement.attributes['aria-label'].textContent).toBe(comp.options.ariaLabelClearDate);
+//
+//
+//         fixture.detectChanges();
+//         prevmonth = getElement(PREVMONTH);
+//         expect(prevmonth).not.toBe(null);
+//         expect(prevmonth.nativeElement.attributes['aria-label'].textContent).toBe(comp.options.ariaLabelPrevMonth);
+//
+//         fixture.detectChanges();
+//         nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//         expect(nextmonth.nativeElement.attributes['aria-label'].textContent).toBe(comp.options.ariaLabelNextMonth);
+//
+//         fixture.detectChanges();
+//         prevyear = getElement(PREVYEAR);
+//         expect(prevyear).not.toBe(null);
+//         expect(prevyear.nativeElement.attributes['aria-label'].textContent).toBe(comp.options.ariaLabelPrevYear);
+//
+//         fixture.detectChanges();
+//         nextyear = getElement(NEXTYEAR);
+//         expect(nextyear).not.toBe(null);
+//         expect(nextyear.nativeElement.attributes['aria-label'].textContent).toBe(comp.options.ariaLabelNextYear);
+//     });
+//
+//     it('locale - use fr locale', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2016};
+//         comp.locale = 'fr';
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let days = getElements('.caltable thead tr th');
+//         expect(days.length).toBe(7);
+//         expect(days[0].nativeElement.textContent).toBe('Lun');
+//         expect(days[1].nativeElement.textContent).toBe('Mar');
+//         expect(days[2].nativeElement.textContent).toBe('Mer');
+//         expect(days[3].nativeElement.textContent).toBe('Jeu');
+//         expect(days[4].nativeElement.textContent).toBe('Ven');
+//         expect(days[5].nativeElement.textContent).toBe('Sam');
+//         expect(days[6].nativeElement.textContent).toBe('Dim');
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//
+//         fixture.detectChanges();
+//         let monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Jan');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Fév');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Mar');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Avr');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Mai');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Juin');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Juil');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Aoû');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Sep');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Oct');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Nov');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Déc');
+//
+//         fixture.detectChanges();
+//         let headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).not.toBe(null);
+//         expect(headertodaybtn.nativeElement.textContent).toBe('Aujourd\'hui');
+//
+//         fixture.detectChanges();
+//         let firstDayOfWeek = getElement('.caltable thead tr th:first-child');
+//         expect(firstDayOfWeek).not.toBe(null);
+//         expect(firstDayOfWeek.nativeElement.textContent).toBe('Lun');
+//
+//         fixture.detectChanges();
+//         let sunday = getElement('.sunday');
+//         expect(sunday).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'10/10/2016'}});
+//         expect(comp.invalidDate).toBe(false);
+//
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//     });
+//
+//     it('selDate - initially selected date - string', () => {
+//         let date: string = '2017-10-11';
+//         comp.selectedDate = comp.parseSelectedDate(date);
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.nativeElement.value).toContain('2017-10-11');
+//
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let selectedday = getElement('.selectedday div span');
+//         expect(selectedday).not.toBe(null);
+//         expect(selectedday.nativeElement.textContent).toContain('11');
+//
+//         fixture.detectChanges();
+//         let monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel).not.toBe(null);
+//         expect(monthLabel.nativeElement.textContent).toBe('Oct');
+//
+//         fixture.detectChanges();
+//         let yearLabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearLabel).not.toBe(null);
+//         expect(yearLabel.nativeElement.textContent).toBe('2017');
+//     });
+//
+//     it('selDate - initially selected date - object', () => {
+//         let date: Object = {year: 2017, month: 10, day: 11};
+//         comp.selectedDate = comp.parseSelectedDate(date);
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.nativeElement.value).toContain('2017-10-11');
+//         expect(comp.selectionDayTxt).toContain('2017-10-11');
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let selectedday = getElement('.selectedday div span');
+//         expect(selectedday).not.toBe(null);
+//         expect(selectedday.nativeElement.textContent).toContain('11');
+//
+//         fixture.detectChanges();
+//         let monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel).not.toBe(null);
+//         expect(monthLabel.nativeElement.textContent).toBe('Oct');
+//
+//         fixture.detectChanges();
+//         let yearLabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearLabel).not.toBe(null);
+//         expect(yearLabel.nativeElement.textContent).toBe('2017');
+//     });
+//
+//     it('defaultMonth - initially selected month', () => {
+//         comp.selectedMonth = comp.parseSelectedMonth('2019-08');
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel).not.toBe(null);
+//         expect(monthLabel.nativeElement.textContent).toBe('Aug');
+//
+//         fixture.detectChanges();
+//         let yearLabel = getElement('.headeryeartxt .headerlabelbtn');
+//         expect(yearLabel).not.toBe(null);
+//         expect(yearLabel.nativeElement.textContent).toBe('2019');
+//     });
+//
+//     it('placeholder - placeholder text', () => {
+//         comp.placeholder = '';
+//
+//         fixture.detectChanges();
+//         let selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.properties['placeholder']).toBe('');
+//
+//         comp.placeholder = 'Select date';
+//
+//         fixture.detectChanges();
+//         selection = getElement('.selection');
+//         expect(selection).not.toBe(null);
+//         expect(selection.properties['placeholder']).toBe(comp.placeholder);
+//
+//
+//     });
+//
+//     it('locale - use id locale', () => {
+//         comp.selectedMonth = {monthTxt: '', monthNbr: 1, year: 2016};
+//         comp.locale = 'id';
+//
+//         comp.parseOptions();
+//
+//         fixture.detectChanges();
+//         let btnpicker = getElement('.btnpicker');
+//         btnpicker.nativeElement.click();
+//
+//         fixture.detectChanges();
+//         let days = getElements('.caltable thead tr th');
+//         expect(days.length).toBe(7);
+//         expect(days[0].nativeElement.textContent).toBe('Min');
+//         expect(days[1].nativeElement.textContent).toBe('Sen');
+//         expect(days[2].nativeElement.textContent).toBe('Sel');
+//         expect(days[3].nativeElement.textContent).toBe('Rab');
+//         expect(days[4].nativeElement.textContent).toBe('Kam');
+//         expect(days[5].nativeElement.textContent).toBe('Jum');
+//         expect(days[6].nativeElement.textContent).toBe('Sab');
+//
+//         fixture.detectChanges();
+//         let nextmonth = getElement(NEXTMONTH);
+//         expect(nextmonth).not.toBe(null);
+//
+//         fixture.detectChanges();
+//         let monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Jan');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Feb');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Mar');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Apr');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Mei');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Jun');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Jul');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Ags');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Sep');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Okt');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Nov');
+//
+//         nextmonth.nativeElement.click();
+//         fixture.detectChanges();
+//         monthLabel = getElement('.headermonthtxt .headerlabelbtn');
+//         expect(monthLabel.nativeElement.textContent).toBe('Des');
+//
+//         fixture.detectChanges();
+//         let headertodaybtn = getElement('.headertodaybtn');
+//         expect(headertodaybtn).not.toBe(null);
+//         expect(headertodaybtn.nativeElement.textContent).toBe('Hari ini');
+//
+//         fixture.detectChanges();
+//         let firstDayOfWeek = getElement('.caltable thead tr th:first-child');
+//         expect(firstDayOfWeek).not.toBe(null);
+//         expect(firstDayOfWeek.nativeElement.textContent).toBe('Min');
+//
+//         fixture.detectChanges();
+//         let sunday = getElement('.sunday');
+//         expect(sunday).not.toBe(null);
+//
+//         comp.userDateInput({target:{value:'10-10-2016'}});
+//         expect(comp.invalidDate).toBe(false);
+//
+//         fixture.detectChanges();
+//         let invaliddate = getElement('.invaliddate');
+//         expect(invaliddate).toBe(null);
+//     });
+//
+// });
diff --git a/utils/my-date-picker/my-date-picker.component.ts b/utils/my-date-picker/my-date-picker.component.ts
new file mode 100644
index 00000000..389a5be3
--- /dev/null
+++ b/utils/my-date-picker/my-date-picker.component.ts
@@ -0,0 +1,677 @@
+import { Component, Input, Output, EventEmitter, OnChanges, SimpleChanges, ElementRef, ViewEncapsulation, ChangeDetectorRef, Renderer, forwardRef } from "@angular/core";
+import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms";
+import { IMyDate, IMyDateRange, IMyMonth, IMyCalendarDay, IMyWeek, IMyDayLabels, IMyMonthLabels, IMyOptions, IMyDateModel, IMyInputAutoFill, IMyInputFieldChanged, IMyCalendarViewChanged, IMyInputFocusBlur } from "./interfaces/index";
+import { LocaleService } from "./services/my-date-picker.locale.service";
+import { UtilService } from "./services/my-date-picker.util.service";
+
+// webpack1_
+declare var require: any;
+// declare var myDpStyles: string = require("./my-date-picker.component.css");
+// declare var myDpTpl: string = require("./my-date-picker.component.html");
+// webpack2_
+
+export const MYDP_VALUE_ACCESSOR: any = {
+    provide: NG_VALUE_ACCESSOR,
+    useExisting: forwardRef(() => MyDatePicker),
+    multi: true
+};
+
+@Component({
+    selector: "my-date-picker",
+    styleUrls: ['my-date-picker.component.css'],
+    templateUrl: 'my-date-picker.component.html',
+    providers: [LocaleService, UtilService, MYDP_VALUE_ACCESSOR],
+    encapsulation: ViewEncapsulation.None
+})
+
+export class MyDatePicker implements OnChanges, ControlValueAccessor {
+    @Input() options: any;
+    @Input() locale: string;
+    @Input() defaultMonth: string;
+    @Input() selDate: string;
+    @Input() placeholder: string;
+    @Input() selector: number;
+    @Output() dateChanged: EventEmitter<IMyDateModel> = new EventEmitter<IMyDateModel>();
+    @Output() inputFieldChanged: EventEmitter<IMyInputFieldChanged> = new EventEmitter<IMyInputFieldChanged>();
+    @Output() calendarViewChanged: EventEmitter<IMyCalendarViewChanged> = new EventEmitter<IMyCalendarViewChanged>();
+    @Output() calendarToggle: EventEmitter<number> = new EventEmitter<number>();
+    @Output() inputFocusBlur: EventEmitter<IMyInputFocusBlur> = new EventEmitter<IMyInputFocusBlur>();
+
+    onChangeCb: (_: any) => void = () => { };
+    onTouchedCb: () => void = () => { };
+
+    showSelector: boolean = false;
+    visibleMonth: IMyMonth = {monthTxt: "", monthNbr: 0, year: 0};
+    selectedMonth: IMyMonth = {monthTxt: "", monthNbr: 0, year: 0};
+    selectedDate: IMyDate = {year: 0, month: 0, day: 0};
+    weekDays: Array<string> = [];
+    dates: Array<IMyWeek> = [];
+    selectionDayTxt: string = "";
+    invalidDate: boolean = false;
+    disableTodayBtn: boolean = false;
+    dayIdx: number = 0;
+    weekDayOpts: Array<string> = ["su", "mo", "tu", "we", "th", "fr", "sa"];
+    autoFillOpts: IMyInputAutoFill = {separator: "", formatParts: [], enabled: true};
+
+    editMonth: boolean = false;
+    invalidMonth: boolean = false;
+    editYear: boolean = false;
+    invalidYear: boolean = false;
+
+    prevMonthDisabled: boolean = false;
+    nextMonthDisabled: boolean = false;
+    prevYearDisabled: boolean = false;
+    nextYearDisabled: boolean = false;
+
+    PREV_MONTH: number = 1;
+    CURR_MONTH: number = 2;
+    NEXT_MONTH: number = 3;
+
+    MIN_YEAR: number = 1000;
+    MAX_YEAR: number = 9999;
+
+    // Default options
+    opts: IMyOptions = {
+        dayLabels: <IMyDayLabels> {},
+        monthLabels: <IMyMonthLabels> {},
+        dateFormat: <string> "",
+        showTodayBtn: <boolean> true,
+        todayBtnTxt: <string> "",
+        firstDayOfWeek: <string> "",
+        sunHighlight: <boolean> true,
+        markCurrentDay: <boolean> true,
+        disableUntil: <IMyDate> {year: 0, month: 0, day: 0},
+        disableSince: <IMyDate> {year: 0, month: 0, day: 0},
+        disableDays: <Array<IMyDate>> [],
+        enableDays: <Array<IMyDate>> [],
+        disableDateRange: <IMyDateRange> {begin: <IMyDate> {year: 0, month: 0, day: 0}, end: <IMyDate> {year: 0, month: 0, day: 0}},
+        disableWeekends: <boolean> false,
+        showWeekNumbers: <boolean> false,
+        height: <string> "34px",
+        width: <string> "100%",
+        selectionTxtFontSize: <string> "18px",
+        inline: <boolean> false,
+        showClearDateBtn: <boolean> true,
+        alignSelectorRight: <boolean> false,
+        openSelectorTopOfInput: <boolean> false,
+        indicateInvalidDate: <boolean> true,
+        editableDateField: <boolean> true,
+        editableMonthAndYear: <boolean> true,
+        disableHeaderButtons: <boolean> true,
+        minYear: <number> this.MIN_YEAR,
+        maxYear: <number> this.MAX_YEAR,
+        componentDisabled: <boolean> false,
+        inputValueRequired: <boolean> false,
+        showSelectorArrow: <boolean> true,
+        showInputField: <boolean> true,
+        openSelectorOnInputClick: <boolean> false,
+        inputAutoFill: <boolean> true,
+        ariaLabelInputField: <string> "Date input field",
+        ariaLabelClearDate: <string> "Clear Date",
+        ariaLabelOpenCalendar: <string> "Open Calendar",
+        ariaLabelPrevMonth: <string> "Previous Month",
+        ariaLabelNextMonth: <string> "Next Month",
+        ariaLabelPrevYear: <string> "Previous Year",
+        ariaLabelNextYear: <string> "Next Year"
+    };
+
+    constructor(public elem: ElementRef, private renderer: Renderer, private cdr: ChangeDetectorRef, private localeService: LocaleService, private utilService: UtilService) {
+        this.setLocaleOptions();
+        renderer.listenGlobal("document", "click", (event: any) => {
+            if (this.showSelector && event.target && this.elem.nativeElement !== event.target && !this.elem.nativeElement.contains(event.target)) {
+                this.showSelector = false;
+                this.calendarToggle.emit(4);
+            }
+            if (this.opts.editableMonthAndYear && event.target && this.elem.nativeElement.contains(event.target)) {
+                this.resetMonthYearEdit();
+            }
+        });
+    }
+
+    setLocaleOptions(): void {
+        let opts: IMyOptions = this.localeService.getLocaleOptions(this.locale);
+        Object.keys(opts).forEach((k) => {
+            (<IMyOptions>this.opts)[k] = opts[k];
+        });
+    }
+
+    setOptions(): void {
+        if (this.options !== undefined) {
+            Object.keys(this.options).forEach((k) => {
+                (<IMyOptions>this.opts)[k] = this.options[k];
+            });
+        }
+        if (this.opts.minYear < this.MIN_YEAR) {
+            this.opts.minYear = this.MIN_YEAR;
+        }
+        if (this.opts.maxYear > this.MAX_YEAR) {
+            this.opts.maxYear = this.MAX_YEAR;
+        }
+
+        let separator: string = this.utilService.getDateFormatSeparator(this.opts.dateFormat);
+        this.autoFillOpts = {separator: separator, formatParts: this.opts.dateFormat.split(separator), enabled: this.opts.inputAutoFill};
+    }
+
+    getComponentWidth(): string {
+        if (this.opts.showInputField) {
+            return this.opts.width;
+        }
+        else if (this.selectionDayTxt.length > 0 && this.opts.showClearDateBtn) {
+            return "60px";
+        }
+        else {
+            return "30px";
+        }
+    }
+
+    getSelectorTopPosition(): string {
+        if (this.opts.openSelectorTopOfInput) {
+            return this.elem.nativeElement.children[0].offsetHeight + "px";
+        }
+    }
+
+    resetMonthYearEdit(): void {
+        this.editMonth = false;
+        this.editYear = false;
+        this.invalidMonth = false;
+        this.invalidYear = false;
+    }
+
+    editMonthClicked(event: any): void {
+        event.stopPropagation();
+        if (this.opts.editableMonthAndYear) {
+            this.editMonth = true;
+        }
+    }
+
+    editYearClicked(event: any): void {
+        event.stopPropagation();
+        if (this.opts.editableMonthAndYear) {
+            this.editYear = true;
+        }
+    }
+
+    userDateInput(event: any): void {
+        this.invalidDate = false;
+        if (event.target.value.length === 0) {
+            this.clearDate();
+        }
+        else {
+            let date: IMyDate = this.utilService.isDateValid(event.target.value, this.opts.dateFormat, this.opts.minYear, this.opts.maxYear, this.opts.disableUntil, this.opts.disableSince, this.opts.disableWeekends, this.opts.disableDays, this.opts.disableDateRange, this.opts.monthLabels, this.opts.enableDays);
+            if (date.day !== 0 && date.month !== 0 && date.year !== 0) {
+                this.selectDate(date);
+            }
+            else {
+                this.invalidDate = true;
+            }
+        }
+        if (this.invalidDate) {
+            this.inputFieldChanged.emit({value: event.target.value, dateFormat: this.opts.dateFormat, valid: !(event.target.value.length === 0 || this.invalidDate)});
+            this.onChangeCb("");
+            this.onTouchedCb();
+        }
+    }
+
+    onFocusInput(event: any): void {
+        this.inputFocusBlur.emit({reason: 1, value: event.target.value});
+    }
+
+    lostFocusInput(event: any): void {
+        this.selectionDayTxt = event.target.value;
+        this.onTouchedCb();
+        this.inputFocusBlur.emit({reason: 2, value: event.target.value});
+    }
+
+    userMonthInput(event: any): void {
+        if (event.keyCode === 13 || event.keyCode === 37 || event.keyCode === 39) {
+            return;
+        }
+
+        this.invalidMonth = false;
+
+        let m: number = this.utilService.isMonthLabelValid(event.target.value, this.opts.monthLabels);
+        if (m !== -1) {
+            this.editMonth = false;
+            if (m !== this.visibleMonth.monthNbr) {
+                this.visibleMonth = {monthTxt: this.monthText(m), monthNbr: m, year: this.visibleMonth.year};
+                this.generateCalendar(m, this.visibleMonth.year, true);
+            }
+        }
+        else {
+            this.invalidMonth = true;
+        }
+    }
+
+    userYearInput(event: any): void {
+        if (event.keyCode === 13 || event.keyCode === 37 || event.keyCode === 39) {
+            return;
+        }
+
+        this.invalidYear = false;
+
+        let y: number = this.utilService.isYearLabelValid(Number(event.target.value), this.opts.minYear, this.opts.maxYear);
+        if (y !== -1) {
+            this.editYear = false;
+            if (y !== this.visibleMonth.year) {
+                this.visibleMonth = {monthTxt: this.visibleMonth.monthTxt, monthNbr: this.visibleMonth.monthNbr, year: y};
+                this.generateCalendar(this.visibleMonth.monthNbr, y, true);
+            }
+        }
+        else {
+            this.invalidYear = true;
+        }
+    }
+
+    isTodayDisabled(): void {
+        this.disableTodayBtn = this.utilService.isDisabledDay(this.getToday(), this.opts.disableUntil, this.opts.disableSince, this.opts.disableWeekends, this.opts.disableDays, this.opts.disableDateRange, this.opts.enableDays);
+    }
+
+    parseOptions(): void {
+        if (this.locale) {
+            this.setLocaleOptions();
+        }
+        this.setOptions();
+        this.isTodayDisabled();
+        this.dayIdx = this.weekDayOpts.indexOf(this.opts.firstDayOfWeek);
+        if (this.dayIdx !== -1) {
+            let idx: number = this.dayIdx;
+            for (let i = 0; i < this.weekDayOpts.length; i++) {
+                this.weekDays.push(this.opts.dayLabels[this.weekDayOpts[idx]]);
+                idx = this.weekDayOpts[idx] === "sa" ? 0 : idx + 1;
+            }
+        }
+    }
+
+    writeValue(value: Object): void {
+        if (value && value["date"]) {
+            this.updateDateValue(this.parseSelectedDate(value["date"]), false);
+        }
+        else if (value === "") {
+            this.updateDateValue({year: 0, month: 0, day: 0}, true);
+        }
+    }
+
+    registerOnChange(fn: any): void {
+        this.onChangeCb = fn;
+    }
+
+    registerOnTouched(fn: any): void {
+        this.onTouchedCb = fn;
+    }
+
+    ngOnChanges(changes: SimpleChanges): void {
+        if (changes.hasOwnProperty("selector") && changes["selector"].currentValue > 0) {
+            this.openBtnClicked();
+        }
+
+        if (changes.hasOwnProperty("placeholder")) {
+            this.placeholder = changes["placeholder"].currentValue;
+        }
+
+        if (changes.hasOwnProperty("locale")) {
+            this.locale = changes["locale"].currentValue;
+        }
+
+        if (changes.hasOwnProperty("options")) {
+            this.options = changes["options"].currentValue;
+        }
+
+        this.weekDays.length = 0;
+        this.parseOptions();
+
+        if (changes.hasOwnProperty("defaultMonth")) {
+            let dm: string = changes["defaultMonth"].currentValue;
+            if (dm !== null && dm !== undefined && dm !== "") {
+                this.selectedMonth = this.parseSelectedMonth(dm);
+            }
+            else {
+                this.selectedMonth = {monthTxt: "", monthNbr: 0, year: 0};
+            }
+        }
+
+        if (changes.hasOwnProperty("selDate")) {
+            let sd: any = changes["selDate"];
+            if (sd.currentValue !== null && sd.currentValue !== undefined && sd.currentValue !== "" && Object.keys(sd.currentValue).length !== 0) {
+                this.selectedDate = this.parseSelectedDate(sd.currentValue);
+                setTimeout(() => {
+                    this.onChangeCb(this.getDateModel(this.selectedDate));
+                });
+            }
+            else {
+                // Do not clear on init
+                if (!sd.isFirstChange()) {
+                    this.clearDate();
+                }
+            }
+        }
+        if (this.opts.inline) {
+            this.setVisibleMonth();
+        }
+        else if (this.showSelector) {
+            this.generateCalendar(this.visibleMonth.monthNbr, this.visibleMonth.year, false);
+        }
+    }
+
+    removeBtnClicked(): void {
+        // Remove date button clicked
+        this.clearDate();
+        if (this.showSelector) {
+            this.calendarToggle.emit(3);
+        }
+        this.showSelector = false;
+    }
+
+    openBtnClicked(): void {
+        // Open selector button clicked
+        this.showSelector = !this.showSelector;
+        if (this.showSelector) {
+            this.setVisibleMonth();
+            this.calendarToggle.emit(1);
+        }
+        else {
+            this.calendarToggle.emit(3);
+        }
+    }
+
+    setVisibleMonth(): void {
+        // Sets visible month of calendar
+        let y: number = 0, m: number = 0;
+        if (!this.utilService.isInitializedDate(this.selectedDate)) {
+            if (this.selectedMonth.year === 0 && this.selectedMonth.monthNbr === 0) {
+                let today: IMyDate = this.getToday();
+                y = today.year;
+                m = today.month;
+            } else {
+                y = this.selectedMonth.year;
+                m = this.selectedMonth.monthNbr;
+            }
+        }
+        else {
+            y = this.selectedDate.year;
+            m = this.selectedDate.month;
+        }
+        this.visibleMonth = {monthTxt: this.opts.monthLabels[m], monthNbr: m, year: y};
+
+        // Create current month
+        this.generateCalendar(m, y, true);
+    }
+
+    prevMonth(): void {
+        // Previous month from calendar
+        let d: Date = this.getDate(this.visibleMonth.year, this.visibleMonth.monthNbr, 1);
+        d.setMonth(d.getMonth() - 1);
+
+        let y: number = d.getFullYear();
+        let m: number = d.getMonth() + 1;
+
+        this.visibleMonth = {monthTxt: this.monthText(m), monthNbr: m, year: y};
+        this.generateCalendar(m, y, true);
+    }
+
+    nextMonth(): void {
+        // Next month from calendar
+        let d: Date = this.getDate(this.visibleMonth.year, this.visibleMonth.monthNbr, 1);
+        d.setMonth(d.getMonth() + 1);
+
+        let y: number = d.getFullYear();
+        let m: number = d.getMonth() + 1;
+
+        this.visibleMonth = {monthTxt: this.monthText(m), monthNbr: m, year: y};
+        this.generateCalendar(m, y, true);
+    }
+
+    prevYear(): void {
+        // Previous year from calendar
+        this.visibleMonth.year--;
+        this.generateCalendar(this.visibleMonth.monthNbr, this.visibleMonth.year, true);
+    }
+
+    nextYear(): void {
+        // Next year from calendar
+        this.visibleMonth.year++;
+        this.generateCalendar(this.visibleMonth.monthNbr, this.visibleMonth.year, true);
+    }
+
+    todayClicked(): void {
+        // Today button clicked
+        let today: IMyDate = this.getToday();
+        this.selectDate(today);
+        if (this.opts.inline && today.year !== this.visibleMonth.year || today.month !== this.visibleMonth.monthNbr) {
+            this.visibleMonth = {monthTxt: this.opts.monthLabels[today.month], monthNbr: today.month, year: today.year};
+            this.generateCalendar(today.month, today.year, true);
+        }
+    }
+
+    cellClicked(cell: any): void {
+        // Cell clicked on the calendar
+        if (cell.cmo === this.PREV_MONTH) {
+            // Previous month day
+            this.prevMonth();
+        }
+        else if (cell.cmo === this.CURR_MONTH) {
+            // Current month day - if date is already selected clear it
+            if (cell.dateObj.year === this.selectedDate.year && cell.dateObj.month === this.selectedDate.month && cell.dateObj.day === this.selectedDate.day) {
+                this.clearDate();
+            }
+            else {
+                this.selectDate(cell.dateObj);
+            }
+        }
+        else if (cell.cmo === this.NEXT_MONTH) {
+            // Next month day
+            this.nextMonth();
+        }
+        this.resetMonthYearEdit();
+    }
+
+    cellKeyDown(event: any, cell: any) {
+        // Cell keyboard handling
+        if ((event.keyCode === 13 || event.keyCode === 32) && !cell.disabled) {
+            event.preventDefault();
+            this.cellClicked(cell);
+        }
+    }
+
+    clearDate(): void {
+        // Clears the date and notifies parent using callbacks and value accessor
+        let date: IMyDate = {year: 0, month: 0, day: 0};
+        this.dateChanged.emit({date: date, jsdate: null, formatted: "", epoc: 0});
+        this.onChangeCb("");
+        this.onTouchedCb();
+        this.updateDateValue(date, true);
+    }
+
+    selectDate(date: IMyDate): void {
+        // Date selected, notifies parent using callbacks and value accessor
+        let dateModel: IMyDateModel = this.getDateModel(date);
+        this.dateChanged.emit(dateModel);
+        this.onChangeCb(dateModel);
+        this.onTouchedCb();
+        this.updateDateValue(date, false);
+        if (this.showSelector) {
+            this.calendarToggle.emit(2);
+        }
+        this.showSelector = false;
+    }
+
+    updateDateValue(date: IMyDate, clear: boolean): void {
+        // Updates date values
+        this.selectedDate = date;
+        this.selectionDayTxt = clear ? "" : this.formatDate(date);
+        this.inputFieldChanged.emit({value: this.selectionDayTxt, dateFormat: this.opts.dateFormat, valid: !clear});
+        this.invalidDate = false;
+    }
+
+    getDateModel(date: IMyDate): IMyDateModel {
+        // Creates a date model object from the given parameter
+        return {date: date, jsdate: this.getDate(date.year, date.month, date.day), formatted: this.formatDate(date), epoc: Math.round(this.getTimeInMilliseconds(date) / 1000.0)};
+    }
+
+    preZero(val: string): string {
+        // Prepend zero if smaller than 10
+        return parseInt(val) < 10 ? "0" + val : val;
+    }
+
+    formatDate(val: any): string {
+        // Returns formatted date string, if mmm is part of dateFormat returns month as a string
+        let formatted: string = this.opts.dateFormat.replace("yyyy", val.year).replace("dd", this.preZero(val.day));
+        return this.opts.dateFormat.indexOf("mmm") !== -1 ? formatted.replace("mmm", this.monthText(val.month)) : formatted.replace("mm", this.preZero(val.month));
+    }
+
+    monthText(m: number): string {
+        // Returns month as a text
+        return this.opts.monthLabels[m];
+    }
+
+    monthStartIdx(y: number, m: number): number {
+        // Month start index
+        let d = new Date();
+        d.setDate(1);
+        d.setMonth(m - 1);
+        d.setFullYear(y);
+        let idx = d.getDay() + this.sundayIdx();
+        return idx >= 7 ? idx - 7 : idx;
+    }
+
+    daysInMonth(m: number, y: number): number {
+        // Return number of days of current month
+        return new Date(y, m, 0).getDate();
+    }
+
+    daysInPrevMonth(m: number, y: number): number {
+        // Return number of days of the previous month
+        let d: Date = this.getDate(y, m, 1);
+        d.setMonth(d.getMonth() - 1);
+        return this.daysInMonth(d.getMonth() + 1, d.getFullYear());
+    }
+
+    isCurrDay(d: number, m: number, y: number, cmo: number, today: IMyDate): boolean {
+        // Check is a given date the today
+        return d === today.day && m === today.month && y === today.year && cmo === this.CURR_MONTH;
+    }
+
+    getToday(): IMyDate {
+        let date: Date = new Date();
+        return {year: date.getFullYear(), month: date.getMonth() + 1, day: date.getDate()};
+    }
+
+    getTimeInMilliseconds(date: IMyDate): number {
+        return this.getDate(date.year, date.month, date.day).getTime();
+    }
+
+    getDayNumber(date: IMyDate): number {
+        // Get day number: su=0, mo=1, tu=2, we=3 ...
+        let d: Date = this.getDate(date.year, date.month, date.day);
+        return d.getDay();
+    }
+
+    getWeekday(date: IMyDate): string {
+        // Get weekday: su, mo, tu, we ...
+        return this.weekDayOpts[this.getDayNumber(date)];
+    }
+
+    getDate(year: number, month: number, day: number): Date {
+        // Creates a date object from given year, month and day
+        return new Date(year, month - 1, day, 0, 0, 0, 0);
+    }
+
+    sundayIdx(): number {
+        // Index of Sunday day
+        return this.dayIdx > 0 ? 7 - this.dayIdx : 0;
+    }
+
+    generateCalendar(m: number, y: number, notifyChange: boolean): void {
+        this.dates.length = 0;
+        let today: IMyDate = this.getToday();
+        let monthStart: number = this.monthStartIdx(y, m);
+        let dInThisM: number = this.daysInMonth(m, y);
+        let dInPrevM: number = this.daysInPrevMonth(m, y);
+
+        let dayNbr: number = 1;
+        let cmo: number = this.PREV_MONTH;
+        for (let i = 1; i < 7; i++) {
+            let week: Array<IMyCalendarDay> = [];
+            if (i === 1) {
+                // First week
+                let pm = dInPrevM - monthStart + 1;
+                // Previous month
+                for (let j = pm; j <= dInPrevM; j++) {
+                    let date: IMyDate = {year: y, month: m - 1, day: j};
+                    week.push({dateObj: date, cmo: cmo, currDay: this.isCurrDay(j, m, y, cmo, today), dayNbr: this.getDayNumber(date), disabled: this.utilService.isDisabledDay(date, this.opts.disableUntil, this.opts.disableSince, this.opts.disableWeekends, this.opts.disableDays, this.opts.disableDateRange, this.opts.enableDays)});
+                }
+
+                cmo = this.CURR_MONTH;
+                // Current month
+                let daysLeft: number = 7 - week.length;
+                for (let j = 0; j < daysLeft; j++) {
+                    let date: IMyDate = {year: y, month: m, day: dayNbr};
+                    week.push({dateObj: date, cmo: cmo, currDay: this.isCurrDay(dayNbr, m, y, cmo, today), dayNbr: this.getDayNumber(date), disabled: this.utilService.isDisabledDay(date, this.opts.disableUntil, this.opts.disableSince, this.opts.disableWeekends, this.opts.disableDays, this.opts.disableDateRange, this.opts.enableDays)});
+                    dayNbr++;
+                }
+            }
+            else {
+                // Rest of the weeks
+                for (let j = 1; j < 8; j++) {
+                    if (dayNbr > dInThisM) {
+                        // Next month
+                        dayNbr = 1;
+                        cmo = this.NEXT_MONTH;
+                    }
+                    let date: IMyDate = {year: y, month: cmo === this.CURR_MONTH ? m : m + 1, day: dayNbr};
+                    week.push({dateObj: date, cmo: cmo, currDay: this.isCurrDay(dayNbr, m, y, cmo, today), dayNbr: this.getDayNumber(date), disabled: this.utilService.isDisabledDay(date, this.opts.disableUntil, this.opts.disableSince, this.opts.disableWeekends, this.opts.disableDays, this.opts.disableDateRange, this.opts.enableDays)});
+                    dayNbr++;
+                }
+            }
+            let weekNbr: number = this.opts.showWeekNumbers  && this.opts.firstDayOfWeek === "mo" ? this.utilService.getWeekNumber(week[0].dateObj) : 0;
+            this.dates.push({week: week, weekNbr: weekNbr});
+        }
+
+        this.setHeaderBtnDisabledState(m, y);
+
+        if (notifyChange) {
+            // Notify parent
+            this.calendarViewChanged.emit({year: y, month: m, first: {number: 1, weekday: this.getWeekday({year: y, month: m, day: 1})}, last: {number: dInThisM, weekday: this.getWeekday({year: y, month: m, day: dInThisM})}});
+        }
+    }
+
+    parseSelectedDate(selDate: any): IMyDate {
+        // Parse selDate value - it can be string or IMyDate object
+        let date: IMyDate = {day: 0, month: 0, year: 0};
+        if (typeof selDate === "string") {
+            let sd: string = <string>selDate;
+            date.day = this.utilService.parseDatePartNumber(this.opts.dateFormat, sd, "dd");
+
+            date.month = this.opts.dateFormat.indexOf("mmm") !== -1
+                ? this.utilService.parseDatePartMonthName(this.opts.dateFormat, sd, "mmm", this.opts.monthLabels)
+                : this.utilService.parseDatePartNumber(this.opts.dateFormat, sd, "mm");
+
+            date.year = this.utilService.parseDatePartNumber(this.opts.dateFormat, sd, "yyyy");
+        }
+        else if (typeof selDate === "object") {
+            date = selDate;
+        }
+        this.selectionDayTxt = this.formatDate(date);
+        return date;
+    }
+
+    parseSelectedMonth(ms: string): IMyMonth {
+        return this.utilService.parseDefaultMonth(ms);
+    }
+
+    setHeaderBtnDisabledState(m: number, y: number): void {
+        let dpm: boolean = false;
+        let dpy: boolean = false;
+        let dnm: boolean = false;
+        let dny: boolean = false;
+        if (this.opts.disableHeaderButtons) {
+            dpm = this.utilService.isMonthDisabledByDisableUntil({year: m === 1 ? y - 1 : y, month: m === 1 ? 12 : m - 1, day: this.daysInMonth(m === 1 ? 12 : m - 1, m === 1 ? y - 1 : y)}, this.opts.disableUntil);
+            dpy = this.utilService.isMonthDisabledByDisableUntil({year: y - 1, month: m, day: this.daysInMonth(m, y - 1)}, this.opts.disableUntil);
+            dnm = this.utilService.isMonthDisabledByDisableSince({year: m === 12 ? y + 1 : y, month: m === 12 ? 1 : m + 1, day: 1}, this.opts.disableSince);
+            dny = this.utilService.isMonthDisabledByDisableSince({year: y + 1, month: m, day: 1}, this.opts.disableSince);
+        }
+        this.prevMonthDisabled = m === 1 && y === this.opts.minYear || dpm;
+        this.prevYearDisabled = y - 1 < this.opts.minYear || dpy;
+        this.nextMonthDisabled = m === 12 && y === this.opts.maxYear || dnm;
+        this.nextYearDisabled = y + 1 > this.opts.maxYear || dny;
+    }
+}
diff --git a/utils/my-date-picker/my-date-picker.module.ts b/utils/my-date-picker/my-date-picker.module.ts
new file mode 100644
index 00000000..a638a905
--- /dev/null
+++ b/utils/my-date-picker/my-date-picker.module.ts
@@ -0,0 +1,14 @@
+import { CommonModule } from "@angular/common";
+import { FormsModule } from "@angular/forms";
+import { NgModule } from "@angular/core";
+import { MyDatePicker } from "./my-date-picker.component";
+import { FocusDirective } from "./directives/my-date-picker.focus.directive";
+import { InputAutoFillDirective } from "./directives/my-date-picker.input.auto.fill.directive";
+
+@NgModule({
+    imports: [CommonModule, FormsModule],
+    declarations: [MyDatePicker, FocusDirective, InputAutoFillDirective],
+    exports: [MyDatePicker, FocusDirective, InputAutoFillDirective]
+})
+export class MyDatePickerModule {
+}
diff --git a/utils/my-date-picker/services/my-date-picker.locale.service.ts b/utils/my-date-picker/services/my-date-picker.locale.service.ts
new file mode 100644
index 00000000..44c209e9
--- /dev/null
+++ b/utils/my-date-picker/services/my-date-picker.locale.service.ts
@@ -0,0 +1,232 @@
+import { Injectable } from "@angular/core";
+import { IMyLocales, IMyOptions } from "../interfaces/index";
+
+@Injectable()
+export class LocaleService {
+    private locales: IMyLocales = {
+        "en": {
+            dayLabels: {su: "Sun", mo: "Mon", tu: "Tue", we: "Wed", th: "Thu", fr: "Fri", sa: "Sat"},
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "May", 6: "Jun", 7: "Jul", 8: "Aug", 9: "Sep", 10: "Oct", 11: "Nov", 12: "Dec" },
+            dateFormat: "yyyy-mm-dd",
+            todayBtnTxt: "Today",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "he": {
+            dayLabels: {su: "רא", mo: "שנ", tu: "של", we: "רב", th: "חמ", fr: "שי", sa: "שב"},
+            monthLabels: { 1: "ינו", 2: "פבר", 3: "מרץ", 4: "אפר", 5: "מאי", 6: "יונ", 7: "יול", 8: "אוג", 9: "ספט", 10: "אוק", 11: "נוב", 12: "דצמ" },
+            dateFormat: "dd/mm/yyyy",
+            todayBtnTxt: "היום",
+            firstDayOfWeek: "su",
+            sunHighlight: false
+        },
+        "ja": {
+            dayLabels: {su: "日", mo: "月", tu: "火", we: "水", th: "木", fr: "金", sa: "土"},
+            monthLabels: {1: "１月", 2: "２月", 3: "３月", 4: "４月", 5: "５月", 6: "６月", 7: "７月", 8: "８月", 9: "９月", 10: "１０月", 11: "１１月", 12: "１２月"},
+            dateFormat: "yyyy.mm.dd",
+            todayBtnTxt: "今日",
+            sunHighlight: false
+        },
+        "fr": {
+            dayLabels: {su: "Dim", mo: "Lun", tu: "Mar", we: "Mer", th: "Jeu", fr: "Ven", sa: "Sam"},
+            monthLabels: {1: "Jan", 2: "Fév", 3: "Mar", 4: "Avr", 5: "Mai", 6: "Juin", 7: "Juil", 8: "Aoû", 9: "Sep", 10: "Oct", 11: "Nov", 12: "Déc"},
+            dateFormat: "dd/mm/yyyy",
+            todayBtnTxt: "Aujourd'hui",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "fi": {
+            dayLabels: {su: "Su", mo: "Ma", tu: "Ti", we: "Ke", th: "To", fr: "Pe", sa: "La"},
+            monthLabels: {1: "Tam", 2: "Hel", 3: "Maa", 4: "Huh", 5: "Tou", 6: "Kes", 7: "Hei", 8: "Elo", 9: "Syy", 10: "Lok", 11: "Mar", 12: "Jou"},
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Tänään",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "es": {
+            dayLabels: {su: "Do", mo: "Lu", tu: "Ma", we: "Mi", th: "Ju", fr: "Vi", sa: "Sa"},
+            monthLabels: {1: "Ene", 2: "Feb", 3: "Mar", 4: "Abr", 5: "May", 6: "Jun", 7: "Jul", 8: "Ago", 9: "Sep", 10: "Oct", 11: "Nov", 12: "Dic"},
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Hoy",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "hu": {
+            dayLabels: {su: "Vas", mo: "Hét", tu: "Kedd", we: "Sze", th: "Csü", fr: "Pén", sa: "Szo"},
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Már", 4: "Ápr", 5: "Máj", 6: "Jún", 7: "Júl", 8: "Aug", 9: "Szep", 10: "Okt", 11: "Nov", 12: "Dec" },
+            dateFormat: "yyyy-mm-dd",
+            todayBtnTxt: "Ma",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        },
+        "sv": {
+            dayLabels: {su: "Sön", mo: "Mån", tu: "Tis", we: "Ons", th: "Tor", fr: "Fre", sa: "Lör"},
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Maj", 6: "Jun", 7: "Jul", 8: "Aug", 9: "Sep", 10: "Okt", 11: "Nov", 12: "Dec" },
+            dateFormat: "yyyy-mm-dd",
+            todayBtnTxt: "Idag",
+            firstDayOfWeek: "mo",
+            sunHighlight: false
+        },
+        "nl": {
+            dayLabels: {su: "Zon", mo: "Maa", tu: "Din", we: "Woe", th: "Don", fr: "Vri", sa: "Zat"},
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Mei", 6: "Jun", 7: "Jul", 8: "Aug", 9: "Sep", 10: "Okt", 11: "Nov", 12: "Dec" },
+            dateFormat: "dd-mm-yyyy",
+            todayBtnTxt: "Vandaag",
+            firstDayOfWeek: "mo",
+            sunHighlight: false
+        },
+        "ru": {
+            dayLabels: {su: "Вс", mo: "Пн", tu: "Вт", we: "Ср", th: "Чт", fr: "Пт", sa: "Сб"},
+            monthLabels: { 1: "Янв", 2: "Фев", 3: "Март", 4: "Апр", 5: "Май", 6: "Июнь", 7: "Июль", 8: "Авг", 9: "Сент", 10: "Окт", 11: "Ноя", 12: "Дек" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Сегодня",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        },
+        "uk": {
+            dayLabels: {su: "Нд", mo: "Пн", tu: "Вт", we: "Ср", th: "Чт", fr: "Пт", sa: "Сб"},
+            monthLabels: { 1: "Січ", 2: "Лют", 3: "Бер", 4: "Кві", 5: "Тра", 6: "Чер", 7: "Лип", 8: "Сер", 9: "Вер", 10: "Жов", 11: "Лис", 12: "Гру" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Сьогодні",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        },
+        "no": {
+            dayLabels: {su: "Søn", mo: "Man", tu: "Tir", we: "Ons", th: "Tor", fr: "Fre", sa: "Lør"},
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Mai", 6: "Jun", 7: "Jul", 8: "Aug", 9: "Sep", 10: "Okt", 11: "Nov", 12: "Des" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "I dag",
+            firstDayOfWeek: "mo",
+            sunHighlight: false
+        },
+        "tr": {
+            dayLabels: {su: "Paz", mo: "Pzt", tu: "Sal", we: "Çar", th: "Per", fr: "Cum", sa: "Cmt"},
+            monthLabels: { 1: "Oca", 2: "Şub", 3: "Mar", 4: "Nis", 5: "May", 6: "Haz", 7: "Tem", 8: "Ağu", 9: "Eyl", 10: "Eki", 11: "Kas", 12: "Ara" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Bugün",
+            firstDayOfWeek: "mo",
+            sunHighlight: false
+        },
+        "pt-br": {
+            dayLabels: {su: "Dom", mo: "Seg", tu: "Ter", we: "Qua", th: "Qui", fr: "Sex", sa: "Sab"},
+            monthLabels: { 1: "Jan", 2: "Fev", 3: "Mar", 4: "Abr", 5: "Mai", 6: "Jun", 7: "Jul", 8: "Ago", 9: "Set", 10: "Out", 11: "Nov", 12: "Dez" },
+            dateFormat: "dd/mm/yyyy",
+            todayBtnTxt: "Hoje",
+            firstDayOfWeek: "su",
+            sunHighlight: true
+        },
+        "de": {
+            dayLabels: {su: "So", mo: "Mo", tu: "Di", we: "Mi", th: "Do", fr: "Fr", sa: "Sa"},
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mär", 4: "Apr", 5: "Mai", 6: "Jun", 7: "Jul", 8: "Aug", 9: "Sep", 10: "Okt", 11: "Nov", 12: "Dez" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Heute",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        },
+        "it": {
+            dayLabels: { su: "Dom", mo: "Lun", tu: "Mar", we: "Mer", th: "Gio", fr: "Ven", sa: "Sab" },
+            monthLabels: { 1: "Gen", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Mag", 6: "Giu", 7: "Lug", 8: "Ago", 9: "Set", 10: "Ott", 11: "Nov", 12: "Dic" },
+            dateFormat: "dd/mm/yyyy",
+            todayBtnTxt: "Oggi",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        },
+        "it-ch": {
+            dayLabels: { su: "Dom", mo: "Lun", tu: "Mar", we: "Mer", th: "Gio", fr: "Ven", sa: "Sab" },
+            monthLabels: { 1: "Gen", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Mag", 6: "Giu", 7: "Lug", 8: "Ago", 9: "Set", 10: "Ott", 11: "Nov", 12: "Dic" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Oggi",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        },
+        "pl": {
+            dayLabels: { su: "Nie", mo: "Pon", tu: "Wto", we: "Śro", th: "Czw", fr: "Pią", sa: "Sob" },
+            monthLabels: { 1: "Sty", 2: "Lut", 3: "Mar", 4: "Kwi", 5: "Maj", 6: "Cze", 7: "Lip", 8: "Sie", 9: "Wrz", 10: "Paź", 11: "Lis", 12: "Gru" },
+            dateFormat: "yyyy-mm-dd",
+            todayBtnTxt: "Dzisiaj",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "my": {
+            dayLabels: {su: "တနင်္ဂနွေ", mo: "တနင်္လာ", tu: "အင်္ဂါ", we: "ဗုဒ္ဓဟူး", th: "ကြသပတေး", fr: "သောကြာ", sa: "စနေ"},
+            monthLabels: { 1: "ဇန်နဝါရီ", 2: "ဖေဖော်ဝါရီ", 3: "မတ်", 4: "ဧပြီ", 5: "မေ", 6: "ဇွန်", 7: "ဇူလိုင်", 8: "ဩဂုတ်", 9: "စက်တင်ဘာ", 10: "အောက်တိုဘာ", 11: "နိုဝင်ဘာ", 12: "ဒီဇင်ဘာ" },
+            dateFormat: "yyyy-mm-dd",
+            todayBtnTxt: "ယနေ့",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "sk": {
+            dayLabels: { su: "Ne", mo: "Po", tu: "Ut", we: "St", th: "Št", fr: "Pi", sa: "So" },
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Máj", 6: "Jún", 7: "Júl", 8: "Aug", 9: "Sep", 10: "Okt", 11: "Nov", 12: "Dec" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Dnes",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "sl": {
+            dayLabels: { su: "Ned", mo: "Pon", tu: "Tor", we: "Sre", th: "Čet", fr: "Pet", sa: "Sob" },
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Maj", 6: "Jun", 7: "Jul", 8: "Avg", 9: "Sep", 10: "Okt", 11: "Nov", 12: "Dec" },
+            dateFormat: "dd. mm. yyyy",
+            todayBtnTxt: "Danes",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "zh-cn": {
+            dayLabels: {su: "日", mo: "一", tu: "二", we: "三", th: "四", fr: "五", sa: "六"},
+            monthLabels: { 1: "1月", 2: "2月", 3: "3月", 4: "4月", 5: "5月", 6: "6月", 7: "7月", 8: "8月", 9: "9月", 10: "10月", 11: "11月", 12: "12月" },
+            dateFormat: "yyyy-mm-dd",
+            todayBtnTxt: "今天",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "ro": {
+            dayLabels: {su: "du", mo: "lu", tu: "ma", we: "mi", th: "jo", fr: "vi", sa: "sa"},
+            monthLabels: { 1: "ian", 2: "feb", 3: "mart", 4: "apr", 5: "mai", 6: "iun", 7: "iul", 8: "aug", 9: "sept", 10: "oct", 11: "nov", 12: "dec" },
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Astăzi",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "ca": {
+            dayLabels: {su: "dg", mo: "dl", tu: "dt", we: "dc", th: "dj", fr: "dv", sa: "ds"},
+            monthLabels: {1: "Gen", 2: "Febr", 3: "Març", 4: "Abr", 5: "Maig", 6: "Juny", 7: "Jul", 8: "Ag", 9: "Set", 10: "Oct", 11: "Nov", 12: "Des"},
+            dateFormat: "dd.mm.yyyy",
+            todayBtnTxt: "Avui",
+            firstDayOfWeek: "mo",
+            sunHighlight: true,
+        },
+        "id": {
+            dayLabels: {su: "Min", mo: "Sen", tu: "Sel", we: "Rab", th: "Kam", fr: "Jum", sa: "Sab"},
+            monthLabels: {1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "Mei", 6: "Jun", 7: "Jul", 8: "Ags", 9: "Sep", 10: "Okt", 11: "Nov", 12: "Des"},
+            dateFormat: "dd-mm-yyyy",
+            todayBtnTxt: "Hari ini",
+            firstDayOfWeek: "su",
+            sunHighlight: true
+        },
+        "en-au": {
+            dayLabels: {su: "Sun", mo: "Mon", tu: "Tue", we: "Wed", th: "Thu", fr: "Fri", sa: "Sat"},
+            monthLabels: { 1: "Jan", 2: "Feb", 3: "Mar", 4: "Apr", 5: "May", 6: "Jun", 7: "Jul", 8: "Aug", 9: "Sep", 10: "Oct", 11: "Nov", 12: "Dec" },
+            dateFormat: "dd/mm/yyyy",
+            todayBtnTxt: "Today",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        },
+        "am-et": {
+            dayLabels: {su: "እሑድ", mo: "ሰኞ", tu: "ማክሰኞ", we: "ረቡዕ", th: "ሐሙስ", fr: "ዓርብ", sa: "ቅዳሜ"},
+            monthLabels: { 1: "ጃንዩ", 2: "ፌብሩ", 3: "ማርች", 4: "ኤፕረ", 5: "ሜይ", 6: "ጁን", 7: "ጁላይ", 8: "ኦገስ", 9: "ሴፕቴ", 10: "ኦክተ", 11: "ኖቬም", 12: "ዲሴም" },
+            dateFormat: "yyyy-mm-dd",
+            todayBtnTxt: "ዛሬ",
+            firstDayOfWeek: "mo",
+            sunHighlight: true
+        }
+    };
+
+    getLocaleOptions(locale: string): IMyOptions {
+        if (locale && this.locales.hasOwnProperty(locale)) {
+            // User given locale
+            return this.locales[locale];
+        }
+        // Default: en
+        return this.locales["en"];
+    }
+}
diff --git a/utils/my-date-picker/services/my-date-picker.util.service.ts b/utils/my-date-picker/services/my-date-picker.util.service.ts
new file mode 100644
index 00000000..98b51bca
--- /dev/null
+++ b/utils/my-date-picker/services/my-date-picker.util.service.ts
@@ -0,0 +1,169 @@
+import { Injectable } from "@angular/core";
+import { IMyDate } from "../interfaces/my-date.interface";
+import { IMyDateRange } from "../interfaces/my-date-range.interface";
+import { IMyMonth } from "../interfaces/my-month.interface";
+import { IMyMonthLabels } from "../interfaces/my-month-labels.interface";
+
+@Injectable()
+export class UtilService {
+    isDateValid(dateStr: string, dateFormat: string, minYear: number, maxYear: number, disableUntil: IMyDate, disableSince: IMyDate, disableWeekends: boolean, disableDays: Array<IMyDate>, disableDateRange: IMyDateRange, monthLabels: IMyMonthLabels, enableDays: Array<IMyDate>): IMyDate {
+        let returnDate: IMyDate = {day: 0, month: 0, year: 0};
+        let daysInMonth: Array<number> = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+        let isMonthStr: boolean = this.getDatePartIndex(dateFormat, "mmm") !== -1;
+
+        if (dateStr.length !== dateFormat.length) {
+            return returnDate;
+        }
+
+        let separator: string = this.getDateFormatSeparator(dateFormat);
+
+        let parts: Array<string> = dateStr.split(separator);
+        if (parts.length !== 3) {
+            return returnDate;
+        }
+
+        let day: number = this.parseDatePartNumber(dateFormat, dateStr, "dd");
+        let month: number = isMonthStr ? this.parseDatePartMonthName(dateFormat, dateStr, "mmm", monthLabels) : this.parseDatePartNumber(dateFormat, dateStr, "mm");
+        let year: number = this.parseDatePartNumber(dateFormat, dateStr, "yyyy");
+
+        if (day !== -1 && month !== -1 && year !== -1) {
+            if (year < minYear || year > maxYear || month < 1 || month > 12) {
+                return returnDate;
+            }
+
+            let date: IMyDate = {year: year, month: month, day: day};
+
+            if (this.isDisabledDay(date, disableUntil, disableSince, disableWeekends, disableDays, disableDateRange, enableDays)) {
+                return returnDate;
+            }
+
+            if (year % 400 === 0 || (year % 100 !== 0 && year % 4 === 0)) {
+                daysInMonth[1] = 29;
+            }
+
+            if (day < 1 || day > daysInMonth[month - 1]) {
+                return returnDate;
+            }
+
+            // Valid date
+            return date;
+        }
+        return returnDate;
+    }
+
+    getDateFormatSeparator(dateFormat: string): string {
+        return dateFormat.replace(/[dmy]/g, "")[0];
+    }
+
+    isMonthLabelValid(monthLabel: string, monthLabels: IMyMonthLabels): number {
+        for (let key = 1; key <= 12; key++) {
+            if (monthLabel.toLowerCase() === monthLabels[key].toLowerCase()) {
+                return key;
+            }
+        }
+        return -1;
+    }
+
+    isYearLabelValid(yearLabel: number, minYear: number, maxYear: number): number {
+        if (yearLabel >= minYear && yearLabel <= maxYear) {
+            return yearLabel;
+        }
+        return -1;
+    }
+
+    parseDatePartNumber(dateFormat: string, dateString: string, datePart: string): number {
+        let pos: number = this.getDatePartIndex(dateFormat, datePart);
+        if (pos !== -1) {
+            let value: string = dateString.substring(pos, pos + datePart.length);
+            if (!/^\d+$/.test(value)) {
+                return -1;
+            }
+            return parseInt(value);
+        }
+        return -1;
+    }
+
+    parseDatePartMonthName(dateFormat: string, dateString: string, datePart: string, monthLabels: IMyMonthLabels): number {
+        let pos: number = this.getDatePartIndex(dateFormat, datePart);
+        if (pos !== -1) {
+            return this.isMonthLabelValid(dateString.substring(pos, pos + datePart.length), monthLabels);
+        }
+        return -1;
+    }
+
+    getDatePartIndex(dateFormat: string, datePart: string): number {
+        return dateFormat.indexOf(datePart);
+    }
+
+    parseDefaultMonth(monthString: string): IMyMonth {
+        let month: IMyMonth = {monthTxt: "", monthNbr: 0, year: 0};
+        if (monthString !== "") {
+            let split = monthString.split(monthString.match(/[^0-9]/)[0]);
+            month.monthNbr = split[0].length === 2 ? parseInt(split[0]) : parseInt(split[1]);
+            month.year = split[0].length === 2 ? parseInt(split[1]) : parseInt(split[0]);
+        }
+        return month;
+    }
+
+    isDisabledDay(date: IMyDate, disableUntil: IMyDate, disableSince: IMyDate, disableWeekends: boolean, disableDays: Array<IMyDate>, disableDateRange: IMyDateRange, enableDays: Array<IMyDate>): boolean {
+        for (let obj of enableDays) {
+            if (obj.year === date.year && obj.month === date.month && obj.day === date.day) {
+                return false;
+            }
+        }
+
+        let dateMs: number = this.getTimeInMilliseconds(date);
+        if (this.isInitializedDate(disableUntil) && dateMs <= this.getTimeInMilliseconds(disableUntil)) {
+            return true;
+        }
+
+        if (this.isInitializedDate(disableSince) && dateMs >= this.getTimeInMilliseconds(disableSince)) {
+            return true;
+        }
+
+        if (disableWeekends) {
+            let dayNbr = this.getDayNumber(date);
+            if (dayNbr === 0 || dayNbr === 6) {
+                return true;
+            }
+        }
+
+        for (let obj of disableDays) {
+            if (obj.year === date.year && obj.month === date.month && obj.day === date.day) {
+                return true;
+            }
+        }
+
+        if (this.isInitializedDate(disableDateRange.begin) && this.isInitializedDate(disableDateRange.end) && dateMs >= this.getTimeInMilliseconds(disableDateRange.begin) && dateMs <= this.getTimeInMilliseconds(disableDateRange.end)) {
+            return true;
+        }
+        return false;
+    }
+
+    getWeekNumber(date: IMyDate): number {
+        let d: Date = new Date(date.year, date.month - 1, date.day, 0, 0, 0, 0);
+        d.setDate(d.getDate() + (d.getDay() === 0 ? -3 : 4 - d.getDay()));
+        return Math.round(((d.getTime() - new Date(d.getFullYear(), 0, 4).getTime()) / 86400000) / 7) + 1;
+    }
+
+    isMonthDisabledByDisableUntil(date: IMyDate, disableUntil: IMyDate): boolean {
+        return this.isInitializedDate(disableUntil) && this.getTimeInMilliseconds(date) <= this.getTimeInMilliseconds(disableUntil);
+    }
+
+    isMonthDisabledByDisableSince(date: IMyDate, disableSince: IMyDate): boolean {
+        return this.isInitializedDate(disableSince) && this.getTimeInMilliseconds(date) >= this.getTimeInMilliseconds(disableSince);
+    }
+
+    isInitializedDate(date: IMyDate): boolean {
+        return date.year !== 0 && date.month !== 0 && date.day !== 0;
+    }
+
+    getTimeInMilliseconds(date: IMyDate): number {
+        return new Date(date.year, date.month - 1, date.day, 0, 0, 0, 0).getTime();
+    }
+
+    getDayNumber(date: IMyDate): number {
+        let d: Date = new Date(date.year, date.month - 1, date.day, 0, 0, 0, 0);
+        return d.getDay();
+    }
+}
\ No newline at end of file
diff --git a/utils/number-utils.class.ts b/utils/number-utils.class.ts
new file mode 100644
index 00000000..bc6e25ce
--- /dev/null
+++ b/utils/number-utils.class.ts
@@ -0,0 +1,31 @@
+
+export class NumberUtils{
+
+
+
+  public static roundNumber(num: number):any {
+      console.log("Trying to round number: "+ num);
+      var roundNum = null;
+      if(num >= 1000000){
+        num=num/1000000;
+        num= Math.round(num);
+        roundNum =  { "number": num, "size": "mi" };
+      }else if( num >= 10000){
+        num=num/1000;
+        num= Math.round(num);
+        roundNum =  { "number": num, "size": "K" };
+      }else if (num >= 100) {
+        num=num/100;
+        num= Math.round(num);
+        num=num*100;
+        roundNum =  { "number": num, "size": "" };
+      }else{
+        roundNum =  { "number": num, "size": "" };
+      }
+      console.log("Rounded number: "+ roundNum.number + " "+ roundNum.size);
+      return roundNum;
+  }
+
+
+
+}
diff --git a/utils/paging.module.ts b/utils/paging.module.ts
new file mode 100644
index 00000000..dbf53c87
--- /dev/null
+++ b/utils/paging.module.ts
@@ -0,0 +1,28 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+import { RouterModule } from '@angular/router';
+
+import {pagingFormatterNoLoad} from './pagingFormatterNoLoad.component';
+
+import {PagingFormatter} from './pagingFormatter.component';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RouterModule
+  ],
+  declarations: [
+    pagingFormatterNoLoad,
+    PagingFormatter,
+
+
+  ],
+  exports: [
+      pagingFormatterNoLoad,
+      PagingFormatter,
+
+
+    ]
+})
+export class PagingModule { }
diff --git a/utils/pagingFormatter.component.ts b/utils/pagingFormatter.component.ts
new file mode 100644
index 00000000..f199aaa9
--- /dev/null
+++ b/utils/pagingFormatter.component.ts
@@ -0,0 +1,64 @@
+import {Component, Input} from '@angular/core';
+import {Router} from '@angular/router';
+import {DomSanitizer} from '@angular/platform-browser';
+//Usage Example <paging [currentPage]="page" [totalResults]="resultsNum"  [term]="keyword"> </paging>
+import {RouterHelper} from './routerHelper.class';
+
+@Component({
+  selector: 'paging',
+  template: `
+
+
+   <ul  *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage &&  currentPage <= getTotalPages() ) " class="uk-pagination">
+
+   <!--li *ngIf=" currentPage  > 1" ><a  [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',1)"   routerLinkActive="router-link-active" [routerLink]=baseUrl aria-label="Previous">
+   <span><span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span></span></a></li-->
+  <li *ngIf=" currentPage  > 1" ><a  [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage - 1))"   routerLinkActive="router-link-active" [routerLink]=baseUrl aria-label="Previous">
+  <span><span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span></span></a></li>
+  <!--<li *ngIf=" currentPage  > 1"><a [href]="onPage((currentPage -1))">\<</a></li>-->
+
+   <li *ngIf=" currentPage -2 > 0"><a  [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage - 2))"   routerLinkActive="router-link-active" [routerLink]=baseUrl>{{currentPage -2}}</a></li>
+   <li *ngIf=" currentPage -1 > 0 "><a  [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage - 1))"   routerLinkActive="router-link-active" [routerLink]=baseUrl>{{currentPage -1}}</a></li>
+   <li class="uk-active"><span >{{currentPage}}</span></li>
+   <li *ngIf=" currentPage +1 <= getTotalPages() "><a  [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage +1))"   routerLinkActive="router-link-active" [routerLink]=baseUrl>{{currentPage +1}}</a></li>
+   <li *ngIf=" currentPage +2 <= getTotalPages() "><a  [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage +2))"   routerLinkActive="router-link-active" [routerLink]=baseUrl>{{currentPage +2}}</a></li>
+   <li *ngIf=" (currentPage -2 <= 0)&&(currentPage +3 <= getTotalPages()) "><a [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage +3))"   routerLinkActive="router-link-active" [routerLink]=baseUrl>{{currentPage +3}}</a></li>
+   <li *ngIf=" (currentPage -1 <= 0)&&(currentPage +4 <= getTotalPages()) "><a [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage +4))"   routerLinkActive="router-link-active" [routerLink]=baseUrl >{{currentPage +4}}</a></li>
+
+    <li *ngIf="getTotalPages()  > currentPage"><a  [queryParams]="routerHelper.createQueryParamsPaging(parameterNames,parameterValues,'page',(currentPage + 1))"   routerLinkActive="router-link-active" [routerLink]=baseUrl aria-label="Next">
+          <span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+</span>
+      </a></li>
+
+
+ </ul>
+  `
+})
+
+export class PagingFormatter {
+  @Input() currentPage: number = 1;
+  @Input() size: number=10;
+  @Input() totalResults: number = 10;
+  @Input() baseUrl:string="";
+  @Input() parameterNames:string[];
+  @Input() parameterValues:string[];
+
+  public routerHelper:RouterHelper = new RouterHelper();
+
+  constructor ( private _router: Router, private sanitizer:DomSanitizer) {
+   }
+
+  ngOnInit() {
+
+  }
+  getTotalPages(){
+    var i:number =parseInt(''+(this.totalResults/this.size));
+     return (((this.totalResults/this.size) == i )? i :(i+1)) ;
+  }
+
+  // onPage(pageNum: number){
+  //   return this.sanitizer.bypassSecurityTrustUrl( this.baseUrl+((this.baseUrl.indexOf("?") > -1  )?'&':'?')+ "page=" + (pageNum));
+  //
+  // }
+}
diff --git a/utils/pagingFormatterNoLoad.component.ts b/utils/pagingFormatterNoLoad.component.ts
new file mode 100644
index 00000000..2ae49f49
--- /dev/null
+++ b/utils/pagingFormatterNoLoad.component.ts
@@ -0,0 +1,76 @@
+import {Component, Input, Output, EventEmitter} from '@angular/core';
+
+
+//Usage Example <paging [currentPage]="page" [totalResults]="resultsNum"    [term]="keyword"> </paging>
+
+@Component({
+  selector: 'paging-no-load',
+  template: `
+   <ul  *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage &&  currentPage <= getTotalPages() ) " class="uk-pagination">
+
+   <li *ngIf=" currentPage  > 1" ><a (click)="onPage((currentPage -1))" aria-label="Previous">
+       <span><span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span></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="uk-active"><span >{{currentPage}}</span></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(currentPage +1)" aria-label="Next">
+        <span class="uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
+</span>
+      </a>
+  </li>
+
+
+ </ul>
+
+  `
+})
+
+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
+    });
+  }
+}
diff --git a/utils/pipes/claimsDatatable.pipe.ts b/utils/pipes/claimsDatatable.pipe.ts
new file mode 100644
index 00000000..d05ca549
--- /dev/null
+++ b/utils/pipes/claimsDatatable.pipe.ts
@@ -0,0 +1,48 @@
+import { Pipe, PipeTransform} from '@angular/core'
+
+
+@Pipe({
+  name: 'claimsDatatable'
+})
+export class ClaimsDatatablePipe implements PipeTransform  {
+
+  transform(array: any[], args: any[]): any {
+    let query: string = args[0];
+    let counter:any = args[1];
+    let active: any = args[2];
+
+    active.page = 1;
+
+    if (query) {
+      var result = array.filter(row=>this.filterAll(row, query));
+      counter.count = result.length;
+      return result;
+    }
+    return array;
+  }
+
+  filterAll(row: any, query: string) {
+    if(row.userMail.indexOf(query) > -1) {
+      return true;
+    }
+    if(row.targetType != 'project' && row.target.title.indexOf(query) > -1) {
+      return true;
+    }
+    if(row.sourceType != 'project' && row.source.title.indexOf(query) > -1) {
+      return true;
+    }
+    if(row.date.indexOf(query) > -1) {
+      return true;
+    }
+
+    if(row.curatedBy != null && row.curatedBy.indexOf(query) > -1) {
+      return true;
+    }
+
+    if(row.curationDate != null && row.curationDate.indexOf(query) > -1) {
+      return true;
+    }
+
+    return false;
+  }
+}
diff --git a/utils/pipes/contentProvidersDatatable.pipe.ts b/utils/pipes/contentProvidersDatatable.pipe.ts
new file mode 100644
index 00000000..2484e7aa
--- /dev/null
+++ b/utils/pipes/contentProvidersDatatable.pipe.ts
@@ -0,0 +1,113 @@
+import { Pipe, PipeTransform} from '@angular/core';
+import { Filter, Value} from '../../searchPages/searchUtils/searchHelperClasses.class';
+import { SearchUtilsClass } from '../../searchPages/searchUtils/searchUtils.class';
+import { ErrorCodes} from '../properties/openaireProperties';
+
+@Pipe({
+  name: 'contentProvidersDatatable'
+})
+export class ContentProvidersDatatablePipe implements PipeTransform  {
+
+  transform(array: any[], args: any[]): any {
+    if(array.length > 0) {
+      let searchUtils: SearchUtilsClass = args[0];
+      let filters:Filter[] = args[1];
+
+
+      var errorCodes:ErrorCodes = new ErrorCodes();
+      searchUtils.status = errorCodes.LOADING;
+
+      var result = array.filter(row=>this.filterAll(row, searchUtils.keyword.toLowerCase(), filters));
+
+      let oldTotal = searchUtils.totalResults;
+
+      searchUtils.totalResults = result.length;
+
+      var errorCodes:ErrorCodes = new ErrorCodes();
+      searchUtils.status = errorCodes.DONE;
+      if(searchUtils.totalResults == 0 ){
+        searchUtils.status = errorCodes.NONE;
+      }
+
+      if(oldTotal != searchUtils.totalResults) {
+        args[3].detectChanges();
+      }
+      return result;
+    }
+    return [];
+  }
+
+  filterAll(row: any, query: string, filters:Filter[]) {
+    let returnValue: boolean = false;
+
+    if(query) {
+      if(row.title.name.toLowerCase().indexOf(query) > -1) {
+        returnValue = true;
+      }
+
+      if(row.type.toLowerCase().indexOf(query) > -1) {
+        returnValue = true;
+      }
+
+      if(row.countries && row.countries.length > 0) {
+        for(let country of row.countries) {
+          if(country.toLowerCase().indexOf(query) > -1) {
+            returnValue = true;
+            break;
+          }
+        }
+      }
+
+      if(row.compatibility && row.compatibility.toLowerCase().indexOf(query) > -1) {
+        returnValue = true;
+      }
+
+      if(row.organizations && row.organizations.length > 0) {
+        for(let organization of row.organizations) {
+          if(organization.name.toLowerCase().indexOf(query) > -1) {
+            returnValue = true;
+            break;
+          }
+        }
+      }
+
+      if(!returnValue) {
+        return false;
+      }
+    }
+
+    for (let filter of filters){
+      if(filter.countSelectedValues > 0){
+        for (let value of filter.values){
+          if(value.selected == true){
+
+            // make it generic in future commit
+            let field:string = "";
+            if(filter.title == "Type") {
+              field = "type";
+            } else if(filter.title == "Compatibility Level") {
+              field = "compatibility";
+            }
+
+            if(row[field] == value.name) {
+              returnValue = true;
+              if(filter.filterOperator == "or") {
+                break;
+              }
+            } else {
+                if(filter.filterOperator == "and") {
+                  return false;
+                }
+                returnValue = false;
+            }
+          }
+        }
+        if(!returnValue) {
+          return false;
+        }
+      }
+    }
+
+    return true;
+  }
+}
diff --git a/utils/pipes/safeHTML.pipe.ts b/utils/pipes/safeHTML.pipe.ts
new file mode 100644
index 00000000..1f0c5497
--- /dev/null
+++ b/utils/pipes/safeHTML.pipe.ts
@@ -0,0 +1,12 @@
+//our root app component
+import { Pipe, PipeTransform} from '@angular/core'
+
+import { DomSanitizer, SafeUrl } from '@angular/platform-browser'
+
+@Pipe({ name: 'safeHtml'})
+export class SafeHtmlPipe implements PipeTransform  {
+  constructor(private sanitized: DomSanitizer) {}
+  transform(value):SafeUrl {
+    return this.sanitized.bypassSecurityTrustHtml(value);
+  }
+}
diff --git a/utils/piwik/piwik.service.ts b/utils/piwik/piwik.service.ts
new file mode 100644
index 00000000..c3c17746
--- /dev/null
+++ b/utils/piwik/piwik.service.ts
@@ -0,0 +1,70 @@
+import {Injectable} from '@angular/core';
+import {Http, Response, Headers, RequestOptions, URLSearchParams} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+import {Location} from '@angular/common';
+
+import {OpenaireProperties} from '../properties/openaireProperties';
+import {StringUtils} from '../string-utils.class';
+
+
+@Injectable()
+export class PiwikService {
+    private piwikbaseUrl:string = "";
+    constructor(private http: Http, private location: Location ) {}
+
+    trackView (title):any {
+
+      var ua = this.getUserAgent();
+      var referrer = this.getReferrer();
+      if(typeof location !== 'undefined'){
+            var url = OpenaireProperties.getPiwikBaseURL()+"&rec=1&url="+StringUtils.URIEncode(location.href)+"&action_name="+StringUtils.URIEncode(title)+
+            ((ua != null && ua.length > 0)?('&ua='+StringUtils.URIEncode(ua)):'')+
+            ((referrer != null && referrer.length > 0)?('&urlref='+StringUtils.URIEncode(referrer)):'');
+            console.log("Piwik - View: " + url);
+
+            return this.http.get( url);
+                          // .do(request => console.info("Piwik request completed" ));
+
+      }
+    }
+    trackDownload (downloadURL):any {
+      var ua = this.getUserAgent();
+      var referrer = this.getReferrer();
+      var url = OpenaireProperties.getPiwikBaseURL()+"&rec=1&url="+StringUtils.URIEncode(downloadURL)+"&download="+StringUtils.URIEncode(downloadURL)+
+      ((ua != null && ua.length > 0)?('&ua='+StringUtils.URIEncode(ua)):'')+
+      ((referrer != null && referrer.length > 0)?('&urlref='+StringUtils.URIEncode(referrer)):'');
+      console.log("Piwik - trackDownload: "+url);
+
+      return this.http.get( url)
+                    .do(request => console.info("Piwik request completed" ));
+
+    }
+    private getUserAgent(){
+      if (typeof navigator !== 'undefined') {
+        console.log("navigator.userAgent:" + navigator.userAgent);
+        return navigator.userAgent;
+
+      }else{
+        return null;
+      }
+    }
+    private getReferrer(){
+      var referrer = "";
+      if (typeof document !== 'undefined') {
+        console.log("document.referrer:" + document.referrer);
+        referrer = document.referrer;
+
+      }
+      if((referrer == null || referrer.length == 0)&&typeof localStorage !== 'undefined'){
+
+          referrer =localStorage.getItem('previousRoute');
+       }
+       return referrer;
+    }
+    parse(data:any){
+    }
+
+}
diff --git a/utils/piwik/piwikService.module.ts b/utils/piwik/piwikService.module.ts
new file mode 100644
index 00000000..0cfe47e3
--- /dev/null
+++ b/utils/piwik/piwikService.module.ts
@@ -0,0 +1,21 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {PiwikService} from './piwik.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule,
+
+  ],
+  declarations: [
+
+  ],
+  providers: [ PiwikService ],
+  exports: [
+
+    ]
+})
+export class PiwikServiceModule{ }
diff --git a/utils/piwik/previousRouteRecorder.guard.ts b/utils/piwik/previousRouteRecorder.guard.ts
new file mode 100644
index 00000000..ae62b524
--- /dev/null
+++ b/utils/piwik/previousRouteRecorder.guard.ts
@@ -0,0 +1,17 @@
+
+import { Injectable } from '@angular/core';
+import { CanDeactivate, Router} from '@angular/router';
+import {Observable}       from 'rxjs/Observable';
+
+@Injectable() // do not forget to register this class as a provider
+export class PreviousRouteRecorder implements CanDeactivate<any> {
+  constructor(private router: Router) {
+  }
+  canDeactivate(component: any): Observable<boolean> | boolean {
+    if (typeof localStorage !== 'undefined') {
+      console.log("In PreviousRouteRecorder : "+this.router.url );
+      localStorage.setItem('previousRoute', this.router.url);
+    }
+    return true;
+  }
+}
diff --git a/utils/properties/openaireProperties.ts b/utils/properties/openaireProperties.ts
new file mode 100644
index 00000000..412fe887
--- /dev/null
+++ b/utils/properties/openaireProperties.ts
@@ -0,0 +1,417 @@
+export class OpenaireProperties {
+    private static productionMode:boolean = false;
+    private static enablePiwikTrack:boolean = false;
+    private static enableHelper:boolean = false;
+    private static useCache:boolean = true;
+
+    //base url
+    private static baseLink = "https://demo.openaire.eu";
+
+    //landing Pages
+    private static baseSearchLink="/";
+    private static searchLinkToPublication = "search/publication?articleId=";
+    private static searchLinkToProject = "search/project?projectId=";
+    private static searchLinkToDataProvider = "search/dataprovider?datasourceId=";
+    private static searchLinkToDataset = "search/dataset?datasetId=";
+    private static searchLinkToOrganization = "search/organization?organizationId=";
+    //Search pages
+    private static searchLinkToPublications = "search/find/publications";
+    private static searchLinkToDataProviders = "search/find/dataproviders";
+    private static searchLinkToProjects = "search/find/projects";
+    private static searchLinkToDatasets = "search/find/datasets";
+    private static searchLinkToSoftware = "search/find/software";
+    private static searchLinkToOrganizations = "search/find/organizations";
+    private static searchLinkToPeople = "search/find/people";
+    public static searchLinkToCompatibleDataProviders = "search/content-providers";
+    public static searchLinkToCompatibleDataProvidersTable = "search/content-providers-table";
+    public static searchLinkToEntityRegistriesDataProviders = "search/entity-registries";
+    public static searchLinkToEntityRegistriesDataProvidersTable = "search/entity-registries-table";
+    public static searchLinkToJournals = "search/journals";
+    public static searchLinkToJournalsTable = "search/journals-table";
+
+    //Advanced Search for pages
+    public static searchLinkToAdvancedPublications = "search/advanced/publications";
+    public static searchLinkToAdvancedProjects = "search/advanced/projects";
+    public static searchLinkToAdvancedDatasets = "search/advanced/datasets";
+    public static searchLinkToAdvancedSoftware = "search/advanced/software";
+    public static searchLinkToAdvancedDataProviders = "search/advanced/dataproviders";
+    public static searchLinkToAdvancedOrganizations = "search/advanced/organizations";
+    public static searchLinkToAdvancedPeople = "search/advanced/people";
+
+
+    private static metricsAPIURL = "https://beta.services.openaire.eu/usagestats/";
+    private static framesAPIURL = "https://beta.openaire.eu/stats3/";
+
+    private static loginAPIURL = "http://rudie.di.uoa.gr:8080/dnet%2Dopenaire%2Dusers%2D1.0.0%2DSNAPSHOT/api/users/authenticates"
+    //"http://scoobydoo.di.uoa.gr:8080/uoa-user-management-1.0.0-SNAPSHOT/api/users/authenticates";
+    private static loginAPIURL_pm = "https://beta.services.openaire.eu/uoa-user-management/api/users/authenticates";
+
+    private static claimsAPIURL = "http://scoobydoo.di.uoa.gr:8080/dnet-claims-service-2.0.0-SNAPSHOT/rest/claimsService/";
+    private static claimsAPIURL_pm = "https://beta.services.openaire.eu/claims/rest/claimsService/";
+
+     private static searchAPIURLLAst_pm     = "https://beta.services.openaire.eu/search/v2/api/";
+     private static searchAPIURLLAst     = "https://beta.services.openaire.eu/search/v2/api/";
+//    private static searchAPIURLLAst     = "http://scoobydoo.di.uoa.gr:8080/dnet-functionality-services-2.0.0-SNAPSHOT/rest/v2/api/";
+
+    private static searchResourcesAPIURL_pm     = "https://beta.services.openaire.eu/search/v2/api/resources";
+    private static searchResourcesAPIURL     = "https://beta.services.openaire.eu/search/v2/api/resources";
+    // private static searchResourcesAPIURL     = "http://scoobydoo.di.uoa.gr:8080/dnet-functionality-services-2.0.0-SNAPSHOT/rest/v2/api/resources";
+
+
+    private static csvAPIURL_pm = "https://beta.services.openaire.eu/search/v2/api/";//publications?format=csv
+    // private static csvAPIURL = "http://rudie.di.uoa.gr:8080/dnet-functionality-services-2.0.0-SNAPSHOT/rest/v2/api/";//publications?format=csv
+
+   private static csvAPIURL = "https://beta.services.openaire.eu/search/v2/api/";//publications?format=csv
+
+    private static searchCrossrefAPIURL = "https://api.crossref.org/works";
+    // private static searchDataciteAPIURL = "https://search.datacite.org/api";
+    private static searchDataciteAPIURL = "https://api.datacite.org/works";
+
+    private static searchOrcidURL    = "https://pub.orcid.org/";
+
+    // Identifiers
+    private static pmidURL    = "http://www.ncbi.nlm.nih.gov/pubmed/";
+    private static doiURL     = "https://dx.doi.org/";
+    private static cordisURL  = "http://cordis.europa.eu/projects/";
+    private static pmcURL     = "http://europepmc.org/articles/";
+    private static handleURL  = "http://hdl.handle.net/";
+
+    // Zenodo's url
+    private static zenodo   = "https://zenodo.org/";
+    // Open access link
+    private static openAccess = "https://www.openaire.eu/support/faq#article-id-234";
+    // Open access repository link
+    private static openAccessRepo = "https://www.openaire.eu/support/faq#article-id-310";
+    // FP7 link
+    private static fp7Guidlines = "https://www.openaire.eu/open-access-in-fp7-seventh-research-framework-programme";
+    // H2020 link
+    private static h2020Guidlines = "https://www.openaire.eu/oa-publications/h2020/open-access-in-horizon-2020";
+    // ERC Guidlines
+    private static ercGuidlines = "http://erc.europa.eu/sites/default/files/document/file/ERC_Open_Access_Guidelines-revised_2014.pdf";
+    // helpdesk link
+    private static helpdesk = "https://www.openaire.eu/support/helpdesk";
+
+    private static uploadService_pm = "https://demo.openaire.eu/upload";
+    private static uploadService = "http://scoobydoo.di.uoa.gr:8000/upload";
+
+    private static vocabulariesAPI ="https://beta.services.openaire.eu/provision/mvc/vocabularies/";
+
+    private static piwikBaseUrl =" https://analytics.openaire.eu/piwik.php?idsite=6";
+
+
+    private static loginUrl ="http://mpagasas.di.uoa.gr:8080/dnet-openaire-users-1.0.0-SNAPSHOT/openid_connect_login";
+    private static loginUrl_pm ="https://beta.services.openaire.eu/uoa-user-management/openid_connect_login";
+
+    private static logoutUrl ="https://aai.openminted.eu/proxy/saml2/idp/SingleLogoutService.php?ReturnTo=";
+    private static logoutUrl_pm ="https://aai.openminted.eu/proxy/saml2/idp/SingleLogoutService.php?ReturnTo=";
+
+    private static logoutOpenaireUrl ="http://dl067.madgik.di.uoa.gr/idp/profile/Logout";
+    private static logoutOpenaireUrl_pm ="http://dl067.madgik.di.uoa.gr/idp/profile/Logout";
+
+
+
+    private static cookieDomain =".di.uoa.gr";
+    private static cookieDomain_pm =".openaire.eu";
+
+    private static feedbackmail ="openaire.test@gmail.com";
+
+    private static helperPageUrl ="http://scoobydoo.di.uoa.gr:16000/api/page/route";
+
+    private static cache ="http://scoobydoo.di.uoa.gr:3000/get?url=";
+    private static cache_pm ="https://demo.openaire.eu/cache/get?url=";
+
+
+
+    public static getBaseLink():string{
+      return this.baseLink;
+    }
+
+    //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 getsearchLinkToOrganization():string{
+      return  this.searchLinkToOrganization;
+    }
+    public static getsearchLinkToDataProvider():string{
+      return  this.searchLinkToDataProvider;
+    }
+    //searchPages
+    public static getLinkToSearchPublications():string{
+      return this.baseSearchLink + this.searchLinkToPublications;
+    }
+    public static getLinkToSearchProjects():string{
+      return this.baseSearchLink + this.searchLinkToProjects;
+    }
+    public static getLinkToSearchDataProviders():string{
+      return this.baseSearchLink + this.searchLinkToDataProviders;
+    }
+    public static getLinkToSearchCompatibleDataProviders():string{
+      return this.baseSearchLink + this.searchLinkToCompatibleDataProviders;
+    }
+    public static getLinkToSearchCompatibleDataProvidersTable():string{
+      return this.baseSearchLink + this.searchLinkToCompatibleDataProvidersTable;
+    }
+    public static getLinkToSearchEntityRegistries():string{
+      return this.baseSearchLink + this.searchLinkToEntityRegistriesDataProviders;
+    }
+    public static getLinkToSearchEntityRegistriesTable():string{
+      return this.baseSearchLink + this.searchLinkToEntityRegistriesDataProvidersTable;
+    }
+    public static getLinkToSearchJournals():string{
+      return this.baseSearchLink + this.searchLinkToJournals;
+    }
+    public static getLinkToSearchJournalsTable():string{
+      return this.baseSearchLink + this.searchLinkToJournalsTable;
+    }
+    public static getLinkToSearchDatasets():string{
+      return this.baseSearchLink + this.searchLinkToDatasets;
+    }
+    public static getLinkToSearchSoftware():string{
+      return this.baseSearchLink + this.searchLinkToSoftware;
+    }
+    public static getLinkToSearchOrganizations():string{
+      return this.baseSearchLink + this.searchLinkToOrganizations;
+    }
+    public static getLinkToSearchPeople():string{
+        return this.baseSearchLink + this.searchLinkToPeople;
+    }
+
+    //Advanced searchPages
+    public static getLinkToAdvancedSearchPublications():string{
+      return this.baseSearchLink + this.searchLinkToAdvancedPublications;
+    }
+    public static getLinkToAdvancedSearchProjects():string{
+      return this.baseSearchLink + this.searchLinkToAdvancedProjects;
+    }
+    public static getLinkToAdvancedSearchDataProviders():string{
+      return this.baseSearchLink + this.searchLinkToAdvancedDataProviders;
+    }
+    public static getLinkToAdvancedSearchDatasets():string{
+      return this.baseSearchLink + this.searchLinkToAdvancedDatasets;
+    }
+    public static getLinkToAdvancedSearchSoftware():string{
+      return this.baseSearchLink + this.searchLinkToAdvancedSoftware;
+    }
+    public static getLinkToAdvancedSearchOrganizations():string{
+      return this.baseSearchLink + this.searchLinkToAdvancedOrganizations;
+    }
+    public static getLinkToAdvancedSearchPeople():string{
+        return this.baseSearchLink + this.searchLinkToAdvancedPeople;
+    }
+
+    // Services - APIs' getters
+    // public static getSearchAPIURL():string{
+    //   return this.searchAPIURL;
+    // }
+    // Services - APIs' getters
+    public static getCsvAPIURL(): string {
+      if(this.productionMode){
+        return this.csvAPIURL_pm;
+      }else{
+        return this.csvAPIURL;
+      }
+        // return this.csvAPIURL;
+    }
+
+    public static getFramesAPIURL(): string {
+        return this.framesAPIURL;
+    }
+
+    public static getMetricsAPIURL(): string {
+        return this.metricsAPIURL;
+    }
+
+    public static getLoginAPIURL(): string {
+      if(this.productionMode){
+        return this.loginAPIURL_pm;
+      }else{
+        return this.loginAPIURL;
+      }
+        // return this.loginAPIURL;
+    }
+
+    public static getSearchAPIURLLast():string{
+      if(this.productionMode){
+        return this.searchAPIURLLAst_pm;
+      }else{
+        return this.searchAPIURLLAst;
+      }
+      // return this.searchAPIURLLAst;
+    }
+    //query using full query:
+    //
+    public static getSearchResourcesAPIURL():string{
+      if(this.productionMode){
+        return this.searchResourcesAPIURL_pm;
+      }else{
+        return this.searchResourcesAPIURL;
+      }
+      // return this.searchResourcesAPIURL;
+    }
+    public static getSearchAPIURLForEntity(entityType:string):string{
+      var suffix = "";
+      if(entityType == "project"){
+        suffix="projects/";
+      }else if(entityType == "publication"){
+        suffix="publications/";
+      }else if(entityType == "dataset"){
+        suffix="datasets/";
+      } else if(entityType == "software"){
+        suffix="software/";
+      }else if(entityType == "organization"){
+        suffix="organizations/";
+      }else if(entityType == "dataprovider"){
+        suffix="datasources/";
+      }else if(entityType == "person"){
+        suffix="people/";
+      }
+      return (this.productionMode?this.searchAPIURLLAst_pm:this.searchAPIURLLAst) + suffix;
+    }
+
+    public static getClaimsAPIURL():string{
+      if(this.productionMode){
+        return this.claimsAPIURL_pm;
+      }else{
+        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;
+    }
+    public static getHandleURL():string{
+        return this.handleURL;
+    }
+
+    // Zenodo's getter
+    public static getZenodoURL():string{
+        return this.zenodo;
+    }
+    // Open access getter
+    public static getOpenAccess():string{
+        return this.openAccess;
+    }
+    // Open access repository getter
+    public static getOpenAccessRepo():string{
+        return this.openAccessRepo;
+    }
+    // FP7 link getter
+    public static getFP7Guidlines():string{
+        return this.fp7Guidlines;
+    }
+    // H2020 link getter
+    public static getH2020Guidlines():string{
+        return this.h2020Guidlines;
+    }
+    // ERC Guidlines getter
+    public static getERCGuidlines():string{
+        return this.ercGuidlines;
+    }
+    // helpdesk link getter
+    public static getHelpdesk():string{
+        return this.helpdesk;
+    }
+
+
+    //upload service for bulk claim - upload csv file
+    public static getUploadServiceUrl():string{
+      if(this.productionMode){
+        return this.uploadService_pm;
+      }else{
+        return this.uploadService;
+      }
+    }
+    //vocabularies API
+    public static getVocabulariesAPI():string{
+        return this.vocabulariesAPI;
+    }
+    public static getPiwikBaseURL():string{
+        return this.piwikBaseUrl;
+    }
+    public static isPiwikTrackEnabled():boolean{
+        return this.enablePiwikTrack;
+    }
+    public static getLoginURL():string{
+      if(this.productionMode){
+        return this.loginUrl_pm;
+      }else{
+        return this.loginUrl;
+      }
+    }
+    public static getLogoutURL():string{
+      if(this.productionMode){
+        return this.logoutUrl_pm;
+      }else{
+        return this.logoutUrl;
+      }
+    }
+    public static getLogoutOpenaireURL():string{
+      if(this.productionMode){
+        return this.logoutOpenaireUrl_pm;
+      }else{
+        return this.logoutOpenaireUrl;
+      }
+    }
+    public static getCookieDomain():string{
+      if(this.productionMode){
+        return this.cookieDomain_pm;
+      }else{
+        return this.cookieDomain;
+      }
+    }
+    public static getFeedbackMail():string{
+      return this.feedbackmail;
+  }
+  public static getHelperPageUrl():string{
+    return this.helperPageUrl;
+  }
+  public static isHelperEnabled():boolean{
+    return this.enableHelper;
+  }
+  public static getCacheUrl():string{
+    if(this.productionMode){
+      return this.cache_pm;
+    }else{
+      return this.cache;
+    }
+  }
+  public static isCacheEnabled():boolean{
+    return this.useCache;
+  }
+}
+export class ErrorCodes {
+  public LOADING = 0;
+  public DONE = 1;
+  public NONE = 2;
+  public ERROR = 3;
+  public NOT_AVAILABLE = 4;
+  public OUT_OF_BOUND = 5;
+  public NOT_FOUND = 6;
+}
diff --git a/utils/properties/searchFields.ts b/utils/properties/searchFields.ts
new file mode 100644
index 00000000..a38fc940
--- /dev/null
+++ b/utils/properties/searchFields.ts
@@ -0,0 +1,159 @@
+export class SearchFields {
+    //main Entities
+    //RESULTS
+    //Used for datasets and publications
+    //In case Datasets should display  different fields, use seperate tables for fields
+    public RESULT_REFINE_FIELDS = [
+      "relfunder",
+    "relfundinglevel0_id","relfundinglevel1_id","relfundinglevel2_id",
+    "relproject","resultacceptanceyear",
+   "resultbestaccessright", "instancetypename", "resultlanguagename", "community","resulthostingdatasource"];
+
+     public RESULT_ADVANCED_FIELDS:string[] = ["q","resulttitle","resultauthor","resultpublisher","instancetypename",
+     "resultlanguagename", "community","relprojectid", "relfunder",
+     "relfundinglevel0_id","relfundinglevel1_id","relfundinglevel2_id",
+     "resultdateofacceptance","resultbestaccessright","pid","resulthostingdatasourceid","collectedfromdatasourceid", "relorganizationid"];
+          public RESULT_FIELDS: { [key:string]:FieldDetails}={
+           ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+         ["resulttitle"]:{name:"Title", type:"keyword", param:"title", equalityOperator: "="},
+         ["resultauthor"]:{name:"Author", type:"keyword", param:"author", equalityOperator: "="},
+         ["resultpublisher"]:{name:"Publisher", type:"keyword", param:"publisher", equalityOperator: "="},
+         ["pid"]:{name:"PID", type:"keyword", param:"pid", equalityOperator: " = "},
+         ["resulthostingdatasourceid"]:{name:"Hosting Content Provider", type:"entity", param:"hostedBy", equalityOperator: " exact "},
+         ["resulthostingdatasource"]:{name:"Content Provider", type:"refine", param:"hostedBy", equalityOperator: " exact "},
+         ["instancetypename"]:{name:"Type", type:"vocabulary", param:"type", equalityOperator: " exact "},
+        //  ["instancetypenameid"]:{name:"Type", type:"vocabulary", param:"type", equalityOperator: " exact "},
+         ["resultlanguagename"]:{name:"Language", type:"vocabulary", param:"lang", equalityOperator: " exact "},
+        //  ["resultlanguageid"]:{name:"Language", type:"vocabulary", param:"lang", equalityOperator: " exact "},
+         ["community"]:{name:"Community", type:"refine", param:"community", equalityOperator: " exact "},
+         ["relproject"]:{name:"Project", type:"refine", param:"project", equalityOperator: " exact "},
+         ["relprojectid"]:{name:"Project", type:"entity", param:"project", equalityOperator: " exact "},
+         ["relfunder"]:{name:"Funder", type:"refine", param:"funder", equalityOperator: " exact "},
+         ["relfundinglevel0_id"]:{name:"Funding Stream", type:"refine", param:"funderlv0", equalityOperator: " exact "},
+         ["relfundinglevel1_id"]:{name:"Funding Substream level 1", type:"refine", param:"funderlv1", equalityOperator: " exact "},
+         ["relfundinglevel2_id"]:{name:"Funding Substream level 2", type:"refine", param:"funderlv2", equalityOperator: " exact "},
+         ["resultacceptanceyear"]:{name:"Publication Date", type:"keyword", param:"year", equalityOperator: " exact "},
+         ["resultdateofacceptance"]:{name:"Publication Date", type:"date", param:"date", equalityOperator: " within "},
+         ["resultbestaccessright"]:{name:"Access Mode", type:"vocabulary", param:"access", equalityOperator: " exact "},
+        //  ["resultbestaccessright"]:{name:"Access Mode", type:"refine", param:"access", equalityOperator: " exact "},
+         ["collectedfrom"]:{name:"Content Provider", type:"refine", param:"datasource", equalityOperator: " exact "},
+         ["relorganizationid"]:{name:"Organization", type:"entity", param:"organization", equalityOperator: " exact "},
+         ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+                };
+
+      //PROJECT
+
+      public PROJECT_REFINE_FIELDS:string[] =  ["funder","fundinglevel0_id","fundinglevel1_id",
+      "fundinglevel2_id","projectstartyear","projectendyear","projectecsc39"];
+    public PROJECT_ADVANCED_FIELDS:string[] =  ["q","projectacronym","projecttitle","projectkeywords",
+    "funder",  "fundinglevel0_id","fundinglevel1_id",  "fundinglevel2_id",
+    "projectstartdate","projectenddate","projectecsc39",
+    "projectcode_nt","relorganizationid", "collectedfromdatasourceid"];
+    public PROJECT_FIELDS: { [key:string]:FieldDetails}={
+       ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+       ["projectacronym"]:{name:"Acronym", type:"keyword", param:"acronym", equalityOperator: "="},
+       ["projecttitle"]:{name:"Title", type:"keyword", param:"title", equalityOperator: "="},
+       ["projectkeywords"]:{name:"Keywords", type:"keyword", param:"keywords", equalityOperator: "="},
+
+       ["funder"]:{name:"Funder", type:"refine", param:"funder", equalityOperator: " exact "},
+       ["fundinglevel0_id"]:{name:"Funding Stream", type:"refine", param:"funderlv0", equalityOperator: " exact "},
+       ["fundinglevel1_id"]:{name:"Funding Substream level 1", type:"refine", param:"funderlv1", equalityOperator: " exact "},
+       ["fundinglevel2_id"]:{name:"Funding Substream level 2", type:"refine", param:"funderlv2", equalityOperator: " exact "},
+       ["projectstartyear"]:{name:"Start Year", type:"year", param:"startyear", equalityOperator: " exact "},
+       ["projectendyear"]:{name:"End Year", type:"year", param:"endyear", equalityOperator: " exact "},
+       ["projectstartdate"]:{name:"Start Date", type:"date", param:"startdate", equalityOperator: " within "},
+       ["projectenddate"]:{name:"End Date", type:"date", param:"enddate", equalityOperator: " within "},
+       ["projectecsc39"]:{name:"Special Clause 39", type:"boolean", param:"sc39", equalityOperator: " exact "},
+       ["projectcode_nt"]:{name:"Project Code", type:"keyword", param:"code", equalityOperator: " exact "},
+       ["relorganizationid"]:{name:"Organization", type:"entity", param:"organization", equalityOperator: " exact "},
+       ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+
+     };
+
+       //DATAPROVIDERS
+
+       public DATASOURCE_REFINE_FIELDS:string[] =  ["datasourcetypeuiname", "datasourceodlanguages", "datasourceodcontenttypes",
+         "datasourcecompatibilityname"];
+         public DATASOURCE_ADVANCED_FIELDS:string[] = ["q", "datasourceofficialname",
+         "datasourceenglishname","datasourceodsubjects", "datasourcetypename","datasourceodlanguages",
+         "datasourceodcontenttypes", "datasourcecompatibilityname","relorganizationid", "collectedfromdatasourceid"];
+
+         public DATASOURCE_FIELDS: { [key:string]:FieldDetails}={
+              ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+              ["datasourceofficialname"]:{name:"English name", type:"keyword", param:"officialname", equalityOperator: "="},
+              ["datasourceenglishname"]:{name:"Title", type:"keyword", param:"engname", equalityOperator: "="},
+              ["datasourceodsubjects"]:{name:"Subject", type:"keyword", param:"subjects", equalityOperator: "="},
+              ["datasourcetypeuiid"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+              ["datasourcetypeuiname"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+              ["datasourcetypename"]:{name:"Type", type:"vocabulary", param:"type", equalityOperator: " exact "},
+              ["datasourceodlanguages"]:{name:"Language", type:"vocabulary", param:"lang", equalityOperator: " exact "},
+              ["datasourceodcontenttypes"]:{name:"Content", type:"refine", param:"content", equalityOperator: " exact "},
+              ["datasourcecompatibilityid"]:{name:"Compatibility Level", type:"refine", param:"compatibility", equalityOperator: " exact "},
+              ["datasourcecompatibilityname"]:{name:"Compatibility Level", type:"vocabulary", param:"compatibility", equalityOperator: " exact "},
+              ["relorganizationid"]:{name:"Organization", type:"entity", param:"organization", equalityOperator: " exact "},
+              ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+            };
+
+          public COMPATIBLE_DATAPROVIDER_FIELDS:string[] = ["datasourcetypeuiid","datasourcecompatibilityname"];
+          public ENTITY_REGISTRIES_FIELDS:string[] = ["datasourcetypename","datasourcecompatibilityname"];
+          public JOURNAL_FIELDS:string[] = ["datasourcetypeuiid","datasourcecompatibilityname"];
+
+         //ORGANIZATION
+
+         public ORGANIZATION_REFINE_FIELDS:string[] = ["organizationcountryname"]
+     public ORGANIZATION_ADVANCED_FIELDS:string[] = ["q", "organizationlegalname","organizationlegalshortname","organizationcountryname"];
+
+     public ORGANIZATION_FIELDS: { [key:string]:FieldDetails}={
+                ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+                ["organizationlegalname"]:{name:"Legal Name", type:"keyword", param:"name", equalityOperator: "="},
+                ["organizationlegalshortname"]:{name:"Legal Short Name", type:"keyword", param:"shortname", equalityOperator: "="},
+                ["organizationcountryname"]:{name:"Country", type:"vocabulary", param:"country", equalityOperator: "="},
+              //  ["organizationcountryname"]:{name:"Country", type:"refine", param:"country", equalityOperator: "="}
+              };
+         public ORGANIZATION_INDEX:string[] = ["organizationcountryname"]//,"organizationeclegalbody"];
+        public ADVANCED_SEARCH_ORGANIZATION_PARAM:string[] = ["q","contenttype","compatibility","country","type"];
+           public ORGANIZATION_INDEX_PARAM_MAP:{ [key:string]:string } = {["organizationlegalname"]:"contenttype", ["organizationlegalshortname"]:"type",
+            ["organizationcountryname"]:"country"};//,["organizationeclegalbody"]:"type"};
+          public ORGANIZATION_FIELDS_MAP: { [key:string]:{ name:string, operator:string, type:string, indexField:string , equalityOperator:string}} ={
+          ["q"]:{name:"All fields",operator:"op", type:"keyword", indexField:null, equalityOperator: "="},
+          ["contenttype"]:{name:"Legal Name",operator:"cn", type:"keyword" , indexField:"organizationlegalname", equalityOperator: "="},
+          ["compatibility"]:{name:"Legal Short Name",operator:"cm", type:"keyword", indexField:"organizationlegalshortname", equalityOperator: "="},
+          ["country"]:{name:"Country",operator:"cu", type:"vocabulary", indexField:"organizationcountryname", equalityOperator: " exact "},
+          ["type"]:{name:"Type",operator:"tp", type:"refine", indexField:"organizationeclegalbody", equalityOperator: " exact "},
+
+          };
+
+
+
+     public HIDDEN_FIELDS:string[] = ["fundinglevel0_id","fundinglevel1_id","fundinglevel2_id",
+     "relfundinglevel0_id","relfundinglevel1_id","relfundinglevel2_id"];
+
+     public DEPENDENT_FIELDS: { [key:string]:string } = {["fundinglevel0_id"]:"funder",
+     ["fundinglevel1_id"]:"fundinglevel0_id", ["fundinglevel2_id"]:"fundinglevel1_id", ["relfundinglevel0_id"]:"relfunder",
+     ["relfundinglevel1_id"]:"relfundinglevel0_id", ["relfundinglevel2_id"]:"relfundinglevel1_id"};
+
+
+      public ADVANCED_SEARCH_OPERATORS:[{name:string, id:string}] = [{name:"AND",id:"and"},{name:"OR",id:"or"},{name:"NOT",id:"not"}];
+
+     constructor (){
+     }
+     getFieldName(fieldId:string,fieldType:string):string{
+       if(fieldType == "publication" || fieldType == "dataset" || fieldType == "software"){
+         return this.RESULT_FIELDS[fieldId].name;
+       }else if(fieldType == "project"){
+         return this.PROJECT_FIELDS[fieldId].name;
+       }else if(fieldType == "organization"){
+         return this.ORGANIZATION_FIELDS[fieldId].name;
+       }else if(fieldType == "datasource" || fieldType == "dataprovider"){
+         return this.DATASOURCE_FIELDS[fieldId].name;
+       }else{
+         return "UNDEFINED";
+       }
+     }
+}
+export class FieldDetails{
+   name:string;
+     type:string;
+      param:string;
+       equalityOperator:string;
+ }
diff --git a/utils/properties/searchFields_new.ts b/utils/properties/searchFields_new.ts
new file mode 100644
index 00000000..fc5dd3ae
--- /dev/null
+++ b/utils/properties/searchFields_new.ts
@@ -0,0 +1,164 @@
+export class SearchFields {
+    //main Entities
+    //RESULTS
+    //Used for datasets and publications
+    //In case Datasets should display  different fields, use seperate tables for fields
+    public RESULT_REFINE_FIELDS = ["instancetypename", "resultlanguagename", "community","relproject", "relfunder",
+   "relfundinglevel0_id","relfundinglevel1_id","relfundinglevel2_id",
+   "resultacceptanceyear","resultbestlicense"];//,"collectedfrom"];
+
+     public RESULT_ADVANCED_FIELDS:string[] = ["q","resulttitle","relperson","resultpublisher","instancetypenameid",
+     "resultlanguageid", "community","relprojectid", "relfunder",
+     "relfundinglevel0_id","relfundinglevel1_id","relfundinglevel2_id",
+     "resultacceptanceyear","resultbestlicenseid","pid","resulthostingdatasourceid","collectedfromdatasourceid","relpersonid"];
+          public RESULT_FIELDS: { [key:string]:FieldDetails}={
+           ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+         ["resulttitle"]:{name:"Title", type:"keyword", param:"title", equalityOperator: "="},
+         ["relperson"]:{name:"Author", type:"keyword", param:"author", equalityOperator: "="},
+         ["resultpublisher"]:{name:"Publisher", type:"keyword", param:"publisher", equalityOperator: "="},
+         ["pid"]:{name:"PID", type:"keyword", param:"pid", equalityOperator: " = "},
+         ["resulthostingdatasourceid"]:{name:"Hosting Data Provider", type:"entity", param:"hostedBy", equalityOperator: " exact "},
+         ["relpersonid"]:{name:"Person", type:"entity", param:"person", equalityOperator: " exact "},
+         ["instancetypename"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+         ["instancetypenameid"]:{name:"Type", type:"vocabulary", param:"type", equalityOperator: " exact "},
+         ["resultlanguagename"]:{name:"Language", type:"refine", param:"lang", equalityOperator: " exact "},
+         ["resultlanguageid"]:{name:"Language", type:"vocabulary", param:"lang", equalityOperator: " exact "},
+         ["community"]:{name:"Community", type:"refine", param:"community", equalityOperator: " exact "},
+         ["relproject"]:{name:"Project", type:"refine", param:"project", equalityOperator: " exact "},
+         ["relprojectid"]:{name:"Project", type:"entity", param:"project", equalityOperator: " exact "},
+         ["relfunder"]:{name:"Funder", type:"refine", param:"funder", equalityOperator: " exact "},
+         ["relfundinglevel0_id"]:{name:"Funding Stream", type:"refine", param:"funderlv0", equalityOperator: " exact "},
+         ["relfundinglevel1_id"]:{name:"Funding Substream level 1", type:"refine", param:"funderlv1", equalityOperator: " exact "},
+         ["relfundinglevel2_id"]:{name:"Funding Substream level 2", type:"refine", param:"funderlv2", equalityOperator: " exact "},
+         ["resultacceptanceyear"]:{name:"Year", type:"year", param:"year", equalityOperator: " exact "},
+         ["resultbestlicense"]:{name:"Access Mode", type:"refine", param:"access", equalityOperator: " exact "},
+         ["resultbestlicenseid"]:{name:"Access Mode", type:"vocabulary", param:"access", equalityOperator: " exact "},
+         ["collectedfrom"]:{name:"Content Provider", type:"refine", param:"datasource", equalityOperator: " exact "},
+         ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+                };
+
+      //PROJECT
+
+      public PROJECT_REFINE_FIELDS:string[] =  ["funder","fundinglevel0_id","fundinglevel1_id",
+      "fundinglevel2_id","projectstartyear","projectendyear","projectecsc39"];
+    public PROJECT_ADVANCED_FIELDS:string[] =  ["q","projectacronym","projecttitle","projectkeywords",
+    "funder",  "fundinglevel0_id","fundinglevel1_id",  "fundinglevel2_id",
+    "projectstartyear","projectendyear","projectecsc39",
+    "projectcode","relorganizationid", "collectedfromdatasourceid"];
+    public PROJECT_FIELDS: { [key:string]:FieldDetails}={
+       ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+       ["projectacronym"]:{name:"Acronym", type:"keyword", param:"acronym", equalityOperator: "="},
+       ["projecttitle"]:{name:"Title", type:"keyword", param:"title", equalityOperator: "="},
+       ["projectkeywords"]:{name:"Keywords", type:"keyword", param:"keywords", equalityOperator: "="},
+
+       ["funder"]:{name:"Funder", type:"refine", param:"funder", equalityOperator: " exact "},
+       ["fundinglevel0_id"]:{name:"Funding Stream", type:"refine", param:"funderlv0", equalityOperator: " exact "},
+       ["fundinglevel1_id"]:{name:"Funding Substream level 1", type:"refine", param:"funderlv1", equalityOperator: " exact "},
+       ["fundinglevel2_id"]:{name:"Funding Substream level 2", type:"refine", param:"funderlv2", equalityOperator: " exact "},
+       ["projectstartyear"]:{name:"Start Year", type:"year", param:"startyear", equalityOperator: " exact "},
+       ["projectendyear"]:{name:"End Year", type:"year", param:"endyear", equalityOperator: " exact "},
+
+       ["projectecsc39"]:{name:"Special Clause 39", type:"boolean", param:"sc39", equalityOperator: " exact "},
+       ["projectcode"]:{name:"Project Code", type:"keyword", param:"code", equalityOperator: " exact "},
+       ["relorganizationid"]:{name:"Organization", type:"entity", param:"organization", equalityOperator: " exact "},
+       ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+
+     };
+
+       //DATAPROVIDERS
+
+       public DATASOURCE_REFINE_FIELDS:string[] =  ["datasourcetypeuiname", "datasourceodlanguages", "datasourceodcontenttypes",
+         "datasourcecompatibilityname"];
+         public DATASOURCE_ADVANCED_FIELDS:string[] = ["q", "datasourceofficialname",
+         "datasourceenglishname","datasourceodsubjects", "datasourcetypeid","datasourceodlanguages",
+         "datasourceodcontenttypes", "datasourcecompatibilityid","relorganizationid", "collectedfromdatasourceid"];
+
+         public DATASOURCE_FIELDS: { [key:string]:FieldDetails}={
+              ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+              ["datasourceofficialname"]:{name:"English name", type:"keyword", param:"officialname", equalityOperator: "="},
+              ["datasourceenglishname"]:{name:"Title", type:"keyword", param:"engname", equalityOperator: "="},
+              ["datasourceodsubjects"]:{name:"Subject", type:"keyword", param:"subjects", equalityOperator: "="},
+              ["datasourcetypeuiid"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+              ["datasourcetypeuiname"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+              ["datasourcetypeid"]:{name:"Type", type:"vocabulary", param:"type", equalityOperator: " exact "},
+              ["datasourceodlanguages"]:{name:"Language", type:"vocabulary", param:"lang", equalityOperator: " exact "},
+              ["datasourceodcontenttypes"]:{name:"Content", type:"refine", param:"content", equalityOperator: " exact "},
+              ["datasourcecompatibilityid"]:{name:"Compatibility Level", type:"vocabulary", param:"compatibility", equalityOperator: " exact "},
+              ["datasourcecompatibilityname"]:{name:"Compatibility Level", type:"refine", param:"compatibility", equalityOperator: " exact "},
+              ["relorganizationid"]:{name:"Organization", type:"entity", param:"organization", equalityOperator: " exact "},
+              ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+
+            };
+
+          public COMPATIBLE_DATAPROVIDER_FIELDS:string[] = ["datasourcetypeuiid","datasourcecompatibilityid"];
+          public ENTITY_REGISTRIES_FIELDS:string[] = ["datasourcetypeid","datasourcecompatibilityid"];
+
+         //ORGANIZATION
+
+         public ORGANIZATION_REFINE_FIELDS:string[] = ["organizationcountryname"]
+     public ORGANIZATION_ADVANCED_FIELDS:string[] = ["q",
+     "organizationlegalname","organizationlegalshortname","organizationcountryid"];
+
+     public ORGANIZATION_FIELDS: { [key:string]:FieldDetails}={
+                ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+                ["organizationlegalname"]:{name:"Legal Name", type:"keyword", param:"name", equalityOperator: "="},
+                ["organizationlegalshortname"]:{name:"Legal Short Name", type:"keyword", param:"shortname", equalityOperator: "="},
+                ["organizationcountryid"]:{name:"Country", type:"vocabulary", param:"country", equalityOperator: "="},
+                ["organizationcountryname"]:{name:"Country", type:"refine", param:"country", equalityOperator: "="}
+              };
+         public ORGANIZATION_INDEX:string[] = ["organizationcountryname"]//,"organizationeclegalbody"];
+        public ADVANCED_SEARCH_ORGANIZATION_PARAM:string[] = ["q","contenttype","compatibility","country","type"];
+           public ORGANIZATION_INDEX_PARAM_MAP:{ [key:string]:string } = {["organizationlegalname"]:"contenttype", ["organizationlegalshortname"]:"type",
+            ["organizationcountryname"]:"country"};//,["organizationeclegalbody"]:"type"};
+          public ORGANIZATION_FIELDS_MAP: { [key:string]:{ name:string, operator:string, type:string, indexField:string , equalityOperator:string}} ={
+          ["q"]:{name:"All fields",operator:"op", type:"keyword", indexField:null, equalityOperator: "="},
+          ["contenttype"]:{name:"Legal Name",operator:"cn", type:"keyword" , indexField:"organizationlegalname", equalityOperator: "="},
+          ["compatibility"]:{name:"Legal Short Name",operator:"cm", type:"keyword", indexField:"organizationlegalshortname", equalityOperator: "="},
+          ["country"]:{name:"Country",operator:"cu", type:"vocabulary", indexField:"organizationcountryname", equalityOperator: " exact "},
+          ["type"]:{name:"Type",operator:"tp", type:"refine", indexField:"organizationeclegalbody", equalityOperator: " exact "},
+
+          };
+
+        //PERSON
+        public PERSON_REFINE_FIELDS:string[] = [];
+          public PERSON_ADVANCED_FIELDS:string[] = ["q","personsecondnames","personfirstname","personfullname"];
+      public PERSON_FIELDS: { [key:string]:FieldDetails}={
+          ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+          ["personsecondnames"]:{name:"Surname", type:"keyword", param:"surname", equalityOperator: "="},
+          ["personfirstname"]:{name:"First Name",type:"keyword", param:"name", equalityOperator: "="},
+          ["personfullname"]:{name:"Full name", type:"keyword", param:"fullname", equalityOperator: "="}
+        };
+
+
+     public HIDDEN_FIELDS:string[] = ["fundinglevel0_id","fundinglevel1_id","fundinglevel2_id",
+     "relfundinglevel0_id","relfundinglevel1_id,relfundinglevel2_id"];
+
+     public DEPENDENT_FIELDS: { [key:string]:string } = {["fundinglevel0_id"]:"funder",
+     ["fundinglevel1_id"]:"fundinglevel0_id", ["fundinglevel2_id"]:"fundinglevel1_id", ["relfundinglevel0_id"]:"relfunder",
+     ["relfundinglevel1_id"]:"relfundinglevel0_id", ["relfundinglevel2_id"]:"relfundinglevel1_id"};
+
+
+      public ADVANCED_SEARCH_OPERATORS:[{name:string, id:string}] = [{name:"AND",id:"and"},{name:"OR",id:"or"},{name:"NOT",id:"not"}];
+
+     constructor (){
+     }
+     getFieldName(fieldId:string,fieldType:string):string{
+       if(fieldType == "publication" || fieldType == "dataset"){
+         return this.RESULT_FIELDS[fieldId].name;
+       }else if(fieldType == "project"){
+         return this.PROJECT_FIELDS[fieldId].name;
+       }else if(fieldType == "organization"){
+         return this.ORGANIZATION_FIELDS[fieldId].name;
+       }else if(fieldType == "datasource"){
+         return this.DATASOURCE_FIELDS[fieldId].name;
+       }else{
+         return "UNDEFINED";
+       }
+     }
+}
+export class FieldDetails{
+   name:string;
+     type:string;
+      param:string;
+       equalityOperator:string;
+ }
diff --git a/utils/properties/searchFields_old.ts b/utils/properties/searchFields_old.ts
new file mode 100644
index 00000000..9c74982a
--- /dev/null
+++ b/utils/properties/searchFields_old.ts
@@ -0,0 +1,164 @@
+export class SearchFields {
+    //main Entities
+    //RESULTS
+    //Used for datasets and publications
+    //In case Datasets should display  different fields, use seperate tables for fields
+    public RESULT_REFINE_FIELDS = ["instancetypename", "resultlanguagename", "community","relproject", "relfunderid",
+   "relfundinglevel0_id","relfundinglevel1_id","relfundinglevel2_id",
+   "resultacceptanceyear","resultbestlicense"];//,"collectedfrom"];
+
+     public RESULT_ADVANCED_FIELDS:string[] = ["q","resulttitle","relperson","resultpublisher","instancetypenameid",
+     "resultlanguageid", "community","relprojectid", "relfunderid",
+     "relfundinglevel0_id","relfundinglevel1_id","relfundinglevel2_id",
+     "resultacceptanceyear","resultbestlicenseid","pid","resulthostingdatasourceid","collectedfromdatasourceid","relpersonid"];
+          public RESULT_FIELDS: { [key:string]:FieldDetails}={
+           ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+         ["resulttitle"]:{name:"Title", type:"keyword", param:"title", equalityOperator: "="},
+         ["relperson"]:{name:"Author", type:"keyword", param:"author", equalityOperator: "="},
+         ["resultpublisher"]:{name:"Publisher", type:"keyword", param:"publisher", equalityOperator: "="},
+         ["pid"]:{name:"PID", type:"keyword", param:"pid", equalityOperator: " = "},
+         ["resulthostingdatasourceid"]:{name:"Hosting Data Provider", type:"entity", param:"hostedBy", equalityOperator: " exact "},
+         ["relpersonid"]:{name:"Person", type:"entity", param:"person", equalityOperator: " exact "},
+         ["instancetypename"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+         ["instancetypenameid"]:{name:"Type", type:"vocabulary", param:"type", equalityOperator: " exact "},
+         ["resultlanguagename"]:{name:"Language", type:"refine", param:"lang", equalityOperator: " exact "},
+         ["resultlanguageid"]:{name:"Language", type:"vocabulary", param:"lang", equalityOperator: " exact "},
+         ["community"]:{name:"Community", type:"refine", param:"community", equalityOperator: " exact "},
+         ["relproject"]:{name:"Project", type:"refine", param:"project", equalityOperator: " exact "},
+         ["relprojectid"]:{name:"Project", type:"entity", param:"project", equalityOperator: " exact "},
+         ["relfunderid"]:{name:"Funder", type:"refine", param:"funder", equalityOperator: " exact "},
+         ["relfundinglevel0_id"]:{name:"Funding Stream", type:"refine", param:"funderlv0", equalityOperator: " exact "},
+         ["relfundinglevel1_id"]:{name:"Funding Substream level 1", type:"refine", param:"funderlv1", equalityOperator: " exact "},
+         ["relfundinglevel2_id"]:{name:"Funding Substream level 2", type:"refine", param:"funderlv2", equalityOperator: " exact "},
+         ["resultacceptanceyear"]:{name:"Year", type:"year", param:"year", equalityOperator: " exact "},
+         ["resultbestlicense"]:{name:"Access Mode", type:"refine", param:"access", equalityOperator: " exact "},
+         ["resultbestlicenseid"]:{name:"Access Mode", type:"vocabulary", param:"access", equalityOperator: " exact "},
+         ["collectedfrom"]:{name:"Content Provider", type:"refine", param:"datasource", equalityOperator: " exact "},
+         ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+                };
+
+      //PROJECT
+
+      public PROJECT_REFINE_FIELDS:string[] =  ["funderid","fundinglevel0_id","fundinglevel1_id",
+      "fundinglevel2_id","projectstartyear","projectendyear","projectecsc39"];
+    public PROJECT_ADVANCED_FIELDS:string[] =  ["q","projectacronym","projecttitle","projectkeywords",
+    "funderid",  "fundinglevel0_id","fundinglevel1_id",  "fundinglevel2_id",
+    "projectstartyear","projectendyear","projectecsc39",
+    "projectcode","relorganizationid", "collectedfromdatasourceid"];
+    public PROJECT_FIELDS: { [key:string]:FieldDetails}={
+       ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+       ["projectacronym"]:{name:"Acronym", type:"keyword", param:"acronym", equalityOperator: "="},
+       ["projecttitle"]:{name:"Title", type:"keyword", param:"title", equalityOperator: "="},
+       ["projectkeywords"]:{name:"Keywords", type:"keyword", param:"keywords", equalityOperator: "="},
+
+       ["funderid"]:{name:"Funder", type:"refine", param:"funder", equalityOperator: " exact "},
+       ["fundinglevel0_id"]:{name:"Funding Stream", type:"refine", param:"funderlv0", equalityOperator: " exact "},
+       ["fundinglevel1_id"]:{name:"Funding Substream level 1", type:"refine", param:"funderlv1", equalityOperator: " exact "},
+       ["fundinglevel2_id"]:{name:"Funding Substream level 2", type:"refine", param:"funderlv2", equalityOperator: " exact "},
+       ["projectstartyear"]:{name:"Start Year", type:"year", param:"startyear", equalityOperator: " exact "},
+       ["projectendyear"]:{name:"End Year", type:"year", param:"endyear", equalityOperator: " exact "},
+
+       ["projectecsc39"]:{name:"Special Clause 39", type:"boolean", param:"sc39", equalityOperator: " exact "},
+       ["projectcode"]:{name:"Project Code", type:"keyword", param:"code", equalityOperator: " exact "},
+       ["relorganizationid"]:{name:"Organization", type:"entity", param:"organization", equalityOperator: " exact "},
+       ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+
+     };
+
+       //DATAPROVIDERS
+
+       public DATASOURCE_REFINE_FIELDS:string[] =  ["datasourcetypeuiname", "datasourceodlanguages", "datasourceodcontenttypes",
+         "datasourcecompatibilityname"];
+         public DATASOURCE_ADVANCED_FIELDS:string[] = ["q", "datasourceofficialname",
+         "datasourceenglishname","datasourceodsubjects", "datasourcetypeid","datasourceodlanguages",
+         "datasourceodcontenttypes", "datasourcecompatibilityid","relorganizationid", "collectedfromdatasourceid"];
+
+         public DATASOURCE_FIELDS: { [key:string]:FieldDetails}={
+              ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+              ["datasourceofficialname"]:{name:"English name", type:"keyword", param:"officialname", equalityOperator: "="},
+              ["datasourceenglishname"]:{name:"Title", type:"keyword", param:"engname", equalityOperator: "="},
+              ["datasourceodsubjects"]:{name:"Subject", type:"keyword", param:"subjects", equalityOperator: "="},
+              ["datasourcetypeuiid"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+              ["datasourcetypeuiname"]:{name:"Type", type:"refine", param:"type", equalityOperator: " exact "},
+              ["datasourcetypeid"]:{name:"Type", type:"vocabulary", param:"type", equalityOperator: " exact "},
+              ["datasourceodlanguages"]:{name:"Language", type:"vocabulary", param:"lang", equalityOperator: " exact "},
+              ["datasourceodcontenttypes"]:{name:"Content", type:"refine", param:"content", equalityOperator: " exact "},
+              ["datasourcecompatibilityid"]:{name:"Compatibility Level", type:"vocabulary", param:"compatibility", equalityOperator: " exact "},
+              ["datasourcecompatibilityname"]:{name:"Compatibility Level", type:"refine", param:"compatibility", equalityOperator: " exact "},
+              ["relorganizationid"]:{name:"Organization", type:"entity", param:"organization", equalityOperator: " exact "},
+              ["collectedfromdatasourceid"]:{name:"Collected from Content Provider", type:"entity", param:"collectedFrom", equalityOperator: " exact "}
+
+            };
+
+          public COMPATIBLE_DATAPROVIDER_FIELDS:string[] = ["datasourcetypeuiid","datasourcecompatibilityid"];
+          public ENTITY_REGISTRIES_FIELDS:string[] = ["datasourcetypeid","datasourcecompatibilityid"];
+
+         //ORGANIZATION
+
+         public ORGANIZATION_REFINE_FIELDS:string[] = ["organizationcountryname"]
+     public ORGANIZATION_ADVANCED_FIELDS:string[] = ["q",
+     "organizationlegalname","organizationlegalshortname","organizationcountryid"];
+
+     public ORGANIZATION_FIELDS: { [key:string]:FieldDetails}={
+                ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+                ["organizationlegalname"]:{name:"Legal Name", type:"keyword", param:"name", equalityOperator: "="},
+                ["organizationlegalshortname"]:{name:"Legal Short Name", type:"keyword", param:"shortname", equalityOperator: "="},
+                ["organizationcountryid"]:{name:"Country", type:"vocabulary", param:"country", equalityOperator: "="},
+                ["organizationcountryname"]:{name:"Country", type:"refine", param:"country", equalityOperator: "="}
+              };
+         public ORGANIZATION_INDEX:string[] = ["organizationcountryname"]//,"organizationeclegalbody"];
+        public ADVANCED_SEARCH_ORGANIZATION_PARAM:string[] = ["q","contenttype","compatibility","country","type"];
+           public ORGANIZATION_INDEX_PARAM_MAP:{ [key:string]:string } = {["organizationlegalname"]:"contenttype", ["organizationlegalshortname"]:"type",
+            ["organizationcountryname"]:"country"};//,["organizationeclegalbody"]:"type"};
+          public ORGANIZATION_FIELDS_MAP: { [key:string]:{ name:string, operator:string, type:string, indexField:string , equalityOperator:string}} ={
+          ["q"]:{name:"All fields",operator:"op", type:"keyword", indexField:null, equalityOperator: "="},
+          ["contenttype"]:{name:"Legal Name",operator:"cn", type:"keyword" , indexField:"organizationlegalname", equalityOperator: "="},
+          ["compatibility"]:{name:"Legal Short Name",operator:"cm", type:"keyword", indexField:"organizationlegalshortname", equalityOperator: "="},
+          ["country"]:{name:"Country",operator:"cu", type:"vocabulary", indexField:"organizationcountryname", equalityOperator: " exact "},
+          ["type"]:{name:"Type",operator:"tp", type:"refine", indexField:"organizationeclegalbody", equalityOperator: " exact "},
+
+          };
+
+        //PERSON
+        public PERSON_REFINE_FIELDS:string[] = [];
+          public PERSON_ADVANCED_FIELDS:string[] = ["q","personsecondnames","personfirstname","personfullname"];
+      public PERSON_FIELDS: { [key:string]:FieldDetails}={
+          ["q"]:{name:"All fields", type:"keyword", param:"q", equalityOperator: "="},
+          ["personsecondnames"]:{name:"Surname", type:"keyword", param:"surname", equalityOperator: "="},
+          ["personfirstname"]:{name:"First Name",type:"keyword", param:"name", equalityOperator: "="},
+          ["personfullname"]:{name:"Full name", type:"keyword", param:"fullname", equalityOperator: "="}
+        };
+
+
+     public HIDDEN_FIELDS:string[] = ["fundinglevel0_id","fundinglevel1_id","fundinglevel2_id",
+     "relfundinglevel0_id","relfundinglevel1_id,relfundinglevel2_id"];
+
+     public DEPENDENT_FIELDS: { [key:string]:string } = {["fundinglevel0_id"]:"funderid",
+     ["fundinglevel1_id"]:"fundinglevel0_id", ["fundinglevel2_id"]:"fundinglevel1_id", ["relfundinglevel0_id"]:"relfunderid",
+     ["relfundinglevel1_id"]:"relfundinglevel0_id", ["relfundinglevel2_id"]:"relfundinglevel1_id"};
+
+
+      public ADVANCED_SEARCH_OPERATORS:[{name:string, id:string}] = [{name:"AND",id:"and"},{name:"OR",id:"or"},{name:"NOT",id:"not"}];
+
+     constructor (){
+     }
+     getFieldName(fieldId:string,fieldType:string):string{
+       if(fieldType == "publication" || fieldType == "dataset"){
+         return this.RESULT_FIELDS[fieldId].name;
+       }else if(fieldType == "project"){
+         return this.PROJECT_FIELDS[fieldId].name;
+       }else if(fieldType == "organization"){
+         return this.ORGANIZATION_FIELDS[fieldId].name;
+       }else if(fieldType == "datasource"){
+         return this.DATASOURCE_FIELDS[fieldId].name;
+       }else{
+         return "UNDEFINED";
+       }
+     }
+}
+class FieldDetails{
+   name:string;
+     type:string;
+      param:string;
+       equalityOperator:string;
+ }
diff --git a/utils/routerHelper.class.ts b/utils/routerHelper.class.ts
new file mode 100644
index 00000000..fecaf296
--- /dev/null
+++ b/utils/routerHelper.class.ts
@@ -0,0 +1,34 @@
+
+
+
+export class RouterHelper {
+  //Use this class function to create queryParams Objects in format {key1:value1} or {key1:value1,key2:value2,key3:value3,...} for  multiple parameters
+  constructor(){}
+  //  <a  [queryParams]="RouterHelper.createQueryParam(filter.filterId,value.id)" routerLinkActive="router-link-active" [routerLink]=baseUrl>Link</a>
+  public createQueryParam(key:string,value:string){
+    var obj ={};
+    obj[key]=value;
+    return obj;
+
+  }
+  public createQueryParamsPaging(keys:string[],values:string[],pageParameter:string,pageValue:number){
+    var obj = this.createQueryParams(keys, values);
+    obj[pageParameter] = ""+pageValue;
+    return obj;
+
+  }
+  public createQueryParams(keys:string[],values:string[]){
+    var obj ={};
+    if(!keys || !values || keys.length != values.length){
+      return obj;
+    }else{
+      for(var i=0; i< keys.length; i++){
+          obj[keys[i]]=values[i];
+      }
+    }
+    return obj;
+
+  }
+
+
+}
diff --git a/utils/staticAutoComplete/ISVocabularies.service.ts b/utils/staticAutoComplete/ISVocabularies.service.ts
new file mode 100644
index 00000000..7ec5902e
--- /dev/null
+++ b/utils/staticAutoComplete/ISVocabularies.service.ts
@@ -0,0 +1,110 @@
+import {Injectable} from '@angular/core';
+import {Http, Response} from '@angular/http';
+import {Observable}     from 'rxjs/Observable';
+import {AutoCompleteValue} from '../../searchPages/searchUtils/searchHelperClasses.class';
+import 'rxjs/add/observable/of';
+import 'rxjs/add/operator/do';
+import 'rxjs/add/operator/share';
+
+import {OpenaireProperties} from '../../utils/properties/openaireProperties';
+
+@Injectable()
+export class ISVocabulariesService {
+    private api =OpenaireProperties.getVocabulariesAPI();
+    constructor(private http: Http ) {}
+
+    getVocabularyByType(field:string,entity:string):any{
+      console.log("getVocabulary field: "+ field + " for entity: "+ entity);
+      var file = "";
+      var vocabulary = "";
+      if( field == "lang"){
+          // file="languages.json";
+          // return this.getVocabularyFromFile(file);
+          vocabulary = "dnet:languages.json";
+          return this.getVocabularyFromService(vocabulary);
+      }else if ( field == "type" && (entity == "publication")){
+        // file = "publicationTypes.json";
+        // return this.getVocabularyFromFile(file);
+        vocabulary = "dnet:publication_resource.json";
+        return this.getVocabularyFromService(vocabulary);
+
+      }else if ( field == "type" && (entity == "dataset")){
+        // file = "dnet:dataCite_resource.json";
+        // return this.getVocabularyFromFile(file);
+        vocabulary = "dnet:dataCite_resource.json";
+        return this.getVocabularyFromService(vocabulary);
+
+      }else if( field == "access" && (entity == "publication" || entity == "dataset")){
+        // file= "accessMode.json";
+        // return this.getVocabularyFromFile(file);
+        vocabulary = "dnet:access_modes.json";
+        return this.getVocabularyFromService(vocabulary);
+
+      } else if( (field == "type") && (entity == "dataprovider")){
+        // file = "dataProviderType.json";
+        //   return this.getVocabularyFromFile(file);
+          vocabulary = "dnet:datasource_typologies.json";
+          return this.getVocabularyFromService(vocabulary);
+
+      } else if( field == "compatibility" && (entity == "dataprovider")){
+        // file = "dataProviderCompatibility.json";
+        //   return this.getVocabularyFromFile(file);
+          vocabulary = "dnet:datasourceCompatibilityLevel.json";
+          return this.getVocabularyFromService(vocabulary);
+
+      } else if( field == "country" ){
+        // file = "countries.json";
+        //   return this.getVocabularyFromFile(file);
+          vocabulary = "dnet:countries.json";
+          return this.getVocabularyFromService(vocabulary);
+
+      }
+      return null;
+
+    }
+    // getVocabularyFromFile (file:string):AutoCompleteValue[] {
+    //        var lang = JSON.parse(JSON.stringify(require('../utils/vocabularies/'+file)));
+    //       return  this.parse(lang["terms"]);
+    // }
+    getVocabularyFromService (vocabularyName:string):any {
+        let url = this.api + vocabularyName;
+        console.log(url);
+
+        // return this.http.get(url).toPromise()
+        // .then(request =>
+        //   {
+        //     request = request.json()['terms'];
+        //     var results:AutoCompleteValue[] = this.parse(request);
+        //     console.log("Get vocabulary : "+ vocabularyName+ " - get " +results.length+ "results");
+        //     return results;
+        //   });
+        return this.http.get((OpenaireProperties.isCacheEnabled())? (OpenaireProperties.getCacheUrl()+encodeURIComponent(url)): url)
+                    .do(res => console.log(res))
+                    .map(res => <any> res.json())
+                    .map(res => res['terms'])
+                    .do(res => console.log(res))
+                    .map(res => this.parse(res))
+                    .do(res => console.log(res))
+                    .catch(this.handleError);
+
+    }
+
+    parse (data: any):AutoCompleteValue[] {
+        var array:AutoCompleteValue[] =[]
+        for(var i = 0; i < data.length; i++){
+          var value:AutoCompleteValue =  new AutoCompleteValue();
+          value.id =  data[i].englishName;//data[i].code;
+          value.label = data[i].englishName;
+          array.push(value);
+        }
+
+        return array;
+
+    }
+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.log(error);
+      return Observable.throw(error  || 'Server error');
+    }
+}
diff --git a/utils/staticAutoComplete/staticAutoComplete.component.ts b/utils/staticAutoComplete/staticAutoComplete.component.ts
new file mode 100644
index 00000000..49db0739
--- /dev/null
+++ b/utils/staticAutoComplete/staticAutoComplete.component.ts
@@ -0,0 +1,299 @@
+import {Component, ElementRef, Input, Output, EventEmitter, OnChanges, SimpleChange} from '@angular/core';
+import {Value} from '../../searchPages/searchUtils/searchHelperClasses.class';
+import {ISVocabulariesService} from './ISVocabularies.service';
+import {RefineFieldResultsService} from '../../services/refineFieldResults.service';
+//Usage example
+//<static-autocomplete [(filtered)] =filtered [(selected)] =selected placeHolderMessage = "Search for countries" title = "Countries:" (keywordChange)="keywordChanged($event)"></static-autocomplete>
+
+@Component({
+    selector: 'static-autocomplete',
+    host: {
+       '(document:click)': 'handleClick($event)',
+   },
+    template: `
+        <span class="custom-autocomplete uk-width-1-1">
+            <span   *ngIf = "showSelected && selectedValue != ''">
+              <span  class="uk-alert-default" data-uk-alert=""  *ngFor="let item of selected"  [title]="showItem(item)"> <span >{{showItem(item)}} </span>
+                <span (click)="remove(item)" aria-hidden="true" title="Remove selection" > <span class="clickable uk-icon">
+<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
+</span> </span>
+              </span>
+            </span>
+            <input *ngIf = "showInput " type="text" class="auto-complete-input validate filter-input input-sm form-control  -width-small " [placeholder]=placeHolderMessage [(ngModel)]=keyword (keyup)=filter()   >
+            <!--span [style.display]="showLoading ? 'inline' : 'none'" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading... </span>
+            <span *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" data-uk-alert=""> {{warningMessage}} <a href="" class="uk-alert-close uk-close"></a></span-->
+            <div  *ngIf="focus && showInput"  class="uk-dropdown" aria-expanded="true" style="display:block" >
+                  <ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results" >
+                      <li>
+                      <span [style.display]="showLoading ? 'inline' : 'none'" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading... </span>
+                      <span *ngIf="filtered.length > 0"  >  {{results}} results found:</span>
+                      <span *ngIf="filtered.length == 0" class="uk-alert uk-alert-primary" data-uk-alert=""> No results found</span>
+                      </li>
+                      <li    *ngFor=" let item of filtered">
+                          <a (click)="select(item)"  [title]="showItem(item)" style="text-overflow: ellipsis; ">{{showItem(item)}}</a>
+                      </li>
+                  </ul>
+            </div>
+        </span>
+
+        `
+})
+export class StaticAutoCompleteComponent implements OnChanges{
+    @Input() placeHolderMessage = "Search for entries";
+    @Input() title = "Autocomplete";
+    @Output() addItem = new EventEmitter(); // when selected list  changes update parent component
+    @Output() selectedValueChanged = new EventEmitter(); // when changed  a method for filtering will be called
+    @Output() listUpdated = new EventEmitter(); // when changed  a method for filtering will be called
+    @Input() public list = []; // the entries resulted after filtering function
+    @Input() public filtered = []; // the entries resulted after filtering function
+    @Input() public selected = []; // the entries selected from user
+    @Input() public keywordlimit = 3; // the minimum length of keyword
+    @Input() public showSelected = true; // the minimum length of keyword
+    @Input() public multipleSelections:boolean = true;
+    @Input() public allowDuplicates:boolean = false;
+    @Input() public selectedValue:string = '';
+    @Input() public vocabularyId:string ;
+    @Input() public fieldName:string ;
+    @Input() public entityName:string ;
+    @Input() public fieldId:string ;
+
+    @Input() public keyword = '';
+    @Input() public type = 'search' //search, result, context, project
+    public warningMessage = "";
+    public infoMessage = "";
+    public showLoading:boolean = false;
+    public tries = 0;
+    public showInput = true;
+    public sub;
+    public done = false;
+    public results = 0;
+    public focus:boolean  = false;
+    public currentFieldId: string ;
+    constructor ( private _vocabulariesService: ISVocabulariesService,private _refineService: RefineFieldResultsService, private myElement: ElementRef) {
+            this.currentFieldId=this.fieldId;
+
+    }
+    ngOnDestroy(){
+      if(this.sub && this.sub != undefined){
+        this.sub.unsubscribe();
+      }
+    }
+
+    ngOnChanges(changes: {[propKey: string]: SimpleChange}) {
+         if(this.currentFieldId!=this.fieldId){ //this is going to be called when
+          this.currentFieldId=this.fieldId;
+          this.initialize();
+        }
+    }
+    private initialize(){
+
+      this.showInput = true;
+      if(this.list == undefined || this.list.length == 0){
+        this.showLoading = true;
+
+       if(this.vocabularyId){
+        // this.list = this._vocabulariesService.getVocabularyByType(this.vocabularyId, this.entityName);
+        // this.afterListFetchedActions();
+        this.sub = this._vocabulariesService.getVocabularyByType(this.vocabularyId, this.entityName).subscribe(
+            data => {
+                this.list  = data;
+                this.afterListFetchedActions();
+
+            },
+            err => {
+                console.log(err);
+                this.warningMessage = "An Error occured..."
+            }
+        );
+      }else if(this.fieldName && this.entityName){
+        // this.list = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName);
+        this.sub = this._refineService.getRefineFieldResultsByFieldName(this.fieldName,this.entityName).subscribe(
+            data => {
+                this.list  = data;
+                this.afterListFetchedActions();
+
+            },
+            err => {
+                console.log(err);
+                this.warningMessage = "An Error occured..."
+            }
+        );
+      }else{
+        this.showLoading = false;
+
+      }
+    }else{
+      this.afterListFetchedActions();
+    }
+
+    }
+    public updateList(list){ // used in claim context autocomplete
+      this.list = list;
+      this.afterListFetchedActions()
+    }
+    private afterListFetchedActions(){
+      this.showLoading = false;
+      this.getSelectedNameFromGivenId();
+      this.listUpdated.emit({
+          value: this.list
+      });
+      if(this.list == null || this.list.length == 0 ){
+        this.warningMessage = "No results available";
+        return;
+      }
+      this.done = true;
+      if(this.keyword != ""){
+        this.filter();
+      }
+
+    }
+    filter() {
+      this.focus = true;
+      if(this.done){
+        this.infoMessage = "";
+        this.filtered = [];
+        if(this.keyword == ""){
+          var cut = 10;
+          if(this.list.length < 5){
+            cut = this.list.length;
+          }
+          this.results = this.list.length;
+          this.filtered =this.list.slice(0, cut);
+          this.tries = 0;
+          this.warningMessage = "";
+        // } else if(this.keyword && this.keyword.length < this.keywordlimit){
+        //   this.tries++;
+        //   if(this.tries == this.keywordlimit -1 ){
+        //     this.warningMessage = "Type at least " + this.keywordlimit + " characters";
+        //     this.tries = 0;
+        //   }
+        }else{
+          this.tries = 0;
+          this.warningMessage = "";
+           this.filtered = this.list.filter(function(el){
+              return el.label.toLowerCase().indexOf(this.keyword.toLowerCase()) > -1;
+          }.bind(this));
+          var cut = 10;
+          if(this.filtered .length < 5){
+            cut = this.list.length;
+          }
+          this.results = this.filtered.length;
+           this.filtered =this.filtered.slice(0, cut);
+        }
+      }
+    }
+    remove(item:any){
+      var index:number =this.checkIfExists(item,this.selected);
+       if (index > -1) {
+          this.selected.splice(index, 1);
+      }
+      if(!this.multipleSelections && this.selected.length == 0 ){
+        this.showInput = true;
+        this.selectedValue = "";
+        this.selectedValueChanged.emit({
+            value: this.selectedValue
+        });
+
+
+      }
+    }
+    select(item:any){
+      // console.log("select"+this.selected.length  + item.id + " "+ item.label);
+
+        if(this.multipleSelections){
+          var index:number =this.checkIfExists(item,this.selected);
+           if (index > -1 && !this.allowDuplicates) {
+              this.keyword = "";
+              this.filtered.splice(0, this.filtered.length);
+              return;
+          }
+          else{
+              this.selected.push(item);
+              this.keyword = "";
+              this.filtered.splice(0, this.filtered.length);
+              this.addItem.emit({
+                  value: item
+              });
+          }
+      }else{
+        this.selected.splice(0, this.selected.length);
+        this.selected.push(item);
+        this.filtered.splice(0, this.filtered.length);
+        this.keyword = "";
+        this.showInput = false;
+        this.selectedValue = item.id;
+        this.selectedValueChanged.emit({
+            value: this.selectedValue
+        });
+
+      }
+
+    }
+    private checkIfExists(item:any,list):number{
+
+       if(item.concept && item.concept.id ){
+
+        for (var _i = 0; _i < list.length; _i++) {
+            let itemInList = list[_i];
+            if(item.concept.id == itemInList.concept.id){
+                 return _i;
+            }
+         }
+      }else if(item.id){
+        for (var _i = 0; _i < list.length; _i++) {
+            let itemInList = list[_i];
+             if(item.id == itemInList.id){
+                 return _i;
+            }
+         }
+      }
+      return -1;
+
+    }
+    showItem(item:any):string{
+
+     if (item.name){ //search
+         return item.name;
+      }else if( item.concept && item.concept.label){ //context
+         return item.concept.label;
+      }else if (item.label){ //simple
+         return item.label;
+      }
+
+    }
+    truncate(str:string, size:number):string{
+      if(str == null){return "";}
+      return (str.length > size)?str.substr(0,size)+'...':str;
+    }
+    private getSelectedNameFromGivenId(){
+      if(this.list == null ){
+        return;
+      }
+      this.showInput = true;
+      for( var i = 0; i < this.list.length; i++){
+        if(this.list[i].id == this.selectedValue){
+          this.selectedValue = this.list[i].label;
+          this.selected.push(this.list[i]);
+          this.showInput = false;
+          return;
+
+        }
+      }
+    }
+
+    handleClick(event){
+     var clickedComponent = event.target;
+     var inside = false;
+     do {
+         if (clickedComponent === this.myElement.nativeElement) {
+             inside = true;
+         }
+        clickedComponent = clickedComponent.parentNode;
+     } while (clickedComponent);
+      if(!inside){
+          this.focus =false;
+          this.filtered.splice(0, this.filtered.length);
+      }
+  }
+
+}
diff --git a/utils/staticAutoComplete/staticAutoComplete.module.ts b/utils/staticAutoComplete/staticAutoComplete.module.ts
new file mode 100644
index 00000000..1c876a15
--- /dev/null
+++ b/utils/staticAutoComplete/staticAutoComplete.module.ts
@@ -0,0 +1,22 @@
+import { NgModule }            from '@angular/core';
+import { CommonModule }        from '@angular/common';
+import { FormsModule }         from '@angular/forms';
+
+import {StaticAutoCompleteComponent} from './staticAutoComplete.component';
+import {RefineFieldResultsServiceModule} from '../../services/refineFieldResultsService.module';
+import {ISVocabulariesService} from './ISVocabularies.service';
+
+
+@NgModule({
+  imports: [
+    CommonModule, FormsModule, RefineFieldResultsServiceModule
+  ],
+  declarations: [
+     StaticAutoCompleteComponent
+  ],
+  exports: [
+      StaticAutoCompleteComponent
+    ],
+    providers:[ ISVocabulariesService]
+})
+export class StaticAutocompleteModule { }
diff --git a/utils/string-utils.class.ts b/utils/string-utils.class.ts
new file mode 100644
index 00000000..ece1ce3e
--- /dev/null
+++ b/utils/string-utils.class.ts
@@ -0,0 +1,129 @@
+export class Dates {
+  public static isValidYear(yearString){
+    // First check for the pattern
+    if(!/^\d{4}$/.test(yearString))
+        return false;
+        var year = parseInt(yearString, 10);
+
+        // Check the ranges of month and year
+        if(year < 1000 || year > 3000 )
+            return false;
+        return true;
+  }
+  //format YYYY-MM-DD
+  public static isValidDate(dateString:string)
+  {
+      // First check for the pattern
+      if(!/^\d{4}\-\d{1,2}\-\d{1,2}$/.test(dateString))
+          return false;
+
+      // Parse the date parts to integers
+      var parts = dateString.split("-");
+      var day = parseInt(parts[2], 10);
+      var month = parseInt(parts[1], 10);
+       var year = parseInt(parts[0], 10);
+      if(!this.isValidYear(parts[0])){
+        return false;
+      }
+
+      // Check the ranges of month and year
+      if( month == 0 || month > 12)
+          return false;
+
+      var monthLength = [ 31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31 ];
+
+      // Adjust for leap years
+      if(year % 400 == 0 || (year % 100 != 0 && year % 4 == 0))
+          monthLength[1] = 29;
+
+      // Check the range of the day
+      return day > 0 && day <= monthLength[month - 1];
+
+  }
+  public static getDateToday():Date{
+    var myDate = new Date();
+    return myDate;
+
+  }
+  public static getDateToString(myDate:Date):string{
+    var date:string = myDate.getFullYear()+ "-" ;
+     date+=((myDate.getMonth() + 1)<10)?"0"+(myDate.getMonth() + 1):(myDate.getMonth() + 1) ;
+     date+="-";
+     date+=  (myDate.getDate() <10 )? "0"+myDate.getDate():myDate.getDate() ;
+     return date;
+
+  }
+  public static getDateXMonthsAgo(x:number):Date{
+    var myDate = new Date();
+    myDate.setMonth(myDate.getMonth() - x);
+    return myDate;
+
+  }
+  public static getDateXYearsAgo(x:number):Date{
+    var myDate = new Date();
+    myDate.setFullYear(myDate.getFullYear() - x);
+    return myDate;
+
+  }
+  public static getDateFromString(date:string):Date{
+
+    var myDate = new Date();
+    myDate.setFullYear(+date.substring(0,4));
+    myDate.setMonth(+date.substring(5,7)-1);
+    myDate.setDate(+date.substring(8,11))
+    return myDate;
+
+  }
+
+}
+
+export class DOI{
+
+  public static getDOIsFromString(str:string):string[]{
+    var DOIs:string[] = [];
+    var words:string[] = str.split(" ");
+
+    for(var i=0; i< words.length; i++){
+        if(DOI.isValidDOI(words[i]) && DOIs.indexOf(words[i]) == -1){
+          DOIs.push(words[i]);
+        }
+    }
+    return DOIs;
+  }
+  public static isValidDOI(str:string):boolean{
+
+      var exp1 = /\b(10[.][0-9]{4,}(?:[.][0-9]+)*\/(?:(?!["&\'<>])\S)+)\b/g
+      var exp2 = /\b(10[.][0-9]{4,}(?:[.][0-9]+)*\/(?:(?!["&\'<>])[[:graph:]])+)\b/g
+      if(str.match(exp1)!=null || str.match(exp2)!=null){
+        // console.log("It's a DOI");
+        return true;
+      }
+      return false;
+
+  }
+}
+export class StringUtils{
+  public static quote(params: string):string {
+      return '"'+params+'"';
+  }
+
+  public static unquote(params: string):string {
+     if(params.length > 2 && (params[0]=='"' && params[params.length-1]=='"') || (params[0]=="'" && params[params.length-1]=="'")){
+      params= params.substring(1, params.length-1);
+    }
+      return params;
+  }
+  public static URIEncode(params: string):string {
+      return encodeURIComponent(params);
+  }
+  public static URIDecode(params: string):string {
+      return decodeURIComponent(params);
+  }
+  public static  b64DecodeUnicode(str) {
+      return decodeURIComponent(Array.prototype.map.call(atob(str), function(c) {
+          return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
+      }).join(''));
+  }
+
+
+}