/**
 * React Component for displaying a single WorkerScript's info as an
 * Accordion element
 */
import * as React from "react";

import { numeralWrapper } from "../numeralFormat";

import { Accordion } from "../React/Accordion";
import { AccordionButton } from "../React/AccordionButton";

import { killWorkerScript } from "../../Netscript/killWorkerScript";
import { WorkerScript } from "../../Netscript/WorkerScript";

import { dialogBoxCreate } from "../../../utils/DialogBox";
import { logBoxCreate } from "../../../utils/LogBox";
import { convertTimeMsToTimeElapsedString } from "../../../utils/StringHelperFunctions";
import { arrayToString } from "../../../utils/helpers/arrayToString";
import { Money } from "../React/Money";

type IProps = {
    workerScript: WorkerScript;
}

export function WorkerScriptAccordion(props: IProps): React.ReactElement {
    const workerScript = props.workerScript;
    const scriptRef = workerScript.scriptRef;

    const logClickHandler = logBoxCreate.bind(null, scriptRef);
    const killScript = killWorkerScript.bind(null, scriptRef as any, scriptRef.server);

    function killScriptClickHandler(): void {
        killScript();
        dialogBoxCreate("Killing script");
    }

    // Calculations for script stats
    const onlineMps = scriptRef.onlineMoneyMade / scriptRef.onlineRunningTime;
    const onlineEps = scriptRef.onlineExpGained / scriptRef.onlineRunningTime;
    const offlineMps = scriptRef.offlineMoneyMade / scriptRef.offlineRunningTime;
    const offlineEps = scriptRef.offlineExpGained / scriptRef.offlineRunningTime;

    return (
        <Accordion
            headerClass="active-scripts-script-header"
            headerContent={
                <>{props.workerScript.name}</>
            }
            panelClass="active-scripts-script-panel"
            panelContent={
                <>
                <pre>Threads: {numeralWrapper.formatThreads(props.workerScript.scriptRef.threads)}</pre>
                <pre>Args: {arrayToString(props.workerScript.args)}</pre>
                <pre>Online Time: {convertTimeMsToTimeElapsedString(scriptRef.onlineRunningTime * 1e3)}</pre>
                <pre>Offline Time: {convertTimeMsToTimeElapsedString(scriptRef.offlineRunningTime * 1e3)}</pre>
                <pre>Total online production: <Money money={scriptRef.onlineMoneyMade} /></pre>
                <pre>{(Array(26).join(" ") + numeralWrapper.formatExp(scriptRef.onlineExpGained) + " hacking exp")}</pre>
                <pre>Online production rate: <Money money={onlineMps} /> / second</pre>
                <pre>{(Array(25).join(" ") + numeralWrapper.formatExp(onlineEps) + " hacking exp / second")}</pre>
                <pre>Total offline production: <Money money={scriptRef.offlineMoneyMade} /></pre>
                <pre>{(Array(27).join(" ") + numeralWrapper.formatExp(scriptRef.offlineExpGained) + " hacking exp")}</pre>
                <pre>Offline production rate: <Money money={offlineMps} /> / second</pre>
                <pre>{(Array(26).join(" ") + numeralWrapper.formatExp(offlineEps) +  " hacking exp / second")}</pre>

                <AccordionButton
                    onClick={logClickHandler}
                    text="Log"
                />
                <AccordionButton
                    onClick={killScriptClickHandler}
                    text="Kill Script"
                />
                </>
            }
        />
    )
}