diff --git a/package.json b/package.json index 418a0a5..a350d05 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "@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", @@ -41,6 +42,7 @@ "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", diff --git a/src/actions/sensorwikiActions.js b/src/actions/sensorwikiActions.js new file mode 100644 index 0000000..9f959be --- /dev/null +++ b/src/actions/sensorwikiActions.js @@ -0,0 +1,18 @@ +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) + } + } +} \ No newline at end of file diff --git a/src/actions/workspaceActions.js b/src/actions/workspaceActions.js index f16da0a..da44286 100644 --- a/src/actions/workspaceActions.js +++ b/src/actions/workspaceActions.js @@ -20,9 +20,15 @@ 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 } diff --git a/src/components/Blockly/blocks/sensebox-sensors.js b/src/components/Blockly/blocks/sensebox-sensors.js index 12929a7..f395547 100644 --- a/src/components/Blockly/blocks/sensebox-sensors.js +++ b/src/components/Blockly/blocks/sensebox-sensors.js @@ -26,6 +26,7 @@ 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"}; }, }; @@ -51,6 +52,7 @@ 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"}; }, }; @@ -91,6 +93,7 @@ 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"}; }, }; @@ -122,6 +125,7 @@ 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"}; }, }; @@ -155,6 +159,7 @@ 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"); @@ -201,6 +206,7 @@ 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"}; }, }; @@ -245,6 +251,7 @@ 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. @@ -382,6 +389,7 @@ 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"); @@ -448,6 +456,7 @@ 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"}; }, }; @@ -470,6 +479,7 @@ 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"}; }, }; @@ -542,6 +552,7 @@ 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"); diff --git a/src/components/Blockly/blocks/variables.js b/src/components/Blockly/blocks/variables.js index 8e19984..6f88db1 100644 --- a/src/components/Blockly/blocks/variables.js +++ b/src/components/Blockly/blocks/variables.js @@ -9,10 +9,10 @@ Blockly.Blocks["variables_set_dynamic"] = { this.setPreviousStatement(true, null); this.setNextStatement(true, null); this.appendValueInput("VALUE") - .appendField("set", "set") - .appendField("", "type") + .appendField(Blockly.Msg.variables_set, Blockly.Msg.variables_set) + // .appendField("", "type") .appendField(new Blockly.FieldVariable("VAR"), "VAR") - .appendField("to"); + .appendField(Blockly.Msg.variables_to); }, onchange: function (e) { let variableID = this.getFieldValue("VAR"); diff --git a/src/components/Blockly/msg/de/ui.js b/src/components/Blockly/msg/de/ui.js index e11f9f9..6f13fbf 100644 --- a/src/components/Blockly/msg/de/ui.js +++ b/src/components/Blockly/msg/de/ui.js @@ -19,10 +19,12 @@ export const UI = { variable_DECIMAL: "Kommazahl (float)", variables_TEXT: "Text (string)", variables_ARRAY: "Array (array)", - variables_CHARACTER: "char (char)", + variables_CHARACTER: "Buchstabe (char)", variables_BOOLEAN: "Boolean (boolean)", variables_NULL: "void (void)", variables_UNDEF: "undefined", + variables_set: "Schreibe", + variables_to: "", /** * Tooltips @@ -150,6 +152,7 @@ export const UI = { button_next: "nächster Schritt", button_tutorial_overview: "Tutorial Übersicht", button_login: "Anmelden", + button_createVariable: "Typisierte Variable erstellen", /** * @@ -311,5 +314,15 @@ 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" + 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 " }; diff --git a/src/components/Blockly/msg/en/ui.js b/src/components/Blockly/msg/en/ui.js index 6a1e685..5201bdb 100644 --- a/src/components/Blockly/msg/en/ui.js +++ b/src/components/Blockly/msg/en/ui.js @@ -15,14 +15,16 @@ export const UI = { toolbox_motors: "Motors", variable_NUMBER: "Number (int)", variable_SHORT_NUMBER: "char", - variable_LONG: " Zahl (long)", + variable_LONG: "Big number (long)", variable_DECIMAL: "Decimal (float)", variables_TEXT: "Text (string)", variables_ARRAY: "Array (array)", - variables_CHARACTER: "char (char)", + variables_CHARACTER: "Character (char)", variables_BOOLEAN: "Boolean (boolean)", variables_NULL: "void (void)", variables_UNDEF: "undefined", + variables_set: "set", + variables_to: "to", /** * Tooltips @@ -145,6 +147,7 @@ export const UI = { button_next: "Next step", button_tutorial_overview: "Tutorial overview", button_login: "Login", + button_createVariable: "Create Typed Variable", /** * @@ -300,13 +303,21 @@ 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 ", }; diff --git a/src/components/Blockly/toolbox/Toolbox.js b/src/components/Blockly/toolbox/Toolbox.js index 7fa9f5a..54a157c 100644 --- a/src/components/Blockly/toolbox/Toolbox.js +++ b/src/components/Blockly/toolbox/Toolbox.js @@ -16,7 +16,6 @@ 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"], @@ -33,7 +32,7 @@ class Toolbox extends React.Component { // Add your button and give it a callback name. const button = document.createElement("button"); - button.setAttribute("text", "Create Typed Variable"); + button.setAttribute("text", Blockly.Msg.button_createVariable); button.setAttribute("callbackKey", "callbackName"); xmlList.push(button); @@ -41,6 +40,7 @@ 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; } diff --git a/src/components/Faq.js b/src/components/Faq.js index 2909fc7..173d5f6 100644 --- a/src/components/Faq.js +++ b/src/components/Faq.js @@ -8,6 +8,7 @@ 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"; @@ -61,6 +62,7 @@ class Faq extends Component { className="news" allowDangerousHtml="true" children={object.answer} + rehypePlugins={[rehypeRaw]} > diff --git a/src/components/SensorInfo.js b/src/components/SensorInfo.js new file mode 100644 index 0000000..49156bb --- /dev/null +++ b/src/components/SensorInfo.js @@ -0,0 +1,77 @@ +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 ( + + + + + + + + + + {sensorInfo ? {sensorInfo.markdown} : "No data available"} + + + {sensorInfo ? {sensorInfo.details} : "No data available"} + + + + ); +} \ No newline at end of file diff --git a/src/components/TooltipViewer.js b/src/components/TooltipViewer.js index 7d69a57..1d1225d 100644 --- a/src/components/TooltipViewer.js +++ b/src/components/TooltipViewer.js @@ -1,17 +1,41 @@ import React, { Component } from "react"; import PropTypes from "prop-types"; import { connect } from "react-redux"; - import withWidth from "@material-ui/core/withWidth"; - -import { Card } from "@material-ui/core"; +import { Button, 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 ; +}); 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 ( - - {this.props.tooltip} - - - {this.props.helpurl !== "" ? ( - {`${Blockly.Msg.tooltip_moreInformation} [${Blockly.Msg.labels_here}](${this.props.helpurl})`} - ) : null} + + + {this.props.tooltip} + + {store.getState().workspace.code.data ? ( + + ) : ( + {`${Blockly.Msg.tooltip_moreInformation} [${Blockly.Msg.labels_here}](${this.props.helpurl})`} + )} + + {store.getState().workspace.code.data ? ( { + this.toggleDialog(); + }} + maxWidth={"md"} + fullWidth={true} + > + + + + + + + ) : (null)} ); } diff --git a/src/components/User/Login.js b/src/components/User/Login.js index 4848dce..eda6ed6 100644 --- a/src/components/User/Login.js +++ b/src/components/User/Login.js @@ -38,6 +38,19 @@ 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) { diff --git a/src/index.js b/src/index.js index fad5562..b777259 100644 --- a/src/index.js +++ b/src/index.js @@ -3,7 +3,12 @@ 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( diff --git a/src/reducers/index.js b/src/reducers/index.js index 57e99e5..241e4df 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -6,7 +6,8 @@ import generalReducer from './generalReducer'; import projectReducer from './projectReducer'; import messageReducer from './messageReducer'; import authReducer from './authReducer'; -import boardReducer from './boardReducer' +import boardReducer from './boardReducer'; +import sensorwikiReducer from './sensorwikiReducer'; export default combineReducers({ auth: authReducer, @@ -16,5 +17,6 @@ export default combineReducers({ builder: tutorialBuilderReducer, project: projectReducer, general: generalReducer, - message: messageReducer + message: messageReducer, + sensorwiki: sensorwikiReducer }); diff --git a/src/reducers/sensorwikiReducer.js b/src/reducers/sensorwikiReducer.js new file mode 100644 index 0000000..349b602 --- /dev/null +++ b/src/reducers/sensorwikiReducer.js @@ -0,0 +1,10 @@ +const sensors = (state = [] , action) => { + switch(action.type) { + case 'FETCH_SENSORWIKI_SUCCESS': + return action.payload.sensors + default: + return state + } +} + +export default sensors \ No newline at end of file