Twitter - add unread notifications count in the tab title

Adds unread notifications count in the tab title

Versión del día 7/8/2016. Echa un vistazo a la versión más reciente.

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

You will need to install an extension such as Tampermonkey to install this script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Necesitará instalar una extensión como Tampermonkey para instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

// ==UserScript==
// @name        Twitter - add unread notifications count in the tab title
// @author      darkred
// @description Adds unread notifications count in the tab title
// @include     https://twitter.com/*
// @version     2016.08.07
// @grant       none
// @require     https://greasyfork.org/scripts/21927-arrive-js/code/arrivejs.js?version=139586
// @namespace rikkie
// ==/UserScript==

var counter;

function addCounterInTitle() {
	counter = parseInt(document.querySelector('.count-inner').innerHTML);
	if (counter > 0 && document.title.indexOf('|') === - 1) {
		document.title = counter + ' | ' + document.title;
	} else if (counter === 0) {
		document.title = /[0-9]*\\|(.*)/g.exec(document.title) [1];
	}
}



// After the 'Notifications' counter is first visible in the page (= the selector below is for the element: 'the 1st avatar thumbnail in the "Who to follow" panel')
document.arrive('div.js-account-summary:nth-child(1) > div:nth-child(2) > a:nth-child(1) > img:nth-child(1)', function () {
	addCounterInTitle();
});



// Whenever there are new unread tweets in the timeline...
document.arrive('.new-tweets-bar', function () {
	var target = document.querySelector('.new-tweets-bar'); // ... οbserve the unread counter for changes(increase) ...
	var observer = new MutationObserver(function (mutations) {
		mutations.forEach(function (mutation) {
			addCounterInTitle(); // ... and refresh the counter on every such change
		});
	});
	var config = {
		childList: true,
	};
	observer.observe(target, config);
});



// Refresh the counter when there are no unread tweets
document.leave('.new-tweets-bar', function () {
	addCounterInTitle();
});



// Whenever viewing the 'Notifications' tab  ('the '.toggle-item-4' is the selector for the 'People you follow' link in the 'Notifications' tab)...
document.arrive('.toggle-item-4', function () {
	document.querySelector('.count-inner').innerHTML = 0;				// ... reset the counter
	document.title = /[0-9]*\\|(.*)/g.exec(document.title) [1];		// ... and the tab title
});



// Observe the 'Notifications' counter for changes
var target2 = document.querySelector('.count-inner');
// var target2 = document.querySelector('.count');
var observer2 = new MutationObserver(function (mutations) {
	mutations.forEach(function (mutation) {
		addCounterInTitle();
	});
});
var config2 = {
	childList: true,
};
observer2.observe(target2, config2);