andras/fleeting-garden
andras/fleeting-garden
Watch
1
0
Fork
You've already forked fleeting-garden
 0
Code Issues Pull requests 10 Projects Releases Packages Wiki Activity Actions

Add highlight to open page tab

Browse source
This commit is contained in:
Andras Schmelczer 2023-05-27 19:50:27 +01:00
commit 68b24effde
No known key found for this signature in database
GPG key ID: FC8F2C3D3D1A718C
4 changed files with 111 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/page/collapsible-panel-animator.ts
View file

@ -5,11 +5,11 @@ export class CollapsiblePanelAnimator {
public onClose: () => unknown = () => {};
public constructor(
infoButton: HTMLButtonElement,
private readonly infoPage: HTMLElement,
private readonly toggleButton: HTMLButtonElement,
private readonly collapsibleContent: HTMLElement,
ignoreForCloseOnClick: HTMLElement
) {
infoButton.addEventListener('click', this.toggle.bind(this));
toggleButton.addEventListener('click', this.toggle.bind(this));
window.addEventListener(
'click',
(event) => !ignoreForCloseOnClick.contains(event.target as Node) && this.close()
@ -18,13 +18,15 @@ export class CollapsiblePanelAnimator {
public open() {
this.isOpen = true;
this.infoPage.classList.remove('hidden');
this.collapsibleContent.classList.remove('hidden');
this.toggleButton.classList.add('active');
this.onOpen();
}
public close() {
this.isOpen = false;
this.infoPage.classList.add('hidden');
this.collapsibleContent.classList.add('hidden');
this.toggleButton.classList.remove('active');
this.onClose();
}