Fixup conversation page styles and functionality

Render the entire conversation from a template, because some parts of it
must be rendered conditionally if it is a group vs private conversation.

Also apply some style fixes and restore lost functionality:
  * Make conversation title bar fixed.
  * Widens message bubbles.
  * Unhide message list.
  * Restore attachment rendering.
  * Restore message sending and attachment file selection.
  * Style attachments file input as a paperclip.
  * Style send button like on Android and make it a submit input.
This commit is contained in:
lilia 2015-01-21 23:39:07 -10:00
parent 7827c4c591
commit 8498d7ad1f
8 changed files with 134 additions and 73 deletions

View file

@ -24,7 +24,7 @@
conversation.fetch().then(function () {
new Whisper.ConversationView({
model: conversation
}).render().$el.appendTo($('#conversation-container'));
}).render().$el.prependTo($('body'));
});
};

View file

@ -37,7 +37,7 @@
this.view = new Whisper.MessageListView({
collection: this.model.messageCollection
});
$('#header').after(this.view.el);
this.$el.find('.discussion-container').append(this.view.el);
this.model.fetchMessages({reset: true});
},
@ -73,7 +73,7 @@
sendMessage: function(e) {
e.preventDefault();
var input = this.$el.find('.send input');
var input = this.$el.find('.send input.send-message');
var message = input.val();
var convo = this.model;

View file

@ -34,7 +34,7 @@ var Whisper = Whisper || {};
addThumb: function(e) {
this.thumb.src = e.target.result;
this.$el.append(this.thumb.render().el);
this.$el.find('.paperclip').append(this.thumb.render().el);
},
previewImages: function() {