diff --git a/src/css/dialogs-browse-backups.css b/src/css/dialogs-browse-backups.css index 966d4ccb..f617065e 100644 --- a/src/css/dialogs-browse-backups.css +++ b/src/css/dialogs-browse-backups.css @@ -72,6 +72,7 @@ } .browse-backups .session-item { + /* Transition duration should be kept in sync with SelectSession.DELETE_TRANSITION_DURATION */ transition: all 500ms; } @@ -99,6 +100,7 @@ .browse-backups .snapshot-preview { flex-grow: 0; flex-shrink: 1; + /* Keep synced with SessionDetails.PREVIEW_SIZE */ height: 60px; width: 60px; margin-right: 20px; diff --git a/src/js/controller/dialogs/backups/steps/SelectSession.js b/src/js/controller/dialogs/backups/steps/SelectSession.js index 0e905c7b..0c1b5b97 100644 --- a/src/js/controller/dialogs/backups/steps/SelectSession.js +++ b/src/js/controller/dialogs/backups/steps/SelectSession.js @@ -1,6 +1,8 @@ (function () { var ns = $.namespace('pskl.controller.dialogs.backups.steps'); + // Should match the transition duration for.session-item defined in dialogs-browse-backups.css + var DELETE_TRANSITION_DURATION = 500; /** * Helper that returns a promise that will resolve after waiting for a * given time (in ms). @@ -82,7 +84,7 @@ Q.all([ pskl.app.backupService.deleteSession(sessionId), // Wait for 500ms for the .hide opacity transition. - wait(500) + wait(DELETE_TRANSITION_DURATION) ]).then(function () { // Refresh the list of sessions this.update(); diff --git a/src/js/controller/dialogs/backups/steps/SessionDetails.js b/src/js/controller/dialogs/backups/steps/SessionDetails.js index 5c73ec31..8fff179e 100644 --- a/src/js/controller/dialogs/backups/steps/SessionDetails.js +++ b/src/js/controller/dialogs/backups/steps/SessionDetails.js @@ -1,6 +1,9 @@ (function () { var ns = $.namespace('pskl.controller.dialogs.backups.steps'); + // Should match the preview dimensions defined in dialogs-browse-backups.css + var PREVIEW_SIZE = 60; + ns.SessionDetails = function (piskelController, backupsController, container) { this.piskelController = piskelController; this.backupsController = backupsController; @@ -68,8 +71,8 @@ ns.SessionDetails.prototype.getFirstFrameAsImage_ = function (piskel) { var frame = pskl.utils.LayerUtils.mergeFrameAt(piskel.getLayers(), 0); - var wZoom = 60 / piskel.width; - var hZoom = 60 / piskel.height; + var wZoom = PREVIEW_SIZE / piskel.width; + var hZoom = PREVIEW_SIZE / piskel.height; var zoom = Math.min(hZoom, wZoom); return pskl.utils.FrameUtils.toImage(frame, zoom); };