client modal

Functions

show(title, content, onDismiss, buttons])

Most basic usage of modal. In effect, it does the same as window.alert(). It grays out the screen and places a notification on top with a dismiss button.

You can supply:

• title: Sets a title on the pop-up
• content: The body of the modal. Can be a simple string or a function describing a more complex dom structure.
• onDismiss: A callback function.
• buttons: An array of buttons. Each odd element is the name of the button, and the even element is the content. Per default there is an "OK" button.

The most simple usage is to supply just a string:

Dom = require 'dom'
Modal = require 'modal'
Ui = require 'ui'

Dom.section !->
	Ui.bigButton "click me", !->
		Modal.show "In your face!"
		log "code execution does NOT halt."

More advanced usage example:

Dom = require 'dom'
Modal = require 'modal'
Ui = require 'ui'

Dom.section !->
	Ui.bigButton "click me", !->
		Modal.show "Did you consider the following?"
			, !->
				Dom.p !->
					Dom.style fontStyle: "italic"
					Dom.text "There is a theory which states that if ever anyone discovers exactly what the Universe is for and why it is here, it will instantly disappear and be replaced by something even more bizarre and inexplicable. There is another theory which states that this has already happened."
				Dom.p !->
					Dom.style textAlign: "right"
					Dom.text "--Douglas Adams"
			, (value) !->
				log "User dismissed the modal using button: "
				log value
			, ['ah', "Ah, yes...", 'quite', "Quite"]

confirm(title, content, onContinue, buttons)

Works like show, but has a cancel button, that takes the user back and does not trigger the callback function.

Note, even if you supply a custom array of buttons, the cancel button will always exist (in addition to your own defined buttons)

Example:

Dom = require 'dom'
Modal = require 'modal'
Ui = require 'ui'

Dom.section !->
	Ui.bigButton "click me", !->
		Modal.confirm "Please confirm."
			, "Are you sure you want to create a happening with James Blunt?"
			, (value) !->
				log "User confirmed the modal."

prompt(question, cb, content)

A more streamlined function than Form.prompt(). It pop-ups a modal with a single input field and calls a callback function when the user taps ok.

• question: Sets the title of the modal.
• cb: Callback function. One parameter is provided, containing the user input.
• text: optional, you can provide a body text to further instruct the user.

Example:

Dom = require 'dom'
Modal = require 'modal'
Ui = require 'ui'

Dom.section !->
	Ui.bigButton "click me", !->
		Modal.prompt "How old are you?"
			, (value) !->
				log "User entered: "
				log value
			, "You are allowed to be vague about it."