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

got a reasonable attr-based animation in place

Browse Source
This commit is contained in:
Danny Yoo 2011-08-25 17:05:37 -04:00
parent 9f6f35548f
commit 212d23a142
2 changed files with 35 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
web-world/examples/attr-animation/attr-animation.rkt
View File

@ -9,25 +9,38 @@
(define (tick w v)
(modulo (add1 w) 10))
(define (draw w v)
(define base (update-view-attr (view-focus v (format "#~a" w))
"class"
"selectedBlock"))
(define with-left (if (> w 0)
(view-right (update-view-attr (view-left base)
"class"
"offsetBlock"))
base))
(define with-right (if (< w 9)
(view-left (update-view-attr (view-right base)
"class"
"offsetBlock"))
with-left))
with-right)
;; pick-block: world view -> view
;; Focus the view on block i.
(define (pick-block v i)
(view-focus v (format "#~a" i)))
(define (draw w v)
(define v1 (update-view-attr
(pick-block v w)
"class"
"selectedBlock"))
(define v2 (update-view-attr
(pick-block v1 (modulo (sub1 w) 10))
"class"
"offsetBlock"))
(define v3 (update-view-attr
(pick-block v2 (modulo (add1 w) 10))
"class"
"offsetBlock"))
(define v4 (update-view-attr
(pick-block v3 (modulo (- w 2) 10))
"class"
"block"))
(define v5 (update-view-attr
(pick-block v4 (modulo (+ w 2) 10))
"class"
"block"))
v5)
(big-bang 0
(initial-view index.html)
(on-tick tick 1/2)
(on-tick tick)
(to-draw draw))

12
web-world/examples/attr-animation/style.css
View File

@ -1,20 +1,20 @@
.block {
width : 100px;
height : 100px;
width : 80px;
height : 10px;
background-color : blue;
display: inline-block;
}
.selectedBlock {
width : 100px;
height : 100px;
width : 80px;
height : 10px;
background-color: navy;
display: inline-block;
}
.offsetBlock {
width : 100px;
height : 100px;
width : 80px;
height : 10px;
background-color: teal;
display: inline-block;
}