Status
Not open for further replies.

BurningOrca

Veteran
Veteran
Joined
Apr 14, 2019
Messages
240
Reaction score
206
First Language
German
Primarily Uses
RMMV
I want a certain window of mine to listen to keyboard events, when it is shown and don't listen to them, when it is hidden. The problem is document.removeEventListener seems not to work, not to throw any exception and always return undefined, so I cannot figure out why it does not work. From the description of the function I also cannot figure out why. I don't use any of the optional parameter, so I thought it should work.

Here is some code to test out what I mean. Just call SceneManager.push(Scene_EventListener) in the console. Even when the scene is popped and the window should not exist anymore, the onKeyPress Event is still functioning:
Code:
function Scene_EventListener()
{
    this.initialize.apply(this, arguments);
}

Scene_EventListener.prototype = Object.create(Scene_MenuBase.prototype);
Scene_EventListener.prototype.constructor = Scene_EventListener;

Scene_EventListener.prototype.initialize = function()
{
     Scene_MenuBase.prototype.initialize.call(this, arguments);
}

Scene_EventListener.prototype.create = function()
{
    Scene_MenuBase.prototype.create.call(this);
    this._commandWindow = new Window_EventListenerCommand();
    this._eventListenerWindow = new Window_EventListener();

    this._commandWindow.setHandler('Show', this.onShow.bind(this));
    this._commandWindow.setHandler('Hide', this.onHide.bind(this));
    this._commandWindow.setHandler('cancel', this.popScene.bind(this));

    this.addWindow(this._commandWindow);
    this.addWindow(this._eventListenerWindow);
}

Scene_EventListener.prototype.onShow = function()
{
    this._commandWindow._showEnabled = false;
    this._commandWindow.refresh();
    this._commandWindow.activate();
    this._eventListenerWindow.show();
}

Scene_EventListener.prototype.onHide = function()
{
    this._commandWindow._showEnabled = true;
    this._commandWindow.refresh();
    this._commandWindow.activate();
    this._eventListenerWindow.hide();
}

Scene_EventListener.prototype.popScene = function()
{
    this._eventListenerWindow.hide();
    Scene_Base.prototype.popScene.call(this);
}

function Window_EventListenerCommand()
{
    this.initialize.apply(this, arguments);
}

Window_EventListenerCommand.prototype = Object.create(Window_Command.prototype);
Window_EventListenerCommand.prototype.constructor = Window_EventListenerCommand;

Window_EventListenerCommand.prototype.initialize = function()
{
    this._showEnabled = false;
    Window_Command.prototype.initialize.call(this, 0, 0);
}

Window_EventListenerCommand.prototype.maxCols = function()
{
    return 3;
}

Window_EventListenerCommand.prototype.windowWidth = function()
{
    return SceneManager._screenWidth;
}

Window_EventListenerCommand.prototype.windowHeight = function()
{
    return this.lineHeight() * 2;
}

Window_EventListenerCommand.prototype.makeCommandList = function()
{
    this.addCommand('Show', 'Show', this._showEnabled);
    this.addCommand('Hide', 'Hide', !this._showEnabled);
    this.addCommand(TextManager.cancel, 'cancel');
}

function Window_EventListener()
{
    this.initialize.apply(this, arguments);
}

Window_EventListener.prototype = Object.create(Window_Base.prototype);
Window_EventListener.prototype.constructor = Window_EventListener;

Window_EventListener.prototype.initialize = function()
{
    this._text = "";

    Window_Base.prototype.initialize.call(this, 0, this.lineHeight() * 2, SceneManager._screenWidth, SceneManager._screenHeight - this.lineHeight() * 2);

    document.addEventListener("keypress", this.onKeyPress.bind(this));
}

Window_EventListener.prototype.show = function()
{
    document.addEventListener("keypress", this.onKeyPress.bind(this));
    Window_Base.prototype.show.call(this);
}

Window_EventListener.prototype.hide = function()
{
    document.removeEventListener("keypress", this.onKeyPress.bind(this));
    Window_Base.prototype.hide.call(this);
}

Window_EventListener.prototype.onKeyPress = function(event)
{
    let char = String.fromCharCode(event.charCode)

    if( char )
    {
        this._text += char;
        alert(this._text);
    }
    else
    {
        SoundManager.playBuzzer();
    }
}
 

Drakkonis

Veteran
Veteran
Joined
Mar 5, 2021
Messages
210
Reaction score
160
First Language
English
Primarily Uses
RMMZ
Have you tried removing the ".bind(this)" from the removeEventListener? From what little I've seen, the function passed there has to be a simply named one, the page I found says that function(){script} style won't work, I'm not sure if that extends to the .bind as well or not.

Honestly I'd be leery of any document functions, since they modify the whole game window, not just windows in a game. The engine already has methods for listening to keypress events, you could just copy those with a check to see if the window is shown or not, windows also have open and close methods that can be used for checks like that as well.
 

BurningOrca

Veteran
Veteran
Joined
Apr 14, 2019
Messages
240
Reaction score
206
First Language
German
Primarily Uses
RMMV
It seems so, that bounded events don't work.
I've tried out many thing myself in the meantime and the following worked:

Code:
handleKeyPress = function(event)
{
    if( windowToHandleEvent )
        windowToHandleEvent.onKeyPress.call(windowToHandleEvent, event);
}

function Window_EventListener()
{
    this.initialize.apply(this, arguments);
}

Window_EventListener.prototype = Object.create(Window_Base.prototype);
Window_EventListener.prototype.constructor = Window_EventListener;

Window_EventListener.prototype.initialize = function()
{
    this._text = "";

    Window_Base.prototype.initialize.call(this, 0, this.lineHeight() * 2, SceneManager._screenWidth, SceneManager._screenHeight - this.lineHeight() * 2);

    windowToHandleEvent = this;
    document.addEventListener("keypress", handleKeyPress );
}


Window_EventListener.prototype.show = function()
{
    windowToHandleEvent = this;
    document.addEventListener("keypress", handleKeyPress);
    Window_Base.prototype.show.call(this);
}

Window_EventListener.prototype.hide = function()
{
    document.removeEventListener("keypress", handleKeyPress);
    Window_Base.prototype.hide.call(this);
}

Thank you!
 

Shaz

Global Moderators
Global Mod
Joined
Mar 2, 2012
Messages
43,359
Reaction score
15,172
First Language
English
Primarily Uses
RMMV

This thread is being closed, due to being solved. If for some reason you would like this thread re-opened, please report this post and leave a message why. Thank you.

 
Status
Not open for further replies.

Latest Threads

Latest Profile Posts

Sneak peak of my upcoming update! Who's holding her, you may ask? Find out tonight!
10.PNG
BCj
Finished another GUI! Turn indicator wasn't made by me.

ff981f8dc50b03cf58038c644334b454.jpg


3cb092fdc00087acfa0a190fd891f0ed.jpg
Added a small refining scene to my game.

It makes sense that you try to focus on the squishy mages at the back of the party first, right? If the mage can out-DPS the enemy DPS before the latter can kill the tank in front, the fight becomes boring.

Forum statistics

Threads
115,243
Messages
1,088,318
Members
149,840
Latest member
Linami
Top