feature #251 : Set default size in Resize pref panel

This commit is contained in:
jdescottes 2015-03-04 08:37:37 +01:00
parent 43e60e300c
commit 6254490a23
7 changed files with 77 additions and 7 deletions

View File

@ -18,11 +18,7 @@
this.shortcutService = new pskl.service.keyboard.ShortcutService();
this.shortcutService.init();
var size = {
height : Constants.DEFAULT.HEIGHT,
width : Constants.DEFAULT.WIDTH
};
var size = pskl.UserSettings.get(pskl.UserSettings.DEFAULT_SIZE);
var descriptor = new pskl.model.piskel.Descriptor('New Piskel', '');
var piskel = new pskl.model.Piskel(size.width, size.height, descriptor);

View File

@ -75,7 +75,6 @@
ns.PopupPreviewController.prototype.onPopupClosed_ = function () {
var popup = this.popup;
console.log(popup);
this.popup = null;
};

View File

@ -0,0 +1,47 @@
(function () {
var ns = $.namespace('pskl.controller.settings.resize');
ns.DefaultSizeController = function (piskelController) {
this.piskelController = piskelController;
};
pskl.utils.inherit(ns.DefaultSizeController, pskl.controller.settings.AbstractSettingController);
ns.DefaultSizeController.prototype.init = function () {
this.container = document.querySelector('.settings-default-size');
var defaultSize = pskl.UserSettings.get(pskl.UserSettings.DEFAULT_SIZE);
this.widthInput = this.container.querySelector('[name="default-width"]');
this.heightInput = this.container.querySelector('[name="default-height"]');
this.widthInput.value = defaultSize.width;
this.heightInput.value = defaultSize.height;
this.defaultSizeForm = this.container.querySelector('form');
this.addEventListener(this.defaultSizeForm, 'submit', this.onFormSubmit_);
};
ns.DefaultSizeController.prototype.onFormSubmit_ = function (evt) {
evt.preventDefault();
var defaultSize = pskl.UserSettings.get(pskl.UserSettings.DEFAULT_SIZE);
var width = this.toNumber_(this.widthInput.value, defaultSize.width);
var height = this.toNumber_(this.heightInput.value, defaultSize.height);
pskl.UserSettings.set(pskl.UserSettings.DEFAULT_SIZE, {
width : width,
height : height
});
$.publish(Events.CLOSE_SETTINGS_DRAWER);
};
ns.DefaultSizeController.prototype.toNumber_ = function (strValue, defaultValue) {
var value = parseInt(strValue, 10);
if (value === 0 || isNaN(value)) {
value = defaultValue;
}
return value;
};
})();

View File

@ -8,6 +8,7 @@
var anchorWidgetContainer = this.container.querySelector('.resize-origin-container');
this.anchorWidget = new ns.AnchorWidget(anchorWidgetContainer);
this.defaultSizeController = new ns.DefaultSizeController(piskelController);
};
pskl.utils.inherit(ns.ResizeController, pskl.controller.settings.AbstractSettingController);
@ -33,6 +34,8 @@
this.anchorWidget.setOrigin(ns.AnchorWidget.ORIGIN.TOPLEFT);
this.lastInput = this.widthInput;
this.defaultSizeController.init();
};
ns.ResizeController.prototype.destroy = function () {

View File

@ -4,6 +4,7 @@
ns.UserSettings = {
GRID_WIDTH : 'GRID_WIDTH',
MAX_FPS : 'MAX_FPS',
DEFAULT_SIZE : 'DEFAULT_SIZE',
CANVAS_BACKGROUND : 'CANVAS_BACKGROUND',
SELECTED_PALETTE : 'SELECTED_PALETTE',
TILED_PREVIEW : 'TILED_PREVIEW',
@ -13,6 +14,10 @@
KEY_TO_DEFAULT_VALUE_MAP_ : {
'GRID_WIDTH' : 0,
'MAX_FPS' : 24,
'DEFAULT_SIZE' : {
width : 32,
height : 32
},
'CANVAS_BACKGROUND' : 'lowcont-dark-canvas-background',
'SELECTED_PALETTE' : Constants.CURRENT_COLORS_PALETTE_ID,
'TILED_PREVIEW' : false,

View File

@ -104,6 +104,7 @@
"js/controller/settings/exportimage/PngExportController.js",
"js/controller/settings/resize/AnchorWidget.js",
"js/controller/settings/resize/ResizeController.js",
"js/controller/settings/resize/DefaultSizeController.js",
"js/controller/settings/SaveController.js",
"js/controller/settings/ImportController.js",

View File

@ -1,5 +1,5 @@
<div class="settings-section">
<!-- RESIZE DRAWING AREA -->
<!-- RESIZE DRAWING SECTION -->
<div class="settings-title">
Resize
</div>
@ -44,4 +44,23 @@
<input type="submit" class="button button-primary resize-button" value="Resize" />
</form>
</div>
<!-- DEFAULT SIZE SECTION -->
<div class="settings-title">
Default size
</div>
<div class="settings-item settings-default-size">
<form action="" method="POST" name="default-size-form">
<div class="resize-section">
<span class="resize-section-title">Width</span>
<input type="text" class="textfield resize-size-field" name="default-width"/>
<span>px</span>
</div>
<div class="resize-section">
<span class="resize-section-title">Height</span>
<input type="text" class="textfield resize-size-field" name="default-height"/>
<span>px</span>
</div>
<input type="submit" class="button button-primary resize-button" value="Set default" />
</form>
</div>
</div>