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

    
93

    
94
<!--  *** OLD HTML ***
95

    
96
<div id="contentWrapper"
97
     class="tm-main uk-section uk-section-default"
98
     uk-height-viewport="expand: true"
99
     style="box-sizing: border-box;" >
100

    
101
  &lt;!&ndash; MARGIN-TOP  &ndash;&gt;
102
  <div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" aria-hidden="true"></div>
103

    
104
  <div>
105
    <div class="uk-container">
106
      <div class="uk-grid uk-grid-stack">
107
        <div class="uk-width-expand@m uk-first-column">
108
          <div class="gwt-HTML uk-margin-medium-bottom">
109
            <h1 class="uk-article-title">Metrics</h1>
110
          </div>
111
          <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>
112
          <div *ngIf="loadingMessage" class="loading-big">
113
            <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">
114
              {{ loadingMessage }}
115
            </div>
116
            <div class="whiteFilm"></div>
117
          </div>
118
          <div *ngIf="repoMetrics">
119
            <div class="uk-margin-medium-bottom">
120
              <div>
121
                <div class="uk-child-width-1-3@m uk-grid-small uk-grid-match uk-grid" uk-grid="">
122
                  <div class="metrics-openaire uk-first-column">
123
                    <div class="uk-tile uk-tile-default uk-padding-small">
124
                      <div class="uk-text-center">   {{ pageViews }}</div>
125
                      <div class="uk-text-center"> views in OpenAIRE</div>
126
                    </div>
127
                  </div>
128
                  <div class="metrics-views">
129
                    <div class="uk-tile uk-tile-muted uk-padding-small">
130
                      <div class="uk-text-center">  {{ totalViews }}
131
                        <span *ngIf="repoMetrics.metricsNumbers.total_openaire_views">( {{ repoMetrics.metricsNumbers.total_openaire_views }} from OpenAIRE )</span>
132
                      </div>
133
                      <div class="uk-text-center">views in local repository</div>
134
                    </div>
135
                  </div>
136
                  <div class="metrics-downloads">
137
                    <div class="uk-tile uk-tile-primary uk-padding-small">
138
                      <div class="uk-text-center">  {{ totalDownloads }}
139
                        <span *ngIf="repoMetrics.metricsNumbers.total_openaire_downloads">( {{ repoMetrics.metricsNumbers.total_openaire_downloads }} from OpenAIRE )</span></div>
140
                      <div class="uk-text-center">downloads in local repository</div>
141
                    </div>
142
                  </div>
143
                </div>
144
              </div>
145
            </div>
146
            <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">
147
              <iframe class="statsFrame" [src]="viewsUrl"></iframe>
148
            </div>
149
            <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">
150
              <iframe class="statsFrame" [src]="downloadsUrl"></iframe>
151
            </div>
152
          </div>
153
        </div>
154
        <div class="tm-sidebar uk-width-1-4@m">
155
          <div>
156
            <div class="uk-card uk-card-body uk-card-default sidemenu">
157
              <h3>Info</h3>
158
              <p>This page provides you with information about views and downloads of items in your datasource.</p>
159
              <p>The indicators are:</p>
160
              <ul>
161
                <li>
162
                  <strong>views</strong>
163
                  of your datasource items
164
                  <strong> in the OpenAIRE portal</strong>
165
                </li>
166
                <li>
167
                  <strong>views of items</strong>
168
                  tracked from your datasource
169
                </li>
170
                <li>
171
                  <strong>number of downloads</strong>
172
                  tracked from your datasource
173
                </li>
174
              </ul>
175
            </div>
176
          </div>
177
        </div>
178
      </div>
179
    </div>
180
  </div>
181
</div>
182
-->
(5-5/10)