Skip to content

Instantly share code, notes, and snippets.

@utsengar
Created April 2, 2012 20:41
Show Gist options
  • Save utsengar/2287070 to your computer and use it in GitHub Desktop.
Save utsengar/2287070 to your computer and use it in GitHub Desktop.
synchronous and asynchronous loading of handlebars templates
/*
* This decorates Handlebars.js with the ability to load
* templates from an external source, with light caching.
*
* To render a template, pass a closure that will receive the
* template as a function parameter, eg,
* T.render('templateName', function(t) {
* $('#somediv').html( t() );
* });
* Source: https://github.com/wycats/handlebars.js/issues/82
*/
var Template = function() {
this.cached = {};
};
var T = new Template();
$.extend(Template.prototype, {
render: function(name, callback) {
if (T.isCached(name)) {
callback(T.cached[name]);
} else {
$.get(T.urlFor(name), function(raw) {
T.store(name, raw);
T.render(name, callback);
});
}
},
renderSync: function(name, callback) {
if (!T.isCached(name)) {
T.fetch(name);
}
T.render(name, callback);
},
prefetch: function(name) {
$.get(T.urlFor(name), function(raw) {
T.store(name, raw);
});
},
fetch: function(name) {
// synchronous, for those times when you need it.
if (! T.isCached(name)) {
var raw = $.ajax({'url': T.urlFor(name), 'async': false}).responseText;
T.store(name, raw);
}
},
isCached: function(name) {
return !!T.cached[name];
},
store: function(name, raw) {
T.cached[name] = Handlebars.compile(raw);
},
urlFor: function(name) {
return "/resources/templates/"+ name + ".handlebars";
}
});
@abohady
Copy link

abohady commented Jul 16, 2019

Live.me

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment