Screen Console (JS-module, obsolete)

-edit: Recently I learned, that the same functionality can be achieved with a firefox or chrome on the development machine and mobile (test) device using the about:debugging or chrome://inspect#devices tabs on the development machine, adb command sometimes required. From personal experience I would recommend Firefox because Chrome can run into wierd compatibility issues on older devices, that are non-existant in Firefox. For broad audience development, use Chrome for the same reason.

This contains a basic screen console, written in Javascript modules, which can be used to debug a web game, especially on mobile, where browser consoles are sparse.

The screen console writes log messages to the screen, can be styled and has 4 log levels (debug, message, warning and error). By default it also logs messages in the browser console, but this behavior can be suppressed.

After a log message appears on screen the log scrolls up and out of the picture. The more log messages there are to be displayed the faster it scrolls.

Scrolling speed, scrolling acceleration, and the position of the log messages can be configured with hardcoded variables in screenConsole.mjs

The screen console makes use of a debugBuild variable found in consts.mjs, which can be used to en- and disable the logs, to the screen console and the browser console alike, if an equivalent variable already exists in a project, that variable can be used instead.

An example is provided, that utilizes the three functions initScreenConsole(), and scrollScreenConsole() to initialize and scroll the screen console and screenLog() to write messages to the screen.

This has been whipped together in pursuit of a lab task (a web game with specific requirements) in Human Machine Interactions 2 ("Mensch-Computer Interaktion 2") at Esslingen University of Applied Sciences.