MrHus · July 21, 2017 09:53 · MrHus · Jul 21, 2017 · jvhoven · Jul 19, 2019
diff --git a/hunter.js b/hunter.js
 /*
  Wanted a list to get all the names for each material design
  icon. Could not find a list online, other than the page at:

  https://material.io/icons/

  So I wrote a script to get all the icons from that page. Unfortunately
  it is made in polymer which uses the shadowdom extensively. So
  getting all the icons means digging through the entire dom and shadow
  dom.

  To make thinks worse the icons are only inserted into the dom
  which they are visible in the viewport. This means that in order
  to get all the icons you must scroll down through the page.

  So this script scrolls down by X pixels at a time, inspects the
  body for <i class="md-icon"> and repeats until the bottom of the
  page is reached. 

  Tested on Chrome.
 */

 // Will store the names of the icons.
 var names = [];

 var scrollPos = 0; // The initial scroll pos.
 const scrollMoveBy = 100; // Move by 100 pixels each time

 // Start at the top
 window.scrollTo(0, 0);

 // Moves the scrollbar down to the bottom of the page.
 function moveScrollbar() {
  if (scrollPos < document.body.scrollHeight) {
    window.scrollBy(0, scrollMoveBy);
    scrollPos += scrollMoveBy;

    // Give the browser some breathing room, prevents freezing of browser.
    setTimeout(() => {
      getAllIconsForGreatJustice(document.body);
      moveScrollbar();
    }, 100);
  } else {
    // Finished the process now log the names that where found.

    console.log('Found: ' + names.length + ' icons');
    console.log(names.join('" | "'));
  }
 }

 setTimeout(() => {
  moveScrollbar();
 }, 1000);

 // Recursively get all icons, and find them in shadowRoots as well.
 function getAllIconsForGreatJustice(element) {
  element.children.array().forEach(huntIcons);

  if (element.shadowRoot) {
    element.shadowRoot.children.array().forEach(huntIcons);
  }
 }

 function huntIcons(element) {
  // Add if it is an icon.
  if (isMaterialIcon(element)) {
    var name = element.textContent;

    // Add it only once, should have used a set but fuck it it works
    if (names.includes(name) === false) {
      names.push(name);
    }
  }

  // Call again to start the recursion
  getAllIconsForGreatJustice(element);
 }

 function isMaterialIcon(element) {
  return element.tagName === 'I' && element.classList.contains('md-icon');
 }
	/*
	Wanted a list to get all the names for each material design
	icon. Could not find a list online, other than the page at:

	https://material.io/icons/

	So I wrote a script to get all the icons from that page. Unfortunately
	it is made in polymer which uses the shadowdom extensively. So
	getting all the icons means digging through the entire dom and shadow
	dom.

	To make thinks worse the icons are only inserted into the dom
	which they are visible in the viewport. This means that in order
	to get all the icons you must scroll down through the page.

	So this script scrolls down by X pixels at a time, inspects the
	body for <i class="md-icon"> and repeats until the bottom of the
	page is reached.

	Tested on Chrome.
	*/

	// Will store the names of the icons.
	var names = [];

	var scrollPos = 0; // The initial scroll pos.
	const scrollMoveBy = 100; // Move by 100 pixels each time

	// Start at the top
	window.scrollTo(0, 0);

	// Moves the scrollbar down to the bottom of the page.
	function moveScrollbar() {
	if (scrollPos < document.body.scrollHeight) {
	window.scrollBy(0, scrollMoveBy);
	scrollPos += scrollMoveBy;

	// Give the browser some breathing room, prevents freezing of browser.
	setTimeout(() => {
	getAllIconsForGreatJustice(document.body);
	moveScrollbar();
	}, 100);
	} else {
	// Finished the process now log the names that where found.

	console.log('Found: ' + names.length + ' icons');
	console.log(names.join('" \| "'));
	}
	}

	setTimeout(() => {
	moveScrollbar();
	}, 1000);

	// Recursively get all icons, and find them in shadowRoots as well.
	function getAllIconsForGreatJustice(element) {
	element.children.array().forEach(huntIcons);

	if (element.shadowRoot) {
	element.shadowRoot.children.array().forEach(huntIcons);
	}
	}

	function huntIcons(element) {
	// Add if it is an icon.
	if (isMaterialIcon(element)) {
	var name = element.textContent;

	// Add it only once, should have used a set but fuck it it works
	if (names.includes(name) === false) {
	names.push(name);
	}
	}

	// Call again to start the recursion
	getAllIconsForGreatJustice(element);
	}

	function isMaterialIcon(element) {
	return element.tagName === 'I' && element.classList.contains('md-icon');
	}