Browse Source

fix pressure helper ui

dev
xmcp 6 years ago
parent
commit
2dc4ae419f
  1. 9
      src/PressureHelper.css
  2. 12
      src/PressureHelper.js

9
src/PressureHelper.css

@ -4,11 +4,10 @@
margin: auto;
z-index: 100;
pointer-events: none;
transition:
top 100ms linear,
bottom 100ms linear,
left 100ms linear,
right 100ms linear;
}
.pressure-box-empty {
visibility: hidden;
}
.pressure-box-fired {

12
src/PressureHelper.js

@ -70,7 +70,7 @@ export class PressureHelper extends Component {
if(this.esc_interval)
clearInterval(this.esc_interval);
this.setState({
level: THRESHOLD,
level: THRESHOLD/2,
},()=>{
this.esc_interval=setInterval(()=>{
let new_level=this.state.level+.1;
@ -80,7 +80,7 @@ export class PressureHelper extends Component {
this.setState({
level: new_level,
});
},50);
},30);
});
}
});
@ -99,9 +99,13 @@ export class PressureHelper extends Component {
}
render() {
const pad=this.state.level===0 ? -BORDER_WIDTH-500 : MULTIPLIER*(this.state.level-THRESHOLD)-BORDER_WIDTH;
const pad=MULTIPLIER*(this.state.level-THRESHOLD)-BORDER_WIDTH;
return (
<div className={'pressure-box '+(this.state.fired ? 'pressure-box-fired' : '')} style={{
<div className={
'pressure-box'
+(this.state.fired ? ' pressure-box-fired' : '')
+(this.state.level<=.0001 ? ' pressure-box-empty' : '')
} style={{
left: pad,
right: pad,
top: pad,

Loading…
Cancel
Save