Feat/springsecurity

ida-chatbot/src/app/app-routing.module.ts

@@ -0,0 +1,23 @@
+import {NgModule} from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import {UserComponent} from './components/user/user.component';
+import {LoginComponent} from './components/login/login.component';
+import {SignupComponent} from './components/signup/signup.component';
+import {HomeComponent} from './components/home/home.component';
+const routes: Routes = [
+    { path: 'user', component: UserComponent },
+    { path: 'login', component: LoginComponent },
+    { path: 'signup', component: SignupComponent },
+    { path: '', component: HomeComponent },
+    { path: '**', redirectTo: '' }
+];
+@NgModule({
+    imports: [
+        RouterModule.forRoot(routes)
+    ],
+    exports: [
+        RouterModule
+    ],
+    declarations: []
+})
+export class AppRoutingModule { }

ida-chatbot/src/app/app.component.css

@@ -1,11 +1,3 @@
-.example-container {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  background: lightseagreen;
-}
 
 #chatBox {
   position: absolute ;

ida-chatbot/src/app/app.component.html

@@ -1,13 +1 @@
-<div fxLayout="row">
-  <!--<div fxFlex="10%" style="background-color:#eaeaea; overflow: auto;">-->
-  <app-sidebar fxFlex="nogrow" [items]="getSidebarItems()" (activeItmEmitter)="changeActiveItem($event)"
-               [activeItem]="getActiveItem()"></app-sidebar>
-  <!-- </div>-->
-  <div fxFlex="100%" id="mainView">
-    <app-intro [ngClass]="{'hidden-cls': activeItem!==0 }"></app-intro>
-    <ng-container *ngFor="let mvw of getMainviewItems()" >
-    <app-data-view-container [item]="mvw" [ngClass]="{'hidden-cls': activeItem!==mvw.id }"></app-data-view-container>
-    </ng-container>
-  </div>
-  <app-chatbox id="chatBox" fxFlexAlign="end" fxFlex="auto" (actnEmitter)="addNewUserMessage($event)"></app-chatbox>
-</div>
+<router-outlet></router-outlet>

ida-chatbot/src/app/app.module.ts

@@ -1,5 +1,6 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
+import { AppRoutingModule } from './app-routing.module';
 
 import { AppComponent } from './app.component';
 import { MessageListComponent } from './components/message-list/message-list.component';
@@ -11,6 +12,11 @@ import {HttpModule} from '@angular/http';
 import {CdkTableModule} from '@angular/cdk/table';
 import {HTTP_INTERCEPTORS, HttpClientModule} from '@angular/common/http';
 import { FlexLayoutModule } from '@angular/flex-layout';
+import { LoginComponent } from './components/login/login.component';
+import { UserComponent } from './components/user/user.component';
+import { SignupComponent } from './components/signup/signup.component';
+import {DeleteDialogComponent} from './dialogs/delete/delete.dialog.component';
+import {UpdateDialogComponent} from './dialogs/update/update.dialog.component';
 import {
   MatAutocompleteModule,
   MatButtonModule,
@@ -60,6 +66,9 @@ import {DatatableDetailComponent} from './components/datatable-detail/datatable-
 import { SsbViewComponent } from './components/ssb-view/ssb-view.component';
 import { VennViewComponent } from './components/venn-view/venn-view.component';
 import { DeckglHexViewComponent } from './components/deckgl-hex-view/deckgl-hex-view.component';
+import { HomeComponent } from './components/home/home.component';
+import { TopbarComponent } from './components/topbar/topbar.component';
+import { TopmenuComponent } from './components/topmenu/topmenu.component';
 import { SpeechInputComponent } from './components/speech-input/speech-input.component';
 import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
 @NgModule({
@@ -81,6 +90,14 @@ import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
     SsbViewComponent,
     VennViewComponent,
     DeckglHexViewComponent,
+    LoginComponent,
+    UserComponent,
+    SignupComponent,
+    DeleteDialogComponent,
+    UpdateDialogComponent,
+    HomeComponent,
+    TopbarComponent,
+    TopmenuComponent,
     SpeechInputComponent
   ],
   imports: [
@@ -123,8 +140,14 @@ import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
     MatToolbarModule,
     MatTooltipModule,
     FlexLayoutModule,
+    ReactiveFormsModule,
+    AppRoutingModule,
     NgbModule
   ],
+  entryComponents: [
+    UpdateDialogComponent,
+    DeleteDialogComponent
+  ],
   providers: [{
     provide: HTTP_INTERCEPTORS,
     useClass: RestService ,

ida-chatbot/src/app/components/chatbox/chatbox.component.css

@@ -2,6 +2,7 @@
 .chat-popup {
   position: fixed;
   bottom: 0;
+  right: 9%;
   z-index: 9;
   width: 25%;
 }

ida-chatbot/src/app/components/home/home.component.css

@@ -0,0 +1,8 @@
+.example-container {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: lightseagreen;
+}

ida-chatbot/src/app/components/home/home.component.html

@@ -0,0 +1,16 @@
+<div *ngIf="!this.isHidden">
+  <app-topmenu></app-topmenu>
+<div fxLayout="row">
+<!--<div fxFlex="10%" style="background-color:#eaeaea; overflow: auto;">-->
+<app-sidebar fxFlex="nogrow" [items]="getSidebarItems()" (activeItmEmitter)="changeActiveItem($event)"
+[activeItem]="getActiveItem()"></app-sidebar>
+<!-- </div>-->
+<div fxFlex="100%">
+<app-intro [ngClass]="{'hidden-cls': activeItem!==0 }"></app-intro>
+<ng-container *ngFor="let mvw of getMainviewItems()" >
+<app-data-view-container [item]="mvw" [ngClass]="{'hidden-cls': activeItem!==mvw.id }"></app-data-view-container>
+</ng-container>
+</div>
+<app-chatbox fxFlexAlign="end" fxFlex="auto" (actnEmitter)="addNewUserMessage($event)"></app-chatbox>
+</div>
+</div>

ida-chatbot/src/app/components/home/home.component.spec.ts

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

ida-chatbot/src/app/components/home/home.component.ts

@@ -0,0 +1,171 @@
+import {Component, OnInit, ElementRef, QueryList, ViewChild, ViewChildren} from '@angular/core';
+import {Message} from '../../models/message';
+import {ResponseBean} from '../../models/response-bean';
+import {SidebarComponent} from '../../components/sidebar/sidebar.component';
+import {MainviewElement} from '../../models/mainview-element';
+import {SidebarElement} from '../../models/sidebar-element';
+import {ChatboxComponent} from '../../components/chatbox/chatbox.component';
+import {RestService} from '../../service/rest/rest.service';
+import {DataViewContainerComponent} from '../../components/data-view-container/data-view-container.component';
+import {TabElement} from '../../models/tab-element';
+import {UniqueIdProviderService} from '../../service/misc/unique-id-provider.service';
+import {TabType} from '../../enums/tab-type.enum';
+import {IdaEventService} from '../../service/event/ida-event.service';
+import {UserService} from '../../service/user/user.service';
+import {Router} from '@angular/router';
+
+@Component({
+  selector: 'app-home',
+  templateUrl: './home.component.html',
+  styleUrls: ['./home.component.css']
+})
+export class HomeComponent implements OnInit {
+
+  idCount = 1;
+  title = 'app';
+  isHidden = true;
+  public introSideItem = new SidebarElement(0, 'Introduction', 'intro');
+  public activeItem = 0;
+  private sidebarItems: SidebarElement[] = [this.introSideItem];
+  private mainViewItems: MainviewElement[] = [];
+  @ViewChild(ChatboxComponent)
+  private chatboxComp: ChatboxComponent;
+  @ViewChildren(DataViewContainerComponent)
+  private dataVwCompList: QueryList<DataViewContainerComponent>;
+  @ViewChild(SidebarComponent)
+  private sbComp: SidebarComponent;
+
+  constructor(private restservice: RestService, private uis: UniqueIdProviderService,
+              private ies: IdaEventService, private userservice: UserService, private router: Router) {
+    ies.dtTblEvnt.subscribe((reqTbl) => {
+      this.getDataTable(reqTbl);
+    });
+  }
+
+  ngOnInit() {
+    this.checkLoggedIn();
+  }
+
+  HomeComponent() {
+  }
+
+  public actionHandler(resp: ResponseBean) {
+    if (resp.actnCode === 1) {
+      const newId = this.idCount++;
+      // load the dataset
+      const sdbEle = new SidebarElement(newId, resp.payload.label, resp.payload.dsName);
+      this.sidebarItems.push(sdbEle);
+      const mvEle = new MainviewElement(newId, resp.payload.dataset, resp.payload.dsMd);
+      this.mainViewItems.push(mvEle);
+      this.activeItem = newId;
+    } else if (resp.actnCode === 2) {
+      // Open new tab with Force Directed Graph
+      const newTab = new TabElement(this.uis.getUniqueId(), 'Force Directed Graph', TabType.FDG, resp.payload.fdgData, true, true);
+      this.addNewTab(newTab, resp);
+    } else if (resp.actnCode === 3) {
+      // Open new tab with Bar Graph
+      const newTab = new TabElement(this.uis.getUniqueId(), 'Bar Graph', TabType.BG, resp.payload.bgData, true, true);
+      this.addNewTab(newTab, resp);
+    } else if (resp.actnCode === 4) {
+      // Open new tab with DataTable
+      const newTab = new TabElement(this.uis.getUniqueId(), resp.payload.tabLabel, TabType.DTTBL, resp.payload.clusterData, true, true);
+      this.addNewTab(newTab, resp);
+    } else if (resp.actnCode === 5) {
+      // Open new tab with DataTable
+      const newTab = new TabElement(this.uis.getUniqueId(), resp.payload.actvTbl, TabType.DTTBL, resp.payload.dataTable, true, true);
+      this.addNewTab(newTab, resp);
+    }
+  }
+
+  addNewTab(newTab: TabElement, resp: ResponseBean) {
+    for (const mvwItem of this.mainViewItems) {
+      if (Number(resp.payload.actvScrId) === mvwItem.id) {
+        // Add a tab to extra tabs
+        mvwItem.tabArr.push(newTab);
+        this.getActiveMainView().focusLastTab();
+        break;
+      }
+    }
+  }
+
+  addNewUserMessage(message: Message) {
+    this.chatboxComp.addNewMessage(message);
+    let actvTbl = '';
+    let actvDs = '';
+    if (this.getActiveMainView() && this.sbComp) {
+      actvTbl = this.getActiveMainView().getActiveDataTableName();
+      actvDs = this.sbComp.getActiveDatasetName();
+    }
+    const prmobj = {
+      msg: message.content,
+      actvScrId: this.activeItem,
+      actvTbl: actvTbl == null ? '' : actvTbl,
+      actvDs: actvDs == null ? '' : actvDs
+    };
+    // Send the message to server
+    this.restservice.getRequest('/message/sendmessage', prmobj).subscribe(resp => this.processBotResponse(resp));
+  }
+
+  getDataTable(reqTbl: string) {
+    let actvDs = '';
+    if (this.getActiveMainView() && this.sbComp) {
+      actvDs = this.sbComp.getActiveDatasetName();
+    }
+    const prmobj = {
+      actvScrId: this.activeItem,
+      actvTbl: reqTbl == null ? '' : reqTbl,
+      actvDs: actvDs == null ? '' : actvDs
+    };
+    // Send the message to server
+    this.restservice.getRequest('/message/getdatatable', prmobj).subscribe(resp => this.processBotResponse(resp));
+  }
+
+  processBotResponse(resp: ResponseBean) {
+    this.restservice.requestEvnt.emit(false);
+    const msg: Message = new Message(resp.chatmsg, 'Assistant', 'chatbot', new Date());
+    // Putting delay to make responses look natural
+    setTimeout(() => this.chatboxComp.addNewMessage(msg), 300);
+    if (resp.actnCode > 0) {
+      // load the dataset
+      this.actionHandler(resp);
+    }
+  }
+
+  checkLoggedIn() {
+    this.restservice.getRequest('/auth/check-login', {}).subscribe(resp => {
+      const returnResp = this.userservice.processUserResponse(resp);
+      if (returnResp.status === true) {
+        this.isHidden = false;
+      } else {
+        this.router.navigate(['login']);
+      }
+    });
+  }
+
+  public getActiveMainView(): DataViewContainerComponent {
+    let activeMainDtVw = null;
+    this.dataVwCompList.forEach((mvEntry) => {
+      if (mvEntry.item.id === this.activeItem) {
+        activeMainDtVw = mvEntry;
+      }
+    });
+    return activeMainDtVw;
+  }
+
+  public getMainviewItems() {
+    return this.mainViewItems;
+  }
+
+  public getSidebarItems() {
+    return this.sidebarItems;
+  }
+
+  public changeActiveItem(newId: number) {
+    this.activeItem = newId;
+  }
+
+  public getActiveItem() {
+    return this.activeItem;
+  }
+
+}

ida-chatbot/src/app/components/login/login.component.css

@@ -0,0 +1,33 @@
+mat-form-field{
+    width: 400px;
+}
+mat-card-title{
+    text-align: center;
+}
+mat-card{
+    width: 400px;
+    margin: 70px auto;
+}
+mat-spinner{
+    position: absolute;
+    top: 50%;
+    left: 38%;
+}
+
+.mat-card-header .mat-card-title, .mat-card-subtitle{
+  font-size: 12px;
+}
+
+.mat-display-2{
+  margin: 0 0 20px;
+}
+
+mat-form-field, mat-card-content{
+  width: 100%;
+}
+
+mat-card-actions{
+  width: 100%;
+  text-align: right;
+  margin-bottom: 0;
+}