Home page carousel

[eliot.git] / blueprints / common / eliot-ui / frontend-src / src / app / toolbar / toolbar.component.html

diff --git a/blueprints/common/eliot-ui/frontend-src/src/app/toolbar/toolbar.component.html b/blueprints/common/eliot-ui/frontend-src/src/app/toolbar/toolbar.component.html
new file mode 100644 (file)
index 0000000..da07e75
--- /dev/null
+++ b/blueprints/common/eliot-ui/frontend-src/src/app/toolbar/toolbar.component.html
@@ -0,0 +1,55 @@
+<div class="main">
+  <div class="menu">
+
+    <mat-toolbar color="primary" *ngIf="(toolbarService.visible|async)">
+
+      <mat-toolbar-row>
+        <!-- <mat-icon (click)="sidenav.toggle()">menu</mat-icon> -->
+        <div class="akraino-icon">
+          <mat-icon> <img src="./../../assets/images/akraino-icon-5.png" height="35" width="125"> </mat-icon>
+        </div>
+
+        <div class="menu-toolbar" *ngFor="let item of toolbarmenu">
+
+          <span *ngIf="item.children && item.children.length > 0">
+            <button class="eliot-menu" mat-raised-button color="primary"
+              [matMenuTriggerFor]="menu.childMenu">{{item.displayName}}</button>
+            <app-menu-item #menu class="menu-item" [items]="item.children"></app-menu-item>
+          </span>
+
+          <span *ngIf="!item.children">
+            <span *ngIf="item.displayName=='ELIOT';else others">
+              <button class="home" mat-raised-button color="primary"
+                [routerLink]="item.route">{{item.displayName}}</button>
+            </span>
+            <ng-template #others>
+              <button mat-button class="other-button">{{item.displayName}}</button>
+            </ng-template>
+          </span>
+          <span *ngIf="item.iconName">
+            <button mat-raised-button mat-icon-button color="primary" class="power-button"
+              [matMenuTriggerFor]="menu.childMenu">
+              <mat-icon>{{item.iconName}}</mat-icon>
+              <app-menu-item #menu [items]="item.children"></app-menu-item>
+            </button>
+          </span>
+
+        </div>
+      </mat-toolbar-row>
+    </mat-toolbar>
+  </div>
+
+  <!-- <div class="sidemenu">
+      <mat-sidenav-container >
+        <mat-sidenav #sidenav>
+          <mat-nav-list>
+            <a mat-list-item [matMenuTriggerFor]="network"> Network Management </a>
+          </mat-nav-list>
+  
+        </mat-sidenav>
+        <mat-sidenav-content>
+           <router-outlet></router-outlet> 
+        </mat-sidenav-content>
+      </mat-sidenav-container>
+    </div> -->
+</div>
\ No newline at end of file