Restyle registration page
When first intalling, users will no longer be presented with the option to register as a standalone client. For developer convenience, the standalone form can still be found at chrome-extension://.../register.html Closes #159
This commit is contained in:
lilia
parent
a9cf4bd93e
commit
8ee282b1aa
9 changed files with 675 additions and 295 deletions
188
js/options.js
188
js/options.js
|
|
@ -13,176 +13,52 @@
|
|||
* 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() {
|
||||
function validateCode() {
|
||||
var verificationCode = $('#code').val().replace(/\D/g, '');
|
||||
if (verificationCode.length == 6) {
|
||||
return verificationCode;
|
||||
}
|
||||
}
|
||||
|
||||
function displayError(error) {
|
||||
$('#error').hide().text(error).addClass('in').fadeIn();
|
||||
}
|
||||
|
||||
'use strict';
|
||||
$(function() {
|
||||
var phoneView = new Whisper.PhoneInputView({el: $('#phone-number-input')});
|
||||
phoneView.render();
|
||||
if (textsecure.registration.isDone()) {
|
||||
$('#complete-number').text(textsecure.utils.unencodeNumber(textsecure.storage.getUnencrypted("number_id"))[0]);//TODO: no
|
||||
$('#complete-number').text(
|
||||
textsecure.utils.unencodeNumber(
|
||||
textsecure.storage.getUnencrypted("number_id")
|
||||
)[0]
|
||||
);//TODO: no
|
||||
$('#setup-complete').show().addClass('in');
|
||||
} else {
|
||||
$('#choose-setup').show().addClass('in');
|
||||
|
||||
$('input.number').on('validation', function() {
|
||||
if ($('#number-container').hasClass('valid')) {
|
||||
$('#request-sms, #request-voice').removeAttr('disabled');
|
||||
} else {
|
||||
$('#request-sms, #request-voice').prop('disabled', 'disabled');
|
||||
}
|
||||
});
|
||||
|
||||
$('#code').on('change', function() {
|
||||
if (!validateCode())
|
||||
$('#code').addClass('invalid');
|
||||
else
|
||||
$('#code').removeClass('invalid');
|
||||
});
|
||||
|
||||
$('#request-voice').click(function() {
|
||||
$('#error').hide();
|
||||
var number = phoneView.validateNumber();
|
||||
if (number) {
|
||||
textsecure.api.requestVerificationVoice(number).catch(displayError);
|
||||
$('#step2').addClass('in').fadeIn();
|
||||
} else {
|
||||
$('#number-container').addClass('invalid');
|
||||
}
|
||||
});
|
||||
|
||||
$('#request-sms').click(function() {
|
||||
$('#error').hide();
|
||||
var number = phoneView.validateNumber();
|
||||
if (number) {
|
||||
textsecure.api.requestVerificationSMS(number).catch(displayError);
|
||||
$('#step2').addClass('in').fadeIn();
|
||||
} else {
|
||||
$('#number-container').addClass('invalid');
|
||||
}
|
||||
});
|
||||
|
||||
$('#new-account').click(function(){
|
||||
$('#choose-setup').fadeOut(function() {
|
||||
$('#single-device').addClass('in').fadeIn();
|
||||
});
|
||||
|
||||
$('#single-device .back').click(function() {
|
||||
$('#single-device').fadeOut(function() {
|
||||
$('#choose-setup').addClass('in').fadeIn();
|
||||
$('input.number').removeClass('invalid');
|
||||
});
|
||||
});
|
||||
|
||||
$('#single-device form').submit(function(e) {
|
||||
e.preventDefault();
|
||||
$('#error').hide();
|
||||
var number = phoneView.validateNumber();
|
||||
var verificationCode = validateCode();
|
||||
if (number && verificationCode) {
|
||||
$('#verifyCode').prop('disabled', 'disabled');
|
||||
$('#verify *').hide();
|
||||
$('#verify').show().addClass('in');
|
||||
$('#verify2').show();
|
||||
|
||||
textsecure.registerSingleDevice(number, verificationCode, function(step) {
|
||||
$('#init-setup').show().addClass('in');
|
||||
$('#status').text("Connecting...");
|
||||
axolotl.protocol.createIdentityKeyRecvSocket().then(function(cryptoInfo) {
|
||||
var qrCode = new QRCode(document.getElementById('qr'));
|
||||
var socket = textsecure.api.getTempWebsocket();
|
||||
new WebSocketResource(socket, function(request) {
|
||||
if (request.path == "/v1/address" && request.verb == "PUT") {
|
||||
var proto = textsecure.protobuf.ProvisioningUuid.decode(request.body);
|
||||
var url = [ 'tsdevice:/', '?uuid=', proto.uuid, '&pub_key=',
|
||||
encodeURIComponent(btoa(getString(cryptoInfo.pubKey))) ].join('');
|
||||
$('#status').text('');
|
||||
qrCode.makeCode(url);
|
||||
request.respond(200, 'OK');
|
||||
} else if (request.path == "/v1/message" && request.verb == "PUT") {
|
||||
$('#qr').hide();
|
||||
textsecure.registerSecondDevice(request.body, cryptoInfo, function(step) {
|
||||
switch(step) {
|
||||
case 1:
|
||||
$('#verify3').show();
|
||||
$('#status').text('Registering new device...');
|
||||
break;
|
||||
case 2:
|
||||
$('#verify4').show();
|
||||
$('#status').text('Generating keys...');
|
||||
break;
|
||||
case 3:
|
||||
$('#complete-number').text(number);
|
||||
$('#verify').hide();
|
||||
$('#init-setup').hide().removeClass('in');
|
||||
$('#setup-complete').show().addClass('in');
|
||||
$('#status').text('Uploading keys...');
|
||||
break;
|
||||
case 4:
|
||||
$('#status').text('All done!');
|
||||
textsecure.registration.done();
|
||||
$('#init-setup').hide();
|
||||
$('#setup-complete').show().addClass('in');
|
||||
}
|
||||
}).catch(function(error) {
|
||||
$('#verify *').hide();
|
||||
$('#verifyCode').removeAttr('disabled');
|
||||
if (error.humanError)
|
||||
displayError(error.humanError);
|
||||
else
|
||||
displayError(error); //XXX
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$('#new-device').click(function(){
|
||||
$('#choose-setup').fadeOut(function() {
|
||||
$('#multi-device').addClass('in').fadeIn();
|
||||
});
|
||||
|
||||
$('#multi-device .back').click(function() {
|
||||
$('#multi-device').fadeOut(function() {
|
||||
$('#choose-setup').addClass('in').fadeIn();
|
||||
$('input.number').removeClass('invalid');
|
||||
});
|
||||
});
|
||||
|
||||
$('#multi-device .status').text("Connecting...");
|
||||
$('#setup-qr').html('');
|
||||
axolotl.protocol.createIdentityKeyRecvSocket().then(function(cryptoInfo) {
|
||||
var qrCode = new QRCode(document.getElementById('setup-qr'));
|
||||
|
||||
var socket = textsecure.api.getTempWebsocket();
|
||||
new WebSocketResource(socket, function(request) {
|
||||
if (request.path == "/v1/address" && request.verb == "PUT") {
|
||||
var proto = textsecure.protobuf.ProvisioningUuid.decode(request.body);
|
||||
qrCode.makeCode('tsdevice:/' +
|
||||
'?uuid=' + proto.uuid +
|
||||
'&pub_key=' + encodeURIComponent(btoa(getString(cryptoInfo.pubKey))));
|
||||
$('img').removeAttr('style');
|
||||
$('#multi-device .status').text("Use your phone to scan the QR code.");
|
||||
request.respond(200, 'OK');
|
||||
} else if (request.path == "/v1/message" && request.verb == "PUT") {
|
||||
$('#init-setup').hide();
|
||||
$('#verify1done').text('');
|
||||
$('#verify2done').text('');
|
||||
$('#verify3done').text('');
|
||||
$('#verify4done').text('');
|
||||
$('#verify5done').text('');
|
||||
$('#verify').show().addClass('in');
|
||||
|
||||
textsecure.registerSecondDevice(request.body, cryptoInfo, function(step) {
|
||||
switch(step) {
|
||||
case 1:
|
||||
$('#verify1done').text('done');
|
||||
break;
|
||||
case 2:
|
||||
$('#verify2done').text('done');
|
||||
break;
|
||||
case 3:
|
||||
$('#verify3done').text('done');
|
||||
break;
|
||||
case 4:
|
||||
//XXX: User needs to verify number before we continue
|
||||
$('#verify4done').text('done');
|
||||
//$('#complete-number').text(parsedNumber);
|
||||
textsecure.registration.done();
|
||||
//case 5: //TODO: Do sync to get 5!
|
||||
$('#verify').hide();
|
||||
$('#setup-complete').show().addClass('in');
|
||||
textsecure.registration.done();
|
||||
}
|
||||
});
|
||||
} else
|
||||
console.log(request.path);
|
||||
});
|
||||
} else
|
||||
console.log(request.path);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue