Skip to content

Instantly share code, notes, and snippets.

@johan
Forked from johan/index.html
Created October 28, 2011 08:43
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save johan/1321885 to your computer and use it in GitHub Desktop.
Save johan/1321885 to your computer and use it in GitHub Desktop.
Bl.ocks.org and other gist index by user
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Index of all bl.ocks.org pages owned by a github user</title>
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?2.0.3"></script>
<base target="_top">
<style>
body { padding: 0.5em; margin: 0; }
h1 { padding: 0; margin: 0; }
#gist,
#list { padding: 0; margin: 1em 0 0; }
a[href] { color: steelblue; background: none; text-decoration: none; }
a[href]:hover { text-decoration: underline; }
a[href]:visited { color: #63419A; }
.created_at:after { content: " "; }
a + span:before { content: ": "; }
h1.nonblocks { margin-top: 1em; }
.what,
.nonblocks,
body.help .list { display: none; }
body.help .what { display: block; }
</style>
</head>
<body>
<div class="list">
<h1>All bl.ocks by <a target="_blank" id="user">#...</a>:</h1>
<ul id="list"></ul>
<h1 class="nonblocks">Other, non-bl.ocks gists:</h1>
<ul class="nonblocks" id="gist"></ul>
</div>
<div class="what">
<h1>This page lists bl.ocks.org pages per github user</h1>
<p>
To see all gists that can be seen at
<a href="http://bl.ocks.org/">bl.ocks.org</a> by some github user
(i e: those of their gists which have an <code>index.html</code> file)
just put their name at the end of this URL, prefixed with a "#".
Examples:
</p>
<ul>
<li>#<a href="#mbostock">mbostock</a></li>
<li>#<a href="#johan">johan</a></li>
</ul>
</div>
<script src='jsonp.js'></script>
<script src='index.js'></script>
</body>
</html>
var owner = '' // fetched from url hash
, gists = [] // all gists
, blocks = [] // gists with an index.html file
, others = [] // all the other gists of the user
;
init();
top.onhashchange = init;
function init() {
owner = (top.location.hash || '#').slice(1) ||
top.document.querySelector('a.owner').textContent;
var hash = '#'+ owner;
if ((document.body.className = owner ? '' : 'help')) {
d3.selectAll('.what li a')
.attr('href', function() {
return top.location.href.replace(/(#.*)?$/, this.hash);
});
return;
}
if (top.location.hash != hash)
top.location.hash = hash;
d3.select('#user')
.attr('href', 'https://gist.github.com/'+ owner)
.text(owner);
JSONP('http://gist.github.com/api/v1/json/gists/'+ owner, show);
}
function not(fn) { return function() { return !fn.apply(this, arguments) }; }
function is_block(gist) {
return -1 !== gist.files.indexOf('index.html');
}
function show(json) {
gists = json.gists;
draw('ul#list', blocks = gists.filter(is_block), 'http://bl.ocks.org/');
draw('ul#gist', others = gists.filter(not(is_block)), 'https://gist.github.com/');
var non = d3.selectAll('.nonblocks').style('display', 'none');
if (!blocks.length) document.body.className = 'help';
else if (others.length) non.style('display', 'inherit');
d3.select(self.frameElement).style('height', document.body.offsetHeight +'px');
}
function draw(root, data, base_url) {
var vis = d3.select(root).selectAll('li')
.data(data)
, lis = vis.enter().append('li')
, out = vis.exit().remove();
lis.append('span')
.attr('class', 'created_at')
.text(function(d) { return d.created_at; });
lis.append('a')
.attr('target', function(d) { return 'bl_ock_'+ d.repo; })
.attr('href', function(d) { return base_url + d.repo; })
.attr('class', 'block')
.classed('private', function(d) { return !d.public; })
.text(function(d) { return d.repo; });
lis.append('span')
.classed('info', function(d) { return !!d.description; })
.text(function(d) { return d.description || JSON.stringify(d.files); });
}
// calls `cb` with the data from `url`, which either ends with a "=" (for the callback),
// or handles the standard "&callback=" query parameter, as well-organized JSON APIs do.
function JSONP(url, cb) {
var nth = JSONP.nth = (JSONP.nth || 0) + 1
, name = 'cb' + nth.toString(36)
, tail = /=$/.test(url) ? '' : (/\?/.test(url) ? '&' : '?') + 'callback='
, head = document.getElementsByTagName('head')[0]
, load = document.createElement('script');
JSONP[name] = function(json) {
delete JSONP[name];
head.removeChild(load);
cb(json);
};
load.src = url + tail + 'JSONP.'+ name;
head.appendChild(load);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment