(function($){
    
    // Collect Social media buttons and redirect to 3rd party on click
    $('#inlog-social-media:not(#inlog-met-ilse)').click(function(){
        var url = $(this).attr('href') + '?keep_logged_in=' + ($('#keep_logged_in').is(':checked') ? 1 : 0);
        $(location).attr('href', url);
        return false;
    });
    
    $('#gebruiker-info').bind('dossiers-status', function(event, user){
        $(this).ilse.renderTemplate('#tmpl_DossierUser', {
            'user': user
        });
        var $logoutBtn = $('.uitloggen');
        if (!user.logged_in) {
            var $loginField = $('#gebruiker-niet-ingelogd fieldset');
            var $ilseBtn = $('#inlog-met-ilse');
            var $emailInput = $('#inlog-email');
            var $passwordInput = $('#inlog-wachtwoord');
            var $loginBtn = $('#inlog-knop');
            //var $terugBtn = $('#back-input');
            
            $('a.inloggen').click(function(){
                $(this).parent().fadeOut('normal', function(){
                    $loginField.animate({
                        top: 0,
                        opacity: 1
                    }, 500, function(){
                        $ilseBtn.click(function(event){
                          event.stopPropagation(); // needed for IE
                          if ($passwordInput.css('display', 'none')) {
                            $loginField.stop(true).animate({
                              right: 1 // Nog even kijken hoe dit beter kan, was -15
                            }, 500);
                          }
                          else {
                            return;
                          }
                        });
                    });
                });
                return false;
            });
            
            
            // Click event for closing the login form
            $('span.sluiten').click(function(){
                $loginField.animate({
                    top: -54,
                    opacity: 0
                }, 500, function(){
                    $('span.sluiten').parent().prev().fadeIn('normal');
                });
            });
            
            // Class 'forminput' kan gebruikt worden voor meerdere elemeten die de value willen aanpassen bij inputs
            var swapValue = [];
            $(".input-placeholder").each(function(i){
                swapValue[i] = $(this).val();
                $(this).focus(function(){
                    if ($(this).val() == swapValue[i]) {
                        $(this).val("");
                    }
                    $(this).addClass("focus");
                }).blur(function(){
                    if ($.trim($(this).val()) == "") {
                        $(this).val(swapValue[i]);
                        $(this).removeClass("focus");
                    }
                });
            });
            
            //reguliere expressie om te kijken of er een email is ingevuld
            function isValidEmailAddress(emailAddress){
                var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
                return pattern.test(emailAddress);
            }
            
            // email wordt gecontroleerd, neem aan dat we de classes etc erin zetten nadat we de btn hebben :)
            $emailInput.bind('keyup', function(value){
                var email = $emailInput.val();
                if (email != 0) {
                    if (isValidEmailAddress(email)) {
                        $loginBtn.addClass('user-login-active').bind('click', function(event){
                            if ($passwordInput.css('display') == 'block') {
                              $ilseBtn.click(function(){
                                $passwordInput.css({
                                  display: 'none',
                                  position: 'absolute'
                                });
                                //$(this).css('display', 'none');
                              });
                            }
                            $passwordInput.css({
                                display: 'block',
                                position: 'absolute'
                            }).animate({
                                opacity: 1,
                                left: 0,
                                top: 0
                            }, function(){
                                //Focus input element
                                $passwordInput.focus();
                                
                                //Needed to prevent the email input from showing on blur
                                $passwordInput.blur(function(){
                                    $('#pass_placeholder').css('display', 'block');
                                });
                            });
                        });
                    }
                    else {
                        $loginBtn.removeClass('user-login-active');
                        $emailInput.bind('keydown', function(event){
                            if (event.keyCode == 9) {
                                return false
                            }
                        });
                    }
                }
                else {
                }
            });
            
            // Catch tab/enter event after a valid email
            $emailInput.bind('keydown', function(event){
                if (event.keyCode == 9 || event.keyCode == 13) {
                    if ($passwordInput.css('display') == 'block') {
                      $ilseBtn.click(function(){
                        $passwordInput.css({
                          display: 'none',
                          position: 'absolute'
                        });
                        //$(this).css('display', 'none');
                      });
                    }
                    $passwordInput.css({
                        display: 'block',
                        position: 'absolute'
                    }).animate({
                        opacity: 1,
                        left: 0,
                        top: 0
                    }, function(){
                        //Focus input element
                        $passwordInput.focus();
                        
                        //Needed to prevent the email input from showing on blur
                        $passwordInput.blur(function(){
                            $('#pass_placeholder').css('display', 'block');
                        });
                    });
                }
            });
            
            
            // log in
            $loginBtn.click(function(event){
                if ($passwordInput.css('display') == 'none') {
                    return;
                }
                $.dossiers.login({
                    'email': $emailInput.val(),
                    'password': $passwordInput.val(),
                    'keep_logged_in': $('#keep_logged_in').is(':checked'),
                    'callback': function(result) {
                      if (!result.logged_in)
                      {
                        $ilseBtn.trigger('click');
                      }
                      else
                      {
                        window.location.reload();
                      }
                    }
                });
            });
            
            //Catch enter event on password input
            if ($passwordInput.blur()) {
                $passwordInput.bind('keydown', function(event){
                    if (event.keyCode == 13) {
                        $loginBtn.trigger('click');
                    }
                });
            }
        }
        else {
            $logoutBtn.click(function(){
                $.dossiers.logout({
                  'callback': function() {
                      window.location.reload();
                  }
                });
            });
        }
        
        // Catch click event on the register button
        $('#gebruiker-niet-ingelogd .registreren').click(function(event){
            var loaded = function(){
                $('#register-form').unbind('submit').submit(post_function);
            };
            
            var post_function = function(event){
                $.post('/accounts/register/', $('#register-form').serializeArray(), function(data){
                    $('#register-overlay-content').html(data);
                    loaded();
                });
		return false;
            };
            
            $('#register-overlay-content').load('/accounts/register/', function(){
                loaded();
            });
        });
    });
})(jQuery);