fade invalid combo selections
This commit is contained in:
parent
024637c65d
commit
1b760a2893
@ -134,11 +134,14 @@
|
||||
width: 100%;
|
||||
|
||||
// text-transform: none;
|
||||
|
||||
&.empty {
|
||||
border-style: dashed;
|
||||
}
|
||||
|
||||
&.fade {
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
&.highlight {
|
||||
color: black;
|
||||
background: @white;
|
||||
|
||||
@ -44,7 +44,7 @@ function stashElement(props) {
|
||||
class={stashHighlight ? 'receiving' : 'empty'} > </button>;
|
||||
}
|
||||
|
||||
const comboHighlight = vboxHighlight && vboxHighlight.includes(v) ? 'combo-border' : '';
|
||||
const notValidCombo = vboxHighlight && !vboxHighlight.includes(v);
|
||||
|
||||
function onClick(type) {
|
||||
const combinerContainsIndex = stashSelect.indexOf(i) > -1;
|
||||
@ -56,7 +56,7 @@ function stashElement(props) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (!comboHighlight) {
|
||||
if (notValidCombo) {
|
||||
setInfo(vbox.bound[i]);
|
||||
return setVboxSelected({ storeSelect: [], stashSelect: [i] });
|
||||
}
|
||||
@ -68,7 +68,9 @@ function stashElement(props) {
|
||||
|
||||
const highlighted = stashSelect.indexOf(i) > -1;
|
||||
const border = buttons[removeTier(v)] ? buttons[removeTier(v)]() : '';
|
||||
const classes = `${highlighted ? 'highlight' : border} ${comboHighlight}`;
|
||||
const classes = highlighted
|
||||
? 'highlight'
|
||||
: `${border} ${notValidCombo ? 'fade' : ''}`;
|
||||
|
||||
const invObject = shapes[v] ? shapes[v]() : v;
|
||||
|
||||
|
||||
@ -7,7 +7,6 @@ const shapes = require('./shapes');
|
||||
function storeElement(props) {
|
||||
const {
|
||||
clearVboxSelected,
|
||||
setInfo,
|
||||
setVboxSelected,
|
||||
storeSelect,
|
||||
stashSelect,
|
||||
@ -20,11 +19,10 @@ function storeElement(props) {
|
||||
if (!v) return <button disabled class='empty' key={(group * 10) + index} > </button>;
|
||||
const selected = storeSelect.length && storeSelect.some(vs => vs[0] === group && vs[1] === index);
|
||||
|
||||
const comboHighlight = vboxHighlight && vboxHighlight.includes(v) ? 'combo-border' : '';
|
||||
const notValidCombo = vboxHighlight && !vboxHighlight.includes(v);
|
||||
|
||||
function onClick(e) {
|
||||
e.stopPropagation();
|
||||
if (!comboHighlight) setInfo(vbox.free[group][index]);
|
||||
if (storeSelect.length && storeSelect.some(vs => vs[0] === group && vs[1] === index)) {
|
||||
return setVboxSelected(
|
||||
{ storeSelect: storeSelect.filter(vs => !(vs[0] === group && vs[1] === index)), stashSelect }
|
||||
@ -34,14 +32,16 @@ function storeElement(props) {
|
||||
if (!storeSelect.length && !stashSelect.length) {
|
||||
return setVboxSelected({ storeSelect: [[group, index]], stashSelect });
|
||||
}
|
||||
if (comboHighlight !== 'combo-border') {
|
||||
if (notValidCombo) {
|
||||
return setVboxSelected({ storeSelect: [[group, index]], stashSelect: [] });
|
||||
}
|
||||
return setVboxSelected({ storeSelect: [...storeSelect, [group, index]], stashSelect });
|
||||
}
|
||||
|
||||
|
||||
const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''} ${comboHighlight}`;
|
||||
const classes = selected
|
||||
? `${v.toLowerCase()} highlight`
|
||||
: `${v.toLowerCase()} ${notValidCombo ? 'fade' : ''}`;
|
||||
|
||||
const vboxObject = shapes[v] ? shapes[v]() : v;
|
||||
const disabled = vbox.bits <= group;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user