Compare commits

..
Author SHA1 Message Date
Mario Pesch 328b9a141f open device selection only once 2022-11-09 16:17:31 +01:00
28 changed files with 118 additions and 454 deletions
-3
View File
@@ -14,7 +14,6 @@
"@fortawesome/free-solid-svg-icons": "^5.15.4",
"@fortawesome/react-fontawesome": "^0.1.19",
"@material-ui/core": "^4.12.4",
"@material-ui/lab": "^4.0.0-alpha.61",
"@monaco-editor/react": "^4.3.1",
"@testing-library/jest-dom": "^5.16.1",
"@testing-library/react": "^12.1.2",
@@ -29,7 +28,6 @@
"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",
@@ -43,7 +41,6 @@
"reactour": "^1.18.7",
"redux": "^4.2.0",
"redux-thunk": "^2.4.1",
"rehype-raw": "^6.1.1",
"remark-gemoji": "^7.0.1",
"remark-gfm": "^3.0.1",
"styled-components": "^4.4.1",
+7 -12
View File
@@ -1,15 +1,10 @@
import {
BOARD,
} from "./types";
import mini_opacity from "../data/mini_opacity.png"
import mcu_opacity from "../data/mcu_opacity.png"
BOARD,
} from "./types";
export const setBoard = (board) => (dispatch) => {
window.sessionStorage.setItem("board", board);
const root = document.querySelector(':root');
root.style.setProperty('--url', `url(${board === "mcu" ? mcu_opacity : mini_opacity})`);
dispatch({
type: BOARD,
payload: board,
});
};
dispatch({
type: BOARD,
payload: board,
});
};
-18
View File
@@ -1,18 +0,0 @@
import axios from 'axios'
const fetchSensorWikiSuccess = sensors => ({
type: 'FETCH_SENSORWIKI_SUCCESS',
payload: { sensors }
})
export const fetchSensors = () => {
return async dispatch => {
try {
let sensors = await axios.get('https://api.sensors.wiki/sensors/all')
dispatch(fetchSensorWikiSuccess(sensors.data))
}
catch(e){
console.log(e)
}
}
}
-6
View File
@@ -20,15 +20,9 @@ export const onChangeCode = () => (dispatch, getState) => {
if (selectedBlock !== null) {
code.helpurl = selectedBlock.helpUrl
code.tooltip = selectedBlock.tooltip
if (selectedBlock.data) {
code.data = selectedBlock.data
} else {
code.data = null
}
} else if (selectedBlock === null) {
code.tooltip = Blockly.Msg.tooltip_hint
code.helpurl = ''
code.data = null
}
@@ -26,7 +26,6 @@ Blockly.Blocks["sensebox_sensor_temp_hum"] = {
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.senseBox_temp_hum_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_temp_hum_helpurl);
this.data = {name: "hdc1080", connection: "I2C"};
},
};
@@ -52,7 +51,6 @@ Blockly.Blocks["sensebox_sensor_uv_light"] = {
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.senseBox_uv_light_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_uv_light_helpurl);
this.data = {name: "veml6070"};
},
};
@@ -93,7 +91,6 @@ Blockly.Blocks["sensebox_sensor_bmx055_accelerometer"] = {
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.senseBox_bmx055_accelerometer_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_bmx055_helpurl);
this.data = {name: "bmx055"};
},
};
@@ -125,7 +122,6 @@ Blockly.Blocks["sensebox_sensor_sds011"] = {
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.senseBox_sds011_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_sds011_helpurl);
this.data = {name: "sds011"};
},
};
@@ -159,7 +155,6 @@ Blockly.Blocks["sensebox_sensor_pressure"] = {
this.setOutput(true, Types.DECIMAL.typeName);
this.setTooltip(Blockly.Msg.senseBox_pressure_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_pressure_helpurl);
this.data = {name: "bmp280"};
this.getField("NAME").setValidator(
function (val) {
this.updateShape_(val === "Altitude");
@@ -206,7 +201,6 @@ Blockly.Blocks["sensebox_sensor_bme680_bsec"] = {
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.senseBox_bme_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_bme680_helpurl);
this.data = {name: "bme680"};
},
};
@@ -251,7 +245,6 @@ Blockly.Blocks["sensebox_sensor_ultrasonic_ranger"] = {
this.setOutput(true, Types.NUMBER.typeName);
this.setTooltip(Blockly.Msg.senseBox_ultrasonic_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_ultrasonic_helpurl);
this.data = {name: "hc-sr04"};
},
/**
* Parse XML to restore the number of pins available.
@@ -389,7 +382,6 @@ Blockly.Blocks["sensebox_scd30"] = {
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.senseBox_scd_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_scd_helpurl);
this.data = {name: "scd30"};
},
onchange: function (e) {
var dropdown = this.getFieldValue("dropdown");
@@ -456,7 +448,6 @@ Blockly.Blocks["sensebox_sensor_truebner_smt50"] = {
this.setOutput(true, Types.NUMBER.typeName);
this.setTooltip(Blockly.Msg.senseBox_smt50_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_smt50_helpurl);
this.data = {name: "smt50"};
},
};
@@ -479,7 +470,6 @@ Blockly.Blocks["sensebox_sensor_watertemperature"] = {
.appendField(new Blockly.FieldDropdown(dropdownOptions), "Port");
this.setOutput(true, Types.NUMBER.typeName);
this.setTooltip(Blockly.Msg.senseBox_watertemperature_tip);
this.data = {name: "ds18b20"};
},
};
@@ -552,7 +542,6 @@ Blockly.Blocks["sensebox_sensor_dps310"] = {
this.setOutput(true, Types.DECIMAL.typeName);
this.setTooltip(Blockly.Msg.senseBox_sensor_dps310_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_sensor_dps310_helpurl);
this.data = {name: "dps310"};
this.getField("NAME").setValidator(
function (val) {
this.updateShape_(val === "Altitude");
+3 -3
View File
@@ -9,10 +9,10 @@ Blockly.Blocks["variables_set_dynamic"] = {
this.setPreviousStatement(true, null);
this.setNextStatement(true, null);
this.appendValueInput("VALUE")
.appendField(Blockly.Msg.variables_set, Blockly.Msg.variables_set)
// .appendField("", "type")
.appendField("set", "set")
.appendField("", "type")
.appendField(new Blockly.FieldVariable("VAR"), "VAR")
.appendField(Blockly.Msg.variables_to);
.appendField("to");
},
onchange: function (e) {
let variableID = this.getFieldValue("VAR");
+3 -19
View File
@@ -19,12 +19,10 @@ export const UI = {
variable_DECIMAL: "Kommazahl (float)",
variables_TEXT: "Text (string)",
variables_ARRAY: "Array (array)",
variables_CHARACTER: "Buchstabe (char)",
variables_CHARACTER: "char (char)",
variables_BOOLEAN: "Boolean (boolean)",
variables_NULL: "void (void)",
variables_UNDEF: "undefined",
variables_set: "Schreibe",
variables_to: "",
/**
* Tooltips
@@ -99,14 +97,11 @@ export const UI = {
* Tablet Dialog
*/
tabletDialog_connect: "senseBox Connect App öffnen",
tabletDialog_headline: "Tablet Modus ist aktiviert!",
tabletDialog_text:
"Der Tablet Modus wurde aktiviert. Du kannst nun Programmcodes über die senseBox Connect App auf deine senseBox kopieren. Der Tablet Modus kann in den Einstellungen deaktiviert werden",
tabletDialog_more:
"Weitere Informationen und den Link zum Download der App findest du unter: ",
compiledialog_process: "Dein Code wird compiliert!",
compiledialog_instructions: "Übertrage ihn anschließend mithlfe der senseBoxConnect-App..",
/**
* Reset Dialog
@@ -135,7 +130,7 @@ export const UI = {
* Compile Dialog
*
*/
compiledialog_success: "Dein Programm wurde erfolgreich kompiliert.",
compiledialog_headline: "Fehler",
compiledialog_text:
"Beim kompilieren ist ein Fehler aufgetreten. Überprüfe deine Blöcke und versuche es erneut",
@@ -155,7 +150,6 @@ export const UI = {
button_next: "nächster Schritt",
button_tutorial_overview: "Tutorial Übersicht",
button_login: "Anmelden",
button_createVariable: "Typisierte Variable erstellen",
/**
*
@@ -317,15 +311,5 @@ export const UI = {
deviceselection_head: "Welches Board benutzt du?",
deviceselection_keep_selection: "Speichere meine Auswahl fürs nächste Mal (Du kannst das Board später in den Einstellungen wechseln)",
deviceselection_footnote: "Hier kommst du zur alten Blockly Version für den ",
deviceselection_footnote_02: "oder die",
/**
* Sensor Markdown Information
*/
sensorinfo_info: "Informationen zum Sensor",
sensorinfo_description: "Beschreibung",
sensorinfo_measurable_phenos: "Messbare Phänomene",
sensorinfo_manufacturer: "Hersteller",
sensorinfo_lifetime: "Lebensdauer",
sensorinfo_explanation: "Diese Informationen wurden aus [sensors.wiki](https://sensors.wiki) entnommen. Für weitere Informationen besuchen Sie den Abschnitt über diesen Sensor "
deviceselection_footnote_02: "oder die"
};
+2 -2
View File
@@ -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: "Loop()",
ARD_FUN_RUN_SETUP: "Setup()",
ARD_FUN_RUN_LOOP: "Arduino loop forever:",
ARD_FUN_RUN_SETUP: "Arduino run first:",
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.",
+7 -21
View File
@@ -15,16 +15,14 @@ export const UI = {
toolbox_motors: "Motors",
variable_NUMBER: "Number (int)",
variable_SHORT_NUMBER: "char",
variable_LONG: "Big number (long)",
variable_LONG: " Zahl (long)",
variable_DECIMAL: "Decimal (float)",
variables_TEXT: "Text (string)",
variables_ARRAY: "Array (array)",
variables_CHARACTER: "Character (char)",
variables_CHARACTER: "char (char)",
variables_BOOLEAN: "Boolean (boolean)",
variables_NULL: "void (void)",
variables_UNDEF: "undefined",
variables_set: "set",
variables_to: "to",
/**
* Tooltips
@@ -101,7 +99,6 @@ export const UI = {
"Tablet mode has been activated. You can now copy program codes to your senseBox via the senseBox Connect app. Tablet mode can be deactivated in the settings",
tabletDialog_more:
"For more information and the link to download the app, please visit: ",
tabletDialog_connect: "Open senseBox Connect App",
/**
* Reset Dialog
@@ -129,12 +126,10 @@ export const UI = {
* Compile Dialog
*
*/
compiledialog_success: "Your code has been compiled successfully.",
compiledialog_headline: "Error",
compiledialog_text:
"While compiling an error occured. Please check your blocks and try again",
compiledialog_process: "Your code is being compiled!",
compiledialog_instructions: "After that, transfer it using the senseBoxConnect app.",
/**
* Buttons
@@ -150,7 +145,6 @@ export const UI = {
button_next: "Next step",
button_tutorial_overview: "Tutorial overview",
button_login: "Login",
button_createVariable: "Create Typed Variable",
/**
*
@@ -306,21 +300,13 @@ export const UI = {
codeeditor_compile_progress:
"Your code will now be compiled and then downloaded to your computer",
/**
* Device Selction
* */
/**
* Device Selction
* */
deviceselection_head: "Which board are you using?",
deviceselection_keep_selection: "Save my choice (You can change the board later in the settings)",
deviceselection_footnote: "Here you can access the old blockly Version for the",
deviceselection_footnote_02: "or the",
/**
* Sensor Markdown Information
* */
sensorinfo_info: "Informationen regarding the Sensor",
sensorinfo_description: "Description",
sensorinfo_measurable_phenos: "Measurable Phenomena",
sensorinfo_manufacturer: "Manufacturer",
sensorinfo_lifetime: "Lifetime",
sensorinfo_explanation: "This information was fetched from [sensors.wiki](https://sensors.wiki). For more information visit the section on this sensor ",
};
+2 -2
View File
@@ -16,6 +16,7 @@ class Toolbox extends React.Component {
this.props.workspace,
"callbackName",
[
[`${Blockly.Msg.variable_SHORT_NUMBER}`, "char"],
[`${Blockly.Msg.variable_NUMBER}`, "int"],
[`${Blockly.Msg.variable_LONG}`, "long"],
[`${Blockly.Msg.variable_DECIMAL}`, "float"],
@@ -32,7 +33,7 @@ class Toolbox extends React.Component {
// Add your button and give it a callback name.
const button = document.createElement("button");
button.setAttribute("text", Blockly.Msg.button_createVariable);
button.setAttribute("text", "Create Typed Variable");
button.setAttribute("callbackKey", "callbackName");
xmlList.push(button);
@@ -40,7 +41,6 @@ class Toolbox extends React.Component {
// This gets all the variables that the user creates and adds them to the
// flyout.
const blockList = Blockly.VariablesDynamic.flyoutCategoryBlocks(workspace);
console.log(blockList);
xmlList = xmlList.concat(blockList);
return xmlList;
}
-2
View File
@@ -11,7 +11,6 @@ import Sidebar from "./Sidebar";
import Dialog from "../Dialog";
import SaveIcon from "./SaveIcon";
import store from "../../store";
import DeviceSelection from "../DeviceSelection";
const CodeEditor = (props) => {
//const [filehandle, setFileHandle] = useState();
@@ -193,7 +192,6 @@ void loop() {
}}
/>
</Grid>
<DeviceSelection />
<Grid item lg={4} md={4}>
<Button
style={{ padding: "1rem", margin: "1rem" }}
+5 -5
View File
@@ -68,7 +68,7 @@ class Compile extends Component {
};
}
componentDidMount() { }
componentDidMount() {}
componentDidUpdate(props) {
if (props.name !== this.props.name) {
@@ -232,8 +232,8 @@ class Compile extends Component {
>
<div className="overlay">
{/* <img src={Copy} width="400" alt="copyimage"></img> */}
<h2>{Blockly.Msg.compiledialog_process}</h2>
<p>{Blockly.Msg.compiledialog_instructions}</p>
<h2>Dein Code wird kompiliert!</h2>
<p>übertrage ihn anschließend mithlfe der senseBoxConnect-App</p>
<p>
{Blockly.Msg.compile_overlay_help}
<a href="/faq" target="_blank">
@@ -291,7 +291,7 @@ class Compile extends Component {
button={Blockly.Msg.button_close}
>
<div>
<p>{Blockly.Msg.compiledialog_success}</p>
<p>Dein Code wurde erfolgreich kompiliert</p>
<a href={this.state.link}>
<Button
style={{ color: "white" }}
@@ -303,7 +303,7 @@ class Compile extends Component {
icon={faClipboardCheck}
style={{ marginRight: "5px" }}
/>{" "}
{Blockly.Msg.tabletDialog_connect}
Starte Übertragung
</Button>
</a>
</div>
+37 -33
View File
@@ -7,6 +7,8 @@ import { withStyles } from "@material-ui/core/styles";
import * as Blockly from "blockly";
import { IconButton, Grid, Avatar, Typography } from "@material-ui/core";
import { setBoard } from "../actions/boardAction";
import mini_opacity from "../data/mini_opacity.png"
import mcu_opacity from "../data/mcu_opacity.png"
const styles = (theme) => ({
link: {
@@ -27,29 +29,30 @@ class DeviceSeclection extends Component {
constructor(props) {
super(props);
this.state = {
open: props.selectedBoard ? false : true,
selectedBoard: "",
open: this.props.selectedBoard !== "" ? false : true,
selectedBoard : this.props.selectedBoard,
saveSettings: false,
};
}
toggleDialog = () => {
this.props.setBoard(this.state.selectedBoard)
};
onChange = (e) => {
if (e.target.checked) {
this.setState({ saveSettings: true });
} else {
this.setState({ saveSettings: false });
}
};
onclick = (e, value) => {
this.setState({ selectedBoard: value })
console.log(e, value)
const root = document.querySelector(':root');
root.style.setProperty('--url', `url(${value === "mcu" ? mcu_opacity : mini_opacity })`);
this.setState({selectedBoard: value})
this.props.setBoard(value)
this.setState({ open: !this.state });
};
render() {
@@ -62,24 +65,25 @@ class DeviceSeclection extends Component {
title={Blockly.Msg.deviceselection_head}
content={""}
onClick={this.toggleDialog}
disabled={this.state.selectedBoard === ""}
disabled={this.state.selectedBoard===""}
>
<div>
<Grid container spacing={2} style={{ textAlign: "center" }}>
<Grid container spacing={2} style={{ textAlign : "center" }}>
<Grid item xs={6}>
<IconButton onClick={(e) => this.onclick(e, "mcu")}>
<Avatar
alt="Sensebox MCU"
src="/media/hardware/senseboxmcu.png"
style={{
border: this.state.selectedBoard === "mcu" ? 'medium solid DeepSkyBlue' : "0.1px solid lightgray",
width: "20vw",
height: "20vw"
}}
/>
<IconButton onClick={(e) => this.onclick(e, "mcu")}>
<Avatar
alt="Sensebox MCU"
src="/media/hardware/senseboxmcu.png"
style={{
border: this.state.selectedBoard === "mcu" ? 'medium solid DeepSkyBlue': "0.1px solid lightgray",
width:"20vw",
height: "20vw"
}}
/>
</IconButton>
<p>senseBox MCU</p>
</Grid>
{/* <Grid item xs={4}>
<IconButton onClick={(e) => this.onclick(e, "esp")}>
<Avatar
@@ -89,22 +93,22 @@ class DeviceSeclection extends Component {
border: this.state.selectedBoard == "esp" ? 'medium solid DeepSkyBlue': "0.1px solid lightgray",
width:"20vw",
height: "20vw"
}}
}}
/>
</IconButton>
<p>Sensebox ESP</p>
</Grid> */}
<Grid item xs={6}>
<IconButton onClick={(e) => this.onclick(e, "mini")}>
<Avatar
alt="Sensebox Mini"
src="/media/hardware/senseboxmcumini.png"
style={{
border: this.state.selectedBoard === "mini" ? 'medium solid DeepSkyBlue' : "0.1px solid lightgray",
width: "20vw",
height: "20vw"
}}
/>
<Avatar
alt="Sensebox Mini"
src="/media/hardware/senseboxmcumini.png"
style={{
border: this.state.selectedBoard === "mini" ? 'medium solid DeepSkyBlue': "0.1px solid lightgray",
width:"20vw",
height: "20vw"
}}
/>
</IconButton>
<p>senseBox MCU:mini</p>
</Grid>
@@ -129,5 +133,5 @@ const mapStateToProps = (state) => ({
export default connect(
mapStateToProps,
{ setBoard }
{setBoard}
)(withStyles(styles, { withTheme: true })(DeviceSeclection));
-2
View File
@@ -8,7 +8,6 @@ import Button from "@material-ui/core/Button";
import Typography from "@material-ui/core/Typography";
import * as Blockly from "blockly";
import ReactMarkdown from "react-markdown";
import rehypeRaw from "rehype-raw";
import Container from "@material-ui/core/Container";
import ExpansionPanel from "@material-ui/core/ExpansionPanel";
import ExpansionPanelSummary from "@material-ui/core/ExpansionPanelSummary";
@@ -62,7 +61,6 @@ class Faq extends Component {
className="news"
allowDangerousHtml="true"
children={object.answer}
rehypePlugins={[rehypeRaw]}
></ReactMarkdown>
</Typography>
</ExpansionPanelDetails>
+1
View File
@@ -187,6 +187,7 @@ class Home extends Component {
</Grid>
) : null}
</Grid>
<DeviceSelection />
{/* <HintTutorialExists /> */}
{this.props.platform ? (
+10 -12
View File
@@ -41,7 +41,6 @@ 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: {
@@ -128,7 +127,6 @@ class Navbar extends Component {
<Link to={"/"} style={{ marginLeft: "10px" }}>
<img src={senseboxLogo} alt="senseBox-Logo" width="30" />
</Link>
<NavbarSettings />
{isTutorial ? (
<Link
to={"/tutorial"}
@@ -151,7 +149,7 @@ class Navbar extends Component {
onClick={() => {
this.openTour();
}}
style={{ margin: "0 30px 0 0" }}
style={{ margin: "0 30px 0 auto" }}
>
<FontAwesomeIcon icon={faQuestionCircle} />
</IconButton>
@@ -165,7 +163,7 @@ class Navbar extends Component {
onClick={() => {
this.openTour();
}}
style={{ margin: "0 30px 0 0" }}
style={{ margin: "0 30px 0 auto" }}
>
<FontAwesomeIcon icon={faQuestionCircle} />
</IconButton>
@@ -216,11 +214,11 @@ class Navbar extends Component {
</div>
<List>
{[
{
text: Blockly.Msg.navbar_blockly,
icon: faPuzzlePiece,
link: "/",
},
{
text: Blockly.Msg.navbar_blockly,
icon: faPuzzlePiece,
link: "/",
},
{
text: Blockly.Msg.navbar_tutorials,
icon: faChalkboardTeacher,
@@ -331,9 +329,9 @@ class Navbar extends Component {
onClick={
item.function
? () => {
item.function();
this.toggleDrawer();
}
item.function();
this.toggleDrawer();
}
: this.toggleDrawer
}
>
-88
View File
@@ -1,88 +0,0 @@
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";
import { MuiThemeProvider, createTheme } from '@material-ui/core/styles';
const theme = createTheme({
overrides: {
MuiSelect: {
select: {
'&:focus': {
backgroundColor: 'transparent',
},
},
},
},
});
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 (
<div style={{ margin: "0 0 0 auto", display: "flex" }}>
<div style={{ margin: "0 30px 0 auto", display: "flex" }}>
<MuiThemeProvider theme={theme}>
<Select
value={this.props.selectedBoard}
onChange={(e) => this.props.setBoard(e.target.value)}
disableUnderline={true}
style={{ backgroundColor: "transparent !important" }}
// IconComponent={() => <div />}
>
<MenuItem value="mcu">senseBox MCU</MenuItem>
<MenuItem value="mini">senseBox MCU mini</MenuItem>
</Select>
</MuiThemeProvider>
</div>
<div style={{ margin: "0 0 0 auto", display: "flex" }}>
<MuiThemeProvider theme={theme}>
<Select
value={this.props.language}
onChange={this.handleChange}
disableUnderline={true}
IconComponent={() => null}
>
<MenuItem value={'en_US'} >
<ReactCountryFlag
countryCode="US"
svg
cdnSuffix="svg"
title="US"
/>
</MenuItem>
<MenuItem value={'de_DE'}>
<ReactCountryFlag
countryCode="DE"
svg
cdnSuffix="svg"
title="DE"
/>
</MenuItem>
</Select>
</MuiThemeProvider>
</div>
</div >
);
}
}
const mapStateToProps = state => ({
language: state.general.language,
selectedBoard: state.board.board
});
export default connect(mapStateToProps, { setLanguage, setBoard })(NavbarSettings);
+7 -7
View File
@@ -18,7 +18,6 @@ import Divider from "@material-ui/core/Divider";
import Typography from "@material-ui/core/Typography";
import Backdrop from "@material-ui/core/Backdrop";
import CircularProgress from "@material-ui/core/CircularProgress";
import DeviceSelection from "../DeviceSelection";
const styles = (theme) => ({
link: {
@@ -61,8 +60,9 @@ class ProjectHome extends Component {
this.setState({
snackbar: true,
key: Date.now(),
message: `Dein angefragtes ${type === "gallery" ? "Galerie-" : ""
}Projekt konnte nicht gefunden werden.`,
message: `Dein angefragtes ${
type === "gallery" ? "Galerie-" : ""
}Projekt konnte nicht gefunden werden.`,
type: "error",
});
}
@@ -108,7 +108,6 @@ class ProjectHome extends Component {
/>
<h1>{data}</h1>
<DeviceSelection />
{this.props.progress ? (
<Backdrop open invisible>
<CircularProgress color="primary" />
@@ -128,8 +127,9 @@ class ProjectHome extends Component {
}}
>
<Link
to={`/${data === "Projekte" ? "project" : "gallery"
}/${project._id}`}
to={`/${
data === "Projekte" ? "project" : "gallery"
}/${project._id}`}
style={{ textDecoration: "none", color: "inherit" }}
>
<h3 style={{ marginTop: 0 }}>{project.title}</h3>
@@ -153,7 +153,7 @@ class ProjectHome extends Component {
</Typography>
</Link>
{this.props.user &&
this.props.user.email === project.creator ? (
this.props.user.email === project.creator ? (
<div>
<Divider
style={{
-77
View File
@@ -1,77 +0,0 @@
import React from "react";
import Box from "@material-ui/core/Box";
import Tab from "@material-ui/core/Tab";
import TabContext from "@material-ui/lab/TabContext";
import TabList from "@material-ui/lab/TabList";
import TabPanel from "@material-ui/lab/TabPanel";
import store from "../store";
import ReactMarkdown from "react-markdown";
import * as Blockly from "blockly";
export default function LabTabs() {
const [value, setValue] = React.useState('1');
const handleChange = (event, newValue) => {
setValue(newValue);
};
// get the description in the current language if no lang is give return english or the first one
function filterLanguage(options) {
var lang;
if (window.localStorage.getItem("locale")) {
lang = window.localStorage.getItem("locale").split("_")[0];
}
else {
lang = "en";
}
for (var i = 0; i < options.length; i++) {
if (options[i].languageCode === lang) {
return options[i].text;
}
}
return options[0].text;
}
var currentStore = store.getState();
// ALL SENSOR DATA FROM WIKI
var sensorData = currentStore.sensorwiki;
// NAME OF SELECTED BLOCK
var sensorName = currentStore.workspace.code.data.name;
// SEARCH ALL DATA FOR SELECTED BLOCK NAME
var sensorInfo = sensorData.find(function (element) {
return element.slug === sensorName;
});
if (sensorInfo) {
sensorInfo.markdown = "Coming soon...";
// GET DESCRIPTION OF SELECTED BLOCK
sensorInfo.details = `# ${sensorName.toUpperCase()}
${Blockly.Msg.sensorinfo_explanation} [${sensorName.toUpperCase()}](https://sensors.wiki/sensor/detail/${sensorName})
## ${Blockly.Msg.sensorinfo_description}
${filterLanguage(sensorInfo.description.item)}
## ${Blockly.Msg.sensorinfo_measurable_phenos}
## ${Blockly.Msg.sensorinfo_manufacturer}
${sensorInfo.manufacturer}
## ${Blockly.Msg.sensorinfo_lifetime}
${sensorInfo.lifePeriod}`
}
return (
<Box sx={{ width: '100%', typography: 'body1' }}>
<TabContext value={value}>
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
<TabList onChange={handleChange}>
<Tab label="Basic Information" value="1" />
<Tab label="Details" value="2" />
</TabList>
</Box>
<TabPanel value="1">
{sensorInfo ? <ReactMarkdown>{sensorInfo.markdown}</ReactMarkdown> : "No data available"}
</TabPanel>
<TabPanel value="2">
{sensorInfo ? <ReactMarkdown>{sensorInfo.details}</ReactMarkdown> : "No data available"}
</TabPanel>
</TabContext>
</Box>
);
}
+11 -67
View File
@@ -1,41 +1,17 @@
import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import withWidth from "@material-ui/core/withWidth";
import { Button, Card } from "@material-ui/core";
import { Card } from "@material-ui/core";
import * as Blockly from "blockly";
import CardContent from "@material-ui/core/CardContent";
import Typography from "@material-ui/core/Typography";
import ReactMarkdown from "react-markdown";
import Dialog from "@material-ui/core/Dialog";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import Slide from "@material-ui/core/Slide";
import SensorInfo from "./SensorInfo";
import store from "../store";
const Transition = React.forwardRef(function Transition(props, ref) {
return <Slide direction="up" ref={ref} {...props} />;
});
class TooltipViewer extends Component {
constructor(props) {
super(props);
this.inputRef = React.createRef();
this.state = {
open: false,
};
}
toggleDialog = () => {
this.setState({ open: !this.state });
};
openDialog = () => {
this.setState({ open: true });
};
render() {
return (
<Card
@@ -53,46 +29,14 @@ class TooltipViewer extends Component {
{Blockly.Msg.tooltip_viewer}
</Typography>
<Typography variant="body2" component="p">
<ReactMarkdown linkTarget="_blank">
{this.props.tooltip}
</ReactMarkdown>
{store.getState().workspace.code.data ? (
<Button
label="Mehr"
variant="contained"
color="primary"
onClick={() => {
this.openDialog();
}}
>
Sensor Informationen
</Button>
) : (
<ReactMarkdown>{`${Blockly.Msg.tooltip_moreInformation} [${Blockly.Msg.labels_here}](${this.props.helpurl})`}</ReactMarkdown>
)}
</Typography>
<ReactMarkdown linkTarget="_blank">
{this.props.tooltip}
</ReactMarkdown>
{this.props.helpurl !== "" ? (
<ReactMarkdown>{`${Blockly.Msg.tooltip_moreInformation} [${Blockly.Msg.labels_here}](${this.props.helpurl})`}</ReactMarkdown>
) : null}
</CardContent>
{store.getState().workspace.code.data ? (<Dialog
open={this.state.open}
TransitionComponent={Transition}
keepMounted
aria-describedby="alert-dialog-slide-description"
onClose={() => {
this.toggleDialog();
}}
maxWidth={"md"}
fullWidth={true}
>
<DialogContent>
<SensorInfo></SensorInfo>
</DialogContent>
<DialogActions>
<Button onClick={() => {
this.toggleDialog();
}}>Close</Button>
</DialogActions>
</Dialog>) : (null)}
</Card>
);
}
+13 -11
View File
@@ -37,7 +37,6 @@ import Tooltip from "@material-ui/core/Tooltip";
import IconButton from "@material-ui/core/IconButton";
import Snackbar from "../Snackbar";
import Divider from "@material-ui/core/Divider";
import DeviceSelection from "../DeviceSelection";
const styles = (theme) => ({
outerDiv: {
@@ -244,11 +243,14 @@ class TutorialHome extends Component {
cy="50%"
fill="none"
stroke-width="10"
stroke-dashoffset={`${75 * 2 * Math.PI * (1 - (50 / 100 + success / 2))
}`}
stroke-dasharray={`${75 * 2 * Math.PI * (1 - (50 / 100 - success / 2))
} ${75 * 2 * Math.PI * (1 - (50 / 100 + success / 2))
}`}
stroke-dashoffset={`${
75 * 2 * Math.PI * (1 - (50 / 100 + success / 2))
}`}
stroke-dasharray={`${
75 * 2 * Math.PI * (1 - (50 / 100 - success / 2))
} ${
75 * 2 * Math.PI * (1 - (50 / 100 + success / 2))
}`}
></circle>
)}
{success < 1 && !error ? (
@@ -263,8 +265,9 @@ class TutorialHome extends Component {
cy="50%"
fill="none"
stroke-width="10"
stroke-dashoffset={`${75 * 2 * Math.PI * (1 - (50 / 100 + success / 2))
}`}
stroke-dashoffset={`${
75 * 2 * Math.PI * (1 - (50 / 100 + success / 2))
}`}
stroke-dasharray={`${75 * 2 * Math.PI}`}
></circle>
) : null}
@@ -276,8 +279,8 @@ class TutorialHome extends Component {
tutorialStatus === "Error"
? this.props.classes.outerDivError
: tutorialStatus === "Success"
? this.props.classes.outerDivSuccess
: null
? this.props.classes.outerDivSuccess
: null
)}
>
<div className={this.props.classes.innerDiv}>
@@ -308,7 +311,6 @@ class TutorialHome extends Component {
);
})}
</Grid>
<DeviceSelection />
{this.props.user ? (
<div>
<h2>User Tutorials</h2>
-13
View File
@@ -38,19 +38,6 @@ export class Login extends Component {
};
}
componentDidMount() {
if (this.props.message.id === "LOGIN_FAIL") {
this.setState({
email: "",
password: "",
snackbar: true,
key: Date.now(),
message: Blockly.Msg.messages_LOGIN_FAIL,
type: "error",
});
}
}
componentDidUpdate(props) {
const { message } = this.props;
if (message !== props.message) {
+5 -5
View File
@@ -68,7 +68,7 @@ class Compile extends Component {
};
}
componentDidMount() { }
componentDidMount() {}
componentDidUpdate(props) {
if (props.name !== this.props.name) {
@@ -232,8 +232,8 @@ class Compile extends Component {
>
<div className="overlay">
{/* <img src={Copy} width="400" alt="copyimage"></img> */}
<h2>{Blockly.Msg.compiledialog_process}</h2>
<p>{Blockly.Msg.compiledialog_instructions}</p>
<h2>Dein Code wird kompiliert!</h2>
<p>übertrage ihn anschließend mithlfe der senseBoxConnect-App</p>
<p>
{Blockly.Msg.compile_overlay_help}
<a href="/faq" target="_blank">
@@ -291,7 +291,7 @@ class Compile extends Component {
button={Blockly.Msg.button_close}
>
<div>
<p>{Blockly.Msg.compiledialog_success}</p>
<p>Dein Code wurde erfolgreich kompiliert</p>
<a href={this.state.link}>
<Button
style={{ color: "white" }}
@@ -303,7 +303,7 @@ class Compile extends Component {
icon={faClipboardCheck}
style={{ marginRight: "5px" }}
/>{" "}
{Blockly.Msg.tabletDialog_connect}
Starte Übertragung
</Button>
</a>
</div>
+2 -4
View File
@@ -15,13 +15,11 @@ const compareNumberOfBlocks = (originalBlocks, userBlocks) => {
var blocks;
if(originalBlocks.length > userBlocks.length){
blocks = originalBlocks.length-userBlocks.length;
//return {text: `Es wurde${blocks === 1 ? '' : 'n'} ${blocks} Bl${blocks === 1 ? 'ock' : 'öcke'} zu wenig verwendet.`, type: 'error'};
return {text: `Du kannst deinen Programmcode kompilieren, aber es wurde${blocks === 1 ? '' : 'n'} ${blocks} Bl${blocks === 1 ? 'ock' : 'öcke'} weniger verwendet als in der hinterlegten Lösung.`, type: 'success'};
return {text: `Es wurde${blocks === 1 ? '' : 'n'} ${blocks} Bl${blocks === 1 ? 'ock' : 'öcke'} zu wenig verwendet.`, type: 'error'};
}
else {
blocks = userBlocks.length-originalBlocks.length;
//return {text: `Es wurde${blocks === 1 ? '' : 'n'} ${blocks} Bl${blocks === 1 ? 'ock' : 'öcke'} zu viel verwendet.`, type: 'error'};
return {text: `Du kannst deinen Programmcode kompilieren, aber es wurde${blocks === 1 ? '' : 'n'} ${blocks} Bl${blocks === 1 ? 'ock' : 'öcke'} mehr verwendet als in der hinterlegten Lösung.`, type: 'success'};
return {text: `Es wurde${blocks === 1 ? '' : 'n'} ${blocks} Bl${blocks === 1 ? 'ock' : 'öcke'} zu viel verwendet.`, type: 'error'};
}
}
};
-5
View File
@@ -3,12 +3,7 @@ import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import store from "./store";
import { fetchSensors } from "./actions/sensorwikiActions";
store.dispatch(fetchSensors());
fetchSensors();
ReactDOM.render(
<React.StrictMode>
+1 -12
View File
@@ -1,20 +1,9 @@
import { BOARD } from '../actions/types';
import mini_opacity from "../data/mini_opacity.png"
import mcu_opacity from "../data/mcu_opacity.png"
const initialValue = () => {
if (window.sessionStorage.getItem("board")) {
setBackgroundImage(window.sessionStorage.getItem("board"));
return window.sessionStorage.getItem("board");
}
return null;
return "";
};
const setBackgroundImage = (board) => {
const root = document.querySelector(':root');
root.style.setProperty('--url', `url(${board === "mcu" ? mcu_opacity : mini_opacity})`);
}
const initialState = {
board: initialValue()
};
+2 -4
View File
@@ -6,8 +6,7 @@ import generalReducer from './generalReducer';
import projectReducer from './projectReducer';
import messageReducer from './messageReducer';
import authReducer from './authReducer';
import boardReducer from './boardReducer';
import sensorwikiReducer from './sensorwikiReducer';
import boardReducer from './boardReducer'
export default combineReducers({
auth: authReducer,
@@ -17,6 +16,5 @@ export default combineReducers({
builder: tutorialBuilderReducer,
project: projectReducer,
general: generalReducer,
message: messageReducer,
sensorwiki: sensorwikiReducer
message: messageReducer
});
-10
View File
@@ -1,10 +0,0 @@
const sensors = (state = [] , action) => {
switch(action.type) {
case 'FETCH_SENSORWIKI_SUCCESS':
return action.payload.sensors
default:
return state
}
}
export default sensors