Merge branch 'develop' into int-touching-bounds

Author: adroitwhiz

package.json

@@ -37,7 +37,7 @@
     "gh-pages": "^1.0.0",
     "jsdoc": "^3.5.5",
     "json": "^9.0.4",
-    "scratch-vm": "0.2.0-prerelease.20190207224121",
+    "scratch-vm": "0.2.0-prerelease.20190213162739",
     "tap": "^11.0.0",
     "travis-after-all": "^1.4.4",
     "uglifyjs-webpack-plugin": "^1.2.5",
@@ -53,7 +53,7 @@
     "minilog": "3.1.0",
     "raw-loader": "^0.5.1",
     "scratch-storage": "^1.0.0",
-    "scratch-svg-renderer": "0.2.0-prerelease.20190523193400",
+    "scratch-svg-renderer": "0.2.0-prerelease.20191104164753",
     "twgl.js": "4.4.0"
   }
 }

src/BitmapSkin.js

@@ -23,12 +23,6 @@ class BitmapSkin extends Skin {
 
         /** @type {Array<int>} */
         this._textureSize = [0, 0];
-
-        /**
-         * The "native" size, in texels, of this skin.
-         * @type {Array<number>}
-         */
-        this.size = [0, 0];
     }
 
     /**
@@ -49,13 +43,20 @@ class BitmapSkin extends Skin {
         return true;
     }
 
+    /**
+     * @return {Array<number>} the "native" size, in texels, of this skin.
+     */
+    get size () {
+        return [this._textureSize[0] / this._costumeResolution, this._textureSize[1] / this._costumeResolution];
+    }
+
     /**
      * @param {Array<number>} scale - The scaling factors to be used.
      * @return {WebGLTexture} The GL texture representation of this skin when drawing at the given scale.
      */
     // eslint-disable-next-line no-unused-vars
     getTexture (scale) {
-        return this._texture;
+        return this._texture || super.getTexture();
     }
 
     /**
@@ -77,6 +78,10 @@ class BitmapSkin extends Skin {
      * @fires Skin.event:WasAltered
      */
     setBitmap (bitmapData, costumeResolution, rotationCenter) {
+        if (!bitmapData.width || !bitmapData.height) {
+            super.setEmptyImageData();
+            return;
+        }
         const gl = this._renderer.gl;
 
         // Preferably bitmapData is ImageData. ImageData speeds up updating
@@ -109,7 +114,6 @@ class BitmapSkin extends Skin {
         // Do these last in case any of the above throws an exception
         this._costumeResolution = costumeResolution || 2;
         this._textureSize = BitmapSkin._getBitmapSize(bitmapData);
-        this.size = [this._textureSize[0] / this._costumeResolution, this._textureSize[1] / this._costumeResolution];
 
         if (typeof rotationCenter === 'undefined') rotationCenter = this.calculateRotationCenter();
         this.setRotationCenter.apply(this, rotationCenter);

src/Drawable.js

@@ -3,6 +3,7 @@ const twgl = require('twgl.js');
 const Rectangle = require('./Rectangle');
 const RenderConstants = require('./RenderConstants');
 const ShaderManager = require('./ShaderManager');
+const Skin = require('./Skin');
 const EffectTransform = require('./EffectTransform');
 
 /**
@@ -103,6 +104,8 @@ class Drawable {
         /** @todo move convex hull functionality, maybe bounds functionality overall, to Skin classes */
         this._convexHullPoints = null;
         this._convexHullDirty = true;
+
+        this._skinWasAltered = this._skinWasAltered.bind(this);
     }
 
     /**
@@ -141,7 +144,13 @@ class Drawable {
      */
     set skin (newSkin) {
         if (this._skin !== newSkin) {
+            if (this._skin) {
+                this._skin.removeListener(Skin.Events.WasAltered, this._skinWasAltered);
+            }
             this._skin = newSkin;
+            if (this._skin) {
+                this._skin.addListener(Skin.Events.WasAltered, this._skinWasAltered);
+            }
             this._skinWasAltered();
         }
     }
@@ -178,55 +187,98 @@ class Drawable {
     }
 
     /**
-     * Update the position, direction, scale, or effect properties of this Drawable.
-     * @param {object.<string,*>} properties The new property values to set.
+     * Update the position if it is different. Marks the transform as dirty.
+     * @param {Array.<number>} position A new position.
      */
-    updateProperties (properties) {
-        let dirty = false;
-        if ('position' in properties && (
-            this._position[0] !== properties.position[0] ||
-            this._position[1] !== properties.position[1])) {
-            this._position[0] = Math.round(properties.position[0]);
-            this._position[1] = Math.round(properties.position[1]);
-            dirty = true;
-        }
-        if ('direction' in properties && this._direction !== properties.direction) {
-            this._direction = properties.direction;
+    updatePosition (position) {
+        if (this._position[0] !== position[0] ||
+            this._position[1] !== position[1]) {
+            this._position[0] = Math.round(position[0]);
+            this._position[1] = Math.round(position[1]);
+            this.setTransformDirty();
+        }
+    }
+
+    /**
+     * Update the direction if it is different. Marks the transform as dirty.
+     * @param {number} direction A new direction.
+     */
+    updateDirection (direction) {
+        if (this._direction !== direction) {
+            this._direction = direction;
             this._rotationTransformDirty = true;
-            dirty = true;
+            this.setTransformDirty();
         }
-        if ('scale' in properties && (
-            this._scale[0] !== properties.scale[0] ||
-            this._scale[1] !== properties.scale[1])) {
-            this._scale[0] = properties.scale[0];
-            this._scale[1] = properties.scale[1];
+    }
+
+    /**
+     * Update the scale if it is different. Marks the transform as dirty.
+     * @param {Array.<number>} scale A new scale.
+     */
+    updateScale (scale) {
+        if (this._scale[0] !== scale[0] ||
+            this._scale[1] !== scale[1]) {
+            this._scale[0] = scale[0];
+            this._scale[1] = scale[1];
             this._rotationCenterDirty = true;
             this._skinScaleDirty = true;
-            dirty = true;
+            this.setTransformDirty();
         }
-        if ('visible' in properties) {
-            this._visible = properties.visible;
+    }
+
+    /**
+     * Update visibility if it is different. Marks the convex hull as dirty.
+     * @param {boolean} visible A new visibility state.
+     */
+    updateVisible (visible) {
+        if (this._visible !== visible) {
+            this._visible = visible;
             this.setConvexHullDirty();
         }
-        if (dirty) {
-            this.setTransformDirty();
+    }
+
+    /**
+     * Update an effect. Marks the convex hull as dirty if the effect changes shape.
+     * @param {string} effectName The name of the effect.
+     * @param {number} rawValue A new effect value.
+     */
+    updateEffect (effectName, rawValue) {
+        const effectInfo = ShaderManager.EFFECT_INFO[effectName];
+        if (rawValue) {
+            this._effectBits |= effectInfo.mask;
+        } else {
+            this._effectBits &= ~effectInfo.mask;
+        }
+        const converter = effectInfo.converter;
+        this._uniforms[effectInfo.uniformName] = converter(rawValue);
+        if (effectInfo.shapeChanges) {
+            this.setConvexHullDirty();
+        }
+    }
+
+    /**
+     * Update the position, direction, scale, or effect properties of this Drawable.
+     * @deprecated Use specific update* methods instead.
+     * @param {object.<string,*>} properties The new property values to set.
+     */
+    updateProperties (properties) {
+        if ('position' in properties) {
+            this.updatePosition(properties.position);
+        }
+        if ('direction' in properties) {
+            this.updateDirection(properties.direction);
+        }
+        if ('scale' in properties) {
+            this.updateScale(properties.scale);
+        }
+        if ('visible' in properties) {
+            this.updateVisible(properties.visible);
         }
         const numEffects = ShaderManager.EFFECTS.length;
         for (let index = 0; index < numEffects; ++index) {
             const effectName = ShaderManager.EFFECTS[index];
             if (effectName in properties) {
-                const rawValue = properties[effectName];
-                const effectInfo = ShaderManager.EFFECT_INFO[effectName];
-                if (rawValue) {
-                    this._effectBits |= effectInfo.mask;
-                } else {
-                    this._effectBits &= ~effectInfo.mask;
-                }
-                const converter = effectInfo.converter;
-                this._uniforms[effectInfo.uniformName] = converter(rawValue);
-                if (effectInfo.shapeChanges) {
-                    this.setConvexHullDirty();
-                }
+                this.updateEffect(effectName, properties[effectName]);
             }
         }
     }
@@ -412,29 +464,43 @@ class Drawable {
 
         const localPosition = getLocalPosition(this, vec);
 
-        if (this.useNearest) {
+        // We're not passing in a scale to useNearest, but that's okay because "touching" queries
+        // happen at the "native" size anyway.
+        if (this.useNearest()) {
             return this.skin.isTouchingNearest(localPosition);
         }
         return this.skin.isTouchingLinear(localPosition);
     }
 
     /**
      * Should the drawable use NEAREST NEIGHBOR or LINEAR INTERPOLATION mode
+     * @param {?Array<Number>} scale Optionally, the screen-space scale of the drawable.
+     * @return {boolean} True if the drawable should use nearest-neighbor interpolation.
      */
-    get useNearest () {
+    useNearest (scale = this.scale) {
         // Raster skins (bitmaps) should always prefer nearest neighbor
         if (this.skin.isRaster) {
             return true;
         }
 
+        // If the effect bits for mosaic, pixelate, whirl, or fisheye are set, use linear
+        if ((this._effectBits & (
+            ShaderManager.EFFECT_INFO.fisheye.mask |
+            ShaderManager.EFFECT_INFO.whirl.mask |
+            ShaderManager.EFFECT_INFO.pixelate.mask |
+            ShaderManager.EFFECT_INFO.mosaic.mask
+        )) !== 0) {
+            return false;
+        }
+
         // We can't use nearest neighbor unless we are a multiple of 90 rotation
         if (this._direction % 90 !== 0) {
             return false;
         }
 
         // If the scale of the skin is very close to 100 (0.99999 variance is okay I guess)
-        if (Math.abs(this.scale[0]) > 99 && Math.abs(this.scale[0]) < 101 &&
-            Math.abs(this.scale[1]) > 99 && Math.abs(this.scale[1]) < 101) {
+        if (Math.abs(scale[0]) > 99 && Math.abs(scale[0]) < 101 &&
+            Math.abs(scale[1]) > 99 && Math.abs(scale[1]) < 101) {
             return true;
         }
         return false;
@@ -514,7 +580,6 @@ class Drawable {
      * @return {!Rectangle} Bounds for the Drawable.
      */
     getFastBounds (result) {
-        this.updateMatrix();
         if (!this.needsConvexHullPoints()) {
             return this.getBounds(result);
         }
@@ -626,9 +691,11 @@ class Drawable {
             return dst;
         }
         const textColor =
-        drawable.useNearest ?
-            drawable.skin._silhouette.colorAtNearest(localPosition, dst) :
-            drawable.skin._silhouette.colorAtLinear(localPosition, dst);
+        // commenting out to only use nearest for now
+        // drawable.useNearest() ?
+             drawable.skin._silhouette.colorAtNearest(localPosition, dst);
+        // : drawable.skin._silhouette.colorAtLinear(localPosition, dst);
+
         return EffectTransform.transformColor(drawable, textColor, textColor);
     }
 }