Input Number Pad

[nilotech]

Hi there, I've been trying for a very long time to create/adjust the Input Number Processing event into a Numeric Key Pad layout instead of the default. I've been trying to understand how the rpg_windows.js works, particularly the Window_NumberInput section as it can only be called/activated via the Input Number Processing function within the game's Event Command or within a script call using $gameMessage.setNumberInput(var, digits);. However, this just brings up the default number processing. I am hoping it is possible to create a numeric key pad plugin in a grid as below:


1 2 3


4 5 6


7 8 9


ok 0 X.


This is similar to the Name Input Processing layout but instead of the letters, just the numbers, and an Ok text to confirm and the X to cancel. The value of the number inputted can be stored in a variable like the default and the max digits can be adjusted within the plugin. There should also be an option to position the "Pad" via x, y, on the screen and normal game events should continue to run even when the Pad window is active. (Think entering a code before a timer runs out, or a NPC (guard/monster etc.) reaches you.) This input number method is not meant to calculate but the value entered and stored as a variable can be used in calculations via the normal event processing. The default input number processing can remain for the shops. Any help, tips, guidelines, directions will be greatly appreciated.

 

[Kino]

If you want to create a window for number input processing, you definitely can, but in code, there are some limits.
Mainly, a window has to exist on a scene before you can actually use it / see it. 

Positioning the pad on screen can be done using Plugin Manager parameters like below


/*:
* @author Myname
*
* @param Window X Position
* @desc The X position of the window
* @default 400
*
*
* @param Window Y Position
* @desc The Y position of the window
* @default 300
*/

var parameters = PluginManager.parameters("NumericalPadPlugin"); //This is the name of my plugin
var numericalWindowX = parameters['Window X Position']; //Name of the parameter defined in my plugin section
var numericalWindowY = parameters['Window Y Position'];


//We can now use these parameters later on in our code to define the window x and y when it pops up on screen.





There is a way to summon a window on any scene, although it's not recommended because the game will still take input from other windows, unless you make huge edits to the code base.

//Example Of Placing a window on any scene

Game_System.prototype.addWindow = function(gameWindow) {
  var currentScene = SceneManager._scene; //Reference of current Scene the player is on 
  currentScene.addChild(gameWindow);
}

//This is just a brief example, you can also set it up in your plugin to summon a specific window that you create in your plugin.
//With it the way it is, you can pass a window to be summoned to $gameSystem like a regular script call.
//Example: $gameSystem.addWindow(numericalPadWindow);

 

[nilotech]

Hi Kino, thanks for your input... After numerous trials I've decided to use the default Input Number. I have managed to modify the rpg_windows.js, the Window_NumberInput section by making small numeral changes to the following lines of code:
    this.x = (Graphics.boxWidth - this.width) /4; //The default was 2 not 4.


Window_NumberInput.prototype.createButtons = function() {
    var bitmap = ImageManager.loadSystem('ButtonSet2'); // I created my own set of buttons graphic here.
    var buttonWidth = 40; //I changed these 
    var buttonHeight = 40;


It works for this particular game I am developing and thus far the shop menu has not been affected. However, I am still going to work on a numerical pad for future games or an updated version of this game. I am new to js coding and will need to learn quite a few things in order to that. Again thanks for your input.

 

[Kino]

Well, if you're looking to have one created;  I can create a numerical keypad plugin using the system I made.


Good luck with your game!

 

[nilotech]

That would be greatly appreciated... The plugin should be compatible with Yanfly's plugins, can work with message windows and a simple one click per digit...


This will help out a lot since I am trying to make a series of mathematical games and a numerical pad input will be more efficient than the current one. You will be credited within the game of course and will get a free copy if you desire. If there is anything else you need, please let me know. Thanks again.

 

[Kino]

Just some information, but how should it work with message windows? I can definitely create a new window that you can call at your leisure to take numerical inputs no problem.


@nilotech


What I was thinking of was creating a numerical pad window that can do these things:

• Store information after you hit ok
  
• Be called via script call to allow input processing during an event for example (like the choice windows)
  
• One click per digit (Touch based window of course, unless you want directional control bindings also)
  

Another question is compatibility with which Yanfly plugins? I don't think it should have any issue running alongside Yanfly's plugins.

 

[nilotech]

Actually what you have described is very similar to what I want it to do...

• Store information in a variable after hitting ok.
  
• Can be called up via script call...
  
• Touch based input, of course...
• Opacity/font size options would be great since the pad will/may be covering a part of the screen...
  

To clarify how it should work with message windows... Using the default input (see image numeral1) places the default buttons above the message window, which is the desired effect - above and left with my modifications. I know that can be adjusted with X,Y positioning parameters in your plugin. Messages must be clearly visible when the numerical window pops up as information is given in the message window. So imagine the numerical pad in the red position (see image numeral2). I hope this helps.


Thanks again.

 

[Kino]

Hey just a quick update while I make a couple changes to the code base to make it more flexible, but basically what we have right now is this: 


The numpad functions already, and the OK button saves the input, and the X button deletes a character -- one at a time.


@nilotech


Screenshots

Spoiler

 

[nilotech]

This is really cool... Is it possible to highlight the answer area? Perhaps put a window around it. That would be great and exactly what I need. Thanks again! 

 

[Kino]

@nilotech


Introduction



This plugin creates a new numerical pad, which you can use in your game.
This pad lets the player enter numbers, remove numbers from the buffer, and overall have a more robust numerical pad to use when they need to enter numbers.
This can be great for things like puzzles, or maybe a math game. It even comes  with an area to to see the information you typed in.



One of the core features is that you can access the pad just about anywhere you can make a script call. The second thing is, it will pause the message
 window until the player is done entering information.



One thing to note is that once you click "OK" on the pad, the pad will close, and the input is saved. The script calls below let you access that information, or open the pad at your leisure.


Instructions

1. Place the script in your plugins folder with the same name Cecilia_Heart and Cecilia_NumericalPad
   
2. Place Cecilia_Heart above Cecilia_NumericalPad
   
3. Enjoy
   

Core Features

• Shows maximum 9 characters
  
• Going over 9 characters pushes the pointer forward and shows characters  2 - 10 for example, instead of 1-10.
  
• Clearing the buffer by character using the X button
  
• Ok saves the input buffer
  
• Can pass the input, or value to a game variable
  
• Can access input directly
  
• Can store input upon pressing ok
  
• Pauses message window upon starting input processing
  

Scripts


View attachment Cecilia_Heart.js


View attachment Cecilia_NumericalPad.js


Script Calls


/* Version 1.00
//=============================================================================
// Script Calls
//=============================================================================
* Currently there are only two necessary scripts calls for this plugin.
* The four script calls are accessPad, storeInGameVariable, getBufferDirectly.
*
* $numPad.accessPad()
* This script call summons the numpad using the positions you set on screen.
* The numpad is locked to that position unlike other windows of the Cecilia
* system. With that in mind, you can use the numpad buttons to enter numerical
* information. X clearing one number from the buffer at a time.
*
* $numPad.closePad()
* This script call closed the numpad automatically, and deactivates it.
*
* $numPad.storeInGameVariable()
* Example: $numPad.storeInGameVariable(6);
* This script call does as it says; it stores the input into a game variable
* after processing. The most important part about this, is that it does this once
* called. So, you need to either set up a wait for the user to input a number, or
* if you're summoning while a message window is open. The message window will wait
* until you click 'OK' on the pad, before advancing the text.
*
* $numPad.storeInGameVariableUponCompletion()
* Example: $numPad.storeInGameVariableUponCompletion(6);
* This does the same thing as the above, but instead the value will be stored once
* the user presses okay, and no waiting is require; it will be done automatically.
*
* $numPad.getBufferDirectly()
* This does as it says; it will return the number entered into the buffer upon
* completion of processing -- when you hit "OK". Then, you can use it as you want,
* like storing it in a game variable for later use or in some crazy script call.
* The choice is yours.
*/




Screenshots

Spoiler

Setup Example Window





We access the pad using $numPad.accessPad(); this opens the pad up, and pauses the advancement of the message window.


We set what variable to store the answer in using $numPad.storeInGameVariableUponCompletion(6); this stores it in game variable 6.

 

[nilotech]

Thank you so much! I will try it out and let you know how it works. 

 

[nilotech]

Hi there. Thanks a lot for the plugin. It is working... I am able to call up the plugin when I want, adjust it's position, click on the digits to make a number, store the number in a variable and get back that number which is great. What I hoped for.  However there are a few adjustments to be made and some ideas for improvement of the plugin as follows:

• I have to click at least three times on a digit to get the plugin to recognize the number. Once it recognizes that I only have to click once per digit. This should be fixed.
  
• The input boxes are too close, offset or have some other issue. Sometimes when I click zero I get the X, when I click 2, I get 5, OK I get zero. You could widen the pad to solve this or modify the input box.
  
• I would also like the number pad to be displayed with a message window due to the fact the number/s to be input is/are displayed in the message window. Perhaps I am not doing it right but when the message window appears I would like the number pad to appear with it, similar to a choice. I know that this occurs according to the order these events are called –  Text, then Show Choices  - creates this effect. Currently the number pad appears after the message window.
  

These four issues are more for user friendliness and aesthetics value. (See image numpad1; modified graphically). I am not sure if it can be coded but it would be AWESOME if it can be done. 

• When the script is called it should start with the highlighted box (default green) on 5 as a default starting point. E.g. as in the title ‘new game’ is highlighted, or in the menu, item is always highlighted. This will also alert the player that an input is needed and that they can select a number without really having to state that.
  
• The OK should be green and the X should be red. Again this is for player appeal and I think it makes it more, user friendly.
  
• I’ve noticed the lower edges of the highlighted boxes for OK 0 and X gets cut off. Can this be fixed/adjusted?
  
• Finally, the display box (white rectangle) can be made more symmetrical. Again this is just for user appeal. (See image numpad2)
  

I hope that I am not asking for too much. If  the plugin can be improved in this manner that will be of great help with my games.


Thanks again for the plugins.

 

[Kino]

@nilotech


I'll put in some work for this, but the auto highlight part wouldn't be very possible for 5 (I'll see what I can do).
However, I may be able to do the coloring for the OK, and X. The Offset I can fix, but it looks like you want some padding between the numbers essentially.


The double click is really only for activating windows; it's setup so you have to double click a window to activate it (usually because these windows can be dragged around in game).

But I do know I can handle these:

• Color Coding Ok and X
  
• Evening out the display box
  
• Window Sizing, etc
  
• Adding padding between the columns / buttons
  

If you do a show text command then call $numPad.accessPad();


The message window should pause, because the num pad is open.


The first screenshot I sent has an example of that; the script call is used during a lot of show text commands.

 

[thalesgal]

Hello!
I found this thread on google, it's exaclty what I was looking for!! Amazing plugin

But I got the same issues as nilotech:

• I have to click at least three times on a digit to get the plugin to recognize the number. Once it recognizes that I only have to click once per digit. This should be fixed.

• The input boxes are too close, offset or have some other issue. Sometimes when I click zero I get the X, when I click 2, I get 5, OK I get zero. You could widen the pad to solve this or modify the input box.

- I would like to add that I think the PAD is too small to play on smartphones due some smartphone have small screens and it makes hard to hit the right number. For me for exemple, I'm making a mobile game, I would ask for a much larger PAD, such as triple the size.

Thank you in advance,
Thales.