Newer
Older
lostmynuts / shared / js / Engine / Dialogs / Dialog.js
Engine.DialogBlockerInfo = class {

    constructor()
    {
        this.color = new Color(0, 0, 0);
        this.alpha = 0.5;
    }

    equals(blockerInfo)
    {
        return blockerInfo.color == this.color && blockerInfo.alpha == this.alpha;
    }

}

Engine.DialogBlocker = class extends Engine.Drawable
{
    constructor()
    {
        super();
        
        this.blockerInfo = null;
        this.used = false;
        this.isBlocker = true;
        this.mouseEnabled = true;
        // this.interactive = true;
        // this.interactiveChildren = true;
    }

    drawFullScreen()
    {
        this.draw(EngineSettings.screenWidth, EngineSettings.screenHeight);
    }

    draw(w, h)
    {
        this.setAsBox(this.graphics, w, h, this.blockerInfo.color, this.blockerInfo.alpha)
        //this.beginFill(this.blockerInfo.color, this.blockerInfo.alpha);
        //this.drawRect(0, 0, w, h);
        this.hitArea = this.getLocalBounds();
    }
}


Engine.Dialog = class extends Engine.Drawable {

    constructor(parentClip)
    {
        super();

        this.isDialog = true;
        this.dt = new Engine.DialogTransitionerSlide(this);
        
        this.shakeTween = new Engine.SimpleTween();
        this.currentShakeOffset = 0;
        this.dialogY = 0;
        this.originalY = 0;

        this.blockerInfo = new Engine.DialogBlockerInfo();
        this.alwaysOnBottom = false;

        this.parentClip = parentClip;
        this.active = false;

        this.dialogWidth = 0;
        this.dialogHeight = 0;

        this.playDialogSounds = true;
        this.hiding = false;

        this.onHideFinish = new Action();
        this.clickBgToClose = false;

        this.hideClickRegion = null;
    }

    addParentLayerUnderAllOfSameType()
    {
        if (this.parentClip == null) return;

        var others = Engine.DialogManagerInstance.getAllActiveDialogs(this.constructor);
        var index = null;
        for (var d of others)
        {
            if (this.parentClip.contains(d))
            {
                var cIndex = this.parentClip.getChildIndex(d);
                if (index == null || cIndex < index)
                {
                    index = cIndex;
                }
            }
        }
        if (index != null)
        {
            this.parentClip.addChildAt(this, index);
        }
        else
        {
            this.parentClip.addChild(this);
        }
    }

    get isTransitioning() { return this.dt != null && this.dt.active; }

    get clickBackgroundToClose() { return this.clickBgToClose; }
    set clickBackgroundToClose(value)
    {
        if (this.clickBgToClose != value)
        {
            this.clickBgToClose = value;
            if (this.clickBgToClose)
            {
                if (this.hideClickRegion == null)
                {
                    //this.hideClickRegion = new PIXI.Graphics();
                    //this.hideClickRegion.interactive = true;
                    //this.hideClickRegionHandler = (event) => { this.hideClickRegionClicked(event); };

                    this.hideClickRegion = new Engine.Drawable();
                    this.hideClickRegion.mouseEnabled = true;
                }
                //this.hideClickRegion.on('pointerdown', this.hideClickRegionHandler);
                this.hideClickRegion.events.onMouseDown.addListener(this, this.hideClickRegionClicked);
            }
            else
            {
                if (this.hideClickRegion != null)
                {
                    //this.hideClickRegion.off('pointerdown', this.hideClickRegionHandler);
                    this.hideClickRegion.events.onMouseDown.removeListener(this, this.hideClickRegionClicked);
                }
            }
        }
    }

    hideClickRegionClicked()
    {
        this.hide();
    }

    hide(instant)
    {
        if (instant === undefined) instant = false;

        //Already hiding? lets not hide again...
        if (this.hiding) return;

        if (this.hideClickRegion != null) this.removeChild(this.hideClickRegion);

        this.hiding = true;

        if (instant)
        {
            this.finishHide();
        }
        else
        {
            this.dt.transitionOut(() => { this.finishHide(); });
        }

        Engine.DialogManagerInstance.fireActiveDialogsChanged();
        Engine.DialogManagerInstance.fireDialogTransitioned(this.constructor, Engine.DialogManagerStatics.TransitionType.Hidden);
    
        if (this.playDialogSounds) Engine.SoundPlayerInstance.playSound(65);
    }

    
    finishHide()
    {
        Engine.EnterFrameManagerInstance.remove(this);
        this.parentClip.removeChild(this);
        this.active = false;
        this.hiding = false;
        if (this.onHideFinish != null) this.onHideFinish.call();
    }

    finishSlide()
    {
        if (this.clickBackgroundToClose)
        {
            this.addChildAt(this.hideClickRegion, 0);

            //this.hideClickRegion.clear();
            //this.hideClickRegion.beginFill(0xFFFFFF, 0);
            //this.hideClickRegion.drawRect(0, 0, EngineSettings.screenWidth, EngineSettings.screenHeight);
            //this.hideClickRegion.hitArea = this.hideClickRegion.getBounds();
            this.hideClickRegion.setAsBox(this.hideClickRegion.graphics, EngineSettings.screenWidth, EngineSettings.screenHeight, Colors.black, 0);
            
            this.hideClickRegion.x = -this.x;
            this.hideClickRegion.y = -this.y;
        }
        this.originalY = this.y;
        this.dialogY = this.originalY;


        Engine.DialogManagerInstance.fireDialogTransitioned(this.constructor, Engine.DialogManagerStatics.TransitionType.Shown);
    }

    dialogAvailableChanged()
    {
        Engine.DialogManagerInstance.fireDialogAvailableChanged(this);
    }

    update(timeElapsed)
    {

    }

    resolutionChanged(width, height)
    {
        var targetPosition = this.dt.getTargetPosition();
        this.x = targetPosition.x;
        this.y = targetPosition.y;
        this.originalY = this.y;
        this.dialogY = this.originalY;
    }

    showDialog(instant = false, underAllSameType = false)
    {
        if (underAllSameType)
        {
            this.addParentLayerUnderAllOfSameType();
        }
        else
        {
            this.parentClip.addChild(this);
        }
        this.active = true;
        
        this.dt.transitionIn(()=>{this.finishSlide();} );

        Engine.DialogManagerInstance.addDialogToUpdate(this);

        Engine.DialogManagerInstance.fireActiveDialogsChanged();
        Engine.DialogManagerInstance.fireDialogTransitioned(this.constructor, Engine.DialogManagerStatics.TransitionType.Shown);

        if (this.playDialogSounds) Engine.SoundPlayerInstance.playSound(66);
    }

    showInstant()
    {
        return false;
    }

    doStaticShake(strength , time /*float*/)
    {
        this.shakeTween.init((value) => this.shakeUpdate(value), this.staticShakeTween, 0, strength, time);
        this.shakeTween.onFinish = () => { this.y = this.dialogY = this.originalY; }
    }

    staticShakeTween(t /*float*/, b /*float*/, c /*float*/, d /*float*/)
    {
        return b + Math.sin(t * Math.PI * 13) * c;
    }

    shakeTweenUpdate(t /*float*/, b /*float*/, c /*float*/, d /*float*/)
    {
        t = t / d;
        return b + Math.sin(t * Math.PI * 13) * c * (1 - (t * 0.6));
    }

    shakeUpdate(value /*float*/)
    {
        this.Y = this.dialogY + value;
        this.currentShakeOffset = value;
    }
}