Added new checkbox to zip export html template and use layer name as prefix to file names (in ZipExportController) if checkbox is selected.

This commit is contained in:
Alex 2018-03-01 20:08:31 -05:00 committed by Julian Descottes
parent 779761628e
commit dae08107e2
2 changed files with 18 additions and 2 deletions

View File

@ -12,12 +12,21 @@
this.pngFilePrefixInput = document.querySelector('.zip-prefix-name');
this.pngFilePrefixInput.value = 'sprite_';
this.splitByLayersCheckbox = document.querySelector('.zip-split-layers-checkbox');
this.splitByLayersCheckbox = document.querySelector('.zip-split-layers-checkbox');
this.addEventListener(this.splitByLayersCheckbox, 'change', this.onSplitLayersClick_);
this.useLayerNamesCheckboxContainer = document.querySelector('.use-layer-names-checkbox-container');
this.useLayerNamesCheckbox = document.querySelector('.zip-use-layer-names-checkbox');
this.useLayerNamesCheckboxContainer.hidden = !this.splitByLayersCheckbox.checked;
var zipButton = document.querySelector('.zip-generate-button');
this.addEventListener(zipButton, 'click', this.onZipButtonClick_);
};
ns.ZipExportController.prototype.onSplitLayersClick_ = function () {
this.useLayerNamesCheckboxContainer.hidden = !this.splitByLayersCheckbox.checked;
};
ns.ZipExportController.prototype.onZipButtonClick_ = function () {
var zip = new window.JSZip();
@ -63,6 +72,9 @@
var basename = this.pngFilePrefixInput.value;
var frameid = pskl.utils.StringUtils.leftPad(i + 1, framePaddingLength, '0');
var filename = 'l' + layerid + '_' + basename + frameid + '.png';
if (this.useLayerNamesCheckbox.checked) {
filename = layer.getName() + '_' + basename + frameid + '.png';
}
zip.file(filename, pskl.utils.CanvasUtils.getBase64FromCanvas(canvas) + '\n', {base64: true});
}
}

View File

@ -11,7 +11,11 @@
<input id="zip-split-layers" class="zip-split-layers-checkbox checkbox-fix" type="checkbox" />
<label for="zip-split-layers">Split by layers</label>
</div>
<div class="use-layer-names-checkbox-container" style="margin: 5px 0;">
<input id="zip-use-layer-names" class="zip-use-layer-names-checkbox checkbox-fix" type="checkbox" />
<label for="zip-use-layer-names">Index by layer names</label>
</div>
<button type="button" class="button button-primary zip-generate-button"/>Download ZIP</button>
</div>
</div>
</script>
</script>