Hacker News Slick

Companion userscript for the Hacker News Slick userstyle.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

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

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

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

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

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         Hacker News Slick
// @namespace    userscripts.org
// @version      1.1.0
// @description  Companion userscript for the Hacker News Slick userstyle.
// @author       Elias Fotinis <[email protected]>
// @include      https://news.ycombinator.com/*
// ==/UserScript==

(function(){

  // Array of XPath results snapshot.
  function snapArr(xpRes) {
    const ret = Array(xpRes.snapshotLength)
	  for (let i = 0; i < xpRes.snapshotLength; ++i) {
      ret[i] = xpRes.snapshotItem(i);
    }
    return ret;
  }

  // ---- add marker class to thread-starting comments ----

  // get <TR> elements representing top thread items in flat comment table
  const topRows = snapArr(document.evaluate(
    '//td[@class="ind"][img[@width="0"]]/ancestor::table[position()=1]/ancestor::tr[position()=1]',
    document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null));
  for (const x of topRows) {
    x.classList.add('threadtop')
  }
  
  // ---- move black mourning bar below header ----
  // ---- this is done to preserve node ordering so that other styles keep working ----

  const blackBar = snapArr(document.evaluate(
    '//table[@id="hnmain"]//td[@bgcolor="#000000"]/ancestor::tr', 
    document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null))[0];
  if (blackBar) {
    blackBar.remove();
    const spacerBar = snapArr(document.evaluate(
    	'//table[@id="hnmain"]/tbody/tr[position()=2]', 
    	document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null))[0];
     	if (spacerBar) {
        spacerBar.innerHTML = '<td style="background-color:#000000"></td>';
      }
  }

}())