Barba.js with sage 8

sage
1

I am working with sage 8.5.2, and I am trying to use barba js for the transitions between one page and the other.
I installed barba with bower with this command: bower install --save luruke/barba.js.
I added the markup structure in the base.php and the relevant js (Barba.Pjax.start(); ) in the main.js.
it seems to work, infact I can see that it keeps the header and the footer and it updates just the content inside the “barba-wrapper”.
but I have an issue, it doesn’t update the body classes for this reason I think that it doesn’t fire the script for that specific page.

anyone had my similar issue?
do you have any ideas or recommendation?

many thanks

2

Hi!
Our very own @mikespainhower seems to have written an issue on this very question:

See if that thread gets you going.

3 
Barba.Dispatcher.on('newPageReady', function(currentStatus, prevStatus, container, newPageRawHTML) {

  var path = currentStatus.url.split(window.location.origin)[1].substring(1); // get path of current page
  var url = currentStatus.url;

  // log("[Barbajs] newPageReady");
  // log("[Barbajs] path: " + path);
  // log("[Barbajs] url: " + url);

  // "notbody" see: https://github.com/luruke/barba.js/issues/51#issuecomment-241417316
  var response = newPageRawHTML.replace(/(<\/?)body( .+?)?>/gi, '$1notbody$2>', newPageRawHTML);
  var bodyClasses = $(response).filter('notbody').attr('class');
  $('body').attr('class', bodyClasses);
  UTIL.loadEvents(); // call Sage event handlers

  // Analytics
  ga('create', mspConfig.gaId, 'auto');
  ga('set', 'page', '/' + path);
  ga('send', 'pageview');

});
1 Like
4

Ignore my analytics stuff above.

How can I update Google Analytics (or any other tracking sytem)?
It’s enough to listen to the event initStateChange and update Google analytics accordingly.

source