50 lines
1.7 KiB
JavaScript
50 lines
1.7 KiB
JavaScript
const preact = require('preact');
|
|
const { connect } = require('preact-redux');
|
|
|
|
const shapes = require('./shapes');
|
|
|
|
const addState = connect(({ resolution }) => ({ resolution }));
|
|
|
|
class GameConstructLife extends preact.Component {
|
|
shouldComponentUpdate(newProps) {
|
|
if (newProps.resolution && newProps.resolution !== this.props.resolution) {
|
|
const [type, variant] = newProps.resolution.event;
|
|
if (variant.construct === this.props.construct.id
|
|
&& (type === 'Damage' || type === 'Healing')) return true;
|
|
}
|
|
if (newProps.construct !== this.props.construct) return true;
|
|
return false;
|
|
}
|
|
|
|
render() {
|
|
const { construct, resolution } = this.props;
|
|
const lifeBars = (redLife, greenLife, blueLife) => {
|
|
return (
|
|
<div class="stats">
|
|
<div>
|
|
{shapes.RedLife()}
|
|
<div class="max" >{redLife} / {construct.red_life.max}</div>
|
|
</div>
|
|
<div>
|
|
{shapes.GreenLife()}
|
|
<div class="max" >{greenLife} / {construct.green_life.max}</div>
|
|
</div>
|
|
<div>
|
|
{shapes.BlueLife()}
|
|
<div class="max" >{blueLife} / {construct.blue_life.max}</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
if (resolution) {
|
|
const { red, blue, green } = resolution.event[1].display;
|
|
return lifeBars(red, green, blue);
|
|
}
|
|
|
|
return lifeBars(construct.red_life.value, construct.green_life.value, construct.blue_life.value);
|
|
}
|
|
}
|
|
|
|
module.exports = addState(GameConstructLife);
|