!(function(){
    /**
     * @class  Change password form
     * @requiresDOM .notificationsContainer
     * @requires portalGGA.utils.globalErrorNotifier
     * @author Siva.Nanduri@gtechg2.com
     * @author Tomek.Wytrebowicz@gtech.com
     * @author Michal.Kunikowski@gtech.com
     * @extends {Backbone.View}
     * @view
     */
    portalGGA.views.ForgotPassword = Backbone.View.extend(
    /** @lends  portalGGA.views.ForgotPassword.prototype */{
        /** {jQuery} current step */
        currentStep: 0,

        /** {jQuery} collection of all step containers */
        steps: null,

        events:{
            "submit #emailForgotPasswordForm": "retrieveSecurityQuestion",
            "submit #confirmForgotPasswordForm": "confirmForgotPasswordForm"
        },
        /**
         * [constructor description]
         * @param {Object} [options] (see {@link Backbone.View.constructor})
         * @param {portalGGA.models.player.ForgottenPassword} [options.forgottenPassword] If none given, `new portalGGA.models.player.ForgottenPassword` will be used.
         * @param {portalGGA.models.player.SecurityQuestions} [options.securityQuestions] If none given, `new portalGGA.models.player.SecurityQuestions` will be used.
         * @param {Object} [options.dictionary] Dictionary to map back-end security questions' names.
         */
        constructor: function ForgotPasswordView(options) {
            Backbone.View.apply(this, arguments);
            this.securityQuestions = options.securityQuestions || new portalGGA.models.player.SecurityQuestions;
            this.model = options.forgottenPassword || new portalGGA.models.player.ForgottenPassword();
            this.dictionary = options.dictionary || {};             

            this.steps = this.$('.forgotPasswordStep');
            this.$('.panel-title a').on('click',function(e){e.preventDefault(); });
            
            
              jQuery.validator.setDefaults({
                    highlight: function(element, errorClass, validClass) {
                        if (element.type === "radio" || element.type === "checkbox") {
                            this.findByName(element.name).addClass(errorClass).removeClass(validClass);
                        } else if ($(element).parent().hasClass('input-inline') || $(element).parent().hasClass('input-group')) {
                            $(element).closest('.form-group').addClass('has-error');
                        } else {

                            $(element).closest('.form-group').removeClass('has-success has-feedback').addClass('has-error has-feedback').find('span').remove();
                            $(element).closest('.form-row').find('span').remove(); 
                            $(element).parent().find('span.glyphicon').remove();
                            //$('<span class="icon-error form-control-feedback"></span>').insertAfter(element);
                        }
                    },   
                    unhighlight: function(element, errorClass, validClass) {
                        if (element.type === "radio" || element.type === "checkbox") {
                            this.findByName(element.name).removeClass(errorClass).addClass(validClass);
                        } else if ($(element).parent().hasClass('input-inline') || $(element).parent().hasClass('input-group')) {
                            $(element).closest('.form-group').removeClass('has-error');
                        } else {
                         $(element).closest('.form-group').removeClass('has-error has-feedback').find('span').remove();  
                         $(element).closest('.form-group').find('.error').remove();  
                         
                       
                         /* $(element).closest('.form-group').removeClass('has-error has-feedback').addClass('has-success has-feedback').find('span').remove();
                            $(element).parent().find('span.glyphicon').remove();
                            $('<span class="icon-success form-control-feedback"></span>').insertAfter(element); */ 
                        }
                    }, 
                    errorPlacement: function(error, element) {
                        if (element.parent('.input-group').length || element.prop('type') === 'checkbox' || element.prop('type') === 'radio') {
                            error.insertAfter(element.parent());
                        } else if ($(element).parent().hasClass('input-inline') || $(element).parent().hasClass('input-group')) {
                            $(element).closest('.form-group').find('>div').append(error);
                        } else {
                            error.insertAfter(element);
                        }
                    } 
                });  
                
                     $('#emailForgotPasswordForm').validate({});       

            //this.$el.find('.fp-step1').show();
            //this.$el.find('.fp-step2').hide();


            // Backbone takacares wit POST/PUT
            // sends POST for create and PUT for update,
            // so if backend failed to send us object for GET,
            // it tries to create new one

        },
        /**
         * [serializeEmailForgotPasswordForm description]
         * @return {Object} serialized data
         */
        serializeEmailForgotPasswordForm: function serializeEmailForgotPasswordForm(){
            var serializedData  = portalGGA.utils.forms.serializeJSON.apply(this.$('#emailForgotPasswordForm select, #emailForgotPasswordForm input'));
            serializedData.type = 'email';          
            return serializedData;
        },
        /**
         * [serializeConfirmForgotPasswordForm description]
         * @return {Object} serialized data
         */
        serializeConfirmForgotPasswordForm: function serializeConfirmForgotPasswordForm(){
            var serializedData  = portalGGA.utils.forms.serializeJSON.apply(this.$('#confirmForgotPasswordForm select,#confirmForgotPasswordForm input'));          
            return serializedData;
        },
        /**
         * [_reset description]
         * @TODO return something (twytrebowicz)
         * @TODO  scope! (twytrebowicz)
         */
        _reset: function _reset(){
                this.$('form').each(function resetForm(){ this.reset(); });                
        },
        /**
         * [_changeStep description]
         * @param  {Event} event     DOM event, not used
         * @param  {Number} direction direction in which change steps
         * @return {portalGGA.views.ForgotPassword}           self
         */
        _changeStep: function _changeStep( event, direction ){
            portalGGA.utils.globalErrorNotifier.clear();
            direction = direction || +1;
            var self = this;
            /*this.steps.eq( this.currentStep ).fadeOut(function(){
                self.steps.eq( self.currentStep+direction ).fadeIn();
                self.currentStep = self.currentStep+direction;
              }); */              
            self.$('#forgotPassword1').collapse('hide');
            self.$('[href="#forgotPassword1"]').closest('.panel-heading').removeClass('active');
            self.$('#forgotPassword2').collapse('show');
            self.$('[href="#forgotPassword2"]').closest('.panel-heading').addClass('active');
            self.$('[href="#forgotPassword1"]').on('click',function(e){
                e.preventDefault();
                self.$(' #forgotPassword2').collapse('hide');
                self.$(' #forgotPassword1').collapse('show');
                self.$('.panel-heading').removeClass('active');
                self.$('[href="#forgotPassword1"]').closest('.panel-heading').addClass('active');
                self.$('[href="#forgotPassword1"]').unbind();

            });
            return this;
        },
        /**
         * [_populateResults description]
         * @param  {String} emailAddress user email address
         * @TODO return something (twytrebowicz)
         */
        _populateResults: function _populateResults(emailAddress){
            console.info('_populateResults', this, arguments);
            var self = this;
            var rows = "";
            if(this.securityQuestions.length){
                for(var i=0; i<this.securityQuestions.length; i++  ){
                    var question = this.securityQuestions.models[i].toJSON();
                    //Show translated question, or question key, if translation is missing
                    question.question = this.dictionary[question.question] || question.question;
                    rows += fpSecurityQuestionTemplate( question );
                }
            }
            this.$('.fp-sequrityQuestionResult').html(rows);
            console.info("_populateResults " + emailAddress, this, arguments);
            //this.$('#fp-emailAddress').val(emailAddress);
            this.model.set({'emailAddress' : emailAddress});
            //this.$('#fp-step1').fadeOut(function() {self.$('#fp-step2').fadeIn();});
            this._changeStep();         
        },


        /**
         * Perform form validation, if passed save new password in ESA, show message in #errorNotifier 
         * @param  {Event} e    DOM event to prevent
         * @param  {Object} [data] ForgotPasswordForm data, if not given #serializeEmailForgotPasswordForm will be used.
         * @TODO return something (twytrebowicz)
         */
        retrieveSecurityQuestion: function retrieveSecurityQuestion(e, data){
            if(!$('#emailForgotPasswordForm').valid()){
                return false;
            }
            e.preventDefault(); 
            portalGGA.utils.globalErrorNotifier.clear();
            var self = this,
                data = data || this.serializeEmailForgotPasswordForm();
            
            this.securityQuestions.fetch( {data: data } )
            .done($.proxy( this._populateResults, this, data.name) //makesure that 'this' is view instance
            ).fail(function success(reason){
                console.warn("Error", this, arguments);
                reason = $.parseJSON(reason.responseText);
                portalGGA.utils.globalErrorNotifier.show(reason,"alert-danger");
                return reason;
            });
                        
        },
        /**
         * [confirmForgotPasswordForm description]
         * @param  {Event} e    default event to be blocked
         * @return {$.Promise | Boolean}      Promise for model to be set, or false if form is invalid.
         *                                      *resolves with response, or reason.
         */
        confirmForgotPasswordForm: function retrieveSecurityQuestion(e){
            if($('#confirmForgotPasswordForm').valid()){
                e.preventDefault(); 
                portalGGA.utils.globalErrorNotifier.clear();
                var self = this;
                var  button = this.$('#forgotPwdSubmit');
                button.button('loading');
                return this.model.set( this.serializeConfirmForgotPasswordForm())
                            .save()
                            .done(function success(response){
                                console.info("Succeess", this, arguments);
                                button.button('reset');
                                self.$('.fp-emailAddress').text($.parseJSON(this.data).emailAddress);
                                self. $('.panel-heading').removeClass('active').addClass('disabled');
                                self.$('[href="#forgotPassword3"]').closest('.panel-heading').removeClass('disabled').addClass('active');
                                self.$('.panel-heading a').removeAttr("href");
                                self.$('.panel-heading a').unbind();
                                self.$('.panel-collapse').collapse('hide');
                                self.$('[href="#forgotPassword3"]').closest('.panel-heading').removeClass('disabled').addClass('active');
                                self.$('#forgotPassword3').collapse('show');
                                //portalGGA.utils.globalErrorNotifier.show('forgotpassword.success', 'alert-success');
                                return response;
                            })
                            .fail(function success(reason){
                                console.warn("Error", this, arguments);
                                button.button('reset');
                                reason = $.parseJSON(reason.responseText);
                                if(reason.code == 'Security hint answer incorrect'){
                                        var errorMsg = CQ.I18n.getMessage("forgotPassword.errorMsg")+' Attempts('+reason.invalidAttempts+'/5).';
                                    }
                                else {
                                        var errorMsg = CQ.I18n.getMessage(reason.code);
                                      }
                                self._reset();
                                self._changeStep(e,-1);
                                portalGGA.utils.globalErrorNotifier.show(errorMsg,"alert-danger");
                                return reason;
                            });
            }
            else{
                return false;
            }
        }

    });

}());