instagram's inlined js

gistfile1.txt

<script>

    // SETUP

    
    is_logged_in = false
    myUsername = "";
    myProfilePicURL = "#";
    

    
    can_comment = true
    

    numLikes = parseInt(1)
    numComments = parseInt(1)

    comment_placeholder = "Add a comment...";

    // ON LOAD

    $(function() {
        $('#comment_text').val(comment_placeholder);
        $('#comment_text').addClass("placeholder");
        $('#comment_text').autogrow();

        $('#comment_text').focus(function(e) {
            if ($(this).val() == comment_placeholder) {
                $(this).removeClass('placeholder');
                $(this).val('');
            }
        });

        $('#comment_text').blur(function(e) {
            if ($(this).val() == "") {
                $(this).addClass('placeholder');
                $(this).val(comment_placeholder);
            }
        });
    });

    // GENERIC

    function scrollCommentsToBottom() {
        var comment_list = $("#comment_list");
        comment_list.scrollTop(comment_list[0].scrollHeight - comment_list.height());
    }

    // COMMENTING

    function focusComment() {
        $('#comment_text').focus();
    }

    function comment() {
        var comment_text = $.trim($("#comment_text").val());
        if (comment_text == "" || comment_text == comment_placeholder) {
            return;
        }
        var comment = addComment(comment_text);
        postComment(comment);
        $("#comment_text").val('');
        $('#comment_text').blur();
        $('#comment_text').css('height', 31);
    }

    function addComment(comment_text) {
        numComments++;
        var extra_classes = (comment_text.length < 31) ? ' time-br' : '';
        var new_comment = $(document.createElement('li'));
        new_comment.addClass("comment"+extra_classes);
        new_comment.append(
            '<span class="like-avatar img-inset" style="background-image:url(' + myProfilePicURL + ');">' +
                '<img src="' + myProfilePicURL + '" alt="' + myUsername + '" />' +
                '<b></b>' +
            '</span>' +
            '<p>' +
                '<strong class="username">' + myUsername + '</strong> ' +
                '<span class="comment-text">' + comment_text + '</span> ' +
                '<span class="comment-meta"><time>Now</time></span>' +
                '<span class="comment-info">' +
                '</span>' +
            '</p>'
        );
        var comment_list = $("#comment_list");
        comment_list.append(new_comment);
        setUpCommentList();
        scrollCommentsToBottom();
        return new_comment;
    }

    function postComment(comment) {
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "/web/comments/226287063356479436/add/",
            context: comment,
            data: {
                "comment_text": comment.find('.comment-text').html(),
            },
            success: function(response) {
                $(this).attr('data-id', response.id);
                var delete_button = '<a class="delete-comment" href="#"></a>';
                $(this).find('.comment-info').append(delete_button);
            },
            error: function(response) {
                $(this).addClass('failed');
                var error_message = response.responseText;
                if (error_message == '') {
                    error_message = "Couldn&#39;t post comment";
                }
                var failure_actions = '' +
                    '<span class="failure-message">' +
                        error_message + ' ' +
                        '<br/>' +
                        '<a class="retry-post-comment" href="javascript:;" onclick="retryComment($(this).parents(\'.comment\'));">Retry</a> &bull; ' +
                        '<a class="cancel-post-comment" href="javascript:;" onclick="cancelComment($(this).parents(\'.comment\'));">Cancel</a>' +
                    '</span>'
                $(this).find('.comment-info').append(failure_actions);
                scrollCommentsToBottom();
            },
        });
    }

    function retryComment(comment) {
        var comment_text = comment.find('.comment-text').html();
        comment.remove();
        numComments--;
        var comment = addComment(comment_text);
        postComment(comment);
    }

    function cancelComment(comment) {
        comment.fadeOut(function() {
            comment.remove();
            numComments--;
        });
    }

</script>

    <script>

        // SETUP

        $(function() {
            //  Center Like Tooltips
            $(".like .tooltip").each(
                function() {
                    $(this).css('margin-left', "-" + Math.ceil(($(this).outerWidth()/2)) + "px");
                }
            );

            //  Initialize Login Screen Clearing.
            $('.modal-backdrop').click(toggleLogin);
            $('.modal-close').click(toggleLogin);

            setTimeout(function() {
                var intent = get_param('intent');
                if (intent == 'comment') {
                    $('#comment_text').focus();
                } else if (intent == 'like') {
                    iLikeBig();
                }
            }, 200);

            // Initialize Double Click to Like.
            $("#media_photo").bind('dblclick', iLikeBig);

            // Initial Caption Fade
            setTimeout(captionFadeCallback, 4500);

            // Vertically center the media block.
            centerMedia();
            $(window).resize(function() {
                centerMedia();
            });

            if (can_comment) {
                $(window).load(scrollCommentsToBottom);
            }
        });

        function captionFadeCallback() {
            $('body').addClass('initial-caption-fade-done');
        }

        function login_with_intent(intent) {
            var form = $('#login-form');
            var form_action = form.attr('action').split('%3F')[0];
            form.attr('action', form_action + '%3Fintent=' + intent);
            
            window.location.href = form_action + '%3Fintent=' + intent;
            
        }

        // FRIENDSHIPS

        $(function() {
            setUpLikeCount();

            $("#follow-indicator").activity({
                segments: 8,
                width:2,
                space: 0,
                length: 3,
                color: '#666',
            }).hide();

            $("#follow").click(function() {
                friendship_action('follow');
            });

            $("#unfollow").click(function() {
                friendship_action('unfollow');
            });

            $("#requested").click(function() {
                friendship_action('unfollow');
            });
        });

        function friendship_action(action_name) {
            var follow = action_name == 'follow';
            $("#follow-indicator").show();

            $.ajax({
                type: "POST",
                url: "/web/friendships/7116/" + action_name + "/",
                success: function(response) {
                    $("#follow-indicator").hide();
                    var is_following = follow && can_comment;
                    var is_requested = follow && !can_comment;
                    $("#follow").toggleClass('hide', is_following || is_requested);
                    $("#unfollow").toggleClass('hide', !is_following || is_requested);
                    $("#requested").toggleClass('hide', !is_requested);
                },
                error: function(response) {
                    $("#follow-indicator").hide();
                    // fail silently
                },
            });
        }

        // COMMENTING

        $(function() {
            setUpCommentList();
            // Check when the comment list gets scrolled for the shadow animation.
            $('#comment_list').bind('scroll', checkCommentScroll);

            $('#comment_text').keydown(function(e) {
                if (e.which == 13) {
                    if($(this).val().trim().length > 0){
                        e.preventDefault();
                        comment();
                    }
                    else {
                        $("#comment_text").val('');
                    }
                }
            });

            $('#comment_text').keyup(function(e) {
                if(e.which == 13){
                    $("#comment_text").val('');
                }
            });

            $(document).on("click", ".delete-comment", function() {
                $('.media-open').toggleClass('media-opened', true);
                var comment = $(this).parents('.comment');
                var comment_id = comment.attr('data-id');
                delete_comment(comment_id);
                comment.animate(
                    {
                        opacity: 0,
                        marginBottom: "-"+(comment.outerHeight())+"px"
                    },
                    300, function() {
                        comment.remove();
                        numComments--;
                        setUpCommentList();
                    }
                );
            });

        });

        function delete_comment(comment_id) {
            $.ajax({
                type: "POST",
                url: "/web/comments/226287063356479436/delete/" + comment_id + "/",
                success: function(response) {
                    // succeed silently
                },
                error: function(response) {
                    // fail silently
                },
            });
        }

        function setUpCommentList() {
            var likesHeight = $(".media-likes").outerHeight();
            var captionHeight = $(".caption").outerHeight();

            $("#comment_list").css('max-height', ($('.media-info').height() - likesHeight - captionHeight - 48) + "px");

            var commentsheight = $(".media-comments").outerHeight();

            var shouldMount = likesHeight + commentsheight > 580;

            $(".media-info").toggleClass("mount-addcomment", shouldMount)

            var comment_count = numComments;
            if (comment_count > 9999) {
                comment_count = Math.round(comment_count / 1000) + "k"
            }
            $('.comment-count').html(comment_count);

            if (comment_count > 0) {
                $(".media-info").removeClass("no-comments");
            } else {
                $(".media-info").addClass("no-comments");
            }
        }

        // LIKING

        function setUpLikeCount() {
            if (numLikes < 0) {
                num_likes = 0;
            }
            var can_like = is_logged_in && can_comment;
            $('.media-info').toggleClass('no-likes', can_like && numLikes <= 0);
            var like_count = numLikes;
            if (like_count > 9999) {
                like_count = Math.round(like_count / 1000) + "k"
            }
            $('.like-count').html(like_count);
        }

        function has_liked() {
            return ($('.like.inactive').length == 0)
        }

        function iLikeBig() {
            if (!has_liked()) {
                iLike();
                $('.i-like-big').toggleClass('i-like-big-pop', true);
            }

            clearSelection();
        }

        function iLike() {
            if (!is_logged_in) {
                login_with_intent('like');
                return;
            } else if (!can_comment) {
                highlightPrivacyNote()
                return;
            }

            $('#like_button').toggleClass('liked-button');

            if ($('.liked-button').size() < 1) {
                $('#i_like').removeClass('i-like-pop');
            } else {
                $('#i_like').addClass('i-like-pop');
            }

            $('#like_list').toggleClass('like-slide');
            $('.new-like').toggleClass('inactive');

            var like = 'unlike';
            if ($('#like_button').hasClass('liked-button')) {
                like = 'like';
                numLikes++;
            } else {
                numLikes--;
            }

            $.ajax({
                type: "POST",
                url: "/web/likes/226287063356479436/" + like + "/",
                success: function(response) {
                    // succeed silently
                },
                error: function(response) {
                    // fail silently
                },
            });

            setUpLikeCount();
            var liked = (like == 'like')
            if (!liked) {
                $('.i-like-big').toggleClass('i-like-big-pop', false);
            }
            return liked;
        }

        // UX

        $(function() {
            $(document).mouseup(function(e) {
                var container = $("#media_inner");
                if (container.has(e.target).length === 0) {
                    if ($('#media_inner').hasClass('user-tooltip-open')) {
                        toggleUserTooltip();
                    }
                }
            });
        });

        var animating_privacy_note;

        function highlightPrivacyNote() {
            if(animating_privacy_note) {
                return;
            }

            animating_privacy_note = true;
            var note = $('.media-user-private');
            note.animate(
                {'opacity': .9}, 400,
                function() {
                    note.animate(
                        {'opacity': 0.5}, 300
                    );
                    animating_privacy_note = false;
                }
            );
        }

        function toggleMediaState(focusTarget) {
            //  Toggling the open and closed state of the media.
            $("body").toggleClass("media-open");

            //  If the media is closed, the media-opened class should also be removed.
            if($('.media-open').length == 0) {
                $('.media-opened').removeClass('media-opened');
            }

            //  If we define a focusTarget, focus on this element.
            if (typeof focusTarget != "undefined") {
                $(focusTarget).focus();
            }
        }

        function mediaBarComment() {
            if (can_comment) {
                if ($('.media-open').length == 1) {
                    $('#comment_text').focus();
                } else {
                    toggleMediaState('#comment_text');
                }
            } else if (is_logged_in) {
                highlightPrivacyNote()
            } else {
                login_with_intent('comment')
            }
        }

        function checkCommentScroll() {
            //  Checking how far the comment container has been scrolled to apply a shadow.
            var offset = parseInt($('#comment_list').scrollTop());
            $("#comment_list").toggleClass("comments-scrolled-tinybit", (offset > 0 && offset <= 5));
            $("#comment_list").toggleClass("comments-scrolled-littlemore", (offset > 5 && offset <= 10));
            $("#comment_list").toggleClass("comments-scrolled", offset > 10);
        }

        function toggleUserTooltip() {
            //  Toggle Visibility of User Tooltip
            $('#media_inner').toggleClass('user-tooltip-open');
        }

        function centerMedia() {
            //  Vertically center the media block. Sadly, CSS can't do this consistently.
            var main_height = $(window).height() - 100;
            var media_height = $("#media_wrapper").height() + 30;
            var media_offset = (main_height - media_height) / 2;

            if(media_offset > 0)
                $("#media_wrapper").css('top', media_offset + "px");
            else
                $("#media_wrapper").css('top', "0px");
        }

        function toggleLogin() {
            if($('.modal-backdrop').css('display') == 'none') {
                $('.modal-backdrop').fadeIn(200);
                $('.oauth-login').fadeIn(200);
                $('#id_username').focus();
            } else {
                $('.oauth-login').fadeOut(200);
                $('.modal-backdrop').fadeOut(200);
            }
        }

        function dismissCaption() {
            $("body").addClass("caption-dismissed");
        }

        function clearSelection() {
            if ( document.selection ) {
                document.selection.empty();
            } else if ( window.getSelection ) {
                window.getSelection().removeAllRanges();
            }
        }

    </script>