From 85629423b8665cd8d2a7a90bed2b741c6fac3439 Mon Sep 17 00:00:00 2001
From: Eric Rosenbaum <eric.rosenbaum@gmail.com>
Date: Thu, 2 Aug 2018 10:44:53 -0400
Subject: [PATCH] Add prescan step
---
.../connection-modal/connection-modal.jsx | 3 +
.../connection-modal/prescan-step.jsx | 55 +++++++++++++++++++
src/lib/libraries/extensions/index.jsx | 15 ++++-
3 files changed, 72 insertions(+), 1 deletion(-)
create mode 100644 src/components/connection-modal/prescan-step.jsx
diff --git a/src/components/connection-modal/connection-modal.jsx b/src/components/connection-modal/connection-modal.jsx
index c6566e954..99d9a2367 100644
--- a/src/components/connection-modal/connection-modal.jsx
+++ b/src/components/connection-modal/connection-modal.jsx
@@ -5,6 +5,7 @@ import keyMirror from 'keymirror';
import Box from '../box/box.jsx';
import Modal from '../modal/modal.jsx';
+import PrescanStep from './prescan-step.jsx';
import ScanningStep from '../../containers/scanning-step.jsx';
import ConnectingStep from './connecting-step.jsx';
import ConnectedStep from './connected-step.jsx';
@@ -14,6 +15,7 @@ import UnavailableStep from './unavailable-step.jsx';
import styles from './connection-modal.css';
const PHASES = keyMirror({
+ prescan: null,
scanning: null,
connecting: null,
connected: null,
@@ -31,6 +33,7 @@ const ConnectionModalComponent = props => (
onRequestClose={props.onCancel}
>
<Box className={styles.body}>
+ {props.phase === PHASES.prescan && <PrescanStep {...props} />}
{props.phase === PHASES.scanning && <ScanningStep {...props} />}
{props.phase === PHASES.connecting && <ConnectingStep {...props} />}
{props.phase === PHASES.connected && <ConnectedStep {...props} />}
diff --git a/src/components/connection-modal/prescan-step.jsx b/src/components/connection-modal/prescan-step.jsx
new file mode 100644
index 000000000..4a902af9f
--- /dev/null
+++ b/src/components/connection-modal/prescan-step.jsx
@@ -0,0 +1,55 @@
+import {FormattedMessage} from 'react-intl';
+import PropTypes from 'prop-types';
+import React from 'react';
+
+import Box from '../box/box.jsx';
+import Dots from './dots.jsx';
+
+import radarIcon from './icons/searching.png';
+import bluetoothIcon from './icons/bluetooth-white.svg';
+
+import styles from './connection-modal.css';
+
+const PrescanStep = props => (
+ <Box className={styles.body}>
+ <Box className={styles.activityArea}>
+ <Box className={styles.centeredRow}>
+ <div className={styles.centeredRow}>
+ <img
+ className={styles.radar}
+ src={radarIcon}
+ />
+ <img
+ className={styles.bluetoothConnectingIcon}
+ src={bluetoothIcon}
+ />
+ </div>
+ </Box>
+ </Box>
+ <Box className={styles.bottomArea}>
+ <Box className={styles.instructions}>
+ {props.connectingMessage}
+ </Box>
+ <Dots
+ counter={1}
+ total={4}
+ />
+ <button
+ className={styles.connectionButton}
+ // onClick={props.onRefresh}
+ >
+ <FormattedMessage
+ defaultMessage="Search for WeDo"
+ description="Button in prompt for starting a search"
+ id="gui.connection.startSearch"
+ />
+ </button>
+ </Box>
+ </Box>
+);
+
+PrescanStep.propTypes = {
+ connectingMessage: PropTypes.node.isRequired
+};
+
+export default PrescanStep;
diff --git a/src/lib/libraries/extensions/index.jsx b/src/lib/libraries/extensions/index.jsx
index 316980efe..a972d4d6c 100644
--- a/src/lib/libraries/extensions/index.jsx
+++ b/src/lib/libraries/extensions/index.jsx
@@ -153,6 +153,19 @@ export default [
/>
),
featured: true,
- disabled: true
+ disabled: false,
+ launchDeviceConnectionFlow: true,
+ startWithPrescanStep: true,
+ deviceImage: ev3DeviceImage,
+ smallDeviceImage: ev3MenuImage,
+ connectingMessage: (
+ <FormattedMessage
+ defaultMessage="Connecting"
+ description="Message to help people connect to their WeDo."
+ id="gui.extension.wedo2.connectingMessage"
+ />
+ ),
+ helpLink: 'https://scratch.mit.edu/wedo'
+
}
];
--
GitLab