Cotonic
Cotonic browser APIs and messaging.
Cotonic browser APIs and messaging.
Browse by topic
Explore related documentation through its most useful keyword groups.
34 items
Grouped by Domain
Presenting information and supporting actions in public pages and administration screens.
Exchanging asynchronous messages between clients services and Zotonic components.
Persisting client-side data in the browser and observing changes to stored values.
Verifying the identity of a user client or service.
Reading and changing browser locations history query parameters and windows.
Managing users login identities account data and account lifecycle.
Documentation not covered by the other keyword groups in this split.
1.9.0 — Sep 1, 2026 — Diff — Docs — Download
Cotonic is a Javascript library which makes it possible to split the javascript code of your page into truly isolated components. By…
The broker module handles all local publish subscribe connections. The subscriptions are stored in a trie datastructure allowing quick action. They…
The mqtt module provides functions to work with mqtt topics. The broker uses this module as the basis to provide its functionality. This module…
This module makes it possible to bridge the broker on the local page to an external MQTT broker.
The tokenizer transforms text to html tokens. The tokenizer is used by the user interface composer in order to call the incremental-dom api.
The user interface composer manages html snippets which can be placed in the DOM tree. When an updated html snippet is delivered to the composer it…
Introduction to Incremental DOM
model/activity Publishes browser activity observed by Zotonic's wires script. This is an event-only model: it has no get , post , or delete operations and no…
model/alert Displays a Zotonic alert dialog through the wires script and z_dialog_alert . The page must have the normal Zotonic dialog support loaded.
model/auth Owns browser authentication state and communicates with /zotonic-auth . It checks and refreshes authentication, manages login/logout and password…
model/auth-ui Manages Zotonic's login, reminder, verification, reset, and password-change views. The standard _logon.tpl starts the worker and supplies the…
The autofocus model looks for elements with the autofocus attribute which are just added to the dom tree. When this happens, it auto focusus them.
model/clipboard Copies text using the browser Clipboard API. Implemented in the wires script. Browser clipboard availability and permission rules still apply.
model/console Writes structured messages to the browser console and answers diagnostic pings. Implemented in the wires script.
The dedup model implements message deduplication. It works by sending a message to the dedup model, the dedup model then relays the message to a…
The document model can be used to retrieve details about the current document.
model/fileuploader Queues browser files and uploads them in chunks through mod_fileuploader . The _fileuploader_worker.tpl include starts the worker. It…
Application lifecycle is a key way that modern operating systems manage resources. On Android, iOS, and recent Windows versions, apps can be…
model/loadmore Replaces a loader element with a server-rendered template. Include js/models/loadmore.js from mod_base on pages that use this model.
get/+key Gets item key from localStorage. Returns the content as payload.
The location model can be used to retrieve information on the current location of the page. It also allows subscription to location changes.
model/oauth Coordinates an OAuth authorization or redirect page. The worker is provided by mod_oauth2 and advertises model/oauth as a dependency capability. It…
Because workers run as independent components it is not possible to directly call api's. Some api's are also not available to web workers. Models…
The serviceWorker model makes it possible to communicate with other tabs from the same site. This makes it possible to communicate important state…
The sessionId model manages a browser identifier stored as JSON under cotonic-sid in localStorage. It is shared by pages on the same…
The sessionStorage model provides access to the sessionStorage of the browser. It makes it possible to set and retrieve values via mqtt…
The ui model can be used to update the dom by publishing messages on one of the model/ui/# topics. Elements can be inserted, deleted and updated.
The window model can be used open and close windows.
model/wires Connects Cotonic messages to named Zotonic events through the wires script.
Cotonics main functions are available in the cotonic namespace on the main page. The functions are mostly used to control and allow messaging…
Workers are stand alone processes. They have no shared data with the page, nor with other workers. Their memory and calling context is isolated.
Cotonic uses Web Workers which all run in separate calling context. This means that they will not block the main user interface thread. They are…
Zotonic Cotonic models These browser-side models extend Cotonic with Zotonic functionality. Each model has its own reference page: