Commit c418b031 authored by Lukas Burgey's avatar Lukas Burgey

Implement live updates from the backend

parent a84e85c7
This source diff could not be displayed because it is too large. You can view the blob instead.
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { JsonPipe } from '@angular/common';
import { HttpModule } from '@angular/http';
import { HttpClientModule, HttpClientXsrfModule } from '@angular/common/http';
import {BrowserModule} from '@angular/platform-browser';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {NgModule} from '@angular/core';
import {FormsModule} from '@angular/forms';
import {RouterModule} from '@angular/router';
import {JsonPipe} from '@angular/common';
import {HttpModule} from '@angular/http';
import {HttpClientModule, HttpClientXsrfModule} from '@angular/common/http';
import { MatButtonModule } from '@angular/material';
import { MatToolbarModule } from '@angular/material';
import { MatTableModule } from '@angular/material/table';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatIconModule } from '@angular/material/icon';
import { MatDialogModule } from '@angular/material/dialog';
import {MatButtonModule} from '@angular/material';
import {MatToolbarModule} from '@angular/material';
import {MatTableModule} from '@angular/material/table';
import {MatSnackBarModule} from '@angular/material/snack-bar';
import {MatExpansionModule} from '@angular/material/expansion';
import {MatIconModule} from '@angular/material/icon';
import {MatDialogModule} from '@angular/material/dialog';
import {MatFormFieldModule} from '@angular/material/form-field';
import {MatSelectModule} from '@angular/material/select';
import {MatInputModule} from '@angular/material/input';
import {MatCheckboxModule} from '@angular/material/checkbox';
import {MatTooltipModule} from '@angular/material/tooltip';
// Other libs
import {StompRService} from '@stomp/ng2-stompjs';
import {CookieService} from 'ngx-cookie-service';
import { CookieService } from 'ngx-cookie-service';
// Our stuff
import {UserService} from './user.service';
import {SnackBarService} from './snackbar.service';
import {DialogService} from './dialog.service';
import { UserService } from './user.service';
import { SnackBarService } from './snackbar.service';
import { DialogService } from './dialog.service';
import {AppComponent} from './app.component';
import {MgmtComponent} from './mgmt/mgmt.component';
import {LoginComponent} from './login/login.component';
import {ProfileComponent} from './profile/profile.component';
import {ServiceComponent} from './service/service.component';
import {SshKeysComponent} from './ssh-keys/ssh-keys.component';
import {AccountComponent} from './account/account.component';
import { AppComponent } from './app.component';
import { MgmtComponent } from './mgmt/mgmt.component';
import { LoginComponent } from './login/login.component';
import { ProfileComponent } from './profile/profile.component';
import { ServiceComponent } from './service/service.component';
import { SshKeysComponent } from './ssh-keys/ssh-keys.component';
import { AccountComponent } from './account/account.component';
/*
const routes = [
{
path: '',
component: MgmtComponent,
},
{
path: '*',
redirectTo: '/',
},
];
*/
@NgModule({
declarations: [
......@@ -92,6 +82,7 @@ const routes = [
SnackBarService,
DialogService,
JsonPipe,
StompRService,
],
bootstrap: [AppComponent],
entryComponents: [
......
......@@ -47,6 +47,7 @@ export interface User {
userinfo: any;
ssh_keys: SSHKey[];
deployments: Deployment[];
id: number;
}
interface StateAPI {
......
import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import {Injectable } from '@angular/core';
import {HttpClient, HttpErrorResponse } from '@angular/common/http';
import {Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/of';
import { CookieService } from 'ngx-cookie-service';
import { MatTableDataSource } from '@angular/material';
import {CookieService } from 'ngx-cookie-service';
import {MatTableDataSource } from '@angular/material';
import { SnackBarService } from './snackbar.service';
import {SnackBarService } from './snackbar.service';
import {StompConfig, StompRService} from '@stomp/ng2-stompjs';
import {Message} from '@stomp/stompjs';
import { environment } from '../environments/environment';
import { IdP, User, Service, AuthInfo, AllAuthInfo, UserState, SSHKey, NewSSHKey } from './types/types.module';
import {environment } from '../environments/environment';
import {IdP, User, Service, AuthInfo, AllAuthInfo, UserState, SSHKey, NewSSHKey } from './types/types.module';
@Injectable()
......@@ -27,6 +29,7 @@ export class UserService {
public cookieService: CookieService,
public http: HttpClient,
public snackBar: SnackBarService,
private _stompService: StompRService,
) {
this.update();
}
......@@ -74,11 +77,6 @@ export class UserService {
this.snackBar.open(data['error']);
}
if (!this.loggedIn && data.logged_in) {
this.snackBar.open('Logged in');
}
this.loggedIn = data.logged_in;
if (!this.services) {
this.services = data.services;
}
......@@ -105,6 +103,13 @@ export class UserService {
this.sshKeyData = null;
this.userInfoData = null;
}
if (!this.loggedIn && data.logged_in) {
this.snackBar.open('Logged in');
// TODO dirty
this.connectLiveUpdates()
}
this.loggedIn = data.logged_in;
}
public updateState() {
......@@ -224,4 +229,54 @@ export class UserService {
}
);
}
public initStomp() {
// handle with care
let login = this.user.id
let passcode = this.cookieService.get('sessionid');
const stompConfig: StompConfig = {
// Which server?
url: 'wss://hdf-portal.data.kit.edu:15671/ws',
// Headers
// Typical keys: login, passcode, host
headers: {
login: 'webpage-client:' + login,
passcode: passcode,
},
// How often to heartbeat?
// Interval in milliseconds, set to 0 to disable
heartbeat_in: 0, // Typical value 0 - disabled
heartbeat_out: 20000, // Typical value 20000 - every 20 seconds
// Wait in milliseconds before attempting auto reconnect
// Set to 0 to disable
// Typical value 5000 (5 seconds)
reconnect_delay: 5000,
// Will log diagnostics on console
debug: true
};
this._stompService.config = stompConfig;
this._stompService.initAndConnect();
}
public connectLiveUpdates() {
this.initStomp();
let subscription = this._stompService.subscribe(
'/exchange/update/' + this.user.id.toString()
);
subscription.map((message: Message) => {
return message.body;
}).subscribe((msg_body: string) => {
this.snackBar.open(
'Backend: ' + msg_body
);
console.log(`Received: ${msg_body}`);
});
}
}
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment