Skip to content
This repository

Punch ships bunch of special tags that you can use in your layouts. They are not tied to any template engine and can be used with custom template engines as well.

Here are the default helpers available in Punch:

Text Helpers

upcase

Changes the given text to upcase.

    {{#upcase}}hello{{/upcase}}
    "HELLO"

downcase

Changes the given text to downcase.

    {{#downcase}}Hello World{{/downcase}}
    "hello world" 

capitalize

Changes the first letter of the given text to upcase.

    {{#capitalize}}hello{{/capitalize}}
    "Hello"

titleize

Capitalizes each word in the given text.

    {{#titleize}}hello world{{/titleize}}
    "Hello World"

trim

Removes whitespace in the beginning and end of the text.

    {{#trim}}  hello world  {{/trim}}
    "hello world"

humanize

Removes dashes and underscores from the given text and capitalizes the sentence.

    {{#humanize}}hello-my-dear-people{{/humanize}}
    "Hello my dear people"

dasherize

Replaces whitespace between words with dashes.

    {{#dasherize}}hello world{{/dasherize}}
    "hello-world"

underscored

Replaces whitespace between words with underscores.

    {{#underscored}}hello world{{/underscored}}
    "hello_world"

List Helpers

format_list

Formats a given list to readable form.

    {{#format_list}}Peter,John,Andrew{{/format_list}}
    "Peter, John & Andrew"

first

Gives the first item in the list.

    {{#first}}Peter,John,Andrew{{/first}}
    "Peter"

last

Gives the last item in the list.

    {{#first}}Peter,John,Andrew{{/first}}
    "Andrew"

Date Time Helpers

timestamp

Gives the miliseconds elapsed since Unix epoch.

    {{timestamp}}
    "1347225250424"

datetime

Converts the given date-time representation (Unix time & other compliant timestamp) to JavaScript's standard date-time string.

    {{#datetime}}1343870833300{{/datetime}}
    "Thu Aug 02 2012 06:57:13 GMT+0530 (IST)"

date

Converts the given date-time representation (Unix time & other compliant timestamp) to JavaScript's standard date string.

    {{#date}}1343870833300{{/date}}
    "Thu Aug 02 2012"

time

Converts the given date-time representation (Unix time & other compliant timestamp) to JavaScript's standard time string.

    {{time}}1343870833300{{/time}}
    "06:57:13 GMT+0530 (IST)"

iso_date

Converts the given date-time representation (Unix time & other compliant timestamp) to ISO date-time string.

    {{iso_date}}1343870833300{{/iso_date}}
    "2012-08-02T01:27:13.300Z"

Asset Bundle Helpers

stylesheet_bundle

Inserts tags for the given stylesheet bundle.

    {{#stylesheet_bundle}}/assets/all.css{{/stylesheet_bundle}}

javascript_bundle

Inserts tags for the given javascript bundle.

    {{#javascript_bundle}}/assets/all.js{{/javascript_bundle}}

For more details about asset bundles, read the Asset Bundles section.

Writing Custom Helpers

Apart from the default helpers, you can define your own helpers too. Check the section on Writing Custom Helpers for more details.

Something went wrong with that request. Please try again.