/*
 * variable declares
 */
var error_msg_class_name = "invalid-feedback-msg";
var $chat_m = $('#chat-modal');
var $chat_form = $('#chat-modal #chat-form');
var $email_m = $('#email-modal');
var $email_form = $('#email-modal #email-form');
var gcaptcha_response = '';
var chat_recapcha;
var email_recapcha;

var onloadCallback = function() {
    // Renders the HTML element with id 'example1' as a reCAPTCHA widget.
    // The id of the reCAPTCHA widget is assigned to 'widgetId1'.
    chat_recapcha = grecaptcha.render('chat_recaptcha', {
        'sitekey' : '6LfwCjoUAAAAAHm_ndbHSPAmsLZRGH9TL2A-MOkP',
    });
    // email_recapcha = grecaptcha.render('email_recaptcha', {
    //     'sitekey' : '6LfwCjoUAAAAAHm_ndbHSPAmsLZRGH9TL2A-MOkP'
    // });
};

$(document).ready(function() { // document ready

    /*
     * form resets
     */
    $chat_m.on('hide.bs.modal', function(){ // reset form validation on modal close
    	$chat_form.validate().resetForm();
    	$chat_form.find('.form-group .form-control').val('');
    	$chat_form.find('.'+error_msg_class_name).remove();
    });

    $email_m.on('hide.bs.modal', function(){ // reset form validation on modal close
    	$email_form.validate().resetForm();
    	$email_form.find('.form-group .form-control').val('');
    	$email_form.find('.'+error_msg_class_name).remove();
    });


    /*
     * chat form functions
     */
    var options = {
        height: 400, // sets the height in pixels of the window.
        width: 750, // sets the width in pixels of the window.
        toolbar: 0, // determines whether a toolbar (includes the forward and back buttons) is displayed {1 (YES) or 0 (NO)}.
        scrollbars: 0, // determines whether scrollbars appear on the window {1 (YES) or 0 (NO)}.
        status: 0, // whether a status line appears at the bottom of the window {1 (YES) or 0 (NO)}.
        resizable: 1, // whether the window can be resized {1 (YES) or 0 (NO)}. Can also be overloaded using resizable.
        left: 0, // left position when the window appears.
        top: 0, // top position when the window appears.
        center: 0, // should we center the window? {1 (YES) or 0 (NO)}. overrides top and left
        createnew: 0, // should we create a new window for each occurance {1 (YES) or 0 (NO)}.
        location: 0, // determines whether the address bar is displayed {1 (YES) or 0 (NO)}.
        menubar: 0 // determines whether the menu bar is displayed {1 (YES) or 0 (NO)}.
    };

    var parameters = "location=" + options.location +
        ",menubar=" + options.menubar +
        ",height=" + options.height +
        ",width=" + options.width +
        ",toolbar=" + options.toolbar +
        ",scrollbars=" + options.scrollbars +
        ",status=" + options.status +
        ",resizable=" + options.resizable +
        ",left=" + options.left +
        ",screenX=" + options.left +
        ",top=" + options.top +
        ",screenY=" + options.top;

    $chat_m.find('button.start').click(function(e) {
        e.preventDefault();
	    // $chat_form.submit();
        if($chat_form.valid()) {
	        window.open($chat_form.attr('action'), $chat_form.attr('target'), parameters);
	        $chat_form.submit();
            $chat_m.modal('hide');
        }
    });
    $chat_form.validate({
        ignore: ".ignore",
        rules: {
            user: {
                required: true
            },
            email: {
                email: true
            },
            subject: {
                required: true
            },
            chat_recaptcha: {
                required: function() {
                   if(grecaptcha.getResponse(chat_recapcha) == '') {
                       return true;
                   } else {
                       return false;
                   }
               }
            },
        },
        errorPlacement: function(error, element) {
        	var markup = '<div class="'+error_msg_class_name+'">'+error.text()+'</div>';
        	if( element.next().hasClass(error_msg_class_name) ) { // if has error message already, replace it with new message
        		element.next().replaceWith(markup);
        	}
        	else { // new
            	element.after(markup);
        	}
        },
        onfocusout: function(element, event){
            return removeMessageOnValid(element, event);
        },
    });

    /*
     * email form functions
     */
    $email_form.find('button.send').click(function(e){

        if($email_form.valid()) {$email_form.submit(email_for_submit_handler);}
    });
    $email_form.validate({
        ignore: ".ignore",
    	rules: {
    	    user: {
    	        required: true
    	    },
    	    email: {
    	        email: true
    	    },
    	    subject: {
    	        required: true
    	    },
            email_recaptcha: {
                required: function() {
                    if(grecaptcha.getResponse(email_recapcha) == '') {
                        return true;
                    } else {
                        return false;
                    }
               }
            },
    	},
    	errorPlacement: function(error, element) {
    		var markup = '<div class="'+error_msg_class_name+'">'+error.text()+'</div>';
    		if( element.next().hasClass(error_msg_class_name) ) { // if has error message already, replace it with new message
    			element.next().replaceWith(markup);
    		}
    		else { // new
    	    	element.after(markup);
    		}
    	},
        onfocusout: function(element, event){
            return removeMessageOnValid(element, event);
        },
    });


});
/*
 * on load functions
 */
removeMessageOnValid = function(element, event) {
    isValidEle = $(element).valid(); // validate field on blur
    if(isValidEle) { // remove message if field is valid
        if ($(element).next().hasClass(error_msg_class_name)) {$(element).next().remove();}
    }
}

email_for_submit_handler = function(e) {
    e.preventDefault();
    var postData = $(this).serializeArray();
    $.ajax({
        url: 'https://chat.cityfoneservices.net/email',
        type: 'POST',
        data: postData,
    })
    .done(function() {
        $email_form.find('.modal-body .send-message-body').hide(); // hide form body
        $email_form.find('.modal-body .send-message-body-sent').show(); // show thank you message
        $email_form.find('.modal-footer.send-message-buttons').hide(); // hide form buttons
        $email_form.find('.modal-footer.send-message-buttons-sent').show(); // show close button
        set_recapcha_response('');
    })
    .fail(function() {console.log("error");})
    .always(function() {console.log("complete");});
}

function set_recapcha_response(res) {
    window.gcaptcha_response = res;
}