jQuery(function($) {
// Debug flag
var debugMode = true;
// Default time delay before checking location
var callBackTime = 100;
// # px before tracking a reader
var readerLocation = 150;
// Set some flags for tracking & execution
var timer = 0;
var scroller = false;
var endContent = false;
var didComplete = false;
// Set some time variables to calculate reading time
var startTime = new Date();
var beginning = startTime.getTime();
var totalTime = 0;
// Get some information about the current page
var pageTitle = document.title;
// Track the aticle load
if (!debugMode) {
ga('send', 'event', 'Reading', 'ArticleLoaded', pageTitle, {'nonInteraction': 1});
} else {
alert('The page has loaded. Woohoo.');
}
// Check the location and track user
function trackLocation() {
bottom = $(window).height() + $(window).scrollTop();
height = $(document).height();
// If user starts to scroll send an event
if (bottom > readerLocation && !scroller) {
currentTime = new Date();
scrollStart = currentTime.getTime();
timeToScroll = Math.round((scrollStart - beginning) / 1000);
if (!debugMode) {
ga('send', 'event', 'Reading', 'StartReading', pageTitle, timeToScroll, {'metric1' : timeToScroll});
} else {
alert('started reading ' + timeToScroll);
}
scroller = true;
}
// If user has hit the bottom of the content send an event
if (bottom >= $('.entry-content').scrollTop() + $('.entry-content').innerHeight() && !endContent) {
currentTime = new Date();
contentScrollEnd = currentTime.getTime();
timeToContentEnd = Math.round((contentScrollEnd - scrollStart) / 1000);
if (!debugMode) {
if (timeToContentEnd < 60) {
ga('set', 'dimension5', 'Scanner');
} else {
ga('set', 'dimension5', 'Reader');
}
ga('send', 'event', 'Reading', 'ContentBottom', pageTitle, timeToContentEnd, {'metric2' : timeToContentEnd});
} else {
alert('end content section '+timeToContentEnd);
}
endContent = true;
}
// If user has hit the bottom of page send an event
if (bottom >= height && !didComplete) {
currentTime = new Date();
end = currentTime.getTime();
totalTime = Math.round((end - scrollStart) / 1000);
if (!debugMode) {
ga('send', 'event', 'Reading', 'PageBottom', pageTitle, totalTime, {'metric3' : totalTime});
} else {
alert('bottom of page '+totalTime);
}
didComplete = true;
}
}
// Track the scrolling and track location
$(window).scroll(function() {
if (timer) {
clearTimeout(timer);
}
// Use a buffer so we don't call trackLocation too often.
timer = setTimeout(trackLocation, callBackTime);
});
});
<body>
<div class="entry-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tempor ipsum quis velit imperdiet sit amet vulputate diam elementum. Maecenas luctus, turpis pretium gravida tincidunt, nulla nibh feugiat nibh, posuere vestibulum odio purus condimentum mi. Vivamus nisi nulla, feugiat et tempor a, ultricies eu elit. Mauris cursus quam a purus venenatis blandit. In dolor justo, sodales eu interdum quis, dignissim placerat magna. Donec sagittis porttitor orci, et euismod ligula semper ut. Mauris auctor venenatis sapien, ut egestas ligula vulputate sit amet. In hac habitasse platea dictumst. Quisque id purus vitae diam mattis sollicitudin. Aliquam est ante, laoreet luctus tincidunt id, blandit vitae purus.
<br />
<br />
Praesent ac nunc sit amet arcu dignissim gravida. Vestibulum rutrum orci ut erat vestibulum pharetra. Vestibulum odio diam, porttitor non sagittis vitae, egestas quis ligula. Donec metus felis, tincidunt eget luctus quis, ultricies vitae arcu. Ut luctus mollis augue, vitae elementum velit dignissim id. Mauris gravida enim non eros porttitor bibendum. Integer mollis vestibulum condimentum. Duis blandit orci eu dui fringilla ac ultricies magna mollis. Aliquam convallis, felis a mollis consequat, tortor dolor convallis mauris, at blandit nisi justo at mi. Nulla ac orci diam. Donec in est magna, in sagittis turpis.
<br />
<br />
Donec a feugiat orci. Vivamus rutrum accumsan ante sit amet semper. In semper tincidunt mollis. Maecenas justo ligula, pellentesque sed imperdiet id, dapibus nec nunc. In interdum sapien ut leo euismod et scelerisque sem sagittis. Praesent sapien nunc, sodales eu consectetur volutpat, condimentum egestas magna. Morbi euismod, sapien ut feugiat placerat, mauris diam scelerisque mi, ut auctor leo tortor vitae augue. Nunc venenatis, quam in malesuada auctor, metus dui sagittis massa, sit amet convallis enim nibh eget orci. Nulla est urna, elementum a posuere pulvinar, vehicula ac arcu. Aenean ac purus dui. Vestibulum et urna non nibh ullamcorper auctor. In hac habitasse platea dictumst. Sed ut felis massa, at consequat sapien. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
<br />
<br />
Nunc eleifend ipsum in dolor aliquet nec luctus eros varius. Cras fermentum dignissim purus, eu vulputate risus elementum vel. Duis odio erat, molestie eu rhoncus nec, pharetra et eros. Nullam lectus nisl, faucibus a pharetra ut, rutrum et tellus. Praesent faucibus turpis ut nibh egestas tincidunt. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas molestie mauris ut velit dignissim at elementum enim condimentum. Morbi feugiat varius dictum. Sed a ultrices velit.
<br />
<br />
Integer commodo consectetur nisi vel elementum. Mauris egestas lacinia tempus. Sed facilisis eleifend erat at bibendum. Morbi neque libero, molestie et sagittis quis, dapibus ultricies ipsum. Nulla porta nibh sed enim pellentesque quis vulputate nisl sagittis. Aliquam quis metus eleifend augue gravida egestas nec vitae nibh. Donec ut vehicula libero. Donec non enim massa. Ut suscipit eleifend vulputate. Aliquam erat volutpat. Pellentesque sit amet iaculis metus. Donec id turpis vel lacus luctus dignissim. Curabitur lacinia ornare posuere. Nullam a velit tortor.
<br />
<br />
Pellentesque gravida, lorem sit amet dictum congue, lectus metus venenatis velit, vel gravida quam neque ut leo. Sed varius molestie nulla, et ultrices tortor rutrum in. Nullam felis metus, lacinia eget dictum vel, congue id tellus. Sed condimentum magna sit amet lacus elementum tristique vitae non mi. Mauris id massa nunc. Etiam dictum gravida nunc, a porta lorem dignissim a. Sed ligula eros, sodales nec suscipit rhoncus, faucibus nec justo. Phasellus consequat bibendum eros, in sodales elit dignissim ac. Nunc vitae libero eu velit vehicula aliquet dapibus vel purus. Donec non diam augue, in sagittis nulla. Duis egestas, eros eu porttitor adipiscing, massa metus rhoncus ipsum, a lobortis eros metus at ante. Fusce ut mollis orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam convallis dui ac tellus tempor ac eleifend sem scelerisque.
<br />
<br />
Phasellus et dolor eu purus ullamcorper scelerisque. Nulla facilisi. Integer cursus tincidunt purus, at auctor ligula consectetur vitae. Nam tempus, orci vel venenatis fermentum, metus mi porttitor neque, quis dignissim ipsum purus a nunc. Pellentesque sit amet vehicula risus. Etiam in urna a mauris tincidunt hendrerit eu sit amet libero. Quisque erat quam, tristique quis congue vitae, iaculis sed nisi. Mauris vitae felis quis erat pretium malesuada non euismod eros. Sed eget odio velit. Suspendisse molestie rhoncus quam, eget dictum risus sollicitudin eu. Phasellus rutrum libero a ligula euismod dapibus elementum enim consectetur. Vestibulum fringilla justo tristique ligula ullamcorper luctus. Etiam quis neque lacus, eu semper nulla. Ut ac ante eget mi faucibus faucibus. Nunc at nisi in felis lacinia venenatis. Nullam in urna tellus.
<br />
<br />
Ut et ipsum quam, vel faucibus mi. Maecenas euismod tincidunt ultrices. Donec faucibus elit quis erat suscipit id tempor dolor tempus. Etiam condimentum consectetur nulla, at mattis odio tempor at. Curabitur et metus felis, eu adipiscing est. Cras mollis tincidunt ligula. Aenean convallis viverra mauris a venenatis. Proin tempor eros id est volutpat in adipiscing mi aliquam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras viverra, turpis vel porttitor dapibus, mauris orci rutrum augue, id facilisis nulla quam sed dolor. Cras orci justo, suscipit non rhoncus quis, scelerisque sed orci. Donec sodales laoreet lobortis.
<br />
<br />
Proin venenatis tincidunt fringilla. Nulla vulputate ullamcorper augue, ac adipiscing nunc tincidunt ac. Maecenas a nibh erat, nec vulputate nisl. Vivamus a mauris augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Aliquam dictum nunc sit amet sem posuere hendrerit. Aliquam sed ultricies leo. Phasellus nec odio sed nisl sollicitudin gravida nec non velit. In at leo lorem, nec varius tellus. Aliquam purus ligula, euismod a tempus quis, tempor vitae quam. Nulla tempus, erat a condimentum commodo, lacus ipsum auctor nibh, in imperdiet magna nunc nec turpis. Maecenas non fermentum turpis. Nunc pulvinar nisi a sem aliquam eget fringilla sem pharetra. Pellentesque egestas metus nec tellus congue ac auctor arcu porta. Nullam molestie, mauris at pulvinar lobortis, orci arcu venenatis velit, et euismod leo diam ut nisl.
<br />
<br />
Cras arcu nulla, placerat at sodales accumsan, fringilla id lectus. Mauris in ligula eu nunc vulputate tempus. Sed eu erat vitae libero vestibulum tempor id id justo. Cras feugiat euismod nisi, sed vulputate nisi auctor at. Ut eu arcu vitae metus faucibus aliquet id et metus. Sed dignissim diam in quam fringilla sit amet eleifend turpis placerat. In ut elit odio, eu pharetra nibh. Praesent sed ligula est, sit amet consectetur erat. Fusce urna odio, sollicitudin consequat bibendum non, pharetra ac odio. Maecenas malesuada commodo neque non ullamcorper. Aenean quis sapien eu nunc commodo fermentum in sed nunc. Donec venenatis erat sed nisl molestie pretium. Sed mattis augue at ligula congue ut iaculis justo varius. Donec ac urna laoreet massa aliquam ultricies imperdiet vehicula lacus. Aenean posuere libero sit amet justo sagittis semper.
<br />
<br />
Sed lorem purus, facilisis id accumsan at, ultricies non velit. Suspendisse potenti. Curabitur porta, augue id porta molestie, odio lacus elementum augue, molestie semper enim est vel libero. Nulla vulputate, nibh eget tristique luctus, risus mauris ullamcorper nisl, ac feugiat nulla metus vel risus. Donec sed interdum ante. Nullam ac arcu enim. Pellentesque a lorem nec turpis tempus varius. Praesent orci orci, convallis non interdum id, rutrum eget tortor. Fusce tristique tellus nec mi malesuada laoreet. Nam auctor, odio non rhoncus dignissim, orci eros pretium erat, ut luctus arcu odio in orci. Integer pellentesque ipsum ut nibh lacinia tincidunt. Duis mollis luctus sem quis congue. Curabitur hendrerit ligula in purus suscipit blandit.
<br />
<br />
</div>
<b>Content section just ended</b>
<br />
<br />
Praesent aliquet suscipit dapibus. Proin suscipit ullamcorper metus, et gravida nisi elementum sodales. Nunc vitae nisi sem, nec pellentesque lacus. Morbi vitae purus diam, sit amet pharetra orci. Cras convallis rutrum enim at rutrum. Nullam ultrices iaculis leo, vel laoreet elit varius eu. Sed ornare convallis consectetur. Quisque ut justo quis ipsum tempus pellentesque mattis non turpis. Duis quis varius odio. Integer sit amet scelerisque quam. Etiam eget nibh at sapien porttitor tristique sit amet sagittis nisi. Nam sit amet dui eu ante congue pretium vel non massa. Quisque varius vehicula laoreet. Mauris lectus est, lacinia vel elementum sit amet, eleifend quis nunc. Sed nec arcu id ante convallis facilisis eu quis justo. Nam pharetra odio vitae magna laoreet sit amet feugiat sapien molestie.
<br />
<br />
Suspendisse et vulputate quam. Sed ut est in elit volutpat ullamcorper et nec est. Proin consequat arcu ultrices enim euismod hendrerit. Nulla varius placerat purus, in sagittis nisl euismod vitae. Duis ac ipsum at augue sagittis ornare at eget purus. Ut neque justo, ullamcorper sit amet aliquet eget, commodo a nunc. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
<br />
<br />
Vivamus ac magna magna. Vestibulum a ultrices lorem. Praesent porta augue ut arcu pharetra fermentum. Nulla ac risus a dui tempor semper. Morbi vel viverra tortor. Etiam dolor ipsum, tempus vel fringilla sed, pellentesque sed lacus. Nunc quis velit arcu, ut faucibus odio. Aenean eu lorem congue libero egestas dignissim. Aenean nec nulla sit amet lectus placerat sollicitudin gravida vel diam. Cras viverra, est et auctor elementum, leo mi vulputate urna, malesuada accumsan nisi ante vitae orci. Aenean nunc nisl, lobortis nec pulvinar convallis, placerat vitae lorem. Sed adipiscing cursus arcu, ut malesuada velit pellentesque in. Aliquam sed dolor sed ligula ultricies imperdiet vitae at urna.
<br />
<br />
Etiam at porttitor sem. Sed sollicitudin tincidunt purus sed vulputate. Quisque ut sapien elit. Integer lacus risus, viverra eu adipiscing ut, imperdiet vestibulum leo. Integer vel neque erat. Phasellus egestas nibh id sapien euismod rhoncus. Donec metus magna, feugiat ut tincidunt in, suscipit ac nisl. Nunc nec mauris dui, eget posuere nunc. Sed sed orci ut nisi aliquam suscipit a et diam. Nullam in mollis massa.
</body>