Experiment: Hacking Better Comments

This is an experimental workaround using bookmarklets. Don't sue me.

Eventually, Substack is going to give us better comment powers.

Until then, I was inspired by jaxfor3’s idea to use a bookmark to supercharge comments.

Installation

Chrome

• Copy the code below.

• View > Always Show Bookmarks Bar.

• You now see the Bookmarks Bar under the url. Control-click on it for a menu, pick Add Page…

• Paste code in “URL”. Type in name you choose (I have “SC”). Save.

Mac Safari

• Copy the code below.

• View > Show Favorites Bar.

• Easiest to overwrite an old Bookmark. Control-click on old Bookmark > Edit Address… Then paste in code. Control-click on Bookmark > Rename. Your choice of name, I call it “SC’.

• If no Bookmarks to re-use, Bookmarks > Add Bookmark…

iPhone and iPad

• I’m not sure how to do it directly, but I have my bookmarks synced across my Apple devices and it synced from my Mac.

• Show bookmarks in Safari > Favorites, and it works.

Here is a quick tutorial on bookmarklets for further help.

Usage

Navigate to the comments of an article (I click on the little speech icon, you can also click on Load more comments at the end), then click on the bookmark. If the page unformats, click it again.

---

SuperComments v6

This bookmarklet hits a number of comment power requests.

• colors recommended (3 or more likes) comments

• colors unread comments

• sorts most recent comments to the bottom (replies don’t change order)

• comment entry now at bottom

• image URLs get image embedded after

• YouTube URLs get video embedded after

• same color scheme as GSOM

• shows unread count in comment counters (you can use this on the front page to see which posts have unread comments) (v6)

• floating menu at bottom for Next Unread & Mark All Read, like GSOM (v6)

Same keyboard shortcuts as GSOM

• C - Next Comment

• X - Mark as Read

• Shift + C - Previous Comment

• Shift + A - Mark All Read

• Z - Mark Read & Next

• N - Mark Read & Go to Next Unread (LGW only)

• Shift-N - Mark Read & Go to Previous Unread (LGW only) (v6)
  

Issues

• Unread counts are kept per specific browser (in a cookie), not at the site

• If you reload the page, all effects will be gone, for better or worse.

• Substack sometimes reloads comments, so you have to run this again

• Cookies fill up on some browsers… working to shrink the cookie storage.

Future Directions

• Add Twitter embed — tricky because of Cross-Origin Resource Security policies.

• Turn into a Chrome/Safari extension so don’t have to manually run it.

• Merge in jaxfor3’s work on comment previews.

Pictures of SC in action

This shows the unread and recommended comments colors, with simple embeds for YouTube and IMG links.

This is what the unread counter looks like (it’s next to the comment count icon).

---

The Code

javascript:(function()%7BLIKE_HOT%20%3D%203%3BLIKE_HOT_COLOR%20%3D%20%22%23D4F5B8%22%3BUNREAD_COLOR%20%3D%20%22%23FFFAB4%22%3BRERUN_SECONDS%20%3D%2060%3Bvar%20functionsToRun%20%3D%20function()%20%7BcolorHotComments()%3BsortByDate()%3BrerunOnLoadMore()%3BcommentEntryToBottom()%3BsweetenEachComment(%5BembedMedia%5D)%3BclickCollapsedReplies()%3BinitilalizeOnce()%3BformatPage()%3B%7D%3Bvar%20closest%20%3D%20function(el%2C%20fn)%20%7Breturn%20el%20%26%26%20(fn(el)%20%3F%20el%20%3A%20closest(el.parentNode%2C%20fn))%3B%7D%3Bvar%20colorHotComments%20%3D%20function()%20%7Bvar%20likes%20%3D%20document.querySelectorAll(%22.comment-actions%22)%3Blikes.forEach(function(like)%20%7Bvar%20likeCount%20%3D%20like.innerText.match(%2F%5Cd%2B%2F)%3Bif%20(likeCount)%20%7BlikeCount%20%3D%20parseInt(likeCount%5B0%5D)%3Bif%20(likeCount%20%3E%3D%20LIKE_HOT)%20%7Bvar%20t%20%3D%20closest(like%2C%20function(el)%20%7Breturn%20el.tagName%20%3D%3D%3D%20%22TABLE%22%7D)%3Bt.style.padding%20%3D%20%2210px%22%3Bt.style.backgroundColor%20%3D%20LIKE_HOT_COLOR%3B%7D%7D%7D)%3B%7D%3Bvar%20sortByDate%20%3D%20function()%20%7Bvar%20parents%20%3D%20document.querySelectorAll(%22.comment-list-items%22)%3Bparents.forEach(function(list)%20%7Bvar%20comms%20%3D%20list.children%3Bcomms%20%3D%20Array.prototype.slice.call(comms)%3Bvar%20commsSorted%20%3D%20comms.sort(function(a%2C%20b)%20%7Bvar%20ida%20%3D%20a.querySelector(%22DIV%22).id.match(%2F%5Cd%2B%2F)%3Bif%20(ida)%20%7Bida%20%3D%20parseInt(ida%5B0%5D)%7D%3Bvar%20idb%20%3D%20b.querySelector(%22DIV%22).id.match(%2F%5Cd%2B%2F)%3Bif%20(idb)%20%7Bidb%20%3D%20parseInt(idb%5B0%5D)%7D%3Breturn%20idb%20-%20ida%3B%7D)%3BcommsSorted.forEach(function(c)%20%7Blist.insertBefore(c%2C%20list.firstChild)%3B%7D)%3B%7D)%3B%7D%3Bvar%20commentEntryToBottom%20%3D%20function%20()%20%7Bvar%20input%20%3D%20document.querySelectorAll(%22.comment-input-wrap%22)%3Binput.forEach(function%20(inp)%20%7Binp.parentNode.insertAdjacentElement('beforeend'%2Cinp)%3B%7D)%7D%3Bvar%20rerunOnLoadMore%20%3D%20function%20()%20%7Bdocument.querySelectorAll(%22.collapsed-reply%2C.more-comments%20%2C.more-replies%22).forEach(function(button)%20%7Bbutton.addEventListener(%22click%22%2C%20function()%20%7BsetTimeout(reformatPage%2C%201000)%3B%7D)%3B%7D)%3B%7D%3Bvar%20sweetenEachComment%20%3D%20function%20(callbacks)%20%7Bdocument.querySelectorAll(%22.comment-body%22).forEach(function(com)%20%7Bcom.querySelectorAll(%22SPAN%22).forEach(function(sp)%20%7Bif%20(!sp.classList.contains(%22sweetened%22))%20%7Bcallbacks.forEach(function%20(cb)%20%7Bcb(sp)%3B%7D)%3Bsp.className%20%2B%3D%20%22%20sweetened%22%3B%7D%7D)%3B%7D)%3B%7D%3Bvar%20embedMedia%20%3D%20function%20(sp)%20%7Bsp.querySelectorAll(%22.linkified%22).forEach(function(autolink)%20%7Bvar%20url%20%3D%20autolink.href%3Bif%20(url.match(%2F%5C.(gif%7Cjpg%7Cjpeg%7Cpng)%2F))%20%7Bvar%20elem%20%3D%20document.createElement(%22img%22)%3Belem.setAttribute(%22src%22%2C%20url)%3Belem.setAttribute(%22width%22%2C%20%22100%25%22)%3Bautolink.insertAdjacentElement(%22afterend%22%2Celem)%3B%7D%3Bvar%20ytCode%3Bvar%20ytSearch%20%3D%20url.match(%2F%5C%2F%5C%2F(youtu.be)%5C%2F(%5Cw%2B)%2F)%3Bif%20(ytSearch%20%26%26%20ytSearch%5B2%5D)%20%7BytCode%20%3D%20ytSearch%5B2%5D%7D%3Bif%20(url.match(%2F%5C%2F%5C%2F(www.)%3F(youtube%5C.com)%5C%2F(%5Cw%2B)%2F))%20%7BytSearch%20%3D%20url.match(%2Fv%3D(%5Cw%2B)%2F)%3Bif%20(ytSearch)%20%7BytCode%20%3D%20ytSearch%5B1%5D%3B%7D%7D%3Bif%20(typeof%20ytCode%20!%3D%3D%20%22undefined%22)%20%7Bvar%20ifrm%20%3D%20document.createElement(%22iframe%22)%3Bifrm.setAttribute(%22src%22%2C%20%22https%3A%2F%2Fwww.youtube.com%2Fembed%2F%22%20%2B%20ytCode)%3Bifrm.style.width%20%3D%20%22640px%22%3Bifrm.style.height%20%3D%20%22360px%22%3Bautolink.insertAdjacentElement(%22afterend%22%2Cifrm)%3B%7D%3B%7D)%3Breturn%3B%7D%3B%2F*!%20js-cookie%20v3.0.0-beta.3%20%7C%20MIT%20*%2F!function(e%2Ct)%7B%22object%22%3D%3Dtypeof%20exports%26%26%22undefined%22!%3Dtypeof%20module%3Fmodule.exports%3Dt()%3A%22function%22%3D%3Dtypeof%20define%26%26define.amd%3Fdefine(t)%3A(e%3De%7C%7Cself%2Cfunction()%7Bvar%20n%3De.Cookies%2Cr%3De.Cookies%3Dt()%3Br.noConflict%3Dfunction()%7Breturn%20e.Cookies%3Dn%2Cr%7D%7D())%7D(this%2Cfunction()%7B%22use%20strict%22%3Bvar%20e%3D%7Bread%3Afunction(e)%7Breturn%20e.replace(%2F(%25%5B%5CdA-F%5D%7B2%7D)%2B%2Fgi%2CdecodeURIComponent)%7D%2Cwrite%3Afunction(e)%7Breturn%20encodeURIComponent(e).replace(%2F%25(2%5B346BF%5D%7C3%5BAC-F%5D%7C40%7C5%5BBDE%5D%7C60%7C7%5BBCD%5D)%2Fg%2CdecodeURIComponent)%7D%7D%3Bfunction%20t(e)%7Bfor(var%20t%3D1%3Bt%3Carguments.length%3Bt%2B%2B)%7Bvar%20n%3Darguments%5Bt%5D%3Bfor(var%20r%20in%20n)e%5Br%5D%3Dn%5Br%5D%7Dreturn%20e%7Dreturn%20function%20n(r%2Co)%7Bfunction%20i(e%2Cn%2Ci)%7Bif(%22undefined%22!%3Dtypeof%20document)%7B%22number%22%3D%3Dtypeof(i%3Dt(%7B%7D%2Co%2Ci)).expires%26%26(i.expires%3Dnew%20Date(Date.now()%2B864e5*i.expires))%2Ci.expires%26%26(i.expires%3Di.expires.toUTCString())%2Cn%3Dr.write(n%2Ce)%2Ce%3DencodeURIComponent(e).replace(%2F%25(2%5B346B%5D%7C5E%7C60%7C7C)%2Fg%2CdecodeURIComponent).replace(%2F%5B()%5D%2Fg%2Cescape)%3Bvar%20c%3D%22%22%3Bfor(var%20u%20in%20i)i%5Bu%5D%26%26(c%2B%3D%22%3B%20%22%2Bu%2C!0!%3D%3Di%5Bu%5D%26%26(c%2B%3D%22%3D%22%2Bi%5Bu%5D.split(%22%3B%22)%5B0%5D))%3Breturn%20document.cookie%3De%2B%22%3D%22%2Bn%2Bc%7D%7Dreturn%20Object.create(%7Bset%3Ai%2Cget%3Afunction(t)%7Bif(%22undefined%22!%3Dtypeof%20document%26%26(!arguments.length%7C%7Ct))%7Bfor(var%20n%3Ddocument.cookie%3Fdocument.cookie.split(%22%3B%20%22)%3A%5B%5D%2Co%3D%7B%7D%2Ci%3D0%3Bi%3Cn.length%3Bi%2B%2B)%7Bvar%20c%3Dn%5Bi%5D.split(%22%3D%22)%2Cu%3Dc.slice(1).join(%22%3D%22)%3B'%22'%3D%3D%3Du%5B0%5D%26%26(u%3Du.slice(1%2C-1))%3Btry%7Bvar%20f%3De.read(c%5B0%5D)%3Bif(o%5Bf%5D%3Dr.read(u%2Cf)%2Ct%3D%3D%3Df)break%7Dcatch(e)%7B%7D%7Dreturn%20t%3Fo%5Bt%5D%3Ao%7D%7D%2Cremove%3Afunction(e%2Cn)%7Bi(e%2C%22%22%2Ct(%7B%7D%2Cn%2C%7Bexpires%3A-1%7D))%7D%2CwithAttributes%3Afunction(e)%7Breturn%20n(this.converter%2Ct(%7B%7D%2Cthis.attributes%2Ce))%7D%2CwithConverter%3Afunction(e)%7Breturn%20n(t(%7B%7D%2Cthis.converter%2Ce)%2Cthis.attributes)%7D%7D%2C%7Battributes%3A%7Bvalue%3AObject.freeze(o)%7D%2Cconverter%3A%7Bvalue%3AObject.freeze(r)%7D%7D)%7D(e%2C%7Bpath%3A%22%2F%22%7D)%7D)%3Bfunction%20get_all_cookies()%20%7Bvar%20cookies%20%3D%20%7B%20%7D%3Bif%20(document.cookie%20%26%26%20document.cookie%20!%3D%20'')%20%7Bvar%20split%20%3D%20document.cookie.split('%3B')%3Bfor%20(var%20i%20%3D%200%3B%20i%20%3C%20split.length%3B%20i%2B%2B)%20%7Bvar%20name_value%20%3D%20split%5Bi%5D.split(%22%3D%22)%3Bname_value%5B0%5D%20%3D%20name_value%5B0%5D.replace(%2F%5E%20%2F%2C%20'')%3Bcookies%5BdecodeURIComponent(name_value%5B0%5D)%5D%20%3D%20decodeURIComponent(name_value%5B1%5D)%3B%7D%7Dreturn%20cookies%3B%7Dvar%20initilalizeOnce%20%3D%20function%20()%20%7Bif%20(typeof%20INIT_DONE%20%3D%3D%3D%20%22undefined%22)%20%7BREAD_ARTICLES%3D%7B%7D%3Bvar%20cookObj%20%3D%20get_all_cookies()%3Bvar%20cooks%20%3D%20_.each(_.keys(cookObj)%2C%20function%20(cooKey)%20%7Bif%20(cooKey.match(%2F%5Ehttp%2F))%20%7BREAD_ARTICLES%5BcooKey%5D%3DJSON.parse(cookObj%5BcooKey%5D)%3B%7D%7D)%3Bif%20(typeof%20READ_ARTICLES%20%3D%3D%3D%20%22undefined%22)%20%7BREAD_ARTICLES%3D%7B%7D%3B%7D%3Bif%20(typeof%20SELECTED_ARTICLE%20%3D%3D%3D%20'undefined'%20%26%26%20document.querySelector(%22.comment-anchor%22)%20!%3D%3D%20null)%20%7BSELECTED_ARTICLE%20%3D%20document.querySelector(%22.comment-anchor%22).id%3B%7Ddocument.addEventListener('keypress'%2C%20commentNav)%3BINIT_DONE%3D1%3BmakeBottomBar()%3B%7D%7D%3Bvar%20saveReadArticles%20%3D%20function%20()%20%7BCookies.set(cleanURL(document.URL)%2C%20JSON.stringify(READ_ARTICLES%5BcleanURL(document.URL)%5D)%2C%7B%20expires%3A%207%20%7D)%3B%7D%3Bvar%20hashCode%20%3D%20function(str)%20%7Bvar%20hash%20%3D%200%2C%20i%2C%20chr%3Bif%20(str.length%20%3D%3D%3D%200)%20return%20hash%3Bfor%20(i%20%3D%200%3B%20i%20%3C%20str.length%3B%20i%2B%2B)%20%7Bchr%20%20%20%3D%20str.charCodeAt(i)%3Bhash%20%20%3D%20((hash%20%3C%3C%205)%20-%20hash)%20%2B%20chr%3Bhash%20%7C%3D%200%3B%7Dreturn%20hash%3B%7D%3Bvar%20cleanURL%20%3D%20function%20(url)%20%7Breturn%20url.replace(%2F%5C%2Fcomments(%5C%2F)%3F(%23.*)%3F%2F%2C%22%22)%3B%7D%3Bvar%20isRead%20%3D%20function%20(articleId%2C%20url)%20%7Bif%20(typeof%20url%20%3D%3D%3D%20%22undefined%22)%20%7Burl%20%3D%20document.URL%3B%7Dif%20(typeof%20READ_ARTICLES%5BcleanURL(url)%5D%20%3D%3D%3D%20%22undefined%22)%20%7BREAD_ARTICLES%5BcleanURL(url)%5D%3D%7B%7D%3B%7Dreturn%20READ_ARTICLES%5BcleanURL(url)%5D%5BarticleId%5D%3B%7D%3Bvar%20markRead%20%3D%20function%20(articleId%2Curl)%20%7Bif%20(typeof%20url%20%3D%3D%3D%20%22undefined%22)%20%7Burl%20%3D%20document.URL%3B%7Dif%20(typeof%20READ_ARTICLES%5BcleanURL(url)%5D%20%3D%3D%3D%20%22undefined%22)%20%7BREAD_ARTICLES%5BcleanURL(url)%5D%3D%7B%7D%3B%7DREAD_ARTICLES%5BcleanURL(url)%5D%5BarticleId%5D%3D1%3BsaveReadArticles()%3B%7D%3Bvar%20markAllRead%20%3D%20function%20()%20%7Bvar%20comments%20%3D%20document.querySelectorAll(%22.comment-anchor%22)%3Bfor%20(var%20i%20%3D%200%3B%20i%20%3C%20comments.length%3B%20i%2B%2B)%20%7Bif%20(!comments%5Bi%5D.id.match(%2F-reply%2F))%20%7BmarkRead(comments%5Bi%5D.id)%3B%7D%3B%7D%7D%3Bvar%20readCount%20%3D%20function%20(url)%20%7Bif%20(typeof%20url%20%3D%3D%3D%20%22undefined%22)%20%7Burl%20%3D%20document.URL%3B%7Dif%20(typeof%20READ_ARTICLES%5BcleanURL(url)%5D%20%3D%3D%3D%20%22undefined%22)%20%7BREAD_ARTICLES%5BcleanURL(url)%5D%3D%7B%7D%3B%7Dreturn%20Object.keys(READ_ARTICLES%5BcleanURL(url)%5D).length%3B%7D%3Bvar%20formatPage%20%3D%20function%20()%20%7Bdocument.querySelectorAll(%22.comment-anchor%22).forEach(function%20(comm)%20%7Bvar%20commId%20%3D%20comm.id%3Bif%20(!comm.id.match(%2F-reply%2F))%20%7Bt%3Dcomm.parentNode.querySelector(%22table%22)%3Bt.style.padding%20%3D%20%2210px%22%3Bif%20(isRead(comm.id))%20%7Bt.style.backgroundColor%20%3D%20%22%23FFFFFF%22%3B%7D%20else%20%7Bt.style.backgroundColor%20%3D%20UNREAD_COLOR%3B%7D%3Bif%20(SELECTED_ARTICLE%20%3D%3D%3D%20comm.id)%20%7Bt.style.borderLeft%20%3D%20%225px%20solid%20gold%22%3BscrollNicelyIntoView(t)%3B%7D%20else%20%7Bt.style.borderLeft%20%3D%20null%3B%7D%3B%7D%7D)%3BcolorHotComments()%3BdisplayUnreadCount()%3B%7D%3Bvar%20reformatPage%20%3D%20function%20()%20%7BclickCollapsedReplies()%3BsetTimeout(functionsToRun%2C%203000)%3B%7D%3Bvar%20clickCollapsedReplies%20%3D%20function%20()%20%7Bdocument.querySelectorAll(%22.has-new-comments%20%3E%20button%22).forEach(function%20(d)%20%7Bd.click()%3B%7D)%3Bdocument.querySelectorAll(%22.collapsed-reply%22).forEach(function%20(d)%20%7Bd.click()%3B%7D)%3B%7D%3Bvar%20displayUnreadCount%20%3D%20function%20()%20%7Bdocument.querySelectorAll(%22table.post-meta%22).forEach(function%20(t)%20%7Bt.querySelectorAll(%22tr%20%3E%20td.post-meta-item.icon%22).forEach(function%20(icon)%20%7Ba%3Dicon.querySelector(%22a%3Anot(.like-button)%22)%3Bif%20(a)%20%7Bvar%20read%20%3D%20readCount(a.href)%3Ba.innerHTML%20%3D%20a.innerHTML.replace(%2F%20%5C%2F%20%3Cb%3E.*%2F%2C%22%22)%3Bvar%20total%20%3D%20parseInt(a.innerText)%3Bvar%20unread%20%3D%20total%20-%20read%3Bif%20(!isNaN(unread)%20%26%26%20unread)%20%7Ba.innerHTML%20%2B%3D%20%22%20%2F%20%3Cb%3E%22%20%2B%20unread%20%2B%20%22%20unread%3C%2Fb%3E%22%3B%7D%3B%7D%3B%7D)%3B%7D)%3B%7D%3Bvar%20scrollNicelyIntoView%20%3D%20function%20(elt)%20%7Bwindow.scrollBy(%7Btop%3A%20elt.getBoundingClientRect().top%20-%20100%2Cbehavior%3A%20'smooth'%7D)%3B%7D%3Bvar%20findComment%20%3D%20function%20(spec)%20%7Bvar%20selectedIndex%3Bvar%20previousIndex%3D0%3Bvar%20nextIndex%3Bvar%20nextUnreadIndex%3Bvar%20prevUnreadIndex%3Bvar%20firstUnreadIndex%3D0%3Bvar%20lastUnreadIndex%3Bvar%20answerIndex%3Bvar%20comments%20%3D%20document.querySelectorAll(%22.comment-anchor%22)%3Bfor%20(var%20i%20%3D%200%3B%20i%20%3C%20comments.length%3B%20i%2B%2B)%20%7Bif%20(!comments%5Bi%5D.id.match(%2F-reply%2F))%20%7Bif%20(!isRead(comments%5Bi%5D.id)%20%26%26%20!firstUnreadIndex)%20%7BfirstUnreadIndex%20%3D%20i%3B%7D%3Bif%20(!isRead(comments%5Bi%5D.id))%20%7BlastUnreadIndex%20%3D%20i%3B%7Dif%20(typeof%20selectedIndex%20%3D%3D%3D%20%22undefined%22)%20%7Bif%20(%20comments%5Bi%5D.id%20%3D%3D%3D%20SELECTED_ARTICLE)%20%7BselectedIndex%20%3D%20i%3B%7D%20else%20%7BpreviousIndex%20%3D%20i%3Bif%20(!isRead(comments%5Bi%5D.id))%20%7BprevUnreadIndex%20%3D%20i%3B%7D%3B%7D%3B%7D%20else%20%7Bif%20(typeof%20nextIndex%20%3D%3D%3D%20%22undefined%22)%20%7BnextIndex%20%3D%20i%3B%7D%3Bif%20(typeof%20nextUnreadIndex%20%3D%3D%3D%20%22undefined%22)%20%7Bif%20(!isRead(comments%5Bi%5D.id))%20%7BnextUnreadIndex%20%3D%20i%3B%7D%3B%7D%3B%7D%3B%7D%3B%7D%3Bswitch%20(spec)%20%7Bcase%20%22Next%22%3AanswerIndex%20%3D%20nextIndex%20%7C%7C%20selectedIndex%3Bbreak%3Bcase%20%22NextUnread%22%3AanswerIndex%20%3D%20nextUnreadIndex%20%7C%7C%20firstUnreadIndex%20%7C%7C%20selectedIndex%3Bbreak%3Bcase%20%22PrevUnread%22%3AanswerIndex%20%3D%20prevUnreadIndex%20%7C%7C%20lastUnreadIndex%20%7C%7C%20selectedIndex%3Bbreak%3Bcase%20%22Prev%22%3AanswerIndex%20%3D%20previousIndex%3Bbreak%3Bdefault%3AanswerIndex%20%3D%20selectedIndex%3B%7D%3Breturn%20comments%5BanswerIndex%5D.id%3B%7D%3Bvar%20selectPrevUnread%20%3D%20function%20()%20%7BSELECTED_ARTICLE%20%3D%20findComment(%22PrevUnread%22)%3B%7D%3Bvar%20selectNextUnread%20%3D%20function%20()%20%7BSELECTED_ARTICLE%20%3D%20findComment(%22NextUnread%22)%3B%7D%3Bvar%20selectNextComment%20%3D%20function%20()%20%7BSELECTED_ARTICLE%20%3D%20findComment(%22Next%22)%3B%7D%3Bvar%20selectPrevComment%20%3D%20function%20()%20%7BSELECTED_ARTICLE%20%3D%20findComment(%22Prev%22)%3B%7D%3Bvar%20markSelectedRead%20%3D%20function%20()%20%7BmarkRead(SELECTED_ARTICLE)%3B%7D%3Bvar%20replySelected%20%3D%20function%20()%20%7Bvar%20a%20%3D%20document.querySelector(%22%23%22%20%2B%20SELECTED_ARTICLE)%3Bvar%20links%20%3D%20a.parentNode.querySelector(%22table%22).querySelector(%22.comment-actions%22).querySelectorAll(%22a%22)%3Blinks.forEach(function%20(link)%20%7Bif%20(link.innerText%20%3D%3D%3D%20%22Reply%22)%20%7Blink.click()%3B%7D%3B%7D)%3B%7D%3Bvar%20commentNav%20%3D%20function%20(e)%20%7Bvar%20focused%20%3D%20document.activeElement%3Bif%20(focused.type%20%3D%3D%3D%20%22textarea%22)%20%7Bconsole.log(%22in%20textarea%22)%3B%7D%20else%20%7Bconsole.log(e.code)%3Bswitch%20(e.code)%20%7Bcase%20%22KeyC%22%3Aif%20(e.shiftKey)%20%7BselectPrevComment()%7D%20else%20%7BselectNextComment()%3B%7D%3Bbreak%3Bcase%20%22KeyX%22%3AmarkSelectedRead()%3Bbreak%3Bcase%20%22KeyZ%22%3AmarkSelectedRead()%3BselectNextComment()%3Bbreak%3Bcase%20%22KeyN%22%3Aif%20(e.shiftKey)%20%7BmarkSelectedRead()%3BselectPrevUnread()%3B%7D%20else%20%7BmarkSelectedRead()%3BselectNextUnread()%3B%7Dbreak%3Bcase%20%22KeyR%22%3Ae.stopPropagation()%3BreplySelected()%3Bbreak%3Bcase%20%22KeyA%22%3Aif%20(e.shiftKey)%20%7BmarkAllRead()%3B%7D%3Bbreak%3Bdefault%3A%7D%3BformatPage()%3B%7D%3B%7D%3Bvar%20makeBottomBar%20%3D%20function%20()%20%7Bd%3Ddocument.createElement(%22div%22)%3Bd.classList.add(%22footer%22)%3Bd.style%3D%22position%3A%20fixed%3B%20bottom%3A%200%3B%20width%3A%20100%25%3B%20height%3A%2060px%3B%20background%3A%20%23ffeb98%3B%20opacity%3A%2080%25%3B%20border-top%3A%203px%3B%20border-top-color%3A%20%23ffcd00%3B%20border-top-style%3A%20solid%3B%20text-align%3Acenter%22%3Bd.id%3D%22bottomBar%22%3Bb%3Ddocument.createElement(%22button%22)%3Bb.id%3D%22goNextUnread%22%3Bb.classList.add(%22button%22%2C%22primary%22)%3Bb.innerText%3D%22Next%20Unread%22%3Bb.style%3D%22margin%3A%2010px%3B%22%3Bb.addEventListener(%22click%22%2C%20function%20()%20%7BmarkSelectedRead()%3BselectNextUnread()%3BformatPage()%3B%7D)%3Bd.appendChild(b)%3Bc%3Ddocument.createElement(%22button%22)%3Bc.id%3D%22markAllRead%22%3Bc.classList.add(%22button%22%2C%22primary%22)%3Bc.innerText%3D%22Mark%20All%20Read%22%3Bc.style%3D%22margin%3A%2010px%3B%22%3Bc.addEventListener(%22click%22%2C%20function%20()%20%7BmarkAllRead()%3BformatPage()%3B%7D)%3Bd.appendChild(c)%3Bdocument.getElementsByTagName('body')%5B0%5D.appendChild(d)%3B%7D%3BfunctionsToRun()%3BRERUN_PROCESS%20%3D%20setInterval(function%20()%20%7BclearInterval(RERUN_PROCESS)%3BreformatPage()%3B%7D%2C%20RERUN_SECONDS*1000)%7D)()

---

Problems

If it doesn’t work, ask me politely here and maybe I can improve things. If it’s going haywire, just reload the page and all effects will be gone.