Skip to content

Instantly share code, notes, and snippets.

@atomize
Created March 1, 2012 18:59
Show Gist options
  • Save atomize/1952240 to your computer and use it in GitHub Desktop.
Save atomize/1952240 to your computer and use it in GitHub Desktop.
Zepto Mustache template Yahoo JSON API example
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Zepto Mustache Yahoo JSON</title>
<meta name="author" content="berti" />
<!-- Date: 2012-02-25 -->
</head>
<body>
<div id="sampleArea"></div>
<script src="http://seqr.dyndns-server.com/zepto-0.8/dist/zepto.min.js"></script>
<script src="http://seqr.dyndns-server.com/mustache.js"></script>
<script id="Tpl" type="text/template">
<p>Yahoo! found {{query.count}} Sushi eateries near San Francisco with an average 4.5 rating</p>
<p> {{#query.results.Result}}{{Title}} - {{Address}}. {{City}}, {{State}}, Phone: {{Phone}}</p> {{/query.results.Result}}
</script>
</body>
<script type="text/javascript">
$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20local.search%20where%20query%3D%22sushi%22%20and%20location%3D%22san%20francisco%2C%20ca%22%20and%20Rating.AverageRating%3D%224.5%22&format=json&callback=', function(data) {
var template = $('#Tpl').html();
var html = Mustache.to_html(template, data);
$('#sampleArea').html(html);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment