Skip to content

Instantly share code, notes, and snippets.

Created July 14, 2013 05:06
Show Gist options
  • Save kinlane/5993280 to your computer and use it in GitHub Desktop.
Save kinlane/5993280 to your computer and use it in GitHub Desktop.
This is a script to display a list of common building blocks used by Backend as a Service (BaaS) providers, from a JSON file.
padding-left: 10px;
padding-right: 10px;
padding-left: 30px;
.buildingblockcategorylistingul li{
list-style: none;
padding: 10px 10px 20px 10px;
border: 0px solid #000;
font-size: 18px;
font-weight: bold;
padding-left: 30px;
.buildingblocklistingul li{
padding: 20px;
border: 0px solid #000;
font-size: 14px;
font-weight: normal;
<ul class="toolbar">
<li>{"<a href="" title="JSON" target="_blank">JSON</a>"}</li>
<li>{"<a href="" title="API" target="_blank">API</a>"}</li>
<li>{"<a href="" title="Script" target="_blank">SCRIPT</a>"}</li>
<h1 class="title">Building Blocks</h1>
<!--BaaS Full Listing Template--->
{% raw %}
<script id="buildingblockcategoryTemplate" type="text/template">
<li><strong>{{category}}</strong><ul id="{{slug}}" class="buildingblocklistingul"></ul></li>
<script id="buildingblockTemplate" type="text/template">
<li><img src="{{image}}" width="50" align="left" style="padding: 15px;" /><strong>{{name}}</strong> - {{summary}}</li>
{% endraw %}
<!--BaaS Full Listing Container--->
<div class="buildingblocklistingcontainter">
<ul id="buildingblockListing" class="buildingblockcategorylistingul"></ul>
<!--BaaS Full Listing JavaScript--->
<script type="text/javascript">
// Requires Mustache -
function listbuidingblockcategories()
$.getJSON('data/buildingblockcategories.json', function(data) {
$.each(data['buildingblockcategories'], function(key, val) {
var template = $('#buildingblockcategoryTemplate').html();
var html = Mustache.to_html(template, val);
function listbuidingblocks()
$.getJSON('data/buildingblocks.json', function(data) {
$.each(data['buildingblocks'], function(key, val) {
categoryslug = val['categoryslug'];
var template = $('#buildingblockTemplate').html();
var html = Mustache.to_html(template, val);
<!--Trigger BaaS Full Listing JavaScript onLoad-->
<script type="text/javascript">
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment