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

added frames counter when importing them

Browse Source
This commit is contained in:
JeffVenancius 2023-05-10 00:15:44 -03:00
parent 21b8bdd0f3
commit b5f53a57fc
2 changed files with 41 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/js/controller/dialogs/importwizard/steps/ImageImport.js
View File

@ -26,6 +26,8 @@
this.resizeHeight = this.container.querySelector('[name=resize-height]'); this.resizeHeight = this.container.querySelector('[name=resize-height]');
this.smoothResize = this.container.querySelector('[name=smooth-resize-checkbox]'); this.smoothResize = this.container.querySelector('[name=smooth-resize-checkbox]');
this.framesH = this.container.querySelector('[name=frames-h]');
this.framesV = this.container.querySelector('[name=frames-v]');
this.frameSizeX = this.container.querySelector('[name=frame-size-x]'); this.frameSizeX = this.container.querySelector('[name=frame-size-x]');
this.frameSizeY = this.container.querySelector('[name=frame-size-y]'); this.frameSizeY = this.container.querySelector('[name=frame-size-y]');
this.frameOffsetX = this.container.querySelector('[name=frame-offset-x]'); this.frameOffsetX = this.container.querySelector('[name=frame-offset-x]');
@ -34,6 +36,8 @@
this.addEventListener(this.singleImportType, 'change', this.onImportTypeChange_); this.addEventListener(this.singleImportType, 'change', this.onImportTypeChange_);
this.addEventListener(this.sheetImportType, 'change', this.onImportTypeChange_); this.addEventListener(this.sheetImportType, 'change', this.onImportTypeChange_);
this.addEventListener(this.framesH, 'keyup', this.onFrameInputKeyUp_);
this.addEventListener(this.framesV, 'keyup', this.onFrameInputKeyUp_);
this.addEventListener(this.resizeWidth, 'keyup', this.onResizeInputKeyUp_); this.addEventListener(this.resizeWidth, 'keyup', this.onResizeInputKeyUp_);
this.addEventListener(this.resizeHeight, 'keyup', this.onResizeInputKeyUp_); this.addEventListener(this.resizeHeight, 'keyup', this.onResizeInputKeyUp_);
this.addEventListener(this.frameSizeX, 'keyup', this.onFrameInputKeyUp_); this.addEventListener(this.frameSizeX, 'keyup', this.onFrameInputKeyUp_);
@ -73,6 +77,10 @@
this.importedImage_, this.importedImage_,
{ {
importType: this.getImportType_(), importType: this.getImportType_(),
framesH: this.getImportType_() === 'single' ?
1 : this.sanitizeInputValue_(this.frameSizeX, 1),
frameV: this.getImportType_() === 'single' ?
1 : this.sanitizeInputValue_(this.frameSizeY, 1),
frameSizeX: this.getImportType_() === 'single' ? frameSizeX: this.getImportType_() === 'single' ?
this.resizeWidth.value : this.sanitizeInputValue_(this.frameSizeX, 1), this.resizeWidth.value : this.sanitizeInputValue_(this.frameSizeX, 1),
frameSizeY: this.getImportType_() === 'single' ? frameSizeY: this.getImportType_() === 'single' ?
@ -110,10 +118,34 @@
ns.ImageImport.prototype.onFrameInputKeyUp_ = function (evt) { ns.ImageImport.prototype.onFrameInputKeyUp_ = function (evt) {
if (this.importedImage_) { if (this.importedImage_) {
var targetName = evt.originalTarget.name;
if (!targetName.includes('offset')) {
this.synchronizeDivisions(targetName);
}
this.synchronizeFrameFields_(evt.target.value); this.synchronizeFrameFields_(evt.target.value);
} }
}; };
ns.ImageImport.prototype.synchronizeDivisions = function (targetName) {
var divideBy = (targetName === 'frames-h' || targetName === 'frame-size-x') ?
this.importedImage_.width : this.importedImage_.height;
switch (targetName) {
case 'frames-h':
this.frameSizeX.value = Math.floor(divideBy / this.sanitizeInputValue_(this.framesH, 0));
break;
case 'frame-size-x':
this.framesH.value = Math.floor(divideBy / this.sanitizeInputValue_(this.frameSizeX, 1));
break;
case 'frames-v':
this.frameSizeY.value = Math.floor(divideBy / this.sanitizeInputValue_(this.framesV, 1));
break;
case 'frame-size-y':
this.framesV.value = Math.floor(divideBy / this.sanitizeInputValue_(this.frameSizeY, 1));
break;
}
};
ns.ImageImport.prototype.synchronizeResizeFields_ = function (value, from) { ns.ImageImport.prototype.synchronizeResizeFields_ = function (value, from) {
value = parseInt(value, 10); value = parseInt(value, 10);
if (isNaN(value)) { if (isNaN(value)) {
@ -139,6 +171,8 @@
} }
// Parse the frame input values // Parse the frame input values
var framesH = this.sanitizeInputValue_(this.framesH, 1);
var framesV = this.sanitizeInputValue_(this.framesV, 1);
var frameSizeX = this.sanitizeInputValue_(this.frameSizeX, 1); var frameSizeX = this.sanitizeInputValue_(this.frameSizeX, 1);
var frameSizeY = this.sanitizeInputValue_(this.frameSizeY, 1); var frameSizeY = this.sanitizeInputValue_(this.frameSizeY, 1);
var frameOffsetX = this.sanitizeInputValue_(this.frameOffsetX, 0); var frameOffsetX = this.sanitizeInputValue_(this.frameOffsetX, 0);
@ -187,6 +221,8 @@
this.resizeWidth.value = w; this.resizeWidth.value = w;
this.resizeHeight.value = h; this.resizeHeight.value = h;
this.framesH.value = 1;
this.framesV.value = 1;
this.frameSizeX.value = w; this.frameSizeX.value = w;
this.frameSizeY.value = h; this.frameSizeY.value = h;
this.frameOffsetX.value = 0; this.frameOffsetX.value = 0;

5
src/templates/dialogs/import.html
View File

@ -38,6 +38,11 @@
Import as spritesheet Import as spritesheet
</label> </label>
</div> </div>
<div class="import-section import-subsection">
<span class="dialog-section-title">frames</span>
<input type="text" class="textfield import-size-field" autocomplete="off" name="frames-h"/>x
<input type="text" class="textfield import-size-field" autocomplete="off" name="frames-v"/>
</div>
<div class="import-section import-subsection"> <div class="import-section import-subsection">
<span class="dialog-section-title">Frame size</span> <span class="dialog-section-title">Frame size</span>
<input type="text" class="textfield import-size-field" autocomplete="off" name="frame-size-x"/>x <input type="text" class="textfield import-size-field" autocomplete="off" name="frame-size-x"/>x