V2.2 commit: Added Realtime Updating to Talks

I'm using Socket.io to handle the websockets that manage the message passing between clients

Author: lannonbr

.eslintrc.json

@@ -0,0 +1,8 @@
+{
+    "parserOptions": {
+        "ecmaVersion": 6
+    },
+    "rules": {
+        "curly": [2, "all"]
+    }
+}

index.js

@@ -6,6 +6,12 @@ var express = require('express'),
 
 var app = express();
 
+// create a node httpserver using the express app as a backend
+var httpserver = require('http').Server(app);
+
+// initalize socket.io object
+var io = require('socket.io')(httpserver);
+
 // use jade as the template engine
 app.set('view engine', 'pug');
 
@@ -43,7 +49,16 @@ app.post('/api/postTalk', talksCtrl.createTalk);
 app.post('/api/hideTalk', talksCtrl.updateTalk);
 app.post('/api/unhideTalk', talksCtrl.updateTalk);
 
+// Socket.io code
+io.on('connection', socket => {
+	
+	// When a client sends a update, broadcast it to all other clients
+	socket.on('update', data => {
+		socket.broadcast.emit('change', data);
+	})
+});
+
 // start the server
-app.listen(3000, () => {
+httpserver.listen(3000, () => {
 	console.log('Server listening on port 3000, press ctrl-C to quit...');
 });

package.json

@@ -1,27 +1,28 @@
 {
-	"name": "node-talks",
-	"version": "1.0.0",
-	"description": "A clone of the COSI talks flask app",
-	"main": "index.js",
-	"scripts": {
-		"test": "echo \"Error: no test specified\" && exit 1"
-	},
-	"author": "Benjamin Lannon",
-	"license": "MIT",
-	"dependencies": {
-		"body-parser": "^1.15.0",
-		"express": "^4.13.4",
-		"gulp": "^3.9.1",
-		"gulp-jshint": "^2.0.0",
-		"gulp-sass": "^2.3.1",
-		"insubnet": "0.0.8",
-		"jshint": "^2.9.1",
-		"jshint-stylish": "^2.1.0",
-		"morgan": "^1.7.0",
-		"promise": "^7.1.1",
-		"pug": "^2.0.0-alpha7",
-		"request-ip": "^1.2.2",
-		"sequelize": "^3.19.3",
-		"sqlite3": "^3.1.1"
-	}
+  "name": "node-talks",
+  "version": "1.0.0",
+  "description": "A clone of the COSI talks flask app",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "Benjamin Lannon",
+  "license": "MIT",
+  "dependencies": {
+    "body-parser": "^1.15.0",
+    "express": "^4.13.4",
+    "gulp": "^3.9.1",
+    "gulp-jshint": "^2.0.0",
+    "gulp-sass": "^2.3.1",
+    "insubnet": "0.0.8",
+    "jshint": "^2.9.1",
+    "jshint-stylish": "^2.1.0",
+    "morgan": "^1.7.0",
+    "promise": "^7.1.1",
+    "pug": "^2.0.0-alpha7",
+    "request-ip": "^1.2.2",
+    "sequelize": "^3.19.3",
+    "socket.io": "^1.4.8",
+    "sqlite3": "^3.1.1"
+  }
 }

public/js/app.js

@@ -7,39 +7,42 @@ function getTalks($scope, $http) {
 	});
 }
 
-function postTalk($scope, $http) {
+function postTalk($scope, $http, socket) {
 	// Set the data to be sent through the request to be the newTalk object
 	var data = $scope.newTalk;
 
 	// Send the POST request
 	$http.post("/api/postTalk", data).then(response => {
-			$scope.talks = response.data; // Set the scope's talks to be the output of the api call
+		$scope.talks = response.data; // Set the scope's talks to be the output of the api call
+		socket.emit("update", response.data); // Send it to the websocket to broadcast the change to everyone else
 	}, error => {
 		alert("Talk submissions are only allowed in the 128.153.0.0/16 subnet");
 	});
 }
 
-function hideTalk($scope, $http) {
+function hideTalk($scope, $http, socket) {
 	var data = {
 		talkId: $scope.id,
 		hiddenStatus: true
 	};
 
 	$http.post("/api/hideTalk", data).then(response => {
 		$scope.talks = response.data;
+		socket.emit("update", response.data);
 	}, error => {
 		alert("Talk modifications are only allowed in the 128.153.0.0/16 subnet");
 	});
 }
 
-function unhideTalk($scope, $http) {
+function unhideTalk($scope, $http, socket) {
 	var data = {
 		talkId: $scope.id,
 		hiddenStatus: false
 	};
 
 	$http.post("/api/unhideTalk", data).then(response => {
 		$scope.talks = response.data;
+		socket.emit("update", response.data);
 	}, error => {
 		alert("Talk modifications are only allowed in the 128.153.0.0/16 subnet");
 	});
@@ -49,21 +52,28 @@ function unhideTalk($scope, $http) {
 app.controller('talksController', ($scope, $http) => {
 	getTalks($scope, $http); // Always load in talks at startup
 
+	let socket = io.connect();
+
+	socket.on('change', data => {
+		$scope.talks = data;
+		$scope.$apply();
+	});
+
 	// Send a http POST request to create a new talk
 	$scope.createTalk = () => {
-		postTalk($scope, $http);
+		postTalk($scope, $http, socket);
 		$scope.newTalk = {}; // Clear out the input boxes
 	};
 
 	// Hide a certain talk
 	$scope.hide = (id) => {
 		$scope.id = id;
-		hideTalk($scope, $http);
+		hideTalk($scope, $http, socket);
 	};
 
 	// unhide a certain talk
 	$scope.unhide = (id) => {
 		$scope.id = id;
-		unhideTalk($scope, $http);
+		unhideTalk($scope, $http, socket);
 	};
 });