D-Net

<div *ngIf="!getIsUserLoggedIn()">

  <div class="image-front-topbar  uk-section-default"

       uk-scrollspy="{"target":"[uk-scrollspy-class]","cls":"uk-animation-fade","delay":false}" tm-header-transparent="light">

    <div style="background-image: url('../../../assets/imgs/provide_2.jpg'); background-color: rgb(255, 255, 255); box-sizing: border-box; min-height: calc(-101.35px + 100vh);" class="uk-background-norepeat uk-background-cover uk-background-top-center uk-background-fixed uk-section uk-padding-remove-bottom uk-flex uk-flex-middle" uk-height-viewport="offset-top: true;offset-bottom: 20">

      <div class="uk-width-1-1">

        <div class="uk-margin-medium uk-grid uk-grid-stack" uk-grid="">

          <div class="uk-width-1-1@m">

          </div>

        </div>

        <div class="uk-container uk-margin-large">

          <div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;"></div>

          <div class="search_box_bg uk-grid-large uk-flex-middle uk-grid uk-grid-stack" uk-grid="">

            <div class="uk-width-1-1@m uk-first-column">

              <h1 id="page#6" class="uk-text-center uk-h1 uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

                OpenAIRE Content Provider Dashboard    </h1>

              <h4 id="page#7" class="uk-text-center uk-h4 uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

                A one-stop-shop for sharing, finding and enriching your content    </h4>

              <div class="uk-margin-large uk-text-center uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

                <a class="el-content uk-button uk-button-primary" (click)="login()">

                  Start here

                </a>

              </div>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

  <div class="uk-section-secondary uk-section uk-section-small" uk-scrollspy="{&quot;target&quot;:&quot;[uk-scrollspy-class]&quot;,&quot;cls&quot;:&quot;uk-animation-slide-top-medium&quot;,&quot;delay&quot;:false}" uk-height-viewport="expand: true" style="box-sizing: border-box;">

    <div class="uk-container">

      <div class="uk-margin-small uk-grid uk-grid-stack" uk-grid="">

        <div class="uk-width-1-1@m uk-first-column">

          <h6 class="uk-margin-large uk-margin-remove-bottom uk-text-center uk-h4 uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" style="">

            Learn what you gain when you join OpenAIRE     </h6>

          <hr class="uk-width-small uk-margin-auto uk-divider-small uk-text-center uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" style="">

        </div>

      </div>

      <div class="uk-container uk-container-large uk-margin-large">

        <div uk-grid="" class="uk-grid uk-grid-stack">

          <div class="uk-width-1-1@m uk-first-column">

            <div class="uk-margin uk-grid-match uk-child-width-1-1 uk-child-width-1-2@s uk-child-width-1-4@m uk-child-width-1-4@l uk-child-width-1-4@xl uk-grid-parallax uk-grid uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" uk-grid-parallax="translate: " uk-lightbox="toggle: a[data-type]" style="margin-bottom: 20px;">

              <div class="uk-first-column">

                <div uk-scrollspy-class="" class="el-item uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" style="">

                  <a data-type="iframe" href="/www.cnn.com" class="el-link uk-position-cover uk-position-z-index uk-margin-remove-adjacent" data-caption="<h4 class='uk-margin-remove'>Validate</h4><div>&nbsp;Use our validation service and see how you can apply the <a href=&quot;guidelines.openaire.eu&quot; target=&quot;_blank&quot;>OpenAIRE Guidelines</a>&nbsp;to expose your content using global standards.</div>"></a>

                  <div class="uk-card-media-top"><img src="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/register_bw_3-34cc7a83.jpg" srcset="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/register_bw_3-b8268aa2.jpg 640w,https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/register_bw_3-34cc7a83.jpg 800w" sizes="(min-width: 800px) 800px, 100vw" class="el-image" alt="" width="800"></div>

                  <div class="uk-card-body">

                    <h3 class="el-title uk-margin uk-h2 uk-margin-remove-adjacent uk-margin-remove-bottom">

                      Validate    </h3>

                    <div class="el-meta uk-margin uk-text-meta">Interoperable metadata is key for effective content sharing.</div>

                    <div class="el-content uk-margin"><div>&nbsp;Use our validation service and see how you can apply the <a href="/guidelines.openaire.eu" target="_blank">OpenAIRE Guidelines</a>&nbsp;to expose your content using global standards.</div></div>

                  </div>

                </div>

              </div>

              <div>

                <div uk-scrollspy-class="" class="el-item uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" style="">

                  <a data-type="iframe" href="/www.cnn.com" class="el-link uk-position-cover uk-position-z-index uk-margin-remove-adjacent" data-caption="<h4 class='uk-margin-remove'>Register</h4><div>Register your literature or data repository, OA Journal, CRIS in OpenAIRE and be part of a global interlinked network.&nbsp;</div>"></a>

                  <div class="uk-card-media-top"><img src="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/register_bw_5-fb15ad7f.jpg" srcset="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/register_bw_5-f80c4720.jpg 579w,https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/register_bw_5-fb15ad7f.jpg 724w" sizes="(min-width: 724px) 724px, 100vw" class="el-image" alt="" width="724"></div>

                  <div class="uk-card-body">

                    <h3 class="el-title uk-margin uk-h2 uk-margin-remove-adjacent uk-margin-remove-bottom">

                      Register    </h3>

                    <div class="el-meta uk-margin uk-text-meta">Reach a wider audience around the world</div>

                    <div class="el-content uk-margin"><div>Register your literature or data repository, OA Journal, CRIS in OpenAIRE and be part of a global interlinked network.&nbsp;</div></div>

                  </div>

                </div>

              </div>

              <div>

                <div uk-scrollspy-class="" class="el-item uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" style="">

                  <a data-type="iframe" href="/www.cnn.com" class="el-link uk-position-cover uk-position-z-index uk-margin-remove-adjacent" data-caption="<h4 class='uk-margin-remove'>Enrich</h4>Our newly released OA Broker service offers a wealth of information on scholarly communication data.&nbsp;Find out what interests you and subscribe to enrich your records."></a>

                  <div class="uk-card-media-top"><img src="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/enrich_bw_3-1b487ba1.jpg" srcset="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/enrich_bw_3-32af51c0.jpg 640w,https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/enrich_bw_3-1b487ba1.jpg 800w" sizes="(min-width: 800px) 800px, 100vw" class="el-image" alt="" width="800"></div>

                  <div class="uk-card-body">

                    <h3 class="el-title uk-margin uk-h2 uk-margin-remove-adjacent uk-margin-remove-bottom">

                      Enrich    </h3>

                    <div class="el-meta uk-margin uk-text-meta">Improve your metadata.  Get more connections</div>

                    <div class="el-content uk-margin">Our newly released OA Broker service offers a wealth of information on scholarly communication data.&nbsp;Find out what interests you and subscribe to enrich your records.</div>

                  </div>

                </div>

              </div>

              <div>

                <div uk-scrollspy-class="" class="el-item uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" style="">

                  <a data-type="image" href="/images/Services/measure_bw_4.jpg" class="el-link uk-position-cover uk-position-z-index uk-margin-remove-adjacent" data-caption="<h4 class='uk-margin-remove'>Measure</h4>Participate in the Open Metrics service by sharing your usage data. Get the benefit of an aggregated environment to broaden the mechanisms for impact assesment.&nbsp;"></a>

                  <div class="uk-card-media-top"><img src="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/measure_bw_4-88ee2637.jpg" srcset="https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/measure_bw_4-0a65f376.jpg 640w,https://dl119.madgik.di.uoa.gr/templates/yootheme/cache/measure_bw_4-88ee2637.jpg 800w" sizes="(min-width: 800px) 800px, 100vw" class="el-image" alt="" width="800"></div>

                  <div class="uk-card-body">

                    <h3 class="el-title uk-margin uk-h2 uk-margin-remove-adjacent uk-margin-remove-bottom">

                      Measure    </h3>

                    <div class="el-meta uk-margin uk-text-meta">Open research impact empowers Open Science</div>

                    <div class="el-content uk-margin">Participate in the Open Metrics service by sharing your usage data. Get the benefit of an aggregated environment to broaden the mechanisms for impact assesment.&nbsp;</div>

                  </div>

                </div>

              </div>

            </div>

            <div class="uk-margin-medium uk-text-center uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" style="">

              <a class="el-content uk-button uk-button-secondary">

                Get Started

              </a>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

  <div class="uk-section-default uk-section">

    <div class="uk-container">

      <div class="uk-grid-medium uk-margin-medium uk-grid" uk-grid="">

        <div class="uk-width-expand@m uk-first-column">

          <div class="uk-margin uk-panel">

            <h3 class="el-title uk-margin uk-h3 uk-heading-bullet uk-text-primary">

              Our community    </h3>

            <div class="el-content uk-margin uk-text-lead">800 literature repositories<br>200 OA Journals<br>50 data repositories<br>4 aggregators</div>

          </div>

          <hr class="uk-divider-small uk-text-left">

          <div class="uk-margin">

            <div>22,3 mi publications<br>6,000 datasets<br>1000 software</div>

            <div>1,200,000 usage events (2017)<br>330,000 metadata exchange events (2017)&nbsp;&nbsp;</div></div>

        </div>

        <div class="uk-width-expand@m">

          <h3 class="uk-h3 uk-heading-bullet uk-text-primary">

            Latest additions    </h3>

          <div class="uk-margin-remove-vertical uk-grid-match uk-child-width-1-1 uk-child-width-1-1@m uk-child-width-1-1@l uk-child-width-1-1@xl uk-grid-small uk-grid-divider uk-grid uk-grid-stack" uk-grid="">

            <div class="uk-first-column">

              <div class="el-item uk-panel">

                <h6 class="el-title uk-margin uk-h6 uk-text-primary uk-margin-remove-adjacent uk-margin-remove-bottom">

                  Cambridge Server    </h6>

                <div class="el-meta uk-margin uk-text-meta">Cambridge Uviversity</div>

                <div class="el-content uk-margin"><span class="uk-label">IR</span>&nbsp;<span class=" uk-label uk-label-warning">Literature</span>&nbsp;<span class="uk-label uk-label-success" style="background-color: orange!important;">OpenAIRE 2.0</span><br> 4567 publications</div>

              </div>

            </div>

            <div class="uk-grid-margin uk-first-column">

              <div class="el-item uk-panel">

                <h6 class="el-title uk-margin uk-h6 uk-text-primary uk-margin-remove-adjacent uk-margin-remove-bottom">

                  Cambridge Server    </h6>

                <div class="el-meta uk-margin uk-text-meta">Cambridge Uviversity</div>

                <div class="el-content uk-margin"><span class="uk-label">IR</span>&nbsp;<span class=" uk-label uk-label-warning">Literature</span>&nbsp;<span class="uk-label uk-label-success" style="background-color: orange!important;">OpenAIRE 2.0</span><br> 4567 publications</div>

              </div>

            </div>

          </div>

          <div class="uk-margin">

            <a class="el-content uk-button uk-button-text">

              View all

            </a>

          </div>

        </div>

        <div class="uk-width-expand@m">

          <h3 class="uk-margin-remove-top uk-h3 uk-heading-bullet">

            <span class="uk-text-background">Our data policies</span>

          </h3>

          <ul class="uk-margin-small uk-list uk-list-large">

            <li class="el-item">

              <h3 class="el-title uk-h3 uk-margin-remove">Data acquisition</h3>

              <div class="el-content">

                <a href="/www.cnn.com">How we retrieve data, how often, what processes it goes through (aggregating cleaning, trasnforming, inferring, de-duplicating), what are the quality checks&nbsp;along all&nbsp; data processing stages.</a>

              </div>

            </li>

            <li class="el-item">

              <h3 class="el-title uk-h3 uk-margin-remove">Data usage</h3>

              <div class="el-content">

                <a href="/www.cnn.com">Who is able to retrieve our data, what are the licences, what about specific SLAs.</a>

              </div>

            </li>

          </ul>

          <div class="uk-margin uk-margin-remove-bottom uk-text-left">

            <a class="el-content uk-link-text" href="/www.cnn.com" target="_blank">

              Learn more

            </a>

          </div>

        </div>

      </div>

    </div>

  </div>

  <div class="uk-section-default" uk-scrollspy="{&quot;target&quot;:&quot;[uk-scrollspy-class]&quot;,&quot;cls&quot;:&quot;uk-animation-fade&quot;,&quot;delay&quot;:false}">

    <div style="background-image: url('../../../assets/imgs/provide_2.jpg');" class="uk-background-norepeat uk-background-cover uk-background-center-center uk-background-fixed 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">

          </div>

        </div>

        <div class="uk-grid-divider uk-margin-medium uk-grid" uk-grid="">

          <div class="uk-width-expand@m uk-width-1-2@s uk-dark uk-grid-item-match uk-first-column">

            <div id="page#37" class="uk-margin uk-text-center uk-panel uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

              <h4 class="el-title uk-margin uk-h4">

                A Researcher?    </h4>

              <div class="el-content uk-margin uk-text-lead">Explore all OA research results. Link all your research. Build your profile</div>

              <p><a href="/www.cnn.com" class="el-link uk-button uk-button-default uk-button-small">OpenAIRE.EXPLORE</a></p>

            </div>

          </div>

          <div class="uk-width-expand@m uk-width-1-2@s uk-dark uk-grid-item-match">

            <div id="page#39" class="uk-margin uk-text-center uk-panel uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

              <h4 class="el-title uk-margin uk-h4">

                A Research Administrator?    </h4>

              <div class="el-content uk-margin uk-text-lead">Use our monitoring services and easily track all relevant research results.</div>

              <p><a href="/www.cnn.com" class="el-link uk-button uk-button-default uk-button-small">OpenAIRE.MONITOR</a></p>

            </div>

          </div>

          <div class="uk-width-expand@m uk-width-1-2@s uk-dark uk-grid-item-match">

            <div id="page#41" class="uk-margin uk-text-center uk-panel uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

              <h4 class="el-title uk-margin uk-h4">

                A Research community?    </h4>

              <div class="el-content uk-margin uk-text-lead">Use a trusted partner to share, link, disseminate and monitor your research.</div>

              <p><a href="/www.cnn.com" class="el-link uk-button uk-button-default uk-button-small">OpenAIRE.CONNECT</a></p>

            </div>

          </div>

          <div class="uk-width-expand@m uk-width-1-2@s uk-dark uk-grid-item-match">

            <div id="page#43" class="uk-margin uk-text-center uk-panel uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

              <h4 class="el-title uk-margin uk-h4">

                A Developer?    </h4>

              <div class="el-content uk-margin uk-text-lead">Get access to OpenAIRE data and capitalize on on Europe's open linked research</div>

              <p><a href="/www.cnn.com" class="el-link uk-button uk-button-default uk-button-small">OpenAIRE.DEVELOP</a></p>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

</div>

<div *ngIf="getIsUserLoggedIn()" id="contentWrapper" class="tm-main uk-section uk-section-default" uk-height-viewport="expand: true" style="box-sizing: border-box;" >

  <div>

    <div class="uk-container">

      <div class="uk-grid uk-grid-stack">

        <div class="uk-width-expand@m">

          <div>

            <div class="gwt-HTML">

              <!-- MARGIN-TOP  -->

              <div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" aria-hidden="aria-hidden"></div>

              <div class="uk-width-1-1@m uk-first-column">

                <div class="uk-margin uk-grid-match uk-child-width-1-1 uk-child-width-1-2@m uk-grid-small uk-grid uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" uk-grid="" style="">

                  <div class="uk-first-column">

                    <div class="el-item uk-card uk-card-hover uk-card-body uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

                      <a class="el-link uk-position-cover uk-margin-remove-adjacent"  [routerLink]="['/sources','register']" uk-scroll=""></a>

                      <div class="uk-child-width-expand uk-flex-middle uk-grid" uk-grid="">

                        <div class="uk-width-1-2@m uk-first-column">

                          <img  class="el-image uk-border-rounded" src="./assets/imgs/iStock-153949408.jpg" >

                        </div>

                        <div>

                          <div>

                            <h3 class="el-title uk-margin uk-card-title">Register</h3>

                            <div class="el-content uk-margin">

                              Register data sources in the OpenAIRE infrastructure

                            </div>

                          </div>

                        </div>

                      </div>

                    </div>

                  </div>

                  <div>

                    <div class="el-item uk-card uk-card-hover uk-card-body uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

                      <a class="el-link uk-position-cover uk-margin-remove-adjacent" [routerLink]="['/compatibility','validate']" uk-scroll=""></a>

                      <div class="uk-child-width-expand uk-flex-middle uk-grid" uk-grid="">

                        <div class="uk-width-1-2@m uk-first-column">

                          <img  class="el-image uk-border-rounded" src="./assets/imgs/iStock-516286898.jpg" >

                        </div>

                        <div>

                          <div>

                            <h3 class="el-title uk-margin uk-card-title">Validate</h3>

                            <div class="el-content uk-margin">

                              Validate data sources against OpenAIRE guidelines

                            </div>

                          </div>

                        </div>

                      </div>

                    </div>

                  </div>

                  <div class="uk-grid-margin uk-first-column">

                    <div class="el-item uk-card uk-card-hover uk-card-body uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

                      <a class="el-link uk-position-cover uk-margin-remove-adjacent" [routerLink]="['/content','notifications']" uk-scroll=""></a>

                      <div class="uk-child-width-expand uk-flex-middle uk-grid" uk-grid="">

                        <div class="uk-width-1-2@m uk-first-column">

                          <img  class="el-image uk-border-rounded" src="./assets/imgs/iStock-466267165.jpg" >

                        </div>

                        <div>

                          <div>

                            <h3 class="el-title uk-margin uk-card-title">Notifications</h3>

                            <div class="el-content uk-margin">

                              View notifications to enrich the metadata and the content

                            </div>

                          </div>

                        </div>

                      </div>

                    </div>

                  </div>

                  <div class="uk-grid-margin">

                    <div class="el-item uk-card uk-card-hover uk-card-body uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" style="">

                      <a class="el-link uk-position-cover uk-margin-remove-adjacent" uk-scroll="" [routerLink]="['/getImpact']"></a>

                      <div class="uk-child-width-expand uk-flex-middle uk-grid" uk-grid="">

                        <div class="uk-width-1-2@m uk-first-column">

                          <img  class="el-image uk-border-rounded" src="./assets/imgs/iStock-659630328.jpg" >

                        </div>

                        <div>

                          <div>

                            <h3 class="el-title uk-margin uk-card-title">Metrics</h3>

                            <div class="el-content uk-margin">

                              View aggregated, cleaned usage statistics for repository access

                            </div>

                          </div>

                        </div>

                      </div>

                    </div>

                  </div>

                </div>

              </div>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

</div>

import { Component, OnInit } from '@angular/core';

import { AuthenticationService } from '../../services/authentication.service';

@Component ({

  selector: 'app-home',

  templateUrl: 'home.component.html'

})

export class HomeComponent implements OnInit {

  constructor(private authService: AuthenticationService) { }

  ngOnInit() {}

  login() {

    this.authService.loginWithState();

  }

  getIsUserLoggedIn() {

    return this.authService.getIsUserLoggedIn();

  }

}

/**

 * Created by stefanos on 15/5/2017.

 */

import { FormGroup } from "@angular/forms";

import { Component, ComponentFactoryResolver, Injector, Input, Type, ViewChild, ViewContainerRef } from "@angular/core";

import { MyFormDirective } from "./my-form.directive";

import { MyGroup } from "./my-group.interface";

import { MyWrapper } from "./my-wrapper.interface";

import { Subject } from "rxjs/Subject";

import { Description } from '../../../domain/oa-description';

@Component({

  selector : 'form-choice',

  template : `

<form-inline [description]="{label : 'Choose'}" [params]="null">

    <div class="uk-margin uk-grid-small uk-child-width-auto">

        <label *ngFor="let radio of radioButton">

            <input type="radio" name="{{uniqueId}}" class="uk-radio" [checked]="radio === radioButtonSelected"

            (click)="changeType(radio)">

            {{radio}}

        </label>

    </div>

</form-inline>

<div [formGroup]="parentGroup">

    <ng-template my-form></ng-template>

</div>

`,

  styleUrls : ['']

})

export class MyChoice extends MyGroup {

  @Input() public components : MyChoiceComponents[];

  wrapper : Type<MyWrapper> = MyChoiceWrapper;

  @ViewChild(MyFormDirective) protected formComponents: MyFormDirective;

  protected _cfr : ComponentFactoryResolver;

  protected viewContainerRef : ViewContainerRef;

  arrayData_ : Subject<any>[] = [];

  wrapperViews : {[key : string] : MyChoiceWrapper} = {};

  radioButton : string[] = [];

  radioButtonSelected : string;

  registerGroup_ : FormGroup;

  uniqueId : string = Math.random().toString(36).substring(2);

  constructor(injector : Injector) {

    super(injector);

    this._cfr = injector.get(ComponentFactoryResolver);

  }

  protected createView(component : MyChoiceComponents,index : number) : void {

    console.log(component);

    let componentFactory = this._cfr.resolveComponentFactory(component.component);

    let wrapperFactory = this._cfr.resolveComponentFactory(this.wrapper);

    let wrapperView = wrapperFactory.create(this.viewContainerRef.injector);

    let componentView = componentFactory.create(this.viewContainerRef.injector);

    (<MyGroup>componentView.instance).index = this.viewContainerRef.length;

    (<MyGroup>componentView.instance).required = this.required;

    (<MyGroup>componentView.instance).data = this.data;

    this.arrayData_.push((<MyGroup>componentView.instance).patchData);

    (<MyGroup>componentView.instance).description = component.description;

    let arrayGroup = (<MyGroup>componentView.instance).generate();

    (<MyGroup>componentView.instance).parentGroup = arrayGroup as FormGroup;

    (<MyChoiceWrapper>wrapperView.instance).component = componentView.hostView;

    (<MyChoiceWrapper>wrapperView.instance).viewRef = wrapperView.hostView;

    (<MyChoiceWrapper>wrapperView.instance).description = this.description;

    (<MyChoiceWrapper>wrapperView.instance).hidden = (index != 0);

    (<MyChoiceWrapper>wrapperView.instance).first = this.viewContainerRef.length == 0;

    let registerGroup : FormGroup = this.parentGroup as FormGroup;

    if(this.name) {

      registerGroup = this.parentGroup.get(this.name as string) as FormGroup;

    }

    this.registerGroup_.registerControl(component.name, arrayGroup);

    if(index != 0) {

      setTimeout(() => {

        console.log(component);

        registerGroup.get(component.name).disable();

      },500)

    }

    // (<FormArray>this.parentGroup.controls[this.name]).push(arrayGroup);

    this.wrapperViews[component.name] = wrapperView.instance as MyChoiceWrapper;

    this.viewContainerRef.insert(wrapperView.hostView);

  }

  ngOnInit(): void {

    // super.ngOnInit();

    this.components.forEach(c => this.radioButton.push(c.description.label));

    this.radioButtonSelected = this.radioButton[0];

    this.viewContainerRef = this.formComponents.viewContainerRef;

    //if there is no name, register with the children's control

    if(this.name) {

      (<FormGroup>this.parentGroup).addControl(this.name as string, this._fb.group({}));

      this.registerGroup_ = this.parentGroup.get(this.name as string) as FormGroup;

    } else {

      this.registerGroup_ = this.parentGroup as FormGroup;

    }

    this.components.forEach((item,index) => {

      this.createView(item,index);

    });

    this.registerGroup_.patchValue = this.patchValue();

  }

  changeType(radio : string) {

    let newSelected : string  = this.components[this.radioButton.indexOf(radio)].name;

    let currentSelected : string  = this.components[this.radioButton.indexOf(this.radioButtonSelected)].name;

    (this.registerGroup_.get(currentSelected) as FormGroup).disable();

    (this.registerGroup_.get(newSelected) as FormGroup).enable();

    this.wrapperViews[currentSelected].hidden = true;

    this.wrapperViews[newSelected].hidden = false;

    this.radioButtonSelected = radio;

  }

  protected patchValue() {

    let self = this;

    return (value: {[key: string]: any}, {onlySelf, emitEvent}: {onlySelf?: boolean, emitEvent?: boolean} = {}) => {

      Object.keys(value).forEach(v => {

        if (v != null) {

          let component = self.components.find(component => component.name == v);

          self.changeType(component.description.label);

          self.registerGroup_.get(v).patchValue(value[v]);

          console.log(value[v]);

        }

      });

    };

  }

}

@Component({

  selector : 'form-choice-wrapper',

  template : `

<div class="uk-grid uk-margin" [hidden]="hidden">

    <div class="uk-width-5-6">

        <ng-template my-form></ng-template>

    </div>

</div>

`,

  styleUrls : ['']

})

export class MyChoiceWrapper extends MyWrapper {

  @Input()

  public hidden = false;

}

export class MyChoiceComponents {

  public component : Type<MyGroup>;

  public name : string;

  public description : Description;

  constructor(name : string , component : Type<MyGroup>,description : Description) {

    this.component = component;

    this.name = name;

    this.description = description;

  }

}

<!--    <help-content #topHelperContent [position]="'top'"

    </help-content>-->

<!--        <aside-help-content #leftHelperContent [position]="'left'"

        </aside-help-content>-->

<!--        <aside-help-content #rightHelperContent [position]="'right'"

        </aside-help-content>-->

<!--   *** OLD HTML ***

<div class="uk-grid uk-grid-stack">

  <div class="uk-width-expand@m uk-first-column">

    <div class="uk-margin-medium-bottom">

      <h1 class="uk-article-title">Metrics Admin</h1>

    </div>

    <div class="">

      <div class="uk-width-1-1@m uk-first-column uk-margin-medium-bottom">

        <div class="uk-overflow-auto uk-scrollspy-inview uk-animation-slide-top-medium">

          <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>

          <div *ngIf="loadingMessage" class="loading-big">

            <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">

              {{ loadingMessage }}

            </div>

            <div class="whiteFilm"></div>

          </div>

          <div>

            <table class="uk-table uk-table-striped uk-table-middle" style="font-size: 12px">

              <thead>

                <tr>

                  <th class="uk-text-nowrap">Repository</th>

                  <th class="uk-text-nowrap">Piwik site</th>

                  <th class="uk-text-nowrap">Requested on</th>

                  <th class="uk-text-nowrap">Requestor</th>

                  <th class="uk-text-nowrap">Validated</th>

                  <th class="uk-text-nowrap">Actions</th>

                </tr>

              </thead>

              <tbody>

                <tr class="el-item" *ngFor="let piwik of piwiks">

                  <td class="uk-table-shrink">{{ piwik.repositoryName }}<br>(ID: {{ piwik.repositoryId }})</td>

                  <td class="uk-table-shrink">ID: {{ piwik.siteId }}<br>Authentication Token: {{ piwik.authenticationToken }}</td>

                  <td class="uk-text-nowrap uk-table-shrink">{{ piwik.creationDate | date : "yyyy-mm-dd" }}</td>

                  <td class="uk-text-nowrap uk-table-shrink">{{ piwik.requestorName }}<br>{{ piwik.requestorEmail }}</td>

                  <td class="uk-text-nowrap uk-table-shrink">

                    <span *ngIf="piwik.validated">YES<br>on {{ piwik.validationDate | date : "yyyy-mm-dd" }}</span>

                    <span *ngIf="!piwik.validated">NO</span>

                  </td>

                  <td class="uk-text-nowrap uk-table-shrink">

                    <button id="{{ piwik.repositoryId }}" *ngIf="!piwik.validated" class="uk-button uk-button-primary validate" (click)="confirmApproval(piwik.repositoryId)">Validate</button>

                  </td>

                </tr>

              </tbody>

            </table>

          </div>

        </div>

      </div>

    </div>

  </div>

</div>

-->

<!--    <help-content #topHelperContent [position]="'top'"

    </help-content>-->

<!--        <aside-help-content #leftHelperContent [position]="'left'"

        </aside-help-content>-->

<!--  *** OLD HTML ***

<div class="uk-grid uk-grid-stack">

  <div class="uk-width-expand@m uk-first-column">

    <div class="uk-margin-medium-bottom">

      <h1 class="uk-article-title">Register your datasource</h1>

    </div>

    <div class="wizard">

      <div class="wizardBreadcrumbs">

        <div class="steps clearfix">

          <div class="step active">

            <div>

              Enter Information

              <span></span>

            </div>

          </div>

          <div class="step {{step2}}">

            <div>

              Add Interfaces

              <span></span>

            </div>

          </div>

          <div class="step {{step3}}">

            <div>

              Finish

              <span></span>

            </div>

          </div>

        </div>

      </div>

      <div class="content">

        <div>

          <div class="animated fadeInRight stepContent">

            <div>

              <datasource-create-form *ngIf="showForm"

                                 #registerJournal

                                 (emittedInfo)="getCurrentRepo($event)"></datasource-create-form>

              <div *ngIf="showInterfaces">

                <form *ngIf="repo" [formGroup]="group">

                  <form-repeat [component]="addDatasourceInterfaces"

                               [parentGroup]="group"

                               [description]="interfaceFormDesc"

                               [name]="'repository-interfaces'"

                               [otherData]="repo">

                  </form-repeat>

                </form>

              </div>

              <div *ngIf="showFinish" class="row openAIRECompliantLogoDownload">

                <div class="col-lg-12">

                  <div class="col-md-12">

                    <div class="gwt-HTML">

                      <div class="openAIRECompliantLogo">

                        <h2 class="openAIRECompliantLogoMessage">

                          Congratulations! Your repository was successfully registered in OpenAIRE. You can download this logo to use in your site.

                        </h2>

                        <img src="assets/imgs/3_0ValidatedLogo.png" alt="OpenAireCompliant">

                      </div>

                    </div>

                    <a>

                      Download

                      <i class="fa fa-download" style=""></i>

                    </a>

                  </div>

                </div>

              </div>

            </div>

          </div>

        </div>

      </div>

      <div class="wizardActions">

        <button *ngIf="!showForm" class="uk-button uk-button-grey-light" type="button" (click)="moveBackAStep()">

          <i class="fa fa-angle-double-left"></i>

          Back

        </button>

        <button *ngIf="!showFinish" class="uk-button uk-button-grey-light" type="button" (click)="moveAStep()">

          Next

          <i class="fa fa-angle-double-right"></i>

        </button>

      </div>

    </div>

  </div>

  <div class="tm-sidebar uk-width-1-4@m">

    <div>

      <div class="uk-card uk-card-body uk-card-default sidemenu">

        <h3 class="el-title uk-h3 uk-heading-bullet">Info</h3>

        <p class="small">

          Use the form on the right to add your repository or journal in OpenAIRE. If you want to find more information about this process

          <!– TARGET FILE MISSING! jsps/manuals/user-manual.pdf –>

          <a target="_blank" href="#">click here</a>

          .

        </p>

        <div class="uk-alert uk-alert-default small">

          The official repository/journal administrator (his/her email address being retrieved from the OAI-PMH verb

          <b>Identify</b>

          ) will be contacted and informed about registration request. So please make sure that you are either this person or have access to the email address, or that you have notified them.

        </div>

        <p class="small">

          For any problems or questions please contact the

          <a class="external" target="_blank" href="https://www.openaire.eu/support/helpdesk" >

            OpenAIRE helpdesk

          </a>

          .

        </p>

      </div>

    </div>

  </div>

</div>

-->

                  <input [(ngModel)]="searchBox" id="search" class="form-control" type="text" [disabled]="(!hasSelectedCountry)" />

              <button *ngIf="!showRepositories" class="uk-button uk-button-grey-light" type="button" (click)="moveBackAStep()">

<!--   *** OLD HTML ***

<div class="uk-grid uk-grid-stack">

  <div class="uk-width-expand@m uk-first-column">

    <div class="uk-margin-medium-bottom">

      <h1 class="uk-article-title">Register your datasource</h1>

    </div>

    <div class="wizard">

      <div class="wizardBreadcrumbs">

        <div class="steps clearfix">

          <div class="step active">

            <div>

              Enter Information

              <span></span>

            </div>

          </div>

          <div class="step {{ step2 }}">

            <div>

              Add Interfaces

              <span></span>

            </div>

          </div>

          <div class="step {{ step3 }}">

            <div>

              Finish

              <span></span>

            </div>

          </div>

        </div>

      </div>

      <div class="content">

        <div>

          <div class="animated fadeInRight stepContent">

            <div>

              <datasource-create-form *ngIf="showForm"

                                    #registerAggregator

                                    (emittedInfo)="getCurrentRepo($event)"></datasource-create-form>

              <div *ngIf="showInterfaces && repo">

                <form [formGroup]="group">

                  <form-repeat [component]="addDatasourceInterfaces"

                               [parentGroup]="group"

                               [description]="interfaceFormDesc"

                               [name]="'repository-interfaces'"

                               [otherData]="repo">

                  </form-repeat>

                </form>

              </div>

              <div *ngIf="showFinish" class="row openAIRECompliantLogoDownload">

                <div class="col-lg-12">

                  <div class="col-md-12">

                    <div class="gwt-HTML">

                      <div class="openAIRECompliantLogo">

                        <h2 class="openAIRECompliantLogoMessage">

                          Congratulations! Your repository was successfully registered in OpenAIRE. You can download this logo to use in your site.

                        </h2>

                        <img src="assets/imgs/3_0ValidatedLogo.png" alt="OpenAireCompliant">

                      </div>

                    </div>

                    <a>

                      Download

                      <i class="fa fa-download" style=""></i>

                    </a>

                  </div>

                </div>

              </div>

            </div>

          </div>

        </div>

      </div>

      <div class="wizardActions">

        <button *ngIf="!showRepositories" class="uk-button uk-button-grey-light" type="button" (click)="moveBackAStep()">

          <i class="fa fa-angle-double-left"></i>

          Back

        </button>

        <button *ngIf="!showFinish" class="uk-button uk-button-grey-light" type="button" (click)="moveAStep()">

          Next

          <i class="fa fa-angle-double-right"></i>

        </button>

      </div>

    </div>

  </div>

  <div class="tm-sidebar uk-width-1-4@m">

    <div>

      <div class="uk-card uk-card-body uk-card-default sidemenu">

        <h3 class="el-title uk-h3 uk-heading-bullet">Info</h3>

        <p class="small">

          Use the form on the right to add your repository or journal in OpenAIRE. If you want to find more information about this process

          <!– TARGET FILE MISSING! jsps/manuals/user-manual.pdf –>

          <a target="_blank" href="#">click here</a>

          .

        </p>

        <div class="uk-alert uk-alert-default small">

          The official repository/journal administrator (his/her email address being retrieved from the OAI-PMH verb

          <b>Identify</b>

          ) will be contacted and informed about registration request. So please make sure that you are either this person or have access to the email address, or that you have notified them.

        </div>

        <p class="small">

          For any problems or questions please contact the

          <a class="external" target="_blank" href="https://www.openaire.eu/support/helpdesk" >

            OpenAIRE helpdesk

          </a>

          .

        </p>

      </div>

    </div>

  </div>

</div>

-->

  <div *ngIf="showButton" class="form-group">

    <button class="uk-button uk-button-primary updateRepoInfoButton" type="button" (click)="registerDatasource()">Update Information</button>

  </div>

    this.authService.redirectUrl = "/home";

  updatedLogoUrl() {

  confirmedEnabling() {

<!--        <help-content #topHelperContent [position]="'top'"

        </help-content>-->

<!--            <aside-help-content #leftHelperContent [position]="'left'"

            </aside-help-content>-->

<!--   *** OLD HTML ***

<div id="contentWrapper"

     class="tm-main uk-section uk-section-default"

     uk-height-viewport="expand: true"

     style="box-sizing: border-box;" >

  <!– MARGIN-TOP  –>

  <div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" aria-hidden="true"></div>

  <div>

    <div class="uk-container">

      <div class="uk-grid uk-grid-stack">

        <div class="uk-width-expand@m uk-first-column">

          <div class="gwt-HTML uk-margin-medium-bottom">

            <h1 class="uk-article-title">Metrics</h1>

          </div>

          <div>

            <div *ngIf="successMessage" class="uk-alert uk-alert-success">{{ successMessage }}</div>

            <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>

            <div *ngIf="loadingMessage" class="loading-big">

              <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">

                {{ loadingMessage }}

              </div>

              <div class="whiteFilm"></div>

            </div>

            <div *ngIf="repo">

              <div class="gwt-HTML">

                <h4>You don't have metrics enabled for this repository yet. Would you like to enable them?</h4>

                <p><img src="assets/imgs/metricsWorkflow-new.svg"

                    style="display:block; margin: 0 auto;"

                    width="50%"></p>

                <p>Once you select to enable metrics for your repository, the following steps need to be performed:</p>

                <p><i>On your side</i><br>

                          1. Download the tracking code for your repository platform<br>

                          2. Configure the tracking code according to the instructions<br>

                          3. Deploy the tracking code in your repository platform

                </p>

                <p><i>On the OpenAIRE's side</i><br>

                      4. Validate the installation of the tracking code and inform the repository manager accordingly<br>

                </p>

                <div class="uk-alert uk-alert-info">

                  For more details about the workflows and tools please consult the

                  <a target="_blank" href="http://beta.repomanager.openaire.eu/pdf/OpenAIRE_usage_stats_Guidelinesv1.pdf">

                    “Guidelines for Collecting Usage Events and Provision of Usage Statistics”

                  </a>

                  .

                </div>

                <button class="uk-button uk-button-primary" (click)="confirmEnabling()">Enable Metrics</button>

              </div>

            </div>

          </div>

        </div>

        <div class="tm-sidebar uk-width-1-4@m">

          <div class="gwt-HTML">

            <div class="uk-card uk-card-body uk-card-default sidemenu">

              <h3>Info</h3>

              <p>

                This page provides you with information about views and downloads of items in your datasource.

              </p>

              <p>

                The indicators are:

              </p>

              <ul>

                <li>

                  <strong>views</strong>

                  of your datasource items

                  <strong> in the OpenAIRE portal</strong>

                </li>

                <li>

                  <strong>views of items</strong>

                  tracked from your datasource

                </li>

                <li>

                  <strong>number of downloads</strong>

                  tracked from your datasource

                </li>

              </ul>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

</div>

-->

<!--    <help-content #topHelperContent [position]="'top'"

    </help-content>-->

<!--        <aside-help-content #leftHelperContent [position]="'left'"

        </aside-help-content>-->

<div class="uk-grid uk-grid-stack">

  <div class="uk-width-expand@m uk-first-column">

    <div class="uk-margin-medium-bottom">

      <h1 class="uk-article-title">Validate your datasource</h1>

    </div>

    <div>

      <div class="uk-margin uk-grid repositoryTypeSelection">

        <div class="uk-width-expand@m uk-width-1-3@s uk-grid-item-match uk-first-column">

          <div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" data-id="" style="">

            <a class="uk-position-cover uk-margin-remove-adjacent" [routerLink]="['literature']"></a>

            <div class="uk-card-media-top">

              <img src="assets/imgs/Literature_repos_wide.png" alt="" style="width:100%;">

            </div>

            <div class="uk-card-body">

              <h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom">

                Run compatibility test against the OpenAIRE literature guidelines.

              </h3>

            </div>

          </div>

        </div>

        <div class="uk-width-expand@m uk-width-1-3@s uk-grid-item-match uk-first-column">

          <div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" data-id="" style="">

            <a class="el-link uk-position-cover uk-margin-remove-adjacent" [routerLink]="['data']"></a>

            <div class="uk-card-media-top">

              <img class="el-image" src="assets/imgs/Data_repos_wide.png" alt="" style="width:100%;">

            </div>

            <div class="uk-card-body">

              <h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom">

                Run compatibility test against the OpenAIRE Guidelines for Data Archives.

              </h3>

            </div>

          </div>

        </div>

        <div class="uk-width-expand@m uk-width-1-3@s uk-grid-item-match uk-first-column">

          <div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium" uk-scrollspy-class="" data-id="" style="">

            <a class="el-link uk-position-cover uk-margin-remove-adjacent" [routerLink]="['cris']"></a>

            <div class="uk-card-media-top">

              <img class="el-image" src="assets/imgs/CRIS_wide.png" alt="" style="width:100%;">

            </div>

            <div class="uk-card-body">

              <h3 class="el-title uk-margin uk-card-title uk-margin-remove-adjacent uk-margin-small-bottom">

                Run compatibility test against the OpenAIRE Guidelines for CRIS Managers based on CERIF-XML.

              </h3>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

</div>

        <aside-help-content #rightHelperContent [position]="'right'"

        </aside-help-content>

      <div *ngIf="tilesView && reposOfUser.length" class="uk-grid-large uk-grid-margin-large uk-grid repos-grid">

        <div *ngFor="let repo of reposOfUser" class="uk-width-expand@m uk-first-column uk-margin-bottom" style="min-width: 300px;">

              <div>

                <a class="el-link" [routerLink]="[getLinkToNext(repo)]">

                      <div class="uk-width-1-3@m uk-first-column" style="width: 80px;">

      <div *ngIf="!tilesView && reposOfUser.length" class="uk-grid-large uk-grid-margin-large uk-grid repos-list">

export const appBaseUrl = 'http://194.177.192.121:3000';

import {HomeComponent} from './pages/home/home.component';

    redirectTo: '/home',

    path: 'home',

    component: HomeComponent

          API_ENDPOINT: JSON.stringify(process.env.API_ENDPOINT || "http://194.177.192.121:8380/uoa-repository-manager-service"),

          FAQ_ENDPOINT: JSON.stringify(process.env.FAQ_ENDPOINT || "http://83.212.101.85:5555/api/"),

          CONNECTOR_API_ENDPOINT: JSON.stringify(process.env.CONNECTOR_API_ENDPOINT || "http://localhost:8888/content-connector-service"),

          WORKFLOW_API_ENDPOINT: JSON.stringify(process.env.WORKFLOW_API_ENDPOINT || "https://dev.openminted.eu:8881"),

          OIDC_ENDPOINT: JSON.stringify(process.env.OIDC_ENDPOINT || "http://localhost:8080/omtd-registry/openid_connect_login"),

          AAI_ENDPOINT: JSON.stringify(process.env.AAI_ENDPOINT || "https://aai.openminted.eu/oidc")

          API_ENDPOINT: JSON.stringify("/api"),

          FAQ_ENDPOINT: JSON.stringify("/faq"),

          CONNECTOR_API_ENDPOINT: JSON.stringify("/connector"),

          WORKFLOW_API_ENDPOINT: JSON.stringify("/workflow"),

          OIDC_ENDPOINT: JSON.stringify("/api/openid_connect_login"),

          AAI_ENDPOINT: JSON.stringify("https://aai.openminted.eu/oidc")

            <div *ngIf="!noEvents && !loadingMessage && !errorMessage && eventsPage && eventsPage.totalPages" class="events-results">

                  <div formArrayName="eventTitles" *ngFor="let title of group.controls.eventTitles.controls; let title_index = index">

                  <div formArrayName="eventAuthors" *ngFor="let author of group.controls.eventAuthors.controls; let author_index = index">

                  <div formArrayName="eventSubjects" *ngFor="let subject of group.controls.eventSubjects.controls; let subject_index = index">

                    <div formArrayName="eventDateRanges" *ngFor="let date of group.controls.eventDateRanges.controls; let date_index = index">

<!--   *** OLD HTML ***

<div class="uk-grid uk-grid-stack">

  <div class="uk-width-expand@m uk-first-column">

    <div class="uk-margin-medium-bottom">

      <h1 class="uk-article-title">{{ repoName }}</h1>

      <div class="uk-text uk-text-small uk-text-secondary">{{ topic }}</div>

    </div>

    <div>

      <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{errorMessage}}</div>

      <div *ngIf="successMessage" class="uk-alert uk-alert-success">{{successMessage}}</div>

      <div *ngIf="loadingMessage" class="loading-big">

        <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">{{ loadingMessage }}</div>

        <div class="whiteFilm"></div>

      </div>

      <div *ngIf="noEvents" class="uk-alert">{{ noEvents }}</div>

      <div *ngIf="eventsPage && eventsPage.totalPages" class="events-results">

        <div class="numberOfEventsLabel">

          <span>Showing {{(eventsPage.currPage*10)+1 }}-{{ ( (eventsPage.total < 10) || (eventsPage.total < (eventsPage.currPage+1)*10) ) ? (eventsPage.total) : (eventsPage.currPage+1)*10 }} of {{ eventsPage.total }} results</span>

          <span class="uk-float-right">

            <button id="subscribe" type="button" class="uk-button uk-button-primary uk-button-small" (click)="showSubscriptionModal()">Subscribe to these events</button>

          </span>

        </div>

        <div>

          <ul class="uk-pagination">

            <li>

              <a class="uk-link uk-link-muted" (click)="goToPreviousPage()">

                <span class="uk-margin-small-right uk-pagination-previous uk-icon" uk-pagination-previous="">

                  <svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg" icon="pagination-previous" ratio="1"></svg>

                </span>

                Previous

              </a>

            </li>

            <li class="uk-margin-auto-left">