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

Merge branch 'master' into feature-export-to-file

Browse Source
This commit is contained in:
jdescottes
2014-07-05 23:53:03 +02:00
parent 7b3f5ee858 84e757768e
commit f8b6d7b0d3
26 changed files with 440 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/js/controller/AnimatedPreviewController.js
View File

@ -16,14 +16,43 @@
var frame = this.piskelController.getCurrentFrame();
this.renderer = new pskl.rendering.frame.TiledFrameRenderer(this.container);
this.updateZoom_();
$.subscribe(Events.FRAME_SIZE_CHANGED, this.onFrameSizeChange_.bind(this));
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
};
ns.AnimatedPreviewController.prototype.onUserSettingsChange_ = function () {
ns.AnimatedPreviewController.prototype.init = function () {
// the oninput event won't work on IE10 unfortunately, but at least will provide a
// consistent behavior across all other browsers that support the input type range
// see https://bugzilla.mozilla.org/show_bug.cgi?id=853670
$("#preview-fps")[0].addEventListener('change', this.onFPSSliderChange.bind(this));
document.querySelector(".right-column").style.width = Constants.ANIMATED_PREVIEW_WIDTH + 'px';
this.toggleOnionSkinEl = document.querySelector(".preview-toggle-onion-skin");
this.toggleOnionSkinEl.addEventListener('click', this.toggleOnionSkin_.bind(this));
pskl.app.shortcutService.addShortcut('alt+O', this.toggleOnionSkin_.bind(this));
$.subscribe(Events.FRAME_SIZE_CHANGED, this.onFrameSizeChange_.bind(this));
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
this.updateZoom_();
this.updateContainerDimensions_();
this.updateOnionSkinPreview_();
};
ns.AnimatedPreviewController.prototype.onUserSettingsChange_ = function (evt, name, value) {
if (name == pskl.UserSettings.ONION_SKIN) {
this.updateOnionSkinPreview_();
} else {
this.updateZoom_();
this.updateContainerDimensions_();
}
};
ns.AnimatedPreviewController.prototype.updateOnionSkinPreview_ = function () {
var enabledClassname = 'preview-toggle-onion-skin-enabled';
if (pskl.UserSettings.get(pskl.UserSettings.ONION_SKIN)) {
this.toggleOnionSkinEl.classList.add(enabledClassname);
} else {
this.toggleOnionSkinEl.classList.remove(enabledClassname);
}
};
ns.AnimatedPreviewController.prototype.updateZoom_ = function () {
@ -47,14 +76,6 @@
};
};
ns.AnimatedPreviewController.prototype.init = function () {
// the oninput event won't work on IE10 unfortunately, but at least will provide a
// consistent behavior across all other browsers that support the input type range
// see https://bugzilla.mozilla.org/show_bug.cgi?id=853670
$("#preview-fps")[0].addEventListener('change', this.onFPSSliderChange.bind(this));
document.querySelector(".right-column").style.width = Constants.ANIMATED_PREVIEW_WIDTH + 'px';
};
ns.AnimatedPreviewController.prototype.onFPSSliderChange = function (evt) {
this.setFPS(parseInt($("#preview-fps")[0].value, 10));
};
@ -122,4 +143,9 @@
containerEl.style.marginLeft = ((PREVIEW_SIZE - width) / 2) + "px";
containerEl.style.marginRight = ((PREVIEW_SIZE - width) / 2) + "px";
};
ns.AnimatedPreviewController.prototype.toggleOnionSkin_ = function () {
var currentValue = pskl.UserSettings.get(pskl.UserSettings.ONION_SKIN);
pskl.UserSettings.set(pskl.UserSettings.ONION_SKIN, !currentValue);
};
})();

9
src/js/controller/DrawingController.js
View File

@ -113,7 +113,7 @@
ns.DrawingController.prototype.onUserSettingsChange_ = function (evt, settingsName, settingsValue) {
if(settingsName == pskl.UserSettings.SHOW_GRID) {
console.warn('DrawingController:onUserSettingsChange_ not implemented !');
} else if (settingsName == pskl.UserSettings.OVERLAY) {
} else if (settingsName == pskl.UserSettings.ONION_SKIN || settingsName == pskl.UserSettings.LAYER_PREVIEW) {
this.onionSkinRenderer.clear();
this.onionSkinRenderer.flush();
this.layersRenderer.clear();
@ -319,10 +319,11 @@
this.overlayFrame = pskl.model.Frame.createEmptyFromFrame(currentFrame);
}
var overlaySetting = pskl.UserSettings.get(pskl.UserSettings.OVERLAY);
if (overlaySetting === Constants.OVERLAY_ONION_SKIN) {
if (pskl.UserSettings.get(pskl.UserSettings.ONION_SKIN)) {
this.onionSkinRenderer.render();
} else if (overlaySetting === Constants.OVERLAY_LAYER_PREVIEW) {
}
if (pskl.UserSettings.get(pskl.UserSettings.LAYER_PREVIEW)) {
this.layersRenderer.render();
}

31
src/js/controller/LayersListController.js
View File

@ -7,14 +7,21 @@
ns.LayersListController.prototype.init = function () {
this.layerItemTemplate_ = pskl.utils.Template.get('layer-item-template');
this.rootEl = document.querySelectorAll('.layers-list-container')[0];
this.layersListEl = document.querySelectorAll('.layers-list')[0];
this.rootEl = document.querySelector('.layers-list-container');
this.layersListEl = document.querySelector('.layers-list');
this.toggleLayerPreviewEl = document.querySelector('.layers-toggle-preview');
this.rootEl.addEventListener('click', this.onClick_.bind(this));
this.toggleLayerPreviewEl.addEventListener('click', this.toggleLayerPreview_.bind(this));
$.subscribe(Events.PISKEL_RESET, this.renderLayerList_.bind(this));
pskl.app.shortcutService.addShortcut('alt+L', this.toggleLayerPreview_.bind(this));
this.renderLayerList_();
this.updateToggleLayerPreview_();
$.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
};
ns.LayersListController.prototype.renderLayerList_ = function () {
@ -23,6 +30,21 @@
layers.forEach(this.addLayerItem.bind(this));
};
ns.LayersListController.prototype.updateToggleLayerPreview_ = function () {
var enabledClassname = 'layers-toggle-preview-enabled';
if (pskl.UserSettings.get(pskl.UserSettings.LAYER_PREVIEW)) {
this.toggleLayerPreviewEl.classList.add(enabledClassname);
} else {
this.toggleLayerPreviewEl.classList.remove(enabledClassname);
}
};
ns.LayersListController.prototype.onUserSettingsChange_ = function (evt, name, value) {
if (name == pskl.UserSettings.LAYER_PREVIEW) {
this.updateToggleLayerPreview_();
}
};
ns.LayersListController.prototype.addLayerItem = function (layer, index) {
var isSelected = this.piskelController.getCurrentLayer() === layer;
var layerItemHtml = pskl.utils.Template.replace(this.layerItemTemplate_, {
@ -69,4 +91,9 @@
this.piskelController.removeCurrentLayer();
}
};
ns.LayersListController.prototype.toggleLayerPreview_ = function () {
var currentValue = pskl.UserSettings.get(pskl.UserSettings.LAYER_PREVIEW);
pskl.UserSettings.set(pskl.UserSettings.LAYER_PREVIEW, !currentValue);
};
})();

9
src/js/controller/settings/ApplicationSettingsController.js
View File

@ -18,10 +18,6 @@
$('#grid-width').val(gridWidth);
$('#grid-width').change(this.onGridWidthChange.bind(this));
var overlay = pskl.UserSettings.get(pskl.UserSettings.OVERLAY);
$('#overlay').val(overlay);
$('#overlay').change(this.onOverlayChange.bind(this));
// Handle canvas background changes:
$('#background-picker-wrapper').click(this.onBackgroundClick.bind(this));
};
@ -31,11 +27,6 @@
pskl.UserSettings.set(pskl.UserSettings.GRID_WIDTH, parseInt(width, 10));
};
ns.ApplicationSettingsController.prototype.onOverlayChange = function (evt) {
var overlay = $('#overlay').val();
pskl.UserSettings.set(pskl.UserSettings.OVERLAY, overlay);
};
ns.ApplicationSettingsController.prototype.onBackgroundClick = function (evt) {
var target = $(evt.target).closest('.background-picker');
if (target.length) {