My code listens for a number of events, and calls the Google Analytics event tracking function when they fire.
Each event uses a similar pattern. Can I achieve the same functionality without repeating myself?
/*jslint debug:true, browser:true, devel:true nomen:true */
/*global _gaq:true, jquery:true, $:true */
function trackEvent(c, a, l) {
'use strict'; // JSLint
//console.log(c, a, l); // Dev only
_gaq.push(['_trackEvent', c, a, l]);
}
$(function () {
'use strict'; // JSLint
var alert, carousel, collapse, modal, tab, tooltip, download, external, mailto;
// Alerts event handler
alert = function () {
var alertButton = $(this),
category = 'Alerts',
action = alertButton.next().text(),
label;
trackEvent(category, action, label);
};
$('body').on('click.alert.data-api', '[data-dismiss="alert"]', alert);
// Carousel event handler
carousel = function () {
var carouselButton = $(this),
category = 'Carousels',
action = carouselButton.attr('data-slide'),
label;
trackEvent(category, action, label);
};
$('body').on('click.carousel.data-api', '[data-slide]', carousel);
// Collapse event handler
collapse = function () {
var category = 'Collapses',
action = $(this).text(),
label;
trackEvent(category, action, label);
};
$('body').on('click.collapse.data-api', '[data-toggle=collapse]', collapse);
// Modal event handler
modal = function () {
var category = 'Modals', action, label, activeModal;
activeModal = $(this).attr('href');
action = $(activeModal).find('h3').text();
trackEvent(category, action, label);
};
$('body').on('click.modal.data-api', '[data-toggle="modal"]', modal);
// Tab event handler
tab = function () {
var category = "Tabs",
action = $(this).text(),
label;
trackEvent(category, action, label);
};
$('body').on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', tab);
// Tooltip event handler
tooltip = function () {
var category = "Tooltips",
action = $(this).text(),
label;
trackEvent(category, action, label);
};
$('body').on('mouseenter', '[rel="tooltip"], [rel="popover"]', tooltip);
// Download link event handler
download = function () {
var category = "Downloads",
action = $(this).attr('href'),
label;
trackEvent(category, action, label);
};
$('body').on('click', 'a[href$="pdf"], a[href$="doc"], a[href$="docx"], a[href$="rtf"], a[href$="ppt"], a[href$="zip"]', download);
// Mailto event handler
mailto = function () {
var category = 'Mailto',
action = $(this).attr('href'),
label;
trackEvent(category, action, label);
};
$('body').on('click', 'a[href^="mailto"]', mailto);
// External link event handler
$.expr[':'].external = function (a) {
var PATTERN_FOR_EXTERNAL_URLS = /^\w+:\/\//,
href = $(a).attr('href');
return href !== undefined && href.search(PATTERN_FOR_EXTERNAL_URLS) !== -1;
};
external = function () {
var category = 'External links',
action = $(this).attr('href'),
label;
trackEvent(category, action, label);
};
$('body').on('click', 'a:external', external);
});