Skip to content
Snippets Groups Projects
Commit 6f7627c6 authored by Mathis Neumann's avatar Mathis Neumann
Browse files

websocket as a service

parent 3ddd7dcd
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
app/app.js
+ 6
− 0
View file @ 6f7627c6
import Ember from 'ember'; import Ember from 'ember';
import EmberData from 'ember-data';
import Resolver from './resolver'; import Resolver from './resolver';
import loadInitializers from 'ember-load-initializers'; import loadInitializers from 'ember-load-initializers';
import config from './config/environment'; import config from './config/environment';
...@@ -22,6 +23,11 @@ loadInitializers(App, config.modulePrefix); ...@@ -22,6 +23,11 @@ loadInitializers(App, config.modulePrefix);
export default App; export default App;
// TODO: just for development purposes
window.App = App;
window.Ember = Ember;
window.EmberData = EmberData;
// ember (via ember-runtime) sets native prototype enhancements like .property/.observer, but as enumerable // ember (via ember-runtime) sets native prototype enhancements like .property/.observer, but as enumerable
// we need to fix enumerability since it breaks cose-bilkent and sometimes cytoscape // we need to fix enumerability since it breaks cose-bilkent and sometimes cytoscape
function avoidEnumerableNativeExtensions(proto) { function avoidEnumerableNativeExtensions(proto) {
......
app/index.html
+ 1
− 1
View file @ 6f7627c6
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>FrontendPrototype</title> <title>iObserve UI</title>
<meta name="description" content=""> <meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
......
app/routes/deployments/single.js
+ 9
− 1
View file @ 6f7627c6
...@@ -3,8 +3,13 @@ import Ember from 'ember'; ...@@ -3,8 +3,13 @@ import Ember from 'ember';
export default Ember.Route.extend({ export default Ember.Route.extend({
session: Ember.inject.service(), // loads services/session.js session: Ember.inject.service(), // loads services/session.js
graphingService: Ember.inject.service(), graphingService: Ember.inject.service(),
changelogStream: Ember.inject.service(),
model(params) { model(params) {
this.set('session.systemId', params.systemId); // add the system to all requests const systemId = params.systemId;
this.set('session.systemId', systemId); // add the system to all requests
const changelogStream = this.get('changelogStream'); // lazy loaded, requires session id
changelogStream.connect(systemId);
const graphingService = this.get('graphingService'); const graphingService = this.get('graphingService');
const createGraph = graphingService.createGraph.bind(graphingService); const createGraph = graphingService.createGraph.bind(graphingService);
...@@ -44,6 +49,9 @@ export default Ember.Route.extend({ ...@@ -44,6 +49,9 @@ export default Ember.Route.extend({
entityId entityId
}); });
this.transitionTo(url); this.transitionTo(url);
},
willTransition() {
this.get('changelogStream').disconnect();
} }
} }
}); });
app/services/changelog-stream.js 0 → 100644
+ 60
− 0
View file @ 6f7627c6
import Ember from 'ember';
export default Ember.Service.extend({
shouldClose: false,
init() {
this._super(...arguments);
this.debug('session', this.get('systemId'));
},
connect(systemId) {
this.set('shouldClose', false);
this.debug('setting up websocket', systemId);
const socket = new WebSocket(`ws://localhost:8080/v1/changelogstream/${systemId}`);
this.set('socket', socket);
socket.onopen = this.get('events.onOpen').bind(this);
socket.onerror = this.get('events.onError').bind(this);
socket.onmessage = this.get('events.onMessage').bind(this);
// automatically reconnect
socket.onclose = () => {
if(!this.get('shouldClose')) {
this.debug('connection lost, reconnecting!');
this.set('reconnectionTimeout', setTimeout(() => {
this.connect(systemId);
this.set('reconnectionTimeout', null);
}, 500));
}
};
// close socket connection when the user closes the window/tab or nagivates to a different website
window.onbeforeunload = this.get('disconnect').bind(this);
},
disconnect() {
this.debug('disconnect');
this.set('shouldClose', true);
this.get('socket').close();
// just in case it disconnected right before disconnect() was called.
clearTimeout(this.get('reconnectionTimeout'));
},
events: {
onError(err) {
this.debug('socket connection encountered an error', err);
},
onOpen() {
this.debug('connection established');
},
onMessage(message) {
const changelogJson = message.data;
this.debug('new changelog received', changelogJson);
try {
const changelog = JSON.parse(changelogJson);
this.debug('changelog converted', changelog);
} catch (e) {
console.error('could not parse changelog json', e, changelogJson);
}
}
}
});
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