From 1a9919a8662bed4f157db71dd6cc5eb53cbb12d9 Mon Sep 17 00:00:00 2001 From: zadam Date: Sun, 21 Mar 2021 00:01:28 +0100 Subject: [PATCH] sync status widget WIP --- src/public/app/services/ws.js | 13 ++++- src/public/app/widgets/scrolling_container.js | 2 - src/public/app/widgets/sync_status.js | 47 +++++++++++++++---- src/services/sync.js | 14 ++++-- src/services/ws.js | 16 +++++-- 5 files changed, 72 insertions(+), 20 deletions(-) diff --git a/src/public/app/services/ws.js b/src/public/app/services/ws.js index af839cdf2..82f56a346 100644 --- a/src/public/app/services/ws.js +++ b/src/public/app/services/ws.js @@ -213,7 +213,9 @@ setTimeout(() => { setInterval(sendPing, 1000); }, 0); -subscribeToMessages(message => { +subscribeToMessages(async message => { + const appContext = (await import("./app_context.js")).default; + if (message.type === 'sync-pull-in-progress') { toastService.showPersistent({ id: 'sync', @@ -221,10 +223,17 @@ subscribeToMessages(message => { message: "Sync update in progress", icon: "refresh" }); + + appContext.triggerEvent('syncInProgress'); } - else if (message.type === 'sync-pull-finished') { + else if (message.type === 'sync-finished') { // this gives user a chance to see the toast in case of fast sync finish setTimeout(() => toastService.closePersistent('sync'), 1000); + + appContext.triggerEvent('syncFinished'); + } + else if (message.type === 'sync-failed') { + appContext.triggerEvent('syncFailed'); } }); diff --git a/src/public/app/widgets/scrolling_container.js b/src/public/app/widgets/scrolling_container.js index 0d9b1c2b4..ea37d07db 100644 --- a/src/public/app/widgets/scrolling_container.js +++ b/src/public/app/widgets/scrolling_container.js @@ -10,8 +10,6 @@ export default class ScrollingContainer extends Container { async tabNoteSwitchedEvent({tabContext, notePath}) { // if notePath does not match then the tabContext has been switched to another note in the mean time if (tabContext.notePath === notePath) { - console.log("SCROLLING"); - this.$widget.scrollTop(0); } } diff --git a/src/public/app/widgets/sync_status.js b/src/public/app/widgets/sync_status.js index 8e732365a..7da5f8f42 100644 --- a/src/public/app/widgets/sync_status.js +++ b/src/public/app/widgets/sync_status.js @@ -1,6 +1,4 @@ import BasicWidget from "./basic_widget.js"; -import utils from "../services/utils.js"; -import syncService from "../services/sync.js"; const TPL = `
@@ -17,8 +15,6 @@ const TPL = ` } .sync-status button { - margin-right: 5px; - margin-left: 5px; height: 34px; border: none; font-size: 180%; @@ -26,7 +22,8 @@ const TPL = ` padding-right: 10px; } - .sync-status button span { + .sync-status button > span { + display: inline-block; position: relative; top: -5px; } @@ -42,9 +39,23 @@ const TPL = `
@@ -53,6 +64,26 @@ const TPL = ` export default class SyncStatusWidget extends BasicWidget { doRender() { this.$widget = $(TPL); + this.$widget.hide(); + this.overflowing(); } + + syncInProgressEvent() { + this.showIcon('in-progress'); + } + + syncFinishedEvent() { + this.showIcon('online-no-changes'); + } + + syncFailedEvent() { + this.showIcon('offline-no-changes'); + } + + showIcon(className) { + this.$widget.show(); + this.$widget.find('.sync-status-icon').hide(); + this.$widget.find('.sync-status-' + className).show(); + } } diff --git a/src/services/sync.js b/src/services/sync.js index 9aad2e3e7..82c08f1a5 100644 --- a/src/services/sync.js +++ b/src/services/sync.js @@ -46,6 +46,8 @@ async function sync() { } while (continueSync); + ws.syncFinished(); + return { success: true }; @@ -59,6 +61,8 @@ async function sync() { e.message.includes('ERR_CONNECTION_REFUSED') || e.message.includes('Bad Gateway'))) { + ws.syncFailed(); + log.info("No connection to sync server."); return { @@ -69,6 +73,8 @@ async function sync() { else { log.info("sync failed: " + e.message + "\nstack: " + e.stack); + ws.syncFailed(); + return { success: false, message: e.message @@ -143,7 +149,7 @@ async function pullChanges(syncContext) { sql.transactional(() => { for (const {entityChange, entity} of entityChanges) { if (!sourceIdService.isLocalSourceId(entityChange.sourceId)) { - if (!atLeastOnePullApplied && entityChange.entity !== 'recent_notes') { // send only for first + if (!atLeastOnePullApplied) { // send only for first ws.syncPullInProgress(); atLeastOnePullApplied = true; @@ -163,10 +169,6 @@ async function pullChanges(syncContext) { log.info(`Pulled ${entityChanges.length} changes in ${sizeInKb} KB, starting at entityChangeId=${lastSyncedPull} in ${pulledDate - startDate}ms and applied them in ${Date.now() - pulledDate}ms, ${outstandingPullCount} outstanding pulls`); } - if (atLeastOnePullApplied) { - ws.syncPullFinished(); - } - log.info("Finished pull"); } @@ -212,6 +214,8 @@ async function pushChanges(syncContext) { entities: entityChangesRecords }); + ws.syncPushInProgress(); + log.info(`Pushing ${entityChangesRecords.length} sync changes in ` + (Date.now() - startDate.getTime()) + "ms"); lastSyncedPush = entityChangesRecords[entityChangesRecords.length - 1].entityChange.id; diff --git a/src/services/ws.js b/src/services/ws.js index a4d1b05ff..f234f0dd8 100644 --- a/src/services/ws.js +++ b/src/services/ws.js @@ -124,14 +124,24 @@ function syncPullInProgress() { sendMessageToAllClients({ type: 'sync-pull-in-progress' }); } -function syncPullFinished() { - sendMessageToAllClients({ type: 'sync-pull-finished' }); +function syncPushInProgress() { + sendMessageToAllClients({ type: 'sync-push-in-progress' }); +} + +function syncFinished() { + sendMessageToAllClients({ type: 'sync-finished' }); +} + +function syncFailed() { + sendMessageToAllClients({ type: 'sync-failed' }); } module.exports = { init, sendMessageToAllClients, + syncPushInProgress, syncPullInProgress, - syncPullFinished, + syncFinished, + syncFailed, sendTransactionSyncsToAllClients };