/*
// Example:
$.floatMessanger({
    title: '訊息說明',
    message: '我們會立刻使用您所指定的方式，將您的登入密碼傳送給您！<br/>若您還有任何問題，也歡迎您隨時與客服人員聯繫！',
    form: '<dl><dt>請輸入您的姓名，以便系統再次核對您的身分！</dt><dd>您的姓名：<input type="text" value="" /><label><input name="mid" type="radio" checked="checked" />小姐</label><label><input name="mid" type="radio" />先生</label></dd></dl>',
    buttons: {
        '回上一頁': function () { alert('test'); },
        '聯絡客服': function () { alert('abc'); }
    }
});
*/
;(function($) {

var $$ = $.floatMessanger = function(settings) {
    var _defaultSettings = {
        title: 'Oops!',
        message: '',

        // 設定訊息位置，預設置左
        messageAlign: 'left',
        // 設定關閉鈕，預設開啟
        closeButton: true,

        form: '',
        action: '',
        buttons: {}
    };
    var _settings = $.extend(_defaultSettings, settings);
    var _close = '<a href="#" class="closeFloatMessanger">X</a>';
    var _title = '<h2>' + _close + _settings.title + '</h2>';
    var _message = '<blockquote><span>' + _settings.message + '</span></blockquote>';
    var _form = '<form action="' + _settings.action + '" method="post">' + _settings.form + '</form>';

    var $html = $($$.header + _title + _message + _form + $$.footer);
    $('h2', $html).css('textAlign', 'left');

    // 設定訊息位置
    $('blockquote', $html).css('textAlign', _settings.messageAlign);

    var $buttons = $('<div class="btnGroup"></div>');
    $('td.msg_inner > div > form', $html).css('textAlign', 'left').append($buttons);
    for (var text in _settings.buttons) {
        var $button = $('<input type="button" value="' + text + '" />').addClass('inputBtn').click(_settings.buttons[text]);
        $buttons.append('&nbsp;');
        $buttons.append($button);
    }

    var _bodyHeight = $('body').height();
    var _bodyWidth  = $('body').width();
    var _width  = 460;
    var _height = $('#msg').height();
    var _top = 160;
    var _left = (_bodyWidth - _width) / 2;

    $.blockUI({
        message: $html,
        css: {
            border: 'none',
            margin: 0,
            padding: 0,
            cursor: 'default',
            width: '460px',
            top: _top + 'px',
            left: _left + 'px',
            background: 'none'
        }
    });

    // 判斷關閉鈕是否開啟
    if (!_settings.closeButton) {
        $('.closeFloatMessanger').hide();
    }

    $('.closeFloatMessanger').css({
        cursor: 'pointer'
    }).click(function () {
        $.unblockUI();
        return false;
    });
};

$$.header = '<table id="msg" style="display:none;"><tr><td width="8" class="msg_tl">&nbsp;</td><td rowspan="3" valign="top" class="msg_inner"><div>';

$$.footer = '</div></td><td width="8" class="msg_tr">&nbsp;</td></tr><tr><td class="msg_l">&nbsp;</td><td class="msg_r">&nbsp;</td></tr><tr><td class="msg_l2">&nbsp;</td><td class="msg_r2">&nbsp;</td></tr><tr><td class="msg_bl">&nbsp;</td><td class="msg_b">&nbsp;</td><td class="msg_br">&nbsp;</td></tr></table>';

})(jQuery);