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 {
|
2021-09-05 01:09:30 +02:00
|
|
|
index: number;
|
|
|
|
p: IPlayer;
|
|
|
|
rerender: () => void;
|
|
|
|
sleeve: Sleeve;
|
2019-03-27 09:36:14 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
interface IState {
|
2021-09-05 01:09:30 +02:00
|
|
|
amt: number;
|
2019-03-27 09:36:14 +01:00
|
|
|
}
|
|
|
|
|
2021-09-09 05:47:34 +02:00
|
|
|
export class CovenantSleeveMemoryUpgrade extends React.Component<IProps, IState> {
|
2021-09-05 01:09:30 +02:00
|
|
|
constructor(props: IProps) {
|
|
|
|
super(props);
|
2019-03-27 09:36:14 +01:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
this.state = {
|
|
|
|
amt: 1,
|
|
|
|
};
|
2019-03-27 09:36:14 +01:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
this.changePurchaseAmount = this.changePurchaseAmount.bind(this);
|
|
|
|
this.purchaseMemory = this.purchaseMemory.bind(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
changePurchaseAmount(e: React.ChangeEvent<HTMLInputElement>): void {
|
|
|
|
let n: number = parseInt(e.target.value);
|
2019-03-27 09:36:14 +01:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
if (isNaN(n)) n = 1;
|
|
|
|
const maxMemory = 100 - this.props.sleeve.memory;
|
|
|
|
if (n > maxMemory) n = maxMemory;
|
2021-05-04 01:52:19 +02:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
this.setState({
|
|
|
|
amt: n,
|
|
|
|
});
|
|
|
|
}
|
2019-03-27 09:36:14 +01:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
getPurchaseCost(): number {
|
|
|
|
if (isNaN(this.state.amt)) {
|
|
|
|
return Infinity;
|
2019-03-27 09:36:14 +01:00
|
|
|
}
|
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
const maxMemory = 100 - this.props.sleeve.memory;
|
|
|
|
if (this.state.amt > maxMemory) {
|
|
|
|
return Infinity;
|
|
|
|
}
|
2019-03-27 09:36:14 +01:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
return this.props.sleeve.getMemoryUpgradeCost(this.state.amt);
|
|
|
|
}
|
2019-03-27 09:36:14 +01:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
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();
|
2019-03-27 09:36:14 +01:00
|
|
|
}
|
2021-09-05 01:09:30 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
render(): React.ReactNode {
|
|
|
|
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);
|
|
|
|
let purchaseBtnContent;
|
|
|
|
if (isNaN(this.state.amt)) {
|
|
|
|
purchaseBtnContent = <>Invalid value</>;
|
|
|
|
} else if (this.state.amt > maxMemory) {
|
2021-09-16 10:04:26 +02:00
|
|
|
purchaseBtnContent = <>Memory cannot exceed 100</>;
|
2021-09-05 01:09:30 +02:00
|
|
|
} else {
|
|
|
|
purchaseBtnContent = (
|
|
|
|
<>
|
2021-09-09 05:47:34 +02:00
|
|
|
Purchase {this.state.amt} memory - <Money money={cost} player={this.props.p} />?
|
2021-09-05 01:09:30 +02:00
|
|
|
</>
|
|
|
|
);
|
2019-03-27 09:36:14 +01:00
|
|
|
}
|
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<h2>
|
|
|
|
<u>Upgrade Memory</u>
|
|
|
|
</h2>
|
|
|
|
<p>
|
2021-09-09 05:47:34 +02:00
|
|
|
Purchase a memory upgrade for your sleeve. Note that a sleeve's max memory is 100 (current:{" "}
|
2021-09-05 01:09:30 +02:00
|
|
|
{numeralWrapper.formatSleeveMemory(this.props.sleeve.memory)})
|
|
|
|
</p>
|
|
|
|
|
2021-09-09 05:47:34 +02:00
|
|
|
<label htmlFor={inputId}>Amount of memory to purchase (must be an integer):</label>
|
2021-09-05 01:09:30 +02:00
|
|
|
<input
|
|
|
|
className="text-input"
|
|
|
|
id={inputId}
|
|
|
|
onChange={this.changePurchaseAmount}
|
|
|
|
type={"number"}
|
|
|
|
value={this.state.amt}
|
|
|
|
/>
|
|
|
|
<br />
|
2021-09-09 05:47:34 +02:00
|
|
|
<StdButton disabled={purchaseBtnDisabled} onClick={this.purchaseMemory} text={purchaseBtnContent} />
|
2021-09-05 01:09:30 +02:00
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
2019-03-27 09:36:14 +01:00
|
|
|
}
|