fs-modal changes
This commit is contained in:
parent
9f57b1c459
commit
0a46aea1e7
|
|
@ -30,7 +30,7 @@ import {FullScreenModalComponent} from '../utils/modal/full-screen-modal/full-sc
|
|||
Find the appropriate repository to deposit your research.
|
||||
</div>
|
||||
<div class="uk-margin-medium-top" uk-scrollspy-class>
|
||||
<a class="uk-button uk-button-primary uk-text-uppercase" href="#modal-full" uk-toggle>Get Started</a>
|
||||
<a class="uk-button uk-button-primary uk-text-uppercase" (click)="openFsModal()">Get Started</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -99,62 +99,63 @@ import {FullScreenModalComponent} from '../utils/modal/full-screen-modal/full-sc
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<fs-modal>
|
||||
<div class="uk-height-1-1 uk-padding uk-flex uk-flex-column uk-flex-middle uk-flex-center">
|
||||
<div class="title uk-h2 uk-margin-large-bottom">
|
||||
Find the appropriate repository.
|
||||
</div>
|
||||
<div class="cards uk-grid uk-grid-large" uk-height-match="target: .uk-card-body, .uk-tile-primary;">
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-text-center" style="width: 360px;">
|
||||
<div class="uk-card-body uk-text-small">
|
||||
<img src="assets/common-assets/common/Logo_Horizontal.png" alt="OpenAIRE logo" class="uk-width-small uk-margin-bottom">
|
||||
<div>
|
||||
Search and browse for <span class="uk-text-bold">OpenAIRE compliant repositories</span> registered in OpenDOAR and re3data.
|
||||
</div>
|
||||
</div>
|
||||
<a href="/participate/deposit/search" type="submit"
|
||||
class="uk-card-footer uk-padding-small uk-link-reset uk-tile-primary uk-flex uk-flex-center uk-light">
|
||||
<button class="uk-button uk-button-text">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
<span>OpenAIRE compliant repositories</span>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-text-center" style="width: 360px;">
|
||||
<div class="uk-card-body uk-text-small">
|
||||
<img src="assets/common-assets/common/logo-zenodo.png" alt="Zenodo logo" class="uk-width-small uk-margin-bottom">
|
||||
<div>
|
||||
Deposit your research in <br><span class="uk-text-bold">Zenodo repository</span>
|
||||
</div>
|
||||
</div>
|
||||
<a *ngIf="zenodoInformation.shareInZenodoUrl" type="submit"
|
||||
[queryParams]="properties.environment!='development'?{}:routerHelper.createQueryParam('communityId',communityId)"
|
||||
routerLinkActive="router-link-active" [routerLink]="zenodoInformation.shareInZenodoUrl"
|
||||
class="uk-card-footer uk-padding-small uk-link-reset uk-tile-primary uk-flex uk-flex-center uk-light">
|
||||
<button class="uk-button uk-button-text">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
Use related Zenodo communities
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
<a *ngIf="!zenodoInformation.shareInZenodoUrl" target="_blank" type="submit" href="{{zenodoInformation.url}}"
|
||||
class="uk-card-footer uk-padding-small uk-link-reset uk-tile-primary uk-flex uk-flex-center uk-light">
|
||||
<button class="uk-button uk-button-text">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
Zenodo Repository
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<fs-modal #fsModal>
|
||||
<div class="uk-height-1-1 uk-padding uk-flex uk-flex-column uk-flex-middle uk-flex-center">
|
||||
<div class="title uk-h2 uk-margin-large-bottom">
|
||||
Find the appropriate repository.
|
||||
</div>
|
||||
<div class="cards uk-grid uk-grid-large" uk-height-match="target: .uk-card-body, .uk-tile-primary;">
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-text-center" style="width: 360px;">
|
||||
<div class="uk-card-body uk-text-small">
|
||||
<img src="assets/common-assets/common/Logo_Horizontal.png" alt="OpenAIRE logo" class="uk-width-small uk-margin-bottom">
|
||||
<div>
|
||||
Search and browse for <span class="uk-text-bold">OpenAIRE compliant repositories</span> registered in OpenDOAR and re3data.
|
||||
</div>
|
||||
</div>
|
||||
<a routerLink="/participate/deposit/search" type="submit" (click)="closeFsModal()"
|
||||
class="uk-card-footer uk-padding-small uk-link-reset uk-tile-primary uk-flex uk-flex-center uk-light">
|
||||
<button class="uk-button uk-button-text">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
<span>OpenAIRE compliant repositories</span>
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</fs-modal>
|
||||
</div>
|
||||
<div>
|
||||
<div class="uk-card uk-card-default uk-text-center" style="width: 360px;">
|
||||
<div class="uk-card-body uk-text-small">
|
||||
<img src="assets/common-assets/common/logo-zenodo.png" alt="Zenodo logo" class="uk-width-small uk-margin-bottom">
|
||||
<div>
|
||||
Deposit your research in <br><span class="uk-text-bold">Zenodo repository</span>
|
||||
</div>
|
||||
</div>
|
||||
<a *ngIf="zenodoInformation.shareInZenodoUrl" type="submit"
|
||||
[queryParams]="properties.environment!='development'?{}:routerHelper.createQueryParam('communityId',communityId)"
|
||||
routerLinkActive="router-link-active" [routerLink]="zenodoInformation.shareInZenodoUrl"
|
||||
class="uk-card-footer uk-padding-small uk-link-reset uk-tile-primary uk-flex uk-flex-center uk-light">
|
||||
<button class="uk-button uk-button-text">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
Use related Zenodo communities
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
<a *ngIf="!zenodoInformation.shareInZenodoUrl" target="_blank" type="submit" href="{{zenodoInformation.url}}"
|
||||
class="uk-card-footer uk-padding-small uk-link-reset uk-tile-primary uk-flex uk-flex-center uk-light">
|
||||
<button class="uk-button uk-button-text">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
Zenodo Repository
|
||||
</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</fs-modal>
|
||||
`,
|
||||
})
|
||||
|
||||
|
|
@ -255,7 +256,11 @@ export class DepositFirstPageComponent {
|
|||
this._meta.updateTag({content:url},"property='og:url'");
|
||||
}
|
||||
|
||||
// public openFsModal() {
|
||||
// this.fsModal.open();
|
||||
// }
|
||||
public openFsModal() {
|
||||
this.fsModal.open();
|
||||
}
|
||||
|
||||
public closeFsModal() {
|
||||
this.fsModal.close();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ import {properties} from "../../../environments/environment";
|
|||
<div class="uk-width-large">
|
||||
<div search-input [(value)]="keyword" placeholder="Search by name, description, subject..." (searchEmitter)="keywordChanged()"></div>
|
||||
<div class="uk-margin-top uk-text-center">
|
||||
<a href="{{zenodoInformation.url}}" target="_blank" class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text">
|
||||
<a [href]="zenodoInformation.url" target="_blank" class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text">
|
||||
<span class="uk-flex uk-flex-middle">
|
||||
<span>Zenodo Repository</span><span class="custom-external custom-icon space"></span>
|
||||
</span>
|
||||
|
|
@ -98,6 +98,13 @@ export class SearchDataprovidersToDepositComponent {
|
|||
this.parameters = Object.assign({}, params);
|
||||
this.keyword = params["fv0"]?params["fv0"]:'';
|
||||
});
|
||||
|
||||
if (!this.zenodoInformation) {
|
||||
this.zenodoInformation = new ZenodoInformationClass();
|
||||
}
|
||||
if (!this.zenodoInformation.shareInZenodoUrl) {
|
||||
this.zenodoInformation.url = this.properties.zenodo;
|
||||
}
|
||||
// this.searchPage.refineFields = this.refineFields;
|
||||
// this.searchPage.fieldIdsMap = this.fieldIdsMap;
|
||||
// this.searchPage.keywordFields = this.keywordFields;
|
||||
|
|
|
|||
|
|
@ -1,13 +1,14 @@
|
|||
import {Component, ElementRef, EventEmitter, Input, OnInit, Output} from "@angular/core";
|
||||
import {Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild} from "@angular/core";
|
||||
import {fromEvent, Subscription} from 'rxjs';
|
||||
import {delay} from "rxjs/operators";
|
||||
|
||||
declare var UIkit;
|
||||
@Component({
|
||||
selector: 'fs-modal',
|
||||
template: `
|
||||
<div id="modal-full" class="uk-modal-full" uk-modal>
|
||||
<div #modal_full class="uk-modal-full" uk-modal>
|
||||
<div class="uk-modal-dialog uk-height-1-1">
|
||||
<button class="uk-modal-close-full uk-close-large" type="button" uk-close></button>
|
||||
<button class="uk-modal-close-full uk-close-large uk-margin-medium-top uk-margin-medium-right" type="button" uk-close></button>
|
||||
<div class="uk-height-1-1">
|
||||
<div class="header">
|
||||
<ng-content select="[actions]"></ng-content>
|
||||
|
|
@ -55,7 +56,7 @@ export class FullScreenModalComponent implements OnInit {
|
|||
@Output()
|
||||
cancelEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();
|
||||
opened: boolean = false;
|
||||
private readonly element: any;
|
||||
@ViewChild('modal_full') element: ElementRef;
|
||||
private subscriptions: any[] = [];
|
||||
private clickedInside: boolean;
|
||||
|
||||
|
|
@ -65,7 +66,6 @@ export class FullScreenModalComponent implements OnInit {
|
|||
|
||||
ngOnInit() {
|
||||
if (typeof document !== "undefined") {
|
||||
document.body.appendChild(this.element);
|
||||
this.subscriptions.push(fromEvent(document, 'keydown').pipe(delay(1)).subscribe((event: KeyboardEvent) => {
|
||||
if(event.keyCode === 27) {
|
||||
this.close();
|
||||
|
|
@ -75,7 +75,6 @@ export class FullScreenModalComponent implements OnInit {
|
|||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.element.remove();
|
||||
this.subscriptions.forEach(subscription => {
|
||||
if (subscription instanceof Subscription) {
|
||||
subscription.unsubscribe();
|
||||
|
|
@ -84,18 +83,12 @@ export class FullScreenModalComponent implements OnInit {
|
|||
}
|
||||
|
||||
open() {
|
||||
if (typeof document !== "undefined") {
|
||||
this.opened = true;
|
||||
document.getElementsByTagName('html')[0].classList.add('fs-modal-open');
|
||||
}
|
||||
UIkit.modal(this.element.nativeElement).show();
|
||||
}
|
||||
|
||||
close() {
|
||||
if (typeof document !== "undefined" && this.opened) {
|
||||
document.getElementsByTagName('html')[0].classList.remove('fs-modal-open');
|
||||
this.opened = false;
|
||||
this.cancelEmitter.emit();
|
||||
}
|
||||
UIkit.modal(this.element.nativeElement).hide();
|
||||
this.cancelEmitter.emit();
|
||||
}
|
||||
|
||||
ok() {
|
||||
|
|
|
|||
Loading…
Reference in New Issue