uptime.link/webwidget
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(core): update

Browse Source
This commit is contained in:
Philipp Kunz 2021-03-09 13:41:16 +00:00
parent 830eab2b18
commit cafe63348b
1 changed files with 11 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
ts_web/elements/uptimelink-webwidget.ts
View File

@ -13,6 +13,9 @@ export class UptimelinkWebwidget extends DeesElement {
@property() @property()
public isFocused = false; public isFocused = false;
@property()
public isElevated = false;
@property() @property()
public showExpanded: boolean = false; public showExpanded: boolean = false;
@ -30,7 +33,7 @@ export class UptimelinkWebwidget extends DeesElement {
position: relative; position: relative;
display: block; display: block;
height: 30px; height: 30px;
z-index:10; z-index: ${this.isElevated ? '10' : 'auto'} ;
} }
.mainbox { .mainbox {
position: relative; position: relative;
@ -154,6 +157,7 @@ export class UptimelinkWebwidget extends DeesElement {
await this.updateComplete; await this.updateComplete;
const mainbox: HTMLDivElement = this.shadowRoot.querySelector('.mainbox'); const mainbox: HTMLDivElement = this.shadowRoot.querySelector('.mainbox');
mainbox.onmouseenter = async () => { mainbox.onmouseenter = async () => {
this.isElevated = true;
this.isFocused = true; this.isFocused = true;
await domtools.DomTools.getGlobalDomToolsSync().convenience.smartdelay.delayFor(200); await domtools.DomTools.getGlobalDomToolsSync().convenience.smartdelay.delayFor(200);
if (!this.isFocused) { if (!this.isFocused) {
@ -161,11 +165,16 @@ export class UptimelinkWebwidget extends DeesElement {
} }
this.showExpanded = true; this.showExpanded = true;
await this.performUpdate(); await this.performUpdate();
await domtools.DomTools.getGlobalDomToolsSync().convenience.smartdelay.delayFor(50); await (await this.domtoolsPromise).convenience.smartdelay.delayFor(50);
const expandedDiv = this.shadowRoot.querySelector('.expanded') as HTMLElement; const expandedDiv = this.shadowRoot.querySelector('.expanded') as HTMLElement;
expandedDiv.style.opacity = '1'; expandedDiv.style.opacity = '1';
}; };
mainbox.onmouseleave = async () => { mainbox.onmouseleave = async () => {
(await this.domtoolsPromise).convenience.smartdelay.delayFor(200).then(() => {
if (!this.isFocused) {
this.isElevated = false;
}
});
if (!this.showExpanded) { if (!this.showExpanded) {
this.isFocused = false; this.isFocused = false;
return; return;