expandPanelComponent

import { Component, ElementRef, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { AppPanelService } from './appPanel.service';

/**
 * This component allows the user to toggle the app panel size between full screen and normal
 * views.
 */
@Component({
    selector: 'expand-panel',
    template: `
        <a class="panel-expand" (click)="expand()">
            <i class="fa" [ngClass]="{ 'fa-expand': !expanded, 'fa-compress': expanded }"></i>
        </a>
    `,
    encapsulation: ViewEncapsulation.None,
    viewProviders: [
        AppPanelService
    ]
})
export class ExpandPanelComponent implements OnInit, OnDestroy {
    private panel: Element;
    public expanded = false;

    constructor(private element: ElementRef, private appPanelService: AppPanelService) {
    }

    /**
     * Initialize this component
     */
    public ngOnInit() {
        this.panel = this.appPanelService.getPanelElement(this.element.nativeElement);
    }

    /**
     * Destroy this component
     */
    public ngOnDestroy() {
        this.panel = undefined;
    }

    public expand() {
        this.expanded = this.appPanelService.expandPanel(this.panel);
    }
}