Make modifications icon clickable

This commit is contained in:
Cmdr McDonald
2016-10-25 13:36:46 +01:00
parent adc5d1c039
commit 45337913ba
2 changed files with 10 additions and 3 deletions

View File

@@ -7,6 +7,7 @@ import AvailableModulesMenu from './AvailableModulesMenu';
import { ListModifications } from './SvgIcons'; import { ListModifications } from './SvgIcons';
import Slider from './Slider'; import Slider from './Slider';
import { Modifications } from 'coriolis-data/dist'; import { Modifications } from 'coriolis-data/dist';
import { stopCtxPropagation } from '../utils/UtilityFunctions';
/** /**
* Standard Slot * Standard Slot
@@ -29,6 +30,7 @@ export default class StandardSlot extends TranslatedComponent {
* @return {React.Component} Slot component * @return {React.Component} Slot component
*/ */
render() { render() {
let { termtip, tooltip } = this.context;
let { translate, formats, units } = this.context.language; let { translate, formats, units } = this.context.language;
let { modules, slot, warning, onSelect, ladenMass, ship } = this.props; let { modules, slot, warning, onSelect, ladenMass, ship } = this.props;
let m = slot.m; let m = slot.m;
@@ -49,7 +51,7 @@ export default class StandardSlot extends TranslatedComponent {
} }
return ( return (
<div className={cn('slot', { selected: this.props.selected })} onClick={this.props.onOpen}> <div className={cn('slot', { selected: this.props.selected })} onClick={this.props.onOpen} onContextMenu={stopCtxPropagation}>
<div className={cn('details-container', { warning: warning && warning(slot.m) })}> <div className={cn('details-container', { warning: warning && warning(slot.m) })}>
<div className={'sz'}>{slot.maxClass}</div> <div className={'sz'}>{slot.maxClass}</div>
<div> <div>
@@ -68,7 +70,7 @@ export default class StandardSlot extends TranslatedComponent {
{ m.weaponcapacity ? <div className='l'>{translate('WEP')}: {m.weaponcapacity}{units.MJ} / {m.weaponrecharge}{units.MW}</div> : null } { m.weaponcapacity ? <div className='l'>{translate('WEP')}: {m.weaponcapacity}{units.MJ} / {m.weaponrecharge}{units.MW}</div> : null }
{ m.systemcapacity ? <div className='l'>{translate('SYS')}: {m.systemcapacity}{units.MJ} / {m.systemrecharge}{units.MW}</div> : null } { m.systemcapacity ? <div className='l'>{translate('SYS')}: {m.systemcapacity}{units.MJ} / {m.systemrecharge}{units.MW}</div> : null }
{ m.enginecapacity ? <div className='l'>{translate('ENG')}: {m.enginecapacity}{units.MJ} / {m.enginerecharge}{units.MW}</div> : null } { m.enginecapacity ? <div className='l'>{translate('ENG')}: {m.enginecapacity}{units.MJ} / {m.enginerecharge}{units.MW}</div> : null }
{ validMods.length > 0 ? <div className='r' ><ListModifications /></div> : null } { validMods.length > 0 ? <div className='r' ><button onClick={this._showModificationsMenu.bind(this, m)} onContextMenu={stopCtxPropagation} onMouseOver={termtip.bind(null, 'modifications')} onMouseOut={tooltip.bind(null, null)}><ListModifications /></button></div> : null }
</div> </div>
</div> </div>
</div> </div>
@@ -78,6 +80,12 @@ export default class StandardSlot extends TranslatedComponent {
} }
// {validMods.length > 0 ? <div className='cb' ><Slider onChange={this._updateSliderValue.bind(this)} min={-1} max={1} percent={this._getSliderValue()}/></div> : null } // {validMods.length > 0 ? <div className='cb' ><Slider onChange={this._updateSliderValue.bind(this)} min={-1} max={1} percent={this._getSliderValue()}/></div> : null }
_showModificationsMenu(m, e) {
let validMods = m == null ? [] : (Modifications.validity[m.grp] || []);
// TODO set up the modifications
e.stopPropagation();
}
/** /**
* Update power usage modification given a slider value. * Update power usage modification given a slider value.
* Note that this is a temporary function until we have a slider section * Note that this is a temporary function until we have a slider section

View File

@@ -930,7 +930,6 @@ export default class Ship {
allMods.push(slotMods.join(';')); allMods.push(slotMods.join(';'));
} }
this.serialized.modifications = allMods.join(',').replace(/,+$/, ''); this.serialized.modifications = allMods.join(',').replace(/,+$/, '');
console.log('Final serialized string is ' + this.serialized.modifications);
return this; return this;
} }