import {NgModule,Component,ElementRef,OnDestroy,Input} from '@angular/core';
import {trigger,state,style,transition,animate} from '@angular/animations';
import {CommonModule} from '@angular/common';
import {MenuItem} from '../common/menuitem';
import {RouterModule} from '@angular/router';
export class BasePanelMenuItem {
handleClick(event, item) {
if(item.disabled) {
event.preventDefault();
return;
}
item.expanded = !item.expanded;
if(!item.url) {
event.preventDefault();
}
if(item.command) {
item.command({
originalEvent: event,
item: item
});
}
}
}
@Component({
selector: 'p-panelMenuSub',
template: `
`,
animations: [
trigger('submenu', [
state('hidden', style({
height: '0px'
})),
state('visible', style({
height: '*'
})),
transition('visible => hidden', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)')),
transition('hidden => visible', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
])
]
})
export class PanelMenuSub extends BasePanelMenuItem {
@Input() item: MenuItem;
@Input() expanded: boolean;
}
@Component({
selector: 'p-panelMenu',
template: `
`,
animations: [
trigger('rootItem', [
state('hidden', style({
height: '0px'
})),
state('visible', style({
height: '*'
})),
transition('visible => hidden', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)')),
transition('hidden => visible', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
])
]
})
export class PanelMenu extends BasePanelMenuItem {
@Input() model: MenuItem[];
@Input() style: any;
@Input() styleClass: string;
@Input() multiple: boolean = true;
public animating: boolean;
collapseAll() {
for(let item of this.model) {
if(item.expanded) {
item.expanded = false;
}
}
}
handleClick(event, item) {
if(!this.multiple) {
for(let modelItem of this.model) {
if(item !== modelItem && modelItem.expanded) {
modelItem.expanded = false;
}
}
}
this.animating = true;
super.handleClick(event, item);
}
onToggleDone() {
this.animating = false;
}
}
@NgModule({
imports: [CommonModule,RouterModule],
exports: [PanelMenu,RouterModule],
declarations: [PanelMenu,PanelMenuSub]
})
export class PanelMenuModule { }