volt 0.8.5 → 0.8.6

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 3c7f9c10d1c4c9b36bbf686d224d63b7efac606d
-  data.tar.gz: 3d5734b9bf49bd4bc385442fcafe8fa52a083d6c
+  metadata.gz: cc39b7688dcb264420fc550e644030913c5c3a02
+  data.tar.gz: 1cc906e44c38dbb1cb76839f128c484107ed11a0
 SHA512:
-  metadata.gz: ea67b035043177a2f63d14906b25a9b71e12f6bb2737b471c749947971bc170680d83d61df1a20c7a9b13a009d1bb43c3e5610a71374d79a763c7af7158431a1
-  data.tar.gz: 9aed66c68f300dc644f38ff84802152f3e2c4cd37780306c2a142247b6d6d71d70a89c49b307117e07b04e89db05165d1f1c86ed7472f28218d80a0078f76608
+  metadata.gz: 336d0323272ede308bce021ef3b790271b4c87734697d3344872b566de11a817fb7ae00c3930e51725d3b2b3d98fe302b274f3404005534f229fa8f6b34b2fcd
+  data.tar.gz: 62e5f58fb0d95740b833aa2265b556e7e585ec9c8b79603864dbec3c8f1a4dd2b05864ca150c5c38b649985128c9e19980715535ab4438fa383e842903b410ea

data/CHANGELOG.md

@@ -1,3 +1,17 @@
+# 0.8.6 - Oct 5, 2014
+
+  - Major changes to the templating system (to address common concerns and make things simpler).
+      1. All binding now takes place between {{ and }} instead of { and } (double stash instead of single stash)  Escaping is still with a tripple stash {{{ escap{{ed}} }}}  => escap{{ed}}
+      2. Bindings can now be (almost) any ruby code.  No more #'s at the beginning.  Blocks are now closed with {{ end }}
+            If's are now: {{ if _something }} ... {{ elsif _other }} .. {{ else }} .. {{ end }}
+            Each's are now: {{ _items.each do |item| }} ... {{ end }}
+            Template bindings are now: {{ template "path" }} (along with other options)
+
+            Each should use do notation not brackets.  Also, .each is not actually called, the binding is parsed and converted into a EachBinding.  Other Eneumerable methods do not work at this time, only each.  (more coming soon)
+      3. Bindings in routes now use double stashes as well get '/products/{{ _name }}/info'
+      4. To help clean things up, we reccomend spaces between {{ and }}
+
+
 # 0.8.4 - Oct 4, 2014
 
   - Added configuration for databases.

data/Readme.md

@@ -1,8 +1,8 @@
-[![Gem Version](https://badge.fury.io/rb/volt.png)](http://badge.fury.io/rb/volt)
-[![Code Climate](https://codeclimate.com/github/voltrb/volt.png)](https://codeclimate.com/github/voltrb/volt)
-[![Build Status](https://travis-ci.org/voltrb/volt.png?branch=master)](https://travis-ci.org/voltrb/volt)
+[![Gem Version](https://badge.fury.io/rb/volt.svg)](http://badge.fury.io/rb/volt)
+[![Code Climate](http://img.shields.io/codeclimate/github/voltrb/volt.svg)](https://codeclimate.com/github/voltrb/volt)
+[![Build Status](http://img.shields.io/travis/voltrb/volt/master.svg)](https://travis-ci.org/voltrb/volt)
 [![Inline docs](http://inch-ci.org/github/voltrb/volt.svg?branch=master)](http://inch-ci.org/github/voltrb/volt)
-[![Volt Chat](https://badges.gitter.im/voltrb/volt.png)](https://gitter.im/voltrb/volt)
+[![Volt Chat](https://badges.gitter.im/Join Chat.svg)](https://gitter.im/voltrb/volt)
 
 ** For the current status of volt, read: http://voltframework.com/blog
 
@@ -213,52 +213,52 @@ Sections help you split up different parts of the same content (title and body u
 
 ## Bindings
 
-Once you understand the basics of ReactiveValues, we can discuss bindings. In Volt, you code your views in a handlebars like template language.  Volt provides several bindings, which handle rendering of something for you. Content bindings are anything inbetween { and }.
+In Volt, you code your views in a handlebars like template language.  Volt provides several bindings, which handle rendering of something for you. Content bindings are anything inbetween {{ and }}.
 
 ### Content binding
 
 The most basic binding is a content binding:
 
 ```html
-    <p>{some_method}<p>
+    <p>{{ some_method }}<p>
 ```
 
-The content binding runs the Ruby code between { and }, then renders the return value.  If the returned value is a ReactiveValue, it will update the value updated whenever a 'changed' event is triggered on the reactive value.
+The content binding runs the Ruby code between {{ and }}, then renders the return value.  Any time the data a content binding relies on changes, the binding will run again and update the text
 
 ### If binding
 
 An if binding lets you provide basic flow control.
 
 ```html
-    {#if _some_check?}
+    {{ if _some_check? }}
       <p>render this</p>
-    {/}
+    {{ end }}
 ```
 
-Blocks are closed with a {/}
+Blocks are closed with a {{ end }}
 
 When the if binding is rendered, it will run the ruby code after #if.  If the code is true it will render the code below.  Again, if the returned value is reactive, it will update as that value changes.
 
 If bindings can also have #elsif and #else blocks.
 
 ```html
-    {#if _condition_1?}
+    {{ if _condition_1? }}
       <p>condition 1 true</p>
-    {#elsif _condition_2?}
+    {{ elsif _condition_2? }}
       <p>condition 2 true</p>
-    {#else}
+    {{ else }}
       <p>neither true</p>
-    {/}
+    {{ end }}
 ```
 
 ### Each binding
 
-For iteration over objects, the each binding is provided.
+For iteration over objects, you can use .each
 
 ```html
-    {#each _items as item}
-      <p>{item}</p>
-    {/}
+    {{ _items.each do |item| }}
+      <p>{{ item }}</p>
+    {{ end }}
 ```
 
 Above, if _items were an array, the block would be rendered for each item, setting 'item' to the value of the array element.
@@ -266,9 +266,9 @@ Above, if _items were an array, the block would be rendered for each item, setti
 You can also access the position of the item in the array with the #index method.
 
 ```html
-    {#each _items as item}
-      <p>{index}. {item}</p>
-    {/}
+    {{ each _items as item }}
+      <p>{{ index }}. {{ item }}</p>
+    {{ end }}
 ```
 
 For the array: ['one', 'two', 'three'] this would print:
@@ -277,7 +277,7 @@ For the array: ['one', 'two', 'three'] this would print:
     1. two
     2. three
 
-You can do {index + 1} to correct the zero offset.
+You can do {{ index + 1 }} to correct the zero offset.
 
 When items are removed or added to the array, the #each binding automatically and intelligently adds or removes the items from/to the DOM.
 
@@ -286,19 +286,19 @@ When items are removed or added to the array, the #each binding automatically an
 Bindings can also be placed inside of attributes.
 
 ```html
-    <p class="{#if _is_cool?}cool{/}">Text</p>
+    <p class="{{ if _is_cool? }}cool{{ end }}">Text</p>
 ```
 
 There are some special features provided to make elements work as "two way bindings":
 
 ```html
-    <input type="text" value="{_name}" />
+    <input type="text" value="{{ _name }}" />
 ```
 
 In the example above, if _name changes, the field will update, and if the field is updated, _name will be changed:
 
 ```html
-    <input type="checkbox" checked="{_checked}" />
+    <input type="checkbox" checked="{{ _checked }}" />
 ```
 
 If the value of a checked attribute is true, the checkbox will be shown checked. If it's checked or unchecked, the value will be updated to true or false.
@@ -306,8 +306,8 @@ If the value of a checked attribute is true, the checkbox will be shown checked.
 Radio buttons bind to a checked state as well, except instead of setting the value to true or false, they set it to a supplied field value.
 
 ```html
-    <input type="radio" checked="{_radio}" value="one" />
-    <input type="radio" checked="{_radio}" value="two" />
+    <input type="radio" checked="{{ _radio }}" value="one" />
+    <input type="radio" checked="{{ _radio }}" value="two" />
 ```
 
 When a radio button is checked, whatever checked is bound to is set to the field's value.  When the checked binding value is changed, any radio buttons where the binding's value matches the fields value are checked.  NOTE: This seems to be the most useful behaviour for radio buttons.
@@ -315,7 +315,7 @@ When a radio button is checked, whatever checked is bound to is set to the field
 Select boxes can be bound to a value (while not technically a property, this is another convient behavior we add).
 
 ```html
-  <select value="{_rating}">
+  <select value="{{ _rating }}">
     <option value="1">*</option>
     <option value="2">**</option>
     <option value="3">***</option>
@@ -328,12 +328,20 @@ When the selected option of the select above changes, ```_rating``` is changed t
 
 If you have a controller at app/home/controller/index_controller.rb, and a view at app/home/views/index/index.html, all methods called are called on the controller.
 
+### Template Bindings
+
+All views/*.html files are templates that can be rendered inside of other views using the template binding.
+
+```html
+    {{ template "header" }}
+```
+
 ## Escaping
 
-When you need to use { and } outside of bindings, anything in a triple mustache will be escaped and not processed as a binding:
+When you need to use {{ and }} outside of bindings, anything in a triple mustache will be escaped and not processed as a binding:
 
 ```html
-    {{{ bindings look like: {this}  }}}
+    {{{ bindings look like: {{this}}  }}}
 ```
 
 # Models
@@ -693,6 +701,8 @@ A controller can be any class in Volt, however it is common to have that class i
     end
 ```
 
+When a model is set, any missing methods will be proxied to the model.  This lets you bind within the views without prefixing the model object every time.  It also lets you change out the current model and have the views update automatically.
+
 In methods, the `#model` method returns the current model.
 
 See the [provided collections](#provided-collections) section for a list of the available collection models.
@@ -701,7 +711,7 @@ You can also provide your own object to model.
 
 In the example above, any methods not defined on the TodosController will fall through to the provided model.  All views in views/{controller_name} will have this controller as the target for any Ruby run in their bindings.  This means that calls on self (implicit or with self.) will have the model as their target (after calling through the controller).  This lets you add methods to the controller to control how the model is handled, or provide extra methods to the views.
 
-Volt is more similar to an MVVM architecture than an MVC architecture.  Instead of the controllers passing data off to the views, the controllers are the context for the views.  When using a ModelController, the controller automatically forwards all methods it does not handle to the model.  This is convenient since you can set a model in the controller and then access its properties directly with methods in bindings.  This lets you do something like ```{_name}``` instead of something like ```{@model._name}```
+Volt is more similar to an MVVM architecture than an MVC architecture.  Instead of the controllers passing data off to the views, the controllers are the context for the views.  When using a ModelController, the controller automatically forwards all methods it does not handle to the model.  This is convenient since you can set a model in the controller and then access its properties directly with methods in bindings.  This lets you do something like ```{{ _name }}``` instead of something like ```{{ @model._name }}```
 
 Controllers in the app/home component do not need to be namespaced, all other components should namespace controllers like so:
 
@@ -905,23 +915,40 @@ Once the view file for the control or template is found, it will look for a matc
 
 # Control Arguments/Attributes
 
-Like other html tags, controls can be passed attributes.  These are then converted into a hash and passed as the first argument to the initialize method on the controller.  The standard ModelController's initialize will then assign each key/value in the attributes hash as instance values.  This makes it easy to access attributes passed in.
+Like other html tags, controls can be passed attributes.  These are then converted into an object that is passed as the first argument to the initialize method on the controller.  The standard ModelController's initialize will then assign the object to the attrs property which can be accessed with ```#attrs```  This makes it easy to access attributes passed in.
 
 ```html
 
 <:Body>
 
   <ul>
-    {#each _todos as todo}
-      <:todo name="{todo._name}" />
-    {/}
+    {{ _todos.each do |todo| }}
+      <:todo name="{{ todo._name }}" />
+    {{ end }}
   </ul>
 
 <:Todo>
-  <li>{@name}</li>
-
+  <li>{{ attrs.name }}</li>
 ```
 
+Instead of passing in individual attributes, you can also pass in a Model object with the "model" attribute and it will be set as the model for the controller.
+
+```html
+<:Body>
+  <ul>
+    {{ _todos.each do |todo| }}
+      <:todo model="{{ todo }}" />
+    {{ end }}
+  </ul>
+
+<:Todo>
+  <li>
+    {{ _name }} -
+    {{ if _complete }}
+      Complete
+    {{ end }}
+  </li>
+```
 
 # Routes
 
@@ -944,7 +971,7 @@ When the params are changed, the URL will be set to the path for the route whose
 Route paths can also contain variables similar to bindings:
 
 ```ruby
-    get "/todos/{_index}", _view: 'todos'
+    get "/todos/{{ _index }}", _view: 'todos'
 ```
 
 In the case above, if any URL matches /todos/*, (where * is anything but a slash), it will be the active route. ```params._view``` would be set to 'todos', and ```params._index``` would be set to the value in the path.

data/VERSION

@@ -1 +1 @@
-0.8.5
+0.8.6

data/app/volt/views/notices/index.html

@@ -1,20 +1,20 @@
 <:Body>
-  {#if page._reloading}
+  {{ if page._reloading }}
     <div class="notices alert alert-info">Reloading...</div>
-  {/}
-  {#if channel.status == :reconnecting}
+  {{ end }}
+  {{ if channel.status == :reconnecting }}
     <div class="notices alert alert-info">
-      Connection Lost... {channel.error}...
-      {#if channel.reconnect_interval}  Reconnecting in {(channel.reconnect_interval / 1000.0).round} sec{/}
+      Connection Lost... {{ channel.error }}...
+      {{ if channel.reconnect_interval }}  Reconnecting in {{ (channel.reconnect_interval / 1000.0).round }} sec{{ end }}
     </div>
-  {/}
-  {#if page._reconnected}
+  {{ end }}
+  {{ if page._reconnected }}
     <div class="notices alert alert-success">Reconnected!</div>
-  {/}
-  {#if !flash.empty?}
+  {{ end }}
+  {{ if !flash.empty? }}
     <div class="notices alert alert-info" e-click="flash.clear">
-      {#each flash._notices as notice}
-        <p>{notice}</p>
-      {/}
+      {{ flash._notices.each do |notice| }}
+        <p>{{ notice }}</p>
+      {{ end }}
     </div>
-  {/}
+  {{ end }}

data/docs/JAVASCRIPT_COMPONENTS.md

@@ -0,0 +1,2 @@
+# Integrating JavaScript
+

data/lib/volt/router/routes.rb

@@ -157,7 +157,7 @@ class Routes
 
       parts.each_with_index do |part, index|
         if has_binding?(part)
-          params[part[1..-2].to_sym] = index
+          params[part[2...-2].strip.to_sym] = index
 
           # Set the part to be '*' (anything matcher)
           part = '*'
@@ -178,7 +178,7 @@ class Routes
         if has_binding?(part)
           # Setup a nil param that can match anything, but gets
           # assigned into the url
-          params[part[1..-2].to_sym] = nil
+          params[part[2...-2].strip.to_sym] = nil
         end
       end
 
@@ -197,7 +197,7 @@ class Routes
         url = parts.map do |part|
           val = if has_binding?(part)
             # Get the
-            binding = part[1..-2].to_sym
+            binding = part[2...-2].strip.to_sym
             input_params.delete(binding)
           else
             part
@@ -254,7 +254,7 @@ class Routes
 
     # Check if a string has a binding in it
     def has_binding?(string)
-      string.index('{') && string.index('}')
+      string.index('{{') && string.index('}}')
     end
 
 end

data/lib/volt/server/html_parser/attribute_scope.rb

@@ -32,8 +32,8 @@ module AttributeScope
   end
 
   def process_attribute(tag_name, attributes, attribute_name, value)
-    parts = value.split(/(\{[^\}]+\})/).reject(&:blank?)
-    binding_count = parts.count {|p| p[0] == '{' && p[-1] == '}'}
+    parts = value.split(/(\{\{[^\}]+\}\})/).reject(&:blank?)
+    binding_count = parts.count {|p| p[0] == '{' && p[1] == '{' && p[-2] == '}' && p[-1] == '}'}
 
     # if this attribute has bindings
     if binding_count > 0
@@ -69,7 +69,7 @@ module AttributeScope
 
   # Add an attribute binding on the tag, bind directly to the getter in the binding
   def add_single_attribute(id, attribute_name, parts)
-    getter = parts[0][1..-2]
+    getter = parts[0][2...-2].strip
 
     # if getter.index('@')
     #   raise "Bindings currently do not support instance variables"

data/lib/volt/server/html_parser/each_scope.rb

@@ -1,18 +1,22 @@
 class EachScope < ViewScope
   def initialize(handler, path, content)
     super(handler, path)
-    @content, @variable_name = content.strip.split(/ as /)
+    # @content, @variable_name = content.strip.split(/ as /)
+
+    @content, @variable_name = content.split(/.each\s+do\s+\|/)
+
+    @variable_name = @variable_name.gsub(/\|/, '')
   end
-  
+
   def close_scope
     binding_number = @handler.scope[-2].binding_number
     @handler.scope[-2].binding_number += 1
     @path += "/__template/#{binding_number}"
-    
+
     super
-    
+
     @handler.html << "<!-- $#{binding_number} --><!-- $/#{binding_number} -->"
 		@handler.scope.last.save_binding(binding_number, "lambda { |__p, __t, __c, __id| EachBinding.new(__p, __t, __c, __id, Proc.new { #{@content} }, #{@variable_name.inspect}, #{@path.inspect}) }")
-    
+
   end
 end

data/lib/volt/server/html_parser/sandlebars_parser.rb

@@ -82,9 +82,12 @@ class SandlebarsParser
         end
 
         text(@html[1])
-      elsif (binding = @html.scan(/\{/))
+      elsif (binding = @html.scan(/\{\{/))
         # We are in text mode and matched the start of a binding
         start_binding
+      elsif (text = @html.scan(/\{/))
+        # A single { outside of a binding
+        text(text)
       elsif (text = @html.scan(/(?:[^\<\{]+)/))
         # matched text up until the next html tag
         text(text)
@@ -106,16 +109,16 @@ class SandlebarsParser
     binding = ''
     open_count = 1
 
-    # scan until we reach a { or }
+    # scan until we reach a {{ or }}
     loop do
-      binding << @html.scan_until(/([\{\}\n]|\Z)/)
+      binding << @html.scan_until(/(\{\{|\}\}|\n|\Z)/)
 
       match = @html[1]
-      if match == '}'
+      if match == '}}'
         # close
         open_count -= 1
         break if open_count == 0
-      elsif match == '{'
+      elsif match == '{{'
         # open more
         open_count += 1
       elsif match == "\n" || @html.eos?
@@ -127,7 +130,7 @@ class SandlebarsParser
       end
     end
 
-    binding = binding[0..-2]
+    binding = binding[0..-3]
     @handler.binding(binding) if @handler.respond_to?(:binding)
   end
 

data/lib/volt/server/html_parser/textarea_scope.rb

@@ -6,7 +6,7 @@ class TextareaScope < ViewScope
   end
 
   def add_binding(content)
-    @html << "{#{content}}"
+    @html << "{{#{content}}}"
   end
 
   def close_scope(pop=true)
@@ -15,7 +15,7 @@ class TextareaScope < ViewScope
 
     attributes = @attributes
 
-    if @html[/\{[^\}]+\}/]
+    if @html[/\{\{[^\}]+\}\}/]
       # If the html inside the textarea has a binding, process it as
       # a value attribute.
       attributes['value'] = @html

data/lib/volt/server/html_parser/view_scope.rb

@@ -20,33 +20,42 @@ class ViewScope
   end
 
   def add_binding(content)
-    case content[0]
-    when '#'
-  		command, *content = content.split(/ /)
-  		content = content.join(' ')
-
-      case command
-      when '#if'
-        add_if(content)
-      when '#elsif'
-        add_else(content)
-      when '#else'
-        if content.blank?
+    content = content.strip
+    index = content.index(/[ \(]/)
+    if index
+      first_symbol = content[0...index]
+      args = content[index..-1].strip
+
+      case first_symbol
+      when 'if'
+        add_if(args)
+      when 'elsif'
+        add_else(args)
+      when 'else'
+        if args.blank?
           add_else(nil)
         else
-          raise "#else does not take a conditional #{content} was provided."
+          raise "else does not take a conditional, #{content} was provided."
+        end
+      when 'template'
+        add_template(args)
+      else
+        if content =~ /.each\s+do\s+\|/
+          add_each(content)
+        else
+          add_content_binding(content)
         end
-      when '#each'
-        add_each(content)
-      when '#template'
-        add_template(content)
       end
-    when '/'
-      # close binding
-      close_scope
     else
-      # content
-      add_content_binding(content)
+      case content
+      when 'end'
+        # Close the binding
+        close_scope
+      when 'else'
+        add_else(nil)
+      else
+        add_content_binding(content)
+      end
     end
   end
 
@@ -71,6 +80,9 @@ class ViewScope
   end
 
   def add_template(content)
+    # Strip ( and ) from the outsides
+    content = content.strip.gsub(/^\(/, '').gsub(/\)$/, '')
+
     @handler.html << "<!-- $#{@binding_number} --><!-- $/#{@binding_number} -->"
     save_binding(@binding_number, "lambda { |__p, __t, __c, __id| TemplateBinding.new(__p, __t, __c, __id, #{@path.inspect}, Proc.new { [#{content}] }) }")
 
@@ -100,8 +112,8 @@ class ViewScope
 
     data_hash = []
     attributes.each_pair do |name, value|
-      parts = value.split(/(\{[^\}]+\})/).reject(&:blank?)
-      binding_count = parts.count {|p| p[0] == '{' && p[-1] == '}'}
+      parts = value.split(/(\{\{[^\}]+\}\})/).reject(&:blank?)
+      binding_count = parts.count {|p| p[0] == '{' && p[1] == '{' && p[-2] == '}' && p[-1] == '}'}
 
       # if this attribute has bindings
       if binding_count > 0

data/spec/apps/kitchen_sink/app/main/config/routes.rb

@@ -1,6 +1,6 @@
 # See https://github.com/voltrb/volt#routes for more info on routes
 
-get "/bindings/{_route_test}", _action: 'bindings'
+get "/bindings/{{_route_test}}", _action: 'bindings'
 get "/bindings", _action: 'bindings'
 get "/store", _action: 'store'
 

data/spec/apps/kitchen_sink/app/main/views/main/bindings.html

@@ -4,32 +4,31 @@
 <:Body>
   <h1>Bindings</h1>
 
-
   <h2>Text</h2>
   <table class="table">
     <tr>
       <td>Page</td>
-      <td><input type="text" id="pageName1" value="{page._name}"></td>
-      <td><input type="text" id="pageName2" value="{page._name}"></td>
-      <td id="pageName3">{page._name}</td>
+      <td><input type="text" id="pageName1" value="{{ page._name }}"></td>
+      <td><input type="text" id="pageName2" value="{{ page._name }}"></td>
+      <td id="pageName3">{{ page._name }}</td>
     </tr>
     <tr>
       <td>Params</td>
-      <td><input type="text" id="paramsName1" value="{params._name}"></td>
-      <td><input type="text" id="paramsName2" value="{params._name}"></td>
-      <td id="paramsName3">{params._name}</td>
+      <td><input type="text" id="paramsName1" value="{{ params._name }}"></td>
+      <td><input type="text" id="paramsName2" value="{{ params._name }}"></td>
+      <td id="paramsName3">{{ params._name }}</td>
     </tr>
     <tr>
       <td>Routes</td>
-      <td><input type="text" id="routesName1" value="{params._route_test}"></td>
-      <td><input type="text" id="routesName2" value="{params._route_test}"></td>
-      <td id="routesName3">{params._route_test}</td>
+      <td><input type="text" id="routesName1" value="{{ params._route_test }}"></td>
+      <td><input type="text" id="routesName2" value="{{ params._route_test }}"></td>
+      <td id="routesName3">{{ params._route_test }}</td>
     </tr>
     <tr>
       <td>Local Store</td>
-      <td><input type="text" id="localstoreName1" value="{local_store._name}"></td>
-      <td><input type="text" id="localstoreName2" value="{local_store._name}"></td>
-      <td id="localstoreName3">{local_store._name}</td>
+      <td><input type="text" id="localstoreName1" value="{{ local_store._name }}"></td>
+      <td><input type="text" id="localstoreName2" value="{{ local_store._name }}"></td>
+      <td id="localstoreName3">{{ local_store._name }}</td>
     </tr>
   </table>
 
@@ -38,15 +37,15 @@
   <table class="table">
     <tr>
       <td>Page</td>
-      <td><input type="checkbox" id="pageCheck1" checked="{page._check}" /></td>
-      <td><input type="checkbox" id="pageCheck2" checked="{page._check}" /></td>
-      <td id="pageCheck3">{page._check}</td>
+      <td><input type="checkbox" id="pageCheck1" checked="{{ page._check }}" /></td>
+      <td><input type="checkbox" id="pageCheck2" checked="{{ page._check }}" /></td>
+      <td id="pageCheck3">{{ page._check }}</td>
     </tr>
     <tr>
       <td>Params</td>
-      <td><input type="checkbox" id="paramsCheck1" checked="{params._check}" /></td>
-      <td><input type="checkbox" id="paramsCheck2" checked="{params._check}" /></td>
-      <td id="paramsCheck3">{params._check}</td>
+      <td><input type="checkbox" id="paramsCheck1" checked="{{ params._check }}" /></td>
+      <td><input type="checkbox" id="paramsCheck2" checked="{{ params._check }}" /></td>
+      <td id="paramsCheck3">{{ params._check }}</td>
     </tr>
   </table>
 
@@ -55,14 +54,14 @@
   <table class="table">
     <tr>
       <td>Page</td>
-      <td><input type="radio" id="pageRadio1" checked="{page._radio}" value="one" /></td>
-      <td><input type="radio" id="pageRadio2" checked="{page._radio}" value="two" /></td>
-      <td id="pageRadio3">{page._radio}</td>
+      <td><input type="radio" id="pageRadio1" checked="{{ page._radio }}" value="one" /></td>
+      <td><input type="radio" id="pageRadio2" checked="{{ page._radio }}" value="two" /></td>
+      <td id="pageRadio3">{{ page._radio }}</td>
     </tr>
     <tr>
       <td></td>
-      <td><input type="radio" checked="{page._radio}" value="one" /></td>
-      <td><input type="radio" checked="{page._radio}" value="two" /></td>
+      <td><input type="radio" checked="{{ page._radio }}" value="one" /></td>
+      <td><input type="radio" checked="{{ page._radio }}" value="two" /></td>
       <td></td>
     </tr>
   </table>
@@ -72,16 +71,16 @@
     <tr>
       <td>Page</td>
       <td>
-        <select id="pageSelect1" value="{page._select}">
+        <select id="pageSelect1" value="{{ page._select }}">
           <option value="one">One</option>
           <option value="two">Two</option>
           <option value="three">Three</option>
         </select>
       </td>
       <td>
-        <input type="text" id="pageSelect2" value="{page._select}" />
+        <input type="text" id="pageSelect2" value="{{ page._select }}" />
       </td>
-      <td id="pageSelect3">{page._select}</td>
+      <td id="pageSelect3">{{ page._select }}</td>
     </tr>
   </table>
 
@@ -90,9 +89,33 @@
   <table class="table">
     <tr>
       <td>Page</td>
-      <td><textarea id="textareaName1">{page._textarea_name}</textarea></td>
-      <td><textarea id="textareaName2">{page._textarea_name}</textarea></td>
-      <td id="textareaName3">{page._textarea_name}</td>
+      <td><textarea id="textareaName1">{{ page._textarea_name }}</textarea></td>
+      <td><textarea id="textareaName2">{{ page._textarea_name }}</textarea></td>
+      <td id="textareaName3">{{ page._textarea_name }}</td>
+    </tr>
+  </table>
+
+  <h2>URL</h2>
+  <table class="table">
+    <tr>
+      <td>Path</td>
+      <td id="urlPath">{{ url.path }}</td>
+    </tr>
+    <tr>
+      <td>Query</td>
+      <td id="urlPath">{{ url.query }}</td>
+      <td><input type="text" value="{{ url.query }}" /></td>
+    </tr>
+    <tr>
+      <td>Fragment</td>
+      <td id="urlPath">{{ url.fragment }}</td>
+      <td><input type="text" value="{{ url.fragment }}" /></td>
     </tr>
   </table>
 
+
+  <h2>Content</h2>
+
+  <p id="escapeContent">{{{this is {{escaped}}}}}</p>
+
+

data/spec/apps/kitchen_sink/app/main/views/main/main.html

@@ -1,5 +1,5 @@
 <:Title>
-  {#template main_path, "title", {controller_group: 'main'}} - KitchenSink
+  {{ template main_path, "title", {controller_group: 'main'} }} - KitchenSink
 
 <:Body>
   <div class="container">
@@ -14,7 +14,7 @@
 
     <:volt:notices />
 
-    {#template main_path, 'body', {controller_group: 'main'}}
+    {{ template main_path, 'body', {controller_group: 'main'} }}
 
     <div class="footer">
       <p>&copy; Company 2014</p>
@@ -23,7 +23,7 @@
   </div>
 
 <:Nav>
-  <li class="{#if url.path.split('/')[1] == attrs.href.split('/')[1]}active{/}">
-    <a href="{attrs.href}">{attrs.text}</a>
+  <li class="{{ if url.path.split('/')[1] == attrs.href.split('/')[1] }}active{{ end }}">
+    <a href="{{ attrs.href }}">{{ attrs.text }}</a>
   </li>
 

data/spec/integration/bindings_spec.rb

@@ -192,5 +192,15 @@ if ENV['BROWSER']
         end
       end
     end
+
+    describe "content escaping" do
+      it 'should escape in a tripple stash' do
+        visit '/'
+
+        click_link 'Bindings'
+
+        expect(find('#escapeContent')).to have_content('this is {{escaped}}')
+      end
+    end
   end
 end

data/spec/router/routes_spec.rb

@@ -19,8 +19,8 @@ describe Routes do
 
   it "should setup indiect routes" do
     routes do
-      get '/blog/{_id}/edit', _view: 'blog/edit'
-      get '/blog/{_id}', _view: 'blog/show'
+      get '/blog/{{ _id }}/edit', _view: 'blog/edit'
+      get '/blog/{{ _id }}', _view: 'blog/show'
     end
 
     indirect_routes = @routes.instance_variable_get(:@indirect_routes)
@@ -41,11 +41,11 @@ describe Routes do
   it "should match routes" do
     routes do
       get "/blog", _view: 'blog'
-      get '/blog/{_id}', _view: 'blog/show'
-      get '/blog/{_id}/draft', _view: 'blog/draft', _action: 'draft'
-      get '/blog/{_id}/edit', _view: 'blog/edit'
-      get '/blog/tags/{_tag}', _view: 'blog/tag'
-      get '/login/{_name}/user/{_id}', _view: 'login', _action: 'user'
+      get '/blog/{{ _id }}', _view: 'blog/show'
+      get '/blog/{{ _id }}/draft', _view: 'blog/draft', _action: 'draft'
+      get '/blog/{{ _id }}/edit', _view: 'blog/edit'
+      get '/blog/tags/{{ _tag }}', _view: 'blog/tag'
+      get '/login/{{ _name }}/user/{{ _id }}', _view: 'login', _action: 'user'
     end
 
     params = @routes.url_to_params('/blog')
@@ -74,10 +74,10 @@ describe Routes do
   it "should setup param matchers" do
     routes do
       get "/blog", _view: 'blog'
-      get '/blog/{_id}', _view: 'blog/show'
-      get '/blog/{_id}/edit', _view: 'blog/edit'
-      get '/blog/tags/{_tag}', _view: 'blog/tag'
-      get '/login/{_name}/user/{_id}', _view: 'login', _action: 'user'
+      get '/blog/{{ _id }}', _view: 'blog/show'
+      get '/blog/{{ _id }}/edit', _view: 'blog/edit'
+      get '/blog/tags/{{ _tag }}', _view: 'blog/tag'
+      get '/login/{{ _name }}/user/{{ _id }}', _view: 'login', _action: 'user'
     end
 
     param_matches = @routes.instance_variable_get(:@param_matches)
@@ -94,10 +94,10 @@ describe Routes do
   it "should go from params to url" do
     routes do
       get "/blog", _view: 'blog'
-      get '/blog/{_id}', _view: 'blog/show'
-      get '/blog/{_id}/edit', _view: 'blog/edit'
-      get '/blog/tags/{_tag}', _view: 'blog/tag'
-      get '/login/{_name}/user/{_id}', _view: 'login', _action: 'user'
+      get '/blog/{{ _id }}', _view: 'blog/show'
+      get '/blog/{{ _id }}/edit', _view: 'blog/edit'
+      get '/blog/tags/{{ _tag }}', _view: 'blog/tag'
+      get '/login/{{ _name }}/user/{{ _id }}', _view: 'login', _action: 'user'
     end
 
     url, params = @routes.params_to_url({_view: 'blog/show', _id: '55'})
@@ -162,7 +162,7 @@ describe Routes do
 
     routes do
       get '/', _controller: 'index'
-      get '/blog/{_id}', _controller: 'blog'
+      get '/blog/{{ _id }}', _controller: 'blog'
     end
 
     params = @routes.url_to_params('/blog/20')

data/spec/server/html_parser/sandlebars_parser_spec.rb

@@ -1,5 +1,6 @@
 if RUBY_PLATFORM == 'opal'
 else
+require 'spec_helper'
 require 'benchmark'
 require 'volt/server/html_parser/sandlebars_parser'
 
@@ -103,21 +104,21 @@ describe SandlebarsParser do
   end
 
   it "should raise an exception on an unclosed binding at the end of the document" do
-    html = "<p>testing with {nested"
+    html = "<p>testing with {{nested"
 
     handler = HTMLHandler.new
     expect { SandlebarsParser.new(html, handler) }.to raise_error(HTMLParseError)
   end
 
   it "should raise an exception on an unclosed binding" do
-    html = "<p>testing with {nested </p>\n<p>ok</p>"
+    html = "<p>testing with {{nested </p>\n<p>ok</p>"
 
     handler = HTMLHandler.new
     expect { SandlebarsParser.new(html, handler) }.to raise_error(HTMLParseError)
   end
 
   it "should report the line number" do
-    html = "\n\n<p>some paragraph</p>\n\n<p>testing with {nested </p>\n<p>ok</p>"
+    html = "\n\n<p>some paragraph</p>\n\n<p>testing with {{nested </p>\n<p>ok</p>"
 
     handler = HTMLHandler.new
     expect { SandlebarsParser.new(html, handler) }.to raise_error(HTMLParseError, "unclosed binding: {nested </p> on line: 5")

data/spec/server/html_parser/view_parser_spec.rb

@@ -5,7 +5,7 @@ require 'volt/server/html_parser/view_parser'
 
 describe ViewParser do
   it "should parse content bindings" do
-    html = "<p>Some {content} binding, {name}</p>"
+    html = "<p>Some {{ content }} binding, {{ name }}</p>"
 
     view = ViewParser.new(html, "main/main/main")
 
@@ -24,13 +24,13 @@ describe ViewParser do
     html = <<-END
     <p>
       Some
-      {#if showing == :text}
+      {{ if showing == :text }}
         text
-      {#elsif showing == :button}
+      {{ elsif showing == :button }}
         <button>Button</button>
-      {#else}
+      {{ else }}
         <a href="">link</a>
-      {/}
+      {{ end }}
     </p>
     END
 
@@ -63,13 +63,13 @@ describe ViewParser do
     html = <<-END
     <p>
       Some
-      {#if showing == :text}
-        {#if sub_item}
+      {{ if showing == :text }}
+        {{ if sub_item }}
           sub item text
-        {/}
-      {#else}
+        {{ end }}
+      {{ else }}
         other
-      {/}
+      {{ end }}
     </p>
     END
 
@@ -105,9 +105,9 @@ describe ViewParser do
   it "should parse each bindings" do
     html = <<-END
       <div class="main">
-        {#each _items as item}
-          <p>{item}</p>
-        {/}
+        {{ _items.each do |item| }}
+          <p>{{ item }}</p>
+        {{ end }}
       </div>
     END
 
@@ -137,7 +137,7 @@ describe ViewParser do
 
   it "should parse a single attribute binding" do
     html = <<-END
-      <div class="{main_class}">
+      <div class="{{ main_class }}">
       </div>
     END
 
@@ -148,7 +148,7 @@ describe ViewParser do
 
   it "should parse multiple attribute bindings in a single attribute" do
     html = <<-END
-      <div class="start {main_class} {awesome_class} string">
+      <div class="start {{ main_class }} {{ awesome_class }} string">
       </div>
     END
 
@@ -179,7 +179,7 @@ describe ViewParser do
 
   it "should parse a template" do
     html = <<-END
-    {#template "/home/temp/path"}
+    {{ template "/home/temp/path" }}
     END
 
     view = ViewParser.new(html, "main/main/main")
@@ -259,7 +259,7 @@ describe ViewParser do
 
   it "should setup bindings for textarea values" do
     html = <<-END
-    <textarea name="cool">{awesome}</textarea>
+    <textarea name="cool">{{ awesome }}</textarea>
     END
 
     view = ViewParser.new(html, "main/main/main")

data/templates/project/app/main/views/main/main.html.tt

@@ -1,5 +1,5 @@
 <:Title>
-  {#template main_path, "title", {controller_group: 'main'}}
+  {{ template main_path, "title", {controller_group: 'main'} }}
 
 <:Body>
   <div class="container">
@@ -13,7 +13,7 @@
 
     <:volt:notices />
 
-    {#template main_path, 'body', {controller_group: 'main'}}
+    {{ template main_path, 'body', {controller_group: 'main'} }}
 
     <div class="footer">
       <p>&copy; Company 2014</p>
@@ -22,7 +22,7 @@
   </div>
 
 <:Nav>
-  <li class="{#if url.path.split('/')[1] == attrs.href.split('/')[1]}active{/}">
-    <a href="{attrs.href}">{attrs.text}</a>
+  <li class="{{ if url.path.split('/')[1] == attrs.href.split('/')[1] }}active{{ end }}">
+    <a href="{{ attrs.href }}">{{ attrs.text }}</a>
   </li>
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: volt
 version: !ruby/object:Gem::Version
-  version: 0.8.5
+  version: 0.8.6
 platform: ruby
 authors:
 - Ryan Stout
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-10-05 00:00:00.000000000 Z
+date: 2014-10-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: thor
@@ -368,6 +368,7 @@ files:
 - bin/volt
 - docs/FAQ.md
 - docs/GETTING_STARTED.md
+- docs/JAVASCRIPT_COMPONENTS.md
 - docs/WHY.md
 - docs/volt-logo.jpg
 - lib/volt.rb