Global singleton providing utility functions and environment detection. More...
| Import Statement: | import Clayground.Common |
The Clayground singleton provides essential utilities for resource loading and debugging. It automatically detects whether the application is running inside the ClayLiveLoader sandbox environment.
Example usage:
import Clayground.Common
Image {
source: Clayground.resource("assets/player.png")
}
Component.onCompleted: {
if (Clayground.runsInSandbox) {
console.log("Running in development mode")
}
}
browser : string |
The detected browser name when running in WebAssembly.
Returns one of: "chrome", "firefox", "safari", "edge", "opera", "other", or "none" (for native apps).
capabilities : var |
Platform capability information with status and user hints.
Provides structured information about platform-specific feature availability. Each capability has a status and hint property.
Status values:
"full" - Feature works without restrictions"restricted" - Feature works with limitations (see hint)"unavailable" - Feature is not available"unknown" - Detection not implemented for this platformAvailable capabilities:
clipboard - Clipboard paste functionalitysound - Audio playbackgpu - GPU compute (e.g., for AI inference)Example usage:
Text { visible: Clayground.capabilities.clipboard.status !== "full" text: Clayground.capabilities.clipboard.hint }
dojoArgs : var |
User-defined URL hash arguments when running in WebDojo.
Returns an object containing key-value pairs from the URL hash, excluding system keys (those starting with "clay-").
Only available in WebAssembly/WebDojo environment. Returns empty object for native applications.
Example URL: #clay-demo=...&playerName=Bob&level=5
Component.onCompleted: {
let name = Clayground.dojoArgs["playerName"] || "Guest"
let level = Clayground.dojoArgs["level"] || "1"
}
See also setDojoArg and removeDojoArg.
isWasm : bool |
True when running as WebAssembly in a browser.
runsInSandbox : bool |
True when running inside ClayLiveLoader sandbox environment.
Use this property to detect whether your application is running in development mode (via Dojo/LiveLoader) or as a standalone app.
watchView : var |
Reference to the watch view for property debugging.
This property is set by the framework when running in sandbox mode. It enables the watch() function to display property values in the logging overlay.
bool removeDojoArg(string key) |
Removes a user-defined URL hash argument.
key The argument name to remove.
\returntrue on success, false if the key is reserved or not found.
See also dojoArgs and setDojoArg.
string resource(string path) |
Returns the correct resource path for the current environment.
In standalone mode, returns a qrc:/ path. In sandbox mode, returns the file system path relative to the sandbox directory.
path The relative path to the resource.
Example:
Image { source: Clayground.resource("images/logo.png") }
bool setDojoArg(string key, string value) |
Sets a user-defined URL hash argument.
Changes are reflected in the browser URL for bookmarking/sharing. Keys starting with "clay-" are reserved and will be rejected.
key The argument name (must not start with "clay-"). value The argument value.
\returntrue on success, false if the key is reserved or operation failed.
Example:
Clayground.setDojoArg("level", "BossStage")
Clayground.setDojoArg("score", "1500")
See also dojoArgs and removeDojoArg.
string typeName(object obj) |
Extracts the type name from a QML object.
Parses the object's string representation to extract its type name. Useful for debugging and logging.
obj The object to get the type name from.
Returns the type name, or "n/a" if parsing fails.
Example:
Rectangle { id: rect Component.onCompleted: { console.log(Clayground.typeName(rect)) // "Rectangle" } }
void watch(object obj, string prop, bool logPropChange) |
Watches a property for debugging in the logging overlay.
When running in sandbox mode with the logging overlay enabled (Ctrl+L), this function displays the property value in real-time.
obj The object containing the property. prop The name of the property to watch. logPropChange If true, also logs property changes to the console.
Example:
Component.onCompleted: {
Clayground.watch(player, "x", false)
Clayground.watch(player, "health", true)
}