add svmon angular code

svmon-front/e2e/app.e2e-spec.ts

+import { AppPage } from './app.po';
+
+describe('svmon-gui App', () => {
+  let page: AppPage;
+
+  beforeEach(() => {
+    page = new AppPage();
+  });
+
+  it('should display welcome message', () => {
+    page.navigateTo();
+    expect(page.getParagraphText()).toEqual('Welcome to app!');
+  });
+});

svmon-front/e2e/app.po.ts

+import { browser, by, element } from 'protractor';
+
+export class AppPage {
+  navigateTo() {
+    return browser.get('/');
+  }
+
+  getParagraphText() {
+    return element(by.css('app-root h1')).getText();
+  }
+}

svmon-front/e2e/tsconfig.e2e.json

+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/e2e",
+    "baseUrl": "./",
+    "module": "commonjs",
+    "target": "es5",
+    "types": [
+      "jasmine",
+      "jasminewd2",
+      "node"
+    ]
+  }
+}

svmon-front/src/app/app-routing.module.ts

+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { LoginComponent } from './auth/login/login.component';
+import { AAILoginComponent } from './auth/login/aailogin.component';
+import { TableComponent } from './dashboard/table/table.component';
+import {SiteComponent} from './dashboard/site/site.component';
+import {DashboardGuard} from './guards/dashboard-guard.service';
+import {AuthGuard} from '../svmongui-shared/services/Auth/auth-guard.service';
+import {ServiceCompComponent} from './dashboard/serviceComponent/serviceComp.component';
+import {ServiceComponentGuard} from './guards/serviceComponent-guard.service';
+
+
+const appRoutes: Routes = [
+  { path: '', redirectTo: 'dashboard', pathMatch: 'full'},
+  { path: 'login', component: LoginComponent },
+  { path: 'aailogin', component: AAILoginComponent },
+  { path: 'dashboard',  canActivateChild: [DashboardGuard], canActivate: [AuthGuard], component: TableComponent,
+    children: [
+      { path: '', redirectTo: 'dashboard', pathMatch: 'full'}
+    ]
+  },
+  { path: 'dashboard/site', canActivate: [DashboardGuard], component: SiteComponent},
+  { path: 'dashboard/servComponent', canActivate: [ServiceComponentGuard], component: ServiceCompComponent},
+  { path: '**', redirectTo: 'login'}
+];
+
+@NgModule({
+  imports: [
+    RouterModule.forRoot(
+      appRoutes,
+      { enableTracing: false } // <-- debugging purposes only
+    )
+  ],
+  exports: [
+    RouterModule
+  ]
+})
+export class AppRoutingModule {}

svmon-front/src/app/app.component.css

+/*
+header, main, footer {
+  margin-left: 100px;
+}
+
+@media only screen and (max-width : 992px) {
+  header, main, footer {
+    margin-left: 0;
+  }
+}
+
+@media (min-width: 992px) and (max-width: 1010px) {
+  header, main, footer {
+    margin-left: 160px;
+  }
+}
+
+@media (min-width: 1010px) and (max-width: 1075px) {
+  header, main, footer {
+    margin-left: 150px;
+  }
+}
+
+@media (min-width: 1075px) and (max-width: 1300px) {
+  header, main, footer {
+    margin-left: 140px;
+  }
+}
+*/
+
+.sideBarContainer{
+  height: 100vh;
+}
+.contentRight{
+  padding-left: 300px;
+}
+.contentFull{
+}
+
+
+
+
+.header {
+  background: violet;
+  align-items: center;
+  color: white;
+  display: flex;
+  padding: 1em;
+}
+
+.headerToggle {
+  background: transparent;
+  border: 0.15rem solid white;
+  border-left: 0;
+  border-right: 0;
+  cursor: pointer;
+  font-size: 0;
+  height: 1.5rem;
+  margin-right: 1rem;
+  position: relative;
+  width: 2rem;
+}

svmon-front/src/app/app.component.html

+<!--
+<div class="container">
+  &lt;!&ndash; Header &ndash;&gt;
+  <div class="row">
+    <div class = "col-xs-12 col-sm-12 col-md-12">
+      <header class="main-header" role="banner">
+        <app-header></app-header>
+      </header>
+    </div>
+  </div>
+
+  &lt;!&ndash; Router body &ndash;&gt;
+  <div class="row">
+    <div class = "col-xs-12 col-sm-12 col-md-12">
+      <main>
+        <router-outlet></router-outlet>
+      </main>
+    </div>
+  </div>
+
+  <div class="row">
+    <div class = "col-xs-12 col-sm-12 col-md-12">
+      <footer>
+
+      </footer>
+    </div>
+  </div>
+</div>
+-->
+
+<!-- Container for sidebar(s) + page content -->
+<ng-sidebar-container class="sideBarContainer">
+
+ <ng-sidebar [(opened)]="opened" #sidebar>
+    <app-sidebar (authenticated)="authenticated"></app-sidebar>
+  </ng-sidebar> 
+
+  <div ng-sidebar-content [class]="contentClass">
+
+    <header>
+      <app-header></app-header>
+    </header>
+
+    <section class="mainBody">
+      <router-outlet></router-outlet>
+    </section>
+  </div>
+</ng-sidebar-container>
\ No newline at end of file

svmon-front/src/app/app.component.spec.ts

+import { TestBed, async } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+describe('AppComponent', () => {
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [
+        AppComponent
+      ],
+    }).compileComponents();
+  }));
+  it('should create the app', async(() => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.debugElement.componentInstance;
+    expect(app).toBeTruthy();
+  }));
+  it(`should have as title 'app'`, async(() => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.debugElement.componentInstance;
+    expect(app.title).toEqual('app');
+  }));
+  it('should render title in a h1 tag', async(() => {
+    const fixture = TestBed.createComponent(AppComponent);
+    fixture.detectChanges();
+    const compiled = fixture.debugElement.nativeElement;
+    expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!');
+  }));
+});

svmon-front/src/app/app.component.ts

+import {AfterViewInit, Component, EventEmitter, OnInit, OnDestroy, OnChanges, SimpleChanges} from '@angular/core';
+import {SideBarNotifierService} from '../svmongui-shared/services/SideBarNotifier/sideBarNotifier.service';
+import {HeaderComponent} from '../svmongui-shared/components/header/header.component';
+import {AuthService} from '../svmongui-shared/services/Auth/auth.service';
+import { SidebarComponent } from '../svmongui-shared/components/sidebar/sidebar.component';
+import  {SharedService} from './sharedService';
+
+
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.css']
+})
+
+export class AppComponent implements AfterViewInit{
+//export class AppComponent  {
+  title = 'SVMON';
+  public opened = false;
+ 
+  /** The class of the content **/
+  public contentClass = '';
+
+ public toggleSideBarEvent = new EventEmitter<Boolean>();
+
+  constructor(
+    private sideBarNotifier: SideBarNotifierService, private authService: AuthService ) {
+      console.log('in app constructor');
+      //this.opened = sharedService.opend;
+     if (this.authService.isAuthenticated){
+      this.opened = false;
+      this.setContentClass();
+     } else {
+       this.opened = true;
+       this.setContentClass();
+     }
+      
+      
+    //this.toggleSidebar();
+  }
+  //constructor (private authService: AuthService) {
+  //}
+
+  ngAfterViewInit() {
+    this.sideBarNotifier.sideBarToggled.subscribe( data => {
+      console.log('Toggled');
+      this.toggleSidebar();
+      console.log(data);
+      console.log("app after view init");
+    });
+  }
+
+  
+
+
+
+  public toggleSidebar () {
+    if ( this.authService.isAuthenticated ) {
+      this.opened = !this.opened;
+      this.setContentClass();
+    }
+  }
+   
+
+//Sets the class content acording if the sidebar is opened or closed 
+  private setContentClass() {
+     //We want to move the content to the right if the sidebar is opened 
+    if (this.opened) {
+      this.contentClass = 'contentRight';
+   } else {
+      this.contentClass = 'contentFull';
+    }
+  }
+
+}
+
+

svmon-front/src/app/app.module.ts

+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+
+import { AppComponent } from './app.component';
+import { AppRoutingModule } from './app-routing.module';
+import {DashboardModule} from './dashboard/dashboard.module';
+import { AuthModule } from './auth/auth.module';
+import {SiteService} from '../svmongui-shared/services/Site/site.service';
+import {ServiceComponentService} from '../svmongui-shared/services/ServiceComponent/ServiceComponent.service';
+import {ConfigParameterService} from '../svmongui-shared/services/ConfigParameter/ConfigParameter.service';
+import {SvmonguiSharedModule} from '../svmongui-shared/svmongui-shared.module';
+import {AuthGuard} from '../svmongui-shared/services/Auth/auth-guard.service';
+import {AuthService} from '../svmongui-shared/services/Auth/auth.service';
+import {DashboardGuard} from './guards/dashboard-guard.service';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import {SidebarModule} from 'ng-sidebar';
+import {SideBarNotifierService} from '../svmongui-shared/services/SideBarNotifier/sideBarNotifier.service';
+import {ServiceComponentGuard} from './guards/serviceComponent-guard.service';
+import {SharedService} from './sharedService';
+
+
+
+const MODULES = [
+  AuthModule,
+  DashboardModule,
+  SvmonguiSharedModule
+];
+
+const PAGE_MODULES = [
+];
+
+const NATIVE_SERVICES = [
+];
+
+const SERVICES = [
+  SiteService,
+  ServiceComponentService,
+  ConfigParameterService,
+  DashboardGuard,
+  AuthGuard,
+  AuthService,
+  ServiceComponentGuard,
+  SideBarNotifierService,
+  SharedService
+];
+
+const COMPONENTS = [
+];
+
+const PIPES = [];
+
+const DIRECTIVES = [];
+
+@NgModule({
+  declarations: [
+    AppComponent,
+    // ...MODULES,
+    COMPONENTS,
+    PIPES,
+    DIRECTIVES,
+    ...PAGE_MODULES,
+  ],
+  imports: [
+    BrowserModule,
+    AppRoutingModule,
+    BrowserAnimationsModule,
+    SidebarModule.forRoot(),
+    ...MODULES,
+    ...PAGE_MODULES
+  ],
+  providers: [
+    ...SERVICES,
+    ...NATIVE_SERVICES
+  ] ,
+  entryComponents: [
+
+  ],
+  bootstrap: [AppComponent]
+})
+export class AppModule { }

svmon-front/src/app/auth/auth.module.ts

+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { LoginComponent } from './login/login.component';
+import { AAILoginComponent } from './login/aailogin.component';
+import {SvmonguiSharedModule} from '../../svmongui-shared/svmongui-shared.module';
+import {HttpClientModule}  from '@angular/common/http';
+
+@NgModule({
+  imports: [
+    HttpClientModule,
+    CommonModule,
+    SvmonguiSharedModule
+  ],
+  declarations: [LoginComponent, AAILoginComponent]
+})
+export class AuthModule { }

svmon-front/src/app/auth/login/aailogin.component.html

+<div class="container">
+    <div class="card card-container">
+
+
+
+     <button class="btn btn-sm btn-secondary btn-block" (click)="ConfirmWithB2Access()">Confirmation with AAI</button> 
+     <!-- <button class="btn btn-sm btn-secondary btn-block" href="https://localhost:8443/login">Login with AAI</button> -->
+    </div>
+  </div>
\ No newline at end of file

svmon-front/src/app/auth/login/aailogin.component.ts

+import { Component, OnInit } from '@angular/core';
+import {NgForm} from '@angular/forms';
+import {Router} from '@angular/router';
+import {AuthService} from '../../../svmongui-shared/services/Auth/auth.service';
+import { HttpParams } from '@angular/common/http';
+import { constructDependencies } from '@angular/core/src/di/reflective_provider';
+import { HttpClient , HttpXsrfTokenExtractor, HttpHeaders } from '@angular/common/http';
+import { DefaultUrlHandlingStrategy } from '@angular/router/src/url_handling_strategy';
+import { PARAMETERS } from '@angular/core/src/util/decorators';
+
+@Component({
+  selector: 'app-aailogin',
+  templateUrl: './aailogin.component.html',
+  styleUrls: ['./aailogin.component.css']
+})
+export class AAILoginComponent  implements OnInit {
+  private token = '';
+
+   
+  constructor(private authService: AuthService, public router: Router ) {
+    const parameters = new URLSearchParams(window.location.search);
+    this.token = parameters.get('AccessToken');
+    console.log(this.token);
+    console.log('ccccc');
+  }
+
+  ngOnInit() {
+  }
+
+
+
+    ConfirmWithB2Access(): void {
+     this.authService.aaiAuthentication( this.token);
+     console.log(this.token);
+     console.log('aai token');
+   }
+
+
+}

svmon-front/src/app/auth/login/login.component.css

+/*
+ * Specific styles of signin component
+ */
+/*
+ * General styles
+ */
+body, html {
+  height: 100%;
+  background-repeat: no-repeat;
+  background-image: linear-gradient(rgb(104, 145, 162), rgb(12, 97, 33));
+}
+
+.card-container.card {
+  max-width: 350px;
+  padding: 40px 40px;
+}
+
+.btn {
+  font-weight: 700;
+  height: 36px;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  user-select: none;
+  cursor: default;
+}
+
+/*
+ * Card component
+ */
+.card {
+  background-color: #F7F7F7;
+  /* just in case there no content*/
+  padding: 20px 25px 30px;
+  margin: 0 auto 25px;
+  margin-top: 50px;
+  /* shadows and rounded borders */
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  border-radius: 2px;
+  -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
+  -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
+  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
+}
+
+.profile-img-card {
+  width: 96px;
+  height: 96px;
+  margin: 0 auto 10px;
+  display: block;
+  -moz-border-radius: 50%;
+  -webkit-border-radius: 50%;
+  border-radius: 50%;
+}
+
+/*
+ * Form styles
+ */
+.profile-name-card {
+  font-size: 16px;
+  font-weight: bold;
+  text-align: center;
+  margin: 10px 0 0;
+  min-height: 1em;
+}
+
+.reauth-email {
+  display: block;
+  color: #404040;
+  line-height: 2;
+  margin-bottom: 10px;
+  font-size: 14px;
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.form-signin #inputEmail,
+.form-signin #inputPassword {
+  direction: ltr;
+  height: 44px;
+  font-size: 16px;
+}
+
+.form-signin input[type=email],
+.form-signin input[type=password],
+.form-signin input[type=text],
+.form-signin button {
+  width: 100%;
+  display: block;
+  margin-bottom: 10px;
+  z-index: 1;
+  position: relative;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.form-signin .form-control:focus {
+  border-color: rgb(104, 145, 162);
+  outline: 0;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(104, 145, 162);
+  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(104, 145, 162);
+}
+
+.btn.btn-signin {
+  /*background-color: #4d90fe; */
+  background-color: rgb(104, 145, 162);
+  /* background-color: linear-gradient(rgb(104, 145, 162), rgb(12, 97, 33));*/
+  padding: 0px;
+  font-weight: 700;
+  font-size: 14px;
+  height: 36px;
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  border-radius: 3px;
+  border: none;
+  -o-transition: all 0.218s;
+  -moz-transition: all 0.218s;
+  -webkit-transition: all 0.218s;
+  transition: all 0.218s;
+}
+
+.btn.btn-signin:hover,
+.btn.btn-signin:active,
+.btn.btn-signin:focus {
+  background-color: rgb(12, 97, 33);
+}
+
+.forgot-password {
+  color: rgb(104, 145, 162);
+}
+
+.forgot-password:hover,
+.forgot-password:active,
+.forgot-password:focus{
+  color: rgb(12, 97, 33);
+}

svmon-front/src/app/auth/login/login.component.html

+<!--
+<div class="container">
+