Skip to content

Instantly share code, notes, and snippets.

@almonk

almonk/usage_example.js

Forked from jgwhite/with-history.js
Created May 31, 2011 11:02
Download ZIP

Revisions

  1. almonk revised this gist May 31, 2011. 1 changed file with 24 additions and 0 deletions.
    24 changes: 24 additions & 0 deletions usage_example.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,24 @@
    $(document).bind("WithHistory.urlDidChange", function() {
    $.ajax(window.withHistory.url(), {
    dataType: "html",
    success: function(response) {
    var body = response.match(/<body.*?>([\s\S]+?)<\/body>/)[1];
    var tmp = $("<div />");
    tmp.html(body);
    var newContent = tmp.find("#pagecontent").html();

    $("#pagecontent").animate({ opacity: 0 }, 250);
    $("html, body").animate({ scrollTop: 0}, 250, function() {
    $("#pagecontent").html(newContent).animate({ opacity: 1 }, 500);
    });
    }
    })
    });

    window.withHistory = new WithHistory();

    $("a.ajax").live("click", function(event) {
    event.preventDefault();
    event.stopPropagation();
    window.withHistory.pushState($(this).attr("href"));
    });
  2. @jgwhite jgwhite revised this gist May 31, 2011. No changes.
  3. @jgwhite jgwhite revised this gist May 31, 2011. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion with-history.js
    View file
    Original file line number Diff line number Diff line change
    @@ -4,7 +4,8 @@
    // Usage:
    // $(document).bind('WithHistory.urlDidChange', function() { ... });
    // window.withHistory = new WithHistory();
    // window.withHistory.url(); // -> current path
    // window.withHistory.pushState(newUrl) // push new url
    // window.withHistory.url(); // get current url

    var WithHistory = function() {

  4. @jgwhite jgwhite revised this gist May 31, 2011. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions with-history.js
    View file
    Original file line number Diff line number Diff line change
    @@ -4,6 +4,7 @@
    // Usage:
    // $(document).bind('WithHistory.urlDidChange', function() { ... });
    // window.withHistory = new WithHistory();
    // window.withHistory.url(); // -> current path

    var WithHistory = function() {

  5. @jgwhite jgwhite created this gist May 31, 2011.
    59 changes: 59 additions & 0 deletions with-history.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,59 @@
    // WithHistory v1.0.0
    // hello@withassociates.com
    //
    // Usage:
    // $(document).bind('WithHistory.urlDidChange', function() { ... });
    // window.withHistory = new WithHistory();

    var WithHistory = function() {

    this.init = function() {
    if (this.supportsHistoryPushState()) {
    $(window).bind('popstate', $.proxy(this, 'onPopState'));
    } else {
    this.hashCheckInterval = setInterval($.proxy(this, 'onCheckHash'), 200);
    }
    },

    this.pushState = function(url) {
    if (this.supportsHistoryPushState()) {
    window.history.pushState('', '', url);
    } else {
    this.previousHash = '#' + url;
    document.location.hash = url;
    }
    this.urlDidChange();
    },

    this.supportsHistoryPushState = function() {
    return ('pushState' in window.history) &&
    window.history['pushState'] !== null;
    },

    this.onCheckHash = function() {
    if (document.location.hash != this.previousHash) {
    this.previousHash = document.location.hash;
    this.urlDidChange();
    }
    },

    this.onPopState = function() {
    this.receivedPopState = true;
    this.urlDidChange();
    },

    this.urlDidChange = function(path) {
    $(document).trigger('WithHistory.urlDidChange');
    },

    this.url = function() {
    if (this.supportsHistoryPushState()) {
    return document.location.pathname;
    } else {
    return document.location.hash.slice(1);
    }
    }

    this.init();

    }