/**
 * React Subcomponent for displaying a location's UI, when that location has special
 * actions/options/properties
 *
 * Examples:
 *      - Bladeburner @ NSA
 *      - Re-sleeving @ VitaLife
 *      - Create Corporation @ City Hall
 *
 * This subcomponent creates all of the buttons for interacting with those special
 * properties
 */
import * as React from "react";

import { Location }                     from "../Location";
import { createStartCorporationPopup }  from "../LocationsHelpers";
import { LocationName }                 from "../data/LocationNames";

import { IEngine }                      from "../../IEngine";
import { IPlayer }                      from "../../PersonObjects/IPlayer";

import { AutoupdatingStdButton }        from "../../ui/React/AutoupdatingStdButton";
import { StdButton }                    from "../../ui/React/StdButton";

import { dialogBoxCreate }              from "../../../utils/DialogBox";

type IProps = {
    engine: IEngine;
    loc: Location;
    p: IPlayer;
}

type IState = {
    inBladeburner: boolean;
}

export class SpecialLocation extends React.Component<IProps, IState> {
    /**
     * Stores button styling that sets them all to block display
     */
    btnStyle: object;

    constructor(props: IProps) {
        super(props);

        this.btnStyle = { display: "block" };

        this.createCorporationPopup = this.createCorporationPopup.bind(this);
        this.handleBladeburner = this.handleBladeburner.bind(this);
        this.handleResleeving = this.handleResleeving.bind(this);

        this.state = {
            inBladeburner: this.props.p.inBladeburner(),
        }
    }

    /**
     * Click handler for "Create Corporation" button at Sector-12 City Hall
     */
    createCorporationPopup() {
        createStartCorporationPopup(this.props.p);
    }

    /**
     * Click handler for Bladeburner button at Sector-12 NSA
     */
    handleBladeburner() {
        const p = this.props.p;
        if (p.inBladeburner()) {
            // Enter Bladeburner division
            this.props.engine.loadBladeburnerContent();
        } else {
            // Apply for Bladeburner division
            if (p.strength >= 100 && p.defense >= 100 && p.dexterity >= 100 && p.agility >= 100) {
                p.startBladeburner({ new: true });
                dialogBoxCreate("You have been accepted into the Bladeburner division!");
                this.setState({
                    inBladeburner: true,
                });

                const worldHeader = document.getElementById("world-menu-header");
                if (worldHeader instanceof HTMLElement) {
                    worldHeader.click(); worldHeader.click();
                }
            } else {
                dialogBoxCreate("Rejected! Please apply again when you have 100 of each combat stat (str, def, dex, agi)");
            }
        }
    }

    /**
     * Click handler for Resleeving button at New Tokyo VitaLife
     */
    handleResleeving() {
        this.props.engine.loadResleevingContent();
    }

    renderBladeburner(): React.ReactNode {
        if (!this.props.p.canAccessBladeburner()) { return null; }
        const text = this.state.inBladeburner ? "Enter Bladeburner Headquarters" : "Apply to Bladeburner Division";
        return (
            <StdButton
                onClick={this.handleBladeburner}
                style={this.btnStyle}
                text={text}
            />
        )
    }

    renderCreateCorporation(): React.ReactNode {
        if (!this.props.p.canAccessCorporation()) { return null; }
        return (
            <AutoupdatingStdButton
                disabled={!this.props.p.canAccessCorporation() || this.props.p.hasCorporation()}
                onClick={this.createCorporationPopup}
                style={this.btnStyle}
                text={"Create a Corporation"}
            />
        )
    }

    renderResleeving(): React.ReactNode {
        if (!this.props.p.canAccessResleeving()) { return null; }
        return (
            <StdButton
                onClick={this.handleResleeving}
                style={this.btnStyle}
                text={"Re-Sleeve"}
            />
        )
    }

    render() {
        switch (this.props.loc.name) {
            case LocationName.NewTokyoVitaLife: {
                return this.renderResleeving();
            }
            case LocationName.Sector12CityHall: {
                return this.renderCreateCorporation();
            }
            case LocationName.Sector12NSA: {
                return this.renderBladeburner();
            }
            default:
                console.error(`Location ${this.props.loc.name} doesn't have any special properties`);
                break;
        }
    }
}
