Newer
Older
lostmynuts / shared / js / Engine / Dialogs / MessageBox.js
Engine.MessageBox = class extends Engine.Dialog
{
    get boxWidth() { return 290; }
    get boxHeight() { return 170; }
    get fontFamily() { return "Verdana"; }
    get fontSize() { return 14; }
    get buttonWidth() { return 85; }
    get buttonHeight() { return 35; }
    get buttonFontFamily() { return "Tiamat"; }
    get buttonFontSize() { return 14; }

    constructor(parentClip)
    {
        super(parentClip);

        this.background = new Engine.Drawable("BGStandard");
        this.background.setNineRect();

        this.text = new Engine.DrawableText("Message Here!");//PIXI.Text("message here", this.style);

        this.addChild(this.background);
        this.addChild(this.text);

        this.okButton = new Engine.DrawableButton("Button_Green");
        this.cancelButton = new Engine.DrawableButton("Button_Red");

        this.okButton.matchTextSize = false;
        this.cancelButton.matchTextSize = false;

        this.okButton.setWidth(this.buttonWidth);
        this.cancelButton.setWidth(this.buttonWidth);
        if (this.buttonHeight > 0 )
        {
            this.okButton.setHeight(this.buttonHeight);
            this.cancelButton.setHeight(this.buttonHeight);
        }

        this.addChild(this.okButton);
        this.addChild(this.cancelButton);

        this.cancelButton.onClick = () => { this.clickedCancel(); }
        this.okButton.onClick = () => { this.clickedOK(); }

        this.enableHide = true;
        this.callbackFunction = null;
    }

    clickedCancel()
    {
        if (this.callbackFunction) this.callbackFunction(false);
        this.hide();
    }

    clickedOK()
    {
        if (this.callbackFunction) this.callbackFunction(true);
        this.hide();
    }

    show(message, okText, closeText, callbackFunction, width, height)
    {
        if (okText === undefined) okText = "";
        if (closeText === undefined) closeText = "";
        if (callbackFunction === undefined) callbackFunction = null;
        if (width === undefined) width = null;
        if (height === undefined) height = null;

        var useWidth = width ? width : this.boxWidth;
        var useHeight = height ? height : this.boxHeight;

        this.text.textAreaWidth = useWidth * 0.85;
        this.text.setText(message, this.fontFamily, this.fontSize, "center");
        //this.text.scaleTextToFit(message, useWidth * 0.85, 80, this.fontFamily, this.fontSize)

        var yPadding = 20;
        var requiredHeight = this.text.height + yPadding * 2 + (okText == "" && closeText == "" ? 0 : this.okButton.height + yPadding);
        useHeight = Math.max(requiredHeight, useHeight);

        this.background.ninePlane.width = useWidth;
        this.background.ninePlane.height = useHeight;
        
        this.dialogWidth = useWidth;
        this.dialogHeight = useHeight;

        var space = (useWidth - this.okButton.width - this.cancelButton.width) / 3;

        this.okButton.y = useHeight - this.okButton.height - yPadding;
        this.okButton.x = space;

        this.cancelButton.y = this.okButton.y;
        this.cancelButton.x = this.okButton.x + this.okButton.width + space;

        this.active = true;
        this.callbackFunction = callbackFunction;
        this.parentClip.addChild(this);
        
        this.okButton.init("Button_Green", okText, this.buttonFontFamily, this.buttonFontSize);
        this.cancelButton.init("Button_Red", closeText, this.buttonFontFamily, this.buttonFontSize);

        var bottomY = 0;

        if (okText == "" && closeText == "")
        {
            this.removeChild(this.okButton);
            this.removeChild(this.cancelButton);
            bottomY = useHeight;
            this.enableHide = false;
        }
        else if (okText == "")
        {
            this.removeChild(this.okButton);
            this.addChild(this.cancelButton);
            this.cancelButton.x = (useWidth / 2 - this.cancelButton.width / 2);
            bottomY = this.cancelButton.y;
        }
        else if (closeText == "")
        {
            this.removeChild(this.cancelButton);
            this.addChild(this.okButton);
            this.okButton.x = (useWidth / 2 - this.okButton.width / 2);
            bottomY = this.okButton.y;
        }
        else
        {
            this.addChild(this.okButton);
            this.addChild(this.cancelButton);
            
            space = (useWidth - this.okButton.width - this.cancelButton.width) / 3;
            this.okButton.y = useHeight - (this.okButton.height * 1.5);
            this.okButton.x = space;

            this.cancelButton.y = this.okButton.y;
            this.cancelButton.x = this.okButton.x + this.okButton.width + space;

            bottomY = this.okButton.y;
        }

        this.text.x = (useWidth - this.text.textAreaWidth) / 2;
        this.text.y = (bottomY - this.text.height) / 2;

        this.showDialog();
    }

    hide(instant)
    {
        if (this.enableHide) super.hide(instant);
    }

}