wbrawner/piskel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add inline image option for PixiJS Movie export

Browse source
This commit is contained in:
Jordan Watkins 2018-10-17 22:12:01 -07:00 committed by Julian Descottes
parent 3804afbeb5
commit 5ebf83badf
2 changed files with 16 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/js/controller/settings/exportimage/PngExportController.js
View file

@ -33,6 +33,8 @@
var dataUriButton = document.querySelector('.datauri-open-button');
var selectedFrameDownloadButton = document.querySelector('.selected-frame-download-button');
this.pixiInlineImageCheckbox = document.querySelector('.png-pixi-inline-image-checkbox');
this.initLayoutSection_();
this.updateDimensionLabel_();
@ -169,7 +171,15 @@
var canvas = this.createPngSpritesheet_();
var name = this.piskelController.getPiskel().getDescriptor().name;
zip.file(name + '.png', pskl.utils.CanvasUtils.getBase64FromCanvas(canvas) + '\n', {base64: true});
var image;
if (this.pixiInlineImageCheckbox.checked) {
image = canvas.toDataURL('image/png');
} else {
image = name + '.png';
zip.file(image, pskl.utils.CanvasUtils.getBase64FromCanvas(canvas) + '\n', {base64: true});
}
var width = canvas.width / this.getColumns_();
var height = canvas.height / this.getRows_();
@ -194,7 +204,7 @@
'meta': {
'app': 'https://github.com/piskelapp/piskel/',
'version': '1.0',
'image': name + '.png',
'image': image,
'format': 'RGBA8888',
'size': {'w': canvas.width,'h': canvas.height}
}

4
src/templates/settings/export/png.html
View file

@ -37,6 +37,10 @@
<div style="padding-bottom: 5px">
<span class="highlight export-panel-row">PixiJS Movie export: </span>
</div>
<div class="checkbox-container" style="margin: 5px 0;">
<input id="png-pixi-inline-image" class="png-pixi-inline-image-checkbox checkbox-fix" type="checkbox" />
<label for="png-pixi-inline-image">Inline spritesheet as data-uri</label>
</div>
<div class="export-panel-row">
<button type="button" class="button button-primary png-pixi-download-button"/>Download</button>
<span class="export-info">Spritesheet with JSON metadata</span>