tracker.js

// const news = document.getElementById("news");

// ================== output div for testing/debugging ===================
// var div = document.createElement("div");
// div.style.background = "rgba(0,0,0,0.9)";
// div.style.overflow = "hidden";
// div.style.zIndex = "10";
// div.style.position = "fixed";
// div.style.top = "10px";
// div.style.left = "50%";
// div.style.transform = "translateX(-50%)";
// div.style.padding = "10px";
// div.style.marginTop = "10px";
// div.style.color = "white";
// div.style.borderRadius = "10px";

// document.body.appendChild(div);

// ================== find if news article is in viewport =================
var news = document.getElementById("news");
news.style.background = "orange";

prevElemTop = news.getBoundingClientRect().top;
prevElemBottom = news.getBoundingClientRect().bottom;

function newsArticleIsInViewport() {
  elemTop = news.getBoundingClientRect().top;
  elemBottom = news.getBoundingClientRect().bottom;
  if (elemTop > window.innerHeight || elemBottom < 0) {
    return false;
  } else {
    return true;
  }
}
// ========================= init newsArticleWasInViewport =======
var prevTimestamp = new Date(Date.now());
var newsArticleWasInViewport = false;
if (newsArticleIsInViewport()) {
  newsArticleWasInViewport = true;
} else {
  newsArticleWasInViewport = false;
}
console.log("newsArticleIsInViewport = " + newsArticleWasInViewport);

// ========================== scroll track ========================
var readTimeInSecs = 0;
window.addEventListener("scroll", function() {
  var currentTimestamp = new Date(Date.now());
  timeDiffInMillis = currentTimestamp - prevTimestamp;
  timeDiffInSecs = timeDiffInMillis / 1000;
  prevTimestamp = currentTimestamp;
  console.log("Difference = " + timeDiffInSecs);
  if (newsArticleWasInViewport) {
    // div.innerHTML = "ID=" + newsId + " | " + new Date(Date.now()).toUTCString();
    if (newsArticleIsInViewport()) {
      readTimeInSecs += timeDiffInSecs;
      newsArticleWasInViewport = true;
    } else {
      //send data
      readTimeInSecs = Math.floor(readTimeInSecs * 100) / 100;
      alert("readTimeInSecs = " + readTimeInSecs);
      sendData(readTimeInSecs);
      console.log("readTimeInSecs = " + readTimeInSecs);
      newsArticleWasInViewport = false;
    }
  } else {
    // div.innerHTML = "ID=" + newsId + " | " + new Date(Date.now()).toUTCString();
    readTimeInSecs = 0;
    if (newsArticleIsInViewport()) {
      newsArticleWasInViewport = true;
    } else {
      newsArticleWasInViewport = false;
    }
  }
});

// ================= send data ===============
function sendData(readTimeInSecs) {}

// ================== cookie =================
//6.04e+8 --> a week in milliseconds
function createCookie() {
  var now = new Date();
  var year = now.getUTCFullYear();
  var expireYear = year + 10;
  now.setYear(expireYear);
  document.cookie =
    "clientId=" + newsId + ";expires=" + now.toUTCString() + ";path=/";
  console.log("cookie -> " + document.cookie);
}

function getCookie(name) {
  var value = "; " + document.cookie;
  var parts = value.split("; " + name + "=");
  if (parts.length == 2)
    return parts
      .pop()
      .split(";")
      .shift();
}

function updateExpirationDate(clientId) {
  var now = new Date();
  var year = now.getUTCFullYear();
  var expireYear = year + 10;
  now.setYear(expireYear);
  document.cookie =
    "clientId=" + clientId + ";expires=" + now.toUTCString() + ";path=/";
}

// ================= check cookie ==================
if (document.cookie.indexOf("clientId") >= 0) {
  alert("Client ID found ... expiration updated");
  updateExpirationDate(getCookie("clientId"));
  console.log(getCookie("clientId"));
} else {
  alert("Client ID not found ... hence created");
  createCookie();
}

// ================= ajax call post =======================
// =================== single news tag fix =============
var singleNewsContent = document.getElementById("single-news-content");
var convert = function(convert) {
  return $("<span />", { html: convert }).text();
};
singleNewsContent.innerHTML = convert(singleNewsContent.innerHTML);

// =================== remove feature tag from single news ===================
var figureArray = singleNewsContent.getElementsByTagName("figure");
// console.log(figureArray);
$.each(figureArray, function(i, el) {
  // console.log(el);
  el.style.display = "none";
});