Rdialog

Simple popup dialog.

Inspired and based on Prototype, Scriptaculous and Popup libraray

• Prototype library: http://www.prototypejs.org/
• Scriptaculous library: http://script.aculo.us/
• Popup library: http;//www.methods.co.nz/popup/popup.html

Informataion

• Version: 0.3
• Author: Kim, Jung Hyun (mail@ikspres.com)
• License: This source code is released under MIT license.

Chagne History

• version 0.3
  • fixed centering rdialogs
  • removed overlay div (transparend background)
  • two skins are provided: default and blue

Basic Usage

(In html head)

Yes!, you need prototype and scriptaculous at first.

<%= javascript_include_tag :defaults %>

and Popup.js (now popup.js is contained in this plugin) (See details of popup.js in http;//www.methods.co.nz/popup/popup.html)

<%= javascript_include_tag 'popup' %>

and lastly, rdialog files.

• javascript <%= javascript_include_tag ‘rdialog’ %>

• for basic skin <%= stylesheet_link_tag ‘rdialog_base’ %> <%= stylesheet_link_tag ‘rdialog_simple’ %>

• or blue skin <%= stylesheet_link_tag ‘rdialog_base’ %> <%= stylesheet_link_tag ‘rdialog_blue’ %>

(In html body)

You may have an trigger to open your rdlg

<button id="opener"> click me to open another</button>

And define your dialog

<% rdialog 'my_dialog', :operner => 'opener', :title => 'Notice', :width => 200 do %>
hello world
It's good day
<button class="rdlg-close"> ok </button>
<% end %>

Or, you may use partial for dialog content

<% rdialog 'my_dialog', :opener => 'opener', :title => 'Notice', :width => 200 do %>
  <%= render :partial => 'my_dialog'
<% end %>

Options

:opener, :title, :width are optional parameters, Without opener is not passed, you can open the popup with the follwoing js code.

'$(my_dialog).popup.show()'

:modal, :duration and :draghandle are options from popup library, set ‘null’ if you want fixed(not draggable) dialog.

Ajaxian Usage

If you want to dynamically change the content of your dialog using ajax. You may do as following.

1. create an emtpy dialog

NOTICE!! It’s not ’<’ but ’<=’

<%= rdialog 'my_dialog' %>

2. Write a remote link or form , to change and show the dialog

<%= link_to_remote 'Somewhere', :url=>{:action => 'some_action'}, 
    :update => 'my_dialog-rdlg-content', 
:complete => "$('my_dialog').popup.show()" %>

Notice that value of :update parameter is <your dialog name> + ‘-rdlg-content’

3. In your action view for ‘some_action’, you may need to change the title or width

<%= rdialog_config 'my_dialog', :title => 'Nice Title', :width => 200 %>

or, you can omit width or title

<= rdialog_config 'my_dialog', :title => 'Nice Title'>

NOTE: This description has been extracted from the Plugin README and so the formatting may need updating to make browser friendly