add comments for values synced between JS and CSS

This commit is contained in:
juliandescottes 2017-08-03 00:12:59 +02:00 committed by Julian Descottes
parent c037b07693
commit 629ecf83b4
3 changed files with 10 additions and 3 deletions

View file

@ -72,6 +72,7 @@
} }
.browse-backups .session-item { .browse-backups .session-item {
/* Transition duration should be kept in sync with SelectSession.DELETE_TRANSITION_DURATION */
transition: all 500ms; transition: all 500ms;
} }
@ -99,6 +100,7 @@
.browse-backups .snapshot-preview { .browse-backups .snapshot-preview {
flex-grow: 0; flex-grow: 0;
flex-shrink: 1; flex-shrink: 1;
/* Keep synced with SessionDetails.PREVIEW_SIZE */
height: 60px; height: 60px;
width: 60px; width: 60px;
margin-right: 20px; margin-right: 20px;

View file

@ -1,6 +1,8 @@
(function () { (function () {
var ns = $.namespace('pskl.controller.dialogs.backups.steps'); 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 * Helper that returns a promise that will resolve after waiting for a
* given time (in ms). * given time (in ms).
@ -82,7 +84,7 @@
Q.all([ Q.all([
pskl.app.backupService.deleteSession(sessionId), pskl.app.backupService.deleteSession(sessionId),
// Wait for 500ms for the .hide opacity transition. // Wait for 500ms for the .hide opacity transition.
wait(500) wait(DELETE_TRANSITION_DURATION)
]).then(function () { ]).then(function () {
// Refresh the list of sessions // Refresh the list of sessions
this.update(); this.update();

View file

@ -1,6 +1,9 @@
(function () { (function () {
var ns = $.namespace('pskl.controller.dialogs.backups.steps'); 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) { ns.SessionDetails = function (piskelController, backupsController, container) {
this.piskelController = piskelController; this.piskelController = piskelController;
this.backupsController = backupsController; this.backupsController = backupsController;
@ -68,8 +71,8 @@
ns.SessionDetails.prototype.getFirstFrameAsImage_ = function (piskel) { ns.SessionDetails.prototype.getFirstFrameAsImage_ = function (piskel) {
var frame = pskl.utils.LayerUtils.mergeFrameAt(piskel.getLayers(), 0); var frame = pskl.utils.LayerUtils.mergeFrameAt(piskel.getLayers(), 0);
var wZoom = 60 / piskel.width; var wZoom = PREVIEW_SIZE / piskel.width;
var hZoom = 60 / piskel.height; var hZoom = PREVIEW_SIZE / piskel.height;
var zoom = Math.min(hZoom, wZoom); var zoom = Math.min(hZoom, wZoom);
return pskl.utils.FrameUtils.toImage(frame, zoom); return pskl.utils.FrameUtils.toImage(frame, zoom);
}; };