diff --git a/package.json b/package.json index a350d05..0f00d0d 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "qrcode.react": "^3.1.0", "react": "^17.0.2", "react-cookie-consent": "^7.2.1", + "react-country-flag": "^3.0.2", "react-dom": "^17.0.2", "react-markdown": "^8.0.0", "react-markdown-editor-lite": "^1.3.3", diff --git a/src/components/Blockly/msg/en/io.js b/src/components/Blockly/msg/en/io.js index b261d66..a86c122 100644 --- a/src/components/Blockly/msg/en/io.js +++ b/src/components/Blockly/msg/en/io.js @@ -13,8 +13,8 @@ export const IO = { ARD_DIGITALREAD_TIP: "Read digital value on a pin: HIGH or LOW", ARD_DIGITALWRITE: "set digitial pin#", ARD_DIGITALWRITE_TIP: "Write digital value HIGH or LOW to a specific Port", - ARD_FUN_RUN_LOOP: "Arduino loop forever:", - ARD_FUN_RUN_SETUP: "Arduino run first:", + ARD_FUN_RUN_LOOP: "Loop()", + ARD_FUN_RUN_SETUP: "Setup()", ARD_FUN_RUN_TIP: "Defines the Arduino setup() and loop() functions.", ARD_HIGH: "HIGH", ARD_HIGHLOW_TIP: "Set a pin state logic High or Low.", diff --git a/src/components/Navbar.js b/src/components/Navbar.js index 228e7bb..2f122f9 100644 --- a/src/components/Navbar.js +++ b/src/components/Navbar.js @@ -41,6 +41,7 @@ import { import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import * as Blockly from "blockly"; import Tooltip from "@material-ui/core/Tooltip"; +import NavbarSettings from "./NavbarSettings"; const styles = (theme) => ({ drawerWidth: { @@ -127,6 +128,7 @@ class Navbar extends Component { + {isTutorial ? ( { this.openTour(); }} - style={{ margin: "0 30px 0 auto" }} + style={{ margin: "0 30px 0 0" }} > @@ -163,7 +165,7 @@ class Navbar extends Component { onClick={() => { this.openTour(); }} - style={{ margin: "0 30px 0 auto" }} + style={{ margin: "0 30px 0 0" }} > @@ -214,11 +216,11 @@ class Navbar extends Component { {[ - { - text: Blockly.Msg.navbar_blockly, - icon: faPuzzlePiece, - link: "/", - }, + { + text: Blockly.Msg.navbar_blockly, + icon: faPuzzlePiece, + link: "/", + }, { text: Blockly.Msg.navbar_tutorials, icon: faChalkboardTeacher, @@ -329,9 +331,9 @@ class Navbar extends Component { onClick={ item.function ? () => { - item.function(); - this.toggleDrawer(); - } + item.function(); + this.toggleDrawer(); + } : this.toggleDrawer } > diff --git a/src/components/NavbarSettings.js b/src/components/NavbarSettings.js new file mode 100644 index 0000000..0b150e1 --- /dev/null +++ b/src/components/NavbarSettings.js @@ -0,0 +1,68 @@ +import React, { Component } from 'react'; +import { connect } from 'react-redux'; +import { setLanguage } from '../actions/generalActions'; +import MenuItem from '@material-ui/core/MenuItem'; +import Select from '@material-ui/core/Select'; +import { setBoard } from '../actions/boardAction'; +import ReactCountryFlag from "react-country-flag"; + +class NavbarSettings extends Component { + componentDidMount() { + // Ensure that Blockly.setLocale is adopted in the component. + // Otherwise, the text will not be displayed until the next update of the component. + this.forceUpdate(); + } + + handleChange = (event) => { + this.props.setLanguage(event.target.value); + } + + render() { + return ( + + + this.props.setBoard(e.target.value)} + disableUnderline={true} + > + senseBox MCU + senseBox MCU mini + + + + null} + > + + + + + + + + + + ); + } +} + +const mapStateToProps = state => ({ + language: state.general.language, + selectedBoard: state.board.board +}); + +export default connect(mapStateToProps, { setLanguage, setBoard })(NavbarSettings);