2019-03-27 09:36:14 +01:00
|
|
|
/**
|
|
|
|
* React component for a panel that lets you purchase upgrades for a Duplicate
|
|
|
|
* Sleeve's Memory (through The Covenant)
|
|
|
|
*/
|
|
|
|
import * as React from "react";
|
|
|
|
|
|
|
|
import { Sleeve } from "../Sleeve";
|
|
|
|
import { IPlayer } from "../../IPlayer";
|
|
|
|
|
|
|
|
import { numeralWrapper } from "../../../ui/numeralFormat";
|
|
|
|
import { StdButton } from "../../../ui/React/StdButton";
|
2021-03-31 06:45:21 +02:00
|
|
|
import { Money } from "../../../ui/React/Money";
|
2019-03-27 09:36:14 +01:00
|
|
|
|
|
|
|
interface IProps {
|
|
|
|
index: number;
|
|
|
|
p: IPlayer;
|
|
|
|
rerender: () => void;
|
|
|
|
sleeve: Sleeve;
|
|
|
|
}
|
|
|
|
|
|
|
|
interface IState {
|
|
|
|
amt: number;
|
|
|
|
}
|
|
|
|
|
|
|
|
export class CovenantSleeveMemoryUpgrade extends React.Component<IProps, IState> {
|
|
|
|
constructor(props: IProps) {
|
|
|
|
super(props);
|
|
|
|
|
|
|
|
this.state = {
|
|
|
|
amt: 1,
|
|
|
|
}
|
|
|
|
|
|
|
|
this.changePurchaseAmount = this.changePurchaseAmount.bind(this);
|
|
|
|
this.purchaseMemory = this.purchaseMemory.bind(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
changePurchaseAmount(e: React.ChangeEvent<HTMLInputElement>): void {
|
|
|
|
const n: number = parseInt(e.target.value);
|
|
|
|
|
|
|
|
this.setState({
|
|
|
|
amt: n,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
getPurchaseCost(): number {
|
|
|
|
if (isNaN(this.state.amt)) { return Infinity; }
|
|
|
|
|
|
|
|
const maxMemory = 100 - this.props.sleeve.memory;
|
|
|
|
if (this.state.amt > maxMemory) { return Infinity; }
|
|
|
|
|
|
|
|
return this.props.sleeve.getMemoryUpgradeCost(this.state.amt);
|
|
|
|
}
|
|
|
|
|
|
|
|
purchaseMemory(): void {
|
|
|
|
const cost = this.getPurchaseCost();
|
|
|
|
if (this.props.p.canAfford(cost)) {
|
|
|
|
this.props.sleeve.upgradeMemory(this.state.amt);
|
|
|
|
this.props.p.loseMoney(cost);
|
|
|
|
this.props.rerender();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-05-01 09:17:31 +02:00
|
|
|
render(): React.ReactNode {
|
2019-03-27 09:36:14 +01:00
|
|
|
const inputId = `sleeve-${this.props.index}-memory-upgrade-input`;
|
|
|
|
|
|
|
|
// Memory cannot go above 100
|
|
|
|
const maxMemory = 100 - this.props.sleeve.memory;
|
|
|
|
|
|
|
|
// Purchase button props
|
|
|
|
const cost = this.getPurchaseCost();
|
|
|
|
const purchaseBtnDisabled = !this.props.p.canAfford(cost);
|
2021-03-31 06:45:21 +02:00
|
|
|
let purchaseBtnContent;
|
2019-04-20 07:27:33 +02:00
|
|
|
if (isNaN(this.state.amt)) {
|
2021-03-31 06:45:21 +02:00
|
|
|
purchaseBtnContent = <>Invalid value</>;
|
2019-04-20 07:27:33 +02:00
|
|
|
} else if (this.state.amt > maxMemory) {
|
2021-03-31 06:45:21 +02:00
|
|
|
purchaseBtnContent = <>Memory cannot exceed 100?</>;
|
2019-03-27 09:36:14 +01:00
|
|
|
} else {
|
2021-03-31 06:45:21 +02:00
|
|
|
purchaseBtnContent = <>Purchase {this.state.amt} memory - {Money(cost)}?</>;
|
2019-03-27 09:36:14 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<h2><u>Upgrade Memory</u></h2>
|
|
|
|
<p>
|
|
|
|
Purchase a memory upgrade for your sleeve. Note that a sleeve's max memory
|
2021-05-01 09:17:31 +02:00
|
|
|
is 100 (current: {numeralWrapper.formatSleeveMemory(this.props.sleeve.memory)})
|
2019-03-27 09:36:14 +01:00
|
|
|
</p>
|
|
|
|
|
|
|
|
<label htmlFor={inputId}>
|
|
|
|
Amount of memory to purchase (must be an integer):
|
|
|
|
</label>
|
2019-04-20 07:27:33 +02:00
|
|
|
<input id={inputId} onChange={this.changePurchaseAmount} type={"number"} value={isNaN(this.state.amt) ? this.state.amt.toString() : this.state.amt} />
|
2019-03-27 09:36:14 +01:00
|
|
|
<br />
|
2021-03-31 06:45:21 +02:00
|
|
|
<StdButton disabled={purchaseBtnDisabled} onClick={this.purchaseMemory} text={purchaseBtnContent} />
|
2019-03-27 09:36:14 +01:00
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|