propaganda-chart.html 19.4 KB
Newer Older
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
1
2
3
4
5
6
7
8
<link rel="import" href="/bower_components/polymer/polymer.html">
<link rel="import" href="/bower_components/iron-icons/iron-icons.html">
<link rel="import" href="/bower_components/paper-dialog/paper-dialog.html">
<link rel="import" href="/bower_components/iron-collapse/iron-collapse.html">


<dom-module id="propaganda-chart">

9
10


Tasio Mendez's avatar
Tasio Mendez committed
11
<link rel="import" type="css" href="propaganda-chart.css">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
12
13
14
15
16

  <template>

    <!-- Shadow DOM -->
    <paper-material elevation="1">
Daniel Suarez Souto's avatar
Styled    
Daniel Suarez Souto committed
17
        <!-- <table class="table table-striped">
Tasio Mendez's avatar
Tasio Mendez committed
18

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
19
20
21
22
23
          <tr>
            <th style="width: 20%; text-align: center">Source</th>
            <th style="width: 50%; text-align: center">Article</th>

          </tr>
Tasio Mendez's avatar
Tasio Mendez committed
24

Daniel Suarez Souto's avatar
Styled    
Daniel Suarez Souto committed
25
        </table> -->
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
26
        <div id="nodata">No entries match the current filters</div>
27
        <div class="propaganda-chart-container">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
28
        <template is="dom-repeat" items="{{data}}" as="news">
Tasio Mendez's avatar
Tasio Mendez committed
29

30
            <div class$="tweet {{checkSentiment(news.sentiments)}} same-height" ident$="subitem[[index]]" style=" text-align: center; min-height: 65px;display: flex;align-items: center;justify-content: center;">
31
32
              <div class="row" style="width: 100%;">
                <button data-toggle="modal" data-target$="#article[[index]]" style="background: none; border: none; cursor: pointer; width: 100%;" title="Check the article">
Tasio Mendez's avatar
Tasio Mendez committed
33

34
35
                <div class="col-md-12 col-xs-12 col-sm-12 headline">
                  <div class="col-md-2 col-xs-2 col-sm-2" style="justify-self: center; align-self: center;">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
36
37
                    <img src={{checkSource(news)}} style="width: 100%; display:block; position: relative;" align="left">
                  </div>
38
                  <div class="col-md-10 col-xs-10 col-sm-10">
Tasio Mendez's avatar
Tasio Mendez committed
39
40
                      <a class="text" style="font-size: 15px; display: inline-block; vertical-align: middle;"> {{getHeadline(news)}}</a>

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
41
                  </div>
42
                </div>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
43
                </button>
44
                <!-- Modal -->
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
45
                <div class="modal fade" id$="article[[index]]" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="overflow: hidden;">
Daniel Suarez Souto's avatar
Styled    
Daniel Suarez Souto committed
46
                  <div class="modal-dialog modal-lg">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
47
                    <div class="modal-content" style="height: fit-content;">
48
                      <div class="modal-header" style="height:80px;background-color: #449DD5; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2); border-radius: 5px 5px 0 0;display: flex; align-items: center;justify-content: center;">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
49

Tasio Mendez's avatar
Tasio Mendez committed
50
                        <!--                         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> -->
51
                        <div class="col-md-12 col-xs-12 col-sm-12" style="display: flex;flex-direction: row;justify-content: space-around;align-content: center;">
52
                          <div class="col-md-2 col-xs-2 col-sm-2 hidden-xs img-wrapper" style="width:13%">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
53
54
                            <img src="{{checkSource(news)}}" style="width: 100%; display:block; position: relative;" align="left">
                          </div>
55
                          <div class="col-md-10 col-xs-12 col-sm-10" style="display: flex; flex-direction: row; justify-content: center; align-content: center;">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
56
57
                            <h4 class="modal-title" id="myModalLabel" style="display: flex; justify-self: center; align-self: center; color: #fff;display:inline-block; vertical-align: middle;">{{getHeadline(news)}}</h4>
                          </div>
58
                          <div class="col-md-2 col-xs-12 col-sm-2" style="display: flex; flex-direction: row; justify-content: center; align-content: center;">
59
60
                            <h4 style="color: white;color: white; display: flex; justify-self: center; align-self: center; font-style: italic;">Issue: {{getIssue(news)}}</h4>
                          </div>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
61
                        </div>
62
                      </div>
63
                      <div class="modal-body" style="height: 520px" >
64
                        <div class="col-md-5 col-xs-12 col-sm-5 modal-tags" style=" overflow-x: hidden; overflow-y: auto; height: 100%;">
65
                          <br>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
66
                          <br>
67
68
69
70
71
72
73
74
75
76
77
78
79
80
                          <br>
                          <div class="leyend" style="display: flex; flex-direction: row; justify-content: center; margin-bottom: 5px">
                            <div class="leyend_place" style="display: flex; flex-direction: row;">
                              <div style="width: 7px;height: 7px;background-color: #f90; float: left;    margin-top: 7px;margin-right: 3px; margin-left: 6px" class="style-scope news-chart"></div>
                              Places
                            </div>
                            <div class="leyend_org" style="display: flex; flex-direction: row;">
                              <div style="width: 7px;height: 7px;background-color: #dd4b39; float: left;    margin-top: 7px;margin-right: 3px; margin-left: 6px" class="style-scope news-chart"></div>
                              Organization
                            </div>
                            <div class="leyend_person" style="display: flex; flex-direction: row;">
                              <div style="width: 7px;height: 7px;background-color: #00c0ef; float: left;    margin-top: 7px;margin-right: 3px; margin-left: 6px" class="style-scope news-chart"></div>
                              Person
                            </div>
Daniel Suarez's avatar
Daniel Suarez committed
81
                            <div class="leyend_person" style="display: flex; flex-direction: row;">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
82
                              <div style="width: 7px;height: 7px;background-color: #505050; float: left;    margin-top: 7px;margin-right: 3px; margin-left: 6px" class="style-scope news-chart"></div>
Daniel Suarez's avatar
Daniel Suarez committed
83
84
                              Category
                            </div>
85
86

                          </div>
Tasio Mendez's avatar
Tasio Mendez committed
87
88
                          <template is="dom-repeat" items="{{news.entities}}" as="entity">

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
89
                            <span class="badge badge-secondary" on-tap="highlightEntity" data-id$= "{{getID(news)}}" data-text$="{{getArticle(news)}}" style$="background-color: {{getBg(entity)}};">{{entity.schema:name}}</span>
Tasio Mendez's avatar
Tasio Mendez committed
90

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
91
                          </template>
Tasio Mendez's avatar
Tasio Mendez committed
92
93
                          <template is="dom-repeat" items="{{news.taxonomies}}" as="category">

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
94
                            <span class="badge badge-secondary" on-tap="highlightCategory" data-id$= "{{getID(news)}}" data-text$="{{getArticle(news)}}" style="background-color: #505050;">{{getCategory(category)}}</span>
Tasio Mendez's avatar
Tasio Mendez committed
95

Daniel Suarez's avatar
Daniel Suarez committed
96
                          </template>
Tasio Mendez's avatar
Tasio Mendez committed
97
                        </div>
98

99
                        <div class="col-md-7 col-xs-12 col-sm-7" style="overflow-x: hidden; overflow-y: hidden; height: 100%;">
Tasio Mendez's avatar
Tasio Mendez committed
100
101
102
103
104
105
106
                          <ul class="nav nav-tabs" role="tablist" id=#propagandaTabs>
                            <li class="active" id="tabText">
                              <a data-toggle="tab" role="tab" href$="#propaganda[[index]]" aria-controls$="propaganda[[index]]">Text</a>
                            </li>
                            <li id="tabArticle">
                              <a data-toggle="tab" role="tab" href$="#pdf[[index]]" aria-controls$="pdf[[index]]">Magazine</a>
                            </li>
107
108
                          </ul>
                          <div class="tab-content">
Tasio Mendez's avatar
Tasio Mendez committed
109
                            <div role="tabpanel" id$="propaganda[[index]]" class="tab-pane active text-pane" style="background-color: #eeeeee96; float: right; border: 1px solid #B3BFC7; padding: 20px; overflow: auto; height: 100%; width: 100%;">
110
111
112
                              <div id$="{{getID(news)}}" style="text-align: justify; white-space: pre-line;">
                                {{getArticle(news)}}
                              </div>
Tasio Mendez's avatar
Tasio Mendez committed
113

114
                            </div>
Tasio Mendez's avatar
Tasio Mendez committed
115
                            <div role="tabpanel" id$="pdf[[index]]" class="tab-pane pdf" iframe-src$="{{setPDF(news, index)}}">
Tasio Mendez's avatar
Tasio Mendez committed
116

117
                            </div>
Tasio Mendez's avatar
Tasio Mendez committed
118
                          </div>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
119
                        </div>
120
                      </div>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
121

122
                      <div class="modal-footer">
123
                        <button type="button" class="btn btn-info pull-left visible-xs" onclick="tags_modal_btn_propaganda()">Show tags</button>
124
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
125
                      </div>
126
127
128
129
130
131
132
133
134
135
136

                      <script type="text/javascript">
                        function tags_modal_btn_propaganda() {
                          var position = $('.modal-content .modal-tags').css('right');
                          if (position === '0px')
                            $('.modal-content .modal-tags').css('right', '110%');
                          else
                            $('.modal-content .modal-tags').css('right', '0px');
                        }
                      </script>

137
138
                    </div>
                  </div>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
139
                </div>
Tasio Mendez's avatar
Tasio Mendez committed
140
              </div>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
141
            </div>
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
142

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
143
144
              <!-- <iron-collapse ident$="subitem[[index]]">
                <div class="content" style="text-align:center; width: 94%; margin: 0 auto;">
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
145
                <br>
Tasio Mendez's avatar
Tasio Mendez committed
146
147
                <template is="dom-repeat" items="{{news.entities}}" as="entity">

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
148
                  <span class="badge badge-secondary" on-tap="filter" style$="{{getBg(entity)}}">{{entity.nif:anchorOf}}</span>
Tasio Mendez's avatar
Tasio Mendez committed
149

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
150
                </template>
Tasio Mendez's avatar
Tasio Mendez committed
151

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
152

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
153
154
              </iron-collapse>
              </div> -->
Tasio Mendez's avatar
Tasio Mendez committed
155

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
        </template>
        <br>

    </paper-material>

  </template>

  <script>
    var filtered = false;

    Polymer({

      is: 'propaganda-chart',

      properties: {

        data: {
            type: Array,
            value: [] //default value for data array.
        },

        icon: {
          type: String,
          value: "face"
        },

        title: {
          type: String,
          value: "List of different tweets"
        },
        buttontext:{
          type: String,
          value : "See more"
        },

        brand: {
          type: String,
          value: "Undefined"
        },

        query: {
          type: String,
          observer: '_queryChanged'
        },

        index: {
          type: String
        },

        subindex: {
          type: String
        },

        fields: {
          type: Array,
          value: function() { return []; }
        },

        datos:{
          type: Object,
          observer: '_dataChanged'
        },

        field: {
          type: String
        },

        host: {
          type: String
        },

        param: {
          type: String,
          notify: true
        },

        filters: {
          type: Array,
          notify: true,
          value: function() { return []; }
        }
      },

Tasio Mendez's avatar
Tasio Mendez committed
239
      ready: function() {
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
240
241
242
243
244
245
246

      },

      _dataChanged: function() {
        var that = this
        var hits = this.datos.hits.hits;
        var results = []
247
        // console.log(hits)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
248

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
249
        hits.forEach(function(entry) {
250
           // console.log(entry._source)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
251
           if(entry._source['@type']=="schema:Article") results.push(entry._source);
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
252
        });
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
253
254
255
256
257
        if(results.length==0){
          this.$.nodata.style.visibility = 'visible';
        }else{
          this.$.nodata.style.visibility = 'hidden';
        }
258
        // console.log(results)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
259
260
261
        that.data = results
      },
      getHeadline: function(news){
262
        // console.log(news['http://schema.org/headline'][0]['@value'])
263
        return news['schema:headline']
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
264
      },
265
      getArticle: function(news){
266
        // console.log(news['http://schema.org/headline'][0]['@value'])
267
        text = news['schema:articleBody']
268
        // console.log(text)
269
270
271
        //text=text.replace('↵','\n')
        text=text.replace(' \n','\n')
        text=text.replace('\n\f','\n')
Tasio Mendez's avatar
Tasio Mendez committed
272
        text=text.replace('', '')
273
274
275
        text=text.replace(/\s{2,}/g, ' ')
        text=text.replace('', '')
        text=text.replace('', '')
Tasio Mendez's avatar
Tasio Mendez committed
276
        text=text.replace('', '')
277
278
        text=text.replace('','')
        text=text.replace('', '')
Tasio Mendez's avatar
Tasio Mendez committed
279
        text=text.replace('', '')
280
        text=text.replace('','')
281
        // console.log(text)
282
        return text
283
      },
284
      getID: function(news){
285
        // console.log(news['@id'])
286
287
        return news['@id']
      },
288
289
290
      getIssue: function(news){
        return news["number"]
      },
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
291
292
      getDate: function(date){
        var fecha = date.toString().split("-");
293
        // console.log(fecha)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
294
295
296
        return fecha[2].split("T")[0]+"-"+fecha[1]+"-"+fecha[0]
      },
      getBg: function(entity){
297
        // console.log(entity)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
298
299
300
301
        if(entity["@type"][0] === "schema:Place") {
          color = "#ff9900"
        } else if(entity["@type"][0] === "schema:Organization") {
          color = "#dd4b39"
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
302
        } else {
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
303
          color = "#00c0ef"
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
304
        }
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
305
        return color;
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
306
307
      },
      checkSentiment: function(sentiment) {
308
        // console.log(sentiment[0]['marl:hasPolarity'])
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
309
310
311
312
313
        try{
          if (sentiment[0]['marl:hasPolarity'] == "marl:Positive")
            return "tweet positive-news"
          else if (sentiment[0]['marl:hasPolarity'] == "marl:Negative")
            return "tweet negative-news"
Tasio Mendez's avatar
Tasio Mendez committed
314
          else
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
315
316
317
            return "tweet neutral-news"
        }
        catch (e){
318
          // console.log(e)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
319
320
321
322
          return "tweet neutral-news"
        }
      },
      getUri: function(news){
Tasio Mendez's avatar
Tasio Mendez committed
323

324
        var uri="http://trivalent-resources.cluster.gsi.dit.upm.es/"+news['magazine'].toLowerCase()+"/"+news['magazine'].toLowerCase()+news['number']+".pdf#page="+news['schema:pageStart']+"&view=FitB";
Tasio Mendez's avatar
Tasio Mendez committed
325

326
        // console.log(uri)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
327
328

        //var uri= "/magazines/"+news['magazine'].toLowerCase()+"/data/"+news['magazine'].toLowerCase()+news['number']+".pdf";
329
        // console.log(uri)
330
        //return uri;
331
        //return '/resources/'+(news['@id'].split('/')[4]);
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
332
333
      },
      getemotion: function(emotion) {
334
        // console.log(emotion)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
335
336
337
        return emotion[0]['onyx:hasEmotion']['onyx:hasEmotionCategory'].split(':')[1]
      },
      checkSpanSentiment: function(sentiment) {
338
        // console.log(sentiment)
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
339
340
341
342
        if (sentiment == "marl:Positive")
          return "span positive"
        else if (sentiment == "marl:Negative")
          return "span negative"
Tasio Mendez's avatar
Tasio Mendez committed
343
        else
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
344
345
346
347
          return "span neutral"
      },

      checkSource: function(source) {
Tasio Mendez's avatar
Tasio Mendez committed
348

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
349
350
351
352
353
354
355
        aaa = source['@id']
        //source = source.toLowerCase()
        if (aaa.indexOf("Dabiq") != -1){
          return "/images/dabiq_logo.png"
        } else {
          return "/images/rumiyah_logo.png"
        }
Tasio Mendez's avatar
Tasio Mendez committed
356
357


Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
      },
      checkEmotion: function(source) {
        if(source[0]['onyx:hasEmotion']['onyx:hasEmotionCategory'].indexOf("anger") > -1)
          return "/images/emotion/anger.png"
        else if(source[0]['onyx:hasEmotion']['onyx:hasEmotionCategory'].indexOf("disgust") > -1)
          return "/images/emotion/disgust.png"
        else if(source[0]['onyx:hasEmotion']['onyx:hasEmotionCategory'].indexOf("fear") > -1)
          return "/images/emotion/fear.png"
        else if(source[0]['onyx:hasEmotion']['onyx:hasEmotionCategory'].indexOf("joy") > -1)
          return "/images/emotion/joy.png"
        else if(source[0]['onyx:hasEmotion']['onyx:hasEmotionCategory'].indexOf("neutral") > -1)
          return "/images/emotion/neutral.png"
        else if(source[0]['onyx:hasEmotion']['onyx:hasEmotionCategory'].indexOf("sadness") > -1)
          return "/images/emotion/sadness.png"
      },
373
      highlightEntity: function(e) {
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
374

Tasio Mendez's avatar
Tasio Mendez committed
375
        var id = e.target.dataset.id
376
377
        var element = document.getElementById(id)
        var text = e.target.dataset.text
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
378
        var text_highlighted=""
379
        var beginIndex = e.model.__data__.entity["nif:beginIndex"]
Tasio Mendez's avatar
Tasio Mendez committed
380
        var endIndex = e.model.__data__.entity["nif:endIndex"]
381
        var cnt=0
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
382

Tasio Mendez's avatar
Tasio Mendez committed
383
        if (beginIndex[0] >= 0) {
384
385
386
387
388
389
390
391
392
393
394
          if(text[beginIndex[0]]===' ') cnt+=1
          text_highlighted = text.substring(0,beginIndex[0]+cnt) + "<span class='highlight' style='background-color:yellow'>" + text.substring(beginIndex[0]+cnt,endIndex[0]+1+cnt) + "</span>"
          for(var i =1 ; i<beginIndex.length;i++){
            if(text[beginIndex[i]+cnt]===' ') cnt+=1
            text_highlighted+=text.substring(endIndex[i-1]+1+cnt,beginIndex[i]+cnt)
            text_highlighted+="<span class='highlight' style='background-color:yellow'>"
            text_highlighted+=text.substring(beginIndex[i]+cnt,endIndex[i]+1+cnt)
            text_highlighted+="</span>"
          }
          text_highlighted+= text.substring(endIndex[endIndex.length-1]+1+cnt)
          element.innerHTML = text_highlighted
395
396
397
398

          // Select the tab
          $('#tabText a').tab('show')
          //Dynamic Scroll
399

400
          $('#'+element.parentElement.id).animate({scrollTop: $('#'+element.parentElement.id).scrollTop() + $('#'+element.parentElement.id + ' span').position().top - 200}, 400)
401
          $('.modal-content .modal-tags').css('right', '110%');
Tasio Mendez's avatar
Tasio Mendez committed
402

403
        }
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
404
      },
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
405
406
      setPDF: function(news, index) {
        function loadPDF() {
407
408
409
410
411
          var page=parseInt(news['schema:pageStart'])
          if (news['magazine']==='Rumiyah'){
            page+=1
          }
          var uri= "http://trivalent-resources.cluster.gsi.dit.upm.es/"+news['magazine'].toLowerCase()+"/"+news['magazine'].toLowerCase()+news['number']+".pdf#page="+page;
412
          /*var uri= "http://localhost:8080/magazines/"+news['magazine'].toLowerCase()+"/data/"+news['magazine'].toLowerCase()+news['number']+".pdf#page="+news['schema:pageStart'];*/
Tasio Mendez's avatar
Tasio Mendez committed
413

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
414
          $('#article'+index).off();
415
416
417
          var iframe = $('<iframe>').attr('src', uri).width('100%').height('91%');
          $('#article'+index).on('shown.bs.modal', function(event) {
            if ($('#article'+index+' li#tabArticle').hasClass('active'))
418
              $('#article'+index+' #pdf'+index).html(iframe);
Tasio Mendez's avatar
Tasio Mendez committed
419
          });
420
421
422
423
424
          $('#article'+index+' li#tabArticle a').on('shown.bs.tab', function(event) {
            $('#article'+index+' #pdf'+index).html(iframe);
          });
          $('#article'+index).on('hidden.bs.modal', function(event) {
            $('#article'+index+' #pdf'+index).empty();
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
425
426
          });
        }
Tasio Mendez's avatar
Tasio Mendez committed
427

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
428
429
430
431
        if (window.loaded) {
          loadPDF();
        } else {
          $('#article'+index).ready(function() {
Tasio Mendez's avatar
Tasio Mendez committed
432
            loadPDF();
Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
433
434
435
436
          });
        }
        return news['@id'];
      },
Daniel Suarez's avatar
Daniel Suarez committed
437
      highlightCategory: function(e) {
438
        // console.log(e)
Tasio Mendez's avatar
Tasio Mendez committed
439
        var id = e.target.dataset.id
Daniel Suarez's avatar
Daniel Suarez committed
440
441
442
443
        var element = document.getElementById(id)
        var text = e.target.dataset.text
        var text_highlighted= ""
        var beginIndex = e.model.__data__.category["nif:beginIndex"]
Tasio Mendez's avatar
Tasio Mendez committed
444
        var endIndex = e.model.__data__.category["nif:endIndex"]+1
Daniel Suarez's avatar
Daniel Suarez committed
445
        var cnt=0
Tasio Mendez's avatar
Tasio Mendez committed
446

447
448
        // console.log(beginIndex)
        // console.log(endIndex)
Daniel Suarez's avatar
Daniel Suarez committed
449
        var subtext = text.substring(0,beginIndex)
Tasio Mendez's avatar
Tasio Mendez committed
450
451

        if (beginIndex >= 0) {
Daniel Suarez's avatar
Daniel Suarez committed
452
453
         text = text.substring(0,beginIndex) + "<span class='highlight' style='background-color:yellow'>" + text.substring(beginIndex,endIndex) + "</span>" + text.substring(endIndex)
         element.innerHTML = text
454
         // console.log(text)
455
         $('#tabText a').tab('show')
456
         // console.log($('#'+element.parentElement.id+' span').position().top)
Daniel Suarez's avatar
Daniel Suarez committed
457
         $('#'+element.parentElement.id).animate({scrollTop: $('#'+element.parentElement.id).scrollTop() + $('#'+element.parentElement.id + ' span').position().top - 200}, 400)
458
         $('.modal-content .modal-tags').css('right', '110%');
Daniel Suarez's avatar
Daniel Suarez committed
459
460
        }

Tasio Mendez's avatar
Tasio Mendez committed
461

Daniel Suarez's avatar
Daniel Suarez committed
462
      },
463
464
465
466
      getCategory: function(category){
        var arr=category["rdfs:label"].split("/")
        return arr[arr.length-1]
      }
Tasio Mendez's avatar
Tasio Mendez committed
467

Daniel Suarez Souto's avatar
Daniel Suarez Souto committed
468
469
470
471
    });
  </script>

</dom-module>