Skip to content

Commit 4c66dce

Browse files
committed
fixes: nav, start as first component
1 parent b72c835 commit 4c66dce

File tree

20 files changed

+271
-62
lines changed

20 files changed

+271
-62
lines changed

lib/components/_components.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@ var menu_1 = require('./menu/menu');
1111
exports.Menu = menu_1.default;
1212
var progress_1 = require('./progress/progress');
1313
exports.Progress = progress_1.default;
14-
var checks_1 = require('./checks/checks');
15-
exports.Checks = checks_1.Checks;
14+
var start_1 = require('./start/start');
15+
exports.Start = start_1.Start;
1616
var tutorials_1 = require('./tutorials/tutorials');
1717
exports.Tutorials = tutorials_1.Tutorials;
1818
var final_page_1 = require('./final-page/final-page');

lib/components/checks/checks.js

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -14,18 +14,17 @@ var __metadata = (this && this.__metadata) || function (k, v) {
1414
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
1515
};
1616
var React = require('react');
17-
var paper_1 = require('material-ui/lib/paper');
1817
var setup_checker_1 = require('./setup-checker');
1918
var VerticalStep_1 = require('material-ui/lib/Stepper/VerticalStep');
2019
var flat_button_1 = require('material-ui/lib/flat-button');
2120
var action_setup_1 = require('../../reducers/checks/action-setup');
2221
var react_redux_1 = require('react-redux');
2322
var store_1 = require('../../store/store');
2423
var Action = require('../../actions/actions');
25-
var style = {
26-
icon: {
27-
backgroundColor: 'red'
28-
}
24+
var fail = '✗';
25+
var Welcome = function (_a) {
26+
var trigger = _a.trigger;
27+
return (React.createElement("div", null, React.createElement("p", null, "Tutorials in your Editor"), React.createElement(flat_button_1.default, {style: { font: '2em' }, label: 'Begin', primary: true, onTouchTap: trigger})));
2928
};
3029
var Checks = (function (_super) {
3130
__extends(Checks, _super);
@@ -42,21 +41,23 @@ var Checks = (function (_super) {
4241
};
4342
Checks.prototype.render = function () {
4443
var _a = this.props, checks = _a.checks, routeToTutorials = _a.routeToTutorials, verify = _a.verify;
45-
return React.createElement(paper_1.default, {className: 'cr-start'}, React.createElement("div", {className: 'cr-start-header'}, React.createElement("p", {className: 'tagline'}, "Setup"), checks.system.passed ? null : React.createElement(setup_checker_1.default, {title: 'Dependency Checks', status: this.getSystemChecks(checks)}, React.createElement(VerticalStep_1.default, {style: style, orderStepLabel: '✗', stepLabel: 'Node >= 0.10', actions: [
44+
return React.createElement("section", {className: 'cr-start'}, React.createElement("div", {className: 'cr-start-header'}, checks.passed
45+
? React.createElement(Welcome, {trigger: routeToTutorials})
46+
: React.createElement("p", {className: 'tagline'}, "Setup"), checks.system.passed ? null : React.createElement(setup_checker_1.default, {title: 'Dependency Checks', status: this.getSystemChecks(checks)}, React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'Node >= 0.10', actions: [
4647
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify})
47-
]}, React.createElement("div", null, "Install a newer version of ", React.createElement("a", {href: 'https://nodejs.org'}, "Node"))), React.createElement(VerticalStep_1.default, {orderStepLabel: '✗', stepLabel: 'NPM >= 3', actions: [
48+
]}, React.createElement("div", null, "Install a newer version of ", React.createElement("a", {href: 'https://nodejs.org'}, "Node"))), React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'NPM >= 3', actions: [
4849
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
49-
]}, React.createElement("div", null, "Update your version of NPM.", React.createElement("br", null), "`> npm update -g npm`"))), checks.setup.passed ? null : React.createElement(setup_checker_1.default, {title: 'Setup Checks', status: this.getSetupChecks(checks)}, React.createElement(VerticalStep_1.default, {orderStepLabel: '✗', stepLabel: 'working directory', actions: [
50+
]}, React.createElement("div", null, "Update your version of NPM.", React.createElement("br", null), "`> npm update -g npm`"))), checks.setup.passed ? null : React.createElement(setup_checker_1.default, {title: 'Setup Checks', status: this.getSetupChecks(checks)}, React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'working directory', actions: [
5051
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
5152
React.createElement(flat_button_1.default, {key: 1, secondary: true, label: 'Do it for me', onTouchTap: action_setup_1.openDirectory})
52-
]}, React.createElement("div", null, "File -> Open (a new folder)")), React.createElement(VerticalStep_1.default, {orderStepLabel: '✗', stepLabel: 'package.json', actions: [
53+
]}, React.createElement("div", null, "File -> Open (a new folder)")), React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'package.json', actions: [
5354
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
5455
React.createElement(flat_button_1.default, {key: 1, secondary: true, label: 'Do it for me', onTouchTap: action_setup_1.createPackageJson})
55-
]}, React.createElement("div", null, "Create a package.json by running", React.createElement("br", null), "`> npm init -y`")), React.createElement(VerticalStep_1.default, {orderStepLabel: '✗', stepLabel: 'install tutorial', actions: [
56+
]}, React.createElement("div", null, "Create a package.json by running", React.createElement("br", null), "`> npm init -y`")), React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'install tutorial', actions: [
5657
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
5758
React.createElement(flat_button_1.default, {key: 1, secondary: true, label: 'Do it for me', onTouchTap: action_setup_1.installTutorial})
5859
]}, React.createElement("div", null, "Install a tutorial using npm. For example:", React.createElement("br", null), "`> npm install coderoad-functional-school --save-dev`")))), checks.passed
59-
? React.createElement(flat_button_1.default, {label: 'Begin', primary: true, onTouchTap: routeToTutorials})
60+
? null
6061
: React.createElement("div", {className: 'setup-guide'}, React.createElement("span", null, "Check the", React.createElement("a", {href: 'https://coderoad.github.io/docs#install'}, " ", React.createElement("strong", null, "Install Guide")))), React.createElement("p", {className: 'version'}, "Beta"));
6162
};
6263
Checks = __decorate([

lib/components/menu/menu.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ var render_1 = require('../render');
2121
var subscriptions_1 = require('../../atom/subscriptions');
2222
var app_bar_1 = require('material-ui/lib/app-bar');
2323
var icon_button_1 = require('material-ui/lib/icon-button');
24+
var close_1 = require('material-ui/lib/svg-icons/navigation/close');
2425
var icon_menu_1 = require('material-ui/lib/menus/icon-menu');
2526
var more_vert_1 = require('material-ui/lib/svg-icons/navigation/more-vert');
2627
var menu_item_1 = require('material-ui/lib/menus/menu-item');
@@ -58,7 +59,9 @@ var default_1 = (function (_super) {
5859
};
5960
default_1.prototype.render = function () {
6061
var quit = this.props.quit;
61-
return React.createElement(app_bar_1.default, {title: 'CodeRoad', className: 'cr-menu-bar', iconElementRight: React.createElement(icon_menu_1.default, {iconButtonElement: React.createElement(icon_button_1.default, null, React.createElement(more_vert_1.default, null)), targetOrigin: origin, anchorOrigin: origin}, this.menuOptions(), window.coderoad.issuesPath ? React.createElement(menu_item_1.default, {key: 'issue', className: 'link'}, React.createElement("a", {href: window.coderoad.issuesPath}, "post issue")) : null, React.createElement(divider_1.default, null), React.createElement(menu_item_1.default, {key: 'quit', onClick: quit}, "quit"))});
62+
return React.createElement(app_bar_1.default, {title: 'CodeRoad', className: 'cr-menu-bar', iconElementLeft: React.createElement(icon_button_1.default, {onClick: this.closePanel}, React.createElement(close_1.default, null)), iconElementRight: React.createElement(icon_menu_1.default, {iconButtonElement: React.createElement(icon_button_1.default, null, React.createElement(more_vert_1.default, null)), targetOrigin: origin, anchorOrigin: origin}, this.menuOptions(), window.coderoad.issuesPath
63+
? React.createElement(menu_item_1.default, {key: 'issue', className: 'link'}, React.createElement("a", {href: window.coderoad.issuesPath}, "post issue"))
64+
: null, React.createElement(divider_1.default, null), React.createElement(menu_item_1.default, {key: 'quit', onClick: quit}, "quit"))});
6265
};
6366
default_1 = __decorate([
6467
react_redux_1.connect(null, function (dispatch) {

lib/components/routes/routes.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@ var default_1 = (function (_super) {
1717
return React.createElement(_components_1.Page, {page: state.page, tasks: state.tasks, taskPosition: state.taskPosition, hintPosition: state.hintPosition, editorActions: state.editorActions, runTests: state.runTests, log: state.log});
1818
case 'progress':
1919
return React.createElement(_components_1.Progress, {progress: state.progress, position: state.position});
20-
case 'checks':
21-
return React.createElement(_components_1.Checks, {checks: state.checks});
20+
case 'start':
21+
return React.createElement(_components_1.Start, {checks: state.checks});
2222
case 'tutorials':
2323
return React.createElement(_components_1.Tutorials, {tutorials: state.tutorials});
2424
case 'final':

lib/components/start/checks/checks.js

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
"use strict";
2+
var __extends = (this && this.__extends) || function (d, b) {
3+
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
4+
function __() { this.constructor = d; }
5+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
6+
};
7+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
8+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
9+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
10+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
11+
return c > 3 && r && Object.defineProperty(target, key, r), r;
12+
};
13+
var __metadata = (this && this.__metadata) || function (k, v) {
14+
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
15+
};
16+
var React = require('react');
17+
var setup_checker_1 = require('./setup-checker');
18+
var VerticalStep_1 = require('material-ui/lib/Stepper/VerticalStep');
19+
var flat_button_1 = require('material-ui/lib/flat-button');
20+
var action_setup_1 = require('../../../reducers/checks/action-setup');
21+
var react_redux_1 = require('react-redux');
22+
var store_1 = require('../../../store/store');
23+
var Action = require('../../../actions/actions');
24+
var fail = '✗';
25+
var Checks = (function (_super) {
26+
__extends(Checks, _super);
27+
function Checks() {
28+
_super.apply(this, arguments);
29+
}
30+
Checks.prototype.getSystemChecks = function (checks) {
31+
var system = checks.system;
32+
return [system.node, system.npm];
33+
};
34+
Checks.prototype.getSetupChecks = function (checks) {
35+
var setup = checks.setup;
36+
return [setup.dir, setup.packageJson, setup.tutorial];
37+
};
38+
Checks.prototype.render = function () {
39+
var _a = this.props, checks = _a.checks, verify = _a.verify;
40+
return React.createElement("div", {className: 'cr-checks'}, React.createElement("p", {className: 'tagline'}, "Setup"), checks.system.passed ? null : React.createElement(setup_checker_1.default, {title: 'Dependency Checks', status: this.getSystemChecks(checks)}, React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'Node >= 0.10', actions: [
41+
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify})
42+
]}, React.createElement("div", null, "Install a newer version of ", React.createElement("a", {href: 'https://nodejs.org'}, "Node"))), React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'NPM >= 3', actions: [
43+
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
44+
]}, React.createElement("div", null, "Update your version of NPM.", React.createElement("br", null), "`> npm update -g npm`"))), checks.setup.passed ? null : React.createElement(setup_checker_1.default, {title: 'Setup Checks', status: this.getSetupChecks(checks)}, React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'working directory', actions: [
45+
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
46+
React.createElement(flat_button_1.default, {key: 1, secondary: true, label: 'Do it for me', onTouchTap: action_setup_1.openDirectory})
47+
]}, React.createElement("div", null, "File -> Open (a new folder)")), React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'package.json', actions: [
48+
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
49+
React.createElement(flat_button_1.default, {key: 1, secondary: true, label: 'Do it for me', onTouchTap: action_setup_1.createPackageJson})
50+
]}, React.createElement("div", null, "Create a package.json by running", React.createElement("br", null), "`> npm init -y`")), React.createElement(VerticalStep_1.default, {orderStepLabel: fail, stepLabel: 'install tutorial', actions: [
51+
React.createElement(flat_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: verify}),
52+
React.createElement(flat_button_1.default, {key: 1, secondary: true, label: 'Do it for me', onTouchTap: action_setup_1.installTutorial})
53+
]}, React.createElement("div", null, "Install a tutorial using npm. For example:", React.createElement("br", null), "`> npm install coderoad-functional-school --save-dev`"))), checks.passed
54+
? null
55+
: React.createElement("div", {className: 'setup-guide'}, React.createElement("span", null, "Check the", React.createElement("a", {href: 'https://coderoad.github.io/docs#install'}, " ", React.createElement("strong", null, "Install Guide")))));
56+
};
57+
Checks = __decorate([
58+
react_redux_1.connect(null, function (dispatch) {
59+
return {
60+
verify: function () { return store_1.store.dispatch(Action.verifySetup()); }
61+
};
62+
}),
63+
__metadata('design:paramtypes', [])
64+
], Checks);
65+
return Checks;
66+
}(React.Component));
67+
Object.defineProperty(exports, "__esModule", { value: true });
68+
exports.default = Checks;
Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
"use strict";
2+
var __extends = (this && this.__extends) || function (d, b) {
3+
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
4+
function __() { this.constructor = d; }
5+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
6+
};
7+
var React = require('react');
8+
var Stepper_1 = require('material-ui/lib/Stepper/Stepper');
9+
var font_icon_1 = require('material-ui/lib/font-icon');
10+
var styles = {
11+
header: {
12+
textAlign: 'center',
13+
padding: 10,
14+
fontSize: 20
15+
},
16+
actionButton: {
17+
marginRight: 8
18+
}
19+
};
20+
var default_1 = (function (_super) {
21+
__extends(default_1, _super);
22+
function default_1(props) {
23+
_super.call(this, props);
24+
var statusSteps = this.props.status;
25+
this.state = {
26+
activeStep: statusSteps.indexOf(false) || -1,
27+
statusSteps: statusSteps
28+
};
29+
}
30+
default_1.prototype.selectStep = function (CurrentStep) {
31+
this.setState({
32+
activeStep: CurrentStep,
33+
statusSteps: this.state.statusSteps
34+
});
35+
};
36+
default_1.prototype.updateCompletedSteps = function (CurrentStep) {
37+
return this.state.statusSteps[CurrentStep];
38+
};
39+
default_1.prototype.createIcon = function (step) {
40+
if (step.props.isCompleted) {
41+
return (React.createElement(font_icon_1.default, {className: 'material-icons', style: { fontSize: 14 }}, "✓"));
42+
}
43+
return React.createElement("span", null, step.props.orderStepLabel);
44+
};
45+
default_1.prototype.continue = function () {
46+
var _a = this.state, activeStep = _a.activeStep, statusSteps = _a.statusSteps;
47+
statusSteps[activeStep] = true;
48+
this.state = {
49+
activeStep: activeStep + 1,
50+
statusSteps: statusSteps,
51+
};
52+
};
53+
default_1.prototype.render = function () {
54+
return React.createElement("div", null, React.createElement("div", {style: styles.header}, this.props.title), React.createElement(Stepper_1.default, {activeStep: this.state.activeStep, onStepHeaderTouch: this.selectStep.bind(this), updateCompletedStatus: this.updateCompletedSteps.bind(this), createIcon: this.createIcon}, this.props.children));
55+
};
56+
return default_1;
57+
}(React.Component));
58+
Object.defineProperty(exports, "__esModule", { value: true });
59+
exports.default = default_1;

lib/components/start/start.js

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
"use strict";
2+
var __extends = (this && this.__extends) || function (d, b) {
3+
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
4+
function __() { this.constructor = d; }
5+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
6+
};
7+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
8+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
9+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
10+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
11+
return c > 3 && r && Object.defineProperty(target, key, r), r;
12+
};
13+
var __metadata = (this && this.__metadata) || function (k, v) {
14+
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
15+
};
16+
var React = require('react');
17+
var flat_button_1 = require('material-ui/lib/flat-button');
18+
var checks_1 = require('./checks/checks');
19+
var react_redux_1 = require('react-redux');
20+
var store_1 = require('../../store/store');
21+
var Action = require('../../actions/actions');
22+
var Welcome = (function (_super) {
23+
__extends(Welcome, _super);
24+
function Welcome() {
25+
_super.apply(this, arguments);
26+
}
27+
Welcome.prototype.render = function () {
28+
return React.createElement("div", {class: 'cr-welcome'}, React.createElement(flat_button_1.default, {label: 'Start', onTouchTap: this.props.routeToTutorials}));
29+
};
30+
Welcome = __decorate([
31+
react_redux_1.connect(null, function (dispatch) {
32+
return {
33+
routeToTutorials: function () { return store_1.store.dispatch(Action.setRoute('tutorials')); }
34+
};
35+
}),
36+
__metadata('design:paramtypes', [])
37+
], Welcome);
38+
return Welcome;
39+
}(React.Component));
40+
exports.Start = function (_a) {
41+
var checks = _a.checks;
42+
return (React.createElement("section", {className: 'cr-start'}, React.createElement("div", {className: 'cr-start-header'}, checks.passed
43+
? React.createElement(Welcome, null)
44+
: React.createElement(checks_1.default, {checks: checks})), React.createElement("br", null), React.createElement("p", {className: 'version'}, "Beta")));
45+
};

0 commit comments

Comments
 (0)