suzanne.soy/whalesong
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updating documentation

Browse Source
This commit is contained in:
Danny Yoo 2011-09-01 15:13:14 -04:00
parent 279ac4e2d3
commit 24a6c8a57e
2 changed files with 45 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
scribblings/cs19.scrbl
View File

@ -498,10 +498,35 @@ Get an list of the event's keys.
@section{Dynamic DOM generation with xexps}
@declare-exporting/this-package[web-world]
We often need to dynamically inject new dom nodes into an existing
view. We can create new DOMs from an @tech{xexp}, which is a
s-expression representation for a DOM node.
view. As an example where the UI is entirely in code:
@codeblock|{
#lang planet dyoo/whalesong
(require (planet dyoo/whalesong/web-world))
Here are examples of expressions that evaluate to xexps:
;; tick: world view -> world
(define (tick world view)
(add1 world))
;; draw: world view -> view
(define (draw world view)
(view-append-child view
(xexp->dom `(p "hello, can you see this? "
,(number->string world)))))
(big-bang 0 (initial-view (xexp->dom '(html (head) (body (@ (id "body"))))))
(on-tick tick 1)
(to-draw draw))
}|
Normally, we'll want to do as much of the statics as possible with
@filepath{.html} resources, but when nothing else will do, we can
generate DOM nodes programmatically.
We can create new DOMs from an @tech{xexp}, which is a s-expression
representation for a DOM node. Here are examples of expressions that
evaluate to xexps:
@racketblock["hello world"]
@ -554,6 +579,7 @@ Return a string that can be used as a DOM node id.
@section{Including external resources}
@defmodule/this-package[resource]

16
web-world/examples/tick-tock-2/tick-tock-2.rkt Normal file
View File

@ -0,0 +1,16 @@
#lang planet dyoo/whalesong
(require (planet dyoo/whalesong/web-world))
;; tick: world view -> world
(define (tick world view)
(add1 world))
;; draw: world view -> view
(define (draw world view)
(view-append-child view
(xexp->dom `(p "hello, can you see this? "
,(number->string world)))))
(big-bang 0 (initial-view (xexp->dom '(html (head) (body (@ (id "body"))))))
(on-tick tick 1)
(to-draw draw))