From 98303e31b7f4a53a90882688806a19fc0cc51c96 Mon Sep 17 00:00:00 2001
From: Paul Kaplan <pkaplan@media.mit.edu>
Date: Fri, 26 Oct 2018 10:58:42 -0400
Subject: [PATCH] Only dispatch targetsUpdate events if the full editor is
visible
We do not need these events when in fullscreen or player mode, and even if they do not change anything, the dispatch takes time.
This also re-requests a vm.emitTargetsUpdate when transitioning from fullscreen/player back to editor mode to make sure the most recent data is shown.
---
src/lib/vm-listener-hoc.jsx | 26 +++++++++++++++++++++-----
1 file changed, 21 insertions(+), 5 deletions(-)
diff --git a/src/lib/vm-listener-hoc.jsx b/src/lib/vm-listener-hoc.jsx
index ad6a9f912..5e18cdaf1 100644
--- a/src/lib/vm-listener-hoc.jsx
+++ b/src/lib/vm-listener-hoc.jsx
@@ -23,7 +23,8 @@ const vmListenerHOC = function (WrappedComponent) {
super(props);
bindAll(this, [
'handleKeyDown',
- 'handleKeyUp'
+ 'handleKeyUp',
+ 'handleTargetsUpdate'
]);
// We have to start listening to the vm here rather than in
// componentDidMount because the HOC mounts the wrapped component,
@@ -31,7 +32,7 @@ const vmListenerHOC = function (WrappedComponent) {
// mounts.
// If the wrapped component uses the vm in componentDidMount, then
// we need to start listening before mounting the wrapped component.
- this.props.vm.on('targetsUpdate', this.props.onTargetsUpdate);
+ this.props.vm.on('targetsUpdate', this.handleTargetsUpdate);
this.props.vm.on('MONITORS_UPDATE', this.props.onMonitorsUpdate);
this.props.vm.on('BLOCK_DRAG_UPDATE', this.props.onBlockDragUpdate);
this.props.vm.on('TURBO_MODE_ON', this.props.onTurboModeOn);
@@ -49,9 +50,15 @@ const vmListenerHOC = function (WrappedComponent) {
}
this.props.vm.postIOData('userData', {username: this.props.username});
}
- componentWillReceiveProps (newProps) {
- if (newProps.username !== this.props.username) {
- this.props.vm.postIOData('userData', {username: newProps.username});
+ componentDidUpdate (prevProps) {
+ if (prevProps.username !== this.props.username) {
+ this.props.vm.postIOData('userData', {username: this.props.username});
+ }
+
+ // Re-request a targets update when the shouldEmitTargetsUpdate state changes to true
+ // i.e. when the editor transitions out of fullscreen/player only modes
+ if (this.props.shouldEmitTargetsUpdate && !prevProps.shouldEmitTargetsUpdate) {
+ this.props.vm.emitTargetsUpdate();
}
}
componentWillUnmount () {
@@ -61,6 +68,11 @@ const vmListenerHOC = function (WrappedComponent) {
document.removeEventListener('keyup', this.handleKeyUp);
}
}
+ handleTargetsUpdate (data) {
+ if (this.props.shouldEmitTargetsUpdate) {
+ this.props.onTargetsUpdate(data);
+ }
+ }
handleKeyDown (e) {
// Don't capture keys intended for Blockly inputs.
if (e.target !== document && e.target !== document.body) return;
@@ -89,6 +101,7 @@ const vmListenerHOC = function (WrappedComponent) {
const {
/* eslint-disable no-unused-vars */
attachKeyboardEvents,
+ shouldEmitTargetsUpdate,
username,
onBlockDragUpdate,
onKeyDown,
@@ -120,6 +133,7 @@ const vmListenerHOC = function (WrappedComponent) {
onTargetsUpdate: PropTypes.func.isRequired,
onTurboModeOff: PropTypes.func.isRequired,
onTurboModeOn: PropTypes.func.isRequired,
+ shouldEmitTargetsUpdate: PropTypes.bool,
username: PropTypes.string,
vm: PropTypes.instanceOf(VM).isRequired
};
@@ -127,6 +141,8 @@ const vmListenerHOC = function (WrappedComponent) {
attachKeyboardEvents: true
};
const mapStateToProps = state => ({
+ // Do not emit target updates in fullscreen or player only mode
+ shouldEmitTargetsUpdate: !state.scratchGui.mode.isFullScreen && !state.scratchGui.mode.isPlayerOnly,
vm: state.scratchGui.vm,
username: state.session && state.session.session && state.session.session.user ?
state.session.session.user.username : ''
--
GitLab