thegamer/Cable-Desktop
2
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Add key verification screen

Browse source 
Accessible from the menu on private conversations.
This commit is contained in:
lilia 2015-02-26 18:10:04 -08:00
parent 33b9a11e65
commit dcc1588219
6 changed files with 132 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
conversation.html
View file

@ -22,6 +22,7 @@
{{/group}}
{{^group}}
<li><a class='end-session'>End Session</a></li>
<li><a class='verify-identity'>Verify Identity</a></li>
{{/group}}
<li><a class='destroy'>Delete messages</a></li>
</ul>
@ -116,6 +117,22 @@
</table>
</div>
</script>
<script type='text/x-tmpl-mustache' id='key-verification'>
<div class='title-bar' id='header'>
<button class='back'></button>
<span class='title-text'>Verify Identity</span>
</div>
<div class='container'>
<p> Their identity (they read): </p>
<div class='key'>
{{ #their_key }} <span>{{ . }}</span> {{ /their_key }}
</div>
<p> Your identity (you read): </p>
<div class='key'>
{{ #your_key }} <span>{{ . }}</span> {{ /your_key }}
</div>
</div>
</script>
<script type="text/javascript" src="js/components.js"></script>
@ -138,6 +155,7 @@
<script type="text/javascript" src="js/views/group_update_view.js"></script>
<script type="text/javascript" src="js/views/attachment_view.js"></script>
<script type="text/javascript" src="js/views/message_view.js"></script>
<script type="text/javascript" src="js/views/key_verification_view.js"></script>
<script type="text/javascript" src="js/views/message_detail_view.js"></script>
<script type="text/javascript" src="js/views/message_list_view.js"></script>

21
js/views/conversation_view.js
View file

@ -52,11 +52,32 @@
'click .end-session': 'endSession',
'click .leave-group': 'leaveGroup',
'click .new-group-update': 'newGroupUpdate',
'click .verify-identity': 'verifyIdentity',
'click .hamburger': 'toggleMenu',
'click' : 'closeMenu',
'select .entry': 'messageDetail'
},
verifyIdentity: function() {
if (this.model.isPrivate()) {
var number = this.model.id;
var view = new Whisper.KeyVerificationView({
model: {
their_key: textsecure.storage.devices.getIdentityKeyForNumber(number),
your_key: textsecure.storage.devices.getIdentityKeyForNumber(
textsecure.utils.unencodeNumber(textsecure.storage.getUnencrypted("number_id"))[0]
)
}
});
this.$el.hide();
view.render().$el.insertAfter(this.el);
this.listenTo(view, 'back', function() {
view.remove();
this.$el.show();
});
}
},
messageDetail: function(e, data) {
var view = new Whisper.MessageDetailView({ model: data.message, conversation: this.model });
view.$el.insertAfter(this.$el);

48
js/views/key_verification_view.js Normal file
View file

@ -0,0 +1,48 @@
/* vim: ts=4:sw=4:expandtab
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
(function () {
'use strict';
window.Whisper = window.Whisper || {};
Whisper.KeyVerificationView = Backbone.View.extend({
className: 'key-verification',
initialize: function(options) {
this.template = $('#key-verification').html();
Mustache.parse(this.template);
},
events: {
'click .back': 'goBack'
},
goBack: function() {
this.trigger('back');
},
splitKey: function(key) {
// key is a binary string
return _.map(key, function(chr, i) {
return ('0' + key.charCodeAt(i).toString(16)).slice(-2);
});
},
render: function() {
this.$el.html(Mustache.render(this.template, {
your_key: this.splitKey(this.model.your_key),
their_key: this.splitKey(this.model.their_key)
}));
return this;
}
});
})();

19
js/views/message_detail_view.js
View file

@ -27,11 +27,28 @@
this.conversation = options.conversation;
},
events: {
'click .back': 'goBack'
'click .back': 'goBack',
'verify': 'verify'
},
goBack: function() {
this.trigger('back');
},
verify: function(number) {
var view = new Whisper.KeyVerificationView({
model: {
their_key: textsecure.storage.devices.getIdentityKeyForNumber(number),
your_key: textsecure.storage.devices.getIdentityKeyForNumber(
textsecure.utils.unencodeNumber(textsecure.storage.getUnencrypted("number_id"))[0]
)
}
});
this.$el.hide();
view.render().$el.insertAfter(this.el);
this.listenTo(view, 'back', function() {
view.remove();
this.$el.show();
});
},
render: function() {
this.$el.html(Mustache.render(this.template, {
sent_at: moment(this.model.get('sent_at')).toString(),

16
stylesheets/_conversation.scss
View file

@ -2,10 +2,24 @@
padding: $header-height 0;
}
.conversation, .discussion-container, .message-list, .message-detail {
.conversation, .discussion-container, .message-list, .message-detail, .key-verification {
height: 100%;
}
.key-verification {
padding: $header-height 0 0;
.container {
height: 100%;
overflow: auto;
}
p {
padding: 1em;
}
.key {
font-family: monospace;
padding: 0 1em;
}
}
.message-detail {
padding: $header-height 0 0;
background: $grey_l;

13
stylesheets/manifest.css
View file

@ -280,9 +280,20 @@ input.new-message {
.conversation {
padding: 36px 0; }
.conversation, .discussion-container, .message-list, .message-detail {
.conversation, .discussion-container, .message-list, .message-detail, .key-verification {
height: 100%; }
.key-verification {
padding: 36px 0 0; }
.key-verification .container {
height: 100%;
overflow: auto; }
.key-verification p {
padding: 1em; }
.key-verification .key {
font-family: monospace;
padding: 0 1em; }
.message-detail {
padding: 36px 0 0;
background: #f3f3f3; }