Merge branch 'develop' into takeSvgRend

Author: DD Liu

package-lock.json

@@ -45,12 +45,12 @@
     "keymirror": "0.1.1",
     "lodash.bindall": "4.4.0",
     "lodash.debounce": "4.0.8",
-    "lodash.defaultsdeep": "4.6.0",
+    "lodash.defaultsdeep": "4.6.1",
     "lodash.omit": "4.5.0",
     "lodash.throttle": "4.0.1",
     "minilog": "3.1.0",
     "omggif": "1.0.9",
-    "papaparse": "5.1.1",
+    "papaparse": "5.3.0",
     "postcss-import": "^12.0.0",
     "postcss-loader": "^3.0.0",
     "postcss-simple-vars": "^5.0.1",
@@ -59,7 +59,7 @@
     "raw-loader": "^0.5.1",
     "react": "16.2.0",
     "react-contextmenu": "2.9.4",
-    "react-dom": "16.2.0",
+    "react-dom": "16.2.1",
     "react-draggable": "3.0.5",
     "react-ga": "2.5.3",
     "react-intl": "2.9.0",
@@ -74,13 +74,13 @@
     "redux": "3.7.2",
     "redux-throttle": "0.1.1",
     "scratch-audio": "0.1.0-prerelease.20200528195344",
-    "scratch-blocks": "0.1.0-prerelease.20201007031713",
-    "scratch-l10n": "3.10.20201007030856",
-    "scratch-paint": "0.2.0-prerelease.20201008211625",
-    "scratch-render": "0.1.0-prerelease.20201008195134",
+    "scratch-blocks": "0.1.0-prerelease.20210107033838",
+    "scratch-l10n": "3.10.20210107031515",
     "scratch-storage": "1.3.3",
-    "scratch-svg-renderer": "0.2.0-prerelease.20201008203328",
-    "scratch-vm": "0.2.0-prerelease.20200924195620",
+    "scratch-vm": "0.2.0-prerelease.20201125065300",
+    "scratch-paint": "0.2.0-prerelease.20201020103914",
+    "scratch-render": "0.1.0-prerelease.20201113223804",
+    "scratch-svg-renderer": "0.2.0-prerelease.20201019174008",
     "startaudiocontext": "1.2.1",
     "style-loader": "^0.23.0",
     "text-encoding": "0.7.0",

package.json

@@ -217,9 +217,9 @@ class LibraryComponent extends React.Component {
                             extensionId={dataItem.extensionId}
                             featured={dataItem.featured}
                             hidden={dataItem.hidden}
-                            iconMd5={dataItem.md5}
+                            iconMd5={dataItem.costumes ? dataItem.costumes[0].md5ext : dataItem.md5ext}
                             iconRawURL={dataItem.rawURL}
-                            icons={dataItem.json && dataItem.json.costumes}
+                            icons={dataItem.costumes}
                             id={index}
                             insetIconURL={dataItem.insetIconURL}
                             internetConnectionRequired={dataItem.internetConnectionRequired}

src/components/library/library.jsx

@@ -120,7 +120,7 @@ const SpriteSelectorComponent = function (props) {
                         title: intl.formatMessage(messages.addSpriteFromFile),
                         img: fileUploadIcon,
                         onClick: onFileUploadClick,
-                        fileAccept: '.svg, .png, .jpg, .jpeg, .sprite2, .sprite3, .gif',
+                        fileAccept: '.svg, .png, .bmp, .jpg, .jpeg, .sprite2, .sprite3, .gif',
                         fileChange: onSpriteUpload,
                         fileInput: spriteFileInput,
                         fileMultiple: true

src/components/sprite-selector/sprite-selector.jsx

@@ -102,7 +102,7 @@ const StageSelector = props => {
                         title: intl.formatMessage(messages.addBackdropFromFile),
                         img: fileUploadIcon,
                         onClick: onBackdropFileUploadClick,
-                        fileAccept: '.svg, .png, .jpg, .jpeg, .gif',
+                        fileAccept: '.svg, .png, .bmp, .jpg, .jpeg, .gif',
                         fileChange: onBackdropFileUpload,
                         fileInput: fileInputRef,
                         fileMultiple: true

src/components/stage-selector/stage-selector.jsx

@@ -27,13 +27,13 @@ class BackdropLibrary extends React.Component {
     handleItemSelect (item) {
         const vmBackdrop = {
             name: item.name,
-            rotationCenterX: item.info[0] && item.info[0] / 2,
-            rotationCenterY: item.info[1] && item.info[1] / 2,
-            bitmapResolution: item.info.length > 2 ? item.info[2] : 1,
+            rotationCenterX: item.rotationCenterX,
+            rotationCenterY: item.rotationCenterY,
+            bitmapResolution: item.bitmapResolution,
             skinId: null
         };
         // Do not switch to stage, just add the backdrop
-        this.props.vm.addBackdrop(item.md5, vmBackdrop);
+        this.props.vm.addBackdrop(item.md5ext, vmBackdrop);
     }
     render () {
         return (

src/containers/backdrop-library.jsx

@@ -25,18 +25,14 @@ class CostumeLibrary extends React.PureComponent {
         ]);
     }
     handleItemSelected (item) {
-        const split = item.md5.split('.');
-        const type = split.length > 1 ? split[1] : null;
-        const rotationCenterX = type === 'svg' ? item.info[0] : item.info[0] / 2;
-        const rotationCenterY = type === 'svg' ? item.info[1] : item.info[1] / 2;
         const vmCostume = {
             name: item.name,
-            rotationCenterX,
-            rotationCenterY,
-            bitmapResolution: item.info.length > 2 ? item.info[2] : 1,
+            rotationCenterX: item.rotationCenterX,
+            rotationCenterY: item.rotationCenterY,
+            bitmapResolution: item.bitmapResolution,
             skinId: null
         };
-        this.props.vm.addCostumeFromLibrary(item.md5, vmCostume);
+        this.props.vm.addCostumeFromLibrary(item.md5ext, vmCostume);
     }
     render () {
         return (

src/containers/costume-library.jsx

@@ -179,16 +179,12 @@ class CostumeTab extends React.Component {
     }
     handleSurpriseCostume () {
         const item = costumeLibraryContent[Math.floor(Math.random() * costumeLibraryContent.length)];
-        const split = item.md5.split('.');
-        const type = split.length > 1 ? split[1] : null;
-        const rotationCenterX = type === 'svg' ? item.info[0] : item.info[0] / 2;
-        const rotationCenterY = type === 'svg' ? item.info[1] : item.info[1] / 2;
         const vmCostume = {
             name: item.name,
-            md5: item.md5,
-            rotationCenterX,
-            rotationCenterY,
-            bitmapResolution: item.info.length > 2 ? item.info[2] : 1,
+            md5: item.md5ext,
+            rotationCenterX: item.rotationCenterX,
+            rotationCenterY: item.rotationCenterY,
+            bitmapResolution: item.bitmapResolution,
             skinId: null
         };
         this.handleNewCostume(vmCostume, true /* fromCostumeLibrary */);
@@ -197,10 +193,10 @@ class CostumeTab extends React.Component {
         const item = backdropLibraryContent[Math.floor(Math.random() * backdropLibraryContent.length)];
         const vmCostume = {
             name: item.name,
-            md5: item.md5,
-            rotationCenterX: item.info[0] && item.info[0] / 2,
-            rotationCenterY: item.info[1] && item.info[1] / 2,
-            bitmapResolution: item.info.length > 2 ? item.info[2] : 1,
+            md5: item.md5ext,
+            rotationCenterX: item.rotationCenterX,
+            rotationCenterY: item.rotationCenterY,
+            bitmapResolution: item.bitmapResolution,
             skinId: null
         };
         this.handleNewCostume(vmCostume);
@@ -312,7 +308,7 @@ class CostumeTab extends React.Component {
                         title: intl.formatMessage(addFileMessage),
                         img: fileUploadIcon,
                         onClick: this.handleFileUploadClick,
-                        fileAccept: '.svg, .png, .jpg, .jpeg, .gif',
+                        fileAccept: '.svg, .png, .bmp, .jpg, .jpeg, .gif',
                         fileChange: this.handleCostumeUpload,
                         fileInput: this.setFileInput,
                         fileMultiple: true

src/containers/costume-tab.jsx

@@ -86,6 +86,10 @@ class SoundEditor extends React.Component {
             // Ignore keyboard shortcuts if a text input field is focused
             return;
         }
+        if (this.props.isFullScreen) {
+            // Ignore keyboard shortcuts if the stage is fullscreen mode
+            return;
+        }
         if (event.key === ' ') {
             event.preventDefault();
             if (this.state.playhead) {
@@ -465,6 +469,7 @@ class SoundEditor extends React.Component {
 }
 
 SoundEditor.propTypes = {
+    isFullScreen: PropTypes.bool,
     name: PropTypes.string.isRequired,
     sampleRate: PropTypes.number,
     samples: PropTypes.instanceOf(Float32Array),
@@ -483,6 +488,7 @@ const mapStateToProps = (state, {soundIndex}) => {
         soundId: sound.soundId,
         sampleRate: audioBuffer.sampleRate,
         samples: audioBuffer.getChannelData(0),
+        isFullScreen: state.scratchGui.mode.isFullScreen,
         name: sound.name,
         vm: state.scratchGui.vm
     };

src/containers/sound-editor.jsx

@@ -149,11 +149,11 @@ class SoundLibrary extends React.PureComponent {
         // @todo need to use this hack to avoid library using md5 for image
         const soundLibraryThumbnailData = soundLibraryContent.map(sound => {
             const {
-                md5,
+                md5ext,
                 ...otherData
             } = sound;
             return {
-                _md5: md5,
+                _md5: md5ext,
                 rawURL: this.props.isRtl ? soundIconRtl : soundIcon,
                 ...otherData
             };