D-Net

<!--        <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 *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="repoMetrics">

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

              <div>

                <div class="uk-child-width-1-3@m uk-grid-small uk-grid-match uk-grid" uk-grid="">

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

                    <div class="uk-tile uk-tile-default uk-padding-small">

                      <div class="uk-text-center">   {{ pageViews }}</div>

                      <div class="uk-text-center"> views in OpenAIRE</div>

                    </div>

                  </div>

                  <div class="metrics-views">

                    <div class="uk-tile uk-tile-muted uk-padding-small">

                      <div class="uk-text-center">  {{ totalViews }}

                        <span *ngIf="repoMetrics.metricsNumbers.total_openaire_views">( {{ repoMetrics.metricsNumbers.total_openaire_views }} from OpenAIRE )</span>

                      </div>

                      <div class="uk-text-center">views in local repository</div>

                    </div>

                  </div>

                  <div class="metrics-downloads">

                    <div class="uk-tile uk-tile-primary uk-padding-small">

                      <div class="uk-text-center">  {{ totalDownloads }}

                        <span *ngIf="repoMetrics.metricsNumbers.total_openaire_downloads">( {{ repoMetrics.metricsNumbers.total_openaire_downloads }} from OpenAIRE )</span></div>

                      <div class="uk-text-center">downloads in local repository</div>

                    </div>

                  </div>

                </div>

              </div>

            </div>

            <div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium uk-margin-bottom uk-padding">

              <iframe class="statsFrame" [src]="viewsUrl"></iframe>

            </div>

            <div class="uk-text-center uk-card uk-card-default uk-card-hover uk-scrollspy-inview uk-animation-slide-top-medium uk-margin-bottom uk-padding">

              <iframe class="statsFrame" [src]="downloadsUrl"></iframe>

            </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>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>

-->