/// <reference path="../jquery-1.6.1.min.js" />
/// <reference path="../jquery-ui-1.8.11.custom.min.js" />
/// <reference path="../Controls.js" />
/// <reference path="../jQuery.tmpl.js" />
/// <reference path="../../Services/IStateDataService.cs" />

(function ($) {
    $.fn.login = function (options) {
        var template =
            '<div id="login"> \
                <div class="row loginError displayNone" id="loginError"> \
                </div> \
                <div class="row"> \
                    <div class="eight columns"> \
                        <div class="orange title"> \
                            New Users</div> \
                        <div class="content"> \
                            If this is your first time using the Learning Bridges System, please register using \
                            the button below.</div> \
                        <div> \
                            <div class="centered"> \
                                <a class="formButton" id="btnRegister"><span class="outer">New User</span></a></div> \
                        </div> \
                    </div> \
                    <div class="eight columns"> \
                        <div class="purple title"> \
                            Current Users</div> \
                        <div class="row"> \
                            <div class="content"> \
                                <div class="eight columns"> \
                                    <label for="txtEmail"> \
                                        Email:</label> \
                                    <input id="txtEmail" /> \
                                </div> \
                                <div class="eight columns"> \
                                    <label for="txtPassword"> \
                                        Password:</label> \
                                    <input id="txtPassword" type="password" /></div> \
                            </div> \
                            <div class="centered"> \
                                <a class="formButton" id="btnLogin"><span class="outer">Login</span></a> \
                            </div> \
                            <div class="centered forgotPassword"> \
                                <a id="passwordRecovery">Forgot password?</a></div> \
                        </div> \
                    </div> \
                </div> \
            </div>';

        var resetTemplate =
            '<div id="reset"> \
                <div class="row"> \
                    Please enter your email address and press the Submit button below. We will send you an email with instructions on how to reset your password. \
                </div> \
                <div class="row"> \
                    If you need additional help, please contact <a href="mailto:support@learningbridges.com">support@learningbridges.com</a>. \
                </div> \
                <div class="row"> \
                    <label for="txtEmailReset">Email:</label> \
                    <input id="txtEmailReset"> \
                </div> \
                <div class="row"> \
                    <div id="emailResetValidation" class="validator displayNone"> \
                        Email must be in form the email@domain.com. \
                    </div> \
                </div> \
                <div class="row"> \
                    <a class="formButton" id="cancel"><span class="outer">cancel</span></a> \
                    <a class="formButton" id="resetPassword"><span class="outer">Reset</span></a> \
                </div> \
            </div>';

        var validations = [];
        var resetValidations = [];

        $.template('resetTemplate', resetTemplate);
        $.template('loginTemplate', template);

        var $this = this;
        var $loginDialog = null;
        var $resetDialog = null;

        var settings = {
            complete: null,
            login: login,
            location: '/Account/MainPage.aspx'
        };

        var methods = {
            complete: function () {
                if (settings.complete) {
                    settings.complete();
                }
            },
            login: function () {
                if (settings.login) {
                    settings.login();
                }
            }
        };

        return this.each(function () {

            if (options) {
                $.extend(settings, options);
            }

            showLogin();
        });

        function showLogin() {

            if ($loginDialog) {
                $this.dialog('show');
            }
            else {
                $this.html('');
                $loginDialog = $.tmpl('loginTemplate').appendTo($this);

                $loginDialog.find('#btnLogin').click(methods.login);
                $loginDialog.find('#btnRegister').click(register);
                $loginDialog.find('#passwordRecovery').click(recoverPassword);

                $this.dialog({ width: 660, modal: true, draggable: false, resizable: false });
            }
        }

        function login() {
            var email = $this.find('#txtEmail').val();
            var password = $this.find('#txtPassword').val();

            LB.IUserDataService.Login(email, password, loginResult, loginError);

        }

        function loginResult(result) {
            if (result) {
                $('#loginError').html('');
                $('#loginError').animate({ height: 0 }, 500, hide);
                window.location = settings.location;
            }
            else {
                loginError('Email or Password  is incorrect.');
            }
        }

        function loginError(exception) {
            var message = exception;
            var $error = $('#loginError');
            $error.html(message);
            display();
            $error.animate({ height: 30 }, 500);

        }

        function display() {
            toggleDisplay(true);
        }
        function hide() {
            toggleDisplay(false);
        }

        function toggleDisplay(toggle) {
            var $error = $('#loginError');
            if (toggle) {
                $error.removeClass('displayNone');
            }
            else {
                $error.addClass('displayNone');
            }
        }

        function register() {
            var url = '/Account/Register.aspx';

            if (options.location)
                url += '?ReturnURL=' + settings.location;

            window.location = url;
        }

        function recoverPassword() {

            if ($resetDialog) {
                $resetDialog.dialog('open');
            }
            else {
                var $html = $.tmpl('resetTemplate');
                $resetDialog = $html.appendTo($this).dialog({ title: 'Password Reset', autoOpen: false, width: 600, draggable: false, resizable: false });
                $resetDialog.find('#cancel').click(function () { $resetDialog.dialog('close'); });
                $resetDialog.find('#resetPassword').click(resetPassword);

                var validation = new Validation('txtEmailReset', 'emailResetValidation', ValidateEmail);
                validation.InitValidation();
                resetValidations.push(validation);


                $resetDialog.dialog('open');
            }
        }

        function resetPassword() {
            if (Validate(resetValidations)) {
                var email = $resetDialog.find('#txtEmailReset').val();
                LB.IUserDataService.SendResetPasswordEmail(email, resetResult, function (exception) { HandleException(exception); resetResult(); });
            }
            else {
                setTimeout(function () { ToggleDropIn(false); }, 3000);
            }
        }

        function resetResult() {
            $resetDialog.dialog('close');
        }
    }

})(jQuery);