Fix playground, plus misc. cleanup

The playground was trying to build with a now-missing entry point.
Also, I fixed some JSDoc comments, added HTML labels, etc. until IDEA
had no meaningful complaints about `playground/index.html`.

src/RenderWebGL.js

@@ -201,8 +201,8 @@ class RenderWebGL extends EventEmitter {
      * Create a new bitmap skin from a snapshot of the provided bitmap data.
      * @param {ImageData|HTMLImageElement|HTMLCanvasElement|HTMLVideoElement} bitmapData - new contents for this skin.
      * @param {!int} [costumeResolution=1] - The resolution to use for this bitmap.
-     * @param {?Array<number>} rotationCenter Optional: rotation center of the skin. If not supplied, the center of the
-     * skin will be used
+     * @param {?Array<number>} [rotationCenter] Optional: rotation center of the skin. If not supplied, the center of
+     * the skin will be used.
      * @returns {!int} the ID for the new skin.
      */
     createBitmapSkin (bitmapData, costumeResolution, rotationCenter) {
@@ -602,9 +602,9 @@ class RenderWebGL extends EventEmitter {
      * pick drawables that are not visible or have ghost set all the way up.
      * @param {int} centerX The client x coordinate of the picking location.
      * @param {int} centerY The client y coordinate of the picking location.
-     * @param {int} touchWidth The client width of the touch event (optional).
-     * @param {int} touchHeight The client height of the touch event (optional).
-     * @param {Array<int>} candidateIDs The Drawable IDs to pick from, otherwise all.
+     * @param {int} [touchWidth] The client width of the touch event (optional).
+     * @param {int} [touchHeight] The client height of the touch event (optional).
+     * @param {Array<int>} [candidateIDs] The Drawable IDs to pick from, otherwise all.
      * @returns {int} The ID of the topmost Drawable under the picking location, or
      * RenderConstants.ID_NONE if there is no Drawable at that location.
      */

src/playground/.eslintrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+    root: true,
+    extends: ['scratch'],
+    env: {
+        browser: true
+    }
+};

src/playground/index.html

@@ -11,6 +11,7 @@
 <canvas id="scratch-stage" width="10" height="10" style="border:3px dashed black"></canvas>
 <canvas id="debug-canvas" width="10" height="10" style="border:3px dashed red"></canvas>
 <p>
+    <label for="fudgeproperty">Property to tweak:</label>
     <select id="fudgeproperty" onchange="onFudgePropertyChanged(this.value)">
         <option value="posx">Position X</option>
         <option value="posy">Position Y</option>
@@ -25,17 +26,18 @@
         <option value="brightness">Brightness</option>
         <option value="ghost">Ghost</option>
     </select>
+    <label for="fudge">Property Value:</label>
     <input type="range" id="fudge" style="width:50%" value="90" min="-90" max="270" step="any" oninput="onFudgeChanged(this.value)" onchange="onFudgeChanged(this.value)">
 </p>
 <p>
-    Min: <input id="fudgeMin" type="number" onchange="onFudgeMinChanged(this.value)">
-    Max: <input id="fudgeMax" type="number" onchange="onFudgeMaxChanged(this.value)">
+    <label for="fudgeMin">Min:</label><input id="fudgeMin" type="number" onchange="onFudgeMinChanged(this.value)">
+    <label for="fudgeMax">Max:</label><input id="fudgeMax" type="number" onchange="onFudgeMaxChanged(this.value)">
 </p>
 <script src="scratch-render.js"></script>
 <script>
     var canvas = document.getElementById('scratch-stage');
     var fudge = 90;
-    var renderer = new RenderWebGL(canvas);
+    var renderer = new ScratchRender(canvas);
 
     var drawableID = renderer.createDrawable();
     renderer.updateDrawableProperties(drawableID, {
@@ -55,7 +57,6 @@
     image.src = 'https://cdn.assets.scratch.mit.edu/internalapi/asset/' +
         '09dc888b0b7df19f70d81588ae73420e.svg/get/';
 
-    var fudgeSelect = document.getElementById('fudgeproperty');
     var posX = 0;
     var posY = 0;
     var scaleX = 100;
@@ -148,7 +149,8 @@
     }
     drawStep();
 
-    renderer.setDebugCanvas(document.getElementById('debug-canvas'));
+    var debugCanvas = /** @type {canvas} */ document.getElementById('debug-canvas');
+    renderer.setDebugCanvas(debugCanvas);
 </script>
 </body>
 </html>

webpack.config.js

@@ -40,10 +40,11 @@ module.exports = [
     Object.assign({}, base, {
         target: 'web',
         entry: {
-            'scratch-render': './src/index-web.js'
+            'scratch-render': './src/index.js'
         },
         output: {
             library: 'ScratchRender',
+            libraryTarget: 'umd',
             path: path.resolve('playground'),
             filename: '[name].js'
         },