Project

General

Profile

1
import {Component, ViewChild} from '@angular/core';
2
import {JSONP_PROVIDERS}  from '@angular/http';
3
import {Observable}       from 'rxjs/Observable';
4
import {PublicationService} from '../../services/publication.service';
5
import {PublicationInfo} from '../../entities/publicationInfo';
6
import { RouteParams} from '@angular/router-deprecated';
7
import { InlineClaimContextComponent} from '../../claimPages/inlineClaimContext/inlineClaimContext.component';
8
import { InlineClaimProjectComponent} from '../../claimPages/inlineClaimProject/inlineClaimProject.component';
9
//import {NgSwitch, ngSwitchCase, NgSwitchDefault} from '@angular/common';
10

    
11
@Component({
12
    selector: 'publication',
13
    template: `
14

    
15
        <div >
16

    
17
            <div class="container publication">
18
                <div class="container-header" >
19
                  <h2 *ngIf="publicationInfo != null" >{{publicationInfo.title}}</h2 >
20
                  <div *ngIf="warningMessage.length > 0" class="alert alert-warning" role="alert">{{warningMessage}}</div>
21
                  <div *ngIf="errorMessage.length > 0" class="alert alert-danger" role="alert">{{errorMessage}}</div>
22

    
23
                </div>
24
                <div class="row row-offcanvas row-offcanvas-right" >
25

    
26
                  <div class="col-xs-6 col-sm-9 sidebar-offcanvas" *ngIf="publicationInfo != null">
27
                  <div>
28
                    <div *ngIf="publicationInfo.authors != undefined">
29
                        <div *ngIf="showAllAuthors">
30
                            <a class="text-muted" (click)="showAllAuthors = !showAllAuthors;">View less authors</a>
31
                        </div>
32
                        <span *ngFor="let item of publicationInfo.authors.slice(0,30)">
33
                            <a class="custom-external" href="{{item['url']}}" target="_blank">
34
                                {{item['name']}};
35
                            </a>
36
                        </span>
37
                        <span *ngIf="!showAllAuthors && publicationInfo.authors.length > 30">	... </span>
38
                        <span *ngIf="showAllAuthors">
39
                            <span *ngFor="let item of publicationInfo.authors.slice(30)">
40
                                <a class="custom-external" href="{{item['url']}}" target="_blank">
41
                                    {{item['name']}};
42
                                </a>
43
                            </span>
44
                        </span>
45
                        <span *ngIf="!showAllAuthors && publicationInfo.authors.length > 30">
46
                            <a class="text-muted" (click)="showAllAuthors = !showAllAuthors;">
47
                                view all {{publicationInfo.authors.length}} authors
48
                            </a>
49
                        </span>
50
                        <span *ngIf="showAllAuthors">
51
                            <a class="text-muted" (click)="showAllAuthors = !showAllAuthors;">View less authors</a>
52
                        </span>
53
                    </div>
54

    
55
                    <span *ngIf="publicationInfo.date != ''">({{publicationInfo.date}})</span>
56
                  </div>
57

    
58
                  <dl class="dl-horizontal">
59
                    <dt   *ngIf="publicationInfo.publisher != undefined && publicationInfo.publisher != ''">Publisher: </dt>
60
                    <dd *ngIf="publicationInfo.publisher != undefined && publicationInfo.publisher != ''">{{publicationInfo.publisher}}</dd>
61
                    <dt *ngIf="publicationInfo.journal != undefined && publicationInfo.journal != ''">Journal: </dt>
62
                    <dd *ngIf="publicationInfo.journal != undefined && publicationInfo.journal != ''">{{publicationInfo.journal}}</dd>
63
                    <dt *ngIf="publicationInfo.languages != undefined && publicationInfo.languages != 'Undetermined' && publicationInfo.languages != ''"> Languages: </dt>
64
                    <dd *ngIf="publicationInfo.languages != undefined && publicationInfo.languages != 'Undetermined' && publicationInfo.languages != ''">{{publicationInfo.languages}}</dd>
65
                    <dt  *ngIf="publicationInfo.types != undefined && publicationInfo.types.length > 0"> Types: </dt>
66
                    <dd  *ngIf="publicationInfo.types != undefined && publicationInfo.types.length > 0">{{publicationInfo.types}}</dd>
67

    
68

    
69
                    <div *ngIf="publicationInfo.identifiers != undefined && publicationInfo.identifiers.size > 0">
70
                        <dt>Identifiers:</dt>
71
                        <dd>
72
                            <ul class="list-inline">
73
                                <li *ngFor="let key of publicationInfo.identifiers.keys()">
74
                                    <!--a *ngIf="key == 'doi'" class="custom-external" href="http://dx.doi.org/{{key}}" target="_blank">
75
                                        {{key}}: {{publicationInfo.identifiers.get(key)}}
76
                                    </a>
77
                                    <a *ngIf="key == 'pmc'" class="custom-external" href="http://europepmc.org/articles/{{key}}" target="_blank">
78
                                        {{key}}: {{publicationInfo.identifiers.get(key)}}
79
                                    </a>
80
                                    <a *ngIf="key != 'pmc' && key != 'doi'" class="custom-external" href="http://europepmc.org/articles/{{key}}" target="_blank">
81
                                        {{key}}: {{publicationInfo.identifiers.get(key)}}
82
                                    </a-->
83

    
84
                                    <div [ngSwitch]="key">
85
                                      <template [ngSwitchWhen]="'doi'">
86
                                        <a class="custom-external" href="http://dx.doi.org/{{publicationInfo.identifiers.get(key)}}" target="_blank">
87
                                            {{key}}: {{publicationInfo.identifiers.get(key)}}
88
                                        </a>
89
                                      </template>
90
                                      <template [ngSwitchWhen]="'pmc'">
91
                                        <a class="custom-external" href="http://europepmc.org/articles/{{publicationInfo.identifiers.get(key)}}" target="_blank">
92
                                            {{key}}: {{publicationInfo.identifiers.get(key)}}
93
                                        </a>
94
                                      </template>
95
                                      <template ngSwitchDefault>{{key}}: {{publicationInfo.identifiers.get(key)}}</template>
96
                                    </div>
97
                                </li>
98
                            </ul>
99
                        </dd>
100
                    </div>
101

    
102
                    <div *ngIf="publicationInfo.subjects != undefined">
103
                        <dt *ngIf="publicationInfo.subjects.length > 0 || publicationInfo.classifiedSubjects.size > 0">
104
                            Subjects:
105
                        </dt>
106
                        <dd>
107
                            <div *ngIf="publicationInfo.subjects.length > 0"> {{publicationInfo.subjects}} </div>
108
                            <div *ngIf="publicationInfo.subjects.length == 0 && publicationInfo.classifiedSubjects.size > 0"> - </div>
109
                        </dd>
110

    
111
                        <dd class="col-md-offset-1" *ngIf="publicationInfo.classifiedSubjects.size > 0">
112
                            <a (click)="showClassifiedSbj = !showClassifiedSbj;">
113
                                <div *ngIf="!showClassifiedSbj">
114
                                    Show additional classifications
115
                                    <span  class="glyphicon glyphicon-plus" aria-hidden="true"></span>
116
                                </div>
117
                                <div *ngIf="showClassifiedSbj">
118
                                    Hide additional classifications
119
                                    <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>
120
                                </div>
121
                            </a>
122

    
123
                            <div class="well" *ngIf="showClassifiedSbj">
124
                                <div *ngFor="let key of publicationInfo.classifiedSubjects.keys()">
125
                                    Classified by OpenAIRE into
126
                                    <div>
127
                                        {{key}}: {{publicationInfo.classifiedSubjects.get(key)}}
128
                                    </div>
129
                                </div>
130
                            </div>
131
                        </dd>
132
                    </div>
133

    
134

    
135
                  </dl>
136

    
137
                  <blockquote *ngIf="publicationInfo.description != ''">
138
                      {{publicationInfo.description}}
139
                  </blockquote>
140

    
141

    
142

    
143
                  <ul class="nav nav-tabs">
144
                    <li class="active">
145
                        <a data-toggle="tab" href="#citationsTab">
146
                            References
147
                            <span *ngIf="publicationInfo.references == undefined" class="badge">0</span>
148
                            <span *ngIf="publicationInfo.references != undefined" class="badge">
149
                                {{publicationInfo.references.length}}
150
                            </span>
151

    
152
                            <!--span [ngSwitch]="publicationInfo.references || undefined" class="badge">
153
                              <template [ngSwitchWhen]="undefined">0</template>
154
                              <template ngSwitchDefault>{{publicationInfo.references.length}}</template>
155
                            </span-->
156
                        </a>
157
                    </li>
158
                    <li role="presentation">
159
                        <a data-toggle="tab" href="#dataTab">
160
                            Related Research Data
161
                            <span *ngIf="publicationInfo.relatedResearchData == undefined" class="badge">0</span>
162
                            <span *ngIf="publicationInfo.relatedResearchData != undefined" class="badge">{{publicationInfo.relatedResearchData.size}}</span>
163
                        </a>
164
                    </li>
165
                    <li role="presentation">
166
                        <a data-toggle="tab" href="#similarTab">
167
                            Similar Publications
168
                            <span *ngIf="publicationInfo.similarPublications == undefined" class="badge">0</span>
169
                            <span *ngIf="publicationInfo.similarPublications != undefined" class="badge">{{publicationInfo.similarPublications.size}}</span>
170
                        </a>
171
                    </li>
172
                    <li role="presentation" *ngIf="publicationInfo.bioentities != undefined">
173
                        <a data-toggle="tab" href="#bioentitiesTab">
174
                            Bioentities
175
                            <span class="badge">{{bioentitiesNum}}</span>
176
                        </a>
177
                    </li>
178
                  </ul>
179

    
180
                  <div class="tab-content">
181

    
182
                      <div id="citationsTab" class="tab-pane fade in active panel-body">
183

    
184
                        <div *ngIf="publicationInfo.references == undefined" class = "alert alert-info " >
185
                          There are no references
186
                        </div>
187
                        <div *ngIf="publicationInfo.references != undefined">
188

    
189
                            <div class="panel panel-default" *ngIf="!showAllReferences && publicationInfo.references.length > 10">
190
                                <div class="panel-heading">
191
                                    <a (click)="showAllReferences = true;">
192
                                        <div class="text-right">view all {{publicationInfo.references.length}}</div>
193
                                    </a>
194
                                </div>
195
                            </div>
196

    
197
                            <div *ngIf="!showAllReferences">
198
                              <div *ngFor="let item of publicationInfo.references.slice(0,10)">
199
                                       <p *ngIf=" item != undefined && item['url'] != undefined">
200
                                          <a class="custom-external" href="{{item['url']}}" target="_blank">
201
                                              {{item['text']}}
202
                                          </a>
203
                                      </p>
204
                                      <p *ngIf="item['url'] == undefined">
205
                                          {{item['text']}}
206
                                      </p>
207
                               </div>
208
                            </div>
209

    
210
                            <div *ngIf="showAllReferences">
211
                              <div *ngFor="let item of publicationInfo.references.slice(10)">
212
                                       <p *ngIf=" item != undefined && item['url'] != undefined">
213
                                          <a class="custom-external" href="{{item['url']}}" target="_blank">
214
                                              {{item['text']}}
215
                                          </a>
216
                                      </p>
217
                                      <p *ngIf="item['url'] == undefined">
218
                                          {{item['text']}}
219
                                      </p>
220
                               </div>
221
                            </div>
222

    
223
                            <div class="panel panel-default" *ngIf="!showAllReferences && publicationInfo.references.length > 10">
224
                                <div class="text-right" class="panel-heading">
225
                                    <a (click)="showAllReferences = true;">
226
                                        <div class="text-right" >view all {{publicationInfo.references.length}}</div>
227
                                    </a>
228
                                </div>
229
                            </div>
230
                        </div>
231
                      </div>
232

    
233
                      <div id="dataTab" class="tab-pane fade panel-body">
234
                      <div *ngIf="publicationInfo.relatedResearchData == undefined" class = "alert alert-info " >
235
                        There are no related research data
236
                      </div>
237
                           <table  *ngIf="publicationInfo.relatedResearchData != undefined" id="inferredTable" class="table table-striped">
238
                              <thead>
239
                                  <tr role="row">
240
                                      <th>Title</th>
241
                                      <th>Trust</th>
242
                                  </tr>
243
                              </thead>
244
                              <tbody>
245
                                  <tr *ngFor="let key of publicationInfo.relatedResearchData.keys()">
246
                                      <td *ngIf="key != undefined">
247
                                        <a class="custom-external" href="{{key}}" target="_blank">
248
                                            {{publicationInfo.relatedResearchData.get(key)[0]}}
249
                                        </a>
250
                                        <span *ngIf="publicationInfo.relatedResearchData.get(key)[1] != ''">
251
                                            ({{publicationInfo.relatedResearchData.get(key)[1]}})
252
                                        </span>
253
                                      </td>
254
                                      <td>
255
                                          <div class="progress">
256
                                              <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="29" aria-valuemin="0" aria-valuemax="100" [style.width] = "publicationInfo.relatedResearchData.get(key)[2]">
257
                                                  {{publicationInfo.relatedResearchData.get(key)[2]}}
258
                                              </div>
259
                                          </div>
260
                                      </td>
261
                                  </tr>
262

    
263
                              </tbody>
264
                          </table>
265
                      </div>
266

    
267

    
268
                      <div id="similarTab" class="tab-pane fade panel-body">
269
                          <div  *ngIf="publicationInfo.similarPublications == undefined"  class = "alert alert-info " >
270
                            There are no similar publications
271
                          </div>
272
                           <table  *ngIf="publicationInfo.similarPublications != undefined" id="similarTable" class="table table-striped">
273
                              <thead>
274
                                  <tr>
275
                                      <th>Title</th>
276
                                      <th>Trust</th>
277
                                  </tr>
278
                              </thead>
279
                              <tbody  >
280
                                  <tr *ngFor="let key of publicationInfo.similarPublications.keys()">
281
                                      <td *ngIf="key != undefined">
282
                                        <a class="custom-external" href="{{key}}" target="_blank">
283
                                            {{publicationInfo.similarPublications.get(key)[0]}}
284
                                        </a>
285
                                        <span *ngIf="publicationInfo.similarPublications.get(key)[1] != ''">
286
                                            ({{publicationInfo.similarPublications.get(key)[1]}})
287
                                        </span>
288
                                      </td>
289
                                      <td>
290
                                        <div class="progress">
291
                                          <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="29" aria-valuemin="0" aria-valuemax="100" [style.width] = "publicationInfo.similarPublications.get(key)[2]">
292
                                            {{publicationInfo.similarPublications.get(key)[2]}}</div>
293
                                        </div>
294
                                      </td>
295
                                  </tr>
296

    
297

    
298
                              </tbody>
299
                          </table>
300
                      </div>
301
                      <div *ngIf="publicationInfo.bioentities != undefined" id="bioentitiesTab" class="tab-pane fade panel-body">
302
                           <table id="bioentitiesTable" class="table table-striped">
303
                              <thead>
304
                                  <tr>
305
                                      <th>Bio Entity</th>
306
                                      <th>Site Name</th>
307
                                  </tr>
308
                              </thead>
309
                              <div *ngIf="publicationInfo.bioentities != undefined">
310
                                  <tbody *ngFor="let key of publicationInfo.bioentities.keys()">
311
                                      <div *ngIf="publicationInfo.bioentities.get(key) != undefined">
312
                                          <tr *ngFor="let keyIn of publicationInfo.bioentities.get(key).keys()">
313
                                              <td *ngIf="keyIn != undefined">
314
                                                  <a href="{{publicationInfo.bioentities.get(key).get(keyIn)}}" target="_blank">
315
                                                      {{keyIn}}
316
                                                  </a>
317
                                              </td>
318
                                              <td>
319
                                                  {{key}}
320
                                              </td>
321
                                          </tr>
322
                                      </div>
323
                                  </tbody>
324

    
325
                              </div>
326
                          </table>
327

    
328
                      </div>
329

    
330
                  </div>
331
                  </div>
332
                  <div class="col-xs-12 col-sm-3" *ngIf="publicationInfo != null">
333

    
334
                  <ul class="list-group mainFunctionsBlock">
335
                    <li class="list-group-item">
336
                      <dl class="functionsSection" *ngIf="publicationInfo.collectedFrom != undefined">
337
                          <dt  >Collected from</dt>
338
                          <dd  *ngFor="let key of publicationInfo.collectedFrom.keys()">
339
                            <a href="{{publicationInfo.collectedFrom.get(key)}}">
340
                              {{key}}
341
                            </a>
342
                           </dd>
343
                      </dl>
344
                      </li>
345
                      <li class="list-group-item">
346
                      <dl class="functionsSection" *ngIf="publicationInfo.downloadFrom != undefined && publicationInfo.downloadFrom.size > 0">
347
                          <dt class="title">Download from</dt>
348
                          <dd class="line" *ngFor="let key of publicationInfo.downloadFrom.keys()">
349
                            <a href="{{key}}">
350
                               {{publicationInfo.downloadFrom.get(key)[1]}}
351
                            </a>
352
                          </dd>
353
                      </dl>
354
                      </li>
355

    
356

    
357
                      <li class="list-group-item">
358
                      <dl class="functionsSection" *ngIf="publicationInfo.fundedByProjects != undefined">
359
                          <dt class="title">Funded By</dt>
360
                          <dd class="line" *ngFor="let key of publicationInfo.fundedByProjects.values()">
361
                            <a *ngIf="!key[5]" href="{{publicationInfo.fundedByProjects.get(key)}}">
362
                            {{key[0]?key[0]:key[1]}} | {{ (key[4])?key[4]:key[3]}} </a>
363

    
364
                            <a *ngIf="key[5]" href="{{publicationInfo.fundedByProjects.get(key)}}">
365
                          <mark>{{((key[0])?key[0]:key[1])}} | {{ ((key[4])?key[4]:key[3])}} </mark> </a>
366

    
367

    
368

    
369
                          </dd>
370
                      </dl>
371
                      <dl class="functionsSection" *ngIf="publicationInfo.fundedByProjects == undefined">
372
                          <dt class="title">Funded By</dt>
373
                      </dl>
374
                        <button (click)="toggleClaimProject()"  class = "btn btn-default   btn-xs" >Add more Projects</button>
375
                        <inline-claim-project *ngIf="result "  inline="true" inlineType ="publication" [inlineEntity]="result"  (projectAdded)="projectAdded($event)" ></inline-claim-project>
376
                      </li>
377
                      <li class="list-group-item">
378
                       <dl class="functionsSection" *ngIf="publicationInfo.contexts != undefined">
379
                          <dt class="title">Related to </dt>
380
                          <dd class="line" *ngFor="let item of publicationInfo.contexts">
381
                            <span>{{item['labelContext']}}</span>
382
                            <span *ngIf="item['labelCategory'] != null">-> {{item['labelCategory']}}</span>
383
                            <span *ngIf="item['labelConcept'] != null">: {{item['labelConcept']}}</span>
384
                          </dd>
385
                        </dl>
386
                        <dl class="functionsSection" *ngIf="publicationInfo.contexts == undefined">
387
                           <dt class="title">Related to </dt>
388

    
389
                         </dl>
390
                        <button (click)=" toggleClaimContext()" class = "btn btn-default   btn-xs" >Add Contexts</button>
391
                        <inline-claim-context   inline="true" inlineType ="publication" [inlineEntity]="result"  ></inline-claim-context>
392
                      </li>
393

    
394
                  </ul>
395
                  </div>
396
                  </div>
397
            </div>
398

    
399

    
400
        </div>
401

    
402

    
403

    
404
     `,
405
    providers:[JSONP_PROVIDERS, PublicationService],
406
    directives:[InlineClaimContextComponent, InlineClaimProjectComponent]
407
})
408

    
409
export class PublicationComponent {
410
  constructor (private _publicationService: PublicationService, private _routeParams: RouteParams) {
411
    console.info('publication constructor');
412
    this.params = _routeParams;
413
  }
414
  ngOnInit() {
415
     this.getPublicationInfo();
416
}
417

    
418
  private publicationInfo: PublicationInfo;
419
  private params: RouteParams;
420

    
421
  private showAllAuthors: boolean = false;
422
  private showStyle: boolean = false;
423
  private showAllReferences: boolean = false;
424
  private showAllRelResData: boolean = false;
425
  private showAllSimilPubl: boolean = false;
426
  private showAllBioentities: boolean = false;
427

    
428
  private bioentitiesNum: number = 0;
429

    
430
  private result ;
431
  private claimInline:string = "none" ;
432

    
433
  @ViewChild (InlineClaimProjectComponent) inlineClaimProject : InlineClaimProjectComponent ;
434
  @ViewChild (InlineClaimContextComponent) inlineClaimContext : InlineClaimContextComponent ;
435

    
436
  public warningMessage = "";
437
  public errorMessage = "";
438

    
439
  getPublicationInfo() {
440
    this.warningMessage = '';
441
    this.errorMessage=""
442
    if(this.params.get("articleId")==null || this.params.get("articleId")==''){
443
      this.warningMessage="No valid publication id";
444
      console.info("novalid");
445
    }else{
446
console.info("do request");
447
      this._publicationService.getPublicationInfo(this.params.get("articleId")).subscribe(
448
        data => {
449
            this.publicationInfo = data;
450

    
451
            let bioentitiesNum = 0;
452
            if(this.publicationInfo.bioentities != undefined) {
453
                this.publicationInfo.bioentities.forEach(function (value, key, map) {
454
                    bioentitiesNum += value.size;
455
                });
456
            }
457
            this.bioentitiesNum = bioentitiesNum;
458

    
459
            this.result = []
460
            let result_  ={id: this.params.get("articleId"), type :"publication", source : "openaire", title: this.publicationInfo.title,url: '', result: '', accessRights: this.publicationInfo.bestlicense, embargoEndDate: ''};
461
            this.result.push(result_);
462
        },
463
        err => {
464
          console.error(err)
465
          console.info("error");
466

    
467
          this.errorMessage = 'No publication found';
468
        }
469
      );
470
    }
471
   }
472

    
473
   /*
474
   ********* Methods for Inline Claim  of project / publication *****
475
     */
476
   toggleClaimProject(){
477
      this.inlineClaimProject.toggle();
478
   }
479
   projectAdded($event){
480
     var projects =$event.value;
481
     if(projects){
482
        for(var i=0; i < projects.length; i++){
483

    
484
          if(this.publicationInfo.fundedByProjects == undefined) {
485
              this.publicationInfo.fundedByProjects = new Map<string, string[]>();
486
          }
487
          var project =projects[i];
488
          this.publicationInfo.fundedByProjects.set(project.projectId, new Array<string>());
489
          this.publicationInfo.fundedByProjects.get(project.projectId)[0] = project.projectAcronym;
490
          this.publicationInfo.fundedByProjects.get(project.projectId)[1] = project.projectName;
491
          this.publicationInfo.fundedByProjects.get(project.projectId)[2] =project.selectedFunderId;
492
          this.publicationInfo.fundedByProjects.get(project.projectId)[3] = project.selectedFunderName;
493
          this.publicationInfo.fundedByProjects.get(project.projectId)[5] = "new";
494
        }
495
      }
496
    }
497
    toggleClaimContext(){
498
       this.inlineClaimContext.toggle();
499
    }
500
    contextAdded($event){
501
      var contexts =$event.value;
502
      if(contexts){
503
         for(var i=0; i < contexts.length; i++){
504

    
505
         }
506
       }
507
     }
508
}
    (1-1/1)