Get messages sending with new ui

Also convert index.html to 4-space indentation.
pull/749/head
lilia 11 years ago
parent 95c31629b7
commit 44f272a181

@ -10,7 +10,8 @@
<meta name="description" content=""> <meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link href='/favicon.ico' rel='shortcut icon'> <link href='/favicon.ico' rel='shortcut icon'>
<link href="/stylesheets/normalize.css" rel="stylesheet" type="text/css" /><link href="/stylesheets/manifest.css" rel="stylesheet" type="text/css" /> <link href="/stylesheets/normalize.css" rel="stylesheet" type="text/css" />
<link href="/stylesheets/manifest.css" rel="stylesheet" type="text/css" />
</head> </head>
<body class='signal index' data-name="curve25519" data-tools="pnacl" data-configs="Debug Release" data-path="nacl/pnacl/{config}"> <body class='signal index' data-name="curve25519" data-tools="pnacl" data-configs="Debug Release" data-path="nacl/pnacl/{config}">
<div class='title-bar'> <div class='title-bar'>
@ -33,38 +34,18 @@
<div class='search'> <div class='search'>
<input name='contact_search' placeholder='Search' type='search'> <input name='contact_search' placeholder='Search' type='search'>
</div> </div>
<script type='text/x-tmpl-mustache' id='contact'>
<img class='avatar' src='{{ contact_avatar }}'>
<div class='contact-details'>
<h3>
{{ contact_name }}
</h3>
<p class='last-message'>
{{ last_message }}
</p>
<span class='last-timestamp'>
{{ last_message_timestamp }}
</span>
</script>
</div> </div>
<div class='conversation'> <div id= 'conversation' class='conversation'>
<ul id='discussion' class='discussion'> <ul id='discussion' class='discussion'>
<script type='text/x-tmpl-mustache' id='message'>
<div class='bubble bubble_context {{ bubble_class }}'>
<ul class='volley'>
<li class='message'>
{{ message }}
</li>
</ul>
</div>
</script>
</ul> </ul>
<div class='send-message-area'> <div class='send-message-area'>
<div class='message-composer'> <div class='message-composer'>
<form id='send'>
<input class='send-message' rows='6' type='textarea'> <input class='send-message' rows='6' type='textarea'>
<div class='attachments'> <div class='attachments'>
Add Files Add Files
</div> </div>
</form>
</div> </div>
<div class='extension-details'> <div class='extension-details'>
<ul> <ul>
@ -76,8 +57,31 @@
</div> </div>
</div> </div>
</div> </div>
<!-- / Final Scripts --> <script type='text/x-tmpl-mustache' id='message'>
<div class='bubble bubble_context {{ bubble_class }}'>
<ul class='volley'>
<li class='message'>
{{ message }}
</li>
</ul>
</div>
</script>
<script type='text/x-tmpl-mustache' id='contact'>
<img class='avatar' src='{{ contact_avatar }}'>
<div class='contact-details'>
<h3>
{{ contact_name }}
</h3>
<p class='last-message'>
{{ last_message }}
</p>
<span class='last-timestamp'>
{{ last_message_timestamp }}
</span>
</div>
</script>
<script type="text/javascript" src="js-deps/nacl-common.js"></script> <script type="text/javascript" src="js-deps/nacl-common.js"></script>
<script type="text/javascript" src="js-deps/jquery.js"></script>
<script type="text/javascript" src="js-deps/CryptoJS.js"></script> <script type="text/javascript" src="js-deps/CryptoJS.js"></script>
<script type="text/javascript" src="js-deps/curve255.js"></script> <script type="text/javascript" src="js-deps/curve255.js"></script>
<script type="text/javascript" src="js-deps/Long.min.js"></script> <script type="text/javascript" src="js-deps/Long.min.js"></script>
@ -106,6 +110,5 @@
<script type="text/javascript" src="js/views/conversation_list_view.js"></script> <script type="text/javascript" src="js/views/conversation_list_view.js"></script>
<script type="text/javascript" src="js/views/conversation_view.js"></script> <script type="text/javascript" src="js/views/conversation_view.js"></script>
<script type="text/javascript" src="js/popup.js"></script> <script type="text/javascript" src="js/popup.js"></script>
</body> </body>
</html> </html>

@ -21,10 +21,10 @@ var Whisper = Whisper || {};
}, },
open: function(e) { open: function(e) {
$('#main').trigger('close'); // detach any existing conversation views $('#conversation').trigger('close'); // detach any existing conversation views
if (!this.view) { if (!this.view) {
this.view = new Whisper.ConversationView({ this.view = new Whisper.ConversationView({
el: $('#main'), el: $('#conversation'),
model: this.model model: this.model
}); });
} else { } else {

@ -10,13 +10,13 @@ var Whisper = Whisper || {};
this.view = new Whisper.MessageListView({collection: this.model.messages()}); this.view = new Whisper.MessageListView({collection: this.model.messages()});
}, },
events: { events: {
'submit #new-message': 'sendMessage', 'submit #send': 'sendMessage',
'close': 'undelegateEvents' 'close': 'undelegateEvents'
}, },
sendMessage: function(e) { sendMessage: function(e) {
e.preventDefault(); e.preventDefault();
var input = $('#new-message-text'); var input = this.$el.find('#send input');
if (input.val().length > 0) { if (input.val().length > 0) {
this.model.sendMessage(input.val()); this.model.sendMessage(input.val());
input.val(""); input.val("");

Loading…
Cancel
Save