From df5d8bc8a586583e7cc16fd4eaa0753a171c96d8 Mon Sep 17 00:00:00 2001 From: Paul Kaplan Date: Fri, 30 Jun 2017 14:56:04 -0400 Subject: [PATCH] Convert requires to import --- src/components/asset-panel/asset-panel.jsx | 8 ++--- src/components/asset-panel/selector.jsx | 12 +++---- src/components/blocks/blocks.jsx | 8 ++--- src/components/box/box.jsx | 10 +++--- src/components/button/button.jsx | 8 ++--- src/components/close-button/close-button.jsx | 10 +++--- .../costume-canvas/costume-canvas.jsx | 8 ++--- src/components/filter/filter.jsx | 12 +++---- src/components/green-flag/green-flag.jsx | 10 +++--- src/components/gui/gui.jsx | 32 +++++++++---------- src/components/library-item/library-item.jsx | 10 +++--- src/components/library/library.jsx | 12 +++---- src/components/load-button/load-button.jsx | 8 ++--- src/components/menu-bar/menu-bar.jsx | 14 ++++---- src/components/meter/meter.jsx | 6 ++-- src/components/modal/modal.jsx | 16 +++++----- src/components/monitor-list/monitor-list.jsx | 12 +++---- src/components/monitor/monitor.jsx | 10 +++--- src/components/prompt/prompt.jsx | 10 +++--- src/components/record-modal/playback-step.jsx | 18 +++++------ src/components/record-modal/record-modal.jsx | 14 ++++---- .../record-modal/recording-step.jsx | 14 ++++---- src/components/sprite-info/sprite-info.jsx | 18 +++++------ .../sprite-selector-item.jsx | 14 ++++---- .../sprite-selector/sprite-selector.jsx | 12 +++---- .../stage-selector/stage-selector.jsx | 12 +++---- src/components/stage/stage.jsx | 10 +++--- src/components/stop-all/stop-all.jsx | 10 +++--- src/components/target-pane/target-pane.jsx | 26 +++++++-------- src/components/waveform/waveform.jsx | 6 ++-- src/containers/backdrop-library.jsx | 12 +++---- src/containers/blocks.jsx | 18 +++++------ src/containers/costume-library.jsx | 12 +++---- src/containers/costume-tab.jsx | 17 +++++----- src/containers/green-flag.jsx | 10 +++--- src/containers/gui.jsx | 12 +++---- src/containers/load-button.jsx | 10 +++--- src/containers/monitor-list.jsx | 8 ++--- src/containers/monitor.jsx | 10 +++--- src/containers/playback-step.jsx | 10 +++--- src/containers/prompt.jsx | 8 ++--- src/containers/record-modal.jsx | 14 ++++---- src/containers/recording-step.jsx | 8 ++--- src/containers/save-button.jsx | 10 +++--- src/containers/sound-library.jsx | 16 +++++----- src/containers/sound-tab.jsx | 23 +++++++------ src/containers/sprite-info.jsx | 8 ++--- src/containers/sprite-library.jsx | 12 +++---- src/containers/sprite-selector-item.jsx | 10 +++--- src/containers/stage-selector.jsx | 10 +++--- src/containers/stage.jsx | 14 ++++---- src/containers/stop-all.jsx | 10 +++--- src/containers/target-pane.jsx | 8 ++--- src/index.jsx | 22 ++++++------- src/lib/audio/audio-buffer-player.js | 2 +- src/lib/audio/audio-recorder.js | 2 +- src/lib/blocks.js | 2 +- src/lib/log.js | 2 +- src/lib/monitor-adapter.js | 2 +- src/lib/project-loader.js | 4 +-- src/lib/storage.js | 2 +- src/lib/vm-listener-hoc.jsx | 14 ++++---- src/reducers/gui.js | 2 +- src/reducers/monitors.js | 2 +- src/reducers/vm.js | 4 +-- webpack.config.js | 2 +- 66 files changed, 350 insertions(+), 352 deletions(-) diff --git a/src/components/asset-panel/asset-panel.jsx b/src/components/asset-panel/asset-panel.jsx index 7672171d5..743256294 100644 --- a/src/components/asset-panel/asset-panel.jsx +++ b/src/components/asset-panel/asset-panel.jsx @@ -1,8 +1,8 @@ -const React = require('react'); +import React from 'react'; -const Box = require('../box/box.jsx'); -const Selector = require('./selector.jsx'); -const styles = require('./asset-panel.css'); +import Box from '../box/box.jsx'; +import Selector from './selector.jsx'; +import styles from './asset-panel.css'; const AssetPanel = props => ( diff --git a/src/components/asset-panel/selector.jsx b/src/components/asset-panel/selector.jsx index b2fe999c3..41cc41771 100644 --- a/src/components/asset-panel/selector.jsx +++ b/src/components/asset-panel/selector.jsx @@ -1,11 +1,11 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const {FormattedMessage} = require('react-intl'); +import PropTypes from 'prop-types'; +import React from 'react'; +import {FormattedMessage} from 'react-intl'; -const SpriteSelectorItem = require('../../containers/sprite-selector-item.jsx'); +import SpriteSelectorItem from '../../containers/sprite-selector-item.jsx'; -const Box = require('../box/box.jsx'); -const styles = require('./selector.css'); +import Box from '../box/box.jsx'; +import styles from './selector.css'; const Selector = props => { const { diff --git a/src/components/blocks/blocks.jsx b/src/components/blocks/blocks.jsx index a50edba7c..8afcad5e9 100644 --- a/src/components/blocks/blocks.jsx +++ b/src/components/blocks/blocks.jsx @@ -1,7 +1,7 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const Box = require('../box/box.jsx'); -const styles = require('./blocks.css'); +import PropTypes from 'prop-types'; +import React from 'react'; +import Box from '../box/box.jsx'; +import styles from './blocks.css'; const BlocksComponent = props => { const { diff --git a/src/components/box/box.jsx b/src/components/box/box.jsx index cabafd501..71ea75249 100644 --- a/src/components/box/box.jsx +++ b/src/components/box/box.jsx @@ -1,8 +1,8 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); -const stylePropType = require('react-style-proptype'); -const styles = require('./box.css'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; +import stylePropType from 'react-style-proptype'; +import styles from './box.css'; const getRandomColor = (function () { // In "DEBUG" mode this is used to output a random background color for each diff --git a/src/components/button/button.jsx b/src/components/button/button.jsx index dbc852395..59609cf76 100644 --- a/src/components/button/button.jsx +++ b/src/components/button/button.jsx @@ -1,8 +1,8 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; -const styles = require('./button.css'); +import styles from './button.css'; const ButtonComponent = ({ className, diff --git a/src/components/close-button/close-button.jsx b/src/components/close-button/close-button.jsx index c2d78c796..688e991b6 100644 --- a/src/components/close-button/close-button.jsx +++ b/src/components/close-button/close-button.jsx @@ -1,9 +1,9 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const classNames = require('classnames'); +import PropTypes from 'prop-types'; +import React from 'react'; +import classNames from 'classnames'; -const styles = require('./close-button.css'); -const closeIcon = require('./icon--close.svg'); +import styles from './close-button.css'; +import closeIcon from './icon--close.svg'; const CloseButton = props => (
{ const { diff --git a/src/components/green-flag/green-flag.jsx b/src/components/green-flag/green-flag.jsx index 44998dbcc..0e9267389 100644 --- a/src/components/green-flag/green-flag.jsx +++ b/src/components/green-flag/green-flag.jsx @@ -1,9 +1,9 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; -const greenFlagIcon = require('./icon--green-flag.svg'); -const styles = require('./green-flag.css'); +import greenFlagIcon from './icon--green-flag.svg'; +import styles from './green-flag.css'; const GreenFlagComponent = function (props) { const { diff --git a/src/components/gui/gui.jsx b/src/components/gui/gui.jsx index 6d0bb59dc..a2ecf7395 100644 --- a/src/components/gui/gui.jsx +++ b/src/components/gui/gui.jsx @@ -1,22 +1,22 @@ -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'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; +import {Tab, Tabs, TabList, TabPanel} from 'react-tabs'; +import tabStyles from 'react-tabs/style/react-tabs.css'; +import VM from 'scratch-vm'; -const Blocks = require('../../containers/blocks.jsx'); -const CostumeTab = require('../../containers/costume-tab.jsx'); -const GreenFlag = require('../../containers/green-flag.jsx'); -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'); +import Blocks from '../../containers/blocks.jsx'; +import CostumeTab from '../../containers/costume-tab.jsx'; +import GreenFlag from '../../containers/green-flag.jsx'; +import TargetPane from '../../containers/target-pane.jsx'; +import SoundTab from '../../containers/sound-tab.jsx'; +import Stage from '../../containers/stage.jsx'; +import StopAll from '../../containers/stop-all.jsx'; -const Box = require('../box/box.jsx'); -const MenuBar = require('../menu-bar/menu-bar.jsx'); +import Box from '../box/box.jsx'; +import MenuBar from '../menu-bar/menu-bar.jsx'; -const styles = require('./gui.css'); +import styles from './gui.css'; const GUIComponent = props => { diff --git a/src/components/library-item/library-item.jsx b/src/components/library-item/library-item.jsx index 6cc6ff7d6..d96ea0251 100644 --- a/src/components/library-item/library-item.jsx +++ b/src/components/library-item/library-item.jsx @@ -1,9 +1,9 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; -const Box = require('../box/box.jsx'); -const styles = require('./library-item.css'); +import Box from '../box/box.jsx'; +import styles from './library-item.css'; class LibraryItem extends React.PureComponent { constructor (props) { diff --git a/src/components/library/library.jsx b/src/components/library/library.jsx index 7d217ba2c..e878ebc73 100644 --- a/src/components/library/library.jsx +++ b/src/components/library/library.jsx @@ -1,11 +1,11 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; -const LibraryItem = require('../library-item/library-item.jsx'); -const ModalComponent = require('../modal/modal.jsx'); +import LibraryItem from '../library-item/library-item.jsx'; +import ModalComponent from '../modal/modal.jsx'; -const styles = require('./library.css'); +import styles from './library.css'; class LibraryComponent extends React.Component { constructor (props) { diff --git a/src/components/load-button/load-button.jsx b/src/components/load-button/load-button.jsx index 29b2962e5..37519e993 100644 --- a/src/components/load-button/load-button.jsx +++ b/src/components/load-button/load-button.jsx @@ -1,9 +1,9 @@ -const PropTypes = require('prop-types'); -const React = require('react'); +import PropTypes from 'prop-types'; +import React from 'react'; -const ButtonComponent = require('../button/button.jsx'); +import ButtonComponent from '../button/button.jsx'; -const styles = require('./load-button.css'); +import styles from './load-button.css'; const LoadButtonComponent = ({ inputRef, diff --git a/src/components/menu-bar/menu-bar.jsx b/src/components/menu-bar/menu-bar.jsx index 4397b5002..c22ba3636 100644 --- a/src/components/menu-bar/menu-bar.jsx +++ b/src/components/menu-bar/menu-bar.jsx @@ -1,12 +1,12 @@ -const classNames = require('classnames'); -const React = require('react'); +import classNames from 'classnames'; +import React from 'react'; -const Box = require('../box/box.jsx'); -const LoadButton = require('../../containers/load-button.jsx'); -const SaveButton = require('../../containers/save-button.jsx'); +import Box from '../box/box.jsx'; +import LoadButton from '../../containers/load-button.jsx'; +import SaveButton from '../../containers/save-button.jsx'; -const styles = require('./menu-bar.css'); -const scratchLogo = require('./scratch-logo.svg'); +import styles from './menu-bar.css'; +import scratchLogo from './scratch-logo.svg'; const MenuBar = function MenuBar () { return ( diff --git a/src/components/meter/meter.jsx b/src/components/meter/meter.jsx index 8e7d96c6c..de8f3da93 100644 --- a/src/components/meter/meter.jsx +++ b/src/components/meter/meter.jsx @@ -1,6 +1,6 @@ -const React = require('react'); -const PropTypes = require('prop-types'); -const styles = require('./meter.css'); +import React from 'react'; +import PropTypes from 'prop-types'; +import styles from './meter.css'; const Meter = props => { const { diff --git a/src/components/modal/modal.jsx b/src/components/modal/modal.jsx index 5ad978008..da4c62027 100644 --- a/src/components/modal/modal.jsx +++ b/src/components/modal/modal.jsx @@ -1,13 +1,13 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); -const ReactModal = require('react-modal'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; +import ReactModal from 'react-modal'; -const Box = require('../box/box.jsx'); -const CloseButton = require('../close-button/close-button.jsx'); -const Filter = require('../filter/filter.jsx'); +import Box from '../box/box.jsx'; +import CloseButton from '../close-button/close-button.jsx'; +import Filter from '../filter/filter.jsx'; -const styles = require('./modal.css'); +import styles from './modal.css'; class ModalComponent extends React.Component { render () { diff --git a/src/components/monitor-list/monitor-list.jsx b/src/components/monitor-list/monitor-list.jsx index fd9631e23..36337e7c2 100644 --- a/src/components/monitor-list/monitor-list.jsx +++ b/src/components/monitor-list/monitor-list.jsx @@ -1,11 +1,11 @@ -const React = require('react'); -const Box = require('../box/box.jsx'); -const Monitor = require('../../containers/monitor.jsx'); -const PropTypes = require('prop-types'); -const {OrderedMap} = require('immutable'); +import React from 'react'; +import Box from '../box/box.jsx'; +import Monitor from '../../containers/monitor.jsx'; +import PropTypes from 'prop-types'; +import {OrderedMap} from 'immutable'; -const styles = require('./monitor-list.css'); +import styles from './monitor-list.css'; const MonitorList = props => ( ( ( diff --git a/src/components/record-modal/record-modal.jsx b/src/components/record-modal/record-modal.jsx index 657d47799..bca743648 100644 --- a/src/components/record-modal/record-modal.jsx +++ b/src/components/record-modal/record-modal.jsx @@ -1,10 +1,10 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const Box = require('../box/box.jsx'); -const RecordingStep = require('../../containers/recording-step.jsx'); -const PlaybackStep = require('../../containers/playback-step.jsx'); -const Modal = require('../modal/modal.jsx'); -const styles = require('./record-modal.css'); +import PropTypes from 'prop-types'; +import React from 'react'; +import Box from '../box/box.jsx'; +import RecordingStep from '../../containers/recording-step.jsx'; +import PlaybackStep from '../../containers/playback-step.jsx'; +import Modal from '../modal/modal.jsx'; +import styles from './record-modal.css'; const RecordModal = props => ( ( diff --git a/src/components/sprite-info/sprite-info.jsx b/src/components/sprite-info/sprite-info.jsx index e3fbf53cc..5aa1653e3 100644 --- a/src/components/sprite-info/sprite-info.jsx +++ b/src/components/sprite-info/sprite-info.jsx @@ -1,14 +1,14 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; -const Box = require('../box/box.jsx'); -const styles = require('./sprite-info.css'); +import Box from '../box/box.jsx'; +import styles from './sprite-info.css'; -const xIcon = require('./icon--x.svg'); -const yIcon = require('./icon--y.svg'); -const showIcon = require('./icon--show.svg'); -const hideIcon = require('./icon--hide.svg'); +import xIcon from './icon--x.svg'; +import yIcon from './icon--y.svg'; +import showIcon from './icon--show.svg'; +import hideIcon from './icon--hide.svg'; const ROTATION_STYLES = ['left-right', 'don\'t rotate', 'all around']; diff --git a/src/components/sprite-selector-item/sprite-selector-item.jsx b/src/components/sprite-selector-item/sprite-selector-item.jsx index f4fe637f1..f9e3b5b1b 100644 --- a/src/components/sprite-selector-item/sprite-selector-item.jsx +++ b/src/components/sprite-selector-item/sprite-selector-item.jsx @@ -1,11 +1,11 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; -const Box = require('../box/box.jsx'); -const CostumeCanvas = require('../costume-canvas/costume-canvas.jsx'); -const CloseButton = require('../close-button/close-button.jsx'); -const styles = require('./sprite-selector-item.css'); +import Box from '../box/box.jsx'; +import CostumeCanvas from '../costume-canvas/costume-canvas.jsx'; +import CloseButton from '../close-button/close-button.jsx'; +import styles from './sprite-selector-item.css'; const SpriteSelectorItem = props => ( { const { diff --git a/src/components/stage/stage.jsx b/src/components/stage/stage.jsx index 4e3e9a62d..63a27bf56 100644 --- a/src/components/stage/stage.jsx +++ b/src/components/stage/stage.jsx @@ -1,9 +1,9 @@ -const PropTypes = require('prop-types'); -const React = require('react'); +import PropTypes from 'prop-types'; +import React from 'react'; -const Box = require('../box/box.jsx'); -const MonitorList = require('../../containers/monitor-list.jsx'); -const styles = require('./stage.css'); +import Box from '../box/box.jsx'; +import MonitorList from '../../containers/monitor-list.jsx'; +import styles from './stage.css'; const StageComponent = props => { const { diff --git a/src/components/stop-all/stop-all.jsx b/src/components/stop-all/stop-all.jsx index 57907e234..4d85e2c46 100644 --- a/src/components/stop-all/stop-all.jsx +++ b/src/components/stop-all/stop-all.jsx @@ -1,9 +1,9 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; -const stopAllIcon = require('./icon--stop-all.svg'); -const styles = require('./stop-all.css'); +import stopAllIcon from './icon--stop-all.svg'; +import styles from './stop-all.css'; const StopAllComponent = function (props) { const { diff --git a/src/components/target-pane/target-pane.jsx b/src/components/target-pane/target-pane.jsx index c8f16a9c4..0d48924af 100644 --- a/src/components/target-pane/target-pane.jsx +++ b/src/components/target-pane/target-pane.jsx @@ -1,19 +1,19 @@ -const classNames = require('classnames'); -const PropTypes = require('prop-types'); -const React = require('react'); +import classNames from 'classnames'; +import PropTypes from 'prop-types'; +import React from 'react'; -const VM = require('scratch-vm'); +import VM from 'scratch-vm'; -const Box = require('../box/box.jsx'); -const BackdropLibrary = require('../../containers/backdrop-library.jsx'); -const CostumeLibrary = require('../../containers/costume-library.jsx'); -const SoundLibrary = require('../../containers/sound-library.jsx'); -const SpriteLibrary = require('../../containers/sprite-library.jsx'); -const SpriteSelectorComponent = require('../sprite-selector/sprite-selector.jsx'); -const StageSelector = require('../../containers/stage-selector.jsx'); +import Box from '../box/box.jsx'; +import BackdropLibrary from '../../containers/backdrop-library.jsx'; +import CostumeLibrary from '../../containers/costume-library.jsx'; +import SoundLibrary from '../../containers/sound-library.jsx'; +import SpriteLibrary from '../../containers/sprite-library.jsx'; +import SpriteSelectorComponent from '../sprite-selector/sprite-selector.jsx'; +import StageSelector from '../../containers/stage-selector.jsx'; -const styles = require('./target-pane.css'); -const addIcon = require('./icon--add.svg'); +import styles from './target-pane.css'; +import addIcon from './icon--add.svg'; /* * Pane that contains the sprite selector, sprite info, stage selector, diff --git a/src/components/waveform/waveform.jsx b/src/components/waveform/waveform.jsx index 3941014de..c6edd5c83 100644 --- a/src/components/waveform/waveform.jsx +++ b/src/components/waveform/waveform.jsx @@ -1,6 +1,6 @@ -const React = require('react'); -const PropTypes = require('prop-types'); -const styles = require('./waveform.css'); +import React from 'react'; +import PropTypes from 'prop-types'; +import styles from './waveform.css'; const Waveform = props => { const { diff --git a/src/containers/backdrop-library.jsx b/src/containers/backdrop-library.jsx index 62e9cd473..72e2a1c76 100644 --- a/src/containers/backdrop-library.jsx +++ b/src/containers/backdrop-library.jsx @@ -1,10 +1,10 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; -const backdropLibraryContent = require('../lib/libraries/backdrops.json'); -const LibraryComponent = require('../components/library/library.jsx'); +import backdropLibraryContent from '../lib/libraries/backdrops.json'; +import LibraryComponent from '../components/library/library.jsx'; class BackdropLibrary extends React.Component { diff --git a/src/containers/blocks.jsx b/src/containers/blocks.jsx index 59e868436..bc8e3ff38 100644 --- a/src/containers/blocks.jsx +++ b/src/containers/blocks.jsx @@ -1,12 +1,12 @@ -const bindAll = require('lodash.bindall'); -const debounce = require('lodash.debounce'); -const defaultsDeep = require('lodash.defaultsdeep'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VMScratchBlocks = require('../lib/blocks'); -const VM = require('scratch-vm'); -const Prompt = require('./prompt.jsx'); -const BlocksComponent = require('../components/blocks/blocks.jsx'); +import bindAll from 'lodash.bindall'; +import debounce from 'lodash.debounce'; +import defaultsDeep from 'lodash.defaultsdeep'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VMScratchBlocks from '../lib/blocks'; +import VM from 'scratch-vm'; +import Prompt from './prompt.jsx'; +import BlocksComponent from '../components/blocks/blocks.jsx'; const addFunctionListener = (object, property, callback) => { const oldFn = object[property]; diff --git a/src/containers/costume-library.jsx b/src/containers/costume-library.jsx index f245c098f..168d4b950 100644 --- a/src/containers/costume-library.jsx +++ b/src/containers/costume-library.jsx @@ -1,10 +1,10 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; -const costumeLibraryContent = require('../lib/libraries/costumes.json'); -const LibraryComponent = require('../components/library/library.jsx'); +import costumeLibraryContent from '../lib/libraries/costumes.json'; +import LibraryComponent from '../components/library/library.jsx'; class CostumeLibrary extends React.PureComponent { diff --git a/src/containers/costume-tab.jsx b/src/containers/costume-tab.jsx index f18dcf013..c2b8fd8c4 100644 --- a/src/containers/costume-tab.jsx +++ b/src/containers/costume-tab.jsx @@ -1,14 +1,13 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const bindAll = require('lodash.bindall'); -const {defineMessages} = require('react-intl'); +import PropTypes from 'prop-types'; +import React from 'react'; +import bindAll from 'lodash.bindall'; +import {defineMessages} from 'react-intl'; +import VM from 'scratch-vm'; -const VM = require('scratch-vm'); +import AssetPanel from '../components/asset-panel/asset-panel.jsx'; +import addCostumeIcon from '../components/asset-panel/icon--add-costume-lib.svg'; -const AssetPanel = require('../components/asset-panel/asset-panel.jsx'); -const addCostumeIcon = require('../components/asset-panel/icon--add-costume-lib.svg'); - -const {connect} = require('react-redux'); +import {connect} from 'react-redux'; const { openCostumeLibrary, diff --git a/src/containers/green-flag.jsx b/src/containers/green-flag.jsx index 1fdb17bfd..e4f852053 100644 --- a/src/containers/green-flag.jsx +++ b/src/containers/green-flag.jsx @@ -1,10 +1,10 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; -const VM = require('scratch-vm'); +import VM from 'scratch-vm'; -const GreenFlagComponent = require('../components/green-flag/green-flag.jsx'); +import GreenFlagComponent from '../components/green-flag/green-flag.jsx'; class GreenFlag extends React.Component { constructor (props) { diff --git a/src/containers/gui.jsx b/src/containers/gui.jsx index fbc11d7da..89f251639 100644 --- a/src/containers/gui.jsx +++ b/src/containers/gui.jsx @@ -1,11 +1,11 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); -const bindAll = require('lodash.bindall'); +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; +import bindAll from 'lodash.bindall'; -const vmListenerHOC = require('../lib/vm-listener-hoc.jsx'); +import vmListenerHOC from '../lib/vm-listener-hoc.jsx'; -const GUIComponent = require('../components/gui/gui.jsx'); +import GUIComponent from '../components/gui/gui.jsx'; class GUI extends React.Component { constructor (props) { diff --git a/src/containers/load-button.jsx b/src/containers/load-button.jsx index dcbd4fe01..d07e5e105 100644 --- a/src/containers/load-button.jsx +++ b/src/containers/load-button.jsx @@ -1,9 +1,9 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const {connect} = require('react-redux'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import {connect} from 'react-redux'; -const LoadButtonComponent = require('../components/load-button/load-button.jsx'); +import LoadButtonComponent from '../components/load-button/load-button.jsx'; class LoadButton extends React.Component { constructor (props) { diff --git a/src/containers/monitor-list.jsx b/src/containers/monitor-list.jsx index c74d81394..adfc2ea5a 100644 --- a/src/containers/monitor-list.jsx +++ b/src/containers/monitor-list.jsx @@ -1,9 +1,9 @@ -const bindAll = require('lodash.bindall'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import React from 'react'; -const {connect} = require('react-redux'); +import {connect} from 'react-redux'; -const MonitorListComponent = require('../components/monitor-list/monitor-list.jsx'); +import MonitorListComponent from '../components/monitor-list/monitor-list.jsx'; class MonitorList extends React.Component { constructor (props) { diff --git a/src/containers/monitor.jsx b/src/containers/monitor.jsx index 9bed328d4..297649fa6 100644 --- a/src/containers/monitor.jsx +++ b/src/containers/monitor.jsx @@ -1,9 +1,9 @@ -const bindAll = require('lodash.bindall'); -const React = require('react'); -const PropTypes = require('prop-types'); +import bindAll from 'lodash.bindall'; +import React from 'react'; +import PropTypes from 'prop-types'; -const monitorAdapter = require('../lib/monitor-adapter.js'); -const MonitorComponent = require('../components/monitor/monitor.jsx'); +import monitorAdapter from '../lib/monitor-adapter.js'; +import MonitorComponent from '../components/monitor/monitor.jsx'; class Monitor extends React.Component { constructor (props) { diff --git a/src/containers/playback-step.jsx b/src/containers/playback-step.jsx index fa7a35fe1..5276e4d9d 100644 --- a/src/containers/playback-step.jsx +++ b/src/containers/playback-step.jsx @@ -1,8 +1,8 @@ -const React = require('react'); -const PropTypes = require('prop-types'); -const bindAll = require('lodash.bindall'); -const PlaybackStepComponent = require('../components/record-modal/playback-step.jsx'); -const AudioBufferPlayer = require('../lib/audio/audio-buffer-player.js'); +import React from 'react'; +import PropTypes from 'prop-types'; +import bindAll from 'lodash.bindall'; +import PlaybackStepComponent from '../components/record-modal/playback-step.jsx'; +import AudioBufferPlayer from '../lib/audio/audio-buffer-player.js'; class PlaybackStep extends React.Component { constructor (props) { diff --git a/src/containers/prompt.jsx b/src/containers/prompt.jsx index e60bb8fef..556caf949 100644 --- a/src/containers/prompt.jsx +++ b/src/containers/prompt.jsx @@ -1,7 +1,7 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const bindAll = require('lodash.bindall'); -const PromptComponent = require('../components/prompt/prompt.jsx'); +import PropTypes from 'prop-types'; +import React from 'react'; +import bindAll from 'lodash.bindall'; +import PromptComponent from '../components/prompt/prompt.jsx'; class Prompt extends React.Component { constructor (props) { diff --git a/src/containers/record-modal.jsx b/src/containers/record-modal.jsx index 4469bbe3e..38c3336d2 100644 --- a/src/containers/record-modal.jsx +++ b/src/containers/record-modal.jsx @@ -1,11 +1,11 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); -const WavEncoder = require('wav-encoder'); -const {connect} = require('react-redux'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; +import WavEncoder from 'wav-encoder'; +import {connect} from 'react-redux'; -const RecordModalComponent = require('../components/record-modal/record-modal.jsx'); +import RecordModalComponent from '../components/record-modal/record-modal.jsx'; const { closeSoundRecorder diff --git a/src/containers/recording-step.jsx b/src/containers/recording-step.jsx index b3ce76327..81d3a9348 100644 --- a/src/containers/recording-step.jsx +++ b/src/containers/recording-step.jsx @@ -1,7 +1,7 @@ -const React = require('react'); -const bindAll = require('lodash.bindall'); -const RecordingStepComponent = require('../components/record-modal/recording-step.jsx'); -const AudioRecorder = require('../lib/audio/audio-recorder.js'); +import React from 'react'; +import bindAll from 'lodash.bindall'; +import RecordingStepComponent from '../components/record-modal/recording-step.jsx'; +import AudioRecorder from '../lib/audio/audio-recorder.js'; class RecordingStep extends React.Component { constructor (props) { diff --git a/src/containers/save-button.jsx b/src/containers/save-button.jsx index f5e7ab018..08585d0f0 100644 --- a/src/containers/save-button.jsx +++ b/src/containers/save-button.jsx @@ -1,9 +1,9 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const {connect} = require('react-redux'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import {connect} from 'react-redux'; -const ButtonComponent = require('../components/button/button.jsx'); +import ButtonComponent from '../components/button/button.jsx'; class SaveButton extends React.Component { constructor (props) { diff --git a/src/containers/sound-library.jsx b/src/containers/sound-library.jsx index d82512225..3de7f7053 100644 --- a/src/containers/sound-library.jsx +++ b/src/containers/sound-library.jsx @@ -1,13 +1,13 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); -const AudioEngine = require('scratch-audio'); -const LibraryComponent = require('../components/library/library.jsx'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; +import AudioEngine from 'scratch-audio'; +import LibraryComponent from '../components/library/library.jsx'; -const soundIcon = require('../components/asset-panel/icon--sound.svg'); +import soundIcon from '../components/asset-panel/icon--sound.svg'; -const soundLibraryContent = require('../lib/libraries/sounds.json'); +import soundLibraryContent from '../lib/libraries/sounds.json'; class SoundLibrary extends React.PureComponent { constructor (props) { diff --git a/src/containers/sound-tab.jsx b/src/containers/sound-tab.jsx index 11ed75ff0..ab284adec 100644 --- a/src/containers/sound-tab.jsx +++ b/src/containers/sound-tab.jsx @@ -1,18 +1,17 @@ -const PropTypes = require('prop-types'); -const React = require('react'); -const bindAll = require('lodash.bindall'); -const {defineMessages} = require('react-intl'); +import PropTypes from 'prop-types'; +import React from 'react'; +import bindAll from 'lodash.bindall'; +import {defineMessages} from 'react-intl'; +import VM from 'scratch-vm'; -const VM = require('scratch-vm'); +import AssetPanel from '../components/asset-panel/asset-panel.jsx'; +import soundIcon from '../components/asset-panel/icon--sound.svg'; +import addSoundFromLibraryIcon from '../components/asset-panel/icon--add-sound-lib.svg'; +import addSoundFromRecordingIcon from '../components/asset-panel/icon--add-sound-record.svg'; -const AssetPanel = require('../components/asset-panel/asset-panel.jsx'); -const soundIcon = require('../components/asset-panel/icon--sound.svg'); -const addSoundFromLibraryIcon = require('../components/asset-panel/icon--add-sound-lib.svg'); -const addSoundFromRecordingIcon = require('../components/asset-panel/icon--add-sound-record.svg'); +import RecordModal from './record-modal.jsx'; -const RecordModal = require('./record-modal.jsx'); - -const {connect} = require('react-redux'); +import {connect} from 'react-redux'; const { openSoundLibrary, diff --git a/src/containers/sprite-info.jsx b/src/containers/sprite-info.jsx index 65f88bb43..ba84fed0a 100644 --- a/src/containers/sprite-info.jsx +++ b/src/containers/sprite-info.jsx @@ -1,8 +1,8 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; -const SpriteInfoComponent = require('../components/sprite-info/sprite-info.jsx'); +import SpriteInfoComponent from '../components/sprite-info/sprite-info.jsx'; class SpriteInfo extends React.Component { constructor (props) { diff --git a/src/containers/sprite-library.jsx b/src/containers/sprite-library.jsx index 6395b421a..17befee57 100644 --- a/src/containers/sprite-library.jsx +++ b/src/containers/sprite-library.jsx @@ -1,11 +1,11 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; -const spriteLibraryContent = require('../lib/libraries/sprites.json'); +import spriteLibraryContent from '../lib/libraries/sprites.json'; -const LibraryComponent = require('../components/library/library.jsx'); +import LibraryComponent from '../components/library/library.jsx'; class SpriteLibrary extends React.PureComponent { constructor (props) { diff --git a/src/containers/sprite-selector-item.jsx b/src/containers/sprite-selector-item.jsx index d6c738cb3..d662b15f4 100644 --- a/src/containers/sprite-selector-item.jsx +++ b/src/containers/sprite-selector-item.jsx @@ -1,10 +1,10 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; -const {connect} = require('react-redux'); +import {connect} from 'react-redux'; -const SpriteSelectorItemComponent = require('../components/sprite-selector-item/sprite-selector-item.jsx'); +import SpriteSelectorItemComponent from '../components/sprite-selector-item/sprite-selector-item.jsx'; class SpriteSelectorItem extends React.Component { constructor (props) { diff --git a/src/containers/stage-selector.jsx b/src/containers/stage-selector.jsx index 9b4b83d0d..5bb779e32 100644 --- a/src/containers/stage-selector.jsx +++ b/src/containers/stage-selector.jsx @@ -1,10 +1,10 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; -const {connect} = require('react-redux'); +import {connect} from 'react-redux'; -const StageSelectorComponent = require('../components/stage-selector/stage-selector.jsx'); +import StageSelectorComponent from '../components/stage-selector/stage-selector.jsx'; class StageSelector extends React.Component { constructor (props) { diff --git a/src/containers/stage.jsx b/src/containers/stage.jsx index b268edc41..0c161023b 100644 --- a/src/containers/stage.jsx +++ b/src/containers/stage.jsx @@ -1,11 +1,11 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const Renderer = require('scratch-render'); -const AudioEngine = require('scratch-audio'); -const VM = require('scratch-vm'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import Renderer from 'scratch-render'; +import AudioEngine from 'scratch-audio'; +import VM from 'scratch-vm'; -const StageComponent = require('../components/stage/stage.jsx'); +import StageComponent from '../components/stage/stage.jsx'; class Stage extends React.Component { constructor (props) { diff --git a/src/containers/stop-all.jsx b/src/containers/stop-all.jsx index 977db35d8..4f80a2eaf 100644 --- a/src/containers/stop-all.jsx +++ b/src/containers/stop-all.jsx @@ -1,9 +1,9 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; -const StopAllComponent = require('../components/stop-all/stop-all.jsx'); +import StopAllComponent from '../components/stop-all/stop-all.jsx'; class StopAll extends React.Component { constructor (props) { diff --git a/src/containers/target-pane.jsx b/src/containers/target-pane.jsx index 99de6a01c..0d8a3a15c 100644 --- a/src/containers/target-pane.jsx +++ b/src/containers/target-pane.jsx @@ -1,7 +1,7 @@ -const bindAll = require('lodash.bindall'); -const React = require('react'); +import bindAll from 'lodash.bindall'; +import React from 'react'; -const {connect} = require('react-redux'); +import {connect} from 'react-redux'; const { openBackdropLibrary, @@ -12,7 +12,7 @@ const { closeSpriteLibrary } = require('../reducers/modals'); -const TargetPaneComponent = require('../components/target-pane/target-pane.jsx'); +import TargetPaneComponent from '../components/target-pane/target-pane.jsx'; class TargetPane extends React.Component { constructor (props) { diff --git a/src/index.jsx b/src/index.jsx index 12a8c7bb3..22e2bb241 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -1,16 +1,16 @@ -const React = require('react'); -const ReactDOM = require('react-dom'); -const {Provider} = require('react-redux'); -const {IntlProvider} = require('react-intl'); -const {createStore, applyMiddleware} = require('redux'); -const throttle = require('redux-throttle').default; +import React from 'react'; +import ReactDOM from 'react-dom'; +import {Provider} from 'react-redux'; +import {createStore, applyMiddleware} from 'redux'; +import throttle from 'redux-throttle'; +import {IntlProvider} from 'react-intl'; -const GUI = require('./containers/gui.jsx'); -const log = require('./lib/log'); -const ProjectLoader = require('./lib/project-loader'); -const reducer = require('./reducers/gui'); +import GUI from './containers/gui.jsx'; +import log from './lib/log'; +import ProjectLoader from './lib/project-loader'; +import reducer from './reducers/gui'; -const styles = require('./index.css'); +import styles from './index.css'; class App extends React.Component { constructor (props) { diff --git a/src/lib/audio/audio-buffer-player.js b/src/lib/audio/audio-buffer-player.js index ab71b7a52..0d1beb527 100644 --- a/src/lib/audio/audio-buffer-player.js +++ b/src/lib/audio/audio-buffer-player.js @@ -1,4 +1,4 @@ -const SharedAudioContext = require('./shared-audio-context.js'); +import SharedAudioContext from './shared-audio-context.js'; class AudioBufferPlayer { constructor (samples) { diff --git a/src/lib/audio/audio-recorder.js b/src/lib/audio/audio-recorder.js index f3a073d81..03dbdb174 100644 --- a/src/lib/audio/audio-recorder.js +++ b/src/lib/audio/audio-recorder.js @@ -1,4 +1,4 @@ -const SharedAudioContext = require('./shared-audio-context.js'); +import SharedAudioContext from './shared-audio-context.js'; class AudioRecorder { constructor () { diff --git a/src/lib/blocks.js b/src/lib/blocks.js index aacd2b4de..b966846a6 100644 --- a/src/lib/blocks.js +++ b/src/lib/blocks.js @@ -1,4 +1,4 @@ -const ScratchBlocks = require('scratch-blocks'); +import ScratchBlocks from 'scratch-blocks'; module.exports = function (vm) { diff --git a/src/lib/log.js b/src/lib/log.js index ab38732b1..839dc372d 100644 --- a/src/lib/log.js +++ b/src/lib/log.js @@ -1,4 +1,4 @@ -const minilog = require('minilog'); +import minilog from 'minilog'; minilog.enable(); module.exports = minilog('gui'); diff --git a/src/lib/monitor-adapter.js b/src/lib/monitor-adapter.js index dc66fd0b8..0fc7efbc5 100644 --- a/src/lib/monitor-adapter.js +++ b/src/lib/monitor-adapter.js @@ -3,7 +3,7 @@ * - Convert opcode to a label and a category * - Add missing XY position data if needed */ -const OpcodeLabels = require('./opcode-labels.js'); +import OpcodeLabels from './opcode-labels.js'; const PADDING = 5; const MONITOR_HEIGHT = 23; diff --git a/src/lib/project-loader.js b/src/lib/project-loader.js index 7b28f98cc..5b15929dc 100644 --- a/src/lib/project-loader.js +++ b/src/lib/project-loader.js @@ -1,6 +1,6 @@ -const xhr = require('xhr'); +import xhr from 'xhr'; -const log = require('./log'); +import log from './log'; class ProjectLoader { constructor () { diff --git a/src/lib/storage.js b/src/lib/storage.js index 5e6ae6c34..6b3f4877c 100644 --- a/src/lib/storage.js +++ b/src/lib/storage.js @@ -1,4 +1,4 @@ -const ScratchStorage = require('scratch-storage'); +import ScratchStorage from 'scratch-storage'; const PROJECT_SERVER = 'https://cdn.projects.scratch.mit.edu'; const ASSET_SERVER = 'https://cdn.assets.scratch.mit.edu'; diff --git a/src/lib/vm-listener-hoc.jsx b/src/lib/vm-listener-hoc.jsx index e49de705e..8cbf05c50 100644 --- a/src/lib/vm-listener-hoc.jsx +++ b/src/lib/vm-listener-hoc.jsx @@ -1,12 +1,12 @@ -const bindAll = require('lodash.bindall'); -const PropTypes = require('prop-types'); -const React = require('react'); -const VM = require('scratch-vm'); +import bindAll from 'lodash.bindall'; +import PropTypes from 'prop-types'; +import React from 'react'; +import VM from 'scratch-vm'; -const {connect} = require('react-redux'); +import {connect} from 'react-redux'; -const targets = require('../reducers/targets'); -const monitors = require('../reducers/monitors'); +import targets from '../reducers/targets'; +import monitors from '../reducers/monitors'; /* * Higher Order Component to manage events emitted by the VM diff --git a/src/reducers/gui.js b/src/reducers/gui.js index 9b1cf6067..f27977aa5 100644 --- a/src/reducers/gui.js +++ b/src/reducers/gui.js @@ -1,4 +1,4 @@ -const {combineReducers} = require('redux'); +import {combineReducers} from 'redux'; module.exports = combineReducers({ modals: require('./modals'), diff --git a/src/reducers/monitors.js b/src/reducers/monitors.js index e21e67a01..e1428c2c6 100644 --- a/src/reducers/monitors.js +++ b/src/reducers/monitors.js @@ -1,5 +1,5 @@ const UPDATE_MONITORS = 'scratch-gui/monitors/UPDATE_MONITORS'; -const {OrderedMap} = require('immutable'); +import {OrderedMap} from 'immutable'; const initialState = OrderedMap(); diff --git a/src/reducers/vm.js b/src/reducers/vm.js index 1fd0eb4a2..2ac5c1c92 100644 --- a/src/reducers/vm.js +++ b/src/reducers/vm.js @@ -1,5 +1,5 @@ -const VM = require('scratch-vm'); -const Storage = require('../lib/storage'); +import VM from 'scratch-vm'; +import Storage from '../lib/storage'; const SET_VM = 'scratch-gui/vm/SET_VM'; const defaultVM = new VM(); diff --git a/webpack.config.js b/webpack.config.js index 532ff10cb..3ae6a87aa 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -36,7 +36,7 @@ module.exports = { include: path.resolve(__dirname, 'src'), options: { plugins: ['transform-object-rest-spread'], - presets: [['es2015', {modules: false}], 'react'] + presets: ['es2015', 'react'] } }, {