JS Organization. Investigation of websocket connections.

This commit is contained in:
Jonathon Wilson 2012-10-14 09:48:56 -06:00
parent 67087c3370
commit 1be39b2c18
10 changed files with 180 additions and 79 deletions

View File

@ -0,0 +1,25 @@
(function(context) {
/*
internal logger with no-ops when console is missing.
*/
context.JK = context.JK || {};
var console_methods = [
'log', 'debug', 'info', 'warn', 'error', 'assert',
'clear', 'dir', 'dirxml', 'trace', 'group',
'groupCollapsed', 'groupEnd', 'time', 'timeEnd',
'timeStamp', 'profile', 'profileEnd', 'count',
'exception', 'table'
];
if ('undefined' === typeof(context.console)) {
context.console = {};
$.each(console_methods, function(index, value) {
context.console[value] = $.noop;
});
}
context.JK.logger = context.console;
}(window));

View File

@ -1,7 +1,8 @@
// The wrapper around the web-socket connection to the server
(function(global, $) {
(function(context, $) {
var server = {};
var logger = context.JK.logger;
// Let socket.io know where WebSocketMain.swf is
WEB_SOCKET_SWF_LOCATION = "assets/flash/WebSocketMain.swf";
@ -10,16 +11,16 @@
server.dispatchTable = {};
// TODO: Create the message factory here
//server.messageFactory = global.message_factory;
//server.messageFactory = context.message_factory;
server.registerMessageCallback = function(messageType, callback) {
if (server.dispatchTable[messageType] === undefined) {
server.dispatchTable[messageType] = [];
}
server.dispatchTable[messageType].push(callback);
};
server.unregisterMessageCallback = function(messageType, callback) {
if (server.dispatchTable[messageType] !== undefined) {
for(var i = server.dispatchTable.length; i--;) {
@ -30,67 +31,76 @@
}
}
}
if (server.dispatchTable[messageType].length == 0) {
if (server.dispatchTable[messageType].length === 0) {
delete server.dispatchTable[messageType];
}
};
server.connect = function() {
server.registerMessageCallback(LOGIN_ACK, function() { server.signedIn = true; });
server.registerMessageCallback(
context.Messages.LOGIN_ACK,
function() { server.signedIn = true; }
);
server.socket = new WebSocket(gon.websocket_gateway_uri);
server.socket.onopen = server.onOpen;
server.socket.onmessage = server.onMessage;
server.socket.onclose = server.onClose;
};
server.onOpen = function() {
logger.log('server.onOpen');
var token, loginMessage;
token = $.cookie("remember_token");
loginMessage = global.message_factory.login_with_token(token);
loginMessage = context.message_factory.login_with_token(token);
server.send(loginMessage);
};
server.onMessage = function(e) {
logger.log('server.onMessage');
var message = JSON.parse(e.data),
payload = message[message.type.toLowerCase()],
messageType = message.type.toLowerCase(),
payload = message[messageType],
callbacks = server.dispatchTable[message.type];
if (callbacks !== undefined) {
for(var i = callbacks.length; i--;) {
callbacks[i](payload);
callbacks[i](messageType, payload);
}
}
else {
console.log("Unexpected message type %s.", message.type);
logger.log("Unexpected message type %s.", message.type);
}
};
server.onClose = function() {
console.log("Socket to server closed.");
logger.log('server.onClose');
logger.log("Socket to server closed.");
// TODO: reconnect
};
server.send = function(message) {
server.socket.send(JSON.stringify(message));
var jsMessage = JSON.stringify(message);
logger.log('server.send(' + jsMessage + ')');
server.socket.send(jsMessage);
};
server.loginSession = function(sessionId) {
var loginMessage;
if (!signedIn) {
console.log("Not signed in!");
logger.log("Not signed in!");
// TODO: surface the error
return;
}
loginMessage = global.message_factory.login_jam_session(sessionId);
loginMessage = context.message_factory.login_jam_session(sessionId);
server.send(loginMessage);
};
global.JamServer = server;
context.JamServer = server;
})(window, jQuery);
})(window, jQuery);

View File

@ -2,6 +2,7 @@
context.JK = context.JK || {};
context.JK.CreateSessionScreen = function(app) {
var logger = context.JK.logger;
function afterShow(data) {}
@ -27,9 +28,11 @@
$('#create-session-form').submit(submitForm);
}
events();
screenBindings = { 'afterShow': afterShow };
app.bindScreen('session', screenBindings);
this.initialize = function() {
events();
screenBindings = { 'afterShow': afterShow };
app.bindScreen('session', screenBindings);
};
};

View File

@ -2,6 +2,7 @@
context.JK = context.JK || {};
context.JK.FindSessionScreen = function(app) {
var logger = context.JK.logger;
function loadSessions() {
$.ajax({
@ -43,11 +44,13 @@
$('#findSession-tableBody').on("click", '[action="delete"]', deleteSession);
}
screenBindings = {
'afterShow': afterShow
this.initialize = function() {
screenBindings = {
'afterShow': afterShow
};
app.bindScreen('findSession', screenBindings);
events();
};
app.bindScreen('findSession', screenBindings);
events();
};
})(window,jQuery);

View File

@ -5,6 +5,7 @@
var JamKazam = context.JK.JamKazam = function() {
var app;
var logger = context.JK.logger;
function routing() {
var routes = window.RouteMap, rules, rule;

View File

@ -1,52 +1,54 @@
/*
Message builder for communicating over the websocket
*/
(function() {
(function(context) {
CLIENT_TARGET = "client"
SERVER_TARGET = "server"
SESSION_TARGET_PREFIX = "session:"
USER_TARGET_PREFIX = "user:"
var CLIENT_TARGET = "client";
var SERVER_TARGET = "server";
var SESSION_TARGET_PREFIX = "session:";
var USER_TARGET_PREFIX = "user:";
LOGIN = "LOGIN"
LOGIN_ACK = "LOGIN_ACK"
LOGIN_MUSIC_SESSION = "LOGIN_MUSIC_SESSION"
LOGIN_MUSIC_SESSION_ACK = "LOGIN_MUSIC_SESSION_ACK"
USER_JOINED_MUSIC_SESSION = "USER_JOINED_MUSIC_SESSION"
LEAVE_MUSIC_SESSION = "LEAVE_MUSIC_SESSION"
LEAVE_MUSIC_SESSION_ACK = "LEAVE_MUSIC_SESSION_ACK"
HEARTBEAT = "HEARTBEAT"
TEST_SESSION_MESSAGE = "TEST_SESSION_MESSAGE"
SERVER_GENERIC_ERROR = "SERVER_GENERIC_ERROR"
SERVER_REJECTION_ERROR = "SERVER_REJECTION_ERROR"
var msg = context.Messages = {
LOGIN : "LOGIN",
LOGIN_ACK : "LOGIN_ACK",
LOGIN_MUSIC_SESSION : "LOGIN_MUSIC_SESSION",
LOGIN_MUSIC_SESSION_ACK : "LOGIN_MUSIC_SESSION_ACK",
USER_JOINED_MUSIC_SESSION : "USER_JOINED_MUSIC_SESSION",
LEAVE_MUSIC_SESSION : "LEAVE_MUSIC_SESSION",
LEAVE_MUSIC_SESSION_ACK : "LEAVE_MUSIC_SESSION_ACK",
HEARTBEAT : "HEARTBEAT",
TEST_SESSION_MESSAGE : "TEST_SESSION_MESSAGE",
SERVER_GENERIC_ERROR : "SERVER_GENERIC_ERROR",
SERVER_REJECTION_ERROR : "SERVER_REJECTION_ERROR"
};
var message_factory = {}
var message_factory = {};
function client_container(type, target, inner) {
var type_field = type.toLowerCase()
var body = { "type" : type, "target" : target}
body[type_field] = inner
return body
var type_field = type.toLowerCase();
var body = { "type" : type, "target" : target};
body[type_field] = inner;
return body;
}
// create a login message using user/pass
message_factory.login_with_user_pass = function(username, password) {
login = { username : username , password : password}
return client_container(LOGIN, SERVER_TARGET, login)
}
login = { username : username , password : password};
return client_container(msg.LOGIN, SERVER_TARGET, login);
};
// create a login message using token (a cookie or similiar)
message_factory.login_with_token = function(token) {
login = { token : token}
return client_container(LOGIN, SERVER_TARGET, login)
}
login = { token : token};
return client_container(msg.LOGIN, SERVER_TARGET, login);
};
// create a music session login message
message_factory.login_music_session = function(music_session) {
login_music_session = { music_session : music_session }
return client_container(LOGIN_MUSIC_SESSION, SERVER_TARGET, login_music_session)
}
login_music_session = { music_session : music_session };
return client_container(msg.LOGIN_MUSIC_SESSION, SERVER_TARGET, login_music_session);
};
window.message_factory = message_factory
})();
window.message_factory = message_factory;
})(window);

View File

@ -0,0 +1,32 @@
/**
* A messaging class for handling websocket messages and taking the
* proper web-ui actions. Anything more generic related to message
* definitions, etc. should be in other places not tied to our UI.
*/
(function(context) {
context.JK = context.JK || {};
context.JK.Messaging = function(app) {
if ("undefined" === typeof(context.JamServer))
return;
var logger = context.JK.logger;
function logMessage(messageType, payload) {
logger.debug(messageType + ": " + JSON.stringify(payload));
}
/**
* Register a simple console logger for all known message types.
*/
this.register = function() {
for (var msg in context.Messages) {
logger.debug("registering " + msg);
context.JamServer.registerMessageCallback(msg, logMessage);
}
};
};
})(window);

View File

@ -2,6 +2,7 @@
context.JK = context.JK || {};
context.JK.SessionScreen = function(app) {
var logger = context.JK.logger;
function afterShow(data) {
var sessionId = data.id;
@ -35,11 +36,13 @@
$('#session-contents').on("click", '[action="delete"]', deleteSession);
}
events();
screenBindings = {
'afterShow': afterShow
this.initialize = function() {
events();
screenBindings = {
'afterShow': afterShow
};
app.bindScreen('session', screenBindings);
};
app.bindScreen('session', screenBindings);
};

View File

@ -106,7 +106,8 @@
<form id="create-session-form">
<div class="body">
<fieldset class="unstyled">
<legend>Unstyled (obviously)</legend>
<legend>Unstyled and Lots of things omitted</legend>
<!--
<div class="formrow">
<label>Band
<select>
@ -194,12 +195,14 @@
</select>
</label>
</div>
-->
<div class="formrow">
<label>Session Description</label>
<textarea name="description"></textarea>
</div>
<!--
<div class="formrow">
<label>Musician Invitations
<input type="text"/>
@ -227,6 +230,7 @@
I agree that intellectual property ownership of any musical works created during this session shall be governed by the terms of the Creative Commons CC BY-NC-SA license in accordance with the JamKazam Terms of Service.
</label>
</div>
-->
</fieldset>
</div>
<div class="footer">
@ -437,16 +441,18 @@
$(function() {
var jk = JK.JamKazam();
jk.initialize();
new JK.CreateSessionScreen(jk);
new JK.FindSessionScreen(jk);
new JK.SessionScreen(jk);
window.JamServer.registerMessageCallback(
LOGIN_ACK,
function(payload) {
// TODO: Get a list of sessions and update in the UI to enable joining
alert("Logged in from IP: " + payload.public_ip);
});
var createSessionScreen = new JK.CreateSessionScreen(jk);
createSessionScreen.initialize();
var findSessionScreen = new JK.FindSessionScreen(jk);
findSessionScreen.initialize();
var sessionScreen = new JK.SessionScreen(jk);
sessionScreen.initialize();
var messaging = new JK.Messaging(jk);
messaging.register();
window.JamServer.connect();
})

View File

@ -0,0 +1,16 @@
(function(context, $) {
describe("Logger", function() {
var logger;
beforeEach(function() {
logger = context.JK.logger;
});
it("logger.log present", function() {
logger.log('foo');
});
});
}(window, jQuery));