Split out render methods into 'views' leaving UI logic in 'controllers'. Hopefully should make it easier to skin / customise.
This commit is contained in:
parent
c8f0bac128
commit
2abea931ca
36 changed files with 303 additions and 184 deletions
18
src/views/molecules/ProgressBar.js
Normal file
18
src/views/molecules/ProgressBar.js
Normal file
|
@ -0,0 +1,18 @@
|
|||
var React = require('react');
|
||||
|
||||
var ProgressBarController = require("./../molecules/ProgressBar");
|
||||
|
||||
module.exports = React.createClass({
|
||||
mixins: [ProgressBarController],
|
||||
|
||||
render: function() {
|
||||
// Would use an HTML5 progress tag but if that doesn't animate if you
|
||||
// use the HTML attributes rather than styles
|
||||
var progressStyle = {
|
||||
width: ((this.props.value / this.props.max) * 100)+"%"
|
||||
};
|
||||
return (
|
||||
<div className="mx_ProgressBar"><div className="mx_ProgressBar_fill" style={progressStyle}></div></div>
|
||||
);
|
||||
}
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue