Skip to content

Instantly share code, notes, and snippets.

@HandyAndyShortStack
Last active August 29, 2015 14:01
Show Gist options
  • Save HandyAndyShortStack/f0b0a27389e62268bd44 to your computer and use it in GitHub Desktop.
Save HandyAndyShortStack/f0b0a27389e62268bd44 to your computer and use it in GitHub Desktop.
Rabbits
<!DOCTYPE html>
<head>
<title>Living Rabbits</title>
</head>
<body>
<h1>Here Are My Rabbits</h1>
<img src="http://www.clipartbest.com/cliparts/yik/nE6/yiknE6niE.gif" />
<div id="rabbits">
<!-- we want the rabbits here -->
</div>
<script id="template-rabbit" type="text/template">
<h4><%= name %></h4>
<img src="http://www.i2clipart.com/cliparts/4/8/5/4/clipart-friendly-rabbit-4854.png" />
</script>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script scr="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js"></script>
<script src="rabbit.js"></script>
<script scr="main.js"></script>
</body>
// put the business here
function Rabbit(data) {
for (var key in data) {
if (Object.hasOwnProperty.call(data, key)) {
this[key] = data[key];
}
}
var template = $('#template-rabbit').html();
this.$el = $('<div></div>')
.addClass('rabbit')
.html(_.template(template, data));
}
{
"rabbits": [
{
"id": 3,
"name": "Fluffy",
"favorite_color": "orange",
"birth_date": "01/03/2010",
"death_date": "12/30/2013"
},
{
"id": 5,
"name": "Hoppy",
"favorite_color": "red",
"birth_date": "10/04/2014",
"death_date": null
},
{
"id": 6,
"name": "Mister Jumpykins",
"favorite_color": "green",
"birth_date": "03/03/2014",
"death_date": null
},
{
"id": 7,
"name": "Bounce",
"favorite_color": "orange",
"birth_date": "05/11/2012",
"death_date": "04/10/2014"
},
{
"id": 9,
"name": "Scooter",
"favorite_color": "green",
"birth_date": "02/07/2013",
"death_date": null
},
{
"id": 12,
"name": "Dooley",
"favorite_color": "blue",
"birth_date": "03/12/2011",
"death_date": "11/11/2013"
},
{
"id": 15,
"name": "Tiff",
"favorite_color": "blue",
"birth_date": "01/03/2014",
"death_date": null
},
{
"id": 23,
"name": "Roberta",
"favorite_color": "red",
"birth_date": "09/22/2013",
"death_date": null
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment