Skip to content

Commit 9bf180e

Browse files
committed
Merge pull request #100 from parallaxinc/progressbar
Progressbar
2 parents 1d1af48 + b72a01a commit 9bf180e

File tree

5 files changed

+129
-59
lines changed

5 files changed

+129
-59
lines changed

plugins/editor/pbasic.js

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,13 @@ module.exports = function(CodeMirror){
1111
return new RegExp("^((" + words.join(")|(") + "))\\b", "i");
1212
}
1313

14-
function getWordRange(word, start, end){
14+
function getWordRange(word, start, end, base){
1515
var words = [];
16+
17+
if (base) {
18+
words.push(word)
19+
};
20+
1621
for (var i = start; i < end + 1; i++) {
1722
words.push(word + i);
1823
};
@@ -39,30 +44,30 @@ module.exports = function(CodeMirror){
3944
var etDirective = ['STAMP', 'PORT', 'PBASIC'];
4045
var etTargetModule = ['BS1','BS2','BS2E','BS2SX', 'BS2P', 'BS2PE','BS2PX'];
4146
var etIOFormatter = ['ASC', 'STR','REP', 'SKIP', 'WAITSTR','WAIT','NUM','SNUM']
42-
.concat(getWordRange('DEC', 1, 5))
43-
.concat(getWordRange('BIN', 1, 16))
44-
.concat(getWordRange('ISBIN', 1, 16))
45-
.concat(getWordRange('ISHEX', 1, 4))
46-
.concat(getWordRange('IHEX', 1, 4))
47-
.concat(getWordRange('IBIN', 1, 16))
48-
.concat(getWordRange('HEX', 1, 4))
49-
.concat(getWordRange('SHEX', 1, 4))
50-
.concat(getWordRange('SBIN', 1, 16))
51-
.concat(getWordRange('SDEC', 1, 5));
47+
.concat(getWordRange('DEC', 1, 5, true))
48+
.concat(getWordRange('BIN', 1, 16, true))
49+
.concat(getWordRange('IBIN', 1, 16, true))
50+
.concat(getWordRange('ISBIN', 1, 16, true))
51+
.concat(getWordRange('ISHEX', 1, 4, true))
52+
.concat(getWordRange('IHEX', 1, 4, true))
53+
.concat(getWordRange('IBIN', 1, 16, true))
54+
.concat(getWordRange('HEX', 1, 4, true))
55+
.concat(getWordRange('SHEX', 1, 4, true))
56+
.concat(getWordRange('SBIN', 1, 16, true))
57+
.concat(getWordRange('SDEC', 1, 5, true));
5258

5359
var etVariable = ['INA', 'INB', 'INC', 'IND', 'OUTA', 'OUTB', 'OUTC', 'OUTD',
5460
'DIRA', 'DIRB', 'DIRC', 'DIRD', 'INL', 'INH', 'OUTL', 'OUTH', 'DIRL', 'DIRH',
5561
'INS', 'OUTS', 'DIRS']
5662
.concat(getWordRange('B', 0, 25))
5763
.concat(getWordRange('DIR', 0, 15))
58-
.concat(getWordRange('BIT', 0, 15))
5964
.concat(getWordRange('W', 0, 12))
6065
.concat(getWordRange('OUT', 0, 15))
61-
.concat(getWordRange('NIB', 0, 3))
62-
.concat(getWordRange('IN', 1, 16));
66+
.concat(getWordRange('IN', 0, 16));
6367

6468
var etConstant = ['CLS','HOME','BELL','BKSP','TAB','CR','UNITON','UNITOFF','UNITSOFF',
65-
'LIGHTSON','DIM','BRIGHT','LSBFIRST','MSBFIRST','MSBPRE','LSBPRE','MSBPOST','LSBPOST'];
69+
'LIGHTSON','DIM','BRIGHT','LSBFIRST','MSBFIRST','MSBPRE','LSBPRE','MSBPOST','LSBPOST',
70+
'DEBUGIN','CRSRXY','CRSRLF','CRSRRT','CRSRUP','CRSRDN','LF','CLREOL','CLRDN','CRSRX','CRSRY'];
6671

6772
var etCCDirective = ['#DEFINE', '#ERROR', '#IF', '#THEN', '#ELSE', '#ENDIF', '#SELECT',
6873
'#CASE', '#ENDSELECT'];

plugins/sidebar/file-operations.js

Lines changed: 3 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
'use strict';
22

33
const React = require('react');
4-
const through = require('through2');
54
const { Menu, MainButton, ChildButton } = require('react-mfb-iceddev');
65

76
require('react-mfb-iceddev/mfb.css');
@@ -67,35 +66,6 @@ const FileOperations = React.createClass({
6766
.catch(this.handleError)
6867
.finally(overlay.hide);
6968
},
70-
download: function(device){
71-
const toast = this.props.toast;
72-
const space = this.props.workspace;
73-
const logger = this.props.logger;
74-
const overlay = this.props.overlay;
75-
const irken = this.props.irken;
76-
const name = space.filename.deref();
77-
const source = space.current.deref();
78-
79-
if(!device){
80-
return;
81-
}
82-
83-
const board = irken.getBoard(device);
84-
85-
const log = through(function(chunk, enc, cb){
86-
logger(chunk.toString());
87-
cb(null, chunk);
88-
});
89-
90-
board.compile(source)
91-
.tap(() => logger.clear())
92-
.then((memory) => board.bootload(memory))
93-
.then(() => board.read().pipe(log))
94-
.tap(() => toast.clear())
95-
.tap(() => this.handleSuccess(`'${name}' downloaded successfully`))
96-
.catch(this.handleError)
97-
.finally(overlay.hide);
98-
},
9969
renderOverlay: function(component){
10070
const overlay = this.props.overlay;
10171

@@ -145,9 +115,10 @@ const FileOperations = React.createClass({
145115

146116
const component = (
147117
<DownloadOverlay
148-
onAccept={this.download}
149118
onCancel={this.hideOverlay}
150-
irken={this.props.irken} />
119+
irken={this.props.irken}
120+
handleSuccess={this.handleSuccess}
121+
handleError={this.handleError} />
151122
);
152123

153124
this.renderOverlay(component);

plugins/sidebar/overlays/download.js

Lines changed: 59 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,12 @@
22

33
const _ = require('lodash');
44
const React = require('react');
5+
const through = require('through2');
56
const Card = require('react-material/components/Card');
67
const Button = require('react-material/components/Button');
78
const Select = require('react-select');
89
const Loader = require('react-loader');
10+
const Progress = require('./progress');
911

1012
require('react-select/dist/default.css');
1113

@@ -17,23 +19,23 @@ class DownloadOverlay extends React.Component {
1719
devicePath: null,
1820
searching: false,
1921
selectedDevice: null,
20-
devices: []
22+
devices: [],
23+
progress: 0
2124
};
2225

2326
this.onAccept = this.onAccept.bind(this);
2427
this.onCancel = this.onCancel.bind(this);
2528
this.reloadDevices = this.reloadDevices.bind(this);
2629
this.updateSelected = this.updateSelected.bind(this);
30+
this.updateProgress = this.updateProgress.bind(this);
2731
}
2832

2933
componentDidMount(){
3034
this.reloadDevices();
3135
}
3236

3337
onAccept(evt){
34-
if(typeof this.props.onAccept === 'function'){
35-
this.props.onAccept(this.state.selectedDevice, evt);
36-
}
38+
this.download(this.state.selectedDevice);
3739
}
3840

3941
onCancel(evt){
@@ -42,6 +44,47 @@ class DownloadOverlay extends React.Component {
4244
}
4345
}
4446

47+
download(device){
48+
49+
const { irken, handleError, handleSuccess } = this.props;
50+
51+
const { toast, workspace, logger, overlay } = irken;
52+
53+
const name = workspace.filename.deref();
54+
const source = workspace.current.deref();
55+
56+
if(!device){
57+
return;
58+
}
59+
60+
const board = irken.getBoard(device);
61+
62+
board.on('progress', this.updateProgress);
63+
64+
const log = through(function(chunk, enc, cb){
65+
logger(chunk.toString());
66+
cb(null, chunk);
67+
});
68+
69+
board.compile(source)
70+
.tap(() => logger.clear())
71+
.then((memory) => board.bootload(memory))
72+
.then(() => board.read().pipe(log))
73+
.tap(() => toast.clear())
74+
.tap(() => handleSuccess(`'${name}' downloaded successfully`))
75+
.catch(handleError)
76+
.finally(() => {
77+
overlay.hide();
78+
board.removeListener('progress', this.updateProgress);
79+
this.setState({ progress: 0 });
80+
});
81+
82+
}
83+
84+
updateProgress(progress){
85+
this.setState({ progress: progress});
86+
}
87+
4588
updateSelected(device){
4689
this.setState({
4790
devicePath: device.path,
@@ -74,8 +117,7 @@ class DownloadOverlay extends React.Component {
74117
return (
75118
<Card styles={[styles.overlay, styles.overlayLarge]}>
76119
<h3 style={styles.overlayTitle}>Please choose your connected device.</h3>
77-
<div style={styles.overlayTableContainer}>
78-
<Button onClick={this.reloadDevices}>Reload Devices</Button>
120+
<div>
79121
<Loader loaded={!this.state.searching}>
80122
<div style={styles.deviceTableWrapper}>
81123
<div style={styles.deviceTableScroll}>
@@ -94,9 +136,17 @@ class DownloadOverlay extends React.Component {
94136
</div>
95137
</Loader>
96138
</div>
97-
<div style={styles.overlayButtonContainer}>
98-
<Button onClick={this.onAccept}>Download</Button>
99-
<Button onClick={this.onCancel}>Cancel</Button>
139+
<div>
140+
</div>
141+
<div style={styles.overlayDevicesBottom}>
142+
<div style={styles.overlayLoadingContainer}>
143+
<Button onClick={this.reloadDevices}>Reload Devices</Button>
144+
<Progress setComplete={this.state.progress} />
145+
</div>
146+
<div style={styles.overlayButtonContainer}>
147+
<Button onClick={this.onAccept}>Download</Button>
148+
<Button onClick={this.onCancel}>Cancel</Button>
149+
</div>
100150
</div>
101151
</Card>
102152
);
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
'use strict';
2+
3+
const React = require('react');
4+
5+
var styles = require('../styles.js');
6+
7+
class Progress extends React.Component {
8+
9+
render(){
10+
11+
var setComplete = {width: this.props.setComplete + '%'};
12+
13+
return (
14+
<div style={styles.progressContainerStyle}>
15+
<div styles={[styles.progressBarStyle, setComplete]}></div>
16+
</div>
17+
);
18+
}
19+
}
20+
21+
module.exports = Progress;

plugins/sidebar/styles.js

Lines changed: 26 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,22 +31,41 @@ const styles = {
3131
overlayTitle: {
3232
margin: 0
3333
},
34-
overlayButtonContainer: {
34+
overlayDevicesBottom: {
3535
margin: 'auto 0 0 auto'
3636
},
37+
overlayButtonContainer: {
38+
margin: 'auto 0 0 auto',
39+
display: 'inline-block',
40+
height: '40px'
41+
},
42+
overlayLoadingContainer: {
43+
display: 'inline-block',
44+
marginRight: '60px',
45+
height: '40px'
46+
},
3747
overlaySelectContainer: {
3848
display: 'flex',
3949
marginTop: 20
4050
},
41-
overlayTableContainer: {
51+
progressContainerStyle: {
52+
width: '100%',
53+
height: '8px',
54+
backgroundColor: '#b0d0ef',
55+
position: 'absolute',
56+
bottom: 0,
57+
left: 0
58+
},
59+
progressBarStyle: {
60+
height: '100%',
61+
backgroundColor: '#3a81f0'
4262
},
4363
deviceTable: {
4464
width: '100%',
4565
maxWidth: '100%',
4666
borderCollapse: 'collapse',
4767
borderSpacing: 0,
4868
display: 'table',
49-
5069
},
5170
deviceTableWrapper: {
5271
position: 'relative'
@@ -77,6 +96,10 @@ const styles = {
7796
inactive: {
7897
backgroundColor: 'transparent'
7998
},
99+
progressBar: {
100+
height: '50px',
101+
width: '50px'
102+
},
80103
changeFolderButton: {
81104
position: 'absolute',
82105
top: -28,

0 commit comments

Comments
 (0)