[jQuery] jQuery reallysimplehistory solution

[Paul Dragoonis]

Hey there I just wanted to feed back my knowledge and experience with
reallysimplehistory (RSH) and jquery integration.
There were some existing docs but nothing matched the problems i was
looking for.

Firstly, you may think you need to integrate jquery (and json) with
RSH as per their documentation.
This is not the case. jQuery no longer supports JSON in their library,
but as a a separate plugin.
As advised by the guys in #jquery on irc.freenode.net, its better to
use native JSON rather than try to use jquerys implementation of it.
Get json2.js from here: http://www.json.org/json2.js

My problem was that i was getting conflicts and undefined functions
and then suddely, i got a blank page every time and the browser just
sat there and hung. Even a CTRL+F5 didn't fix this i had to restart my
browser(s).
It was due to adding the RSH initialisation function calls from within
my jquery init statement.. like so.
        $(document).ready(function() {

                window.dhtmlHistory.create( {
                    debugMode : true,
                        toJSON: function(o) {
                                return JSON.stringify(o);
                    },
                    fromJSON: function(s) {
                        return JSON.parse(s);
                    }
                });
                window.onload = function(){
                        dhtmlHistory.initialize();
                        dhtmlHistory.addListener(historyChange);
                };
      });

This is what i was doing, after i stopped trying to use the jquery
JSON calls and use the native JSON calls, i got the blank page and
browser messup.
The solution i found was to keep my RSH stuff outside and before my
jQuery init statement, as it seems RSH must initialise right on page
load and not on document.ready

This is the code i found worked perfectly in stream with jQuery and
native JSON.
<script type="text/javascript" src="<?php echo $oConfig->baseUrl; ?>js/
jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="<?php echo $oConfig->baseUrl; ?>js/
json2.js"></script>
<script type="text/javascript" src="<?php echo $oConfig->baseUrl; ?>js/
rsh.js"></script>

window.dhtmlHistory.create( {
    debugMode : true,
        toJSON: function(o) {
                return JSON.stringify(o);
    },
    fromJSON: function(s) {
        return JSON.parse(s);
    }
});
window.onload = function(){
        dhtmlHistory.initialize();
        dhtmlHistory.addListener(historyChange);
};

function historyChange(newLocation, historyData) {
        if(newLocation != '') {
                console.log('new history: ' + newLocation);
                console.log('history data: ' + historyData);
                console.log('----');
                dhtmlHistory.add(newLocation, 'mad stuff');
        }
}

$(document).ready(function() {
      ... my jquery code in here and calls to the existing
historyChange() function as needed.
});

I hope this helps anyone and if you want me to clean this up or
correct it in any way let me know. I'll probably get round to making a
RSH/JSON/jQuery tutorial for this at some point.