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

Final : Specific tooltip while preview size selection disabled

Browse Source
This commit is contained in:
Guillaume Martigny 2017-01-11 12:23:49 +01:00
parent f2424ed16e
commit d4b4192d45
2 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/css/toolbox-animated-preview.css
View File

@ -129,7 +129,7 @@
*/ */
.preview-drop-down { .preview-drop-down {
float: left; float: left;
position: relative;
width : 22px; width : 22px;
min-height: 22px; min-height: 22px;
margin: 0 5px; margin: 0 5px;

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

@ -25,7 +25,7 @@
this.fpsCounterDisplay = document.querySelector('#display-fps'); this.fpsCounterDisplay = document.querySelector('#display-fps');
this.openPopupPreview = document.querySelector('.open-popup-preview-button'); this.openPopupPreview = document.querySelector('.open-popup-preview-button');
this.previewSizeDropdown = document.querySelector('.preview-drop-down'); this.previewSizeDropdown = document.querySelector('.preview-drop-down');
this.previewSize = { this.previewSizes = {
original: { original: {
name: 'original', name: 'original',
zoom: 1, zoom: 1,
@ -81,9 +81,9 @@
var onionSkinTooltip = pskl.utils.TooltipFormatter.format('Toggle onion skin', this.onionSkinShortcut); var onionSkinTooltip = pskl.utils.TooltipFormatter.format('Toggle onion skin', this.onionSkinShortcut);
this.toggleOnionSkinButton.setAttribute('title', onionSkinTooltip); this.toggleOnionSkinButton.setAttribute('title', onionSkinTooltip);
for (var size in this.previewSize) { for (var size in this.previewSizes) {
if (this.previewSize.hasOwnProperty(size)) { if (this.previewSizes.hasOwnProperty(size)) {
var wrapper = this.previewSize[size]; var wrapper = this.previewSizes[size];
addEvent(wrapper.button, 'click', this.onChangePreviewSize_, this, wrapper.name); addEvent(wrapper.button, 'click', this.onChangePreviewSize_, this, wrapper.name);
registerShortcut(wrapper.shortcut, this.onChangePreviewSize_.bind(this, wrapper.name)); registerShortcut(wrapper.shortcut, this.onChangePreviewSize_.bind(this, wrapper.name));
var tooltip = pskl.utils.TooltipFormatter.format(wrapper.tooltip, wrapper.shortcut); var tooltip = pskl.utils.TooltipFormatter.format(wrapper.tooltip, wrapper.shortcut);
@ -91,8 +91,8 @@
} }
} }
var disableTooltip = pskl.utils.TooltipFormatter.format('I\'m disabled'); // TODO : Change the disabled message
document.querySelector('.preview-disable-overlay').setAttribute('title', disableTooltip); document.querySelector('.preview-disable-overlay').setAttribute('title', 'Widget disabled.');
$.subscribe(Events.FRAME_SIZE_CHANGED, this.onFrameSizeChange_.bind(this)); $.subscribe(Events.FRAME_SIZE_CHANGED, this.onFrameSizeChange_.bind(this));
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this)); $.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
@ -115,32 +115,32 @@
var seamlessModeEnabled = pskl.UserSettings.get(pskl.UserSettings.SEAMLESS_MODE); var seamlessModeEnabled = pskl.UserSettings.get(pskl.UserSettings.SEAMLESS_MODE);
var shouldDisable = true; var shouldDisable = true;
// Hard-coded options collision // Hard-coded options removal
if (fullZoom < 1) { if (fullZoom < 1) {
this.togglePreviewWidget_(this.previewSize.full.name); this.togglePreviewWidget_(this.previewSizes.full.name);
} else if (seamlessModeEnabled || (fullZoom === 1 && bestZoom === 1)) { } else if (seamlessModeEnabled || (fullZoom === 1 && bestZoom === 1)) {
this.togglePreviewWidget_(this.previewSize.original.name); this.togglePreviewWidget_(this.previewSizes.original.name);
} else { // widget not disabled } else { // widget not disabled
this.togglePreviewWidget_(!shouldDisable); this.togglePreviewWidget_(!shouldDisable);
if (fullZoom === bestZoom) { if (fullZoom === bestZoom) {
if (this.togglePreviewSizeButtonState_(this.previewSize.full, shouldDisable)) { if (this.togglePreviewSizeButtonState_(this.previewSizes.full, shouldDisable)) {
this.onChangePreviewSize_(this.previewSize.best.name); this.onChangePreviewSize_(this.previewSizes.best.name);
} }
} else if (bestZoom === 1) { } else if (bestZoom === 1) {
if (this.togglePreviewSizeButtonState_(this.previewSize.best, shouldDisable)) { if (this.togglePreviewSizeButtonState_(this.previewSizes.best, shouldDisable)) {
this.onChangePreviewSize_(this.previewSize.original.name); this.onChangePreviewSize_(this.previewSizes.original.name);
} }
} }
} }
this.previewSize.best.button.textContent = Math.floor(fullZoom) + 'x'; this.previewSizes.best.button.textContent = Math.floor(fullZoom) + 'x';
}; };
ns.PreviewController.prototype.togglePreviewWidget_ = function (disable) { ns.PreviewController.prototype.togglePreviewWidget_ = function (disable) {
this.previewSizeDropdown.classList.toggle('preview-drop-down-disabled', disable); this.previewSizeDropdown.classList.toggle('preview-drop-down-disabled', disable);
for (var size in this.previewSize) { for (var size in this.previewSizes) {
if (this.previewSize.hasOwnProperty(size)) { if (this.previewSizes.hasOwnProperty(size)) {
this.togglePreviewSizeButtonState_(this.previewSize[size], disable && size !== disable); this.togglePreviewSizeButtonState_(this.previewSizes[size], disable && size !== disable);
} }
} }
if (disable) { if (disable) {
@ -160,7 +160,7 @@
}; };
ns.PreviewController.prototype.onChangePreviewSize_ = function (choice) { ns.PreviewController.prototype.onChangePreviewSize_ = function (choice) {
if (this.previewSize[choice].enabled) { if (this.previewSizes[choice].enabled) {
this.selectedPreviewSize = choice; this.selectedPreviewSize = choice;
pskl.UserSettings.set(pskl.UserSettings.PREVIEW_SIZE, choice); pskl.UserSettings.set(pskl.UserSettings.PREVIEW_SIZE, choice);
} }
@ -171,6 +171,8 @@
this.updateOnionSkinPreview_(); this.updateOnionSkinPreview_();
} else if (name == pskl.UserSettings.MAX_FPS) { } else if (name == pskl.UserSettings.MAX_FPS) {
this.updateMaxFPS_(); this.updateMaxFPS_();
} else if (name === pskl.UserSettings.SEAMLESS_MODE) {
this.onFrameSizeChange_();
} else { } else {
this.updateZoom_(); this.updateZoom_();
this.selectPreviewSizeButton_(); this.selectPreviewSizeButton_();
@ -191,7 +193,7 @@
currentlySelected.classList.remove(enabledClassname); currentlySelected.classList.remove(enabledClassname);
} }
var option = this.previewSize[this.selectedPreviewSize]; var option = this.previewSizes[this.selectedPreviewSize];
option.button.classList.add(enabledClassname); option.button.classList.add(enabledClassname);
}; };
@ -204,7 +206,7 @@
ns.PreviewController.prototype.updateZoom_ = function () { ns.PreviewController.prototype.updateZoom_ = function () {
var chosenPreviewSize = pskl.UserSettings.get(pskl.UserSettings.PREVIEW_SIZE); var chosenPreviewSize = pskl.UserSettings.get(pskl.UserSettings.PREVIEW_SIZE);
var zoom = this.previewSize[chosenPreviewSize].zoom; var zoom = this.previewSizes[chosenPreviewSize].zoom;
this.renderer.setZoom($.isFunction(zoom) ? zoom() : zoom); this.renderer.setZoom($.isFunction(zoom) ? zoom() : zoom);
this.setRenderFlag_(true); this.setRenderFlag_(true);