diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 167f33578..6b0662dca 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1,4 +1,22 @@ { + "loading": { + "message": "Loading...", + "description": "Message shown on the loading screen before we've loaded any messages" + }, + "upgradingDatabase": { + "message": "Upgrading database. This may take some time...", + "description": "Message shown on the loading screen when we're changing database structure on first run of a new version" + }, + "loadingMessages": { + "message": "Loading messages. $count$ so far...", + "description": "Message shown on the loading screen when we're catching up on the backlog of messages", + "placeholders": { + "count": { + "content": "$1", + "example": "5" + } + } + }, "me": { "message": "Me", "description": "The label for yourself when shown in a group member list" diff --git a/background.html b/background.html index c21d54b03..754aecceb 100644 --- a/background.html +++ b/background.html @@ -10,6 +10,7 @@ +
{{ message }}
+
+
+ +
+ + + +
+
Loading...
+
+
diff --git a/js/background.js b/js/background.js index f75e6cce7..4cafe5c01 100644 --- a/js/background.js +++ b/js/background.js @@ -123,6 +123,7 @@ messageReceiver.addEventListener('verified', onVerified); messageReceiver.addEventListener('error', onError); messageReceiver.addEventListener('empty', onEmpty); + messageReceiver.addEventListener('progress', onProgress); window.textsecure.messaging = new textsecure.MessageSender( SERVER_URL, SERVER_PORTS, USERNAME, PASSWORD @@ -158,6 +159,14 @@ } }, 500); } + function onProgress(ev) { + var count = ev.count; + + var view = window.owsDesktopApp.inboxView; + if (view) { + view.onProgress(count); + } + } function onContactReceived(ev) { var details = ev.contactDetails; diff --git a/js/libtextsecure.js b/js/libtextsecure.js index 6169f219a..ef0650c9d 100644 --- a/js/libtextsecure.js +++ b/js/libtextsecure.js @@ -38245,6 +38245,8 @@ var TextSecureServer = (function() { */ function MessageReceiver(url, ports, username, password, signalingKey) { + this.count = 0; + this.url = url; this.signalingKey = signalingKey; this.username = username; @@ -38357,11 +38359,23 @@ MessageReceiver.prototype.extend({ }.bind(this); var scheduleDispatch = function() { + // resetting count to zero so everything queued after this starts over again + this.count = 0; + this.pending = this.pending.then(dispatchEmpty, dispatchEmpty); }.bind(this); Promise.all(incoming).then(scheduleDispatch, scheduleDispatch); }, + updateProgress: function(count) { + // count by 10s + if (count % 10 !== 0) { + return; + } + var ev = new Event('progress'); + ev.count = count; + this.dispatchEvent(ev); + }, queueAllCached: function() { this.getAllFromCache().then(function(items) { for (var i = 0, max = items.length; i < max; i += 1) { @@ -38446,6 +38460,7 @@ MessageReceiver.prototype.extend({ return textsecure.storage.unprocessed.remove(id); }, queueDecryptedEnvelope: function(envelope, plaintext) { + var count = this.count += 1; var id = this.getEnvelopeId(envelope); console.log('queueing decrypted envelope', id); @@ -38454,11 +38469,14 @@ MessageReceiver.prototype.extend({ this.pending = this.pending.then(taskWithTimeout, taskWithTimeout); - return this.pending.catch(function(error) { + return this.pending.then(function() { + this.updateProgress(count); + }.bind(this), function(error) { console.log('queueDecryptedEnvelope error handling envelope', id, ':', error && error.stack ? error.stack : error); }); }, queueEnvelope: function(envelope) { + var count = this.count += 1; var id = this.getEnvelopeId(envelope); console.log('queueing envelope', id); @@ -38467,7 +38485,9 @@ MessageReceiver.prototype.extend({ this.pending = this.pending.then(taskWithTimeout, taskWithTimeout); - return this.pending.catch(function(error) { + return this.pending.then(function() { + this.updateProgress(count); + }.bind(this), function(error) { console.log('queueEnvelope error handling envelope', id, ':', error && error.stack ? error.stack : error); }); }, diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js index 5c1d81cc6..8ba5a0ba6 100644 --- a/js/views/conversation_view.js +++ b/js/views/conversation_view.js @@ -59,10 +59,7 @@ Whisper.ConversationLoadingScreen = Whisper.View.extend({ templateName: 'conversation-loading-screen', - className: 'conversation-loading-screen', - render_attributes: { - loading: i18n('loading') - } + className: 'conversation-loading-screen' }); Whisper.ConversationTitleView = Whisper.View.extend({ diff --git a/js/views/inbox_view.js b/js/views/inbox_view.js index 217886e78..ed745b14b 100644 --- a/js/views/inbox_view.js +++ b/js/views/inbox_view.js @@ -64,8 +64,14 @@ Whisper.AppLoadingScreen = Whisper.View.extend({ templateName: 'app-loading-screen', className: 'app-loading-screen', + updateProgress: function(count) { + if (count > 0) { + var message = i18n('loadingMessages', count.toString()); + this.$('.message').text(message); + } + }, render_attributes: { - loading: i18n('loading') + message: i18n('loading') } }); @@ -171,6 +177,12 @@ view.remove(); } }, + onProgress: function(count) { + var view = this.appLoadingScreen; + if (view) { + view.updateProgress(count); + } + }, focusConversation: function(e) { if (e && this.$(e.target).closest('.placeholder').length) { return; diff --git a/libtextsecure/message_receiver.js b/libtextsecure/message_receiver.js index e3b11640a..e14d1fb00 100644 --- a/libtextsecure/message_receiver.js +++ b/libtextsecure/message_receiver.js @@ -3,6 +3,8 @@ */ function MessageReceiver(url, ports, username, password, signalingKey) { + this.count = 0; + this.url = url; this.signalingKey = signalingKey; this.username = username; @@ -115,11 +117,23 @@ MessageReceiver.prototype.extend({ }.bind(this); var scheduleDispatch = function() { + // resetting count to zero so everything queued after this starts over again + this.count = 0; + this.pending = this.pending.then(dispatchEmpty, dispatchEmpty); }.bind(this); Promise.all(incoming).then(scheduleDispatch, scheduleDispatch); }, + updateProgress: function(count) { + // count by 10s + if (count % 10 !== 0) { + return; + } + var ev = new Event('progress'); + ev.count = count; + this.dispatchEvent(ev); + }, queueAllCached: function() { this.getAllFromCache().then(function(items) { for (var i = 0, max = items.length; i < max; i += 1) { @@ -204,6 +218,7 @@ MessageReceiver.prototype.extend({ return textsecure.storage.unprocessed.remove(id); }, queueDecryptedEnvelope: function(envelope, plaintext) { + var count = this.count += 1; var id = this.getEnvelopeId(envelope); console.log('queueing decrypted envelope', id); @@ -212,11 +227,14 @@ MessageReceiver.prototype.extend({ this.pending = this.pending.then(taskWithTimeout, taskWithTimeout); - return this.pending.catch(function(error) { + return this.pending.then(function() { + this.updateProgress(count); + }.bind(this), function(error) { console.log('queueDecryptedEnvelope error handling envelope', id, ':', error && error.stack ? error.stack : error); }); }, queueEnvelope: function(envelope) { + var count = this.count += 1; var id = this.getEnvelopeId(envelope); console.log('queueing envelope', id); @@ -225,7 +243,9 @@ MessageReceiver.prototype.extend({ this.pending = this.pending.then(taskWithTimeout, taskWithTimeout); - return this.pending.catch(function(error) { + return this.pending.then(function() { + this.updateProgress(count); + }.bind(this), function(error) { console.log('queueEnvelope error handling envelope', id, ':', error && error.stack ? error.stack : error); }); }, diff --git a/stylesheets/_global.scss b/stylesheets/_global.scss index 30ec9a7a8..4e11d39be 100644 --- a/stylesheets/_global.scss +++ b/stylesheets/_global.scss @@ -565,17 +565,15 @@ input[type=text], input[type=search], textarea { align-items: center; .content { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); + margin-left: auto; + margin-right: auto; + text-align: center; } - .container { - position: absolute; - left: 50%; - transform: translate(-50%, 0); + margin-left: auto; + margin-right: auto; width: 78px; + height: 22px; } .dot { diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css index 5630d04b6..024e8f1b8 100644 --- a/stylesheets/manifest.css +++ b/stylesheets/manifest.css @@ -504,15 +504,14 @@ input[type=text]:active, input[type=text]:focus, input[type=search]:active, inpu display: flex; align-items: center; } .app-loading-screen .content { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); } + margin-left: auto; + margin-right: auto; + text-align: center; } .app-loading-screen .container { - position: absolute; - left: 50%; - transform: translate(-50%, 0); - width: 78px; } + margin-left: auto; + margin-right: auto; + width: 78px; + height: 22px; } .app-loading-screen .dot { width: 14px; height: 14px;