batman.js

Batman filters are evaluated from left to right, with the output of each filter being injected into the next. This allows you to form filter chains for display purposes. Accessor caching does not apply to filter chains. If any component of the chain changes, the entire chain will be recalculated for each binding in the template.

• raw(value) : string

  The raw filter renders the unescaped value.

  <span data-bind="someHTMLyString | raw"></span>

• get(value, key) : value

  Calls the get function on the input value with the specified key. Can be used with Batman.Accessible and Batman.TerminalAccessible:

  <span data-bind="accessibleFunction | get 'item'"></span>

• value[key] : value

  Shorthand for the get filter.

• equals(left, right) : boolean

  Checks if left content is equal to right content:

  <span data-showif="title | equals 'Batman Views'"></span>

• not(value) : boolean

  Inverts the truthiness of the input value:

  <span data-hideif="title | equals 'Batman Views' | not | and action | equals 'show'"></span>

• matches(value, string) : boolean

  Tests a string against the input value:

  <span data-showif="title | matches 'Bat'"></span>

• truncate(value, length, end = '...') : string

  Limits the length of output to the specified length and appends the specified text if over the limit:

  <span data-bind="page.title | truncate 5, '…'"></span>

  Would result in:

  <span data-bind="page.title | truncate 5, '…'">About…</span>

• default(value, defaultValue) : value

  Provides a default value if the keypath is falsy:

  <input type="text" data-bind="page.title | default 'About Us'"></input>

• prepend(value, string) : string

  Prepends the string to the input value:

  <span data-bind-class="page.tag | prepend 'ico-'"></span>

  If page.tag is 'about' this would result in:

  <span data-bind-class="page.tag | prepend 'ico-'" class="ico-about"></span>

• append(value, string) : string

  Appends the string to the input value:

  <span data-bind-class="page.tag | append '-ico'"></span>

  If page.tag is 'about' this would result in:

  <span data-bind-class="page.tag | append '-ico'" class="about-ico"></span>

• replace(value, searchString, replaceString[, flags]) : string

  Replaces content in the input value matching the searchString with the replaceString value:

  <span data-bind="page.title | replace 'html', 'HTML'"></span>

• downcase(value) : string

  Downcases the input value:

  <span data-bind="page.title | downcase"></span>

• upcase(value) : string

  Upcases the input value:

  <span data-bind="page.title | upcase"></span>

• pluralize(value, count) : string

  Pluralizes the input value based on the patterns specified in Batman.helpers.inflector and the count provided:

  ( ->
    @singular /(analysis)$/i, '$1'
    @singular /(analy)ses$/i, '$1sis'
  ).call(Batman.helpers.inflector)

  <span data-bind="'analysis' | pluralize page.comments.count"></span>

• humanize(string) : string

  Takes a string and makes it human readable, for example 'an_underscored_string' would become 'An underscored string'.

  <span data-bind="'about_us_page' | humanize"></span>

  Would result in:

  <span data-bind="'about_us_page' | humanize">About us page</span>

• join(value, separator = '') : string

  Joins an array of values into a single string:

  <span data-bind="page.comments | map 'title' | join ', '"></span>

• sort(value) : value

  Sorts an array using the default comparison:

  <span data-foreach-comment="page.comments | sort" data-bind="comment.title"><span>

• map(iterable) : value

  Maps the specified keypath from an array of objects:

  <span data-foreach-author="page.comments | map 'author'" data-bind="author"><span>

• has(iterable, item) : boolean

  Calls the iterable's has function to check for the existence of the specified item.

  class Sample.FirstController extends Batman.Controller
    index: ->
      @set('things', new Batman.Set('thing1', 'thing2'))

  <input type="checkbox" data-bind-checked="things | has 'thing1'"></input>

  If you were to dispatch first#index:

  <input type="checkbox" data-bind-checked="things | has 'thing1'" checked="true"></input>

• first(iterable) : value

  Returns the first value from an array:

  <span data-context-firstComment="page.comments | first"></span>

• meta(value, keypath) : value

• interpolate(string, valuesObject) : string

  Allows you to use string interpolation:

  <span data-bind="'The page title is %{title}%' | interpolate {'title': 'page.title'}"></span>

• withArguments(function, curriedArguments...) : function

  Ensures that the function is called with the supplied arguments in addition to the arguments it would normally be called with. This is a form of currying. The argument order will be the curried arguments (those passed to withArguments) first, then the regular arguments. In the case of a click event, the regular arguments are node, event, view.

  class Sample.CloseWindowView extends Batman.View
    html: '<span data-event-click="closeWindow | withArguments true"></span>'
  
    closeWindow: (actuallyClose) ->
      window.close() if actuallyClose

  <div data-view="CloseWindowView"></div>

• escape(value) : string

  Escapes HTML in the input value:

  <textarea data-bind="page.body_html | escape"></textarea>