ScCN/scratch-gui
2
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'develop' into feature/delete-costume-sounds

Browse Source
This commit is contained in:
Paul Kaplan authored and GitHub committed 2017-05-23 07:54:34 -04:00
2 parents c54cf70b82 0ae48ad511
commit e26e55e7df
4 files changed
+47 -25
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

package.json
+11 -11
View File
@@ -23,7 +23,7 @@
"react-dom": "^15"
},
"devDependencies": {
"autoprefixer": "6.7.7",
"autoprefixer": "7.1.0",
"babel-core": "^6.23.1",
"babel-eslint": "^7.1.1",
"babel-loader": "^7.0.0",
@@ -32,11 +32,11 @@
"babel-preset-react": "^6.22.0",
"classnames": "2.2.5",
"copy-webpack-plugin": "4.0.1",
"css-loader": "0.28.0",
"css-loader": "0.28.1",
"eslint": "^3.16.1",
"eslint-config-scratch": "^3.0.0",
"eslint-plugin-react": "^6.10.0",
"gh-pages": "^0.12.0",
"eslint-plugin-react": "^7.0.1",
"gh-pages": "^1.0.0",
"html-webpack-plugin": "2.28.0",
"lodash.bindall": "4.4.0",
"lodash.defaultsdeep": "4.6.0",
@@ -45,17 +45,17 @@
"lodash.pick": "4.4.0",
"minilog": "3.1.0",
"mkdirp": "^0.5.1",
"postcss-import": "9.1.0",
"postcss-loader": "1.3.3",
"postcss-simple-vars": "3.1.0",
"prop-types": "15.5.8",
"postcss-import": "^10.0.0",
"postcss-loader": "^2.0.5",
"postcss-simple-vars": "^4.0.0",
"prop-types": "^15.5.10",
"react": "15.5.4",
"react-dom": "15.5.4",
"react-draggable": "2.2.6",
"react-modal": "1.7.7",
"react-redux": "5.0.4",
"react-redux": "5.0.5",
"react-style-proptype": "3.0.0",
"react-tabs": "0.8.3",
"react-tabs": "1.0.0",
"redux": "3.6.0",
"redux-throttle": "0.1.1",
"rimraf": "^2.6.1",
@@ -64,7 +64,7 @@
"scratch-render": "^0.1.0-prerelease.0",
"scratch-storage": "^0.1.0",
"scratch-vm": "^0.1.0-prerelease.0",
"style-loader": "0.16.1",
"style-loader": "^0.17.0",
"svg-to-image": "1.1.3",
"svg-url-loader": "2.0.2",
"travis-after-all": "^1.4.4",
src/components/gui/gui.css
+7 -3
View File
@@ -47,7 +47,7 @@
border-bottom: 0 !important;
}
.tab-list .tab {
.tab {
flex-grow: 1;
height: 80%;
margin-left: 1px;
@@ -63,9 +63,9 @@
align-items: center;
}
.tab-list .tab[aria-selected="true"] {
.tab.is-selected {
color: #40B9F5;
background-color: #FFFFFF;
}
.tabs {
@@ -80,6 +80,10 @@
position: relative;
flex-grow: 1;
flex-shrink: 0;
display: none;
}
.tab-panel.is-selected {
display: flex;
}
src/components/gui/gui.jsx
+26 -10
View File
@@ -1,6 +1,10 @@
const classNames = require('classnames');
const PropTypes = require('prop-types');
const React = require('react');
const {Tab, Tabs, TabList, TabPanel} = require('react-tabs');
const tabStyles = require('react-tabs/style/react-tabs.css');
const VM = require('scratch-vm');
const Blocks = require('../../containers/blocks.jsx');
const CostumeTab = require('../../containers/costume-tab.jsx');
const GreenFlag = require('../../containers/green-flag.jsx');
@@ -8,12 +12,13 @@ const TargetPane = require('../../containers/target-pane.jsx');
const SoundTab = require('../../containers/sound-tab.jsx');
const Stage = require('../../containers/stage.jsx');
const StopAll = require('../../containers/stop-all.jsx');
const MenuBar = require('../menu-bar/menu-bar.jsx');
const {Tab, Tabs, TabList, TabPanel} = require('react-tabs');
const Box = require('../box/box.jsx');
const MenuBar = require('../menu-bar/menu-bar.jsx');
const styles = require('./gui.css');
const GUIComponent = props => {
const {
basePath,
@@ -31,6 +36,15 @@ const GUIComponent = props => {
);
}
const tabClassNames = {
tabs: styles.tabs,
tab: classNames(tabStyles.reactTabsTab, styles.tab),
tabList: classNames(tabStyles.reactTabsTabList, styles.tabList),
tabPanel: classNames(tabStyles.reactTabsTabPanel, styles.tabPanel),
tabPanelSelected: classNames(tabStyles.reactTabsTabPanelSelected, styles.isSelected),
tabSelected: classNames(tabStyles.reactTabsTabSelected, styles.isSelected)
};
return (
<Box
className={styles.pageWrapper}
@@ -41,16 +55,18 @@ const GUIComponent = props => {
<Box className={styles.flexWrapper}>
<Box className={styles.editorWrapper}>
<Tabs
className={styles.tabs}
className={tabClassNames.tabs}
forceRenderTabPanel={true} // eslint-disable-line react/jsx-boolean-value
selectedTabClassName={tabClassNames.tabSelected}
selectedTabPanelClassName={tabClassNames.tabPanelSelected}
onSelect={onTabSelect}
>
<TabList className={styles.tabList}>
<Tab className={styles.tab}>Scripts</Tab>
<Tab className={styles.tab}>Costumes</Tab>
<Tab className={styles.tab}>Sounds</Tab>
<TabList className={tabClassNames.tabList}>
<Tab className={tabClassNames.tab}>Scripts</Tab>
<Tab className={tabClassNames.tab}>Costumes</Tab>
<Tab className={tabClassNames.tab}>Sounds</Tab>
</TabList>
<TabPanel className={styles.tabPanel}>
<TabPanel className={tabClassNames.tabPanel}>
<Box className={styles.blocksWrapper}>
<Blocks
grow={1}
@@ -62,10 +78,10 @@ const GUIComponent = props => {
/>
</Box>
</TabPanel>
<TabPanel className={styles.tabPanel}>
<TabPanel className={tabClassNames.tabPanel}>
<CostumeTab vm={vm} />
</TabPanel>
<TabPanel className={styles.tabPanel}>
<TabPanel className={tabClassNames.tabPanel}>
<SoundTab vm={vm} />
</TabPanel>
</Tabs>
src/lib/blocks.js
+3 -1
View File
@@ -9,7 +9,9 @@ module.exports = function (vm) {
{
type: 'field_dropdown',
name: name,
options: start.concat(menuOptionsFn())
options: function () {
return start.concat(menuOptionsFn());
}
}
],
inputsInline: true,