Mirroring/coriolis
1
0
Fork 0
mirror of https://github.com/EDCD/coriolis.git synced 2025-12-11 16:53:02 +00:00
Code Issues Projects Releases Wiki Activity

Make various components stateless

Browse Source
This commit is contained in:
Cmdr McDonald
2017-03-20 13:52:24 +00:00
parent 2f5d123f02
commit 73a75c69a3
12 changed files with 286 additions and 326 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/app/components/Cargo.jsx
View File

@@ -9,7 +9,8 @@ import Slider from '../components/Slider';
*/
export default class Cargo extends TranslatedComponent {
static propTypes = {
ship: React.PropTypes.object.isRequired,
cargo: React.PropTypes.number.isRequired,
cargoCapacity: React.PropTypes.number.isRequired,
onChange: React.PropTypes.func.isRequired
};
@@ -21,35 +22,7 @@ export default class Cargo extends TranslatedComponent {
constructor(props, context) {
super(props);
const ship = this.props.ship;
this.state = {
cargoCapacity: ship.cargoCapacity,
cargoLevel: 0,
};
}
/**
* Update the state if our ship changes
* @param {Object} nextProps Incoming/Next properties
* @return {boolean} Returns true if the component should be rerendered
*/
componentWillReceiveProps(nextProps) {
const { cargoLevel, cargoCapacity } = this.state;
const nextCargoCapacity = nextProps.ship.cargoCapacity;
if (nextCargoCapacity != cargoCapacity) {
// We keep the absolute cargo amount the same if possible so recalculate the relative level
const nextCargoLevel = Math.min((cargoLevel * cargoCapacity) / nextCargoCapacity, 1);
this.setState({ cargoLevel: nextCargoLevel, cargoCapacity: nextCargoCapacity });
// Notify if appropriate
if (nextCargoLevel * nextCargoCapacity != cargoLevel * cargoCapacity) {
this.props.onChange(Math.round(nextCargoLevel * nextCargoCapacity));
}
}
return true;
this._cargoChange = this._cargoChange.bind(this);
}
/**
@@ -57,14 +30,12 @@ export default class Cargo extends TranslatedComponent {
* @param {number} cargoLevel percentage level from 0 to 1
*/
_cargoChange(cargoLevel) {
const { cargoCapacity } = this.state;
const { cargo, cargoCapacity } = this.props;
if (cargoCapacity > 0) {
// We round the cargo level to a suitable value given the capacity
cargoLevel = Math.round(cargoLevel * cargoCapacity) / cargoCapacity;
if (cargoLevel != this.state.cargoLevel) {
this.setState({ cargoLevel });
this.props.onChange(Math.round(cargoLevel * cargoCapacity));
// We round the cargo to whole number of tonnes
const newCargo = Math.round(cargoLevel * cargoCapacity);
if (newCargo != cargo) {
this.props.onChange(newCargo);
}
}
}
@@ -76,20 +47,20 @@ export default class Cargo extends TranslatedComponent {
render() {
const { language, onWindowResize, sizeRatio, tooltip, termtip } = this.context;
const { formats, translate, units } = language;
const { cargoLevel, cargoCapacity } = this.state;
const { cargo, cargoCapacity } = this.props;
return (
<span>
<h3>{translate('cargo carried')}: {formats.int(cargoLevel * cargoCapacity)}{units.T}</h3>
<h3>{translate('cargo carried')}: {formats.int(cargo)}{units.T}</h3>
<table style={{ width: '100%', lineHeight: '1em', backgroundColor: 'transparent' }}>
<tbody >
<tr>
<td>
<Slider
axis={true}
onChange={this._cargoChange.bind(this)}
onChange={this._cargoChange}
axisUnit={translate('T')}
percent={cargoLevel}
percent={cargo / cargoCapacity}
max={cargoCapacity}
scale={sizeRatio}
onResize={onWindowResize}