This is an javascript object that is designed to manage both page-level and event level pixels. The library provides facilities to automatically tag sections of the page with events, derive names from the HTML. There is also additional verification performed on page-level pixels to ensure that it is not possible to accidentally trigger a page pixel twice. This library also integrates multiple pixel libraries, in particular Google Analytics and Omniture Insight. The code that drives this is object oriented JavaScript.
/*
Simplexity Tracking Pixel Control Library
Marketing Technology Team
written by Tor N. Johnson
Requirements: JQuery
This library is designed to provide a mechanism to display the Insight tracking pixels at
either the page or event level. The library also supports the passing of parameters manually
that would normally be detected in the query string.
Useful Functions
invokePagePixel()
This fires the page tag (will ONLY fire the first time called)
setParam(ParamName, Value)
This sets a page or event parameter.
fireEvent(EventName, EventStatus, Callback)
This fires an event pixel. The event name is required (the rest are optional), The Callback MUST be a function.
attachClickEvent(ClassOrID,EventName, EventStatus, Callback)
This is a shorthand function to attach an event to a click. The ClassOrID value can be any class or ID.
Be sure to include the . or # in the ClassOrID value. If the event name is left off, but there is a rel: value
defined on the element, that value will be used as the event name.
Sample Page Embed:
Sample Page Embed with Event Tags Assigned & Triggered
*/
if(typeof mtPixel != "function"){
// Initialize global google pixel variable
var _gaq = _gaq || [];
var mtPixel = (function() {
"use strict";
var mtPixelsInstance;
function Singleton() {
if (mtPixelsInstance) {
return mtPixelsInstance;
}
mtPixelsInstance = this;
//Singleton initialization code
// Functions -------------------------------------------------------------------------
function sslStatus() {
if (location.href.indexOf("https:") != -1) {
return "https://";
}
else {
return "http://"; //this should contain the domain of the web site
}
}
this.cleanseQSParamsFromURL = function(param) {
param = param.split("#")[0];
var paramParts = param.split('?');
var paramBody = paramParts[0];
if (typeof paramParts[1] != 'undefined') {
var pListsToKeep = new Array;
var paramURLs = paramParts[1].split('&');
for (var URL in paramURLs) {
if (typeof qsParam[paramURLs[URL].split('=')[0].toLowerCase()] == "undefined" && jQuery.inArray(paramURLs[URL].split('=')[0].toLowerCase(), excludeTheseQSParams) == -1) {
pListsToKeep.push(paramURLs[URL]);
}
}
if (pListsToKeep.length >= 1) {
return paramBody + "?" + pListsToKeep.join("&");
} else {
return paramBody;
}
} else {
return param;
}
}
this.returnParam = function(qSp) {
return qsParam[qSp];
}
this.setParam = function(paramName, paramValue) {
// Check for parameter existence
if (typeof qsParam[paramName] == "undefined") {
return false;
}
if (paramName === "pageURI") {
paramValue = this.cleanseQSParamsFromURL(paramValue);
}
// Set the value
qsParam[paramName] = paramValue;
return true;
} // end setParam()
function invokeGoogle() {
_gaq.push(['_setAccount', gaAccount],
['_setAllowLinker', true],
['_trackPageview'],
['_setCustomVar',
1, // This custom var is set to slot #1. Required parameter.
'referringdomain', // Variable Name. Required parameter.
qsParam["referringdomain"], // Variable Value Required parameter.
3 // Sets the scope to page-level. Optional parameter. 3=page, 2=session, 1=user.
],
['_setCustomVar',
2, // This custom var is set to slot #1. Required parameter.
'refcode1', // Variable Name. Required parameter.
qsParam["refcode1"], // Variable Value Required parameter.
3 // Sets the scope to page-level. Optional parameter. 3=page, 2=session, 1=user.
],
['_setCustomVar',
3, // This custom var is set to slot #1. Required parameter.
'refcode2', // Variable Name. Required parameter.
qsParam["refcode2"], // Variable Value Required parameter.
3 // Sets the scope to page-level. Optional parameter. 3=page, 2=session, 1=user.
],
['_setCustomVar',
4, // This custom var is set to slot #1. Required parameter.
'agent', // Variable Name. Required parameter.
qsParam["agent"], // Variable Value Required parameter.
3 // Sets the scope to page-level. Optional parameter. 3=page, 2=session, 1=user.
]);
(function() {
var ga = document.createElement('script');
ga.type = 'text/javascript';
ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'stats.g.doubleclick.net/dc.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga, s);
})();
gaPixelInvoked = 1;
return true;
} // end invokeGoogle
function escapeModified(s) {
return escape(s).replace(/\+/g, "%2B");
} // end escapeModified()
// This is the page tracking pixel. It can be invoked only once.
this.invokePagePixel = function() {
if (pagePixelInvoked == 0) {
// combine all the parameters into a single string
var qsParamString = null;
for (var paramName in qsParam) {
if (typeof qsParam[paramName] != "undefined" && qsParam[paramName] != null) {
if (qsParamString == null) {
qsParamString = "&" + paramName + "=" + escapeModified(qsParam[paramName]);
} else {
qsParamString = qsParamString + "&" + paramName + "=" + escapeModified(qsParam[paramName]);
}
}
}
// combine the src pieces into a link
var pixelImgSrc = sslStatus() + sourceURL + pixelFile + qsParamString;
// write the image tag to the document
var pageTrackingPixel = new Image();
pageTrackingPixel.src = pixelImgSrc;
pageTrackingPixel.border = 0;
pageTrackingPixel.width = 1;
pageTrackingPixel.height = 1;
pagePixelInvoked = 1;
if (location.host.search('wirefly.com') > 0) {
invokeGoogle(); // This triggers google analytics
}
document.body.appendChild(pageTrackingPixel); // This fires the InSight Pixel
} else {
return false;
}
} // end invokePagePixel()
// This actually fires the event pixel itself
this.fireEvent = function(eventName, eventStatus, callback) {
// Gather the eventTime
var eventTime = new Date().getTime();
// combine all the parameters into a single string (exclude page Only parameters)
var qsParamString = "&" + "cb=" + eventTime + "&event=" + eventName;
for (var paramName in qsParam) {
if (typeof qsParam[paramName] != "undefined" && qsParam[paramName] != null && jQuery.inArray(paramName, pageOnlyQSParams) == -1) {
qsParamString = qsParamString + "&" + paramName + "=" + escapeModified(qsParam[paramName]);
}
}
// Add the event status if present
if (typeof eventStatus != null) {
if (eventStatus != null && eventStatus != "") {
qsParamString = qsParamString + "&status=" + eventStatus;
} else {
eventStatus = "clicked";
}
} else {
var eventStatus = "clicked";
}
// combine the src pieces into a link
var pixelImgSrc = sslStatus() + sourceURL + eventFile + qsParamString;
// write the image tag to the document
var eventTrackingPixel = new Image();
$(eventTrackingPixel).load(function() {
// Run the callback function
if (callback && typeof (callback) === "function") {
callback();
}
return false;
});
$(eventTrackingPixel).error(function() {
// Run the callback function
if (callback && typeof (callback) === "function") {
callback();
}
return false;
});
$(eventTrackingPixel).attr('src', pixelImgSrc);
$(eventTrackingPixel).attr('border', '0');
$(eventTrackingPixel).attr('width', '1');
$(eventTrackingPixel).attr('height', '1');
if (gaPixelInvoked == 0) {
invokeGoogle();
}
//This is for if we ever turn event pxiels back on
//_gaq.push(['_trackEvent', 'events',eventName, eventStatus]) // Fires the Google Event
document.body.appendChild(eventTrackingPixel); // Fires the InSight Event
} // end fireEvent
// This function is used to attach events to click actions.
this.attachClickEvent = function(object, eventName, eventStatus) {
$(object).bind('click', function() {
if ($(object).attr("rel") && (eventName == null)) {
eventName = $(object).attr("rel");
}
if (eventName == null) {
return null;
}
mtPixelsInstance.fireEvent(eventName, eventStatus, function() {
if ($(object).attr("href")) {
var link_to_follow = $(object).attr("href");
if ($(object).attr("href").indexOf("#") == -1) {
window.location.href = link_to_follow;
}
if (typeof $(object).attr("rel") !== 'undefined') {
if ($(object).attr("rel").indexOf("tel:") != -1) {
window.location.href = object.attr("rel");
}
}
}
});
return false;
});
} // end attach click event
// This will exclude these parameters from pageURI values passed via event pixels
var excludeTheseQSParams = new Array("r", "r1");
// Set Default parameters and/or fixed parameters for PAGES
var qsParam = new Array();
qsParam["sw"] = screen.width;
qsParam["sh"] = screen.height;
qsParam["cd"] = screen.colorDepth;
qsParam["dr"] = document.referrer;
qsParam["cb"] = new Date().getTime();
qsParam["zipcode"] = null;
qsParam["referringdomain"] = null;
qsParam["refcode1"] = null;
qsParam["refcode2"] = null;
qsParam["eid"] = null;
qsParam["agent"] = null;
qsParam["aid"] = null;
qsParam["sid"] = null;
qsParam["pageURI"] = this.cleanseQSParamsFromURL(window.location.href);
// Page Pixel Invoke Count
var pagePixelInvoked = 0;
var gaPixelInvoked = 0;
//Google Pixel Controls
var gaAccount = "UA-34157317-1";
//PRN 64758
if (location.host.search('a1wireless.com') > 0) {
gaAccount = "UA-34157317-2";
}
// Set Default parameters for EVENTS
var eventFile = "/_images/Epixel.gif?log=1";
var pageOnlyQSParams = new Array("sw", "sh", "cd", "dr", "cb");
// Set the URL to load the pixel from
var sourceURL = "www.inphonic.com"; //this should contain the domain of the web site
// Set the pixel filename
var pixelFile = "/_images/tpixel.gif?Log=1";
// Load the Google Pixel Script Library
} // end singleton init
Singleton.getmtPixelsInstance = function() {
return mtPixelsInstance || new Singleton();
}
return Singleton;
} ());
}
//}// end mtPixels function
Related Projects
Select from the list of projects to view additional images and description.
