From 4fae4db6501bac54bd7678c3a74617aa620e0191 Mon Sep 17 00:00:00 2001 From: andreamah Date: Wed, 1 Apr 2020 16:35:55 -0700 Subject: [PATCH 01/12] moved debug_mode reference --- src/adafruit_circuitplayground/express.py | 5 ++--- src/adafruit_circuitplayground/pixel.py | 8 ++------ src/adafruit_circuitplayground/test/test_pixel.py | 5 ----- src/common/debugger_communication_client.py | 1 + src/common/utils.py | 2 +- src/debug_user_code.py | 4 +--- src/micropython/microbit/__model/display.py | 3 +-- src/micropython/microbit/__model/microbit_model.py | 4 ---- 8 files changed, 8 insertions(+), 24 deletions(-) diff --git a/src/adafruit_circuitplayground/express.py b/src/adafruit_circuitplayground/express.py index cc6f16dae..12c45c876 100644 --- a/src/adafruit_circuitplayground/express.py +++ b/src/adafruit_circuitplayground/express.py @@ -47,8 +47,7 @@ def __init__(self): "touch": [False] * 7, "shake": False, } - self.__debug_mode = False - self.pixels = Pixel(self.__state, self.__debug_mode) + self.pixels = Pixel(self.__state) @property def acceleration(self): @@ -114,7 +113,7 @@ def light(self): return self.__state["light"] def __show(self): - if self.__debug_mode: + if utils.debug_mode: common.debugger_communication_client.debug_send_to_simulator( self.__state, CONSTANTS.CPX ) diff --git a/src/adafruit_circuitplayground/pixel.py b/src/adafruit_circuitplayground/pixel.py index 18e0028fc..758084f59 100644 --- a/src/adafruit_circuitplayground/pixel.py +++ b/src/adafruit_circuitplayground/pixel.py @@ -12,16 +12,15 @@ class Pixel: - def __init__(self, state, debug_mode=False): + def __init__(self, state): self.__state = state self.auto_write = True - self.__debug_mode = debug_mode self.telemetry_state = False def show(self): # Send the state to the extension so that React re-renders the Webview # or send the state to the debugger (within this library) - if self.__debug_mode: + if utils.debug_mode: common.debugger_communication_client.debug_send_to_simulator( self.__state, CONSTANTS.CPX ) @@ -32,9 +31,6 @@ def __show_if_auto_write(self): if self.auto_write: self.show() - def __set_debug_mode(self, debug_mode): - self.__debug_mode = debug_mode - def __getitem__(self, index): if type(index) is not slice: if not self.__valid_index(index): diff --git a/src/adafruit_circuitplayground/test/test_pixel.py b/src/adafruit_circuitplayground/test/test_pixel.py index 2532611db..521958552 100644 --- a/src/adafruit_circuitplayground/test/test_pixel.py +++ b/src/adafruit_circuitplayground/test/test_pixel.py @@ -16,11 +16,6 @@ def setup_method(self): } ) - @pytest.mark.parametrize("debug_mode", [True, False]) - def test_set_debug_mode(self, debug_mode): - self.pixel._Pixel__set_debug_mode(debug_mode) - assert debug_mode == self.pixel._Pixel__debug_mode - def test_get_item_out_of_bounds(self): with pytest.raises(IndexError): p = self.pixel[3] diff --git a/src/common/debugger_communication_client.py b/src/common/debugger_communication_client.py index 49f2381b7..fcf2caa39 100644 --- a/src/common/debugger_communication_client.py +++ b/src/common/debugger_communication_client.py @@ -27,6 +27,7 @@ def debug_send_to_simulator(state, active_device): global previous_state if state != previous_state: + print("here!") previous_state = copy.deepcopy(state) updated_state = utils.update_state_with_device_name(state, active_device) diff --git a/src/common/utils.py b/src/common/utils.py index f78dda44d..88d457228 100644 --- a/src/common/utils.py +++ b/src/common/utils.py @@ -10,7 +10,7 @@ previous_state = {} abs_path_to_user_file = "" - +debug_mode=False def update_state_with_device_name(state, device_name): updated_state = dict(state) diff --git a/src/debug_user_code.py b/src/debug_user_code.py index 93b6ba50f..d8ecbfa50 100644 --- a/src/debug_user_code.py +++ b/src/debug_user_code.py @@ -52,9 +52,7 @@ # Init API variables utils.abs_path_to_user_file = abs_path_to_code_file -cpx._Express__debug_mode = True -cpx.pixels._Pixel__set_debug_mode(True) -mb._MicrobitModel__set_debug_mode(True) +utils.debug_mode = True # Execute the user's code file with open(abs_path_to_code_file, encoding="utf8") as user_code_file: diff --git a/src/micropython/microbit/__model/display.py b/src/micropython/microbit/__model/display.py index 1075f2c56..523811db0 100644 --- a/src/micropython/microbit/__model/display.py +++ b/src/micropython/microbit/__model/display.py @@ -21,7 +21,6 @@ def __init__(self): self.__current_pid = None self.__lock = threading.Lock() - self.__debug_mode = False def scroll(self, value, delay=150, wait=True, loop=False, monospace=False): """ @@ -352,7 +351,7 @@ def __create_scroll_image(images): def __update_client(self): sendable_json = {"leds": self.__get_array()} - if self.__debug_mode: + if common.utils.debug_mode: common.debugger_communication_client.debug_send_to_simulator( sendable_json, CONSTANTS.MICROBIT ) diff --git a/src/micropython/microbit/__model/microbit_model.py b/src/micropython/microbit/__model/microbit_model.py index bed74d9cd..f2e78eba9 100644 --- a/src/micropython/microbit/__model/microbit_model.py +++ b/src/micropython/microbit/__model/microbit_model.py @@ -98,8 +98,4 @@ def __update_gesture(self, new_state): new_gesture = new_state.get(CONSTANTS.EXPECTED_INPUT_GESTURE) self.accelerometer._Accelerometer__update_gesture(new_gesture) - def __set_debug_mode(self, mode): - self.display._Display__debug_mode = mode - - __mb = MicrobitModel() From 167a64dbea717688f604baed3852e5ff486ea962 Mon Sep 17 00:00:00 2001 From: andreamah Date: Wed, 1 Apr 2020 19:50:18 -0700 Subject: [PATCH 02/12] changed debugger to use correct mb instance --- src/common/debugger_communication_client.py | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/common/debugger_communication_client.py b/src/common/debugger_communication_client.py index 49f2381b7..23035c6f9 100644 --- a/src/common/debugger_communication_client.py +++ b/src/common/debugger_communication_client.py @@ -14,8 +14,8 @@ from adafruit_circuitplayground.express import cpx from adafruit_circuitplayground.constants import CPX -from micropython.microbit.__model.microbit_model import __mb as mb -from micropython.microbit.__model.constants import MICROBIT +from microbit.__model.microbit_model import __mb as mb +from microbit.__model.constants import MICROBIT device_dict = {CPX: cpx, MICROBIT: mb} From ebcb0cadb9d4979f4488de9782eec95425f4a067 Mon Sep 17 00:00:00 2001 From: andreamah Date: Thu, 2 Apr 2020 11:50:35 -0700 Subject: [PATCH 03/12] added debug to existing backend --- src/base_circuitpython/displayio/group.py | 8 +++++++- src/base_circuitpython/neopixel_write.py | 8 +++++++- src/clue/adafruit_slideshow.py | 9 ++++++++- 3 files changed, 22 insertions(+), 3 deletions(-) diff --git a/src/base_circuitpython/displayio/group.py b/src/base_circuitpython/displayio/group.py index 0eee8f96f..f54e12700 100644 --- a/src/base_circuitpython/displayio/group.py +++ b/src/base_circuitpython/displayio/group.py @@ -87,7 +87,13 @@ def show(self): img_str = str(byte_base64)[2:-1] sendable_json = {CONSTANTS.BASE_64: img_str} - common.utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) + + if common.utils.debug_mode: + common.debugger_communication_client.debug_send_to_simulator( + sendable_json, CONSTANTS.CLUE + ) + else: + common.utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) def __len__(self): if not self.__contents: diff --git a/src/base_circuitpython/neopixel_write.py b/src/base_circuitpython/neopixel_write.py index 8862863e8..3dd0f3000 100644 --- a/src/base_circuitpython/neopixel_write.py +++ b/src/base_circuitpython/neopixel_write.py @@ -9,6 +9,7 @@ import os from common import utils +from common import debugger_communication_client from adafruit_circuitplayground import cp import base_cp_constants as CONSTANTS @@ -30,7 +31,12 @@ def neopixel_write(gpio, buf): def send_clue(buf): sendable_json = {CONSTANTS.PIXELS: tuple(buf)} - utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) + if utils.debug_mode: + debugger_communication_client.debug_send_to_simulator( + sendable_json, CONSTANTS.CLUE + ) + else: + utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) def send_cpx(buf): diff --git a/src/clue/adafruit_slideshow.py b/src/clue/adafruit_slideshow.py index 0a0411705..a20fb1df3 100644 --- a/src/clue/adafruit_slideshow.py +++ b/src/clue/adafruit_slideshow.py @@ -8,6 +8,7 @@ import collections from random import shuffle from common import utils +from common import debugger_communication_client # taken from adafruit # https://github.com/adafruit/Adafruit_CircuitPython_Slideshow/blob/master/adafruit_slideshow.py @@ -314,4 +315,10 @@ def _send(self, img): img_str = str(byte_base64)[2:-1] sendable_json = {CONSTANTS.BASE_64: img_str} - utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) + + if utils.debug_mode: + debugger_communication_client.debug_send_to_simulator( + sendable_json, CONSTANTS.CLUE + ) + else: + utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) From 1de20b9e5b440dd734141d0c8d003ddc052808bf Mon Sep 17 00:00:00 2001 From: andreamah Date: Thu, 2 Apr 2020 15:07:52 -0700 Subject: [PATCH 04/12] merge conflicts --- src/clue/adafruit_slideshow.py | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/clue/adafruit_slideshow.py b/src/clue/adafruit_slideshow.py index 252944ab2..72fa0e170 100644 --- a/src/clue/adafruit_slideshow.py +++ b/src/clue/adafruit_slideshow.py @@ -8,11 +8,8 @@ import collections from random import shuffle from common import utils -<<<<<<< HEAD from common import debugger_communication_client -======= import board ->>>>>>> users/t-xunguy/clue-sensors # taken from adafruit # https://github.com/adafruit/Adafruit_CircuitPython_Slideshow/blob/master/adafruit_slideshow.py From 026244ebbf38704a28675039b2d0ab596e916d2b Mon Sep 17 00:00:00 2001 From: andreamah Date: Thu, 2 Apr 2020 15:39:35 -0700 Subject: [PATCH 05/12] debug update state for backend --- src/base_circuitpython/neopixel_write.py | 9 ++++----- src/common/debugger_communication_client.py | 5 +++-- src/debug_user_code.py | 10 ++++++---- 3 files changed, 13 insertions(+), 11 deletions(-) diff --git a/src/base_circuitpython/neopixel_write.py b/src/base_circuitpython/neopixel_write.py index 3dd0f3000..341215f35 100644 --- a/src/base_circuitpython/neopixel_write.py +++ b/src/base_circuitpython/neopixel_write.py @@ -8,8 +8,7 @@ import sys import os -from common import utils -from common import debugger_communication_client +import common from adafruit_circuitplayground import cp import base_cp_constants as CONSTANTS @@ -31,12 +30,12 @@ def neopixel_write(gpio, buf): def send_clue(buf): sendable_json = {CONSTANTS.PIXELS: tuple(buf)} - if utils.debug_mode: - debugger_communication_client.debug_send_to_simulator( + if common.utils.debug_mode: + common.debugger_communication_client.debug_send_to_simulator( sendable_json, CONSTANTS.CLUE ) else: - utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) + common.utils.send_to_simulator(sendable_json, CONSTANTS.CLUE) def send_cpx(buf): diff --git a/src/common/debugger_communication_client.py b/src/common/debugger_communication_client.py index 8b507bc0c..0223e091e 100644 --- a/src/common/debugger_communication_client.py +++ b/src/common/debugger_communication_client.py @@ -17,8 +17,10 @@ from microbit.__model.microbit_model import __mb as mb from microbit.__model.constants import MICROBIT +from base_circuitpython.base_cp_constants import CLUE +from adafruit_clue import clue -device_dict = {CPX: cpx, MICROBIT: mb} +device_dict = {CPX: cpx, MICROBIT: mb, CLUE: clue} processing_state_event = threading.Event() previous_state = {} @@ -27,7 +29,6 @@ def debug_send_to_simulator(state, active_device): global previous_state if state != previous_state: - print("here!") previous_state = copy.deepcopy(state) updated_state = utils.update_state_with_device_name(state, active_device) diff --git a/src/debug_user_code.py b/src/debug_user_code.py index d8ecbfa50..7e534f479 100644 --- a/src/debug_user_code.py +++ b/src/debug_user_code.py @@ -26,15 +26,17 @@ ) sys.path.insert(0, abs_path_to_micropython_lib) +# Insert absolute path to library for CLUE into sys.path +sys.path.insert(0, os.path.join(abs_path_to_parent_dir, CONSTANTS.CLUE)) + +# Insert absolute path to Circuitpython libraries for CLUE into sys.path +sys.path.insert(0, os.path.join(abs_path_to_parent_dir, CONSTANTS.CIRCUITPYTHON)) + # This import must happen after the sys.path is modified -from adafruit_circuitplayground.express import cpx -from microbit.__model.microbit_model import __mb as mb from common import debugger_communication_client - ## Execute User Code ## - # Get user's code path abs_path_to_code_file = "" if len(sys.argv) > 1 and sys.argv[1]: From f027269e942112859f9e216f1c28a1f5cb595801 Mon Sep 17 00:00:00 2001 From: xnkevinnguyen Date: Fri, 3 Apr 2020 10:37:27 -0700 Subject: [PATCH 06/12] Configure proper flow for keys shortcuts on debug --- src/view/components/clue/ClueImage.tsx | 8 ++------ src/view/components/clue/ClueSimulator.tsx | 17 +++++++++++++---- src/view/components/microbit/MicrobitImage.tsx | 9 +++------ .../components/microbit/MicrobitSimulator.tsx | 17 +++++++++++++---- src/view/constants.ts | 4 ++++ 5 files changed, 35 insertions(+), 20 deletions(-) diff --git a/src/view/components/clue/ClueImage.tsx b/src/view/components/clue/ClueImage.tsx index 402572c95..b191732da 100644 --- a/src/view/components/clue/ClueImage.tsx +++ b/src/view/components/clue/ClueImage.tsx @@ -2,7 +2,7 @@ // Licensed under the MIT license. import * as React from "react"; -import { VIEW_STATE } from "../../constants"; +import { VIEW_STATE, BUTTON_CLASSNAME } from "../../constants"; import CONSTANTS, { BUTTON_STYLING_CLASSES } from "../../constants"; import { ViewStateContext } from "../../context"; import { ClueSvg, IRefObject } from "./Clue_svg"; @@ -19,11 +19,6 @@ interface IProps { neopixel: number[]; } -const BUTTON_CLASSNAME = { - ACTIVE: "sim-button-outer", - DEACTIVATED: "sim-button-deactivated", -}; - export enum BUTTONS_KEYS { BTN_A = "BTN_A", BTN_B = "BTN_B", @@ -118,6 +113,7 @@ const setupButton = ( eventTriggers: EventTriggers, key: string ) => { + buttonElement.setAttribute("class", BUTTON_CLASSNAME.ACTIVE); buttonElement.onmousedown = e => { buttonElement.focus(); eventTriggers.onMouseDown(e, key); diff --git a/src/view/components/clue/ClueSimulator.tsx b/src/view/components/clue/ClueSimulator.tsx index 3fd03cfc2..9bde7e152 100644 --- a/src/view/components/clue/ClueSimulator.tsx +++ b/src/view/components/clue/ClueSimulator.tsx @@ -6,12 +6,14 @@ import { DEFAULT_IMG_CLUE, DEVICE_LIST_KEY, WEBVIEW_MESSAGES, + VIEW_STATE, } from "../../constants"; import PlayLogo from "../../svgs/play_svg"; import StopLogo from "../../svgs/stop_svg"; import { sendMessage } from "../../utils/MessageUtils"; import ActionBar from "../simulator/ActionBar"; import { BUTTONS_KEYS, ClueImage } from "./ClueImage"; +import { ViewStateContext } from "../../context"; export const DEFAULT_CLUE_STATE: IClueState = { buttons: { button_a: false, button_b: false }, @@ -215,7 +217,10 @@ export class ClueSimulator extends React.Component { }; protected onKeyEvent(event: KeyboardEvent, active: boolean, key: string) { event.stopPropagation(); - if ([event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.ENTER)) { + if ( + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.ENTER) && + this.context === VIEW_STATE.RUNNING + ) { this.handleButtonClick(key, active); if (this.imageRef.current) { if (key === BUTTONS_KEYS.BTN_A) { @@ -236,7 +241,8 @@ export class ClueSimulator extends React.Component { } } } else if ( - [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.A) + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.A) && + this.context === VIEW_STATE.RUNNING ) { this.handleButtonClick(BUTTONS_KEYS.BTN_A, active); if (this.imageRef.current) { @@ -246,7 +252,8 @@ export class ClueSimulator extends React.Component { ); } } else if ( - [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.B) + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.B) && + this.context === VIEW_STATE.RUNNING ) { this.handleButtonClick(BUTTONS_KEYS.BTN_B, active); if (this.imageRef.current) { @@ -256,7 +263,8 @@ export class ClueSimulator extends React.Component { ); } } else if ( - [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.C) + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.C) && + this.context === VIEW_STATE.RUNNING ) { this.handleButtonClick(BUTTONS_KEYS.BTN_AB, active); if (this.imageRef.current) { @@ -272,3 +280,4 @@ export class ClueSimulator extends React.Component { } } } +ClueSimulator.contextType = ViewStateContext; diff --git a/src/view/components/microbit/MicrobitImage.tsx b/src/view/components/microbit/MicrobitImage.tsx index 1b1cb9af3..d2dc157cf 100644 --- a/src/view/components/microbit/MicrobitImage.tsx +++ b/src/view/components/microbit/MicrobitImage.tsx @@ -2,7 +2,7 @@ // Licensed under the MIT license. import * as React from "react"; -import { VIEW_STATE } from "../../constants"; +import { VIEW_STATE, BUTTON_CLASSNAME } from "../../constants"; import CONSTANTS, { BUTTON_STYLING_CLASSES } from "../../constants"; import { ViewStateContext } from "../../context"; import { IRefObject, MicrobitSvg } from "./Microbit_svg"; @@ -18,11 +18,6 @@ interface IProps { leds: number[][]; } -const BUTTON_CLASSNAME = { - ACTIVE: "sim-button-outer", - DEACTIVATED: "sim-button-deactivated", -}; - export enum BUTTONS_KEYS { BTN_A = "BTN_A", BTN_B = "BTN_B", @@ -113,6 +108,8 @@ const setupButton = ( eventTriggers: EventTriggers, key: string ) => { + buttonElement.setAttribute("class", BUTTON_CLASSNAME.ACTIVE); + buttonElement.onmousedown = e => { buttonElement.focus(); eventTriggers.onMouseDown(e, key); diff --git a/src/view/components/microbit/MicrobitSimulator.tsx b/src/view/components/microbit/MicrobitSimulator.tsx index 0a658298c..9b86f8c92 100644 --- a/src/view/components/microbit/MicrobitSimulator.tsx +++ b/src/view/components/microbit/MicrobitSimulator.tsx @@ -4,12 +4,14 @@ import { CONSTANTS, DEVICE_LIST_KEY, WEBVIEW_MESSAGES, + VIEW_STATE, } from "../../constants"; import PlayLogo from "../../svgs/play_svg"; import StopLogo from "../../svgs/stop_svg"; import { sendMessage } from "../../utils/MessageUtils"; import ActionBar from "../simulator/ActionBar"; import { BUTTONS_KEYS, MicrobitImage } from "./MicrobitImage"; +import { ViewStateContext } from "../../context"; const DEFAULT_MICROBIT_STATE: IMicrobitState = { leds: [ @@ -198,7 +200,10 @@ export class MicrobitSimulator extends React.Component { }; protected onKeyEvent(event: KeyboardEvent, active: boolean, key: string) { event.stopPropagation(); - if ([event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.ENTER)) { + if ( + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.ENTER) && + this.context === VIEW_STATE.RUNNING + ) { this.handleButtonClick(key, active); if (this.imageRef.current) { if (key === BUTTONS_KEYS.BTN_A) { @@ -219,7 +224,8 @@ export class MicrobitSimulator extends React.Component { } } } else if ( - [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.A) + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.A) && + this.context === VIEW_STATE.RUNNING ) { this.handleButtonClick(BUTTONS_KEYS.BTN_A, active); if (this.imageRef.current) { @@ -229,7 +235,8 @@ export class MicrobitSimulator extends React.Component { ); } } else if ( - [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.B) + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.B) && + this.context === VIEW_STATE.RUNNING ) { this.handleButtonClick(BUTTONS_KEYS.BTN_B, active); if (this.imageRef.current) { @@ -239,7 +246,8 @@ export class MicrobitSimulator extends React.Component { ); } } else if ( - [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.C) + [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.C) && + this.context === VIEW_STATE.RUNNING ) { this.handleButtonClick(BUTTONS_KEYS.BTN_AB, active); if (this.imageRef.current) { @@ -255,3 +263,4 @@ export class MicrobitSimulator extends React.Component { } } } +MicrobitSimulator.contextType = ViewStateContext; diff --git a/src/view/constants.ts b/src/view/constants.ts index b48f256a2..1eb22793e 100644 --- a/src/view/constants.ts +++ b/src/view/constants.ts @@ -53,6 +53,10 @@ export const AB_BUTTONS_KEYS = { BTN_B: "BTN_B", BTN_AB: "BTN_AB", }; +export const BUTTON_CLASSNAME = { + ACTIVE: "sim-button-group", + DEACTIVATED: "sim-button-group-deactivated", +}; export const BUTTON_STYLING_CLASSES = { DEFAULT: "sim-button-outer", KEYPRESSED: "sim-button-key-press", From f68ca8c8db04d390cbb4cc3694b42287eb1f2f37 Mon Sep 17 00:00:00 2001 From: xnkevinnguyen Date: Fri, 3 Apr 2020 10:37:49 -0700 Subject: [PATCH 07/12] Modify Css to show deactivated state --- src/view/styles/SimulatorSvg.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/view/styles/SimulatorSvg.css b/src/view/styles/SimulatorSvg.css index 9e9deb4fb..ca52367aa 100644 --- a/src/view/styles/SimulatorSvg.css +++ b/src/view/styles/SimulatorSvg.css @@ -19,7 +19,7 @@ svg.sim.grayscale { pointer-events: none; fill: "rgb(17, 17, 17)"; } -.sim-button:active { +.sim-button-group > .sim-button:active { fill: orange; } .sim-text-outside { @@ -31,11 +31,11 @@ svg.sim.grayscale { sim-button { fill: #111; } -.sim-button-outer:hover { +.sim-button-group > .sim-button-outer:hover { stroke: orange; stroke-width: 4px; } -.sim-button-outer:active { +.sim-button-group > .sim-button-outer:active { fill: orange; } .sim-button-outer { From 8bedb6271cf95c6785d905f5785e0643fe802133 Mon Sep 17 00:00:00 2001 From: xnkevinnguyen Date: Tue, 7 Apr 2020 13:40:23 -0700 Subject: [PATCH 08/12] Freeze gesture button --- src/view/components/toolbar/SensorButton.tsx | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/src/view/components/toolbar/SensorButton.tsx b/src/view/components/toolbar/SensorButton.tsx index 75f93b2fb..568bb21f1 100644 --- a/src/view/components/toolbar/SensorButton.tsx +++ b/src/view/components/toolbar/SensorButton.tsx @@ -4,25 +4,32 @@ import * as React from "react"; import "../../styles/SensorButton.css"; import { ISensorButtonProps } from "../../viewUtils"; +import { ViewStateContext } from "../../context"; +import { VIEW_STATE } from "../../constants"; class SensorButton extends React.Component { private buttonRef: React.RefObject = React.createRef(); public setButtonClass = (isActive: boolean) => { - if (isActive) { - this.buttonRef!.current!.setAttribute( + const isInputDisabled = this.context === VIEW_STATE.PAUSE; + + if (isActive && !isInputDisabled && this.buttonRef.current) { + this.buttonRef.current.setAttribute( "class", "sensor-button active-button" ); - } else { + } else if (this.buttonRef.current) { this.buttonRef!.current!.setAttribute("class", "sensor-button"); } }; render() { + const isInputDisabled = this.context === VIEW_STATE.PAUSE; + return (