Support multiple genres. Rough notifciation and form validation.

This commit is contained in:
Jonathon Wilson 2012-11-02 18:29:58 -06:00
parent dc7dfee8d9
commit 7782938a96
8 changed files with 71 additions and 98 deletions

View File

@ -45,7 +45,8 @@
server.connect = function() {
logger.log("server.connect");
server.socket = new WebSocket(gon.websocket_gateway_uri);
var uri = gon.websocket_gateway_uri;
server.socket = new WebSocket(uri);
server.socket.onopen = server.onOpen;
server.socket.onmessage = server.onMessage;
server.socket.onclose = server.onClose;
@ -84,7 +85,7 @@
{
context.jamClient.connected = false;
}
// TODO: reconnect
};
@ -117,12 +118,12 @@
var outgoing_msg = msg_factory.client_p2p_message(server.clientID, receiver_id, message);
server.send(outgoing_msg);
};
context.JK.JamServer = server;
// Message callbacks
server.registerMessageCallback(context.JK.MessageType.LOGIN_ACK, function(header, payload) {
server.signedIn = true;
server.registerMessageCallback(context.JK.MessageType.LOGIN_ACK, function(header, payload) {
server.signedIn = true;
server.clientID = payload.client_id;
server.publicIP = payload.public_ip;
@ -132,7 +133,7 @@
context.jamClient.clientID = server.clientID;
}
});
server.registerMessageCallback(context.JK.MessageType.PEER_MESSAGE, function(header, payload) {
if (context.jamClient !== undefined)
{
@ -143,7 +144,7 @@
server.registerMessageCallback(context.JK.MessageType.USER_JOINED_MUSIC_SESSION, function(header, payload) {
context.JK.refreshMusicSession(payload.session_id);
});
// TODO: not used
server.registerMessageCallback(context.JK.MessageType.LOGIN_MUSIC_SESSION_ACK, function(header, payload) {
if (context.jamClient !== undefined)

View File

@ -22,13 +22,34 @@ Message from Seth on sequence for creating/joining sessions:
function afterShow(data) {}
/**
* Validate the form, returning a list of errors.
*/
function validateForm() {
var errors = [];
var genresCount = $('select[name="genres"]').find(':selected').length;
if (genresCount > 3) {
errors.push(['select[name="genres"]', "Please select no more than three genres."]);
}
return (errors.length) ? errors : null;
}
function submitForm(evt) {
evt.preventDefault();
var formErrors = validateForm();
if (formErrors) {
app.notify({
title: "Form Problems",
text: JSON.stringify(formErrors)
});
return false;
}
var $this = $(this);
var data = $this.formToObject();
data.client_id = app.clientId;
// FIXME: Support up to 3 genres in UI
// The following is a hack
data.genres = [data.genres];
if (typeof(data.genres) === "string") {
data.genres = [data.genres];
}
var url = "/api/sessions";
$.ajax({
type: "POST",
@ -41,7 +62,6 @@ Message from Seth on sequence for creating/joining sessions:
self.location = '#/session/' + newSessionId;
}
);
evt.preventDefault();
return false;
}

View File

@ -72,16 +72,18 @@
}
function _heartbeat() {
logger.debug("...sending heartbeat");
//logger.debug("...sending heartbeat");
message = context.JK.MessageFactory.heartbeat();
context.JK.JamServer.send(message);
}
function loggedIn(header, payload) {
logger.debug('loggedIn');
app.clientId = payload.client_id;
}
function registerLoginAck() {
logger.debug("register for loggedIn to set clientId");
context.JK.JamServer.registerMessageCallback(
context.JK.MessageType.LOGIN_ACK, loggedIn);
}
@ -130,6 +132,14 @@
this.layout.bindScreen(screen, handler);
};
/**
* Show a notification. Expects an object with a
* title property and a text property.
*/
this.notify = function(message) {
this.layout.notify(message);
};
/**
* Two-phase construction. Call after construction when in non-unit-test use.
*/

View File

@ -372,12 +372,6 @@
});
}
function notify(message) {
var $notify = $('[layout="notify"]');
$('h1', $notify).text(message.title);
$('p', $notify).text(message.text);
$notify.show();
}
function panelHeaderClicked(evt) {
evt.preventDefault();
@ -404,6 +398,13 @@
return opts;
};
this.notify = function(message) {
var $notify = $('[layout="notify"]');
$('h1', $notify).text(message.title);
$('p', $notify).text(message.text);
$notify.show();
};
this.changeToScreen = function(screen, data) {
changeToScreen(screen, data);
};
@ -441,14 +442,6 @@
opts = $.extend(opts, inOpts);
setup();
events();
// Only here for testing notifications.
//setTimeout(function() {
//notify({
//title: "Test Notification",
//text: "This is a notification message for testing."
//});
//}, 2000);
};
return this;

View File

@ -1,61 +0,0 @@
/**
* 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.JK.JamServer))
return;
// Alias some of the globals for less typing.
var logger = context.JK.logger;
var server = context.JK.JamServer;
var messages = context.JK.MessageType;
var msg_factory = context.JK.MessageFactory;
var myClientId = null;
var myPingTimer = null;
var pingCount = 0;
var maxPings = 5;
function logMessage(header, payload) {
logger.debug(header.type + ": " + JSON.stringify(payload));
}
function pingMyself() {
if (!myClientId)
return;
pingCount++;
message = msg_factory.ping(myClientId);
server.send(message);
if (pingCount > maxPings) {
context.clearInterval(myPingTimer);
myPingTimer = null;
}
}
function loggedIn(header, payload) {
logger.debug('Logged In handler: ' + header.type + ':' + JSON.stringify(payload));
myClientId = payload.client_id;
myPingTimer = context.setInterval(pingMyself, 1000);
}
function registerLoginPinger() {
logger.debug("registering login -> pinger");
server.registerMessageCallback(messages.LOGIN_ACK, loggedIn);
}
/**
* Register a simple console logger for all known message types.
*/
this.register = function() {
//registerLoginPinger();
};
};
})(window);

View File

@ -7,14 +7,10 @@
var tracks = {};
function beforeShow(data) {
logger.debug('beforeShow');
logger.debug(data);
sessionId = data.id;
}
function afterShow(data) {
logger.debug('afterShow');
logger.debug(data);
$.ajax({
type: "GET",
url: "/api/sessions/" + sessionId
@ -23,8 +19,6 @@
}
function beforeHide(data) {
logger.debug('beforeHide');
logger.debug(data);
context.JK.leaveMusicSession(sessionId);
}

View File

@ -72,6 +72,15 @@ label {
background-color: shade($color7, 10%);
}
.notify {
background-color: $color8;
color:#000;
}
.notify a {
color:#000;
font-weight:bold;
}
.header h1 {
margin:22px;
font-size:300%;

View File

@ -170,10 +170,20 @@
</label>
</div>
-->
<div class="formrow">
<fieldset>Musician Access
<label>By request/approval
<input type="radio" value="false" name="musician_access"/>
</label>
<label>Open
<input type="radio" value="true" checked="checked" name="musician_access"/>
</label>
</fieldset>
</div>
<div class="formrow">
<label>Genre
<select name="genres">
<label>Genres
<select multiple="multiple" name="genres">
</select>
</label>
<input type="text" class="hidden"/>
@ -453,9 +463,6 @@
var sessionScreen = new JK.SessionScreen(jk);
sessionScreen.initialize();
var messaging = new JK.Messaging(jk);
messaging.register();
var jam_server = JK.JamServer;
jam_server.connect();
})