Skip to content

Commit 79fbfb8

Browse files
syuChen1syuChen1
authored
Merge pull request #290 from STEM-C/feature/blockly_canvas
Feature/blockly canvas
2 parents 373a5f8 + 87950e7 commit 79fbfb8

File tree

6 files changed

+78
-81
lines changed

6 files changed

+78
-81
lines changed

‎client/public/lib/arduino_compressed.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1126,13 +1126,13 @@ Blockly.Arduino.text_prompt_ext = function(a) {
11261126
c = a.getFieldValue("TYPE"),
11271127
d = [],
11281128
e = c == Blockly.Types.NUMBER.output;
1129-
e ? d.push("int " + Blockly.Arduino.DEF_FUNC_NAME + "(String msg) {") : d.push("String " + Blockly.Arduino.DEF_FUNC_NAME + "(String msg) {");
1129+
e ? d.push("float " + Blockly.Arduino.DEF_FUNC_NAME + "(String msg) {") : d.push("String " + Blockly.Arduino.DEF_FUNC_NAME + "(String msg) {");
11301130
d.push(" " + b + ".println(msg);");
11311131
d.push(" boolean stringComplete = false;");
1132-
e ? d.push(" int content = 0;") : d.push(' String content = "";');
1132+
e ? d.push(" float content = 0;") : d.push(' String content = "";');
11331133
d.push(" while (stringComplete == false) {");
11341134
d.push(" if (" + b + ".available()) {");
1135-
e ? (d.push(" content = " + b + ".parseInt();"), d.push(" stringComplete = true;")) : (d.push(" char readChar = (char)" + b + ".read();"), d.push(" if (readChar == '\\n' || readChar == '\\r') {"), d.push(" stringComplete = true;"), d.push(" } else {"), d.push(" content += readChar;"), d.push(" }"));
1135+
e ? (d.push(" content = " + b + ".parseFloat();"), d.push(" stringComplete = true;")) : (d.push(" char readChar = (char)" + b + ".read();"), d.push(" if (readChar == '\\n' || readChar == '\\r') {"), d.push(" stringComplete = true;"), d.push(" } else {"), d.push(" content += readChar;"), d.push(" }"));
11361136
d.push(" }");
11371137
d.push(" }");
11381138
d.push(" // Empty incoming serial buffer");

‎client/src/Utils/requests.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -217,12 +217,12 @@ export const getSaves = async (day) =>
217217
error: 'Past saves could not be retrieved.',
218218
});
219219

220-
export const createSubmission = async (day, workspace, sketch, path, isAuth) =>
220+
export const createSubmission = async (id, workspace, sketch, path, isAuth) =>
221221
makeRequest({
222222
method: POST,
223223
path: `${server}${path}`,
224224
data: {
225-
day: day.id,
225+
day: id,
226226
workspace: workspace,
227227
board: 'arduino:avr:uno',
228228
sketch: sketch,

‎client/src/components/DayPanels/BlocklyCanvasPanel/BlocklyCanvasPanel.js

Lines changed: 16 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,11 @@ import { getSaves } from '../../../Utils/requests';
2121
import CodeModal from './CodeModal';
2222
import ConsoleModal from './ConsoleModal';
2323
import VersionHistoryModal from './VersionHistoryModal';
24-
import { openConnection, disconnect } from '../consoleHelpers';
24+
import {
25+
connectToPort,
26+
handleCloseConnection,
27+
handleOpenConnection,
28+
} from '../consoleHelpers';
2529

2630
export default function BlocklyCanvasPanel(props) {
2731
const [hoverXml, setHoverXml] = useState(false);
@@ -151,20 +155,6 @@ export default function BlocklyCanvasPanel(props) {
151155
};
152156
}, [isStudent]);
153157

154-
// setInterval(async () => {
155-
// if (workspaceRef.current.undoStack_.length !== undoLength.current) {
156-
// undoLength.current = workspaceRef.current.undoStack_.length;
157-
// let xml = window.Blockly.Xml.workspaceToDom(workspaceRef.current);
158-
// let xml_text = window.Blockly.Xml.domToText(xml);
159-
// const replay = {
160-
// xml: xml_text,
161-
// timestamp: Date.now(),
162-
// };
163-
// replayRef.current.push(replay);
164-
// console.log(replayRef.current);
165-
// }
166-
// }, 1000);
167-
168158
useEffect(() => {
169159
// once the day state is set, set the workspace and save
170160
const setUp = async () => {
@@ -365,41 +355,25 @@ export default function BlocklyCanvasPanel(props) {
365355
workspaceRef.current.undo(true);
366356
};
367357

368-
const connectToPort = async () => {
369-
const filters = [
370-
{ usbVendorId: 0x2341, usbProductId: 0x0043 },
371-
{ usbVendorId: 0x2341, usbProductId: 0x0001 },
372-
];
373-
let port;
374-
try {
375-
port = await navigator.serial.requestPort({ filters });
376-
} catch (e) {
377-
console.log(e);
378-
return;
379-
}
380-
window['port'] = port;
381-
};
382-
383358
const handleConsole = async () => {
359+
// if serial monitor is not shown
384360
if (!showConsole) {
385-
if (typeof window['port'] === 'undefined') {
386-
await connectToPort();
387-
}
361+
// connect to port
362+
await handleOpenConnection(9600, true);
363+
// if fail to connect to port, return
388364
if (typeof window['port'] === 'undefined') {
389365
message.error('Fail to select serial device');
390366
return;
391367
}
392-
setShowConsole(true);
393368
setConnectionOpen(true);
394-
document.getElementById('connect-button').innerHTML = 'Disconnect';
395-
openConnection(9600, true);
396-
} else {
369+
setShowConsole(true);
370+
}
371+
// if serial monitor is shown, close the connection
372+
else {
397373
setShowConsole(false);
398374
if (connectionOpen) {
399-
console.log('Close connection');
400-
disconnect();
375+
await handleCloseConnection();
401376
setConnectionOpen(false);
402-
document.getElementById('connect-button').innerHTML = 'Connect';
403377
}
404378
}
405379
};
@@ -408,15 +382,13 @@ export default function BlocklyCanvasPanel(props) {
408382
if (connectionOpen) {
409383
message.error('Close Serial Monitor before uploading your code');
410384
} else {
411-
if (typeof window['port'] === 'undefined') {
412-
await connectToPort();
413-
}
385+
await connectToPort();
414386
if (typeof window['port'] === 'undefined') {
415387
message.error('Fail to select serial device');
416388
return;
417389
}
418390
setCompileError('');
419-
compileArduinoCode(
391+
await compileArduinoCode(
420392
workspaceRef.current,
421393
setSelectedCompile,
422394
setCompileError,

‎client/src/components/DayPanels/BlocklyCanvasPanel/ConsoleModal.js

Lines changed: 26 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,75 @@
11
import { Button, Checkbox, Select, Input, message, Row, Col } from 'antd';
22
import React, { useState, useEffect } from 'react';
3-
import { openConnection, disconnect, writeToPort } from '../consoleHelpers';
3+
import {
4+
writeToPort,
5+
handleOpenConnection,
6+
handleCloseConnection,
7+
} from '../consoleHelpers';
48
import Message from '../../Message';
59

610
message.config({
711
duration: 2,
812
maxCount: 1,
913
});
1014

11-
export default function ConsoleModal(props) {
15+
export default function ConsoleModal({
16+
connectionOpen,
17+
setConnectionOpen,
18+
show,
19+
}) {
1220
const [baudRate, setBaudRate] = useState(9600);
1321
const [input, setInput] = useState('');
1422
const [newLine, setnewLine] = useState(true);
1523
const [deviceDisconnect, setDeviceDisconnect] = useState(false);
1624

17-
const { connectionOpen, setConnectionOpen } = props;
18-
1925
useEffect(() => {
2026
navigator.serial.addEventListener('disconnect', (e) => {
2127
console.log('device disconnected');
2228
window.port = undefined;
23-
console.log('cleaned');
2429
setConnectionOpen(false);
2530
document.getElementById('connect-button').innerHTML = 'Connect';
2631
setDeviceDisconnect(true);
2732
message.error('Device Disconnected');
2833
});
2934
navigator.serial.addEventListener('connect', (e) => {
30-
console.log('device connected');
3135
setDeviceDisconnect(false);
3236
message.success('Device Connected');
3337
});
3438
}, [deviceDisconnect, setConnectionOpen]);
3539

40+
const handleKeyPress = async (e) => {
41+
if (e.key === 'Enter') {
42+
await sendInput();
43+
}
44+
};
45+
3646
const handleConnect = async () => {
3747
if (!connectionOpen) {
38-
if (typeof window['port'] === 'undefined') {
39-
const filters = [
40-
{ usbVendorId: 0x2341, usbProductId: 0x0043 },
41-
{ usbVendorId: 0x2341, usbProductId: 0x0001 },
42-
];
43-
let port;
44-
try {
45-
port = await navigator.serial.requestPort({ filters });
46-
} catch (e) {
47-
console.log(e);
48-
return;
49-
}
50-
window['port'] = port;
51-
}
48+
await handleOpenConnection(baudRate, newLine);
5249
setConnectionOpen(true);
5350
setDeviceDisconnect(false);
54-
document.getElementById('connect-button').innerHTML = 'Disconnect';
55-
openConnection(baudRate, newLine);
5651
} else {
57-
console.log('Close connection');
58-
disconnect();
52+
await handleCloseConnection();
5953
setConnectionOpen(false);
60-
document.getElementById('connect-button').innerHTML = 'Connect';
6154
}
55+
setInput('');
6256
};
6357

6458
const handleChange = ({ value }) => {
6559
setBaudRate(value);
6660
};
6761

68-
const sendInput = () => {
62+
const sendInput = async () => {
6963
if (!connectionOpen) {
7064
window.alert('Connection not opened.');
7165
return;
7266
}
73-
console.log(input);
74-
writeToPort(input);
67+
await writeToPort(input);
68+
setInput('');
7569
};
7670

7771
return (
78-
<div id='console-container' className={props.show ? 'open' : ''}>
72+
<div id='console-container' className={show ? 'open' : ''}>
7973
<div style={{ margin: '5px 0' }}>
8074
<strong style={{ fontSize: '10' }}>Baud Rate: </strong>
8175
<Select
@@ -103,7 +97,7 @@ export default function ConsoleModal(props) {
10397
onClick={() => handleConnect()}
10498
style={{ marginLeft: '10px' }}
10599
>
106-
Connect
100+
{connectionOpen ? 'Disconnect' : 'Connect'}
107101
</Button>
108102
<Checkbox
109103
checked={newLine}
@@ -126,6 +120,8 @@ export default function ConsoleModal(props) {
126120
value={input}
127121
placeholder='Enter your input: '
128122
id='console-message'
123+
autoComplete='off'
124+
onKeyPress={handleKeyPress}
129125
onChange={(e) => {
130126
setInput(e.target.value);
131127
}}

‎client/src/components/DayPanels/consoleHelpers.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -92,3 +92,32 @@ export const disconnect = async () => {
9292
}
9393
await port.close();
9494
};
95+
96+
export const connectToPort = async () => {
97+
const filters = [
98+
{ usbVendorId: 0x2341, usbProductId: 0x0043 },
99+
{ usbVendorId: 0x2341, usbProductId: 0x0001 },
100+
];
101+
try {
102+
port = await navigator.serial.requestPort({ filters });
103+
} catch (e) {
104+
console.error(e);
105+
return;
106+
}
107+
window['port'] = port;
108+
};
109+
110+
export const handleOpenConnection = async (baudRate, newLine) => {
111+
if (typeof window['port'] === 'undefined') {
112+
await connectToPort();
113+
if (typeof window['port'] === 'undefined') {
114+
return;
115+
}
116+
}
117+
await openConnection(baudRate, newLine);
118+
};
119+
120+
export const handleCloseConnection = async () => {
121+
console.log('Close connection');
122+
disconnect();
123+
};

‎client/src/components/DayPanels/helpers.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,11 +63,11 @@ export const compileArduinoCode = async (
6363
let workspaceText = window.Blockly.Xml.domToText(workspaceDom);
6464
let path;
6565
isStudent ? (path = '/submissions') : (path = '/sandbox/submission');
66-
day.id = isStudent ? day.id : undefined;
66+
let id = isStudent ? day.id : undefined;
6767

6868
// create an initial submission
6969
const initialSubmission = await createSubmission(
70-
day,
70+
id,
7171
workspaceText,
7272
sketch,
7373
path,

0 commit comments

Comments
 (0)