keejef
/
session-desktop
mirror of https://github.com/oxen-io/session-desktop
2
0
Fork 0
Code Issues 8 Projects Releases Wiki Activity

Get standalone registration working in development

Browse Source 
Whisper.events.trigger('openStandalone') to open the standalone
registration view.

// FREEBIE
pull/749/head
lilia 8 years ago committed by Scott Nonnenberg
parent e60111f34d
commit de3816b094
No known key found for this signature in database
GPG Key ID: A4931C09644C654B
7 changed files with 184 additions and 125 deletions
Show Stats Download Patch File Download Diff File

40
background.html
Unescape Escape View File

@ -719,6 +719,45 @@
</div>
</script>
<script type='text/x-tmpl-mustache' id='standalone'>
<header>
<div class='container'>
<div class='row'>
<div class='col-xs-2 col-md-1'>
<img id='textsecure-icon' src='images/icon_250.png'/>
</div>
<div class='col-xs-10 col-md-11'>
<h1>Create your Signal Account</h1>
<h4 class='tagline'>Private messaging from your web browser.</h4>
</div>
</div>
</div>
</header>
<div class='container'>
<div class='col-xs-offset-1 col-md-6'>
<div class='narrow'>
<div id="phone-number-input">
<div class="phone-input-form">
<div id="number-container" class="number-container">
<input type="tel" class="number" placeholder="Phone Number" />
</div>
</div>
</div>
<div class='clearfix'>
<button id="request-sms" class="btn btn-info">Send SMS</button>
<button id="request-voice" class="btn btn-info" tabindex=-1>Call</button>
</div>
<form id='form'>
<h2></h2>
<input class='form-control' type="text" pattern="\s*[0-9]{3}-?[0-9]{3}\s*" title="Enter your 6-digit verification code. If you did not receive a code, click Call or Send SMS to request a new one" id="code" placeholder="Verification Code" autocomplete='off'>
<button id="verifyCode" class="btn btn-info" data-loading-text="Please wait...">Register</button>
<div id='error' class='collapse'></div>
</form>
<div id=status></div>
</div>
</div>
</div>
</script>
<script type='text/javascript' src='js/components.js'></script>
<script type='text/javascript' src='js/reliable_trigger.js'></script>
<script type='text/javascript' src='js/database.js'></script>
@ -779,6 +818,7 @@
<script type='text/javascript' src='js/views/identity_key_send_error_view.js'></script>
<script type='text/javascript' src='js/views/migration_view.js'></script>
<script type="text/javascript" src="js/views/phone-input-view.js"></script>
<script type='text/javascript' src='js/views/standalone_registration_view.js'></script>
<script type='text/javascript' src='js/views/app_view.js'></script>
<script type='text/javascript' src='js/wall_clock_listener.js'></script>

79
js/register.js
Unescape Escape View File

@ -3,84 +3,9 @@
*/
;(function() {
'use strict';
extension.windows.getBackground(function(bg) {
var accountManager = new bg.getAccountManager();
function log(s) {
console.log(s);
$('#status').text(s);
}
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();
}
var phoneView = new Whisper.PhoneInputView({el: $('#phone-number-input')});
phoneView.$el.find('input.number').intlTelInput();
var number = bg.textsecure.storage.user.getNumber();
if (number) {
$('input.number').val(number);
}
$('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) {
accountManager.requestVoiceVerification(number).catch(displayError);
$('#step2').addClass('in').fadeIn();
} else {
$('#number-container').addClass('invalid');
}
});
$('#request-sms').click(function() {
$('#error').hide();
var number = phoneView.validateNumber();
if (number) {
accountManager.requestSMSVerification(number).catch(displayError);
$('#step2').addClass('in').fadeIn();
} else {
$('#number-container').addClass('invalid');
}
});
$('#form').submit(function(e) {
e.preventDefault();
var number = phoneView.validateNumber();
var verificationCode = $('#code').val().replace(/\D+/g, "");
bg.storage.put('first_install_ran', 1);
accountManager.registerSingleDevice(number, verificationCode).then(function() {
bg.openInbox();
window.close();
}).catch(function(e) {
log(e);
});
});
extension.windows.getBackground(function(bg) {
var view = new bg.StandaloneRegistrationView({el: $('body')});
});
})();

31
js/views/app_view.js
Unescape Escape View File

@ -8,28 +8,41 @@
this.inboxView = null;
this.installView = null;
this.events = options.events;
this.events.on('openStandalone', this.openStandaloneInstaller, this);
this.events.on('openConversation', this.openConversation, this);
this.events.on('openInstaller', this.openInstaller, this);
this.events.on('openInbox', this.openInbox, this);
},
openView: function(view) {
this.el.innerHTML = "";
this.el.append(view.el);
},
openInstaller: function() {
this.closeInstaller();
this.installView = new Whisper.InstallView();
if (Whisper.Registration.everDone()) {
this.installView.selectStep(3);
this.installView.hideDots();
}
this.el.innerHTML = "";
this.el.append(this.installView.el);
this.openView(this.installView);
},
openStandaloneInstaller: function() {
this.closeInstaller();
this.installView = new Whisper.StandaloneRegistrationView();
this.openView(this.installView);
},
closeInstaller: function() {
if (this.installView) {
this.installView.remove();
this.installView = null;
}
},
openInbox: function(options) {
options = options || {};
_.defaults(options, {initialLoadComplete: false});
console.log('open inbox');
if (this.installView) {
this.installView.remove();
this.installView = null;
}
this.closeInstaller();
if (!this.inboxView) {
return ConversationController.loadPromise().then(function() {
@ -38,13 +51,11 @@
window: window,
initialLoadComplete: initialLoadComplete
});
this.el.innerHTML = "";
this.el.append(this.inboxView.el);
this.openView(this.inboxView);
}.bind(this));
} else {
if (!$.contains(this.$el, this.inboxView.$el)) {
this.el.innerHTML = "";
this.el.append(this.inboxView.el);
this.openView(this.inboxView);
}
window.focus(); // FIXME
return Promise.resolve();

6
js/views/phone-input-view.js
Unescape Escape View File

@ -9,17 +9,13 @@
tagName: 'div',
className: 'phone-input',
templateName: 'phone-number',
render: function() {
this.$el.html($(Mustache.render(this.template)));
initialize: function() {
this.$('input.number').intlTelInput();
return this;
},
events: {
'change': 'validateNumber',
'keyup': 'validateNumber'
},
validateNumber: function() {
var input = this.$('input.number');
var regionCode = this.$('li.active').attr('data-country-code').toUpperCase();

86
js/views/standalone_registration_view.js
Unescape Escape View File

@ -0,0 +1,86 @@
/*
* vim: ts=4:sw=4:expandtab
*/
(function () {
'use strict';
window.Whisper = window.Whisper || {};
Whisper.StandaloneRegistrationView = Whisper.View.extend({
templateName: 'standalone',
id: 'install',
className: 'main',
initialize: function() {
this.accountManager = getAccountManager();
var number = textsecure.storage.user.getNumber();
if (number) {
$('input.number').val(number);
}
this.render();
this.phoneView = new Whisper.PhoneInputView({el: this.$('#phone-number-input')});
},
events: {
'submit #form': 'submit',
'validation input.number': 'onValidation',
'change #code': 'onChangeCode',
'click #request-voice': 'requestVoice',
'click #request-sms': 'requestSMSVerification',
},
submit: function(e) {
e.preventDefault();
var number = this.phoneView.validateNumber();
var verificationCode = $('#code').val().replace(/\D+/g, "");
this.accountManager.registerSingleDevice(number, verificationCode).then(function() {
Whisper.events.trigger('openInbox');
}).catch(this.log.bind(this));
},
log: function (s) {
console.log(s);
this.$('#status').text(s);
},
validateCode: function() {
var verificationCode = $('#code').val().replace(/\D/g, '');
if (verificationCode.length == 6) {
return verificationCode;
}
},
displayError: function(error) {
this.$('#error').hide().text(error).addClass('in').fadeIn();
},
onValidation: function() {
if (this.$('#number-container').hasClass('valid')) {
this.$('#request-sms, #request-voice').removeAttr('disabled');
} else {
this.$('#request-sms, #request-voice').prop('disabled', 'disabled');
}
},
onChangeCode: function() {
if (!this.validateCode()) {
this.$('#code').addClass('invalid');
} else {
this.$('#code').removeClass('invalid');
}
},
requestVoice: function() {
this.$('#error').hide();
var number = this.phoneView.validateNumber();
if (number) {
this.accountManager.requestVoiceVerification(number).catch(this.displayError.bind(this));
this.$('#step2').addClass('in').fadeIn();
} else {
this.$('#number-container').addClass('invalid');
}
},
requestSMSVerification: function() {
$('#error').hide();
var number = this.phoneView.validateNumber();
if (number) {
this.accountManager.requestSMSVerification(number).catch(this.displayError.bind(this));
this.$('#step2').addClass('in').fadeIn();
} else {
this.$('#number-container').addClass('invalid');
}
}
});
})();

1
package.json
Unescape Escape View File

@ -81,6 +81,7 @@
"js/**",
"stylesheets/*.css",
"!js/register.js",
"!js/views/standalone_registration_view.js",
"preload.js",
"main.js",
"menu.js",

66
register.html
Unescape Escape View File

@ -6,46 +6,46 @@
<link rel="stylesheet" href="stylesheets/options.css">
</head>
<body>
<header>
<div class='container'>
<div class='row'>
<div class='col-xs-2 col-md-1'>
<img id='textsecure-icon' src='/images/icon_250.png'/>
</div>
<div class='col-xs-10 col-md-11'>
<h1>Create your Signal Account</h1>
<h4 class='tagline'>Private messaging from your web browser.</h4>
<script type='text/x-tmpl-mustache' id='standalone'>
<header>
<div class='container'>
<div class='row'>
<div class='col-xs-2 col-md-1'>
<img id='textsecure-icon' src='/images/icon_250.png'/>
</div>
<div class='col-xs-10 col-md-11'>
<h1>Create your Signal Account</h1>
<h4 class='tagline'>Private messaging from your web browser.</h4>
</div>
</div>
</div>
</div>
</header>
<div class='container'>
<div class='col-xs-offset-1 col-md-6'>
<div class='narrow'>
<div id="phone-number-input">
<div class="phone-input-form">
<div id="number-container" class="number-container">
<input type="tel" class="number" placeholder="Phone Number" />
</div>
</header>
<div class='container'>
<div class='col-xs-offset-1 col-md-6'>
<div class='narrow'>
<div id="phone-number-input">
<div class="phone-input-form">
<div id="number-container" class="number-container">
<input type="tel" class="number" placeholder="Phone Number" />
</div>
</div>
</div>
<div class='clearfix'>
<button id="request-sms" class="btn btn-info">Send SMS</button>
<button id="request-voice" class="btn btn-info" tabindex=-1>Call</button>
</div>
<form id='form'>
<h2></h2>
<input class='form-control' type="text" pattern="\s*[0-9]{3}-?[0-9]{3}\s*" title="Enter your 6-digit verification code. If you did not receive a code, click Call or Send SMS to request a new one" id="code" placeholder="Verification Code" autocomplete='off'>
<button id="verifyCode" class="btn btn-info" data-loading-text="Please wait...">Register</button>
<div id='error' class='collapse'></div>
</form>
<div id=status></div>
</div>
<div class='clearfix'>
<button id="request-sms" class="btn btn-info">Send SMS</button>
<button id="request-voice" class="btn btn-info" tabindex=-1>Call</button>
</div>
<form id='form'>
<h2></h2>
<input class='form-control' type="text" pattern="\s*[0-9]{3}-?[0-9]{3}\s*" title="Enter your 6-digit verification code. If you did not receive a code, click Call or Send SMS to request a new one" id="code" placeholder="Verification Code" autocomplete='off'>
<button id="verifyCode" class="btn btn-info" data-loading-text="Please wait...">Register</button>
<div id='error' class='collapse'></div>
</form>
<div id=status></div>
</div>
</div>
</div>
<script type="text/x-tmpl-mustache" id="phone-number">
</script>
<script type="text/x-tmpl-mustache" id="phone-number"></script>
<script type="text/javascript" src="js/components.js"></script>
<script type="text/javascript" src="js/database.js"></script>

Write Preview
Loading…
Cancel
Save