Skip to content

Instantly share code, notes, and snippets.

@kilmc
Created January 2, 2014 21:25
Show Gist options
  • Select an option

  • Save kilmc/8227227 to your computer and use it in GitHub Desktop.

Select an option

Save kilmc/8227227 to your computer and use it in GitHub Desktop.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Kilmc | Vinyl Collection</title>
<script type="text/javascript" src="../../scripts/sheetsee/ICanHaz.js"></script>
<script type="text/javascript" src="../../scripts/sheetsee/jquery.js"></script>
<script type="text/javascript" src="../../scripts/sheetsee/d3.js"></script>
<script type="text/javascript" src="../../scripts/sheetsee/tabletop.js"></script>
<script type="text/javascript" src="../../scripts/sheetsee/sheetsee.js"></script>
<link rel="stylesheet" href="../../style/css/vinyl.css" media="all">
</head>
<body>
<div class="site-wrap">
<div class="collection-wrap" >
<ul class="vinyl-list" id="vinylCollection">
</ul>
</div>
</div>
<script id="vinylCollection" type="text/html">
{{#rows}}
<li class="vinyl-item">
<img src="{{albumCover}}" alt="{{artist}} - {{albumTitle}} {{releaseType}} artwork" class="v-artwork">
<dl>
<dt>Artist</dt>
<dd class="v-artist">{{artist}}</dd>
<dt>Album Title</dt>
<dd class="v-album-title">{{albumTitle}}</dd>
</dl>
</li>
{{/rows}}
</script>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
var gData
var URL = "0AhoMYPsRefBndDVYZEVsUkJ4MmlkRzBhZ0pHYW5MaUE"
Tabletop.init( { key: URL, callback: showInfo, simpleSheet: true } )
})
function showInfo(data) {
gData = data
// make the table, and the search bar
Sheetsee.makeTable(gData, "#vinylCollection"
)};
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment