122 lines
2.9 KiB
JavaScript
122 lines
2.9 KiB
JavaScript
const { Component } = require('preact');
|
|
const preact = require('preact');
|
|
const { connect } = require('preact-redux');
|
|
|
|
const Hammer = require('hammerjs');
|
|
|
|
const Vbox = require('./vbox.component');
|
|
const InfoContainer = require('./info.container');
|
|
const InstanceConstructsContainer = require('./instance.constructs');
|
|
// const EquipmentContainer = require('./instance.equip');
|
|
const Faceoff = require('./faceoff');
|
|
|
|
const actions = require('../actions');
|
|
|
|
const addState = connect(
|
|
function receiveState(state) {
|
|
const { instance,
|
|
nav,
|
|
navInstance,
|
|
} = state;
|
|
return { instance,
|
|
nav,
|
|
navInstance,
|
|
};
|
|
},
|
|
|
|
function receiveDispatch(dispatch) {
|
|
function setInfo(c) {
|
|
return dispatch(actions.setInfo(c));
|
|
}
|
|
|
|
function setNavInstance(c) {
|
|
return dispatch(actions.setNavInstance(c));
|
|
}
|
|
|
|
|
|
function clearItems() {
|
|
dispatch(actions.setCombiner([]));
|
|
dispatch(actions.setReclaiming(false));
|
|
dispatch(actions.setItemEquip(null));
|
|
dispatch(actions.setItemUnequip([]));
|
|
dispatch(actions.setVboxHighlight([]));
|
|
dispatch(actions.setVboxSelected([]));
|
|
return true;
|
|
}
|
|
|
|
return {
|
|
setInfo,
|
|
clearItems,
|
|
setNavInstance,
|
|
};
|
|
}
|
|
);
|
|
|
|
class Instance extends Component {
|
|
render(args) {
|
|
const {
|
|
instance,
|
|
clearItems,
|
|
} = args;
|
|
|
|
if (!instance) return false;
|
|
|
|
if (instance.phase !== 'InProgress') {
|
|
return <Faceoff />;
|
|
}
|
|
|
|
function instanceClick(e) {
|
|
e.stopPropagation();
|
|
clearItems();
|
|
}
|
|
|
|
function onTouchMove(e) {
|
|
e.preventDefault();
|
|
}
|
|
|
|
return (
|
|
<main id="instance" class='instance' onClick={instanceClick}>
|
|
<Vbox />
|
|
<InfoContainer />
|
|
<InstanceConstructsContainer />
|
|
</main>
|
|
);
|
|
}
|
|
|
|
componentDidMount() {
|
|
if (!this.h) this.bindSwipes();
|
|
}
|
|
|
|
componentDidUpdate() {
|
|
if (!this.h) this.bindSwipes();
|
|
}
|
|
|
|
bindSwipes() {
|
|
const instance = document.getElementById('instance');
|
|
if (!instance) {
|
|
return setTimeout(this.bindSwipes, 50);
|
|
}
|
|
if (this.h) this.h.destroy();
|
|
this.h = new Hammer(instance);
|
|
this.h.on('swiperight', () => {
|
|
const {
|
|
navInstance,
|
|
setNavInstance,
|
|
} = this.props;
|
|
setNavInstance(navInstance === 0 ? 3 : navInstance - 1);
|
|
});
|
|
|
|
this.h.on('swipeleft', () => {
|
|
const {
|
|
navInstance,
|
|
setNavInstance,
|
|
} = this.props;
|
|
setNavInstance((navInstance + 1) % 4);
|
|
});
|
|
|
|
return true;
|
|
}
|
|
}
|
|
|
|
module.exports = addState(Instance);
|