From 5251b07e98b3a949b7a45838511b5b2f03231a40 Mon Sep 17 00:00:00 2001
From: Ray Schamp <ray@scratch.mit.edu>
Date: Wed, 28 Sep 2016 10:17:54 -0400
Subject: [PATCH] Add "stop" skeleton component
---
src/components/green-flag.js | 7 ++++++-
src/components/gui.js | 2 ++
src/components/stop-all.js | 30 ++++++++++++++++++++++++++++++
3 files changed, 38 insertions(+), 1 deletion(-)
create mode 100644 src/components/stop-all.js
diff --git a/src/components/green-flag.js b/src/components/green-flag.js
index 0d30a3c3b..c7f9e6d14 100644
--- a/src/components/green-flag.js
+++ b/src/components/green-flag.js
@@ -12,14 +12,19 @@ class GreenFlag extends React.Component {
render () {
return (
<div className="scratch-green-flag">
- <button onClick={this.onClick}></button>
+ <button onClick={this.onClick}>{this.props.title}</button>
</div>
);
}
}
GreenFlag.propTypes = {
+ title: React.PropTypes.string,
vm: React.PropTypes.object
};
+GreenFlag.defaultProps = {
+ title: 'Go'
+};
+
module.exports = GreenFlag;
diff --git a/src/components/gui.js b/src/components/gui.js
index fab66e2cb..b29aa7d50 100644
--- a/src/components/gui.js
+++ b/src/components/gui.js
@@ -5,6 +5,7 @@ const GreenFlag = require('./green-flag');
const Renderer = require('scratch-render');
const SpriteSelector = require('./sprite-selector');
const Stage = require('./stage');
+const StopAll = require('./stop-all');
const Toolbox = require('./toolbox');
const VM = require('scratch-vm');
const VMManager = require('../lib/vm-manager');
@@ -40,6 +41,7 @@ class GUI extends React.Component {
return (
<div className="scratch-gui">
<GreenFlag vm={this.props.vm} />
+ <StopAll vm={this.props.vm} />
<Stage stageRef={stage => this.stage = stage} />
<SpriteSelector vm={this.props.vm} />
<Toolbox toolboxRef={toolbox => this.toolbox = toolbox} />
diff --git a/src/components/stop-all.js b/src/components/stop-all.js
new file mode 100644
index 000000000..8f9f73f43
--- /dev/null
+++ b/src/components/stop-all.js
@@ -0,0 +1,30 @@
+const React = require('react');
+
+class StopAll extends React.Component {
+ constructor (props) {
+ super(props);
+ this.onClick = this.onClick.bind(this);
+ }
+ onClick (e) {
+ e.preventDefault();
+ this.props.vm.stopAll();
+ }
+ render () {
+ return (
+ <div className="scratch-stop-all">
+ <button onClick={this.onClick}>{this.props.title}</button>
+ </div>
+ );
+ }
+}
+
+StopAll.propTypes = {
+ title: React.PropTypes.string,
+ vm: React.PropTypes.object
+};
+
+StopAll.defaultProps = {
+ title: 'Stop'
+};
+
+module.exports = StopAll;
--
GitLab