Implement i18n for Install Flow

Fixes #600

// FREEBIE
This commit is contained in:
Sam Lanning 2016-01-16 12:59:01 +00:00 committed by lilia
parent 3a494bf2a3
commit 0825d3e22f
4 changed files with 92 additions and 22 deletions

View file

@ -102,5 +102,55 @@
},
"sessionEnded": {
"message": "Secure session ended"
},
"installWelcome": {
"message": "Welcome to Signal Desktop",
"description": "Welcome title on the install page"
},
"installTagline": {
"message": "Privacy is possible. Signal makes it easy.",
"description": "Tagline displayed under installWelcome on the install page"
},
"installGetStartedButton": {
"message": "Get started"
},
"installSignalLink": {
"message": "First, install <a>Signal</a> on your Android phone.<br /> We'll link your devices and keep your messages in sync.",
"description": "Prompt the user to install Signal on Android before pairing"
},
"installIHaveSignalButton": {
"message": "I have Signal for Android",
"description": "Button for the user to confirm that they have Signal for Android"
},
"installFollowUs": {
"message": "<a>Follow us</a> for updates about multi-device support for iOS."
},
"installAndroidInstructions": {
"message": "Open Signal on your phone and navigate to Settings > Devices. Tap the button to add a new device, then scan the code above."
},
"installConnecting": {
"message": "Connecting...",
"description": "Displayed when waiting for the QR Code"
},
"installGeneratingKeys": {
"message": "Generating Keys"
},
"installSyncingGroupsAndContacts": {
"message": "Syncing groups and contacts"
},
"installComputerName": {
"message": "This computer's name will be",
"description": "Text displayed before the input where the user can enter the name for this device."
},
"installLinkingWithNumber": {
"message": "Linking with",
"description": "Text displayed before the phone number that the user is in the process of linking with"
},
"installFinalButton": {
"message": "Looking good",
"description": "The final button for the install process, after the user has entered a name for their device"
},
"installTooManyDevices": {
"message": "Sorry, you have too many devices registered already. Try removing some."
}
}

View file

@ -58,4 +58,31 @@
});
});
});
// Apply i18n
$(document).ready(function(){
// Basic Substitution
$('[data-i18n]').each(function(){
var $this = $(this);
$this.text(i18n($this.data('i18n')));
});
// Text with link to Play Store
var $installSignalLinkContent = $('<span>' + i18n('installSignalLink') + '</span>');
$installSignalLinkContent.find('a').attr({
class: 'link',
href: 'https://play.google.com/store/apps/details?id=org.thoughtcrime.securesms',
target: '_blank'
});
$('#installSignalLink').append($installSignalLinkContent);
// Text with link to Twitter
var $installFollowUsContent = $('<span>' + i18n('installFollowUs') + '</span>');
$installFollowUsContent.find('a').attr({
class: 'link',
href: 'https://twitter.com/whispersystems',
target: '_blank'
});
$('#installFollowUs').append($installFollowUsContent);
});
})();

View file

@ -19,7 +19,7 @@
};
},
clearQR: function() {
this.$('#qr').text("Connecting...");
this.$('#qr').text(i18n("installConnecting"));
},
setProvisioningUrl: function(url) {
this.$('#qr').html('');
@ -47,7 +47,7 @@
this.$('#device-name').focus();
return;
}
this.$('.progress-dialog .status').text('Generating Keys');
this.$('.progress-dialog .status').text(i18n('installGeneratingKeys'));
this.selectStep(5);
resolve(name);
}.bind(this));
@ -61,7 +61,7 @@
this.$('#step' + step).show();
},
showSync: function() {
this.$('.progress-dialog .status').text('Syncing groups and contacts');
this.$('.progress-dialog .status').text(i18n('installSyncingGroupsAndContacts'));
this.$('.progress-dialog .bar').addClass('progress-bar-striped active');
},
showTooManyDevices: function() {

View file

@ -11,9 +11,9 @@
<div id='step1' class='step'>
<img id='signal-icon' src='/images/icon_250.png'/>
<div class='nav'>
<h1>Welcome to Signal Desktop</h1>
<p>Privacy is possible. Signal makes it easy.</p>
<div> <a class='button step2'>Get started</a> </div>
<h1 data-i18n='installWelcome'></h1>
<p data-i18n='installTagline'></p>
<div> <a class='button step2' data-i18n='installGetStartedButton'></a> </div>
<span class='dot step1 selected'></span>
<span class='dot step2'></span>
<span class='dot step3'></span>
@ -23,12 +23,9 @@
<div id='step2' class='step'>
<img id='signal-phone' src='/images/signal-phone.png'>
<div class='nav'>
<p>First, install <a class='link' href='https://play.google.com/store/apps/details?id=org.thoughtcrime.securesms' target='_blank'>Signal</a> on your Android phone.<br /> We'll link your devices and keep your messages in sync.</p>
<div> <a class='button step3'>I have Signal for Android</a> </div>
<p>
<a class='link' href='https://twitter.com/whispersystems' target='_blank'>Follow us</a>
for updates about multi-device support for iOS.
</p>
<p id="installSignalLink"></p>
<div> <a class='button step3' data-i18n='installIHaveSignalButton'></a> </div>
<p id="installFollowUs"></p>
<span class='dot step1'></span>
<span class='dot step2 selected'></span>
<span class='dot step3'></span>
@ -37,8 +34,7 @@
<div id='step3' class='step'>
<div id="qr"></div>
<p>Open Signal on your phone and navigate to Settings > Devices. Tap the
button to add a new device, then scan the code above.</p>
<p data-i18n='installAndroidInstructions'></p>
<div class='nav'>
<span class='dot step1'></span>
<span class='dot step2'></span>
@ -47,15 +43,15 @@
</div>
<div id='step4' class='step'>
<p>Linking with</p>
<p data-i18n='installLinkingWithNumber'></p>
<h2 class='number'></h2>
<img id='signal-computer' src='/images/signal-laptop.png'>
<p>This computer's name will be</p>
<p data-i18n='installComputerName'></p>
<div>
<input type='text' id='device-name' spellcheck='false'></input>
</div>
<div class='nav'>
<div> <a class='button' id='sync'>Looking good</a> </div>
<div> <a class='button' id='sync' data-i18n='installFinalButton'></a> </div>
</div>
</div>
@ -71,12 +67,9 @@
<div id='stepTooManyDevices' class='step'>
<div class='error-dialog clearfix'>
<div class='panel'>
Sorry, you have too many devices registered already.
Try removing some.
</div>
<div class='panel' data-i18n='installTooManyDevices'></div>
<div class='nav'>
<button class='ok step3'>Ok</button>
<button class='ok step3' data-i18n='ok'></button>
</div>
</div>
</div>