cic-staff-client/src/app/shared/_directives/menu-selection.directive.ts

35 lines
1023 B
TypeScript

import {Directive, ElementRef, Renderer2} from '@angular/core';
@Directive({
selector: '[appMenuSelection]'
})
export class MenuSelectionDirective {
constructor(
private elementRef: ElementRef,
private renderer: Renderer2
) {
this.renderer.listen(this.elementRef.nativeElement, 'click', () => {
const mediaQuery = window.matchMedia('(max-width: 768px)');
if (mediaQuery.matches) {
this.onMenuSelect();
}
});
}
onMenuSelect(): void {
const sidebar: HTMLElement = document.getElementById('sidebar');
if (!sidebar?.classList.contains('active')) {
sidebar?.classList.add('active');
}
const content: HTMLElement = document.getElementById('content');
if (!content?.classList.contains('active')) {
content?.classList.add('active');
}
const sidebarCollapse: HTMLElement = document.getElementById('sidebarCollapse');
if (sidebarCollapse?.classList.contains('active')) {
sidebarCollapse?.classList.remove('active');
}
}
}