Global names of jComponent 20

jComponent 20 · jcomponent@20 referenceglobals Executed against Total.js 5

jComponent 20 exposes global functions and objects for state, components, requests and browser utilities. The bundle also includes jQuery. Use the table to find a name and its usage recipe.

Name	Kind	What it does	Recipe
`$`	function	jQuery.	getting-started
`$totaluidate`	function	Internal: the hour minus 12 from noon on (`$totaluidate(13)` is `1`, `$totaluidate(5)` stays `5`).	data-helpers
`$W`	object	The jQuery object of the window.	dom-helpers
`ADAPT`	function	Replaces the markers (`~PATH~`, `~ID~`, `CLASS`) and translates the text of a component.	find-and-call
`AJAX`	function	`AJAX('METHOD /url/', data, callback)` makes a request to the server.	ajax
`API`	function	Calls an `ROUTE('API ...')` endpoint of Total.js with a schema name and data.	api-calls
`APPEARANCE`	function	Sets the color, the dark mode and the CSS variables of the page.	dom-helpers
`ASETTER`	function	Returns a function that calls `SETTER()` later.	find-and-call
`ATTRD`	function	Reads a `data-` attribute of an element or an event.	dom-helpers
`BLOCKED`	function	Returns false the first time and true during a time: a guard against repeated actions.	state-shortcuts
`CACHE`	function	Stores a value in the browser for a period.	storage-cache-pref-cookies
`CACHEPATH`	function	Keeps a path of the state in the cache and restores it.	state-shortcuts
`CL`	function	Loads the code lists that are registered with `CLINIT()` and are not loaded yet.	data-helpers
`clearTimeout2`	function	Cancels a timer of `setTimeout2()`.	state-shortcuts
`CLINIT`	function	Registers a code list and the function that loads it.	data-helpers
`CLONE`	function	Deep copy of a value, dates included.	state-shortcuts
`CLRELOAD`	function	Loads code lists again.	data-helpers
`CMD`	function	Runs a command of a component. Use the `CMD` of an instance or `EXEC`.	commands
`COMPILE`	function	The same function as `NOOP` in jComponent 20.	find-and-call
`COMPONENT`	function	Declares a component.	custom-component
`COMPONENTS`	function	The ready components under a path.	find-and-call
`CONFIG`	function	Changes the configuration of components found by a selector.	component-config
`COOKIES`	object	Reads, writes and removes cookies.	storage-cache-pref-cookies
`COPY`	function	Copies the properties of an object into another one, deep.	state-shortcuts
`DAYS`	object	The names of the days of the week in English, from Sunday.	data-helpers
`DECRYPT`	function	Reads a value made by `ENCRYPT()` with the same key and type.	data-helpers
`DEF`	object	Defaults of jComponent. `DEF.fallback` is the address from which components that are not loaded are downloaded.
`DIFFDOM`	function	Makes the children of an element the same as a new list without redrawing the ones that stay.	dom-helpers
`EMIT`	function	Emits a global event.	events
`EMPTYARRAY`	object	A frozen empty array.	data-helpers
`EMPTYOBJECT`	object	A frozen empty object.	data-helpers
`ENCRYPT`	function	Turns a value into hexadecimal text with a check of the key (obfuscation, not security).	data-helpers
`ENV`	function	Registers or reads a value of the page, used in URLs as `[name]`.	environment-variables
`ENVIRONMENT`	function	Sets the name of the application for the storage, the version and the language.	dom-helpers
`ERROR`	function	Helper to handle the validation errors of an `API()` answer.	api-calls
`ERRORS`	function	Returns the invalid components under a path.	validation
`EXE`	function	Calls a plugin method, a global function or a function of the state (the same as `EXEC()`).	find-and-call
`EXEC`	function	Calls the method of a plugin (`EXEC('plugin/method')`) or a global function.	commands
`EXTENSION`	function	Adds code to every instance of a component or plugin.	extensions
`FIND`	function	Finds a ready component by name, path or id.	find-and-call
`FLAGS`	function	Dispatches custom path flags and invokes a callback.	custom-flags
`FN`	function	Compiles an expression into a function and remembers it.	data-helpers
`FREE`	function	Runs the cleanup of removed components at once.	component-lifecycle
`FUNC`	object	An object for functions that `EXE('FUNC.name')` can call.	find-and-call
`GET`	function	Reads a value from a path of the state.	state-api
`GUID`	function	Returns a random id.	utilities
`HASH`	function	Returns a numeric hash.	utilities
`HIDDEN`	function	True when an element is not shown.	dom-helpers
`IMPORT`	function	Loads an HTML part, a script or a style from a URL.	ui-import
`INC`	function	Adds 1 (or the given number) to the number in a path.	state-shortcuts
`inDOM`	function	True while an element is in the document.	dom-helpers
`isIE`	boolean	True in Internet Explorer.	dom-helpers
`isMOBILE`	boolean	True on a mobile device.	dom-helpers
`isPRIVATEMODE`	boolean	True in a private window.	dom-helpers
`isROBOT`	boolean	True for a search engine robot.	dom-helpers
`isSTANDALONE`	boolean	True when the page runs as an installed application.	dom-helpers
`isTOUCH`	boolean	True on a device with touch.	dom-helpers
`jComponent`	object	The engine of jComponent: `M.components`, `M.version`...	find-and-call
`jQuery`	function	jQuery, bundled in the same file.	getting-started
`LOCALIZE`	function	Loads a dictionary in the format of the Total.js resource files.	data-helpers
`M`	object	The engine of jComponent (the same object as `jComponent`, `Total` and `MAIN`).	find-and-call
`MAIN`	object	The engine of jComponent (the same object as `jComponent`, `Total` and `M`).	find-and-call
`MIDDLEWARE`	function	Registers a function that runs before a route, or runs a list of them in order.	find-and-call
`MONTHS`	object	The names of the months in English.	data-helpers
`NAV`	object	The current location: `url`, `query`, `params`, and `back()`/`forward()`.	spa-routing
`NEWUIBIND`	function	Makes a `ui-bind` on an element from the code.	find-and-call
`NODEINDEXOF`	function	The position of an element among its siblings.	dom-helpers
`NODEINSERT`	function	Moves an element after or before another one.	dom-helpers
`NODEMOVE`	function	Moves an element one place down or up in its parent.	dom-helpers
`NOOP`	function	A function that does nothing.	state-shortcuts
`NOTFOCUSED`	function	True when the browser tab is in the background.	dom-helpers
`NOW`	object	A `Date` that jComponent keeps up to date.	data-helpers
`NUL`	function	Sets the value of a path to `null` (the same as `NULL`).	state-shortcuts
`NULL`	function	Sets the value of a path to `null`.	state-shortcuts
`OFF`	function	Removes listeners of a global event.	events
`ON`	function	Registers a listener for a global event.	events
`PARSE`	function	Parses JSON and turns date strings into dates.	utilities
`PIPE`	function	`API()` to the address in `DEF.pipe`.	find-and-call
`PLUGIN`	function	Declares a plugin.	plugin
`PLUGINS`	object	The plugins of the page by their path.	find-and-call
`PREF`	object	User preferences saved in the browser.	storage-cache-pref-cookies
`PUSH`	function	Adds a value to an array of the state and notifies.	state-api
`QUERIFY`	function	Makes a query string from an object, also after an address or a method.	data-helpers
`REDIRECT`	function	Changes the address without loading the page and runs the matching route.	spa-routing
`REPO`	object	An object of yours to share data between components.	find-and-call
`RESET`	function	Clears the touched and modified states under a path.	validation
`ROUTE`	function	Registers a client-side route.	spa-routing
`SCROLLBAR`	function	Wraps an element with a custom scrollbar.	dom-helpers
`SCROLLBARWIDTH`	function	The width that a scrollbar takes.	dom-helpers
`SEEX`	function	Calls a function by name or sets a path.	find-and-call
`SET`	function	Writes a value at a path of the state and notifies everything bound to it.	state-api
`SETTER`	function	Calls a method of every component with a name, path or id.	find-and-call
`setTimeout2`	function	A debounced `setTimeout()` with an id and an optional limit of restarts.	state-shortcuts
`STRINGIFY`	function	`JSON.stringify()` that can compress empty values and choose the fields.	data-helpers
`STYLE`	function	Adds a style to the head; the same id replaces it.	dom-helpers
`Ta`	object	The same object as `Tangular`, the template engine.	data-helpers
`Tangular`	object	The template engine.	ui-bind-templates
`TAPI`	function	`API()` to the address in `DEF.api`.	find-and-call
`TEMP`	object	An object for temporary data.	find-and-call
`Thelpers`	object	The helpers of the templates (`Tangular.helpers`): add one with `Thelpers.name = fn`.	data-helpers
`TOGGLE`	function	Changes the boolean in a path.	state-shortcuts
`Total`	object	The engine of jComponent (the same object as `jComponent`).	find-and-call
`TRANSLATE`	function	Replaces every `@(text)` with its translation.	data-helpers
`UNAUTHORIZED`	function	True when `window.user` has none of the given permissions.	data-helpers
`UNWATCH`	function	Removes the watchers of a path made with `WATCH()`.	state-shortcuts
`UPD`	function	Notifies a path after you changed the object in place.	state-api
`UPDATE`	function	Notifies the components and the watchers of a path without changing it (alias `UPD`).	state-shortcuts
`UPLOAD`	function	Sends a `FormData` to a route with progress.	upload
`VISIBLE`	function	True when an element is in the visible part of the window.	dom-helpers
`W`	object	The `window`.	find-and-call
`WAIT`	function	Runs a function when another one returns true or a path has a value; checks every 500 ms.	state-shortcuts
`WARN`	function	Writes to `console.warn`.	state-shortcuts
`WATCH`	function	Runs a function every time a path changes.	state-api
`WH`	number	The height of the window.	dom-helpers
`WIDTH`	function	The size class of the width of an element or the window: xs, sm, md or lg.	dom-helpers
`WW`	number	The width of the window.	dom-helpers

public/index.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>jComponent</title>
	<link rel="stylesheet" href="//cdn.componentator.com/spa.min@20.css" />
	<script src="//cdn.componentator.com/spa.min@20.js"></script>
</head>
<body>
	<p>The test lists the globals of this page.</p>
</body>
</html>