Chris Mendez in Javascript, For Developers

Javascript Outbound Link Tracker

Scripts used to record whenever users click an external link.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>  
<script charset="utf-8" type="text/javascript">  
$(document).ready(function(){
    //Event Tracker
    //http://code.google.com/apis/analytics/docs/tracking/asyncUsageGuide.html

    //Campaign Tracker
    $.getScript("/js/CampaignTracker.js");
    $("a").bind("click", onLinkClickHandler);
    function onLinkClickHandler( e ){
        var currentHREF = $(this).attr('href');
        var matchExp = /www.chrisjmendez.com|chrisjmendez.com|#/;
        console.log(currentHREF)
        if ( !currentHREF.match(matchExp) ) { _gaq.push(['_trackEvent', 'external', currentHREF]) }
        //return false;
    }   
});
</script>  

This /js/CampaignTracker.js is to source how users are arriving to a specific page. Instead of sitting around and creating a million custom campaign trackers, we are going to source traffic by URL.

/** *******************************************
* Name: Campaign Tracker
* Date modified: 10/17/2013
* Description: The purpose of this campaign tracker is to 
* source how users are arriving at the donations page. 
* Instead of sitting around and creating a million custom
* campaign trackers, we are going to source traffic by URL. 
* 
* Here's the breakdown:
*  utm_source   = URL of the web page
*  utm_medium   = Device type (mobile vs. desktop)
*  utm_content  = browser name (IE, Firefox, Safari, Chrome)
*  utm_campaign = Campaign name (donate). Since we can track 
*                the dates of our radio campaigns + e-newsblasts, etc.,
*                there's no need to spell out a specific name campaign.
* 
** /

/**************************
Stop <a href /> from linking  
**************************/
function stopEvent( e ){  
    e = e || window.event;
    if( e ){
        if( e.preventDefault ){
            e.preventDefault();
        } else {
            e.returnValue = false;
        }
    }
}

function replaceSlash(url){  
    return url.replace(/\/$/, "");
}

/**************************
Get Browser Name  
**************************/
function getBrowserName(){  
    //Differentiate between Safari and Chrome (webkit based)
    $.browser.chrome = $.browser.webkit && !!window.chrome;
    $.browser.safari = $.browser.webkit && !window.chrome;

    var name = "";
    if( $.browser.safari )  name = "Safari"
    if ($.browser.msie )    name = "Internet Explorer";
    if ($.browser.mozilla ) name = "Firefox";
    if ($.browser.chrome )  name = "Chrome";
    return name;
}

/**************************
Are users on mobile or desktop browser?  
**************************/
function getDeviceType(){  
    var isMobile = {
        Android: function() {
            return navigator.userAgent.match(/Android/i);
        },
        BlackBerry: function() {
            return navigator.userAgent.match(/BlackBerry/i);
        },
        iOS: function() {
            return navigator.userAgent.match(/iPhone|iPad|iPod/i);
        },
        Opera: function() {
            return navigator.userAgent.match(/Opera Mini/i);
        },
        Windows: function() {
            return navigator.userAgent.match(/IEisMobile/i);
        },
        any: function() {
            return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
        }
    };
    //Make the device names look pretty
    if( $.browser.device ){
        $.browser.device = (/android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(navigator.userAgent.toLowerCase()));
        return isMobile.any().toString();
    }
    //If no device, assume it's a desktop browser
    else {
        return "desktop";
    }
}

/**************************
Campaign URL construction  
**************************/
function getCampaignURL( url, source, calltoaction ){  
    url += "?";

    var params = {};
    params.utm_source   = source
    params.utm_medium   = getDeviceType()
    params.utm_content  = getBrowserName()
    params.utm_campaign = "donate"
    //params.cache_clear  =  new Date().getTime()
    if( calltoaction ) {
        //There's more than just a blank string
        if( calltoaction.length > 0 ){
            params.call_to_action = $.trim( calltoaction );            
        }       
    }

    $.each( params, function( n, value){
        var param =  n + "=" + value + "&";
        url += param;
    });

    return url.toLowerCase();
}

function scanLinks(){  
    $.each( $("a"), function(key, value){
        //Get the current URL of the <a href=""> tag
        var currentURL = $(this).attr('href');
        //Search for this string expression
        var regexp = /http:\/\/mydomain.com\/mypath/;
        var pathname = window.location.pathname;
        //If any of the links match, continue forward
        if( currentURL.match( regexp ) ) {
            var newURL       = "http://mydomain.com/mypath";
            var id           = $(this).parent().parent().attr("id");
            var calltoaction = $(this).text();

            //Source as "index"
            if( pathname == "/" ) pathname = "index";

            //Source as "widget"
            if( id == "my_div_id" ) newURL = getCampaignURL( newURL, "widget" );
            //Source as pathname
            else newURL = getCampaignURL( newURL, replaceSlash(pathname), calltoaction );

            //console.log( newURL );
            //Apply new URL to existing <a href="" />
            $(this).attr('href', newURL );
        }
    });
}
//Scan links for Donation call outs
scanLinks();