import * as React from 'react';
import * as ReactDOM from 'react-dom';

export interface IHudWindow extends Window {
    hud: Hud;
}
export interface IHudProps {
    health: number;
}
export class Hud extends React.Component<IHudProps, IHudProps> {
    constructor(hudOpts: IHudProps) {
        super();

        const hw = window as IHudWindow;
        hw.hud = this;

        this.state = hudOpts;
        this.updateStats = this.updateStats.bind(this);
    }
    updateStats(newHealth: number) {
        this.setState({
            health: newHealth
        });
    }
    render() {
        return (
            <div>
                <div id="health">
                    <b>HP:</b> {Math.floor(this.state.health)}
                </div>
            </div>
        );
    }
}

ReactDOM.render(<Hud {...{ health: 7 }} />, document.getElementById("hud"));