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

Updating for pull request feedback

Browse Source 
- Using labels for the import type radio buttons
- Non animated gifs can now be imported as a spritesheet
- Fixing frame slicing to ignore a partial frame while looping
This commit is contained in:
James Lissiak 2015-06-03 19:48:29 -07:00
parent 2d9001db6e
commit 5c46cfe20a
3 changed files with 35 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/js/controller/dialogs/ImportImageController.js
View File

@ -185,7 +185,14 @@
var images = gifLoader.getFrames().map(function (frame) {
return pskl.utils.CanvasUtils.createFromImageData(frame.data);
});
this.createPiskelFromImages_(images, resizeW, resizeH);
if (this.getImportType_() === 'single' || images.length > 1) {
// Single image import or animated gif
this.createPiskelFromImages_(images, resizeW, resizeH);
} else {
// Spritesheet
this.createImagesFromSheet_(images[0]);
}
this.closeDialog();
}.bind(this),
error: function () {
@ -194,19 +201,7 @@
this.createPiskelFromImages_([image], resizeW, resizeH);
} else {
// Spritesheet
var x = this.sanitizeInputValue_(this.frameOffsetX, 0);
var y = this.sanitizeInputValue_(this.frameOffsetY, 0);
var w = this.sanitizeInputValue_(this.frameSizeX, 1);
var h = this.sanitizeInputValue_(this.frameSizeY, 1);
var images = pskl.utils.CanvasUtils.createFramesFromImage(
image,
x,
y,
w,
h,
/*useHorizonalStrips=*/ true,
/*ignoreEmptyFrames=*/ true);
this.createPiskelFromImages_(images, w, h);
this.createImagesFromSheet_(image);
}
this.closeDialog();
}.bind(this)
@ -216,6 +211,23 @@
}
};
ns.ImportImageController.prototype.createImagesFromSheet_ = function (image) {
var x = this.sanitizeInputValue_(this.frameOffsetX, 0);
var y = this.sanitizeInputValue_(this.frameOffsetY, 0);
var w = this.sanitizeInputValue_(this.frameSizeX, 1);
var h = this.sanitizeInputValue_(this.frameSizeY, 1);
var images = pskl.utils.CanvasUtils.createFramesFromImage(
image,
x,
y,
w,
h,
/*useHorizonalStrips=*/ true,
/*ignoreEmptyFrames=*/ true);
this.createPiskelFromImages_(images, w, h);
};
ns.ImportImageController.prototype.createFramesFromImages_ = function (images, w, h) {
var smoothing = !!this.smoothResize.prop('checked');

2
src/js/utils/CanvasUtils.js
View File

@ -52,7 +52,7 @@
var y = offsetY;
var blankData = pskl.utils.CanvasUtils.createCanvas(width, height).toDataURL();
while (x < image.width && y < image.height) {
while (x + width <= image.width && y + height <= image.height) {
// Create a new canvas element
var canvas = pskl.utils.CanvasUtils.createCanvas(width, height);
var context = canvas.getContext('2d');

12
src/templates/dialogs/import-image.html
View File

@ -13,8 +13,10 @@
<div class="import-section-preview"></div>
</div>
<div class="import-section">
<input type="radio" checked="checked" class="dialog-section-radio" name="import-type" value="single" />
<span class="dialog-section-radio-label">Import as single image</span>
<label class="dialog-section-radio-label">
<input class="dialog-section-radio" name="import-type" value="single" type="radio" checked="checked">
Import as single image
</label>
</div>
<div class="import-section import-subsection">
<span class="dialog-section-title">Resize to</span>
@ -26,8 +28,10 @@
<input type="checkbox" checked="checked" name="smooth-resize-checkbox" value="1"/>
</div>
<div class="import-section">
<input type="radio" class="dialog-section-radio" name="import-type" value="sheet"/>
<span class="dialog-section-radio-label">Import as spritesheet</span>
<label class="dialog-section-radio-label">
<input class="dialog-section-radio" name="import-type" value="sheet" type="radio">
Import as spritesheet
</label>
</div>
<div class="import-section import-subsection">
<span class="dialog-section-title">Frame size</span>