snegir

scrollDepth

Nov 24th, 2016
237
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.39 KB | None | 0 0
  1. <script>
  2.  
  3. (function ( $ ) {
  4.  
  5.  
  6. //определяем максимальную глубину скроллинга и функции обработки времени
  7. $.scrollEvent = function(current_max) {
  8. var documentObj = $(document);
  9. var windowObj = $(window);
  10.  
  11.  
  12. var documentHeight = documentObj.height();
  13. var windowHeight = windowObj.height();
  14. var currentHeight = windowHeight + documentObj.scrollTop();
  15.  
  16.  
  17. current_value = getPercent(documentHeight, currentHeight);
  18. return(current_max > current_value ? current_max : current_value);
  19. }
  20.  
  21.  
  22. $.fixTime = function() {
  23. var dateObj = new Date();
  24. return Math.floor(dateObj.getTime() / 1000);
  25. }
  26.  
  27.  
  28. function num(val){
  29. val = Math.floor(val);
  30. return val < 10 ? '0' + val : val;
  31. }
  32.  
  33.  
  34. $.timeFormat = function(ms){
  35. var sec = ms, hours = sec / 3600 % 24, minutes = sec / 60 % 60, seconds = sec % 60;
  36. return num(hours) + ":" + num(minutes) + ":" + num(seconds);
  37. };
  38.  
  39.  
  40.  
  41.  
  42. function getPercent(doc, cur) {
  43. return !cur ? 0 : Math.floor(cur * 100 / doc);
  44. }
  45.  
  46.  
  47. })( jQuery );
  48.  
  49.  
  50. //Определяем временные интервалы
  51. function getTimeInterval(time) {
  52. if (time >= 0 && time < 30)
  53. return 'from 0 sec to 30 sec';
  54. if (time >= 30 && time < 60)
  55. return 'from 30 sec to 1 min';
  56. if (time >= 60 && time < 120)
  57. return 'from 1 min to 2 min';
  58. if (time >= 120 && time < 180)
  59. return 'from 2 min to 3 min';
  60. if (time >= 180 && time < 300)
  61. return 'from 3 min to 5 min';
  62. if (time >= 300 && time < 480)
  63. return 'from 5 min to 8 min';
  64. if (time >= 480)
  65. return 'more 8 min';
  66. }
  67.  
  68.  
  69. //Определяем интервалы глубины скроллинга
  70. function getScrollingInterval(deep) {
  71. if (deep >= 0 && deep < 20)
  72. return 'from 0% to 20%';
  73. if (deep >= 20 && deep < 40)
  74. return 'from 20% to 40%';
  75. if (deep >= 40 && deep < 60)
  76. return 'from 40% to 60%';
  77. if (deep >= 60 && deep < 80)
  78. return 'from 60% to 80%';
  79. if (deep >= 80 && deep <= 100)
  80. return 'from 80% to 100%';
  81. }
  82.  
  83.  
  84. //Присваиваем характеристику читателю статьи исходя из глубины скроллинга и времени на странице
  85. function getCharacters(deep, time) {
  86. if (/Android|webOS|Windows Phone|Macintosh|Samsung|Nokia|Bada|Symbian|iPhone|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))
  87. var etalon = 21.1;
  88. else
  89. var etalon = 15.7;
  90. var documentH = jQuery(document).height();
  91. var etalonT = Math.floor(documentH / etalon, 2);
  92.  
  93. if (deep >= 70 && time >= 0.7 * etalonT)
  94. return 'Читал вдумчиво';
  95.  
  96. if (deep >= 70 && time < 0.7 * etalonT)
  97. return 'Читал по диагонали';
  98.  
  99. if (deep < 10)
  100. return 'Не читал вовсе';
  101.  
  102. if (deep >= 40 && deep < 70 && time >= 0.5 * 0.7 * etalonT)
  103. return 'Бросил читать на середине';
  104.  
  105. if (deep >= 10 && deep < 40 && time >= 0.25 * 0.7 * etalonT)
  106. return 'Бросил читать в начале';
  107.  
  108. if (deep >= 40 && deep < 70 && time < 0.5 * 0.7 * etalonT)
  109. return 'Просмотрел материал до середины';
  110.  
  111. if (deep >= 10 && deep < 40 && time < 0.25 * 0.7 * etalonT)
  112. return 'Начал просматривать, но бросил в начале';
  113. }
  114.  
  115.  
  116. //Осуществляем вызов вышеописанных функций и передаем данные в GTM
  117. jQuery(document).ready(function() {
  118. var startLiveDoc = jQuery.fixTime();
  119. var current_max = 0;
  120.  
  121.  
  122. jQuery(window).scroll(function() {
  123. current_max = jQuery.scrollEvent(current_max);
  124. });
  125.  
  126.  
  127. //назначаем объекту window событие, действие которого выполнится в момент завершения работы пользователя со страницей (закрытие, обновление, переход на другую страницу)
  128. jQuery(window).bind('beforeunload', function(){
  129. current_max_string = current_max.toString() + '%';
  130. var endLiveDoc = jQuery.fixTime();
  131. var timeLiveDoc = jQuery.timeFormat(endLiveDoc - startLiveDoc);
  132. var character = getCharacters(current_max, endLiveDoc - startLiveDoc);
  133. var percent_of_scrolling_int = getScrollingInterval(current_max);
  134. var time_on_page_int = getTimeInterval(endLiveDoc - startLiveDoc);
  135. dataLayer.push({'event': 'autoEvent', 'eventCategory': 'ScrollDepth', 'eventAction': character});
  136. });
  137. });
  138.  
  139. </script>
Advertisement
Add Comment
Please, Sign In to add comment