From 258f0f08412d7cdfaee121f8a80a8c3634373125 Mon Sep 17 00:00:00 2001
From: Mario Pesch <mario.pesch@uni-muenster.de>
Date: Mon, 13 Dec 2021 15:35:25 +0100
Subject: [PATCH 1/2] add sound selector

---
 src/actions/generalActions.js             | 16 +++++-
 src/actions/types.js                      |  1 +
 src/components/Blockly/BlocklyWindow.js   |  3 ++
 src/components/Blockly/msg/de/ui.js       |  3 ++
 src/components/Blockly/msg/en/ui.js       |  5 +-
 src/components/Blockly/toolbox/Toolbox.js |  2 +-
 src/components/Settings/Settings.js       |  4 ++
 src/components/Settings/SoundsSelector.js | 63 +++++++++++++++++++++++
 src/reducers/generalReducer.js            | 16 ++++++
 9 files changed, 110 insertions(+), 3 deletions(-)
 create mode 100644 src/components/Settings/SoundsSelector.js

diff --git a/src/actions/generalActions.js b/src/actions/generalActions.js
index f4dd22f..346d9f7 100644
--- a/src/actions/generalActions.js
+++ b/src/actions/generalActions.js
@@ -1,4 +1,11 @@
-import { VISIT, LANGUAGE, RENDERER, STATISTICS, PLATFORM } from "./types";
+import {
+  VISIT,
+  LANGUAGE,
+  RENDERER,
+  SOUNDS,
+  STATISTICS,
+  PLATFORM,
+} from "./types";
 
 export const visitPage = () => (dispatch) => {
   dispatch({
@@ -30,6 +37,13 @@ export const setRenderer = (renderer) => (dispatch) => {
   });
 };
 
+export const setSounds = (sounds) => (dispatch) => {
+  dispatch({
+    type: SOUNDS,
+    payload: sounds,
+  });
+};
+
 export const setStatistics = (showStatistics) => (dispatch) => {
   dispatch({
     type: STATISTICS,
diff --git a/src/actions/types.js b/src/actions/types.js
index 223154d..6a10987 100644
--- a/src/actions/types.js
+++ b/src/actions/types.js
@@ -45,6 +45,7 @@ export const VISIT = "VISIT";
 export const LANGUAGE = "LANGUAGE";
 export const PLATFORM = "PLATFORM";
 export const RENDERER = "RENDERER";
+export const SOUNDS = "SOUNDS";
 export const STATISTICS = "STATISTICS";
 
 // messages
diff --git a/src/components/Blockly/BlocklyWindow.js b/src/components/Blockly/BlocklyWindow.js
index 5580abe..c69fc9d 100644
--- a/src/components/Blockly/BlocklyWindow.js
+++ b/src/components/Blockly/BlocklyWindow.js
@@ -72,6 +72,7 @@ class BlocklyWindow extends Component {
             this.props.trashcan !== undefined ? this.props.trashcan : true
           }
           renderer={this.props.renderer}
+          sounds={this.props.sounds}
           maxInstances={getMaxInstances()}
           zoom={{
             // https://developers.google.com/blockly/guides/configure/web/zoom
@@ -123,11 +124,13 @@ BlocklyWindow.propTypes = {
   onChangeWorkspace: PropTypes.func.isRequired,
   clearStats: PropTypes.func.isRequired,
   renderer: PropTypes.string.isRequired,
+  sounds: PropTypes.string.isRequired,
   language: PropTypes.string.isRequired,
 };
 
 const mapStateToProps = (state) => ({
   renderer: state.general.renderer,
+  sounds: state.general.sounds,
   language: state.general.language,
 });
 
diff --git a/src/components/Blockly/msg/de/ui.js b/src/components/Blockly/msg/de/ui.js
index 545208f..db7da8f 100644
--- a/src/components/Blockly/msg/de/ui.js
+++ b/src/components/Blockly/msg/de/ui.js
@@ -177,6 +177,9 @@ export const UI = {
     "Der Tablet Modus deaktiviert die Code anzeige und aktiviert die Möglichkeit den Programmcode über die senseBox Connect App zu übertragen. Weitere Informationen dazu findest du unter: ",
   settings_ota_on: "Aktiviert",
   settings_ota_off: "Deaktiviert",
+  settings_sounds: "Töne",
+  settings_sounds_text:
+    "Aktiviere oder Deaktiviere Töne beim hinzufügen und löschen von Blöcken. Standardmäßig deaktiviert",
 
   /**
    * 404
diff --git a/src/components/Blockly/msg/en/ui.js b/src/components/Blockly/msg/en/ui.js
index b573b00..79708da 100644
--- a/src/components/Blockly/msg/en/ui.js
+++ b/src/components/Blockly/msg/en/ui.js
@@ -167,11 +167,14 @@ export const UI = {
     "The display of statistics on the usage of the blocks above the workspace can be shown or hidden.",
   settings_statistics_on: "On",
   settings_statistics_off: "Off",
-  settings_ota_head: "tablet mode",
+  settings_ota_head: "Tablet mode",
   settings_ota_text:
     "Tablet mode disables the code display and enables the possibility to transfer the program code via the senseBox Connect app. You can find more information on: ",
   settings_ota_on: "Activated",
   settings_ota_off: "Deactivated",
+  settings_sounds: "Sound",
+  settings_sounds_text:
+    "Enable or disable sounds when adding and deleting blocks. Disabled by default",
 
   /**
    * 404
diff --git a/src/components/Blockly/toolbox/Toolbox.js b/src/components/Blockly/toolbox/Toolbox.js
index 0c1f6e3..9186bc8 100644
--- a/src/components/Blockly/toolbox/Toolbox.js
+++ b/src/components/Blockly/toolbox/Toolbox.js
@@ -94,7 +94,7 @@ class Toolbox extends React.Component {
           <Block type="sensebox_wifi" />
           <Block type="sensebox_wifi_status" />
           <Block type="sensebox_wifi_rssi" />
-          <Block type="sensebox_wifi_ip" />
+          <Block type="sensebox_get_ip" />
           <Block type="sensebox_startap" />
         </Category>
         <Category name="SD" colour={getColour().sensebox}>
diff --git a/src/components/Settings/Settings.js b/src/components/Settings/Settings.js
index ac1a538..ad1dde6 100644
--- a/src/components/Settings/Settings.js
+++ b/src/components/Settings/Settings.js
@@ -11,6 +11,7 @@ import LanguageSelector from "./LanguageSelector";
 import RenderSelector from "./RenderSelector";
 import StatsSelector from "./StatsSelector";
 import OtaSelector from "./OtaSelector";
+import SoundsSelector from "./SoundsSelector";
 
 import Button from "@material-ui/core/Button";
 import Paper from "@material-ui/core/Paper";
@@ -48,6 +49,9 @@ class Settings extends Component {
         <Paper style={{ margin: "10px 0px", padding: "10px" }}>
           <OtaSelector />
         </Paper>
+        <Paper style={{ margin: "10px 0px", padding: "10px" }}>
+          <SoundsSelector />
+        </Paper>
 
         <Button
           style={{ marginTop: "10px" }}
diff --git a/src/components/Settings/SoundsSelector.js b/src/components/Settings/SoundsSelector.js
new file mode 100644
index 0000000..07685a0
--- /dev/null
+++ b/src/components/Settings/SoundsSelector.js
@@ -0,0 +1,63 @@
+import React, { Component } from "react";
+import PropTypes from "prop-types";
+import { connect } from "react-redux";
+import { setSounds } from "../../actions/generalActions";
+
+import * as Blockly from "blockly/core";
+
+import InputLabel from "@material-ui/core/InputLabel";
+import MenuItem from "@material-ui/core/MenuItem";
+import FormControl from "@material-ui/core/FormControl";
+import Select from "@material-ui/core/Select";
+import Typography from "@material-ui/core/Typography";
+import FormHelperText from "@material-ui/core/FormHelperText";
+
+class SoundsSelector 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();
+  }
+
+  render() {
+    return (
+      <div>
+        <Typography style={{ fontWeight: "bold" }}>
+          {Blockly.Msg.settings_sounds}
+        </Typography>
+        <FormHelperText
+          style={{ color: "black", lineHeight: 1.3, marginBottom: "8px" }}
+        >
+          {Blockly.Msg.settings_sounds_text}
+        </FormHelperText>
+        <FormControl>
+          <InputLabel id="demo-simple-select-label">
+            {Blockly.Msg.settings_sounds}
+          </InputLabel>
+          <Select
+            labelId="demo-simple-select-label"
+            id="demo-simple-select"
+            value={this.props.sounds}
+            onChange={(e) => this.props.setSounds(e.target.value)}
+          >
+            <MenuItem value={false}>{Blockly.Msg.settings_ota_off}</MenuItem>
+            <MenuItem value={true}>{Blockly.Msg.settings_ota_on}</MenuItem>
+          </Select>
+        </FormControl>
+      </div>
+    );
+  }
+}
+
+SoundsSelector.propTypes = {
+  setSounds: PropTypes.func.isRequired,
+  language: PropTypes.string.isRequired,
+  sounds: PropTypes.string.isRequired,
+};
+
+const mapStateToProps = (state) => ({
+  sounds: state.general.sounds,
+  language: state.general.language,
+});
+
+export default connect(mapStateToProps, { setSounds })(SoundsSelector);
diff --git a/src/reducers/generalReducer.js b/src/reducers/generalReducer.js
index 555d093..1d1acfe 100644
--- a/src/reducers/generalReducer.js
+++ b/src/reducers/generalReducer.js
@@ -2,6 +2,7 @@ import {
   VISIT,
   LANGUAGE,
   RENDERER,
+  SOUNDS,
   STATISTICS,
   PLATFORM,
 } from "../actions/types";
@@ -20,6 +21,14 @@ const initialPlatform = () => {
   return getPlatform();
 };
 
+const initialSounds = () => {
+  if (window.localStorage.getItem("sounds")) {
+    return window.localStorage.getItem("sounds");
+  } else {
+    return "off";
+  }
+};
+
 const getPlatform = () => {
   if (window.localStorage.getItem("platform")) {
     return JSON.parse(window.localStorage.getItem("platform"));
@@ -62,6 +71,7 @@ const initialState = {
   pageVisits: 0, // detect if previous URL was
   language: initialLanguage(),
   renderer: initialRenderer(),
+  sounds: initialSounds(),
   statistics: initialStatistics(),
   platform: initialPlatform(),
 };
@@ -90,6 +100,12 @@ export default function foo(state = initialState, action) {
         ...state,
         renderer: action.payload,
       };
+    case SOUNDS:
+      window.localStorage.setItem("sounds", action.payload);
+      return {
+        ...state,
+        sounds: action.payload,
+      };
     case STATISTICS:
       window.localStorage.setItem("statistics", action.payload);
       return {

From 6a6f0c03049308de51a40c3b0f2df8e4331374c9 Mon Sep 17 00:00:00 2001
From: Mario Pesch <mario.pesch@uni-muenster.de>
Date: Tue, 21 Dec 2021 08:25:16 +0100
Subject: [PATCH 2/2] small fixes

---
 src/components/Blockly/generator/sensebox-web.js | 7 ++++---
 src/components/Blockly/toolbox/Toolbox.js        | 4 ++--
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/Blockly/generator/sensebox-web.js b/src/components/Blockly/generator/sensebox-web.js
index f7caa36..59c3950 100644
--- a/src/components/Blockly/generator/sensebox-web.js
+++ b/src/components/Blockly/generator/sensebox-web.js
@@ -6,8 +6,8 @@ Blockly.Arduino.sensebox_wifi = function (block) {
   var ssid = this.getFieldValue("SSID");
   Blockly.Arduino.libraries_["library_senseBoxIO"] = "#include <senseBoxIO.h>";
   Blockly.Arduino.libraries_["library_WiFi"] = "#include <WiFi101.h>";
-  Blockly.Arduino.variables_["ssid"] = `char ssid[] = ${ssid};`;
-  Blockly.Arduino.variables_["pass"] = `char pass[] = ${pw};`;
+  Blockly.Arduino.variables_["ssid"] = `char ssid[] = "${ssid}";`;
+  Blockly.Arduino.variables_["pass"] = `char pass[] = "${pw}";`;
   Blockly.Arduino.variables_["wifi_Status"] = "int status = WL_IDLE_STATUS;";
   if (pw === "") {
     Blockly.Arduino.setupCode_["wifi_begin"] = `
@@ -53,7 +53,8 @@ Blockly.Arduino.sensebox_get_ip = function () {
 Blockly.Arduino.sensebox_startap = function (block) {
   var ssid = this.getFieldValue("SSID");
   Blockly.Arduino.libraries_["library_senseBoxIO"] = "#include <senseBoxIO.h>";
-  Blockly.Arduino.definitions_["define_network"] = "Bee* b = new Bee();";
+  Blockly.Arduino.libraries_["library_WiFi"] = "#include <WiFi101.h>";
+  Blockly.Arduino.variables_["ssid"] = `char ssid[] = "${ssid}";`;
   Blockly.Arduino.setupCode_["wifi_startAP"] = `WiFi.beginAP(${ssid});`;
   var code = "";
   return code;
diff --git a/src/components/Blockly/toolbox/Toolbox.js b/src/components/Blockly/toolbox/Toolbox.js
index 9186bc8..2162019 100644
--- a/src/components/Blockly/toolbox/Toolbox.js
+++ b/src/components/Blockly/toolbox/Toolbox.js
@@ -601,11 +601,11 @@ class Toolbox extends React.Component {
           colour={getColour().variables}
           custom="CREATE_TYPED_VARIABLE"
         ></Category>
-        <Category name="Arrays" colour={getColour().arrays}>
+        {/* <Category name="Arrays" colour={getColour().arrays}>
           <Block type="lists_create_empty" />
           <Block type="array_getIndex" />
           <Block type="lists_length" />
-        </Category>
+        </Category> */}
         <Category
           name={Blockly.Msg.toolbox_functions}
           colour={getColour().procedures}