top of page

This developer console allows the user to manipulate the game engine, by creating an interface for changing console variables, executing console commands and running Squirrel code snippets on the target script VM.

INTRODUCTION

The console also displays messages in color emitted from the engine and SDK through my logger system demonstrated in this portfolio piece, with time stamps (since process start). The colors are determined by the context (the sub system that emitted the message). Native Server code will be a solid blue color, where native Client will be a solid grey color, UI has a dark brown color. The script variants of Server, Client and UI will be the same color, but a bit lighter, which makes it easy to separate native prints from script prints. The engine has more subsystems, such as the pak load API and the material system, these have their own colors too!

​

Errors and warnings have their own colors (distinctive bright red/yellow) and override the context colors.

To maintain readability in these cases, the context of the message is always prefixed, for example:

"[122.244] Native(M):Material "error" not found; replacing with "error_rgdu"".

The highlighted prefix determines the context (Native(M)), where "M" stands for MaterialSystem in this case.

​

  • The source code for this project can be found in this GitHub link.

  • This particular console has been shipped in a DLL with over 150K downloads (80K+ since a large refactor I did 2 months ago). Despite it being the most used tool supplied by the SDK, I received zero bug reports so far!

AUTO COMPLETE

The console will suggest console commands and variables as you type into the input field. It lists anything matching the criteria, sorted in lexicographical order. The suggestion window was a challenging element to add as the Dear ImGui library does not support such feature out of the box!

​

From left to right:

  • It displays the flags of the console command/variable in color codes (the most significant bit is colored on the left if 2 flags are present, more on this later).

  • The name of the command base.

  • The value of the console variable in square brackets (not for console commands, these don't have a value).

  • The help text of the command base (the autocomplete features scrolling and temporary resizing to read longer help texts).

  • The usage text of the command base.

​

The user can navigate through this list of suggestions with either the keyboard, or the mouse. Hitting enter or clicking on any of the suggestions, will bring the command/variable name into the input field, with a trailing space character, so the user can directly start passing parameters to the command, or setting values to the console variable.

The flags of a console variable/command determine how they are changed or executed. For example, a command base flagged "FCVAR_CHEAT", can only be changed, or executed when the ConVar "sv_cheats" is enabled on the server. "FCVAR_DEVELOPMENTONLY" can only be changed or ran in development builds of the SDK, "FCVAR_REPLICATED" means the server will broadcast the value of this console variable to all connected clients, etc...

​

Since its important to know the flags of a certain variable/command at the moment user wants to set/execute it, I needed a way to directly present them to the user without cluttering the auto complete window, as we don't have enough space for even more text.

 

My idea was to visually represent the flags, using color semantics. This had to be done properly however, one rule I set before implementing this, was to always have the color representing the most significant bit on the left, and all common bits should have their own unique color that also makes sense, for example:

  • FCVAR_RELEASE being green (variables/commands flagged with this are the only ones available to customers).

  • FCVAR_CHEAT being red (requires "sv_cheats" to be enabled. Enabling this on the server poses a potential security risk!).

  • FCVAR_DEVELOPMENTONLY being blue (most dev/debug prints I had encountered were blue, including the ones from SpdLog).

​

The following legend displays the colors and their semantics:

DETAIL

If a valid console variable is present in the input field (red box in the lower left corner), the console will display the current value, and the default value of this particular console variable (red box in the upper right corner).

 

If there is no valid console variable in the input field, it will display the number of history items instead (the number of different commands entered in the console):

Here we can also see script prints being logged to the console, these have a slightly lighter color than native prints in the same context (for example, client script is a lighter grey where client native is solid grey). We can also see how the error/warning messages override the context colors. Even though the color is overridden, we can still determine which subsystem emitted the message by looking for the context prefix (Native(M): (material system code), or Script(C): (client script), etc...). Each message is also prefixed with a time stamp in square brackets, this timer starts at the moment the engine module is loaded and initialized.

FILTERING

In the filter input field at the top of the console, we can enter text we want to highlight, we can filter more items using the comma character as delimiter. Anything that does not match the filter criteria will get "greyed" out.

SELECTION

The content of the logging region can also be selected and copied to the clipboard. The selection will move with the text when new line entries are inserted to the head or tail. Text selection was a tough thing to add, as the Dear ImGui library does not offer such feature out of the box. A dedicated class was created to support this.

Remark:

  • The auto complete algorithm and update code is ran once per key press, making it performant.

  • The flags color coding requires familiarization; user of the console needs to understand the semantics. 

bottom of page