System Puzzles Reference — Soft8Soft
Description: These puzzles may be used to perform various system functions such as printing to console, measuring performance, getting/setting rendered pixel ratio, retrieving the GPU information and using persistent browser storage.

# System Puzzles

These puzzles may be used to perform various system functions such as printing to console, measuring performance, getting/setting rendered pixel ratio, retrieving the GPU information and using persistent browser storage.

## Contents

- Puzzles Reference
  - print to console
  - print performance info
  - check performance
  - feature available
  - get GPU
  - set screen scale
  - native screen scale
  - detect gamepad device
  - gamepad index
  - get gamepad property
  - storage set
  - storage get
  - storage remove
  - storage check
  - close app

#

## Puzzles Reference

#

### print to console

Prints data of any type (an output from some puzzle, a variable, or just a text) to the browser console. Printing to console is the most universal and easy-to-use method to debug your scripts.

#

### print performance info

Records a performance profile during 1 second and prints it to the browser console. Use this profile to find performance bottlenecks and improve application rendering and loading speed. See more here.

#

### check performance

Measure rendering capabilities of the user’s computer or device. Under the hood, it uses the open source library Detect GPU to find an existing benchmark result and classify the user’s GPU as “good” or “poor”.

You can use this puzzle’s slots to load a simpler scene, or to disable some graphically intensive features (such as post-processing effects) for poor GPUs. On the other hand – if the user’s GPU appears to be powerful – you can boost the quality up.

We also added this benchmark to the WebGL Report page so that you can quickly check your GPU by simply opening this page in the browser.

If the user's GPU reported as "good" it does not mean you can overload it by heavy graphics. You still need to do as much as possible to optimize your app!

#

### feature available

Check if a feature selected from the drop-down is available in the user's browser. If the feature is available, the puzzle returns `true`, otherwise it returns `false`.

Features which can be checked with this puzzle include:

Feature | Description
--- | ---
Mobile Device | The app is running on mobile device (phone, tablet, portable VR headset).
Android | The app is running on Android device.
iOS | The app is running on iOS or iPadOS device.
Windows | The app is running on Windows OS.
macOS | The app is running on macOS.
ChromeOS | The app is running on ChromeOS.
Linux | The app is running on Linux (Ubuntu, Fedora, Red Hat, etc).
Google Chrome | The app is running in Google Chrome browser or one of its clones (Chromium, Brave, but not Edge).
Firefox | The app is running in Firefox browser.
Internet Explorer | This feature is always `false` since Verge3D dropped support for Internet Explorer long time ago. Remains for compatibility purposes.
Microsoft Edge | The app is running in Microsoft Edge browser.
Safari | The app is running in Apple Safari browser.
Touch Screen | The system has touch screen device.
Retina Display (HiDPI) | The system has high resolution display (Retina), e.g its native screen scale value is greater or equal to `2`.
High Dynamic Range (HDR) | Verge3D app is running with HDR feature enabled. This has nothing to do with HDR support by the target system display.
Web Audio API | System supports Web Audio (nowadays is always `true`).
WebGL | System supports WebGL (at least version 1.0 of this 3D web standard).
WebGL 2.0 | System supports WebGL, version 2.0.
WooCommerce | App is running on the product page created by the WooCommerce plugin for WordPress.
Do Not Track | The user's browser has the "Do Not Track" setting enabled. This feature is considered deprecated and should not be used anymore.

#

### get GPU

Outputs the user's GPU info — vendor, for example: NVIDIA Corporation, Apple Inc., Qualcomm, and GPU model, for example: GeForce GTX 1060 3GB/PCIe/SSE2, Apple A9 GPU, Adreno (TM) 330.

#

### set screen scale

Set screen resolution factor for the rendered canvas. Set > 1 to improve quality, < 1 to improve performance. 1 is the default screen scale on both Retina (aka HiDPI) and non-Retina displays.

Verge3D uses 1 as default scale factor to prevent rendering of too much pixels on Retina displays. If performance is not a concern, enable Retina rendering by setting the screen scale to native screen scale, alternatively use some in-between value (e.g. 1.5).

#

### native screen scale

Native (depends on hardware or browser zooming) canvas resolution factor. If you don't zoom in or zoom out your page, this value equals to 1 for non-Retina displays, > 1 for HiDPI displays, modern smartphones and tablets.

#

### detect gamepad device

Detect gamepad devices connected to or disconnected from your system. When a new gamepad device found, the puzzles specified in the once connected do slot are triggered. When the device disconnected, the puzzles specified in the once disconnected do slot are triggered. In any case the value gamepad index is set and returns the device index.

#

### gamepad index

Returns connected/disconnected gamepad device index.

#

### get gamepad property

Returns a gamepad property for the device with the given index.

Properties:

- connection status — whether the device is connected (returns true) or disconnected (returns false).
- axis — device axis position in the range -1.0–1.0. For example, an analog thumb stick found on all recent gamepads is represented by two axes: left–right and up–down.
- button — device button state. Returns true when the button is pressed and false otherwise.
- analog button — analog button state. Similar to button but can detect the amount which the button has been pressed. Returns value in the range 0–1.
- id — device ID string. Identifies the brand and model of the connected device.
- timestamp — last time the axes/buttons for the gamepad were updated. You can store this value in a variable and compare with the current timestamp each frame to detect that some stick/button was moved/pressed.
- mapping — device mapping: "standard" for the gamepad that has standard layout, "xr-standard" for the gamepad that has layout of a standard AR/VR controler, "" (empty string) for unknown device.
- debug info — output string with debugging information. Print this info with print to console puzzle to learn what buttons or sticks are available on the connected gamepad device.

For usage example, check out the Farmers Journey demo (source files available in the Asset Store).

To assign proper sticks/buttons in your application use the Gamepad Diagnostics tool, debug info property or follow the Standard Gamepad layout (may not work properly for all kinds of devices):

In case of standard AR/VR controllers, the layout is different:

#

### storage set

Stores key-value pairs in the web browser's local storage with no expiration time. This means that data stored in the browser will persist even after the browser window is closed. Note: the local storage of web browser in a "private browsing" or "incognito" session is cleared when the last "private" tab is closed.

The key must be a text. The following data types are supported as an assigned value: number, text, list, dictionary.

#

### storage get

Returns an value associated with a specified key in the web browser's local storage.

#

### storage remove

Removes an value associated with a specified key in the web browser's local storage.

#

### storage check

Checks if a specified key is present in the web browser's local storage. Returns the Boolean-typed result true or false.

#

### close app

Closes the Verge3D application. Due to security limitations imposed by web browsers, this puzzle only works for Electron, Cordova, or programmatically opened pages.

## Having Troubles with Puzzles?

Seek help on the forums!