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 -->
37
<!--                      <span *ngIf="communityId != 'openaire'">your community</span><span *ngIf="communityId == 'openaire'">you</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 (https://www.openaire.eu/oa-basics)-->
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
                      <br>
66
                      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>)
67
                    </div>
68
                  </span>
69
                  </span>
70
                </span>
71
                <div></div>
72
              </div>
73
              <div class="uk-width-1-2@m uk-width-1-1@s">
74
                <p class="uk-margin-auto-top uk-margin-remove-bottom uk-h5">
75
                  Start by <span class="uk-text-bold">searching</span> repositories and journals
76
                </p>
77
                <div class="uk-margin">
78
                  <form class="uk-search uk-search-default uk-width-xlarge@l uk-width-medium@m uk-width-auto">
79
<!--                    <span uk-search-icon class="uk-icon"></span>-->
80
                    <button routerLinkActive="uk-link"
81
                       routerLink="{{depositRoute}}" [queryParams]="{keyword: keyword}"  class="uk-search-icon uk-icon" uk-search-icon>
82
                    </button>
83
                    <input class="uk-search-input uk-input" 
84
                           type="search"  [(ngModel)]="keyword"  name="keyword"
85
                           placeholder="{{searchPlaceHolder}}">
86
                  </form>
87
                </div>
88
                <div class="uk-width-1-6 uk-text-right">
89
<!--                  <hr class="uk-divider-vertical">-->
90
<!--                  <div class=" uk-margin-top uk-margin-bottom uk-padding-small uk-text-bold">OR</div>-->
91
<!--                  <img src="assets/common-assets/OR.svg">-->
92
                  <div class="uk-margin-bottom">
93
                    <svg xmlns="http://www.w3.org/2000/svg" width="27" height="88" viewBox="0 0 27 88">
94
                      <g id="Group_749" data-name="Group 749" transform="translate(-872.168 -490.5)">
95
                        <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>
96
                        <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"/>
97
                        <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"/>
98
                      </g>
99
                    </svg>
100
                  </div>
101
                  <!--                  <hr class="uk-divider-vertical">-->
102
                </div>
103
                  
104
                <div>
105
                  <a  [queryParams]="properties.environment!='development'?{}:routerHelper.createQueryParam('communityId',communityId)" routerLinkActive="router-link-active" [routerLink]="depositRoute" 
106
                      type="submit" class="uk-button uk-button-large portal-button uk-padding uk-padding-remove-vertical">
107
                    <span><span>Browse all </span><span uk-icon="arrow-right"></span></span>
108
                  </a>
109
                </div>
110
              </div>
111
            </div>
112
          </div>
113
        </div>
114
      </div>
115
    </div>
116

    
117
    <div class="uk-section tm-middle uk-container uk-container-large uk-margin-small-top uk-padding-remove-top uk-padding-remove-bottom">
118
      <div class="uk-container uk-container-large uk-margin-bottom exploreBorder communityBorder uk-margin-medium-top">
119
        <div class="uk-grid uk-padding">
120
          <div class="uk-width-1-2 uk-text-center">
121
            <div class="uk-margin-top">
122
              <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>
123
            </div>
124
            <div class="uk-margin-top">
125
              <span class="uk-text-bold">Deposit</span> your research now. <span class="uk-text-bold">Instantly and easily.</span>
126
            </div>
127
            <a *ngIf="zenodoInformation.shareInZenodoUrl" type="submit"
128
               [queryParams]="properties.environment!='development'?{}:routerHelper.createQueryParam('communityId',communityId)" 
129
               routerLinkActive="router-link-active" [routerLink]="zenodoInformation.shareInZenodoUrl"
130
               class="uk-button portal-button uk-padding uk-padding-remove-vertical uk-margin-medium-top uk-margin-bottom">
131
              <span><span>Related zenodo communities</span><span uk-icon="arrow-right"></span></span>
132
            </a>
133
            <a *ngIf="!zenodoInformation.shareInZenodoUrl" target="_blank" href="{{zenodoInformation.url}}" type="submit"
134
               [class]="'uk-button uk-padding uk-padding-remove-vertical uk-margin-medium-top uk-margin-bottom' +
135
                        ((communityId && communityId != 'openaire') ? ' portal-button' : ' uk-button-primary')">
136
              <span><span>Deposit in Zenodo</span><span uk-icon="arrow-right"></span></span>
137
            </a>
138
          </div>
139
          <div class="uk-width-1-2">
140
            <div class="uk-margin-top">
141
              <div class="uk-text-bold">Research. Shared.</div>
142
              <div>
143
                All research outputs from across all fields of research are welcome! Sciences and Humanities, really!              </div>
144
            </div>
145
            <div class="uk-margin-top">
146
              <div class="uk-text-bold">Citeable. Discoverable. </div>
147
              <div>
148
                Uploads gets a Digital Object Identifier (DOI) to make them easily and uniquely citeable.
149
              </div>
150
            </div>
151
            <div class="uk-margin-top">
152
              <div class="uk-text-bold">Funding</div>
153
              <div>
154
                Identify grants, integrated in reporting lines for research funded by the European Commission via OpenAIRE.
155
              </div>
156
            </div>
157
            <div class="uk-margin-top">
158
              <div class="uk-text-bold">Flexible licensing</div>
159
              <div>
160
                Because not everything is under Creative Commons.
161
              </div>
162
            </div>
163
            <div class="uk-margin-top">
164
              <div class="uk-text-bold">Safe</div>
165
              <div>
166
                Your research output is stored safely for the future in the same cloud infrastructure as CERN's own LHC research data.
167
              </div>
168
            </div>
169
          </div>
170
        </div>
171
      </div>
172
    </div>
173

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

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

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

    
194
  @Input() communityId = null;
195

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

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

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

    
212

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

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

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

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

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

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

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

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