var Pushie = require('pushie'),
    myPushie,
    uiButton;
 
//initialize nav component after the dom has loaded
window.addEventListener('load',function(){
    myPushie = new Pushie({
    replacecallback: function(data){console.log(data)},
    pushcallback: function(data){console.log(data)},
    popcallback: function(data){console.log(data)}
  });
  uiButton = document.querySelector('#uiButton');
  uiButton.addEventListener('click',function(event){
  	event.preventDefault();
  	//normally you would do this after you queried for some data
  	myPushie.pushHistory({
            data: {
                title: 'some',
                name: 'sample',
                location: 'data you want to save'
            },
            title: 'some sample title',
            href: event.target.href
        });
  	return false;
  });
    //expose your nav component to the window global namespace
    window.myPushie = myPushie;
});

defaultOptions = {
    push_state_support: true,
    replacecallback: function (data) {
        console.log(data);
    },
    popcallback: function (data) {
        console.log(data);
    },
    pushcallback: function (data) {
        console.log(data);
    }
};

//submit pushie via ajax
myPushie.replaceHistory(options);  // options.data, options.title, options.href
myPushie.pushHistory(options); // options.data, options.title, options.href
myPushie.popHistory(options); // if no window.history.pushState then supply options.href
 
//events
myPushie.on('initialized'); // callback()
myPushie.on('pushhistory',callback); // callback(data)
myPushie.on('replacehistory',callback); // callback(data)
myPushie.on('pophistory',callback); // callback(data)