Use costume loading from importer in public costume and backdrop loader

This commit is contained in:
Paul Kaplan 2017-03-27 15:04:44 -04:00
parent c8b4871b19
commit df44134e1c
3 changed files with 98 additions and 77 deletions

View file

@ -0,0 +1,69 @@
var AssetType = require('scratch-storage').AssetType;
/**
* Load a costume's asset into memory asynchronously.
* Do not call this unless there is a renderer attached.
* @param {string} md5ext - the MD5 and extension of the costume to be loaded.
* @param {!object} costume - the Scratch costume object.
* @property {int} skinId - the ID of the costume's render skin, once installed.
* @property {number} rotationCenterX - the X component of the costume's origin.
* @property {number} rotationCenterY - the Y component of the costume's origin.
* @property {number} [bitmapResolution] - the resolution scale for a bitmap costume.
* @param {!Runtime} runtime - Scratch runtime, used to access the storage module.
* @returns {?Promise} - a promise which will resolve after skinId is set, or null on error.
*/
var loadCostume = function (md5ext, costume, runtime) {
if (!runtime.storage) {
log.error('No storage module present; cannot load costume asset: ', md5ext);
return null;
}
if (!runtime.renderer) {
log.error('No rendering module present; cannot load costume asset: ', md5ext);
return null;
}
var idParts = md5ext.split('.');
var md5 = idParts[0];
var ext = idParts[1].toUpperCase();
var assetType = (ext === 'SVG') ? AssetType.ImageVector : AssetType.ImageBitmap;
var rotationCenter = [
costume.rotationCenterX / costume.bitmapResolution,
costume.rotationCenterY / costume.bitmapResolution
];
var promise = runtime.storage.load(assetType, md5);
if (assetType === AssetType.ImageVector) {
promise = promise.then(function (costumeAsset) {
costume.skinId = runtime.renderer.createSVGSkin(costumeAsset.decodeText(), rotationCenter);
});
} else {
promise = promise.then(function (costumeAsset) {
return new Promise(function (resolve, reject) {
var imageElement = new Image();
var removeEventListeners; // fix no-use-before-define
var onError = function () {
removeEventListeners();
reject();
};
var onLoad = function () {
removeEventListeners();
resolve(imageElement);
};
removeEventListeners = function () {
imageElement.removeEventListener('error', onError);
imageElement.removeEventListener('load', onLoad);
};
imageElement.addEventListener('error', onError);
imageElement.addEventListener('load', onLoad);
imageElement.src = costumeAsset.encodeDataURI();
});
}).then(function (imageElement) {
costume.skinId = runtime.renderer.createBitmapSkin(imageElement, costume.bitmapResolution, rotationCenter);
});
}
return promise;
};
module.exports = loadCostume;

View file

@ -18,6 +18,8 @@ var specMap = require('./sb2specmap');
var Variable = require('../engine/variable');
var List = require('../engine/list');
var loadCostume = require('./load-costume.js');
/**
* Parse a single "Scratch object" and create all its in-memory VM objects.
* @param {!object} object From-JSON "Scratch object:" sprite, stage, watcher.
@ -148,72 +150,6 @@ var parseScratchObject = function (object, runtime, topLevel) {
return target;
};
/**
* Load a costume's asset into memory asynchronously.
* Do not call this unless there is a renderer attached.
* @param {string} md5ext - the MD5 and extension of the costume to be loaded.
* @param {!object} costume - the Scratch costume object.
* @property {int} skinId - the ID of the costume's render skin, once installed.
* @property {number} rotationCenterX - the X component of the costume's origin.
* @property {number} rotationCenterY - the Y component of the costume's origin.
* @property {number} [bitmapResolution] - the resolution scale for a bitmap costume.
* @param {!Runtime} runtime - Scratch runtime, used to access the storage module.
* @returns {?Promise} - a promise which will resolve after skinId is set, or null on error.
*/
var loadCostume = function (md5ext, costume, runtime) {
if (!runtime.storage) {
log.error('No storage module present; cannot load costume asset: ', md5ext);
return null;
}
if (!runtime.renderer) {
log.error('No rendering module present; cannot load costume asset: ', md5ext);
return null;
}
var idParts = md5ext.split('.');
var md5 = idParts[0];
var ext = idParts[1].toUpperCase();
var assetType = (ext === 'SVG') ? AssetType.ImageVector : AssetType.ImageBitmap;
var rotationCenter = [
costume.rotationCenterX / costume.bitmapResolution,
costume.rotationCenterY / costume.bitmapResolution
];
var promise = runtime.storage.load(assetType, md5);
if (assetType === AssetType.ImageVector) {
promise = promise.then(function (costumeAsset) {
costume.skinId = runtime.renderer.createSVGSkin(costumeAsset.decodeText(), rotationCenter);
});
} else {
promise = promise.then(function (costumeAsset) {
return new Promise(function (resolve, reject) {
var imageElement = new Image();
var removeEventListeners; // fix no-use-before-define
var onError = function () {
removeEventListeners();
reject();
};
var onLoad = function () {
removeEventListeners();
resolve(imageElement);
};
removeEventListeners = function () {
imageElement.removeEventListener('error', onError);
imageElement.removeEventListener('load', onLoad);
};
imageElement.addEventListener('error', onError);
imageElement.addEventListener('load', onLoad);
imageElement.src = costumeAsset.encodeDataURI();
});
}).then(function (imageElement) {
costume.skinId = runtime.renderer.createBitmapSkin(imageElement, costume.bitmapResolution, rotationCenter);
});
}
return promise;
};
/**
* Load a sound's asset into memory asynchronously.
* @param {!object} sound - the Scratch sound object.

View file

@ -7,6 +7,8 @@ var ScratchStorage = require('scratch-storage');
var sb2import = require('./import/sb2import');
var StringUtil = require('./util/string-util');
var loadCostume = require('./import/load-costume.js');
var RESERVED_NAMES = ['_mouse_', '_stage_', '_edge_', '_myself_', '_random_'];
var AssetType = ScratchStorage.AssetType;
@ -191,25 +193,39 @@ VirtualMachine.prototype.addSprite2 = function (json) {
/**
* Add a costume to the current editing target.
* @param {string} md5ext - the MD5 and extension of the costume to be loaded.
* @param {!object} costumeObject Object representing the costume.
* @property {int} skinId - the ID of the costume's render skin, once installed.
* @property {number} rotationCenterX - the X component of the costume's origin.
* @property {number} rotationCenterY - the Y component of the costume's origin.
* @property {number} [bitmapResolution] - the resolution scale for a bitmap costume.
*/
VirtualMachine.prototype.addCostume = function (costumeObject) {
this.editingTarget.sprite.costumes.push(costumeObject);
// Switch to the costume.
this.editingTarget.setCostume(
this.editingTarget.sprite.costumes.length - 1
);
VirtualMachine.prototype.addCostume = function (md5ext, costumeObject) {
loadCostume(md5ext, costumeObject, this.runtime).then(function () {
this.editingTarget.sprite.costumes.push(costumeObject);
this.editingTarget.setCostume(
this.editingTarget.sprite.costumes.length - 1
);
this.emitTargetsUpdate();
}.bind(this));
};
/**
* Add a backdrop to the stage.
* @param {string} md5ext - the MD5 and extension of the backdrop to be loaded.
* @param {!object} backdropObject Object representing the backdrop.
* @property {int} skinId - the ID of the backdrop's render skin, once installed.
* @property {number} rotationCenterX - the X component of the backdrop's origin.
* @property {number} rotationCenterY - the Y component of the backdrop's origin.
* @property {number} [bitmapResolution] - the resolution scale for a bitmap backdrop.
*/
VirtualMachine.prototype.addBackdrop = function (backdropObject) {
var stage = this.runtime.getTargetForStage();
stage.sprite.costumes.push(backdropObject);
// Switch to the backdrop.
stage.setCostume(stage.sprite.costumes.length - 1);
VirtualMachine.prototype.addBackdrop = function (md5ext, backdropObject) {
loadCostume(md5ext, backdropObject, this.runtime).then(function () {
var stage = this.runtime.getTargetForStage();
stage.sprite.costumes.push(backdropObject);
stage.setCostume(stage.sprite.costumes.length - 1);
this.emitTargetsUpdate();
}.bind(this));
};
/**