Work on message styling

Replicates some styles from the android app.
This commit is contained in:
lilia 2014-04-06 01:59:22 -07:00
parent e492aae172
commit 49cdf04065
3 changed files with 139 additions and 10 deletions

View file

@ -26,17 +26,25 @@ registerOnLoadFunction(function() {
conversations.sort(function(a, b) { return b[0].timestamp - a[0].timestamp });
var ul = $('#messages');
var ul = $('#conversations');
ul.html('');
for (var i = 0; i < MAX_CONVERSATIONS && i < conversations.length; i++) {
var conversation = conversations[i];
ul.append('<li>');
var messages = $('<ul class="conversation">');
for (var j = 0; j < MAX_MESSAGES_PER_CONVERSATION && j < conversation.length; j++) {
var message = conversation[j];
ul.append("From: " + message.sender + ", at: " + timestampToHumanReadable(message.timestamp) + "<br>");
ul.append("Message: " + message.message + "<br><br>");
$('<li class="message incoming">').
append($('<div class="avatar">')).
append($('<div class="bubble">').
append($('<span class="message-text">').text(message.message)).
append($('<span class="metadata">').text("From: " + message.sender + ", at: " + timestampToHumanReadable(message.timestamp)))
).appendTo(messages);
}
ul.append("<input type='text' id=text" + i + " /><button id=button" + i + ">Send</button><br>");
$('<li>').
append(messages).
append($("<form class='container'>").
append("<input type='text' id=text" + i + " /><button id=button" + i + ">Send</button><br>")
).appendTo(ul);
$('#button' + i).click(function() {
var sendDestinations = [conversation[0].sender];
for (var j = 0; j < conversation[0].destinations.length; j++)
@ -49,7 +57,6 @@ registerOnLoadFunction(function() {
console.log("Sent message: " + result);
});
});
ul.append('</li>');
}
}