Conditions provides a simple API for conditional JS behaviors. This allows a developer to show or hide certain sections of a stepped-form based on the user's response in previous sections. For every condition, a session cookie is set providing very basic persistance of control-flow for clients.

conditions.js.coffee

# **Conditions** provides a simple API for conditional behaviors within the <a href="/docs/form.js.html">Form</a> class. This allows a developer to show or hide certain sections of a stepped-form based on the user's response in previous sections. 
# For every condition, a session cookie is set providing very basic persistance of control-flow for clients. 

# ### Usage

# Every action item (button, link) that carries a condition must define the following attributes... 
#
# <pre>
# data-condition="#target_selector"
# data-conditional-group="some_group"
# </pre>
#
# Every target of a condition must define the following attributes...
#
# <pre>
# id="target_selector"
# data-condition-group="some_group" 
# </pre>
#
# Persist conditions across pages with the following attribute...
#
# <pre>data-previous-condition="target_selector"</pre>
#
# Force visibility with the following attr...
#
# <pre>data-visible="false"</pre>
#
class window.Conditions extends CoffeeCup
  
  all_cookies: {}
  
  default_options:
    debug: false
  
  init: ->
    @log "init()"
    @setup()
    @events()
  
  # Hide all conditional sections and then check cookies to determine what should appear by default.
  setup: ->
    @log "setup()"
    @hide()
    @remember()
  
  # Event handlers for action items that define conditions. 
  events: ->
    @log "events()"
    ref = this
    $("[data-condition]").click ->
      ref.click(this)
      false if $(this).nodeName == 'INPUT'
    
    $("[data-hide]").click ->
      el = $(this).data('hide')
      $(el).hide()
    
    $("select[data-condition-group]").change ->
      target = $(this).find("option:selected").attr('data-condition')
      group = $(this).attr('data-condition-group')
      ref.clicked(target, group) unless $(this).find("option:selected").data('suppress')
    
    # Temporary utility provides developers to clear all domain cookies. 
    $("a.cookie-monster").click =>
      console.log @options
      @eat_cookies()
    
  # Evaluate conditions for current action. 
  click: (el) ->
    target = $(el).attr('data-condition')
    group = $(el).attr('data-condition-group')
    # If client is toggling, show/hide the conditional element.
    if @last_clicked == el
      @toggle(target, group)
    else
      @last_clicked = el
      @clicked(target, group)
    
  clicked: (target, group) ->
    @log "toggle(#{target}, #{group})"
    # Set cookie containing the value of the current selection.
    $.cookie(group,target,{path: '/'});
    @hide(group)
    $(target).filter("[data-condition-group=#{group}]").show()
  
  # Shows or hides target of the current action, depending upon its current visibility
  toggle: (target, group) ->
    @log "toggle(#{target}, #{group})"
    if $(target).css('display') == 'none'
      @hide(group)
      $(target).filter("[data-condition-group=#{group}]").show()
    else
      return if $(target).attr('data-toggle') == 'false'
      @hide(group)
  
  # Hide all conditions within a given condition group. 
  hide: (group) ->
    @log "hide(#{group})"
    if group == undefined
      @conditional_wells = $("*[data-condition-group]").not("[data-condition]") unless @conditional_wells
    else
      @conditional_wells = $("*[data-condition-group*=#{group}]").not("[data-condition]")
    @conditional_wells.each (i,el) ->
      $(el).hide() unless $(el).attr('data-visible') == 'true'
  
  # Check for the presence of pre-existing conditions and show/how the proper targets. 
  remember: ->
    @log "remember()"
    
    # Get all targets within each condition. 
    $("*[data-condition-group]").filter("[data-condition]").each (i,el) =>
      group = $(el).attr('data-condition-group')
      target = $.cookie(group)
      # Default to showing the first target within a condition if there is no cookie. 
      target = $(el).attr('data-condition') if target == null && i == 0
      #console.log $(target).attr('data-visible')
      $.each $(target), (i,el) ->
        $(el).show() unless $(el).attr('data-visible') == 'false'
      @all_cookies[group] = target if target
    
    # Evaluate cookies for previous conditions to persist choices across multiple pages. 
    cookie_groups = []
    $('*[data-previous-condition]').each (i,el) =>
      $(el).hide()
      group = $(el).attr('data-previous-condition')
      target = $.cookie(group)
      if $(el).filter(target).length > 0
        cookie_groups.push(target)
        @all_cookies[group] = target if target
    
    # Show all the targets that were previously defined by cookies. 
    if cookie_groups.length > 0
      $(cookie_groups).each (i,el) ->
        $('*[data-previous-condition]').filter(el).show()
    else
      # Show the first target within a condition if there is no cookie. 
      $('*[data-previous-condition]').first().show() 
  
  # Cookie groups
  cookies: ->
    @all_cookies
  
  # Destroy all domain cookies. 
  eat_cookies: ->
    @log "eat_cookies()"
    cookies = document.cookie.split(";")
    i = 0
    while i < cookies.length
      cookie = cookies[i]
      eqPos = cookie.indexOf("=")
      name = (if eqPos > -1 then cookie.substr(0, eqPos) else cookie)
      document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT"
      i++
    alert('Cookie cleared.')