Firefox Browser Tab Activity Tracker Add-on

The following extension tracks browser tab activity - away/back. The time you leave a browser tab (change the active browser tab) and the time you returned are stored. The total time spent on the tab (page) and the time spent away are displayed to check efficiency. The data will be reset as soon as the page is refreshed.

Create a folder named tab_change and add the following manifest.json and tab_change.js files to this folder.

	{
	"manifest_version": 2,
	"name": "Tab Activity",
	"version": "1.0",
	"description": "Tracks Browser Tab Activity - Away/Back.",
	"content_scripts": [
	{
	"matches": ["*://*/*"],
	"js": ["tab_change.js"]
	}
	]
	}

view raw manifest.json hosted with ❤ by GitHub

	var hidden, visibilityChange;
	var away_d = [new Date()];
	var back_d = [new Date()];
	var tab_div = document.createElement('div');
	tab_div.id = "tab_activity_tracker";
	document.body.appendChild(tab_div);
	if (typeof document.hidden !== "undefined") {
	hidden = "hidden";
	visibilityChange = "visibilitychange";
	}
	else if (typeof document.msHidden !== "undefined") {
	hidden = "msHidden";
	visibilityChange = "msvisibilitychange";
	}
	else if (typeof document.webkitHidden !== "undefined") {
	hidden = "webkitHidden";
	visibilityChange = "webkitvisibilitychange";
	}
	function formatDate(dateObject){
	return dateObject.toString().split("GMT")[0];
	}
	function getHeaderElement(textContent){
	var header = document.createElement('h3');
	header.textContent = textContent;
	return header;
	}
	function handleVisibilityChange() {
	var tab_div_t = document.getElementById("tab_activity_tracker");
	tab_div_t.textContent = "";
	tab_div_t.appendChild(getHeaderElement("Start Time: " + formatDate(back_d[0])));
	var total_away = 0;
	var total_spent = 0;
	if (document[hidden]) {
	away_d.push(new Date());
	}
	else {
	back_d.push(new Date());
	}
	var i;
	for(i = 1; i < away_d.length; ++i){
	tab_div_t.appendChild(getHeaderElement("Away: (" + i + ") " + formatDate(away_d[i])));
	tab_div_t.appendChild(getHeaderElement("Back: (" + i + ") " + formatDate(back_d[i]) + ", " + (back_d[i].getTime()-away_d[i].getTime())/1000 + " Seconds"));
	total_away += (back_d[i].getTime()-away_d[i].getTime())/1000;
	if(i > 0){
	total_spent += (away_d[i].getTime()-back_d[i-1].getTime())/1000;
	}
	}
	tab_div_t.appendChild(getHeaderElement("Total Time Spent: " + total_spent + " Seconds"));
	tab_div_t.appendChild(getHeaderElement("Total Time Away: " + total_away + " Seconds"));
	document.body.appendChild(tab_div_t);
	}
	document.addEventListener(visibilityChange, handleVisibilityChange, false);

view raw tab_change.js hosted with ❤ by GitHub

Go to about:debugging in Firefox and click Load Temporary Add-on and load the manifest.json file. Then visit the webpages as you normally do. The times/durations of tab changes you make will be appended to the end of the page along with the total time spent on the particular page.