Finishes basic websocket-handler.service.ts

web/src/app/pages/settings/settings.component.html

@@ -1,5 +1,5 @@
 <form class="example-form">
   <md-form-field class="example-full-width">
-    <input mdInput placeholder="Favorite food" value="Sushi">
+    <input mdInput placeholder="Favorite food" value="{{Settings?.Name}}">
   </md-form-field>
 </form>

web/src/app/pages/settings/settings.component.ts

@@ -7,10 +7,42 @@ import { WebsocketHandlerService } from './../../services/websocket-handler/webs
   styleUrls: ['./settings.component.scss']
 })
 export class SettingsComponent implements OnInit {
+  private settings:any = null;
+  private ws: WebsocketHandlerService;
 
-  constructor() { }
+  constructor(private websocketHandler: WebsocketHandlerService) {
+    this.ws = websocketHandler;
+    this.ws.messages.subscribe(msg => {
+      if(msg.Event == "GetConfig") {
+        this.settings = msg.data;
+      } else if (msg.Event == "SaveConfig") {
+        //something!
+      }
+    });
+  }
 
   ngOnInit() {
+    this.getSettings();
+  }
+
+  private getSettingsMessage = {
+    Event:'GetConfig',
+    data:null
+  };
+
+  private getSettings():void {
+		console.log('new message from client to websocket: ', this.getSettingsMessage);
+    this.ws.messages.next(this.getSettingsMessage);
+    this.resendMessageIfPageRefreshed();
+  } 
+
+  private resendMessageIfPageRefreshed():void {
+    setInterval(()=> {
+      if(this.settings === null) {
+        console.log('Settings hasnt been set. Trying again');
+        this.getSettings();
+      }
+    }, 1000);
   }
 
 }

web/src/app/services/websocket-handler/websocket-handler.service.ts

@@ -10,30 +10,20 @@ export interface Message {
 	data:object,
 }
 
-
 @Injectable()
 export class WebsocketHandlerService {
   public messages: Subject<Message>;
-  
-   private authenticateMessage = {
-    Event:'auth',
-    data:{"username":"Username","password":"e7cf3ef4f17c3999a94f2c6f612e8a888e5b1026878e4e19398b23bd38ec221a"},
-  }
 
-	constructor(wsService: WebsocketService) {
+  constructor(wsService: WebsocketService) {
 		this.messages = <Subject<Message>>wsService
 			.connect(WEBSOCKET_URL) 
 			.map((response: MessageEvent): Message => {
         let data = JSON.parse(response.data);
-        console.log('Recieved response from websocket. Event: '+ data.Event)
-        
+        console.log('Recieved response from websocket. Event: ' + data.Event)
 				return {
 					Event: data.Event,
 					data: data.data,
 				}
       });
-      //Auth straight away!
-      console.log('Sending message to websocket. Event:'+this.authenticateMessage.Event+'. Message: ' + JSON.stringify(this.authenticateMessage.data));
-      this.messages.next(this.authenticateMessage);
-	}
-}
+    }
+  }

web/src/app/services/websocket/websocket.service.ts

@@ -10,11 +10,17 @@ export class WebsocketService {
   public connect(url): Rx.Subject<MessageEvent> {
     if (!this.subject) {
       this.subject = this.create(url);
-      console.log("Successfully connected: " + url);
     } 
     return this.subject;
   }
 
+  private authenticateMessage = {
+    Event:'auth',
+    data:{"username":"Username","password":"e7cf3ef4f17c3999a94f2c6f612e8a888e5b1026878e4e19398b23bd38ec221a"},
+  }
+
+  private isAuth = false;
+
   private create(url): Rx.Subject<MessageEvent> {
     let ws = new WebSocket(url);
     
@@ -27,12 +33,16 @@ export class WebsocketService {
 	})
 let observer = {
 		next: (data: Object) => {
-			if (ws.readyState === WebSocket.OPEN) {
+    if (ws.readyState === WebSocket.OPEN) {
+        if(!this.isAuth) {
+          //This is a shit initial way to be able to authenticate
+          ws.send(JSON.stringify(this.authenticateMessage));
+          this.isAuth = true;
+        }
 				ws.send(JSON.stringify(data));
-			}
-		}
-	}
+      }
+  }
+  }
 	return Rx.Subject.create(observer, observable);
   }
-
 }

web/src/app/shared/chatbutton/chatbutton.component.html

@@ -1,2 +1,3 @@
- <button (click)="authenticate()">Authenticate</button>
-<button (click)="getSettings()">Get Settings</button>
+<button (click)="getSettings()">Get Settings</button>
+
+<p>{{settings?.Name}}</p>

web/src/app/shared/chatbutton/chatbutton.component.ts

@@ -10,25 +10,22 @@ export class ChatbuttonComponent implements OnInit {
 
     constructor(private chatService: WebsocketHandlerService) {
       	chatService.messages.subscribe(msg => {
+          if(msg.Event == "GetConfig") {
+            this.settings = msg.data;
+          }
         });
 	}
 
   ngOnInit() {
   }
 
+  private settings:any;
+
   private getSettingsMessage = {
     Event:'GetConfig',
     data:null,
-  }
-  private authenticateMessage = {
-    Event:'auth',
-    data:{"username":"Username","password":"16f78a7d6317f102bbd95fc9a4f3ff2e3249287690b8bdad6b7810f82b34ace3"},
-  }
-  
-  authenticate():void {
-		console.log('new message from client to websocket: ', this.authenticateMessage);
-		this.chatService.messages.next(this.authenticateMessage);
-	}
+  };
+ 
 
   getSettings():void {
 		console.log('new message from client to websocket: ', this.getSettingsMessage);