Skip to content

Instantly share code, notes, and snippets.

@stefbowerman
Last active January 2, 2016 03:29
Show Gist options
  • Save stefbowerman/8243758 to your computer and use it in GitHub Desktop.
Save stefbowerman/8243758 to your computer and use it in GitHub Desktop.
Wrapper object for analytics tracking. Pass in a hash of tracking params (category, action, label, etc) and the constructor takes care of the rest.
## Requires _gaq
## TRACKING DOM ELEMENT CLICK EVENTS ##
##-----------------------------------------##
## To be tracked, a dom element must have a few data- attributes
## data-trackable !Required for element to be tracked - set it to "true" or something, doesn't matter, just needs to exist
## data-event-category !Required - String
## data-event-action !Required - String
## data-event-label !Optional - String
## data-event-value !Optional - Integer
## Usage - given an element <div id="track-me" data-trackable="true" data-event-category="my-category" data-event-action="my-action"></div>
## 1. Initialize with the element - new AnalyticsEvent($('#track-me')) => This sends the event
## OR IF YOU NEED TO DEFER TRACKING FOR SOME REASON
## 1. Create an instance initialized with the element - var evt = new AnalyticsEvent($('#track-me'), {trackOnInit : false}) => This does NOT send an event
## 2. evt.eventLabel = 'my-label' // Add or edit properties before sending the event
## 3. Call 'track' on this instance - evt.track(); => This sends the event
## TRACKING GENERIC JS EVENTS ##
##-----------------------------------##
## For non element click events, pass a hash of event properties
## Usage - 1. Create the event hash - var hash = {category : 'required string', action : 'required string', label : 'optional string', value : optional_number }
## 2. Initialize with the element - new AnalyticsEvent(hash) => This sends the event
## OR IF YOU NEED TO DEFER TRACKING FOR SOME REASON
## 1. Create an instance initialized with the hash - var evt = new AnalyticsEvent(hash, {trackOnInit : false}) => This does NOT send an event
## 2. evt.eventLabel = 'my-label' // Add or edit properties before sending the event
## 3. Call 'track' on this instance - evt.track(); => This sends the event
class @AnalyticsEvent
constructor : (el_or_hash, args) -> # jQuery element or hash of event properties
throw new Error('A jQuery element or event hash are required to initialize') unless el_or_hash
defaults =
trackOnInit : true
options = $.extend({}, defaults, args)
if el_or_hash instanceof jQuery
$el = el_or_hash
@eventCategory = if $el.data('event-category') is undefined then false else $el.data('event-category')
@eventAction = if $el.data('event-action') is undefined then false else $el.data('event-action')
@eventLabel = if $el.data('event-label') is undefined then null else $el.data('event-label')
@eventValue = if $el.data('event-value') is undefined then null else parseInt($el.data('event-value'))
else
hash = el_or_hash
@eventCategory = if hash['category'] is undefined then false else hash['category']
@eventAction = if hash['action'] is undefined then false else hash['action']
@eventLabel = if hash['label'] is undefined then null else hash['label']
@eventValue = if hash['value'] is undefined then null else parseInt(hash['value'])
do @track if options.trackOnInit is true
createEvent : ->
if @eventCategory && @eventAction
pushableEvent = ['_trackEvent', @eventCategory, @eventAction]
if @eventLabel
pushableEvent.push @eventLabel
pushableEvent.push @eventValue if @eventValue # This must go inside (if @eventLabel) because of the accepted order of params in the _gaq array
return pushableEvent
else
throw new Error "eventCategory and eventAction are required tracking properties"
pushEvent : (pushableEvent) ->
if pushableEvent && pushableEvent.length >= 3
try
_gaq.push pushableEvent
<% unless Rails.env == 'production' %>
do @log
<% end %>
catch error
console.log error
else
throw new Error( "A valid event is required for tracking" )
track : -> @pushEvent( do @createEvent )
log : ->
console.log "[Analytics Event] category : '#{@eventCategory}' || action : '#{@eventAction}' || label : '#{@eventLabel}' || value : #{@eventValue}"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment