mirror of
https://github.com/Doodle3D/Doodle3D-Slicer.git
synced 2024-12-23 03:23:48 +01:00
Add download g-code button
This commit is contained in:
parent
c1cbe4f280
commit
246522ee5f
@ -11,6 +11,9 @@ import FlatButton from 'material-ui/FlatButton';
|
||||
import Slider from 'material-ui/Slider';
|
||||
import LinearProgress from 'material-ui/LinearProgress';
|
||||
import { grey50, grey300, grey800, red500 } from 'material-ui/styles/colors';
|
||||
import Popover from 'material-ui/Popover/Popover';
|
||||
import Menu from 'material-ui/Menu';
|
||||
import MenuItem from 'material-ui/MenuItem';
|
||||
import { Tabs, Tab } from 'material-ui/Tabs';
|
||||
import Settings from './Settings.js';
|
||||
import defaultSettings from '../settings/default.yml';
|
||||
@ -114,6 +117,10 @@ class Interface extends React.Component {
|
||||
printers: defaultPrinter,
|
||||
quality: defaultQuality,
|
||||
material: defaultMaterial,
|
||||
popover: {
|
||||
element: null,
|
||||
open: false
|
||||
},
|
||||
settings: _.merge(
|
||||
{},
|
||||
defaultSettings,
|
||||
@ -177,19 +184,21 @@ class Interface extends React.Component {
|
||||
}
|
||||
};
|
||||
|
||||
slice = async () => {
|
||||
slice = async (target) => {
|
||||
const { isSlicing, settings, printers, quality, material, mesh: { matrix } } = this.state;
|
||||
const { name, mesh } = this.props;
|
||||
|
||||
if (isSlicing) return;
|
||||
|
||||
this.setState({ isSlicing: true, progress: { action: '', slicing: 0, uploading: 0 }, error: null });
|
||||
this.closePopover();
|
||||
|
||||
this.setState({ isSlicing: true, progress: { action: '', percentage: 0, step: 0 }, error: null });
|
||||
|
||||
const exportMesh = new Mesh(mesh.geometry, mesh.material);
|
||||
exportMesh.applyMatrix(matrix);
|
||||
|
||||
try {
|
||||
await slice(name, exportMesh, settings, printers, quality, material, progress => {
|
||||
await slice(target, name, exportMesh, settings, printers, quality, material, progress => {
|
||||
this.setState({ progress: { ...this.state.progress, ...progress } });
|
||||
});
|
||||
} catch (error) {
|
||||
@ -200,6 +209,25 @@ class Interface extends React.Component {
|
||||
}
|
||||
};
|
||||
|
||||
openPopover = (event) => {
|
||||
event.preventDefault();
|
||||
|
||||
this.setState({
|
||||
popover: {
|
||||
element: event.currentTarget,
|
||||
open: true
|
||||
}
|
||||
});
|
||||
};
|
||||
closePopover = () => {
|
||||
this.setState({
|
||||
popover: {
|
||||
element: null,
|
||||
open: false
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
onChangeSettings = (settings) => {
|
||||
this.setState(settings);
|
||||
};
|
||||
@ -238,7 +266,6 @@ class Interface extends React.Component {
|
||||
const { classes, defaultPrinter, defaultQuality, defaultMaterial, onCancel } = this.props;
|
||||
const { isSlicing, progress, settings, printers, quality, material, showFullScreen, error } = this.state;
|
||||
|
||||
const percentage = progress ? (progress.uploading + progress.slicing) / 2.0 * 100.0 : 0.0;
|
||||
const style = { ...(showFullScreen ? {} : { maxWidth: 'inherit', width: '100%', height: '100%' }) };
|
||||
|
||||
const settingsPanel = (
|
||||
@ -257,7 +284,7 @@ class Interface extends React.Component {
|
||||
<div className={classes.sliceActions}>
|
||||
{error && <p className={classes.error}>{error}</p>}
|
||||
{isSlicing && <p>{progress.action}</p>}
|
||||
{isSlicing && <LinearProgress mode="determinate" value={percentage} />}
|
||||
{isSlicing && <LinearProgress mode="determinate" value={progress.percentage * 100.0} />}
|
||||
<div className={classes.sliceButtons}>
|
||||
{onCancel && <RaisedButton
|
||||
label="Cancel"
|
||||
@ -266,11 +293,24 @@ class Interface extends React.Component {
|
||||
/>}
|
||||
<RaisedButton
|
||||
label="Print"
|
||||
ref="button"
|
||||
primary
|
||||
className={`${classes.button}`}
|
||||
onTouchTap={this.slice}
|
||||
onTouchTap={this.openPopover}
|
||||
disabled={isSlicing}
|
||||
/>
|
||||
<Popover
|
||||
open={this.state.popover.open}
|
||||
anchorEl={this.state.popover.element}
|
||||
anchorOrigin={{horizontal: 'left', vertical: 'bottom'}}
|
||||
targetOrigin={{horizontal: 'left', vertical: 'bottom'}}
|
||||
onRequestClose={this.closePopover}
|
||||
>
|
||||
<Menu>
|
||||
<MenuItem primaryText="Send over WiFi" onTouchTap={() => this.slice('WIFI')} />
|
||||
<MenuItem primaryText="Download GCode" onTouchTap={() => this.slice('DOWNLOAD')} />
|
||||
</Menu>
|
||||
</Popover>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -118,9 +118,23 @@ export function fetchProgress(url, { method = 'get', headers = {}, body = {} } =
|
||||
const GCODE_SERVER_URL = 'https://gcodeserver.doodle3d.com';
|
||||
const CONNECT_URL = 'http://connect.doodle3d.com/';
|
||||
|
||||
export async function slice(name, mesh, settings, printers, quality, material, updateProgress) {
|
||||
export async function slice(target, name, mesh, settings, printers, quality, material, updateProgress) {
|
||||
if (!printers) throw new Error('Please select a printer');
|
||||
|
||||
let steps;
|
||||
let currentStep = 0;
|
||||
switch (target) {
|
||||
case 'DOWNLOAD':
|
||||
steps = 1;
|
||||
break;
|
||||
case 'WIFI':
|
||||
steps = 2;
|
||||
break;
|
||||
default:
|
||||
steps = 1;
|
||||
break;
|
||||
}
|
||||
|
||||
const { dimensions } = settings;
|
||||
const centerX = dimensions.x / 2;
|
||||
const centerY = dimensions.y / 2;
|
||||
@ -129,50 +143,62 @@ export async function slice(name, mesh, settings, printers, quality, material, u
|
||||
const { gcode } = await sliceGeometry(settings, mesh.geometry, mesh.material, matrix, false, false, ({ progress }) => {
|
||||
updateProgress({
|
||||
action: progress.action,
|
||||
slicing: progress.done / progress.total
|
||||
percentage: currentStep / steps + progress.done / progress.total / steps
|
||||
});
|
||||
});
|
||||
currentStep ++;
|
||||
|
||||
// const blob = new File([gcode], `${name}.gcode`, { type: 'text/plain;charset=utf-8' });
|
||||
// fileSaver.saveAs(blob);
|
||||
|
||||
// upload G-code file to AWS S3
|
||||
const { data: { reservation, id } } = await fetch(`${GCODE_SERVER_URL}/upload`, { method: 'POST' })
|
||||
.then(response => response.json());
|
||||
|
||||
const body = new FormData();
|
||||
const { fields } = reservation;
|
||||
for (const key in fields) {
|
||||
body.append(key, fields[key]);
|
||||
}
|
||||
|
||||
const file = ';' + JSON.stringify({
|
||||
name: `${name}.gcode`,
|
||||
...settings,
|
||||
printer: {
|
||||
type: printers,
|
||||
title: printerSettings[printers].title
|
||||
},
|
||||
material: {
|
||||
type: material,
|
||||
title: materialSettings[material].title
|
||||
},
|
||||
quality: {
|
||||
type: quality,
|
||||
title: qualitySettings[quality].title
|
||||
switch (target) {
|
||||
case 'DOWNLOAD': {
|
||||
const blob = new File([gcode], `${name}.gcode`, { type: 'text/plain;charset=utf-8' });
|
||||
fileSaver.saveAs(blob);
|
||||
break;
|
||||
}
|
||||
}).trim() + '\n' + gcode;
|
||||
body.append('file', file);
|
||||
|
||||
await fetchProgress(reservation.url, { method: 'POST', body }, (progess) => {
|
||||
updateProgress({
|
||||
action: 'Uploading',
|
||||
uploading: progess.loaded / progess.total
|
||||
});
|
||||
});
|
||||
case 'WIFI': {
|
||||
// upload G-code file to AWS S3
|
||||
const { data: { reservation, id } } = await fetch(`${GCODE_SERVER_URL}/upload`, { method: 'POST' })
|
||||
.then(response => response.json());
|
||||
|
||||
const popup = window.open(`${CONNECT_URL}?uuid=${id}`, '_blank');
|
||||
if (!popup) throw new Error('popup was blocked by browser');
|
||||
const body = new FormData();
|
||||
const { fields } = reservation;
|
||||
for (const key in fields) {
|
||||
body.append(key, fields[key]);
|
||||
}
|
||||
|
||||
const file = ';' + JSON.stringify({
|
||||
name: `${name}.gcode`,
|
||||
...settings,
|
||||
printer: {
|
||||
type: printers,
|
||||
title: printerSettings[printers].title
|
||||
},
|
||||
material: {
|
||||
type: material,
|
||||
title: materialSettings[material].title
|
||||
},
|
||||
quality: {
|
||||
type: quality,
|
||||
title: qualitySettings[quality].title
|
||||
}
|
||||
}).trim() + '\n' + gcode;
|
||||
body.append('file', file);
|
||||
|
||||
await fetchProgress(reservation.url, { method: 'POST', body }, (progess) => {
|
||||
updateProgress({
|
||||
action: 'Uploading',
|
||||
percentage: currentStep / steps + progess.loaded / progess.total / steps
|
||||
});
|
||||
});
|
||||
currentStep ++;
|
||||
|
||||
const popup = window.open(`${CONNECT_URL}?uuid=${id}`, '_blank');
|
||||
if (!popup) throw new Error('popup was blocked by browser');
|
||||
}
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
export const TabTemplate = ({ children, selected, style }) => {
|
||||
|
Loading…
Reference in New Issue
Block a user