Project

General

Profile

1
<div class="uk-section-default uk-section uk-section-small uk-padding-remove-bottom" style="min-height: 325px">
2

    
3
  <!-- MARGIN-TOP  -->
4
  <div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" aria-hidden="true"></div>
5
  <div class="uk-container">
6

    
7
    <div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
8
      <div class="uk-width-1-1@m uk-first-column">
9

    
10
        <h1 class="uk-h2">Metrics</h1>
11

    
12
        <!-- TOP HELP CONTENT -->
13
        <help-content #topHelperContent [position]="'top'"
14
                      [ngClass]="topHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
15
        </help-content>
16

    
17
        <div class="uk-container uk-margin-medium-top uk-margin-medium-bottom">
18
          <div class="uk-grid">
19

    
20
            <!-- LEFT HELP CONTENT -->
21
            <aside-help-content #leftHelperContent [position]="'left'"
22
                                [ngClass]="leftHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
23
            </aside-help-content>
24

    
25
            <!-- MIDDLE -->
26
            <div class=" uk-width-expand@m">
27

    
28
              <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>
29
              <div *ngIf="loadingMessage" class="loading-big">
30
                <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">
31
                  {{ loadingMessage }}
32
                </div>
33
                <div class="whiteFilm"></div>
34
              </div>
35
              <div *ngIf="repoMetrics">
36
                <div class="uk-margin-medium-bottom">
37
                  <div>
38
                    <div class="uk-child-width-1-3@m uk-grid-small uk-grid-match uk-grid" uk-grid="">
39
                      <div class="metrics-openaire uk-first-column">
40
                        <div class="uk-tile uk-tile-default uk-padding-small">
41
                          <div class="uk-text-center">   {{ pageViews }}</div>
42
                          <div class="uk-text-center"> views in OpenAIRE</div>
43
                        </div>
44
                      </div>
45
                      <div class="metrics-views">
46
                        <div class="uk-tile uk-tile-muted uk-padding-small">
47
                          <div class="uk-text-center">  {{ totalViews }}
48
                            <span *ngIf="repoMetrics.metricsNumbers.total_openaire_views">( {{ repoMetrics.metricsNumbers.total_openaire_views }} from OpenAIRE )</span>
49
                          </div>
50
                          <div class="uk-text-center">views in local repository</div>
51
                        </div>
52
                      </div>
53
                      <div class="metrics-downloads">
54
                        <div class="uk-tile uk-tile-primary uk-padding-small">
55
                          <div class="uk-text-center">  {{ totalDownloads }}
56
                            <span *ngIf="repoMetrics.metricsNumbers.total_openaire_downloads">( {{ repoMetrics.metricsNumbers.total_openaire_downloads }} from OpenAIRE )</span></div>
57
                          <div class="uk-text-center">downloads in local repository</div>
58
                        </div>
59
                      </div>
60
                    </div>
61
                  </div>
62
                </div>
63
                <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">
64
                  <iframe class="statsFrame" [src]="viewsUrl"></iframe>
65
                </div>
66
                <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">
67
                  <iframe class="statsFrame" [src]="downloadsUrl"></iframe>
68
                </div>
69
              </div>
70

    
71
            </div>
72

    
73
            <!-- RIGHT HELP CONTENT -->
74
            <aside-help-content #rightHelperContent [position]="'right'"
75
                                [ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
76
            </aside-help-content>
77

    
78
          </div>
79
        </div>
80

    
81

    
82
        <!-- BOTTOM HELP CONTENT -->
83
        <help-content #bottomHelperContent [position]="'bottom'"
84
                      [ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
85
        </help-content>
86

    
87

    
88
      </div>
89
    </div>
90
  </div>
91
</div>
92

    
(5-5/10)