Merged/scratch gui

package.json

@@ -56,7 +56,7 @@
     "eslint": "^5.0.1",
     "eslint-config-scratch": "^5.0.0",
     "eslint-plugin-import": "^2.8.0",
-    "eslint-plugin-react": "^7.5.1",
+    "eslint-plugin-react": "7.11.1",
     "eslint-watch": "^4.0.2",
     "file-loader": "2.0.0",
     "get-float-time-domain-data": "0.1.0",
@@ -111,10 +111,10 @@
     "scratch-blocks": "0.1.0-prerelease.1545162154",
     "scratch-l10n": "3.1.20181220222259",
     "scratch-paint": "0.2.0-prerelease.20181220194927",
-    "scratch-render": "0.1.0-prerelease.20181220195236",
-    "scratch-storage": "1.2.1",
+    "scratch-render": "0.1.0-prerelease.20181226153401",
+    "scratch-storage": "1.2.2",
     "scratch-svg-renderer": "0.2.0-prerelease.20181220183040",
-    "scratch-vm": "0.2.0-prerelease.20181221030743",
+    "scratch-vm": "0.2.0-prerelease.20190102175344",
     "selenium-webdriver": "3.6.0",
     "startaudiocontext": "1.2.1",
     "style-loader": "^0.23.0",

src/components/gui/gui.jsx

@@ -145,6 +145,7 @@ const GUIComponent = props => {
             <StageWrapper
                 isRendererSupported={isRendererSupported}
                 isRtl={isRtl}
+                loading={loading}
                 stageSize={STAGE_SIZE_MODES.large}
                 vm={vm}
             >

src/components/loader/loader.css

@@ -2,7 +2,7 @@
 @import "../../css/z-index.css";
 
 .background {
-    position: fixed;
+    position: absolute;
     top: 0;
     left: 0;
     width: 100%;

src/components/stage-wrapper/stage-wrapper.jsx

@@ -6,13 +6,15 @@ import Box from '../box/box.jsx';
 import {STAGE_DISPLAY_SIZES} from '../../lib/layout-constants.js';
 import StageHeader from '../../containers/stage-header.jsx';
 import Stage from '../../containers/stage.jsx';
+import Loader from '../loader/loader.jsx';
 
 import styles from './stage-wrapper.css';
 
 const StageWrapperComponent = function (props) {
     const {
         isRtl,
         isRendererSupported,
+        loading,
         stageSize,
         vm
     } = props;
@@ -38,13 +40,17 @@ const StageWrapperComponent = function (props) {
                         null
                 }
             </Box>
+            {loading ? (
+                <Loader />
+            ) : null}
         </Box>
     );
 };
 
 StageWrapperComponent.propTypes = {
     isRendererSupported: PropTypes.bool.isRequired,
     isRtl: PropTypes.bool,
+    loading: PropTypes.bool,
     stageSize: PropTypes.oneOf(Object.keys(STAGE_DISPLAY_SIZES)).isRequired,
     vm: PropTypes.instanceOf(VM).isRequired
 };

src/components/webgl-modal/webgl-modal.jsx

@@ -38,7 +38,7 @@ const WebGlModal = ({intl, ...props}) => (
                             webGlLink: (
                                 <a
                                     className={styles.faqLink}
-                                    href="https://en.wikipedia.org/wiki/WebGL#Support"
+                                    href="https://get.webgl.org/"
                                 >
                                     <FormattedMessage
                                         defaultMessage="does not support WebGL"

src/containers/sb-file-uploader.jsx

@@ -80,8 +80,9 @@ class SBFileUploader extends React.Component {
     }
     getProjectTitleFromFilename (fileInputFilename) {
         if (!fileInputFilename) return '';
-        // only parse title from files like "filename.sb2" or "filename.sb3"
-        const matches = fileInputFilename.match(/^(.*)\.sb[23]$/);
+        // only parse title with valid scratch project extensions
+        // (.sb, .sb2, and .sb3)
+        const matches = fileInputFilename.match(/^(.*)\.sb[23]?$/);
         if (!matches) return '';
         return matches[1].substring(0, 100); // truncate project title to max 100 chars
     }

src/lib/blocks.js

@@ -260,8 +260,12 @@ export default function (vm) {
                     return stageOptions.concat(stageVariableMenuItems);
                 }
                 // Get all the local variables (no lists) and add them to the menu.
-                const spriteVariableOptions =
-                    vm.runtime.getSpriteTargetByName(selectedItem).getAllVariableNamesInScopeByType('', true);
+                const target = vm.runtime.getSpriteTargetByName(selectedItem);
+                let spriteVariableOptions = [];
+                // The target should exist, but there are ways for it not to (e.g. #4203).
+                if (target) {
+                    spriteVariableOptions = target.getAllVariableNamesInScopeByType('', true);
+                }
                 const spriteVariableMenuItems = spriteVariableOptions.map(variable => [variable, variable]);
                 return spriteOptions.concat(spriteVariableMenuItems);
             }

src/lib/vm-manager-hoc.jsx

@@ -53,9 +53,6 @@ const vmManagerHOC = function (WrappedComponent) {
         loadProject () {
             return this.props.vm.loadProject(this.props.projectData)
                 .then(() => {
-                    // Mark all the assets as clean since they just got loaded
-                    this.props.vm.assets.forEach(asset => (asset.clean = true));
-
                     this.props.onLoadedProject(this.props.loadingState, this.props.canSave);
                     // Wrap in a setTimeout because skin loading in
                     // the renderer can be async.

test/unit/containers/sb-file-uploader.test.jsx

@@ -65,14 +65,14 @@ describe('SBFileUploader Container', () => {
         expect(projectName).toBe('my project is great');
     });
 
-    test('sets blank title with .sb filename', () => {
+    test('correctly sets title with .sb filename', () => {
         const wrapper = shallowWithIntl(getContainer(), {context: {store}});
         const instance = wrapper
             .dive() // unwrap redux Connect(InjectIntl(SBFileUploader))
             .dive() // unwrap InjectIntl(SBFileUploader)
             .instance(); // SBFileUploader
         const projectName = instance.getProjectTitleFromFilename('my project is great.sb');
-        expect(projectName).toBe('');
+        expect(projectName).toBe('my project is great');
     });
 
     test('sets blank title with filename with no extension', () => {