more conversion

src/Corporation/ui/BuybackSharesPopup.tsx

@@ -0,0 +1,87 @@
+import React, { useState } from 'react';
+import { IPlayer } from "../../PersonObjects/IPlayer";
+import { removePopup } from "../../ui/React/createPopup";
+import { numeralWrapper } from "../../ui/numeralFormat";
+import { dialogBoxCreate } from "../../../utils/DialogBox";
+import { createElement } from "../../../utils/uiHelpers/createElement";
+
+interface IProps {
+    player: IPlayer,
+    popupId: string,
+    corp: any,
+}
+
+// Create a popup that lets the player buyback shares
+// This is created when the player clicks the "Buyback Shares" button in the overview panel
+export function BuybackSharesPopup(props: IProps): React.ReactElement {
+    const [shares, setShares] = useState<number | null>(null);
+
+    function changeShares(event: React.ChangeEvent<HTMLInputElement>): void {
+        if(event.target.value === "") setShares(null);
+        else setShares(Math.round(parseFloat(event.target.value)));
+    }
+
+    const currentStockPrice = props.corp.sharePrice;
+    const buybackPrice = currentStockPrice * 1.1;
+
+    function buy() {
+        if(shares === null) return;
+        const tempStockPrice = props.corp.sharePrice;
+        const buybackPrice = tempStockPrice * 1.1;
+        if (isNaN(shares) || shares <= 0) {
+            dialogBoxCreate("ERROR: Invalid value for number of shares");
+        } else if (shares > props.corp.issuedShares) {
+            dialogBoxCreate("ERROR: There are not this many oustanding shares to buy back");
+        } else if (shares * buybackPrice > props.player.money) {
+            dialogBoxCreate("ERROR: You do not have enough money to purchase this many shares (you need " +
+                            numeralWrapper.format(shares * buybackPrice, "$0.000a") + ")");
+        } else {
+            props.corp.numShares += shares;
+            if (isNaN(props.corp.issuedShares)) {
+                console.warn("Corporation issuedShares is NaN: " + props.corp.issuedShares);
+                console.warn("Converting to number now");
+                const res = parseInt(props.corp.issuedShares);
+                if (isNaN(res)) {
+                    props.corp.issuedShares = 0;
+                } else {
+                    props.corp.issuedShares = res;
+                }
+            }
+            props.corp.issuedShares -= shares;
+            props.player.loseMoney(shares * buybackPrice);
+            removePopup(props.popupId);
+            props.corp.rerender();
+        }
+    }
+
+    function CostIndicator(): React.ReactElement {
+        if(shares === null) return (<></>);
+        if (isNaN(shares) || shares <= 0) {
+            return (<>ERROR: Invalid value entered for number of shares to buyback</>);
+        } else if (shares > props.corp.issuedShares) {
+            return (<>There are not this many shares available to buy back. 
+            There are only {numeralWrapper.formatBigNumber(props.corp.issuedShares)} outstanding shares.</>);
+        } else {
+            return (<>Purchase {shares} shares for a total of {numeralWrapper.formatMoney(shares * buybackPrice)}</>);
+        }
+    }
+
+    function onKeyDown(event: React.KeyboardEvent<HTMLInputElement>) {
+        if (event.keyCode === 13) buy();
+    }
+
+    return (<>
+        <p>
+Enter the number of outstanding shares you would like to buy back.
+These shares must be bought at a 10% premium. However,
+repurchasing shares from the market tends to lead to an increase in stock price.<br /><br />
+To purchase these shares, you must use your own money (NOT your Corporation's funds).<br /><br />
+The current buyback price of your company's stock is {numeralWrapper.formatMoney(buybackPrice)}.
+Your company currently has {numeralWrapper.formatBigNumber(props.corp.issuedShares)} outstanding stock shares.
+        </p>
+        <CostIndicator />
+        <br />
+        <input autoFocus={true} className="text-input" type="number" placeholder="Shares to buyback" style={{margin: "5px"}} onChange={changeShares} onKeyDown={onKeyDown} />
+        <button onClick={buy} className="a-link-button" style={{display:"inline-block"}}>Buy shares</button>
+    </>);
+}

src/Corporation/ui/CorporationUIEventHandler.js

@@ -56,82 +56,6 @@ export class CorporationEventHandler {
         this.routing = routing;
     }
 
-    // Create a popup that lets the player buyback shares
-    // This is created when the player clicks the "Buyback Shares" button in the overview panel
-    createBuybackSharesPopup() {
-        const popupId = "cmpy-mgmt-buyback-shares-popup";
-        const currentStockPrice = this.corp.sharePrice;
-        const buybackPrice = currentStockPrice * 1.1;
-        const txt = createElement("p", {
-            innerHTML: "Enter the number of outstanding shares you would like to buy back. " +
-                       "These shares must be bought at a 10% premium. However, " +
-                       "repurchasing shares from the market tends to lead to an increase in stock price.<br><bR>" +
-                       "To purchase these shares, you must use your own money (NOT your Corporation's funds).<br><br>" +
-                       "The current buyback price of your company's stock is " +
-                       numeralWrapper.format(buybackPrice, "$0.000a") +
-                       ". Your company currently has " + numeralWrapper.formatBigNumber(this.corp.issuedShares) + " outstanding stock shares",
-        });
-        var costIndicator = createElement("p", {});
-        var input = createElement("input", {
-            type:"number", placeholder:"Shares to buyback", margin:"5px",
-            inputListener: ()=> {
-                var numShares = Math.round(input.value);
-                if (isNaN(numShares) || numShares <= 0) {
-                    costIndicator.innerText = "ERROR: Invalid value entered for number of shares to buyback"
-                } else if (numShares > this.corp.issuedShares) {
-                    costIndicator.innerText = "There are not this many shares available to buy back. " +
-                                              "There are only " + numeralWrapper.formatBigNumber(this.corp.issuedShares) +
-                                              " outstanding shares.";
-                } else {
-                    costIndicator.innerText = "Purchase " + numShares + " shares for a total of " +
-                                              numeralWrapper.format(numShares * buybackPrice, '$0.000a');
-                }
-            },
-        });
-        var confirmBtn = createElement("button", {
-            class:"a-link-button", innerText:"Buy shares", display:"inline-block",
-            clickListener: () => {
-                var shares = Math.round(input.value);
-                const tempStockPrice = this.corp.sharePrice;
-                const buybackPrice = tempStockPrice * 1.1;
-                if (isNaN(shares) || shares <= 0) {
-                    dialogBoxCreate("ERROR: Invalid value for number of shares");
-                } else if (shares > this.corp.issuedShares) {
-                    dialogBoxCreate("ERROR: There are not this many oustanding shares to buy back");
-                } else if (shares * buybackPrice > Player.money) {
-                    dialogBoxCreate("ERROR: You do not have enough money to purchase this many shares (you need " +
-                                    numeralWrapper.format(shares * buybackPrice, "$0.000a") + ")");
-                } else {
-                    this.corp.numShares += shares;
-                    if (isNaN(this.corp.issuedShares)) {
-                        console.warn("Corporation issuedShares is NaN: " + this.corp.issuedShares);
-                        console.warn("Converting to number now");
-                        const res = parseInt(this.corp.issuedShares);
-                        if (isNaN(res)) {
-                            this.corp.issuedShares = 0;
-                        } else {
-                            this.corp.issuedShares = res;
-                        }
-                    }
-                    this.corp.issuedShares -= shares;
-                    Player.loseMoney(shares * buybackPrice);
-                    removeElementById(popupId);
-                    this.rerender();
-                }
-                return false;
-
-            },
-        });
-        var cancelBtn = createPopupCloseButton(popupId, {
-            class: "std-button",
-            display: "inline-block",
-            innerText: "Cancel",
-        });
-
-        createPopup(popupId, [txt, costIndicator, input, confirmBtn, cancelBtn]);
-        input.focus();
-    }
-
     // Create a popup that lets the player discontinue a product
     createDiscontinueProductPopup(product, industry) {
         const popupId = "cmpy-mgmt-discontinue-product-popup";

src/Corporation/ui/Overview.tsx

@@ -4,6 +4,7 @@ import { LevelableUpgrade }             from "./LevelableUpgrade";
 import { UnlockUpgrade }                from "./UnlockUpgrade";
 import { BribeFactionPopup }            from "./BribeFactionPopup";
 import { SellSharesPopup }              from "./SellSharesPopup";
+import { BuybackSharesPopup }           from "./BuybackSharesPopup";
 
 import { CorporationConstants }         from "../data/Constants";
 import { CorporationUnlockUpgrades }    from "../data/CorporationUnlockUpgrades";
@@ -227,10 +228,19 @@ export function Overview(props: IProps): React.ReactElement {
             tooltip: sellSharesTooltip,
         });
 
+        function openBuybackSharesPopup() {
+            const popupId = "corp-buyback-shares-popup";
+            createPopup(popupId, BuybackSharesPopup, {
+                player: props.player,
+                popupId: popupId,
+                corp: props.corp,
+            });
+        }
+
         const buybackSharesBtn = createButton({
             class: "std-button",
             display: "inline-block",
-            onClick: props.eventHandler.createBuybackSharesPopup,
+            onClick: openBuybackSharesPopup,
             text: "Buyback shares",
             tooltip: "Buy back shares you that previously issued or sold at market price.",
         });