├── .gitignore
├── CHANGELOG.md
├── LICENSE
├── README.md
├── bower.json
├── component.json
├── dist
    ├── rivets.bundled.min.js
    ├── rivets.js
    └── rivets.min.js
├── doc.sh
├── docs
    ├── CNAME
    ├── _layout.jade
    ├── css
    │   ├── bootstrap.css
    │   ├── responsive.styl
    │   ├── screen.styl
    │   ├── syntax.css
    │   └── type.css
    ├── docs
    │   ├── guide
    │   │   ├── _data.json
    │   │   ├── _sections
    │   │   │   ├── adapters.md
    │   │   │   ├── adapters
    │   │   │   │   ├── creating.md
    │   │   │   │   └── default.md
    │   │   │   ├── binders.md
    │   │   │   ├── binders
    │   │   │   │   ├── api.md
    │   │   │   │   ├── one-way.md
    │   │   │   │   └── two-way.md
    │   │   │   ├── components.md
    │   │   │   ├── computed-properties.md
    │   │   │   ├── formatters.md
    │   │   │   ├── formatters
    │   │   │   │   ├── arguments.md
    │   │   │   │   ├── one-way.md
    │   │   │   │   └── two-way.md
    │   │   │   ├── functions-call.md
    │   │   │   ├── index.md
    │   │   │   ├── install.md
    │   │   │   ├── iteration
    │   │   │   │   ├── index.md
    │   │   │   │   └── iteration.md
    │   │   │   └── usage
    │   │   │   │   ├── binding.md
    │   │   │   │   ├── configuring.md
    │   │   │   │   └── templates.md
    │   │   └── index.jade
    │   └── reference
    │   │   ├── _binders
    │   │       ├── [attribute].md
    │   │       ├── checked.md
    │   │       ├── class-[classname].md
    │   │       ├── disabled.md
    │   │       ├── each-[item].md
    │   │       ├── enabled.md
    │   │       ├── hide.md
    │   │       ├── html.md
    │   │       ├── if.md
    │   │       ├── on-[event].md
    │   │       ├── show.md
    │   │       ├── text.md
    │   │       ├── unchecked.md
    │   │       ├── unless.md
    │   │       └── value.md
    │   │   ├── _data.json
    │   │   └── index.jade
    ├── fonts
    │   ├── entypo-social
    │   │   ├── entypo-social.eot
    │   │   ├── entypo-social.svg
    │   │   ├── entypo-social.ttf
    │   │   └── entypo-social.woff
    │   ├── entypo
    │   │   ├── entypo.eot
    │   │   ├── entypo.svg
    │   │   ├── entypo.ttf
    │   │   └── entypo.woff
    │   └── proxima-nova
    │   │   ├── ProximaNova-Black-webfont.eot
    │   │   ├── ProximaNova-Black-webfont.svg
    │   │   ├── ProximaNova-Black-webfont.ttf
    │   │   ├── ProximaNova-Black-webfont.woff
    │   │   ├── ProximaNova-BlackIt-webfont.eot
    │   │   ├── ProximaNova-BlackIt-webfont.svg
    │   │   ├── ProximaNova-BlackIt-webfont.ttf
    │   │   ├── ProximaNova-BlackIt-webfont.woff
    │   │   ├── ProximaNova-Bold-webfont.eot
    │   │   ├── ProximaNova-Bold-webfont.svg
    │   │   ├── ProximaNova-Bold-webfont.ttf
    │   │   ├── ProximaNova-Bold-webfont.woff
    │   │   ├── ProximaNova-BoldIt-webfont.eot
    │   │   ├── ProximaNova-BoldIt-webfont.svg
    │   │   ├── ProximaNova-BoldIt-webfont.ttf
    │   │   ├── ProximaNova-BoldIt-webfont.woff
    │   │   ├── ProximaNova-Light-webfont.eot
    │   │   ├── ProximaNova-Light-webfont.svg
    │   │   ├── ProximaNova-Light-webfont.ttf
    │   │   ├── ProximaNova-Light-webfont.woff
    │   │   ├── ProximaNova-LightIt-webfont.eot
    │   │   ├── ProximaNova-LightIt-webfont.svg
    │   │   ├── ProximaNova-LightIt-webfont.ttf
    │   │   ├── ProximaNova-LightIt-webfont.woff
    │   │   ├── ProximaNova-Reg-webfont.eot
    │   │   ├── ProximaNova-Reg-webfont.svg
    │   │   ├── ProximaNova-Reg-webfont.ttf
    │   │   ├── ProximaNova-Reg-webfont.woff
    │   │   ├── ProximaNova-RegIt-webfont.eot
    │   │   ├── ProximaNova-RegIt-webfont.svg
    │   │   ├── ProximaNova-RegIt-webfont.ttf
    │   │   ├── ProximaNova-RegIt-webfont.woff
    │   │   ├── ProximaNova-Sbold-webfont.eot
    │   │   ├── ProximaNova-Sbold-webfont.svg
    │   │   ├── ProximaNova-Sbold-webfont.ttf
    │   │   ├── ProximaNova-Sbold-webfont.woff
    │   │   ├── ProximaNova-SboldIt-webfont.eot
    │   │   ├── ProximaNova-SboldIt-webfont.svg
    │   │   ├── ProximaNova-SboldIt-webfont.ttf
    │   │   ├── ProximaNova-SboldIt-webfont.woff
    │   │   ├── ProximaNova-Thin-webfont.eot
    │   │   ├── ProximaNova-Thin-webfont.svg
    │   │   ├── ProximaNova-Thin-webfont.ttf
    │   │   ├── ProximaNova-Thin-webfont.woff
    │   │   ├── ProximaNova-ThinIt-webfont.eot
    │   │   ├── ProximaNova-ThinIt-webfont.svg
    │   │   ├── ProximaNova-ThinIt-webfont.ttf
    │   │   ├── ProximaNova-ThinIt-webfont.woff
    │   │   ├── ProximaNova-Xbold-webfont.eot
    │   │   ├── ProximaNova-Xbold-webfont.svg
    │   │   ├── ProximaNova-Xbold-webfont.ttf
    │   │   ├── ProximaNova-Xbold-webfont.woff
    │   │   ├── ProximaNova-XboldIt-webfont.eot
    │   │   ├── ProximaNova-XboldIt-webfont.svg
    │   │   ├── ProximaNova-XboldIt-webfont.ttf
    │   │   └── ProximaNova-XboldIt-webfont.woff
    ├── img
    │   ├── attendease.png
    │   ├── dell.png
    │   ├── disco.png
    │   ├── kin.png
    │   ├── mikeric.jpg
    │   └── vs.png
    ├── index.jade
    └── js
    │   ├── app.js
    │   ├── bootstrap.min.js
    │   ├── highlight.js
    │   └── jquery.js
├── gulpfile.js
├── package.json
├── spec
    ├── lib
    │   └── mock.data.js
    ├── rivets
    │   ├── binders.js
    │   ├── binding.js
    │   ├── component_binding.js
    │   ├── formatters.js
    │   ├── functional.js
    │   ├── routines.js
    │   └── text_template_parser.js
    └── runner.html
└── src
    ├── adapter.coffee
    ├── binders.coffee
    ├── bindings.coffee
    ├── export.coffee
    ├── formatters.coffee
    ├── parsers.coffee
    ├── rivets.coffee
    ├── util.coffee
    └── view.coffee


/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | *.swp
3 | node_modules/**/*
4 | 


--------------------------------------------------------------------------------
/CHANGELOG.md:
--------------------------------------------------------------------------------
  1 | # 0.9.6
  2 | 
  3 | **No changes (version bump due to error in publishing 0.9.5)**
  4 | 
  5 | # 0.9.5
  6 | 
  7 | ### Changes
  8 | 
  9 | - Use global object `$` (jQuery or jQuery alternative) if available, fixing [#646](https://github.com/mikeric/rivets/issues/646)
 10 | 
 11 | # 0.9.4
 12 | 
 13 | ### Changes
 14 | 
 15 | - Updated sightglass to `v0.2.6`, fixing [#572](https://github.com/mikeric/rivets/issues/572)
 16 | 
 17 | # 0.9.2
 18 | 
 19 | ### Changes
 20 | 
 21 | - Fix issue when resetting a model [#644](https://github.com/mikeric/rivets/issues/644)
 22 | - Fix publish function in two-way formatters [#649](https://github.com/mikeric/rivets/issues/649)
 23 | - Fix array binding [#650](https://github.com/mikeric/rivets/issues/650)
 24 | - Fix observers on prototype functions [#572](https://github.com/mikeric/rivets/issues/572)
 25 | 
 26 | # 0.9.1
 27 | 
 28 | ### Changes
 29 | 
 30 | - Fix bug in expression with multiple strings [#620](https://github.com/mikeric/rivets/issues/620)
 31 | 
 32 | # 0.9.0
 33 | 
 34 | ### Changes
 35 | 
 36 | - Fix binders which received 0 instead of undefined when HTML attributes were empty [#567](https://github.com/mikeric/rivets/issues/567)
 37 | - Now functions are not executed by Rivets in expressions. To call the function you need to use the `call` formatter. See documentation [here](http://rivetsjs.com/docs/guide/#functions-call) [#571](https://github.com/mikeric/rivets/issues/571)
 38 | - Support for nested rv-each with an index for each iteration. Index names can be configured, see documentation [here](http://rivetsjs.com/docs/guide/#usage-configuring) [#551](https://github.com/mikeric/rivets/issues/551)
 39 | - Support for pipes in quoted arguments [#432](https://github.com/mikeric/rivets/issues/432)
 40 | - Support for constant string in component HTML attributes [#478](https://github.com/mikeric/rivets/issues/478)
 41 | - Fix rebind bug when a templated used nested `rv-if` binders [#611](https://github.com/mikeric/rivets/issues/611)
 42 | 
 43 | ### Upgrading from 0.8
 44 | - Since 0.9 Rivets will not execute functions by default. This will allow passing arguments to function with the `call` formatter.
 45 | 
 46 |     - Calling function in 0.8
 47 |     ```
 48 |     { item.myFunction }
 49 |     ```
 50 |     - Calling function in 0.9
 51 |     ```
 52 |     { item.myFunction | call}
 53 |     ```
 54 |     - Calling function in 0.9 with arguments
 55 |     ```
 56 |     { item.myFunction | call myArgument 'argument as string'}
 57 |     ```
 58 | 
 59 |     - You can force function executions to have your application work in `0.9` without using the `call` formatter. This is done with the configuration
 60 |     ```
 61 |     rivets.configure({
 62 |         // Since rivets 0.9 functions are not automatically executed in expressions. If you need backward compatibilty, set this parameter to true
 63 |         executeFunctions: true
 64 |     });
 65 |     ```
 66 | 
 67 | - Using multiple indexes in nested `rv-each`. Since `0.9` rivets allows to have a specific index variable for each iteration.
 68 |     ```
 69 |     <ul>
 70 |       <li rv-each-todo="todos">
 71 |         <ul>
 72 |           <li rv-each-item="todo.items">
 73 |             <span>item #{ %item% } in todo #{ %todo%}</span>
 74 |             <!-- Here the index will be the same as %item% -->
 75 |           </li>
 76 |         </ul>
 77 |       </li>
 78 |     <ul>
 79 |     ```
 80 |     The `index` is still available for compatibility reasons but you must be aware that it will only represent the last iteration.
 81 | 
 82 | # 0.8
 83 | 
 84 | ### Changes
 85 | 
 86 | - More refined and useful components API. Some documentation is available [here](http://rivetsjs.com/docs/guide/#components).
 87 | 
 88 | # 0.7
 89 | 
 90 | ### Changes
 91 | 
 92 | - Support for data-bound keypaths are formatter arguments.
 93 | 
 94 |     ```
 95 |     { item.price | lte user.balance }
 96 |     ```
 97 | 
 98 | - Support for primitives in binding declarations. This includes strings, numbers, booleans, null and undefined.
 99 | 
100 |     ```
101 |     { item.updated | date 'MMM DD, YYY' }
102 |     ```
103 | 
104 | - Primitives are also supported as the binding target.
105 | 
106 |     ```
107 |     { 'i18n.errors.' | append error | translate }
108 |     ```
109 | 
110 | - Support for multiple binder arguments (wildcard matches). See [#383](https://github.com/mikeric/rivets/pull/383).
111 | 
112 | - The `Observer` class has been abstracted out into a new lib as a dependency. See [Sightglass](https://github.com/mikeric/sightglass).
113 | 
114 | - The built-in `value` binder now listens on the `input` event instead of `change`, so updates will propogate immediately instead of on blur.
115 | 
116 | - There is no more `rivets.config` object. All of the previous configuration options are defined on the module directly.
117 | 
118 | - If a template includes `<script>` elements, they will now be ignored when the template is parsed.
119 | 
120 | ### Upgrading from 0.6
121 | 
122 | - Make sure you include the sightglass lib in your project. Just include `sightglass.js` before `rivets.js`. Alternatively you can just include `rivets.bundled.min.js` once (contains both libraries).
123 | 
124 | - If you have defined any custom adapters, they will need to be updated from the old property names to the new property names.
125 | 
126 |     - `adapter.subscribe` is now `adapter.observe`.
127 |     - `adapter.unsubscribe` is now `adapter.unobserve`.
128 |     - `adapter.read` is now `adapter.get`.
129 |     - `adapter.publish` is now `adapter.set`.
130 | 
131 | - Change all of your existing formatter arguments to be wrapped in quotes. This is because arguments are evaluated as keypaths by default (unless they are wrapped in quotes).
132 | 
133 |     - For example, if you were previously doing the following:
134 | 
135 |         ```html
136 |         <p>{ item.enabled | switch green red }</p>
137 |         ```
138 | 
139 |         You will need to change it to:
140 | 
141 |         ```html
142 |         <p>{ item.enabled | switch 'green' 'red' }</p>
143 |         ```
144 | 
145 |     - Note that if your keypath argument was a number, `true`, `false`, `null` or `undefined`, then you can leave them without quotes, but they will be passed to the formatter as the actual primitive value instead of a string.
146 | 
147 | - If you ever set properties directly on the `rivets.config` object, you will need to change those to the `rivets` object itself.
148 | 
149 |     - For example, if you were previously doing the following:
150 | 
151 |         ```javascript
152 |         rivets.config.templateDelimiters = ['{{', '}}']
153 |         ```
154 | 
155 |         You will need to change it to:
156 | 
157 |         ```javascript
158 |         rivets.templateDelimiters = ['{{', '}}']
159 |         ```
160 | 
161 |     - Note that if you were only using `rivets.configure({})` then no changes are needed (`rivets.configure` functions the same as before).
162 | 
163 | # 0.6
164 | 
165 | ### Changes
166 | 
167 | - Support for multiple adapters through interfaces.
168 | - Ships with a built-in `.` adapter using ES5 natives (getters and setters).
169 | - Support for nested keypaths (`user.address:zip`).
170 | 
171 | ### Upgrading from 0.5
172 | 
173 | - All dependencies now stem from the target object, not the view's scope object. Make sure to change all dependency keypaths so that they stem from the object that points to the computed property / function.
174 | - The `prefix` configuration is now an absolute prefix (you need to include "data" in the prefix if you want to use data attributes). Defaults to `rv`. Make sure to change all existing attribute names to `rv-[binder]` or update your `prefix` configuration option.
175 | 
176 | ### Caveats
177 | 
178 | - The built-in adapter observes array mutations (push, pop, unshift, etc.) but not changes made to indexes on the array directly (`array[3] = 'world'` for example).
179 | - The built-in adapter cannot subscribe to an array's `length` property. Currently you need to use a formatter to access the array's `length` property (`list.items | length`).
180 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | Copyright (c) 2011 Michael Richards
 2 | 
 3 | Permission is hereby granted, free of charge, to any person obtaining
 4 | a copy of this software and associated documentation files (the
 5 | "Software"), to deal in the Software without restriction, including
 6 | without limitation the rights to use, copy, modify, merge, publish,
 7 | distribute, sublicense, and/or sell copies of the Software, and to
 8 | permit persons to whom the Software is furnished to do so, subject to
 9 | the following conditions:
10 | 
11 | The above copyright notice and this permission notice shall be
12 | included in all copies or substantial portions of the Software.
13 | 
14 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
15 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
16 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
17 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
18 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
19 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
20 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
21 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Rivets.js
 2 | 
 3 | Rivets.js is a lightweight data binding and templating system that facilitates building data-driven views. It is agnostic about every aspect of a front-end MV(C|VM|P) stack, making it easy to introduce it into your current workflow or to use it as part of your own custom front-end stack comprised of other libraries.
 4 | 
 5 | ## Usage
 6 | 
 7 | ```html
 8 | <section id="auction">
 9 |   <h3>{ auction.product.name }</h3>
10 |   <p>Current bid: { auction.currentBid | money }</p>
11 | 
12 |   <aside rv-if="auction.timeLeft | lt 120">
13 |     Hurry up! There is { auction.timeLeft | time } left.
14 |   </aside>
15 | </section>
16 | ```
17 | 
18 | ```javascript
19 | rivets.bind($('#auction'), {auction: auction})
20 | ```
21 | 
22 | ## Getting Started and Documentation
23 | 
24 | Documentation is available on the [homepage](http://rivetsjs.com). Learn by reading the [Guide](http://rivetsjs.com/docs/guide/) and refer to the [Binder Reference](http://rivetsjs.com/docs/reference/) to see what binders are available to you out-of-the-box.
25 | 
26 | ## Building and Testing
27 | 
28 | First install any development dependencies.
29 | 
30 | ```
31 | $ npm install
32 | ```
33 | 
34 | #### Building
35 | 
36 | Rivets.js uses [gulp](http://gulpjs.com/) as its build tool. Run the following task to compile + minify the source into `dist/`.
37 | 
38 | ```
39 | $ gulp build
40 | ```
41 | 
42 | #### Testing
43 | 
44 | Rivets.js uses [mocha](http://visionmedia.github.io/mocha/) as its testing framework, alongside [should](https://github.com/visionmedia/should.js/) for expectations and [sinon](http://sinonjs.org/) for spies, stubs and mocks. Run the following to run the full test suite.
45 | 
46 | ```
47 | $ npm test
48 | ```
49 | 
50 | ## Contributing
51 | 
52 | #### Bug Reporting
53 | 
54 | 1. Ensure the bug can be reproduced on the latest master.
55 | 2. Open an issue on GitHub and include an isolated [JSFiddle](http://jsfiddle.net/) demonstration of the bug. The more information you provide, the easier it will be to validate and fix.
56 | 
57 | #### Pull Requests
58 | 
59 | 1. Fork the repository and create a topic branch.
60 | 3. Make sure not to commit any changes under `dist/` as they will surely cause conflicts for others later. Files under `dist/` are only committed when a new build is released.
61 | 4. Include tests that cover any changes or additions that you've made.
62 | 5. Push your topic branch to your fork and submit a pull request. Include details about the changes as well as a reference to related issue(s).
63 | 


--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "rivets",
 3 |   "description": "Declarative data binding + templating solution.",
 4 |   "homepage": "http://rivetsjs.com",
 5 |   "version": "0.9.6",
 6 |   "main": "dist/rivets.js",
 7 |   "license": "MIT",
 8 |   "authors": [
 9 |     "Michael Richards"
10 |   ],
11 |   "keywords": [
12 |     "data binding",
13 |     "templating"
14 |   ],
15 |   "ignore": [
16 |     "node_modules",
17 |     "bower_components",
18 |     "spec"
19 |   ],
20 |   "dependencies": {
21 |     "sightglass": "~0.2.4"
22 |   }
23 | }
24 | 


--------------------------------------------------------------------------------
/component.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "rivets",
 3 |   "description": "Declarative data binding + templating solution.",
 4 |   "repo": "mikeric/rivets",
 5 |   "version": "0.9.6",
 6 |   "keywords": [
 7 |     "data binding",
 8 |     "templating"
 9 |   ],
10 |   "license": "MIT",
11 |   "scripts": [
12 |     "dist/rivets.js"
13 |   ],
14 |   "main": "dist/rivets.js",
15 |   "dependencies": {
16 |     "mikeric/sightglass": "~0.2.4"
17 |   }
18 | }
19 | 


--------------------------------------------------------------------------------
/dist/rivets.min.js:
--------------------------------------------------------------------------------
1 | // Rivets.js
2 | // version: 0.9.6
3 | // author: Michael Richards
4 | // license: MIT
5 | (function(){var t,e,i,n,r,s=function(t,e){return function(){return t.apply(e,arguments)}},o=[].slice,u={}.hasOwnProperty,l=function(t,e){function i(){this.constructor=t}for(var n in e)u.call(e,n)&&(t[n]=e[n]);return i.prototype=e.prototype,t.prototype=new i,t.__super__=e.prototype,t},h=[].indexOf||function(t){for(var e=0,i=this.length;i>e;e++)if(e in this&&this[e]===t)return e;return-1};t={options:["prefix","templateDelimiters","rootInterface","preloadData","handler","executeFunctions"],extensions:["binders","formatters","components","adapters"],"public":{binders:{},components:{},formatters:{},adapters:{},prefix:"rv",templateDelimiters:["{","}"],rootInterface:".",preloadData:!0,executeFunctions:!1,iterationAlias:function(t){return"%"+t+"%"},handler:function(t,e,i){return this.call(t,e,i.view.models)},configure:function(e){var i,n,r,s;null==e&&(e={});for(r in e)if(s=e[r],"binders"===r||"components"===r||"formatters"===r||"adapters"===r)for(n in s)i=s[n],t[r][n]=i;else t["public"][r]=s},bind:function(e,i,n){var r;return null==i&&(i={}),null==n&&(n={}),r=new t.View(e,i,n),r.bind(),r},init:function(e,i,n){var r,s,o;if(null==n&&(n={}),null==i&&(i=document.createElement("div")),e=t["public"].components[e],s=e.template.call(this,i),s instanceof HTMLElement){for(;i.firstChild;)i.removeChild(i.firstChild);i.appendChild(s)}else i.innerHTML=s;return r=e.initialize.call(this,i,n),o=new t.View(i,r),o.bind(),o}}},window.jQuery||window.$?(i=window.jQuery||window.$,r="on"in i.prototype?["on","off"]:["bind","unbind"],e=r[0],n=r[1],t.Util={bindEvent:function(t,n,r){return i(t)[e](n,r)},unbindEvent:function(t,e,r){return i(t)[n](e,r)},getInputValue:function(t){var e;return e=i(t),"checkbox"===e.attr("type")?e.is(":checked"):e.val()}}):t.Util={bindEvent:function(){return"addEventListener"in window?function(t,e,i){return t.addEventListener(e,i,!1)}:function(t,e,i){return t.attachEvent("on"+e,i)}}(),unbindEvent:function(){return"removeEventListener"in window?function(t,e,i){return t.removeEventListener(e,i,!1)}:function(t,e,i){return t.detachEvent("on"+e,i)}}(),getInputValue:function(t){var e,i,n,r;if("checkbox"===t.type)return t.checked;if("select-multiple"===t.type){for(r=[],i=0,n=t.length;n>i;i++)e=t[i],e.selected&&r.push(e.value);return r}return t.value}},t.TypeParser=function(){function t(){}return t.types={primitive:0,keypath:1},t.parse=function(t){return/^'.*'$|^".*"$/.test(t)?{type:this.types.primitive,value:t.slice(1,-1)}:"true"===t?{type:this.types.primitive,value:!0}:"false"===t?{type:this.types.primitive,value:!1}:"null"===t?{type:this.types.primitive,value:null}:"undefined"===t?{type:this.types.primitive,value:void 0}:""===t?{type:this.types.primitive,value:void 0}:isNaN(Number(t))===!1?{type:this.types.primitive,value:Number(t)}:{type:this.types.keypath,value:t}},t}(),t.TextTemplateParser=function(){function t(){}return t.types={text:0,binding:1},t.parse=function(t,e){var i,n,r,s,o,u,l;for(u=[],s=t.length,i=0,n=0;s>n;){if(i=t.indexOf(e[0],n),0>i){u.push({type:this.types.text,value:t.slice(n)});break}if(i>0&&i>n&&u.push({type:this.types.text,value:t.slice(n,i)}),n=i+e[0].length,i=t.indexOf(e[1],n),0>i){o=t.slice(n-e[1].length),r=u[u.length-1],(null!=r?r.type:void 0)===this.types.text?r.value+=o:u.push({type:this.types.text,value:o});break}l=t.slice(n,i).trim(),u.push({type:this.types.binding,value:l}),n=i+e[1].length}return u},t}(),t.View=function(){function e(e,i,n){var r,o,u,l,h,a,p,d,c,f,b,v,m;for(this.els=e,this.models=i,null==n&&(n={}),this.update=s(this.update,this),this.publish=s(this.publish,this),this.sync=s(this.sync,this),this.unbind=s(this.unbind,this),this.bind=s(this.bind,this),this.select=s(this.select,this),this.traverse=s(this.traverse,this),this.build=s(this.build,this),this.buildBinding=s(this.buildBinding,this),this.bindingRegExp=s(this.bindingRegExp,this),this.options=s(this.options,this),this.els.jquery||this.els instanceof Array||(this.els=[this.els]),c=t.extensions,h=0,p=c.length;p>h;h++){if(o=c[h],this[o]={},n[o]){f=n[o];for(r in f)u=f[r],this[o][r]=u}b=t["public"][o];for(r in b)u=b[r],null==(l=this[o])[r]&&(l[r]=u)}for(v=t.options,a=0,d=v.length;d>a;a++)o=v[a],this[o]=null!=(m=n[o])?m:t["public"][o];this.build()}return e.prototype.options=function(){var e,i,n,r,s;for(i={},s=t.extensions.concat(t.options),n=0,r=s.length;r>n;n++)e=s[n],i[e]=this[e];return i},e.prototype.bindingRegExp=function(){return new RegExp("^"+this.prefix+"-")},e.prototype.buildBinding=function(e,i,n,r){var s,o,u,l,h,a,p;return h={},p=function(){var t,e,i,n;for(i=r.match(/((?:'[^']*')*(?:(?:[^\|']*(?:'[^']*')+[^\|']*)+|[^\|]+))|^$/g),n=[],t=0,e=i.length;e>t;t++)a=i[t],n.push(a.trim());return n}(),s=function(){var t,e,i,n;for(i=p.shift().split("<"),n=[],t=0,e=i.length;e>t;t++)o=i[t],n.push(o.trim());return n}(),l=s.shift(),h.formatters=p,(u=s.shift())&&(h.dependencies=u.split(/\s+/)),this.bindings.push(new t[e](this,i,n,l,h))},e.prototype.build=function(){var e,i,n,r,s;for(this.bindings=[],i=function(e){return function(n){var r,s,o,u,l,h,a,p,d,c,f,b,v;if(3===n.nodeType){if(l=t.TextTemplateParser,(o=e.templateDelimiters)&&(p=l.parse(n.data,o)).length&&(1!==p.length||p[0].type!==l.types.text)){for(d=0,f=p.length;f>d;d++)a=p[d],h=document.createTextNode(a.value),n.parentNode.insertBefore(h,n),1===a.type&&e.buildBinding("TextBinding",h,null,a.value);n.parentNode.removeChild(n)}}else 1===n.nodeType&&(r=e.traverse(n));if(!r)for(v=function(){var t,e,i,r;for(i=n.childNodes,r=[],t=0,e=i.length;e>t;t++)u=i[t],r.push(u);return r}(),c=0,b=v.length;b>c;c++)s=v[c],i(s)}}(this),s=this.els,n=0,r=s.length;r>n;n++)e=s[n],i(e);this.bindings.sort(function(t,e){var i,n;return((null!=(i=e.binder)?i.priority:void 0)||0)-((null!=(n=t.binder)?n.priority:void 0)||0)})},e.prototype.traverse=function(e){var i,n,r,s,o,u,l,h,a,p,d,c,f,b,v,m;for(s=this.bindingRegExp(),o="SCRIPT"===e.nodeName||"STYLE"===e.nodeName,b=e.attributes,p=0,c=b.length;c>p;p++)if(i=b[p],s.test(i.name)){if(h=i.name.replace(s,""),!(r=this.binders[h])){v=this.binders;for(u in v)a=v[u],"*"!==u&&-1!==u.indexOf("*")&&(l=new RegExp("^"+u.replace(/\*/g,".+")+"$"),l.test(h)&&(r=a))}r||(r=this.binders["*"]),r.block&&(o=!0,n=[i])}for(m=n||e.attributes,d=0,f=m.length;f>d;d++)i=m[d],s.test(i.name)&&(h=i.name.replace(s,""),this.buildBinding("Binding",e,h,i.value));return o||(h=e.nodeName.toLowerCase(),this.components[h]&&!e._bound&&(this.bindings.push(new t.ComponentBinding(this,e,h)),o=!0)),o},e.prototype.select=function(t){var e,i,n,r,s;for(r=this.bindings,s=[],i=0,n=r.length;n>i;i++)e=r[i],t(e)&&s.push(e);return s},e.prototype.bind=function(){var t,e,i,n;for(n=this.bindings,e=0,i=n.length;i>e;e++)t=n[e],t.bind()},e.prototype.unbind=function(){var t,e,i,n;for(n=this.bindings,e=0,i=n.length;i>e;e++)t=n[e],t.unbind()},e.prototype.sync=function(){var t,e,i,n;for(n=this.bindings,e=0,i=n.length;i>e;e++)t=n[e],"function"==typeof t.sync&&t.sync()},e.prototype.publish=function(){var t,e,i,n;for(n=this.select(function(t){var e;return null!=(e=t.binder)?e.publishes:void 0}),e=0,i=n.length;i>e;e++)t=n[e],t.publish()},e.prototype.update=function(t){var e,i,n,r,s,o;null==t&&(t={});for(i in t)n=t[i],this.models[i]=n;for(o=this.bindings,r=0,s=o.length;s>r;r++)e=o[r],"function"==typeof e.update&&e.update(t)},e}(),t.Binding=function(){function e(t,e,i,n,r){this.view=t,this.el=e,this.type=i,this.keypath=n,this.options=null!=r?r:{},this.getValue=s(this.getValue,this),this.update=s(this.update,this),this.unbind=s(this.unbind,this),this.bind=s(this.bind,this),this.publish=s(this.publish,this),this.sync=s(this.sync,this),this.set=s(this.set,this),this.eventHandler=s(this.eventHandler,this),this.formattedValue=s(this.formattedValue,this),this.parseFormatterArguments=s(this.parseFormatterArguments,this),this.parseTarget=s(this.parseTarget,this),this.observe=s(this.observe,this),this.setBinder=s(this.setBinder,this),this.formatters=this.options.formatters||[],this.dependencies=[],this.formatterObservers={},this.model=void 0,this.setBinder()}return e.prototype.setBinder=function(){var t,e,i,n;if(!(this.binder=this.view.binders[this.type])){n=this.view.binders;for(t in n)i=n[t],"*"!==t&&-1!==t.indexOf("*")&&(e=new RegExp("^"+t.replace(/\*/g,".+")+"$"),e.test(this.type)&&(this.binder=i,this.args=new RegExp("^"+t.replace(/\*/g,"(.+)")+"$").exec(this.type),this.args.shift()))}return this.binder||(this.binder=this.view.binders["*"]),this.binder instanceof Function?this.binder={routine:this.binder}:void 0},e.prototype.observe=function(e,i,n){return t.sightglass(e,i,n,{root:this.view.rootInterface,adapters:this.view.adapters})},e.prototype.parseTarget=function(){var e;return e=t.TypeParser.parse(this.keypath),e.type===t.TypeParser.types.primitive?this.value=e.value:(this.observer=this.observe(this.view.models,this.keypath,this.sync),this.model=this.observer.target)},e.prototype.parseFormatterArguments=function(e,i){var n,r,s,o,u,l,h;for(e=function(){var i,n,s;for(s=[],i=0,n=e.length;n>i;i++)r=e[i],s.push(t.TypeParser.parse(r));return s}(),o=[],n=l=0,h=e.length;h>l;n=++l)r=e[n],o.push(r.type===t.TypeParser.types.primitive?r.value:((u=this.formatterObservers)[i]||(u[i]={}),(s=this.formatterObservers[i][n])?void 0:(s=this.observe(this.view.models,r.value,this.sync),this.formatterObservers[i][n]=s),s.value()));return o},e.prototype.formattedValue=function(t){var e,i,n,r,s,u,l,h,a;for(h=this.formatters,i=u=0,l=h.length;l>u;i=++u)n=h[i],e=n.match(/[^\s']+|'([^']|'[^\s])*'|"([^"]|"[^\s])*"/g),r=e.shift(),n=this.view.formatters[r],s=this.parseFormatterArguments(e,i),(null!=n?n.read:void 0)instanceof Function?t=(a=n.read).call.apply(a,[this.model,t].concat(o.call(s))):n instanceof Function&&(t=n.call.apply(n,[this.model,t].concat(o.call(s))));return t},e.prototype.eventHandler=function(t){var e,i;return i=(e=this).view.handler,function(n){return i.call(t,this,n,e)}},e.prototype.set=function(e){var i;return e=e instanceof Function&&!this.binder["function"]&&t["public"].executeFunctions?this.formattedValue(e.call(this.model)):this.formattedValue(e),null!=(i=this.binder.routine)?i.call(this,this.el,e):void 0},e.prototype.sync=function(){var t,e;return this.set(function(){var i,n,r,s,o,u,l;if(this.observer){if(this.model!==this.observer.target){for(o=this.dependencies,i=0,r=o.length;r>i;i++)e=o[i],e.unobserve();if(this.dependencies=[],null!=(this.model=this.observer.target)&&(null!=(u=this.options.dependencies)?u.length:void 0))for(l=this.options.dependencies,n=0,s=l.length;s>n;n++)t=l[n],e=this.observe(this.model,t,this.sync),this.dependencies.push(e)}return this.observer.value()}return this.value}.call(this))},e.prototype.publish=function(){var t,e,i,n,r,s,u,l,h,a,p,d,c;if(this.observer){for(l=this.getValue(this.el),s=this.formatters.length-1,p=this.formatters.slice(0).reverse(),i=h=0,a=p.length;a>h;i=++h)n=p[i],e=s-i,t=n.split(/\s+/),r=t.shift(),u=this.parseFormatterArguments(t,e),(null!=(d=this.view.formatters[r])?d.publish:void 0)&&(l=(c=this.view.formatters[r]).publish.apply(c,[l].concat(o.call(u))));return this.observer.setValue(l)}},e.prototype.bind=function(){var t,e,i,n,r,s,o;if(this.parseTarget(),null!=(r=this.binder.bind)&&r.call(this,this.el),null!=this.model&&(null!=(s=this.options.dependencies)?s.length:void 0))for(o=this.options.dependencies,i=0,n=o.length;n>i;i++)t=o[i],e=this.observe(this.model,t,this.sync),this.dependencies.push(e);return this.view.preloadData?this.sync():void 0},e.prototype.unbind=function(){var t,e,i,n,r,s,o,u,l,h;for(null!=(o=this.binder.unbind)&&o.call(this,this.el),null!=(u=this.observer)&&u.unobserve(),l=this.dependencies,r=0,s=l.length;s>r;r++)n=l[r],n.unobserve();this.dependencies=[],h=this.formatterObservers;for(i in h){e=h[i];for(t in e)n=e[t],n.unobserve()}return this.formatterObservers={}},e.prototype.update=function(t){var e,i;return null==t&&(t={}),this.model=null!=(e=this.observer)?e.target:void 0,null!=(i=this.binder.update)?i.call(this,t):void 0},e.prototype.getValue=function(e){return this.binder&&null!=this.binder.getValue?this.binder.getValue.call(this,e):t.Util.getInputValue(e)},e}(),t.ComponentBinding=function(e){function i(e,i,n){var r,o,u,l,a,p,d,c;for(this.view=e,this.el=i,this.type=n,this.unbind=s(this.unbind,this),this.bind=s(this.bind,this),this.locals=s(this.locals,this),this.component=this.view.components[this.type],this["static"]={},this.observers={},this.upstreamObservers={},o=e.bindingRegExp(),d=this.el.attributes||[],a=0,p=d.length;p>a;a++)r=d[a],o.test(r.name)||(u=this.camelCase(r.name),l=t.TypeParser.parse(r.value),h.call(null!=(c=this.component["static"])?c:[],u)>=0?this["static"][u]=r.value:l.type===t.TypeParser.types.primitive?this["static"][u]=l.value:this.observers[u]=r.value)}return l(i,e),i.prototype.sync=function(){},i.prototype.update=function(){},i.prototype.publish=function(){},i.prototype.locals=function(){var t,e,i,n,r,s;i={},r=this["static"];for(t in r)n=r[t],i[t]=n;s=this.observers;for(t in s)e=s[t],i[t]=e.value();return i},i.prototype.camelCase=function(t){return t.replace(/-([a-z])/g,function(t){return t[1].toUpperCase()})},i.prototype.bind=function(){var e,i,n,r,s,o,u,l,h,a,p,d,c,f,b,v,m,y,g,w;if(!this.bound){f=this.observers;for(i in f)n=f[i],this.observers[i]=this.observe(this.view.models,n,function(t){return function(e){return function(){return t.componentView.models[e]=t.observers[e].value()}}}(this).call(this,i));this.bound=!0}if(null!=this.componentView)this.componentView.bind();else{for(this.el.innerHTML=this.component.template.call(this),u=this.component.initialize.call(this,this.el,this.locals()),this.el._bound=!0,o={},b=t.extensions,a=0,d=b.length;d>a;a++){if(s=b[a],o[s]={},this.component[s]){v=this.component[s];for(e in v)l=v[e],o[s][e]=l}m=this.view[s];for(e in m)l=m[e],null==(h=o[s])[e]&&(h[e]=l)}for(y=t.options,p=0,c=y.length;c>p;p++)s=y[p],o[s]=null!=(g=this.component[s])?g:this.view[s];this.componentView=new t.View(Array.prototype.slice.call(this.el.childNodes),u,o),this.componentView.bind(),w=this.observers;for(i in w)r=w[i],this.upstreamObservers[i]=this.observe(this.componentView.models,i,function(t){return function(e,i){return function(){return i.setValue(t.componentView.models[e])}}}(this).call(this,i,r))}},i.prototype.unbind=function(){var t,e,i,n,r;i=this.upstreamObservers;for(t in i)e=i[t],e.unobserve();n=this.observers;for(t in n)e=n[t],e.unobserve();return null!=(r=this.componentView)?r.unbind.call(this):void 0},i}(t.Binding),t.TextBinding=function(t){function e(t,e,i,n,r){this.view=t,this.el=e,this.type=i,this.keypath=n,this.options=null!=r?r:{},this.sync=s(this.sync,this),this.formatters=this.options.formatters||[],this.dependencies=[],this.formatterObservers={}}return l(e,t),e.prototype.binder={routine:function(t,e){return t.data=null!=e?e:""}},e.prototype.sync=function(){return e.__super__.sync.apply(this,arguments)},e}(t.Binding),t["public"].binders.text=function(t,e){return null!=t.textContent?t.textContent=null!=e?e:"":t.innerText=null!=e?e:""},t["public"].binders.html=function(t,e){return t.innerHTML=null!=e?e:""},t["public"].binders.show=function(t,e){return t.style.display=e?"":"none"},t["public"].binders.hide=function(t,e){return t.style.display=e?"none":""},t["public"].binders.enabled=function(t,e){return t.disabled=!e},t["public"].binders.disabled=function(t,e){return t.disabled=!!e},t["public"].binders.checked={publishes:!0,priority:2e3,bind:function(e){return t.Util.bindEvent(e,"change",this.publish)},unbind:function(e){return t.Util.unbindEvent(e,"change",this.publish)},routine:function(t,e){var i;return t.checked="radio"===t.type?(null!=(i=t.value)?i.toString():void 0)===(null!=e?e.toString():void 0):!!e}},t["public"].binders.unchecked={publishes:!0,priority:2e3,bind:function(e){return t.Util.bindEvent(e,"change",this.publish)},unbind:function(e){return t.Util.unbindEvent(e,"change",this.publish)},routine:function(t,e){var i;return t.checked="radio"===t.type?(null!=(i=t.value)?i.toString():void 0)!==(null!=e?e.toString():void 0):!e}},t["public"].binders.value={publishes:!0,priority:3e3,bind:function(e){return"INPUT"!==e.tagName||"radio"!==e.type?(this.event="SELECT"===e.tagName?"change":"input",t.Util.bindEvent(e,this.event,this.publish)):void 0},unbind:function(e){return"INPUT"!==e.tagName||"radio"!==e.type?t.Util.unbindEvent(e,this.event,this.publish):void 0},routine:function(t,e){var n,r,s,o,u,l,a;if("INPUT"===t.tagName&&"radio"===t.type)return t.setAttribute("value",e);if(null!=window.jQuery){if(t=i(t),(null!=e?e.toString():void 0)!==(null!=(o=t.val())?o.toString():void 0))return t.val(null!=e?e:"")}else if("select-multiple"===t.type){if(null!=e){for(a=[],r=0,s=t.length;s>r;r++)n=t[r],a.push(n.selected=(u=n.value,h.call(e,u)>=0));return a}}else if((null!=e?e.toString():void 0)!==(null!=(l=t.value)?l.toString():void 0))return t.value=null!=e?e:""}},t["public"].binders["if"]={block:!0,priority:4e3,bind:function(t){var e,i;return null==this.marker?(e=[this.view.prefix,this.type].join("-").replace("--","-"),i=t.getAttribute(e),this.marker=document.createComment(" rivets: "+this.type+" "+i+" "),this.bound=!1,t.removeAttribute(e),t.parentNode.insertBefore(this.marker,t),t.parentNode.removeChild(t)):void 0},unbind:function(){return this.nested?(this.nested.unbind(),this.bound=!1):void 0},routine:function(e,i){var n,r,s,o;if(!!i==!this.bound){if(i){s={},o=this.view.models;for(n in o)r=o[n],s[n]=r;return(this.nested||(this.nested=new t.View(e,s,this.view.options()))).bind(),this.marker.parentNode.insertBefore(e,this.marker.nextSibling),this.bound=!0}return e.parentNode.removeChild(e),this.nested.unbind(),this.bound=!1}},update:function(t){var e;return null!=(e=this.nested)?e.update(t):void 0}},t["public"].binders.unless={block:!0,priority:4e3,bind:function(e){return t["public"].binders["if"].bind.call(this,e)},unbind:function(){return t["public"].binders["if"].unbind.call(this)},routine:function(e,i){return t["public"].binders["if"].routine.call(this,e,!i)},update:function(e){return t["public"].binders["if"].update.call(this,e)}},t["public"].binders["on-*"]={"function":!0,priority:1e3,unbind:function(e){return this.handler?t.Util.unbindEvent(e,this.args[0],this.handler):void 0},routine:function(e,i){return this.handler&&t.Util.unbindEvent(e,this.args[0],this.handler),t.Util.bindEvent(e,this.args[0],this.handler=this.eventHandler(i))}},t["public"].binders["each-*"]={block:!0,priority:4e3,bind:function(t){var e,i,n,r,s;if(null==this.marker)e=[this.view.prefix,this.type].join("-").replace("--","-"),this.marker=document.createComment(" rivets: "+this.type+" "),this.iterated=[],t.removeAttribute(e),t.parentNode.insertBefore(this.marker,t),t.parentNode.removeChild(t);else for(s=this.iterated,n=0,r=s.length;r>n;n++)i=s[n],i.bind()},unbind:function(){var t,e,i,n;if(null!=this.iterated)for(n=this.iterated,e=0,i=n.length;i>e;e++)t=n[e],t.unbind()},routine:function(e,i){var n,r,s,o,u,l,h,a,p,d,c,f,b,v,m,y,g,w,k,x;if(h=this.args[0],i=i||[],this.iterated.length>i.length)for(w=Array(this.iterated.length-i.length),f=0,m=w.length;m>f;f++)s=w[f],c=this.iterated.pop(),c.unbind(),this.marker.parentNode.removeChild(c.els[0]);for(o=b=0,y=i.length;y>b;o=++b)if(l=i[o],r={index:o},r[t["public"].iterationAlias(h)]=o,r[h]=l,null==this.iterated[o]){k=this.view.models;for(u in k)l=k[u],null==r[u]&&(r[u]=l);p=this.iterated.length?this.iterated[this.iterated.length-1].els[0]:this.marker,a=this.view.options(),a.preloadData=!0,d=e.cloneNode(!0),c=new t.View(d,r,a),c.bind(),this.iterated.push(c),this.marker.parentNode.insertBefore(d,p.nextSibling)}else this.iterated[o].models[h]!==l&&this.iterated[o].update(r);if("OPTION"===e.nodeName)for(x=this.view.bindings,v=0,g=x.length;g>v;v++)n=x[v],n.el===this.marker.parentNode&&"value"===n.type&&n.sync()},update:function(t){var e,i,n,r,s,o,u;e={};for(i in t)n=t[i],i!==this.args[0]&&(e[i]=n);for(u=this.iterated,s=0,o=u.length;o>s;s++)r=u[s],r.update(e)}},t["public"].binders["class-*"]=function(t,e){var i;return i=" "+t.className+" ",!e==(-1!==i.indexOf(" "+this.args[0]+" "))?t.className=e?""+t.className+" "+this.args[0]:i.replace(" "+this.args[0]+" "," ").trim():void 0},t["public"].binders["*"]=function(t,e){return null!=e?t.setAttribute(this.type,e):t.removeAttribute(this.type)},t["public"].formatters.call=function(){var t,e;return e=arguments[0],t=2<=arguments.length?o.call(arguments,1):[],e.call.apply(e,[this].concat(o.call(t)))},t["public"].adapters["."]={id:"_rv",counter:0,weakmap:{},weakReference:function(t){var e,i,n;return t.hasOwnProperty(this.id)||(e=this.counter++,Object.defineProperty(t,this.id,{value:e})),(i=this.weakmap)[n=t[this.id]]||(i[n]={callbacks:{}})},cleanupWeakReference:function(t,e){return Object.keys(t.callbacks).length||t.pointers&&Object.keys(t.pointers).length?void 0:delete this.weakmap[e]},stubFunction:function(t,e){var i,n,r;return n=t[e],i=this.weakReference(t),r=this.weakmap,t[e]=function(){var e,s,o,u,l,h,a,p,d,c;u=n.apply(t,arguments),a=i.pointers;for(o in a)for(s=a[o],c=null!=(p=null!=(d=r[o])?d.callbacks[s]:void 0)?p:[],l=0,h=c.length;h>l;l++)e=c[l],e();return u}},observeMutations:function(t,e,i){var n,r,s,o,u,l;if(Array.isArray(t)){if(s=this.weakReference(t),null==s.pointers)for(s.pointers={},r=["push","pop","shift","unshift","sort","reverse","splice"],u=0,l=r.length;l>u;u++)n=r[u],this.stubFunction(t,n);if(null==(o=s.pointers)[e]&&(o[e]=[]),h.call(s.pointers[e],i)<0)return s.pointers[e].push(i)}},unobserveMutations:function(t,e,i){var n,r,s;return Array.isArray(t)&&null!=t[this.id]&&(r=this.weakmap[t[this.id]])&&(s=r.pointers[e])?((n=s.indexOf(i))>=0&&s.splice(n,1),s.length||delete r.pointers[e],this.cleanupWeakReference(r,t[this.id])):void 0},observe:function(t,e,i){var n,r,s;return n=this.weakReference(t).callbacks,null==n[e]&&(n[e]=[],r=Object.getOwnPropertyDescriptor(t,e),(null!=r?r.get:void 0)||(null!=r?r.set:void 0)||(s=t[e],Object.defineProperty(t,e,{enumerable:!0,get:function(){return s},set:function(i){return function(r){var o,u,l,a,p;if(r!==s&&(i.unobserveMutations(s,t[i.id],e),s=r,u=i.weakmap[t[i.id]])){if(n=u.callbacks,n[e])for(p=n[e].slice(),l=0,a=p.length;a>l;l++)o=p[l],h.call(n[e],o)>=0&&o();return i.observeMutations(r,t[i.id],e)}}}(this)}))),h.call(n[e],i)<0&&n[e].push(i),this.observeMutations(t[e],t[this.id],e)},unobserve:function(t,e,i){var n,r,s;return(s=this.weakmap[t[this.id]])&&(n=s.callbacks[e])?((r=n.indexOf(i))>=0&&(n.splice(r,1),n.length||(delete s.callbacks[e],this.unobserveMutations(t[e],t[this.id],e))),this.cleanupWeakReference(s,t[this.id])):void 0},get:function(t,e){return t[e]},set:function(t,e,i){return t[e]=i}},t.factory=function(e){return t.sightglass=e,t["public"]._=t,t["public"]},"object"==typeof("undefined"!=typeof module&&null!==module?module.exports:void 0)?module.exports=t.factory(require("sightglass")):"function"==typeof define&&define.amd?define(["sightglass"],function(e){return this.rivets=t.factory(e)}):this.rivets=t.factory(sightglass)}).call(this);


--------------------------------------------------------------------------------
/doc.sh:
--------------------------------------------------------------------------------
 1 | #!/usr/bin/env bash
 2 | set -e
 3 | STATUS=$(git status --porcelain 2>/dev/null)
 4 | BRANCH_NAME=$(git symbolic-ref HEAD 2>/dev/null)
 5 | BRANCH_NAME=${BRANCH_NAME##refs/heads/}
 6 | 
 7 | if [ -n "$STATUS" ]
 8 | then
 9 |         echo "Dirty working tree; commit your changes then run me again." >&2
10 |         exit 1
11 | fi
12 | 
13 | if [ -z "$MAIN_BRANCH"  ]; then
14 |         MAIN_BRANCH="master"
15 | fi
16 | 
17 | if [ "$BRANCH_NAME" != $MAIN_BRANCH ] 
18 | then
19 |         echo "Refusing to update documentation from non-main branch:" >&2
20 |         echo "expect branch $BRANCH_NAME == $MAIN_BRANCH" >&2
21 |         echo "If you want to view your rendered documentation run: " >&2
22 |         echo "" >&2
23 |         echo "    harp server docs " >&2
24 |         echo "" >&2
25 |         exit 1
26 | fi
27 | 
28 | # The docs should include the version when they build. At current it's just in
29 | # the commit message.
30 | export RIVETS_VERSION=$( \
31 |         grep 'version' package.json | \
32 |         awk -F'["]' '{print $4}' \
33 | )
34 | 
35 | 
36 | git checkout gh-pages 2>/dev/null 1>/dev/null
37 | git checkout $MAIN_BRANCH -- docs 2>/dev/null
38 | rm -rf _harp
39 | mv docs _harp
40 | harp compile _harp .
41 | 
42 | git add -A 2>/dev/null 1>/dev/null
43 | 
44 | set +e
45 | git commit -a -m "Generate documentation for v$RIVETS_VERSION" 2>/dev/null 1>/dev/null
46 | 
47 | if [ $? -eq 0 ]
48 | then
49 |         echo "documentation updated, publish via:" >&2
50 |         echo "    git push origin gh-pages:gh-pages" >&2
51 | else
52 |         echo "No changes to publish" >&2
53 | fi
54 | set -e
55 | 
56 | git checkout $MAIN_BRANCH 2>/dev/null 1>/dev/null
57 | 
58 | 
59 | 


--------------------------------------------------------------------------------
/docs/CNAME:
--------------------------------------------------------------------------------
1 | rivetsjs.com
2 | 


--------------------------------------------------------------------------------
/docs/_layout.jade:
--------------------------------------------------------------------------------
 1 | doctype
 2 | 
 3 | html
 4 |   head
 5 |     title Rivets.js — Lightweight and powerful data binding + templating solution for building modern web applications
 6 | 
 7 |     link(rel="stylesheet", href="/css/bootstrap.css")
 8 |     link(rel="stylesheet", href="/css/type.css")
 9 |     link(rel="stylesheet", href="/css/screen.css")
10 |     link(rel="stylesheet", href="/css/syntax.css")
11 |     link(rel="stylesheet", href="/css/responsive.css")
12 | 
13 |     script(src="/js/jquery.js")
14 |     script(src="/js/bootstrap.min.js")
15 |     script(src="/js/highlight.js")
16 |     script(src="/js/app.js")
17 | 
18 |     meta(name="viewport", content="width=device-width, initial-scale=1.0")
19 | 
20 |     script(type="text/javascript").
21 |       hljs.initHighlightingOnLoad();
22 | 
23 |       var _gaq = _gaq || [];
24 |       _gaq.push(['_setAccount', 'UA-6079274-2']);
25 |       _gaq.push(['_trackPageview']);
26 | 
27 |       (function() {
28 |         var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
29 |         ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
30 |         var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
31 |       })();
32 | 
33 |   body(data-spy="scroll", data-target="#nav")
34 |     header
35 |       .container
36 |         .row
37 |           .col.col-xs-6
38 |             h3.logotype
39 |               a(href="/") RIVETS
40 | 
41 |           .col.col-xs-6.right.visible-xs
42 |             i#hamburger &#9776;
43 |           .col.col-sm-6.col-xs-12.right.hidden-xs#menu
44 |             ul.list-unstyled
45 |               li
46 |                 a(href="/docs/guide") Guide
47 |               li
48 |                 a(href="/docs/reference") Binder Reference
49 |               li
50 |                 a(href="http://github.com/mikeric/rivets") GitHub
51 | 
52 |     != yield
53 | 


--------------------------------------------------------------------------------
/docs/css/responsive.styl:
--------------------------------------------------------------------------------
 1 | @media(min-width: 1200px)
 2 |   .container
 3 |     width 970px
 4 | 
 5 | // Portrait tablet to landscape and desktop
 6 | 
 7 | @media(max-width: 991px)
 8 |   aside
 9 |     display none
10 | 
11 | // Landscape phone to portrait tablet
12 | 
13 | @media(max-width: 767px)
14 |   header #menu
15 |     ul
16 |       li
17 |         margin 0 0 0.5em
18 |         display block
19 | 
20 |   section.intro .blurb
21 |     font-size 28px
22 | 


--------------------------------------------------------------------------------
/docs/css/screen.styl:
--------------------------------------------------------------------------------
  1 | $color = #3f86e4
  2 | 
  3 | body
  4 |   font-family "Proxima Nova", serif
  5 |   font-size 16px
  6 |   font-weight 400
  7 |   line-height 1.5
  8 |   text-rendering optimizeLegibility
  9 |   color #747a7e
 10 | 
 11 | h1, h2, h3, h4, h5, h6
 12 |   font-family "Proxima Nova", serif
 13 |   font-weight 400
 14 |   color #545a5e
 15 |   margin 2em 0 1em
 16 | 
 17 | article
 18 |   h2
 19 |     font-size 38px
 20 | 
 21 |     &:first-child
 22 |       margin-top 0
 23 | 
 24 |   h3
 25 |     font-size 22px
 26 | 
 27 | p, pre
 28 |   margin 16px 0
 29 | 
 30 | blockquote
 31 |   border none
 32 |   position relative
 33 | 
 34 |   &:before
 35 |     content "\201C"
 36 |     font-size 84px
 37 |     color #DADEDF
 38 |     position absolute
 39 |     top -20px
 40 |     left 0
 41 | 
 42 |   p
 43 |     margin 0 0 0 1.5em
 44 |     font-size inherit
 45 | 
 46 | p > code, em > code
 47 |   background-color inherit
 48 |   color #2B3E4E
 49 | 
 50 | pre
 51 |   border none
 52 |   border-radius 0
 53 |   font-size 13px
 54 |   padding 2em
 55 | 
 56 | code
 57 |   font-size 12px
 58 | 
 59 | i
 60 |   font-family "Entypo"
 61 |   font-style normal
 62 | 
 63 |   &.social
 64 |     font-family "Entypo Social"
 65 | 
 66 | .btn
 67 |   border-radius 0
 68 | 
 69 |   i
 70 |     font-size 38px
 71 |     line-height 0
 72 |     position relative
 73 |     top 4px
 74 |     right 10px
 75 | 
 76 | blockquote
 77 |   background-color white
 78 |   border-color #e0e4e5
 79 | 
 80 | img.graphic
 81 |   opacity 0.1
 82 | 
 83 | .logotype
 84 |   display inline-block
 85 |   color inherit
 86 |   letter-spacing 3px
 87 |   font-weight 400
 88 |   border 2px solid
 89 |   padding 10px 9px 8px 11px
 90 | 
 91 |   &.sg
 92 |     font-size 11px
 93 |     font-weight 500
 94 |     padding 8px 6px 6px 8px
 95 |     position relative
 96 |     top -2px
 97 |     margin-left 8px
 98 |     color #89a
 99 | 
100 |   a, a:hover
101 |     color inherit
102 |     text-decoration none
103 | 
104 | 
105 | // HEADER
106 | 
107 | header
108 |   background-color $color
109 |   color white
110 | 
111 |   img
112 |     height 50px
113 |     margin 20px 0
114 |     float left
115 | 
116 |   .logotype
117 |     font-size 16px
118 |     margin 30px 0
119 | 
120 |   .center
121 |     text-align center
122 | 
123 |   .right
124 |     text-align right
125 | 
126 |     li
127 |       display inline-block
128 |       font-weight 400
129 |       margin 40px 0 0 20px
130 | 
131 |       &:first-child
132 |         margin-left 0
133 | 
134 |       a
135 |         color: inherit
136 | 
137 |   i#hamburger
138 |     cursor pointer
139 |     font-size 68px
140 | 
141 | section.intro
142 |   text-align center
143 |   padding 60px 0 80px
144 |   background-color $color
145 |   color: white
146 | 
147 |   img
148 |     height 70px
149 | 
150 |   .blurb
151 |     margin 0 auto 20px
152 |     font-weight 200
153 |     font-size 32px
154 |     max-width 800px
155 | 
156 |   .btn + .btn
157 |     margin-left 5px
158 | 
159 | section.highlights
160 |   padding: 40px 0 0
161 | 
162 |   span
163 |     font-family monospace
164 |     font-size: 14px
165 | 
166 |     .highlighted
167 |       background-color #F0F2F5
168 |       padding 2px 6px 3px
169 | 
170 | section.using
171 |   padding 40px 0
172 |   text-align center
173 | 
174 |   a
175 |     opacity 0.75
176 |     -webkit-transition all 0.2s
177 |     transition all 0.2s
178 | 
179 |     &:hover
180 |       opacity 1
181 | 
182 |     img
183 |       max-height 60px
184 |       margin 50px 30px
185 | 
186 | section.author
187 |   text-align center
188 |   background-color #f0f2f5
189 | 
190 |   h2
191 |     font-weight 300
192 |     font-size 36px
193 | 
194 |   img
195 |     margin 40px 0 20px
196 |     width 200px
197 |     height 200px
198 |     border-radius 500px
199 | 
200 |   a
201 |     font-size: 46px
202 |     padding 0 5px
203 |     position relative
204 |     bottom 155px
205 |     color white
206 |     transition all .2s
207 | 
208 |     &:hover
209 |       text-decoration none
210 |       color $color
211 | 
212 | section.docs
213 |   margin 80px 0 40px
214 | 
215 | section
216 |   .separator
217 |     text-align center
218 |     border-top 2px solid #eee
219 |     margin 40px 0 -30px
220 |     letter-spacing 1px
221 | 
222 |     h5
223 |       position relative
224 |       top -36px
225 |       display inline-block
226 |       padding 0 1em
227 |       background-color white
228 |       font-weight 500
229 | 
230 | nav
231 |   text-align right
232 | 
233 |   &.affix
234 |     top 40px
235 | 
236 |   ul
237 |     list-style none
238 |     margin 0
239 | 
240 | #nav
241 |   .nav
242 |     width 200px
243 | 
244 |   a
245 |     padding inherit
246 |     display inline
247 |     color #919E9F
248 | 
249 |     &:hover
250 |       text-decoration underline
251 |       background-color inherit
252 | 
253 |   > .nav > li
254 |     > a
255 |       color #444e4e
256 | 
257 |     ul
258 |       display none
259 | 
260 |   li.active
261 |     ul
262 |       display block
263 | 
264 |     > a
265 |       color $color
266 | 
267 | strong
268 |   font-weight 500
269 | 
270 | .btn
271 |   padding 1em 1.5em
272 |   font-weight 400
273 |   font-size 13px
274 | 
275 | .btn-clear
276 |   padding 1.5em 6em
277 |   border none
278 |   color white
279 |   background-color darken(desaturate($color, 15), 10)
280 |   transition all 0.2s
281 | 
282 | .btn-clear:hover
283 |   background-color darken(desaturate($color, 10), 15)
284 |   color white
285 | 
286 | .btn-primary
287 |   background-color #96c0c0
288 |   border-color #96c0c0
289 | 
290 | .btn-primary:hover,
291 | .btn-primary:focus,
292 | .btn-primary:active
293 |   background-color #86baba
294 |   border-color #86baba
295 | 
296 | a
297 |   color $color
298 | 
299 | a:hover
300 |   color $color
301 |   text-decoration underline
302 | 
303 | .check-list
304 |   list-style none
305 |   padding-left 1em
306 | 
307 | .check-list li:before
308 |   content "\2713\0020"
309 |   padding-right 0.5em
310 | 


--------------------------------------------------------------------------------
/docs/css/syntax.css:
--------------------------------------------------------------------------------
  1 | 
  2 | cco style used in http://jashkenas.github.com/docco/ converted by Simon Madine (@thingsinjars)
  3 | */
  4 | 
  5 | pre code {
  6 |   display: block; padding: 0.5em;
  7 |   color: #000;
  8 |   background: #f8f8ff
  9 | }
 10 | 
 11 | pre .comment,
 12 | pre .template_comment,
 13 | pre .diff .header,
 14 | pre .javadoc {
 15 |   color: #b0bab6;
 16 |   font-style: italic
 17 | }
 18 | 
 19 | pre .keyword,
 20 | pre .assignment,
 21 | pre .literal,
 22 | pre .css .rule .keyword,
 23 | pre .winutils,
 24 | pre .javascript .title,
 25 | pre .lisp .title,
 26 | pre .subst {
 27 |   color: #954121;
 28 | }
 29 | 
 30 | pre .number,
 31 | pre .hexcolor {
 32 |   color: #40a070
 33 | }
 34 | 
 35 | pre .string,
 36 | pre .tag .value,
 37 | pre .phpdoc,
 38 | pre .tex .formula {
 39 |   color: #219161;
 40 | }
 41 | 
 42 | pre .title,
 43 | pre .id {
 44 |   color: #19469D;
 45 | }
 46 | pre .params {
 47 |   color: #00F;
 48 | }
 49 | 
 50 | pre .javascript .title,
 51 | pre .lisp .title,
 52 | pre .subst {
 53 |   font-weight: normal
 54 | }
 55 | 
 56 | pre .class .title,
 57 | pre .haskell .label,
 58 | pre .tex .command {
 59 |   color: #458;
 60 |   font-weight: bold
 61 | }
 62 | 
 63 | pre .tag,
 64 | pre .tag .title,
 65 | pre .rules .property,
 66 | pre .django .tag .keyword {
 67 |   color: #000080;
 68 |   font-weight: normal
 69 | }
 70 | 
 71 | pre .attribute,
 72 | pre .variable,
 73 | pre .instancevar,
 74 | pre .lisp .body {
 75 |   color: #008080
 76 | }
 77 | 
 78 | pre .regexp {
 79 |   color: #B68
 80 | }
 81 | 
 82 | pre .class {
 83 |   color: #458;
 84 |   font-weight: bold
 85 | }
 86 | 
 87 | pre .symbol,
 88 | pre .ruby .symbol .string,
 89 | pre .ruby .symbol .keyword,
 90 | pre .ruby .symbol .keymethods,
 91 | pre .lisp .keyword,
 92 | pre .tex .special,
 93 | pre .input_number {
 94 |   color: #990073
 95 | }
 96 | 
 97 | pre .builtin,
 98 | pre .constructor,
 99 | pre .built_in,
100 | pre .lisp .title {
101 |   color: #0086b3
102 | }
103 | 
104 | pre .preprocessor,
105 | pre .pi,
106 | pre .doctype,
107 | pre .shebang,
108 | pre .cdata {
109 |   color: #999;
110 |   font-weight: bold
111 | }
112 | 
113 | pre .deletion {
114 |   background: #fdd
115 | }
116 | 
117 | pre .addition {
118 |   background: #dfd
119 | }
120 | 
121 | pre .diff .change {
122 |   background: #0086b3
123 | }
124 | 
125 | pre .chunk {
126 |   color: #aaa
127 | }
128 | 
129 | pre .tex .formula {
130 |   opacity: 0.5;
131 | }
132 | 


--------------------------------------------------------------------------------
/docs/css/type.css:
--------------------------------------------------------------------------------
  1 | /* Proxima Nova */
  2 | 
  3 | @font-face {
  4 |   font-family: 'Proxima Nova';
  5 |   src: url('/fonts/proxima-nova/ProximaNova-Thin-webfont.eot');
  6 |   src: url('/fonts/proxima-nova/ProximaNova-Thin-webfont.eot?#iefix') format('embedded-opentype'),
  7 |        url('/fonts/proxima-nova/ProximaNova-Thin-webfont.woff') format('woff'),
  8 |        url('/fonts/proxima-nova/ProximaNova-Thin-webfont.ttf') format('truetype'),
  9 |        url('/fonts/proxima-nova/ProximaNova-Thin-webfont.svg#ywftsvg') format('svg');
 10 |   font-weight: 200;
 11 |   font-style: normal;
 12 | }
 13 | 
 14 | @font-face {
 15 |   font-family: 'Proxima Nova';
 16 |   src: url('/fonts/proxima-nova/ProximaNova-Light-webfont.eot');
 17 |   src: url('/fonts/proxima-nova/ProximaNova-Light-webfont.eot?#iefix') format('embedded-opentype'),
 18 |        url('/fonts/proxima-nova/ProximaNova-Light-webfont.woff') format('woff'),
 19 |        url('/fonts/proxima-nova/ProximaNova-Light-webfont.ttf') format('truetype'),
 20 |        url('/fonts/proxima-nova/ProximaNova-Light-webfont.svg#ywftsvg') format('svg');
 21 |   font-weight: 300;
 22 |   font-style: normal;
 23 | }
 24 | 
 25 | @font-face {
 26 |   font-family: 'Proxima Nova';
 27 |   src: url('/fonts/proxima-nova/ProximaNova-Reg-webfont.eot');
 28 |   src: url('/fonts/proxima-nova/ProximaNova-Reg-webfont.eot?#iefix') format('embedded-opentype'),
 29 |        url('/fonts/proxima-nova/ProximaNova-Reg-webfont.woff') format('woff'),
 30 |        url('/fonts/proxima-nova/ProximaNova-Reg-webfont.ttf') format('truetype'),
 31 |        url('/fonts/proxima-nova/ProximaNova-Reg-webfont.svg#ywftsvg') format('svg');
 32 |   font-weight: 400;
 33 |   font-style: normal;
 34 | }
 35 | 
 36 | @font-face {
 37 |   font-family: 'Proxima Nova';
 38 |   src: url('/fonts/proxima-nova/ProximaNova-Sbold-webfont.eot');
 39 |   src: url('/fonts/proxima-nova/ProximaNova-Sbold-webfont.eot?#iefix') format('embedded-opentype'),
 40 |        url('/fonts/proxima-nova/ProximaNova-Sbold-webfont.woff') format('woff'),
 41 |        url('/fonts/proxima-nova/ProximaNova-Sbold-webfont.ttf') format('truetype'),
 42 |        url('/fonts/proxima-nova/ProximaNova-Sbold-webfont.svg#ywftsvg') format('svg');
 43 |   font-weight: 500;
 44 |   font-style: normal;
 45 | }
 46 | 
 47 | @font-face {
 48 |   font-family: 'Proxima Nova';
 49 |   src: url('/fonts/proxima-nova/ProximaNova-Bold-webfont.eot');
 50 |   src: url('/fonts/proxima-nova/ProximaNova-Bold-webfont.eot?#iefix') format('embedded-opentype'),
 51 |        url('/fonts/proxima-nova/ProximaNova-Bold-webfont.woff') format('woff'),
 52 |        url('/fonts/proxima-nova/ProximaNova-Bold-webfont.ttf') format('truetype'),
 53 |        url('/fonts/proxima-nova/ProximaNova-Bold-webfont.svg#ywftsvg') format('svg');
 54 |   font-weight: 600;
 55 |   font-style: normal;
 56 | }
 57 | 
 58 | @font-face {
 59 |   font-family: 'Proxima Nova';
 60 |   src: url('/fonts/proxima-nova/ProximaNova-Xbold-webfont.eot');
 61 |   src: url('/fonts/proxima-nova/ProximaNova-Xbold-webfont.eot?#iefix') format('embedded-opentype'),
 62 |        url('/fonts/proxima-nova/ProximaNova-Xbold-webfont.woff') format('woff'),
 63 |        url('/fonts/proxima-nova/ProximaNova-Xbold-webfont.ttf') format('truetype'),
 64 |        url('/fonts/proxima-nova/ProximaNova-Xbold-webfont.svg#ywftsvg') format('svg');
 65 |   font-weight: 700;
 66 |   font-style: normal;
 67 | }
 68 | 
 69 | @font-face {
 70 |   font-family: 'Proxima Nova';
 71 |   src: url('/fonts/proxima-nova/ProximaNova-Black-webfont.eot');
 72 |   src: url('/fonts/proxima-nova/ProximaNova-Black-webfont.eot?#iefix') format('embedded-opentype'),
 73 |        url('/fonts/proxima-nova/ProximaNova-Black-webfont.woff') format('woff'),
 74 |        url('/fonts/proxima-nova/ProximaNova-Black-webfont.ttf') format('truetype'),
 75 |        url('/fonts/proxima-nova/ProximaNova-Black-webfont.svg#ywftsvg') format('svg');
 76 |   font-weight: 800;
 77 |   font-style: normal;
 78 | }
 79 | 
 80 | /* Entypo */
 81 | 
 82 | @font-face {
 83 |   font-family: 'Entypo';
 84 |   src: url('/fonts/entypo/entypo.eot');
 85 |   src: url('/fonts/entypo/entypo.eot?#iefix') format('embedded-opentype'),
 86 |        url('/fonts/entypo/entypo.woff') format('woff'),
 87 |        url('/fonts/entypo/entypo.ttf') format('truetype'),
 88 |        url('/fonts/entypo/entypo.svg#ywftsvg') format('svg');
 89 |   font-weight: normal;
 90 |   font-style: normal;
 91 | }
 92 | 
 93 | /* Entypo Social */
 94 | 
 95 | @font-face {
 96 |   font-family: 'Entypo Social';
 97 |   src: url('/fonts/entypo-social/entypo-social.eot');
 98 |   src: url('/fonts/entypo-social/entypo-social.eot?#iefix') format('embedded-opentype'),
 99 |        url('/fonts/entypo-social/entypo-social.woff') format('woff'),
100 |        url('/fonts/entypo-social/entypo-social.ttf') format('truetype'),
101 |        url('/fonts/entypo-social/entypo-social.svg#ywftsvg') format('svg');
102 |   font-weight: normal;
103 |   font-style: normal;
104 | }
105 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_data.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "install": {
 3 |     "title": "Installation",
 4 |     "sections": {}
 5 |   },
 6 |   "usage": {
 7 |     "title": "Usage",
 8 |     "sections": {
 9 |       "templates": {
10 |         "title": "Templates"
11 |       },
12 |       "binding": {
13 |         "title": "Binding"
14 |       },
15 |       "configuring": {
16 |         "title": "Configuring"
17 |       }
18 |     }
19 |   },
20 |   "binders": {
21 |     "title": "Binders",
22 |     "sections": {
23 |       "one-way": {
24 |         "title": "One-way binders"
25 |       },
26 |       "two-way": {
27 |         "title": "Two-way binders"
28 |       },
29 |       "api": {
30 |         "title": "API"
31 |       }
32 |     }
33 |   },
34 |   "formatters": {
35 |     "title": "Formatters",
36 |     "sections": {
37 |       "one-way": {
38 |         "title": "One-way formatters"
39 |       },
40 |       "two-way": {
41 |         "title": "Two-way formatters"
42 |       },
43 |       "arguments": {
44 |         "title": "Formatter arguments"
45 |       }
46 |     }
47 |   },
48 |   "components": {
49 |     "title": "Components",
50 |     "sections": {}
51 |   },
52 |   "adapters": {
53 |     "title": "Adapters",
54 |     "sections": {
55 |       "default": {
56 |         "title": "The built-in adapter"
57 |       },
58 |       "creating": {
59 |         "title": "Creating an adapter"
60 |       }
61 |     }
62 |   },
63 |   "computed-properties": {
64 |     "title": "Computed Properties",
65 |     "sections": {}
66 |   },
67 |   "functions-call": {
68 |     "title": "Call functions",
69 |     "sections": {}
70 |   },
71 |   "iteration": {
72 |     "title": "Iteration binding",
73 |     "sections": {
74 |       "iteration": {
75 |         "title": "Iterate"
76 |       },
77 |       "index": {
78 |         "title": "Iteration index"
79 |       }
80 |     }
81 |   }
82 | }
83 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/adapters.md:
--------------------------------------------------------------------------------
 1 | Rivets.js is agnostic about the objects that it can subscribe to. This makes it very flexible as it can adapt to work with virtually any library or framework, but it also means that you need to tell Rivets.js *how* to subscribe to those objects. This is where adapters come in to play. This feature is driven by the [Sightglass](https://github.com/mikeric/sightglass) library.
 2 | 
 3 | Each adapter is defined to a unique interface (a single character) which is used to separate the keys in a keypath. The interfaces used in a keypath determine which adapter to use for each intermediary key.
 4 | 
 5 | ```
 6 | user.address:city
 7 | ```
 8 | 
 9 | The above keypath will use the `.` adapter to access the `address` key on the `user` object, and the `:` adapter to access the `city` key on the `address` object. If you can imagine for a second that `address` is just a normal property on the user object pointing to a Backbone model, but `city` is actually an attribute on that Backbone model, you can see how this kind of notation is actually very succint and expressive.
10 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/adapters/creating.md:
--------------------------------------------------------------------------------
 1 | Adapters are defined on `rivets.adapters` with the interface as the property name and the adapter object as the value. An adapter is just an object that responds to `observe`, `unobserve`, `get` and `set`.
 2 | 
 3 | The following `:` adapter works for Backbone.js models / Stapes.js modules.
 4 | 
 5 | ```javascript
 6 | rivets.adapters[':'] = {
 7 |   observe: function(obj, keypath, callback) {
 8 |     obj.on('change:' + keypath, callback)
 9 |   },
10 |   unobserve: function(obj, keypath, callback) {
11 |     obj.off('change:' + keypath, callback)
12 |   },
13 |   get: function(obj, keypath) {
14 |     return obj.get(keypath)
15 |   },
16 |   set: function(obj, keypath, value) {
17 |     obj.set(keypath, value)
18 |   }
19 | }
20 | ```
21 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/adapters/default.md:
--------------------------------------------------------------------------------
1 | Rivets.js ships with a `.` adapter for subscribing to properties on plain JavaScript objects. The adapter is self-implemented using ES5 natives such as `Object.defineProperty`.
2 | 
3 | If you need to support non-ES5 browsers (< IE 9), you can replace this adapter to use polyfills or with a third-party library that has the browser support you need.
4 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/binders.md:
--------------------------------------------------------------------------------
1 | Binders are the sets of instructions that tell Rivets.js how to update the DOM when an observed property changes. Rivets.js comes bundled with a handful commonly-used binders for your convenience. See the [Binder Reference](/docs/reference/) to learn more about the built-in binders that are available out of the box.
2 | 
3 | While you can accomplish most UI tasks with the built-in binders, it is highly encouraged to extend Rivets.js with your own binders that are specific to the needs of your application.
4 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/binders/api.md:
--------------------------------------------------------------------------------
 1 | #### binder.bind
 2 | 
 3 | This function will get called for this binding on the initial `view.bind()`. Use it to store some initial state on the binding, or to set up any event listeners on the element.
 4 | 
 5 | #### binder.unbind
 6 | 
 7 | This function will get called for this binding on `view.unbind()`. Use it to reset any state on the element that would have been changed from the routine getting called, or to unbind any event listeners on the element that you've set up in the `binder.bind` function.
 8 | 
 9 | #### binder.routine
10 | 
11 | The routine function is called when an observed attribute on the model changes and is used to update the DOM. When defining a one-way binder as a single function, it is actually the routine function that you're defining.
12 | 
13 | #### binder.getValue
14 | The getValue function is called when the binder wants to set the value on the model. This function takes the HTML element as only parameter
15 | 
16 | #### binder.publishes
17 | 
18 | Set this to true if you want view.publish() to call publish on these bindings.
19 | 
20 | #### binder.block
21 | 
22 | Blocks the current node and child nodes from being parsed (used for iteration binding as well as the if/unless binders).


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/binders/one-way.md:
--------------------------------------------------------------------------------
 1 | One-way binders simply update the DOM when a model property changes (model-to-view only). Let's say we want a simple binder that updates an element's color when the model property changes. Here we can define a one-way `color` binder as a single function. This function takes the element and the current value of the model property, which we will use to updates the element's color.
 2 | 
 3 | ```javascript
 4 | rivets.binders.color = function(el, value) {
 5 |   el.style.color = value
 6 | }
 7 | ```
 8 | 
 9 | With the above binder defined, you can now utilize the `rv-color` declaration in your views.
10 | 
11 | ```html
12 | <button rv-color="label.color">Apply</button>
13 | ```
14 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/binders/two-way.md:
--------------------------------------------------------------------------------
 1 | Two-way binders, like one-way binders, can update the DOM when a model property changes (model-to-view) but can also update the model when the user interacts with the DOM (view-to-model), such as updating a control input, clicking an element or interacting with a third-party widget.
 2 | 
 3 | In order to update the model when the user interacts with the DOM, you need to tell Rivets.js how to bind and unbind to that DOM element to set the value on the model. Instead of defining the binder as a single function, two-way binders are defined as an object containing a few extra functions.
 4 | 
 5 | ```javascript
 6 | rivets.binders['content-editable'] = {
 7 |   bind: function(el) {
 8 |     el.setAttribute("contenteditable", true);
 9 |     el.addEventListener("keyup", this.publish);
10 |   },
11 |   
12 |   unbind: function(el) {
13 |     el.removeEventListener("keyup", this.publish);
14 |   },
15 |   
16 |   getValue : function(el) {
17 |     return el.innerText;    
18 |   },
19 |   
20 |   routine: function(el, value) {
21 |     el.innerText = value;
22 |   }
23 | };
24 | ```
25 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/components.md:
--------------------------------------------------------------------------------
 1 | Components let you define reusable views that can be used within any of your templates. For some perspective on where components fit into your templates in relation to binders; binders define custom attributes, while components define custom elements.
 2 | 
 3 | A component object must define a `template` function, which returns the template for the component (this can be an HTML string or the actual element). It must also define an `initialize` function, which returns the scope object to bind the view with (this will likely be a controller / viewmodel / presenter).
 4 | 
 5 | ```javascript
 6 | rivets.components['todo-item'] = {
 7 |   // Return the template for the component.
 8 |   template: function() {
 9 |     return JST['todos/todo-item']
10 |   },
11 | 
12 |   // Takes the original element and the data that was passed into the
13 |   // component (either from rivets.init or the attributes on the component
14 |   // element in the template).
15 |   initialize: function(el, data) {
16 |     return new ItemController({
17 |       item: data.item
18 |     })
19 |   }
20 | }
21 | ```
22 | 
23 | To use the component inside of a template, simply use an element with the same tag name as the component's key. All attributes on the element will get evaluated as keypaths before being passed into the component's `initialize` function.
24 | 
25 | ```html
26 | <todo-item item="myItem"></todo-item>
27 | ```
28 | 
29 | These keypaths will also be observed in both directions so that the component will update if the value changes from the outside and it will set the value if the component changes it from the inside.
30 | 
31 | Additionally, if you want certain attributes to be static instead of an observed keypath, you can list them out on the `static` property for your components.
32 | 
33 | ```javascript
34 | rivets.components['todo-item'] = {
35 |   static: ['list-style'],
36 |   …
37 | }
38 | ```
39 | 
40 | ```html
41 | <todo-item item="myItem" list-style="condensed"></todo-item>
42 | ```
43 | 
44 | Components can also be initialized on their own, outside of a template. This is useful when you want to insert a new view into the DOM yourself, such as the entry point to your entire application or the content of a modal. The API is similar to `rivets.bind`, except that instead of passing it an actual template / element, you just pass it the name of the component and the root element you want the component to render in.
45 | 
46 | ```
47 | rivets.init('my-app', $('body'), {user: user})
48 | ```
49 | 
50 | ```
51 | rivets.init('todo-item', $('#modal-content'), {item: myItem})
52 | ```
53 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/computed-properties.md:
--------------------------------------------------------------------------------
 1 | Computed properties are functions that get re-evaluated when one or more dependent properties change. Declaring computed properties in Rivets.js is simple, just separate the function from its dependencies with a `<`. The following text binding will get re-evaluated with `event.duration()` when either the event's `start` or `end` attribute changes.
 2 | 
 3 | ```html
 4 | <span rv-text="event.duration < start end"></span>
 5 | ```
 6 | 
 7 | Note that the dependency keypaths stem from the target object, not the view's model context. So for the above declaration, the target is the `event` object, with dependencies on `event.start` and `event.end`.
 8 | 
 9 | The `<` notation must only be used directly after the function and before any formatter.
10 | 
11 | ```html
12 | <!-- Wrong -->
13 | <span rv-text="event.duration | anyFormatter < start end">Wrong</span>
14 | <!-- OK -->
15 | <span rv-text="event.duration < start end | myFormatter">OK</span>
16 | ```
17 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/formatters.md:
--------------------------------------------------------------------------------
1 | Formatters are functions that mutate the incoming and/or outgoing value of a binding. You can use them to format dates, numbers, currencies, etc. and because they work in a similar fashion to the Unix pipeline, the output of each feeds directly as input to the next one, so you can stack as many of them together as you like.
2 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/formatters/arguments.md:
--------------------------------------------------------------------------------
 1 | Formatters can accept any number of arguments in the form of keypaths or primitives. Keypath arguments get observed and will recompute the binding when any intermediary key changes. A primitive can be a string, number, boolean, null or undefined.
 2 | 
 3 | ```html
 4 | <span>{ alarm.time | time user.timezone 'hh:mm' }</span>
 5 | ```
 6 | 
 7 | The value of each argument in the binding declaration will be evaluated and passed into the formatter function as an additional argument.
 8 | 
 9 | ```javascript
10 | rivets.formatters.time = function(value, timezone, format) {
11 |   return moment(value).tz(timezone).format(format)
12 | }
13 | ```
14 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/formatters/one-way.md:
--------------------------------------------------------------------------------
 1 | This is by far the most common and practical way to use formatters &mdash; simple read-only mutations to a value. Taking the dates example from above, we can define a `date` formatter that returns a human-friendly version of a date value.
 2 | 
 3 | ```javascript
 4 | rivets.formatters.date = function(value){
 5 |   return moment(value).format('MMM DD, YYYY')
 6 | }
 7 | ```
 8 | 
 9 | Formatters are applied by piping them to binding declarations using `|` as a delimiter.
10 | 
11 | ```html
12 | <span rv-text="event.startDate | date"></span>
13 | ```
14 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/formatters/two-way.md:
--------------------------------------------------------------------------------
 1 | Two-way formatters are useful when you want to store a value in a particular format, such as a unix epoch time or a cent value, but still let the user input the value in a different format.
 2 | 
 3 | Instead of defining the formatter as a single function, you define it as an object containing `read` and `publish` functions. When a formatter is defined as a single function, Rivets assumes it to be in the read direction only. When defined as an object, Rivets uses it's `read` and `publish` functions to effectively serialize and de-serialize the value.
 4 | 
 5 | Using the cent value example from above, let's say we want to store a monetary value as cents but let the user input it in a dollar amount and automatically round to two decimal places when setting the value on the model. For this we can define a two-way `currency` formatter.
 6 | 
 7 | ```javascript
 8 | rivets.formatters.currency = {
 9 |   read: function(value) {
10 |     return (value / 100).toFixed(2)
11 |   },
12 |   publish: function(value) {
13 |     return Math.round(parseFloat(value) * 100)
14 |   }
15 | }
16 | ```
17 | 
18 | You can then bind using this formatter with any one-way or two-way binder.
19 | 
20 | ```html
21 | <input rv-value="item.price | currency">
22 | ```
23 | 
24 | Note that you can also chain bidirectional formatters with any other formatters, and in any order. They read from left to right, and publish from right to left, skipping any read-only formatters when publishing the value back to the model.
25 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/functions-call.md:
--------------------------------------------------------------------------------
1 | To call a function in an expression, rivets includes a special formatter `call`. This formatter will call the function, any formatter parameter will become an argument sent to the function. The following text binding will call the function `event.duration` with the two arguments `event.start` and `event.end`.
2 | 
3 | ```html
4 | <span rv-text="event.duration | call event.start event.end"></span>
5 | ```
6 | `event.duration` will be called again every time `event.start` and `event.end` change
7 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/index.md:
--------------------------------------------------------------------------------
 1 | To access the index of the current iteration use the syntax `%item%`, Where `item` is the name of the model you provided in `rv-each-[item]`.  You can also access the index of the iteration by using the key `index` but using this will access only the current iterations index. Note that when nesting `rv-each`'s the parent index is still accessible within the scope via the model name.
 2 | 
 3 | ```html
 4 | <ul>
 5 |   <li rv-each-user="app.users">
 6 |     <span>User Index : { %user% }</span>
 7 | 
 8 |     <ul>
 9 |         <li rv-each-comment="user.comments">
10 |             <span>Comment Index : { %comment% }</span>
11 | 
12 |             <span>User Index : { %user% }</span>
13 |         </li>
14 |     </ul>
15 |   </li>
16 | <ul>
17 | ```
18 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/install.md:
--------------------------------------------------------------------------------
 1 | You can grab the latest stable release [here](/dist/rivets.min.js) or install using the package manager of your choice. We currently maintain releases on npm, component, jam and bower (recommended).
 2 | 
 3 | ```bash
 4 | bower install rivets
 5 | ```
 6 | 
 7 | Rivets' only hard dependency is [Sightglass](https://github.com/mikeric/sightglass). If you wish to include Sightglass separately, just make sure to include it first.
 8 | 
 9 | ```html
10 | <script src="bower_components/sightglass/index.js"></script>
11 | <script src="bower_components/rivets/dist/rivets.min.js"></script>
12 | ```
13 | 
14 | Alternatively you can just include the bundled distribution if Rivets, which contains both libraries.
15 | 
16 | ```html
17 | <script src="bower_components/rivets/dist/rivets.bundled.min.js"></script>
18 | ```
19 | 
20 | *Note that Rivets unconditionally occupies a `rivets` global but CommonJS and AMD module loaders such as [RequireJS](http://requirejs.org/) and [almond](https://github.com/jrburke/almond) are fully supported as well, if that's your thing.*
21 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/iteration/index.md:
--------------------------------------------------------------------------------
 1 | To access the index of the current iteration use the syntax `%item%`, Where `item` is the name of the model you provided in `rv-each-[item]`.  You can also access the index of the iteration by using the key `index` but using this will access only the current iterations index. Note that when nesting `rv-each`'s the parent index is still accessible within the scope via the model name.
 2 | 
 3 | ```html
 4 | <ul>
 5 |   <li rv-each-user="app.users">
 6 |     <span>User Index : { %user% }</span>
 7 | 
 8 |     <ul>
 9 |         <li rv-each-comment="user.comments">
10 |             <span>Comment Index : { %comment% }</span>
11 | 
12 |             <span>User Index : { %user% }</span>
13 |         </li>
14 |     </ul>
15 |   </li>
16 | <ul>
17 | ```
18 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/iteration/iteration.md:
--------------------------------------------------------------------------------
 1 | Use the `rv-each-[item]` binder to have Rivets.js automatically loop over items in an array and append bound instances of that element. Within that element you can bind to the iterated item as well as any contexts that are available in the parent view.
 2 | 
 3 | ```html
 4 | <ul>
 5 |   <li rv-each-todo="list.todos">
 6 |     <input type="checkbox" rv-checked="todo.done">
 7 |     <span>{ todo.summary }</span>
 8 |   </li>
 9 | <ul>
10 | ```
11 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/usage/binding.md:
--------------------------------------------------------------------------------
1 | Simply call `rivets.bind` on a template element with some data that you would like to bind.
2 | 
3 | 
4 | ```javascript
5 | rivets.bind($('#auction'), {auction: auction})
6 | ```
7 | 
8 | *Every call to `rivets.bind` returns a fully data-bound view that you should hold on to for later. You'll need it in order to unbind it's listeners using `view.unbind()`.*
9 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/usage/configuring.md:
--------------------------------------------------------------------------------
 1 | Use `rivets.configure` to set the following configuration options for your app. Note that all configuration options can be overridden locally to a particular view if needed.
 2 | 
 3 | ```javascript
 4 | rivets.configure({
 5 | 
 6 |   // Attribute prefix in templates
 7 |   prefix: 'rv',
 8 | 
 9 |   // Preload templates with initial data on bind
10 |   preloadData: true,
11 | 
12 |   // Root sightglass interface for keypaths
13 |   rootInterface: '.',
14 | 
15 |   // Template delimiters for text bindings
16 |   templateDelimiters: ['{', '}'],
17 | 
18 |   // Alias for index in rv-each binder
19 |   iterationAlias : function(modelName) {
20 |     return '%' + modelName + '%';
21 |   },
22 | 
23 |   // Augment the event handler of the on-* binder
24 |   handler: function(target, event, binding) {
25 |     this.call(target, event, binding.view.models)
26 |   },
27 | 
28 |   // Since rivets 0.9 functions are not automatically executed in expressions. If you need backward compatibilty, set this parameter to true
29 |   executeFunctions: false
30 | 
31 | })
32 | ```
33 | 


--------------------------------------------------------------------------------
/docs/docs/guide/_sections/usage/templates.md:
--------------------------------------------------------------------------------
 1 | Templates describe your UI in plain HTML. You can define them directly in the document, use template elements or store and load them however you like. Just make sure you have a convenient way to reference your templates when you want to bind some data to them.
 2 | 
 3 | ```html
 4 | <section id="auction">
 5 |   <h3>{ auction.product.name }</h3>
 6 |   <p>Current bid: { auction.currentBid | money }</p>
 7 | 
 8 |   <aside rv-if="auction.timeLeft | lt 120">
 9 |     Hurry up! There is { auction.timeLeft | time } left.
10 |   </aside>
11 | </section>
12 | ```
13 | 
14 | The important parts to note here are the attributes prefixed with `rv-` and portions of text wrapped in `{ ... }`. These are binding declarations and they are the sole way that Rivets.js ties data to your templates. The values of these declarations all follow the same minimal and expressive syntax.
15 | 
16 | ```
17 | (keypath | primitive) [formatters...]
18 | ```
19 | 
20 | Keypaths get observed and will recompute the binding when any intermediary key changes. A primitive can be a string, number, boolean, null or undefined.
21 | 
22 | [Formatters](#formatters) can be piped to values using `|` and they follow a similarly minimal yet expressive syntax. [Formatter arguments](#formatters-arguments) can be keypaths or primitives. Keypath arguments get observed and will recompute the binding when any intermediary key changes.
23 | 
24 | ```
25 | (formatter) [keypath | primitive...]
26 | ```
27 | 


--------------------------------------------------------------------------------
/docs/docs/guide/index.jade:
--------------------------------------------------------------------------------
 1 | section.docs
 2 |   .container
 3 |     .row
 4 |       article.guide.col.col-md-9
 5 |         for section, anchor in public.docs.guide._data
 6 |           h2(id= anchor)= section.title
 7 |           != partial('_sections/' + anchor)
 8 | 
 9 |           for subsection, subanchor in section.sections
10 |             h3(id= anchor + '-' + subanchor)= subsection.title
11 |             != partial('_sections/' + anchor + '/' + subanchor)
12 | 
13 |       aside.col.col-md-3.hidden-sm.hidden-xs
14 |         .pull-right
15 |           nav#nav(data-spy="affix", data-offset-top="145")
16 |             ul.nav
17 |               for section, anchor in public.docs.guide._data
18 |                 li
19 |                   a(href= '#' + anchor)
20 |                     strong= section.title
21 | 
22 |                   ul.nav
23 |                     for subsection, subanchor in section.sections
24 |                       li
25 |                         a(href= '#' + anchor + '-' + subanchor)= subsection.nav || subsection.title
26 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/[attribute].md:
--------------------------------------------------------------------------------
1 | Sets the value of an attribute (whatever value is in place of `[attribute]`) on the element.
2 | 
3 | *If your binding declaration does not match any of the above routines, it will fallback to use this binding.*
4 | 
5 | ```html
6 | <input type="text" rv-placeholder="field.placeholder">
7 | ```
8 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/checked.md:
--------------------------------------------------------------------------------
1 | Checks the input when the value evaluates to true and unchecks the input when the value evaluates to false. This also sets the bound object's value to true/false when the user checks/unchecks the input (two-way).
2 | 
3 | *Use this instead of value when binding to checkboxes or radio buttons.*
4 | 
5 | ```html
6 | <input type="checkbox" rv-checked="item.enabled">
7 | ```
8 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/class-[classname].md:
--------------------------------------------------------------------------------
1 | Adds a class (whatever value is in place of `[classname]`) on the element when the value evaluates to true and removes that class if the value evaluates to false.
2 | 
3 | ```html
4 | <li rv-class-completed="todo.done">{ todo.name }</li>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/disabled.md:
--------------------------------------------------------------------------------
1 | Disables the element when the value evaluates to true and enables the element when the value evaluates to false.
2 | 
3 | ```html
4 | <button rv-disabled="user.suspended">Upvote</button>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/each-[item].md:
--------------------------------------------------------------------------------
 1 | Appends a new instance of the element in place for each item in an array. Each element is bound with a completely new nested view that contains an additional property (named whatever value is in place of `[item]`) which points to the current iterated item in the array.
 2 | 
 3 | *Also note that you may bind to the iterated item directly on the parent element which contains the actual `rv-each` declaration.*
 4 | 
 5 | ```html
 6 | <ul>
 7 |   <li rv-each-todo="todos">
 8 |     <input type="checkbox" rv-checked="todo.done"> { todo.name }
 9 |   </li>
10 | <ul>
11 | ```
12 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/enabled.md:
--------------------------------------------------------------------------------
1 | Enables the element when the value evaluates to true and disables the element when the value evaluates to false.
2 | 
3 | ```html
4 | <button rv-enabled="user.canVote">Upvote</button>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/hide.md:
--------------------------------------------------------------------------------
1 | Hides the element when the value evaluates to true and shows the element when the value evaluates to false.
2 | 
3 | ```html
4 | <section rv-hide="feature.disabled"></section>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/html.md:
--------------------------------------------------------------------------------
1 | Sets the element's HTML content.
2 | 
3 | ```html
4 | <section rv-html="item.summary"></section>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/if.md:
--------------------------------------------------------------------------------
1 | Inserts and binds the element as well as it's child nodes into the DOM when the value evaluates to true and removes / unbinds the element when the value evaluates to false.
2 | 
3 | ```html
4 | <section rv-if="item.editable"></section>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/on-[event].md:
--------------------------------------------------------------------------------
1 | Binds an event listener on the element using the event specified in `[event]` and the bound object (should return a function) as the callback.
2 | 
3 | *If the end value of the binding changes to a different function, this binder will automatically unbind the old callback and bind a new listener to the new function.*
4 | 
5 | ```html
6 | <button rv-on-click="item.destroy">Remove</button>
7 | ```
8 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/show.md:
--------------------------------------------------------------------------------
1 | Shows the element when the value evaluates to true and hides the element when the value evaluates to false.
2 | 
3 | ```html
4 | <button rv-show="user.admin">Remove</button>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/text.md:
--------------------------------------------------------------------------------
 1 | Sets the element's text content.
 2 | 
 3 | ```html
 4 | <h1 rv-text="user.name"></h1>
 5 | ```
 6 | 
 7 | You can also bind text using interpolation.
 8 | 
 9 | ```html
10 | <p>{ user.name } is { user.age } years old.</p>
11 | ```
12 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/unchecked.md:
--------------------------------------------------------------------------------
1 | Unchecks the input when the value evaluates to true and checks the input when the value evaluates to false. This also sets the bound object's value to false/true when the user checks/unchecks the input (two-way).
2 | 
3 | *Use this instead of value when binding to checkboxes or radio buttons.*
4 | 
5 | ```html
6 | <input type="checkbox" rv-unchecked="item.disabled">
7 | ```
8 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/unless.md:
--------------------------------------------------------------------------------
1 | Removes and unbinds the element as well as it's child nodes when the value evaluates to true and inserts / binds the element when the value evaluates to false.
2 | 
3 | ```html
4 | <section rv-unless="item.locked"></section>
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_binders/value.md:
--------------------------------------------------------------------------------
1 | Sets the element's value when the attribute changes and sets the bound object's value when the input element changes from user input (two-way).
2 | 
3 | ```html
4 | <input rv-value="item.name">
5 | ```
6 | 


--------------------------------------------------------------------------------
/docs/docs/reference/_data.json:
--------------------------------------------------------------------------------
 1 | [
 2 |   "text",
 3 |   "html",
 4 |   "show",
 5 |   "hide",
 6 |   "enabled",
 7 |   "disabled",
 8 |   "if",
 9 |   "unless",
10 |   "value",
11 |   "checked",
12 |   "unchecked",
13 |   "on-[event]",
14 |   "each-[item]",
15 |   "class-[classname]",
16 |   "[attribute]"
17 | ]
18 | 


--------------------------------------------------------------------------------
/docs/docs/reference/index.jade:
--------------------------------------------------------------------------------
 1 | section.docs
 2 |   .container
 3 |     .row
 4 |       article.col.col-md-9
 5 |         for binder in public.docs.reference._data
 6 |           h2(id= binder)= binder
 7 |           != partial('_binders/' + binder)
 8 | 
 9 |       aside.col.col-md-3.hidden-sm.hidden-xs
10 |         .pull-right
11 |           nav#nav(data-spy="affix", data-offset-top="145")
12 |             ul.nav
13 |               for binder in public.docs.reference._data
14 |                 li
15 |                   a(href= '#' + binder)
16 |                     strong= binder
17 | 


--------------------------------------------------------------------------------
/docs/fonts/entypo-social/entypo-social.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/entypo-social/entypo-social.eot


--------------------------------------------------------------------------------
/docs/fonts/entypo-social/entypo-social.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" > <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
 2 | <defs >
 3 | <font id="entypo-social" horiz-adv-x="555" ><font-face
 4 |     font-family="Entypo Social"
 5 |     units-per-em="1000"
 6 |     panose-1="0 0 0 0 0 0 0 0 0 0"
 7 |     ascent="750"
 8 |     descent="-250"
 9 |     alphabetic="0" />
10 | <missing-glyph horiz-adv-x="500" />
11 | </font>
12 | </defs>
13 | </svg>
14 | 


--------------------------------------------------------------------------------
/docs/fonts/entypo-social/entypo-social.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/entypo-social/entypo-social.ttf


--------------------------------------------------------------------------------
/docs/fonts/entypo-social/entypo-social.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/entypo-social/entypo-social.woff


--------------------------------------------------------------------------------
/docs/fonts/entypo/entypo.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/entypo/entypo.eot


--------------------------------------------------------------------------------
/docs/fonts/entypo/entypo.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" > <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
 2 | <defs >
 3 | <font id="entypo" horiz-adv-x="508" ><font-face
 4 |     font-family="Entypo"
 5 |     units-per-em="1000"
 6 |     panose-1="0 0 0 0 0 0 0 0 0 0"
 7 |     ascent="750"
 8 |     descent="-250"
 9 |     alphabetic="0" />
10 | <missing-glyph horiz-adv-x="500" />
11 | </font>
12 | </defs>
13 | </svg>
14 | 


--------------------------------------------------------------------------------
/docs/fonts/entypo/entypo.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/entypo/entypo.ttf


--------------------------------------------------------------------------------
/docs/fonts/entypo/entypo.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/entypo/entypo.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Black-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Black-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Black-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Black-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Black-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Black-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-BlackIt-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-BlackIt-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-BlackIt-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-BlackIt-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-BlackIt-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-BlackIt-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Bold-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Bold-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Bold-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Bold-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Bold-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Bold-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-BoldIt-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-BoldIt-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-BoldIt-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-BoldIt-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-BoldIt-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-BoldIt-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Light-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Light-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Light-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Light-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Light-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Light-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-LightIt-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-LightIt-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-LightIt-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-LightIt-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-LightIt-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-LightIt-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Reg-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Reg-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Reg-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Reg-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Reg-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Reg-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-RegIt-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-RegIt-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-RegIt-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-RegIt-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-RegIt-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-RegIt-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Sbold-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Sbold-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Sbold-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Sbold-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Sbold-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Sbold-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-SboldIt-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-SboldIt-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-SboldIt-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-SboldIt-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-SboldIt-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-SboldIt-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Thin-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Thin-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Thin-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Thin-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Thin-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Thin-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-ThinIt-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-ThinIt-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-ThinIt-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-ThinIt-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-ThinIt-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-ThinIt-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Xbold-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Xbold-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Xbold-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Xbold-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-Xbold-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-Xbold-webfont.woff


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-XboldIt-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-XboldIt-webfont.eot


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-XboldIt-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-XboldIt-webfont.ttf


--------------------------------------------------------------------------------
/docs/fonts/proxima-nova/ProximaNova-XboldIt-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/fonts/proxima-nova/ProximaNova-XboldIt-webfont.woff


--------------------------------------------------------------------------------
/docs/img/attendease.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/img/attendease.png


--------------------------------------------------------------------------------
/docs/img/dell.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/img/dell.png


--------------------------------------------------------------------------------
/docs/img/disco.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/img/disco.png


--------------------------------------------------------------------------------
/docs/img/kin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/img/kin.png


--------------------------------------------------------------------------------
/docs/img/mikeric.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/img/mikeric.jpg


--------------------------------------------------------------------------------
/docs/img/vs.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mikeric/rivets/7e05257b99796ddd7f395a86fe0340d55ef2181a/docs/img/vs.png


--------------------------------------------------------------------------------
/docs/index.jade:
--------------------------------------------------------------------------------
  1 | section.intro
  2 |   .container
  3 |     .row
  4 |       .col.col-sm-12
  5 |         p.blurb Lightweight and powerful data binding + templating solution for building modern web applications.
  6 | 
  7 |         a.btn.btn-clear(href="https://raw.githubusercontent.com/mikeric/rivets/v0.9.4/dist/rivets.bundled.min.js")
  8 |           i &#128229;
  9 |           span Download 0.9.4
 10 | 
 11 |         p 6.2kb minified and gzipped (includes dependencies)
 12 | 
 13 | section.agnostic
 14 |   .container
 15 |     .row
 16 |       .col.col-sm-12
 17 |         .separator
 18 |           h5 WHY RIVETS.JS?
 19 | 
 20 |     .row
 21 |       .col.col-md-6
 22 |         h3 Agnostic
 23 |         p Rivets.js is completely agnostic about your model / controller layer and works well with existing libraries that employ an event-driven model such as <a href="http://backbonejs.org/">Backbone.js</a> and <a href="http://hay.github.io/stapes/">Stapes.js</a>. It also ships with built-in support for plain JavaScript objects, so you can use Rivets.js right away without needing a separate model or observables library.
 24 | 
 25 |       .col.col-md-6
 26 |         h3 Configurable
 27 |         p From the event handlers to the template delimiters, the attribute prefixes to the preloading of data. It's all configurable and tunable at the application level as well as locally to individual views.
 28 | 
 29 | section.highlights
 30 |   .container
 31 |     .row
 32 |       .col.col-sm-12
 33 |         .separator
 34 |           h5 MOVING PARTS
 35 | 
 36 |     .row
 37 |       .col.col-sm-6
 38 |         h3 Binders
 39 | 
 40 |         span
 41 |           = '<input rv-'
 42 |           span.highlighted value
 43 |           = '="item.summary">'
 44 | 
 45 |         p Describe how your underlying data is reflected in the DOM and vice-versa. All binders create a binding that is automatically updated when model data changes or when the user interacts with the DOM.
 46 | 
 47 |       .col.col-sm-6
 48 |         h3 Components
 49 | 
 50 |         span
 51 |           = '<'
 52 |           span.highlighted toggle
 53 |           = ' on="item.complete">'
 54 | 
 55 |         p Define reusable views, instantiable as a custom element. Each component gets its own isolated, augmentable scope.
 56 | 
 57 |     .row
 58 |       .col.col-sm-6
 59 |         h3 Formatters
 60 | 
 61 |         span
 62 |           = '{ item.due | '
 63 |           span.highlighted fromNow
 64 |           = ' | '
 65 |           span.highlighted duration
 66 |           = ' }'
 67 | 
 68 |         p Format dates, numbers, currencies and implement logic gates and conversions. Formatters work in a similar fashion to the Unix pipeline, so you can stack as many of them together as you like.
 69 | 
 70 |       .col.col-sm-6
 71 |         h3 Adapters via
 72 |           .logotype.sg
 73 |             a(href="https://github.com/mikeric/sightglass") SIGHTGLASS
 74 | 
 75 |         span
 76 |           = '<select rv-value="user'
 77 |           span.highlighted= '.'
 78 |           = 'address'
 79 |           span.highlighted= ':'
 80 |           = 'city">'
 81 | 
 82 |         p Teach Rivets.js how to observe and interact with different objects. Use <code>.</code> for plain object proterties and define a <code>:</code> adapter for Backbone model attributes. It's up to you. Adapters take care of observing and reading each key in a keypath.
 83 | 
 84 | section.using
 85 |   .container
 86 |     .row
 87 |       .col.col-sm-12
 88 |         .separator
 89 |           h5 WHO IS USING RIVETS.JS?
 90 | 
 91 |     .row
 92 |       .col.col-sm-12
 93 |         a(href="https://attendease.com/" target="_blank")
 94 |           img(src="/img/attendease.png")
 95 |         a(href="http://www.dell.com/" target="_blank")
 96 |           img(src="/img/dell.png")
 97 |         a(href="http://kinhr.com/" target="_blank")
 98 |           img(src="/img/kin.png")
 99 |         a(href="https://www.victoriassecret.com/" target="_blank")
100 |           img(src="/img/vs.png")
101 |         a(href="http://discolabs.com/" target="_blank")
102 |           img(src="/img/disco.png")
103 | 
104 | section.author
105 |   .container
106 |     .row
107 |       .col.col-md-6.col-md-offset-3.col-sm-8.col-sm-offset-2
108 |         h2 Author
109 |         p Michael Richards is a Ruby/JavaScript developer, residing in beautiful Vancouver, British Columbia.
110 |         img(src="/img/mikeric.jpg")
111 | 
112 |     .row
113 |       .col.col-md-12
114 |         a(href="http://github.com/mikeric")
115 |           i.social &#62208;
116 |         a(href="http://twitter.com/mikeric")
117 |           i.social &#62217;
118 |         a(href="http://linkedin.com/in/mikeric")
119 |           i.social &#62232;
120 |         a(href="http://instagram.com/mikeric")
121 |           i.social &#62253;
122 |         a(href="http://rdio.com/people/mikeric")
123 |           i.social &#62244;
124 | 


--------------------------------------------------------------------------------
/docs/js/app.js:
--------------------------------------------------------------------------------
 1 | $(document).ready(function() {
 2 |   $('#hamburger').on('click', function() {
 3 |     menu = $('#menu')
 4 | 
 5 |     if(menu.data('open')) {
 6 |       menu.attr('style', 'display: none')
 7 |       menu.data('open', false)
 8 |     } else {
 9 |       menu.attr('style', 'display: block !important; float: left')
10 |       menu.data('open', true)
11 |     }
12 |   })
13 | })
14 | 


--------------------------------------------------------------------------------
/docs/js/highlight.js:
--------------------------------------------------------------------------------
1 | var hljs=new function(){function l(o){return o.replace(/&/gm,"&amp;").replace(/</gm,"&lt;").replace(/>/gm,"&gt;")}function b(p){for(var o=p.firstChild;o;o=o.nextSibling){if(o.nodeName=="CODE"){return o}if(!(o.nodeType==3&&o.nodeValue.match(/\s+/))){break}}}function h(p,o){return Array.prototype.map.call(p.childNodes,function(q){if(q.nodeType==3){return o?q.nodeValue.replace(/\n/g,""):q.nodeValue}if(q.nodeName=="BR"){return"\n"}return h(q,o)}).join("")}function a(q){var p=(q.className+" "+q.parentNode.className).split(/\s+/);p=p.map(function(r){return r.replace(/^language-/,"")});for(var o=0;o<p.length;o++){if(e[p[o]]||p[o]=="no-highlight"){return p[o]}}}function c(q){var o=[];(function p(r,s){for(var t=r.firstChild;t;t=t.nextSibling){if(t.nodeType==3){s+=t.nodeValue.length}else{if(t.nodeName=="BR"){s+=1}else{if(t.nodeType==1){o.push({event:"start",offset:s,node:t});s=p(t,s);o.push({event:"stop",offset:s,node:t})}}}}return s})(q,0);return o}function j(x,v,w){var p=0;var y="";var r=[];function t(){if(x.length&&v.length){if(x[0].offset!=v[0].offset){return(x[0].offset<v[0].offset)?x:v}else{return v[0].event=="start"?x:v}}else{return x.length?x:v}}function s(A){function z(B){return" "+B.nodeName+'="'+l(B.value)+'"'}return"<"+A.nodeName+Array.prototype.map.call(A.attributes,z).join("")+">"}while(x.length||v.length){var u=t().splice(0,1)[0];y+=l(w.substr(p,u.offset-p));p=u.offset;if(u.event=="start"){y+=s(u.node);r.push(u.node)}else{if(u.event=="stop"){var o,q=r.length;do{q--;o=r[q];y+=("</"+o.nodeName.toLowerCase()+">")}while(o!=u.node);r.splice(q,1);while(q<r.length){y+=s(r[q]);q++}}}}return y+l(w.substr(p))}function f(q){function o(s,r){return RegExp(s,"m"+(q.cI?"i":"")+(r?"g":""))}function p(y,w){if(y.compiled){return}y.compiled=true;var s=[];if(y.k){var r={};function z(A,t){t.split(" ").forEach(function(B){var C=B.split("|");r[C[0]]=[A,C[1]?Number(C[1]):1];s.push(C[0])})}y.lR=o(y.l||hljs.IR,true);if(typeof y.k=="string"){z("keyword",y.k)}else{for(var x in y.k){if(!y.k.hasOwnProperty(x)){continue}z(x,y.k[x])}}y.k=r}if(w){if(y.bWK){y.b="\\b("+s.join("|")+")\\s"}y.bR=o(y.b?y.b:"\\B|\\b");if(!y.e&&!y.eW){y.e="\\B|\\b"}if(y.e){y.eR=o(y.e)}y.tE=y.e||"";if(y.eW&&w.tE){y.tE+=(y.e?"|":"")+w.tE}}if(y.i){y.iR=o(y.i)}if(y.r===undefined){y.r=1}if(!y.c){y.c=[]}for(var v=0;v<y.c.length;v++){if(y.c[v]=="self"){y.c[v]=y}p(y.c[v],y)}if(y.starts){p(y.starts,w)}var u=[];for(var v=0;v<y.c.length;v++){u.push(y.c[v].b)}if(y.tE){u.push(y.tE)}if(y.i){u.push(y.i)}y.t=u.length?o(u.join("|"),true):{exec:function(t){return null}}}p(q)}function d(D,E){function o(r,M){for(var L=0;L<M.c.length;L++){var K=M.c[L].bR.exec(r);if(K&&K.index==0){return M.c[L]}}}function s(K,r){if(K.e&&K.eR.test(r)){return K}if(K.eW){return s(K.parent,r)}}function t(r,K){return K.i&&K.iR.test(r)}function y(L,r){var K=F.cI?r[0].toLowerCase():r[0];return L.k.hasOwnProperty(K)&&L.k[K]}function G(){var K=l(w);if(!A.k){return K}var r="";var N=0;A.lR.lastIndex=0;var L=A.lR.exec(K);while(L){r+=K.substr(N,L.index-N);var M=y(A,L);if(M){v+=M[1];r+='<span class="'+M[0]+'">'+L[0]+"</span>"}else{r+=L[0]}N=A.lR.lastIndex;L=A.lR.exec(K)}return r+K.substr(N)}function z(){if(A.sL&&!e[A.sL]){return l(w)}var r=A.sL?d(A.sL,w):g(w);if(A.r>0){v+=r.keyword_count;B+=r.r}return'<span class="'+r.language+'">'+r.value+"</span>"}function J(){return A.sL!==undefined?z():G()}function I(L,r){var K=L.cN?'<span class="'+L.cN+'">':"";if(L.rB){x+=K;w=""}else{if(L.eB){x+=l(r)+K;w=""}else{x+=K;w=r}}A=Object.create(L,{parent:{value:A}});B+=L.r}function C(K,r){w+=K;if(r===undefined){x+=J();return 0}var L=o(r,A);if(L){x+=J();I(L,r);return L.rB?0:r.length}var M=s(A,r);if(M){if(!(M.rE||M.eE)){w+=r}x+=J();do{if(A.cN){x+="</span>"}A=A.parent}while(A!=M.parent);if(M.eE){x+=l(r)}w="";if(M.starts){I(M.starts,"")}return M.rE?0:r.length}if(t(r,A)){throw"Illegal"}w+=r;return r.length||1}var F=e[D];f(F);var A=F;var w="";var B=0;var v=0;var x="";try{var u,q,p=0;while(true){A.t.lastIndex=p;u=A.t.exec(E);if(!u){break}q=C(E.substr(p,u.index-p),u[0]);p=u.index+q}C(E.substr(p));return{r:B,keyword_count:v,value:x,language:D}}catch(H){if(H=="Illegal"){return{r:0,keyword_count:0,value:l(E)}}else{throw H}}}function g(s){var o={keyword_count:0,r:0,value:l(s)};var q=o;for(var p in e){if(!e.hasOwnProperty(p)){continue}var r=d(p,s);r.language=p;if(r.keyword_count+r.r>q.keyword_count+q.r){q=r}if(r.keyword_count+r.r>o.keyword_count+o.r){q=o;o=r}}if(q.language){o.second_best=q}return o}function i(q,p,o){if(p){q=q.replace(/^((<[^>]+>|\t)+)/gm,function(r,v,u,t){return v.replace(/\t/g,p)})}if(o){q=q.replace(/\n/g,"<br>")}return q}function m(r,u,p){var v=h(r,p);var t=a(r);if(t=="no-highlight"){return}var w=t?d(t,v):g(v);t=w.language;var o=c(r);if(o.length){var q=document.createElement("pre");q.innerHTML=w.value;w.value=j(o,c(q),v)}w.value=i(w.value,u,p);var s=r.className;if(!s.match("(\\s|^)(language-)?"+t+"(\\s|$)")){s=s?(s+" "+t):t}r.innerHTML=w.value;r.className=s;r.result={language:t,kw:w.keyword_count,re:w.r};if(w.second_best){r.second_best={language:w.second_best.language,kw:w.second_best.keyword_count,re:w.second_best.r}}}function n(){if(n.called){return}n.called=true;Array.prototype.map.call(document.getElementsByTagName("pre"),b).filter(Boolean).forEach(function(o){m(o,hljs.tabReplace)})}function k(){window.addEventListener("DOMContentLoaded",n,false);window.addEventListener("load",n,false)}var e={};this.LANGUAGES=e;this.highlight=d;this.highlightAuto=g;this.fixMarkup=i;this.highlightBlock=m;this.initHighlighting=n;this.initHighlightingOnLoad=k;this.IR="[a-zA-Z][a-zA-Z0-9_]*";this.UIR="[a-zA-Z_][a-zA-Z0-9_]*";this.NR="\\b\\d+(\\.\\d+)?";this.CNR="(\\b0[xX][a-fA-F0-9]+|(\\b\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)";this.BNR="\\b(0b[01]+)";this.RSR="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|\\.|-|-=|/|/=|:|;|<|<<|<<=|<=|=|==|===|>|>=|>>|>>=|>>>|>>>=|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~";this.BE={b:"\\\\[\\s\\S]",r:0};this.ASM={cN:"string",b:"'",e:"'",i:"\\n",c:[this.BE],r:0};this.QSM={cN:"string",b:'"',e:'"',i:"\\n",c:[this.BE],r:0};this.CLCM={cN:"comment",b:"//",e:"$"};this.CBLCLM={cN:"comment",b:"/\\*",e:"\\*/"};this.HCM={cN:"comment",b:"#",e:"$"};this.NM={cN:"number",b:this.NR,r:0};this.CNM={cN:"number",b:this.CNR,r:0};this.BNM={cN:"number",b:this.BNR,r:0};this.inherit=function(q,r){var o={};for(var p in q){o[p]=q[p]}if(r){for(var p in r){o[p]=r[p]}}return o}}();hljs.LANGUAGES.ruby=function(e){var a="[a-zA-Z_][a-zA-Z0-9_]*(\\!|\\?)?";var j="[a-zA-Z_]\\w*[!?=]?|[-+~]\\@|<<|>>|=~|===?|<=>|[<>]=?|\\*\\*|[-/+%^&*~`|]|\\[\\]=?";var g={keyword:"and false then defined module in return redo if BEGIN retry end for true self when next until do begin unless END rescue nil else break undef not super class case require yield alias while ensure elsif or include"};var c={cN:"yardoctag",b:"@[A-Za-z]+"};var k=[{cN:"comment",b:"#",e:"$",c:[c]},{cN:"comment",b:"^\\=begin",e:"^\\=end",c:[c],r:10},{cN:"comment",b:"^__END__",e:"\\n$"}];var d={cN:"subst",b:"#\\{",e:"}",l:a,k:g};var i=[e.BE,d];var b=[{cN:"string",b:"'",e:"'",c:i,r:0},{cN:"string",b:'"',e:'"',c:i,r:0},{cN:"string",b:"%[qw]?\\(",e:"\\)",c:i},{cN:"string",b:"%[qw]?\\[",e:"\\]",c:i},{cN:"string",b:"%[qw]?{",e:"}",c:i},{cN:"string",b:"%[qw]?<",e:">",c:i,r:10},{cN:"string",b:"%[qw]?/",e:"/",c:i,r:10},{cN:"string",b:"%[qw]?%",e:"%",c:i,r:10},{cN:"string",b:"%[qw]?-",e:"-",c:i,r:10},{cN:"string",b:"%[qw]?\\|",e:"\\|",c:i,r:10}];var h={cN:"function",bWK:true,e:" |$|;",k:"def",c:[{cN:"title",b:j,l:a,k:g},{cN:"params",b:"\\(",e:"\\)",l:a,k:g}].concat(k)};var f=k.concat(b.concat([{cN:"class",bWK:true,e:"$|;",k:"class module",c:[{cN:"title",b:"[A-Za-z_]\\w*(::\\w+)*(\\?|\\!)?",r:0},{cN:"inheritance",b:"<\\s*",c:[{cN:"parent",b:"("+e.IR+"::)?"+e.IR}]}].concat(k)},h,{cN:"constant",b:"(::)?(\\b[A-Z]\\w*(::)?)+",r:0},{cN:"symbol",b:":",c:b.concat([{b:j}]),r:0},{cN:"symbol",b:a+":",r:0},{cN:"number",b:"(\\b0[0-7_]+)|(\\b0x[0-9a-fA-F_]+)|(\\b[1-9][0-9_]*(\\.[0-9_]+)?)|[0_]\\b",r:0},{cN:"number",b:"\\?\\w"},{cN:"variable",b:"(\\$\\W)|((\\$|\\@\\@?)(\\w+))"},{b:"("+e.RSR+")\\s*",c:k.concat([{cN:"regexp",b:"/",e:"/[a-z]*",i:"\\n",c:[e.BE,d]}]),r:0}]));d.c=f;h.c[1].c=f;return{l:a,k:g,c:f}}(hljs);hljs.LANGUAGES.javascript=function(a){return{k:{keyword:"in if for while finally var new function do return void else break catch instanceof with throw case default try this switch continue typeof delete let yield const",literal:"true false null undefined NaN Infinity"},c:[a.ASM,a.QSM,a.CLCM,a.CBLCLM,a.CNM,{b:"("+a.RSR+"|\\b(case|return|throw)\\b)\\s*",k:"return throw case",c:[a.CLCM,a.CBLCLM,{cN:"regexp",b:"/",e:"/[gim]*",i:"\\n",c:[{b:"\\\\/"}]},{b:"<",e:">;",sL:"xml"}],r:0},{cN:"function",bWK:true,e:"{",k:"function",c:[{cN:"title",b:"[A-Za-z$_][0-9A-Za-z$_]*"},{cN:"params",b:"\\(",e:"\\)",c:[a.CLCM,a.CBLCLM],i:"[\"'\\(]"}],i:"\\[|%"}]}}(hljs);hljs.LANGUAGES.css=function(a){var b={cN:"function",b:a.IR+"\\(",e:"\\)",c:[a.NM,a.ASM,a.QSM]};return{cI:true,i:"[=/|']",c:[a.CBLCLM,{cN:"id",b:"\\#[A-Za-z0-9_-]+"},{cN:"class",b:"\\.[A-Za-z0-9_-]+",r:0},{cN:"attr_selector",b:"\\[",e:"\\]",i:"$"},{cN:"pseudo",b:":(:)?[a-zA-Z0-9\\_\\-\\+\\(\\)\\\"\\']+"},{cN:"at_rule",b:"@(font-face|page)",l:"[a-z-]+",k:"font-face page"},{cN:"at_rule",b:"@",e:"[{;]",eE:true,k:"import page media charset",c:[b,a.ASM,a.QSM,a.NM]},{cN:"tag",b:a.IR,r:0},{cN:"rules",b:"{",e:"}",i:"[^\\s]",r:0,c:[a.CBLCLM,{cN:"rule",b:"[^\\s]",rB:true,e:";",eW:true,c:[{cN:"attribute",b:"[A-Z\\_\\.\\-]+",e:":",eE:true,i:"[^\\s]",starts:{cN:"value",eW:true,eE:true,c:[b,a.NM,a.QSM,a.ASM,a.CBLCLM,{cN:"hexcolor",b:"\\#[0-9A-F]+"},{cN:"important",b:"!important"}]}}]}]}]}}(hljs);hljs.LANGUAGES.xml=function(a){var c="[A-Za-z0-9\\._:-]+";var b={eW:true,c:[{cN:"attribute",b:c,r:0},{b:'="',rB:true,e:'"',c:[{cN:"value",b:'"',eW:true}]},{b:"='",rB:true,e:"'",c:[{cN:"value",b:"'",eW:true}]},{b:"=",c:[{cN:"value",b:"[^\\s/>]+"}]}]};return{cI:true,c:[{cN:"pi",b:"<\\?",e:"\\?>",r:10},{cN:"doctype",b:"<!DOCTYPE",e:">",r:10,c:[{b:"\\[",e:"\\]"}]},{cN:"comment",b:"<!--",e:"-->",r:10},{cN:"cdata",b:"<\\!\\[CDATA\\[",e:"\\]\\]>",r:10},{cN:"tag",b:"<style(?=\\s|>|$)",e:">",k:{title:"style"},c:[b],starts:{e:"</style>",rE:true,sL:"css"}},{cN:"tag",b:"<script(?=\\s|>|$)",e:">",k:{title:"script"},c:[b],starts:{e:"<\/script>",rE:true,sL:"javascript"}},{b:"<%",e:"%>",sL:"vbscript"},{cN:"tag",b:"</?",e:"/?>",c:[{cN:"title",b:"[^ />]+"},b]}]}}(hljs);hljs.LANGUAGES.coffeescript=function(c){var b={keyword:"in if for while finally new do return else break catch instanceof throw try this switch continue typeof delete debugger super then unless until loop of by when and or is isnt not",literal:"true false null undefined yes no on off ",reserved:"case default function var void with const let enum export import native __hasProp __extends __slice __bind __indexOf"};var a="[A-Za-z$_][0-9A-Za-z$_]*";var e={cN:"title",b:a};var d={cN:"subst",b:"#\\{",e:"}",k:b,c:[c.BNM,c.CNM]};return{k:b,c:[c.BNM,c.CNM,c.ASM,{cN:"string",b:'"""',e:'"""',c:[c.BE,d]},{cN:"string",b:'"',e:'"',c:[c.BE,d],r:0},{cN:"comment",b:"###",e:"###"},c.HCM,{cN:"regexp",b:"///",e:"///",c:[c.HCM]},{cN:"regexp",b:"//[gim]*"},{cN:"regexp",b:"/\\S(\\\\.|[^\\n])*/[gim]*"},{b:"`",e:"`",eB:true,eE:true,sL:"javascript"},{cN:"function",b:a+"\\s*=\\s*(\\(.+\\))?\\s*[-=]>",rB:true,c:[e,{cN:"params",b:"\\(",e:"\\)"}]},{cN:"class",bWK:true,k:"class",e:"$",i:":",c:[{bWK:true,k:"extends",eW:true,i:":",c:[e]},e]},{cN:"property",b:"@"+a}]}}(hljs);hljs.LANGUAGES.json=function(a){var e={literal:"true false null"};var d=[a.QSM,a.CNM];var c={cN:"value",e:",",eW:true,eE:true,c:d,k:e};var b={b:"{",e:"}",c:[{cN:"attribute",b:'\\s*"',e:'"\\s*:\\s*',eB:true,eE:true,c:[a.BE],i:"\\n",starts:c}],i:"\\S"};var f={b:"\\[",e:"\\]",c:[a.inherit(c,{cN:null})],i:"\\S"};d.splice(d.length,0,b,f);return{c:d,k:e,i:"\\S"}}(hljs);
2 | 


--------------------------------------------------------------------------------
/gulpfile.js:
--------------------------------------------------------------------------------
 1 | pkg    = require('./package.json')
 2 | argv   = require('minimist')(process.argv.slice(2))
 3 | 
 4 | gulp   = require('gulp')
 5 | util   = require('gulp-util')
 6 | coffee = require('gulp-coffee')
 7 | header = require('gulp-header')
 8 | concat = require('gulp-concat')
 9 | uglify = require('gulp-uglify')
10 | bump   = require('gulp-bump')
11 | mocha  = require('gulp-mocha-phantomjs')
12 | 
13 | source = [
14 |   'src/rivets.coffee',
15 |   'src/util.coffee',
16 |   'src/parsers.coffee',
17 |   'src/observer.coffee',
18 |   'src/view.coffee',
19 |   'src/bindings.coffee',
20 |   'src/binders.coffee',
21 |   'src/formatters.coffee',
22 |   'src/adapter.coffee',
23 |   'src/export.coffee'
24 | ]
25 | 
26 | manifests = [
27 |   './package.json',
28 |   './bower.json',
29 |   './component.json'
30 | ]
31 | 
32 | banner = function(bundled) {
33 |   return [
34 |     '// Rivets.js' + (bundled ? ' + Sightglass.js' : ''),
35 |     '// version: ' + pkg.version,
36 |     '// author: ' + pkg.author,
37 |     '// license: ' + pkg.licenses[0].type
38 |   ].join('\n') + '\n'
39 | }
40 | 
41 | gulp.task('build', function() {
42 |   rivets = gulp.src(source)
43 |     .pipe(concat('rivets.js'))
44 |     .pipe(coffee().on('error', util.log))
45 |     .pipe(header(banner()))
46 |     .pipe(gulp.dest('dist'))
47 | 
48 |   rivetsMin = rivets.pipe(concat('rivets.min.js'))
49 |     .pipe(uglify())
50 |     .pipe(header(banner()))
51 |     .pipe(gulp.dest('dist'))
52 | 
53 |   rivets.on('end', function() {
54 |     sightglass = 'node_modules/sightglass/index.js'
55 |     rivets = 'dist/rivets.js'
56 | 
57 |     gulp.src([sightglass, rivets])
58 |       .pipe(uglify())
59 |       .pipe(concat('rivets.bundled.min.js'))
60 |       .pipe(header(banner(true)))
61 |       .pipe(gulp.dest('dist'))
62 |   })
63 | })
64 | 
65 | gulp.task('spec', function() {
66 |   gulp.src('spec/runner.html')
67 |     .pipe(mocha({reporter: 'dot'}))
68 | })
69 | 
70 | gulp.task('bump', function() {
71 |   gulp.src(manifests)
72 |     .pipe(bump({type: argv.t, version: argv.v}))
73 |     .pipe(gulp.dest('./'))
74 | })
75 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "rivets",
 3 |   "description": "Declarative data binding + templating solution.",
 4 |   "version": "0.9.6",
 5 |   "author": "Michael Richards",
 6 |   "url": "http://rivetsjs.com",
 7 |   "main": "./dist/rivets.js",
 8 |   "licenses": [
 9 |     {
10 |       "type": "MIT",
11 |       "url": "https://github.com/mikeric/rivets/blob/master/LICENSE"
12 |     }
13 |   ],
14 |   "repository": {
15 |     "type": "git",
16 |     "url": "https://github.com/mikeric/rivets.git"
17 |   },
18 |   "dependencies": {
19 |     "sightglass": "~0.2.4"
20 |   },
21 |   "scripts": {
22 |     "test": "gulp spec",
23 |     "build": "gulp build",
24 |     "bump": "gulp bump",
25 |     "upgrade": "npm run build && npm test && npm run bump && npm run build"
26 |   },
27 |   "devDependencies": {
28 |     "mocha": "~1.20.1",
29 |     "should": "~4.0.4",
30 |     "sinon": "~1.10.2",
31 |     "minimist": "~1.1.0",
32 |     "gulp": "~3.8.7",
33 |     "gulp-util": "~2.2.14",
34 |     "gulp-coffee": "~1.4.3",
35 |     "gulp-header": "~1.0.2",
36 |     "gulp-concat": "~2.2.0",
37 |     "gulp-uglify": "~0.3.0",
38 |     "gulp-bump": "~0.1.11",
39 |     "gulp-mocha-phantomjs": "~0.2.0"
40 |   }
41 | }
42 | 


--------------------------------------------------------------------------------
/spec/lib/mock.data.js:
--------------------------------------------------------------------------------
 1 | function Data(attributes) {
 2 |   this.attributes = attributes || {};
 3 |   this.change = {}
 4 | }
 5 | 
 6 | Data.prototype.on = function(key, callback) {
 7 |   if(this.hasCallback(key, callback))
 8 |     return;
 9 |   var ref = this.change[key] || (this.change[key] = []);
10 |   this.change[key].push(callback);
11 | }
12 | 
13 | Data.prototype.hasCallback = function(key, callback) {
14 |   return indexOf(this.change[key], callback) !== -1;
15 | }
16 | 
17 | indexOf = function(array, value) {
18 |   array || (array = [])
19 |   if(array.indexOf)
20 |     return array.indexOf(value);
21 | 
22 |   for(i in array || {}) {
23 |     if(array[i] === value)
24 |       return i;
25 |   }
26 |   return -1;
27 | }
28 | 
29 | Data.prototype.off = function(key, callback) {
30 |   var index = indexOf(this.change[key], callback);
31 |   if(index !== -1)
32 |     this.change[key].splice(index, 1);
33 | }
34 | 
35 | Data.prototype.set = function(attributes) {
36 |   var old, key;
37 | 
38 |   for(key in attributes) {
39 |     old = this.attributes[key];
40 |     this.attributes[key] = attributes[key];
41 |     if(this.get(key) !== old)
42 |       this.alertCallbacks(key);
43 |   }
44 | }
45 | 
46 | Data.prototype.get = function(key) {
47 |   return this.attributes[key];
48 | }
49 | 
50 | Data.prototype.alertCallbacks = function(key) {
51 |   if(!this.change[key])
52 |     return;
53 | 
54 |   var key, callbacks;
55 |   for(i in this.change[key]) {
56 |     this.change[key][i](this.get(key));
57 |   }
58 | }
59 | 
60 | window.Data = Data;
61 | 


--------------------------------------------------------------------------------
/spec/rivets/binders.js:
--------------------------------------------------------------------------------
  1 | describe("Rivets.binders", function() {
  2 |   var context
  3 | 
  4 |   beforeEach(function() {
  5 |     context = {
  6 |       publish: function() {}
  7 |     }
  8 |   })
  9 | 
 10 |   describe("value", function() {
 11 |     var el
 12 | 
 13 |     beforeEach(function() {
 14 |       el = document.createElement('input')
 15 |     })
 16 | 
 17 |     it("unbinds the same bound function", function() {
 18 |       var boundFn
 19 | 
 20 |       sinon.stub(el, 'addEventListener', function(event, fn) {
 21 |         boundFn = fn
 22 |       })
 23 | 
 24 |       rivets.binders.value.bind.call(context, el)
 25 | 
 26 |       sinon.stub(el, 'removeEventListener', function(event, fn) {
 27 |         fn.should.equal(boundFn)
 28 |       })
 29 | 
 30 |       rivets.binders.value.unbind.call(context, el)
 31 |     })
 32 |   })
 33 | 
 34 |   describe("each-*", function() {
 35 |     var fragment;
 36 |     var el;
 37 |     var model;
 38 | 
 39 |     beforeEach(function() {
 40 |       fragment = document.createDocumentFragment();
 41 |       el = document.createElement("li");
 42 |       el.setAttribute("rv-each-item", "items");
 43 |       el.setAttribute("rv-text", "item.val");
 44 | 
 45 |       fragment.appendChild(el);
 46 | 
 47 |       model = { items: [{val: 0},{val: 1},{val: 2}] };
 48 |     });
 49 | 
 50 |     it("binds to the model creating a list item for each element in items", function() {
 51 |       var view = rivets.bind(fragment, model);
 52 | 
 53 |       // one child for each element in the model plus 1 for the comment placeholder
 54 |       Should(fragment.childNodes.length).be.exactly(model.items.length + 1);
 55 |     });
 56 | 
 57 |     it("reflects changes to the model into the DOM", function() {
 58 |       var view = rivets.bind(fragment, model);
 59 |       Should(fragment.childNodes[1].textContent).be.exactly("0");
 60 | 
 61 |       model.items[0].val = "howdy";
 62 |       Should(fragment.childNodes[1].textContent).be.exactly("howdy");
 63 |     });
 64 | 
 65 |     it("reflects changes to the model into the DOM after unbind/bind", function() {
 66 |       var view = rivets.bind(fragment, model);
 67 |       Should(fragment.childNodes[1].textContent).be.exactly("0");
 68 | 
 69 |       view.unbind();
 70 |       view.bind();
 71 |       model.items[0].val = "howdy";
 72 |       Should(fragment.childNodes[1].textContent).be.exactly("howdy");
 73 |     });
 74 | 
 75 |     it("lets you push an item", function() {
 76 |       var view = rivets.bind(fragment, model);
 77 |       var originalLength  = model.items.length;
 78 | 
 79 |       // one child for each element in the model plus 1 for the comment placeholder
 80 |       Should(fragment.childNodes.length).be.exactly(model.items.length + 1);
 81 | 
 82 |       model.items.push({val: 3});
 83 |       Should(model.items.length).be.exactly(originalLength + 1);
 84 |       Should(fragment.childNodes.length).be.exactly(model.items.length + 1);
 85 |     });
 86 | 
 87 |     it("lets you push an item after unbind/bind", function() {
 88 |       var view = rivets.bind(fragment, model);
 89 |       var originalLength  = model.items.length;
 90 | 
 91 |       // one child for each element in the model plus 1 for the comment placeholder
 92 |       Should(fragment.childNodes.length).be.exactly(model.items.length + 1);
 93 | 
 94 |       view.unbind();
 95 |       view.bind();
 96 | 
 97 |       model.items.push({val: 3});
 98 |       Should(model.items.length).be.exactly(originalLength + 1);
 99 |       Should(fragment.childNodes.length).be.exactly(model.items.length + 1);
100 |     });
101 |   });
102 | 
103 |   describe("nested-each-*", function() {
104 |     var fragment;
105 |     var el;
106 |     var nestedEl;
107 |     var model;
108 | 
109 |     beforeEach(function() {
110 |       fragment = document.createDocumentFragment();
111 |       el = document.createElement("span");
112 |       el.setAttribute("rv-each-item", "items");
113 |       nestedEl = document.createElement("span");
114 |       nestedEl.setAttribute("rv-each-nested", "item.val");
115 |       nestedEl.textContent = "{%item%}-{%nested%}";
116 |       el.appendChild(nestedEl);
117 |       fragment.appendChild(el);
118 | 
119 |       model = { items: [{val: [{val: 0},{val: 1}]},{val: [{val: 2},{val: 3}]},{val: [{val: 4},{val: 5}]}] };
120 |     });
121 | 
122 |     it("lets you get all the indexes", function() {
123 |       var view = rivets.bind(el, model);
124 | 
125 |       Should(fragment.childNodes[1].childNodes[1].textContent).be.exactly('0-0');
126 |       Should(fragment.childNodes[1].childNodes[2].textContent).be.exactly('0-1');
127 |       Should(fragment.childNodes[2].childNodes[2].textContent).be.exactly('1-1');
128 |     });
129 |   });
130 | 
131 |   describe("if", function() {
132 |     var fragment;
133 |     var el;
134 |     var model;
135 | 
136 |     beforeEach(function() {
137 |       fragment = document.createDocumentFragment();
138 |       el = document.createElement("div");
139 |       el.setAttribute("rv-if", "data.show");
140 |       el.innerHTML = "{ data.count }";
141 | 
142 |       fragment.appendChild(el);
143 | 
144 |       model = { data: {
145 |         show: true,
146 |         count: 1
147 |       } };
148 |     });
149 | 
150 |     it("shows element with bound key inside if the value is true", function() {
151 |       var view = rivets.bind(fragment, model);
152 | 
153 |       // one child for the original div plus 1 for the comment placeholder
154 |       Should(fragment.childNodes.length).be.exactly(2);
155 |       Should(fragment.childNodes[1].innerHTML).be.exactly("1");
156 |     });
157 | 
158 |     it("hides if the value is false", function() {
159 |       var view = rivets.bind(fragment, model);
160 | 
161 |       model.data.show = false;
162 | 
163 |       // 1 for the comment placeholder
164 |       Should(fragment.childNodes.length).be.exactly(1);
165 |     });
166 | 
167 |     it("keeps binding when element becomes visible again", function() {
168 |       var view = rivets.bind(fragment, model);
169 | 
170 |       model.data.show = false;
171 |       model.data.count = 2;
172 |       model.data.show = true;
173 | 
174 |       // one child for the original div plus 1 for the comment placeholder
175 |       Should(fragment.childNodes.length).be.exactly(2);
176 |       Should(fragment.childNodes[1].innerHTML).be.exactly("2");
177 |     });
178 | 
179 |     it("hides if the value is falsey - zero", function() {
180 |       var view = rivets.bind(fragment, model);
181 | 
182 |       model.data.show = 0;
183 |       // 1 for the comment placeholder
184 |       Should(fragment.childNodes.length).be.exactly(1);
185 |     });
186 | 
187 |     it("hides if the value is falsey - empty string", function() {
188 |       var view = rivets.bind(fragment, model);
189 | 
190 |       model.data.show = "";
191 |       // 1 for the comment placeholder
192 |       Should(fragment.childNodes.length).be.exactly(1);
193 |     });
194 | 
195 |     it("hides if the value is falsey - undefined", function() {
196 |       var view = rivets.bind(fragment, model);
197 | 
198 |       model.data.show = undefined;
199 |       // 1 for the comment placeholder
200 |       Should(fragment.childNodes.length).be.exactly(1);
201 |     });
202 | 
203 |     it("rebindes nested if", function() {
204 |       var nestedEl = document.createElement("div")
205 |       nestedEl.setAttribute("rv-if", "data.showNested");
206 |       nestedEl.innerHTML = "{ data.countNested }";
207 |       el.appendChild(nestedEl);
208 | 
209 |       var view = rivets.bind(fragment, model);
210 | 
211 |       model.data.countNested = "1";
212 |       model.data.showNested = true;
213 |       Should(nestedEl.innerHTML).be.exactly("1");
214 |       model.data.show = false;
215 |       model.data.show = true;
216 |       model.data.countNested = "42";
217 | 
218 |       Should(nestedEl.innerHTML).be.exactly("42");
219 |     });
220 | 
221 |     it("does not throw when root scope is reset", function () {
222 |       el.setAttribute('rv-if', 'scope.error.errors');
223 |       el.innerHTML = '<div>{scope.error.errors.email}</div>';
224 |       model = {
225 |         scope: {
226 |           error: {
227 |             errors: {
228 |               email: 'not a valid address'
229 |             }
230 |           }
231 |         }
232 |       };
233 |       var view = rivets.bind(el, model);
234 |       (function(){
235 |         model.scope.error = {};
236 |       }).should.not.throw();
237 |     })
238 |   });
239 |  
240 |   describe("Custom binder with no attribute value", function() {
241 |     rivets.binders["custom-binder"] = function(el, value) {
242 |       el.innerHTML = "received " + value;
243 |     };
244 |     beforeEach(function() {
245 |       fragment = document.createDocumentFragment();
246 |       el = document.createElement("div");
247 | 
248 |       fragment.appendChild(el);
249 | 
250 |       model = {};
251 |     });
252 | 
253 |     it("receives undefined when html attribute is not specified", function() {
254 |       el.innerHTML = "<div rv-custom-binder></div>";
255 |       var view = rivets.bind(fragment, model);
256 |       Should(el.children[0].innerHTML).be.exactly('received undefined');
257 |     });
258 |     it("receives undefined when html attribute is not specified", function() {
259 |       el.innerHTML = "<div rv-custom-binder=''></div>";
260 |       var view = rivets.bind(fragment, model);
261 |       Should(el.children[0].innerHTML).be.exactly('received undefined');
262 |     });
263 |   });
264 | 
265 |   describe('Array observe and unobserve', function() {
266 |     var fragment;
267 |     var el1;
268 |     var elEach;
269 |     var el2;
270 |     var el3;
271 |     var model;
272 | 
273 |     beforeEach(function() {
274 |       /*
275 |         DOM for test
276 |         <div>
277 |           <div rv-if="scope.visible">
278 |             <div>
279 |               <div rv-each-item="scope.items">{item.data}</div>
280 |             </div>
281 |           </div>
282 |           <div>
283 |             <div rv-each-item="scope.items">{item.data}</div>
284 |           </div>
285 |         </div>
286 |       */
287 |       fragment = document.createElement("div");
288 |       el1 = document.createElement("div");
289 |       el1.setAttribute("rv-if", "scope.visible");
290 |       el2 = document.createElement("div");
291 |       elEach = document.createElement("div");
292 |       elEach.setAttribute('rv-each-item', 'scope.items');
293 |       elEach.innerHTML = '{item.data}';
294 |       el2.appendChild(elEach);
295 |       el1.appendChild(el2);
296 |       el3 = document.createElement("div");
297 |       elEach = document.createElement("div");
298 |       elEach.setAttribute('rv-each-item', 'scope.items');
299 |       elEach.innerHTML = '{item.data}';
300 |       el3.appendChild(elEach);
301 |       fragment.appendChild(el1);
302 |       fragment.appendChild(el3);
303 | 
304 |       model = { scope: {items: [], visible:true }};
305 |     });
306 | 
307 |     it('observes array changes after another array binding is unbound', function() {
308 |       var view = rivets.bind(fragment, model);
309 |       model.scope.items.push({data:"data"});
310 |       Should(el3.childNodes.length).be.exactly(2);
311 |       model.scope.items.push({data:"data"});
312 |       Should(el3.childNodes.length).be.exactly(3);
313 |       model.scope.visible = false;
314 |       model.scope.items.push({data:"data"});
315 |       Should(el3.childNodes.length).be.exactly(4);
316 |     });
317 |   });
318 | });
319 | 


--------------------------------------------------------------------------------
/spec/rivets/binding.js:
--------------------------------------------------------------------------------
  1 | describe('Rivets.Binding', function() {
  2 |   var model, el, view, binding, opts, originalPrefix
  3 | 
  4 |   beforeEach(function() {
  5 |     originalPrefix = rivets.prefix
  6 |     rivets.prefix = 'data'
  7 |     adapter = rivets.adapters['.']
  8 | 
  9 |     el = document.createElement('div')
 10 |     el.setAttribute('data-text', 'obj.name')
 11 | 
 12 |     view = rivets.bind(el, {obj: {name: 'test'}})
 13 |     binding = view.bindings[0]
 14 |     model = binding.model
 15 |   })
 16 | 
 17 |   afterEach(function() {
 18 |     rivets.prefix = originalPrefix
 19 |   })
 20 | 
 21 |   it('gets assigned the proper binder routine matching the identifier', function() {
 22 |     binding.binder.routine.should.equal(rivets.binders.text)
 23 |   })
 24 | 
 25 |   describe('with formatters', function() {
 26 |     it('register all formatters', function() {
 27 | 
 28 |       valueInput = document.createElement('input')
 29 |       valueInput.setAttribute('type','text')
 30 |       valueInput.setAttribute('data-value', "obj.name | awesome | radical | totally")
 31 | 
 32 |       view = rivets.bind(valueInput, {obj: { name: 'nothing' }})
 33 |       binding = view.bindings[0]
 34 | 
 35 |       binding.formatters.should.be.eql(['awesome', 'radical', 'totally'])
 36 |     })
 37 | 
 38 |     it('allows arguments with pipes', function () {
 39 | 
 40 |       valueInput = document.createElement('input')
 41 |       valueInput.setAttribute('type', 'text')
 42 |       valueInput.setAttribute('data-value', "obj.name | awesome | totally 'arg | with || pipes' 'and more args' | and 'others formatters' with 'pi||pes'")
 43 | 
 44 |       view = rivets.bind(valueInput, { obj: { name: 'nothing' } })
 45 |       binding = view.bindings[0]
 46 | 
 47 |       binding.formatters.should.be.eql(['awesome', "totally 'arg | with || pipes' 'and more args'", "and 'others formatters' with 'pi||pes'"])
 48 |     })
 49 |   })
 50 | 
 51 |   describe('bind()', function() {
 52 |     it('subscribes to the model for changes via the adapter', function() {
 53 |       sinon.spy(adapter, 'observe')
 54 |       binding.bind()
 55 |       adapter.observe.calledWith(model, 'name', binding.sync).should.be.true
 56 |     })
 57 | 
 58 |     it("calls the binder's bind method if one exists", function() {
 59 |       binding.bind.should.not.throw()
 60 | 
 61 |       binding.binder.bind = function(){}
 62 |       sinon.spy(binding.binder, 'bind')
 63 |       binding.bind()
 64 |       binding.binder.bind.called.should.be.true
 65 |     })
 66 | 
 67 |     describe('with preloadData set to true', function() {
 68 |       beforeEach(function() {
 69 |         rivets.preloadData = true
 70 |       })
 71 | 
 72 |       it('sets the initial value', function() {
 73 |         sinon.spy(binding, 'set')
 74 |         binding.bind()
 75 |         binding.set.calledWith('test').should.be.true
 76 |       })
 77 |     })
 78 | 
 79 |     describe('with dependencies', function() {
 80 |       beforeEach(function() {
 81 |         binding.options.dependencies = ['.fname', '.lname']
 82 |       })
 83 | 
 84 |       it('sets up observers on the dependant attributes', function() {
 85 |         binding.bind()
 86 |         adapter.observe.calledWith(model, 'fname', binding.sync).should.be.true
 87 |         adapter.observe.calledWith(model, 'lname', binding.sync).should.be.true
 88 |       })
 89 |     })
 90 |   })
 91 | 
 92 |   describe('unbind()', function() {
 93 |     describe('without a binder.unbind defined', function() {
 94 |       it('should not throw an error', function() {
 95 |         binding.unbind.should.not.throw()
 96 |       })
 97 |     })
 98 | 
 99 |     describe('with a binder.unbind defined', function() {
100 |       beforeEach(function() {
101 |         binding.binder.unbind = function(){}
102 |       })
103 | 
104 |       it('should not throw an error', function() {
105 |         binding.unbind.should.not.throw()
106 |       })
107 | 
108 |       it("calls the binder's unbind method", function() {
109 |         sinon.spy(binding.binder, 'unbind')
110 |         binding.unbind()
111 |         binding.binder.unbind.called.should.be.true
112 |       })
113 |     })
114 |   })
115 | 
116 |   describe('set()', function() {
117 |     it('performs the binding routine with the supplied value', function() {
118 |       sinon.spy(binding.binder, 'routine')
119 |       binding.set('sweater')
120 |       binding.binder.routine.calledWith(el, 'sweater').should.be.true
121 |     })
122 | 
123 |     it('applies any formatters to the value before performing the routine', function() {
124 |       view.formatters.awesome = function(value) { return 'awesome ' + value }
125 | 
126 |       binding.formatters.push('awesome')
127 |       sinon.spy(binding.binder, 'routine')
128 |       binding.set('sweater')
129 |       binding.binder.routine.calledWith(el, 'awesome sweater').should.be.true
130 |     })
131 |   })
132 | 
133 |   describe('functions in bindings', function() {
134 |     it('does not call methods by default', function() {
135 |       sinon.spy(binding.binder, 'routine')
136 |       var fn = function() {};
137 |       binding.set(fn)
138 |       binding.binder.routine.calledWith(el, fn).should.be.true
139 |     })
140 | 
141 |     it('does call methods with model if backward compatibility is set', function() {
142 |       rivets.configure({
143 |         executeFunctions:true
144 |       })
145 |       binding.model = {foo: 'bar'}
146 |       sinon.spy(binding.binder, 'routine')
147 |       binding.set(function() { return this.foo })
148 |       binding.binder.routine.calledWith(el, binding.model.foo).should.be.true
149 |       // Back to default !!
150 |       rivets.configure({
151 |         executeFunctions:false
152 |       })
153 |     })
154 |   })
155 |   
156 |   describe('prototype functions', function() {
157 |     it('does call routine if observed value is a function', function() {
158 |       rivets.configure({
159 |         executeFunctions:true
160 |       })
161 |       var Employee = function(name) {
162 |         this.name = name
163 |       }
164 |       Employee.prototype.getName = function() {
165 |         return this.name;
166 |       }
167 |       var model = {employee: new Employee("John")}
168 | 
169 |       el = document.createElement('div')
170 |       el.setAttribute('data-text', 'employee.getName')
171 | 
172 |       view = rivets.bind(el, model)
173 |       binding = view.bindings[0]
174 | 
175 |       sinon.spy(binding.binder, 'routine')
176 |       model.employee = new Employee("Peter")
177 |       binding.binder.routine.calledWith(el, "Peter").should.be.true
178 |       // Back to default !!
179 |       rivets.configure({
180 |         executeFunctions:false
181 |       })
182 |     })
183 |   })
184 |   describe('publish()', function() {
185 |     it("should publish the value of a number input", function() {
186 |       numberInput = document.createElement('input')
187 |       numberInput.setAttribute('type', 'number')
188 |       numberInput.setAttribute('data-value', 'obj.num')
189 | 
190 |       view = rivets.bind(numberInput, {obj: {num: 42}})
191 |       binding = view.bindings[0]
192 |       model = binding.model
193 | 
194 |       numberInput.value = 42
195 | 
196 |       sinon.spy(adapter, 'set')
197 |       binding.publish({target: numberInput})
198 |       adapter.set.calledWith(model, 'num', '42').should.be.true
199 |     })
200 |   })
201 | 
202 |   describe('publishTwoWay()', function() {
203 |     it('applies a two-way read formatter to function same as a single-way', function() {
204 |       view.formatters.awesome = {
205 |         read: function(value) { return 'awesome ' + value }
206 |       }
207 | 
208 |       binding.formatters.push('awesome')
209 |       sinon.spy(binding.binder, 'routine')
210 |       binding.set('sweater')
211 |       binding.binder.routine.calledWith(el, 'awesome sweater').should.be.true
212 |     })
213 | 
214 |     it("should publish the value of a number input", function() {
215 |       rivets.formatters.awesome = {
216 |         publish: function(value) { return 'awesome ' + value }
217 |       }
218 | 
219 |       numberInput = document.createElement('input')
220 |       numberInput.setAttribute('type', 'number')
221 |       numberInput.setAttribute('data-value', 'obj.num | awesome')
222 | 
223 |       view = rivets.bind(numberInput, {obj: {num: 42}})
224 |       binding = view.bindings[0]
225 |       model = binding.model
226 | 
227 |       numberInput.value = 42
228 | 
229 |       binding.publish({target: numberInput})
230 |       adapter.set.calledWith(model, 'num', 'awesome 42').should.be.true
231 |     })
232 | 
233 |     it("should format a value in both directions", function() {
234 |       rivets.formatters.awesome = {
235 |         publish: function(value) { return 'awesome ' + value },
236 |         read: function(value) { return value + ' is awesome' }
237 |       }
238 | 
239 |       valueInput = document.createElement('input')
240 |       valueInput.setAttribute('type','text')
241 |       valueInput.setAttribute('data-value', 'obj.name | awesome')
242 | 
243 |       view = rivets.bind(valueInput, {obj: { name: 'nothing' }})
244 |       binding = view.bindings[0]
245 |       model = binding.model
246 | 
247 |       valueInput.value = 'charles'
248 |       binding.publish({target: valueInput})
249 |       adapter.set.calledWith(model, 'name', 'awesome charles').should.be.true
250 | 
251 |       sinon.spy(binding.binder, 'routine')
252 |       binding.set('fred')
253 |       binding.binder.routine.calledWith(valueInput, 'fred is awesome').should.be.true
254 |     })
255 | 
256 |     it("should resolve formatter arguments to their values", function() {
257 |       rivets.formatters.withArguments = {
258 |         publish: function(value, arg1, arg2) {
259 |           return value + ':' + arg1 + ':' + arg2
260 |         },
261 |         read: function(value, arg1, arg2) {
262 |           return value.replace(':' + arg1 + ':' + arg2, '')
263 |         }
264 |       }
265 | 
266 |       valueInput = document.createElement('input')
267 |       valueInput.setAttribute('type', 'text')
268 |       valueInput.setAttribute('data-value', "obj.name | withArguments config.age 'male'")
269 | 
270 |       view = rivets.bind(valueInput, {
271 |         obj: {
272 |           name: 'nothing'
273 |         },
274 |         config: {
275 |           age: 50
276 |         }
277 |       })
278 | 
279 |       binding = view.bindings[0]
280 |       model = binding.model
281 | 
282 |       valueInput.value = 'bobby'
283 |       binding.publish({target: valueInput})
284 |       adapter.set.calledWith(model, 'name', 'bobby:50:male').should.be.true
285 | 
286 |       valueInput.value.should.equal('bobby')
287 | 
288 |       binding.set('andy:50:male')
289 |       binding.binder.routine.calledWith(valueInput, 'andy').should.be.true
290 |     })
291 | 
292 |     it("should resolve formatter arguments correctly with multiple formatters", function() {
293 |       rivets.formatters.wrap = {
294 |         publish: function(value, arg1, arg2) {
295 |           return arg1 + value + arg2
296 |         },
297 |         read: function(value, arg1, arg2) {
298 |           return value.replace(arg1, '').replace(arg2, '')
299 |         }
300 |       }
301 | 
302 |       rivets.formatters.saveAsCase = {
303 |         publish: function(value, typeCase) {
304 |           return value['to' + typeCase + 'Case']()
305 |         },
306 |         read: function(value, typeCase) {
307 |           return value[typeCase === 'Upper' ? 'toLowerCase' : 'toUpperCase']()
308 |         }
309 |       }
310 | 
311 |       valueInput = document.createElement('input')
312 |       valueInput.setAttribute('type', 'text')
313 |       valueInput.setAttribute(
314 |         'data-value',
315 |         "obj.name | saveAsCase config.typeCase | wrap config.curly '}' | wrap config.square ']' | wrap config.paren ')'"
316 |       )
317 | 
318 |       view = rivets.bind(valueInput, {
319 |         obj: {
320 |           name: 'nothing'
321 |         },
322 |         config: {
323 |           paren: '(',
324 |           square: '[',
325 |           curly: '{',
326 |           typeCase: 'Upper'
327 |         }
328 |       })
329 | 
330 |       binding = view.bindings[0]
331 |       model = binding.model
332 | 
333 |       valueInput.value = 'bobby'
334 |       binding.publish({target: valueInput})
335 |       adapter.set.calledWith(model, 'name', '{[(BOBBY)]}').should.be.true
336 | 
337 |       valueInput.value.should.equal('bobby')
338 | 
339 |       binding.set('{[(ANDY)]}')
340 |       binding.binder.routine.calledWith(valueInput, 'andy').should.be.true
341 |     })
342 | 
343 |     it("should not fail or format if the specified binding function doesn't exist", function() {
344 |       rivets.formatters.awesome = { }
345 |       valueInput = document.createElement('input')
346 |       valueInput.setAttribute('type','text')
347 |       valueInput.setAttribute('data-value', 'obj.name | awesome')
348 | 
349 |       view = rivets.bind(valueInput, {obj: { name: 'nothing' }})
350 |       binding = view.bindings[0]
351 |       model = binding.model
352 | 
353 |       valueInput.value = 'charles'
354 |       binding.publish({target: valueInput})
355 |       adapter.set.calledWith(model, 'name', 'charles').should.be.true
356 | 
357 |       binding.set('fred')
358 |       binding.binder.routine.calledWith(valueInput, 'fred').should.be.true
359 |     })
360 | 
361 |     it("should apply read binders left to right, and publish binders right to left", function() {
362 |       rivets.formatters.totally = {
363 |         publish: function(value) { return value + ' totally' },
364 |         read: function(value) { return value + ' totally' }
365 |       }
366 | 
367 |       rivets.formatters.awesome = {
368 |         publish: function(value) { return value + ' is awesome' },
369 |         read: function(value) { return value + ' is awesome' }
370 |       }
371 | 
372 |       valueInput = document.createElement('input')
373 |       valueInput.setAttribute('type','text')
374 |       valueInput.setAttribute('data-value', 'obj.name | awesome | totally')
375 | 
376 |       view = rivets.bind(valueInput, {obj: { name: 'nothing' }})
377 |       binding = view.bindings[0]
378 |       model = binding.model
379 | 
380 |       binding.set('fred')
381 |       binding.binder.routine.calledWith(valueInput, 'fred is awesome totally').should.be.true
382 | 
383 |       valueInput.value = 'fred'
384 |       binding.publish({target: valueInput})
385 |       adapter.set.calledWith(model, 'name', 'fred totally is awesome').should.be.true
386 |     })
387 | 
388 |     it("binders in a chain should be skipped if they're not there", function() {
389 |       rivets.formatters.totally = {
390 |         publish: function(value) { return value + ' totally' },
391 |         read: function(value) { return value + ' totally' }
392 |       }
393 | 
394 |       rivets.formatters.radical = {
395 |         publish: function(value) { return value + ' is radical' },
396 |       }
397 | 
398 |       rivets.formatters.awesome = function(value) { return value + ' is awesome' }
399 | 
400 |       valueInput = document.createElement('input')
401 |       valueInput.setAttribute('type','text')
402 |       valueInput.setAttribute('data-value', 'obj.name | awesome | radical | totally')
403 | 
404 |       view = rivets.bind(valueInput, {obj: { name: 'nothing' }})
405 |       binding = view.bindings[0]
406 |       model = binding.model
407 | 
408 |       binding.set('fred')
409 |       binding.binder.routine.calledWith(valueInput, 'fred is awesome totally').should.be.true
410 | 
411 |       valueInput.value = 'fred'
412 |       binding.publish({target: valueInput})
413 |       adapter.set.calledWith(model, 'name', 'fred totally is radical').should.be.true
414 |     })
415 |   })
416 | 
417 |   describe('formattedValue()', function() {
418 |     it('applies the current formatters on the supplied value', function() {
419 |       view.formatters.awesome = function(value) { return 'awesome ' + value }
420 |       binding.formatters.push('awesome')
421 |       binding.formattedValue('hat').should.equal('awesome hat')
422 |     })
423 | 
424 |     describe('with a multi-argument formatter string', function() {
425 |       beforeEach(function() {
426 |         view.formatters.awesome = function(value, prefix) {
427 |           return prefix + ' awesome ' + value
428 |         }
429 | 
430 |         binding.formatters.push("awesome 'super'")
431 |       })
432 | 
433 |       it('applies the formatter with arguments', function() {
434 |         binding.formattedValue('jacket').should.equal('super awesome jacket')
435 |       })
436 |     })
437 | 
438 |     describe('with a formatter string with pipes in argument', function() {
439 |       beforeEach(function () {
440 | 
441 |         view.formatters.totally = function (value, prefix) {
442 |           return prefix + ' totally ' + value
443 |         }
444 | 
445 |         binding.formatters.push("totally 'arg | with || pipes'")
446 |       })
447 | 
448 |       it('applies the formatter with arguments with pipes', function () {
449 |         binding.formattedValue('jacket').should.equal('arg | with || pipes totally jacket')
450 |       })
451 |     })
452 |   })
453 | 
454 |   describe('getValue()', function() {
455 |     it('should use binder.getValue() if present', function() {
456 |       binding.binder.getValue = function(el) {
457 |         return 'foo'
458 |       }
459 | 
460 |       binding.getValue(el).should.equal('foo')
461 |     })
462 | 
463 |     it('binder.getValue() should have access to passed element', function() {
464 |       binding.binder.getValue = function(el) {
465 |         return el.dataset.foo
466 |       }
467 | 
468 |       el.dataset.foo = 'bar'
469 |       binding.getValue(el).should.equal('bar')
470 |     })
471 | 
472 |     it('binder.getValue() should have access to binding', function() {
473 |       binding.binder.getValue = function(el) {
474 |         return this.foo
475 |       }
476 | 
477 |       binding.foo = 'bar'
478 |       binding.getValue(el).should.equal('bar')
479 |     })
480 |   })
481 | })
482 | 


--------------------------------------------------------------------------------
/spec/rivets/component_binding.js:
--------------------------------------------------------------------------------
 1 | describe('Component binding', function() {
 2 |   var scope, element, component, componentRoot
 3 | 
 4 |   beforeEach(function() {
 5 |     element = document.createElement('div')
 6 |     element.innerHTML = '<test></test>'
 7 |     componentRoot = element.firstChild
 8 |     scope = { name: 'Rivets' }
 9 |     component = rivets.components.test = {
10 |       initialize: sinon.stub().returns(scope),
11 |       template: function() { return '' }
12 |     }
13 |   })
14 | 
15 |   it('renders "template" as a string', function() {
16 |     component.template = function() {return '<h1>test</h1>'}
17 |     rivets.bind(element)
18 | 
19 |     componentRoot.innerHTML.should.equal(component.template())
20 |   })
21 | 
22 |   it('binds binders on component root element only once', function() {
23 |     rivets.binders['test-binder'] = sinon.spy();
24 |     componentRoot.setAttribute('rv-test-binder', 'true');
25 |     rivets.bind(element);
26 | 
27 |     rivets.binders['test-binder'].calledOnce.should.be.true;
28 | 
29 |     delete rivets.binders['test-binder'];
30 |   })
31 | 
32 |   describe('initialize()', function() {
33 |     var locals
34 | 
35 |     beforeEach(function() {
36 |       locals = { object: { name: 'Rivets locals' } }
37 |       componentRoot.setAttribute('item', 'object')
38 |     })
39 | 
40 |     it('receives element as first argument and attributes as second', function() {
41 |       rivets.bind(element, locals)
42 | 
43 |       component.initialize.calledWith(componentRoot, { item: locals.object }).should.be.true
44 |     })
45 | 
46 |     it('receives primitives attributes', function() {
47 |       componentRoot.setAttribute('primitivestring', "'value'")
48 |       componentRoot.setAttribute('primitivenumber', "42")
49 |       componentRoot.setAttribute('primitiveboolean', "true")
50 |       rivets.bind(element, locals)
51 | 
52 |       component.initialize.calledWith(componentRoot, { item: locals.object,
53 |         primitivestring: 'value',
54 |         primitivenumber: 42,
55 |         primitiveboolean: true })
56 |       .should.be.true
57 |     })
58 | 
59 |     it('returns attributes assigned to "static" property as they are', function() {
60 |       var type = 'text'
61 | 
62 |       component.static = ['type']
63 |       componentRoot.setAttribute('type', type)
64 |       rivets.bind(element, locals)
65 | 
66 |       component.initialize.calledWith(componentRoot, { item: locals.object, type: type }).should.be.true
67 |     })
68 |   })
69 | 
70 |   describe('when "template" is a function', function() {
71 |     it('renders returned string as component template', function() {
72 |       component.template = sinon.stub().returns('<h1>{ name }</h1>')
73 |       rivets.bind(element)
74 | 
75 |       componentRoot.innerHTML.should.equal('<h1>' + scope.name + '</h1>')
76 |     })
77 |   })
78 | 
79 | })
80 | 


--------------------------------------------------------------------------------
/spec/rivets/formatters.js:
--------------------------------------------------------------------------------
 1 | describe("Rivets.formatters", function() {
 2 | 
 3 |   describe("call", function() {
 4 |     var model
 5 | 
 6 |     beforeEach(function() {
 7 |       model = {
 8 |         fn: function(arg1, arg2) {
 9 |           return '' + arg1 + arg2;
10 |         }
11 |       }
12 |     })
13 | 
14 |     it("calls function with arguments", function() {
15 |       rivets.formatters['call'](model.fn, 'foo', 'bar').should.equal('foobar')
16 |     })
17 | 
18 |     it("calls function with the model as context", function() {
19 |       model.obj = {
20 |         name: 'foo',
21 |         fn: function() {
22 |           return this.name;
23 |         }
24 |       }
25 |       var el = document.createElement('div')
26 |       el.setAttribute('rv-text', 'obj.fn | call')
27 |       rivets.bind(el, model)
28 |       el.innerText.should.equal('foo')
29 |     })
30 |   })
31 | });
32 | 


--------------------------------------------------------------------------------
/spec/rivets/functional.js:
--------------------------------------------------------------------------------
  1 | describe('Functional', function() {
  2 |   var data, bindData, el, input, originalPrefix
  3 | 
  4 |   beforeEach(function() {
  5 |     originalPrefix = rivets.prefix;
  6 |     rivets.prefix = 'data';
  7 |     adapter = {
  8 |       observe: function(obj, keypath, callback) {
  9 |         obj.on(keypath, callback)
 10 |       },
 11 |       unobserve: function(obj, keypath, callback) {
 12 |         obj.off(keypath, callback)
 13 |       },
 14 |       get: function(obj, keypath) {
 15 |         return obj.get(keypath)
 16 |       },
 17 |       set: function(obj, keypath, value) {
 18 |         attributes = {}
 19 |         attributes[keypath] = value
 20 |         obj.set(attributes)
 21 |       }
 22 |     }
 23 | 
 24 |     sightglass.adapters[':'] = adapter
 25 |     rivets.configure({preloadData: true})
 26 | 
 27 |     data = new Data({
 28 |       foo: 'bar',
 29 |       items: [{name: 'a'}, {name: 'b'}]
 30 |     })
 31 | 
 32 |     bindData = {data: data}
 33 | 
 34 |     el = document.createElement('div')
 35 |     input = document.createElement('input')
 36 |     input.setAttribute('type', 'text')
 37 |   })
 38 | 
 39 |   afterEach(function() {
 40 |     rivets.prefix = originalPrefix
 41 |   })
 42 | 
 43 |   describe('Adapter', function() {
 44 |     it('should read the initial value', function() {
 45 |       sinon.spy(data, 'get')
 46 |       el.setAttribute('data-text', 'data:foo')
 47 |       rivets.bind(el, bindData)
 48 |       data.get.calledWith('foo').should.be.true
 49 |     })
 50 | 
 51 |     it('should read the initial value unless preloadData is false', function() {
 52 |       rivets.configure({preloadData: false})
 53 |       sinon.spy(data, 'get')
 54 |       el.setAttribute('data-value', 'data:foo')
 55 |       rivets.bind(el, bindData)
 56 |       data.get.called.should.be.false
 57 |     })
 58 | 
 59 |     it('should subscribe to updates', function() {
 60 |       sinon.spy(data, 'on')
 61 |       el.setAttribute('data-value', 'data:foo')
 62 |       rivets.bind(el, bindData)
 63 |       data.on.called.should.be.true
 64 |     })
 65 |   })
 66 | 
 67 |   describe('Binds', function() {
 68 |     describe('Text', function() {
 69 |       it('should set the text content of the element', function() {
 70 |         el.setAttribute('data-text', 'data:foo')
 71 |         rivets.bind(el, bindData)
 72 |         el.textContent.should.equal(data.get('foo'))
 73 |       })
 74 | 
 75 |       it('should correctly handle HTML in the content', function() {
 76 |         el.setAttribute('data-text', 'data:foo')
 77 |         value = '<b>Fail</b>'
 78 |         data.set({foo: value})
 79 |         rivets.bind(el, bindData)
 80 |         el.textContent.should.equal(value)
 81 |       })
 82 |     })
 83 | 
 84 |     describe('HTML', function() {
 85 |       it('should set the html content of the element', function() {
 86 |         el.setAttribute('data-html', 'data:foo')
 87 |         rivets.bind(el, bindData)
 88 |         el.textContent.should.equal(data.get('foo'))
 89 |       })
 90 | 
 91 |       it('should correctly handle HTML in the content', function() {
 92 |         el.setAttribute('data-html', 'data:foo')
 93 |         value = '<b>Fail</b>'
 94 |         data.set({foo: value})
 95 |         rivets.bind(el, bindData)
 96 |         el.innerHTML.should.equal(value)
 97 |       })
 98 |     })
 99 | 
100 |     describe('Value', function() {
101 |       it('should set the value of the element', function() {
102 |         input.setAttribute('data-value', 'data:foo')
103 |         rivets.bind(input, bindData)
104 |         input.value.should.equal(data.get('foo'))
105 |       })
106 |     })
107 | 
108 |     describe('Multiple', function() {
109 |       it('should bind a list of multiple elements', function() {
110 |         el.setAttribute('data-html', 'data:foo')
111 |         input.setAttribute('data-value', 'data:foo')
112 |         rivets.bind([el, input], bindData)
113 |         el.textContent.should.equal(data.get('foo'))
114 |         input.value.should.equal(data.get('foo'))
115 |       })
116 |     })
117 | 
118 |     describe('Priority', function() {
119 |       beforeEach(function() {
120 |         rivets.binders.a = {bind: function(){}}
121 |         rivets.binders.b = {bind: function(){}}
122 | 
123 |         sinon.spy(rivets.binders.a, 'bind')
124 |         sinon.spy(rivets.binders.b, 'bind')
125 | 
126 |         el.setAttribute('data-a', 'data:foo')
127 |         el.setAttribute('data-b', 'data:foo')
128 |       })
129 | 
130 |       describe('a:10, b:30', function() {
131 |         beforeEach(function() {
132 |           rivets.binders.a.priority = 10
133 |           rivets.binders.b.priority = 30
134 |           rivets.bind(el, bindData)
135 |         })
136 | 
137 |         it('should bind b before a', function() {
138 |           rivets.binders.b.bind.calledBefore(rivets.binders.a.bind).should.be.true
139 |         })
140 |       })
141 | 
142 |       describe('a:5, b:2', function() {
143 |         beforeEach(function() {
144 |           rivets.binders.a.priority = 5
145 |           rivets.binders.b.priority = 2
146 |           rivets.bind(el, bindData)
147 |         })
148 | 
149 |         it('should bind a before b', function() {
150 |           rivets.binders.a.bind.calledBefore(rivets.binders.b.bind).should.be.true
151 |         })
152 |       })
153 | 
154 |       describe('a:undefined, b:1', function() {
155 |         beforeEach(function() {
156 |           rivets.binders.b.priority = 1
157 |           rivets.bind(el, bindData)
158 |         })
159 | 
160 |         it('should bind b before a', function() {
161 |           rivets.binders.b.bind.calledBefore(rivets.binders.a.bind).should.be.true
162 |         })
163 |       })
164 |     })
165 | 
166 |     describe('Iteration', function() {
167 |       beforeEach(function(){
168 |         list = document.createElement('ul')
169 |         el.appendChild(list)
170 |         listItem = document.createElement('li')
171 |         listItem.setAttribute('data-each-item', 'data:items')
172 |         list.appendChild(listItem)
173 |       })
174 | 
175 |       it('should loop over a collection and create new instances of that element + children', function() {
176 |         el.getElementsByTagName('li').length.should.equal(1)
177 |         rivets.bind(el, bindData)
178 |         el.getElementsByTagName('li').length.should.equal(2)
179 |       })
180 | 
181 |       it('should not fail if the collection being bound to is null', function() {
182 |         data.set({ items: null})
183 |         rivets.bind(el, bindData)
184 |         el.getElementsByTagName('li').length.should.equal(0)
185 |       })
186 | 
187 |       it('should re-loop over the collection and create new instances when the array changes', function() {
188 |         rivets.bind(el, bindData)
189 |         el.getElementsByTagName('li').length.should.equal(2)
190 | 
191 |         newItems = [{name: 'a'}, {name: 'b'}, {name: 'c'}]
192 |         data.set({items: newItems})
193 |         el.getElementsByTagName('li').length.should.equal(3)
194 |       })
195 | 
196 |       it('should allow binding to the iterated item as well as any parent contexts', function() {
197 |         span1 = document.createElement('span')
198 |         span1.setAttribute('data-text', 'item.name')
199 |         span2 = document.createElement('span')
200 |         span2.setAttribute('data-text', 'data:foo')
201 |         listItem.appendChild(span1)
202 |         listItem.appendChild(span2)
203 | 
204 |         rivets.bind(el, bindData)
205 |         el.getElementsByTagName('span')[0].textContent.should.equal('a')
206 |         el.getElementsByTagName('span')[1].textContent.should.equal('bar')
207 |       })
208 | 
209 |       it('should allow binding to the iterated element directly', function() {
210 |         listItem.setAttribute('data-text', 'item.name')
211 |         listItem.setAttribute('data-class', 'data:foo')
212 |         rivets.bind(el, bindData)
213 |         el.getElementsByTagName('li')[0].textContent.should.equal('a')
214 |         el.getElementsByTagName('li')[0].className.should.equal('bar')
215 |       })
216 | 
217 |       it('should insert items between any surrounding elements', function(){
218 |         firstItem = document.createElement('li')
219 |         lastItem = document.createElement('li')
220 |         firstItem.textContent = 'first'
221 |         lastItem.textContent = 'last'
222 |         list.appendChild(lastItem)
223 |         list.insertBefore(firstItem, listItem)
224 |         listItem.setAttribute('data-text', 'item.name')
225 | 
226 |         rivets.bind(el, bindData)
227 | 
228 |         el.getElementsByTagName('li')[0].textContent.should.equal('first')
229 |         el.getElementsByTagName('li')[1].textContent.should.equal('a')
230 |         el.getElementsByTagName('li')[2].textContent.should.equal('b')
231 |         el.getElementsByTagName('li')[3].textContent.should.equal('last')
232 |       })
233 | 
234 |       it('should allow binding to the iterated element index', function() {
235 |         listItem.setAttribute('data-index', 'index')
236 |         rivets.bind(el, bindData)
237 |         el.getElementsByTagName('li')[0].getAttribute('index').should.equal('0')
238 |         el.getElementsByTagName('li')[1].getAttribute('index').should.equal('1')
239 |       })
240 | 
241 |       it('should allow binding to the iterated element index by using the %item% syntax', function() {
242 |         listItem.setAttribute('data-index', '%item%')
243 |         rivets.bind(el, bindData)
244 |         el.getElementsByTagName('li')[0].getAttribute('index').should.equal('0')
245 |         el.getElementsByTagName('li')[1].getAttribute('index').should.equal('1')
246 |       })
247 | 
248 |       it('should allow the developer to configure the index attribute available in the iteration', function() {
249 |         rivets.configure({
250 |           iterationAlias : function(modelName) {
251 |             return modelName + 'Index';
252 |           }
253 |         });
254 | 
255 |         listItem.setAttribute('data-index', 'itemIndex')
256 |         rivets.bind(el, bindData)
257 |         el.getElementsByTagName('li')[0].getAttribute('index').should.equal('0')
258 |         el.getElementsByTagName('li')[1].getAttribute('index').should.equal('1')
259 |       })
260 |     })
261 |   })
262 | 
263 |   describe('Updates', function() {
264 |     it('should change the value', function() {
265 |       el.setAttribute('data-text', 'data:foo')
266 |       rivets.bind(el, bindData)
267 |       data.set({foo: 'some new value'})
268 |       el.textContent.should.equal(data.get('foo'))
269 |     })
270 |   })
271 | 
272 |   describe('Input', function() {
273 |     it('should update the model value', function() {
274 |       input.setAttribute('data-value', 'data:foo')
275 |       rivets.bind(input, bindData)
276 |       input.value = 'some new value'
277 |       var event = document.createEvent('HTMLEvents')
278 |       event.initEvent('input', true, true)
279 |       input.dispatchEvent(event)
280 |       input.value.should.equal(data.get('foo'))
281 |     })
282 |   })
283 | })
284 | 


--------------------------------------------------------------------------------
/spec/rivets/routines.js:
--------------------------------------------------------------------------------
  1 | describe('Routines', function() {
  2 |   var el, input, trueRadioInput, falseRadioInput, checkboxInput
  3 | 
  4 |   var createInputElement = function(type, value) {
  5 |     var elem = document.createElement('input')
  6 |     elem.setAttribute('type', type)
  7 |     if (value !== undefined) {
  8 |       elem.setAttribute('value', value)
  9 |     }
 10 |     document.body.appendChild(elem)
 11 |     return elem
 12 |   }
 13 | 
 14 |   var createOptionEls = function(val) {
 15 |     var option = document.createElement('option')
 16 |     option.value = val
 17 |     option.textContent = val + ' text'
 18 |     return option
 19 |   }
 20 | 
 21 |   var createSelectElement = function(isMultiple, optionValues) {
 22 |     var elem = document.createElement('select')
 23 |     var options
 24 |     if (optionValues instanceof Array) {
 25 |       options = optionValues.map(createOptionEls)
 26 |       options.forEach(function(option) {
 27 |         elem.appendChild(option)
 28 |       })
 29 |     } else {
 30 |       //grouped
 31 |       Object.keys(optionValues).forEach(function(group) {
 32 |         var optGroupEl = document.createElement('optgroup')
 33 |         optGroupEl.label = group;
 34 |         options = optionValues[group].map(createOptionEls);
 35 |         options.forEach(function(option) {
 36 |           optGroupEl.appendChild(option)
 37 |         })
 38 |         elem.appendChild(optGroupEl)
 39 |       });
 40 |     }
 41 |     if (isMultiple) elem.multiple = true
 42 |     document.body.appendChild(elem)
 43 |     return elem
 44 |   }
 45 | 
 46 |   beforeEach(function() {
 47 |     rivets.configure({
 48 |       adapter: {
 49 |         subscribe: function() {},
 50 |         unsubscribe: function() {},
 51 |         read: function() {},
 52 |         publish: function() {}
 53 |       }
 54 |     })
 55 | 
 56 |     el = document.createElement('div')
 57 |     document.body.appendChild(el)
 58 |     input = createInputElement('text')
 59 | 
 60 |     // to test the radio input scenario when its value is "true"
 61 |     trueRadioInput = createInputElement('radio', 'true')
 62 | 
 63 |     // to test the radio input scenario when its value is "false"
 64 |     falseRadioInput = createInputElement('radio', 'false')
 65 | 
 66 |     // to test the checkbox input scenario
 67 |     checkboxInput = createInputElement('checkbox')  })
 68 | 
 69 |   afterEach(function(){
 70 |     el.parentNode.removeChild(el)
 71 |     input.parentNode.removeChild(input)
 72 |     trueRadioInput.parentNode.removeChild(trueRadioInput)
 73 |     falseRadioInput.parentNode.removeChild(falseRadioInput)
 74 |     checkboxInput.parentNode.removeChild(checkboxInput)
 75 |   })
 76 | 
 77 |   describe('text', function() {
 78 |     it("sets the element's text content", function() {
 79 |       rivets.binders.text(el, '<em>hello</em>')
 80 |       el.textContent.should.equal('<em>hello</em>')
 81 |       el.innerHTML.should.equal('&lt;em&gt;hello&lt;/em&gt;')
 82 |     })
 83 | 
 84 |     it("sets the element's text content to zero when a numeric zero is passed", function() {
 85 |       rivets.binders.text(el, 0)
 86 |       el.textContent.should.equal('0')
 87 |       el.innerHTML.should.equal('0')
 88 |     })
 89 |   })
 90 | 
 91 |   describe('html', function() {
 92 |     it("sets the element's HTML content", function() {
 93 |       rivets.binders.html(el, '<strong>hello</strong>')
 94 |       el.textContent.should.equal('hello')
 95 |       el.innerHTML.should.equal('<strong>hello</strong>')
 96 |     })
 97 | 
 98 |     it("sets the element's HTML content to zero when a zero value is passed", function() {
 99 |       rivets.binders.html(el, 0)
100 |       el.textContent.should.equal('0')
101 |       el.innerHTML.should.equal('0')
102 |     })
103 |   })
104 | 
105 |   describe('value', function() {
106 |     it("sets the element's value", function() {
107 |       rivets.binders.value.routine(input, 'pitchfork')
108 |       input.value.should.equal('pitchfork')
109 |     })
110 | 
111 |     it("applies a default value to the element when the model doesn't contain it", function() {
112 |       rivets.binders.value.routine(input, undefined)
113 |       input.value.should.equal('')
114 |     })
115 | 
116 |     it("sets the element's value to zero when a zero value is passed", function() {
117 |       rivets.binders.value.routine(input, 0)
118 |       input.value.should.equal('0')
119 |     })
120 | 
121 |     describe('in a select element', function(){
122 |       beforeEach(function () {
123 |         selectEl = createSelectElement(false, ['a', 'b', 'c'])
124 |         selectMultipleEl = createSelectElement(true, ['d', 'e', 'f'])
125 |         groupedSelectEl = createSelectElement(false, {'group1': ['a'], 'group2': ['b', 'c']})
126 |         groupedMultipleSelectEl = createSelectElement(true, {'group1': ['a'], 'group2': ['b', 'c']})
127 |       })
128 | 
129 |       it("sets the correct option on a select element", function() {
130 |         rivets.binders.value.routine(selectEl, 'b')
131 |         rivets.binders.value.routine(selectEl, 'c')
132 |         selectEl.value.should.equal('c')
133 |       })
134 | 
135 |       it("sets the correct option on a select-multiple element", function() {
136 |         rivets.binders.value.routine(selectMultipleEl, ['d', 'f'])
137 |         Array.prototype.slice.call(selectMultipleEl.children)
138 |           .filter(function(option) {
139 |             return option.selected
140 |           })
141 |           .map(function(option) {
142 |             return option.value
143 |           })
144 |           .should.eql(['d', 'f'])
145 |       })
146 | 
147 |       it("sets the correct option on a grouped select element", function() {
148 |         rivets.binders.value.routine(groupedSelectEl, 'b')
149 |         rivets.binders.value.routine(groupedSelectEl, 'c')
150 |         groupedSelectEl.value.should.equal('c')
151 |       })
152 | 
153 |       it("sets the correct option on a select-multiple element", function() {
154 |         var i
155 |         rivets.binders.value.routine(groupedMultipleSelectEl, ['a', 'c'])
156 |         Array.prototype.slice.call(groupedMultipleSelectEl.options)
157 |           .filter(function(option) {
158 |             return option.selected
159 |           })
160 |           .map(function(option) {
161 |             return option.value
162 |           })
163 |           .should.eql(['a', 'c'])
164 |       })
165 | 
166 |       afterEach(function () {
167 |         selectEl.parentNode.removeChild(selectEl)
168 |         selectMultipleEl.parentNode.removeChild(selectMultipleEl)
169 |         groupedSelectEl.parentNode.removeChild(groupedSelectEl)
170 |         groupedMultipleSelectEl.parentNode.removeChild(groupedMultipleSelectEl)
171 |       })
172 |     })
173 |   })
174 | 
175 | 
176 |   describe('show', function() {
177 |     describe('with a truthy value', function() {
178 |       it('shows the element', function() {
179 |         rivets.binders.show(el, true)
180 |         el.style.display.should.equal('')
181 |       })
182 |     })
183 | 
184 |     describe('with a falsey value', function() {
185 |       it('hides the element', function() {
186 |         rivets.binders.show(el, false)
187 |         el.style.display.should.equal('none')
188 |       })
189 |     })
190 |   })
191 | 
192 |   describe('hide', function() {
193 |     describe('with a truthy value', function() {
194 |       it('hides the element', function() {
195 |         rivets.binders.hide(el, true)
196 |         el.style.display.should.equal('none')
197 |       })
198 |     })
199 | 
200 |     describe('with a falsey value', function() {
201 |       it('shows the element', function() {
202 |         rivets.binders.hide(el, false)
203 |         el.style.display.should.equal('')
204 |       })
205 |     })
206 |   })
207 | 
208 |   describe('enabled', function() {
209 |     describe('with a truthy value', function() {
210 |       it('enables the element', function() {
211 |         rivets.binders.enabled(el, true)
212 |         el.disabled.should.equal(false)
213 |       })
214 |     })
215 | 
216 |     describe('with a falsey value', function() {
217 |       it('disables the element', function() {
218 |         rivets.binders.enabled(el, false)
219 |         el.disabled.should.equal(true)
220 |       })
221 |     })
222 |   })
223 | 
224 |   describe('disabled', function() {
225 |     describe('with a truthy value', function() {
226 |       it('disables the element', function() {
227 |         rivets.binders.disabled(el, true)
228 |         el.disabled.should.equal(true)
229 |       })
230 |     })
231 | 
232 |     describe('with a falsey value', function() {
233 |       it('enables the element', function() {
234 |         rivets.binders.disabled(el, false)
235 |         el.disabled.should.equal(false)
236 |       })
237 |     })
238 |   })
239 | 
240 |   describe('checked', function() {
241 |     describe('with a checkbox input', function() {
242 |       describe('and a truthy value', function() {
243 |         it('checks the checkbox input', function() {
244 |           rivets.binders.checked.routine(checkboxInput, true)
245 |           checkboxInput.checked.should.equal(true)
246 |         })
247 |       })
248 | 
249 |       describe('with a falsey value', function() {
250 |         it('unchecks the checkbox input', function() {
251 |           rivets.binders.checked.routine(checkboxInput, false)
252 |           checkboxInput.checked.should.equal(false)
253 |         })
254 |       })
255 |     })
256 | 
257 |     describe('with a radio input with value="true"', function() {
258 |       describe('and a truthy value', function() {
259 |         it('checks the radio input', function() {
260 |           rivets.binders.checked.routine(trueRadioInput, true)
261 |           trueRadioInput.checked.should.equal(true)
262 |         })
263 |       })
264 | 
265 |       describe('with a falsey value', function() {
266 |         it('unchecks the radio input', function() {
267 |           rivets.binders.checked.routine(trueRadioInput, false)
268 |           trueRadioInput.checked.should.equal(false)
269 |         })
270 |       })
271 |     })
272 | 
273 |     describe('with a radio input with value="false"', function() {
274 |       describe('and a truthy value', function() {
275 |         it('checks the radio input', function() {
276 |           rivets.binders.checked.routine(falseRadioInput, true)
277 |           falseRadioInput.checked.should.equal(false)
278 |         })
279 |       })
280 | 
281 |       describe('with a falsey value', function() {
282 |         it('unchecks the radio input', function() {
283 |           rivets.binders.checked.routine(falseRadioInput, false)
284 |           falseRadioInput.checked.should.equal(true)
285 |         })
286 |       })
287 |     })
288 |   })
289 | 
290 |   describe('unchecked', function() {
291 |     describe('and a truthy value', function() {
292 |       describe('and a truthy value', function() {
293 |         it('checks the checkbox input', function() {
294 |           rivets.binders.unchecked.routine(checkboxInput, true)
295 |           checkboxInput.checked.should.equal(false)
296 |         })
297 |       })
298 | 
299 |       describe('with a falsey value', function() {
300 |         it('unchecks the checkbox input', function() {
301 |           rivets.binders.unchecked.routine(checkboxInput, false)
302 |           checkboxInput.checked.should.equal(true)
303 |         })
304 |       })
305 |     })
306 | 
307 |     describe('with a radio input with value="true"', function() {
308 |       describe('and a truthy value', function() {
309 |         it('checks the radio input', function() {
310 |           rivets.binders.unchecked.routine(trueRadioInput, true)
311 |           trueRadioInput.checked.should.equal(false)
312 |         })
313 |       })
314 | 
315 |       describe('with a falsey value', function() {
316 |         it('unchecks the radio input', function() {
317 |           rivets.binders.unchecked.routine(trueRadioInput, false)
318 |           trueRadioInput.checked.should.equal(true)
319 |         })
320 |       })
321 |     })
322 | 
323 |     describe('with a radio input with value="false"', function() {
324 |       describe('and a truthy value', function() {
325 |         it('checks the radio input', function() {
326 |           rivets.binders.unchecked.routine(falseRadioInput, true)
327 |           falseRadioInput.checked.should.equal(true)
328 |         })
329 |       })
330 | 
331 |       describe('with a falsey value', function() {
332 |         it('unchecks the radio input', function() {
333 |           rivets.binders.unchecked.routine(falseRadioInput, false)
334 |           falseRadioInput.checked.should.equal(false)
335 |         })
336 |       })
337 |     })
338 |   })
339 | })
340 | 


--------------------------------------------------------------------------------
/spec/rivets/text_template_parser.js:
--------------------------------------------------------------------------------
 1 | describe("Rivets.TextTemplateParser", function() {
 2 |   var Rivets = rivets._
 3 | 
 4 |   describe("parse()", function() {
 5 |     it("tokenizes a text template", function() {
 6 |       template = "Hello {{ user.name }}, you have {{ user.messages.unread | length }} unread messages."
 7 | 
 8 |       expected = [
 9 |         {type: 0, value: "Hello "},
10 |         {type: 1, value: "user.name"},
11 |         {type: 0, value: ", you have "},
12 |         {type: 1, value: "user.messages.unread | length"},
13 |         {type: 0, value: " unread messages."}
14 |       ]
15 | 
16 |       results = Rivets.TextTemplateParser.parse(template, ['{{', '}}'])
17 |       results.length.should.equal(5)
18 | 
19 |       for (i = 0; i < results.length; i++) {
20 |         results[i].type.should.equal(expected[i].type)
21 |         results[i].value.should.equal(expected[i].value)
22 |       }
23 |     })
24 | 
25 |     describe("with no binding fragments", function() {
26 |       it("should return a single text token", function() {
27 |         template = "Hello World!"
28 |         expected = [{type: 0, value: "Hello World!"}]
29 | 
30 |         results = Rivets.TextTemplateParser.parse(template, ['{{', '}}'])
31 |         results.length.should.equal(1)
32 | 
33 |         for (i = 0; i < results.length; i++) {
34 |           results[i].type.should.equal(expected[i].type)
35 |           results[i].value.should.equal(expected[i].value)
36 |         }
37 |       })
38 |     })
39 | 
40 |     describe("with only a binding fragment", function() {
41 |       it("should return a single binding token", function() {
42 |         template = "{{ user.name }}"
43 |         expected = [{type: 1, value: "user.name"}]
44 | 
45 |         results = Rivets.TextTemplateParser.parse(template, ['{{', '}}'])
46 |         results.length.should.equal(1)
47 | 
48 |         for (i = 0; i < results.length; i++) {
49 |           results[i].type.should.equal(expected[i].type)
50 |           results[i].value.should.equal(expected[i].value)
51 |         }
52 |       })
53 |     })
54 |   })
55 | })
56 | 


--------------------------------------------------------------------------------
/spec/runner.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html>
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 7 |     <title>Mocha Test Runner</title>
 8 |     <link rel="stylesheet" href="../node_modules/mocha/mocha.css">
 9 |   </head>
10 | 
11 |   <body>
12 |     <div id="mocha"></div>
13 | 
14 |     <script src="../node_modules/mocha/mocha.js"></script>
15 |     <script src="../node_modules/should/should.js"></script>
16 |     <script src="../node_modules/sinon/pkg/sinon.js"></script>
17 |     <script src="../node_modules/sightglass/index.js"></script>
18 |     <script src="../dist/rivets.js"></script>
19 | 
20 |     <script>mocha.setup('bdd')</script>
21 | 
22 |     <script src="lib/mock.data.js"></script>
23 |     <script src="rivets/binders.js"></script>
24 |     <script src="rivets/formatters.js"></script>
25 |     <script src="rivets/binding.js"></script>
26 |     <script src="rivets/component_binding.js"></script>
27 |     <script src="rivets/functional.js"></script>
28 |     <script src="rivets/routines.js"></script>
29 |     <script src="rivets/text_template_parser.js"></script>
30 | 
31 |     <script>
32 |       if (window.mochaPhantomJS) {
33 |         mochaPhantomJS.run();
34 |       } else {
35 |         mocha.run();
36 |       }
37 |     </script>
38 |   </body>
39 | </html>
40 | 


--------------------------------------------------------------------------------
/src/adapter.coffee:
--------------------------------------------------------------------------------
  1 | # The default `.` adapter thats comes with Rivets.js. Allows subscribing to
  2 | # properties on plain objects, implemented in ES5 natives using
  3 | # `Object.defineProperty`.
  4 | Rivets.public.adapters['.'] =
  5 |   id: '_rv'
  6 |   counter: 0
  7 |   weakmap: {}
  8 | 
  9 |   weakReference: (obj) ->
 10 |     unless obj.hasOwnProperty @id
 11 |       id = @counter++
 12 |       Object.defineProperty obj, @id, value: id
 13 | 
 14 |     @weakmap[obj[@id]] or= callbacks: {}
 15 | 
 16 |   cleanupWeakReference: (ref, id) ->
 17 |     unless Object.keys(ref.callbacks).length
 18 |       unless ref.pointers and Object.keys(ref.pointers).length
 19 |         delete @weakmap[id]
 20 | 
 21 |   stubFunction: (obj, fn) ->
 22 |     original = obj[fn]
 23 |     map = @weakReference obj
 24 |     weakmap = @weakmap
 25 | 
 26 |     obj[fn] = ->
 27 |       response = original.apply obj, arguments
 28 | 
 29 |       for r, k of map.pointers
 30 |         callback() for callback in weakmap[r]?.callbacks[k] ? []
 31 | 
 32 |       response
 33 | 
 34 |   observeMutations: (obj, ref, keypath) ->
 35 |     if Array.isArray obj
 36 |       map = @weakReference obj
 37 | 
 38 |       unless map.pointers?
 39 |         map.pointers = {}
 40 |         functions = ['push', 'pop', 'shift', 'unshift', 'sort', 'reverse', 'splice']
 41 |         @stubFunction obj, fn for fn in functions
 42 | 
 43 |       map.pointers[ref] ?= []
 44 | 
 45 |       unless keypath in map.pointers[ref]
 46 |         map.pointers[ref].push keypath
 47 | 
 48 |   unobserveMutations: (obj, ref, keypath) ->
 49 |     if Array.isArray(obj) and obj[@id]?
 50 |       if map = @weakmap[obj[@id]]
 51 |         if pointers = map.pointers[ref]
 52 |           if (idx = pointers.indexOf(keypath)) >= 0
 53 |             pointers.splice idx, 1
 54 | 
 55 |           delete map.pointers[ref] unless pointers.length
 56 |           @cleanupWeakReference map, obj[@id]
 57 | 
 58 |   observe: (obj, keypath, callback) ->
 59 |     callbacks = @weakReference(obj).callbacks
 60 | 
 61 |     unless callbacks[keypath]?
 62 |       callbacks[keypath] = []
 63 |       desc = Object.getOwnPropertyDescriptor obj, keypath
 64 | 
 65 |       unless desc?.get or desc?.set
 66 |         value = obj[keypath]
 67 | 
 68 |         Object.defineProperty obj, keypath,
 69 |           enumerable: true
 70 |           get: -> value
 71 |           set: (newValue) =>
 72 |             if newValue isnt value
 73 |               @unobserveMutations value, obj[@id], keypath
 74 |               value = newValue
 75 | 
 76 |               if map = @weakmap[obj[@id]]
 77 |                 callbacks = map.callbacks
 78 | 
 79 |                 if callbacks[keypath]
 80 |                   cb() for cb in callbacks[keypath].slice() when cb in callbacks[keypath]
 81 |                 @observeMutations newValue, obj[@id], keypath
 82 | 
 83 |     unless callback in callbacks[keypath]
 84 |       callbacks[keypath].push callback
 85 | 
 86 |     @observeMutations obj[keypath], obj[@id], keypath
 87 | 
 88 |   unobserve: (obj, keypath, callback) ->
 89 |     if map = @weakmap[obj[@id]]
 90 |       if callbacks = map.callbacks[keypath]
 91 |         if (idx = callbacks.indexOf(callback)) >= 0
 92 |           callbacks.splice idx, 1
 93 | 
 94 |           unless callbacks.length
 95 |             delete map.callbacks[keypath]
 96 |             @unobserveMutations obj[keypath], obj[@id], keypath
 97 | 
 98 |         @cleanupWeakReference map, obj[@id]
 99 | 
100 |   get: (obj, keypath) ->
101 |     obj[keypath]
102 | 
103 |   set: (obj, keypath, value) ->
104 |     obj[keypath] = value
105 | 


--------------------------------------------------------------------------------
/src/binders.coffee:
--------------------------------------------------------------------------------
  1 | # Basic set of core binders that are included with Rivets.js.
  2 | 
  3 | # Sets the element's text value.
  4 | Rivets.public.binders.text = (el, value) ->
  5 |   if el.textContent?
  6 |     el.textContent = if value? then value else ''
  7 |   else
  8 |     el.innerText = if value? then value else ''
  9 | 
 10 | # Sets the element's HTML content.
 11 | Rivets.public.binders.html = (el, value) ->
 12 |   el.innerHTML = if value? then value else ''
 13 | 
 14 | # Shows the element when value is true.
 15 | Rivets.public.binders.show = (el, value) ->
 16 |   el.style.display = if value then '' else 'none'
 17 | 
 18 | # Hides the element when value is true (negated version of `show` binder).
 19 | Rivets.public.binders.hide = (el, value) ->
 20 |   el.style.display = if value then 'none' else ''
 21 | 
 22 | # Enables the element when value is true.
 23 | Rivets.public.binders.enabled = (el, value) ->
 24 |   el.disabled = !value
 25 | 
 26 | # Disables the element when value is true (negated version of `enabled` binder).
 27 | Rivets.public.binders.disabled = (el, value) ->
 28 |   el.disabled = !!value
 29 | 
 30 | # Checks a checkbox or radio input when the value is true. Also sets the model
 31 | # property when the input is checked or unchecked (two-way binder).
 32 | Rivets.public.binders.checked =
 33 |   publishes: true
 34 |   priority: 2000
 35 | 
 36 |   bind: (el) ->
 37 |     Rivets.Util.bindEvent el, 'change', @publish
 38 | 
 39 |   unbind: (el) ->
 40 |     Rivets.Util.unbindEvent el, 'change', @publish
 41 | 
 42 |   routine: (el, value) ->
 43 |     if el.type is 'radio'
 44 |       el.checked = el.value?.toString() is value?.toString()
 45 |     else
 46 |       el.checked = !!value
 47 | 
 48 | # Unchecks a checkbox or radio input when the value is true (negated version of
 49 | # `checked` binder). Also sets the model property when the input is checked or
 50 | # unchecked (two-way binder).
 51 | Rivets.public.binders.unchecked =
 52 |   publishes: true
 53 |   priority: 2000
 54 | 
 55 |   bind: (el) ->
 56 |     Rivets.Util.bindEvent el, 'change', @publish
 57 | 
 58 |   unbind: (el) ->
 59 |     Rivets.Util.unbindEvent el, 'change', @publish
 60 | 
 61 |   routine: (el, value) ->
 62 |     if el.type is 'radio'
 63 |       el.checked = el.value?.toString() isnt value?.toString()
 64 |     else
 65 |       el.checked = !value
 66 | 
 67 | # Sets the element's value. Also sets the model property when the input changes
 68 | # (two-way binder).
 69 | Rivets.public.binders.value =
 70 |   publishes: true
 71 |   priority: 3000
 72 | 
 73 |   bind: (el) ->
 74 |     unless el.tagName is 'INPUT' and el.type is 'radio'
 75 |       @event = if el.tagName is 'SELECT' then 'change' else 'input'
 76 |       Rivets.Util.bindEvent el, @event, @publish
 77 | 
 78 |   unbind: (el) ->
 79 |     unless el.tagName is 'INPUT' and el.type is 'radio'
 80 |       Rivets.Util.unbindEvent el, @event, @publish
 81 | 
 82 |   routine: (el, value) ->
 83 |     if el.tagName is 'INPUT' and el.type is 'radio'
 84 |       el.setAttribute 'value', value
 85 |     else if window.jQuery?
 86 |       el = jQuery el
 87 | 
 88 |       if value?.toString() isnt el.val()?.toString()
 89 |         el.val if value? then value else ''
 90 |     else
 91 |       if el.type is 'select-multiple'
 92 |         o.selected = o.value in value for o in el if value?
 93 |       else if value?.toString() isnt el.value?.toString()
 94 |         el.value = if value? then value else ''
 95 | 
 96 | # Inserts and binds the element and it's child nodes into the DOM when true.
 97 | Rivets.public.binders.if =
 98 |   block: true
 99 |   priority: 4000
100 | 
101 |   bind: (el) ->
102 |     unless @marker?
103 |       attr = [@view.prefix, @type].join('-').replace '--', '-'
104 |       declaration = el.getAttribute attr
105 | 
106 |       @marker = document.createComment " rivets: #{@type} #{declaration} "
107 |       @bound = false
108 | 
109 |       el.removeAttribute attr
110 |       el.parentNode.insertBefore @marker, el
111 |       el.parentNode.removeChild el
112 | 
113 |   unbind: ->
114 |     if @nested
115 |       @nested.unbind()
116 |       @bound = false
117 | 
118 |   routine: (el, value) ->
119 |     if !!value is not @bound
120 |       if value
121 |         models = {}
122 |         models[key] = model for key, model of @view.models
123 | 
124 |         (@nested or= new Rivets.View(el, models, @view.options())).bind()
125 |         @marker.parentNode.insertBefore el, @marker.nextSibling
126 |         @bound = true
127 |       else
128 |         el.parentNode.removeChild el
129 |         @nested.unbind()
130 |         @bound = false
131 | 
132 |   update: (models) ->
133 |     @nested?.update models
134 | 
135 | # Removes and unbinds the element and it's child nodes into the DOM when true
136 | # (negated version of `if` binder).
137 | Rivets.public.binders.unless =
138 |   block: true
139 |   priority: 4000
140 | 
141 |   bind: (el) ->
142 |     Rivets.public.binders.if.bind.call @, el
143 | 
144 |   unbind: ->
145 |     Rivets.public.binders.if.unbind.call @
146 | 
147 |   routine: (el, value) ->
148 |     Rivets.public.binders.if.routine.call @, el, not value
149 | 
150 |   update: (models) ->
151 |     Rivets.public.binders.if.update.call @, models
152 | 
153 | # Binds an event handler on the element.
154 | Rivets.public.binders['on-*'] =
155 |   function: true
156 |   priority: 1000
157 | 
158 |   unbind: (el) ->
159 |     Rivets.Util.unbindEvent el, @args[0], @handler if @handler
160 | 
161 |   routine: (el, value) ->
162 |     Rivets.Util.unbindEvent el, @args[0], @handler if @handler
163 |     Rivets.Util.bindEvent el, @args[0], @handler = @eventHandler value
164 | 
165 | # Appends bound instances of the element in place for each item in the array.
166 | Rivets.public.binders['each-*'] =
167 |   block: true
168 |   priority: 4000
169 | 
170 |   bind: (el) ->
171 |     unless @marker?
172 |       attr = [@view.prefix, @type].join('-').replace '--', '-'
173 |       @marker = document.createComment " rivets: #{@type} "
174 |       @iterated = []
175 | 
176 |       el.removeAttribute attr
177 |       el.parentNode.insertBefore @marker, el
178 |       el.parentNode.removeChild el
179 |     else
180 |       for view in @iterated
181 |         view.bind()
182 |     return;
183 | 
184 |   unbind: (el) ->
185 |     view.unbind() for view in @iterated if @iterated?
186 |     return
187 | 
188 |   routine: (el, collection) ->
189 |     modelName = @args[0]
190 |     collection = collection or []
191 | 
192 |     if @iterated.length > collection.length
193 |       for i in Array @iterated.length - collection.length
194 |         view = @iterated.pop()
195 |         view.unbind()
196 |         @marker.parentNode.removeChild view.els[0]
197 | 
198 |     for model, index in collection
199 |       data = {index}
200 |       data[Rivets.public.iterationAlias modelName] = index
201 |       data[modelName] = model
202 | 
203 |       if not @iterated[index]?
204 |         for key, model of @view.models
205 |           data[key] ?= model
206 | 
207 |         previous = if @iterated.length
208 |           @iterated[@iterated.length - 1].els[0]
209 |         else
210 |           @marker
211 | 
212 |         options = @view.options()
213 |         options.preloadData = true
214 | 
215 |         template = el.cloneNode true
216 |         view = new Rivets.View(template, data, options)
217 |         view.bind()
218 |         @iterated.push view
219 | 
220 |         @marker.parentNode.insertBefore template, previous.nextSibling
221 |       else if @iterated[index].models[modelName] isnt model
222 |         @iterated[index].update data
223 | 
224 |     if el.nodeName is 'OPTION'
225 |       for binding in @view.bindings
226 |         if binding.el is @marker.parentNode and binding.type is 'value'
227 |           binding.sync()
228 |     return
229 | 
230 |   update: (models) ->
231 |     data = {}
232 | 
233 |     for key, model of models
234 |       data[key] = model unless key is @args[0]
235 | 
236 |     view.update data for view in @iterated
237 |     return
238 | 
239 | # Adds or removes the class from the element when value is true or false.
240 | Rivets.public.binders['class-*'] = (el, value) ->
241 |   elClass = " #{el.className} "
242 | 
243 |   if !value is (elClass.indexOf(" #{@args[0]} ") isnt -1)
244 |     el.className = if value
245 |       "#{el.className} #{@args[0]}"
246 |     else
247 |       elClass.replace(" #{@args[0]} ", ' ').trim()
248 | 
249 | # Sets the attribute on the element. If no binder above is matched it will fall
250 | # back to using this binder.
251 | Rivets.public.binders['*'] = (el, value) ->
252 |   if value?
253 |     el.setAttribute @type, value
254 |   else
255 |     el.removeAttribute @type
256 | 


--------------------------------------------------------------------------------
/src/bindings.coffee:
--------------------------------------------------------------------------------
  1 | # Rivets.Binding
  2 | # --------------
  3 | 
  4 | # A single binding between a model attribute and a DOM element.
  5 | class Rivets.Binding
  6 |   # All information about the binding is passed into the constructor; the
  7 |   # containing view, the DOM node, the type of binding, the model object and the
  8 |   # keypath at which to listen for changes.
  9 |   constructor: (@view, @el, @type, @keypath, @options = {}) ->
 10 |     @formatters = @options.formatters or []
 11 |     @dependencies = []
 12 |     @formatterObservers = {}
 13 |     @model = undefined
 14 |     @setBinder()
 15 | 
 16 |   # Sets the binder to use when binding and syncing.
 17 |   setBinder: =>
 18 |     unless @binder = @view.binders[@type]
 19 |       for identifier, value of @view.binders
 20 |         if identifier isnt '*' and identifier.indexOf('*') isnt -1
 21 |           regexp = new RegExp "^#{identifier.replace(/\*/g, '.+')}$"
 22 |           if regexp.test @type
 23 |             @binder = value
 24 |             @args = new RegExp("^#{identifier.replace(/\*/g, '(.+)')}$").exec @type
 25 |             @args.shift()
 26 | 
 27 |     @binder or= @view.binders['*']
 28 |     @binder = {routine: @binder} if @binder instanceof Function
 29 | 
 30 |   observe: (obj, keypath, callback) =>
 31 |     Rivets.sightglass obj, keypath, callback,
 32 |       root: @view.rootInterface
 33 |       adapters: @view.adapters
 34 | 
 35 |   parseTarget: =>
 36 |     token = Rivets.TypeParser.parse @keypath
 37 | 
 38 |     if token.type is Rivets.TypeParser.types.primitive
 39 |       @value = token.value
 40 |     else
 41 |       @observer = @observe @view.models, @keypath, @sync
 42 |       @model = @observer.target
 43 | 
 44 |   parseFormatterArguments: (args, formatterIndex) =>
 45 |     args = (Rivets.TypeParser.parse(arg) for arg in args)
 46 |     processedArgs = []
 47 | 
 48 |     for arg, ai in args
 49 |       processedArgs.push if arg.type is Rivets.TypeParser.types.primitive
 50 |         arg.value
 51 |       else
 52 |         @formatterObservers[formatterIndex] or= {}
 53 | 
 54 |         unless observer = @formatterObservers[formatterIndex][ai]
 55 |           observer = @observe @view.models, arg.value, @sync
 56 |           @formatterObservers[formatterIndex][ai] = observer
 57 | 
 58 |         observer.value()
 59 | 
 60 |     processedArgs
 61 | 
 62 |   # Applies all the current formatters to the supplied value and returns the
 63 |   # formatted value.
 64 |   formattedValue: (value) =>
 65 |     for formatter, fi in @formatters
 66 |       args = formatter.match /[^\s']+|'([^']|'[^\s])*'|"([^"]|"[^\s])*"/g
 67 |       id = args.shift()
 68 |       formatter = @view.formatters[id]
 69 | 
 70 |       processedArgs = @parseFormatterArguments args, fi
 71 | 
 72 |       if formatter?.read instanceof Function
 73 |         value = formatter.read.call @model, value, processedArgs...
 74 |       else if formatter instanceof Function
 75 |         value = formatter.call @model, value, processedArgs...
 76 | 
 77 |     value
 78 | 
 79 |   # Returns an event handler for the binding around the supplied function.
 80 |   eventHandler: (fn) =>
 81 |     handler = (binding = @).view.handler
 82 |     (ev) -> handler.call fn, @, ev, binding
 83 | 
 84 |   # Sets the value for the binding. This Basically just runs the binding routine
 85 |   # with the suplied value formatted.
 86 |   set: (value) =>
 87 |     # Since 0.9 : doesn't execute function unless backward compatibility is active
 88 |     value = if (value instanceof Function and !@binder.function and Rivets.public.executeFunctions)
 89 |       @formattedValue value.call @model
 90 |     else
 91 |       @formattedValue value
 92 | 
 93 |     @binder.routine?.call @, @el, value
 94 | 
 95 |   # Syncs up the view binding with the model.
 96 |   sync: =>
 97 |     @set if @observer
 98 |       if @model isnt @observer.target
 99 |         observer.unobserve() for observer in @dependencies
100 |         @dependencies = []
101 | 
102 |         if (@model = @observer.target)? and @options.dependencies?.length
103 |           for dependency in @options.dependencies
104 |             observer = @observe @model, dependency, @sync
105 |             @dependencies.push observer
106 | 
107 |       @observer.value()
108 |     else
109 |       @value
110 | 
111 |   # Publishes the value currently set on the input element back to the model.
112 |   publish: =>
113 |     if @observer
114 |       value = @getValue @el
115 |       lastformatterIndex = @formatters.length - 1
116 | 
117 |       for formatter, fiReversed in @formatters.slice(0).reverse()
118 |         fi = lastformatterIndex - fiReversed
119 |         args = formatter.split /\s+/
120 |         id = args.shift()
121 | 
122 |         processedArgs = @parseFormatterArguments args, fi
123 | 
124 |         if @view.formatters[id]?.publish
125 |           value = @view.formatters[id].publish value, processedArgs...
126 | 
127 |       @observer.setValue value
128 | 
129 |   # Subscribes to the model for changes at the specified keypath. Bi-directional
130 |   # routines will also listen for changes on the element to propagate them back
131 |   # to the model.
132 |   bind: =>
133 |     @parseTarget()
134 |     @binder.bind?.call @, @el
135 | 
136 |     if @model? and @options.dependencies?.length
137 |       for dependency in @options.dependencies
138 |         observer = @observe @model, dependency, @sync
139 |         @dependencies.push observer
140 | 
141 |     @sync() if @view.preloadData
142 | 
143 |   # Unsubscribes from the model and the element.
144 |   unbind: =>
145 |     @binder.unbind?.call @, @el
146 |     @observer?.unobserve()
147 | 
148 |     observer.unobserve() for observer in @dependencies
149 |     @dependencies = []
150 | 
151 |     for fi, args of @formatterObservers
152 |       observer.unobserve() for ai, observer of args
153 | 
154 |     @formatterObservers = {}
155 | 
156 |   # Updates the binding's model from what is currently set on the view. Unbinds
157 |   # the old model first and then re-binds with the new model.
158 |   update: (models = {}) =>
159 |     @model = @observer?.target
160 |     @binder.update?.call @, models
161 | 
162 |   # Returns elements value
163 |   getValue: (el) =>
164 |     if @binder and @binder.getValue?
165 |       @binder.getValue.call @, el
166 |     else
167 |       Rivets.Util.getInputValue el
168 | 
169 | # Rivets.ComponentBinding
170 | # -----------------------
171 | 
172 | # A component view encapsulated as a binding within it's parent view.
173 | class Rivets.ComponentBinding extends Rivets.Binding
174 |   # Initializes a component binding for the specified view. The raw component
175 |   # element is passed in along with the component type. Attributes and scope
176 |   # inflections are determined based on the components defined attributes.
177 |   constructor: (@view, @el, @type) ->
178 |     @component = @view.components[@type]
179 |     @static = {}
180 |     @observers = {}
181 |     @upstreamObservers = {}
182 | 
183 |     bindingRegExp = view.bindingRegExp()
184 | 
185 |     for attribute in @el.attributes or []
186 |       unless bindingRegExp.test attribute.name
187 |         propertyName = @camelCase attribute.name
188 | 
189 |         token = Rivets.TypeParser.parse(attribute.value)
190 | 
191 |         if propertyName in (@component.static ? [])
192 |           @static[propertyName] = attribute.value
193 |         else if token.type is Rivets.TypeParser.types.primitive
194 |           @static[propertyName] = token.value
195 |         else
196 |           @observers[propertyName] = attribute.value
197 | 
198 |   # Intercepts `Rivets.Binding::sync` since component bindings are not bound to
199 |   # a particular model to update it's value.
200 |   sync: ->
201 | 
202 |   # Intercepts `Rivets.Binding::update` since component bindings are not bound
203 |   # to a particular model to update it's value.
204 |   update: ->
205 | 
206 |   # Intercepts `Rivets.Binding::publish` since component bindings are not bound
207 |   # to a particular model to update it's value.
208 |   publish: ->
209 | 
210 |   # Returns an object map using the component's scope inflections.
211 |   locals: =>
212 |     result = {}
213 | 
214 |     for key, value of @static
215 |       result[key] = value
216 | 
217 |     for key, observer of @observers
218 |       result[key] = observer.value()
219 | 
220 |     result
221 | 
222 |   # Returns a camel-cased version of the string. Used when translating an
223 |   # element's attribute name into a property name for the component's scope.
224 |   camelCase: (string) ->
225 |     string.replace /-([a-z])/g, (grouped) ->
226 |       grouped[1].toUpperCase()
227 | 
228 |   # Intercepts `Rivets.Binding::bind` to build `@componentView` with a localized
229 |   # map of models from the root view. Bind `@componentView` on subsequent calls.
230 |   bind: =>
231 |     unless @bound
232 |       for key, keypath of @observers
233 |         @observers[key] = @observe @view.models, keypath, ((key) => =>
234 |           @componentView.models[key] = @observers[key].value()
235 |         ).call(@, key)
236 | 
237 |       @bound = true
238 | 
239 |     if @componentView?
240 |       @componentView.bind()
241 |     else
242 |       @el.innerHTML = @component.template.call this
243 |       scope = @component.initialize.call @, @el, @locals()
244 |       @el._bound = true
245 | 
246 |       options = {}
247 | 
248 |       for option in Rivets.extensions
249 |         options[option] = {}
250 |         options[option][k] = v for k, v of @component[option] if @component[option]
251 |         options[option][k] ?= v for k, v of @view[option]
252 | 
253 |       for option in Rivets.options
254 |         options[option] = @component[option] ? @view[option]
255 | 
256 |       @componentView = new Rivets.View(Array.prototype.slice.call(@el.childNodes), scope, options)
257 |       @componentView.bind()
258 | 
259 |       for key, observer of @observers
260 |         @upstreamObservers[key] = @observe @componentView.models, key, ((key, observer) => =>
261 |           observer.setValue @componentView.models[key]
262 |         ).call(@, key, observer)
263 |     return
264 | 
265 |   # Intercept `Rivets.Binding::unbind` to be called on `@componentView`.
266 |   unbind: =>
267 |     for key, observer of @upstreamObservers
268 |       observer.unobserve()
269 | 
270 |     for key, observer of @observers
271 |       observer.unobserve()
272 | 
273 |     @componentView?.unbind.call @
274 | 
275 | # Rivets.TextBinding
276 | # -----------------------
277 | 
278 | # A text node binding, defined internally to deal with text and element node
279 | # differences while avoiding it being overwritten.
280 | class Rivets.TextBinding extends Rivets.Binding
281 |   # Initializes a text binding for the specified view and text node.
282 |   constructor: (@view, @el, @type, @keypath, @options = {}) ->
283 |     @formatters = @options.formatters or []
284 |     @dependencies = []
285 |     @formatterObservers = {}
286 | 
287 |   # A standard routine binder used for text node bindings.
288 |   binder:
289 |     routine: (node, value) ->
290 |       node.data = value ? ''
291 | 
292 |   # Wrap the call to `sync` in fat-arrow to avoid function context issues.
293 |   sync: =>
294 |     super
295 | 


--------------------------------------------------------------------------------
/src/export.coffee:
--------------------------------------------------------------------------------
 1 | # Rivets.factory
 2 | # --------------
 3 | 
 4 | # Rivets.js module factory.
 5 | Rivets.factory = (sightglass) ->
 6 |   # Integrate sightglass.
 7 |   Rivets.sightglass = sightglass
 8 | 
 9 |   # Allow access to private members (for testing).
10 |   Rivets.public._ = Rivets
11 | 
12 |   # Return the public interface.
13 |   Rivets.public
14 | 
15 | # Exports Rivets.js for CommonJS, AMD and the browser.
16 | if typeof module?.exports is 'object'
17 |   module.exports = Rivets.factory require('sightglass')
18 | else if typeof define is 'function' and define.amd
19 |   define ['sightglass'], (sightglass) ->
20 |     @rivets = Rivets.factory sightglass
21 | else
22 |   @rivets = Rivets.factory sightglass
23 | 


--------------------------------------------------------------------------------
/src/formatters.coffee:
--------------------------------------------------------------------------------
1 | # Core formatters
2 | 
3 | # Calls a function with arguments
4 | Rivets.public.formatters['call'] = (value, args...) ->
5 | 	value.call @, args...
6 | 
7 | 


--------------------------------------------------------------------------------
/src/parsers.coffee:
--------------------------------------------------------------------------------
 1 | # Rivets.TypeParser
 2 | # ---------------------
 3 | 
 4 | # Parser and tokenizer for getting the type and value of a primitive or keypath.
 5 | class Rivets.TypeParser
 6 |   @types:
 7 |     primitive: 0
 8 |     keypath: 1
 9 | 
10 |   @parse: (string) ->
11 |     if /^'.*'$|^".*"$/.test string
12 |       type: @types.primitive
13 |       value: string.slice 1, -1
14 |     else if string is 'true'
15 |       type: @types.primitive
16 |       value: true
17 |     else if string is 'false'
18 |       type: @types.primitive
19 |       value: false
20 |     else if string is 'null'
21 |       type: @types.primitive
22 |       value: null
23 |     else if string is 'undefined'
24 |       type: @types.primitive
25 |       value: undefined
26 |     else if string is ''
27 |       type: @types.primitive
28 |       value: undefined
29 |     else if isNaN(Number(string)) is false
30 |       type: @types.primitive
31 |       value: Number string
32 |     else
33 |       type: @types.keypath
34 |       value: string
35 | 
36 | # Rivets.TextTemplateParser
37 | # -------------------------
38 | 
39 | # Rivets.js text template parser and tokenizer for mustache-style text content
40 | # binding declarations.
41 | class Rivets.TextTemplateParser
42 |   @types:
43 |     text: 0
44 |     binding: 1
45 | 
46 |   # Parses the template and returns a set of tokens, separating static portions
47 |   # of text from binding declarations.
48 |   @parse: (template, delimiters) ->
49 |     tokens = []
50 |     length = template.length
51 |     index = 0
52 |     lastIndex = 0
53 | 
54 |     while lastIndex < length
55 |       index = template.indexOf delimiters[0], lastIndex
56 | 
57 |       if index < 0
58 |         tokens.push type: @types.text, value: template.slice lastIndex
59 |         break
60 |       else
61 |         if index > 0 and lastIndex < index
62 |           tokens.push type: @types.text, value: template.slice lastIndex, index
63 | 
64 |         lastIndex = index + delimiters[0].length
65 |         index = template.indexOf delimiters[1], lastIndex
66 | 
67 |         if index < 0
68 |           substring = template.slice lastIndex - delimiters[1].length
69 |           lastToken = tokens[tokens.length - 1]
70 | 
71 |           if lastToken?.type is @types.text
72 |             lastToken.value += substring
73 |           else
74 |             tokens.push type: @types.text, value: substring
75 | 
76 |           break
77 | 
78 |         value = template.slice(lastIndex, index).trim()
79 |         tokens.push type: @types.binding, value: value
80 |         lastIndex = index + delimiters[1].length
81 | 
82 |     tokens
83 | 


--------------------------------------------------------------------------------
/src/rivets.coffee:
--------------------------------------------------------------------------------
 1 | # The Rivets namespace.
 2 | Rivets =
 3 |   options: [
 4 |     'prefix'
 5 |     'templateDelimiters'
 6 |     'rootInterface'
 7 |     'preloadData'
 8 |     'handler',
 9 |     'executeFunctions'
10 |   ]
11 | 
12 |   extensions: [
13 |     'binders'
14 |     'formatters'
15 |     'components'
16 |     'adapters'
17 |   ]
18 | 
19 |   # The public interface (this is the exported module object).
20 |   public:
21 |     # Global binders.
22 |     binders: {}
23 | 
24 |     # Global components.
25 |     components: {}
26 | 
27 |     # Global formatters.
28 |     formatters: {}
29 | 
30 |     # Global sightglass adapters.
31 |     adapters: {}
32 | 
33 |     # Default attribute prefix.
34 |     prefix: 'rv'
35 | 
36 |     # Default template delimiters.
37 |     templateDelimiters: ['{', '}']
38 | 
39 |     # Default sightglass root interface.
40 |     rootInterface: '.'
41 | 
42 |     # Preload data by default.
43 |     preloadData: true,
44 | 
45 |     # Execute functions in bindings. Defaultis false since rivets 0.9. Set to true to be backward compatible with rivets 0.8.
46 |     executeFunctions: false,
47 | 
48 |     # Alias for index in rv-each binder
49 |     iterationAlias : (modelName) ->
50 |       return '%' + modelName + '%'
51 | 
52 |     # Default event handler.
53 |     handler: (context, ev, binding) ->
54 |       @call context, ev, binding.view.models
55 | 
56 |     # Merges an object literal into the corresponding global options.
57 |     configure: (options = {}) ->
58 |       for option, value of options
59 |         if option in ['binders', 'components', 'formatters', 'adapters']
60 |           for key, descriptor of value
61 |             Rivets[option][key] = descriptor
62 |         else
63 |           Rivets.public[option] = value
64 | 
65 |       return
66 | 
67 |     # Binds some data to a template / element. Returns a Rivets.View instance.
68 |     bind: (el, models = {}, options = {}) ->
69 |       view = new Rivets.View(el, models, options)
70 |       view.bind()
71 |       view
72 | 
73 |     # Initializes a new instance of a component on the specified element and
74 |     # returns a Rivets.View instance.
75 |     init: (component, el, data = {}) ->
76 |       el ?= document.createElement 'div'
77 |       component = Rivets.public.components[component]
78 |       template = component.template.call @, el
79 |       if template instanceof HTMLElement
80 |         while el.firstChild
81 |           el.removeChild(el.firstChild)
82 |         el.appendChild(template)
83 |       else
84 |         el.innerHTML = template
85 |       scope = component.initialize.call @, el, data
86 | 
87 |       view = new Rivets.View(el, scope)
88 |       view.bind()
89 |       view
90 | 


--------------------------------------------------------------------------------
/src/util.coffee:
--------------------------------------------------------------------------------
 1 | # Rivets.Util
 2 | # -----------
 3 | 
 4 | if window['jQuery'] or window['$']
 5 |   jQuery = window['jQuery'] or window['$']
 6 |   [bindMethod, unbindMethod] = if 'on' of jQuery.prototype then ['on', 'off'] else ['bind', 'unbind']
 7 | 
 8 |   Rivets.Util =
 9 |     bindEvent: (el, event, handler) -> jQuery(el)[bindMethod] event, handler
10 |     unbindEvent: (el, event, handler) -> jQuery(el)[unbindMethod] event, handler
11 |     getInputValue: (el) ->
12 |       $el = jQuery el
13 | 
14 |       if $el.attr('type') is 'checkbox' then $el.is ':checked'
15 |       else do $el.val
16 | else
17 |   Rivets.Util =
18 |     bindEvent: do ->
19 |       if 'addEventListener' of window then return (el, event, handler) ->
20 |         el.addEventListener event, handler, false
21 | 
22 |       (el, event, handler) -> el.attachEvent 'on' + event, handler
23 |     unbindEvent: do ->
24 |       if 'removeEventListener' of window then return (el, event, handler) ->
25 |         el.removeEventListener event, handler, false
26 | 
27 |       (el, event, handler) -> el.detachEvent 'on' + event, handler
28 |     getInputValue: (el) ->
29 |       if el.type is 'checkbox' then el.checked
30 |       else if el.type is 'select-multiple' then o.value for o in el when o.selected
31 |       else el.value
32 | 


--------------------------------------------------------------------------------
/src/view.coffee:
--------------------------------------------------------------------------------
  1 | # Rivets.View
  2 | # -----------
  3 | 
  4 | # A collection of bindings built from a set of parent nodes.
  5 | class Rivets.View
  6 |   # The DOM elements and the model objects for binding are passed into the
  7 |   # constructor along with any local options that should be used throughout the
  8 |   # context of the view and it's bindings.
  9 |   constructor: (@els, @models, options = {}) ->
 10 |     @els = [@els] unless (@els.jquery or @els instanceof Array)
 11 | 
 12 |     for option in Rivets.extensions
 13 |       @[option] = {}
 14 |       @[option][k] = v for k, v of options[option] if options[option]
 15 |       @[option][k] ?= v for k, v of Rivets.public[option]
 16 | 
 17 |     for option in Rivets.options
 18 |       @[option] = options[option] ? Rivets.public[option]
 19 | 
 20 |     @build()
 21 | 
 22 |   options: =>
 23 |     options = {}
 24 | 
 25 |     for option in Rivets.extensions.concat Rivets.options
 26 |       options[option] = @[option]
 27 | 
 28 |     options
 29 | 
 30 |   # Regular expression used to match binding attributes.
 31 |   bindingRegExp: =>
 32 |     new RegExp "^#{@prefix}-"
 33 | 
 34 |   buildBinding: (binding, node, type, declaration) =>
 35 |     options = {}
 36 | 
 37 |     pipes = (pipe.trim() for pipe in declaration.match /((?:'[^']*')*(?:(?:[^\|']*(?:'[^']*')+[^\|']*)+|[^\|]+))|^$/g)
 38 |     context = (ctx.trim() for ctx in pipes.shift().split '<')
 39 |     keypath = context.shift()
 40 | 
 41 |     options.formatters = pipes
 42 | 
 43 |     if dependencies = context.shift()
 44 |       options.dependencies = dependencies.split /\s+/
 45 | 
 46 |     @bindings.push new Rivets[binding] @, node, type, keypath, options
 47 | 
 48 |   # Parses the DOM tree and builds `Rivets.Binding` instances for every matched
 49 |   # binding declaration.
 50 |   build: =>
 51 |     @bindings = []
 52 | 
 53 |     parse = (node) =>
 54 |       if node.nodeType is 3
 55 |         parser = Rivets.TextTemplateParser
 56 | 
 57 |         if delimiters = @templateDelimiters
 58 |           if (tokens = parser.parse(node.data, delimiters)).length
 59 |             unless tokens.length is 1 and tokens[0].type is parser.types.text
 60 |               for token in tokens
 61 |                 text = document.createTextNode token.value
 62 |                 node.parentNode.insertBefore text, node
 63 | 
 64 |                 if token.type is 1
 65 |                   @buildBinding 'TextBinding', text, null, token.value
 66 |               node.parentNode.removeChild node
 67 |       else if node.nodeType is 1
 68 |         block = @traverse node
 69 | 
 70 |       unless block
 71 |         parse childNode for childNode in (n for n in node.childNodes)
 72 |       return
 73 | 
 74 |     parse el for el in @els
 75 | 
 76 |     @bindings.sort (a, b) ->
 77 |       (b.binder?.priority or 0) - (a.binder?.priority or 0)
 78 | 
 79 |     return
 80 | 
 81 |   traverse: (node) =>
 82 |     bindingRegExp = @bindingRegExp()
 83 |     block = node.nodeName is 'SCRIPT' or node.nodeName is 'STYLE'
 84 | 
 85 |     for attribute in node.attributes
 86 |       if bindingRegExp.test attribute.name
 87 |         type = attribute.name.replace bindingRegExp, ''
 88 | 
 89 |         unless binder = @binders[type]
 90 |           for identifier, value of @binders
 91 |             if identifier isnt '*' and identifier.indexOf('*') isnt -1
 92 |               regexp = new RegExp "^#{identifier.replace(/\*/g, '.+')}$"
 93 |               if regexp.test type
 94 |                 binder = value
 95 | 
 96 |         binder or= @binders['*']
 97 | 
 98 |         if binder.block
 99 |           block = true
100 |           attributes = [attribute]
101 | 
102 |     for attribute in attributes or node.attributes
103 |       if bindingRegExp.test attribute.name
104 |         type = attribute.name.replace bindingRegExp, ''
105 |         @buildBinding 'Binding', node, type, attribute.value
106 | 
107 |     unless block
108 |       type = node.nodeName.toLowerCase()
109 | 
110 |       if @components[type] and not node._bound
111 |         @bindings.push new Rivets.ComponentBinding @, node, type
112 |         block = true
113 | 
114 |     block
115 | 
116 |   # Returns an array of bindings where the supplied function evaluates to true.
117 |   select: (fn) =>
118 |     binding for binding in @bindings when fn binding
119 | 
120 |   # Binds all of the current bindings for this view.
121 |   bind: =>
122 |     binding.bind() for binding in @bindings
123 |     return
124 | 
125 |   # Unbinds all of the current bindings for this view.
126 |   unbind: =>
127 |     binding.unbind() for binding in @bindings
128 |     return
129 | 
130 |   # Syncs up the view with the model by running the routines on all bindings.
131 |   sync: =>
132 |     binding.sync?() for binding in @bindings
133 |     return
134 | 
135 |   # Publishes the input values from the view back to the model (reverse sync).
136 |   publish: =>
137 |     binding.publish() for binding in @select (b) -> b.binder?.publishes
138 |     return
139 | 
140 |   # Updates the view's models along with any affected bindings.
141 |   update: (models = {}) =>
142 |     @models[key] = model for key, model of models
143 |     binding.update? models for binding in @bindings
144 |     return
145 | 


--------------------------------------------------------------------------------