Handlebars helpers used for various Cloud Four projects.
Output a block (or its inverse) based on whether or not both of the supplied arguments are truthy.
Name | Type | Description | |
---|---|---|---|
left | |||
right | |||
options |
Object
|
var a = true;
var b = 1;
var c = false;
{{#and a b}}✔︎{{else}}✘{{/and}} //=> ✔︎
{{#and b c}}✔︎{{else}}✘{{/and}} //=> ✘
String
Slices a list based on a center-point and a maximum amount of "padding" before and after. Useful for pagination.
Supports an optional offset
hash option in case your center
value isn't matching up with your array indexes.
Name | Type | Description | |
---|---|---|---|
items |
Array
|
|
|
center |
Number
|
|
|
padding |
Number
|
|
|
block |
Object
|
<ul>
{{#around pages 5 2 offset=-1}}
<li><a href="/page/{{num}}">Page {{num}}</a></li>
{{/around}}
</ul>
{{! Output: }}
<ul>
<li><a href="/page/3">Page 3</a></li>
<li><a href="/page/4">Page 4</a></li>
<li><a href="/page/5">Page 5</a></li>
<li><a href="/page/6">Page 6</a></li>
<li><a href="/page/7">Page 7</a></li>
</ul>
String
Average an array of numeric values.
Name | Type | Description | |
---|---|---|---|
arr |
Array
|
var numbers = [1, 2, 3];
var products = [{rating: 1}, {rating: 2}, {rating: 3}];
{{average ratings}} //=> 2
{{average products key="rating"}} //=> 2
Number
Returns the average of all values.
Capitalize the first letter of a String.
Name | Type | Description | |
---|---|---|---|
str |
String
|
|
String
Capitalize each word in a String. Works with punctuation and international characters.
Name | Type | Description | |
---|---|---|---|
str |
String
|
|
String
Compare two values using logical operators.
Name | Type | Description | |
---|---|---|---|
left | |||
operator |
String
|
||
right | |||
options |
Object
|
String
Boolean
formatted html if block, true/false if inline
Concatenate items into a single string.
Name | Type | Description | |
---|---|---|---|
items |
{{concat "foo" "bar"}} //=> "foobar"
string
Output the first provided value that exists, or fallback to a default if none do.
Name | Type | Description | |
---|---|---|---|
value |
var doesExist = 'Hello';
{{defaultTo doesExist "Goodbye"}} // => "Hello"
{{defaultTo doesNotExist "Goodbye"}} // => "Goodbye"
{{defaultTo doesNotExist}} // => ""
{{defaultTo doesNotExist doesExist "Goodbye"}} // => "Hello"
String
Repeat a block a given amount of times.
{{#iterate 10}}
<li>Index: {{@index}} Count: {{@count}}</li>
{{/iterate}}
Void
Perform mathematical operations on one or two values.
Name | Type | Description | |
---|---|---|---|
left | |||
operator |
String
|
||
right | |||
options |
Object
|
Number
Output a block randomly (50% chance of being output). Useful for prototyping multiple content scenarios, outputting one or two "dummy" blocks of markup.
{{#maybe}}
Heads!
{{else}}
Tails!
{{/maybe}}
Void
Output a block (or its inverse) based on whether or not either of the supplied arguments are truthy.
Name | Type | Description | |
---|---|---|---|
left | |||
right | |||
options |
Object
|
var a = true;
var b = 1;
var c = false;
var d = 0;
{{#or a c}}✔︎{{else}}✘{{/or}} //=> ✔︎
{{#or b c}}✔︎{{else}}✘{{/or}} //=> ✔︎
{{#or c d}}✔︎{{else}}✘{{/or}} //=> ✘
String
Generate a random integer or any other type of random content supported by Chance.js.
Name | Type | Description | |
---|---|---|---|
method=integer |
String
|
|
Optional |
options |
Object
|
||
options.hash |
Object
|
|
{{random}} //=> 1839473434
{{random min=5 max=10}} //=> 7
{{random "state"}} //=> WA
{{random "dollar" max=20}} //=> $17.42
Return only one random item. If only one argument is provided and it is an array, it will return a random item from that array. Otherwise it will return one of the arguments.
Name | Type | Description | |
---|---|---|---|
items |
var beatles = ["John", "Paul", "George", "Ringo"];
{{randomItem beatles}} //=> "George"
{{randomItem "John" "Paul" "George" "Ringo"}} //=> "Ringo"
One random item.
Returns the contents of the SVG at the specified path, with any attributes passed along via the hash included on the root element.
Inspired by https://github.com/aredridel/npm-handlebars-helper-svg
Name | Type | Description | |
---|---|---|---|
name |
String
|
|
|
options |
Object
|
{{svg "foo/test.svg"}}
{{svg "foo/test"}}
{{svg "foo/test" class="foo" width="24" height="24"}}
{{#svg "foo/test" aria-labelledby="foo-title"}}
<title id="foo-title">Hello world</title>
{{/svg}}
String
Returns a new instance of the svg helper with settings applied. Useful for defining a base path for the project so you don't have to specify it for every usage of the helper.
Name | Type | Description | |
---|---|---|---|
settings |
Object
|
Optional | |
settings.basePath |
String
|
|
Optional |
settings.extName |
String
|
|
Optional |
settings.omitAttr |
Array
|
|
Optional |
var svgHelper = require('path/to/module').create({
basePath: './src/assets/images'
});
Void
Format a date or time using Moment.js.
Defaults to UTC mode since most use-cases in markup-land do not take timezones into account, which results in some counter-intuitive output and inconsistent behavior.
Name | Type | Description | |
---|---|---|---|
context |
Date
String
Number
Array
Object
|
Optional |
{{timestamp "2015-10-21" format="MMM Do, YYYY"}} //=> "Oct 21st, 2015"
{{timestamp "Oct 21 15" inputFormat="MMM DD YY" format="YYYY-MM-DD"}} //=> "2015-10-21"
{{timestamp "2000-01-01" format="YYYY" utc=false}} //=> "1999"
String
Format number to two fixed decimal points (like a price).
Name | Type | Description | |
---|---|---|---|
num |
Number
String
|
{{toFixed 1}} //=> 1.00
String
Format a decimal as a fractional HTML entity if possible.
Name | Type | Description | |
---|---|---|---|
value |
Number
|
{{toFraction 1.25}} //=> "1¼"
{{toFraction 3.1666}} //=> "3⅙"
{{toFraction 2.7}} //=> 2.7
String
Number
Converts a string to JSON; useful when used in helper sub-expressions.
Name | Type | Description | |
---|---|---|---|
str |
String
|
{{#each (toJSON '[1,2,3]')}}{{this}}{{/each}} //=> '123'
Array
Object
Format a string as a lowercase, URL-friendly value.
Name | Type | Description | |
---|---|---|---|
str |
String
|
{{toSlug "Well, hello there!"}} //=> "well-hello-there"
String
Strip leading alphanumeric characters plus spaces from a string. Useful for converting filenames to more usable strings or IDs.
Name | Type | Description | |
---|---|---|---|
name |
String
|
{{toTitle "01 Introduction"}} //=> "Introduction"
String