$ youtube chat dialog filter

by Laurens Maneschijn

HTML

Bookmarklet, drag to bookmarks bar:<br>
<a target="_blank" href="javascript:(function(){ let docmnt = (document.querySelector(&apos;ytd-live-chat-frame&apos;)?.chatframe?.contentDocument) || document; function el(tagname, o) { return _set(docmnt.createElement(tagname), o); } function _set(el, o) { o = o || {}; if (o.parent) { o.parent.appendChild(el); } if (o.children) { o.children.forEach( (elchild) =&gt; {el.appendChild(elchild);} ); } if (o.id){ el.id = o.id; } if (o.className){ el.className = o.className; } if (o.text) { el.innerText = o.text; } if (o.html) { el.innerHTML = o.html; } if (o.properties) { Object.assign(el, o.properties); } if (o.style) { Object.assign(el.style, o.style); } if (o.attributes &amp;&amp; Array.isArray(o.attributes)) { o.attributes.forEach((a) =&gt; { el.setAttribute(a.name, a.value); }); } else if (o.attributes &amp;&amp; typeof o.attributes === &apos;object&apos;) { for (let p in o.attributes) { el.setAttribute(p, o.attributes[p]); } } if (o.events) { o.events.forEach((e) =&gt; { let eventnames = (e.eventnames || e.eventname || e.event).trim().split(/\s+/); eventnames.forEach((eventname) =&gt; { el.addEventListener(eventname, e.handler); }); }); } return el; } function getItemsTable(items) { let _t = el(&apos;table&apos;); let _tbody = el(&apos;tbody&apos;, {parent: _t}); items.forEach((i) =&gt; { let _tr = el(&apos;tr&apos;, { parent: _tbody, children: [ el(&apos;td&apos;, {text: i.timestamp}), el(&apos;td&apos;, {text: i.author}), el(&apos;td&apos;, {text: i.message}), ], }); }); return _t; } function getItems() { let list = docmnt.querySelector(&apos;yt-live-chat-app div#items.style-scope.yt-live-chat-item-list-renderer&apos;); if (!list) return []; let listitems = list.querySelectorAll(&apos;yt-live-chat-text-message-renderer &gt; div#content&apos;); let items = Array.from(listitems).map((el) =&gt; { let author = &apos;&apos;, message = &apos;&apos;, timestamp = &apos;&apos;; author =...

JavaScript

// convert below to bookmarklet using jsfiddle "convert javascript into a bookmarklet":
// https://jsfiddle.net/ElMoonLite/ndg24dso/

// return to prevent jsfiddle running js below:
return;

// javascript:
(function(){
	let docmnt = (document.querySelector('ytd-live-chat-frame')?.chatframe?.contentDocument) || document;
	function el(tagname, o) {
		return _set(docmnt.createElement(tagname), o);
	}
	function _set(el, o) {
		o = o || {};
		if (o.parent) { o.parent.appendChild(el); }
		if (o.children) { o.children.forEach( (elchild) => {el.appendChild(elchild);} ); }
		if (o.id){ el.id = o.id; }
		if (o.className){ el.className = o.className; }
		if (o.text) { el.innerText = o.text; }
		if (o.html) { el.innerHTML = o.html; }
		if (o.properties) { Object.assign(el, o.properties); }
		if (o.style) { Object.assign(el.style, o.style); }
		if (o.attributes && Array.isArray(o.attributes)) {
			o.attributes.forEach((a) => {
				el.setAttribute(a.name, a.value);
			});
		} else if (o.attributes && typeof o.attributes === 'object') {
			for (let p in o.attributes) {
				el.setAttribute(p, o.attributes[p]);
			}
		}
		if (o.events) {
			o.events.forEach((e) => {
				let eventnames = (e.eventnames || e.eventname || e.event).trim().split(/\s+/);
				eventnames.forEach((eventname) => {
					el.addEventListener(eventname, e.handler);
				});
			});
		}
		return el;
	}
	function getItemsTable(items) {
		let _t = el('table');
		let _tbody = el('tbody', {parent: _t});
		items.forEach((i) => {
			let _tr = el('tr', {
				parent: _tbody,
				children: [
					el('td', {text: i.timestamp}),
					el('td', {text: i.author}),
					el('td', {text: i.message}),
				],
			});
		});
		return _t;
	}
	function getItems() {
		let list = docmnt.querySelector('yt-live-chat-app div#items.style-scope.yt-live-chat-item-list-renderer');
		if (!list) return [];
		let listitems = list.querySelectorAll('yt-live-chat-text-message-renderer > div#content');
		let items = Array.from(listitems).map((el) =>...