fs-modal changes

This commit is contained in:
Alex Martzios 2022-05-30 17:56:47 +03:00
parent 9f57b1c459
commit 0a46aea1e7
3 changed files with 77 additions and 72 deletions

View File

@ -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,7 +99,9 @@ import {FullScreenModalComponent} from '../utils/modal/full-screen-modal/full-sc
</div>
</div>
</div>
<fs-modal>
</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.
@ -113,7 +115,7 @@ import {FullScreenModalComponent} from '../utils/modal/full-screen-modal/full-sc
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"
<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">
@ -154,7 +156,6 @@ import {FullScreenModalComponent} from '../utils/modal/full-screen-modal/full-sc
</div>
</div>
</fs-modal>
</div>
`,
})
@ -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();
}
}

View File

@ -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;

View File

@ -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,19 +83,13 @@ 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;
UIkit.modal(this.element.nativeElement).hide();
this.cancelEmitter.emit();
}
}
ok() {
this.close();