3 files changed, 207 insertions, 0 deletions
diff --git a/mod2/ui/src/app/home/home.component.css b/mod2/ui/src/app/home/home.component.css
new file mode 100644
index 0000000..f345db2
--- /dev/null
+++ b/mod2/ui/src/app/home/home.component.css
@@ -0,0 +1,50 @@
+/* 
+ *  # ============LICENSE_START=======================================================
+ *  # Copyright (c) 2020 AT&T Intellectual Property. All rights reserved.
+ *  # ================================================================================
+ *  # Licensed under the Apache License, Version 2.0 (the "License");
+ *  # you may not use this file except in compliance with the License.
+ *  # You may obtain a copy of the License at
+ *  #
+ *  #      http://www.apache.org/licenses/LICENSE-2.0
+ *  #
+ *  # Unless required by applicable law or agreed to in writing, software
+ *  # distributed under the License is distributed on an "AS IS" BASIS,
+ *  # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  # See the License for the specific language governing permissions and
+ *  # limitations under the License.
+ *  # ============LICENSE_END=========================================================
+ */
+
+
+.card{
+    display: inline-block;
+    margin-top: 56px;
+    margin-left: 75px;
+    color: rgb(34, 32, 32);
+    font-family: Arial, Helvetica, sans-serif;
+    font-weight: 800;
+    text-align: center;
+    padding-top: 42px;
+    font-size: 20px;
+    border-width: 2px;
+    border-color: gray;
+    border-radius: 8px;
+    height: 112px;
+    width: 261px;
+    cursor: pointer
+}
+
+#subMenu{
+  height: 75px;
+  width: 229px;
+  padding-top: 24px;
+  margin-left: 61px;
+  font-size: 18px;
+  border-radius: 5px
+}
+
+
+.mat-form-field + .mat-form-field {
+  margin-left: 8px;
+}
+\ No newline at end of file
diff --git a/mod2/ui/src/app/home/home.component.html b/mod2/ui/src/app/home/home.component.html
new file mode 100644
index 0000000..31fe720
--- /dev/null
+++ b/mod2/ui/src/app/home/home.component.html
@@ -0,0 +1,93 @@
+<!-- 
+  # ============LICENSE_START=======================================================
+  # Copyright (c) 2020 AT&T Intellectual Property. All rights reserved.
+  # ================================================================================
+  # Licensed under the Apache License, Version 2.0 (the "License");
+  # you may not use this file except in compliance with the License.
+  # You may obtain a copy of the License at
+  #
+  #      http://www.apache.org/licenses/LICENSE-2.0
+  #
+  # Unless required by applicable law or agreed to in writing, software
+  # distributed under the License is distributed on an "AS IS" BASIS,
+  # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  # See the License for the specific language governing permissions and
+  # limitations under the License.
+  # ============LICENSE_END=========================================================
+ -->
+
+<div style="margin: -50px 0px 0px -30px">
+    <mat-card
+        (click)="toggleMsMenu()"
+        appMaterialElevation 
+        [defaultElevation]="defaultElevation" 
+        raisedElevation="16" 
+        class="card" 
+        style="background-color: #60a4a5">
+            Microservices...
+    </mat-card>
+    <mat-card 
+        (click)="navSelect('Onboarding Tools')"    
+        appMaterialElevation 
+        [defaultElevation]="defaultElevation" 
+        raisedElevation="16"
+        class="card"
+        style="background-color: rgba(154, 135, 167, 0.904);"
+            [routerLink]="'/OnboardingTools'">
+            Onboarding Tools
+    </mat-card>
+    <mat-card *ngIf="authService.isAdmin"
+        (click)="navSelect('User Management')"
+        appMaterialElevation 
+        [defaultElevation]="defaultElevation" 
+        raisedElevation="16"
+        class="card"
+        style="background-color: rgba(160, 120, 83, 0.904);"
+            [routerLink]="'/users'">
+            User Management
+    </mat-card>
+</div>
+<br>
+<div *ngIf="displayMsMenu" style="margin-top: -60px">
+    <mat-card id="subMenu" (click)="navSelect('Microservices')"
+        appMaterialElevation 
+        [defaultElevation]="defaultElevation" 
+        raisedElevation="16"
+        class="card"
+        style="background-color: #70a7a9; position: absolute;">
+            Microservices
+    </mat-card>
+</div>
+<br>
+<div *ngIf="displayMsMenu" style="margin-top: 70px">
+    <mat-card id="subMenu" (click)="navSelect('MS Instances')"
+        appMaterialElevation
+        [defaultElevation]="defaultElevation" 
+        raisedElevation="16"
+        class="card"
+        style="background-color: #8fbbbc; position: absolute;">
+            MS Instances
+    </mat-card>
+</div>
+<br>
+<div *ngIf="displayMsMenu" style="margin-top: 70px">
+    <mat-card id="subMenu" (click)="navSelect('Blueprints')"
+        appMaterialElevation 
+        [defaultElevation]="defaultElevation" 
+        raisedElevation="16"
+        class="card"
+        style="background-color: #afcecf; position: absolute;">
+            Blueprints
+    </mat-card>
+</div>
+<br>
+<div *ngIf="displayMsMenu" style="margin-top: 70px">
+    <mat-card id="subMenu" (click)="navSelect('MOD APIs')"
+        appMaterialElevation 
+        [defaultElevation]="defaultElevation" 
+        raisedElevation="16"
+        class="card"
+        style="background-color: #cfe2e2; position: absolute;">
+            MOD APIs
+    </mat-card>
+</div>
+\ No newline at end of file
diff --git a/mod2/ui/src/app/home/home.component.ts b/mod2/ui/src/app/home/home.component.ts
new file mode 100644
index 0000000..36f9ee1
--- /dev/null
+++ b/mod2/ui/src/app/home/home.component.ts
@@ -0,0 +1,64 @@
+/* 
+ *  # ============LICENSE_START=======================================================
+ *  # Copyright (c) 2020 AT&T Intellectual Property. All rights reserved.
+ *  # ================================================================================
+ *  # Licensed under the Apache License, Version 2.0 (the "License");
+ *  # you may not use this file except in compliance with the License.
+ *  # You may obtain a copy of the License at
+ *  #
+ *  #      http://www.apache.org/licenses/LICENSE-2.0
+ *  #
+ *  # Unless required by applicable law or agreed to in writing, software
+ *  # distributed under the License is distributed on an "AS IS" BASIS,
+ *  # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  # See the License for the specific language governing permissions and
+ *  # limitations under the License.
+ *  # ============LICENSE_END=========================================================
+ */
+
+import { Component, OnInit, HostBinding } from '@angular/core';
+import { AppComponent } from '../app.component';
+import { AuthService } from '../services/auth.service';
+import { BreadcrumbService } from '../services/breadcrumb.service';
+
+@Component({
+  selector: 'app-home',
+  templateUrl: './home.component.html',
+  styleUrls: ['./home.component.css']
+})
+export class HomeComponent implements OnInit {
+
+  defaultElevation = 2;
+  raisedElevation = 8;
+  panelOpenState = false;
+
+  name = 'Angular';
+
+  displayMsMenu = false;
+
+  constructor(private appComp: AppComponent, public authService: AuthService, private bread: BreadcrumbService) { }
+
+  ngOnInit() {
+  }
+
+  disableAnimation = true;
+  ngAfterViewInit(): void {
+    // timeout required to avoid the dreaded 'ExpressionChangedAfterItHasBeenCheckedError'
+    setTimeout(() => this.disableAnimation = false);
+  }
+
+    toggleMsMenu() {
+        if (this.displayMsMenu == false) {
+            this.displayMsMenu = true
+        } else {
+            this.displayMsMenu = false
+        }
+   }
+
+    navSelect(menuItem: any) {
+        this.appComp.tree_handler(menuItem, null);
+        // Set the breadcrumbs for the selected menu item (card)
+        this.bread.setBreadcrumbs(menuItem, "reset");
+    }
+        
+}