demo shell (ng2)

basic angular2-based demo shell

demo-shell-ng2/app/components/core/SideMenu.ts

@@ -0,0 +1,47 @@
+import {Component, Input, ElementRef} from "angular2/core";
+
+@Component({
+    selector: 'side-menu',
+    host: {
+        '(click)': 'onClick($event)',
+        //'(document:click)': 'onOutsideClick($event)'
+    },
+    template: `
+        <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-{{direction}} inline-menu" 
+            [ngClass]="{ 'cbp-spmenu-open': isOpen }">
+            <h3>
+                {{title}}
+                <a href="#" class="menu-close pull-right" (click)="close()">
+                    <i class="glyphicon glyphicon-remove"></i>
+                </a>
+            </h3>
+            <ng-content></ng-content>
+        </nav>
+    `
+})
+export class SideMenu {
+    @Input() title: string = '';
+    @Input() direction: string = 'left';
+    isOpen: boolean = false;
+
+    constructor(private el: ElementRef) {
+
+    }
+
+    onClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
+    }
+
+    toggle() {
+        this.isOpen = !this.isOpen;
+    }
+
+    open() {
+        this.isOpen = true;
+    }
+
+    close() {
+        this.isOpen = false;
+    }
+}