The following changes were made to cncjs version 1.10.3 in order to add the autolevel widget:
package.json
(in the root folder of the project): Add the following lines to dependencies
"dependencies": {
..
"numeral": "^2.0.6",
"react-table": "^6.8.6",
..
Install the additional node modules by running the command
yarn
src/app/.gitignore
Don't ignore css files because we need react-table.css
Change
*.css
to
#*.css
src/app/containers/Workspace/Widget.jsx
add line
import AutoLevelWidget from 'app/widgets/AutoLevel';
in function getWidgetByName, add
'autolevel': AutoLevelWidget,
src/app/containers/Workspace/WidgetManager/WidgetManager.jsx
in array widgetList, add
widgetList = [ etc.
{
id: 'autolevel',
caption: i18n._('AutoLevel Widget'),
details: i18n._('This widget lets you probe a grid for autolevelling a PCB.'),
visible: true,
disabled: false
}
src/app/store/defaultState.js
add 'autoLevel' to secondary widgets
workspace: { etc.
secondary: { etc.
widgets: [
'axes', 'gcode', 'macro', 'probe', 'spindle', 'laser', 'autolevel'
]
under 'widgets: {' add
widgets: {
autolevel: {
minimized: false,
},
src/server/controllers/Grbl/GrblController.js
:Modify the section
this.runner.on('parameters', (res) => {
this.emit('serialport:read', res.raw);
});
to
this.runner.on("parameters", (res) => {
const probingData = {
type: "probing",
printed: false,
result: res.value,
};
this.emit("serialport:read", probingData);
this.emit("serialport:read", res.raw);
});
This is where the result from probing is captured.
Add the folder
src/app/widgets/AutoLevel
It contains the files with the code for the new widget.
src/app/widgets/AutoLevel/index.jsx
contains the code that receives the event that was emitted from GrblController.js
controllerEvents = {
'serialport:read': (received) => {
if (received.type === 'probing') {
const modified = {
type: received.type,
printed: false,
result:
{
result: received.result.result,
x: Number(received.result.x),
y: Number(received.result.y),
z: Number(received.result.z )
}
};
this.setState({ probingData: modified });
}
},
