schuelerlabor-cleverlab/smarti
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #79 from sensebox/ui-updates

Browse Source 
ui-updates
This commit is contained in:
Mario Pesch 2021-07-01 15:58:35 +02:00 committed by GitHub
commit ed36a27ac2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
38 changed files with 1414 additions and 974 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
package-lock.json generated
View File

@ -11,6 +11,7 @@
"@blockly/block-plus-minus": "^2.0.10",
"@blockly/field-slider": "^2.1.1",
"@blockly/plugin-typed-variable-modal": "^3.1.1",
"@blockly/zoom-to-fit": "^1.0.5",
"@fortawesome/fontawesome-svg-core": "^1.2.30",
"@fortawesome/free-solid-svg-icons": "^5.14.0",
"@fortawesome/react-fontawesome": "^0.1.11",
@ -21,7 +22,7 @@
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"axios": "^0.21.0",
"blockly": "^3.20200924.0",
"blockly": "^5.20210325.1",
"file-saver": "^2.0.2",
"mnemonic-id": "^3.2.7",
"moment": "^2.28.0",
@ -1488,6 +1489,17 @@
"node": ">=8.17.0"
}
},
"node_modules/@blockly/zoom-to-fit": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/@blockly/zoom-to-fit/-/zoom-to-fit-1.0.5.tgz",
"integrity": "sha512-+dm8bpJB0AkrEMQPr7nEMYKiEA8Loh7V8ZVa0s25PkxGP9BLqt9NIxUCQjshInhCr11Dlctq7C7noqK+tTVS4w==",
"engines": {
"node": ">=8.17.0"
},
"peerDependencies": {
"blockly": ">=5.20210325.0"
}
},
"node_modules/@cnakazawa/watch": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.4.tgz",
@ -5866,11 +5878,12 @@
}
},
"node_modules/blockly": {
"version": "3.20200924.0",
"resolved": "https://registry.npmjs.org/blockly/-/blockly-3.20200924.0.tgz",
"integrity": "sha512-mOZiXi908oNFAcVb8Q5LKJNRZ5jtBJtgNilddqTYMAXEdqSY/BhcnU2rgytWARDnu2iSQlI374kEafCNuUEWKQ==",
"version": "5.20210325.1",
"resolved": "https://registry.npmjs.org/blockly/-/blockly-5.20210325.1.tgz",
"integrity": "sha512-qrilYPovJeDfxKDWm1YBUCPVNElh/iyC1szaHTIPZHj9C9YPpSzZOeFyyrPBbYRudzbo8kjBOWMtHnN1bLjkoQ==",
"license": "Apache-2.0",
"dependencies": {
"jsdom": "^15.2.1"
"jsdom": "15.2.1"
}
},
"node_modules/blockly/node_modules/jsdom": {
@ -26225,6 +26238,12 @@
"@blockly/plugin-modal": "^1.20200427.4"
}
},
"@blockly/zoom-to-fit": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/@blockly/zoom-to-fit/-/zoom-to-fit-1.0.5.tgz",
"integrity": "sha512-+dm8bpJB0AkrEMQPr7nEMYKiEA8Loh7V8ZVa0s25PkxGP9BLqt9NIxUCQjshInhCr11Dlctq7C7noqK+tTVS4w==",
"requires": {}
},
"@cnakazawa/watch": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.4.tgz",
@ -29635,11 +29654,11 @@
}
},
"blockly": {
"version": "3.20200924.0",
"resolved": "https://registry.npmjs.org/blockly/-/blockly-3.20200924.0.tgz",
"integrity": "sha512-mOZiXi908oNFAcVb8Q5LKJNRZ5jtBJtgNilddqTYMAXEdqSY/BhcnU2rgytWARDnu2iSQlI374kEafCNuUEWKQ==",
"version": "5.20210325.1",
"resolved": "https://registry.npmjs.org/blockly/-/blockly-5.20210325.1.tgz",
"integrity": "sha512-qrilYPovJeDfxKDWm1YBUCPVNElh/iyC1szaHTIPZHj9C9YPpSzZOeFyyrPBbYRudzbo8kjBOWMtHnN1bLjkoQ==",
"requires": {
"jsdom": "^15.2.1"
"jsdom": "15.2.1"
},
"dependencies": {
"jsdom": {

3
package.json
View File

@ -6,6 +6,7 @@
"@blockly/block-plus-minus": "^2.0.10",
"@blockly/field-slider": "^2.1.1",
"@blockly/plugin-typed-variable-modal": "^3.1.1",
"@blockly/zoom-to-fit": "^1.0.5",
"@fortawesome/fontawesome-svg-core": "^1.2.30",
"@fortawesome/free-solid-svg-icons": "^5.14.0",
"@fortawesome/react-fontawesome": "^0.1.11",
@ -16,7 +17,7 @@
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"axios": "^0.21.0",
"blockly": "^3.20200924.0",
"blockly": "^5.20210325.1",
"file-saver": "^2.0.2",
"mnemonic-id": "^3.2.7",
"moment": "^2.28.0",

2
public/index.html
View File

@ -27,7 +27,7 @@
<!-- Matomo Image Tracker-->
<img
src="https://piwik.sensebox.kaufen/matomo.php?idsite=9&amp;rec=1"
style="border: 0"
style="border: 0; display: none"
alt=""
/>
<!-- End Matomo -->

3
src/actions/tutorialActions.js
View File

@ -38,13 +38,11 @@ export const getTutorials = () => (dispatch, getState) => {
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/tutorial`)
.then(res => {
var tutorials = res.data.tutorials;
console.log(tutorials);
existingTutorials(tutorials, getState().tutorial.status).then(status => {
dispatch({
type: TUTORIAL_SUCCESS,
payload: status
});
console.log('zwei');
dispatch(updateStatus(status));
dispatch({
type: GET_TUTORIALS,
@ -167,7 +165,6 @@ export const tutorialCheck = (status, step) => (dispatch, getState) => {
type: status === 'success' ? TUTORIAL_SUCCESS : TUTORIAL_ERROR,
payload: tutorialsStatus
});
console.log('drei');
dispatch(updateStatus(tutorialsStatus));
dispatch(tutorialChange());
dispatch(returnSuccess('', '', 'TUTORIAL_CHECK_SUCCESS'));

1
src/actions/workspaceActions.js
View File

@ -17,7 +17,6 @@ export const onChangeCode = () => (dispatch, getState) => {
var xmlDom = Blockly.Xml.workspaceToDom(workspace);
code.xml = Blockly.Xml.domToPrettyText(xmlDom);
var selectedBlock = Blockly.selected
console.log(selectedBlock)
if (selectedBlock !== null) {
code.helpurl = selectedBlock.helpUrl
code.tooltip = selectedBlock.tooltip

104
src/components/Blockly/BlocklyWindow.js
View File

@ -1,20 +1,18 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { onChangeWorkspace, clearStats } from '../../actions/workspaceActions';
import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { onChangeWorkspace, clearStats } from "../../actions/workspaceActions";
import BlocklyComponent from './BlocklyComponent';
import BlocklySvg from './BlocklySvg';
import * as Blockly from 'blockly/core';
import './blocks/index';
import './generator/index';
import { initialXml } from './initialXml.js';
import BlocklyComponent from "./BlocklyComponent";
import BlocklySvg from "./BlocklySvg";
import * as Blockly from "blockly/core";
import "./blocks/index";
import "./generator/index";
import { ZoomToFitControl } from "@blockly/zoom-to-fit";
import { initialXml } from "./initialXml.js";
class BlocklyWindow extends Component {
constructor(props) {
super(props);
this.simpleWorkspace = React.createRef();
@ -33,6 +31,8 @@ class BlocklyWindow extends Component {
}
});
Blockly.svgResize(workspace);
const zoomToFit = new ZoomToFitControl(workspace);
zoomToFit.init();
}
componentDidUpdate(props) {
@ -51,50 +51,68 @@ class BlocklyWindow extends Component {
var xmlDom = Blockly.Xml.textToDom(xml);
Blockly.Xml.clearWorkspaceAndLoadFromXml(xmlDom, workspace);
// var toolbox = workspace.getToolbox();
// console.log(toolbox);
// workspace.updateToolbox(toolbox.toolboxDef_);
}
Blockly.svgResize(workspace);
}
render() {
return (
<div>
<BlocklyComponent ref={this.simpleWorkspace}
<BlocklyComponent
ref={this.simpleWorkspace}
style={this.props.svg ? { height: 0 } : this.props.blocklyCSS}
readOnly={this.props.readOnly !== undefined ? this.props.readOnly : false}
trashcan={this.props.trashcan !== undefined ? this.props.trashcan : true}
readOnly={
this.props.readOnly !== undefined ? this.props.readOnly : false
}
trashcan={
this.props.trashcan !== undefined ? this.props.trashcan : true
}
renderer={this.props.renderer}
zoom={{ // https://developers.google.com/blockly/guides/configure/web/zoom
controls: this.props.zoomControls !== undefined ? this.props.zoomControls : true,
zoom={{
// https://developers.google.com/blockly/guides/configure/web/zoom
controls:
this.props.zoomControls !== undefined
? this.props.zoomControls
: true,
wheel: false,
startScale: 1,
maxScale: 3,
minScale: 0.3,
scaleSpeed: 1.2
scaleSpeed: 1.2,
}}
grid={this.props.grid !== undefined && !this.props.grid ? {} :
{ // https://developers.google.com/blockly/guides/configure/web/grid
spacing: 20,
length: 1,
colour: '#4EAF47', // senseBox-green
snap: false
}}
media={'/media/blockly/'}
move={this.props.move !== undefined && !this.props.move ? {} :
{ // https://developers.google.com/blockly/guides/configure/web/move
scrollbars: true,
drag: true,
wheel: false
}}
initialXml={this.props.initialXml ? this.props.initialXml : initialXml}
>
</BlocklyComponent >
{this.props.svg && this.props.initialXml ? <BlocklySvg initialXml={this.props.initialXml} /> : null}
grid={
this.props.grid !== undefined && !this.props.grid
? {}
: {
// https://developers.google.com/blockly/guides/configure/web/grid
spacing: 20,
length: 1,
colour: "#4EAF47", // senseBox-green
snap: false,
}
}
media={"/media/blockly/"}
move={
this.props.move !== undefined && !this.props.move
? {}
: {
// https://developers.google.com/blockly/guides/configure/web/move
scrollbars: true,
drag: true,
wheel: false,
}
}
initialXml={
this.props.initialXml ? this.props.initialXml : initialXml
}
></BlocklyComponent>
{this.props.svg && this.props.initialXml ? (
<BlocklySvg initialXml={this.props.initialXml} />
) : null}
</div>
);
};
}
}
BlocklyWindow.propTypes = {
@ -104,9 +122,11 @@ BlocklyWindow.propTypes = {
language: PropTypes.string.isRequired
};
const mapStateToProps = state => ({
const mapStateToProps = (state) => ({
renderer: state.general.renderer,
language: state.general.language
});
export default connect(mapStateToProps, { onChangeWorkspace, clearStats })(BlocklyWindow);
export default connect(mapStateToProps, { onChangeWorkspace, clearStats })(
BlocklyWindow
);

12
src/components/Blockly/blocks/loops.js
View File

@ -16,7 +16,7 @@ Blockly.Blocks['controls_whileUntil'] = {
this.setHelpUrl(Blockly.Msg.CONTROLS_WHILEUNTIL_HELPURL);
this.setColour(getColour().loops);
this.appendValueInput('BOOL')
.setCheck(getCompatibleTypes(Boolean))
.setCheck(getCompatibleTypes('boolean'))
.appendField(new Blockly.FieldDropdown(OPERATORS), 'MODE');
this.appendStatementInput('DO')
.appendField(Blockly.Msg.CONTROLS_WHILEUNTIL_INPUT_DO);
@ -53,19 +53,19 @@ Blockly.Blocks['controls_for'] = {
{
"type": "input_value",
"name": "FROM",
"check": getCompatibleTypes(Number),
"check": getCompatibleTypes('int'),
"align": "RIGHT"
},
{
"type": "input_value",
"name": "TO",
"check": getCompatibleTypes(Number),
"check": getCompatibleTypes('int'),
"align": "RIGHT"
},
{
"type": "input_value",
"name": "BY",
"check": getCompatibleTypes(Number),
"check": getCompatibleTypes('int'),
"align": "RIGHT"
}
],
@ -104,7 +104,7 @@ Blockly.Blocks['controls_forEach'] = {
{
"type": "input_value",
"name": "LIST",
"check": getCompatibleTypes(Array)
"check": getCompatibleTypes('Array')
}
],
"previousStatement": null,
@ -197,7 +197,7 @@ Blockly.Blocks['controls_repeat_ext'] = {
{
"type": "input_value",
"name": "TIMES",
"check": getCompatibleTypes(Number),
"check": getCompatibleTypes('int'),
}
],
"previousStatement": null,

4
src/components/Blockly/blocks/procedures.js
View File

@ -1148,9 +1148,7 @@ Blockly.Blocks['procedures_callnoreturn'] = {
// This should only be possible programatically and may indicate a problem
// with event grouping. If you see this message please investigate. If the
// use ends up being valid we may need to reorder events in the undo stack.
console.log(
'Saw an existing group while responding to a definition change'
);
}
Blockly.Events.setGroup(event.group);
if (event.newValue) {

2
src/components/Blockly/blocks/sensebox-osem.js
View File

@ -73,7 +73,6 @@ Blockly.Blocks['sensebox_osem_connection'] = {
* Blockly.Blocks['controls_flow_statements'].LOOP_TYPES.push('custom_loop');
*/
selectedBox = this.getFieldValue('BoxID');
console.log(selectedBox)
if (selectedBox !== '' && boxes) {
var accessToken = boxes.find(element => element._id === selectedBox).access_token
if (accessToken !== undefined) {
@ -160,7 +159,6 @@ Blockly.Blocks['sensebox_send_to_osem'] = {
for (var i = 0; i < box.sensors.length; i++) {
dropdown.push([box.sensors[i].title, box.sensors[i]._id])
}
console.log(dropdown)
}
if (dropdown.length > 1) {
var options = dropdown.slice(1)

36
src/components/Blockly/blocks/sensebox.js
View File

@ -1,4 +1,36 @@
import * as Blockly from "blockly/core";
import { getColour } from "../helpers/colour";
import * as Types from "../helpers/types";
Blockly.Blocks["sensebox_multiplexer_init"] = {
init: function () {
this.appendDummyInput().appendField(Blockly.Msg.senseBox_multiplexer_init);
this.appendValueInput("nrChannels").setCheck(
Types.getCompatibleTypes("int")
);
this.appendDummyInput().appendField(
Blockly.Msg.senseBox_multplexer_nchannels
);
this.setPreviousStatement(true, null);
this.setNextStatement(true, null);
this.setInputsInline("true");
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.senseBox_multiplexer_init_tooltip);
this.setHelpUrl(Blockly.Msg.senseBox_multiplexer_init_helpurl);
},
};
Blockly.Blocks["sensebox_multiplexer_changeChannel"] = {
init: function () {
this.appendDummyInput().appendField(
Blockly.Msg.senseBox_multiplexer_changeChannel
);
this.appendValueInput("Channel").setCheck(Types.getCompatibleTypes("int"));
this.setInputsInline("true");
this.setPreviousStatement(true, null);
this.setNextStatement(true, null);
this.setColour(getColour().sensebox);
this.setTooltip(Blockly.Msg.sensebox_multiplexer_changeChannel_tooltip);
this.setHelpUrl(Blockly.Msg.sensebox_multiplexer_changeChannel_helpurl);
},
};

81
src/components/Blockly/blocks/variables.js
View File

@ -1,43 +1,46 @@
import Blockly from 'blockly/core';
import { getColour } from '../helpers/colour';
import { getCompatibleTypes } from '../helpers/types'
Blockly.Blocks['variables_set_dynamic'] = {
init: function () {
// const type = myVar.type;
this.setColour(getColour().variables);
this.setPreviousStatement(true, null);
this.setNextStatement(true, null);
this.appendValueInput('VALUE')
.appendField('set', 'set')
.appendField('', 'type')
.appendField(new Blockly.FieldVariable('VAR'), 'VAR')
.appendField('to');
},
onchange: function (e) {
let variableID = this.getFieldValue('VAR');
let variable = Blockly.getMainWorkspace().getVariableMap().getVariableById(variableID)
this.getField('type').setValue(variable.type);
this.getInput('VALUE').setCheck(getCompatibleTypes(variable.type));
import Blockly from "blockly/core";
import { getColour } from "../helpers/colour";
import { getCompatibleTypes } from "../helpers/types";
Blockly.Blocks["variables_set_dynamic"] = {
init: function () {
// const type = myVar.type;
this.setColour(getColour().variables);
this.setPreviousStatement(true, null);
this.setNextStatement(true, null);
this.appendValueInput("VALUE")
.appendField("set", "set")
.appendField("", "type")
.appendField(new Blockly.FieldVariable("VAR"), "VAR")
.appendField("to");
},
onchange: function (e) {
let variableID = this.getFieldValue("VAR");
let variable = Blockly.getMainWorkspace()
.getVariableMap()
.getVariableById(variableID);
if (variable !== null) {
this.getField("type").setValue(variable.type);
this.getInput("VALUE").setCheck(getCompatibleTypes(variable.type));
}
}
Blockly.Blocks['variables_get_dynamic'] = {
init: function () {
this.setColour(getColour().variables);
this.appendDummyInput()
.appendField('', 'type')
.appendField(new Blockly.FieldVariable('VAR'), 'VAR');
this.setOutput(true);
},
onchange: function (e) {
let variableID = this.getFieldValue('VAR');
let variable = Blockly.getMainWorkspace().getVariableMap().getVariableById(variableID)
this.getField('type').setValue(variable.type);
},
};
Blockly.Blocks["variables_get_dynamic"] = {
init: function () {
this.setColour(getColour().variables);
this.appendDummyInput()
.appendField("", "type")
.appendField(new Blockly.FieldVariable("VAR"), "VAR");
this.setOutput(true);
},
onchange: function (e) {
let variableID = this.getFieldValue("VAR");
let variable = Blockly.getMainWorkspace()
.getVariableMap()
.getVariableById(variableID);
if (variable !== null) {
this.getField("type").setValue(variable.type);
}
}
},
};

1
src/components/Blockly/generator/index.js
View File

@ -7,6 +7,7 @@ import "./sensebox-web";
import "./sensebox-display";
import "./sensebox-lora";
import "./sensebox-led";
import "./sensebox";
import "./sensebox-rtc";
import "./sensebox-ble";
import "./sensebox-sd";

1
src/components/Blockly/generator/procedures.js
View File

@ -68,7 +68,6 @@ Blockly.Arduino['procedures_defreturn'] = function (block) {
};
function translateType(type) {
console.log(type);
switch (type) {
case 'int':

1
src/components/Blockly/generator/sensebox-led.js
View File

@ -33,7 +33,6 @@ Blockly.Arduino.sensebox_ws2818_led = function () {
var dropdown_pin = this.getFieldValue('Port');
var position = Blockly.Arduino.valueToCode(this, 'POSITION', Blockly.Arduino.ORDER_ATOMIC) || '0';
var color = Blockly.Arduino.valueToCode(this, 'COLOR', Blockly.Arduino.ORDER_ATOMIC) || '0'
console.log(color)
var code = `rgb_led_${dropdown_pin}.setPixelColor(${position},rgb_led_${dropdown_pin}.Color(${color}));\nrgb_led_${dropdown_pin}.show();\n`;
return code;
};

39
src/components/Blockly/generator/sensebox.js
View File

@ -1,3 +1,38 @@
import * as Blockly from 'blockly/core';
import { Block } from 'blockly';
import * as Blockly from "blockly/core";
/*
* Multiplexer
*/
Blockly.Arduino.sensebox_multiplexer_init = function () {
// Blockly.Arduino.libraries_['library_spi'] = '#include <SPI.h>';
var nrChannels =
Blockly.Arduino.valueToCode(
this,
"nrChannels",
Blockly.Arduino.ORDER_ATOMIC
) | 0;
var array = [];
for (var i = 0; i < nrChannels; i++) {
array.push(i);
}
Blockly.Arduino.libraries_["library_wire"] = "#include <Wire.h>";
Blockly.Arduino.definitions_[
"define_multiplexer"
] = `byte multiplexAddress = 0x77;
byte channels[] = {${array}};`;
// Blockly.Arduino.setupCode_['sensebox_display_begin'] = 'senseBoxIO.powerI2C(true);\ndelay(2000);\ndisplay.begin(SSD1306_SWITCHCAPVCC, 0x3D);\ndisplay.display();\ndelay(100);\ndisplay.clearDisplay();';
var code = "";
return code;
};
Blockly.Arduino.sensebox_multiplexer_changeChannel = function () {
var channel = Blockly.Arduino.valueToCode(
this,
"Channel",
Blockly.Arduino.ORDER_ATOMIC
);
var code = `Wire.beginTransmission(0x77);
Wire.write(1 << channels[${channel - 1}]);
Wire.endTransmission();`;
return code;
};

90
src/components/Blockly/generator/variables.js
View File

@ -1,52 +1,60 @@
import Blockly from 'blockly';
import Blockly from "blockly";
const setVariableFunction = function (defaultValue) {
return function (block) {
const variableName = Blockly['Arduino'].variableDB_.getName(
block.getFieldValue('VAR'),
Blockly.Variables.NAME_TYPE
);
const variableValue = Blockly['Arduino'].valueToCode(
block,
'VALUE',
Blockly['Arduino'].ORDER_ATOMIC
);
return function (block) {
const variableName = Blockly["Arduino"].variableDB_.getName(
block.getFieldValue("VAR"),
Blockly.Variables.NAME_TYPE
);
const variableValue = Blockly["Arduino"].valueToCode(
block,
"VALUE",
Blockly["Arduino"].ORDER_ATOMIC
);
const allVars = Blockly.getMainWorkspace().getVariableMap().getAllVariables();
const myVar = allVars.filter(v => v.name === variableName)[0]
var code = ''
const allVars = Blockly.getMainWorkspace()
.getVariableMap()
.getAllVariables();
const myVar = allVars.filter((v) => v.name === variableName)[0];
var code = "";
switch (myVar.type) {
default:
Blockly.Arduino.variables_[myVar + myVar.type] = myVar.type + " " + myVar.name + ';\n';
code = variableName + ' = ' + (variableValue || defaultValue) + ';\n';
break;
case 'Array':
var arrayType;
var number;
switch (myVar.type) {
default:
Blockly.Arduino.variables_[variableName + myVar.type] =
myVar.type + " " + myVar.name + ";\n";
code = variableName + " = " + (variableValue || defaultValue) + ";\n";
break;
case "Array":
var arrayType;
var number;
if (this.getChildren().length > 0) {
if (this.getChildren()[0].type === 'lists_create_empty') {
arrayType = this.getChildren()[0].getFieldValue('type');
number = Blockly.Arduino.valueToCode(this.getChildren()[0], 'NUMBER', Blockly['Arduino'].ORDER_ATOMIC);
Blockly.Arduino.variables_[myVar + myVar.type] = `${arrayType} ${myVar.name} [${number}];\n`;
}
}
break;
if (this.getChildren().length > 0) {
if (this.getChildren()[0].type === "lists_create_empty") {
arrayType = this.getChildren()[0].getFieldValue("type");
number = Blockly.Arduino.valueToCode(
this.getChildren()[0],
"NUMBER",
Blockly["Arduino"].ORDER_ATOMIC
);
Blockly.Arduino.variables_[
myVar + myVar.type
] = `${arrayType} ${myVar.name} [${number}];\n`;
}
}
return code;
};
break;
}
return code;
};
};
const getVariableFunction = function (block) {
const variableName = Blockly['Arduino'].variableDB_.getName(
block.getFieldValue('VAR'),
Blockly.Variables.NAME_TYPE
);
var code = variableName;
return [code, Blockly['Arduino'].ORDER_ATOMIC];
const variableName = Blockly["Arduino"].variableDB_.getName(
block.getFieldValue("VAR"),
Blockly.Variables.NAME_TYPE
);
var code = variableName;
return [code, Blockly["Arduino"].ORDER_ATOMIC];
};
Blockly['Arduino']['variables_set_dynamic'] = setVariableFunction()
Blockly['Arduino']['variables_get_dynamic'] = getVariableFunction;
Blockly["Arduino"]["variables_set_dynamic"] = setVariableFunction();
Blockly["Arduino"]["variables_get_dynamic"] = getVariableFunction;

132
src/components/Blockly/helpers/types.js
View File

@ -105,135 +105,3 @@ export const getCompatibleTypes = (type) => {
};
export const VARIABLE_TYPES = [['SHORT_NUMBER', 'char'], ['NUMBER', 'int'], ['DECIMAL', 'long'], ['TEXT', 'String'], ['CHARACTER', 'char'], ['BOOLEAN', 'boolean'], ['NULL', 'void'], ['UNDEF', 'undefined']];
// /**
// * Some Types have circular dependencies on their compatibilities, so add them
// * after declaration.
// */
// Blockly.Types.NUMBER.addCompatibleTypes([
// Blockly.Types.BOOLEAN,
// Blockly.Types.SHORT_NUMBER,
// Blockly.Types.LARGE_NUMBER,
// Blockly.Types.DECIMAL]);
// Blockly.Types.SHORT_NUMBER.addCompatibleTypes([
// Blockly.Types.BOOLEAN,
// Blockly.Types.NUMBER,
// Blockly.Types.LARGE_NUMBER,
// Blockly.Types.DECIMAL]);
// Blockly.Types.LARGE_NUMBER.addCompatibleTypes([
// Blockly.Types.BOOLEAN,
// Blockly.Types.SHORT_NUMBER,
// Blockly.Types.NUMBER,
// Blockly.Types.DECIMAL]);
// /**
// * Adds another type to the Blockly.Types collection.
// * @param {string} typeId_ Identifiable name of the type.
// * @param {string} typeMsgName_ Name of the member variable from Blockly.Msg
// * object to identify the translateble string.for the Type name.
// * @param {Array<Blockly.Type>} compatibleTypes_ List of types this Type is
// * compatible with.
// */
// Blockly.Types.addType = function (typeId_, typeMsgName_, compatibleTypes_) {
// // The Id is used as the key from the value pair in the BlocklyTypes object
// var key = typeId_.toUpperCase().replace(/ /g, '_');
// if (Blockly.Types[key] !== undefined) {
// throw 'The Blockly type ' + key + ' already exists.';
// }
// Blockly.Types[key] = new Blockly.Type({
// typeId: typeId_,
// typeName: typeMsgName_,
// compatibleTypes: compatibleTypes_
// });
// };
// /**
// * Converts the static types dictionary in to a an array with 2-item arrays.
// * This array only contains the valid types, excluding any error or temp types.
// * @return {!Array<Array<string>>} Blockly types in the format described above.
// */
// Blockly.Types.getValidTypeArray = function () {
// var typesArray = [];
// for (var typeKey in Blockly.Types) {
// if ((typeKey !== 'UNDEF') && (typeKey !== 'CHILD_BLOCK_MISSING') &&
// (typeKey !== 'NULL') && (typeKey !== 'ARRAY') &&
// (typeof Blockly.Types[typeKey] !== 'function') &&
// !(Blockly.Types[typeKey] instanceof RegExp)) {
// typesArray.push([Blockly.Types[typeKey].typeName, typeKey]);
// }
// }
// return typesArray;
// };
// /**
// * Navigates through child blocks of the argument block to get this block type.
// * @param {!Blockly.Block} block Block to navigate through children.
// * @return {Blockly.Type} Type of the input block.
// */
// Blockly.Types.getChildBlockType = function (block) {
// var blockType = null;
// var nextBlock = block;
// // Only checks first input block, so it decides the type. Incoherences amongst
// // multiple inputs dealt at a per-block level with their own block warnings
// while (nextBlock && (nextBlock.getBlockType === undefined) &&
// (nextBlock.inputList.length > 0) &&
// (nextBlock.inputList[0].connection)) {
// nextBlock = nextBlock.inputList[0].connection.targetBlock();
// }
// if (nextBlock === block) {
// // Set variable block is empty, so no type yet
// blockType = Blockly.Types.CHILD_BLOCK_MISSING;
// } else if (nextBlock === null) {
// // Null return from targetBlock indicates no block connected
// blockType = Blockly.Types.CHILD_BLOCK_MISSING;
// } else {
// var func = nextBlock.getBlockType;
// if (func) {
// blockType = nextBlock.getBlockType();
// } else {
// // Most inner block, supposed to define a type, is missing getBlockType()
// blockType = Blockly.Types.NULL;
// }
// }
// return blockType;
// };
// /**
// * Regular expressions to identify an integer.
// * @private
// */
// Blockly.Types.regExpInt_ = new RegExp(/^-?\d+$/);
// /**
// * Regular expressions to identify a decimal.
// * @private
// */
// Blockly.Types.regExpFloat_ = new RegExp(/^-?[0-9]*[.][0-9]+$/);
// /**
// * Uses regular expressions to identify if the input number is an integer or a
// * floating point.
// * @param {string} numberString String of the number to identify.
// * @return {!Blockly.Type} Blockly type.
// */
// Blockly.Types.identifyNumber = function (numberString) {
// if (Blockly.Types.regExpInt_.test(numberString)) {
// var intValue = parseInt(numberString);
// if (isNaN(intValue)) {
// return Blockly.Types.NULL;
// }
// if (intValue > 32767 || intValue < -32768) {
// return Blockly.Types.LARGE_NUMBER;
// }
// return Blockly.Types.NUMBER;
// } else if (Blockly.Types.regExpFloat_.test(numberString)) {
// return Blockly.Types.DECIMAL;
// }
// return Blockly.Types.NULL;
// };

2
src/components/Blockly/msg/de.js
View File

@ -13,6 +13,7 @@ import { OSEM } from "./de/sensebox-osem";
import { RTC } from "./de/sensebox-rtc";
import { SD } from "./de/sensebox-sd";
import { SENSORS } from "./de/sensebox-sensors";
import { SENSEBOX } from "./de/sensebox";
import { TELEGRAM } from "./de/sensebox-telegram";
import { WEB } from "./de/sensebox-web";
import { TEXT } from "./de/text";
@ -39,6 +40,7 @@ export const De = {
...RTC,
...SD,
...SENSORS,
...SENSEBOX,
...TELEGRAM,
...WEB,
...TEXT,

16
src/components/Blockly/msg/de/sensebox.js Normal file
View File

@ -0,0 +1,16 @@
export const SENSEBOX = {
/**
* Multiplexer
*/
senseBox_multiplexer_init: "Initialisiere Multiplexer mit ",
senseBox_multiplexer_init_tooltip:
"Schließe den Multiplexer mit einem JST-JST Kabel an einen der 5 I2C-Ports an. Nun kannst du bis zu 8 gleiche Sensoren verwenden über die entsprechenden Kanäle ansprechen. Gib im Block die Anzahl der verwendeten Kanäle an",
senseBox_multiplexer_init_helpurl:
"https://docs.sensebox.de/hardware/zubehoer-multiplexer/",
senseBox_multplexer_nchannels: "Kanälen",
senseBox_multiplexer_changeChannel: "Wechsel Kanal auf:",
sensebox_multiplexer_changeChannel_tooltip:
"Wähle den entsprechenden Kanal aus",
sensebox_multiplexer_changeChannel_helpurl:
"https://docs.sensebox.de/hardware/zubehoer-multiplexer/",
};

413
src/components/Blockly/msg/de/ui.js
View File

@ -1,224 +1,265 @@
export const UI = {
/**
* Toolbox
*/
toolbox_sensors: "Sensoren",
toolbox_logic: "Logik",
toolbox_loops: "Schleifen",
toolbox_math: "Mathematik",
toolbox_io: "Eingang/Ausgang",
toolbox_time: "Zeit",
toolbox_functions: "Funktionen",
toolbox_variables: "Variablen",
/**
* Toolbox
*/
toolbox_sensors: "Sensoren",
toolbox_logic: "Logik",
toolbox_loops: "Schleifen",
toolbox_math: "Mathematik",
toolbox_io: "Eingang/Ausgang",
toolbox_time: "Zeit",
toolbox_functions: "Funktionen",
toolbox_variables: "Variablen",
variable_NUMBER: "Zahl (int)",
variable_SHORT_NUMBER: "char",
variable_LONG: "große Zahl (long)",
variable_DECIMAL: "Kommazahl (float)",
variables_TEXT: "Text (string)",
variables_ARRAY: "Array (array)",
variables_CHARACTER: "char (char)",
variables_BOOLEAN: "Boolean (boolean)",
variables_NULL: "void (void)",
variables_UNDEF: "undefined",
/**
* Tooltips
*
*/
/**
* Tooltips
*
*/
tooltip_compile_code: "Code kompilieren",
tooltip_save_blocks: "Blöcke speichern",
tooltip_open_blocks: "Blöcke öffnen",
tooltip_screenshot: "Screenshot erstellen",
tooltip_clear_workspace: "Workspace zurücksetzen",
tooltip_share_blocks: "Blöcke teilen",
tooltip_show_code: "Code anzeigen",
tooltip_hide_code: "Code ausblenden",
tooltip_delete_project: "Projekt löschen",
tooltip_project_name: "Name des Projektes",
tooltip_download_project: "Projekt herunterladen",
tooltip_open_project: "Projekt öffnen",
tooltip_update_project: "Projekt aktualisieren",
tooltip_save_project: "Projekt speichern",
tooltip_create_project: "Projekt erstellen",
tooltip_share_project: "Projekt teilen",
tooltip_reset_workspace: "Workspace zurücksetzen",
tooltip_copy_link: "Link kopieren",
tooltip_trashcan_hide: 'gelöschte Blöcke ausblenden',
tooltip_trashcan_delete: 'Blöcke endgültig löschen',
tooltip_project_title: "Titel des Projektes",
tooltip_check_solution: "Lösung kontrollieren",
tooltip_copy_code: "Code in die Zwischenablage kopieren",
tooltip_compile_code: "Code kompilieren",
tooltip_save_blocks: "Blöcke speichern",
tooltip_open_blocks: "Blöcke öffnen",
tooltip_screenshot: "Screenshot erstellen",
tooltip_clear_workspace: "Workspace zurücksetzen",
tooltip_share_blocks: "Blöcke teilen",
tooltip_show_code: "Code anzeigen",
tooltip_hide_code: "Code ausblenden",
tooltip_delete_project: "Projekt löschen",
tooltip_project_name: "Name des Projektes",
tooltip_download_project: "Projekt herunterladen",
tooltip_open_project: "Projekt öffnen",
tooltip_update_project: "Projekt aktualisieren",
tooltip_save_project: "Projekt speichern",
tooltip_create_project: "Projekt erstellen",
tooltip_share_project: "Projekt teilen",
tooltip_reset_workspace: "Workspace zurücksetzen",
tooltip_copy_link: "Link kopieren",
tooltip_trashcan_hide: "gelöschte Blöcke ausblenden",
tooltip_trashcan_delete: "Blöcke endgültig löschen",
tooltip_project_title: "Titel des Projektes",
tooltip_check_solution: "Lösung kontrollieren",
tooltip_copy_code: "Code in die Zwischenablage kopieren",
/**
* Messages
*
*/
/**
* Messages
*
*/
messages_delete_project_failed: "Fehler beim Löschen des Projektes. Versuche es noch einmal.",
messages_reset_workspace_success: "Das Projekt wurde erfolgreich zurückgesetzt",
messages_PROJECT_UPDATE_SUCCESS: "Das Projekt wurde erfolgreich aktualisiert.",
messages_GALLERY_UPDATE_SUCCESS: "Das Galerie-Projekt wurde erfolgreich aktualisiert.",
messages_PROJECT_UPDATE_FAIL: "Fehler beim Aktualisieren des Projektes. Versuche es noch einmal.",
messages_GALLERY_UPDATE_FAIL: "Fehler beim Aktualisieren des Galerie-Projektes. Versuche es noch einmal.",
messages_gallery_save_fail_1: "Fehler beim Speichern des ",
messages_gallery_save_fail_2: "Projektes. Versuche es noch einmal.",
messages_SHARE_SUCCESS: 'Programm teilen',
messages_SHARE_FAIL: "Fehler beim Erstellen eines Links zum Teilen deines Programmes. Versuche es noch einmal.",
messages_copylink_success: 'Link erfolgreich in Zwischenablage gespeichert.',
messages_rename_success_01: 'Das Projekt wurde erfolgreich in ',
messages_rename_success_02: 'umbenannt.',
messages_newblockly_head: "Willkommen zur neuen Version Blockly für die senseBox",
messages_newblockly_text: "Die neue Blockly-Version befindet sich derzeit in der Testphase. Wenn Sie einen Fehler finden, melden Sie diesen bitte in unserem [Forum](https://forum.sensebox.de/t/neue-blockly-version-beta-test-und-feedback/1176). Eine Übersicht über alle neuen Funktionen finden Sie [hier](/news)",
messages_GET_TUTORIAL_FAIL: 'Zurück zur Tutorials-Übersicht',
messages_LOGIN_FAIL: 'Der Benutzername oder das Passwort ist nicht korrekt.',
messages_copy_code: "Code wurde in die Zwischenablage kopiert",
/**
* Share Dialog
*/
messages_delete_project_failed:
"Fehler beim Löschen des Projektes. Versuche es noch einmal.",
messages_reset_workspace_success:
"Das Projekt wurde erfolgreich zurückgesetzt",
messages_PROJECT_UPDATE_SUCCESS:
"Das Projekt wurde erfolgreich aktualisiert.",
messages_GALLERY_UPDATE_SUCCESS:
"Das Galerie-Projekt wurde erfolgreich aktualisiert.",
messages_PROJECT_UPDATE_FAIL:
"Fehler beim Aktualisieren des Projektes. Versuche es noch einmal.",
messages_GALLERY_UPDATE_FAIL:
"Fehler beim Aktualisieren des Galerie-Projektes. Versuche es noch einmal.",
messages_gallery_save_fail_1: "Fehler beim Speichern des ",
messages_gallery_save_fail_2: "Projektes. Versuche es noch einmal.",
messages_SHARE_SUCCESS: "Programm teilen",
messages_SHARE_FAIL:
"Fehler beim Erstellen eines Links zum Teilen deines Programmes. Versuche es noch einmal.",
messages_copylink_success: "Link erfolgreich in Zwischenablage gespeichert.",
messages_rename_success_01: "Das Projekt wurde erfolgreich in ",
messages_rename_success_02: "umbenannt.",
messages_newblockly_head:
"Willkommen zur neuen Version Blockly für die senseBox",
messages_newblockly_text:
"Die neue Blockly-Version befindet sich derzeit in der Testphase. Wenn Sie einen Fehler finden, melden Sie diesen bitte in unserem [Forum](https://forum.sensebox.de/t/neue-blockly-version-beta-test-und-feedback/1176). Eine Übersicht über alle neuen Funktionen finden Sie [hier](/news)",
messages_GET_TUTORIAL_FAIL: "Zurück zur Tutorials-Übersicht",
messages_LOGIN_FAIL: "Der Benutzername oder das Passwort ist nicht korrekt.",
messages_copy_code: "Code wurde in die Zwischenablage kopiert",
sharedialog_headline: "Dein Link wurde erstellt.",
sharedialog_text: "Über den folgenden Link kannst du dein Programm teilen.",
/**
* Reset Dialog
*/
/**
* Project rename Dialog
*/
resetDialog_headline: "Workspace zurücksetzen?",
resetDialog_text:
"Möchtest du wirklich die Workspace zurücksetzen? Hierbei werden alle Blöcke gelöscht!",
renamedialog_headline: "Projekt benennen",
renamedialog_text: "Bitte gib einen Namen für das Projekt ein und bestätige diesen mit einem Klick auf 'Bestätigen'.",
/**
* Share Dialog
*/
/**
* Compile Dialog
*
*/
sharedialog_headline: "Dein Link wurde erstellt.",
sharedialog_text: "Über den folgenden Link kannst du dein Programm teilen.",
compiledialog_headline: "Fehler",
compiledialog_text: "Beim kompilieren ist ein Fehler aufgetreten. Überprüfe deine Blöcke und versuche es erneut",
/**
* Project rename Dialog
*/
/**
* Buttons
*
*/
renamedialog_headline: "Projekt benennen",
renamedialog_text:
"Bitte gib einen Namen für das Projekt ein und bestätige diesen mit einem Klick auf 'Bestätigen'.",
button_cancel: "Abbrechen",
button_close: "Schließen",
button_accept: "Bestätigen",
button_compile: "Kompilieren",
button_create_variableCreate: "Erstelle Variable",
button_back: "Zurück",
button_next: "nächster Schritt",
button_tutorial_overview: "Tutorial Übersicht",
button_login: "Anmelden",
/**
* Compile Dialog
*
*/
/**
*
*/
compiledialog_headline: "Fehler",
compiledialog_text:
"Beim kompilieren ist ein Fehler aufgetreten. Überprüfe deine Blöcke und versuche es erneut",
filename: "Dateiname",
projectname: "Projektname",
/**
* Buttons
*
*/
/**
* Settings
*/
settings_head: "Einstellungen",
settings_language: "Sprache",
settings_language_text: "Auswahl der Sprache gilt für die gesamte Anwendung. Es kann zwischen Deutsch und Englisch unterschieden werden.",
settings_language_de: "Deutsch",
settings_language_en: "Englisch",
settings_renderer: "Renderer",
settings_renderer_text: "Der eingestellte Renderer bestimmt das Aussehen der Blöcke. Es kann zwischen 'Geras' und 'Zelos' unterschieden werden, wobei 'Zelos' insbesondere für eine Touch-Anwendung geeignet ist.",
settings_statistics: "Statistiken",
settings_statistics_text: "Die Anzeige von Statistiken zur Nutzung der Blöcke oberhalb der Arbeitsfläche kann ein- oder ausgeblendet werden.",
settings_statistics_on: "An",
settings_statistics_off: "Aus",
button_cancel: "Abbrechen",
button_close: "Schließen",
button_accept: "Bestätigen",
button_compile: "Kompilieren",
button_create_variableCreate: "Erstelle Variable",
button_back: "Zurück",
button_next: "nächster Schritt",
button_tutorial_overview: "Tutorial Übersicht",
button_login: "Anmelden",
/**
* 404
*/
/**
*
*/
notfound_head: "Die von Ihnen angeforderte Seite kann nicht gefunden werden.",
notfound_text: "Die gesuchte Seite wurde möglicherweise entfernt, ihr Name wurde geändert oder sie ist vorübergehend nicht verfügbar.",
filename: "Dateiname",
projectname: "Projektname",
/**
* Settings
*/
settings_head: "Einstellungen",
settings_language: "Sprache",
settings_language_text:
"Auswahl der Sprache gilt für die gesamte Anwendung. Es kann zwischen Deutsch und Englisch unterschieden werden.",
settings_language_de: "Deutsch",
settings_language_en: "Englisch",
settings_renderer: "Renderer",
settings_renderer_text:
"Der eingestellte Renderer bestimmt das Aussehen der Blöcke. Es kann zwischen 'Geras' und 'Zelos' unterschieden werden, wobei 'Zelos' insbesondere für eine Touch-Anwendung geeignet ist.",
settings_statistics: "Statistiken",
settings_statistics_text:
"Die Anzeige von Statistiken zur Nutzung der Blöcke oberhalb der Arbeitsfläche kann ein- oder ausgeblendet werden.",
settings_statistics_on: "An",
settings_statistics_off: "Aus",
/**
* Labels
*/
/**
* 404
*/
labels_donotshowagain: 'Dialog nicht mehr anzeigen',
labels_here: "hier",
labels_username: 'E-Mail oder Nutzername',
labels_password: "Passwort",
notfound_head: "Die von Ihnen angeforderte Seite kann nicht gefunden werden.",
notfound_text:
"Die gesuchte Seite wurde möglicherweise entfernt, ihr Name wurde geändert oder sie ist vorübergehend nicht verfügbar.",
/**
* Badges
*/
/**
* Labels
*/
badges_explaination: "Eine Übersicht über alle erhaltenen Badges im Kontext Blockly for senseBox findest du ",
badges_ASSIGNE_BADGE_SUCCESS_01: "Herzlichen Glückwunsch! Du hast den Badge ",
badges_ASSIGNE_BADGE_SUCCESS_02: " erhalten.",
/**
* Tutorials
*/
labels_donotshowagain: "Dialog nicht mehr anzeigen",
labels_here: "hier",
labels_username: "E-Mail oder Nutzername",
labels_password: "Passwort",
tutorials_assessment_task: "Aufgabe",
tutorials_hardware_head: "Für die Umsetzung benötigst du folgende Hardware:",
tutorials_hardware_moreInformation: "Weitere Informationen zur Hardware-Komponente findest du",
tutorials_hardware_here: "hier",
tutorials_requirements: "Bevor du mit diesem Tutorial fortfährst solltest du folgende Tutorials erfolgreich abgeschlossen haben:",
/**
* Badges
*/
badges_explaination:
"Eine Übersicht über alle erhaltenen Badges im Kontext Blockly for senseBox findest du ",
badges_ASSIGNE_BADGE_SUCCESS_01: "Herzlichen Glückwunsch! Du hast den Badge ",
badges_ASSIGNE_BADGE_SUCCESS_02: " erhalten.",
/**
* Tutorials
*/
/**
* Tutorial Builder
*/
tutorials_assessment_task: "Aufgabe",
tutorials_hardware_head: "Für die Umsetzung benötigst du folgende Hardware:",
tutorials_hardware_moreInformation:
"Weitere Informationen zur Hardware-Komponente findest du",
tutorials_hardware_here: "hier",
tutorials_requirements:
"Bevor du mit diesem Tutorial fortfährst solltest du folgende Tutorials erfolgreich abgeschlossen haben:",
builder_solution: "Lösung",
builder_solution_submit: "Lösung einreichen",
builder_example_submit: "Beispiel einreichen",
builder_comment: "Anmerkung: Man kann den initialen Setup()- bzw. Endlosschleifen()-Block löschen. Zusätzlich ist es möglich u.a. nur einen beliebigen Block auszuwählen, ohne dass dieser als deaktiviert dargestellt wird.",
builder_hardware_order: "Beachte, dass die Reihenfolge des Auswählens maßgebend ist.",
builder_hardware_helper: "Wähle mindestens eine Hardware-Komponente aus.",
builder_requirements_head: "Voraussetzungen",
builder_requirements_order: "Beachte, dass die Reihenfolge des Anhakens maßgebend ist.",
/**
* Tutorial Builder
*/
/**
* Login
*/
builder_solution: "Lösung",
builder_solution_submit: "Lösung einreichen",
builder_example_submit: "Beispiel einreichen",
builder_comment:
"Anmerkung: Man kann den initialen Setup()- bzw. Endlosschleifen()-Block löschen. Zusätzlich ist es möglich u.a. nur einen beliebigen Block auszuwählen, ohne dass dieser als deaktiviert dargestellt wird.",
builder_hardware_order:
"Beachte, dass die Reihenfolge des Auswählens maßgebend ist.",
builder_hardware_helper: "Wähle mindestens eine Hardware-Komponente aus.",
builder_requirements_head: "Voraussetzungen",
builder_requirements_order:
"Beachte, dass die Reihenfolge des Anhakens maßgebend ist.",
/**
* Login
*/
login_head: "Anmelden",
login_osem_account_01: "Du benötigst einen ",
login_osem_account_02: "Account um dich einzuloggen",
login_lostpassword: "Du hast dein Passwort vergessen?",
login_createaccount: "Falls du noch keinen Account hast erstellen einen auf ",
/**
* Navbar
*/
login_head: "Anmelden",
login_osem_account_01: "Du benötigst einen ",
login_osem_account_02: "Account um dich einzuloggen",
login_lostpassword: "Du hast dein Passwort vergessen?",
login_createaccount: "Falls du noch keinen Account hast erstellen einen auf ",
/**
* Navbar
*/
navbar_tutorials: "Tutorials",
navbar_tutorialbuilder: "Tutorial erstellen",
navbar_gallery: "Gallerie",
navbar_projects: "Projekte",
navbar_tutorials: "Tutorials",
navbar_tutorialbuilder: "Tutorial erstellen",
navbar_gallery: "Gallerie",
navbar_projects: "Projekte",
navbar_menu: "Menü",
navbar_login: "Einloggen",
navbar_mybadges: "myBadges",
navbar_account: "Konto",
navbar_logout: "Abmelden",
navbar_settings: "Einstellungen",
navbar_menu: "Menü",
navbar_login: "Einloggen",
navbar_mybadges: "myBadges",
navbar_account: "Konto",
navbar_logout: "Abmelden",
navbar_settings: "Einstellungen",
/**
* Codeviewer
*/
/**
* Codeviewer
*/
codeviewer_arduino: "Arduino Quellcode",
codeviewer_xml: "XML Blöcke",
codeviewer_arduino: "Arduino Quellcode",
codeviewer_xml: "XML Blöcke",
/**
* Overlay
*/
compile_overlay_head: "Dein Programm wird nun kompiliert und heruntergeladen",
compile_overlay_text: "Kopiere es anschließend auf deine senseBox MCU",
compile_overlay_help: "Benötigst du mehr Hilfe? Dann schaue hier: ",
/**
* Overlay
*/
/**
* Tooltip Viewer
*/
compile_overlay_head: "Dein Programm wird nun kompiliert und heruntergeladen",
compile_overlay_text: "Kopiere es anschließend auf deine senseBox MCU",
compile_overlay_help: "Benötigst du mehr Hilfe? Dann schaue hier: ",
tooltip_viewer: "Hilfe",
tooltip_moreInformation: "Mehr Informationen findest du ",
tooltip_hint: "Wähle einen Block aus um dir die Hilfe anzeigen zu lassen",
/**
* Tooltip Viewer
*/
tooltip_viewer: "Hilfe",
tooltip_moreInformation: "Mehr Informationen findest du ",
tooltip_hint: "Wähle einen Block aus um dir die Hilfe anzeigen zu lassen",
}
/**
* IDEDrawer
*/
drawer_ideerror_head: "Hoppla da ist was schief gegangen.",
drawer_ideerror_text:
"Beim kompilieren ist ein Fehler aufgetreten, überprüfe deine Blöcke.",
};

2
src/components/Blockly/msg/en.js
View File

@ -6,6 +6,7 @@ import { LOGIC } from "./en/logic";
import { LOOPS } from "./en/loops";
import { MATH } from "./en/math";
import { MQTT } from "./en/mqtt";
import { SENSEBOX } from "./en/sensebox";
import { DISPLAY } from "./en/sensebox-display";
import { LED } from "./en/sensebox-led";
import { LORA } from "./en/sensebox-lora";
@ -39,6 +40,7 @@ export const En = {
...RTC,
...SD,
...SENSORS,
...SENSEBOX,
...TELEGRAM,
...WEB,
...TEXT,

16
src/components/Blockly/msg/en/sensebox.js Normal file
View File

@ -0,0 +1,16 @@
export const SENSEBOX = {
/**
* Multiplexer
*/
senseBox_multiplexer_init: "Initialise Multiplexer with ",
senseBox_multiplexer_init_tooltip:
"Connect the multiplexer with a JST-JST cable to one of the 5 I2C ports. Now you can use up to 8 sensors of the same type and address them via the corresponding channels. Enter the number of used channels in the block",
senseBox_multiplexer_init_helpurl:
"https://en.docs.sensebox.de/hardware/zubehoer-multiplexer/",
senseBox_multplexer_nchannels: "Channels",
senseBox_multiplexer_changeChannel: "Change active channel to:",
sensebox_multiplexer_changeChannel_tooltip:
"Changes the active channel to the selected number",
sensebox_multiplexer_changeChannel_helpurl:
"https://en.docs.sensebox.de/hardware/zubehoer-multiplexer/",
};

424
src/components/Blockly/msg/en/ui.js
View File

@ -1,235 +1,261 @@
export const UI = {
/**
* Toolbox
*/
toolbox_sensors: "Sensors",
toolbox_logic: "Logic",
toolbox_loops: "Loops",
toolbox_math: "Math",
toolbox_io: "Input/Output",
toolbox_time: "Time",
toolbox_functions: "Functions",
toolbox_variables: "Variables",
variable_NUMBER: "Number (int)",
variable_SHORT_NUMBER: "char",
variable_LONG: " Zahl (long)",
variable_DECIMAL: "Decimal (float)",
variables_TEXT: "Text (string)",
variables_ARRAY: "Array (array)",
variables_CHARACTER: "char (char)",
variables_BOOLEAN: "Boolean (boolean)",
variables_NULL: "void (void)",
variables_UNDEF: "undefined",
/**
* Tooltips
*
*/
tooltip_compile_code: "Compile code",
tooltip_save_blocks: "Save blocks",
tooltip_open_blocks: "Open blocks",
tooltip_screenshot: "Download screenshot",
tooltip_clear_workspace: "Reset workspace",
tooltip_share_blocks: "Share blocks",
tooltip_show_code: "Show code",
tooltip_hide_code: "Hide code",
tooltip_delete_project: "Delete project",
tooltip_project_name: "Project name",
tooltip_download_project: "Download project",
tooltip_open_project: "Open project",
tooltip_update_project: "Update project",
tooltip_save_project: "Save project",
tooltip_create_project: "Create project",
tooltip_share_project: "Share project",
tooltip_reset_workspace: "Reset workspace",
tooltip_copy_link: "Cooy link",
tooltip_trashcan_hide: "hide deleted blocks",
tooltip_trashcan_delete: "empty trashcan",
tooltip_project_title: "Project title",
tooltip_check_solution: "Check solution",
tooltip_copy_code: "Copy Code to clipboard",
/**
* Toolbox
*/
toolbox_sensors: "Sensors",
toolbox_logic: "Logic",
toolbox_loops: "Loops",
toolbox_math: "Math",
toolbox_io: "Input/Output",
toolbox_time: "Time",
toolbox_functions: "Functions",
toolbox_variables: "Variables",
/**
* Messages
*
*/
/**
* Tooltips
*
*/
messages_delete_project_failed: "Error deleting the project. Try again.",
messages_reset_workspace_success: "The project has been successfully reset.",
messages_PROJECT_UPDATE_SUCCESS: "The project was successfully updated.",
messages_GALLERY_UPDATE_SUCCESS:
"The gallery project was successfully updated.",
messages_PROJECT_UPDATE_FAIL: "Error updating the project. Try again.",
messages_GALLERY_UPDATE_FAIL:
"Error updating the gallery project. Try again.",
messages_gallery_save_fail_1: "Error saving the ",
messages_gallery_save_fail_2: "Project. Try again.",
messages_SHARE_SUCCESS: "Share program",
messages_SHARE_FAIL:
"Error creating a link to share your program. Try again.",
messages_copylink_success: "Link successfully saved to clipboard.",
messages_rename_success_01: "The project was successfully saved to ",
messages_rename_success_02: "renamed.",
messages_newblockly_head:
"Welcome to the new version Blockly for the senseBox",
messages_newblockly_text:
"The new Blockly version is currently in testing. If you find any errors please report them in our [forum](https://forum.sensebox.de/t/neue-blockly-version-beta-test-und-feedback/1176). You can find an overview of all new features [here](/news)",
messages_GET_TUTORIAL_FAIL: "Back to tutorials overview",
messages_LOGIN_FAIL: "The username or password is incorrect.",
messages_login_error: "Enter both a username and a password.",
messages_copy_code: "Copy code to clipboard succesfull",
tooltip_compile_code: "Compile code",
tooltip_save_blocks: "Save blocks",
tooltip_open_blocks: "Open blocks",
tooltip_screenshot: "Download screenshot",
tooltip_clear_workspace: "Reset workspace",
tooltip_share_blocks: "Share blocks",
tooltip_show_code: "Show code",
tooltip_hide_code: "Hide code",
tooltip_delete_project: "Delete project",
tooltip_project_name: "Project name",
tooltip_download_project: "Download project",
tooltip_open_project: "Open project",
tooltip_update_project: "Update project",
tooltip_save_project: "Save project",
tooltip_create_project: "Create project",
tooltip_share_project: "Share project",
tooltip_reset_workspace: "Reset workspace",
tooltip_copy_link: "Cooy link",
tooltip_trashcan_hide: "hide deleted blocks",
tooltip_trashcan_delete: "empty trashcan",
tooltip_project_title: "Project title",
tooltip_check_solution: "Check solution",
tooltip_copy_code: "Copy Code to clipboard",
/**
* Reset Dialog
*/
/**
* Messages
*
*/
resetDialog_headline: "Reset workspace?",
resetDialog_text:
"Do you really want to reset the workspace? All blocks will be deleted!",
messages_delete_project_failed: "Error deleting the project. Try again.",
messages_reset_workspace_success: "The project has been successfully reset.",
messages_PROJECT_UPDATE_SUCCESS: "The project was successfully updated.",
messages_GALLERY_UPDATE_SUCCESS: "The gallery project was successfully updated.",
messages_PROJECT_UPDATE_FAIL: "Error updating the project. Try again.",
messages_GALLERY_UPDATE_FAIL: "Error updating the gallery project. Try again.",
messages_gallery_save_fail_1: "Error saving the ",
messages_gallery_save_fail_2: "Project. Try again.",
messages_SHARE_SUCCESS: 'Share program',
messages_SHARE_FAIL: "Error creating a link to share your program. Try again.",
messages_copylink_success: 'Link successfully saved to clipboard.',
messages_rename_success_01: 'The project was successfully saved to ',
messages_rename_success_02: 'renamed.',
messages_newblockly_head: 'Welcome to the new version Blockly for the senseBox',
messages_newblockly_text: "The new Blockly version is currently in testing. If you find any errors please report them in our [forum](https://forum.sensebox.de/t/neue-blockly-version-beta-test-und-feedback/1176). You can find an overview of all new features [here](/news)",
messages_GET_TUTORIAL_FAIL: 'Back to tutorials overview',
messages_LOGIN_FAIL: 'The username or password is incorrect.',
messages_login_error: "Enter both a username and a password.",
messages_copy_code: "Copy code to clipboard succesfull",
/**
* Share Dialog
*/
/**
* Share Dialog
*/
sharedialog_headline: "Your link has been created.",
sharedialog_text: "You can share your program using the following link.",
sharedialog_headline: "Your link has been created.",
sharedialog_text: "You can share your program using the following link.",
/**
* Project rename Dialog
*/
/**
* Project rename Dialog
*/
renamedialog_headline: "Rename project",
renamedialog_text: "Please enter a name for the project and confirm it by clicking 'Confirm'.",
/**
* Compile Dialog
*
*/
renamedialog_headline: "Rename project",
renamedialog_text:
"Please enter a name for the project and confirm it by clicking 'Confirm'.",
/**
* Compile Dialog
*
*/
compiledialog_headline: "Error",
compiledialog_text: "While compiling an error occured. Please check your blocks and try again",
compiledialog_headline: "Error",
compiledialog_text:
"While compiling an error occured. Please check your blocks and try again",
/**
* Buttons
*
*/
button_cancel: "Cancel",
button_close: "Close",
button_accept: "Ok",
button_compile: "Compile",
button_create_variableCreate: "Create Variable",
button_back: "Back",
button_next: "Next step",
button_tutorial_overview: "Tutorial overview",
button_login: "Login",
/**
* Buttons
*
*/
/**
*
*/
button_cancel: "Cancel",
button_close: "Close",
button_accept: "Ok",
button_compile: "Compile",
button_create_variableCreate: "Create Variable",
button_back: "Back",
button_next: "Next step",
button_tutorial_overview: "Tutorial overview",
button_login: "Login",
filename: "Filename",
projectname: "Projectname",
/**
* Settings
*/
settings_head: "Settings",
settings_language: "Language",
settings_language_text:
"Selection of the language applies to the entire application. A distinction can be made between German and English.",
settings_language_de: "German",
settings_language_en: "English",
settings_renderer: "Renderer",
settings_renderer_text:
"The selected renderer determines the appearance of the blocks. A distinction can be made between 'Geras' and 'Zelos', whereby 'Zelos' is particularly suitable for a touch application.",
settings_statistics: "Statistics",
settings_statistics_text:
"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",
/**
* 404
*/
notfound_head: "The page you requested cannot be found.",
notfound_text:
"The page you are looking for may have been removed, its name changed, or it may be temporarily unavailable.",
/**
*
*/
/**
* Labels
*/
labels_donotshowagain: "Do not show dialog again",
labels_here: "here",
labels_username: "Email or username",
labels_password: "Password",
/**
* Badges
*/
filename: "Filename",
projectname: "Projectname",
/**
* Settings
*/
settings_head: "Settings",
settings_language: "Language",
settings_language_text: "Selection of the language applies to the entire application. A distinction can be made between German and English.",
settings_language_de: "German",
settings_language_en: "English",
settings_renderer: "Renderer",
settings_renderer_text: "The selected renderer determines the appearance of the blocks. A distinction can be made between 'Geras' and 'Zelos', whereby 'Zelos' is particularly suitable for a touch application.",
settings_statistics: "Statistics",
settings_statistics_text: "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",
badges_explaination:
"An overview of all badges received in the Blockly for senseBox context can be found ",
badges_ASSIGNE_BADGE_SUCCESS_01:
"Congratulations! You have received the badge ",
badges_ASSIGNE_BADGE_SUCCESS_02: ".",
/**
* Tutorials
*/
/**
* 404
*/
tutorials_assessment_task: "Task",
tutorials_hardware_head:
"For the implementation you need the following hardware:",
tutorials_hardware_moreInformation:
"You can find more information about the hardware component.",
tutorials_hardware_here: "here",
tutorials_requirements:
"Before continuing with this tutorial, you should have successfully completed the following tutorials:",
notfound_head: "The page you requested cannot be found.",
notfound_text: "The page you are looking for may have been removed, its name changed, or it may be temporarily unavailable.",
/**
* Tutorial Builder
*/
/**
* Labels
*/
labels_donotshowagain: 'Do not show dialog again',
labels_here: 'here',
labels_username: 'Email or username',
labels_password: "Password",
/**
* Badges
*/
builder_solution: "Solution",
builder_solution_submit: "Submit Solution",
builder_example_submit: "Submit example",
builder_comment:
"Note: You can delete the initial setup() or infinite loop() block. Additionally, it is possible to select only any block, among others, without displaying it as disabled.",
builder_hardware_order: "Note that the order of selection is authoritative.",
builder_hardware_helper: "Select at least one hardware component.",
builder_requirements_head: "Requirements.",
builder_requirements_order:
"Note that the order of ticking is authoritative.",
badges_explaination: "An overview of all badges received in the Blockly for senseBox context can be found ",
badges_ASSIGNE_BADGE_SUCCESS_01: "Congratulations! You have received the badge ",
badges_ASSIGNE_BADGE_SUCCESS_02: ".",
/**
* Login
*/
login_head: "Login",
login_osem_account_01: "You need to have an ",
login_osem_account_02: "Account to login",
login_lostpassword: "Lost your password?",
login_createaccount:
"If you don't have an openSenseMap account please register on ",
/**
* Tutorials
*/
/**
* Navbar
*/
tutorials_assessment_task: "Task",
tutorials_hardware_head: "For the implementation you need the following hardware:",
tutorials_hardware_moreInformation: "You can find more information about the hardware component.",
tutorials_hardware_here: "here",
tutorials_requirements: "Before continuing with this tutorial, you should have successfully completed the following tutorials:",
navbar_tutorials: "Tutorials",
navbar_tutorialbuilder: "Create tutorial",
navbar_gallery: "Gallery",
navbar_projects: "Projects",
navbar_menu: "Menu",
navbar_login: "Login",
navbar_mybadges: "myBadges",
navbar_account: "Account",
navbar_logout: "Logout",
navbar_settings: "Settings",
/**
* Tutorial Builder
*/
/**
* Codeviewer
*/
builder_solution: "Solution",
builder_solution_submit: "Submit Solution",
builder_example_submit: "Submit example",
builder_comment: "Note: You can delete the initial setup() or infinite loop() block. Additionally, it is possible to select only any block, among others, without displaying it as disabled.",
builder_hardware_order: "Note that the order of selection is authoritative.",
builder_hardware_helper: "Select at least one hardware component.",
builder_requirements_head: "Requirements.",
builder_requirements_order: "Note that the order of ticking is authoritative.",
codeviewer_arduino: "Arduino Source Code",
codeviewer_xml: "XML Blocks",
/**
* Overlay
*/
/**
* Login
*/
compile_overlay_head: "Your program is now compiled and downloaded",
compile_overlay_text: "Then copy it to your senseBox MCU",
compile_overlay_help: "You need help? Have a look here: ",
/**
* Tooltip Viewer
*/
login_head: "Login",
login_osem_account_01: "You need to have an ",
login_osem_account_02: "Account to login",
login_lostpassword: "Lost your password?",
login_createaccount: "If you don't have an openSenseMap account please register on ",
tooltip_viewer: "Help",
tooltip_moreInformation: "More informations can be found ",
tooltip_hint: "Select a Block to show the hint",
/**
* Navbar
*/
navbar_tutorials: "Tutorials",
navbar_tutorialbuilder: "Create tutorial",
navbar_gallery: "Gallery",
navbar_projects: "Projects",
navbar_menu: "Menu",
navbar_login: "Login",
navbar_mybadges: "myBadges",
navbar_account: "Account",
navbar_logout: "Logout",
navbar_settings: "Settings",
/**
* Codeviewer
*/
codeviewer_arduino: "Arduino Source Code",
codeviewer_xml: "XML Blocks",
/**
* Overlay
*/
compile_overlay_head: "Your program is now compiled and downloaded",
compile_overlay_text: "Then copy it to your senseBox MCU",
compile_overlay_help: "You need help? Have a look here: ",
/**
* Tooltip Viewer
*/
tooltip_viewer: "Help",
tooltip_moreInformation: "More informations can be found ",
tooltip_hint: "Select a Block to show the hint",
}
/**
* IDEDrawer
*/
drawer_ideerror_head: "Oops something went wrong",
drawer_ideerror_text: "An error occurred while compiling, check your blocks",
};

33
src/components/Blockly/toolbox/Toolbox.js
View File

@ -16,15 +16,16 @@ class Toolbox extends React.Component {
this.props.workspace,
"callbackName",
[
["SHORT_NUMBER", "char"],
["NUMBER", "int"],
["DECIMAL", "float"],
["TEXT", "String"],
["ARRAY", "Array"],
["CHARACTER", "char"],
["BOOLEAN", "boolean"],
["NULL", "void"],
["UNDEF", "undefined"],
[`${Blockly.Msg.variable_SHORT_NUMBER}`, "char"],
[`${Blockly.Msg.variable_NUMBER}`, "int"],
[`${Blockly.Msg.variable_LONG}`, "long"],
[`${Blockly.Msg.variable_DECIMAL}`, "float"],
[`${Blockly.Msg.variables_TEXT}`, "String"],
[`${Blockly.Msg.variables_ARRAY}`, "Array"],
[`${Blockly.Msg.variables_CHARACTER}`, "char"],
[`${Blockly.Msg.variables_BOOLEAN}`, "boolean"],
[`${Blockly.Msg.variables_NULL}`, "void"],
[`${Blockly.Msg.variables_UNDEF}`, "undefined"],
]
);
typedVarModal.init();
@ -74,6 +75,20 @@ class Toolbox extends React.Component {
<Block type="sensebox_sensor_watertemperature" />
{/* <Block type="sensebox_windspeed" /> */}
<Block type="sensebox_soundsensor_dfrobot" />
<Block type="sensebox_multiplexer_init">
<Value name="nrChannels">
<Block type="math_number">
<Field name="NUM">1</Field>
</Block>
</Value>
</Block>
<Block type="sensebox_multiplexer_changeChannel">
<Value name="Channel">
<Block type="math_number">
<Field name="NUM">1</Field>
</Block>
</Value>
</Block>
</Category>
<Category name="WIFI" colour={getColour().sensebox}>
<Block type="sensebox_wifi" />

4
src/components/Content.js
View File

@ -15,7 +15,6 @@ class Content extends Component {
componentDidMount() {
if (this.props.language === 'de_DE') {
console.log("change Language")
Blockly.setLocale(De);
} else if (this.props.language === 'en_US') {
Blockly.setLocale(En);
@ -23,13 +22,10 @@ class Content extends Component {
}
componentDidUpdate(props) {
console.log(this.props.language)
if (props.language !== this.props.language) {
if (this.props.language === 'de_DE') {
console.log("change Language")
Blockly.setLocale(De);
} else if (this.props.language === 'en_US') {
console.log("change Language")
Blockly.setLocale(En);
}
}

2
src/components/Project/Project.js
View File

@ -56,8 +56,6 @@ class Project extends Component {
getProject = () => {
var id = this.props.location.pathname.replace(/\/[a-z]{1,}\//, '');
var param = this.props.location.pathname.replace(`/${id}`, '').replace('/', '');
console.log('param', param);
console.log(id);
this.props.getProject(param, id);
}

214
src/components/Project/ProjectHome.js
View File

@ -1,57 +1,70 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { getProjects, resetProject } from '../../actions/projectActions';
import { clearMessages } from '../../actions/messageActions';
import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { getProjects, resetProject } from "../../actions/projectActions";
import { clearMessages } from "../../actions/messageActions";
import { Link, withRouter } from 'react-router-dom';
import { Link, withRouter } from "react-router-dom";
import Breadcrumbs from '../Breadcrumbs';
import BlocklyWindow from '../Blockly/BlocklyWindow';
import Snackbar from '../Snackbar';
import WorkspaceFunc from '../Workspace/WorkspaceFunc';
import Breadcrumbs from "../Breadcrumbs";
import BlocklyWindow from "../Blockly/BlocklyWindow";
import Snackbar from "../Snackbar";
import WorkspaceFunc from "../Workspace/WorkspaceFunc";
import { withStyles } from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid';
import Paper from '@material-ui/core/Paper';
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 { withStyles } from "@material-ui/core/styles";
import Grid from "@material-ui/core/Grid";
import Paper from "@material-ui/core/Paper";
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";
const styles = (theme) => ({
link: {
color: theme.palette.primary.main,
textDecoration: 'none',
'&:hover': {
textDecoration: "none",
"&:hover": {
color: theme.palette.primary.main,
textDecoration: 'underline'
}
}
textDecoration: "underline",
},
},
});
class ProjectHome extends Component {
state = {
snackbar: false,
type: '',
key: '',
message: ''
}
type: "",
key: "",
message: "",
};
componentDidMount() {
var type = this.props.location.pathname.replace('/', '');
var type = this.props.location.pathname.replace("/", "");
this.props.getProjects(type);
if (this.props.message) {
if (this.props.message.id === 'PROJECT_DELETE_SUCCESS') {
this.setState({ snackbar: true, key: Date.now(), message: `Dein Projekt wurde erfolgreich gelöscht.`, type: 'success' });
}
else if (this.props.message.id === 'GALLERY_DELETE_SUCCESS') {
this.setState({ snackbar: true, key: Date.now(), message: `Dein Galerie-Projekt wurde erfolgreich gelöscht.`, type: 'success' });
}
else if (this.props.message.id === 'GET_PROJECT_FAIL') {
this.setState({ snackbar: true, key: Date.now(), message: `Dein angefragtes ${type === 'gallery' ? 'Galerie-' : ''}Projekt konnte nicht gefunden werden.`, type: 'error' });
if (this.props.message.id === "PROJECT_DELETE_SUCCESS") {
this.setState({
snackbar: true,
key: Date.now(),
message: `Dein Projekt wurde erfolgreich gelöscht.`,
type: "success",
});
} else if (this.props.message.id === "GALLERY_DELETE_SUCCESS") {
this.setState({
snackbar: true,
key: Date.now(),
message: `Dein Galerie-Projekt wurde erfolgreich gelöscht.`,
type: "success",
});
} else if (this.props.message.id === "GET_PROJECT_FAIL") {
this.setState({
snackbar: true,
key: Date.now(),
message: `Dein angefragtes ${
type === "gallery" ? "Galerie-" : ""
}Projekt konnte nicht gefunden werden.`,
type: "error",
});
}
}
}
@ -59,14 +72,23 @@ class ProjectHome extends Component {
componentDidUpdate(props) {
if (props.location.pathname !== this.props.location.pathname) {
this.setState({ snackbar: false });
this.props.getProjects(this.props.location.pathname.replace('/', ''));
this.props.getProjects(this.props.location.pathname.replace("/", ""));
}
if (props.message !== this.props.message) {
if (this.props.message.id === 'PROJECT_DELETE_SUCCESS') {
this.setState({ snackbar: true, key: Date.now(), message: `Dein Projekt wurde erfolgreich gelöscht.`, type: 'success' });
}
else if (this.props.message.id === 'GALLERY_DELETE_SUCCESS') {
this.setState({ snackbar: true, key: Date.now(), message: `Dein Galerie-Projekt wurde erfolgreich gelöscht.`, type: 'success' });
if (this.props.message.id === "PROJECT_DELETE_SUCCESS") {
this.setState({
snackbar: true,
key: Date.now(),
message: `Dein Projekt wurde erfolgreich gelöscht.`,
type: "success",
});
} else if (this.props.message.id === "GALLERY_DELETE_SUCCESS") {
this.setState({
snackbar: true,
key: Date.now(),
message: `Dein Galerie-Projekt wurde erfolgreich gelöscht.`,
type: "success",
});
}
}
}
@ -77,60 +99,107 @@ class ProjectHome extends Component {
}
render() {
var data = this.props.location.pathname === '/project' ? 'Projekte' : 'Galerie';
var data =
this.props.location.pathname === "/project" ? "Projekte" : "Galerie";
return (
<div>
<Breadcrumbs content={[{ link: this.props.location.pathname, title: data }]} />
<Breadcrumbs
content={[{ link: this.props.location.pathname, title: data }]}
/>
<h1>{data}</h1>
{this.props.progress ?
{this.props.progress ? (
<Backdrop open invisible>
<CircularProgress color="primary" />
</Backdrop>
:
) : (
<div>
{this.props.projects.length > 0 ?
{this.props.projects.length > 0 ? (
<Grid container spacing={2}>
{this.props.projects.map((project, i) => {
return (
<Grid item xs={12} sm={6} md={4} xl={3} key={i}>
<Paper style={{ padding: '1rem', position: 'relative', overflow: 'hidden' }}>
<Link to={`/${data === 'Projekte' ? 'project' : 'gallery'}/${project._id}`} style={{ textDecoration: 'none', color: 'inherit' }}>
<Paper
style={{
padding: "1rem",
position: "relative",
overflow: "hidden",
}}
>
<Link
to={`/${
data === "Projekte" ? "project" : "gallery"
}/${project._id}`}
style={{ textDecoration: "none", color: "inherit" }}
>
<h3 style={{ marginTop: 0 }}>{project.title}</h3>
<Divider style={{ marginTop: '1rem', marginBottom: '10px' }} />
<Divider
style={{ marginTop: "1rem", marginBottom: "10px" }}
/>
<BlocklyWindow
svg
blockDisabled
initialXml={project.xml}
/>
<Typography variant='body2' style={{ fontStyle: 'italic', margin: 0, marginTop: '-10px' }}>{project.description}</Typography>
<Typography
variant="body2"
style={{
fontStyle: "italic",
margin: 0,
marginTop: "-10px",
}}
>
{project.description}
</Typography>
</Link>
{this.props.user && this.props.user.email === project.creator ?
{this.props.user &&
this.props.user.email === project.creator ? (
<div>
<Divider style={{ marginTop: '10px', marginBottom: '10px' }} />
<div style={{ float: 'right' }}>
<Divider
style={{
marginTop: "10px",
marginBottom: "10px",
}}
/>
<div style={{ float: "right" }}>
<WorkspaceFunc
multiple
project={project}
projectType={this.props.location.pathname.replace('/', '')}
projectType={this.props.location.pathname.replace(
"/",
""
)}
/>
</div>
</div>
: null}
) : null}
</Paper>
</Grid>
)
);
})}
</Grid>
: <div>
<Typography style={{ marginBottom: '10px' }}>Es sind aktuell keine Projekte vorhanden.</Typography>
{this.props.location.pathname.replace('/', '') === 'project' ?
<Typography>Erstelle jetzt dein <Link to={'/'} className={this.props.classes.link}>eigenes Projekt</Link> oder lasse dich von Projektbeispielen in der <Link to={'/gallery'} className={this.props.classes.link}>Galerie</Link> inspirieren.</Typography>
: null}
) : (
<div>
<Typography style={{ marginBottom: "10px" }}>
Es sind aktuell keine Projekte vorhanden.
</Typography>
{this.props.location.pathname.replace("/", "") === "project" ? (
<Typography>
Erstelle jetzt dein{" "}
<Link to={"/"} className={this.props.classes.link}>
eigenes Projekt
</Link>{" "}
oder lasse dich von Projektbeispielen in der{" "}
<Link to={"/gallery"} className={this.props.classes.link}>
Galerie
</Link>{" "}
inspirieren.
</Typography>
) : null}
</div>
}
)}
</div>
}
)}
<Snackbar
open={this.state.snackbar}
message={this.state.message}
@ -139,7 +208,7 @@ class ProjectHome extends Component {
/>
</div>
);
};
}
}
ProjectHome.propTypes = {
@ -149,15 +218,18 @@ ProjectHome.propTypes = {
projects: PropTypes.array.isRequired,
progress: PropTypes.bool.isRequired,
user: PropTypes.object,
message: PropTypes.object.isRequired
message: PropTypes.object.isRequired,
};
const mapStateToProps = state => ({
const mapStateToProps = (state) => ({
projects: state.project.projects,
progress: state.project.progress,
user: state.auth.user,
message: state.message
message: state.message,
});
export default connect(mapStateToProps, { getProjects, resetProject, clearMessages })(withStyles(styles, { withTheme: true })(withRouter(ProjectHome)));
export default connect(mapStateToProps, {
getProjects,
resetProject,
clearMessages,
})(withStyles(styles, { withTheme: true })(withRouter(ProjectHome)));

102
src/components/Tutorial/Assessment.js
View File

@ -1,20 +1,20 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { workspaceName } from '../../actions/workspaceActions';
import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { workspaceName } from "../../actions/workspaceActions";
import BlocklyWindow from '../Blockly/BlocklyWindow';
import CodeViewer from '../CodeViewer';
import WorkspaceFunc from '../Workspace/WorkspaceFunc';
import BlocklyWindow from "../Blockly/BlocklyWindow";
import CodeViewer from "../CodeViewer";
import WorkspaceFunc from "../Workspace/WorkspaceFunc";
import withWidth, { isWidthDown } from '@material-ui/core/withWidth';
import Grid from '@material-ui/core/Grid';
import Card from '@material-ui/core/Card';
import Typography from '@material-ui/core/Typography';
import * as Blockly from 'blockly'
import withWidth, { isWidthDown } from "@material-ui/core/withWidth";
import Grid from "@material-ui/core/Grid";
import Card from "@material-ui/core/Card";
import Typography from "@material-ui/core/Typography";
import * as Blockly from "blockly";
import { initialXml } from "../Blockly/initialXml";
class Assessment extends Component {
componentDidMount() {
this.props.workspaceName(this.props.name);
}
@ -28,48 +28,90 @@ class Assessment extends Component {
render() {
var tutorialId = this.props.tutorial._id;
var currentTask = this.props.step;
var status = this.props.status.filter(status => status._id === tutorialId)[0];
var taskIndex = status.tasks.findIndex(task => task._id === currentTask._id);
var status = this.props.status.filter(
(status) => status._id === tutorialId
)[0];
var taskIndex = status.tasks.findIndex(
(task) => task._id === currentTask._id
);
var statusTask = status.tasks[taskIndex];
return (
<div className="assessmentDiv" style={{ width: '100%' }}>
<Typography variant='h4' style={{ float: 'left', marginBottom: '5px', height: '40px', display: 'table' }}>{currentTask.headline}</Typography>
<div style={{ float: 'right', height: '40px' }}><WorkspaceFunc assessment /></div>
<Grid container spacing={2} style={{ marginBottom: '5px' }}>
<div className="assessmentDiv" style={{ width: "100%" }}>
<Typography
variant="h4"
style={{
float: "left",
marginBottom: "5px",
height: "40px",
display: "table",
}}
>
{currentTask.headline}
</Typography>
<div style={{ float: "right", height: "40px" }}>
<WorkspaceFunc assessment />
</div>
<Grid container spacing={2} style={{ marginBottom: "5px" }}>
<Grid item xs={12} md={6} lg={8}>
<BlocklyWindow
initialXml={statusTask ? statusTask.xml ? statusTask.xml : null : null}
initialXml={initialXml}
blockDisabled
blocklyCSS={{ height: '65vH' }}
blocklyCSS={{ height: "65vH" }}
/>
</Grid>
<Grid item xs={12} md={6} lg={4} style={isWidthDown('sm', this.props.width) ? { height: 'max-content' } : {}}>
<Card style={{ height: 'calc(50% - 30px)', padding: '10px', marginBottom: '10px' }}>
<Typography variant='h5'>{Blockly.Msg.tutorials_assessment_task}</Typography>
<Grid
item
xs={12}
md={6}
lg={4}
style={
isWidthDown("sm", this.props.width)
? { height: "max-content" }
: {}
}
>
<Card
style={{
height: "calc(50% - 30px)",
padding: "10px",
marginBottom: "10px",
}}
>
<Typography variant="h5">
{Blockly.Msg.tutorials_assessment_task}
</Typography>
<Typography>{currentTask.text}</Typography>
</Card>
<div style={isWidthDown('sm', this.props.width) ? { height: '500px' } : { height: '50%' }}>
<div
style={
isWidthDown("sm", this.props.width)
? { height: "500px" }
: { height: "50%" }
}
>
<CodeViewer />
</div>
</Grid>
</Grid>
</div>
);
};
}
}
Assessment.propTypes = {
status: PropTypes.array.isRequired,
change: PropTypes.number.isRequired,
workspaceName: PropTypes.func.isRequired,
tutorial: PropTypes.object.isRequired
tutorial: PropTypes.object.isRequired,
};
const mapStateToProps = state => ({
const mapStateToProps = (state) => ({
change: state.tutorial.change,
status: state.tutorial.status,
tutorial: state.tutorial.tutorials[0]
tutorial: state.tutorial.tutorials[0],
});
export default connect(mapStateToProps, { workspaceName })(withWidth()(Assessment));
export default connect(mapStateToProps, { workspaceName })(
withWidth()(Assessment)
);

1
src/components/Tutorial/Builder/Badge.js
View File

@ -60,7 +60,6 @@ class Badge extends Component {
this.setState({badges: res.data.badges, badgeName: this.props.badge ? res.data.badges.filter(badge => badge._id === this.props.badge)[0].name : '' });
})
.catch(err => {
console.log(err);
});
};

116
src/components/Tutorial/Instruction.js
View File

@ -1,57 +1,95 @@
import React, { Component } from 'react';
import React, { Component } from "react";
import Hardware from './Hardware';
import Requirement from './Requirement';
import BlocklyWindow from '../Blockly/BlocklyWindow';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import ReactMarkdown from 'react-markdown'
import Hardware from "./Hardware";
import Requirement from "./Requirement";
import BlocklyWindow from "../Blockly/BlocklyWindow";
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import ReactMarkdown from "react-markdown";
class Instruction extends Component {
render() {
var step = this.props.step;
var isHardware = step.hardware && step.hardware.length > 0;
var areRequirements = step.requirements && step.requirements.length > 0;
return (
<div>
<Typography variant='h4' style={{ marginBottom: '5px' }}>{step.headline}</Typography>
<Typography style={isHardware ? {} : { marginBottom: '5px' }}><ReactMarkdown className={'tutorial'} linkTarget={'_blank'} skipHtml={false}>{step.text}</ReactMarkdown></Typography>
{isHardware ?
<Hardware picture={step.hardware} /> : null}
{areRequirements > 0 ?
<Requirement requirements={step.requirements} /> : null}
{step.media ?
step.media.picture ?
<div style={{ display: 'flex', justifyContent: 'center', marginBottom: '5px' }}>
<img src={`${process.env.REACT_APP_BLOCKLY_API}/media/${step.media.picture.path}`} alt='' style={{ maxHeight: '40vH', maxWidth: '100%' }} />
</div>
: step.media.youtube ?
/*16:9; width: 800px; height: width/16*9=450px*/
<div style={{ maxWidth: '800px', margin: 'auto' }}>
<div style={{ position: 'relative', height: 0, paddingBottom: 'calc(100% / 16 * 9)' }}>
<iframe title={step.media.youtube} style={{ position: 'absolute', top: '0', left: '0', width: '100%', maxWidth: '800px', height: '100%', maxHeight: '450px' }} src={`https://www.youtube.com/embed/${step.media.youtube}`} frameBorder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />
</div>
</div>
: null
: null}
{step.xml ?
<Grid container spacing={2} style={{ marginBottom: '5px' }}>
<Grid item xs={12} style={{display: 'flex', justifyContent: 'center'}}>
<BlocklyWindow
svg
blockDisabled
initialXml={step.xml}
<Typography variant="h4" style={{ marginBottom: "5px" }}>
{step.headline}
</Typography>
<Typography style={isHardware ? {} : { marginBottom: "5px" }}>
<ReactMarkdown
className={"tutorial"}
linkTarget={"_blank"}
skipHtml={false}
>
{step.text}
</ReactMarkdown>
</Typography>
{isHardware ? <Hardware picture={step.hardware} /> : null}
{areRequirements > 0 ? (
<Requirement requirements={step.requirements} />
) : null}
{step.media ? (
step.media.picture ? (
<div
style={{
display: "flex",
justifyContent: "center",
marginBottom: "5px",
}}
>
<img
src={`${process.env.REACT_APP_BLOCKLY_API}/media/${step.media.picture.path}`}
alt=""
style={{ maxHeight: "40vH", maxWidth: "100%" }}
/>
</div>
) : step.media.youtube ? (
/*16:9; width: 800px; height: width/16*9=450px*/
<div style={{ maxWidth: "800px", margin: "auto" }}>
<div
style={{
position: "relative",
height: 0,
paddingBottom: "calc(100% / 16 * 9)",
}}
>
<iframe
title={step.media.youtube}
style={{
position: "absolute",
top: "0",
left: "0",
width: "100%",
maxWidth: "800px",
height: "100%",
maxHeight: "450px",
}}
src={`https://www.youtube.com/embed/${step.media.youtube}`}
frameBorder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen
/>
</div>
</div>
) : null
) : null}
{step.xml ? (
<Grid container spacing={2} style={{ marginBottom: "5px" }}>
<Grid
item
xs={12}
style={{ display: "flex", justifyContent: "center" }}
>
<BlocklyWindow svg blockDisabled initialXml={step.xml} />
</Grid>
</Grid>
: null}
) : null}
</div>
);
};
}
}
export default Instruction;

2
src/components/Tutorial/StepperVertical.js
View File

@ -85,7 +85,7 @@ class StepperVertical extends Component {
return (
<Step key={i}>
<Tooltip title={step.headline} placement='right' arrow >
<div style={i === activeStep ? {padding: '5px 0'} : {padding: '5px 0', cursor: 'pointer'}} onClick={i === activeStep ? null : () => {console.log(i); this.props.tutorialStep(i)}}>
<div style={i === activeStep ? {padding: '5px 0'} : {padding: '5px 0', cursor: 'pointer'}} onClick={i === activeStep ? null : () => { this.props.tutorialStep(i)}}>
<StepLabel
StepIconComponent={'div'}
classes={{

1
src/components/Tutorial/Tutorial.js
View File

@ -28,7 +28,6 @@ class Tutorial extends Component {
// retrieve tutorial only if a potential user is loaded - authentication
// is finished (success or failed)
if(!this.props.progress){
console.log(this.props);
this.props.getTutorial(this.props.match.params.tutorialId);
}
}

183
src/components/User/Login.js
View File

@ -1,77 +1,89 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { login } from '../../actions/authActions'
import { clearMessages } from '../../actions/messageActions'
import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { login } from "../../actions/authActions";
import { clearMessages } from "../../actions/messageActions";
import { withRouter } from 'react-router-dom';
import { withRouter } from "react-router-dom";
import Snackbar from '../Snackbar';
import Alert from '../Alert';
import Breadcrumbs from '../Breadcrumbs';
import Snackbar from "../Snackbar";
import Alert from "../Alert";
import Breadcrumbs from "../Breadcrumbs";
import Button from '@material-ui/core/Button';
import IconButton from '@material-ui/core/IconButton';
import Button from "@material-ui/core/Button";
import IconButton from "@material-ui/core/IconButton";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faEye, faEyeSlash } from "@fortawesome/free-solid-svg-icons";
import TextField from '@material-ui/core/TextField';
import Divider from '@material-ui/core/Divider';
import InputAdornment from '@material-ui/core/InputAdornment';
import CircularProgress from '@material-ui/core/CircularProgress';
import Link from '@material-ui/core/Link';
import * as Blockly from 'blockly'
import TextField from "@material-ui/core/TextField";
import Divider from "@material-ui/core/Divider";
import InputAdornment from "@material-ui/core/InputAdornment";
import CircularProgress from "@material-ui/core/CircularProgress";
import Link from "@material-ui/core/Link";
import * as Blockly from "blockly";
export class Login extends Component {
constructor(props) {
super(props);
this.state = {
redirect: props.location.state ? props.location.state.from.pathname : null,
email: '',
password: '',
redirect: props.location.state
? props.location.state.from.pathname
: null,
email: "",
password: "",
snackbar: false,
type: '',
key: '',
message: '',
showPassword: false
type: "",
key: "",
message: "",
showPassword: false,
};
}
componentDidUpdate(props) {
console.log(this.state.redirect);
const { message } = this.props;
if (message !== props.message) {
if (message.id === 'LOGIN_SUCCESS') {
if (message.id === "LOGIN_SUCCESS") {
if (this.state.redirect) {
this.props.history.push(this.state.redirect);
}
else {
} else {
this.props.history.goBack();
}
}
// Check for login error
else if (message.id === 'LOGIN_FAIL') {
this.setState({ email: '', password: '', snackbar: true, key: Date.now(), message: Blockly.Msg.messages_LOGIN_FAIL, type: 'error' });
else if (message.id === "LOGIN_FAIL") {
console.log("login fail");
this.setState({
email: "",
password: "",
snackbar: true,
key: Date.now(),
message: Blockly.Msg.messages_LOGIN_FAIL,
type: "error",
});
}
}
}
onChange = e => {
onChange = (e) => {
this.setState({ [e.target.name]: e.target.value });
};
onSubmit = e => {
onSubmit = (e) => {
e.preventDefault();
const { email, password } = this.state;
if (email !== '' && password !== '') {
if (email !== "" && password !== "") {
// create user object
const user = {
email,
password
password,
};
this.props.login(user);
} else {
this.setState({ snackbar: true, key: Date.now(), message: Blockly.Msg.messages_login_error, type: 'error' });
this.setState({
snackbar: true,
key: Date.now(),
message: Blockly.Msg.messages_login_error,
type: "error",
});
}
};
@ -86,12 +98,25 @@ export class Login extends Component {
render() {
return (
<div>
<Breadcrumbs content={[{ link: '/user/login', title: Blockly.Msg.button_login }]} />
<Breadcrumbs
content={[{ link: "/user/login", title: Blockly.Msg.button_login }]}
/>
<div style={{ maxWidth: '500px', marginLeft: 'auto', marginRight: 'auto' }}>
<div
style={{ maxWidth: "500px", marginLeft: "auto", marginRight: "auto" }}
>
<h1>{Blockly.Msg.login_head}</h1>
<Alert>
{Blockly.Msg.login_osem_account_01} <Link color='primary' rel="noreferrer" target="_blank" href={'https://opensensemap.org/'}>openSenseMap</Link> {Blockly.Msg.login_osem_account_02}.
{Blockly.Msg.login_osem_account_01}{" "}
<Link
color="primary"
rel="noreferrer"
target="_blank"
href={"https://opensensemap.org/"}
>
openSenseMap
</Link>{" "}
{Blockly.Msg.login_osem_account_02}.
</Alert>
<Snackbar
open={this.state.snackbar}
@ -100,51 +125,83 @@ export class Login extends Component {
key={this.state.key}
/>
<TextField
style={{ marginBottom: '10px' }}
style={{ marginBottom: "10px" }}
// variant='outlined'
type='text'
type="text"
label={Blockly.Msg.labels_username}
name='email'
name="email"
value={this.state.email}
onChange={this.onChange}
fullWidth={true}
/>
<TextField
// variant='outlined'
type={this.state.showPassword ? 'text' : 'password'}
type={this.state.showPassword ? "text" : "password"}
label={Blockly.Msg.labels_password}
name='password'
name="password"
value={this.state.password}
InputProps={{
endAdornment:
<InputAdornment
position="end"
>
endAdornment: (
<InputAdornment position="end">
<IconButton
onClick={this.handleClickShowPassword}
onMouseDown={this.handleMouseDownPassword}
edge="end"
>
<FontAwesomeIcon size='xs' icon={this.state.showPassword ? faEyeSlash : faEye} />
<FontAwesomeIcon
size="xs"
icon={this.state.showPassword ? faEyeSlash : faEye}
/>
</IconButton>
</InputAdornment>
),
}}
onChange={this.onChange}
fullWidth={true}
/>
<p>
<Button color="primary" variant='contained' onClick={this.onSubmit} style={{ width: '100%' }}>
{this.props.progress ?
<div style={{ height: '24.5px' }}><CircularProgress color="inherit" size={20} /></div>
: Blockly.Msg.button_login}
<Button
color="primary"
variant="contained"
onClick={this.onSubmit}
style={{ width: "100%" }}
>
{this.props.progress ? (
<div style={{ height: "24.5px" }}>
<CircularProgress color="inherit" size={20} />
</div>
) : (
Blockly.Msg.button_login
)}
</Button>
</p>
<p style={{ textAlign: 'center', fontSize: '0.8rem' }}>
<Link rel="noreferrer" target="_blank" href={'https://opensensemap.org/'} color="primary">{Blockly.Msg.login_lostpassword}</Link>
<p style={{ textAlign: "center", fontSize: "0.8rem" }}>
<Link
rel="noreferrer"
target="_blank"
href={"https://opensensemap.org/"}
color="primary"
>
{Blockly.Msg.login_lostpassword}
</Link>
</p>
<Divider variant='fullWidth' />
<p style={{ textAlign: 'center', paddingRight: "34px", paddingLeft: "34px" }}>
{Blockly.Msg.login_createaccount}<Link rel="noreferrer" target="_blank" href={'https://opensensemap.org/'}>openSenseMap</Link>.
<Divider variant="fullWidth" />
<p
style={{
textAlign: "center",
paddingRight: "34px",
paddingLeft: "34px",
}}
>
{Blockly.Msg.login_createaccount}
<Link
rel="noreferrer"
target="_blank"
href={"https://opensensemap.org/"}
>
openSenseMap
</Link>
.
</p>
</div>
</div>
@ -156,12 +213,14 @@ Login.propTypes = {
message: PropTypes.object.isRequired,
login: PropTypes.func.isRequired,
clearMessages: PropTypes.func.isRequired,
progress: PropTypes.bool.isRequired
progress: PropTypes.bool.isRequired,
};
const mapStateToProps = state => ({
const mapStateToProps = (state) => ({
message: state.message,
progress: state.auth.progress
progress: state.auth.progress,
});
export default connect(mapStateToProps, { login, clearMessages })(withRouter(Login));
export default connect(mapStateToProps, { login, clearMessages })(
withRouter(Login)
);

236
src/components/Workspace/Compile.js
View File

@ -1,127 +1,172 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { workspaceName } from '../../actions/workspaceActions';
import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { workspaceName } from "../../actions/workspaceActions";
import { detectWhitespacesAndReturnReadableResult } from '../../helpers/whitespace';
import Dialog from '../Dialog';
import { withStyles } from '@material-ui/core/styles';
import Button from '@material-ui/core/Button';
import Backdrop from '@material-ui/core/Backdrop';
import CircularProgress from '@material-ui/core/CircularProgress';
import IconButton from '@material-ui/core/IconButton';
import Tooltip from '@material-ui/core/Tooltip';
import TextField from '@material-ui/core/TextField';
import { detectWhitespacesAndReturnReadableResult } from "../../helpers/whitespace";
import { withStyles } from "@material-ui/core/styles";
import Button from "@material-ui/core/Button";
import Backdrop from "@material-ui/core/Backdrop";
import CircularProgress from "@material-ui/core/CircularProgress";
import IconButton from "@material-ui/core/IconButton";
import Tooltip from "@material-ui/core/Tooltip";
import Divider from "@material-ui/core/Divider";
import { faClipboardCheck } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import * as Blockly from 'blockly/core';
import Copy from '../copy.svg';
import * as Blockly from "blockly/core";
import Copy from "../copy.svg";
import Prism from "prismjs";
import "prismjs/themes/prism.css";
import "prismjs/plugins/line-numbers/prism-line-numbers";
import "prismjs/plugins/line-numbers/prism-line-numbers.css";
import MuiDrawer from "@material-ui/core/Drawer";
const styles = (theme) => ({
backdrop: {
zIndex: theme.zIndex.drawer + 1,
color: '#fff',
color: "#fff",
},
iconButton: {
backgroundColor: theme.palette.button.compile,
color: theme.palette.primary.contrastText,
width: '40px',
height: '40px',
'&:hover': {
width: "40px",
height: "40px",
"&:hover": {
backgroundColor: theme.palette.button.compile,
color: theme.palette.primary.contrastText,
}
},
},
button: {
backgroundColor: theme.palette.button.compile,
color: theme.palette.primary.contrastText,
'&:hover': {
"&:hover": {
backgroundColor: theme.palette.button.compile,
color: theme.palette.primary.contrastText,
}
}
},
},
});
const Drawer = withStyles((theme) => ({
paperAnchorBottom: {
backgroundColor: "black",
height: "20vH",
},
}))(MuiDrawer);
class Compile extends Component {
constructor(props) {
super(props);
this.state = {
progress: false,
open: false,
file: false,
title: '',
content: '',
name: props.name
title: "",
content: "",
name: props.name,
error: "",
};
}
componentDidMount() {
Prism.highlightAll();
}
componentDidUpdate(props) {
if (props.name !== this.props.name) {
this.setState({ name: this.props.name });
}
Prism.highlightAll();
}
compile = () => {
this.setState({ progress: true });
const data = {
"board": process.env.REACT_APP_BOARD,
"sketch": this.props.arduino
board: process.env.REACT_APP_BOARD,
sketch: this.props.arduino,
};
fetch(`${process.env.REACT_APP_COMPILER_URL}/compile`, {
method: "POST",
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
headers: { "Content-Type": "application/json" },
body: JSON.stringify(data),
})
.then(response => response.json())
.then(data => {
.then((response) => response.json())
.then((data) => {
console.log(data);
if (data.code === "Internal Server Error") {
this.setState({
progress: false,
file: false,
open: true,
title: Blockly.Msg.compiledialog_headline,
content: Blockly.Msg.compiledialog_text,
error: data.message,
});
}
this.setState({ id: data.data.id }, () => {
this.createFileName();
});
})
.catch(err => {
.catch((err) => {
console.log(err);
this.setState({ progress: false, file: false, open: true, title: Blockly.Msg.compiledialog_headline, content: Blockly.Msg.compiledialog_text });
//this.setState({ progress: false, file: false, open: true, title: Blockly.Msg.compiledialog_headline, content: Blockly.Msg.compiledialog_text });
});
}
};
download = () => {
const id = this.state.id;
const filename = detectWhitespacesAndReturnReadableResult(this.state.name);
this.toggleDialog();
this.props.workspaceName(this.state.name);
window.open(`${process.env.REACT_APP_COMPILER_URL}/download?id=${id}&board=${process.env.REACT_APP_BOARD}&filename=${filename}`, '_self');
window.open(
`${process.env.REACT_APP_COMPILER_URL}/download?id=${id}&board=${process.env.REACT_APP_BOARD}&filename=${filename}`,
"_self"
);
this.setState({ progress: false });
}
};
toggleDialog = () => {
this.setState({ open: !this.state, progress: false });
}
};
createFileName = () => {
if (this.state.name) {
this.download();
} else {
this.setState({
file: true,
open: true,
title: "Projekt kompilieren",
content:
"Bitte gib einen Namen für die Bennenung des zu kompilierenden Programms ein und bestätige diesen mit einem Klick auf 'Eingabe'.",
});
}
else {
this.setState({ file: true, open: true, title: 'Projekt kompilieren', content: 'Bitte gib einen Namen für die Bennenung des zu kompilierenden Programms ein und bestätige diesen mit einem Klick auf \'Eingabe\'.' });
}
}
};
setFileName = (e) => {
this.setState({ name: e.target.value });
}
};
toggleDrawer = (anchor, open) => (event) => {
if (
event.type === "keydown" &&
(event.key === "Tab" || event.key === "Shift")
) {
return;
}
this.setState({ open: false });
};
render() {
return (
<div style={{}}>
{this.props.iconButton ?
<Tooltip title={Blockly.Msg.tooltip_compile_code} arrow style={{ marginRight: '5px' }}>
{this.props.iconButton ? (
<Tooltip
title={Blockly.Msg.tooltip_compile_code}
arrow
style={{ marginRight: "5px" }}
>
<IconButton
className={`compileBlocks ${this.props.classes.iconButton}`}
onClick={() => this.compile()}
@ -129,21 +174,73 @@ class Compile extends Component {
<FontAwesomeIcon icon={faClipboardCheck} size="l" />
</IconButton>
</Tooltip>
:
<Button style={{ float: 'right', color: 'white' }} variant="contained" className={this.props.classes.button} onClick={() => this.compile()}>
<FontAwesomeIcon icon={faClipboardCheck} style={{ marginRight: '5px' }} /> Kompilieren
) : (
<Button
style={{ float: "right", color: "white" }}
variant="contained"
className={this.props.classes.button}
onClick={() => this.compile()}
>
<FontAwesomeIcon
icon={faClipboardCheck}
style={{ marginRight: "5px" }}
/>{" "}
Kompilieren
</Button>
}
<Backdrop className={this.props.classes.backdrop} open={this.state.progress}>
<div className='overlay'>
)}
<Backdrop
className={this.props.classes.backdrop}
open={this.state.progress}
>
<div className="overlay">
<img src={Copy} width="400" alt="copyimage"></img>
<h2>{Blockly.Msg.compile_overlay_head}</h2>
<p>{Blockly.Msg.compile_overlay_text}</p>
<p>{Blockly.Msg.compile_overlay_help}<a href="/faq" target="_blank">FAQ</a></p>
<p>
{Blockly.Msg.compile_overlay_help}
<a href="/faq" target="_blank">
FAQ
</a>
</p>
<CircularProgress color="inherit" />
</div>
</Backdrop>
<Dialog
<Drawer
anchor={"bottom"}
open={this.state.open}
onClose={this.toggleDrawer("bottom", false)}
>
<h2
style={{
color: "#4EAF47",
paddingLeft: "1rem",
paddingRight: "1rem",
}}
>
{Blockly.Msg.drawer_ideerror_head}
</h2>
<p
style={{
color: "#4EAF47",
paddingLeft: "1rem",
paddingRight: "1rem",
}}
>
{Blockly.Msg.drawer_ideerror_text}
</p>
<Divider style={{ backgroundColor: "white" }} />
<p
style={{
backgroundColor: "black",
color: "#E47128",
padding: "1rem",
}}
>
{" "}
{`${this.state.error}`}{" "}
</p>
</Drawer>
{/* <Dialog
open={this.state.open}
title={this.state.title}
content={this.state.content}
@ -156,23 +253,32 @@ class Compile extends Component {
<TextField autoFocus placeholder='Dateiname' value={this.state.name} onChange={this.setFileName} style={{ marginRight: '10px' }} />
<Button disabled={!this.state.name} variant='contained' color='primary' onClick={() => this.download()}>Eingabe</Button>
</div>
: null}
</Dialog>
:
<pre className="line-numbers" style={{ paddingBottom: 0, width: '100%', overflow: 'auto', scrollbarWidth: 'thin', height: '100%', margin: '15px 0', paddingTop: 0, whiteSpace: 'pre-wrap', backgroundColor: 'white' }}><code className="language-json">
{`${this.state.error}`}
</code></pre>
</AccordionDetails>
</Accordion>
}
</Dialog> */}
</div>
);
};
}
}
Compile.propTypes = {
arduino: PropTypes.string.isRequired,
name: PropTypes.string,
workspaceName: PropTypes.func.isRequired
workspaceName: PropTypes.func.isRequired,
};
const mapStateToProps = state => ({
const mapStateToProps = (state) => ({
arduino: state.workspace.code.arduino,
name: state.workspace.name
name: state.workspace.name,
});
export default connect(mapStateToProps, { workspaceName })(withStyles(styles, { withTheme: true })(Compile));
export default connect(mapStateToProps, { workspaceName })(
withStyles(styles, { withTheme: true })(Compile)
);

24
src/components/Workspace/ResetWorkspace.js
View File

@ -16,6 +16,8 @@ import Tooltip from '@material-ui/core/Tooltip';
import { faShare } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import Dialog from '../Dialog';
import Button from '@material-ui/core/Button';
const styles = (theme) => ({
button: {
@ -39,12 +41,21 @@ class ResetWorkspace extends Component {
this.inputRef = React.createRef();
this.state = {
snackbar: false,
open: false,
type: '',
key: '',
message: '',
};
}
toggleDialog = () => {
this.setState({ open: !this.state});
}
openDialog = () => {
this.setState({open: true});
}
resetWorkspace = () => {
const workspace = Blockly.getMainWorkspace();
Blockly.Events.disable(); // https://groups.google.com/forum/#!topic/blockly/m7e3g0TC75Y
@ -69,7 +80,7 @@ class ResetWorkspace extends Component {
<Tooltip title={Blockly.Msg.tooltip_reset_workspace} arrow>
<IconButton
className={this.props.classes.button}
onClick={() => this.resetWorkspace()}
onClick={() => this.openDialog()}
>
<FontAwesomeIcon icon={faShare} size="xs" flip='horizontal' />
</IconButton>
@ -81,6 +92,17 @@ class ResetWorkspace extends Component {
type={this.state.type}
key={this.state.key}
/>
<Dialog
open={this.state.open}
title={Blockly.Msg.resetDialog_headline}
content={Blockly.Msg.resetDialog_text}
onClose={() => { this.toggleDialog(); }}
onClick={() => { this.toggleDialog(); }}
button={Blockly.Msg.button_cancel}
> <div style={{ marginTop: '10px' }}>
<Button variant='contained' color='primary' onClick={() => { this.resetWorkspace(); this.toggleDialog(); }}>Zurücksetzen</Button>
</div></Dialog>
</div>
);
};

1
src/components/Workspace/SaveProject.js
View File

@ -127,7 +127,6 @@ class SaveProject extends Component {
}
render() {
console.log(1, this.props);
return (
<div style={this.props.style}>
<Tooltip title={this.state.projectType === 'project' ? Blockly.Msg.tooltip_update_project : Blockly.Msg.tooltip_save_project} arrow>

42
src/reducers/authReducer.js
View File

@ -1,59 +1,69 @@
import { MYBADGES_CONNECT, MYBADGES_DISCONNECT, USER_LOADED, USER_LOADING, AUTH_ERROR, LOGIN_SUCCESS, LOGIN_FAIL, LOGOUT_SUCCESS, LOGOUT_FAIL, REFRESH_TOKEN_SUCCESS } from '../actions/types';
import {
MYBADGES_CONNECT,
MYBADGES_DISCONNECT,
USER_LOADED,
USER_LOADING,
AUTH_ERROR,
LOGIN_SUCCESS,
LOGIN_FAIL,
LOGOUT_SUCCESS,
LOGOUT_FAIL,
REFRESH_TOKEN_SUCCESS,
} from "../actions/types";
const initialState = {
token: localStorage.getItem('token'),
refreshToken: localStorage.getItem('refreshToken'),
token: localStorage.getItem("token"),
refreshToken: localStorage.getItem("refreshToken"),
isAuthenticated: null,
progress: true,
user: null
user: null,
};
export default function foo(state = initialState, action){
switch(action.type){
export default function foo(state = initialState, action) {
switch (action.type) {
case USER_LOADING:
return {
...state,
progress: true
progress: true,
};
case USER_LOADED:
return {
...state,
isAuthenticated: true,
progress: false,
user: action.payload
user: action.payload,
};
case LOGIN_SUCCESS:
case REFRESH_TOKEN_SUCCESS:
localStorage.setItem('token', action.payload.token);
localStorage.setItem('refreshToken', action.payload.refreshToken);
localStorage.setItem("token", action.payload.token);
localStorage.setItem("refreshToken", action.payload.refreshToken);
return {
...state,
user: action.payload.user,
token: action.payload.token,
refreshToken: action.payload.refreshToken,
isAuthenticated: true,
progress: false
progress: false,
};
case MYBADGES_CONNECT:
case MYBADGES_DISCONNECT:
return {
...state,
user: action.payload
user: action.payload,
};
case AUTH_ERROR:
case LOGIN_FAIL:
case LOGOUT_SUCCESS:
case LOGOUT_FAIL:
localStorage.removeItem('token');
localStorage.removeItem('refreshToken');
localStorage.removeItem("token");
localStorage.removeItem("refreshToken");
return {
...state,
token: null,
refreshToken: null,
user: null,
isAuthenticated: false,
progress: false
progress: false,
};
default:
return state;

5
yarn.lock
View File

@ -1022,6 +1022,11 @@
dependencies:
"@blockly/plugin-modal" "^1.20200427.4"
"@blockly/zoom-to-fit@^1.0.5":
"integrity" "sha512-+dm8bpJB0AkrEMQPr7nEMYKiEA8Loh7V8ZVa0s25PkxGP9BLqt9NIxUCQjshInhCr11Dlctq7C7noqK+tTVS4w=="
"resolved" "https://registry.npmjs.org/@blockly/zoom-to-fit/-/zoom-to-fit-1.0.5.tgz"
"version" "1.0.5"
"@cnakazawa/watch@^1.0.3":
version "1.0.4"
resolved "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.4.tgz"