AJAX, pagination and browser history problems going backwards

Question

I have an almost perfectly working implementation of ajax in-page loading for web articles (to update part of a page), that has pagination that allows you to use the back button to properly reload the part of the page.

My main issue is backing out of the web article is problematic, I'm only storing the history change events specifically for when you change the pages:

The code below is to store the page numbers visited previously for the web article, then if any exist use the last page number, and send it over to the paginate_comments function that reloads the content area:

var page_history = [];

window.onpopstate = function(e) 
{
    if( e.state && e.state !== "null" && e.state !== "undefined" )
    {
        if ('article_page' in e.state && e.state.article_page !== null)
        {
            var previous = page_history.pop();

            if (previous !== undefined || previous.length > 0)
            {
                paginate_comments(previous, e.state.article_id, 0)
            }
        }
    }
}

This next bit is what actually does the content area reloading, and populates the browser history:

/* normal article pagination */
function paginate_comments(page, article_id, add)
{
    var url = "/includes/ajax/post_comment.php";
    var current_url = window.location.href;
    var host = window.location.host;

    // deal with updating URL with page number, deal with #comments being out of place
    var current_page_number = window.location.href.match(/page=(\d+)/);
    var replaced_url = current_url.toString();

    if (current_page_number)
    {
        new_url = replaced_url.replace(/page=\d+/, "page="+page);
    }
    else
    {
        var current_page_number = [];
        current_page_number[1] = 1;
        new_url = replaced_url.replace(/\/#comments/, '');
        new_url = new_url + '/page='+ page + '#comments';
    }

    if (window.location.hash == '')
    {
        window.location.hash = 'comments'
    }

    if (add == 1)
    {
        page_history.push(current_page_number[1]);
    }

    console.log(page_history);

    history.pushState({article_page: current_page_number[1], article_id: article_id}, document.title, new_url);
    history.pushState({article_page: page, article_id: article_id}, document.title, new_url);

    var area = "normal";
    if(current_url.indexOf(host + '/admin.php?module=reviewqueue') != -1 || current_url.indexOf(host + '/admin.php?module=articles&view=Submitted') != -1 || current_url.indexOf(host + '/admin.php?module=articles&view=Submitted') != -1)
    {
        var area = "admin";
    }

    $.ajax({
        type: "POST",
        url: url,
        dataType: "json",
        data: {'type': 'reload', 'article_id': article_id, 'page': page, 'area': area},
        success: function(data)
        {
            if (data['result'] == 'done')
            {
                $('.comments').replaceWith(data['comments']);
                $(".lb-container").show();
                $('.box.comments').get(0).scrollIntoView();
                hide_long_quotes($('.comments .comment_quote'));
                $('input[name="csrf"]').val(data['csrf_token']);
            }
            if (data['result'] == 'error')
            {
                alert(data['message']);
            }
        }
    });
}

The problem is that when you go back to page 1, it just gets stuck trying to repeat for a couple taps of the back button until eventually it will leave the article. Not entirely sure what i've done wrong.

So you can load an article, go through pages 1-2-3-4-5 etc and then hit back all the way to 1 and then it messes up.