more conversion

src/Corporation/Corporation.jsx

@@ -1924,6 +1924,7 @@ Corporation.prototype.rerender = function() {
                         corp={this}
                         routing={corpRouting}
                         eventHandler={eventHandler}
+                        player={Player}
                     />, companyManagementDiv);
 }
 

src/Corporation/ui/BribeFactionPopup.tsx

@@ -0,0 +1,83 @@
+import React, { useState } from 'react';
+import { IPlayer } from "../../PersonObjects/IPlayer";
+import { Factions } from "../../Faction/Factions";
+import { CorporationConstants } from "../data/Constants";
+import { numeralWrapper } from "../../ui/numeralFormat";
+import { removePopup } from "../../ui/React/createPopup";
+import { dialogBoxCreate } from "../../../utils/DialogBox";
+
+interface IProps {
+    popupId: string;
+    corp: any;
+    player: IPlayer;
+}
+
+export function BribeFactionPopup(props: IProps): React.ReactElement {
+    const [money, setMoney] = useState<number | null>(0);
+    const [stock, setStock] = useState<number | null>(0);
+    const [selectedFaction, setSelectedFaction] = useState(props.player.factions.length > 0 ? props.player.factions[0] : "");
+
+    function onMoneyChange(event: React.ChangeEvent<HTMLInputElement>): void {
+        setMoney(parseFloat(event.target.value));
+    }
+
+    function onStockChange(event: React.ChangeEvent<HTMLInputElement>): void {
+        setStock(parseFloat(event.target.value));
+    }
+
+    function repGain(money: number, stock: number): number {
+        return (money + (stock * props.corp.sharePrice)) / CorporationConstants.BribeToRepRatio;
+    }
+
+    function getRepText(money: number, stock: number): string {
+        if(money === 0 && stock === 0) return "";
+        if (isNaN(money) || isNaN(stock) || money < 0 || stock < 0) {
+            return "ERROR: Invalid value(s) entered";
+        } else if (props.corp.funds.lt(money)) {
+            return "ERROR: You do not have this much money to bribe with";
+        } else if (props.corp.stock > props.corp.numShares) {
+            return "ERROR: You do not have this many shares to bribe with";
+        } else {
+            return "You will gain " + numeralWrapper.formatReputation(repGain(money, stock)) +
+                       " reputation with " +
+                       selectedFaction +
+                       " with this bribe";
+        }
+    }
+
+    function bribe(money: number, stock: number) {
+        const fac = Factions[selectedFaction];
+        if (fac == null) {
+            dialogBoxCreate("ERROR: You must select a faction to bribe");
+        }
+        if (isNaN(money) || isNaN(stock) || money < 0 || stock < 0) {
+        } else if (props.corp.funds.lt(money)) {
+        } else if (stock > props.corp.numShares) {
+        } else {
+            const rep = repGain(money, stock);
+            dialogBoxCreate("You gained " + numeralWrapper.formatReputation(rep) +
+                            " reputation with " + fac.name  + " by bribing them.");
+            fac.playerReputation += rep;
+            props.corp.funds = props.corp.funds.minus(money);
+            props.corp.numShares -= stock;
+            removePopup(props.popupId);
+        }
+    }
+
+    return (<>
+        <p>You can use Corporation funds or stock shares to bribe Faction Leaders in exchange for faction reputation.</p>
+        <select className="dropdown" style={{margin: "3px"}} defaultValue={selectedFaction}>
+            {
+                props.player.factions.map((name: string) => {
+                    const info = Factions[name].getInfo();
+                    if(!info.offersWork()) return;
+                    return <option key={name} value={name}>{name}</option>
+                })
+            }
+        </select>
+        <p>{getRepText(money ? money : 0, stock ? stock : 0)}</p>
+        <input className="text-input" onChange={onMoneyChange} placeholder="Corporation funds" style={{margin: "5px"}} />
+        <input className="text-input" onChange={onStockChange} placeholder="Stock Shares" style={{margin: "5px"}} />
+        <button className="a-link-button" onClick={() => bribe(money ? money : 0, stock ? stock : 0)} style={{display:"inline-block"}}>Bribe</button>
+    </>);
+}

src/Corporation/ui/CorporationUIEventHandler.js

@@ -56,114 +56,6 @@ export class CorporationEventHandler {
         this.routing = routing;
     }
 
-    // Create a popup that lets the player bribe factions
-    // This is created when the player clicks the "Bribe Factions" button in the overview panel
-    createBribeFactionsPopup() {
-        const popupId = "cmpy-mgmt-bribe-factions-popup";
-        const txt = createElement("p", {
-            innerText:"You can use Corporation funds or stock shares to bribe Faction Leaders in exchange for faction reputation",
-        });
-        const factionSelector = createElement("select", { class: "dropdown", margin:"3px" });
-        for (let i = 0; i < Player.factions.length; ++i) {
-            const facName = Player.factions[i];
-
-            const faction = Factions[facName];
-            const info = faction.getInfo();
-            if(!info.offersWork()) continue;
-
-            factionSelector.add(createElement("option", {
-                text: facName, value: facName,
-            }));
-        }
-        var repGainText = createElement("p");
-        var stockSharesInput;
-        var moneyInput = createElement("input", {
-            class: "text-input",
-            type:"number", placeholder:"Corporation funds", margin:"5px",
-            inputListener:()=>{
-                var money = moneyInput.value == null || moneyInput.value == "" ? 0 : parseFloat(moneyInput.value);
-                var stockPrice = this.corp.sharePrice;
-                var stockShares = stockSharesInput.value == null || stockSharesInput.value == "" ? 0 : Math.round(parseFloat(stockSharesInput.value));
-                if (isNaN(money) || isNaN(stockShares) || money < 0 || stockShares < 0) {
-                    repGainText.innerText = "ERROR: Invalid value(s) entered";
-                } else if (this.corp.funds.lt(money)) {
-                    repGainText.innerText = "ERROR: You do not have this much money to bribe with";
-                } else if (this.corp.stockShares > this.corp.numShares) {
-                    repGainText.innerText = "ERROR: You do not have this many shares to bribe with";
-                } else {
-
-                    var totalAmount = Number(money) + (stockShares * stockPrice);
-                    var repGain = totalAmount / BribeToRepRatio;
-                    repGainText.innerText = "You will gain " + numeralWrapper.format(repGain, "0,0") +
-                                            " reputation with " +
-                                            factionSelector.options[factionSelector.selectedIndex].value +
-                                            " with this bribe";
-                }
-            },
-        });
-        stockSharesInput = createElement("input", {
-            class: "text-input",
-            type:"number", placeholder:"Stock Shares", margin: "5px",
-            inputListener:()=>{
-                var money = moneyInput.value == null || moneyInput.value == "" ? 0 : parseFloat(moneyInput.value);
-                var stockPrice = this.corp.sharePrice;
-                var stockShares = stockSharesInput.value == null || stockSharesInput.value == "" ? 0 : Math.round(stockSharesInput.value);
-                if (isNaN(money) || isNaN(stockShares) || money < 0 || stockShares < 0) {
-                    repGainText.innerText = "ERROR: Invalid value(s) entered";
-                } else if (this.corp.funds.lt(money)) {
-                    repGainText.innerText = "ERROR: You do not have this much money to bribe with";
-                } else if (this.corp.stockShares > this.corp.numShares) {
-                    repGainText.innerText = "ERROR: You do not have this many shares to bribe with";
-                } else {
-                    var totalAmount = money + (stockShares * stockPrice);
-                    var repGain = totalAmount / BribeToRepRatio;
-                    repGainText.innerText = "You will gain " + numeralWrapper.format(repGain, "0,0") +
-                                            " reputation with " +
-                                            factionSelector.options[factionSelector.selectedIndex].value +
-                                            " with this bribe";
-                }
-            },
-        });
-        var confirmButton = createElement("button", {
-            class:"a-link-button", innerText:"Bribe", display:"inline-block",
-            clickListener:()=>{
-                var money = moneyInput.value == null || moneyInput.value == "" ? 0 : parseFloat(moneyInput.value);
-                var stockPrice = this.corp.sharePrice;
-                var stockShares = stockSharesInput.value == null || stockSharesInput.value == ""? 0 : Math.round(parseFloat(stockSharesInput.value));
-                var fac = Factions[factionSelector.options[factionSelector.selectedIndex].value];
-                if (fac == null) {
-                    dialogBoxCreate("ERROR: You must select a faction to bribe");
-                    return false;
-                }
-                if (isNaN(money) || isNaN(stockShares) || money < 0 || stockShares < 0) {
-                    dialogBoxCreate("ERROR: Invalid value(s) entered");
-                } else if (this.corp.funds.lt(money)) {
-                    dialogBoxCreate("ERROR: You do not have this much money to bribe with");
-                } else if (stockShares > this.corp.numShares) {
-                    dialogBoxCreate("ERROR: You do not have this many shares to bribe with");
-                } else {
-                    var totalAmount = money + (stockShares * stockPrice);
-                    var repGain = totalAmount / BribeToRepRatio;
-                    dialogBoxCreate("You gained " + numeralWrapper.format(repGain, "0,0") +
-                                    " reputation with " + fac.name  + " by bribing them.");
-                    fac.playerReputation += repGain;
-                    this.corp.funds = this.corp.funds.minus(money);
-                    this.corp.numShares -= stockShares;
-                    removeElementById(popupId);
-                    return false;
-                }
-            },
-        });
-        const cancelButton = createPopupCloseButton(popupId, {
-            class: "std-button",
-            display: "inline-block",
-            innerText: "Cancel",
-        })
-
-        createPopup(popupId, [txt, factionSelector, repGainText,
-                              moneyInput, stockSharesInput, confirmButton, cancelButton]);
-    }
-
     // 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() {

src/Corporation/ui/HeaderTabs.tsx

@@ -38,7 +38,7 @@ export function HeaderTabs(props: IProps): React.ReactElement {
             }
             <HeaderTab
                 current={false}
-                onClick={props.eventHandler.createNewIndustryPopup}
+                onClick={() => props.eventHandler.createNewIndustryPopup()}
                 text={"Expand into new Industry"}
             />
         </div>

src/Corporation/ui/MainPanel.tsx

@@ -10,11 +10,13 @@ import { Overview } from "./Overview";
 import { OfficeSpace } from "../OfficeSpace";
 
 import { CityName } from "../../Locations/data/CityNames";
+import { IPlayer } from "../../PersonObjects/IPlayer";
 
 interface IProps {
     corp: any;
     eventHandler: any;
     routing: any;
+    player: IPlayer;
 }
 
 export function MainPanel(props: IProps): React.ReactElement {

src/Corporation/ui/Overview.tsx

@@ -2,6 +2,7 @@
 import React from "react";
 import { LevelableUpgrade }             from "./LevelableUpgrade";
 import { UnlockUpgrade }                from "./UnlockUpgrade";
+import { BribeFactionPopup }            from "./BribeFactionPopup";
 
 import { CorporationConstants }         from "../data/Constants";
 import { CorporationUnlockUpgrades }    from "../data/CorporationUnlockUpgrades";
@@ -10,10 +11,13 @@ import { CorporationUpgrades }          from "../data/CorporationUpgrades";
 import { CONSTANTS } from "../../Constants";
 import { numeralWrapper } from "../../ui/numeralFormat";
 import { convertTimeMsToTimeElapsedString } from "../../../utils/StringHelperFunctions";
+import { createPopup } from "../../ui/React/createPopup";
+import { IPlayer } from "../../PersonObjects/IPlayer";
 
 interface IProps {
     corp: any;
     eventHandler: any;
+    player: IPlayer;
 }
 
 export function Overview(props: IProps): React.ReactElement {
@@ -118,14 +122,23 @@ export function Overview(props: IProps): React.ReactElement {
                      "provides some tips/pointers for helping you get started with managing it.",
         });
 
+        function openBribeFactionPopup() {
+            const popupId = "corp-bribe-popup";
+            createPopup(popupId, BribeFactionPopup, {
+                player: props.player,
+                popupId: popupId,
+                corp: props.corp,
+            });
+        }
+
         // Create a "Bribe Factions" button if your Corporation is powerful enough.
         // This occurs regardless of whether you're public or private
-        const canBribe = (props.corp.determineValuation() >= CorporationConstants.BribeThreshold);
+        const canBribe = (props.corp.determineValuation() >= CorporationConstants.BribeThreshold) || true;
         const bribeFactionsClass = (canBribe ? "a-link-button" : "a-link-button-inactive");
         const bribeFactionsBtn = createButton({
             class: bribeFactionsClass,
             display: "inline-block",
-            onClick: props.eventHandler.createBribeFactionsPopup,
+            onClick: openBribeFactionPopup,
             text: "Bribe Factions",
             tooltip: (canBribe
                         ? "Use your Corporations power and influence to bribe Faction leaders in exchange for reputation"

src/Corporation/ui/Root.tsx

@@ -3,18 +3,20 @@ import React from "react";
 
 import { HeaderTabs } from "./HeaderTabs";
 import { MainPanel } from "./MainPanel";
+import { IPlayer } from "../../PersonObjects/IPlayer";
 
 interface IProps {
     corp: any;
     eventHandler: any;
     routing: any;
+    player: IPlayer;
 }
 
 export function CorporationRoot(props: IProps): React.ReactElement {
     return (
         <div>
             <HeaderTabs corp={props.corp} eventHandler={props.eventHandler} routing={props.routing} />
-            <MainPanel corp={props.corp} eventHandler={props.eventHandler} routing={props.routing} />
+            <MainPanel corp={props.corp} eventHandler={props.eventHandler} routing={props.routing} player={props.player} />
         </div>
     )
 }