better placement of emoji-picker

This commit is contained in:
Nicolas Constant 2019-07-27 19:03:26 -04:00
parent b4bec669fc
commit f8d3f7b4f7
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
1 changed files with 19 additions and 4 deletions

View File

@ -1,4 +1,4 @@
import { Component, OnInit, OnDestroy, Input, Output, EventEmitter, ElementRef, ViewChild, ViewContainerRef, ComponentRef } from '@angular/core';
import { Component, OnInit, OnDestroy, Input, Output, EventEmitter, ElementRef, ViewChild, ViewContainerRef, ComponentRef, HostListener } from '@angular/core';
import { HttpErrorResponse } from '@angular/common/http';
import { Store } from '@ngxs/store';
import { Subscription, Observable } from 'rxjs';
@ -191,6 +191,8 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
this.statusLoaded = true;
this.focus();
this.innerHeight = window.innerHeight;
}
ngOnDestroy() {
@ -618,15 +620,28 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
//https://stackblitz.com/edit/overlay-demo
@ViewChild('emojiButton') emojiButtonElement: ElementRef;
overlayRef: OverlayRef;
public innerHeight: number;
@HostListener('window:resize', ['$event'])
onResize(event) {
this.innerHeight = window.innerHeight;
}
openEmojiPicker(e: MouseEvent): boolean {
console.warn(e);
let topPosition = e.pageY;
if(this.innerHeight - e.pageY < 360){
topPosition -= 360;
}
let config = new OverlayConfig();
config.positionStrategy = this.overlay.position()
.global()
.left(`${e.pageX}px`)
.top(`${e.pageY}px`);
.top(`${topPosition}px`);
config.hasBackdrop = true;
@ -640,8 +655,8 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
//overlayRef.attach(new ComponentPortal(EmojiPickerComponent, this.viewContainerRef));
// overlayRef.attach(new ComponentPortal(EmojiPickerComponent));
let comp = new ComponentPortal(EmojiPickerComponent);
let comp = new ComponentPortal(EmojiPickerComponent);
//this.overlayRef.attach(comp);
const compRef: ComponentRef<EmojiPickerComponent> = this.overlayRef.attach(comp);