Skip to content

Instantly share code, notes, and snippets.

@jbpotonnier
Created October 24, 2013 21:47
Show Gist options
  • Save jbpotonnier/7145626 to your computer and use it in GitHub Desktop.
Save jbpotonnier/7145626 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Gists</title>
<link type="text/css" rel="stylesheet" href="style.css">
<script type='text/javascript' src='lib/zepto.min.js'></script>
<script type='text/javascript' src='lib/knockout-2.3.0.js'></script>
<script type='text/javascript' src='lib/knockout.mapping-latest.js'></script>
</head>
<body>
<table>
<thead>
<tr>
<th>Description</th>
<th>Created At</th>
</tr>
</thead>
<tbody data-bind="foreach: gists">
<tr>
<td><a target="_blanck" data-bind="text: description, attr:{href: html_url}"></a></td>
<td data-bind="text: created_at"></td>
</tr>
</tbody>
</table>
<script type='text/javascript' src='gists.js'></script>
</body>
</html>
var gists = ko.mapping.fromJS([]);
ko.applyBindings({gists: gists});
$.getJSON('https://api.github.com/users/jbpotonnier/gists?per_page=100', function (data) {
console.log("data", data);
ko.mapping.fromJS(data, gists);
});
body {
border: 1px solid #DFDFDF;
background-color: #F9F9F9;
border-radius: 3px;
font-family: Arial,"Bitstream Vera Sans",Helvetica,Verdana,sans-serif;
color: #333;
}
tr:hover { background: #d3d3d3; }
td, th {
border-top-color: white;
border-bottom: 1px solid #DFDFDF;
color: #555;
}
th {
font-family: Georgia,"Times New Roman","Bitstream Charter",Times,serif;
font-weight: normal;
padding: 7px 7px 8px;
text-align: left;
line-height: 1.3em;
font-size: 14px;
}
td {
font-size: 12px;
padding: 4px 7px 2px;
vertical-align: top;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment