JSFiddle - React, Tailwind, and code Playground

by glebcha

JavaScript

function trackerUpdates(){
var userpanelTop = document.querySelectorAll('.userpanel')[0];
var trackerLink = document.querySelectorAll('.userpanel > .top > a.count')[0];
trackerLink.href = '#tracker_updates';
var updates = document.createElement('ul');
updates.className = 'updates';
updates.style.display = 'none';
userpanelTop.appendChild(updates);
trackerLink.onclick = function (event) {event.preventDefault(); updates.style.display = (updates.style.display != 'none' ? 'none' : 'block');};

function getUpdates(url, getUrl, extraElement) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.responseType = 'document';
xmlhttp.onreadystatechange = function() {
	if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
		var tracks = xmlhttp.responseXML.querySelectorAll(url);
		var extraEl = xmlhttp.responseXML.querySelectorAll(extraElement);
     
        for (i = 0; i < tracks.length; i++) {
			var post = tracks[i];
            if (extraEl[i] == 'undefined') {post.removeChild(post.firstElementChild);}
            if (extraEl[i] != 'undefined') {console.log(extraEl[i]);}
			updates.appendChild(post);
            post.outerHTML = post.outerHTML.replace(/td/g,"li");
		}
	  
		
	}
}
xmlhttp.open("GET", getUrl, true);
xmlhttp.send();
}

getUpdates('tr.new > td.post_title', '/tracker/', 'tr.new > td.comment_count');
getUpdates('tr.new > td.event_type', '/tracker/subscribers/', 'null');
getUpdates('tr.new > td.mention_type', '/tracker/mentions/', 'null');

}

var userpanel = document.querySelectorAll('.userpanel')[0];
    var userpanelTop = document.querySelectorAll('.userpanel > .top')[0];
    var userpanelBottom = document.querySelectorAll('.userpanel > .bottom')[0];
    var karmaDescription = document.querySelectorAll('.charge')[0];
    var companyHeader = document.querySelectorAll('#header_mouse_activity')[0];

      

if (companyHeader == null) {
    if (userpanelBottom != null) {
        userpanelTop.innerHTML += userpanelBottom.innerHTML;
       ...