dashboard-reddit.html 16.9 KB
Newer Older
militarpancho's avatar
militarpancho committed
1
2
3
<link rel="import" href="/bower_components/polymer/polymer.html">
<link rel="import" href="/bower_components/material-search/material-search.html">
<link rel="import" href="/bower_components/paper-material/paper-material.html">
4
<link rel="import" href="/elements/google-chart-elasticsearch/google-chart.html">
militarpancho's avatar
militarpancho committed
5
6
<link rel="import" href="/bower_components/paper-tabs/paper-tabs.html">
<link rel="import" href="/bower_components/paper-tabs/paper-tab.html">
7
<link rel="import" href="/elements/number-chart/number-chart.html">
militarpancho's avatar
militarpancho committed
8
<link rel="import" href="/bower_components/comment-chart/comment-chart.html">
militarpancho's avatar
militarpancho committed
9
10
<link rel="import" href="/bower_components/paper-tabs/paper-tabs.html">
<link rel="import" href="/bower_components/yasgui-polymer/yasgui.html">
11
12
13
<link rel="import" href="/bower_components/iron-pages/iron-pages.html">
<link rel="import" href="/bower_components/paper-item/paper-item.html">
<link rel="import" href="/bower_components/paper-menu/paper-menu.html">
14
<link rel="import" href="/elements/entities-chart/entities-chart.html">
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
15
<link rel="import" href="/elements/people-chart/people-chart.html">
16
<link rel="import" href="/elements/news-chart/news-chart.html">
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
17
<link rel="import" href="/elements/tweet-chart/tweet-chart.html">
18
<link rel="import" href="/elements/leaflet-maps/leaflet-map.html">
19

militarpancho's avatar
militarpancho committed
20
<dom-module id="dashboard-reddit">
21

militarpancho's avatar
militarpancho committed
22
23
24

  <link rel="import" type="css" href="dashboard-tourpedia.css" type="css">
  <link rel="import" href="/styles/app-theme.html" type="css">
25
26
27
28
29
30
31

  <template>
    <iron-ajax auto
        url="queries.json"
        handle-as="json"
        last-response="{{queries}}"></iron-ajax>

Alberto Pascual's avatar
new viz    
Alberto Pascual committed
32
33
34
35
36
37
38
    <div style="width:10%; padding: 1em; display:inline-block">
      <img style="width: 100%;"src="/images/trivalent.jpg">
    </div>
    <div style="width:80%;     padding-bottom: 12px; text-align:center; display:inline-block">
      <img style="width: 30%;  margin:0 auto;"src="/images/logo-gsi-crawler.png">
    </div>

39
40
41
42
43
44
45
    <paper-tabs selected="{{selected}}">
      <paper-tab>Dashboard</paper-tab>
      <paper-tab>Sparql Editor</paper-tab>
    </paper-tabs>

    <iron-pages selected="{{selected}}">
      <div>
46
        <div class="row">
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
47
        <material-search active="true" search-value="{{query}}"></material-search>
48
49
        </div>
        <br>  
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
50
51
        <div class="row">
          <div class="col-md-3">
52
            <number-chart 
53
              icon="/images/news.ico"
54
              stylebg="bg-yellow"
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
55
              title="Selected elements"
56
57
58
              data="{{data}}">
            </number-chart>
          </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
59
          <div class="col-md-3">
60
61
            <number-chart 
              data="{{data}}"
62
              object="cnn"
Alberto Pascual's avatar
Alberto Pascual committed
63
              aggKey="schema:author"
64
              title="CNN"
65
66
              icon="/images/cnn1.png"
              stylebg="bg-red">
67
68
            </number-chart>
          </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
69
          <div class="col-md-3">
militarpancho's avatar
militarpancho committed
70
71
             <number-chart  
               data="{{data}}" 
72
               object="The New York Times"
Alberto Pascual's avatar
Alberto Pascual committed
73
               aggKey="schema:author"
74
               title="The New York Times" 
75
               icon="/images/times1.png"
militarpancho's avatar
militarpancho committed
76
77
78
79
               aggkey="location"
               stylebg="bg-green"> 
             </number-chart>
           </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
80
81
82
83
84
85
86
87
88
89
90
91
           <div class="col-md-3">
             <number-chart  
               data="{{data}}" 
               object="twitter"
               aggKey="schema:author"
               title="Twitter" 
               icon="/images/twitter.ico"
               subtitle="Total"
               aggkey="location"
               stylebg="bg-aqua"> 
             </number-chart>
           </div>
militarpancho's avatar
militarpancho committed
92
         </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
93
94
95
         <br> 
        <div class="row">
          <div class="col-md-6">
96
            <google-chart
Alberto Pascual's avatar
Alberto Pascual committed
97
              field="schema:author"
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
98
99
100
101
              data="{{data}}"             
              id='pie-chart3'
              extra-id='pie-chart3'
              type='pie'
102
              filters="{{filters}}"
militarpancho's avatar
militarpancho committed
103
              icon='icons:reorder'
104
              options='{"title": "Source"}'
105
              cols='[{"label": "type", "type": "string"},{"label": "Count", "type": "number"}]'
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
106
107
108
109
110
111
112
113
114
115
116
117
            </google-chart>            
          </div>
          <div class="col-md-6">
            <entities-chart
                field="topics.rdfs:subClassOf"
                data="{{data}}"
                title="Topics"
                icon="icons:list"
                param="{{param}}"
                id="entitieschart"
                filters="{{filters}}">
            </entities-chart>
118
119
          </div>
        </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
120
121
122
        <br> 
     <div class="row"> 
        <div class="col-md-6">
militarpancho's avatar
militarpancho committed
123
124
125
            <google-chart
              field="sentiment"
              data="{{data}}"             
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
126
127
              id='barsentiment'
              extra-id='1'
128
              type='column'
militarpancho's avatar
militarpancho committed
129
              filters="{{filters}}"
militarpancho's avatar
militarpancho committed
130
131
132
              icon='social:mood'
              options='{"title": "Sentiments"}'
              cols='[{"label": "Sentiment", "type": "string"},{"label": "Count", "type": "number"}]'
militarpancho's avatar
militarpancho committed
133
            </google-chart>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
134
135
136
137
138
139
140
141
142
143
         </div> 
          <div class="col-md-6">
            <people-chart
                data="[[getPeople(data)]]"
                title="People"
                icon="maps:person-pin"
                param="{{param}}"
                id="entitieschart"
                filters="{{filters}}">
            </people-chart>
144
          </div>
145
      </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
146
147
148
      <br> 
      <div class="row">
        <div class="col-md-12">
149
        <google-chart
Alberto Pascual's avatar
Alberto Pascual committed
150
          field="schema:datePublished"
151
152
153
154
155
156
          data="{{data}}"             
          id='line-chart'
          extra-id='line-chart'
          type='area'
          filters="{{filters}}"
          icon='icons:trending-up'
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
157
          options='{"title": "Temporal Trends"}'
158
159
          cols='[{"label": "Date", "type": "string"},{"label": "Count", "type": "number"}]'
        </google-chart>
160
      </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
161
162
      </div>
      <br> 
163
      <div class="row">
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
164
      <div class="col-md-6">
165
166
        <paper-tabs selected="{{selectedpage}}">
          <paper-tab><iron-icon icon="icons:receipt"></iron-icon> List of news</paper-tab>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
167
          <paper-tab><iron-icon icon="icons:speaker-notes"></iron-icon> Social Media</paper-tab>
168
169
170
171
172
173
174
175
176
177
        </paper-tabs>
        <iron-pages class="lists" selected="{{selectedpage}}">
        <div>
          <news-chart 
            datos = "{{data}}"
            title="List of news"
            filters="{{filters}}"
            icon='icons:receipt'>
          </news-chart>
        </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
178
179
180
181
182
183
184
        <div>
          <tweet-chart 
            datos = "{{data}}"
            title="List of tweets"
            filters="{{filters}}"
            icon='communication:comment'>
          </tweet-chart></div>
185
186
        </iron-pages>
       </div>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
187
       <div class="col-md-6">
188
189
190
191
192
        <div class="top-bar">
        <iron-icon icon="maps:my-location"></iron-icon>
          <span>Geolocated News and Social Media</span>
        </div>
        <leaflet-map fit-to-markers>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
193
          <template is="dom-repeat" items="[[getPlaces(data)]]" as="place">
194
                <leaflet-marker latitude="{{place.lat}}" longitude="{{place.lng}}" title="{{place.name}}"> 
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
195
                    <b>Headline:</b>
196
197
                    <span>{{place.name}}</span>
                </leaflet-marker>
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
198
199
              </template>
             <!-- <leaflet-marker latitude="40.4520074" longitude="-3.7258213" title="Demo place"> 
200
201
202
203
204
205
206
207
208
209
210
211
212
                    <b>Name:</b>
                    <span>Demo<span>
                </leaflet-marker>
              <leaflet-marker class="style-scope dashboard-tourpedia" latitude="41.90059" longitude="12.474896" title="Margherita">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="52.547617" longitude="13.353173" title="Hotel Arcos Appartement House">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="52.357974741256" longitude="4.9006604030728" title="ibis Styles Amsterdam City">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="52.352212775572" longitude="4.8916602507234" title="easyHotel Amsterdam">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="52.532396478848" longitude="13.380556404591" title="baxpax Mitte Hostel">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="41.908899" longitude="12.479041" title="Edy">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="48.822176" longitude="2.361568" title="Long Hoa">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="48.827534" longitude="2.370932" title="Boulangerie de Tolbiac">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="41.386084311622" longitude="2.1677023172379" title="St Christopher's Inn">
  </leaflet-marker><leaflet-marker class="style-scope dashboard-tourpedia" latitude="41.38985943707" longitude="2.1471921354532" title="Sunotel Junior">
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
213
  </leaflet-marker>-->
214
        </leaflet-map>
215
       </div>
216
      </div>
217
218
219
    </div>
    <div>
        <yasgui-ui
220
       endpoint="http:///krusti.gsi:13030/gsicrawler/query"
221
       queries="{{queries}}">
222
223
        </yasgui-ui>
    </div>
224
    </iron-pages>
225
226
         <div style="background-color:#ccc; padding: 1%;">
        <div style="width:32%; margin: 0 auto">
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
227
       <img height="60px" src="/images/gsi.png">   © 2017 Grupo de Sistemas Inteligentes GSI-UPM 
228
229
        </div>
       </div>
230
  </template>
231
   
232
233

  <script>
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
234
  var ready = false;
235
    Polymer({
militarpancho's avatar
militarpancho committed
236
      is: 'dashboard-reddit',
237
238
239
240
241
      properties: {
        selected: {
          type: Number,
          value: 0
        }, 
242
243
244
245
        selectedpage: {
          type: Number,
          value: 0
        }, 
246
247
248
        query: {
          type: String,
        },
249
        ids:{
250
251
          type: Array
           
252
253
254
255
        },
        data:{
          type: Object
        },
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
256
257
258
259
        client: {
          type: Object,
          notify: true,
          observer: '_clientChanged'              
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
        },
        fields: {
          type: Array,
          value: function() { return []; }
        },

        filters: {
          type: Array,
          notify: true,
          value: function() { return []; }
        }
      },
    
      observers: [
      '_filtersChange(filters.*)'
      ],
276
277
278
279
280
281
      behaviors: [
        Polymer.IronA11yKeysBehavior
      ],
      keyBindings: {
        'enter': '_search'
      },
282
283

      ready: function(){
284
        //console.log("ready");
285
286
      },

J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
287
      _clientChanged: function() {
288
        //console.log("ClientChanged");
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
289
290
        ready = true;
        this._query();
291
      },
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
      getPeople: function(data){
        var people = []
        //console.log(data)
        data.hits.hits.forEach( function (entry){
          //console.log(entry)
          entry._source.entities.forEach(function(entity){
            //console.log(entity)
            if ('dbo:thumbnail' in entity) {
              people.push({'name': entity['nif:anchorOf'], 'image': entity['dbo:thumbnail']})
            }
          })
        })
        people = this.removeDuplicates(people, 'name')
        console.log(people)
        return people.slice(0,8)
      },
      removeDuplicates: function(originalArray, prop){
        var newArray = [];
        var lookupObject  = {};

         for(var i in originalArray) {
            lookupObject[originalArray[i][prop]] = originalArray[i];
         }

         for(i in lookupObject) {
             newArray.push(lookupObject[i]);
         }
          return newArray;
      },
      getPlaces: function(data){
        var places = []
        data.hits.hits.forEach( function (entry){
          entry._source.entities.forEach(function(entity){
            if ('latitude' in entity) {
              places.push({'lat': entity.latitude, 'lng': entity.longitude, 'name': entry._source['schema:headline']})
            }
          })
        })
        return places
      },
332
      _search: function(){
333
334
        //console.log("search fired")
        //console.log(this.query.length)
335
        if (this.query.length == 0){
336
          //console.log("default search fired")
337
338
339
340
          this._query()
        }
        else this._ESsearch()
      },
341
      _filtersChange: function() {
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
342
        this._query();
343
344
       },
      _ESsearch: function() {
345
        //console.log("_filtersChangedash")
346
        var that = this;
347
        //console.log("Ready?: ", ready);
348
349
350
351
352
        if(ready){
          this.client.search({
          // undocumented params are appended to the query string
          index: "gsicrawler",
          body: {
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
353
            size: 22,
354
355
356
            query: {
              multi_match:{
                query: this.query,
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
357
                fields: ['schema:author', 'schema:headline', 'sentiments', 'schema:about', 'entities.nif:anchorOf']
358
359
              }
            },
360
            sort:{'schema:datePublished':{order: "desc"}},
361
362
363
364
365
366
367
368
369
            aggs: {
             type: {
               terms: {
                 field: "@type.keyword",
                 order: {
                   _count: "desc"
                 }
               }
             },
Alberto Pascual's avatar
Alberto Pascual committed
370
             'schema:author': {
371
               terms: {
Alberto Pascual's avatar
Alberto Pascual committed
372
                 field: "schema:author.keyword",
373
374
375
376
377
                 order: {
                   _count: "desc"
                 }
               }
             },
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
378
379
380
381
382
383
384
385
386
             'entities.rdfs:subClassOf': {
               terms: {
                 field: "entities.rdfs:subClassOf.keyword",
                 order: {
                   _count: "desc"
                 } 
               }
             },
             'topics.rdfs:subClassOf': {
387
               terms: {
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
388
389
                 field: "topics.rdfs:subClassOf.keyword",
                 size: 20,
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
                 order: {
                   _count: "desc"
                 } 
               }
             },
           sentiment: {
             terms: {
             field: "sentiments.marl:hasPolarity.keyword",
             order: {
               _count: "desc"
               }
             }
             },
          emotion: {
              terms: {
              field: "emotions.onyx:hasEmotion.onyx:hasEmotionCategory.keyword",
             order: {
               _count: "desc"
                     }      
                   }
410
      },
Alberto Pascual's avatar
Alberto Pascual committed
411
      'schema:datePublished': {
412
              date_histogram : {
Alberto Pascual's avatar
Alberto Pascual committed
413
                field : "schema:datePublished",
414
415
416
                format: "MM-yyyy",
                interval : "month"
            }
417
       }
418
        }
419
420
421
422
423
424
425
      } 
          }).then(function (resp) {
            var myids = []
            resp.hits.hits.forEach(function(entry){myids.push(entry._id)})
            that.ids = myids;
            //console.log(that.ids)
            that.data = resp;
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
426
            console.log(that.data);
427
428
429
            
            });
        }
Alberto Pascual's avatar
Alberto Pascual committed
430
      },
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
431
       _query: function() {
432
        //console.log("_query")
433
        var that = this;
434
        //console.log("Ready?: ", ready);
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
435
436
        if(ready){
          this.client.search({
437
          // undocumented params are appended to the query string
438
          index: "gsicrawler",
439
          body: {
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
440
            size: 22,
441
442
443
444
445
            query: {
              bool: {
                must: this.filters,
              }
            },
446
            sort:{'schema:datePublished':{order: "desc"}},
447
            aggs: {
448
             type: {
militarpancho's avatar
militarpancho committed
449
               terms: {
450
451
452
453
454
455
                 field: "@type.keyword",
                 order: {
                   _count: "desc"
                 }
               }
             },
Alberto Pascual's avatar
Alberto Pascual committed
456
             'schema:author': {
457
               terms: {
Alberto Pascual's avatar
Alberto Pascual committed
458
                 field: "schema:author.keyword",
militarpancho's avatar
militarpancho committed
459
460
                 order: {
                   _count: "desc"
461
                 }
militarpancho's avatar
militarpancho committed
462
               }
militarpancho's avatar
militarpancho committed
463
             },
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
464
465
466
467
468
469
470
471
472
             'entities.rdfs:subClassOf': {
               terms: {
                 field: "entities.rdfs:subClassOf.keyword",
                 order: {
                   _count: "desc"
                 } 
               }
             },
             'topics.rdfs:subClassOf': {
473
               terms: {
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
474
475
                 field: "topics.rdfs:subClassOf.keyword",
                 size: 20,
476
477
478
                 order: {
                   _count: "desc"
                 } 
J. Fernando Sánchez's avatar
J. Fernando Sánchez committed
479
               }
480
             },
481
482
483
484
485
486
487
488
489
490
491
492
493
           sentiment: {
             terms: {
             field: "sentiments.marl:hasPolarity.keyword",
             order: {
               _count: "desc"
               }
             }
             },
          emotion: {
              terms: {
              field: "emotions.onyx:hasEmotion.onyx:hasEmotionCategory.keyword",
             order: {
               _count: "desc"
494
495
                     }      
                   }
496
      },
Alberto Pascual's avatar
Alberto Pascual committed
497
      'schema:datePublished': {
498
              date_histogram : {
Alberto Pascual's avatar
Alberto Pascual committed
499
                field : "schema:datePublished",
500
501
502
503
                format: "MM-yyyy",
                interval : "month"
            }
       }
504
505
       }
      } 
506
          }).then(function (resp) {
507
508
509
510
            var myids = []
            resp.hits.hits.forEach(function(entry){myids.push(entry._id)})
            that.ids = myids;
            //console.log(that.ids)
511
            that.data = resp;
Alberto Pascual's avatar
new viz    
Alberto Pascual committed
512
            console.log(that.data);
513
            
514
515
516
517
518
519
520
            });
        }
      }
    });
  </script>

</dom-module>