Project

General

Profile

1
<div id="page_content_inner" class="uk-margin-medium-left uk-margin-medium-right uk-margin-top">
2
  <h2 class="heading_b uk-margin-bottom">Enrich Your Content - Browse Events</h2>
3

    
4
  <!-- TOP HELP CONTENT -->
5
  <help-content #topHelperContent [position]="'top'"
6
                [ngClass]="topHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
7
  </help-content>
8

    
9
  <div class="uk-grid">
10

    
11
    <!-- LEFT HELP CONTENT -->
12
    <aside-help-content #leftHelperContent [position]="'left'"
13
                        [ngClass]="leftHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
14
    </aside-help-content>
15

    
16
    <!-- MIDDLE -->
17
    <div class=" uk-width-expand@m">
18

    
19
      <div>
20
        <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{errorMessage}}</div>
21
        <div *ngIf="loadingMessage" class="loading-big">
22
          <div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">{{ loadingMessage }}</div>
23
          <div class="transparentFilm"></div>
24
        </div>
25
        <div *ngIf="noTopics" class="uk-alert">{{ noTopics }}</div>
26

    
27
        <ng-container *ngIf="repoTopics && repoTopics.length > 0">
28

    
29
          <div class="uk-alert uk-alert-info">
30
            For each topic a sample of 100 events will be displayed, as well as the total number that can be potentially built for your data source. If you are interested to receive the full list, you can subscribe to these events and then be notified about the new enrichment events.
31
          </div>
32

    
33
          <div class="uk-grid-margin uk-grid uk-grid-stack repos-list">
34

    
35
            <div class="uk-width-1-2 uk-first-column">
36
              <div class="md-card">
37
                <div class="md-card-toolbar">
38
                  <!--<div class="md-card-toolbar-actions">-->
39
                  <!--<a href="#" class="md-btn md-btn-small md-btn-flat">Button</a>-->
40
                  <!--<a href="#" class="md-btn md-btn-small md-btn-flat md-btn-flat-primary">Button</a>-->
41
                  <!--</div>-->
42
                  <h3 class="md-card-toolbar-heading-text">
43
                    More
44
                  </h3>
45
                </div>
46
                <div class="md-card-content">
47
                  <table class="uk-table uk-table-striped uk-table-middle">
48
                    <thead>
49
                    <tr>
50
                      <th>Additional metadata information that may enrich or supplement {{ repoName }} content</th>
51
                      <th class="uk-text-nowrap uk-text-right"># of events</th>
52
                    </tr>
53
                    </thead>
54
                    <tbody>
55
                    <tr class="el-item" *ngFor="let moreTopic of moreList">
56
                      <td class="uk-table-shrink uk-width-4-5">
57
                        <a (click)="goToEventsList(moreTopic.value)" class="el-link">{{ moreTopic.value }}</a>
58
                        <div *ngIf="topics[moreTopic.value]" class="uk-text uk-text-small">{{ topics[moreTopic.value]['englishName'] }}</div>
59
                      </td>
60
                      <td class="uk-text-nowrap uk-table-shrink uk-width-1-5 uk-text-right">
61
                        <div class="el-title">{{ moreTopic.size }}</div>
62
                      </td>
63
                    </tr>
64
                    <tr class="el-item uk-text-bold">
65
                      <td class="uk-text-nowrap uk-table-shrink uk-width-4-5">
66
                        <div class="el-title">Total</div>
67
                      </td>
68
                      <td class="uk-text-nowrap uk-table-shrink uk-width-1-5 uk-text-right">
69
                        <div class="el-title">{{ totalMore }}</div>
70
                      </td>
71
                    </tr>
72
                    </tbody>
73
                  </table>
74
                </div>
75
              </div>
76
            </div>
77

    
78
            <div class="uk-width-1-2 uk-first-column">
79
              <div class="md-card">
80
                <div class="md-card-toolbar">
81
                  <!--<div class="md-card-toolbar-actions">-->
82
                  <!--<a href="#" class="md-btn md-btn-small md-btn-flat">Button</a>-->
83
                  <!--<a href="#" class="md-btn md-btn-small md-btn-flat md-btn-flat-primary">Button</a>-->
84
                  <!--</div>-->
85
                  <h3 class="md-card-toolbar-heading-text">
86
                    Missing
87
                  </h3>
88
                </div>
89
                <div class="md-card-content">
90
                  <table class="uk-table uk-table-striped uk-table-middle">
91
                    <thead>
92
                    <tr>
93
                      <th>Missing metadata information that may enrich or complete {{ repoName }} content</th>
94
                      <th class="uk-text-nowrap uk-text-right"># of events</th>
95
                    </tr>
96
                    </thead>
97
                    <tbody>
98
                    <tr class="el-item" *ngFor="let missingTopic of missingList">
99
                      <td class="uk-table-shrink uk-width-4-5">
100
                        <a (click)="goToEventsList(missingTopic.value)" class="el-link">{{ missingTopic.value }}</a>
101
                        <div *ngIf="topics[missingTopic.value]" class="uk-text uk-text-small">{{ topics[missingTopic.value]['englishName'] }}</div>
102
                      </td>
103
                      <td class="uk-text-nowrap uk-table-shrink uk-width-1-5">
104
                        <div class="el-title uk-text-right">{{ missingTopic.size }}</div>
105
                      </td>
106
                    </tr>
107
                    <tr class="el-item uk-text-bold">
108
                      <td class="uk-text-nowrap uk-table-shrink uk-width-4-5">
109
                        <div class="el-title">Total</div>
110
                      </td>
111
                      <td class="uk-text-nowrap uk-table-shrink uk-width-1-5">
112
                        <div class="el-title uk-text-right">{{ totalMissing }}</div>
113
                      </td>
114
                    </tr>
115
                    </tbody>
116
                  </table>
117
                </div>
118
              </div>
119
            </div>
120

    
121
          </div>
122
        </ng-container>
123

    
124
      </div>
125

    
126
    </div>
127

    
128
    <!-- RIGHT HELP CONTENT -->
129
    <aside-help-content #rightHelperContent [position]="'right'"
130
                        [ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
131
    </aside-help-content>
132

    
133
  </div>
134

    
135
  <!-- BOTTOM HELP CONTENT -->
136
  <help-content #bottomHelperContent [position]="'bottom'"
137
                [ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
138
  </help-content>
139

    
140
</div>
(3-3/6)