Spawning a Dialog

Now that you have successfully created a dialog, you need a way to open it from within the application. There are primarily two different ways to open a dialog:

• manually constructing a link via HTML and Javascript
• in response to a user clicking on a menu item in Movable Type’s main navigation

Opening a Dialog from a Link

To cause a link to open a dialog over the content or page the user is currently viewing, a little javascript is required. The javascript function that needs to be called is openDialog which is loaded for you automatically on every page inside the Movable Type application. The openDialog javascript function takes three parameters:

• source - this parameter is present for backwards compatibility purposes. It is permissible to pass the value null to this input parameter
• mode name - the name of the mode registered with Movable Type that will be invoked. This is the mode name for your dialog as registered within your config.yamlfile.
• query string - any additional parameters you want to pass to the dialog

The following HTML demonstrates how to compose the link and javascript function call:

<a href="javascript:void(0)" 
    onclick="openDialog(null,'<mode name>','<query string>');return false;">
  Link Text
</a>

The URL the dialog will contain is composed by appending the javascript variable ScriptURI, the text ?__mode=, the input parameter mode name, and the text found in the input parameter query string.

Opening a Dialog from the Navigation Menu

Dialogs can be spawned directly from a menu item in the navigation menu, as in the “Upload File” menu item in the Create menu. To spawn a dialog, one would register their menu item using the dialog property as illustrated below:

name: Example Plugin for Movable Type
id: Example
description: This plugin is an example plugin for Movable Type.
version: 1.0
applications:
    cms:
        menus:
            create:launch_dialog:
                label: 'Launch a Dialog'
                dialog: 'launch'
                order: 302
                view: blog