feature #251 : Set default size in Resize pref panel
This commit is contained in:
parent
43e60e300c
commit
6254490a23
7 changed files with 77 additions and 7 deletions
|
@ -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);
|
||||
|
||||
|
|
|
@ -75,7 +75,6 @@
|
|||
|
||||
ns.PopupPreviewController.prototype.onPopupClosed_ = function () {
|
||||
var popup = this.popup;
|
||||
console.log(popup);
|
||||
this.popup = null;
|
||||
};
|
||||
|
||||
|
|
47
src/js/controller/settings/resize/DefaultSizeController.js
Normal file
47
src/js/controller/settings/resize/DefaultSizeController.js
Normal 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;
|
||||
};
|
||||
})();
|
|
@ -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 () {
|
||||
|
|
|
@ -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,
|
||||
|
|
|
@ -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",
|
||||
|
||||
|
|
|
@ -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>
|
Loading…
Reference in a new issue