Skip to content

Commit 52b835a

Browse files
gdepuillegdepuille
committed
Merge branch 'feature/subTopic'
2 parents 9e9704a + 29ba9b6 commit 52b835a

File tree

12 files changed

+317
-19
lines changed

12 files changed

+317
-19
lines changed

‎.gitignore‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,6 @@
11
examples/sockjs/node_modules
22

3+
4+
.idea/
5+
6+
node_modules/

‎README.md‎

Lines changed: 25 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,11 @@ Usage from the browser
1515

1616
On the client side (browser) load library like that:
1717

18-
<script src="http://cdn.sockjs.org/websocket-multiplex-0.1.js">
19-
</script>
18+
<script src="http://cdn.sockjs.org/websocket-multiplex-0.1.js"></script>
2019

2120
Alternatively, if you're using SSL:
2221

23-
<script src="https://d1fxtkz8shb9d2.cloudfront.net/websocket-multiplex-0.1.js">
24-
</script>
22+
<script src="https://d1fxtkz8shb9d2.cloudfront.net/websocket-multiplex-0.1.js"></script>
2523

2624
Usage example:
2725

@@ -35,6 +33,18 @@ Usage example:
3533
var carl = multiplexer.channel('carl');
3634
```
3735

36+
If the sub topic is activated on server configuration, you have the possibility to create one with dot separated syntax.
37+
38+
```javascript
39+
var sockjs_url = '/multiplex';
40+
var sockjs = new SockJS(sockjs_url);
41+
42+
var multiplexer = new WebSocketMultiplex(sockjs);
43+
var ann = multiplexer.channel('ann.spell');
44+
var bob = multiplexer.channel('bob.age');
45+
var carl = multiplexer.channel('carl.23');
46+
```
47+
3848
Usage from the node.js server
3949
-----------------------------
4050

@@ -67,11 +77,21 @@ And a simplistic example:
6777
var app = express.createServer();
6878
```
6979

80+
To authorize sub topic, it is necessary to add the configuration of the option during creation of MultiplexServer.
81+
This configuration is deactivated by default.
82+
83+
```javascript
84+
85+
// Setup multiplexing with sub topic
86+
var opts = {allowSubTopic: true};
87+
var multiplexer = new multiplex_server.MultiplexServer(service, opts);
88+
89+
```
90+
7091
For a full-featured example see the
7192
[/examples/sockjs](https://github.com/sockjs/websocket-multiplex/tree/master/examples/sockjs)
7293
directory.
7394

74-
7595
Protocol
7696
--------
7797

‎examples/sockjs-subtopic/index.html‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<title>SockJS - Sub topic multiplex sample</title>
9+
10+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
11+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
12+
13+
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
14+
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
15+
<!--[if lt IE 9]>
16+
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
17+
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
18+
<![endif]-->
19+
</head>
20+
21+
<body ng-app="subTopicSample">
22+
23+
<div class="container" ng-controller="MainCtrl">
24+
<div class="row">
25+
<div class="col-md-6">
26+
<cjs-line dataset="lineData" responsive="true"></cjs-line>
27+
</div>
28+
<div class="col-md-6">
29+
<p ng-repeat="message in bMessages track by $index">{{message}}</p>
30+
</div>
31+
</div>
32+
</div>
33+
34+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
35+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
36+
37+
<script src="http://cdn.sockjs.org/sockjs-0.3.min.js"></script>
38+
<script src="http://cdn.sockjs.org/websocket-multiplex-0.1.js"></script>
39+
40+
<script src="js/random.min.js"></script>
41+
<script src="js/Chart.min.js"></script>
42+
43+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.11/angular.min.js"></script>
44+
45+
<script src="js/angular-chartjs.min.js"></script>
46+
<script src="js/app.js"></script>
47+
</body>
48+
</html>

‎examples/sockjs-subtopic/js/Chart.min.js‎

Lines changed: 11 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/sockjs-subtopic/js/angular-chartjs.min.js‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/sockjs-subtopic/js/app.js‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
var sockjs = new SockJS('/multiplex');
2+
var multiplexer = new WebSocketMultiplex(sockjs);
3+
4+
var random = new Random();
5+
var aChannel = multiplexer.channel('a.' + random.integer(1, 20));
6+
var bChannel = multiplexer.channel('b.' + random.integer(1, 20));
7+
8+
var app = angular.module('subTopicSample', ['chartjs']);
9+
10+
app.controller('MainCtrl', function($scope) {
11+
12+
$scope.lineData = {
13+
labels: ["Paris", "New York", "London", "Berlin"],
14+
datasets: [{
15+
fillColor: "rgba(220,220,220,0.5)",
16+
strokeColor: "rgba(220,220,220,1)",
17+
pointColor: "rgba(220,220,220,1)",
18+
pointStrokeColor: "#fff",
19+
data: [10, 20, 5, 35]
20+
}]
21+
};
22+
$scope.bMessages = [];
23+
24+
aChannel.onmessage = function(e) {
25+
var obj = JSON.parse(e.data);
26+
$scope.lineData = {
27+
labels: ["Paris", "New York", "London", "Berlin"],
28+
datasets: [{
29+
fillColor: "rgba(220,220,220,0.5)",
30+
strokeColor: "rgba(220,220,220,1)",
31+
pointColor: "rgba(220,220,220,1)",
32+
pointStrokeColor: "#fff",
33+
data: [obj.paris, obj.newYork, obj.london, obj.berlin]
34+
}]
35+
};
36+
$scope.$apply();
37+
};
38+
39+
bChannel.onmessage = function(e) {
40+
var obj = JSON.parse(e.data);
41+
$scope.bMessages.push("Nb de contacts : " + obj.value);
42+
43+
if ($scope.bMessages.length > 15) {
44+
bMessage.pop();
45+
}
46+
47+
$scope.$apply();
48+
};
49+
}
50+
);

‎examples/sockjs-subtopic/js/random.min.js‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎examples/sockjs-subtopic/log4js.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"appenders": [
3+
{
4+
"type": "console"
5+
}
6+
],
7+
"replaceConsole": true
8+
}

‎examples/sockjs-subtopic/package.json‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"name" : "websocket-multiplex-sockjs-subtopic-example",
3+
"version" : "0.0.0-unreleasable",
4+
"dependencies" : {
5+
"express" : "3.0.0",
6+
"log4js" : "0.6.20",
7+
"sockjs" : "0.3.x",
8+
"random-js" : "1.0.4",
9+
"websocket-multiplex" : "git://github.com/gdepuille/websocket-multiplex.git#feature/subTopic"
10+
}
11+
}

‎examples/sockjs-subtopic/server.js‎

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
/**
2+
* Server sample to allow sub topic on multiplexed SockJS
3+
*
4+
* @author GregoryDepuille
5+
*/
6+
7+
var _ = require('underscore-node');
8+
var http = require('http');
9+
var express = require('express');
10+
var sockjs = require('sockjs');
11+
var multiplex_server = require('websocket-multiplex');
12+
var log4js = require('log4js');
13+
var random = require("random-js")();
14+
15+
log4js.configure('log4js.json');
16+
var logger = log4js.getLogger("sub-topic-sample");
17+
18+
// Registered connection by topic
19+
var aSockets = [];
20+
var bSockets = [];
21+
22+
function makeChannel(sockJsMux, channelName) {
23+
logger.info("Add channel " + channelName);
24+
return sockJsMux.registerChannel(channelName);
25+
}
26+
27+
function filterTopicPredicate(topicSocket) {
28+
return this === topicSocket.conn;
29+
}
30+
31+
function cleanTopic(connection, arrays) {
32+
var f = _.filter(arrays, filterTopicPredicate, connection);
33+
for (var i = 0 ; i < f.length ; i++) {
34+
var idx = arrays.indexOf(f[i]);
35+
arrays.splice(idx, 1);
36+
}
37+
}
38+
39+
function configureMasterEvents(sockJsServer) {
40+
sockJsServer.on('connection', function (socket) {
41+
logger.info("Main socket opened " + socket);
42+
43+
// Manage closed connection from browser
44+
socket.on('close', function () {
45+
logger.info("Main socket closed " + socket);
46+
47+
// Remove sockets.
48+
cleanTopic(socket, aSockets);
49+
cleanTopic(socket, bSockets);
50+
});
51+
});
52+
}
53+
54+
function configureChannelEvents(channel, arrays) {
55+
channel.on('connection', function (socket) {
56+
logger.info("Opened connection to " + socket.topic + " " + socket.conn);
57+
arrays.push(socket);
58+
});
59+
}
60+
61+
function notifyA(subTopic) {
62+
for (var i = 0 ; i < aSockets.length ; i++) {
63+
var socket = aSockets[i];
64+
if (socket.topic === "a." + subTopic) {
65+
var message = {
66+
paris: random.integer(1, 200),
67+
newYork: random.integer(1, 200),
68+
london: random.integer(1, 200),
69+
berlin: random.integer(1, 200)
70+
};
71+
72+
socket.write(JSON.stringify(message));
73+
logger.info("Send a message on a." + subTopic + " channel to " + socket.conn);
74+
}
75+
}
76+
}
77+
78+
79+
function notifyB(subTopic) {
80+
for (var i = 0 ; i < bSockets.length ; i++) {
81+
var socket = bSockets[i];
82+
if (socket.topic === "b." + subTopic) {
83+
socket.write(JSON.stringify({ value: random.integer(1, 20) }));
84+
logger.info("Send a message on b." + subTopic + " channel to " + socket.conn);
85+
}
86+
}
87+
}
88+
89+
90+
logger.info('Init sample')
91+
var sockJsServer = sockjs.createServer();
92+
var sockJsMux = new multiplex_server.MultiplexServer(sockJsServer, {allowSubTopic: true});
93+
94+
configureMasterEvents(sockJsServer);
95+
configureChannelEvents(makeChannel(sockJsMux, 'a'), aSockets);
96+
configureChannelEvents(makeChannel(sockJsMux, 'b'), bSockets);
97+
98+
var app = express();
99+
var httpServer = http.createServer(app);
100+
sockJsServer.installHandlers(httpServer, {prefix:'/multiplex'});
101+
httpServer.listen(9999, '0.0.0.0');
102+
103+
app.get('/', function (req, res) {
104+
res.sendfile(__dirname + '/index.html');
105+
});
106+
107+
app.get('/js/app.js', function (req, res) {
108+
res.sendfile(__dirname + '/js/app.js');
109+
});
110+
111+
app.get('/js/Chart.min.js', function (req, res) {
112+
res.sendfile(__dirname + '/js/Chart.min.js');
113+
});
114+
115+
app.get('/js/angular-chartjs.min.js', function (req, res) {
116+
res.sendfile(__dirname + '/js/angular-chartjs.min.js');
117+
});
118+
119+
app.get('/js/random.min.js', function (req, res) {
120+
res.sendfile(__dirname + '/js/random.min.js');
121+
});
122+
123+
setInterval(function () {
124+
var a = random.integer(1, 20);
125+
notifyA(a);
126+
127+
var b = random.integer(1, 20);
128+
notifyB(b);
129+
}, 500);

0 commit comments

Comments
 (0)