mirror/piskel
1
0
Fork 0
mirror of https://github.com/piskelapp/piskel.git synced 2023-08-10 21:12:52 +03:00
Code Issues Projects Releases Wiki Activity

Issue #304 : Blur FPS range input only on change event

Browse Source
This commit is contained in:
jdescottes 2015-09-13 15:49:18 +02:00
parent dffe23746c
commit 489298e87a
1 changed files with 18 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/js/controller/preview/PreviewController.js
View File

@ -13,8 +13,8 @@
this.renderFlag = true; this.renderFlag = true;
this.fpsRangeInput = $('#preview-fps'); this.fpsRangeInput = document.querySelector('#preview-fps');
this.fpsCounterDisplay = $('#display-fps'); this.fpsCounterDisplay = document.querySelector('#display-fps');
this.setFPS(Constants.DEFAULT.FPS); this.setFPS(Constants.DEFAULT.FPS);
@ -25,7 +25,9 @@
}; };
ns.PreviewController.prototype.init = function () { ns.PreviewController.prototype.init = function () {
this.fpsRangeInput.on('input change', this.onFPSSliderChange.bind(this)); this.fpsRangeInput.addEventListener('change', this.onFpsRangeInputUpdate_.bind(this));
this.fpsRangeInput.addEventListener('input', this.onFpsRangeInputUpdate_.bind(this));
document.querySelector('.right-column').style.width = Constants.ANIMATED_PREVIEW_WIDTH + 'px'; document.querySelector('.right-column').style.width = Constants.ANIMATED_PREVIEW_WIDTH + 'px';
this.toggleOnionSkinEl = document.querySelector('.preview-toggle-onion-skin'); this.toggleOnionSkinEl = document.querySelector('.preview-toggle-onion-skin');
@ -75,7 +77,7 @@
ns.PreviewController.prototype.updateMaxFPS_ = function () { ns.PreviewController.prototype.updateMaxFPS_ = function () {
var maxFps = pskl.UserSettings.get(pskl.UserSettings.MAX_FPS); var maxFps = pskl.UserSettings.get(pskl.UserSettings.MAX_FPS);
this.fpsRangeInput.get(0).setAttribute('max', maxFps); this.fpsRangeInput.setAttribute('max', maxFps);
this.setFPS(Math.min(this.fps, maxFps)); this.setFPS(Math.min(this.fps, maxFps));
}; };
@ -101,20 +103,25 @@
}; };
}; };
ns.PreviewController.prototype.onFPSSliderChange = function (evt) { /**
this.setFPS(parseInt(this.fpsRangeInput[0].value, 10)); * Event handler triggered on 'input' or 'change' events.
*/
ns.PreviewController.prototype.onFpsRangeInputUpdate_ = function (evt) {
this.setFPS(parseInt(this.fpsRangeInput.value, 10));
// blur only on 'change' events, as blurring on 'input' breaks on Firefox
if (evt.type === 'change') {
this.fpsRangeInput.blur();
}
}; };
ns.PreviewController.prototype.setFPS = function (fps) { ns.PreviewController.prototype.setFPS = function (fps) {
if (typeof fps === 'number') { if (typeof fps === 'number') {
this.fps = fps; this.fps = fps;
// reset // reset
this.fpsRangeInput.get(0).value = 0; this.fpsRangeInput.value = 0;
// set proper value // set proper value
this.fpsRangeInput.get(0).value = this.fps; this.fpsRangeInput.value = this.fps;
this.fpsRangeInput.blur(); this.fpsCounterDisplay.innerHTML = this.fps + ' FPS';
this.fpsCounterDisplay.html(this.fps + ' FPS');
} }
}; };