export default class OkButton extends PIXI.Container {

    private texture: PIXI.Texture;

    constructor(text: string, offsetX: number, offsetY: number, clickCallback: () => any) {
        super();

        const loader = new PIXI.loaders.Loader();

        loader.add('button_left', './extras/data/images/buttons/button_left.png')
            .add('button_middle', './extras/data/images/buttons/button_middle.png')
            .add('button_right', './extras/data/images/buttons/button_right.png')
            .add('button_left_press', './extras/data/images/buttons/button_left_press.png')
            .add('button_middle_press', './extras/data/images/buttons/button_middle_press.png')
            .add('button_right_press', './extras/data/images/buttons/button_right_press.png');

        loader.load((loader: PIXI.loaders.Loader, resources: PIXI.loaders.ResourceDictionary) => {
            let buttonLeft = new PIXI.Sprite(resources.button_left.texture);
            let buttonMiddle = new PIXI.Sprite(resources.button_middle.texture);
            let buttonRight = new PIXI.Sprite(resources.button_right.texture);


            buttonMiddle.interactive = true;
            buttonMiddle.buttonMode = true;

            buttonMiddle.on('pointerdown', function () {
                this.texture = resources.button_middle_press.texture;
                buttonLeft.texture = resources.button_left_press.texture;
                buttonRight.texture = resources.button_right_press.texture;
            });

            buttonMiddle.on('pointerup', function () {
                this.texture = resources.button_middle.texture;
                buttonLeft.texture = resources.button_left.texture;
                buttonRight.texture = resources.button_right.texture;
                clickCallback();
            });

            let buttonText = new PIXI.Text(text, {
                fontSize: 10,
                fontFamily: 'Volter-Bold'
            });

            buttonLeft.x = offsetX;
            buttonLeft.y = offsetY;

            buttonMiddle.x = buttonLeft.x + buttonLeft.width;
            buttonMiddle.y = offsetY;
            buttonMiddle.width = buttonText.width + 6;

            buttonText.x = 1 + (buttonMiddle.x + ((buttonMiddle.width / 2) - buttonText.width / 2));
            buttonText.y = buttonMiddle.y + ((buttonMiddle.height / 2) - buttonText.height / 2);

            buttonRight.x = buttonMiddle.x + buttonMiddle.width;
            buttonRight.y = offsetY;

            super.addChild(buttonLeft);
            super.addChild(buttonMiddle);
            super.addChild(buttonText);
            super.addChild(buttonRight);
        });
    }

}