// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults
var BTTB = BTTB || {};
jQuery(function () {
    BTTB.cloud.initialize();
});

BTTB.cloud = (function ($) {
    var that = {};

    /* public functions */
    that.initialize = function () {
        $('body').addClass('js');
        BTTB.dialog.initialize();
        BTTB.account.initialize();
        BTTB.topics.initialize();
    };


    return that;
}(jQuery));

BTTB.topics = (function ($) {
    var that = {};

    that.initialize = function() {
        makeTopicListAccordian();
    };

    function makeTopicListAccordian() {
        $('#topics').accordion({
            active: false,
            header: "h3",
            collapsible: true,
            autoHeight: false
        });
    }

    return that;
}(jQuery));

BTTB.account = (function ($) {
    var that = {};

    that.initialize = function () {
        //makeLoginModal();
        //makeSignupModal();
        //makeForgotModal();
        that.addPasswordStrengthMeter();
    };

    that.addPasswordStrengthMeter = function () {
        $('#user_password').pstrength({
            'displayMinChar' : false,
            'colors': ["#f00", "#f60", "#f60", "#2D7714", "#2D7714"],
            'verdicts': ["Too Weak", "Okay", "Okay", "Better", "Very Secure"],
            'scores': [24, 24, 30, 40],
            'minChar' : 6
        });
    };

    function makeForgotModal() {
        $('.forgot-pass-link').live('click', function() {
            var $dialog = BTTB.dialog.$dialog;
            $dialog.dialog('option', 'title', $(this).text());
            $dialog.empty().load($(this).attr('href') + ' .forgot-form',
                function() {
                    BTTB.dialog.ajaxifyForms({
                        checkFor : '.forgot-form',
                        onSuccess : function (txt) {
                            $txt = $('<div/>')
                                .append(txt
                                    .replace(/<script(.|\s)*?\/script>/g, ""));
                            $dialog.html($txt.find('#content *'));
                        }
                    });
                }
            );
        });
    }

    function makeSignupModal() {
        $('.signup-link').click(function() {
            var $dialog = BTTB.dialog.$dialog;
            $dialog.dialog('option', 'title', $(this).text());
            $dialog.empty().load($(this).attr('href') + ' .signup-form',
                function() {
                    that.addPasswordStrengthMeter();
                    BTTB.dialog.ajaxifyForms({
                        checkFor : '.signup-form',
                        onSuccess : function (txt) {
                            $txt = $('<div/>')
                                .append(txt
                                    .replace(/<script(.|\s)*?\/script>/g, ""));
                            $dialog.html($txt.find('#content *'));
                        }
                    });
                }
            );
            $dialog.dialog('open');
            return false;
        });
    }
    
    function makeLoginModal() {
        $('.login-link').click(function() {
            var $dialog = BTTB.dialog.$dialog;
            $dialog.dialog('option', 'title', $(this).text());
            $dialog.empty().load($(this).attr('href') + ' .login-form',
                function() {
                    BTTB.dialog.ajaxifyForms( {checkFor : '.login-form' } );
                }
            );
            $dialog.dialog('open');
            return false;
        });
    }

    return that;
}(jQuery));

BTTB.dialog = (function ($) {
    var that = { };

    that.initialize = function () {
        createDialog();
    };

    /* I think this might be generalized enough to use on most dialog forms.
     *
     *  accepts: a hash of values
     *      checkFor : CSS selector for element to see if exists in response.
     *          If it does exist, we want to display the response in the dialog.
     *          Default : 'div#txt' which will always be found
     *      extractElement : This is a CSS selector to tell which element to
     *          extract from response and display in dialog.
     *          Default : checkFor
     *      onSuccess : callback called when checkFor doesn't exist in response.
     *          Default : reload current page (of parent not dialog)
     */
    that.ajaxifyForms = function(opts) {
        opts = opts || {};
        opts.checkFor = opts.checkFor || 'div#txt';
        opts.extractElement = opts.extractElement || opts.checkFor;
        opts.onSuccess = opts.onSuccess ||
            function (txt) { window.location.href=window.location.href; };

        that.$dialog.find('form').ajaxForm({
            beforeSubmit : function () {
            },
            success : function(txt) {
                $txt = $("<div/>").append("<div id='txt'></div>");
                $txt.find('#txt')
                    .append(txt.replace(/<script(.|\s)*?\/script>/g, ""));
                // if checkFor element exists re-display response from form
                if ($txt.find(opts.checkFor).size() !== 0) {
                    that.$dialog.html($txt.find(opts.extractElement));
                    that.ajaxifyForms(opts);
                }
                // if element doesn't exist do this
                else {
                    opts.onSuccess(txt);
                }
            }
        });
    };

    // create stub div for dialog and create dialog with default options
    function createDialog() {
        if ($("#dialog").size() === 0) {
            $("body").append("<div id='dialog'></div>");
        }
        that.$dialog = $('#dialog');
        that.$dialog.dialog({
            autoOpen: false,
            bgiframe: true,
            modal: true,
            draggable: false,
            resizable: false,
            // if position changed to center and you update content of dialog
            // you have to close / open the dialog to re-center
            position: 'top',
            width: 500
        });
    }

    return that;
}(jQuery));
