From 86ba54c7d0e4847d50ef9fb11cb0aec071964151 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Tue, 25 Jul 2023 19:09:09 +0300 Subject: [PATCH] Fix mobile-dropdown open-close. Fix input in mobile. Add mobile-dropdown in availableOn, fundedBy, showAuthors. --- .../dataProvider/dataProvider.module.ts | 3 +- .../landing-utils/availableOn.component.ts | 24 +- .../landing-utils/fundedBy.component.ts | 11 +- .../metrics/metrics.component.less | 48 --- .../metrics/metrics.component.ts | 331 ------------------ .../landing-utils/metrics/metrics.module.ts | 29 -- .../resultLandingUtils.module.ts | 3 +- landingPages/project/project.module.ts | 5 +- landingPages/result/resultLanding.module.ts | 5 +- sharedComponents/input/input.component.ts | 2 +- utils/authors/showAuthors.component.ts | 199 ++++++----- utils/authors/showAuthors.module.ts | 6 +- .../mobile-dropdown.component.ts | 40 ++- .../result-preview.component.html | 2 +- 14 files changed, 171 insertions(+), 537 deletions(-) delete mode 100644 landingPages/landing-utils/metrics/metrics.component.less delete mode 100644 landingPages/landing-utils/metrics/metrics.component.ts delete mode 100644 landingPages/landing-utils/metrics/metrics.module.ts diff --git a/landingPages/dataProvider/dataProvider.module.ts b/landingPages/dataProvider/dataProvider.module.ts index 5aa044ba..6cbdf9b4 100644 --- a/landingPages/dataProvider/dataProvider.module.ts +++ b/landingPages/dataProvider/dataProvider.module.ts @@ -5,7 +5,6 @@ import { RouterModule } from '@angular/router'; import {IFrameModule} from '../../utils/iframe.module'; import {ErrorMessagesModule} from '../../utils/errorMessages.module'; -import {MetricsModule} from '../landing-utils/metrics/metrics.module'; import {LandingModule} from '../landing-utils/landing.module'; import {PagingModule} from '../../utils/paging.module'; @@ -41,7 +40,7 @@ import {EntityActionsModule} from "../../utils/entity-actions/entity-actions.mod @NgModule({ imports: [CommonModule, FormsModule, RouterModule, - IFrameModule, ErrorMessagesModule, MetricsModule, LandingModule, + IFrameModule, ErrorMessagesModule, LandingModule, DataProvidersServiceModule, ProjectsServiceModule, SearchResearchResultsServiceModule, PagingModule, Schema2jsonldModule, SEOServiceModule, ShowPublisherModule, HelperModule, LandingHeaderModule, AlertModalModule, NoLoadPaging, FeedbackModule, diff --git a/landingPages/landing-utils/availableOn.component.ts b/landingPages/landing-utils/availableOn.component.ts index f89ef4e0..9a1d217c 100644 --- a/landingPages/landing-utils/availableOn.component.ts +++ b/landingPages/landing-utils/availableOn.component.ts @@ -17,7 +17,7 @@ import {RouterHelper} from "../../utils/routerHelper.class"; uk-tooltip [title]="getAccessLabel(availableOn[0].accessRight)"> - + {{sliceString(availableOn[0].downloadNames.join("; "), 20)}} @@ -32,18 +32,21 @@ import {RouterHelper} from "../../utils/routerHelper.class"; - - - {{sliceString(availableOn[0].downloadNames.join("; "), 20)}} + + + {{sliceString(availableOn[0].downloadNames.join("; "), 20)}} - -
+ +
+ Sources +
+
- +
@@ -97,7 +100,6 @@ export class AvailableOnComponent { /** @deprecated */ @Output() viewAllClicked = new EventEmitter(); @ViewChild("dropElement") dropElement: ElementRef; - @ViewChild("availableListFsModal") availableListFsModal: FullScreenModalComponent; public threshold: number = 1; public dataProviderUrl = properties.searchLinkToDataProvider.split('?')[0]; public title: string = "Download from"; @@ -125,12 +127,6 @@ export class AvailableOnComponent { return StringUtils.sliceString(str, size) } - public openAvailableListFsModal() { - this.availableListFsModal.title = "Sources"; - this.availableListFsModal.okButton = false; - this.availableListFsModal.open(); - } - public getAccessLabel(accessRight) : string { if(accessRight) { return (accessRight + (accessRight.toLowerCase().endsWith(" access") ? "" : " access")); diff --git a/landingPages/landing-utils/fundedBy.component.ts b/landingPages/landing-utils/fundedBy.component.ts index 4b1a7c67..e460155d 100644 --- a/landingPages/landing-utils/fundedBy.component.ts +++ b/landingPages/landing-utils/fundedBy.component.ts @@ -38,11 +38,12 @@ import {RouterHelper} from "../../utils/routerHelper.class"; - -
- -
+ + +
+ +
+ diff --git a/landingPages/landing-utils/metrics/metrics.component.less b/landingPages/landing-utils/metrics/metrics.component.less deleted file mode 100644 index 55dbaebd..00000000 --- a/landingPages/landing-utils/metrics/metrics.component.less +++ /dev/null @@ -1,48 +0,0 @@ -.metrics { - @import (reference) "~src/assets/openaire-theme/less/_import-variables"; - position: relative; - display: inline-block; - - .uk-text-primary { - color: @global-primary-background !important; - } - - .uk-text-background { - background-image: @global-primary-gradient; - } - - .uk-dropdown { - - &::before { - position: absolute; - left: 0; - transform: translateX(-100%); - top: 14px; - width: 0; - height: 0; - content: ''; - border-left: 21px solid transparent; - border-right: 21px solid @global-border; - border-bottom: 21px solid transparent; - border-top: 21px solid transparent; - } - - &::after { - position: absolute; - left: 0; - transform: translateX(-100%); - top: 15px; - width: 0; - height: 0; - content: ''; - border-left: 20px solid transparent; - border-right: 20px solid @global-background; - border-bottom: 20px solid transparent; - border-top: 20px solid transparent; - } - } - - .m-badge img { - width: 35px; - } -} diff --git a/landingPages/landing-utils/metrics/metrics.component.ts b/landingPages/landing-utils/metrics/metrics.component.ts deleted file mode 100644 index 56762c46..00000000 --- a/landingPages/landing-utils/metrics/metrics.component.ts +++ /dev/null @@ -1,331 +0,0 @@ -import {Component, Input, Output, EventEmitter, ChangeDetectorRef} from '@angular/core'; -import {Metrics} from '../../../utils/entities/metrics'; -import {MetricsService} from '../../../services/metrics.service'; -import {ErrorCodes} from '../../../utils/properties/errorCodes'; - -import {Subscription, zip} from 'rxjs'; -import {EnvProperties} from '../../../utils/properties/env-properties'; -import {ClickEvent} from "../../../utils/click/click-outside-or-esc.directive"; -import {NumberUtils} from "../../../utils/number-utils.class"; -import {OpenaireEntities} from "../../../utils/properties/searchFields"; -import {StringUtils} from "../../../utils/string-utils.class"; -import {properties} from "../../../../../environments/environment"; -import {RouterHelper} from "../../../utils/routerHelper.class"; - -@Component({ - selector: 'metrics', - template: ` -
- - usage counts -
- {{formatNumber(total)}} - {{total | number}} -
- -
-
-
- {{openaireEntities.PROJECT}} metrics - are derived from aggregating individual {{openaireEntities.RESULTS}} metrics. - -
-
-
-
- - - {{formatNumber(metrics.totalDownloads)}} - - -
-
Downloads
-
-
-
- - - {{formatNumber(pageViews)}} - - -
-
OpenAIRE views
-
-
-
- - - {{formatNumber(metrics.totalViews)}} - - -
-
Total views
-
-
-
-
-
-
    -
  • - - - - - - - - - - - - - - - -
    FromViewsDownloads
    - - {{metrics.infos.get(key).name}} - - - {{formatNumber(metrics.infos.get(key).numOfViews)}} - {{metrics.infos.get(key).numOfViews | number}} - - - {{formatNumber(metrics.infos.get(key).numOfDownloads)}} - {{metrics.infos.get(key).numOfDownloads | number}} - -
    -
    • - -
  • - -
    • -
  • - -
    • -
-
- - -
-
-
- Powered by - - usage counts - -
-
-
-
- `, - styleUrls: ['metrics.component.less'] -}) - -export class MetricsComponent { - @Input() prevPath: string = ""; - @Output() metricsResults = new EventEmitter(); - @Input() id: string; - @Input() entityType: string; - @Input() entity: string; - //@Input() name: string = ""; - @Input() pageViews: number = 0; - @Input() properties: EnvProperties; - @Input() shortView: boolean = false; - @Input() open = false; - @Input() viewsFrameUrl: string; - @Input() downloadsFrameUrl: string; - - public metrics: Metrics; - public errorCodes: ErrorCodes; - private sub: Subscription; - private timeouts: any[] = []; - - public metricsClicked: boolean = false; - - public status: number; - public state: number = -1; - public openaireEntities = OpenaireEntities; - public routerHelper:RouterHelper = new RouterHelper(); - - constructor(private metricsService: MetricsService, private cdr: ChangeDetectorRef) { - } - - ngOnInit() { - this.errorCodes = new ErrorCodes(); - if (typeof document !== 'undefined') { - this.status = this.errorCodes.LOADING; - this.getMetrics(); - } - } - - ngOnDestroy() { - if(this.sub) { - this.sub.unsubscribe(); - } - } - - public get total(): number { - return +this.pageViews + +this.metrics.totalViews + +this.metrics.totalDownloads; - } - - private getMetrics() { - //queries from old API - replaced with queries to the stats tool - /* this.sub = this.metricsService.getMetrics(this.id, this.entityType, this.properties).subscribe( - data => { - this.metrics = data; - this.cdr.detectChanges(); - this.status = this.errorCodes.DONE; - this.metricsResults.emit({ - totalViews: this.metrics.totalViews, - totalDownloads: this.metrics.totalDownloads, - pageViews: this.metrics.pageViews - }); - }, - err => { - if (err.status == '404') { - this.status = this.errorCodes.NOT_FOUND; - } else if (err.status == '500') { - this.status = this.errorCodes.ERROR; - } else { - this.status = this.errorCodes.NOT_AVAILABLE; - } - this.metricsResults.emit({ - totalViews: 0, - totalDownloads: 0 - }); - } - );*/ - let obs; - if (this.entityType == "results") { - obs = zip(this.metricsService.getMetricsNumber(this.id, "usagestats.results.views", this.properties), - this.metricsService.getMetricsNumber(this.id, "usagestats.results.downloads", this.properties), - this.metricsService.getMetricsNumber(this.id, "usagestats.results.views.openaire", this.properties), - this.metricsService.getMetricsNumbersByRepository(this.id, "usagestats.results.viewsdownloads.repository", this.properties) - - ); - - } else if (this.entityType == "projects") { - obs = zip(this.metricsService.getMetricsNumber(this.id, "usagestats.projects.views", this.properties), - this.metricsService.getMetricsNumber(this.id, "usagestats.projects.downloads", this.properties), - this.metricsService.getMetricsNumber(this.id, "usagestats.projects.views.openaire", this.properties)); - - } else if (this.entityType == "datasources") { - obs = zip(this.metricsService.getMetricsNumber(this.id, "usagestats.views.repository.local", this.properties), - this.metricsService.getMetricsNumber(this.id, "usagestats.downloads.repository.local", this.properties), - this.metricsService.getMetricsNumber(this.id, "usagestats.views.openaire", this.properties), - // this.metricsService.getMetricsNumber(this.id, "usagestats.downloads.repository.openaire", this.properties) - ); - - } - - this.sub = obs.subscribe( - data => { - this.metrics = new Metrics(); - this.metrics.infos = new Map(); - this.metrics.totalViews = data[0] ? data[0] : 0; - this.metrics.totalDownloads = data[1] ? data[1] : 0; - this.metrics.pageViews = data[2] ? data[2] : 0; - this.metrics.infos = data[3] ? data[3] : 0; - this.cdr.detectChanges(); - this.status = this.errorCodes.DONE; - this.metricsResults.emit({ - totalViews: this.metrics.totalViews, - totalDownloads: this.metrics.totalDownloads, - pageViews: this.metrics.pageViews - }); - }, - err => { - if (err.status == '404') { - this.status = this.errorCodes.NOT_FOUND; - } else if (err.status == '500') { - this.status = this.errorCodes.ERROR; - } else { - this.status = this.errorCodes.NOT_AVAILABLE; - } - this.metricsResults.emit({ - totalViews: 0, - totalDownloads: 0, - pageViews: 0 - }); - } - ); - } - - public close(event: ClickEvent) { - if(event.clicked && this.state !== -1) { - this.timeouts.forEach(timeout => { - clearTimeout(timeout); - }); - this.state = -1; - this.timeouts = []; - } - } - - public clickedMetrics() { - setTimeout( () => { - this.metricsClicked = true; - }); - } - - public toggle(event) { - this.metricsClicked = true; - - event.stopPropagation(); - if(this.state !== -1) { - this.timeouts.forEach(timeout => { - clearTimeout(timeout); - }); - this.state = -1; - this.timeouts = []; - } else { - this.state++; - this.timeouts.push(setTimeout(() => { - this.state++; - this.timeouts.push(setTimeout(() => { - this.state++; - this.timeouts.push(setTimeout(() => { - this.state++; - this.timeouts.push(setTimeout(() => { - this.state++; - }, 400)); - }, 800)); - }, 300)); - }, 100)); - } - this.cdr.detectChanges(); - } - - public getKeys(map) { - return Array.from(map.keys()); - } - - public isNumberLarge(num: number | string, bigNum: boolean = false) { - let limit: number = bigNum ? 100000000 : 100000; - return (+num) >= limit; - } - - public formatNumber(num: number | string) { - let formatted = NumberUtils.roundNumber(+num); - return formatted.number + formatted.size; - } - - public addEoscPrevInParams(obj) { - if(properties.adminToolsPortalType == "eosc" && this.prevPath) { - let splitted: string[] = this.prevPath.split("?"); - obj = this.routerHelper.addQueryParam("return_path", splitted[0], obj); - if(splitted.length > 0) { - obj = this.routerHelper.addQueryParam("search_params", splitted[1], obj); - } - } - return obj; - } -} diff --git a/landingPages/landing-utils/metrics/metrics.module.ts b/landingPages/landing-utils/metrics/metrics.module.ts deleted file mode 100644 index fab8e9a2..00000000 --- a/landingPages/landing-utils/metrics/metrics.module.ts +++ /dev/null @@ -1,29 +0,0 @@ -/* This module contains all common components for all landing pages */ - -import {NgModule} from '@angular/core'; -import {CommonModule} from '@angular/common'; -import {FormsModule} from '@angular/forms'; - -import {MetricsComponent} from './metrics.component'; -import {MetricsService} from '../../../services/metrics.service'; - -import {ErrorMessagesModule} from '../../../utils/errorMessages.module'; -import {IFrameModule} from "../../../utils/iframe.module"; -import {IconsModule} from "../../../utils/icons/icons.module"; -import {RouterModule} from "@angular/router"; - -@NgModule({ - imports: [ - CommonModule, FormsModule, RouterModule, ErrorMessagesModule, IFrameModule, IconsModule - ], - declarations: [ - MetricsComponent - ], - providers:[ - MetricsService - ], - exports: [ - MetricsComponent - ] -}) -export class MetricsModule { } diff --git a/landingPages/landing-utils/resultLandingUtils.module.ts b/landingPages/landing-utils/resultLandingUtils.module.ts index ebf29782..05869cf7 100644 --- a/landingPages/landing-utils/resultLandingUtils.module.ts +++ b/landingPages/landing-utils/resultLandingUtils.module.ts @@ -21,12 +21,13 @@ import {EntityMetadataComponent} from "./entity-metadata.component"; import {IconsService} from "../../utils/icons/icons.service"; import {closed_access, open_access, unknown_access} from "../../utils/icons/icons"; import {FullScreenModalModule} from "../../utils/modal/full-screen-modal/full-screen-modal.module"; +import {MobileDropdownModule} from "../../utils/mobile-dropdown/mobile-dropdown.module"; @NgModule({ imports: [ CommonModule, FormsModule, RouterModule, PagingModule, ShowPublisherModule, IconsModule, AlertModalModule, - SearchInputModule, FullScreenModalModule + SearchInputModule, FullScreenModalModule, MobileDropdownModule ], declarations: [ ShowIdentifiersComponent,ShowSubjectsComponent, diff --git a/landingPages/project/project.module.ts b/landingPages/project/project.module.ts index a85a3a9c..e17a294c 100644 --- a/landingPages/project/project.module.ts +++ b/landingPages/project/project.module.ts @@ -1,4 +1,3 @@ -//import {MaterialModule} from '@angular/material'; import {NgModule} from '@angular/core'; import {CommonModule} from '@angular/common'; import {FormsModule} from '@angular/forms'; @@ -10,8 +9,6 @@ import {ProjectServiceModule} from './projectService.module'; import {HtmlProjectReportService} from "../htmlProjectReport/htmlProjectReport.service"; import {ReportsServiceModule} from '../../services/reportsService.module'; import {SearchResearchResultsServiceModule} from '../../services/searchResearchResultsService.module'; - -import {MetricsModule} from '../landing-utils/metrics/metrics.module'; import {LandingModule} from '../landing-utils/landing.module'; import {LandingHeaderModule} from "../landing-utils/landing-header/landing-header.module"; @@ -41,7 +38,7 @@ import {EntityActionsModule} from "../../utils/entity-actions/entity-actions.mod imports: [ CommonModule, FormsModule, RouterModule, LandingModule, LoadingModalModule, AlertModalModule, ErrorMessagesModule, - IFrameModule, MetricsModule, ReportsServiceModule, + IFrameModule, ReportsServiceModule, SearchResearchResultsServiceModule, ProjectServiceModule, Schema2jsonldModule, SEOServiceModule, HelperModule, LandingHeaderModule, MatSelectModule, FeedbackModule, AltMetricsModule, diff --git a/landingPages/result/resultLanding.module.ts b/landingPages/result/resultLanding.module.ts index 2df31ec0..67a0a8fb 100644 --- a/landingPages/result/resultLanding.module.ts +++ b/landingPages/result/resultLanding.module.ts @@ -3,8 +3,7 @@ import {CommonModule} from '@angular/common'; import {FormsModule} from '@angular/forms'; import {RouterModule} from '@angular/router'; -import {SharedModule} from '../../../openaireLibrary/shared/shared.module'; -import {MetricsModule} from '../landing-utils/metrics/metrics.module'; +import {SharedModule} from '../../shared/shared.module'; import {LandingModule} from '../landing-utils/landing.module'; import {CiteThisModule} from '../landing-utils/citeThis/citeThis.module'; import {IFrameModule} from '../../utils/iframe.module'; @@ -46,7 +45,7 @@ import {EntityActionsModule} from "../../utils/entity-actions/entity-actions.mod imports: [ CommonModule, FormsModule, LandingModule, SharedModule, RouterModule, CiteThisModule, PagingModule, IFrameModule, - MetricsModule, AltMetricsModule, Schema2jsonldModule, SEOServiceModule, + AltMetricsModule, Schema2jsonldModule, SEOServiceModule, DeletedByInferenceModule, ShowAuthorsModule, HelperModule, ResultLandingUtilsModule, AlertModalModule, AnnotationModule, LandingHeaderModule, NoLoadPaging, ResultPreviewModule, FeedbackModule, TabsModule, LoadingModule, OrcidModule, MatFormFieldModule, MatSelectModule, IconsModule, InputModule, EGIDataTransferModule, RecaptchaModule, diff --git a/sharedComponents/input/input.component.ts b/sharedComponents/input/input.component.ts index 64de88d8..7d511776 100644 --- a/sharedComponents/input/input.component.ts +++ b/sharedComponents/input/input.component.ts @@ -211,7 +211,7 @@ declare var UIkit; - +
{{placeholderInfo.label}}
diff --git a/utils/authors/showAuthors.component.ts b/utils/authors/showAuthors.component.ts index fdf1cf04..a9987197 100644 --- a/utils/authors/showAuthors.component.ts +++ b/utils/authors/showAuthors.component.ts @@ -10,108 +10,129 @@ import {properties} from "../../../../environments/environment"; @Component({ selector: 'showAuthors', template: ` - - + {{author.fullName + ";"}} - - orcid - orcid bw - - {{author.fullName + ";"}} - - -
-
-
{{author.fullName}}
-
-
ORCID
- -
- {{" "}} - {{" "}} - - Harvested from ORCID Public Data File - Derived by OpenAIRE algorithms or harvested from 3d party repositories -
- + + +
+
{{author.fullName}}
+
+
ORCID
-
-
- {{author.fullName}} in OpenAIRE -
-
- - Search - - - Search in OpenAIRE - -
-
-
- - -
+
+ {{" "}} + {{" "}} + + Harvested from ORCID Public Data File + Derived by OpenAIRE algorithms or harvested + from 3d party repositories +
+
+
+ + +
+
+ + VISIT AUTHOR IN ORCID + +
+
+
+ +
+
+ {{author.fullName}} in OpenAIRE +
+
+ + Search + + + Search in OpenAIRE + +
+
+ + + + + +
Authors: - - - - - +{{authors.length-authorsLimit | number}} more + + + + + +{{authors.length - authorsLimit | number}} more - + - +{{authors.length-authorsLimit | number}} Authors + +{{authors.length - authorsLimit | number}} Authors -
- View less +
+ View less +
-
- -
- - - -
- + +
+ + + +
+ - -
- - - -
- + +
+ + + +
+ ` }) @@ -131,11 +152,11 @@ export class ShowAuthorsComponent { public properties: EnvProperties = properties; public routerHelper: RouterHelper = new RouterHelper(); - testBrowser: boolean; + isBrowser: boolean; public clipboard; constructor(private route: ActivatedRoute, @Inject(PLATFORM_ID) private platformId: string) { - this.testBrowser = isPlatformBrowser(platformId); + this.isBrowser = isPlatformBrowser(platformId); } ngOnInit() {} diff --git a/utils/authors/showAuthors.module.ts b/utils/authors/showAuthors.module.ts index f98f42e5..e01f0f20 100644 --- a/utils/authors/showAuthors.module.ts +++ b/utils/authors/showAuthors.module.ts @@ -6,10 +6,12 @@ import {RouterModule} from '@angular/router'; import {ShowAuthorsComponent} from './showAuthors.component'; import {AlertModalModule} from "../modal/alertModal.module"; import {FullScreenModalModule} from "../modal/full-screen-modal/full-screen-modal.module"; +import {MobileDropdownModule} from "../mobile-dropdown/mobile-dropdown.module"; +import {IconsModule} from "../icons/icons.module"; @NgModule({ imports: [ - CommonModule, FormsModule, RouterModule, AlertModalModule, FullScreenModalModule + CommonModule, FormsModule, RouterModule, AlertModalModule, FullScreenModalModule, MobileDropdownModule, IconsModule ], declarations: [ ShowAuthorsComponent @@ -20,4 +22,4 @@ import {FullScreenModalModule} from "../modal/full-screen-modal/full-screen-moda ShowAuthorsComponent ] }) -export class ShowAuthorsModule { } \ No newline at end of file +export class ShowAuthorsModule { } diff --git a/utils/mobile-dropdown/mobile-dropdown.component.ts b/utils/mobile-dropdown/mobile-dropdown.component.ts index 8a24d7e9..ffe4380f 100644 --- a/utils/mobile-dropdown/mobile-dropdown.component.ts +++ b/utils/mobile-dropdown/mobile-dropdown.component.ts @@ -1,10 +1,10 @@ -import {Component, Input, OnInit} from "@angular/core"; +import {Component, ElementRef, Input, OnInit} from "@angular/core"; @Component({ selector: 'mobile-dropdown', template: ` -
-
+
+
@@ -15,22 +15,48 @@ import {Component, Input, OnInit} from "@angular/core";
` }) export class MobileDropdownComponent implements OnInit{ - @Input() toggle: HTMLLinkElement; + @Input() toggle: HTMLAnchorElement; public opened: boolean = false; + private static MOBILE_DROPDOWN_CONTAINER = 'mobile-dropdown-container'; + + constructor(private element: ElementRef) { + } ngOnInit() { if(this.toggle) { this.toggle.onclick = (ev) => { - this.opened = !this.opened; + ev.preventDefault(); + ev.stopPropagation(); + if(this.opened) { + this.close(); + } else { + this.open(); + } } } } open() { - this.opened = true; + if(!this.opened) { + let body = document.getElementsByTagName('body')[0]; + let container = document.getElementById(MobileDropdownComponent.MOBILE_DROPDOWN_CONTAINER); + if(!container) { + container = document.createElement('div'); + container.setAttribute('id', MobileDropdownComponent.MOBILE_DROPDOWN_CONTAINER); + body.append(container); + } + let parent = this.element.nativeElement.parentElement; + parent.removeChild(this.element.nativeElement); + container.append(this.element.nativeElement); + this.opened = true; + body.setAttribute('style', 'overflow-y: hidden'); + } } close() { - this.opened = false; + if(this.opened) { + this.opened = false; + document.getElementsByTagName('body')[0].setAttribute('style', ''); + } } } diff --git a/utils/result-preview/result-preview.component.html b/utils/result-preview/result-preview.component.html index f2120b2a..d8608abb 100644 --- a/utils/result-preview/result-preview.component.html +++ b/utils/result-preview/result-preview.component.html @@ -123,7 +123,7 @@
-