diff --git a/package.json b/package.json
index f5a4df320..f123f173a 100644
--- a/package.json
+++ b/package.json
@@ -40,7 +40,7 @@
"babel-preset-react": "^6.22.0",
"bowser": "1.9.3",
"chromedriver": "2.40.0",
- "classnames": "2.2.5",
+ "classnames": "2.2.6",
"copy-webpack-plugin": "^4.5.1",
"css-loader": "^0.28.11",
"enzyme": "^3.1.0",
@@ -92,9 +92,9 @@
"redux-throttle": "0.1.1",
"rimraf": "^2.6.1",
"scratch-audio": "0.1.0-prerelease.1528210666",
- "scratch-blocks": "0.1.0-prerelease.1528400332",
+ "scratch-blocks": "0.1.0-prerelease.1528492670",
"scratch-l10n": "3.0.20180604162003",
- "scratch-paint": "0.2.0-prerelease.20180607153112",
+ "scratch-paint": "0.2.0-prerelease.20180607215543",
"scratch-render": "0.1.0-prerelease.20180605145739",
"scratch-storage": "0.5.0",
"scratch-vm": "0.1.0-prerelease.1528399883",
diff --git a/src/components/action-menu/action-menu.jsx b/src/components/action-menu/action-menu.jsx
index 69d154fcc..2725c502b 100644
--- a/src/components/action-menu/action-menu.jsx
+++ b/src/components/action-menu/action-menu.jsx
@@ -76,8 +76,8 @@ class ActionMenu extends React.Component {
// (possibly slow) action is started.
return event => {
ReactTooltip.hide();
+ if (fn) fn(event);
this.setState({forceHide: true, isOpen: false}, () => {
- if (fn) fn(event);
setTimeout(() => this.setState({forceHide: false}));
});
};
diff --git a/src/components/gui/gui.css b/src/components/gui/gui.css
index 2e4e7b846..b88b5c43e 100644
--- a/src/components/gui/gui.css
+++ b/src/components/gui/gui.css
@@ -176,6 +176,8 @@
padding-left: $space;
padding-right: $space;
+ min-height: 0; /* this makes it work in Firefox */
+
/*
For making the sprite-selector a scrollable pane
@todo: Not working in Safari
diff --git a/src/components/gui/gui.jsx b/src/components/gui/gui.jsx
index 66a08f64f..80535e83e 100644
--- a/src/components/gui/gui.jsx
+++ b/src/components/gui/gui.jsx
@@ -15,6 +15,8 @@ import StageWrapper from '../../containers/stage-wrapper.jsx';
import Loader from '../loader/loader.jsx';
import Box from '../box/box.jsx';
import MenuBar from '../menu-bar/menu-bar.jsx';
+import CostumeLibrary from '../../containers/costume-library.jsx';
+import BackdropLibrary from '../../containers/backdrop-library.jsx';
import Backpack from '../../containers/backpack.jsx';
import PreviewModal from '../../containers/preview-modal.jsx';
@@ -46,10 +48,12 @@ const GUIComponent = props => {
const {
activeTabIndex,
basePath,
+ backdropLibraryVisible,
backpackOptions,
blocksTabVisible,
cardsVisible,
children,
+ costumeLibraryVisible,
costumesTabVisible,
enableCommunity,
importInfoVisible,
@@ -60,6 +64,8 @@ const GUIComponent = props => {
onActivateCostumesTab,
onActivateSoundsTab,
onActivateTab,
+ onRequestCloseBackdropLibrary,
+ onRequestCloseCostumeLibrary,
previewInfoVisible,
targetIsStage,
soundsTabVisible,
@@ -112,6 +118,18 @@ const GUIComponent = props => {
{cardsVisible ? (
) : null}
+ {costumeLibraryVisible ? (
+
+ ) : null}
+ {backdropLibraryVisible ? (
+
+ ) : null}
@@ -227,6 +245,7 @@ const GUIComponent = props => {
};
GUIComponent.propTypes = {
activeTabIndex: PropTypes.number,
+ backdropLibraryVisible: PropTypes.bool,
backpackOptions: PropTypes.shape({
host: PropTypes.string,
visible: PropTypes.bool
@@ -235,6 +254,7 @@ GUIComponent.propTypes = {
blocksTabVisible: PropTypes.bool,
cardsVisible: PropTypes.bool,
children: PropTypes.node,
+ costumeLibraryVisible: PropTypes.bool,
costumesTabVisible: PropTypes.bool,
enableCommunity: PropTypes.bool,
importInfoVisible: PropTypes.bool,
@@ -245,6 +265,8 @@ GUIComponent.propTypes = {
onActivateSoundsTab: PropTypes.func,
onActivateTab: PropTypes.func,
onExtensionButtonClick: PropTypes.func,
+ onRequestCloseBackdropLibrary: PropTypes.func,
+ onRequestCloseCostumeLibrary: PropTypes.func,
onTabSelect: PropTypes.func,
previewInfoVisible: PropTypes.bool,
soundsTabVisible: PropTypes.bool,
diff --git a/src/components/library-item/library-item.css b/src/components/library-item/library-item.css
index 7b91cc96a..3258b4a7b 100644
--- a/src/components/library-item/library-item.css
+++ b/src/components/library-item/library-item.css
@@ -5,7 +5,7 @@
display: flex;
flex-direction: column;
align-items: center;
- justify-content: center;
+ justify-content: flex-start;
flex-basis: 160px;
max-width: 160px;
height: 160px;
diff --git a/src/components/library/library.css b/src/components/library/library.css
index 5a2b6e1f0..8c132c389 100644
--- a/src/components/library/library.css
+++ b/src/components/library/library.css
@@ -5,6 +5,7 @@
display: flex;
justify-content: flex-start;
align-content: flex-start;
+ align-items: flex-start;
background: $ui-secondary;
flex-grow: 1;
flex-wrap: wrap;
diff --git a/src/components/sprite-selector/sprite-selector.css b/src/components/sprite-selector/sprite-selector.css
index 8b1e76df5..43d6681e1 100644
--- a/src/components/sprite-selector/sprite-selector.css
+++ b/src/components/sprite-selector/sprite-selector.css
@@ -47,7 +47,7 @@
then back up, introduces white space in the outside the page container.
*/
height: calc(100% - $sprite-info-height);
- overflow-y: scroll;
+ overflow-y: auto;
}
.items-wrapper {
diff --git a/src/containers/backdrop-library.jsx b/src/containers/backdrop-library.jsx
index 98604bf18..5a0266038 100644
--- a/src/containers/backdrop-library.jsx
+++ b/src/containers/backdrop-library.jsx
@@ -2,8 +2,14 @@ import bindAll from 'lodash.bindall';
import PropTypes from 'prop-types';
import React from 'react';
import {defineMessages, injectIntl, intlShape} from 'react-intl';
+import {connect} from 'react-redux';
import VM from 'scratch-vm';
+import {
+ activateTab,
+ COSTUMES_TAB_INDEX
+} from '../reducers/editor-tab';
+
import analytics from '../lib/analytics';
import backdropLibraryContent from '../lib/libraries/backdrops.json';
import backdropTags from '../lib/libraries/backdrop-tags';
@@ -33,6 +39,8 @@ class BackdropLibrary extends React.Component {
bitmapResolution: item.info.length > 2 ? item.info[2] : 1,
skinId: null
};
+ this.props.vm.setEditingTarget(this.props.stageID);
+ this.props.onActivateTab(COSTUMES_TAB_INDEX);
this.props.vm.addBackdrop(item.md5, vmBackdrop);
analytics.event({
category: 'library',
@@ -56,8 +64,21 @@ class BackdropLibrary extends React.Component {
BackdropLibrary.propTypes = {
intl: intlShape.isRequired,
+ onActivateTab: PropTypes.func.isRequired,
onRequestClose: PropTypes.func,
+ stageID: PropTypes.string.isRequired,
vm: PropTypes.instanceOf(VM).isRequired
};
-export default injectIntl(BackdropLibrary);
+const mapStateToProps = state => ({
+ stageID: state.scratchGui.targets.stage.id
+});
+
+const mapDispatchToProps = dispatch => ({
+ onActivateTab: tab => dispatch(activateTab(tab))
+});
+
+export default injectIntl(connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(BackdropLibrary));
diff --git a/src/containers/costume-tab.jsx b/src/containers/costume-tab.jsx
index 3ce034caa..08546f857 100644
--- a/src/containers/costume-tab.jsx
+++ b/src/containers/costume-tab.jsx
@@ -6,8 +6,6 @@ import VM from 'scratch-vm';
import AssetPanel from '../components/asset-panel/asset-panel.jsx';
import PaintEditorWrapper from './paint-editor-wrapper.jsx';
-import CostumeLibrary from './costume-library.jsx';
-import BackdropLibrary from './backdrop-library.jsx';
import CameraModal from './camera-modal.jsx';
import {connect} from 'react-redux';
import {handleFileUpload, costumeUpload} from '../lib/file-uploader.js';
@@ -15,8 +13,6 @@ import errorBoundaryHOC from '../lib/error-boundary-hoc.jsx';
import {
closeCameraCapture,
- closeCostumeLibrary,
- closeBackdropLibrary,
openCameraCapture,
openCostumeLibrary,
openBackdropLibrary
@@ -209,16 +205,11 @@ class CostumeTab extends React.Component {
onNewCostumeFromCameraClick,
onNewLibraryBackdropClick,
onNewLibraryCostumeClick,
- backdropLibraryVisible,
cameraModalVisible,
- costumeLibraryVisible,
- onRequestCloseBackdropLibrary,
onRequestCloseCameraModal,
- onRequestCloseCostumeLibrary,
editingTarget,
sprites,
- stage,
- vm
+ stage
} = this.props;
const target = editingTarget && sprites[editingTarget] ? sprites[editingTarget] : stage;
@@ -284,18 +275,6 @@ class CostumeTab extends React.Component {
/> :
null
}
- {costumeLibraryVisible ? (
-
- ) : null}
- {backdropLibraryVisible ? (
-
- ) : null}
{cameraModalVisible ? (
({
editingTarget: state.scratchGui.targets.editingTarget,
sprites: state.scratchGui.targets.sprites,
stage: state.scratchGui.targets.stage,
- cameraModalVisible: state.scratchGui.modals.cameraCapture,
- costumeLibraryVisible: state.scratchGui.modals.costumeLibrary,
- backdropLibraryVisible: state.scratchGui.modals.backdropLibrary
+ cameraModalVisible: state.scratchGui.modals.cameraCapture
});
const mapDispatchToProps = dispatch => ({
@@ -357,12 +330,6 @@ const mapDispatchToProps = dispatch => ({
onNewCostumeFromCameraClick: () => {
dispatch(openCameraCapture());
},
- onRequestCloseBackdropLibrary: () => {
- dispatch(closeBackdropLibrary());
- },
- onRequestCloseCostumeLibrary: () => {
- dispatch(closeCostumeLibrary());
- },
onRequestCloseCameraModal: () => {
dispatch(closeCameraCapture());
}
diff --git a/src/containers/gui.jsx b/src/containers/gui.jsx
index ed2ec1785..bdd552968 100644
--- a/src/containers/gui.jsx
+++ b/src/containers/gui.jsx
@@ -14,6 +14,11 @@ import {
SOUNDS_TAB_INDEX
} from '../reducers/editor-tab';
+import {
+ closeCostumeLibrary,
+ closeBackdropLibrary
+} from '../reducers/modals';
+
import ProjectLoaderHOC from '../lib/project-loader-hoc.jsx';
import vmListenerHOC from '../lib/vm-listener-hoc.jsx';
@@ -103,8 +108,10 @@ GUI.defaultProps = GUIComponent.defaultProps;
const mapStateToProps = state => ({
activeTabIndex: state.scratchGui.editorTab.activeTabIndex,
+ backdropLibraryVisible: state.scratchGui.modals.backdropLibrary,
blocksTabVisible: state.scratchGui.editorTab.activeTabIndex === BLOCKS_TAB_INDEX,
cardsVisible: state.scratchGui.cards.visible,
+ costumeLibraryVisible: state.scratchGui.modals.costumeLibrary,
costumesTabVisible: state.scratchGui.editorTab.activeTabIndex === COSTUMES_TAB_INDEX,
importInfoVisible: state.scratchGui.modals.importInfo,
isPlayerOnly: state.scratchGui.mode.isPlayerOnly,
@@ -122,7 +129,9 @@ const mapDispatchToProps = dispatch => ({
onExtensionButtonClick: () => dispatch(openExtensionLibrary()),
onActivateTab: tab => dispatch(activateTab(tab)),
onActivateCostumesTab: () => dispatch(activateTab(COSTUMES_TAB_INDEX)),
- onActivateSoundsTab: () => dispatch(activateTab(SOUNDS_TAB_INDEX))
+ onActivateSoundsTab: () => dispatch(activateTab(SOUNDS_TAB_INDEX)),
+ onRequestCloseBackdropLibrary: () => dispatch(closeBackdropLibrary()),
+ onRequestCloseCostumeLibrary: () => dispatch(closeCostumeLibrary())
});
const ConnectedGUI = connect(
diff --git a/src/containers/stage-selector.jsx b/src/containers/stage-selector.jsx
index 4d8474600..8fb136a8a 100644
--- a/src/containers/stage-selector.jsx
+++ b/src/containers/stage-selector.jsx
@@ -119,8 +119,7 @@ const mapStateToProps = (state, {assetId, id}) => ({
const mapDispatchToProps = dispatch => ({
onNewBackdropClick: e => {
- e.preventDefault();
- dispatch(activateTab(COSTUMES_TAB_INDEX));
+ e.stopPropagation();
dispatch(openBackdropLibrary());
},
onActivateTab: tabIndex => {
diff --git a/src/lib/blocks.js b/src/lib/blocks.js
index b47edc95d..fb858313c 100644
--- a/src/lib/blocks.js
+++ b/src/lib/blocks.js
@@ -185,14 +185,6 @@ export default function (vm) {
this.jsonInit(json);
};
- ScratchBlocks.Blocks.event_touchingobjectmenu.init = function () {
- const json = jsonForMenuBlock('TOUCHINGOBJECTMENU', spriteMenu, eventColors, [
- ['mouse-pointer', '_mouse_'],
- ['edge', '_edge_']
- ]);
- this.jsonInit(json);
- };
-
ScratchBlocks.Blocks.control_create_clone_of_menu.init = function () {
const json = jsonForMenuBlock('CLONE_OPTION', cloneMenu, controlColors, []);
this.jsonInit(json);
diff --git a/src/lib/make-toolbox-xml.js b/src/lib/make-toolbox-xml.js
index 4088b3d8b..a159f41dd 100644
--- a/src/lib/make-toolbox-xml.js
+++ b/src/lib/make-toolbox-xml.js
@@ -321,13 +321,6 @@ const events = function (isStage) {
` : `
`}
- ${isStage ? '' : `
-
-
-
-
-
- `}
${blockSeparator}