-
-
Save SMUsamaShah/e7c9ed3936ba69e522f8cb38671f1da7 to your computer and use it in GitHub Desktop.
| // ==UserScript== | |
| // @name Hacker News Story Rank Change Indicator | |
| // @namespace http://tampermonkey.net/ | |
| // @version 2024-09-07_15-42 | |
| // @description Indicate the new stories and stories moving up/down on the front page | |
| // @author SMUsamaShah | |
| // @match https://news.ycombinator.com/ | |
| // @match https://news.ycombinator.com/news | |
| // @match https://news.ycombinator.com/news?p=* | |
| // @match https://news.ycombinator.com/?p=* | |
| // @icon https://www.google.com/s2/favicons?sz=64&domain=ycombinator.com | |
| // @grant none | |
| // @license MIT | |
| // @downloadURL https://gist.githubusercontent.com/SMUsamaShah/e7c9ed3936ba69e522f8cb38671f1da7/raw/Hacker_News_Story_Rank_Change_Indicator.user.js | |
| // @updateURL https://gist.githubusercontent.com/SMUsamaShah/e7c9ed3936ba69e522f8cb38671f1da7/raw/Hacker_News_Story_Rank_Change_Indicator.user.js | |
| // ==/UserScript== | |
| (function() { | |
| 'use strict'; | |
| const KEY_LAST_CLEAR = 'hackernews-rank-notifier-clear-time'; | |
| const KEY_RANK_STORE = 'hackernews-rank-notifier'; | |
| const KEY_COMMENT_STORE = 'hackernews-rank-notifier-comments'; | |
| const MAX_STORIES = 3000; | |
| const MAX_NEW_COMMENTS_FOR_MAX_COLOR = 50; | |
| const HIDE_SEEN_AND_UNCHANGED_STORIES = false; | |
| const HIDE_STORIES_WITH_FEWER_NEW_COMMENTS = false; | |
| const HIDE_STORIES_WITH_FEWER_NEW_COMMENTS_THRESHOLD = 2; | |
| const oldRanks = JSON.parse(localStorage.getItem(KEY_RANK_STORE)) || {}; | |
| const oldComments = JSON.parse(localStorage.getItem(KEY_COMMENT_STORE)) || {}; | |
| function getAllStoryElements() { return Array.from(document.getElementsByClassName('athing')); } | |
| function getTitleElement(story) { return story.querySelector('.title a'); } | |
| function getId(story) { return story.id; } | |
| function getRank(story) { return parseInt(story.querySelector('span.rank').innerText.slice(0, -1)); } | |
| function clamp(v, min, max) { return Math.max(min, Math.min(v, max)); } | |
| function sortAndDiscardOldRecords(ranks, comments, keepRecordsUpto) { | |
| const topStoryIds = Object.keys(ranks).sort((a, b) => b - a).slice(0, keepRecordsUpto); | |
| const newRanks = {}; | |
| const newComments = {}; | |
| topStoryIds.forEach(id => { | |
| newRanks[id] = ranks[id]; | |
| newComments[id] = comments[id]; | |
| }); | |
| localStorage.setItem(KEY_RANK_STORE, JSON.stringify(newRanks)); | |
| localStorage.setItem(KEY_COMMENT_STORE, JSON.stringify(newComments)); | |
| } | |
| function getCommentsElement(story) { return story.nextSibling.querySelector('.subline>a:last-child'); } | |
| function getCommentCount(story) { | |
| let commentsElement = getCommentsElement(story); | |
| if (!commentsElement) return 0; | |
| let commentCountText = commentsElement.innerText.match(/([0-9]*) comment/); | |
| return (commentCountText) ? parseInt(commentCountText[1]) : 0; | |
| } | |
| function hideStory(story) { | |
| story.style.display = 'none'; | |
| story.nextElementSibling.style.display = 'none'; | |
| story.nextElementSibling.nextElementSibling.style.display = 'none'; | |
| } | |
| function updateTitle(story, rankChange) { | |
| let title = getTitleElement(story); | |
| if (rankChange == undefined) { | |
| title.innerHTML = "<b style='color:green'>(NEW) </b>" + title.innerHTML; | |
| } else { | |
| title.textContent = '(' + (rankChange > 0 ? '+' : '-') + Math.abs(rankChange) + ') ' + title.textContent; | |
| } | |
| } | |
| function updateCommentCount(story, commentChange) { | |
| let commentsElement = getCommentsElement(story); | |
| if (commentsElement) { | |
| let bright = clamp(120 - commentChange * 120 / MAX_NEW_COMMENTS_FOR_MAX_COLOR, 0, 120); | |
| const commentColor = "rgb(255, " + bright + "," + bright + ")"; | |
| commentsElement.innerHTML = '<span style="color:' + commentColor + '">(' + (commentChange > 0 ? '+' : '-') + Math.abs(commentChange) + ') </span>' + commentsElement.innerHTML; | |
| } | |
| } | |
| const stories = getAllStoryElements(); | |
| stories.forEach(function(story) { | |
| const id = getId(story); | |
| const rank = getRank(story); | |
| const commentCount = getCommentCount(story); | |
| if (id in oldRanks) { | |
| const rankChange = oldRanks[id] - rank; | |
| const commentChange = commentCount - (oldComments[id] || 0); | |
| if (rankChange !== 0) { | |
| updateTitle(story, rankChange); | |
| } | |
| if (commentChange !== 0) { | |
| updateCommentCount(story, commentChange); | |
| } | |
| if (HIDE_SEEN_AND_UNCHANGED_STORIES && commentChange === 0) { | |
| hideStory(story); | |
| } | |
| if (HIDE_STORIES_WITH_FEWER_NEW_COMMENTS && commentChange < HIDE_STORIES_WITH_FEWER_NEW_COMMENTS_THRESHOLD) { | |
| hideStory(story); | |
| } | |
| } | |
| else { | |
| updateTitle(story); | |
| } | |
| oldRanks[id] = rank; | |
| oldComments[id] = commentCount; | |
| }); | |
| const topStoryIds = sortAndDiscardOldRecords(oldRanks, oldComments, MAX_STORIES); | |
| })(); |
Hiya. Have you considered also including https://news.ycombinator.com/newest ?
(See https://greasyfork.org/scripts/39311-hacker-news-highlighter for inspiration.
Also, I think your entry on Greasyfork is not synced to your updates here.
@realAzazello including /newest doesn't make any sense to me because it will always be showing you newest anyway. Front page is where it's actually needed to catchup if there are any new stories.
I am using this gist as the source, not greasyfork. I think I had some trouble keeping that up to date or it was probably the greasyfork search where I couldn't find this script. Gist is more out in the open and easy to see.
Understood. The reason for suggesting 'newest' is that some users (not me!) have written they use it more/instead of 'new', and even reload 'newest' page to see changes, sort of like a news scroller. I thought your ranking system would be helpful in that scenario.
Even so, I don't have any issue with using either - I use both equally infrequently.
GF has an auto-syncing function with Github, but I don't know if it works with gists.
Ranks from the newest page will need to be stored separately. I can see how it's useful to people though. Still don't see any point in ranking as rank changes uniformly for all stories on that page. They all go down whenever a new story appears.
Will give that a try.
Thanks for suggestion to sync. Have set it up and greasyfork should now stay up to date
When used as a userscript, whenever you visit hn frontpage, all post will have a rank indicator in front including indicator for new stories since your last visit.
As a bookmarklet
Copy this text into as a link for a bookmark.
On HN frontpage, click bookmarklet and it will indicate change in stories from the last time when you ran the bookmarklet.
To convert to bookmarklet yourself
javascript:to turn it intojavascript:<copied_single_line_code>