jQuery UI の Dialog を使って確認用モーダルダイアログを実装するには

jQuery UI (http://ui.jquery.com/) には便利なコンポーネントがある。このダイアログを使ってユーザーへの確認に使うモーダルダイアログを作りたい。
設定仕様に幅がある分、わかりずらいところがある。ということで下記のように手軽に使える用に関数を作ってみた。

/*
 * 確認ダイアログ
 *
 * message      : ダイアログのメッセージ本文
 * title        : ダイアログのタイトル
 * buttonok     : OKボタンのテキスト
 * buttoncancel : キャンセルボタンのテキスト
 * response     : コールバック関数を指定する。引数 cancel にボタン選択の結果が入る。
 *                OK ならば false キャンセルならば true となる。
 */
function confirmDialog(message, title, buttonok, buttoncancel, response){
  var _dlg = $('<div>'+message+'</div>');
  var _buttons = {};
  _buttons[buttonok] = function(){$(this).dialog('close');response(false)};
  _buttons[buttoncancel]  = function(){$(this).dialog('close');response(true)};
  
  _dlg.dialog({
    modal:true,
    draggable:false,
    title:title,
    height:130,
    width:320,
    buttons:_buttons,
    overlay:{ opacity:0.3, background:'#225B7F' }
  });
}

/* Sample */
confirmDialog('この処理を続行しますか？', '確認', 'OK', 'キャンセル',
      function(cancel){
        if (cancel) return;
          /*------------
            処理を書く
           ------------*/
      });

ダイアログのベースとなる div は Document DOM ツリーに存在していなくてもいいので生成して、dialog() を呼び出すだけで動く。これは便利だ。dialog の引数で様々な設定が可能である。上記の例では見た目を一つのアプリで統一するので幅、高さなど固定で定義している。あとは modal 化と背景がクリックできないことを明示するために overlay を設定している。
ちょっとわかりづらいのは、buttons で表示ボタンがという設定できるのだが、ボタンのラベル値がキーであり、対となる値が選択時に走る関数の定義となるところだ。定義の例では、ボタン名としてキーを変数値にしたいために map[key] = func としてセットしている。