Skip to content

Instantly share code, notes, and snippets.

@wenerme wenerme/show-stars.js
Last active Jul 28, 2016

Embed
What would you like to do?
Show stars and push time in github repo links.
var AccessToken='YOUR-ACCESS-TOKEN-HERE' // <= Notice
var replaceText = a => {
let v = a.repoData
let tpl = `[
<span style="color:red;opacity:${Math.max(v.stargazers_count/500,0.1)}">
${v.stargazers_count}
</span>
🕐${new Date(v.updated_at).toISOString().replace(/\..*/,'').replace('T',' ')}
]`
a.innerHTML = a.innerHTML.replace(/(\[(.|\s)*?\])?$/,tpl)
}
Array.from(document.querySelectorAll('a'))
.map(a=>{
a.repo = a.href.match(/(https?:\/\/)?github.com\/([^/#?]+\/[^/#?]+)\/?$/)
a.repo = a.repo && a.repo[2]
if(!a.repo){
a.repo = a.href.match(/(https?:\/\/)?([^.]+)\.github.io(\/[^/#?]+)\/?/)
a.repo = a.repo && a.repo[2]+a.repo[3]
}
if(a.repo){
console.log("Found repo ",a.repo,a);
}
return a
})
.filter(a=>a.repo)
.filter(a=>!/^articles|site|settings|organizations|new/.test(a.repo))
.filter(a=>a.text.length > 0)
.map(a=>{
if(!a.repoData){
a.repoData = JSON.parse(localStorage.getItem(`repos/${a.repo}`))
if (a.repoData && a.repoData.message) {
a.repoData = null
}
}
if(!a.repoData){
fetch(`https://api.github.com/repos/${a.repo}?access_token=${AccessToken}`)
.then(v=>v.json())
.then(v=>{
if(v.message){
console.error("Request failed:"+a.repo,v);
return
}
// Full field check here https://api.github.com/repos/wenerme/wener
// localStorage only support 10mb
var stripped = {stargazers_count: v.stargazers_count,updated_at: v.updated_at}
localStorage.setItem(`repos/${a.repo}`,JSON.stringify(stripped));
a.repoData = stripped
replaceText(a)
})
}else{
replaceText(a)
}
return a
})
// TODO Use indexedDB instead localStorage
// TODO Slow down the huge request at same time, the browser may stuck
// TODO Lazy load
// TODO Support gist
@wenerme

This comment has been minimized.

Copy link
Owner Author

wenerme commented Jul 27, 2016

Just open devtool, paste script into console and execute.

  • For long page, you may wait a while for browser to response
  • You also need a access_token to send more request

sketchplugins
image

awesome page

image

@wenerme

This comment has been minimized.

Copy link
Owner Author

wenerme commented Jul 27, 2016

HN discuss

@markerikson

This comment has been minimized.

Copy link

markerikson commented Jul 27, 2016

Very interesting. Is there any way to automatically set up this sort of thing to work inside of a Markdown file being rendered on Github?

@wenerme

This comment has been minimized.

Copy link
Owner Author

wenerme commented Jul 28, 2016

@markerikson No, Markdown can not contain any script tag.But if you can control the render you can add the script to it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.