JavaScript

Actions

add_class

Add a css class to an html element.

Actions

alert

Show an alert dialog.

Actions

animate

Add a $(..).animate jQuery call to the target element.

Scomp

button

Makes a button with an action attached.

Actions

buttonize

Add button interaction classes to an element.

Actions

confirm

Show a JavaScript confirm message and on confirmation triggers one or more actions and/or sends a postback to the server.

Actions

dialog

Opens a dialog with a predefined HTML content and title.

Actions

dialog_close

Closes a dialog. When there is no dialog open then nothing happens.

Actions

dialog_open

Renders a template on the server and opens a dialog with the HTML output of the template.

Actions

disable

Sets the “disabled” attribute of a HTML tag and adds the CSS class “disabled”.

Scomp

draggable

Mark a html element as draggable.

Scomp

droppable

Mark an element as valid drag destination.

Actions

effect

Run a jQuery UI effect on the target element.

Actions

enable

Resets the “disabled” attribute of a HTML tag and removes the CSS class “disabled”.

Actions

fade_in

Show an element by animating the opacity.

Actions

fade_out

Hide an element by animating the opacity.

Actions

focus

Add a $(..).focus() jQuery call to the target element to give it input focus.

Actions

growl

Show a message in the upper right corner of the browser window. The message will automatically disappear after some time.

Developer guide

Handle a browser event with a wire

Use scomp#wire to connect a browser event to an action or a server postback. Give the target element a stable ID within the rendered page.

Actions

hide

Hide an element without any animation.

Actions

jquery_effect

Trigger various jQuery effects on the target element. Mostly, each of these effects have their own action as a shortcut, for example action#show, action#hide.

Actions

mask

Places a mask over an element, useful for blocking user interaction during lengthy postbacks.

Actions

mask_progress

Sets the progress bar of an action#mask.

Cotonic models

model/wires Cotonic

model/wires Connects Cotonic messages to named Zotonic events through the wires script.

Modules

mod_wires

Actions, tags (also known as screen components), and javascript for user interfaces using wires .

Actions

move

Move the target element by appending it to another element.

Actions

overlay_close

Closes the currently open overlay. When there is no overlay open then nothing happens.

Actions

overlay_open

Renders a template on the server and opens a full screen overlay with the HTML output of the template.

Actions

remove

Remove an element from the page.

Actions

remove_class

Remove a CSS class from an HTML element.

Actions

set_class

Set the class of an element.

Actions

show

Show an element without any animation.

Actions

slide_down

Show an element by animating the height.

Actions

slide_fade_in

Show an element by animating the height and opacity.

Actions

slide_fade_out

Hide an element by animating the height and opacity.

Actions

slide_toggle

Toggle an element by sliding it up and down.

Actions

slide_up

Hide an element by animating the height.

Scomp

sortable

Mark an element as sortable.

Scomp

sorter

A sorter is a container for sortables.

Actions

toggle

Toggle the visibility of an element.