Skip to content

Instantly share code, notes, and snippets.

@adilmezghouti
Created March 13, 2018 20:47
Show Gist options
  • Save adilmezghouti/d53d356f76238e69a84c11ab0acdbf65 to your computer and use it in GitHub Desktop.
Save adilmezghouti/d53d356f76238e69a84c11ab0acdbf65 to your computer and use it in GitHub Desktop.
Collect and push omniture tags
/**
* This function allows you to add a number of omniture tags and once they are all assigned non-empty values,
* they will be automatically submitted to the server
* @returns {{addTag: addTag, updatedTag: updatedTag}}
* @constructor
*/
var OmnitureTagger = function() {
var tags = {};
for (var i=0;i < arguments.length;i++) {
console.log(arguments[i]);
tags[arguments[i]] = '';
}
//Checks if all the tags are non empty
var isComplete = function() {
for(var tag in tags) {
console.log('tag: ' + tags[tag]);
if (!tags[tag]) return false;
}
return true;
};
//submit tags to the omniture server
var submitTags = function() {
console.log ("Tags: ", tags);
};
return {
//Adds a new tag, although it is prefered to add them all at once
//through the construction of the object
addTag: function(name) {
tags[name] = '';
return this;
},
//Updates a tag and checks if all the tags are assigned, if it is,
//it will go ahead and submit them to the server
updateTag: function(name, value) {
tags[name] = value;
if (isComplete()) submitTags();
}
}
};
/**
* This function observes an html tag for any added children
* @param elementSelector css selector of the html element that will be observed
* @param callback it retrieves the value from the newly added html element and updates the corresponding omniture tag
* @returns {{startObserving: startObserving, stopObserving: stopObserving}}
* @constructor
*/
var ComponentObserver = function(elementSelector, callback) {
var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
var list = document.querySelector(elementSelector);
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList') {
callback();
}
});
});
return {
startObserving: function() {
observer.observe(list, {
attributes: false,
childList: true,
characterData: false
});
},
stopObserving: function () {
observer.disconnect();
}
}
};
//---------------------------------- How to use it ----------------------------------------------------
$('body').prepend('<div id="quickShopContainer1"><div class="product-details-sku-wrapper"></div></div>');
var tagger = new OmnitureTagger('evar1','evar2','evar3');
var cssSelector = "#quickShopContainer1 .product-details-sku-wrapper";
var componentObserver1 = new ComponentObserver(cssSelector,
function() {tagger.updateTag('evar1', $(cssSelector).find('.badging').text());});
componentObserver1.startObserving();
var componentObserver2 = new ComponentObserver(cssSelector,
function() {tagger.updateTag('evar2', $(cssSelector).find('.badging').text());});
componentObserver2.startObserving();
var componentObserver3 = new ComponentObserver(cssSelector,
function() {tagger.updateTag('evar3', $(cssSelector).find('.badging').text());});
componentObserver3.startObserving();
$('#quickShopContainer1 .product-details-sku-wrapper').prepend('<div class="badging">This is a badge</div>');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment