var UserView = {
    uploading: false,
    IMAGE_HEIGHT: 168,
    IMAGE_WIDTH: 168,
    showUploadedImage: function( source ) {
        $( ".avatar img" ).remove();
        $image = $( '<img src="' + source + '" alt="Profile Picture" />' );
        $image.load( function() {
            UserView.fixImageSize( $image );
        } );
        $( ".avatar" ).append( $image );
    },
    createImageError: function() {
        $( '.text-center' ).prepend( "<div class='alert alert-danger'>This isn't an image</div>" )
    },
    removeImageError: function() {
        $( '.text-center .alert.alert-danger' ).remove();
    },
    fixImageSize: function( $image ) {
        var imgWidth = $image.width();
        var imgHeight = $image.height();

        if ( imgWidth > imgHeight ) {
            $image.height( UserView.IMAGE_HEIGHT );
            $image.css( 'top', 0 );
            $image.css( 'left', -Math.floor( ( $image.width() - UserView.IMAGE_WIDTH ) / 2 ) );
        }
        else {
            $image.width( UserView.IMAGE_WIDTH );
            $image.css( 'left', 0 );
            $image.css( 'top', -Math.floor( ( $image.height() - UserView.IMAGE_HEIGHT ) / 2 ) );
        }
    },
    finishUploadAnimation: function() {
        $( ".uploading" ).hide();
        $( ".uploading" ).removeClass( 'animate' );
        UserView.uploading = false;
    },
    startUploadAnimation: function() {
        $( ".upload-link" ).hide();
        $( ".uploading" ).show();
        $( ".uploading" ).addClass( 'animate' );
        UserView.uploading = true;
    },
    ready: function() {
        $( '.avatar img' ).load( function() {
            UserView.fixImageSize( $( '.avatar img' ) );
        } );
        $( ".avatar" ).mouseover( function() {
            if ( $( ".profile-header" ).attr( 'data-sameUser' ) == 'no' || UserView.uploading ) {
                return;
            }
            $( ".upload-link" ).show();
        } );
        $( ".avatar" ).mouseout( function() {
            if ( UserView.uploading ) {
                return;
            }
            $( ".upload-link" ).hide();
        } );
        $( ".upload-link" ).click( function() {
            $( "#image" ).trigger( 'click' );
            return false;
        } );
        $( '#unfollow' ).click( function() {
            $( '#unfollow-form' ).submit();
            return false;
        } );
        $( '#follow' ).click( function() {
            $( '#follow-form' ).submit();
            return false;
        } );
        $( "#image" ).change( function() {
            var image = document.getElementById( "image" ).files[ 0 ];
            var token = $( "input[type=hidden]" ).val();
            var formData = new FormData();

            UserView.removeImageError();

            if ( !image ) {
                return false;
            }

            formData.append( "image", image );
            formData.append( "token", token );

            UserView.startUploadAnimation();

            $.ajax( {
                url: "image/create",
                type: "POST",
                data: formData,
                cache: false,
                dataType: "json",
                processData: false,
                contentType: false,
                success: function( targetPath ) {
                    var reader = new FileReader();

                    UserView.finishUploadAnimation();

                    reader.onloadend = function ( e ) {
                        UserView.showUploadedImage( targetPath );
                    }
                    reader.readAsDataURL( image );
                },
                error: function( jqXHR, textStatus, errorThrown ) {
                    UserView.finishUploadAnimation();

                    UserView.createImageError();
                }
            } );

            return false;
        } );
    }
}
$( document ).ready( UserView.ready );

@@ -2416,29 +2416,41 @@
 %0A           
+ var $form =
  $( 
-'
+%22
 #follow-form
@@ -2445,35 +2445,1214 @@
 #follow-form
-' ).submit(
+%22 );%0A            var followedid = $( %22%5Bname='followedid'%5D%22, $form ).val();%0A            var token = $( %22%5Bname='token'%5D%22, $form ).val();%0A            var formData = new FormData();%0A%0A            formData.append( %22followedid%22, followedid );%0A            formData.append( %22token%22, token );%0A%0A            $.ajax( %7B%0A                url: %22follow/create%22,%0A                type: %22POST%22,%0A                data: formData,%0A                cache: false,%0A                dataType: %22json%22,%0A                processData: false,%0A                contentType: false,%0A                success: function() %7B%0A                    $( %22a#follow%22 ).replaceWith( %0A                        %22%3Ca href='#' id='unfollow'%3E%3Cbutton class='btn btn-primary follow'%3EUnfollow%3C/button%3E%3C/a%3E%22%0A                    );%0A                    $( %22form#follow-form%22 ).replaceWith(%0A                        %22%3Cform id='logout-form' action='session/delete' method='post' %3E %5C%0A                            %3Cinput type='hidden' name='token' value='%22 + token + %22' /%3E %5C%0A                            %3Cinput type='hidden' name='followedid' value='%22 + followedid + %22'  /%3E %5C%0A                        %3C/form%3E%22%0A                    );%0A                %7D%0A            %7D 
 );%0A         

make follow button work with ajax