From 7875fc610be1cfd4609d588186c2b32a1d0cd1ba Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hugo=20H=C3=B6rnquist?= Date: Fri, 10 Dec 2021 03:13:48 +0100 Subject: Popup maximize now procedure. --- static/components/popup-element.ts | 30 ++++++++++++++++-------------- 1 file changed, 16 insertions(+), 14 deletions(-) (limited to 'static/components') diff --git a/static/components/popup-element.ts b/static/components/popup-element.ts index a9ada71c..840faef8 100644 --- a/static/components/popup-element.ts +++ b/static/components/popup-element.ts @@ -59,20 +59,7 @@ class PopupElement extends ComponentVEvent { close_btn.addEventListener('click', () => this.visible = false); let maximize_btn = body.querySelector('.popup-control .maximize-button') as HTMLButtonElement - maximize_btn.addEventListener('click', () => { - /* TODO this assumes that popups are direct decendant of their parent, - which they really ought to be */ - let parent = this.parentElement!; - let el = this.firstElementChild as HTMLElement - /* TODO offsetParent.scrollLeft places us "fullscreen" according to the currently - scrolled viewport. But is this the correct way to do it? How does it work for - month views */ - this.style.left = `${this.offsetParent!.scrollLeft + 10}px`; - this.style.top = '10px'; - /* 5ex is width of tab labels */ - el.style.width = `calc(${parent.clientWidth - 20}px - 5ex)` - el.style.height = `${parent.clientHeight - 20}px` - }); + maximize_btn.addEventListener('click', () => this.maximize()); let remove_btn = body.querySelector('.popup-control .remove-button') as HTMLButtonElement remove_btn.addEventListener('click', () => remove_event(uid)); @@ -138,4 +125,19 @@ class PopupElement extends ComponentVEvent { el.style.removeProperty('width'); el.style.removeProperty('height'); } + + maximize() { + /* TODO this assumes that popups are direct decendant of their parent, + which they really ought to be */ + let parent = this.parentElement!; + let el = this.firstElementChild as HTMLElement + /* TODO offsetParent.scrollLeft places us "fullscreen" according to the currently + scrolled viewport. But is this the correct way to do it? How does it work for + month views */ + this.style.left = `${this.offsetParent!.scrollLeft + 10}px`; + this.style.top = '10px'; + /* 5ex is width of tab labels */ + el.style.width = `calc(${parent.clientWidth - 20}px - 5ex)` + el.style.height = `${parent.clientHeight - 20}px` + } } -- cgit v1.2.3