Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update doc for 0.9.2. Fix a small bug due to doctype declaration depr… #660

Merged
merged 4 commits into from
Aug 10, 2016
Merged

Update doc for 0.9.2. Fix a small bug due to doctype declaration depr… #660

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
2bc0b0b
Update doc for 0.9.2. Fix a small bug due to doctype declaration depr…
Aug 9, 2016
7d282c8
Change ko to wrong
Aug 10, 2016
d1a2670
Typo
jccazeaux Aug 10, 2016
d124b63
Typo
jccazeaux Aug 10, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion _harp/_layout.jade
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
!!!
doctype

html
head
Expand Down
4 changes: 2 additions & 2 deletions _harp/docs/guide/_sections/binders/api.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ This function will get called for this binding on `view.unbind()`. Use it to res

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.

### binder.getValue
#### binder.getValue
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

#### binder.publishes
Expand All @@ -19,4 +19,4 @@ Set this to true if you want view.publish() to call publish on these bindings.

#### binder.block

Blocks the current node and child nodes from being parsed (used for iteration binding as well as the if/unless binders).
Blocks the current node and child nodes from being parsed (used for iteration binding as well as the if/unless binders).
2 changes: 1 addition & 1 deletion _harp/docs/guide/_sections/components.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ To use the component inside of a template, simply use an element with the same t

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.

Additionally, if you want certain attributes to be static instead of an observed keypath, you can list them out on the `static` property fo your components.
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.

```javascript
rivets.components['todo-item'] = {
Expand Down
9 changes: 9 additions & 0 deletions _harp/docs/guide/_sections/computed-properties.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,12 @@ Computed properties are functions that get re-evaluated when one or more depende
```

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`.

The `<` notation must only be used directly after the function and before any formatter.

```html
<!-- Wrong -->
<span rv-text="event.duration | anyFormatter < start end">Wrong</span>
<!-- OK -->
<span rv-text="event.duration < start end | myFormatter">OK</span>
```
4 changes: 2 additions & 2 deletions _harp/index.jade
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@ section.intro
.col.col-sm-12
p.blurb Lightweight and powerful data binding + templating solution for building modern web applications.

a.btn.btn-clear(href="https://raw.githubusercontent.com/mikeric/rivets/v0.9.1/dist/rivets.bundled.min.js")
a.btn.btn-clear(href="https://raw.githubusercontent.com/mikeric/rivets/v0.9.2/dist/rivets.bundled.min.js")
i &#128229;
span Download 0.9.1
span Download 0.9.2

p 6.2kb minified and gzipped (includes dependencies)

Expand Down
12 changes: 9 additions & 3 deletions docs/guide/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<html><head><title>Rivets.js — Lightweight and powerful data binding + templating solution for building modern web applications</title><link rel="stylesheet" href="/css/bootstrap.css"/><link rel="stylesheet" href="/css/type.css"/><link rel="stylesheet" href="/css/screen.css"/><link rel="stylesheet" href="/css/syntax.css"/><link rel="stylesheet" href="/css/responsive.css"/><script src="/js/jquery.js"></script><script src="/js/bootstrap.min.js"></script><script src="/js/highlight.js"></script><script src="/js/app.js"></script><meta name="viewport" content="width=device-width, initial-scale=1.0"/><script type="text/javascript">hljs.initHighlightingOnLoad();
<!DOCTYPE html><html><head><title>Rivets.js — Lightweight and powerful data binding + templating solution for building modern web applications</title><link rel="stylesheet" href="/css/bootstrap.css"><link rel="stylesheet" href="/css/type.css"><link rel="stylesheet" href="/css/screen.css"><link rel="stylesheet" href="/css/syntax.css"><link rel="stylesheet" href="/css/responsive.css"><script src="/js/jquery.js"></script><script src="/js/bootstrap.min.js"></script><script src="/js/highlight.js"></script><script src="/js/app.js"></script><meta name="viewport" content="width=device-width, initial-scale=1.0"><script type="text/javascript">hljs.initHighlightingOnLoad();

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-6079274-2']);
Expand Down Expand Up @@ -180,8 +180,8 @@ <h2 id="components">Components</h2><p>Components let you define reusable views t
<p>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.</p>
<pre><code>user.address:city
</code></pre><p>The above keypath will use the <code>.</code> adapter to access the <code>address</code> key on the <code>user</code> object, and the <code>:</code> adapter to access the <code>city</code> key on the <code>address</code> object. If you can imagine for a second that <code>address</code> is just a normal property on the user object pointing to a Backbone model, but <code>city</code> is actually an attribute on that Backbone model, you can see how this kind of notation is actually very succint and expressive.</p>
<h3 id="adapters-default">The built-in adapter</h3><p>Rivets.js ships with a <code>.</code> adapter for subscribing to properties on plain JavaScript objects. The adapter is self-implemented using ES5 natives such as <code>Object.defineProperty</code>. In the future, this adapter will be implemented purely using <code>Object.observe</code> as soon as browser support permits.</p>
<p>If you need to support non-ES5 browsers (&lt; IE 9), you can replace this adapter to use polyfills or with a third-party library that has the browser support you need. If you&#39;re only targetting Chrome Canary, feel free to replace it with an <code>Object.observe</code> adapter now and enter data binding bliss.</p>
<h3 id="adapters-default">The built-in adapter</h3><p>Rivets.js ships with a <code>.</code> adapter for subscribing to properties on plain JavaScript objects. The adapter is self-implemented using ES5 natives such as <code>Object.defineProperty</code>.</p>
<p>If you need to support non-ES5 browsers (&lt; IE 9), you can replace this adapter to use polyfills or with a third-party library that has the browser support you need.</p>
<h3 id="adapters-creating">Creating an adapter</h3><p>Adapters are defined on <code>rivets.adapters</code> with the interface as the property name and the adapter object as the value. An adapter is just an object that responds to <code>observe</code>, <code>unobserve</code>, <code>get</code> and <code>set</code>.</p>
<p>The following <code>:</code> adapter works for Backbone.js models / Stapes.js modules.</p>
<pre><code class="language-javascript">rivets.adapters[&#39;:&#39;] = {
Expand All @@ -203,6 +203,12 @@ <h2 id="computed-properties">Computed Properties</h2><p>Computed properties are
<pre><code class="language-html">&lt;span rv-text=&quot;event.duration &lt; start end&quot;&gt;&lt;/span&gt;
</code></pre>
<p>Note that the dependency keypaths stem from the target object, not the view&#39;s model context. So for the above declaration, the target is the <code>event</code> object, with dependencies on <code>event.start</code> and <code>event.end</code>.</p>
<p>The <code>&lt;</code> notation must only be used directly after the function and before any formatter.</p>
<pre><code class="language-html">&lt;!-- Wrong --&gt;
&lt;span rv-text=&quot;event.duration | anyFormatter &lt; start end&quot;&gt;Wrong&lt;/span&gt;
&lt;!-- OK --&gt;
&lt;span rv-text=&quot;event.duration &lt; start end | myFormatter&quot;&gt;OK&lt;/span&gt;
</code></pre>
<h2 id="functions-call">Call functions</h2><p>To call a function in an expression, rivets includes a special formatter <code>call</code>. 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 <code>event.duration</code> with the two arguments <code>event.start</code> and <code>event.end</code>.</p>
<pre><code class="language-html">&lt;span rv-text=&quot;event.duration | call event.start event.end&quot;&gt;&lt;/span&gt;
</code></pre>
Expand Down
2 changes: 1 addition & 1 deletion docs/reference/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<html><head><title>Rivets.js — Lightweight and powerful data binding + templating solution for building modern web applications</title><link rel="stylesheet" href="/css/bootstrap.css"/><link rel="stylesheet" href="/css/type.css"/><link rel="stylesheet" href="/css/screen.css"/><link rel="stylesheet" href="/css/syntax.css"/><link rel="stylesheet" href="/css/responsive.css"/><script src="/js/jquery.js"></script><script src="/js/bootstrap.min.js"></script><script src="/js/highlight.js"></script><script src="/js/app.js"></script><meta name="viewport" content="width=device-width, initial-scale=1.0"/><script type="text/javascript">hljs.initHighlightingOnLoad();
<!DOCTYPE html><html><head><title>Rivets.js — Lightweight and powerful data binding + templating solution for building modern web applications</title><link rel="stylesheet" href="/css/bootstrap.css"><link rel="stylesheet" href="/css/type.css"><link rel="stylesheet" href="/css/screen.css"><link rel="stylesheet" href="/css/syntax.css"><link rel="stylesheet" href="/css/responsive.css"><script src="/js/jquery.js"></script><script src="/js/bootstrap.min.js"></script><script src="/js/highlight.js"></script><script src="/js/app.js"></script><meta name="viewport" content="width=device-width, initial-scale=1.0"><script type="text/javascript">hljs.initHighlightingOnLoad();

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-6079274-2']);
Expand Down
Loading