get frontend rendering with new markup/css

This commit is contained in:
lilia 2014-07-27 12:12:59 -10:00
parent 518bdb2056
commit 95c31629b7
6 changed files with 51 additions and 22 deletions

View File

@ -11,9 +11,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<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" />
<script src="/javascripts/first.js" type="text/javascript"></script>
</head>
<body class='signal index'>
<body class='signal index' data-name="curve25519" data-tools="pnacl" data-configs="Debug Release" data-path="nacl/pnacl/{config}">
<div class='title-bar'>
<h1>Signal</h1>
</div>
@ -30,11 +29,11 @@
<div class='search'>
<input name='contact_search' placeholder='Search' type='search'>
</div>
<div class='gutter'>
<div id='gutter' class='gutter'>
<div class='search'>
<input name='contact_search' placeholder='Search' type='search'>
</div>
<div class='contact'>
<script type='text/x-tmpl-mustache' id='contact'>
<img class='avatar' src='{{ contact_avatar }}'>
<div class='contact-details'>
<h3>
@ -46,20 +45,19 @@
<span class='last-timestamp'>
{{ last_message_timestamp }}
</span>
</div>
</div>
</script>
</div>
<div class='conversation'>
<ul class='discussion'>
<li class='entry'>
<div class='bubble bubble_context {{ }}'>
<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>
</li>
</script>
</ul>
<div class='send-message-area'>
<div class='message-composer'>
@ -79,7 +77,35 @@
</div>
</div>
<!-- / Final Scripts -->
<script src='//code.jquery.com/jquery-1.11.0.min.js'></script>
<script src="/javascripts/last.js" type="text/javascript"></script>
<script type="text/javascript" src="js-deps/nacl-common.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/Long.min.js"></script>
<script type="text/javascript" src="js-deps/ByteBuffer.min.js"></script>
<script type="text/javascript" src="js-deps/ProtoBuf.min.js"></script>
<script type="text/javascript" src="js-deps/underscore.js"></script>
<script type="text/javascript" src="js-deps/backbone.js"></script>
<script type="text/javascript" src="js-deps/backbone.localStorage.js"></script>
<script type="text/javascript" src="js-deps/mustache.js"></script>
<script type="text/javascript" src="js-deps/libphonenumber_api-compiled.js"></script>
<script type="text/javascript" src="js/helpers.js"></script>
<script type="text/javascript" src="js/webcrypto.js"></script>
<script type="text/javascript" src="js/crypto.js"></script>
<script type="text/javascript" src="js/models/messages.js"></script>
<script type="text/javascript" src="js/models/threads.js"></script>
<script type="text/javascript" src="js/api.js"></script>
<script type="text/javascript" src="js/sendmessage.js"></script>
<script type="text/javascript" src="js/chromium.js"></script>
<script type="text/javascript" src="js/views/notifications.js"></script>
<script type="text/javascript" src="js/views/list_view.js"></script>
<script type="text/javascript" src="js/views/message_view.js"></script>
<script type="text/javascript" src="js/views/message_list_view.js"></script>
<script type="text/javascript" src="js/views/conversation_list_item_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/popup.js"></script>
</body>
</html>

View File

@ -16,7 +16,7 @@
new Whisper.ConversationListView({el: $('#contacts')});
new Whisper.ConversationListView().$el.appendTo($('#gutter'));
Whisper.Threads.fetch({reset: true});
textsecure.registerOnLoadFunction(function() {

View File

@ -4,8 +4,8 @@ var Whisper = Whisper || {};
'use strict';
Whisper.ConversationListItemView = Backbone.View.extend({
tagName: 'li',
className: 'conversation',
tagName: 'div',
className: 'contact',
events: {
'click': 'open',
@ -36,7 +36,9 @@ var Whisper = Whisper || {};
render: function() {
this.$el.html(
Mustache.render(this.template, {
name: this.model.get('name')
contact_name: this.model.get('name'),
last_message: this.model.get('lastMessage'),
last_message_timestamp: this.model.get('timestamp')
})
);

View File

@ -4,7 +4,7 @@ var Whisper = Whisper || {};
'use strict';
Whisper.ConversationListView = Whisper.ListView.extend({
tagName: 'ul',
tagName: 'div',
id: 'contacts',
itemView: Whisper.ConversationListItemView,
collection: Whisper.Threads,

View File

@ -5,11 +5,11 @@ var Whisper = Whisper || {};
Whisper.MessageListView = Whisper.ListView.extend({
tagName: 'ul',
className: 'messages',
className: 'discussion',
itemView: Whisper.MessageView,
render: function() {
$('#main .message-container').html('').append(this.el);
$('#discussion').html('').append(this.el);
}
});
})();

View File

@ -5,7 +5,7 @@ var Whisper = Whisper || {};
Whisper.MessageView = Backbone.View.extend({
tagName: "li",
className: "message",
className: "entry",
initialize: function() {
this.$el.addClass(this.model.get('type'));
@ -21,9 +21,10 @@ var Whisper = Whisper || {};
render: function() {
this.$el.html(
Mustache.render(this.template, {
body: this.model.get('body'),
message: this.model.get('body'),
date: this.formatTimestamp(),
attachments: this.model.get('attachments')
attachments: this.model.get('attachments'),
bubble_class: this.model.get('type') === 'outgoing' ? 'sent' : 'incoming'
})
);