From 0f9ebd3686a6c00c1aa42a3a7a24652e4f29a952 Mon Sep 17 00:00:00 2001
From: Paul Kaplan <pkaplan@media.mit.edu>
Date: Thu, 1 Nov 2018 09:54:31 -0400
Subject: [PATCH] Use precompute stage dimensions instead of calculating bounds
---
src/components/stage/stage.jsx | 6 +++++-
src/containers/target-highlight.jsx | 11 +++++++----
2 files changed, 12 insertions(+), 5 deletions(-)
diff --git a/src/components/stage/stage.jsx b/src/components/stage/stage.jsx
index 1cf1aed7e..ede5048ea 100644
--- a/src/components/stage/stage.jsx
+++ b/src/components/stage/stage.jsx
@@ -65,7 +65,11 @@ const StageComponent = props => {
/>
</Box>
<Box className={styles.frameWrapper}>
- <TargetHighlight className={styles.frame} />
+ <TargetHighlight
+ className={styles.frame}
+ stageHeight={stageDimensions.height}
+ stageWidth={stageDimensions.width}
+ />
</Box>
{isColorPicking && colorInfo ? (
<Box className={styles.colorPickerWrapper}>
diff --git a/src/containers/target-highlight.jsx b/src/containers/target-highlight.jsx
index a1e90aafd..9162c7ba9 100644
--- a/src/containers/target-highlight.jsx
+++ b/src/containers/target-highlight.jsx
@@ -15,11 +15,12 @@ class TargetHighlight extends React.Component {
// Transform scratch coordinates into page coordinates
getPageCoords (x, y) {
- const nativeSize = this.props.vm.renderer.getNativeSize();
- const rect = this.props.vm.renderer.canvas.getBoundingClientRect();
+ const {stageWidth, stageHeight, vm} = this.props;
+ // The renderers "nativeSize" is the [width, height] of the stage in scratch-units
+ const nativeSize = vm.renderer.getNativeSize();
return [
- ((rect.width / nativeSize[0]) * x) + (rect.width / 2),
- -((rect.height / nativeSize[1]) * y) + (rect.height / 2)
+ ((stageWidth / nativeSize[0]) * x) + (stageWidth / 2),
+ -((stageHeight / nativeSize[1]) * y) + (stageHeight / 2)
];
}
@@ -61,6 +62,8 @@ TargetHighlight.propTypes = {
className: PropTypes.string,
highlightedTargetId: PropTypes.string,
highlightedTargetTime: PropTypes.number,
+ stageHeight: PropTypes.number,
+ stageWidth: PropTypes.number,
vm: PropTypes.instanceOf(VM)
};
--
GitLab