diff --git a/ChangeLog.md b/ChangeLog.md index c03a9d5b..08bceac1 100644 --- a/ChangeLog.md +++ b/ChangeLog.md @@ -9,6 +9,7 @@ * Reset old modification values when a new roll is applied * Ensure that boost value is set correctly when modifications to power distributor enable/disable boost * Ensure that hull reinforcement modifications take the inherent resistance in to account when calculating modification percentages + * Add tooltip for blueprints providing details of the features they alter #2.2.19 * Power management panel now displays modules in descending order of power usage by default diff --git a/src/app/components/ModificationsMenu.jsx b/src/app/components/ModificationsMenu.jsx index ee961d29..52840fdc 100644 --- a/src/app/components/ModificationsMenu.jsx +++ b/src/app/components/ModificationsMenu.jsx @@ -43,7 +43,7 @@ export default class ModificationsMenu extends TranslatedComponent { */ _initState(props, context) { let { m } = props; - const { language } = context; + const { language, tooltip, termtip } = context; const translate = language.translate; // Set up the blueprints @@ -52,7 +52,8 @@ export default class ModificationsMenu extends TranslatedComponent { for (const grade of Modifications.modules[m.grp].blueprints[blueprintName]) { const close = this._blueprintSelected.bind(this, Modifications.blueprints[blueprintName].id, grade); const key = blueprintName + ':' + grade; - blueprints.push(
{translate(Modifications.blueprints[blueprintName].name + ' grade ' + grade)}
); + const tooltipContent = this._blueprintTooltip(translate, Modifications.blueprints[blueprintName].grades[grade].features); + blueprints.push(
{translate(Modifications.blueprints[blueprintName].name + ' grade ' + grade)}
); } } @@ -76,6 +77,51 @@ export default class ModificationsMenu extends TranslatedComponent { return { blueprintMenuOpened, blueprints, modifications, specialMenuOpened, specials }; } + /** + * Generate a tooltip with details of a blueprint's effects + * @param {Object} features The features of the blueprint + * @returns {Object} The react components + */ + _blueprintTooltip(translate, features) + { + const results = []; + for (const feature in features) { + const featureIsBeneficial = this._isBeneficial(feature, features[feature]); + const featureDef = Modifications.modifications[feature]; + if (!featureDef.hidden) { + let symbol = ''; + if (feature === 'jitter') { + symbol = '°'; + } else if (featureDef.type === 'percentage') { + symbol = '%'; + } + let lowerBound = features[feature][0]; + let upperBound = features[feature][1]; + if (featureDef.type === 'percentage') { + lowerBound = Math.round(lowerBound * 1000) / 10; + upperBound = Math.round(upperBound * 1000) / 10; + } + const range = `${lowerBound}${symbol} - ${upperBound}${symbol}`; + results.push({translate(feature)}{lowerBound}{symbol}{upperBound}{symbol}); + } + } + + return ( + + + + + + + + + + {results} + +
{translate('effect')}{translate('worst')}{translate('best')}
+ ); + } + /** * Initialise the modifications * @param {Object} props React Component properties @@ -244,6 +290,19 @@ export default class ModificationsMenu extends TranslatedComponent { this.props.onChange(); } + /** + * Is this feature beneficial? + * + */ + _isBeneficial(feature, values) { + const fact = (values[0] < 0 || (values[0] === 0 && values[1] < 0)); + if (Modifications.modifications[feature].higherbetter) { + return !fact; + } else { + return fact; + } + } + /** * Reset modification information */ @@ -276,11 +335,11 @@ export default class ModificationsMenu extends TranslatedComponent { let blueprintLabel; let haveBlueprint = false; + let blueprintTooltip; if (m.blueprint && !isEmpty(m.blueprint)) { blueprintLabel = translate(m.blueprint.name) + ' ' + translate('grade') + ' ' + m.blueprint.grade; haveBlueprint = true; - } else { - blueprintLabel = translate('PHRASE_SELECT_BLUEPRINT'); + blueprintTooltip = this._blueprintTooltip(translate, m.blueprint.grades[m.blueprint.grade].features); } let specialLabel; @@ -291,7 +350,7 @@ export default class ModificationsMenu extends TranslatedComponent { } const showBlueprintsMenu = blueprintMenuOpened; - const showSpecial = haveBlueprint && this.state.specials.length > 0; + const showSpecial = haveBlueprint && this.state.specials.length > 0 && !blueprintMenuOpened; const showSpecialsMenu = specialMenuOpened; const showRolls = haveBlueprint && !blueprintMenuOpened && !specialMenuOpened; const showReset = !blueprintMenuOpened && !specialMenuOpened; @@ -303,7 +362,10 @@ export default class ModificationsMenu extends TranslatedComponent { onClick={(e) => e.stopPropagation() } onContextMenu={stopCtxPropagation} > -
{blueprintLabel}
+ { haveBlueprint ? +
{blueprintLabel}
+ : +
{translate('PHRASE_SELECT_BLUEPRINT')}
} { showBlueprintsMenu ? this.state.blueprints : null } { showSpecial ?
{specialLabel}
: null } { showSpecialsMenu ? this.state.specials : null }