words

Coffeescript – Simple inline templating

When you don’t need more.

bubbleTemplate = (__item) ->
  using __item, ->
    "
      <div class='search-map-bubble clearfix'>
        <a href='#{ @url }' class='search-map-bubble-thumbnail'>
          <img src='#{ @thumbnail_map }'>
        </a>
        <div class='search-map-bubble-content'>
          <a href='#{ @url }' class='search-map-bubble-title'>
            #{ @business_name }
            #{ @stars }
          </a>
          <nav class='search-map-bubble-'>
            #{ @address }
          </nav>
        </div>
    "

Where using is a little helper to mimic with in a better way.

using = (invocant, method) -> method.call invocant

Yields:

var bubbleTemplate, using;

using = function(invocant, method) {
  return method.call(invocant);
};

bubbleTemplate = function(__item) {
  return using(__item, function() {
    return "<div class='search-map-bubble clearfix'> <a href='" + this.url + "' class='search-map-bubble-thumbnail'> <img src='" + this.thumbnail_map + "'> </a> <div class='search-map-bubble-content'> <a href='" + this.url + "' class='search-map-bubble-title'> " + this.business_name + " " + this.stars + " </a> <nav class='search-map-bubble-'> " + this.address + " </nav> </div>";
  });
};
Last updated: