52 lines
1.6 KiB
TypeScript
52 lines
1.6 KiB
TypeScript
import {AfterViewInit, Component, EventEmitter, HostListener, Input, OnInit, Output,} from "@angular/core";
|
|
import {ToolbarItem} from "../../models/toolbarItem";
|
|
import {version} from '../../../../package.json';
|
|
|
|
@Component({
|
|
selector: 'toolbar',
|
|
templateUrl: 'toolbar.component.html',
|
|
styleUrls: ['toolbar.component.scss']
|
|
})
|
|
export class ToolbarComponent implements OnInit, AfterViewInit {
|
|
@Input() menuItems: ToolbarItem[];
|
|
|
|
@Output() menuItemsChange = new EventEmitter<ToolbarItem[]>();
|
|
|
|
readonly version = version;
|
|
|
|
displayMenuItems: ToolbarItem[];
|
|
maxMenuItems = 0;
|
|
|
|
constructor() { }
|
|
|
|
ngOnInit() {
|
|
this.displayMenuItems = this.menuItems.filter(item => !item.hidden);
|
|
}
|
|
|
|
@HostListener('window:resize', ['$event'])
|
|
ngAfterViewInit() {
|
|
setTimeout(() => this.maxMenuItems = Math.floor((document.getElementById('toolbar').offsetWidth - 100) / 75), 1);
|
|
}
|
|
|
|
clickWrapper(item: ToolbarItem, menu?: ToolbarItem[]) {
|
|
if(item.toggle) {
|
|
if (!item.individualToggle) {
|
|
menu.filter(i => item.name != i.name && !i.individualToggle).forEach(item => {
|
|
item.enabled = false;
|
|
if (item.onDisabled) item.onDisabled();
|
|
});
|
|
}
|
|
|
|
item.enabled = !item.enabled;
|
|
this.menuItemsChange.emit(this.displayMenuItems);
|
|
|
|
if(item.enabled) {
|
|
if(item.onEnabled) item.onEnabled(item);
|
|
} else {
|
|
if(item.onDisabled) item.onDisabled(item);
|
|
}
|
|
}
|
|
if(item.click) item.click(item);
|
|
}
|
|
}
|