Extra ergonomic features for FreshTomato's router frontend

seasonedTomato.js

// Extra ergonomic features for FreshTomato's router frontend
// https://www.freshtomato.org/


let after = (ms, fn) => window.setTimeout(fn, ms);
let each = (ms, fn) => after(ms, () => { fn(); each(ms, fn); });
let Q = sel => [ ... document.querySelectorAll(sel) ];

// Color-code interfaces so we can tell who is wired in and who is on which wifi
[
	'.unknown { background: grey; }',
	'.br0 { background: aliceblue; }',
	'.eth1 { background: aquamarine; }',
	'.eth2 { background: salmon; }',
].forEach(rule =>
	document.styleSheets[0].insertRule(rule, 0)
);

// The page will auto-refresh every 5 seconds or so, wiping some of our changes. So be persistent.
each(500, () => {
	if (location.pathname.match('status-devices')) {
    
    // Color-code interfaces so we can tell who is wired in and who is on which wifi
		[ ... document.querySelectorAll(
				'.tomato-grid tbody tr .co1'
		) ].forEach(el => {
			el.classList.add(el.innerHTML || 'unknown');
			if (el.innerHTML == 'br0') el.style = 'background: aliceblue';
			if (el.innerHTML == 'eth1') el.style = 'background: aquamarine';
			if (el.innerHTML == 'eth2') el.style = 'background: salmon';
		});
		
    // Add a quick link to MAC address lookup
		Q(
			'.co2'
		).forEach((el, i) => {
			if (i === 0) return;
			let macAddress = e.firstChild.data;
			let link = document.createElement('a');
			link.innerText = ' [👀]';
			link.href = 'https://google.com/?q=' + macAddress;
			el.insertBefore(link, el.firstChild);
		});

		
	}

		
});