ben.burlingham
/
ricochet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Memoizing client connections in messenger.

Browse Source
master
Ben Burlingham 5 years ago
parent 1b8244c8d7
commit e8d1fec9b6
8 changed files with 101 additions and 125 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      README.txt
  2. 2
      assets/comet.svg
  3. 7
      client/controls.js
  4. 39
      client/icons.js
  5. 6
      index.html
  6. 69
      server/ricochet.js
  7. 69
      socket/messenger.js
  8. 33
      socket/server.js

1
README.txt
Unescape View File

@ -16,6 +16,7 @@ Icons from [https://game-icons.net](https://game-icons.net)
- win declare - win declare
- replay stack - replay stack
- countdown skip - countdown skip
- Extract loader from join.css and kill join.css, join.js
- slide arrows - slide arrows
- chat box - chat box
- no cancel from name prompt - no cancel from name prompt

2
assets/comet.svg
Unescape View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" style="height: 512px; width: 512px;" id='foo'><g class="fill" transform="translate(0,0)" style="touch-action: none;"><path d="M20.916 15.648c147.945 202 202.556 312.645-3.146 252.438 201.76 82.926 225.515 176.51 49.13 180.76 190.922 51.156 315.057 60.258 377.16 10.43 67.76-54.368 62.6-177.648 13.31-361.6-.002 179.943-88.34 149.935-171.18-39.96 60.246 191.39-81.408 116.353-265.274-42.068zM457.37 97.676v-.008.008zm-79.792 150.84c5.457.054 10.994.79 16.508 2.267 3.763 1.01 7.352 2.34 10.77 3.924-.053-.058-.102-.12-.155-.178 51.248 21.08 79.986 77.264 65.253 132.25-16.008 59.742-77.174 95.054-136.914 79.046-59.29-15.886-94.507-76.24-79.395-135.547 1.144 7.843 3.71 15.465 7.808 22.564 15.038 26.045 46.48 37.745 78.735 32.334 8.387-.382 17.33-2.932 25.75-7.793 22.18-12.807 32.317-36.774 22.642-53.53-9.676-16.76-35.5-19.966-57.682-7.16-7.3 4.214-13.283 9.64-17.697 15.618-3.05-11-3.31-22.928-.14-34.75 7.978-29.778 35.053-49.34 64.518-49.047z" fill="#fff" fill-opacity="1"></path></g></svg> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" style="height: 512px; width: 512px;"><g class="fill" transform="translate(0,0)" style="touch-action: none;"><path d="M20.916 15.648c147.945 202 202.556 312.645-3.146 252.438 201.76 82.926 225.515 176.51 49.13 180.76 190.922 51.156 315.057 60.258 377.16 10.43 67.76-54.368 62.6-177.648 13.31-361.6-.002 179.943-88.34 149.935-171.18-39.96 60.246 191.39-81.408 116.353-265.274-42.068zM457.37 97.676v-.008.008zm-79.792 150.84c5.457.054 10.994.79 16.508 2.267 3.763 1.01 7.352 2.34 10.77 3.924-.053-.058-.102-.12-.155-.178 51.248 21.08 79.986 77.264 65.253 132.25-16.008 59.742-77.174 95.054-136.914 79.046-59.29-15.886-94.507-76.24-79.395-135.547 1.144 7.843 3.71 15.465 7.808 22.564 15.038 26.045 46.48 37.745 78.735 32.334 8.387-.382 17.33-2.932 25.75-7.793 22.18-12.807 32.317-36.774 22.642-53.53-9.676-16.76-35.5-19.966-57.682-7.16-7.3 4.214-13.283 9.64-17.697 15.618-3.05-11-3.31-22.928-.14-34.75 7.978-29.778 35.053-49.34 64.518-49.047z" fill="#fff" fill-opacity="1"></path></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 1.0 KiB

7
client/controls.js vendored
Unescape View File

@ -1,6 +1,13 @@
//===== Constructor //===== Constructor
const Controls = function() { const Controls = function() {
this.names = {}; this.names = {};
const evt = new Event('L-join');
document.dispatchEvent(evt);
// this.starts = []; // this.starts = [];
// this.timers = {}; // this.timers = {};

39
client/icons.js
Unescape View File

@ -1,39 +0,0 @@
const Icons = {
comet: (color) => {
// const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
// star.setAttribute("viewBox", '0 0 100 100');
// const path = document.createElementNS("http://www.w3.org/2000/svg", 'path');
const obj = document.getElementById('TEST_OBJECT_SVG');
console.log(obj);
console.log(obj.contentDocument)
return obj;
},
moon: (color) => {
},
planet: (color) => {
},
rocket: (color) => {
},
spacesuit: (color) => {
},
spider: (color) => {
},
ufo: (color) => {
},
};

6
index.html
Unescape View File

@ -14,11 +14,10 @@
<script type='text/javascript' src='client/cookie.js'></script> <script type='text/javascript' src='client/cookie.js'></script>
<script type='text/javascript' src='client/grid.js'></script> <script type='text/javascript' src='client/grid.js'></script>
<script type='text/javascript' src='client/icons.js'></script> <script type='text/javascript' src='client/icons.js'></script>
<script type='text/javascript' src='client/join.js'></script>
<script type='text/javascript' src='client/stack.js'></script> <script type='text/javascript' src='client/stack.js'></script>
</head> </head>
<body> <body>
<div id="join"> <!-- <div id="join">
<div id='join-setup'> <div id='join-setup'>
<button type='button' class='join-button' id='join-setup-start'>Start a new game</button> <button type='button' class='join-button' id='join-setup-start'>Start a new game</button>
<div class='join-message'>- or -</div> <div class='join-message'>- or -</div>
@ -35,7 +34,7 @@
<button type='text' class='join-button' id='join-setup-back'>Back</button> <button type='text' class='join-button' id='join-setup-back'>Back</button>
</div> </div>
</div> </div>
-->
<div id="controls-container"> <div id="controls-container">
<div id="controls-manage"> <div id="controls-manage">
<div class='controls-subtitle'>Global</div> <div class='controls-subtitle'>Global</div>
@ -106,7 +105,6 @@
<script> <script>
window.addEventListener('load', () => { window.addEventListener('load', () => {
// Order-independent. Communication via local events. // Order-independent. Communication via local events.
new Join();
new Connection(); new Connection();
new Controls(); new Controls();
new Grid(); new Grid();

69
server/ricochet.js
Unescape View File

@ -1,22 +1,9 @@
const uuid = require('node-uuid'); const uuid = require('node-uuid');
const DEBUG = (process.env.NODE_ENV !== "production");
const UrlParser = require('url');
///////////////
// REMEMBER THIS WILL BE IN A COMPLETELY SEPARATE DIRECTORY
///////////////
const Ricochet = function({ messenger }) { const Ricochet = function({ messenger }) {
this.messenger = messenger; this.messenger = messenger;
this.players = {};
console.log("HELLO RICOCHET")
// const players = {};
// this.id = uuid.v4(); // this.id = uuid.v4();
// this.countdownTimer = null; // this.countdownTimer = null;
@ -33,19 +20,20 @@ const Ricochet = function({ messenger }) {
}; };
Ricochet.prototype.onConnect = function(ws, req) { Ricochet.prototype.onConnect = function(ws, req) {
console.log("CONNECTED TO RICOCHET INSTANCE")
// const query = url.query; // const query = url.query;
// const santizedName = (query.name || 'Unknown').replace(/[^\w ]/g, ''); // const santizedName = (query.name || 'Unknown').replace(/[^\w ]/g, '');
// DEBUG && console.log("Connected:"); // DEBUG && console.log("Connected:");
// DEBUG && console.log (`${santizedName} ${ws.id} via ${req.url}`); // DEBUG && console.log (`${santizedName} ${ws.id} via ${req.url}`);
// G.addPlayer(ws.id, santizedName);
// Server.messageAll({ type: 'players', body: G.getPlayers() }); // this.addPlayer(ws.id, santizedName);
// Server.messageOne(ws, { type: 'walls', body: G.getWalls()});
// Server.messageOne(ws, { type: 'robots', body: G.getRobots()}); // this.messenger.messageAll({ type: 'players', body: this.players });
// Server.messageOne(ws, { type: 'winstate', body: G.getWinState()});
// Server.messageOne(ws, { type: 'connected', body: ws.id}); // this.messenger.messageOne(ws, { type: 'walls', body: G.getWalls()});
// this.messenger.messageOne(ws, { type: 'robots', body: G.getRobots()});
// this.messenger.messageOne(ws, { type: 'winstate', body: G.getWinState()});
// this.messenger.messageOne(ws, { type: 'connected', body: ws.id});
} }
Ricochet.prototype.onMessage = function(ws, json) { Ricochet.prototype.onMessage = function(ws, json) {
@ -53,29 +41,24 @@ Ricochet.prototype.onMessage = function(ws, json) {
}; };
Ricochet.prototype.onDisconnect = function(ws) { Ricochet.prototype.onDisconnect = function(ws) {
// onDisconnect: (ws) => { DEBUG && console.log("Disconnected:");
// DEBUG && console.log("Disconnected:"); DEBUG && console.log(ws.id);
// DEBUG && console.log(ws.id);
// G.removePlayer(ws.id); this.removePlayer(ws.id);
// Server.messageOthers(ws, { type: 'players', body: G.getPlayers() });
// }, // this.messenger.messageAll({ type: 'players', body: this.players });
}; };
// Game.prototype.addPlayer = function(id, name) { Ricochet.prototype.addPlayer = function(id, name) {
// if (!players[id]) { if (!this.players[id]) {
// players[id] = name; this.players[id] = name;
// } }
// } };
// Game.prototype.removePlayer = function(id) {
// players[id] = undefined;
// delete players[id];
// }
// Game.prototype.getPlayers = function() { Ricochet.prototype.removePlayer = function(id) {
// return players; this.players[id] = undefined;
// } delete this.players[id];
};
// Game.prototype.getRobots = function() { // Game.prototype.getRobots = function() {
// return this.TEMP_ROBOTS; // return this.TEMP_ROBOTS;
@ -222,6 +205,4 @@ Ricochet.prototype.onDisconnect = function(ws) {
// } // }
// }, // },
module.exports = { module.exports = Ricochet;
new: Ricochet
};

69
socket/messenger.js
Unescape View File

@ -1,35 +1,46 @@
const WebSocket = require('ws'); const WebSocket = require('ws');
const DEBUG = (process.env.NODE_ENV !== "production"); const DEBUG = (process.env.NODE_ENV !== "production");
const Messenger = { const Messenger = function() {
messageOne: (ws, message) => { this.clients = {};
DEBUG && console.log(`Sending to only ${ws.id}:`);
DEBUG && console.log(message);
ws.send(JSON.stringify(message));
},
messageOthers: (ws, message) => {
DEBUG && console.log(`Sending to other client(s):`);
DEBUG && console.log(message);
wss.clients.forEach((client) => {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(JSON.stringify(message));
}
});
},
messageAll: (message) => {
DEBUG && console.log(`Sending to all ${wss.clients.size} client(s):`);
DEBUG && console.log(message);
wss.clients.forEach((client) => {
if (client.readyState === WebSocket.OPEN) {
client.send(JSON.stringify(message));
}
});
},
}; };
Messenger.prototype.messageOne = function(ws, message) {
DEBUG && console.log(`Sending to only ${ws.id}:`);
DEBUG && console.log(message);
ws.send(JSON.stringify(message));
};
Messenger.prototype.messageOthers = function(ws, message) {
DEBUG && console.log(`Sending to other client(s):`);
DEBUG && console.log(message);
Object.values(this.clients).forEach((client) => {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(JSON.stringify(message));
}
});
};
Messenger.prototype.messageAll = function(message) {
DEBUG && console.log(`Sending to all ${wss.clients.size} client(s):`);
DEBUG && console.log(message);
Object.values(this.clients).forEach((client) => {
if (client.readyState === WebSocket.OPEN) {
client.send(JSON.stringify(message));
}
});
};
Messenger.prototype.subscribe = function(ws) {
this.clients[ws.id] = ws;
};
Messenger.prototype.unsubscribe = function(ws) {
delete this.clients[ws.id];
};
module.exports = Messenger; module.exports = Messenger;

33
socket/server.js
Unescape View File

@ -1,27 +1,44 @@
const WebSocket = require('ws'); const WebSocket = require('ws');
const UrlParser = require('url'); const UrlParser = require('url');
const uuid = require('node-uuid'); const uuid = require('node-uuid');
const messenger = require('./messenger'); const Messenger = require('./messenger');
const jsDir = `${__dirname}/server`; const RicochetApp = require(`${__dirname}/../server/ricochet.js`);
const RicochetApp = require(`${jsDir}/ricochet.js`); const apps = {
'/ricochet': new RicochetApp({ messenger: new Messenger() })
const clientApps = {
'/ricochet': RicochetApp.new({ messenger })
}; };
// Make sure all apps follow the messaging contract.
Object.keys(apps).forEach((key) => {
const app = apps[key];
const valid = app && app.messenger && app.onConnect && app.onMessage && app.onDisconnect;
if (!valid) {
delete apps[key];
console.log(`Application at ${key} is missing one or more: messenger, onConnect, onMessage, onDisconnect.`);
}
});
const onConnect = (ws, req) => { const onConnect = (ws, req) => {
// Store an ID on the socket connection. // Store an ID on the socket connection.
ws.id = uuid.v4(); ws.id = uuid.v4();
const url = UrlParser.parse(req.url, true); const url = UrlParser.parse(req.url, true);
const app = apps[url.pathname];
if (clientApps[url.pathname]) { if (app) {
app.messenger.subscribe(ws);
app.onConnect(ws, req); app.onConnect(ws, req);
ws.on('message', app.onMessage); ws.on('message', app.onMessage);
ws.on('close', app.onDisconnect);
ws.on('close', () => {
app.onDisconnect(ws);
app.messenger.unsubscribe(ws);
});
} }
}; };

Write Preview
Loading…
Cancel
Save