Adding notes; fixing documentation production.
This commit is contained in:
parent
137e788261
commit
08a5111d00
18
Makefile
18
Makefile
|
@ -62,16 +62,22 @@ htdocs/store.js: htdocs work/store.coffee
|
||||||
work/store.coffee: work src/backbonestore.nw
|
work/store.coffee: work src/backbonestore.nw
|
||||||
$(NOTANGLE) -c -Rstore.coffee src/backbonestore.nw > work/store.coffee
|
$(NOTANGLE) -c -Rstore.coffee src/backbonestore.nw > work/store.coffee
|
||||||
|
|
||||||
.nw.tex:
|
docs/backbonestore.tex: docs src/backbonestore.nw
|
||||||
$(NOWEAVE) -x -delay $*.nw > $*.tex
|
${NOWEAVE} -x -delay src/backbonestore.nw > docs/backbonestore.tex
|
||||||
|
|
||||||
.tex.pdf:
|
docs/backbonestore.pdf: docs/backbonestore.tex
|
||||||
xelatex $*.tex; \
|
xelatex docs/backbonestore.tex; \
|
||||||
while grep -s 'Rerun to get cross-references right' $*.log; \
|
while grep -s 'Rerun to get cross-references right' docs/backbonestore.log; \
|
||||||
do \
|
do \
|
||||||
xelatex *$.tex; \
|
xelatex docs/backbonestore.tex; \
|
||||||
done
|
done
|
||||||
|
|
||||||
|
pdf: docs/backbonestore.pdf
|
||||||
|
|
||||||
|
docs/backbonestore.html: docs src/backbonestore.nw
|
||||||
|
${NOWEAVE} -html -x -delay src/backbonestore.nw > docs/backbonestore.html
|
||||||
|
|
||||||
|
|
||||||
clean:
|
clean:
|
||||||
- rm -f htdocs/*.* docs/*.tex docs/*.dvi docs/*.aux docs/*.toc docs/*.log docs/*.out
|
- rm -f htdocs/*.* docs/*.tex docs/*.dvi docs/*.aux docs/*.toc docs/*.log docs/*.out
|
||||||
- rm -fr ./work
|
- rm -fr ./work
|
||||||
|
|
|
@ -403,7 +403,19 @@ our purposes and it means we don't have to import another library. It
|
||||||
vaguely resembles ERB from Rails, so if you are familiar with that,
|
vaguely resembles ERB from Rails, so if you are familiar with that,
|
||||||
you should understand this fairly easily.
|
you should understand this fairly easily.
|
||||||
|
|
||||||
And here is the HAML:
|
There are many different ways of providing templates to Backbone. The
|
||||||
|
most common, especially for small templates, is to just include it as an
|
||||||
|
inline string inside the View. The \textit{least} common, I'm afraid,
|
||||||
|
is the one I'm doing here: using the \<script\> tag with an unusual mime
|
||||||
|
type to include it with the rest of the HTML. I like this method
|
||||||
|
because it means all of my HTML is in one place.
|
||||||
|
|
||||||
|
For much larger programs, those that use features such as
|
||||||
|
\nwanchorto{http://requirejs.org/}{Require.js}, a common technique is to
|
||||||
|
keep the HTML template fragment in its own file and to import it using
|
||||||
|
Require's ``text'' plugin.
|
||||||
|
|
||||||
|
Here is the HAML for our home page's template:
|
||||||
|
|
||||||
<<product list template>>=
|
<<product list template>>=
|
||||||
%script#store_index_template(type="text/x-underscore-tmplate")
|
%script#store_index_template(type="text/x-underscore-tmplate")
|
||||||
|
@ -431,7 +443,7 @@ again.
|
||||||
|
|
||||||
The only trickiness here is twofold: the means by which one calls the
|
The only trickiness here is twofold: the means by which one calls the
|
||||||
method of a parent class from a child class via Backbone's class
|
method of a parent class from a child class via Backbone's class
|
||||||
heirarchy, and keeping track of the itemcollection object, so we can add
|
heirarchy, and keeping track of the ItemCollection object, so we can add
|
||||||
and change items as needed.
|
and change items as needed.
|
||||||
|
|
||||||
<<product detail view>>=
|
<<product detail view>>=
|
||||||
|
@ -477,14 +489,12 @@ cart model, which is where it belongs: \textit{knowledge about items
|
||||||
and each item's relationship to its collection belongs in the
|
and each item's relationship to its collection belongs in the
|
||||||
collection}.
|
collection}.
|
||||||
|
|
||||||
Look closely at the [[update()]] method. The reference [[@\$]] is
|
Look closely at the [[update()]] method. The reference [[@\$]] is a
|
||||||
a special Backbone object that limits selectors to objects inside the
|
special Backbone object that limits selectors to objects inside the
|
||||||
element of the view. Without it, jQuery would have found the first
|
element of the view. Without it, jQuery would have found the first
|
||||||
input field of class 'uqf' in the DOM, not the one for this specific
|
input field of class 'uqf' in the DOM, not the one for this specific
|
||||||
view. [[@\$('.uqf')]] is shorthand for [[$('uqf', @el)]], and
|
view. [[@\$('.uqf')]] is shorthand for [[$('uqf', @el)]], and helps
|
||||||
helps clarify what it is you're looking for.
|
clarify what it is you're looking for.
|
||||||
|
|
||||||
%'
|
|
||||||
|
|
||||||
<<product detail view>>=
|
<<product detail view>>=
|
||||||
update: (e) ->
|
update: (e) ->
|
||||||
|
@ -495,7 +505,6 @@ helps clarify what it is you're looking for.
|
||||||
@update(e) if e.keyCode == 13
|
@update(e) if e.keyCode == 13
|
||||||
|
|
||||||
@
|
@
|
||||||
%$
|
|
||||||
|
|
||||||
The render is straightforward:
|
The render is straightforward:
|
||||||
|
|
||||||
|
@ -660,7 +669,6 @@ showing the index:
|
||||||
$.when(@hideAllViews()).then(() -> view.show())
|
$.when(@hideAllViews()).then(() -> view.show())
|
||||||
|
|
||||||
@
|
@
|
||||||
%$
|
|
||||||
|
|
||||||
On the other hand, showing the product detail page is a bit trickier.
|
On the other hand, showing the product detail page is a bit trickier.
|
||||||
In order to avoid re-rendering all the time, I am going to create a
|
In order to avoid re-rendering all the time, I am going to create a
|
||||||
|
|
Loading…
Reference in New Issue