(function ($) {

    ContactModuleView = Backbone.View.extend({

        el: $('.contactModuleWrapper')

		, events: {
		    'click .closebtn': 'closeClickHandler'
			, 'click .submit': 'submitFormHandler'
			, 'click .shade': 'closeClickHandler'
		}

		, initialize: function initialize() {

		    var self = this;

		    _.bindAll(this, 'render', 'openModal', 'openShade', 'closeModal', 'closeShade');

		    this.animateInSpeed = 100;
		    this.animateOutSpeed = 5000;

		    this.shade = $('.shade');
		    this.module = $('.contactModule');

		    this.render();
		    this.positionModal();

		    pubsub.subscribe('ryerson/windowResize', function () {
		        self.positionModal();
		    });
		}

		, render: function render() {

		    var self = this
				, documentHeight = $(document).height();

		    this.el.css('display', 'block');

		    this.shade.css({
		        opacity: 0
				, display: 'block'
				, height: documentHeight
		    });

		    this.module.css({
		        opacity: 0
				, display: 'block'
		    });

		    this.openModal();
		}

		, positionModal: function positionModal() {

		    var modalWidth = this.module.width()
				, windowWidth = $(window).width()
				, xPos = (windowWidth - modalWidth) / 2;

		    this.module.css('left', xPos);
		}

		, closeClickHandler: function closeClickHandler(ev) {

		    ev.preventDefault();

		    this.closeModal();
		}

		, submitFormHandler: function submitFormHandler(ev) {
		    var self = this;
		    ev.preventDefault();
		    $(".has-error").removeClass("has-error");

		    // Get fields
		    var btn = $(ev.currentTarget),
				form = $(btn).parents("#contactform"),
				required = $(".required", form),
				error = false;

		    // Check required values
		    $.each(required, function (index, element) {
		        if ($(element).val() == null || $(element).val() == "") {
		            $(element).addClass("has-error");
		            error = true;
		        }
		    });

		    if (error) {
		        $(form).addClass("has-error");
		        $(".form-message", form).addClass("has-error").html($('#requiredFieldsErrorMessage').html());
		        return;
		    }

		    // Check for valid email
		    var email = $('#contactEmail');
		    if (!email.val().match(/\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/)) {
		        $(form).addClass("has-error");
		        email.addClass("has-error");
		        $(".form-message", form).addClass("has-error").html($('#invalidEmailErrorMessage').html());
		        return;
		    }

		    var json = JSON.stringify({
		        FirstName: $('#contactFirstName').val(),
		        LastName: $('#contactLastName').val(),
		        Company: $('#contactCompany').val(),
		        Phone: $('#contactPhone').val(),
		        Email: $('#contactEmail').val(),
		        Subject: $('#contactSubject').val(),
		        Message: $('#contactMessage').val()
		    });

		    $.ajax({
		        url: '/Www/Contact/Services/ContactRequest.svc/Submit',
		        data: json,
		        type: 'POST',
		        contentType: "application/json; charset=utf-8",
		        success: function (data, status, xhr) {
		            $(".form-message", form).addClass("success").html(data);
		            var closeDelegate = function () {
		                self.closeModal();
		            }
		            setTimeout(closeDelegate, 3000);
		        },
		        error: function (xhr, status, error) {
		            $(form).addClass("has-error");
		            $(".form-message", form).addClass("has-error").html(error);
		        }
		    });
		}

		, openModal: function openModal() {

		    var self = this;

		    this.shade.animate({
		        opacity: 1
		    }, {
		        duration: 250
				, easing: 'jswing'
				, complete: function complete() {

				    self.openShade();
				}
		    });
		}

		, openShade: function openShade() {

		    var self = this;

		    this.module.animate({
		        opacity: 1
		    }, {
		        duration: 250
				, easing: 'jswing'
				, complete: function complete() {

				}
		    });
		}

		, closeModal: function closeModal() {

		    var self = this;

		    this.module.animate({
		        opacity: 0
		    }, {
		        duration: 150
				, easing: 'jswing'
				, complete: function complete() {

				    self.module.css({
				        display: 'none'
						, opacity: 1
				    });

				    self.closeShade();
				}
		    })
		}

		, closeShade: function closeShade() {

		    var self = this;

		    this.shade.animate({
		        opacity: 0
		    }, {
		        duration: 150
				, easing: 'jswing'
				, complete: function complete() {

				    self.shade.css({
				        display: 'none'
						, opacity: 0
				    });

				    self.el.css('display', 'none');
				}
		    })
		}

    });

} (jQuery));