2019-04-01 11:23:25 +02:00
|
|
|
/**
|
|
|
|
* React Subcomponent for displaying a location's UI, when that location is a tech vendor
|
|
|
|
*
|
|
|
|
* This subcomponent renders all of the buttons for purchasing things from tech vendors
|
|
|
|
*/
|
|
|
|
import * as React from "react";
|
|
|
|
|
|
|
|
import { Location } from "../Location";
|
|
|
|
import { createPurchaseServerPopup,
|
|
|
|
createUpgradeHomeCoresPopup,
|
|
|
|
createUpgradeHomeRamPopup,
|
|
|
|
purchaseTorRouter } from "../LocationsHelpers";
|
|
|
|
|
|
|
|
import { CONSTANTS } from "../../Constants";
|
|
|
|
import { IPlayer } from "../../PersonObjects/IPlayer";
|
|
|
|
import { getPurchaseServerCost } from "../../Server/ServerPurchases";
|
|
|
|
|
|
|
|
import { numeralWrapper } from "../../ui/numeralFormat";
|
|
|
|
import { StdButtonPurchased } from "../../ui/React/StdButtonPurchased";
|
|
|
|
import { StdButton } from "../../ui/React/StdButton";
|
2021-03-31 06:45:21 +02:00
|
|
|
import { Money } from "../../ui/React/Money";
|
2019-04-01 11:23:25 +02:00
|
|
|
|
|
|
|
type IProps = {
|
|
|
|
loc: Location;
|
|
|
|
p: IPlayer;
|
|
|
|
}
|
|
|
|
|
|
|
|
export class TechVendorLocation extends React.Component<IProps, any> {
|
2019-04-04 02:08:11 +02:00
|
|
|
/**
|
|
|
|
* Stores button styling that sets them all to block display
|
|
|
|
*/
|
|
|
|
btnStyle: object;
|
|
|
|
|
2019-04-01 11:23:25 +02:00
|
|
|
constructor(props: IProps) {
|
|
|
|
super(props);
|
|
|
|
|
2019-04-04 02:08:11 +02:00
|
|
|
this.btnStyle = { display: "block" };
|
|
|
|
|
2019-04-01 11:23:25 +02:00
|
|
|
this.state = {
|
|
|
|
torPurchased: props.p.hasTorRouter(),
|
|
|
|
}
|
|
|
|
|
|
|
|
this.createUpgradeHomeCoresPopup = this.createUpgradeHomeCoresPopup.bind(this);
|
|
|
|
this.createUpgradeHomeRamPopup = this.createUpgradeHomeRamPopup.bind(this);
|
|
|
|
this.purchaseTorRouter = this.purchaseTorRouter.bind(this);
|
|
|
|
}
|
|
|
|
|
|
|
|
createUpgradeHomeCoresPopup() {
|
|
|
|
createUpgradeHomeCoresPopup(this.props.p);
|
|
|
|
}
|
|
|
|
|
|
|
|
createUpgradeHomeRamPopup() {
|
|
|
|
createUpgradeHomeRamPopup(this.props.p);
|
|
|
|
}
|
|
|
|
|
|
|
|
purchaseTorRouter() {
|
|
|
|
purchaseTorRouter(this.props.p);
|
2019-04-15 11:49:49 +02:00
|
|
|
this.setState({
|
|
|
|
torPurchased: this.props.p.hasTorRouter(),
|
|
|
|
});
|
2019-04-01 11:23:25 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
const loc: Location = this.props.loc;
|
|
|
|
|
|
|
|
const purchaseServerButtons: React.ReactNode[] = [];
|
|
|
|
for (let i = loc.techVendorMinRam; i <= loc.techVendorMaxRam; i *= 2) {
|
|
|
|
const cost = getPurchaseServerCost(i);
|
|
|
|
purchaseServerButtons.push(
|
|
|
|
<StdButton
|
|
|
|
key={i}
|
|
|
|
onClick={() => createPurchaseServerPopup(i, this.props.p)}
|
2019-04-04 02:08:11 +02:00
|
|
|
style={this.btnStyle}
|
2021-03-31 06:45:21 +02:00
|
|
|
text={<>Purchase {i}GB Server - {Money(cost)}</>}
|
2019-04-01 11:23:25 +02:00
|
|
|
/>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
{purchaseServerButtons}
|
|
|
|
{
|
|
|
|
this.state.torPurchased ? (
|
|
|
|
<StdButtonPurchased
|
2019-04-04 02:08:11 +02:00
|
|
|
style={this.btnStyle}
|
2019-04-01 11:23:25 +02:00
|
|
|
text={"TOR Router - Purchased"}
|
|
|
|
/>
|
|
|
|
) : (
|
|
|
|
<StdButton
|
|
|
|
onClick={this.purchaseTorRouter}
|
2019-04-04 02:08:11 +02:00
|
|
|
style={this.btnStyle}
|
2021-03-31 06:45:21 +02:00
|
|
|
text={<>Purchase TOR Router - {Money(CONSTANTS.TorRouterCost)}</>}
|
2019-04-01 11:23:25 +02:00
|
|
|
/>
|
|
|
|
)
|
|
|
|
|
|
|
|
}
|
|
|
|
<StdButton
|
|
|
|
onClick={this.createUpgradeHomeRamPopup}
|
2019-04-04 02:08:11 +02:00
|
|
|
style={this.btnStyle}
|
2019-04-01 11:23:25 +02:00
|
|
|
text={`Purchase additional RAM for Home computer`}
|
|
|
|
/>
|
|
|
|
<StdButton
|
|
|
|
onClick={this.createUpgradeHomeCoresPopup}
|
2019-04-04 02:08:11 +02:00
|
|
|
style={this.btnStyle}
|
2019-04-01 11:23:25 +02:00
|
|
|
text={`Purchase additional Core for Home computer`}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|