Skip to content
This repository was archived by the owner on Apr 8, 2020. It is now read-only.

Commit 70bd389

Browse files
ShMcKShMcK
committed
style fixes, move tasksComplete into tasks component
1 parent 9755237 commit 70bd389

File tree

15 files changed

+149
-158
lines changed

15 files changed

+149
-158
lines changed

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

Lines changed: 0 additions & 24 deletions
This file was deleted.

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ var style = {
55
height: '10px'
66
};
77
exports.ProgressBar = function (_a) {
8-
var taskPosition = _a.taskPosition, taskCount = _a.taskCount, completed = _a.completed;
9-
var progress = (taskPosition / taskCount) * 100;
8+
var taskPosition = _a.taskPosition, taskLength = _a.taskLength, completed = _a.completed;
9+
var progress = (taskPosition / taskLength) * 100;
1010
if (completed) {
1111
return null;
1212
}

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,5 +27,6 @@ function getStatus(index, taskPosition, testRun) {
2727
exports.Task = function (_a) {
2828
var task = _a.task, taskPosition = _a.taskPosition, index = _a.index, testRun = _a.testRun;
2929
var backgroundColor = getStatus(index, taskPosition, testRun);
30-
return (React.createElement(List_1.ListItem, {key: index, style: Object.assign({}, styles, { backgroundColor: backgroundColor })}, taskCheckbox_1.taskCheckbox(testRun), React.createElement("span", {style: indexStyles}, index + 1, "."), React.createElement("div", {style: descriptionStyles}, React.createElement(index_1.Markdown, null, task.description))));
30+
var currentTask = taskPosition === index;
31+
return (React.createElement(List_1.ListItem, {key: index, style: Object.assign({}, styles, { backgroundColor: backgroundColor })}, taskCheckbox_1.taskCheckbox(currentTask, testRun), React.createElement("span", {style: indexStyles}, index + 1, "."), React.createElement("div", {style: descriptionStyles}, React.createElement(index_1.Markdown, null, task.description))));
3132
};

‎lib/components/Page/Task/taskCheckbox.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ var styles = {
66
position: 'absolute',
77
top: '15px'
88
};
9-
function taskCheckbox(testRun) {
10-
if (!testRun) {
9+
function taskCheckbox(currentTask, testRun) {
10+
if (!currentTask || !testRun) {
1111
return null;
1212
}
1313
return (React.createElement("span", {style: styles}, React.createElement(indeterminate_check_box_1.default, {color: colors_1.orange500})));

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

Lines changed: 24 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,35 @@
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+
};
27
var React = require('react');
8+
var ReactDOM = require('react-dom');
39
var List_1 = require('material-ui/List');
410
var Card_1 = require('material-ui/Card');
511
var Subheader_1 = require('material-ui/Subheader');
612
var Task_1 = require('../Task');
713
var colors_1 = require('material-ui/styles/colors');
14+
var TasksComplete_1 = require('../TasksComplete');
815
function visibleTasks(tasks, taskPosition) {
916
return tasks.slice(0, taskPosition + 1);
1017
}
1118
var margin = '10px 5px';
12-
exports.Tasks = function (_a) {
13-
var tasks = _a.tasks, taskPosition = _a.taskPosition, testRun = _a.testRun, completed = _a.completed;
14-
var visTasks = visibleTasks(tasks, taskPosition);
15-
var backgroundColor = completed ? colors_1.lightGreen200 : 'white';
16-
return (React.createElement(Card_1.Card, {style: { backgroundColor: backgroundColor, margin: margin }}, React.createElement(List_1.List, null, React.createElement(Subheader_1.default, null, "Tasks"), visTasks.map(function (task, index) { return (React.createElement(Task_1.Task, {key: index, index: index, task: task, taskPosition: taskPosition, testRun: testRun})); }))));
17-
};
19+
var Tasks = (function (_super) {
20+
__extends(Tasks, _super);
21+
function Tasks() {
22+
_super.apply(this, arguments);
23+
}
24+
Tasks.prototype.componentDidUpdate = function () {
25+
ReactDOM.findDOMNode(this.refs.listEnd).scrollIntoView();
26+
};
27+
Tasks.prototype.render = function () {
28+
var _a = this.props, tasks = _a.tasks, taskPosition = _a.taskPosition, testRun = _a.testRun, completed = _a.completed, page = _a.page;
29+
var visTasks = visibleTasks(tasks, taskPosition);
30+
var backgroundColor = completed ? colors_1.lightGreen200 : 'white';
31+
return (React.createElement("div", null, React.createElement(Card_1.Card, {style: { backgroundColor: backgroundColor, margin: margin }}, React.createElement(List_1.List, null, React.createElement(Subheader_1.default, null, "Tasks"), visTasks.map(function (task, index) { return (React.createElement(Task_1.Task, {key: index, index: index, task: task, taskPosition: taskPosition, testRun: testRun})); }))), React.createElement(TasksComplete_1.TasksComplete, {page: page}), React.createElement("div", {ref: 'listEnd'})));
32+
};
33+
return Tasks;
34+
}(React.Component));
35+
exports.Tasks = Tasks;

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

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
"use strict";
2+
var React = require('react');
3+
var Card_1 = require('material-ui/Card');
4+
var index_1 = require('../../index');
5+
var colors_1 = require('material-ui/styles/colors');
6+
var styles = {
7+
backgroundColor: colors_1.cyan500,
8+
margin: '10px 5px',
9+
};
10+
var textStyles = {
11+
color: colors_1.grey100,
12+
fontSize: '1.1em'
13+
};
14+
exports.TasksComplete = function (_a) {
15+
var page = _a.page;
16+
if (!page.completed || !page.onPageComplete) {
17+
return null;
18+
}
19+
return (React.createElement(Card_1.Card, {style: styles}, React.createElement(Card_1.CardText, null, React.createElement(index_1.Markdown, {style: textStyles}, page.onPageComplete))));
20+
};

‎lib/components/Page/index.js‎

Lines changed: 6 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,8 @@
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 __assign = (this && this.__assign) || Object.assign || function(t) {
8-
for (var s, i = 1, n = arguments.length; i < n; i++) {
9-
s = arguments[i];
10-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
11-
t[p] = s[p];
12-
}
13-
return t;
14-
};
152
var React = require('react');
16-
var ReactDOM = require('react-dom');
173
var PageContent_1 = require('./PageContent');
184
var Tasks_1 = require('./Tasks');
195
var Hints_1 = require('./Hints');
20-
var PageComplete_1 = require('./PageComplete');
216
var PageToolbar_1 = require('./PageToolbar');
227
var ProgressBar_1 = require('./ProgressBar');
238
var styles = {
@@ -26,20 +11,9 @@ var styles = {
2611
position: 'relative',
2712
overflowY: 'scroll',
2813
};
29-
var Page = (function (_super) {
30-
__extends(Page, _super);
31-
function Page() {
32-
_super.apply(this, arguments);
33-
}
34-
Page.prototype.componentDidUpdate = function () {
35-
ReactDOM.findDOMNode(this.refs.listEnd).scrollIntoView();
36-
};
37-
Page.prototype.render = function () {
38-
var _a = this.props, page = _a.page, taskPosition = _a.taskPosition, hintPosition = _a.hintPosition, tasks = _a.tasks, testRun = _a.testRun;
39-
var task = taskPosition <= tasks.length ? tasks[taskPosition] : null;
40-
var allComplete = taskPosition >= tasks.length;
41-
return (React.createElement("section", {style: styles}, React.createElement(PageContent_1.PageContent, __assign({}, this.props)), React.createElement(Tasks_1.Tasks, __assign({}, this.props, {completed: page.completed})), React.createElement("div", {ref: 'listEnd', style: { marginBottom: '110px' }}), React.createElement(PageToolbar_1.PageToolbar, __assign({}, this.props), React.createElement(PageComplete_1.PageComplete, __assign({}, this.props)), React.createElement(Hints_1.Hints, {task: task, hintPosition: hintPosition}), React.createElement(ProgressBar_1.ProgressBar, {taskPosition: taskPosition, taskCount: tasks.length, completed: page.completed}))));
42-
};
43-
return Page;
44-
}(React.Component));
45-
exports.Page = Page;
14+
exports.Page = function (_a) {
15+
var page = _a.page, taskPosition = _a.taskPosition, hintPosition = _a.hintPosition, tasks = _a.tasks, testRun = _a.testRun;
16+
var task = taskPosition <= tasks.length ? tasks[taskPosition] : null;
17+
var completed = page.completed;
18+
return (React.createElement("section", {style: styles}, React.createElement(PageContent_1.PageContent, {page: page}), React.createElement(Tasks_1.Tasks, {tasks: tasks, taskPosition: taskPosition, testRun: testRun, completed: completed, page: page}), React.createElement(PageToolbar_1.PageToolbar, {tasks: tasks, taskPosition: taskPosition}, React.createElement(Hints_1.Hints, {task: task, hintPosition: hintPosition}), React.createElement(ProgressBar_1.ProgressBar, {taskLength: tasks.length, taskPosition: taskPosition, completed: completed}))));
19+
};

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

Lines changed: 0 additions & 34 deletions
This file was deleted.

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ const style = {
66
};
77

88
export const ProgressBar: React.StatelessComponent<{
9-
taskPosition: number, taskCount: number, completed: boolean
10-
}> = ({taskPosition, taskCount, completed}) => {
11-
const progress: number = (taskPosition / taskCount) * 100;
9+
taskPosition: number, taskLength: number, completed: boolean
10+
}> = ({taskPosition, taskLength, completed}) => {
11+
const progress: number = (taskPosition / taskLength) * 100;
1212
if (completed) {
1313
return null;
1414
}

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,12 +34,13 @@ export const Task: React.StatelessComponent<{
3434
task: CR.Task, taskPosition: number, index: number, testRun: boolean
3535
}> = ({task, taskPosition, index, testRun}) => {
3636
const backgroundColor = getStatus(index, taskPosition, testRun);
37+
const currentTask = taskPosition === index;
3738
return (
3839
<ListItem
3940
key={index}
4041
style={Object.assign({}, styles, {backgroundColor})}
4142
>
42-
{taskCheckbox(testRun)}
43+
{taskCheckbox(currentTask, testRun)}
4344
<span style={indexStyles}>{index + 1}.</span>
4445
<div style={descriptionStyles}>
4546
<Markdown >{task.description}</Markdown>

0 commit comments

Comments
 (0)