Can a specific route include specific js - Piwik tracking

[pichalite]

@rod You can run custom JS for a specific route in NodeBB. What ever you add in the if statement will only run on the search route.

$(window).on('action:ajaxify.contentLoaded', function(ev, data) {
  if (data.tpl_url === 'search') {
    // things to do for this route
  }
});

[rod]

@pichalite @Community-Representatives

I NodeBB and you guys...

[rod]

@pichalite I'm getting an ReferenceError: data is not defined error when I try to use data.tpl_url

[psychobunny]

That's odd... data is always passed in this hook. Maybe there's a typo somewhere, post the whole code?

[rod]

@psychobunny This is in Custom Header :

<script type="text/javascript">
var _paq = _paq || [];
(function () {
    var u = "//my.piwikcollector.com/";

    function firePiwik () {
        if (app.user && app.user.uid > 0) {
            _paq.push(['setUserId', app.user.uid.toString()]);
            _paq.push(['setCustomVariable', 1, "appUserUsername", app.user.username, "visit"]);
        }
        _paq.push(['setDocumentTitle', document.title]);
        _paq.push(['setCustomUrl', location.href]);
        _paq.push(['enableHeartBeatTimer']);
        _paq.push(['appendToTrackingUrl', 'bots=1']);
		if (data.tpl_url === 'search') {
			_paq.push(['trackSiteSearch', "test", "test", "false"]);
		} else {
			_paq.push(['trackPageView']);
		}
        _paq.push(['enableLinkTracking']);
        _paq.push(['setTrackerUrl', u+'piwik.php']);
        _paq.push(['setSiteId', 1]);
    }

    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);

    $(window).on('action:ajaxify.end', function(ev, data) {
        firePiwik();
    });
})();
</script>

I have tried both action:ajaxify.contentLoaded as well as action:ajaxify.end with the same result.

[psychobunny]

Oh, looks like you're not passing data.

<script type="text/javascript">
var _paq = _paq || [];
(function () {
    var u = "//my.piwikcollector.com/";

    function firePiwik (data) {
        if (app.user && app.user.uid > 0) {
            _paq.push(['setUserId', app.user.uid.toString()]);
            _paq.push(['setCustomVariable', 1, "appUserUsername", app.user.username, "visit"]);
        }
        _paq.push(['setDocumentTitle', document.title]);
        _paq.push(['setCustomUrl', location.href]);
        _paq.push(['enableHeartBeatTimer']);
        _paq.push(['appendToTrackingUrl', 'bots=1']);
        if (data.tpl_url === 'search') {
            _paq.push(['trackSiteSearch', "test", "test", "false"]);
        } else {
            _paq.push(['trackPageView']);
        }
        _paq.push(['enableLinkTracking']);
        _paq.push(['setTrackerUrl', u+'piwik.php']);
        _paq.push(['setSiteId', 1]);
    }

    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);

    $(window).on('action:ajaxify.end', function(ev, data) {
        firePiwik(data);
    });
})();
</script>

[rod]

@psychobunny Now with:

    $(window).on('action:ajaxify.contentLoaded', function(ev, data) {
        firePiwik(data);
    });

Same error.

[rod]

@psychobunny Problem found.
I need data in two places. Doh.

[psychobunny]

Haha, didn't I do that on the code I edited for you above?

[rod]

@psychobunny Yes, yes, but I wasn't pasting back the entire bit. I was just looking for the diff.

That console error is resolved but now I get an "undefined" for data.tpl_url

[rod]

This is what it looks like now, I added a couple of console.log commands to see what is going on:

<script type="text/javascript">
var _paq = _paq || [];
(function () {
    var u = "//my.piwikcollector.com/";

    function firePiwik (data) {
        if (app.user && app.user.uid > 0) {
            _paq.push(['setUserId', app.user.uid.toString()]);
            _paq.push(['setCustomVariable', 1, "appUserUsername", app.user.username, "visit"]);
        }
        _paq.push(['setDocumentTitle', document.title]);
        _paq.push(['setCustomUrl', location.href]);
        _paq.push(['enableHeartBeatTimer']);
        _paq.push(['appendToTrackingUrl', 'bots=1']);
		if (data.tpl_url === 'search') {
			_paq.push(['trackSiteSearch', "test", "test", "false"]);
			console.log('in search ' + data.tpl_url);
		} else {
			_paq.push(['trackPageView']);
			console.log('not in search ' + data.tpl_url);
		}
        _paq.push(['enableLinkTracking']);
        _paq.push(['setTrackerUrl', u+'piwik.php']);
        _paq.push(['setSiteId', 1]);
    }

    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);

    $(window).on('action:ajaxify.end', function(ev, data) {
        firePiwik(data);
    });
})();
</script>

[pichalite]

@rod apparently there is no tpl_url in data

use if (data.tpl === 'search')

[rod]

@pichalite and @psychobunny Yes, yes. Now it is working better. Thank you.

How do I see what other variables are available specifically related to the search. Really my code bit needs to report to Piwik the search term and hopefully the result count.

_paq.push(['trackSiteSearch', searchTerm,, resultCount]);

Are those two variables available to me?

Thank you.

[pichalite]

@rod add a console.log(data); to your code and you can see what's in the data object in your browser console

the data object has url and tpl

if there is a search query, then the url will look like this
search/welcome?in=titlesposts&sortBy=timestamp&sortDirection=desc&showAs=posts

so the part between search/ and the ? is the search term. welcome in this case.

[rod]

@pichalite Are there any other objects that would report back the number of results? The actual search page does return the number. Is that available to my js code bit?

[rod]

Looking at the source for NodeBB on github in search.js I see this:

if (data.searchIn === 'posts' || data.searchIn === 'titlesposts') {
					search.searchQuery('post', data.query, results.searchCids, results.searchUids, next);

Is the data.query object available to me?

[pichalite]

@rod yup, should be available in ajaxify.data.matchCount

[rod]

@pichalite that worked like a champ. I was hoping that ajaxify.data.query would also work but it did not.

[pichalite]

@rod it is available in ajaxify.data, use ajaxify.data.search_query

[rod]

@pichalite And voila!

_paq.push(['trackSiteSearch', ajaxify.data.search_query,, ajaxify.data.matchCount]);

Piwik now gets the search query and the number of results.

And, yup, there it was on line 25 staring me in the face:
result.search_query = validator.escape(data.query);

Thanks for helping an 'old guy out.