Project

General

Profile

1
import {Component, Input}           from '@angular/core';
2
import {ZenodoInformationClass} from './utils/zenodoInformation.class';
3
import {EnvProperties} from "../utils/properties/env-properties";
4
import {ActivatedRoute, Router} from "@angular/router";
5
import {PiwikService} from "../utils/piwik/piwik.service";
6
import {HelperService} from "../utils/helper/helper.service";
7
import {RouterHelper} from "../utils/routerHelper.class";
8
import {SEOService} from "../sharedComponents/SEO/SEO.service";
9
import {Meta, Title} from "@angular/platform-browser";
10

    
11
@Component({
12
  selector: 'deposit-first-page',
13
  template: `
14
    <schema2jsonld *ngIf="url" [URL]="url" [name]="title" type="other"></schema2jsonld>
15

    
16
    <div class="uk-section uk-padding-remove-bottom uk-padding-remove-top">
17
      <div class="explorePanelBackground communityPanelBackground uk-margin-top uk-padding-small">
18
        <div class="uk-align-center uk-container uk-container-large uk-margin-large-top uk-margin-large-bottom">
19
          <div class="uk-h1 uk-width-1-2@m uk-width-1-1@s">
20
            <span class="uk-text-bold">Deposit or publish</span> your research in <span class="uk-text-bold">Open Access</span>
21
          </div>
22

    
23
          <div class="uk-container uk-container-large uk-margin-medium-top">
24
            <div class="uk-grid-divider" uk-grid>
25
              <div class="uk-width-1-2@m uk-width-1-1@s">
26
<!--                <p class="uk-margin-auto uk-text-large">How to <span class="uk-text-bold">deposit</span> your research...</p>-->
27
                <span class="uk-grid">
28
                  <span class="uk-margin-top uk-icon"><svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="search"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg></span>
29
<!--                  <span class="uk-margin-small-right" uk-icon="search"></span>-->
30
                  <span class="uk-width-expand">
31
                    <div class="uk-margin-small-bottom uk-h6">Find the appropriate repository or journal</div>
32
                    <div class="uk-text-small">
33
                      Find the appropriate repository to deposit your research products of any type (publication, data, software, other) or to include in your data management plan.
34
                      Search and browse for OpenAIRE compliant repositories registered in OpenDOAR and re3data.
35
                      <br>
36
                      Looking for Open Access journals? Find those that suit your 
37
                      <span *ngIf="communityId && communityId != 'openaire'">community </span><span *ngIf="!communityId || communityId == 'openaire'">needs </span> 
38
                      among the journals registered in the Directory of Open Access Journals (DOAJ).
39
                      <br>
40
                      To know more, read the OpenAIRE Open Access primer (<a target="_blank" href="https://www.openaire.eu/oa-basics">https://www.openaire.eu/oa-basics</a>)
41
                    </div>
42
                  </span>
43
                </span>
44
                <span class="uk-margin-top uk-grid">
45
                  <span class="uk-margin-top uk-icon"><svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="upload"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg></span>
46
<!--                  <span class="uk-margin-small-right" uk-icon="upload"></span>-->
47
                  <span class="uk-width-expand">
48
                    <div class="uk-margin-small-bottom uk-h6">Deposit</div>
49
                    <div class="uk-text-small">
50
                      Find the repository to deposit your research or use the Zenodo<span *ngIf="communityId && communityId != 'openaire'"> communities suggested by the community curators</span><span *ngIf="!communityId || communityId == 'openaire'"> repository</span>.                    
51
                    </div>
52
                  </span>
53
                  <span class="uk-margin-top uk-grid">
54
                  <span class="uk-margin-top uk-icon">
55
<!--                    <svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="upload"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8"></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg>-->
56
                    <svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="push"><polygon points="12.15,4 9.5,1.4 6.85,4 6.15,3.3 9.5,0 12.85,3.3"></polygon><line fill="none" stroke="#000" x1="9.5" y1="10" x2="9.5" y2="1"></line><polyline fill="none" stroke="#000" points="6 5.5 3.5 5.5 3.5 18.5 15.5 18.5 15.5 5.5 13 5.5"></polyline></svg>
57
                  </span>
58
<!--                                      <span class="uk-margin-small-right" uk-icon="push"></span>-->
59
                  <span class="uk-width-expand">
60
                    <div class="uk-margin-small-bottom uk-h6">Publish</div>
61
                    <div class="uk-text-small">
62
                      Find the Open Access journals that suit your 
63
                      <span *ngIf="communityId && communityId != 'openaire'">community </span><span *ngIf="!communityId || communityId == 'openaire'">needs </span> 
64
                      among those registered in the Directory of Open Access Journals (DOAJ).
65
                    </div>
66
                  </span>
67
                  </span>
68
                </span>
69
                <div></div>
70
              </div>
71
              <div class="uk-width-1-2@m uk-width-1-1@s">
72
                <p class="uk-margin-auto-top uk-margin-remove-bottom uk-h5">
73
                  Start by <span class="uk-text-bold">searching</span> repositories and journals
74
                </p>
75
                <div class="uk-margin">
76
                  <form class="uk-search uk-search-default uk-width-xlarge@l uk-width-medium@m uk-width-auto">
77
<!--                    <span uk-search-icon class="uk-icon"></span>-->
78
                    <button routerLinkActive="uk-link"
79
                       routerLink="{{depositRoute}}" [queryParams]="{keyword: keyword}"  class="uk-search-icon uk-icon" uk-search-icon>
80
                    </button>
81
                    <input class="uk-search-input uk-input" 
82
                           type="search"  [(ngModel)]="keyword"  name="keyword"
83
                           placeholder="{{searchPlaceHolder}}">
84
                  </form>
85
                </div>
86
                <div class="uk-width-1-6 uk-text-right">
87
<!--                  <hr class="uk-divider-vertical">-->
88
<!--                  <div class=" uk-margin-top uk-margin-bottom uk-padding-small uk-text-bold">OR</div>-->
89
<!--                  <img src="assets/common-assets/OR.svg">-->
90
                  <div class="uk-margin-bottom">
91
                    <svg xmlns="http://www.w3.org/2000/svg" width="27" height="88" viewBox="0 0 27 88">
92
                      <g id="Group_749" data-name="Group 749" transform="translate(-872.168 -490.5)">
93
                        <text class="fill_text" id="OR" transform="translate(872.168 540.271)" font-size="18" font-family="OpenSans-Bold, Open Sans" font-weight="700" opacity="0.8"><tspan x="0" y="0">OR</tspan></text>
94
                        <line class="stroke_line" id="Line_225" data-name="Line 225" y2="30" transform="translate(885.5 490.5)" fill="none" stroke="#000" stroke-width="1" opacity="0.2"/>
95
                        <line class="stroke_line" id="Line_226" data-name="Line 226" y2="30" transform="translate(885.5 548.5)" fill="none" stroke="#000" stroke-width="1" opacity="0.2"/>
96
                      </g>
97
                    </svg>
98
                  </div>
99
                  <!--                  <hr class="uk-divider-vertical">-->
100
                </div>
101
                  
102
                <div>
103
                  <a  [queryParams]="properties.environment!='development'?{}:routerHelper.createQueryParam('communityId',communityId)" routerLinkActive="router-link-active" [routerLink]="depositRoute" 
104
                      type="submit" class="uk-button uk-button-large portal-button uk-padding uk-padding-remove-vertical">
105
                    <span><span>Browse all </span><span uk-icon="arrow-right"></span></span>
106
                  </a>
107
                </div>
108
              </div>
109
            </div>
110
          </div>
111
        </div>
112
      </div>
113
    </div>
114

    
115
    <div class="uk-section tm-middle uk-container uk-container-large uk-margin-small-top uk-padding-remove-top uk-padding-remove-bottom">
116
      <div class="uk-container uk-container-large uk-margin-bottom exploreBorder communityBorder uk-margin-medium-top">
117
        <div class="uk-grid uk-padding">
118
          <div class="uk-width-1-2 uk-text-center">
119
            <div class="uk-margin-top">
120
              <svg xmlns="http://www.w3.org/2000/svg" width="173" height="56.685" viewBox="0 0 173 56.685"><defs><style>.a{fill:#191919;}</style></defs><path class="a" d="M171.749,22.311a16.158,16.158,0,0,0-3.364-4.953A15.511,15.511,0,0,0,157.4,12.837a15.213,15.213,0,0,0-6.074,1.206,16.4,16.4,0,0,0-2.63,1.424,16.2,16.2,0,0,0-2.325,1.891,14.893,14.893,0,0,0-1.242,1.383,19.241,19.241,0,0,0-1.173,1.7,19.372,19.372,0,0,0-1.482,3.343c.048-1.943.332-4.842,1.482-6.468V3.272a3.081,3.081,0,0,0-.993-2.323,3.251,3.251,0,0,0-5.556,2.323V15.765a17.084,17.084,0,0,0-4.261-2.156,14.8,14.8,0,0,0-4.781-.773,15.314,15.314,0,0,0-6.028,1.206,15.575,15.575,0,0,0-4.959,3.316,16.056,16.056,0,0,0-3.352,4.953c-.063.142-.118.286-.177.43-.056-.144-.111-.288-.173-.43a16.158,16.158,0,0,0-3.364-4.953,15.519,15.519,0,0,0-4.95-3.316,15.795,15.795,0,0,0-12.105,0,16.068,16.068,0,0,0-4.954,3.316,15.182,15.182,0,0,0-3.359,4.953c-.058.136-.109.272-.162.407-.056-.135-.109-.271-.167-.407a16.056,16.056,0,0,0-3.357-4.953,15.532,15.532,0,0,0-4.956-3.316,15.795,15.795,0,0,0-12.105,0,16.084,16.084,0,0,0-4.948,3.316,15.129,15.129,0,0,0-3.366,4.953c-.051.125-.1.253-.148.378-.051-.125-.1-.253-.155-.378a16.165,16.165,0,0,0-3.366-4.953,15.489,15.489,0,0,0-10.979-4.521,15.185,15.185,0,0,0-6.072,1.206,16.01,16.01,0,0,0-4.622,3.017v-.521A3.335,3.335,0,0,0,27.211,13.2H3.837a3.334,3.334,0,0,0,0,6.669h18.37L.658,48.884A3.333,3.333,0,0,0,0,50.872v2.176a3.337,3.337,0,0,0,3.336,3.336H28.214a3.335,3.335,0,0,0,3.324-3.09,15.693,15.693,0,0,0,3.675,2.184,15.189,15.189,0,0,0,6.031,1.207A14.892,14.892,0,0,0,49.857,54.1a15.447,15.447,0,0,0,4.827-5.188v4.5a3.245,3.245,0,0,0,3.277,3.275,3.194,3.194,0,0,0,2.281-.949,3.077,3.077,0,0,0,.991-2.326V41.733h-.012a.087.087,0,0,1,.012-.015h-8.17a3.175,3.175,0,0,0-1.851.558,3.007,3.007,0,0,0-1.161,1.507l-.535,1.1a8.969,8.969,0,0,1-8.271,5.254,9.141,9.141,0,0,1-3.493-.684,8.463,8.463,0,0,1-2.883-1.939,9.963,9.963,0,0,1-1.94-2.888,8.4,8.4,0,0,1-.729-3.447V38.252H61.234V28.34a8.74,8.74,0,0,1,.688-3.442,8.959,8.959,0,0,1,8.355-5.515,9.117,9.117,0,0,1,3.493.687,8.459,8.459,0,0,1,2.883,1.94,10.032,10.032,0,0,1,1.94,2.889,8.36,8.36,0,0,1,.734,3.442V53.409A3.233,3.233,0,0,0,82.6,56.684a3.211,3.211,0,0,0,2.286-.949,3.107,3.107,0,0,0,.986-2.326v-4.5a15.828,15.828,0,0,0,2.482,3.249,15.454,15.454,0,0,0,4.954,3.314,15.671,15.671,0,0,0,12.061,0,16.035,16.035,0,0,0,5-3.314,15.226,15.226,0,0,0,3.359-4.951c.044-.112.087-.225.129-.338.046.113.087.226.134.338a15.068,15.068,0,0,0,3.359,4.951,16.075,16.075,0,0,0,4.951,3.314,15.79,15.79,0,0,0,12.109,0,15.476,15.476,0,0,0,4.946-3.314,16.166,16.166,0,0,0,3.366-4.951c.06-.142.116-.283.173-.426.058.143.111.284.173.426a16.07,16.07,0,0,0,3.359,4.951,15.454,15.454,0,0,0,4.954,3.314,15.671,15.671,0,0,0,12.061,0,16.008,16.008,0,0,0,5-3.314A15.314,15.314,0,0,0,173,41.178V28.341A14.991,14.991,0,0,0,171.749,22.311ZM8.35,49.716,25.794,26.224a16.054,16.054,0,0,0-.143,2.117V41.178A14.759,14.759,0,0,0,26.9,47.211a16.514,16.514,0,0,0,1.366,2.5H8.35ZM50.285,31.7H32.2V28.34a8.738,8.738,0,0,1,.686-3.442,8.951,8.951,0,0,1,8.36-5.515,9.1,9.1,0,0,1,3.486.687,8.423,8.423,0,0,1,2.885,1.94,10.033,10.033,0,0,1,1.94,2.889,8.318,8.318,0,0,1,.729,3.442V31.7Zm58.093,9.48a8.7,8.7,0,0,1-.688,3.447,8.941,8.941,0,0,1-8.352,5.511,9.141,9.141,0,0,1-3.493-.684,8.417,8.417,0,0,1-2.883-1.939,9.917,9.917,0,0,1-1.94-2.888,8.353,8.353,0,0,1-.729-3.447V28.341A8.74,8.74,0,0,1,90.98,24.9a8.935,8.935,0,0,1,1.937-2.889,9.165,9.165,0,0,1,9.9-1.94,8.433,8.433,0,0,1,2.888,1.94,10.129,10.129,0,0,1,1.94,2.889,8.356,8.356,0,0,1,.729,3.442V41.178Zm29.035,0a8.32,8.32,0,0,1-.729,3.447,9.947,9.947,0,0,1-1.94,2.888,8.358,8.358,0,0,1-2.888,1.939,9.337,9.337,0,0,1-7.018,0,9.046,9.046,0,0,1-4.825-4.826,8.735,8.735,0,0,1-.69-3.447V28.341a8.439,8.439,0,0,1,.732-3.442,10.1,10.1,0,0,1,1.94-2.889,8.522,8.522,0,0,1,2.883-1.94,9.152,9.152,0,0,1,3.493-.687,8.985,8.985,0,0,1,8.357,5.515,8.775,8.775,0,0,1,.686,3.442V41.178Zm29.035,0a8.82,8.82,0,0,1-.686,3.447,9.129,9.129,0,0,1-11.85,4.826,8.424,8.424,0,0,1-2.882-1.939,9.946,9.946,0,0,1-1.942-2.888,8.337,8.337,0,0,1-.732-3.447V28.341a8.742,8.742,0,0,1,.69-3.442,8.935,8.935,0,0,1,1.937-2.889,9.169,9.169,0,0,1,9.905-1.94,8.423,8.423,0,0,1,2.885,1.94,10.088,10.088,0,0,1,1.942,2.889,8.356,8.356,0,0,1,.729,3.442V41.178Z"/></svg>
121
            </div>
122
            <div class="uk-margin-top">
123
              <span class="uk-text-bold">Deposit</span> your research now. <span class="uk-text-bold">Instantly and easily.</span>
124
            </div>
125
            <a *ngIf="zenodoInformation.shareInZenodoUrl" type="submit"
126
               [queryParams]="properties.environment!='development'?{}:routerHelper.createQueryParam('communityId',communityId)" 
127
               routerLinkActive="router-link-active" [routerLink]="zenodoInformation.shareInZenodoUrl"
128
               class="uk-button portal-button uk-padding uk-padding-remove-vertical uk-margin-medium-top uk-margin-bottom">
129
              <span><span>Related zenodo communities</span><span uk-icon="arrow-right"></span></span>
130
            </a>
131
            <a *ngIf="!zenodoInformation.shareInZenodoUrl" target="_blank" href="{{zenodoInformation.url}}" type="submit"
132
               [class]="'uk-button uk-padding uk-padding-remove-vertical uk-margin-medium-top uk-margin-bottom' +
133
                        ((communityId && communityId != 'openaire') ? ' portal-button' : ' uk-button-primary')">
134
              <span><span>Deposit in Zenodo</span><span uk-icon="arrow-right"></span></span>
135
            </a>
136
          </div>
137
          <div class="uk-width-1-2">
138
            <div class="uk-margin-top">
139
              <div class="uk-text-bold">Research. Shared.</div>
140
              <div>
141
                All research outputs from across all fields of research are welcome! Sciences and Humanities, really!              </div>
142
            </div>
143
            <div class="uk-margin-top">
144
              <div class="uk-text-bold">Citeable. Discoverable. </div>
145
              <div>
146
                Uploads gets a Digital Object Identifier (DOI) to make them easily and uniquely citeable.
147
              </div>
148
            </div>
149
            <div class="uk-margin-top">
150
              <div class="uk-text-bold">Funding</div>
151
              <div>
152
<!--                Identify grants, integrated in reporting lines for research funded by the European Commission via OpenAIRE.-->
153
                Link your upload to its funding projects. For research funded by the European Commission, your upload will automatically be available for reporting on the EC participant portal.
154
              </div>
155
            </div>
156
            <div class="uk-margin-top">
157
              <div class="uk-text-bold">Flexible licensing</div>
158
              <div>
159
                Because not everything is under Creative Commons.
160
              </div>
161
            </div>
162
            <div class="uk-margin-top">
163
              <div class="uk-text-bold">Safe</div>
164
              <div>
165
                Your research output is stored safely for the future in the same cloud infrastructure as CERN's own LHC research data.
166
              </div>
167
            </div>
168
          </div>
169
        </div>
170
      </div>
171
    </div>
172

    
173
    <!--<div class="uk-section uk-section-muted uk-margin-large-top uk-padding-remove-bottom uk-padding-remove-top">
174
&lt;!&ndash;      grey-background&ndash;&gt;
175
      <div class="uk-margin-top uk-padding-small">
176
        <div class="uk-align-center uk-container uk-container-large uk-margin-top uk-margin-bottom">
177
          <helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0" [texts]="pageContents['bottom']"></helper>
178
        </div>
179
      </div>
180
    </div>-->
181
    <helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0" [texts]="pageContents['bottom']"></helper>
182
  `
183
})
184

    
185
export class DepositFirstPageComponent {
186
  public url: string = null;
187
  public title: string = "Deposit your research - Learn How";
188

    
189
  @Input() public zenodoInformation: ZenodoInformationClass = new ZenodoInformationClass();
190
  @Input() piwikSiteId = null;
191
  piwiksub:any;
192

    
193
  @Input() communityId = null;
194

    
195
  public pageContents = null;
196
  public divContents = null;
197

    
198
  public keyword: string;
199
  public depositRoute: string;
200
  public searchPlaceHolder = "Search by title, country, organization, subject, type...";
201
  properties:EnvProperties;
202
  public routerHelper:RouterHelper = new RouterHelper();
203

    
204
  constructor (private  route: ActivatedRoute, private _piwikService:PiwikService,
205
               private helper: HelperService,
206
               private _router: Router,
207
               private _meta: Meta, private _title: Title,
208
               private seoService: SEOService) {
209
  }
210

    
211

    
212
  ngOnInit() {
213
    this.route.data
214
      .subscribe((data: { envSpecific: EnvProperties }) => {
215
        this.properties = data.envSpecific;
216
        this.url = this.properties.baseLink+this._router.url;
217
        this.seoService.createLinkForCanonicalURL(this.url, false);
218

    
219
        var description = "Openaire, Zenodo, repositories, open access, content provider, compatibility, deposit";
220
        this.updateTitle(this.title);
221
        this.updateDescription(description);
222
        this.updateUrl(this.url);
223

    
224
        this.depositRoute = this.properties.depositSearchPage;
225
        //this.getDivContents();
226
        this.getPageContents();
227
        if (!this.zenodoInformation) {
228
          this.zenodoInformation = new ZenodoInformationClass();
229
        }
230
        if (!this.zenodoInformation.shareInZenodoUrl) {
231
          this.zenodoInformation.url = this.properties.zenodo;
232
        }
233
        if (!this.zenodoInformation.name) {
234
          this.zenodoInformation.name = "Zenodo";
235
        }
236

    
237
        if(this.properties.enablePiwikTrack && (typeof document !== 'undefined')){
238
          this.piwiksub = this._piwikService.trackView(this.properties, this.title, this.piwikSiteId).subscribe();
239
        }
240
      });
241
  }
242

    
243
  public getPageContents() {
244
    this.helper.getPageHelpContents(this._router.url, this.properties, this.communityId).subscribe(contents => {
245
      this.pageContents = contents;
246
    })
247
  }
248

    
249
  public getDivContents() {
250
    this.helper.getDivHelpContents(this._router.url, this.properties, this.communityId).subscribe(contents => {
251
      this.divContents = contents;
252
    })
253
  }
254

    
255
  ngOnDestroy() {
256
    if(this.piwiksub){
257
      this.piwiksub.unsubscribe();
258
    }
259
  }
260

    
261
  private updateDescription(description:string) {
262
    this._meta.updateTag({content:description},"name='description'");
263
    this._meta.updateTag({content:description},"property='og:description'");
264
  }
265
  private updateTitle(title:string) {
266
    var _prefix ="";
267
    if(!this.communityId) {
268
      _prefix ="OpenAIRE | ";
269
    }
270
    var _title = _prefix + ((title.length> 50 ) ?title.substring(0,50):title);
271
    this._title.setTitle(_title);
272
    this._meta.updateTag({content:_title},"property='og:title'");
273
  }
274
  private updateUrl(url:string) {
275
    this._meta.updateTag({content:url},"property='og:url'");
276
  }
277
}
(4-4/11)