Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit70bd389

Browse files
committed
style fixes, move tasksComplete into tasks component
1 parent9755237 commit70bd389

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-
vartaskPosition=_a.taskPosition,taskCount=_a.taskCount,completed=_a.completed;
9-
varprogress=(taskPosition/taskCount)*100;
8+
vartaskPosition=_a.taskPosition,taskLength=_a.taskLength,completed=_a.completed;
9+
varprogress=(taskPosition/taskLength)*100;
1010
if(completed){
1111
returnnull;
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
vartask=_a.task,taskPosition=_a.taskPosition,index=_a.index,testRun=_a.testRun;
2929
varbackgroundColor=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+
varcurrentTask=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-
functiontaskCheckbox(testRun){
10-
if(!testRun){
9+
functiontaskCheckbox(currentTask,testRun){
10+
if(!currentTask||!testRun){
1111
returnnull;
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(varpinb)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
varReact=require('react');
8+
varReactDOM=require('react-dom');
39
varList_1=require('material-ui/List');
410
varCard_1=require('material-ui/Card');
511
varSubheader_1=require('material-ui/Subheader');
612
varTask_1=require('../Task');
713
varcolors_1=require('material-ui/styles/colors');
14+
varTasksComplete_1=require('../TasksComplete');
815
functionvisibleTasks(tasks,taskPosition){
916
returntasks.slice(0,taskPosition+1);
1017
}
1118
varmargin='10px 5px';
12-
exports.Tasks=function(_a){
13-
vartasks=_a.tasks,taskPosition=_a.taskPosition,testRun=_a.testRun,completed=_a.completed;
14-
varvisTasks=visibleTasks(tasks,taskPosition);
15-
varbackgroundColor=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+
varTasks=(function(_super){
20+
__extends(Tasks,_super);
21+
functionTasks(){
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+
varvisTasks=visibleTasks(tasks,taskPosition);
30+
varbackgroundColor=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+
returnTasks;
34+
}(React.Component));
35+
exports.Tasks=Tasks;
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
"use strict";
2+
varReact=require('react');
3+
varCard_1=require('material-ui/Card');
4+
varindex_1=require('../../index');
5+
varcolors_1=require('material-ui/styles/colors');
6+
varstyles={
7+
backgroundColor:colors_1.cyan500,
8+
margin:'10px 5px',
9+
};
10+
vartextStyles={
11+
color:colors_1.grey100,
12+
fontSize:'1.1em'
13+
};
14+
exports.TasksComplete=function(_a){
15+
varpage=_a.page;
16+
if(!page.completed||!page.onPageComplete){
17+
returnnull;
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(varpinb)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(vars,i=1,n=arguments.length;i<n;i++){
9-
s=arguments[i];
10-
for(varpins)if(Object.prototype.hasOwnProperty.call(s,p))
11-
t[p]=s[p];
12-
}
13-
returnt;
14-
};
152
varReact=require('react');
16-
varReactDOM=require('react-dom');
173
varPageContent_1=require('./PageContent');
184
varTasks_1=require('./Tasks');
195
varHints_1=require('./Hints');
20-
varPageComplete_1=require('./PageComplete');
216
varPageToolbar_1=require('./PageToolbar');
227
varProgressBar_1=require('./ProgressBar');
238
varstyles={
@@ -26,20 +11,9 @@ var styles = {
2611
position:'relative',
2712
overflowY:'scroll',
2813
};
29-
varPage=(function(_super){
30-
__extends(Page,_super);
31-
functionPage(){
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-
vartask=taskPosition<=tasks.length ?tasks[taskPosition] :null;
40-
varallComplete=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-
returnPage;
44-
}(React.Component));
45-
exports.Page=Page;
14+
exports.Page=function(_a){
15+
varpage=_a.page,taskPosition=_a.taskPosition,hintPosition=_a.hintPosition,tasks=_a.tasks,testRun=_a.testRun;
16+
vartask=taskPosition<=tasks.length ?tasks[taskPosition] :null;
17+
varcompleted=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
exportconstProgressBar:React.StatelessComponent<{
9-
taskPosition:number,taskCount:number,completed:boolean
10-
}>=({taskPosition,taskCount, completed})=>{
11-
constprogress:number=(taskPosition/taskCount)*100;
9+
taskPosition:number,taskLength:number,completed:boolean
10+
}>=({taskPosition,taskLength, completed})=>{
11+
constprogress:number=(taskPosition/taskLength)*100;
1212
if(completed){
1313
returnnull;
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
constbackgroundColor=getStatus(index,taskPosition,testRun);
37+
constcurrentTask=taskPosition===index;
3738
return(
3839
<ListItem
3940
key={index}
4041
style={Object.assign({},styles,{backgroundColor})}
4142
>
42-
{taskCheckbox(testRun)}
43+
{taskCheckbox(currentTask,testRun)}
4344
<spanstyle={indexStyles}>{index+1}.</span>
4445
<divstyle={descriptionStyles}>
4546
<Markdown>{task.description}</Markdown>

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@ const styles = {
99
top:'15px'
1010
};
1111

12-
exportfunctiontaskCheckbox(testRun){
13-
if(!testRun){returnnull;}
12+
exportfunctiontaskCheckbox(currentTask:number,testRun:boolean){
13+
if(!currentTask||!testRun){returnnull;}
1414
return(
1515
<spanstyle={styles}>
1616
<IndeterminateCheckBoxcolor={orange500}/>

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

Lines changed: 41 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,54 @@
11
import*asReactfrom'react';
2+
import*asReactDOMfrom'react-dom';
23
import{List}from'material-ui/List';
34
import{Card}from'material-ui/Card';
45
importSubheaderfrom'material-ui/Subheader';
56
import{Task}from'../Task';
67
import{lightGreen200}from'material-ui/styles/colors';
8+
import{TasksComplete}from'../TasksComplete';
79

810
functionvisibleTasks(tasks:CR.Task[],taskPosition:number):CR.Task[]{
911
returntasks.slice(0,taskPosition+1);
1012
}
1113

1214
constmargin='10px 5px';
1315

14-
exportconstTasks:React.StatelessComponent<{
15-
tasks:CR.Task[],taskPosition:number,
16-
testRun:boolean,completed:boolean
17-
}>=({tasks, taskPosition, testRun, completed})=>{
18-
constvisTasks=visibleTasks(tasks,taskPosition);
19-
constbackgroundColor=completed ?lightGreen200 :'white';
20-
return(
21-
<Card
22-
style={{backgroundColor, margin}}>
23-
<List>
24-
<Subheader>Tasks</Subheader>
25-
{visTasks.map((task:CR.Task,index:number)=>(
26-
<Task
27-
key={index}
28-
index={index}
29-
task={task}
30-
taskPosition={taskPosition}
31-
testRun={testRun}
32-
/>)
33-
)}
34-
</List>
35-
</Card>
36-
);
37-
};
16+
exportclassTasksextendsReact.Component<{
17+
tasks:CR.Task[],taskPosition:number,
18+
testRun:boolean,completed:boolean,page:CR.Page
19+
},{}>{
20+
refs:{
21+
[key:string]:(Element);
22+
listEnd:Element;
23+
};
24+
componentDidUpdate(){
25+
ReactDOM.findDOMNode<HTMLElement>(this.refs.listEnd).scrollIntoView();
26+
}
27+
render(){
28+
const{tasks, taskPosition, testRun, completed, page}=this.props;
29+
constvisTasks=visibleTasks(tasks,taskPosition);
30+
constbackgroundColor=completed ?lightGreen200 :'white';
31+
return(
32+
<div>
33+
<Cardstyle={{backgroundColor, margin}}>
34+
<List>
35+
<Subheader>Tasks</Subheader>
36+
{visTasks.map((task:CR.Task,index:number)=>(
37+
<Task
38+
key={index}
39+
index={index}
40+
task={task}
41+
taskPosition={taskPosition}
42+
testRun={testRun}
43+
/>)
44+
)}
45+
</List>
46+
</Card>
47+
48+
<TasksCompletepage={page}/>
49+
50+
<divref='listEnd'/>
51+
</div>
52+
);
53+
}
54+
}
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import*asReactfrom'react';
2+
import{Card,CardText}from'material-ui/Card';
3+
import{Markdown}from'../../index';
4+
import{cyan500,grey100}from'material-ui/styles/colors';
5+
6+
conststyles={
7+
backgroundColor:cyan500,
8+
margin:'10px 5px',
9+
};
10+
11+
consttextStyles={
12+
color:grey100,
13+
fontSize:'1.1em'
14+
};
15+
16+
exportconstTasksComplete:React.StatelessComponent<{
17+
page:CR.Page
18+
}>=({page})=>{
19+
if(!page.completed||!page.onPageComplete){returnnull;}
20+
return(
21+
<Cardstyle={styles}>
22+
<CardText>
23+
<Markdownstyle={textStyles}>{page.onPageComplete}</Markdown>
24+
</CardText>
25+
</Card>
26+
);
27+
};

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp