diff --git a/src/components/sprite-selector-item/sprite-selector-item.jsx b/src/components/sprite-selector-item/sprite-selector-item.jsx index aa292cfaa8e1dc2601c87f3544084160124b8770..c1b288a8cc4a4b777f0f626d3dc3f366f10211d9 100644 --- a/src/components/sprite-selector-item/sprite-selector-item.jsx +++ b/src/components/sprite-selector-item/sprite-selector-item.jsx @@ -18,7 +18,9 @@ const SpriteSelectorItem = props => ( className: classNames(props.className, styles.spriteSelectorItem, { [styles.isSelected]: props.selected }), - onClick: props.onClick + onClick: props.onClick, + onMouseOver: props.onMouseOver, + onMouseOut: props.onMouseOut }} id={`${props.name}-${contextMenuId}`} > @@ -70,6 +72,8 @@ SpriteSelectorItem.propTypes = { onClick: PropTypes.func, onDeleteButtonClick: PropTypes.func, onDuplicateButtonClick: PropTypes.func, + onMouseOut: PropTypes.func, + onMouseOver: PropTypes.func, selected: PropTypes.bool.isRequired }; diff --git a/src/components/sprite-selector/sprite-selector.jsx b/src/components/sprite-selector/sprite-selector.jsx index 806dd4ab035701c185efccc707c3dc6773fddb42..9703cf290a5dc193ffb2bda37b876111c3df7ad2 100644 --- a/src/components/sprite-selector/sprite-selector.jsx +++ b/src/components/sprite-selector/sprite-selector.jsx @@ -30,6 +30,8 @@ const SpriteSelectorComponent = function (props) { onChangeSpriteY, onDeleteSprite, onDuplicateSprite, + onMouseOutSprite, + onMouseOverSprite, onNewSpriteClick, onSelectSprite, raised, @@ -85,6 +87,8 @@ const SpriteSelectorComponent = function (props) { onClick={onSelectSprite} onDeleteButtonClick={onDeleteSprite} onDuplicateButtonClick={onDuplicateSprite} + onMouseOut={onMouseOutSprite} + onMouseOver={onMouseOverSprite} /> )) } @@ -110,6 +114,8 @@ SpriteSelectorComponent.propTypes = { onChangeSpriteY: PropTypes.func, onDeleteSprite: PropTypes.func, onDuplicateSprite: PropTypes.func, + onMouseOutSprite: PropTypes.func, + onMouseOverSprite: PropTypes.func, onNewSpriteClick: PropTypes.func, onSelectSprite: PropTypes.func, raised: PropTypes.bool, diff --git a/src/components/target-pane/target-pane.jsx b/src/components/target-pane/target-pane.jsx index 551fb2b5f3d7d04627c0cf91604ce241529d5f88..31ae8848599f0e91fc03227a44399a8503850413 100644 --- a/src/components/target-pane/target-pane.jsx +++ b/src/components/target-pane/target-pane.jsx @@ -28,6 +28,8 @@ const TargetPane = ({ onChangeSpriteY, onDeleteSprite, onDuplicateSprite, + onMouseOutSprite, + onMouseOverSprite, onNewSpriteClick, onRequestCloseSpriteLibrary, onRequestCloseBackdropLibrary, @@ -55,6 +57,8 @@ const TargetPane = ({ onChangeSpriteY={onChangeSpriteY} onDeleteSprite={onDeleteSprite} onDuplicateSprite={onDuplicateSprite} + onMouseOutSprite={onMouseOutSprite} + onMouseOverSprite={onMouseOverSprite} onNewSpriteClick={onNewSpriteClick} onSelectSprite={onSelectSprite} /> @@ -117,6 +121,8 @@ TargetPane.propTypes = { onChangeSpriteY: PropTypes.func, onDeleteSprite: PropTypes.func, onDuplicateSprite: PropTypes.func, + onMouseOutSprite: PropTypes.func, + onMouseOverSprite: PropTypes.func, onNewSpriteClick: PropTypes.func, onRequestCloseBackdropLibrary: PropTypes.func, onRequestCloseExtensionLibrary: PropTypes.func, diff --git a/src/containers/sprite-selector-item.jsx b/src/containers/sprite-selector-item.jsx index bc10479b8eba18443685539b5f68a1f412a019c9..87e7db36bc4e8c979d91976a96a727b17000f8c5 100644 --- a/src/containers/sprite-selector-item.jsx +++ b/src/containers/sprite-selector-item.jsx @@ -12,7 +12,9 @@ class SpriteSelectorItem extends React.Component { bindAll(this, [ 'handleClick', 'handleDelete', - 'handleDuplicate' + 'handleDuplicate', + 'handleMouseOut', + 'handleMouseOver' ]); } handleClick (e) { @@ -30,6 +32,12 @@ class SpriteSelectorItem extends React.Component { e.stopPropagation(); // To prevent from bubbling back to handleClick this.props.onDuplicateButtonClick(this.props.id); } + handleMouseOut () { + this.props.onMouseOut(this.props.id); + } + handleMouseOver () { + this.props.onMouseOver(this.props.id); + } render () { const { /* eslint-disable no-unused-vars */ @@ -38,6 +46,8 @@ class SpriteSelectorItem extends React.Component { onClick, onDeleteButtonClick, onDuplicateButtonClick, + onMouseOut, + onMouseOver, /* eslint-enable no-unused-vars */ ...props } = this.props; @@ -46,6 +56,8 @@ class SpriteSelectorItem extends React.Component { onClick={this.handleClick} onDeleteButtonClick={onDeleteButtonClick ? this.handleDelete : null} onDuplicateButtonClick={onDuplicateButtonClick ? this.handleDuplicate : null} + onMouseOut={onMouseOut ? this.handleMouseOut : null} + onMouseOver={onMouseOver ? this.handleMouseOver : null} {...props} /> ); @@ -60,7 +72,8 @@ SpriteSelectorItem.propTypes = { onClick: PropTypes.func, onDeleteButtonClick: PropTypes.func, onDuplicateButtonClick: PropTypes.func, - onHover: PropTypes.func, + onMouseOut: PropTypes.func, + onMouseOver: PropTypes.func, selected: PropTypes.bool }; diff --git a/src/containers/target-pane.jsx b/src/containers/target-pane.jsx index acde49a4e81297d1b90a0951b78474a7e5eb5a84..53c0973a9ce09709263386cb3f44b30dab890a8f 100644 --- a/src/containers/target-pane.jsx +++ b/src/containers/target-pane.jsx @@ -23,6 +23,8 @@ class TargetPane extends React.Component { 'handleChangeSpriteY', 'handleDeleteSprite', 'handleDuplicateSprite', + 'handleMouseOutSprite', + 'handleMouseOverSprite', 'handleSelectSprite' ]); } @@ -50,6 +52,12 @@ class TargetPane extends React.Component { handleDuplicateSprite (id) { this.props.vm.duplicateSprite(id); } + handleMouseOutSprite () { + this.props.vm.setHoveredSprite(null); + } + handleMouseOverSprite (id) { + this.props.vm.setHoveredSprite(id); + } handleSelectSprite (id) { this.props.vm.setEditingTarget(id); } @@ -65,6 +73,8 @@ class TargetPane extends React.Component { onChangeSpriteY={this.handleChangeSpriteY} onDeleteSprite={this.handleDeleteSprite} onDuplicateSprite={this.handleDuplicateSprite} + onMouseOutSprite={this.handleMouseOutSprite} + onMouseOverSprite={this.handleMouseOverSprite} onSelectSprite={this.handleSelectSprite} /> );