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

Commit418de65

Browse files
committed
refactor out progress-bar from toolbar
1 parent1e1190e commit418de65

File tree

7 files changed

+27
-32
lines changed

7 files changed

+27
-32
lines changed

‎lib/components/page/page.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ var pageStyle = {
2020
vardefault_1=(function(_super){
2121
__extends(default_1,_super);
2222
functiondefault_1(){
23-
_super.call(this);
23+
_super.apply(this,arguments);
2424
}
2525
default_1.prototype.componentDidUpdate=function(){
2626
ReactDOM.findDOMNode(this.refs.listEnd).scrollIntoView();
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
"use strict";
2+
varReact=require('react');
3+
varLinearProgress_1=require('material-ui/LinearProgress');
4+
exports.ProgressBar=function(_a){
5+
vartaskPosition=_a.taskPosition,taskCount=_a.taskCount;
6+
varprogress=(taskPosition/taskCount)*100;
7+
returnReact.createElement(LinearProgress_1.default,{mode:'determinate',value:progress,style:{height:'10px'}});
8+
};

‎lib/components/page/toolbar/toolbar.js

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -16,37 +16,28 @@ var __metadata = (this && this.__metadata) || function (k, v) {
1616
varReact=require('react');
1717
varreact_redux_1=require('react-redux');
1818
varactions_1=require('../../../actions/actions');
19-
varLinearProgress_1=require('material-ui/LinearProgress');
19+
varprogress_bar_1=require('./progress-bar');
2020
varToolbar_1=require('material-ui/Toolbar');
2121
varRaisedButton_1=require('material-ui/RaisedButton');
2222
varFlatButton_1=require('material-ui/FlatButton');
2323
vareditor_1=require('../../../atom/editor');
2424
varactions_2=require('../../../atom/actions');
2525
varcode_1=require('material-ui/svg-icons/action/code');
26-
varProgressBar=function(_a){
27-
varprogress=_a.progress;
28-
returnReact.createElement(LinearProgress_1.default,{mode:'determinate',value:progress,style:{height:'10px'}});
29-
};
30-
functiontaskProgress(current,max){
31-
return(current/max)*100;
32-
}
3326
vardefault_1=(function(_super){
3427
__extends(default_1,_super);
3528
functiondefault_1(){
3629
_super.apply(this,arguments);
3730
}
3831
default_1.prototype.render=function(){
3932
var_a=this.props,tasks=_a.tasks,taskPosition=_a.taskPosition,callNextPage=_a.callNextPage;
40-
varprogress=taskProgress(taskPosition,tasks.length);
41-
return(React.createElement("section",{className:'cr-page-toolbar'},React.createElement(ProgressBar,{progress:progress}),React.createElement(Toolbar_1.Toolbar,null,React.createElement(Toolbar_1.ToolbarGroup,{float:'left'},React.createElement(FlatButton_1.default,{icon:React.createElement(code_1.default,null),onTouchTap:actions_2.toggleDevTools})),React.createElement(Toolbar_1.ToolbarGroup,{float:'right'},taskPosition>=tasks.length ?
33+
return(React.createElement("section",{className:'cr-page-toolbar'},React.createElement(progress_bar_1.ProgressBar,{taskPosition:taskPosition,taskCount:tasks.length}),React.createElement(Toolbar_1.Toolbar,null,React.createElement(Toolbar_1.ToolbarGroup,{float:'left'},React.createElement(FlatButton_1.default,{icon:React.createElement(code_1.default,null),onTouchTap:actions_2.toggleDevTools})),React.createElement(Toolbar_1.ToolbarGroup,{float:'right'},taskPosition>=tasks.length ?
4234
React.createElement(RaisedButton_1.default,{label:'Continue',primary:true,onTouchTap:callNextPage}) :
4335
React.createElement(FlatButton_1.default,{label:'Save',secondary:true,onTouchTap:editor_1.save})))));
4436
};
4537
default_1=__decorate([
4638
react_redux_1.connect(null,function(dispatch,state){
4739
return{
48-
callNextPage:function(){returndispatch(actions_1.nextPage());},
49-
toggleLog:function(){returndispatch(actions_1.toggleLog());}
40+
callNextPage:function(){returndispatch(actions_1.nextPage());}
5041
};
5142
}),
5243
__metadata('design:paramtypes',[])

‎src/components/page/page.tsx

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,6 @@ refs: {
2323
[key:string]:(Element);
2424
listEnd:Element;
2525
};
26-
constructor(){
27-
super();
28-
}
2926
componentDidUpdate(){
3027
ReactDOM.findDOMNode<HTMLElement>(this.refs.listEnd).scrollIntoView();
3128
}
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import*asReactfrom'react';
2+
importLinearProgressfrom'material-ui/LinearProgress';
3+
4+
exportconstProgressBar:React.StatelessComponent<{
5+
taskPosition:number,taskCount:number
6+
}>=({taskPosition, taskCount})=>{
7+
constprogress:number=(taskPosition/taskCount)*100;
8+
return<LinearProgressmode='determinate'
9+
value={progress}style={{height:'10px'}}/>;
10+
};

‎src/components/page/toolbar/toolbar.tsx

Lines changed: 4 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
import*asReactfrom'react';
22
import{connect}from'react-redux';
3-
import{nextPage,toggleLog}from'../../../actions/actions';
4-
5-
importLinearProgressfrom'material-ui/LinearProgress';
3+
import{nextPage}from'../../../actions/actions';
4+
import{ProgressBar}from'./progress-bar';
65
import{Toolbar,ToolbarGroup}from'material-ui/Toolbar';
76
importRaisedButtonfrom'material-ui/RaisedButton';
87
importFlatButtonfrom'material-ui/FlatButton';
@@ -13,19 +12,9 @@ import {store} from '../../../store/store';
1312

1413
importCodefrom'material-ui/svg-icons/action/code';
1514

16-
constProgressBar:React.StatelessComponent<{
17-
progress:number
18-
}>=({progress})=><LinearProgressmode='determinate'
19-
value={progress}style={{height:'10px'}}/>;
20-
21-
functiontaskProgress(current:number,max:number){
22-
return(current/max)*100;
23-
}
24-
2515
@connect(null,(dispatch,state)=>{
2616
return{
27-
callNextPage:()=>dispatch(nextPage()),
28-
toggleLog:()=>dispatch(toggleLog())
17+
callNextPage:()=>dispatch(nextPage())
2918
};
3019
})
3120
exportdefaultclassextendsReact.Component<{
@@ -34,11 +23,10 @@ export default class extends React.Component<{
3423
},{}>{
3524
render(){
3625
const{tasks, taskPosition, callNextPage}=this.props;
37-
constprogress:number=taskProgress(taskPosition,tasks.length);
3826

3927
return(
4028
<sectionclassName='cr-page-toolbar'>
41-
<ProgressBarprogress={progress}/>
29+
<ProgressBartaskPosition={taskPosition}taskCount={tasks.length}/>
4230

4331
<Toolbar>
4432

‎tsconfig.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -110,6 +110,7 @@
110110
"src/components/page/hint/hint.tsx",
111111
"src/components/page/page.tsx",
112112
"src/components/page/task/task.tsx",
113+
"src/components/page/toolbar/progress-bar.tsx",
113114
"src/components/page/toolbar/toolbar.tsx",
114115
"src/components/progress/progress.tsx",
115116
"src/components/render.tsx",

0 commit comments

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