Skip to content

Commit e660f01

Browse files
ShMcKShMcK
committed
add empty task outline
1 parent a7bf170 commit e660f01

File tree

4 files changed

+102
-59
lines changed

4 files changed

+102
-59
lines changed

‎lib/components/Page/Tasks/index.js‎

Lines changed: 35 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,20 @@
11
"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+
};
216
var React = require('react');
17+
var react_redux_1 = require('react-redux');
318
var Card_1 = require('material-ui/Card');
419
var Tabs_1 = require('material-ui/Tabs');
520
var Task_1 = require('../Task');
@@ -8,6 +23,7 @@ var Tests_1 = require('../Tests');
823
var TaskActions_1 = require('../TaskActions');
924
var Hints_1 = require('../Hints');
1025
var AddButton_1 = require('../AddButton');
26+
var actions_1 = require('../../../actions');
1127
var styles = {
1228
card: {
1329
margin: '5px',
@@ -31,9 +47,24 @@ var styles = {
3147
marginLeft: '10px',
3248
},
3349
};
34-
var Tasks = function (_a) {
35-
var tasks = _a.tasks, page = _a.page, config = _a.config;
36-
return (React.createElement("div", null, tasks.map(function (task, index) { return (React.createElement(Card_1.Card, {style: styles.card, initiallyExpanded: index === 0}, React.createElement(Card_1.CardHeader, {actAsExpander: true, showExpandableButton: true}, React.createElement("span", {style: styles.title}, "Task ", index + 1), React.createElement(Tests_1.default, {style: styles.test, tests: task.tests, config: config})), React.createElement(Card_1.CardText, {expandable: true, style: styles.cardContent}, React.createElement(Tabs_1.Tabs, {tabItemContainerStyle: styles.tabBar}, React.createElement(Tabs_1.Tab, {label: 'Description'}, React.createElement(Task_1.default, {key: index.toString(), index: index, task: task})), React.createElement(Tabs_1.Tab, {label: 'Actions'}, React.createElement(TaskActions_1.default, {actions: task.actions, taskPosition: index})), React.createElement(Tabs_1.Tab, {label: 'Hints'}, React.createElement(Hints_1.default, {hints: task.hints, taskPosition: index})))))); }), React.createElement(AddButton_1.default, null), React.createElement(TasksComplete_1.default, {page: page})));
37-
};
50+
var Tasks = (function (_super) {
51+
__extends(Tasks, _super);
52+
function Tasks() {
53+
_super.apply(this, arguments);
54+
}
55+
Tasks.prototype.render = function () {
56+
var _a = this.props, tasks = _a.tasks, page = _a.page, config = _a.config, taskAdd = _a.taskAdd;
57+
return (React.createElement("div", null, tasks.map(function (task, index) { return (React.createElement(Card_1.Card, {style: styles.card, initiallyExpanded: index === 0}, React.createElement(Card_1.CardHeader, {actAsExpander: true, showExpandableButton: true}, React.createElement("span", {style: styles.title}, "Task ", index + 1), React.createElement(Tests_1.default, {style: styles.test, tests: task.tests, config: config})), React.createElement(Card_1.CardText, {expandable: true, style: styles.cardContent}, React.createElement(Tabs_1.Tabs, {tabItemContainerStyle: styles.tabBar}, React.createElement(Tabs_1.Tab, {label: 'Description'}, React.createElement(Task_1.default, {key: index.toString(), index: index, task: task})), React.createElement(Tabs_1.Tab, {label: 'Actions'}, React.createElement(TaskActions_1.default, {actions: task.actions, taskPosition: index})), React.createElement(Tabs_1.Tab, {label: 'Hints'}, React.createElement(Hints_1.default, {hints: task.hints, taskPosition: index})))))); }), React.createElement(AddButton_1.default, {callback: taskAdd}), React.createElement(TasksComplete_1.default, {page: page})));
58+
};
59+
Tasks = __decorate([
60+
react_redux_1.connect(null, function (dispatch) {
61+
return {
62+
taskAdd: function () { return dispatch(actions_1.tutorialTaskAdd()); }
63+
};
64+
}),
65+
__metadata('design:paramtypes', [])
66+
], Tasks);
67+
return Tasks;
68+
}(React.Component));
3869
Object.defineProperty(exports, "__esModule", { value: true });
3970
exports.default = Tasks;

‎lib/modules/tutorial/actions.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,10 @@ function tutorialPageAdd() {
2727
return { type: types_1.TUTORIAL_PAGE_ADD };
2828
}
2929
exports.tutorialPageAdd = tutorialPageAdd;
30-
function tutorialTaskAdd(taskPosition) {
30+
function tutorialTaskAdd() {
3131
return function (dispatch, getState) {
3232
var pagePosition = getState().pagePosition;
33+
var taskPosition = getState().tutorial.pages[pagePosition].tasks.length || 0;
3334
dispatch({ type: types_1.TUTORIAL_TASK_ADD, payload: { pagePosition: pagePosition, taskPosition: taskPosition } });
3435
};
3536
}

‎src/components/Page/Tasks/index.tsx‎

Lines changed: 63 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react';
2-
import * as ReactDOM from 'react-dom';
2+
import {connect} from 'react-redux';
33
import {List} from 'material-ui/List';
44
import {Card, CardHeader, CardText} from 'material-ui/Card';
55
import {Tabs, Tab} from 'material-ui/Tabs';
@@ -11,6 +11,7 @@ import Tests from '../Tests';
1111
import TaskActions from '../TaskActions';
1212
import Hints from '../Hints';
1313
import AddButton from '../AddButton';
14+
import {tutorialTaskAdd} from '../../../actions';
1415

1516
const styles = {
1617
card: {
@@ -36,62 +37,71 @@ const styles = {
3637
},
3738
};
3839

39-
const Tasks: React.StatelessComponent<{
40-
tasks: CR.Task[], page: CR.Page, config: Tutorial.Config
41-
}> = ({tasks, page, config}) => (
42-
<div>
43-
{tasks.map((task: CR.Task, index: number) => (
44-
<Card
45-
style={styles.card}
46-
initiallyExpanded={index === 0}
47-
>
48-
<CardHeader
49-
actAsExpander={true}
50-
showExpandableButton={true}
51-
>
52-
<span style={styles.title}>Task {index + 1}</span>
53-
<Tests
54-
style={styles.test}
55-
tests={task.tests}
56-
config={config}
57-
/>
58-
</CardHeader>
59-
<CardText expandable={true} style={styles.cardContent}>
60-
<Tabs tabItemContainerStyle={styles.tabBar}>
40+
@connect(null, dispatch => {
41+
return {
42+
taskAdd: () => dispatch(tutorialTaskAdd())
43+
};
44+
})
45+
export default class Tasks extends React.Component<{
46+
tasks: CR.Task[], page: CR.Page, config: Tutorial.Config, taskAdd?: any
47+
}, {}> {
48+
render() {
49+
const {tasks, page, config, taskAdd} = this.props;
50+
return (
51+
<div>
52+
{tasks.map((task: CR.Task, index: number) => (
53+
<Card
54+
style={styles.card}
55+
initiallyExpanded={index === 0}
56+
>
57+
<CardHeader
58+
actAsExpander={true}
59+
showExpandableButton={true}
60+
>
61+
<span style={styles.title}>Task {index + 1}</span>
62+
<Tests
63+
style={styles.test}
64+
tests={task.tests}
65+
config={config}
66+
/>
67+
</CardHeader>
68+
<CardText expandable={true} style={styles.cardContent}>
69+
<Tabs tabItemContainerStyle={styles.tabBar}>
6170

62-
<Tab label='Description'>
63-
<Task
64-
key={index.toString()}
65-
index={index}
66-
task={task}
67-
/>
68-
</Tab>
71+
<Tab label='Description'>
72+
<Task
73+
key={index.toString()}
74+
index={index}
75+
task={task}
76+
/>
77+
</Tab>
6978

70-
<Tab label='Actions'>
71-
<TaskActions
72-
actions={task.actions}
73-
taskPosition={index}
74-
/>
75-
</Tab>
79+
<Tab label='Actions'>
80+
<TaskActions
81+
actions={task.actions}
82+
taskPosition={index}
83+
/>
84+
</Tab>
7685

77-
<Tab label='Hints'>
78-
<Hints
79-
hints={task.hints}
80-
taskPosition={index}
81-
/>
82-
</Tab>
86+
<Tab label='Hints'>
87+
<Hints
88+
hints={task.hints}
89+
taskPosition={index}
90+
/>
91+
</Tab>
8392

84-
</Tabs>
85-
</CardText>
86-
</Card>)
87-
)}
93+
</Tabs>
94+
</CardText>
95+
</Card>)
96+
)}
8897

89-
<AddButton />
98+
<AddButton callback={taskAdd}/>
9099

91-
<TasksComplete
92-
page={page}
93-
/>
100+
<TasksComplete
101+
page={page}
102+
/>
94103

95-
</div>
96-
);
97-
export default Tasks;
104+
</div>
105+
);
106+
}
107+
}

‎src/modules/tutorial/actions.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,10 @@ export function tutorialPageAdd() {
3030
return { type: TUTORIAL_PAGE_ADD };
3131
}
3232

33-
export function tutorialTaskAdd(taskPosition: number) {
33+
export function tutorialTaskAdd() {
3434
return (dispatch, getState) => {
3535
const {pagePosition} = getState();
36+
const taskPosition = getState().tutorial.pages[pagePosition].tasks.length || 0;
3637
dispatch({ type: TUTORIAL_TASK_ADD, payload: { pagePosition, taskPosition } });
3738
};
3839
}

0 commit comments

Comments
 (0)